@charset "utf-8";
/* CSS Document */

html{font-size: 80%;scroll-behavior: smooth;}

/*改行*/
br.pc{display: block;}
br.sp{display: none;}
/**/

p.center{text-align: center;}

.red{color: red;font-weight: bold;}
.t20{font-size:clamp(1.125rem,4vw, 1.25rem);font-weight: bold;}
.t24{font-size:clamp(1.125rem,5vw, 1.5rem);font-weight: bold;}
.t30{font-size:clamp(1.25rem,8vw, 1.875rem); font-weight: bold;line-height: 0.8;}
.t36{font-size:clamp(1.5rem,10vw, 2.25rem); font-weight: bold;}
.font12{font-size:clamp( 0.75rem,2vw, 0.875rem);}

/*flex 真ん中よせ*/
.flex_center{
	display: flex;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: flex-start;
}
/*wrap 複数行*/
.flb01 {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: flex-start;
	align-content: flex-start;
}
/*nowrap*/
.flb02 {
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: flex-start;
	align-content: flex-start;
}

/*scrollin_anime.js*/
.scrollin { opacity: 0; transition: all .5s ease;}
.scrollin.show { opacity: 1; transform: none;}
.scr_lr { transform: translate(-30px, 0);}
.scr_rl { transform: translate(30px, 0);}
.scr_fadein{ transform: translate(0, 0px);}
.scr_up { transform: translate(0, 30px);}
.scr_down { transform: translate(0, -30px);}
.scr_scaleUp { transform: scale(.5);}
.scr_scaleDown { transform: scale(1.5);}
.scr_rotateL { transform: rotate(60deg);}
.scr_rotateR { transform: rotate(-60deg);}
/*/scrollin_anime.js*/
	
#wrapper{
	-webkit-text-size-adjust:none; font-family: 'Noto Sans Japanese', sans-serif;
/*	background-image: url("../images/bg_top.webp");*/
	background-image: url("../images/bg_topfix.webp");
	background-repeat:no-repeat;
	background-attachment: fixed;
	background-position: top -50px center;
	background-size: 1100px;
	background-color: #000;
}
#wrapper > div{position: relative;padding-bottom: 1rem;}
#wrapper a{text-decoration: none;font-weight: bold;color: #00B1B9;}
#wrapper a:hover{opacity:0.7;}
#wrapper img{height: auto;}

/*コンテンツボックス*/
section.cont_box {}
section.cont_box .cont_inner { position:relative; width:96%; max-width: 560px; margin:2rem auto; background-color: rgba(255,255,255,0.9);padding:3rem;border-radius: 0.25rem;box-sizing: border-box;}

section.cont_box p{padding: 1rem 0;line-height: 1.5;}

/*タイトル*/
section.cont_box h3 { font-size: 2.25rem; text-align: center; color: #eee; }
section.cont_box h4 { font-size: 1.5rem; text-align: center; color: #333;margin-bottom: 1rem; }
section.cont_box h5 { font-size: 1.25rem; color: #333; }

/*テーブル*/
section.cont_box table.table_disc p { padding: .25rem 0; text-align: justify; }
section.cont_box table.table_disc h5 { padding: 0.25rem; letter-spacing: -0.03em; }
section.cont_box table.table_disc ul { padding: .25rem 0 1rem; }

/*バナー*/
.bnr{margin: 0 auto;width: 96%;max-width: 600px;padding-bottom: 1rem;}
.bnr img{width: 100%;height: auto;}

/*応募ボタン*/
section.cont_box p.oubo{font-size: 1.125rem;font-weight: bold;color:red;padding:0.5em 0 2em;vertical-align: middle;text-align: center;}

/*注意事項2*/
ul.att2{padding: 1em 0;color: #333;font-size: 0.875rem;margin: 0em auto 1em;/*background-color: rgba(233, 233, 233,0.7);*/}
ul.att2 li{padding: .3em 0; text-indent: -1rem; margin-left: 1rem; text-align: justify; }
/*ul.att2 li:before{content:"\02714";color:#B39241;}
*/
.table_disc{width: 100%;margin: 2rem auto; max-width: 880px; }
.table_disc tbody{}
.table_disc td{}
.table_disc th,.table_disc td{
	padding: 0.5em;
	border-bottom: 1px solid #666;
	color: #333;
	}
.table_disc tr:last-child th, .table_disc tr:last-child td { border-bottom: none; }
.table_disc th{font-weight:700;letter-spacing: 0.25rem;border-right: 6px solid rgba(255,255,255,0);text-align: right; /*vertical-align: top;*/ width: 6em;}

/*募集は終了しました*/
p.boshu_end{text-align: center;background-color: #FCE9E9;padding: 0.5em 2em 0.6em 2em;border-radius: 999px;width: 16em;box-sizing: border-box;font-size: 1.125rem;margin: 0 auto 1em;}
a.btn_oubo{width: 80%; max-width: 600px; margin: 0 auto; display: block;padding: .85em;border-radius: 999px; background-color:#F6E203;text-align: center; color: #000; text-decoration: none; font-weight: bold;font-size: 1.25rem;}
.off{filter: grayscale();pointer-events: none;}

p.center{text-align: center;}
div.img_center{display: block;margin: 0.5rem auto;width: 80%;max-width: 600px;}
div.img_center img{width: 100%;}

/*性悪診断展ヘッダー*/
.header_showaru{position:sticky; top:-160px;z-index: 10;}
.header_showaru > div{width: 100%;}
.header_showaru > div{width: 600px;}
.header_showaru > div img{width: 100%;filter:drop-shadow(0 10px 10px rgba(0, 0, 0,70%));}
.catch{margin: 2rem 0;}
.catch01 img,.catch02 img{width: clamp(40px,6vw,60px);}
/*キャッチ サークル*/
.circle {
  width: 90%;
  max-width: 400px;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background-image:linear-gradient(135deg, rgba(100,60,100,1), rgba(0,6,100,0.9));
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  margin: 0 auto;
  padding: 2rem;
  box-sizing: border-box;}
.circle span{display: block;}
.circle .ruby01{padding-top: 0.25em;}
	
/*type02 サークル howtoplay*/
.circle.type02{width: 90%;max-width: 400px; background-image:linear-gradient(135deg, rgba(255,255,255,1), rgba(253,6,213,0.9));flex-direction: column;gap:1rem;padding: 6rem;}
.circle.type02 img{display: block;width: 100%;}
/*share*/
	.share{position: relative;width: 96%;max-width: 500px;margin: 0 auto;}
	.share img{display: block;position: absolute;width: 100px;top:-160px; right: 0;}

/*チケット情報*/
	.ticketinfo li.flb02{gap:0.5em;align-items:center;/*flex-start;*/margin: 0.5em;}
	.ticketinfo li.flb02 div{font-weight: bold;}
	.ticketinfo li.flb02 div:first-child{background-color:#00B1B9;color: #fff;padding:0.25em 1em;}

@media screen and (max-width: 768px) {
#wrapper{
	background-position:top 200px center;
	background-size: 120%;
}
/*性悪診断展ヘッダー*/
.header_showaru{position:sticky; top:0px;z-index: 10;}
/*.se_main_header .main_catch{padding: 2rem 0;background-size:cover;}*/
section.cont_box h3{font-size: 1.25rem;}
section.cont_box .cont_inner {padding:1rem;}

	.table_disc th,.table_disc td{display: block;}
	.table_disc th{padding: 0.2em 0.5em 0.3em;background-color: #222; color: #fff;text-align: center;border-radius: 1em;width: 100%;box-sizing: border-box;}
	.table_disc th, .table_disc td{border-bottom:none;}
	.table_disc th {border-right: none;}
/*share*/
.share img{width: 90px;top:-150px; right: 0;}

/*改行*/
	br.pc{display: none;}
	br.sp{display: block;}
}