/* ------------------- mediaqueries ------------------- */
@media screen and (max-height: 1000px) {
	/* NoteBook height */
}
@media screen and (max-height: 620px) {
	/* NoteBook height */
}
@media screen and (max-width: 1100px) {
	block.wave::after{ background-size: 190% auto;}
	block.b1 h3 br.mobile{ display: inline-block;}
}
@media screen and (max-width: 900px) {
	.pc{ display: none!important;}
	.mobile{ display: inline-block;}
	.mainContent .container{ padding: 0 1rem;}

	header .KVbox.pc{ display: none;}
	header .KVbox.mobile{ display: block;}
	.sharelink a.share{ width: 150px; height: 70px; margin-top: 3rem;}
	footer a.goweb{ margin: 0 auto 5rem;}
	footer a.goweb img{ width: 100%;}

	.hotbtn img{ width: 120px; filter: drop-shadow(5px 5px 3px #FFF) drop-shadow(-5px 5px 3px #FFF) drop-shadow(-5px -5px 3px #FFF) drop-shadow(5px -5px 3px #FFF);}

	block.wave::after{ background-size: 250% auto;}

	block.b1 .container{ background-size: 200% auto;}
	block.b3 .formbody{ background-image: none; background-color: #fff; padding: 5rem 2rem; margin-top: 3rem;}
	block.b3 .formbody::before{ top: -20px; left: -25px;}
	block.b3 .formbody::after{ top: -20px; right: -25px;}
	block.b3 .formbody.s2{ padding: 5rem 2rem; background-image: none;}

	block.b4::after{ background-size: 220% auto;}
	block.b4 .join_list .item{ width: 49%;}

	.formframe,
	.formbody{ padding: 5rem 2rem;}
	.formframe .tablebox,
	.formframe .tablebox > ul,
	.formframe .tablebox > ul > li{ display: block;}
	.formbody .tablebox li.head{ width: 100%; text-align: left; padding-bottom: 0; }
	.formbody .tablebox li.head br{ display: none;}
	.formbody .tablebox.d4 li:nth-of-type(4){ width: 100%; }
	.formframe .agree{ width: calc(100% - 5rem); margin: 0 2.5rem;}
	.formbody + .agree{ margin-top: 5rem;}


}
@media screen and (max-width: 640px) {
	/* width */
	html, body {font-size: 14px;}
	
	div.lightbox .container{ width: 90%; padding: 2rem;}
	div.lightbox .tablebox.search,
	div.lightbox .tablebox.search > ul,
	div.lightbox .tablebox.search > ul > li{ display: block; width: 100%;}
	div.lightbox a.close{ width: 50px; height: 50px; top: -25px; right: -25px;}
	div.lightbox.check .tablebox li br{ display: inline-block;}

	
	block.wave::after{ background-size: 300% auto;}
	/* .hotbtn{flex-direction: row;} */
	
	

	h2.title{ font-size: var(--fsXL); padding-top: 100px;}
	block.b1::before{ top: 120px; left: 4%;}
	block.b1 h3{ width: 80%;}
	block.b1 h3::before{ bottom: 90px; left: -80px;}
	block.b1 h3::after{ bottom: 90px; right: -135px;}
	block.b1 p{ background-color: #fff; border-radius: 20px; text-align: left; padding: 4rem 2rem;}
	block.b1 p::before{ left: 0;}
	block.b1 p::after{ right: 0;}

	block.b2 .event_list{ overflow-x: auto;}
	.event_list .item{ flex-direction: column; padding-top: 0;}
	.event_list .item li{ width: 100%!important;}
	.event_list .item li.i1 b{ top: -1130px; right: 50%; transform: translateX(50%);}
	.event_list .item li.i1 b::before{ top: 10px; right: 0;}
	.event_list .item li.i1 b::after{ top: 20px; right: 0;}
	.event_list .item .i3{ border-left: none; border-top: 1px dashed #505D67;}

	

	/* block.b3 img{ width: 130%; transform: translateX(-14%);} */
	block.b3 .privacy_box a.btn{ font-size: var(--fsM); font-weight: 600;}

	block.b4 h3{ width: 80%; letter-spacing: 0;}
	block.b4 h3 img{ width: 100%;}
	block.b4 .join_list {flex-wrap: wrap;justify-content: flex-start;flex-direction: column;}
	block.b4 .join_list .item{ width: 100%;}
	block.b4 .join_list .item li{ padding: .5rem;}
	block.b4 .join_list .item .j4 a.btn{ padding: 1rem;}

	block.b5{ padding-bottom: 0;}
	block.b5 .tabs a{ font-size: var(--fsM); padding: 1rem .5rem; margin: 0 0.5rem;}
	block.b5 .container.t1 .tabs a.t1,
	block.b5 .container.t2 .tabs a.t2,
	block.b5 .container.t3 .tabs a.t3{ padding: 1rem 1rem;}
	block.b5 .framecontent{ padding: 3rem; }
	



	

	/* reslut */
	.result .info h4{ text-align: center; }
	.result .info h4 b{ display: block;}
	.noticetxt{ padding: 2rem;}
	.noticetxt .tablebox li{ padding: 1rem;}
	.jointxt .half{ text-align: center;}

}
