@charset "utf-8";

/* font
================================================== */
@import url('https://fonts.googleapis.com/css2?family=Besley:wght@400..900&family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@600&family=Roboto:wght@100..900&display=swap');

/* root
================================================== */
:root{
	/* font-size */
	--contents-font-size:14px;
	--button-font-size:16px;
	
	/* color */
	--default-color:#000;
	--notes-color:#666;
	--notice-color:#E71D36;
	
	/* font-family */
	--font-ja:'Noto Sans JP';
	--font-ja-serif:'Noto Serif JP';
	--font-en:'Roboto';
	--font-en-serif:'Besley';
	
	/* border */
	--default-border:#FFF;
	--table-border:rgba(0,0,0,0.22);
	--tracklist-border:rgba(0,0,0,0.22);
	
	/* background */
	--default-background:#FFF;
	--pink-background:#F4B8BA;
	--blue-background:#ABDDF6;
	--green-background:#6DB0C0;
	--other-background:#E89899;
	--form-background:#b6d7df;
	
	/* button */
	--button-color:#FFF;
	--button-background:#6DB0C0;
	--nolink-color:color-mix(in srgb,#FFF 65%,transparent);
	--nolink-background:color-mix(in srgb,#000 10%,transparent);
}
@media screen and (max-width:800px){
	:root{
		--contents-font-size:14px;
		--button-font-size:15px;
	}
}

/* reset
================================================== */
*:where(:not(iframe,img,svg):not(svg *)){all:unset;display:revert;}
*,*::before,*::after{box-sizing:border-box;}
body{position:relative;width:100%;font-size:14px;line-height:1.5;color:var(--default-color);font-family:var(--font-ja),sans-serif;font-weight:400;-webkit-text-size-adjust:100%;}
footer,header,main,section,picture{display:block;}
table{border-collapse:collapse;border-spacing:0;}
ol,ul{list-style:none;}
img{width:100%;height:auto;vertical-align:top;}
a{margin:0;padding:0;color:#FFF;vertical-align:bottom;background:transparent;cursor:pointer;}
a:link,a:visited,a:hover,a:active{text-decoration:none;}

/* Miku Tanaka
================================================== */
html,body{
	height:100%;
}
body{
	background:var(--default-background);
}

/* header
-------------------------------------------------- */
body #header{
	text-align:center;
	background:var(--pink-background);
}
body#index #header .inner{
	width:fit-content;
	margin-inline:auto;
	padding:36px min(4.5vw,30px) 50px;
}
body#index #header .visual{
	width:360px;
	margin-inline:auto;
}
body#index #header .number{
	margin-block-start:44px;
	font-size:14px;
	font-family:var(--font-ja);
	font-weight:400;
}
body#index #header .logo{
	width:fit-content;
	height:100px;
	margin-block-start:18px;
	margin-inline:auto;
}
body#index #header .logo img{
	width:auto;
	height:100px;
}
body#index #header .release{
	margin-block:36px 37px;
	font-size:24px;
	font-family:var(--font-en-serif);
	font-weight:600;
}
body#index #header .release span{
	font-size:18px;
}
body#index #header .purchase{
	display:grid;
	grid-template-columns:repeat(2,128px);
	column-gap:15px;
	width:fit-content;
	margin-inline:auto;
}
body#index #header .purchase .button{
	column-gap:8px;
	min-height:46px;
	font-size:14px;
	line-height:1;
	font-family:var(--font-en);
}
body#index #header .purchase img[alt="SHOP"]{
	width:20px;
	height:auto;
}
body#index #header .purchase img[alt="DIGITAL"]{
	width:17px;
	height:auto;
}
body#index #header .purchase span{
	padding-block:2px 0;
}
body#event #header .inner{
	padding:18px min(4.5vw,30px) 22px;
}
body#event #header .number{
	font-size:12px;
	font-family:var(--font-ja);
	font-weight:400;
}
body#event #header .logo{
	width:fit-content;
	height:64px;
	margin-block-start:12px;
	margin-inline:auto;
}
body#event #header .logo img{
	width:auto;
	height:64px;
}
body#form #header .inner{
	padding:36px min(4.5vw,30px) 33px;
}
body#form #header .number{
	font-size:12px;
	font-family:var(--font-ja);
	font-weight:400;
}
body#form #header .logo{
	width:fit-content;
	height:64px;
	margin-block-start:17px;
	margin-inline:auto;
}
body#form #header .logo img{
	width:auto;
	height:64px;
}
body#form #header .campaign{
	margin-block-start:26px;
	font:600 19px/1.2 var(--font-ja-serif);
}
@media screen and (max-width:800px){
	body#index #header .inner{
		padding-block:48px;
	}
	body#index #header .visual{
		width:50vw;
	}
	body#index #header .number{
		margin-block-start:41px;
		font-size:13px;
	}
	body#index #header .logo{
		height:80px;
		margin-block-start:17px;
	}
	body#index #header .logo img{
		height:80px;
	}
	body#index #header .release{
		margin-block:29px 31px;
		font-size:22px;
	}
	body#index #header .release span{
		font-size:16px;
	}
	body#index #header .purchase{
		column-gap:12px;
	}
	body#event #header .inner{
		padding-block:17px 20px;
	}
	body#event #header .number{
		font-size:11px;
	}
	body#event #header .logo{
		height:58px;
		margin-block-start:12px;
	}
	body#event #header .logo img{
		height:58px;
	}
	body#form #header .inner{
		padding-block:33px 28px;
	}
	body#form #header .number{
		font-size:11px;
	}
	body#form #header .logo{
		height:58px;
			margin-block-start:15px;
	}
	body#form #header .logo img{
		height:58px;
	}
	body#form #header .campaign{
		margin-block-start:21px;
		font-size:18px;
	}
}
@media screen and (max-width:599px){
	body#index #header .inner{
		padding-block:45px;
	}
	body#index #header .visual{
		width:70vw;
	}
	body#index #header .number{
		margin-block-start:31px;
		font-size:12px;
	}
	body#index #header .logo{
		height:66px;
		margin-block-start:15px;
	}
	body#index #header .logo img{
		height:66px;
	}
	body#index #header .release{
		margin-block:23px 28px;
		font-size:20px;
	}
	body#index #header .release span{
		font-size:14px;
	}
	body#index #header .purchase{
		column-gap:10px;
	}
	body#event #header .inner{
		padding-block:15px 18px;
	}
	body#event #header .number{
		font-size:10px;
	}
	body#event #header .logo{
		height:52px;
		margin-block-start:10px;
	}
	body#event #header .logo img{
		height:52px;
	}
	body#form #header .inner{
		padding-block:27px 23px;
	}
	body#form #header .number{
		font-size:10px;
	}
	body#form #header .logo{
		height:52px;
		margin-block-start:13px;
	}
	body#form #header .logo img{
		height:52px;
	}
	body#form #header .campaign{
		margin-block-start:18px;
		font-size:17px;
	}
}

/* footer
-------------------------------------------------- */
footer{
	position:sticky;
	top:100vh;
	background:var(--pink-background);
}
footer .inner{
	width:fit-content;
	margin-inline:auto;
	padding:38px min(4.5vw,30px);
}
footer .logo{
	width:120px;
	margin-inline:auto;
}
footer .text{
	margin-block:20px 35px;
	line-height:1.6;
	font-weight:600;
	text-align:center;
}
footer .text span{
	display:inline-block;
}
footer .sns{
	display:grid;
	grid-template-columns:repeat(4,auto);
	column-gap:18px;
	width:fit-content;
	height:38px;
	margin-inline:auto;
	line-height:1;
}
footer .sns a{
	display:grid;
	place-items:center;
	width:38px;
	height:38px;
	border-radius:50%;
	background:#000;
	transition:0.3s;
}
footer .sns img{
	width:auto;
	height:22px;
}
footer .sns li:nth-child(4) img{
	width:22px;
	height:auto;
}
@media screen and (max-width:800px){
	footer .inner{
		padding-block:30px;
	}
	footer .logo{
		width:88px;
	}
	footer .text{
		margin-block:17px 27px;
	}
	footer .sns{
		column-gap:12px;
		height:36px;
	}
	footer .sns a{
		width:36px;
		height:36px;
	}
	footer .sns img{
		height:20px;
	}
	footer .sns li:nth-child(4) img{
		width:20px;
	}
}
@media (any-hover:hover){
	footer .sns a:hover{
		transform:scale(1.2);
	}
}

/* common
-------------------------------------------------- */
.mobile{
	display:none;
}
.contents .inner{
	max-width:1000px;
	margin-inline:auto;
	padding:119px min(4.5vw,30px) 130px;
}
.contents:has(:lang(en)) .inner{
	padding-block-start:116px;
}
.heading{
	font:600 35px/1.2 var(--font-ja-serif);
	text-align:left;
}
.heading:lang(en){
	margin-block-end:52px;
	font-size:38px;
	font-family:var(--font-en-serif);
	font-weight:400;
}
@media screen and (max-width:800px){
	.pc{
		display:none;
	}
	.mobile{
		display:block;
	}
	.contents .inner{
		max-width:700px;
		padding-block:80px 90px;
	}
	.contents:has(:lang(en)) .inner{
		padding-block-start:79px;
	}
	.heading{
		font-size:25px;
	}
	.heading:lang(en){
		margin-block-end:42px;
		font-size:26px;
	}
}

/* .button */
.button{
	position:relative;
	display:flex;
	justify-content:center;
	align-items:center;
	width:100%;
	min-height:54px;
	font-size:var(--button-font-size);
	line-height:1.5;
	color:var(--button-color);
	font-weight:500;
	border-radius:27px;
	background:var(--button-background);
	transition:opacity 0.3s;
	cursor:pointer;
}
.nolink.button{
	color:var(--nolink-color);
	background:var(--nolink-background);
	cursor:default;
	pointer-events:none;
}/*
.nolink.button img,
.nolink.button span{
	opacity:0.6;
}*/
@media screen and (max-width:800px){
	.button{
		min-height:46px;
	}
}
@media (any-hover:hover){
	.button:hover{
		opacity:0.7;
	}
	.nolink.button:hover,
	.nolink.button:hover::after{
		opacity:1;
	}
}

/* #disc, #cassette
-------------------------------------------------- */
#disc .products,
#cassette .products{
	display:grid;
	grid-template-columns:min(40vw,400px) 1fr;
	column-gap:min(3.75vw,45px);
}
#disc .products+.products{
	margin-block-start:121px;
}
#disc .details,
#cassette .details{
	padding-block-start:2px;
}
#disc .details .type,
#cassette .details .type{
	font-size:20px;
	line-height:1;
	font-family:var(--font-en);
	font-weight:700;
}
#disc .details .notice,
#cassette .details .notice{
	margin-block-start:5px;
	font-size:13px;
	font-weight:400;
	color:#666;
}
#disc .details .item,
#cassette .details .item{
	display:flex;
	column-gap:4px;
	width:fit-content;
	margin-block-start:22px;
}
#disc .details .icon,
#cassette .details .icon{
	padding:4px 8px 1px 8px;
	font-size:14px;
	line-height:1;
	font-family:var(--font-en);
	font-weight:500;
	border:1px solid rgba(0,0,0,0.5);
}
#disc .details .metadata,
#cassette .details .metadata{
	display:flex;
	margin-block-start:17px;
	font-size:14px;
	line-height:1;
	font-family:var(--font-en);
	font-weight:500;
}
#disc .details .metadata li:not(:first-of-type)::before,
#cassette .details .metadata li:not(:first-of-type)::before{
	display:inline-block;
	padding-inline:0.5em;
	content:'/';
}
#disc .details .track,
#cassette .details .track{
	margin-block-start:29px;
}
#disc .details .format,
#cassette .details .format{
	padding-block-end:14px;
	font-size:15px;
	line-height:1;
	font-family:var(--font-en-serif);
	font-weight:400;
}
#disc .details dd+.format{
	margin-block-start:32px;
}
#disc .details .tracklist,
#cassette .details .tracklist{
	border-block-start:1px solid var(--tracklist-border);
	counter-reset:track;
}
#disc .details .tracklist li,
#cassette .details .tracklist li{
	position:relative;
	padding:9px 0 10px 2ex;
	font-size:14px;
	line-height:1.5;
	font-weight:400;
	border-block-end:1px solid var(--tracklist-border);
}
#disc .details .tracklist li::before,
#cassette .details .tracklist li::before{
	position:absolute;
	top:10px;
	left:0;
	font-size:14px;
	font-family:var(--font-en);
	font-weight:400;
	counter-increment:track;
	content:counter(track,decimal)'.';
}
#disc .details .spec{
	margin-block-start:31px;
}
#disc .details .title{
	margin-block-end:8px;
	font-size:15px;
	font-weight:700;
}
#disc .details .title::before{
	content:'\25A0';
}
#disc .details .list li{
	position:relative;
	padding-inline-start:14px;
}
#disc .details .list li::before{
	position:absolute;
	top:9px;
	left:5px;
	display:block;
	width:4px;
	height:4px;
	border-radius:50%;
	background:#000;
	content:'';
}
#disc .details .list li:not(:first-child){
	margin-block-start:4px;
}
#disc .details .list sup{
	font-size:10px;
	vertical-align:super;
}
#disc .details .notes{
	display:grid;
	grid-template-columns:auto;
	row-gap:5px;
	margin-block-start:13px;
}
#disc .details .notes li{
	display:grid;
	grid-template-columns:2em 1fr;
	font-size:13px;
	color:#666;
}
#disc .details .acrylic{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:5px;
	margin-block-start:28px;
}
#disc .details .acrylic dt{
	grid-row:2/3;
	grid-column:1/3;
	font-weight:600;
	text-align:center;
}
#disc .details .tradingcards{
	display:grid;
	grid-template-columns:auto;
	gap:5px;
	margin-block-start:27px;
}
#disc .details .tradingcards dt{
	grid-row:2/3;
	font-weight:600;
	text-align:center;
}
#disc .details .acrylic dt span,
#disc .details .tradingcards dt span{
	font-size:10px;
}
@media screen and (max-width:800px){
	#disc .products,
	#cassette .products{
		grid-template-columns:auto;
		row-gap:28px;
	}
	#disc .products+.products{
		margin-block-start:81px;
	}
	#disc .thumbnail,
	#cassette .thumbnail{
		width:75vw;
		margin-inline:auto;
	}
	#disc .details,
	#cassette .details{
		padding:0;
	}
	#disc .details .acrylic,
	#disc .details .tradingcards{
		width:75vw;
		margin-inline:auto;
	}
}

/* #cassette
-------------------------------------------------- */
#cassette{
	background:var(--blue-background);
}

/* #video
-------------------------------------------------- */
#video .video{
	width:100%;
	aspect-ratio:16/9;
}
#video .video iframe{
	width:100%;
	height:100%;
}
@media screen and (max-width:800px){
	#video .video{
		width:75vw;
		margin-inline:auto;
	}
}

/* #benefits
-------------------------------------------------- */
#benefits{
	background:var(--pink-background);
}
#benefits .inner{
	padding-block-end:127px;
}
#benefits .list{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:57px 15px;
	margin-block-start:57px;
}
#benefits .thumbnail{
	padding:18px;
	background:#FFF;
}
#benefits .shop{
	margin-block-start:15px;
	font-size:16px;
	font-weight:700;
}
#benefits .items{
	margin-block-start:5px;
	font-size:14px;
	font-weight:500;
}
#benefits .items+.items{
	margin:0;
}
#benefits .items br{
	display:none;
}
#benefits .notes{
	padding-inline-start:1em;
	font-size:13px;
	color:#666;
	font-weight:500;
	text-indent:-1em;
}
@media screen and (max-width:800px){
	#benefits .inner{
		padding-block-end:87px;
	}
	#benefits .list{
		grid-template-columns:repeat(2,1fr);
		gap:45px 10px;
		margin-block-start:46px;
	}
}
@media screen and (max-width:649px){
	#benefits .list{
		grid-template-columns:auto;
	}
	#benefits .thumbnail{
		width:75vw;
		margin-inline:auto;
	}
}

/* #serial
-------------------------------------------------- */
#serial{
	background:var(--blue-background);
}
#serial:not(:has(.link)) .inner{
	padding-block-end:128px;
}
#serial .text{
	margin-block-start:51px;
	font-size:15px;
	line-height:1.75;
	font-weight:500;
}
#serial .outline{
	margin-block-start:55px;
	border-block-start:1px solid var(--table-border);
}
#serial .item{
	padding-block:30px 29px;
	border-block-end:1px solid var(--table-border);
}
#serial .name{
	display:grid;
	grid-template-columns:59px 1fr;
	align-items:center;
	column-gap:25px;
}
#serial .name .prize{
	position:relative;
	padding-inline-end:15px;
	font-size:50px;
	line-height:1;
	font-family:var(--font-en);
	font-weight:900;
	text-align:center;
}
#serial .name .prize span{
	position:absolute;
	right:0;
	bottom:9px;
	display:block;
	font-size:15px;
	font-family:var(--font-ja);
	font-weight:700;
}
#serial .name .title{
	display:flex;
	align-items:center;
	column-gap:20px;
	width:fit-content;
	padding-block-end:2px;
	font-size:20px;
	font-weight:700;
}
#serial .name .title br{
	display:none;
}
#serial .name .title .number{
	display:flex;
	align-items:end;
	width:fit-content;
	padding:7px 15px 9px;
	font-size:15px;
	line-height:1;
	color:#FFF;
	border-radius:5px;
	background:#000;
}
#serial .name .title .number span{
	display:inline-block;
	padding-block:0 1px;
	font-size:10px;
}
#serial .name .title .number span:first-of-type{
	padding-inline:0 7px;
}
#serial .name .title .number span:last-of-type{
	padding-inline:3px 0;
}
#serial .all{
	margin-block-start:125px;
	border-block-start:1px solid var(--table-border);
}
#serial:not(:has(.link)) .all{
	margin-block-start:123px;
}
#serial .all .item{
	padding-block:39px 40px;
}
#serial .all .name{
	grid-template-columns:auto 1fr;
}
#serial .all .name .prize{
	position:static;
	padding-inline-end:0;
	font-size:20px;
	font-weight:700;
	text-align:left;
}
#serial .all .name .title{
	padding-block-end:0;
}
#serial .application{
	margin-block-start:39px;
	text-align:center;
}
#serial .application .title{
	font-size:20px;
	font-weight:700;
}
#serial .application .period{
	display:grid;
	grid-template-columns:repeat(2,auto);
	width:fit-content;
	margin-inline:auto;
}
#serial .application .date{
	position:relative;
	margin-block-start:17px;
	font-size:24px;
	line-height:1;
	font-family:var(--font-en-serif);
	font-weight:600;
}
#serial .application .date span{
	font-size:18px;
}
#serial .application .end{
	padding-inline-start:36px;
}
#serial .application .end::before{
	position:absolute;
	top:50%;
	left:12px;
	display:block;
	width:12px;
	height:1px;
	background:#000;
	content:'';
}
#serial .link{
	width:320px;
	margin-block-start:43px;
	margin-inline:auto;
}
@media screen and (max-width:800px){
	#serial:not(:has(.link)) .inner{
		padding-block-end:88px;
	}
	#serial .text{
		margin-block-start:40px;
		font-size:14px;
	}
	#serial .outline{
		margin-block-start:47px;
	}
	#serial .item{
		padding-block:22px 28px;
	}
	#serial .name{
		grid-template-columns:auto;
		row-gap:10px;
	}
	#serial .name .prize{
		width:fit-content;
		margin-inline:auto;
		padding-inline-end:17px;
		font-size:44px;
	}
	#serial .name .prize span{
		bottom:8px;
		font-size:14px;
	}
	#serial .name .title{
		display:grid;
		grid-template-columns:auto;
		place-items:center;
		row-gap:11px;
		width:100%;
		padding:0;
		font-size:18px;
		text-align:center;
	}
	#serial .name .title .number{
		padding:4px 22px 5px;
	}
	#serial .all{
		margin-block-start:85px;
	}
	#serial:not(:has(.link)) .all{
		margin-block-start:83px;
	}
	#serial .all .name{
		row-gap:16px;
	}
	#serial .all .item{
		padding-block:28px 24px;
	}
	#serial .all .name{
		grid-template-columns:auto;
	}
	#serial .application{
		margin-block-start:30px;
	}
	#serial .application .title{
		font-size:18px;
	}
	#serial .application .date{
		margin-block-start:15px;
		font-size:22px;
	}
	#serial .application .date span{
		font-size:16px;
	}
	#serial .link{
		width:100%;
		margin-block-start:33px;
	}
}
@media screen and (max-width:649px){
	#serial .link{
		width:75vw;
		margin-inline:auto;
	}
}
@media screen and (max-width:599px){
	#serial .name .title br{
		display:block;
	}
	#serial .application .period{
		grid-template-columns:auto;
	}
	#serial .application .end{
		margin:0;
		padding-block-start:31px;
		padding-inline-start:0;
	}
	#serial .application .end::before{
		top:10px;
		left:50%;
		width:1px;
		height:12px;
	}
}

/* #event
-------------------------------------------------- */
#event .event+.event{
	margin-block-start:116px;
}
#event .heading:lang(en){
	margin-block-end:44px;
}
#event .subheading{
	margin-block-end:39px;
	font-size:26px;
	font-family:var(--font-ja-serif);
	font-weight:600;
}
#event .subheading br{
	display:none;
}
#event .list{
	border-block-start:1px solid var(--table-border);
}
#event .list li{
	display:grid;
	grid-template-columns:1fr 158px;
	column-gap:30px;
	padding-block:28px 30px;
	border-block-end:1px solid var(--table-border);
}
#event .list li:not(:has(.link)){
	grid-template-columns:auto;
}
#event .date{
	font-size:18px;
	line-height:1;
	font-family:var(--font-en-serif);
	font-weight:600;
}
#event .date span{
	font-size:14px;
}
#event .title{
	margin-block:10px 25px;
	font-size:20px;
	font-weight:700;
}
#event .schedule{
	display:flex;
	column-gap:8px;
}
#event .schedule dt,
#event .schedule dd{
	font-size:16px;
	text-align:center;
	border-radius:14px;
	border:1px solid #000;
}
#event .schedule dt{
	width:234px;
	padding-block:3px;
	line-height:1.25;
	font-weight:700;
}
#event .schedule dd{
	padding-block:6px 4px;
	padding-inline:20px;
	line-height:1;
	font-family:var(--font-en);
	color:#FFF;
	font-weight:500;
	background:#000;
}
#event .schedule dd span{
	display:inline-block;
	padding-inline:1ex;
	font-size:12px;
}
#event .link{
	align-self:end;
}
#event .link .button{
	height:46px;
	min-height:initial;
}
@media screen and (max-width:800px){
	#event .event+.event{
		margin-block-start:79px;
	}
	#event .heading:lang(en){
		margin-block-end:37px;
	}
	#event .subheading{
		margin-block-end:30px;
		font-size:21px;
	}
	#event .list li{
		grid-template-columns:auto;
		row-gap:22px;
		padding-block:20px 22px;
	}
	#event .date{
		font-size:17px;
	}
	#event .date span{
		font-size:13px;
	}
	#event .title{
		margin-block:11px 18px;
		font-size:18px;
	}
	#event .link{
		align-self:unset;
	}
}
@media screen and (max-width:649px){
	#event .link{
		width:75vw;
		margin-inline:auto;
	}
}
@media screen and (max-width:599px){
	#event .subheading br{
		display:block;
	}
	#event .schedule{
		display:grid;
		gap:5px;
	}
	#event .schedule.one{
		grid-template-columns:auto;
	}
	#event .schedule.two{
		grid-template-columns:repeat(2,1fr);
	}
	#event .schedule.two dt{
		grid-column:1/3;
	}
	#event .schedule dt,
	#event .schedule dd{
		height:26px;
		font-size:14px;
	}
	#event .schedule dt{
		width:100%;
	}
	#event .schedule dd{
		padding-inline:0;
	}
	#event .schedule dd span{
		font-size:11px;
	}
}

/* #information */
#information .inner{
	padding-block:125px 126px;
	font-size:15px;
	font-weight:500;
}
#information a{
	color:#000;
	text-decoration:underline;
}
#information .subheading{
	margin-block-end:21px;
	font-size:22px;
}
#information .notes{
	display:grid;
	row-gap:4px;
}
#information .notes li{
	padding-inline-start:1em;
	font-size:15px;
	text-indent:-1em;
}
#information #introduction .icon{
	width:fit-content;
	padding:2px 20px 4px;
	font-size:18px;
	color:#FFF;
	font-family:var(--font-en-serif);
	font-weight:600;
	border-radius:5px;
	background:#000;
}
#information #introduction .icon .day{
	font-size:14px;
}
#information #introduction .icon span:lang(ja){
	font-family:var(--font-ja-serif);
	font-weight:700;
}
#information #introduction .heading{
	margin-block-start:14px;
	font-size:26px;
	line-height:1.5;
}
#information #introduction .text{
	margin-block-start:48px;
	line-height:1.75;
}
#information #details .content{
	margin-block-start:45px;
	padding-block-start:38px;
	border-block-start:1px solid var(--table-border);
}
#information #details #venue{
	margin-block-start:120px;
}
#information #details #venue .name,
#information #details #venue .address{
	margin-block-end:4px;
}
#information #details #venue .name{
	font-weight:700;
}
#information #details #date .event{
	font-weight:700;
}
#information #details #date dl{
	display:grid;
	grid-template-columns:repeat(2,auto);
	row-gap:4px;
	width:fit-content;
	margin-block-start:13px;
}
#information #details #program ul{
	display:flex;
}

#information #details #program li:not(:first-child)::before{
	display:inline-block;
	padding-inline:0.8ex;
	content:'+';
}
#information #details #item .target{
	font-weight:700;
}
#information #details #item .type{
	display:grid;
	row-gap:23px;
	margin-block-start:12px;
	counter-reset:version;
}
#information #details #item .version{
	position:relative;
	padding-inline-start:2ex;
}
#information #details #item .version::before{
	position:absolute;
	top:0;
	left:0;
	font-weight:700;
	counter-increment:version;
	content:counter(version)'.';
}
#information #details #item .version p{
	font-weight:700;
}
#information #details #item .specification{
	display:grid;
	grid-template-columns:4em auto;
	gap:4px 1.5em;
	margin-block-start:8px;
}
#information #details #item .benefits{
	display:grid;
	row-gap:4px;
}
#information #details #item .benefits li{
	position:relative;
	padding-inline-start:14px;
}
#information #details #item .benefits li::before{
	position:absolute;
	top:10px;
	left:5px;
	display:block;
	width:4px;
	height:4px;
	border-radius:50%;
	background:#000;
	content:'';
}
#information #details #benefit .limit,
#information #details #benefit .about{
	margin-block-start:23px;
}
#information #details #benefit .limit dt,
#information #details #benefit .about dt{
	margin-block-end:7px;
	font-weight:700;
}
#information #details #benefit .limit dt::before,
#information #details #benefit .about dt::before{
	content:'\FF1C';
}
#information #details #benefit .limit dt::after,
#information #details #benefit .about dt::after{
	content:'\FF1E';
}
#information #details #benefit .about ul{
	display:grid;
	row-gap:4px;
	font-weight:700;
	counter-reset:about;
}
#information #details #benefit .about li{
	position:relative;
	padding-inline-start:2ex;
}
#information #details #benefit .about li::before{
	position:absolute;
	top:0;
	left:0;
	font-weight:700;
	counter-increment:about;
	content:counter(about)'.';
}
#information #details #benefit .notes{
	margin-block-start:22px;
}
#information #details #participation .details{
	margin-block-start:22px;
}
#information #details #participation .title{
	margin-block:0 7px;
	font-size:15px;
}
#information #details #participation .title::before{
	content:'\FF1C';
}
#information #details #participation .title::after{
	content:'\FF1E';
}
#information #details #participation .type{
	display:grid;
	grid-template-columns:auto 1fr;
	column-gap:0.5ex;
}
#information #details #participation .part{
	font-weight:700;
}
#information #details #participation .part::before{
	content:'\3010';
}
#information #details #participation .part::after{
	content:'\3011';
}
#information #details #participation .one{
	margin-block-start:12px;
}
#information #details #participation .two{
	margin-block-start:12px;
}
#information #details #participation .event{
	counter-reset:part;
}
#information #details #participation .name{
	position:relative;
	padding-inline-start:4ex;
}
#information #details #participation .name::before{
	position:absolute;
	top:0;
	left:0;
	font-weight:700;
	counter-increment:part;
}
#information #details #participation .one .name::before{
	content:'1-'counter(part);
}
#information #details #participation .two .name::before{
	content:'2-'counter(part);
}
#information #details #participation .name+.name{
	margin-block-start:7px;
}
#information #details #participation .name p{
	font-weight:700;
}
#information #details #participation .name .notes{
	margin-block-start:4px;
}
#information #details #participation .howto{
	margin-block-start:22px;
}
#information #details #participation .explanation{
	display:grid;
	row-gap:12px;
}
#information #details #participation .explanation dt{
	margin-block-end:7px;
	font-weight:700;
}
#information #details #participation .explanation dt::before{
	content:'\3010';
}
#information #details #participation .explanation dt::after{
	content:'\3011';
}
#information #details #participation .explanation .notes{
	margin-block-start:4px;
}
#information #details #participation .payment{
	margin-block-start:22px;
}
#information #details #inquiry .support{
	margin-block-end:4px;
	font-weight:700;
}
#information #details #inquiry .notes{
	margin-block-start:7px;
}
@media screen and (max-width:800px){
	#information .inner{
		padding-block:85px 87px;
		font-size:14px;
	}
	#information .subheading{
		margin-block-end:16px;
		font-size:19px;
	}
	#information .notes li{
		font-size:14px;
	}
	#information .notes{
		row-gap:5px;
	}
	#information #introduction .icon{
		padding:2px 15px;
		font-size:15px;
	}
	#information #introduction .icon .day{
		font-size:11px;
	}
	#information #introduction .heading{
		margin-block-start:12px;
		font-size:21px;
	}
	#information #introduction .text{
		margin-block-start:36px;
	}
	#information #details .content{
		margin-block-start:41px; 
		padding-block-start:35px;
	}
	#information #details #venue{
		margin-block-start:81px;
	}
	#information #details #venue .name,
	#information #details #venue .address{
		margin-block-end:5px;
	}
	#information #details #date dl{
		row-gap:5px;
	}
	#information #details #item .type{
		margin-block-start:13px;
	}
	#information #details #item .specification{
		gap:5px 1em;
	}
	#information #details #item .benefits{
		row-gap:5px;
	}
	#information #details #item .benefits li::before{
		top:9px;
	}
	#information #details #benefit .limit dt,
	#information #details #benefit .about dt{
		margin-block-end:8px;
	}
	#information #details #benefit .about ul{
		row-gap:5px;
	}
	#information #details #benefit .notes{
		margin-block-start:23px;
	}
	#information #details #participation .details{
		margin-block-start:23px;
	}
	#information #details #participation .title{
		margin-block-end:8px;
		font-size:14px;
	}
	#information #details #participation .one{
		margin-block-start:13px;
	}
	#information #details #participation .two{
		margin-block-start:13px;
	}
	#information #details #participation .name+.name{
		margin-block-start:8px;
	}
	#information #details #participation .name .notes{
		margin-block-start:5px;
	}
	#information #details #participation .howto{
		margin-block-start:23px;
	}
	#information #details #participation .explanation{
		row-gap:13px;
	}
	#information #details #participation .explanation dt{
		margin-block-end:8px;
	}
	#information #details #participation .explanation .notes{
		margin-block-start:5px;
	}
	#information #details #participation .payment{
		margin-block-start:23px;
	}
	#information #details #inquiry .support{
		margin-block-end:5px;
	}
	#information #details #inquiry .notes{
		margin-block-start:8px;
	}
}

/* #form
-------------------------------------------------- */
/* common */
.main{
	font-size:15px;
	line-height:1.75;
	font-weight:500;
}
.main a:not(.button){
	color:#000;
	text-decoration:underline;
}
.main .contents{
	max-width:940px;
	margin-inline:auto;
	padding:118px min(2vw,20px) 155px;
}
.main .inner{
	max-width:initial;
	padding:0;
}
.main .inner+.inner{
	margin-block-start:81px;
	padding-block-start:78px;
	border-block-start:1px solid var(--table-border);
}
.main .inner>*:not(.box):not(.customer):not(.link){
	padding-inline:min(6vw,60px);
}
.main .heading{
	font-size:22px;
	line-height:1.5;
}
.main .subheading{
	font:600 20px/1.5 var(--font-ja-serif) 
}
.main .inner:has(.box) .subheading:not(.box .subheading){
	font:400 18px/1.75 var(--font-ja);
}
.main .list{
	display:grid;
	row-gap:6px;
}
.main .list li{
	position:relative;
	padding-inline-start:17px;
	line-height:1.6;
}
.main .list li::before{
	position:absolute;
	top:10px;
	left:6px;
	display:block;
	width:5px;
	height:5px;
	border-radius:50%;
	background:rgba(0,0,0,0.44);
	content:'';
}
.main .heading+.list{
	margin-block-start:48px;
}
.main .notes{
	display:grid;
	row-gap:0px;
}
.main .notes li{
	padding-inline-start:1em;
	color:rgba(0,0,0,0.55);
	text-indent:-1em;
}
.main .box{
	margin-block-start:69px;
	padding:54px min(6vw,60px) 61px;
	background:var(--pink-background);
}
.main .box .text,
.main .box .list{
	margin-block-start:35px;
}
.main .box .notes{
	margin-block-start:12px;
}
.main .box .notes li{
	color:rgba(0,0,0,0.55);
}
.main .link{
	width:400px;
	margin-inline:auto;
}
.main .button{
	min-height:43px;
	font-size:15px;
}
.main .address{
	margin-block-end:57px;
	padding-block-start:2px;
	font:700 22px/1.35 var(--font-ja);
}
.main .form{
	display:grid;
	row-gap:12px;
	margin-block-start:73px;
}
.main .form .heading{
	margin-block-end:7px;
	font:600 16px/1.2 var(--font-ja);
}
@media screen and (max-width:800px){
	.main{
		font-size:14px;
	}
	.main .contents{
		padding:80px 1.6vw 100px;
	}
	.main .inner+.inner{
		margin-block-start:51px;
		padding-block-start:50px;
	}
	.main .inner+.inner:has(.box){
		padding-block-start:49px;
	}
	.main .inner>*:not(.box):not(.customer):not(.link){
		padding-inline:4vw;
	}
	.main .heading{
		font-size:19px;
	}
	.main .subheading{
		font-size:18px; 
	}
	.main .inner:has(.box) .subheading:not(.box .subheading){
		font-size:15px;
	}
	.main .list li{
		padding-inline-start:16px;
	}
	.main .list li::before{
		width:4px;
		height:4px;
	}
	.main .heading+.list{
		margin-block-start:39px;
	}
	.main .box{
		margin-block-start:47px;
		padding:47px 4vw 52px;
	}
	.main .box .text,
	.main .box .list{
		margin-block-start:28px;
	}
	.main .link{
		width:100%;
	}
	.main .button{
		min-height:40px;
		font-size:14px;
	}
	.main .address{
		margin-block-end:46px;
		padding-block-start:1px;
		font-size:18px;
	}
	.main .form{
		row-gap:10px;
		margin-block-start:50px;
	}
	.main .form .heading{
		font-size:15px;
	}
}

/* #title */
#title{
	display:grid;
	place-content:center;
	min-height:144px;
	padding-inline:min(4.5vw,30px);
	font:600 26px/1.35 var(--font-ja-serif);
	text-align:center;
	background:var(--other-background);
}
#title p{
	padding-block-end:3px;
}
#title br{
	display:none;
}
@media screen and (max-width:800px){
	#title{
		min-height:116px;
		font-size:21px;
	}
	#title p{
		padding-block-end:1px;
	}
}

/* breadcrumb */
#breadcrumb{
	background:var(--other-background);
}
#breadcrumb ol{
	display:grid;
	grid-template-columns:repeat(4,auto);
	width:fit-content;
	margin-inline:auto;
}
#breadcrumb li{
	position:relative;
	padding-block:10px;
	font-size:15px;
	line-height:1.2;
	color:rgba(0,0,0,0.66);
	font-weight:500;
}
#breadcrumb li:not(:first-of-type){
	padding-inline-start:77px;
}
#breadcrumb li:not(:first-of-type)::before{
	position:absolute;
	top:50%;
	left:32px;
	display:block;
	width:8px;
	height:8px;
	border-block-start:1px solid rgba(0,0,0,0.44);
	border-inline-end:1px solid rgba(0,0,0,0.44);
	transform:translateY(-50%) rotate(45deg);
	content:'';
}
#breadcrumb li.active{
	color:#000;
	font-weight:700;
}
@media screen and (max-width:800px){
	#breadcrumb li{
		padding-block:8px 9px;
		font-size:14px;
	}
	#breadcrumb li:not(:first-of-type){
		padding-inline-start:55px;
	}
	#breadcrumb li:not(:first-of-type)::before{
		left:22px;
		width:7px;
		height:7px;
	}
}

/* error */
.error{
	padding:22px min(4.5vw,30px) 23px;
	background:#000;
}
.error ul{
	display:grid;
	row-gap:13px;
}
.error li{
	font:500 15px/1.35 var(--font-ja);
	color:#FFF;
	text-align:center;
}
@media screen and (max-width:800px){
	.error{
		padding-block:19px 20px;
	}
	.error ul{
		row-gap:10px;
	}
	.error li{
		font-size:14px;
	}
}

/* message */
.message{
	margin:111px 0 -6px;
}
.message p{
	font-size:28px;
	font-weight:100;
	text-align:center;
}
@media screen and (max-width:800px){
	.message{
		margin-block:94px -4px;
	}
	.message p{
		font-size:19px;
	}
}

/* table */
.table table{
	width:100%;
	margin-inline:auto;
	border-block-start:1px solid var(--table-border);
}
.table tr{
	border-block-end:1px solid var(--table-border);
}
.table th,
.table td{
	font-size:15px;
	vertical-align:top;
}
.table th{
	padding:39px 4em 40px 0;
	font-weight:700;
	white-space:nowrap;
}
.table td{
	width:100%;
}
@media screen and (max-width:800px){
	.table table,
	.table tbody,
	.table tr,
	.table th,
	.table td{
		display:block;
	}
	.table th,
	.table td{
		font-size:14px;
	}
	.table th{
		padding:0;
		white-space:initial;
	}
}

/* form01 #authentication */
#authentication .notice{
	margin-block:48px 34px;
	font:700 17px/1.75 var(--font-ja);
}
@media screen and (max-width:800px){
	#authentication .notice{
		margin-block:37px 27px;
		font-size:15px;
	}
}

/* form02 #send */
#send .subheading:not(.box .subheading){
	margin-block-start:48px;
	font:400 18px/1.75 var(--font-ja);
}
#send .box{
	padding-block-end:50px;
}
#send .link{
	margin-block-start:41px;
}
@media screen and (max-width:800px){
	#send .subheading:not(.box .subheading){
		margin-block-start:37px;
		font-size:15px;
	}
	#send .box{
		padding-block-end:42px;
	}
	#send .link{
		margin-block-start:35px;
	}
}

/* form03 #verified */
#verified .contents{
	padding-block-end:149px;
}
#verified .subheading:not(.box .subheading){
	margin-block-start:48px;
	font:400 18px/1.75 var(--font-ja);
}
@media screen and (max-width:800px){
	#verified .contents{
		padding-block-end:94px;
	}
	#verified .subheading:not(.box .subheading){
		margin-block-start:37px;
		font-size:15px;
	}
}

/* form04 #terms */
#terms .contents{
	padding-block-end:146px;
}
#terms .notice{
	margin-block:48px 34px;
	font:700 17px/1.75 var(--font-ja);
}
#terms .inner:has(.form)+.inner{
	margin-block-start:85px;
}
@media screen and (max-width:800px){
	#terms .contents{
		padding-block-end:97px;
	}
	#terms .notice{
		margin-block:38px 28px;
		font-size:15px;
	}
	#terms .inner:has(.form)+.inner{
		margin-block-start:55px;
	}

}

/* form05 #entry */
#entry .prize{
	display:grid;
	row-gap:4px;
	margin-block-end:32px;
}
#entry .prize .items{
	padding:26px 35px 32px;
	background:#daebef;
}
#entry .prize .items:has(:checked){
	background:var(--form-background);
}
#entry .prize .name{
	display:grid;
	grid-template-columns:59px 1fr;
	align-items:center;
	column-gap:25px;
	margin-block-end:14px;
}
#entry .prize .name dt{
	position:relative;
	padding-inline-end:15px;
	font:900 50px/1 var(--font-en);
	text-align:center;
}
#entry .prize .name dt span{
	position:absolute;
	right:0;
	bottom:9px;
	display:block;
	font-size:15px;
	font-family:var(--font-ja);
	font-weight:700;
}
#entry .prize .name dd{
	padding-block-end:3px;
	font-size:20px;
	line-height:1.25;
	font-weight:700;
}
#entry .prize .part br{
	display:none;
}
#entry .table td{
	padding-block:31px;
}
#entry .table ul{
	display:grid;
	column-gap:5px;
}
#entry .table .name{
	grid-template-columns:repeat(2,1fr);
	column-gap:2.5em;
}
#entry .table .name dl{
	display:grid;
	grid-template-columns:2em 1fr;
	column-gap:1em;
	align-items:center;
}
#entry .table .zip{
	display:grid;
	grid-template-columns:auto 120px;
	column-gap:1em;
	width:fit-content;
}
#entry .table .zip ul{
	width:fit-content;
	grid-template-columns:repeat(2,120px);
}
#entry .table .tel{
	grid-template-columns:repeat(3,120px);
}
#entry .link{
	margin-block-start:32px;
}
@media screen and (max-width:800px){
	#entry .prize{
		margin-block-end:22px;
	}
	#entry .prize .items{
		padding:24px 3.2vw 3.2vw;
	}
	#entry .prize .name{
		grid-template-columns:auto;
		align-items:center;
		row-gap:10px;
		margin-block-end:21px;
	}
	#entry .prize .name dt{
		width:fit-content;
		margin-inline:auto;
		padding-inline-end:14px;
		font-size:44px;
	}
	#entry .prize .name dt span{
		bottom:8px;
		font-size:14px;
	}
	#entry .prize .name dd{
		padding-block-end:0;
		font-size:17px;
		text-align:center;
	}
	#entry .table tr{
		padding-block:16px 22px;
	}
	#entry .table td{
		padding-block:10px 0;
	}
	#entry .table .name{
		grid-template-columns:auto;
		row-gap:10px;
	}
	#entry .table .zip ul{
		width:100%;
		grid-template-columns:repeat(2,1fr);
	}
	#entry .table .tel{
		grid-template-columns:repeat(3,1fr);
	}
	#entry .link{
		margin-block-start:24px;
	}
}
@media screen and (max-width:599px){
	#entry .prize .radio:has(br) input[type=radio]+span:before{
		top:12px;
	}
	#entry .prize .radio:has(br) input[type=radio]+span:after{
		top:17px;
	}
	#entry .prize .name dd span{
		display:block;
	}
	#entry .prize .part br{
		display:block;
	}
}

/* form06 #confirm */
#confirm .table td{
	padding-block:39px 40px;
}
#confirm .link{
	display:grid;
	grid-template-columns:repeat(2,auto);
	column-gap:1em;
	direction:rtl;
	width:fit-content;
	max-width:initial;
	margin-block-start:32px;
}
#confirm .link input[type=submit]{
	width:400px;
}
#confirm .link input[type=submit].cancel{
	width:180px;
}
@media screen and (max-width:800px){
	#confirm .table tr{
		padding-block:16px 17px;
	}
	#confirm .table td{
		padding-block:5px 0;
	}
	#confirm .link{
		grid-template-columns:auto;
		row-gap:10px;
		width:100%;
		margin-block-start:22px;
		padding-inline:4vw;
	}
	#confirm .link input[type=submit]{
		width:100%;
	}
	#confirm .link input[type=submit].cancel{
		width:100%;
	}
}

/* form07 #complete */
#complete .contents{
	padding-block-end:150px;
}
#complete .subheading:not(.box .subheading){
	margin-block-start:48px;
	font:400 18px/1.75 var(--font-ja);
}
#complete .subheading:not(.box .subheading):has(strong){
	margin-block-start:32px;
	font-weight:700;
}
#complete .link{
	margin-block-start:45px;
}
#complete .customer{
	max-width:initial;
	margin-block-start:85px;
	padding-block-start:80px;
	border-block-start:1px solid var(--table-border);
}
#complete .customer>*{
	padding-inline:min(6vw,60px);
}
#complete .customer .heading{
	font-size:18px;
}
#complete .customer .company{
	margin-block:34px 2px;
	font-size:18px;
	font-weight:900;
}
#complete .customer .text{
	margin-block:21px 4px;
}
#complete .customer a{
	display:block;
	overflow-wrap:break-word;
}
@media screen and (max-width:800px){
	#complete .contents{
		padding-block-end:96px;
	}
	#complete .subheading:not(.box .subheading){
		margin-block-start:37px;
		font-size:15px;
	}
	#complete .subheading:not(.box .subheading):has(strong){
		margin-block-start:28px;
	}
	#complete .subheading br{
		display:none;
	}
	#complete .link{
		margin-block-start:52px;
		padding-inline:4vw;
	}
	#complete .customer{
		margin-block-start:55px;
		padding-block-start:51px;
	}
	#complete .customer>*{
		padding-inline:4vw;
	}
	#complete .customer .heading{
		font-size:15px;
	}
	#complete .customer .company{
		margin-block:29px 1px;
		font-size:15px;
	}
	#complete .customer .text{
		margin-block:14px 1px;
	}
}

/* form08 #present */
#present .subheading{
	font:400 18px/1.75 var(--font-ja);
}
#present .form{
	margin-block-start:66px;
}
@media screen and (max-width:800px){
	#present .subheading{
		font-size:15px;
	}
	#present .form{
		margin-block-start:45px;
	}
}
@media screen and (max-width:374px){
	main:has(#present) #title br{
		display:block;
	}
}

/* form09 #download */
#download .contents{
	padding-block:125px 145px;
}
#download video{
	width:100%;
	vertical-align:bottom;
}
#download .notes{
	margin-block-start:9px;
}
@media screen and (max-width:800px){
	#download .contents{
		padding-block:85px 96px;
	}
	#download .notes{
		margin-block-start:5px;
	}
}

/* form
-------------------------------------------------- */
/* input, textarea */
input,
textarea{
	color:#000;
	line-height:1.6;
	font-weight:500;
}
input[type=text],
textarea{
	width:100%;
	padding:9px 15px 10px;
	font-size:15px;
	border-radius:5px;
	background:var(--form-background);
}
textarea{
	height:188px;
}
input.serial{
	text-align:center;
}
@media screen and (max-width:800px){
	input,
	textarea{
		line-height:1.5;
	}
	input[type=text],
	textarea{
		padding-inline:12px;
		font-size:14px;
	}
}

/* button */
input[type=submit]{
	width:100%;
	min-height:43px;
	padding:9px 12px 10px;
	font-size:15px;
	line-height:1.6;
	color:#FFF;
	font-weight:500;
	text-align:center;
	border-radius:50px;
	background:var(--button-background);
	cursor:pointer;
}
/*
input[type=submit].cancel{
	color:var(--cancel-text);
	background:var(--cancel-background);
}*/
@media screen and (max-width:800px){
	input[type=submit]{
		min-height:40px;
		font-size:14px;
		line-height:1.5;
	}
}

/* radio */
.radio{
	display:block;
	padding:9px 15px 10px;
	font-size:15px;
	line-height:1.6;
	color:#000;
	font-weight:500;
	border-radius:5px;
	background:var(--form-background);
	cursor:pointer;
}
.radio input[type=radio]{
	display:none;
}
.radio input[type=radio]+span{
	position:relative;
	display:block;
	width:fit-content;
	margin:0 auto;
	padding-inline-start:29px;
}
.radio input[type=radio]+span::before,
.radio input[type=radio]+span::after{
	position:absolute;
	display:block;
	border-radius:50%;
	content:'';
}
.radio input[type=radio]+span::before{
	top:3px;
	left:0;
	width:19px;
	height:19px;
	background:#FFF;
}
.radio input[type=radio]+span::after{
	top:8px;
	left:5px;
	width:9px;
	height:9px;
	background:#000;
	opacity:0;
}
.radio input[type=radio]:checked+span::after{
	opacity:1;
}
.radio:has(input[type=radio]:checked){
	color:#FFF;
	background:var(--button-background);
}
@media screen and (max-width:800px){
	.radio{
		padding-inline:12px;
		font-size:14px;
		line-height:1.5;
	}
	.radio input[type=radio]+span{
		padding-inline-start:26px;
	}
	.radio input[type=radio]+span::before{
		top:2px;
		width:18px;
		height:18px;
	}
	.radio input[type=radio]+span::after{
		top:7px;
		width:8px;
		height:8px;
	}
}

/* checkbox */
.checkbox{
	display:block;
	padding:9px 15px 10px;
	font-size:15px;
	line-height:1.6;
	color:#000;
	font-weight:500;
	border-radius:5px;
	background:var(--form-background);
	cursor:pointer;
}
.checkbox input[type=checkbox]{
	display:none;
}
.checkbox input[type=checkbox]+span{
	position:relative;
	display:block;
	width:fit-content;
	margin-inline:auto;
	padding-inline-start:29px;
}
.checkbox input[type=checkbox]+span::before,
.checkbox input[type=checkbox]+span::after{
	position:absolute;
	display:block;
	content:'';
}
.checkbox input[type=checkbox]+span::before{
	top:3px;
	left:0;
	width:19px;
	height:19px;
	border-radius:2px;
	background:#FFF;
}
.checkbox input[type=checkbox]+span::after{
	top:5px;
	left:6px;
	width:7px;
	height:13px;
	border-inline-end:2px solid #000;
	border-block-end:2px solid #000;
	transform:rotate(45deg);
	transform-origin:center;
	opacity:0;
}
.checkbox input[type=checkbox]:checked+span::after{
	opacity:1;
}
.checkbox:has(input[type=checkbox]:checked){
	color:#FFF;
	background:var(--button-background);
}
@media screen and (max-width:800px){
	.checkbox{
		padding-inline:12px;
		font-size:14px;
		line-height:1.5;
	}
	.checkbox input[type=checkbox]+span{
		padding-inline-start:26px;
	}
	.checkbox input[type=checkbox]+span::before{
		top:2px;
		width:18px;
		height:18px;
	}
	.checkbox input[type=checkbox]+span::after{
		top:4px;
		height:12px;
	}
}

/* .serial */
.main .form input[type=text]{
	text-align:center;
}
.main .form input[type=text]::placeholder{
	font-size:15px;
	color:rgba(0,0,0,0.55);
	font-weight:500;
}
.main .form input[type=text]:focus::placeholder{
	color:transparent;
}
@media screen and (max-width:800px){
	.main .form input[type=text]::placeholder{
		font-size:14px;
	}
}