@charset "utf-8";

.sample_box{display: flex; aspect-ratio:4/3;align-items: center;justify-content: center; background-color: #9a9a9a;margin: 1em 0;}

.sign_box{display: flex;flex-direction: column;background-color:#fff;padding:0 1.25em 0.5em; border-radius:0.5em;margin-top: 1em;}
.sign_box .sign_ttl{background-color:var(--color-pink); color:#fff;width:fit-content;margin: auto;padding:0.25em 1em;border-radius:2em;margin-top:-1em;}
.sign_box .sign_oline{padding:0.5em 0 1em;display: flex;flex-direction: column;gap:0.5em;color: var(--color-black);}
.sign_box .sign_oline li{line-height:1.2;font-size:90%;}

/**sect_fview**/
#sect_fview{--FvBot:70px; padding:0;height:calc(100vh - 44px);max-height: 1400px;background-color:var(--color-navy);}

#sect_fview [class*="wth_"]{position: relative; }
#sect_fview [class*="wth_"]:after{}
#sect_fview [class*="wth_"] .fview_logo{position: absolute;bottom: -1px;width: 100%;}
#sect_fview [class*="wth_"] .fview_logo>img{width:101%;}
#sect_fview [class*="wth_"] .fview_logo .fview_ttl{ background-color: #fff;padding-bottom:1.25rem;margin-top: -20px;}
#sect_fview [class*="wth_"] .fview_logo .fview_ttl img{ width:75%;margin: auto;margin-top: -1px;}
#sect_fview [class*="wth_"] .fview_logo .fview_ttl .fview_at{font-size:95%; background-color:var(--color-black);border-radius: 4em;color: #fff;width: fit-content;padding: 0.4em 1.25em 0.5em;margin: auto;letter-spacing: 0.1em;margin-top:0.3rem;line-height: 1;}


/**fview slick**/
#sect_fview [class*="_SlDes"]{margin-bottom: 0!important;}
#sect_fview [class*="_SlDes"] .slick-slide{height:calc(100vh - 44px);min-height:600px;max-height:1400px;}
#sect_fview [class*="_SlDes"] .slick-slide img{object-fit: cover;width:100%;height: 100%;}
#sect_fview [class*="_SlDes"] .uniq-dots{top:auto;bottom: 260px;flex-direction: column;width:fit-content;align-items: flex-end;right: 1rem;}

#sect_fview [class*="_SlDes"] .uniq-dots li{}
#sect_fview [class*="_SlDes"] .uniq-dots li button{background:var(--color-black);border-radius: 50%;}
#sect_fview [class*="_SlDes"] .uniq-dots li.slick-active button{background:var(--color-pink)!important;}

/**sect_location**/
#sect_location{background-image: linear-gradient(135deg, rgb(5 114 134) 30%, rgb(48 66 170) 100%);padding-bottom: 2rem;background-color: var(--color-green);overflow: hidden;position: relative;}
#sect_location:before {content: ""; width: 150%; height: 5rem; display: block; background-color: var(--color-pink); position: absolute; left: 0%; transform: rotate(8deg); top: -4.5rem;}
#sect_location ul.location_ul{display: flex;flex-direction: column;row-gap:2rem;}
#sect_location ul.location_ul li{display: flex;flex-direction: column;}
#sect_location ul.location_ul li .location_item{display: flex;align-items: center;}
#sect_location ul.location_ul li .location_item h2{letter-spacing: 0.1em;white-space: nowrap;border-radius:2rem;background-color: var(--color-black);color:#fff;text-align: center;padding: 0.5rem 1.5rem 0.65rem 1.5rem;line-height: 1;}
#sect_location ul.location_ul li .location_item:after{content:""; width:100%;display: block;height:2px;background-color:var(--color-black); }
#sect_location ul.location_ul li p{display: block;color: #fff;padding: 0.75rem;}


/**sect_about**/
#sect_about{background-color: var(--color-black);color:#fff;/*background-color: #1d022396;*/}
#sect_about .about_mid{overflow:hidden;position: relative;padding-bottom: 4rem; line-height: 1.3; /*background-repeat: no-repeat; background-image: url(../img/haniEve_T01.svg); background-position: right -5px bottom;*/background-size: 75% auto;}
#sect_about .about_mid:before {content: ""; width: 150%; height: 6rem; display: block; background-color: var(--color-pink); position: absolute; left: 40%; transform: rotate(348deg); bottom: -3rem;}
#sect_about .about_mid strong{line-height:1.3;display: block;font-size: 125%;padding-bottom: .75rem; margin-top: .75em;}
#sect_about .about_mid em{background-color: #fff; color:var(--color-black);padding: 0 0.75em 0.1em;display: block;border-radius:30px; font-size: 85%;margin-bottom:1em;}
#sect_about .about_movie{}
#sect_about .about_movie video {width: 100%;height: auto;max-width: initial;display: block;}
#sect_about .about_movie #volswitch{right: 10px; bottom: 10px;}

#sect_about .about_img{}
#sect_about .about_img img{width: 100%;}
#sect_about .about_txt{display: block; padding-top:3rem;position: relative;overflow: hidden;}
#sect_about .about_txt:before {content: ""; width: 150%; height: 6rem; display: block; background-color: var(--color-pink); position: absolute; right: 40%; transform: rotate(-12deg); top: -3rem;}
#sect_about .term_all{font-size:var(--font-L);line-height: 1.2;text-align: center;padding-top:2em;padding-bottom:.75em;}
#sect_about .term_all small{font-size:75%;margin-left:0.1em; margin-right:0.1em }
#sect_about .term_ul{display: flex;flex-direction: column;gap:0.75rem;}
#sect_about .term_ul li.about_term{border-radius:2em;display: flex;overflow: hidden;}
#sect_about .term_ul li.about_term>*{line-height: 1.2;}
#sect_about .term_ul li.about_term .term_name{padding:0.5em 1em 0.5em 1.25em;font-size: 80%;white-space: nowrap;background-color: var(--color-pink);display: flex;align-items: center;}
#sect_about .term_ul li.about_term .term_cont{padding:0.5em 1em 0.5em .75em;background-color: #fff; color: var(--color-black);flex:1; font-size:var(--font-Mx);}
#sect_about .term_ul li.about_term .term_cont small{font-size:80%;}

/**#sect_about .term_ul li.about_term:first-child{margin-bottom: 1rem;}
#sect_about .term_ul li.about_term:first-child .term_name{background-color: var(--color-green);}**/

/**#sect_goods**/
#sect_goods{padding-top: 7rem;/*background-blend-mode: overlay;*/background-color:#fff;}
#sect_goods{--BgMarg:1200px;
	background-image:
	url(../img/haniEve_BG02_01.webp),
	url(../img/haniEve_BG02_02.webp),
	url(../img/haniEve_BG02_03.webp),
	url(../img/haniEve_BG02_04.webp),
	url(../img/haniEve_BG02_05.webp),
	url(../img/haniEve_BG02_06.webp),
	url(../img/haniEve_BG02_07.webp),
	url(../img/haniEve_BG02_08.webp),
	url(../img/haniEve_BG02_09.webp);
	
	background-position: 
    left 3rem,
    left calc(var(--BgMarg)*1),
    left calc(var(--BgMarg)*2),
    left calc(var(--BgMarg)*3),
    left calc(var(--BgMarg)*4),
    left calc(var(--BgMarg)*5),
	left calc(var(--BgMarg)*6),
	left calc(var(--BgMarg)*7),
	left calc(var(--BgMarg)*8);
	
	background-repeat: no-repeat;
	background-size: 100% auto;
}


#sect_goods .goods_area>*{background-color: #fff;border-radius: 0.5em;box-shadow:0px 0px 30px #4a2eab;overflow: hidden;}
#sect_goods .goods_area>*:nth-child(2n){box-shadow:0px 0px 30px #ab2e90;}
#sect_goods .goods_box + .goods_box{margin-top:3em;}
#sect_goods .goods_name{font-size: var(--font-Mx);padding: 0.5em 1em;color: #fff;background-color: var(--color-black);line-height: 1.4;}
#sect_goods .goods_name small{font-size:75%;margin-left:0.5em;}
#sect_goods .goods_ul{padding: 1em; }
#sect_goods .goods_ul[class*="col_"]>*{padding-bottom:1em;}
#sect_goods .goods_ul[class*="col_"]>* figure figcaption{line-height: 1.4;}
#sect_goods .goods_ul[class*="col_"]>* figure figcaption small{font-size:75%;margin: 0 0.3em;}
#sect_goods .goods_ul[class*="col_"]>* figure .noimage{aspect-ratio: 1 / 1;}
#sect_goods .goods_price{width: calc(100% - 2em);margin: auto;border-top: 1px solid var(--color-black);line-height: 1;padding: 0.75em 0.75em 1.5em;}
#sect_goods .goods_price .price_num{font-size: 150%;display: inline-block;padding:0 0.2em 0 0.4em;line-height: 1;}

/**sect_chara**/
#sect_chara{background-image: linear-gradient(90deg, rgb(5 114 134) 30%, rgb(48 66 170) 100%);padding-bottom:2rem;}
#sect_chara [class*="mid_L"]{color: #fff;}
#sect_chara .chara_box{display: flex; flex-direction: column;gap:4rem;padding-top:2rem;}
#sect_chara .chara_box li{background-color: #fff; border-radius: 0.5rem; border: 2px solid #fff; -webkit-box-shadow: 6px 6px 0px 0px rgba(0,0,0,0.25); box-shadow:6px 6px 0px 0px rgba(0,0,0,0.25);overflow:hidden;padding-bottom:3rem;margin:0 6px 5rem 4px; }
#sect_chara .chara_box li .chara_img{border-top: 18px solid var(--color-pink);background-repeat: no-repeat;background-image: url(../img/haniEve_BG03.webp);background-position:left -2rem;background-size: 100% auto;}
#sect_chara .chara_box li .chara_img img{width:60%;margin: 2rem auto 3rem;}
#sect_chara .chara_box li .chara_name{color:var(--color-pink);font-size:var(--font-LL);line-height: 1.3;padding-bottom: 1rem;text-align: center;}
#sect_chara .chara_box li .chara_name .chara_st{font-size: var(--font-M);letter-spacing: 0;display: block;line-height: 1.3;padding-bottom: 0.5rem;}
#sect_chara .chara_box li .chara_name small{font-size: var(--font-S);display:block;}
#sect_chara .chara_box li .chara_data{padding-top: 1rem;}
#sect_chara .chara_box li .chara_data .data_dl{display: flex;flex-wrap: wrap;align-items: stretch;}
#sect_chara .chara_box li .chara_data .data_dl>*{padding:0.75rem 0;line-height: 1.3;border-bottom:dashed 1px #aaa89c;display: flex;align-items: center;}
#sect_chara .chara_box li .chara_data .data_dl dt{width:7rem;font-size:90%;color:var(--color-pink);}
#sect_chara .chara_box li .chara_data .data_dl dd{width: calc(100% - 7rem);}
#sect_chara .chara_box li .chara_data .data_dl>*.dl_full{width:100%!important;border-bottom-style: none;padding:0.5rem 0 0;}
#sect_chara .chara_box li .chara_data .data_dl>dt.dl_full{padding-top: 1.5rem;}
#sect_chara .chara_box li .chara_data .data_dl>dd.dl_full{line-height:1.6em;font-size:90%;}

#sect_chara{position: relative;overflow: visible;}
#sect_chara .chara_list{display: flex;gap: 0.5rem 2%;padding: 1rem;flex-wrap: wrap;	justify-content: center;position: sticky;z-index: 2;top: 74px;background-color: #ffffff61;}
#sect_chara .chara_list li{ width: 15%;cursor: pointer;border-radius: 50%;overflow: hidden;background-color: #034855;}
#sect_chara .chara_list li img{width:100%;opacity: 0.2;}
#sect_chara .chara_list li.is-active img{opacity:1;transition:0.2s;}

/**sect_creator**/
#sect_creator{color: #fff; background-color: var(--color-black);position: relative;overflow: hidden;
	/*background-image: -webkit-linear-gradient(0deg,rgba(255,81,152,1.00) 0%,rgba(255,140,113,1.00) 46.11%,rgba(255,192,125,1.00) 100%);
	background-image: -moz-linear-gradient(0deg,rgba(255,81,152,1.00) 0%,rgba(255,140,113,1.00) 46.11%,rgba(255,192,125,1.00) 100%);
	background-image: -o-linear-gradient(0deg,rgba(255,81,152,1.00) 0%,rgba(255,140,113,1.00) 46.11%,rgba(255,192,125,1.00) 100%);
	background-image: linear-gradient(90deg,rgba(255,81,152,1.00) 0%,rgba(255,140,113,1.00) 46.11%,rgba(255,192,125,1.00) 100%);*/
}
#sect_creator:before {content: ""; width: 150%; height: 6rem; display: block; background-color: var(--color-pink); position: absolute; left: 0%; transform: rotate(8deg); top: -5rem;}
#sect_creator [class*="mid_L"]{color: #fff;}
#sect_creator .creator_fimg{width:40%;margin: 0 auto 2rem;}
#sect_creator .creator_fimg img{width: 100%;}
#sect_creator .creator_txt{}
#sect_creator .creator_dl{padding-top:3rem; }
#sect_creator .creator_dl dt{width:fit-content;background-color: var(--color-black);font-size:var(--font-Mx);padding:0.3rem 2rem 0.5rem 2rem;margin: auto;border-radius:3rem;z-index:6;position: relative;}
#sect_creator .creator_dl dd{background-color: #fff;color:var(--color-black); border-radius:1rem; padding:3rem 2rem;margin-top: -1.5rem;z-index:1;position: relative;}
#sect_creator .creator_dl dd .creator_wlist{display: flex;flex-direction: column; gap:1.5rem;}
#sect_creator .creator_dl dd .creator_wlist li{position: relative; padding-left: 1.2em;line-height: 1.3;font-size:90%;}
#sect_creator .creator_dl dd .creator_wlist li:before{content:"●";font-size:80%;display:block;vertical-align: middle;color: #D0D0D0;position: absolute;top:0.15rem;left:0;}
#sect_creator .creator_dl dd + dt{margin-top: 3rem;}

#sect_creator .creator_dl dd .creator_links{display: flex;flex-direction: column; gap:1rem;}
#sect_creator .creator_dl dd .creator_links li{position: relative; padding-left: 1.2em;line-height: 1.3;}
#sect_creator .creator_dl dd .creator_links li:before{content: ""; display: block; position: absolute; top: 0.4rem; left: 0; width: 0.75rem; height: 0.75rem; background-image: url(../img/haniEve_ArrPink.svg); transform: rotate(-90deg); background-size: contain; background-repeat: no-repeat;}
#sect_creator .creator_dl dd .creator_links li a{line-height:1.2em;}

/**sect_access**/
#sect_access{background-color: #f3f3f3;}
#sect_access .access_txt{display: block; }
#sect_access .iframe_box {border: 6px solid #fff;margin-top:2rem;border-radius: 0.5rem;overflow: hidden;}
#sect_access .iframe_box iframe{aspect-ratio: 1 / 1;}
#sect_access .iframe_box + .access_txt{padding-top: 1rem;}

/**sect_sns**/
#sect_sns{background-color:#fff;padding-bottom:7rem;}
#sect_sns [class*="mid_L"]:after{}
#sect_sns .sns_dl{}
#sect_sns .sns_dl dt{font-size:var(--font-Mx); text-align: center;line-height: 1.3;}
#sect_sns .sns_dl dt small{display:block; font-size:75%;}
#sect_sns .sns_dl dd{margin-top:0.75rem;}
#sect_sns .sns_dl dd + dt{margin-top:3rem;}
#sect_sns .sns_dl dd .sns_list{margin: auto;border-radius: 0.5rem;padding: 0.25rem 0.5rem 1rem;row-gap:1rem;border: solid 2px var(--color-pink);}
#sect_sns .sns_dl dd .sns_list li {}
#sect_sns .sns_dl dd .sns_list li a{display: flex;flex-direction: column;align-items: center;}
#sect_sns .sns_dl dd .sns_list li a img{width:75%;}
#sect_sns .sns_dl dd .sns_list li a p{display: block;margin-top: -0.5rem;font-size:var(--font-S);text-align: center;line-height: 1.3;letter-spacing:0;color:var(--color-pink);}



@media only screen and (max-width: 450px) {
.fix_area{}
.sign_box .sign_oline li{font-size:100%;}

#sect_fview {}
#sect_fview [class*="wth_"]{}
#sect_fview [class*="wth_"]:after{}
#sect_fview [class*="wth_"] .fview_logo{}
#sect_fview [class*="wth_"] .fview_logo img{}

/**fview slick**/
#sect_fview [class*="_SlDes"]{}
#sect_fview [class*="_SlDes"] .slick-slide{min-height:400px;}
#sect_fview [class*="_SlDes"] .slick-slide img{}
#sect_fview [class*="_SlDes"] .uniq-dots{padding: 0; gap: 0.75rem 4%;bottom: 60vw;}
#sect_fview [class*="_SlDes"] .uniq-dots:after{}
#sect_fview [class*="_SlDes"] .uniq-dots li{height: 1em;width: 1em;margin-right: 0.5rem !important;}
#sect_fview [class*="_SlDes"] .uniq-dots li button{}
#sect_fview [class*="_SlDes"] .uniq-dots li.slick-active button{}

/**sect_about**/
#sect_about{}
#sect_about .about_img{padding-top:3rem;}
#sect_about .about_txt{padding-top:2rem;}

/**#sect_goods**/
#sect_goods{}
#sect_goods{--BgMarg:205vw;}
/**sect_location**/
#sect_location [class*="wth_"]{padding-left: 4vw;padding-right: 4vw;}
}