@charset "utf-8";

/* 共通（リセット）
-------------------------------------------------- */
*{
	margin: 0;
	padding: 0;
	line-height: 1.6em;
}

body{
	font-family: "Noto Sans JP", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	-webkit-text-size-adjust: 100%;
	color: #333333;
	background-image: -webkit-linear-gradient(left, #d7f0fc, #f7d9f0);
	background-image: -o-linear-gradient(left, #d7f0fc, #f7d9f0);
	background-image: linear-gradient(to right, #d7f0fc, #f7d9f0);
}

body.fixed{
	height: 100vh;
	overflow: hidden;
}

.navWrap.panel-active{
	overflow-y: scroll;
}

img{
	vertical-align: bottom;
}

li{
	list-style-type: none;
}

.feathers_A{
	position: fixed;
	top: -150%;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 3600%;
	background: url("../img/feather_top_hive.png");
	background-size: 100% auto;
	background-repeat: repeat-y;
	background-position: center top;
	transition: transform 1.2s 0s cubic-bezier(.075, .82, .165, 1);
}

.feathers_B{
	position: fixed;
	top: -200%;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 2000%;
	background: url("../img/feather_under_hive.png") center top;
	background-size: 100% auto;
	background-repeat: repeat-y;
	background-position: center top;
	transition: transform 1.2s 0s cubic-bezier(.075, .82, .165, 1);	
}

/* PC
-------------------------------------------------- */
@media screen and (min-width:1000px){

.pcNone{display: none !important;}
.spBr{display: none;}

#side{
	box-sizing: border-box;
	display: flex;
	flex-flow: column;
	justify-content: center;
	align-items: center;
	width: 36px;
	position: fixed;
	bottom: 60px;
	right: 10px;
	z-index: 8;
	gap: 10px;
}

.side-item{
	display: block;
	box-sizing: border-box;
	writing-mode: vertical-rl;
	background: #cc0000;
	color: #ffffff;
	font-size: 14px;
	line-height: 14px;
	text-decoration: none;
	padding: 20px 10px;
	border-radius: 4px;
}

.side-shop{
	display: block;
	box-sizing: border-box;
	writing-mode: vertical-rl;
	background: #002026;
	color: #ffffff;
	font-size: 14px;
	line-height: 14px;
	text-decoration: none;
	padding: 20px 10px;
	border-radius: 4px;
}

.side-return{
	display: block;
	box-sizing: border-box;
	border-radius: 100%;
	font-size: 14px;
	background: #000000;
	color: #ffffff;
	width: 100%;
	aspect-ratio: 1/1;
	text-align: center;
	line-height: 36px;
}

header{
	width: 100%;
	position: sticky;
	top: 0;
	left: 0;
	z-index: 1000;
	box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.2);
	background: #ffffff;
}

.h_inner{
	box-sizing: border-box;
	padding: 10px 0;
	height: 60px;
	width: 100%;
	max-width: 1200px;
	margin: auto;
	display: flex;
	justify-content: space-between;
}

.h_inner .logo a{
	display: block;
}

.h_inner .logo img{
	height: 100%;
	max-height: 40px;
	width: auto;
}

.navInner > a{
	display: block;
	box-sizing: border-box;
	font-size: 16px;
	font-weight: 600;
	color: rgb(0, 0, 0);
	position: relative;
	z-index: 1;
	padding: 1rem 0px;
	text-decoration: none;
}

.navInner > a i{
	display: block;
	position: absolute;
	top: 50%;
	right: 0px;
	z-index: 1;
	margin-top: -8px;
}

#wrap{
	padding: 60px 0 0;
}

.kv{
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	background: #cccccc;
	padding: 40vh 0;
	text-align: center;
	margin-bottom: 60px;
}

/* スケジュール
-------------------------------------------------- */
#schedule{
	margin-bottom: 60px;
}

.plan_flex{
	display: flex;
	justify-content: center;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto 60px;
}

.plan{
	box-sizing: border-box;
	width: 90%;
	max-width: 380px;
	padding: 40px;
	background: #ffffff;
	margin: 0 15px;
}

.plan h2{
	font-size: 18px;
	font-weight: 600;
	color: #1a1a1a;
	text-align: center;
	margin-bottom: 40px;
}

.plan .popup{
	font-size: 14px;
	color: #ffffff;
	margin-bottom: 20px;
}

.location{
	border-top: 1px solid #1a1a1a;
	border-bottom: 1px solid #1a1a1a;
	padding: 20px 0;
	margin-bottom: 40px;
	text-align: center;
}

.date{
	text-align: center;
	font-size: 28px;
	line-height: 28px;
	height: 28px;
	font-family: "DIN 2014", sans-serif;
}

.date span{
	font-size: 20px;
	margin: 0 0.2em;
}

.release{
	display: inline-block;
	border-top: 1px solid #cccccc;
	padding: 15px 30px;
	margin-top: 20px;
	font-size: 14px;
}

.plan a{
	display: block;
	width: 100%;
	background: #1a1a1a;
	color: #ffffff;
	text-decoration: none;
	text-align: center;
	padding: 20px 0;
	font-size: 14px;
	line-height: 14px;
	position: relative;
	transition: 0.2s;
}

.plan a i{
	position: absolute;
	top: 50%;
	right: 20px;
	margin-top: -6px;
	transition: 0.2s;
}

.plan a:hover{
	opacity: 0.8;
}

.plan:first-child{background-image: linear-gradient(to bottom, #41638d, #15334f);}
.plan:first-child h2{color: #ffffff;}
.plan:first-child .location{border-top: 1px solid #ffffff; border-bottom: 1px solid #ffffff;}
.plan:first-child .spot{
	font-size: 14px;
	color: #ffffff;
	text-align: center;
	margin-bottom: 20px;
}

.plan:first-child .spot span{
	display: inline-block;
	background: #1a1a1a;
	border-radius: 6px;
	padding: 0 10px;
	margin-right: 10px;
}

.plan:first-child .date{
	color: #ffffff;
}

.plan:first-child li{
	font-size: 12px;
	line-height: 1.8em;
	color: #ffffff;
	padding-left: 1em;
	text-indent: -1em;
}

/* ポップアップ
-------------------------------------------------- */
.popup h2{
	font-size: 26px;
	font-weight: 500;
	text-align: center;
	color: #15334f;
}

.popup hr{
	display: block;
	height: 1px;
	width: 600px;
	background: #1c1c1c;
	margin: 40px auto;
	border: 0;
}

.popup .date{
	color: #15334f;
	font-size: 32px;
}

.overview{
	font-size: 14px;
	color: #15334f;
	text-align: center;
	line-height: 2em;
	margin-top: 40px;
}

.goodsSlider{
	margin-top: 60px;
}

.slider_goods li{
	position: relative;
}

.goodsImg{
	background: #ffffff;
	padding: 20px;
}

.senko{
	display: inline-block;
	background: #cc0000;
	font-size: 12px;
	color: #ffffff;
	padding: 8px 10px;
	position: absolute;
	top: 10px;
	left: 20px;
	letter-spacing: 0.15em;
}

.slider_goods .name{
	font-size: 14px;
	color: #15334f;
	line-height: 1.6em;
	height: 4.8em;
	overflow: hidden;
	margin-top: 10px;
}

.slider_goods .price{
	font-size: 16px;
	color: #15334f;
}
.slider_goods .price span{
	font-size: 12px;
}

.goodsSlider .number{
	color: #15334f !important;
}

.goodsSlider .prev-arrow::before,
.goodsSlider .prev-arrow::after,
.goodsSlider .next-arrow::before,
.goodsSlider .next-arrow::after{
	background: #15334f !important;
}

.popupLink{
	display: block;
	width: 100%;
	max-width: 520px;
	border: 2px solid #15334f;
	margin: 60px auto 0;
	padding: 20px 0;
	text-decoration: none;
	color: #15334f;
	font-weight: 600;
	text-align: center;
	font-size: 14px;
	position: relative;
}

.popupLink::after{
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: #e7f6ff;
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: -1;
	transition: 0.2s;
}

.popupLink:hover::after{
	top: 0;
	left: 0;
}

.popupLink i{
	position: absolute;
	top: 50%;
	right: 20px;
	margin-top: -8px;
	font-size: 18px;
}

/* ラインナップ
-------------------------------------------------- */
#lineup{
	margin: 90px 0;
}

.lineup{
	width: 100%;
	max-width: 1000px;
	border-top: 1px solid #15334f;
	margin: 0 auto;
	padding: 90px 0 0;
}

.lineup h2{
	font-size: 38px;
	font-weight: 400;
	text-align: center;
	color: #15334f;
	margin-bottom: 90px;
}

.lineup p{
	font-size: 26px;
	font-weight: normal;
	text-align: center;
	color: #15334f;
	margin: 50px 0;
}

.lineup ul{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 20px;
}

.lineup li{
	box-sizing: border-box;
	width: 25%;
	max-width: 225px;
}

.lineup li a{
	display: block;
	padding: 20px;
	background: #ffffff;
	text-decoration: none;
	position: relative;
	box-shadow: 1px 1px 5px rgba(118,118,118,0.35);
	transition: 0.2s;
}

.lineup li a:hover{
	transform: translateY(3px);
	box-shadow: 1px 1px 3px rgba(118,118,118,0.35);
}

.lineup li a::before{
	content: "more";
	display: block;
	width: 56px;
	height: 56px;
	text-align: center;
	font-size: 12px;
	line-height: 56px;
	color: #333333;
	background: rgba(255,255,255,0.8);
	border-radius: 100%;
	position: absolute;
	top: 27%;
	left: 50%;
	transform: translateX(-28px);
}

.lineup li a img{
	width: 100%;
}

.lineup span{
	display: block;
	color: #000000;
	font-size: 12px;
	text-align: center;
	margin-top: 15px;
}

.lineup li:nth-child(5),
.lineup li:last-child{
	margin-right: 0;
}

/* 店舗限定紹介
-------------------------------------------------- */
#storeOnly{
	background: #15334f;
	padding: 50vh 0;
}

#storeOnly h2{
	font-size: 24px;
	font-weight: 400;
	line-height: 24px;
	color: #ffcf59;
	text-align: center;
}

#storeOnly h2 span{
	display: block;
	font-size: 16px;
	color: #ffffff;
	letter-spacing: 0.15em;
	margin-bottom: 5px;
}

#storeOnly ul{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	width: 100%;
	max-width: 920px;
	margin: 20px auto 0;
}

#storeOnly li{
	width: 25%;
	max-width: 190px;
	margin: 40px 20px 20px;
	border-radius: 5px;
}

#storeOnly li a{
	display: block;
	box-shadow: 7px 7px 7px rgba(0,0,0,0.4);
	border-radius: 5px;
	transition: 0.2s;
}

#storeOnly li a:hover{
	transform: translateY(3px);
	box-shadow: 4px 4px 4px rgba(0,0,0,0.4);
}

#storeOnly li a img{
	width: 100%;
}

/* 商品紹介
-------------------------------------------------- */
section:not(#schedule):not(#popup):not(#lineup){
	background-attachment: fixed;
	background-position: calc(50% + 530px) calc(100% - 50px), top 60px center;
	background-size: 137px auto, cover;
	background-repeat: no-repeat;
	padding-top: 20px;
	position: relative;
}

.saleform_ec,
.saleform_store{
	display: none;
}

.saleform{
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	position: sticky;
	top: 80px;
	left: 0;
}

.saleform_inner{
	display: inline-block;
	box-sizing: border-box;
}

.saleform p{
	font-size: 20px;
	padding: 20px;
	white-space: nowrap;
	overflow: hidden;
	animation: popLeft_pc linear both;
	animation-timeline: view();
}

.saleform .normal{
	background: rgba(200,0,0,0.8);
	color: #ffffff;
}

.saleform .storeOnly{
	background: rgba(21,51,79,0.8);
	color: #ffcf59;
}

.saleform span{
	display: block;
	font-size: 14px;
}

.saleform .storeOnly span{
	color: #ffffff;
}

.secInner,
.secInner_store{
	/*animation: popZoom_pc linear both;
	animation-timeline: view();
	transform: scale(0);*/
	width: 100%;
	padding: 60px 0;
	overflow: hidden;
	margin-top: 100vh;
	position: relative;
	z-index: 5;
}

.secInner_store{
	background: #15334f;
}

.secInner_store .itemFlex h2,
.secInner_store .itemPrice,
.secInner_store .number{
	color: #ffffff;
}

.secInner_store .prev-arrow::before,
.secInner_store .prev-arrow::after,
.secInner_store .next-arrow::before,
.secInner_store .next-arrow::after{
	background: #ffffff;
}

.itemFlex{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	box-sizing: border-box;
	width: 100%;
	max-width: 1200px;
	padding: 0 40px;
	margin: 0 auto;
}

.itemImg{
	width: 23%;
	max-width: 260px;
	height: 100%;
}

.itemImg img{
	width: 100%;
}

.itemDesc{
	width: 73%;
	max-width: 820px;
}

.itemFlex h2{
	font-size: 16px;
	font-weight: normal;
	color: #ffffff;
}

.itemFlex h2 span{
	display: block;
	font-size: 14px;
}

.itemPrice{
	margin-top: 40px;
	font-size: 16px;
	color: #ffffff;
}

.saleArea{
	display: none;
}

.itemDesc table{
	width: 100%;
	margin-top: 40px;
	border-collapse: collapse;
	background: #ffffff;
}

.itemDesc table th,
.itemDesc table td{
	border: 1px solid #cccccc;
	font-size: 14px;
	line-height: 2em;
	text-align: left;
	padding: 10px;
}

.itemDesc table th{
	background: #f8f8f8;
	border: bold;
}

.itemDesc table td span{
	font-weight: bold;
}

.itemDesc table td.noSale{
	color: #cc0000;
}

.itemLink{
	display: flex;
	box-sizing: border-box;
	justify-content: space-between;
	margin-top: 40px;
}

.itemLink span{
	display: block;
	background: #ffffff;
	width: 48%;
	max-width: 390px;
}

.itemLink a{
	display: block;
	box-sizing: border-box;
	font-size: 14px;
	font-weight: 500;
	padding: 25px;
	text-align: center;
	text-decoration: none;
	position: relative;
	transition: 0.2s;
	letter-spacing: 0.1em;
}

.itemLink a.item{
	background: #cc0000;
	color: #ffffff;
}

.itemLink a.store{
	background: #41638d;
	color: #ffffff;
}

.itemLink a.digicon{
	background: #000000;
	color: #ffffff;
}

.itemLink a i{
	position: absolute;
	top: 50%;
	margin-top: -7px;
	right: 20px;
	transition: 0.2s;
}

.itemLink a:hover{
	opacity: 0.8;
}

.itemLink a:hover i{
	transform: translateX(10px);
}

.mT60{
	margin-top: 60px;
}

.slick-initialized .slick-slide{
	box-sizing: border-box;
	padding: 0 10px;
	position: relative;
}

/*.slick-initialized .slick-slide::before{
	display: flex;
	justify-content: center;
	align-items: center;
	content: "調整中";
	width: calc(100% - 20px);
	height: 100%;
	background: rgba(0,0,0,0.5);
	color: #ffffff;
	font-size: 24px;
	letter-spacing: 0.3em;
	position: absolute;
	top: 0;
	left: 10px;
}*/

.slick-slide img {
	margin: 0 auto;
	width: 100%;
}

.prev-arrow,
.next-arrow{
	position: absolute;
	width: 11.2px;
	height: 20.4px;
	cursor: pointer;
	bottom: 0;
}

.prev-arrow{
	left: 50%;
	margin-left: -50px;
}

.next-arrow{
	right: 50%;
	margin-right: -50px;
}

.prev-arrow::before,
.prev-arrow::after,
.next-arrow::before,
.next-arrow::after{
	content: "";
	position: absolute;
	top: calc(50% - 1px);
	left: 0;
	width: 12px;
	height: 2px;
	border-radius: 9999px;
	background: #ffffff;
}

.prev-arrow::before,
.prev-arrow::after{transform-origin: 1px 50%;}

.next-arrow::before,
.next-arrow::after{transform-origin: calc(100% - 1px) 50%;}

.prev-arrow::before,
.next-arrow::before{transform: rotate(45deg);}

.prev-arrow::after,
.next-arrow::after{transform: rotate(-45deg);}

.number{
	text-align: center;
	margin-top: 50px;
	font-size: 14px;
	color: #ffffff;
}

/* イルミネーションスターズ */
#illumination_stars_ec{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/01_bgi_ec.jpg");}
#illumination_stars_ec .secInner{background: #fff68d;}
#illumination_stars_ec .itemFlex h2,
#illumination_stars_ec .itemPrice{color: #000000;}
#illumination_stars_ec .prev-arrow::before,
#illumination_stars_ec .prev-arrow::after,
#illumination_stars_ec .next-arrow::before,
#illumination_stars_ec .next-arrow::after{background: #000000;}
#illumination_stars_ec .number{color: #000000;}
#illumination_stars_store{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/01_bgi_store.jpg");}

/* アンティーカ */
#antica_ec{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/02_bgi_ec.jpg");}
#antica_ec .secInner{background: #853998;}
#antica_store{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/02_bgi_store.jpg");}

/* 放課後クライマックスガールズ */
#after_school_climax_girls_ec{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/03_bgi_ec.jpg");}
#after_school_climax_girls_ec .secInner{background: #fa8333;}
#after_school_climax_girls_store{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/03_bgi_store.jpg");}

/* アルストロメリア */
#alstroemeria_ec{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/04_bgi_ec.jpg");}
#alstroemeria_ec .secInner{background: #ff699e;}
#alstroemeria_store{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/04_bgi_store.jpg");}

/* ストレイライト */
#straylight_ec{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/05_bgi_ec.jpg");}
#straylight_ec .secInner{background: #af011c;}
#straylight_store{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/05_bgi_store.jpg");}

/* ノクチル */
#noctchill_ec{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/06_bgi_ec.jpg");}
#noctchill_ec .secInner{background: #384d98;}
#noctchill_store{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/06_bgi_store.jpg");}
.goodsLink{
	display: block;
	width: 90%;
	max-width: 800px;
	margin: 40px auto 0;
	padding: 20px 0;
	text-align: center;
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	color: #ffffff;
	border: 1px solid #ffffff;
	transition: 0.2s
}

.goodsLink span:nth-child(1){
	margin-left: 10px;
}

#noctchill_ec .goodsLink:hover{
	background: #ffffff;
	color: #384d98;
}

#noctchill_store .goodsLink:hover{
	background: #ffffff;
	color: #15334f;
}

/* シーズ */
#shhis_ec{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/07_bgi_ec.jpg");}
#shhis_ec .secInner{background: #008e74;}
#shhis_store{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/07_bgi_store.jpg");}

/* コメティック */
#cometik_ec{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/08_bgi_ec.jpg");}
#cometik_ec .secInner{background: #0c0c0c;}
#cometik_store{background-image: url("../img/logo_shinycolors_b_03.png"), url("../img/08_bgi_store.jpg");}

/* キャンペーン
-------------------------------------------------- */
#campaign{
	background: #ebefef;
	padding: 100px 0 !important;
}

.cpInner{
	box-sizing: border-box;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	background: #ffffff;
	padding: 60px 40px;
	border-radius: 40px;
}

.cpInner:not(:last-child){
	margin-bottom: 60px;
}

.cpInner h2{
	display: block;
	width: 100%;
	font-size: 24px;
	font-weight: 500;
	text-align: center;
	margin-bottom: 50px;
}

.cpImg,
.cpDetail{
	width: 50%;
	max-width: 540px;
}

.cpImg img{
	width: 100%;
}

.cpDetail{
	font-size: 14px;
	line-height: 1.8em;
}

.cpDetail li{
	margin: 5px 0;
}

.cpDetail a{
	color: #15334f;
	text-decoration: underline;
}

.cpDetail .schedule{
	margin: 30px 0;
	padding: 30px 0;
	border-top: 1px solid #000000;
	border-bottom: 1px solid #000000;
}

.cpDetail .schedule h3{
	font-size: 14px;
	font-weight: 400;
	text-align: center;
	margin-bottom: 15px;
}

.cpDetail .schedule p{
	text-align: center;
	font-size: 28px;
	line-height: 28px;
	height: 28px;
	font-family: "DIN 2014", sans-serif;
}

.cpDetail .schedule p span{
	font-size: 20px;
	margin: 0 0.2em;
}

.cpDetail .cpLink{
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 200px;
	background: #000000;
	padding: 20px 0;
	text-align: center;
	position: relative;
	font-size: 14px;
	color: #ffffff;
	text-decoration: none;
	transition: 0.2s;
}

.cpDetail .cpLink i{
	position: absolute;
	top: 50%;
	right: 20px;
	font-size: 18px;
	margin-top: -8px;
	transition: 0.2s;
}

.cpDetail .cpLink:hover{
	opacity: 0.8;
}

.cpDetail .cpLink:hover i{
	transform: translateX(10px);
}

/* ノクチルグッズ
-------------------------------------------------- */
#noctchill_goods{
	padding: 100px 0 !important;
}

#noctchill_goods h2{
	font-size: 26px;
	font-weight: normal;
	text-align: center;
	color: #3e5f88;
}

.noctchill_bnr{
	display: block;
	width: 90%;
	max-width: 700px;
	margin: 100px auto;
}

.noctchill_bnr img{
	width: 100%;
}

.partnerLogo{
	padding: 60px 0;
	text-align: center;
	width: 100%;
	max-width: 1200px;
	border-top: 1px solid #15334f;
	margin: 0 auto;
	position: relative;
}

.partnerLogo::before{
	content: "";
	display: block;
	width: 100%;
	border-top: 1px solid #41638d;
	position: absolute;
	top: 1px;
	left: 0;
}

.partnerLogo img{
	width: 90%;
	max-width: 272px;
}

/* フッター
-------------------------------------------------- */
footer{
	display: none;
}

.copyright{
	background: #333333;
	color: #ffffff;
	font-size: clamp(14px, 1.3vw, 16px);
	text-align: center;
	padding: 10px 0;
}
}

/* SP
-------------------------------------------------- */
@media screen and (max-width:999px){

.spNone{display: none !important;}

#side{
	display: none;
}

header{
	width: 100%;
	position: sticky;
	top: 0;
	left: 0;
	z-index: 1000;
	box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.2);
	background: #ffffff;
}

.h_inner{
	box-sizing: border-box;
	padding: 10px 20px;
	height: 60px;
	width: 100%;
	max-width: 1300px;
	margin: auto;
	display: flex;
	justify-content: space-between;
}

.h_inner .logo a{
	display: block;
}

.h_inner .logo img{
	height: 100%;
	max-height: 40px;
	width: auto;
}

.navInner{
	padding: 20px;
}

.navInner h2{
	padding: 10px 20px 10px 0;
}

.navInner > a{
	display: block;
	box-sizing: border-box;
	font-size: 16px;
	font-weight: 600;
	color: #333333;
	position: relative;
	z-index: 1;
	padding: 10px 20px 10px 0;
	text-decoration: none;
}

.navInner > a i{
	display: block;
	position: absolute;
	top: 50%;
	right: 0px;
	z-index: 1;
	margin-top: -8px;
}

#wrap{
	padding: 0;
}

.kv{
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	background: #cccccc;
	padding: 20vh 0;
	text-align: center;
}

/* スケジュール
-------------------------------------------------- */
#schedule{
	margin-top: 40px;
}

.plan_flex{
	width: 90%;
	max-width: 1200px;
	margin: 0 auto;
}

.plan{
	box-sizing: border-box;
	width: 100%;
	padding: 20px;
	background: #ffffff;
	margin-bottom: 20px;
}

.plan h2{
	font-size: 16px;
	font-weight: 600;
	color: #1a1a1a;
	text-align: center;
	margin-bottom: 20px;
}

.plan .popup{
	font-size: 14px;
	color: #ffffff;
	margin-bottom: 20px;
}

.location{
	border-top: 1px solid #1a1a1a;
	border-bottom: 1px solid #1a1a1a;
	padding: 20px 0;
	margin-bottom: 20px;
	text-align: center;
}

.date{
	text-align: center;
	font-size: 20px;
	line-height: 20px;
	height: 20px;
	font-family: "DIN 2014", sans-serif;
}

.date span{
	font-size: 16px;
	margin: 0 0.2em;
}

.release{
	display: inline-block;
	border-top: 1px solid #cccccc;
	padding: 10px 20px;
	margin-top: 20px;
	font-size: 14px;
}

.plan a{
	display: block;
	width: 90%;
	margin: 0 auto;
	background: #1a1a1a;
	color: #ffffff;
	text-decoration: none;
	text-align: center;
	padding: 20px 0;
	font-size: 14px;
	line-height: 14px;
	position: relative;
	transition: 0.2s;
}

.plan a i{
	position: absolute;
	top: 50%;
	right: 20px;
	margin-top: -6px;
	transition: 0.2s;
}

.plan a:hover{
	opacity: 0.8;
}

.plan:first-child{background-image: linear-gradient(to bottom, #41638d, #15334f);}
.plan:first-child h2{color: #ffffff;}
.plan:first-child .location{border-top: 1px solid #ffffff; border-bottom: 1px solid #ffffff;}
.plan:first-child .spot{
	font-size: 14px;
	color: #ffffff;
	text-align: center;
	margin-bottom: 10px;
}

.plan:first-child .spot span{
	display: inline-block;
	background: #1a1a1a;
	border-radius: 6px;
	padding: 0 10px;
	margin-right: 10px;
}

.plan:first-child .date{
	color: #ffffff;
}

.plan:first-child li{
	font-size: 12px;
	line-height: 1.8em;
	color: #ffffff;
	padding-left: 1em;
	text-indent: -1em;
}

/* ポップアップ
-------------------------------------------------- */
#popup{
	padding-top: 60px;
}

.popup h2{
	font-size: 24px;
	font-weight: 500;
	text-align: center;
	color: #15334f;
}

.popup hr{
	display: block;
	height: 1px;
	width: 90%;
	background: #1c1c1c;
	margin: 30px auto;
	border: 0;
}

.popup .date{
	color: #15334f;
	font-size: 26px;
}

.overview{
	font-size: 14px;
	color: #15334f;
	text-align: left;
	line-height: 1.8em;
	margin-top: 30px;
	padding: 0 20px;
}

.goodsSlider{
	margin-top: 40px;
}

.slider_goods li{
	position: relative;
}

.goodsImg{
	background: #ffffff;
	padding: 20px;
}

.senko{
	display: inline-block;
	background: #cc0000;
	font-size: 12px;
	color: #ffffff;
	padding: 8px 10px;
	position: absolute;
	top: 10px;
	left: 20px;
	letter-spacing: 0.15em;
}

.slider_goods .name{
	font-size: 14px;
	color: #15334f;
	line-height: 1.6em;
	height: 4.8em;
	overflow: hidden;
	margin-top: 10px;
}

.slider_goods .price{
	font-size: 16px;
	color: #15334f;
}
.slider_goods .price span{
	font-size: 12px;
}

.goodsSlider .number{
	color: #15334f !important;
}

.goodsSlider .prev-arrow::before,
.goodsSlider .prev-arrow::after,
.goodsSlider .next-arrow::before,
.goodsSlider .next-arrow::after{
	background: #15334f !important;
}

.popupLink{
	display: block;
	width: 90%;
	border: 2px solid #15334f;
	margin: 40px auto 0;
	padding: 20px 0;
	text-decoration: none;
	color: #15334f;
	font-weight: 600;
	text-align: center;
	font-size: 13px;
	position: relative;
}

.popupLink::after{
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: #e7f6ff;
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: -1;
	transition: 0.2s;
}

.popupLink:hover::after{
	top: 0;
	left: 0;
}

.popupLink i{
	display: none;
}

/* ラインナップ
-------------------------------------------------- */
#lineup{
	margin: 40px auto;
	width: 90%;
}

.lineup{
	width: 100%;
	max-width: 1200px;
	border-top: 1px solid #15334f;
	margin: 0 auto;
	padding: 40px 0 0;
}

.lineup h2{
	font-size: 24px;
	font-weight: 400;
	text-align: center;
	color: #15334f;
	margin-bottom: 40px;
}

.lineup p{
	font-size: 18px;
	font-weight: normal;
	text-align: center;
	color: #15334f;
	margin: 0;
}

.lineup ul{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: 40px 0;
}

.lineup li{
	box-sizing: border-box;
	width: 48%;
	margin-bottom: 20px;
}

.lineup li:nth-child(odd){
	margin-right: 2%;
}

.lineup li:nth-child(even){
	margin-left: 2%;
}

.lineup li a{
	display: block;
	padding: 20px;
	background: #ffffff;
	text-decoration: none;
	position: relative;
	box-shadow: 1px 1px 5px rgba(118,118,118,0.35);
	transition: 0.2s;
}

.lineup li a::before{
	content: "more";
	display: block;
	width: 56px;
	height: 56px;
	text-align: center;
	font-size: 12px;
	line-height: 56px;
	color: #333333;
	background: rgba(255,255,255,0.8);
	border-radius: 100%;
	position: absolute;
	top: 19%;
	left: 50%;
	transform: translateX(-28px);
}

.lineup li a img{
	width: 100%;
}

.lineup span{
	display: block;
	color: #000000;
	font-size: 12px;
	line-height: 1.5em;
	height: 3em;
	text-align: center;
	margin-top: 15px;
}

/* 店舗限定紹介
-------------------------------------------------- */
#storeOnly{
	background: #15334f;
	padding: 25vh 0;
}

#storeOnly h2{
	font-size: 20px;
	font-weight: 400;
	color: #ffcf59;
	text-align: center;
}

#storeOnly h2 span{
	display: block;
	font-size: 16px;
	color: #ffffff;
	letter-spacing: 0.15em;
	margin-bottom: 5px;
}

#storeOnly ul{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	width: 90%;
	margin: 40px auto 0;
}

#storeOnly li{
	width: 48%;
	border-radius: 5px;
	margin-bottom: 20px;
}

#storeOnly li:nth-child(odd){
	margin-right: 2%;
}

#storeOnly li:nth-child(even){
	margin-left: 2%;
}

#storeOnly li a{
	display: block;
	box-shadow: 5px 5px 5px rgba(0,0,0,0.4);
	border-radius: 5px;
}

#storeOnly li a img{
	width: 100%;
}

section:not(#schedule):not(#popup):not(#lineup):not(#campaign):not(#noctchill_goods):not(#storeOnly)::before{
	display: block;
	box-sizing: border-box;
}

.saleform{
	display: none;
}

.saleform_ec,
.saleform_store{
	width: 100%;
	box-sizing: border-box;
	padding: 15px 10px;
	font-size: 13px;
	margin-top: 5vh
}

.saleform_ec{
	background: rgba(200,0,0,1);
	color: #ffffff;
}

.saleform_store{
	background: rgba(21,51,79,1);
	color: #ffcf59;
}

.saleform_ec span,
.saleform_store span{
	display: block;
	font-size: 12px;
}

.saleform_store span{
	color: #ffffff;
}

.secInner,
.secInner_store{
	/*animation: popZoom_sp linear both;
	animation-timeline: view();
	transform: scale(0);*/
	width: 100%;
	padding: 0 0 40px;
	overflow: hidden;
}

.secInner_store{
	background: #15334f;
}

.secInner_store .itemFlex h2,
.secInner_store .itemPrice,
.secInner_store .number{
	color: #ffffff;
}

.secInner_store .prev-arrow::before,
.secInner_store .prev-arrow::after,
.secInner_store .next-arrow::before,
.secInner_store .next-arrow::after{
	background: #ffffff;
}

.itemFlex{
	box-sizing: border-box;
	width: 100%;
	max-width: 1200px;
	padding: 0 20px 40px;
	margin: 0 auto;
}

.itemImg{
	width: 50%;
	margin: 30px auto 0;
}

.itemImg img{
	width: 100%;
}

.itemDesc{
	width: 100%;
	margin-top: 20px;
}

.itemFlex h2{
	font-size: 14px;
	font-weight: normal;
	color: #ffffff
}

.itemFlex h2 span{
	display: block;
	font-size: 12px;
}

.itemPrice{
	margin-top: 20px;
	font-size: 14px;
	color: #ffffff;
}

.saleArea{
	display: block;
	width: 100%;
	box-sizing: border-box;
	border-radius: 100px;
	background-image: -webkit-linear-gradient(bottom, #ffffff, #e2e1e3);
	background-image: -o-linear-gradient(bottom, #ffffff, #e2e1e3);
	background-image: linear-gradient(to bottom, #ffffff, #e2e1e3);
	text-align: center;
	font-size: 14px;
	font-weight: 600;
	padding: 15px;
	position: relative;
	z-index: 1;
	margin-top: 30px;
	border: 1px solid #cccccc;
}

.saleArea i{
	position: absolute;
	top: 50%;
	transform: translateY(-7px);
	right: 20px;
	z-index: 2;
	transition: 0.2s;
}

.saleArea.open i{
	transform: rotate(180deg) translateY(7px);
}

.curtain{
	display: none;
	padding-top: 10px;
}

.itemDesc table{
	width: 100%;
}

.itemDesc table tr{
	display: flex;
	flex-wrap: wrap;
}

.itemDesc table th,
.itemDesc table td{
	border: 1px solid #cccccc;
	border-top: 0;
	background: #ffffff;
	font-size: 14px;
	text-align: center;
	padding: 10px;
}

.itemDesc table th{
	background: #f8f8f8;
	border: bold;
	display: block;
	box-sizing: border-box;
	width: 100%;
	margin-top: 10px;
}

.itemDesc table tr:first-child th:first-child{
	border-top: 1px solid #cccccc;
}

.itemDesc table td{
	display: block;
	background: #ffffff;
	box-sizing: border-box;
	width: 100%;
	font-size: 12px;
}

.itemDesc table td span{
	font-weight: bold;
}

.itemDesc table td.noSale{
	color: #cc0000;
}

.itemLink{
	margin-top: 40px;
}

.itemLink span{
	display: block;
	background: #ffffff;
	width: 100%;
}

.itemLink a{
	display: block;
	box-sizing: border-box;
	font-size: 14px;
	font-weight: 500;
	padding: 20px 0;
	text-align: center;
	text-decoration: none;
	position: relative;
	transition: 0.2s;
	letter-spacing: 0.1em;
}

.itemLink a.item{
	background: #cc0000;
	color: #ffffff;
}

.itemLink a.store{
	background: #41638d;
	color: #ffffff;
}

.itemLink a.digicon{
	background: #000000;
	color: #ffffff;
	margin-top: 20px;
}

.itemLink a i{
	position: absolute;
	top: 50%;
	margin-top: -7px;
	right: 20px;
	transition: 0.2s;
}

.itemLink a:hover{
	opacity: 0.8;
}

.itemLink a:hover i{
	transform: translateX(10px);
}

.mT60{
	margin-top: 0px;
}

.slick-initialized .slick-slide {
	box-sizing: border-box;
	padding: 0 10px;
	position: relative;
}

/*.slick-initialized .slick-slide::before{
	display: flex;
	justify-content: center;
	align-items: center;
	content: "調整中";
	width: calc(100% - 20px);
	height: 100%;
	background: rgba(0,0,0,0.5);
	color: #ffffff;
	font-size: 16px;
	letter-spacing: 0.3em;
	position: absolute;
	top: 0;
	left: 10px;
}*/

.slick-slide img {
	margin: 0 auto;
	width: 100%;
}

.prev-arrow,
.next-arrow{
	position: absolute;
	width: 11.2px;
	height: 20.4px;
	cursor: pointer;
	bottom: 0;
}

.prev-arrow{
	left: 50%;
	margin-left: -50px;
}

.next-arrow{
	right: 50%;
	margin-right: -50px;
}

.prev-arrow::before,
.prev-arrow::after,
.next-arrow::before,
.next-arrow::after{
	content: "";
	position: absolute;
	top: calc(50% - 1px);
	left: 0;
	width: 12px;
	height: 2px;
	border-radius: 9999px;
	background: #ffffff;
}

.prev-arrow::before,
.prev-arrow::after{transform-origin: 1px 50%;}

.next-arrow::before,
.next-arrow::after{transform-origin: calc(100% - 1px) 50%;}

.prev-arrow::before,
.next-arrow::before{transform: rotate(45deg);}

.prev-arrow::after,
.next-arrow::after{transform: rotate(-45deg);}

.number{
	text-align: center;
	margin-top: 30px;
	font-size: 14px;
	color: #ffffff;
}

/* イルミネーションスターズ */
#illumination_stars_ec::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1420;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/01_bgi_ec.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

#illumination_stars_ec .secInner{
	background: #fff68d;
}

#illumination_stars_store::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/01_bgi_store.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

#illumination_stars_ec .itemFlex h2,
#illumination_stars_ec .itemPrice,
#illumination_stars_ec .number{
	color: #000000;
}

#illumination_stars_ec .prev-arrow::before,
#illumination_stars_ec .prev-arrow::after,
#illumination_stars_ec .next-arrow::before,
#illumination_stars_ec .next-arrow::after{
	background: #000000;
}

/* アンティーカ */
#antica_ec::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/02_bgi_ec.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

#antica_ec .secInner{
	background: #853998;
}

#antica_store::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1534;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/02_bgi_store.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

/* 放課後クライマックスガールズ */
#after_school_climax_girls_ec::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/03_bgi_ec.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

#after_school_climax_girls_ec .secInner{
	background: #fa8333;
}

#after_school_climax_girls_store::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/03_bgi_store.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

/* アルストロメリア */
#alstroemeria_ec::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/04_bgi_ec.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

#alstroemeria_ec .secInner{
	background: #ff699e;
}

#alstroemeria_store::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/04_bgi_store.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

/* ストレイライト */
#straylight_ec::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/05_bgi_ec.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

#straylight_ec .secInner{
	background: #af011c;
}

#straylight_store::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/05_bgi_store.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

/* ノクチル */
#noctchill_ec::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/06_bgi_ec.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

#noctchill_ec .secInner{
	background: #384d98;
}

#noctchill_store::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/06_bgi_store.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

.goodsLink{
	display: block;
	width: 80%;
	max-width: 800px;
	margin: 40px auto 0;
	padding: 15px 0;
	text-align: center;
	font-size: 12px;
	font-weight: 500;
	text-decoration: none;
	color: #ffffff;
	border: 1px solid #ffffff;
	transition: 0.2s
}

.goodsLink span:nth-child(1){
	display: block;
}

#noctchill_ec .goodsLink:hover{
	background: #ffffff;
	color: #384d98;
}

#noctchill_store .goodsLink:hover{
	background: #ffffff;
	color: #15334f;
}

/* シーズ */
#shhis_ec::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/07_bgi_ec.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

#shhis_ec .secInner{
	background: #008e74;
}

#shhis_store::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/07_bgi_store.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

/* コメティック */
#cometik_ec::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/08_bgi_ec.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

#cometik_ec .secInner{
	background: #0c0c0c;
}

#cometik_store::before{
	content: "";
	width: 100%;
	height: auto;
	aspect-ratio: 2560 / 1440;
	background: url("../img/logo_shinycolors_b_03.png") right 10px bottom 10px no-repeat, url("../img/08_bgi_store.jpg") center top no-repeat;
	background-size: 70px auto, contain;
}

/* キャンペーン
-------------------------------------------------- */
#campaign{
	background: #ebefef;
	padding: 40px 0 !important;
}

.cpInner{
	box-sizing: border-box;
	width: 90%;
	margin: 0 auto;
	background: #ffffff;
	padding: 30px 20px;
	border-radius: 20px;
}

.cpInner:not(:last-child){
	margin-bottom: 40px;
}

.cpInner h2{
	display: block;
	width: 100%;
	font-size: 18px;
	font-weight: 500;
	text-align: center;
	margin-bottom: 20px;
}

.cpImg img{
	width: 100%;
}

.cpDetail{
	font-size: 14px;
	line-height: 1.8em;
	margin-top: 20px;
}

.cpDetail li{
	margin: 5px 0;
	padding-left: 1em;
	text-indent: -1em;
}

.cpDetail a{
	color: #15334f;
	text-decoration: underline;
}

.cpDetail .schedule{
	margin: 30px 0;
	padding: 30px 0;
	border-top: 1px solid #000000;
	border-bottom: 1px solid #000000;
}

.cpDetail .schedule h3{
	font-size: 14px;
	font-weight: 400;
	text-align: center;
	margin-bottom: 15px;
}

.cpDetail .schedule p{
	text-align: center;
	font-size: 24px;
	line-height: 24px;
	height: 24px;
	font-family: "DIN 2014", sans-serif;
}

.cpDetail .schedule p span{
	font-size: 18px;
	margin: 0 0.2em;
}

.cpDetail .cpLink{
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 200px;
	margin: 0 auto;
	background: #000000;
	padding: 15px 0;
	text-align: center;
	position: relative;
	font-size: 12px;
	color: #ffffff;
	text-decoration: none;
	transition: 0.2s;
}

.cpDetail .cpLink i{
	position: absolute;
	top: 50%;
	right: 20px;
	font-size: 16px;
	margin-top: -8px;
	transition: 0.2s;
}

/* ノクチルグッズ
-------------------------------------------------- */
#noctchill_goods{
	margin-top: 0;
	padding-top: 40px;
}

#noctchill_goods h2{
	display: block;
	width: 90%;
	margin: 0 auto;
	font-size: 24px;
	font-weight: 400;
	text-align: center;
	color: #3e5f88;
}

.noctchill_bnr{
	display: block;
	width: 90%;
	margin: 40px auto;
}

.noctchill_bnr img{
	width: 100%;
}

.partnerLogo{
	box-sizing: border-box;
	padding: 30px 20px;
	text-align: center;
	width: 90%;
	border-top: 1px solid #15334f;
	margin: 60px auto 0;
	position: relative;
}

.partnerLogo::before{
	content: "";
	display: block;
	width: 100%;
	border-top: 1px solid #41638d;
	position: absolute;
	top: 1px;
	left: 0;
}

.partnerLogo img{
	width: 90%;
	max-width: 200px;
}

/* フッター
-------------------------------------------------- */
footer{
	padding: 40px 20px;
	background: #000000;
}

.f_inner{
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
}

.f_inner > a{
	display: flex;
	justify-content: space-between;
	align-items: center;
	box-sizing: border-box;
	width: 100%;
	background: #ffffff;
	border-radius: 5px;
	margin-bottom: 20px;
	padding: 15px 20px;
	text-decoration: none;
	font-size: clamp(16px, 1.5vw, 18px);
	color: #333333;
	font-weight: 600;
}

.f_inner > a i{
	font-size: 24px;
}

.sns{
	display: flex;
	box-sizing: border-box;
	justify-content: space-between;
	padding: 0 20px;
	margin-top: 40px;
}

.sns li{
	width: 18%;
}

.sns li a{
	display: flex;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
	border-radius: 100%;
	background: #333333;
	aspect-ratio: 1;
}

.sns li a img{height: 60%;}
.sns li:nth-child(1) a img{height: 50%;}

.official_app{
	font-size: clamp(16px, 1.5vw, 18px);

	color: #ffffff;
	font-weight: 600;
	margin-top: 40px;
	text-align: center;
}

.download{
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

.download a{
	display: block;
	margin: 0 10px;
}

.download img{
	width: 100%;
	height: 80px;
	object-fit: contain;
}

.copyright{
	background: #333333;
	color: #ffffff;
	font-size: clamp(14px, 1.3vw, 16px);
	text-align: center;
	padding: 10px 0;
}
}

@keyframes popZoom_pc{
	0%{transform: scale(0);}
	30%{transform: scale(1);}
	100%{transform: scale(1);}
}

@keyframes popLeft_pc{
	0%{width: 0; padding: 20px 0;}
	10%{width: 0; padding: 20px 0;}
	20%{width: 100%; padding: 20px;}
	100%{width: 100%; padding: 20px;}
}

@keyframes popZoom_sp{
	0%{transform: scale(0);}
	15%{transform: scale(1);}
	100%{transform: scale(1);}
}

@keyframes popLeft_sp{
	0%{width: 0; padding: 10px 0;}
	10%{width: 0; padding: 10px 0;}
	20%{width: 100%; padding: 10px;}
	100%{width: 100%; padding: 10px;}
}