@charset "utf-8";

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6,
pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td { 
    margin: 0; 
    padding: 0; 
}

body { font-family: "Zen Maru Gothic", "Noto Sans JP","Yu Mincho", "Hiragino Mincho ProN", "MS PMincho", serif;overflow-x:hidden; font-weight: 400; }

ul,ol,li,dl,dt,dd{list-style: none;}
fieldset,img { border: 0; vertical-align: middle; overflow: hidden; }
img{ max-width:100%;}
a{ text-decoration:none; color:inherit;}
.oph08{ transition:opacity 0.3s; }
.oph08:hover{ opacity:0.8; }


:root{
    --hf:100px;
    --bf:0.2rem;
    --maxwidth: 1280px;
}

.red_cl{ color:#d40041;}
.red_bucl{ color:#c81815;}
.pink_cl{ color:#ee9d9a;}
.blue_cl{ color:#2573a1;}
.bluein_cl{ color:#4e78aa;}
.ql_cl{ color:#02a586;}
.or_cl{ color:#be7900;}
.ye_cl{ color:#fbff00;}
.gr_cl{ color:#86b901;}

.bold{ font-weight: 700; }

.fw-ro{font-family: "Reggae One", system-ui; font-weight: 400; font-style: normal;}
.fw-nsj{font-family: "Noto Sans JP", sans-serif;font-optical-sizing: auto; font-weight: 400; font-style: normal;}
.fw-zmg{font-family: "Zen Maru Gothic", sans-serif;font-weight: 400;font-style: normal;}




.f16{ font-size: 0.16rem; line-height: 178%; }
.f18{ font-size: 0.18rem; line-height: 178%; }
.f20{ font-size: 0.2rem; line-height: 150%; }
.f24{ font-size: 0.24rem; line-height: 150%; }
.f30{ font-size: 0.3rem; line-height: 150%; }


.fts_09{ font-size: 0.9em; }
.fts_085{ font-size: 0.85em; }
.fts_08{ font-size: 0.8em; }
.fts_07{ font-size: 0.7em; }
.fts_066{ font-size: 0.66em; font-weight: 400; line-height: 180%; }

.ftb_110{ font-size: 1.1em; }
.ftb_120{ font-size: 1.2em; }
.ftb_150{ font-size: 1.5em; }
.ftb_120mds{ font-size: 1.2em; 
margin-top: 0.6em; /* 段落の上に余白を追加 */
margin-bottom: 0.6em; /* 段落の下に余白を追加 */
font-weight: 600;
}

.pd_t10{padding-top: 0.1rem;}
.pd_t20{padding-top: 0.2rem;}
.pd_t30{padding-top: 0.3rem;}
.pd_t40{padding-top: 0.4rem;}
.pd_b10{padding-bottom: 0.1rem;}
.pd_b20{padding-bottom: 0.2rem;}
.pd_b30{padding-bottom: 0.3rem;}
.pd_b40{padding-bottom: 0.4rem;}


.fws{ font-weight: 400; }
.fwb{ font-weight: bold; }

.align_center{ text-align: center; }

.inpv{ text-align: center;  }
.YoutubeWrapper{position:relative;padding-bottom:56.25%;overflow: hidden; display: inline-block; width: 750px; max-width: 100%;}
.YoutubeWrapper iframe {position:absolute;top:0;left:0;height:100%;width:100% ;}

.an_scl{ opacity: 0; }

.pc_none{display: none; }
.sp_none{display: block;}

/******************************index************************************************/
html{ font-size:var(--hf); width: 100%;overflow-x: hidden;  }

body {position: relative;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;color: #fff;background: #f0c657;word-break: break-word;overflow-wrap: break-word; font-size: var(--bf); line-height: 1.6; color: #fff;}

.warp {position: relative;padding: 0;min-height: 100vh;width: 100%;}
.header {padding-bottom:0;display: flex;flex-wrap: wrap;justify-content: center;}
.top_mob {width: var(--maxwidth);max-width: 100%;text-align: center;box-sizing: border-box; padding: 0rem 0.5rem 0.2rem 0.5rem;}
.page .top_mob{padding-bottom: 0;}
.headintop{animation: logoani 6s infinite linear; display: block; width: 9rem; max-width: 98%;margin: 0 auto; padding: 0.6rem 0 0.3rem 0.6rem; box-sizing: border-box;}
.h_tit {padding:0.3rem 0;font-size: 1.5em; line-height: 1.5;color: #ad002d;font-weight: 700;}
.h_txt {padding: 0;font-size: 0.95em;line-height: 1.67;color: #150201;font-weight: 700;}


@keyframes logoani {
    0% {transform: scale(1, 1);}
    50% {transform:scale(0.99, 0.99);}
    100% {transform: scale(1, 1);}
}




/* menu */
.menu_mob{ width: 100%; box-sizing:border-box; padding-top: 0.2rem; z-index: 300;}
.menulds{ font-size: 0.21rem; line-height: 105%;  padding: 0rem 0.2rem 0.1rem 0.2rem; box-sizing:border-box;color: #000; }
.menu_inlist{ text-align: center; }
.menu_inlist li{ display: inline-block;  }
.menu_inlist li a{ position: relative; display: block;padding: 0.15em 0.5em;background:transparent; transition:background 0.3s;}
.menu_inlist li a::after{content: "";position: absolute;top:calc(100% + 0.1em);left: 0;height: 0;background: #8b2869;width: 100%;transition: height 0.2s;transform-origin: 50% 50%;}
.menu_inlist li a:hover{}
.menu_inlist li a:hover,.menu_inlist li.sel a{ background: #8b2869; color: #e39f25; }
.menu_inlist li a:hover::after,.menu_inlist li.sel a::after{height: 0.2em;transition: height 0.2s 0.2s;}

.sccmod .menulds{ position: fixed; top: 0; left: 0; width: 100%; z-index: 100; padding:0 0.2rem;background: #000;color: #fff; }
.sccmod .menu_inlist li{}
.sccmod .menu_inlist li a{padding:0.5em 0.2rem; }


.ban_tpnsc{--lw:#f0c657;--bgs:#000;--hs:0.06rem;--ws:0.6rem;--mw:1rem; position:absolute; z-index: 351; display: none;}
.ban_tpnsc.sel{ --lw:#ba2154;}


.ban_op{ display:block;border-radius: 999px; padding:calc(var(--mw) / 2 - var(--hs) / 2) calc(var(--mw) / 2 - var(--ws) / 2); width:var(--mw);height:var(--mw); box-sizing:border-box; position:relative;border-radius: 999px;background-color: var(--bgs);  }
.ban_op::before{content: "";display: block; width:var(--ws); height:var(--hs);background: var(--lw); position:absolute; top:0.3rem; right:clac(0.5rem - var(--ws) / 2);transition:all 0.3s;transform-origin: 0 100%; border-radius: 10em; }
.ban_op::after{ content: ""; display: block; width:var(--ws); height:var(--hs);background: var(--lw); position:absolute; bottom:0.3rem; right:clac(0.5rem - var(--ws) / 2);transition:all 0.3s; transform-origin: 0 0;border-radius: 10em; }
.ban_op span{ display:block;width:var(--ws);  height:var(--hs); background: var(--lw);transition:all 0.3s; border-radius: 10em; }

 
.sel .ban_op::before{transform: rotate(45deg) ;transform-origin: 50% 50%;
    top:calc(var(--mw) / 2 - var(--hs) / 2);}
.sel .ban_op::after{transform: rotate(-45deg) ; transform-origin: 50% 50%;
    bottom:auto;top:calc(var(--mw) / 2 - var(--hs) / 2)}
.sel .ban_op span{ opacity:0;}
.js_scr{ position: relative;top:-0.4rem; }

/* menu */

.ytbmob{ width: 600px; margin: 0.4rem auto; max-width: 100%; }
.inner_ytbp{ width: 100%; position: relative; padding-bottom: 56.25%; }
.inner_ytbp iframe{ position: absolute; top: 0;left:0;width:100%; height: 100%; }

.main{ width:var(--maxwidth); max-width: 96%; box-sizing:border-box; margin:0.4rem auto 0 auto;  position: relative;z-index: 8; line-height: 170%; background: #000; border-radius: 0.42rem;}
.main::before{--ls: 0.25rem;--lf: -0.25rem; content: "";width:calc(100% + 2 * var(--ls));height: 7.6rem; position: absolute; top: var(--lf);left: var(--lf); pointer-events: none; background: url("../images/line.svg") 0 0 no-repeat; background-size: 100% auto; }





.innermob{  padding:0 0 0.5rem 0; text-align:center; width: 960px; max-width: 88%;margin: 0 auto;}
.inner_mbs{ padding: 0.4rem; margin-bottom: 0.3rem; }
.inct{}
.inct.m01{line-height:200%;padding-top: 0;}
.m02{ text-align: left; }

.pgae_tit{ font-size: 1.2em; line-height: 1.2;padding:0.5rem 0 0.8rem 0; color: #f0c657; background: #000 url('../images/title_bg.svg') center bottom no-repeat; background-size: 100% auto; border-radius: 0.42rem 0.42rem 0 0; text-align: center; position: relative; overflow: hidden;}
.pgae_tit::before{content: ""; position: absolute;top: 0; left: 0; z-index: 0; display: block; width: 100%; height: 70%; background: #383635;}
    .titipos{ position: relative; z-index: 10; }

.cn_t01{ color: #e39f25; font-size:1.8em; padding: 0.5rem 0 0.4rem 0;}
.cn_dre{ font-size: 1.5em; line-height: 160%; padding: 0.2em 0.5em; display: inline-block; margin-bottom: 0.3em; text-align: center; letter-spacing: 0.5em; color: #fff; }
.cn_dre02{ font-size: 1.3em; line-height: 160%; padding: 0.2em 0.5em; margin-bottom: 0.3em; text-align: center;color: #fff; }
.line{height: 1px;background-color: #ba2154;}
.infomob_tm{padding: 2em 0; margin-bottom: 2em;}
.infomob_tmin{padding:2em 1.5em 1.5em 1.5em; border:0.02rem solid #fff; position: relative;margin-top: 3.5em; line-height: 2.2; border-radius: 0.18rem;}
.time_tis{ font-size:1.5em; line-height: 1; position: absolute; top: 0;left:50%; transform: translate(-50%,-50%); padding: 0.1em 1em; background-color: #000;}


.livebanner{ width: 1000px; max-width:100%; margin: 0 auto; text-align: center; padding: 0.1rem 0 0.3rem 0; }
.livebanner a:hover{ opacity: 0.8}
.innermob a{ color: #c3208b; }
.innermob a:hover{ color: #ff8484;text-decoration: underline;  }
.innermob a.uptlink{ font-size: 1.2em; color: #f00; font-weight: 700;text-decoration: underline; }
.innermob a.uptlink:hover{ color: #a2850f;text-decoration: none; }

.stitle{ padding: 0.6em 0 0.3em 0; font-size: 1.3em; line-height: 110%; color:#fff; }
.titlefn{ padding: 0.2em 0.5em; background-color: #7b4b4b; color: #fff; display: inline-block; line-height: 120%; font-weight: bold;}
.bntit{  position: relative; font-size: 2em; color: #e39f25; display: flex;align-items: center;justify-content: center; line-height: 100%;  margin:0.8rem 0% 0 0%;font-family: "Reggae One", system-ui;font-weight: 400;font-style: normal;letter-spacing: 0.2em; z-index: 10;}
.bntit::before,.bntit::after{content: ""; display: inline-block; width:1.3em; height: 0.4em; margin:0 0.5em 0 0.4em; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='52px' height='15px' viewBox='0 0 52 15'%3E%3Cpath fill-rule='evenodd' fill='rgb(139, 40, 105)' d='M25.928,-0.003 C40.248,-0.003 51.856,7.498 51.856,7.498 C51.856,7.498 40.248,14.1000 25.928,14.1000 C11.608,14.1000 0.000,7.498 0.000,7.498 C0.000,7.498 11.608,-0.003 25.928,-0.003 Z'/%3E%3C/svg%3E");background-repeat: no-repeat;  background-position: center; background-size: 100%;animation: eyescp 6s infinite linear;}
.bntit .bnt_nt{display: inline-block; padding: 0.45em 0 0.54em 0;}

@keyframes eyescp {
    0% {transform: scale(1, 1);}
    5% {transform:scale(1, 0.8);}
    10% {transform:scale(1, 1);}
    15% {transform:scale(1, 0.8);}
    20% {transform:scale(1, 1);}
    100% {transform: scale(1, 1);}
}


.allsmft{ font-size:0.75em; line-height: 140%;  }
.lt01 {font-size: 0.9em;padding-left: 1em;text-indent: -1em;line-height: 1.5;margin-bottom: 0.4em;}
.lt02 {font-size: 0.85em;padding-left: 1em;text-indent: -1em;line-height: 1.5;margin-bottom: 0.2em;}

.innermob .ic_mf{ display:inline-block; padding:5px 15px; font-size:19px;font-size:0.19rem; line-height:100%; color:#FFF; background:#aa2853; border-radius:6px; font-weight:400; margin:0 5px; text-decoration:none;}
.innermob .ic_mf02{ display:inline-block; line-height:100%;font-size: 0.26rem; padding:0.3em 1.4em; color:#FFF; background:#c81815; border-radius:6px; font-weight:600; margin:0 5px; text-decoration:none; transition:all 0.3s;}
.innermob .ic_mf:hover{ opacity:0.8; text-decoration:none; color: #fff;}
.innermob .ic_mf02:hover{background-color: #ff2521;color: #fbff00;}

.ban_links{ display: inline-block; background-color:#c81812; border-radius:999px;transition:all 0.3s;}
.ban_links:hover{ background-color:#ff4d47;}

.txwc{ display: inline-block; width:calc(50% - 1em); text-align: right; }


.texinli{font-size: 0.9em;line-height: 160%; font-weight: 400;}
.texinli li{margin-left: 1em; list-style: '・';}
.texinli02{font-size: 0.9em; line-height: 160%; font-weight: 400;}
.texinli02 li{margin-left: 1em; list-style: '※';}
.texinli01 li{margin-left: 1em; list-style: '◆';}
ul li.nostyle{margin-left:0; padding-left: 1em; text-indent: -1em; list-style: none;}


/* Character */
.character_text{font-size: 1.1em;line-height:1.8;}
.character_list{ background-color:#000; display: flex; flex-wrap:wrap;  }
.character_list dl{width: 50%; padding: 1%; box-sizing: border-box; }
.character_list dl img{ text-align: center; border:1px solid #986b00;  }
/* Character */


/*goods*/
.goods{padding:0.6rem 0.6rem;}
.goods_list{ padding: 2.5%; background-color:#000; display: flex; flex-wrap:wrap;  }
.goods_list dl{ float: left; width: 48%; padding: 1%; }
.goods_list dl dt{ text-align: center; }
.goods_list dl dt a{cursor: context-menu;}
.goods_list dl dt img{ text-align: center; border:1px solid #986b00;  }
.goods_list dl dd{ padding: 10px 5px;font-size:0.2rem;  line-height: 150%;text-align: center;}
.goods_new{ display: inline-block; padding: 5px 15px; color: #fff;  line-height: 100%; margin: 5px;   }
.goods_name{ font-weight: 700; }
.goods_price{color: #ff9090;}
.goods_info{ text-align: left; font-weight: 400; font-size: 15px;font-size: 0.15rem;line-height: 140%;}
/* .sen2 {background-image: url(../images/line.png);background-repeat: repeat-x;width: 100%;height: 5px;margin-top: 5px;margin-bottom: 5px;} */
.goods_txin01{ padding-left: 1em; text-indent: -1em; display: block; }
.goods_txin02{ padding-left: 2em; text-indent: -2em; display: block; }
.goods_txin03{ padding-left: 3em; text-indent: -3em; display: block; }
.goods_txin04{ padding-left: 4em; text-indent: -4em; display: block; }
.goods_txin05{ padding-left: 5em; text-indent: -5em; display: block; }
.glslide{overflow:hidden; position: relative;}
/* .glslide::before{content: " "; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 30; background: url("../images/hand_icon.png") center center no-repeat; background-size: 30% auto; opacity: 0.5; pointer-events: none; transition: opacity 0.3s; }
.glslide:hover::before{ opacity: 0; } */
.glsprev{ position: absolute; top:calc(50% - 0.15rem); left:-0.2rem; border: 0.15rem solid transparent; border-left-width: 0.3rem;border-right:0.3rem solid #036eb8; opacity: 0.8; z-index: 30; transition: opacity 0.3s; cursor: pointer; }
.glsnext{ position: absolute; top:calc(50% - 0.15rem); right:-0.2rem; border: 0.15rem solid transparent; border-right-width: 0.3rem;border-left:0.3rem solid #036eb8; opacity: 0.8; z-index: 30; transition: opacity 0.3s;cursor: pointer;}
.glsprev:hover,.glsnext:hover{opacity: 1;}
/*goods*/
.con-txin{ font-size: 0.16rem; line-height: 150%; }

.ban_ne{ margin: 0.3rem 0 0 0; }

.back_footer {font-size:0.7em;line-height: 1.5em;padding:0.45rem 0;text-align:center; position:relative; z-index:20; width: 100%; }
.back_footer h3{font-weight: normal;font-style: normal;margin-bottom: 0px;font-size: 100%;}

#page-top {position: fixed;bottom:1.6rem;right:0.2rem; z-index:30; display: none;width: 0.75rem; }


.fadeIn{ animation: fadeIn 1s both; }
@keyframes fadeIn {
  0%{opacity: 0;}
  100%{opacity: 1;}

}
.fadeUp{ animation: fadeUp 1s both; }
@keyframes fadeUp {
  0%{ transform: translateY(0.5rem); opacity: 0;}
  100%{transform: translateY(0); opacity: 1;}

}


@media screen and (max-width: 1100px){
    :root{
        --hf:9.1vw;
    }

}

@media screen and (max-width: 750px){
    :root{
        --hf:13.33vw;
        --bf:0.22rem;
    }


    /*body{ font-size: 0.2rem;  width: 100%; overflow-x: hidden;  }*/
    .pc_none{display: block; }
    .sp_none{display: none;}

    .header{ position: relative; width:100%; height: auto; padding:0;background-size: 130% auto; }
    .top_mob{padding:0.5rem 0 0 0;}
    .headintop{}
    .h_tit{font-size: 0.3rem;}
    .h_txt{ font-size: 0.22rem;}



    /* menu */
    .menu_mob{height:0!important; padding: 0;}
    .menulds{ position: fixed; top: 0; left: 0; width: 100%; height: 100dvh; z-index: 100;font-size:1.8em;line-height: 110%;background:#000; display: none; color: #fff;}
    .menu_inlist{padding:0.8rem 0.2rem 0.4rem 0.2rem; display:flex; flex-wrap:wrap;flex-direction: column;align-items: center; }
    .menu_inlist li{ margin-bottom: 0.7em;}
    .menu_inlist li a{padding: 0.5em 1em;}
    .sccmod .menu_inlist li a{padding: 0.5em 1em;}
    /* .ban_tpnsc{ position: absolute; bottom: 0.6rem; left:calc(50% - var(--mw) / 2); display: block;} */
    .ban_tpnsc{ position:fixed; bottom:auto; top:0.3rem;right: 0.3rem;display: block;}
    .sccmod .ban_tpnsc{--lw:#000;--bgs:#f0c657;}
    .ban_tpnsc.sel,.sccmod .ban_tpnsc.sel{position:fixed; bottom:auto; top:6.5rem;left: calc(50% - var(--mw) / 2);}

    .js_scr{position: relative;top:0.2rem; }

    /* menu */


    .main{margin: 0.5rem 0 0 0; min-height:auto;max-width: 100%; border-radius: 0; background-size: 160% auto;}
    .main::before{display: none;}

    .m01{ text-align: center; }

    .infomob_tmin{ padding:2em 1.5em 1.5em 1.5em; }
    .time_tis{ width:12em; box-sizing:border-box; }

    .inct{ border:none;  border-top: 0; background: rgba(0, 0, 0, 0.6);}
    .inct.m01{line-height:200%;}
    .pgae_tit{font-size: 1.4em; line-height: 1.6; border-radius: 0;}
    .bntit{font-size: 1.8em;}
    .cn_t01{font-size: 1.6em;}

    .infomob_tm{padding: 0.25rem; width:100vw; margin-left: -0.25rem;}

    /* Character */
    .character_text{font-size:0.85em;}
    .character_list{ padding: 2.5%; background-color:#000; display: flex; flex-wrap:wrap;  }
    .character_list dl{width: 100%; padding: 0% 0 0.4rem 0; }
    /* Character */


    /*goods*/
    .goods{padding:0.4rem 0.3rem;}
    .goods_list{   }
    .goods_list dl{ float:none; width: 96%; padding: 2%; overflow: hidden; }
    .goods_list dl dt{ float: left; width: 28%; padding-right:2%; }
    .goods_list dl dt a{cursor: pointer;}
    .goods_list dl dd{ float: left; width: 70%; text-align: left; padding:0; font-size: 0.26rem;}
    /*goods*/


    .livetable{font-size: 0.22rem; }
    .back_footer {font-size:0.14rem;line-height: 1.5em;position: static;}

    #page-top {position: fixed;bottom:1.6rem;right:0.1rem; z-index:30; display: none;width: 0.7rem; }


}