@charset "UTF-8";

body.contest2604 {
	max-width:1200px;
	margin:0 auto;
	position:relative;
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	letter-spacing:0.2em;
	font-weight:bold;
	background-image:none;
	background-color:#FBF7E7;
}

.menu_fix {
	width:clamp( 45px, calc( -12px + 15.2vw ), 140px );
}

h2 {
	margin:0 auto;
	background-image:none;
}

h4 {
	padding-bottom:30px;
	font-size: clamp( 14px, calc( 5.6px + 2.2399999999999998vw ), 28px );
}

#about {
	padding:clamp( 10px, calc( -8px + 4.8vw ), 40px ) 20px;
	background-image:url(../img/2604/bg01.png);
	background-repeat:no-repeat;
	background-size:84% auto ;
	background-position:top 15% center;
}

#about h2 {
	width:clamp( 180px, calc( -60px + 64vw ), 580px );
	padding-top:0;
}

#about .sec_inner {
	max-width:920px;
	padding:0 0 clamp( 20px, calc( -70px + 24vw ), 170px );
	position:relative;
}

#about p {
	font-size:clamp( 11px, calc( 3.666666666666667px + 1.8333333333333333vw ), 22px ) !important;
	word-break:auto-phrase !important;
	overflow-wrap: break-word !important;
	text-align:justify !important;
	letter-spacing:0 !important;
}

#about p:nth-of-type(1) {
	margin:clamp(25px, calc(10px + 4vw), 50px) auto 0;
	font-size:clamp( 12px, calc( 6px + 1.6vw ), 22px );
	text-align:left;
	color:#202020;
}

#about .exsample .ttl {
	margin:clamp( 40px, calc( 16px + 6.4vw ), 80px ) 0 clamp( 25px, calc( 19px + 1.6vw ), 35px );
}

#about .exsample .ttl span {
	padding:6px 12px;
	display:inline-block;
	font-size:clamp( 18px, calc( 13.2px + 1.28vw ), 26px );
	line-height:1;
	font-weight:900;
	background-color:#F0A56C;
	border-radius:clamp( 4px, calc( 2.8px + 0.32vw ), 6px );
	color:#FFFFFF;
}

#about .exsample a {
	margin:clamp( 10px, calc( 4px + 1.6vw ), 20px ) 0 clamp( 30px, calc( 24px + 1.6vw ), 40px );
	display:inline-block;
	font-size:clamp( 16px, calc( 11.8px + 1.1199999999999999vw ), 23px );
	font-weight:bold;
	text-decoration:underline;
	color:#0000FF;
}

.flow_bg {
	background-image:url(../img/2604/bg02.png);
	background-repeat:repeat;
	background-size:auto;
	background-position:top left;
}

#flow {
	margin-top:-1px;
	position:relative;
	background-color: transparent;
	scroll-margin-top:clamp(90px, calc(24px + 17.599999999999998vw), 200px);
}

.img_2512ch02 {
	width:clamp( 160px, calc( 19px + 37.6vw ), 395px );
	position:absolute;
	top:calc(clamp( 20px, calc( -33.99999999999999px + 14.399999999999999vw ), 110px ) * -1);
	left:50%;
	transform: translateX(-50%);
}

#flow h2 {
	width:clamp( 135px, calc( 54px + 21.6vw ), 270px );
	margin:0 auto;
	padding-top:clamp( 115px, calc( 70px + 12vw ), 190px );
}

.contest2604 .step_ttl + p span {
    font-size: clamp(12px, calc(9.6px + 0.64vw), 16px);
}

.step_wrap {
	padding-left:clamp( 30px, calc( 18px + 3.2vw ), 50px );
	padding-right:clamp( 30px, calc( 18px + 3.2vw ), 50px );
	border-radius:20px;
}

.step_wrap + .step_wrap {
	margin-top:clamp( 30px, calc( 18px + 3.2vw ), 50px ) !important;
}

.step_wrap p {
	text-align:justify;
}

.step_wrap > img {
	width:auto;
}

.step_wrap > div {
	width:100%;
	padding:15px 0;
}

.step_ttl {
	margin-bottom:clamp( 20px, calc( 14px + 1.6vw ), 30px );
	padding:15px 0 15px clamp( 80px, calc( 56px + 6.4vw ), 120px );
	font-weight:900;
	background-image:url(../img/2604/step1.png);
	background-repeat:no-repeat;
	background-size:contain;
	background-position:left center;
}

.step2 .step_ttl {
	background-image:url(../img/2604/step2.png);
}

.step3 .step_ttl {
	background-image:url(../img/2604/step3.png);
}

.step3_bottom {
	text-align:center;
}

.step3_bottom p {
	text-align:center;
}

.btn_open {
	background-image:url(../img/2512/btn_open.png);
}

.btn_open.opened {
	background-image:url(../img/2512/btn_close.png);
}

.award {
	padding-bottom:clamp( 75px, calc( 48px + 7.199999999999999vw ), 120px );
}

.award_ttl {
	width:clamp( 120px, calc( 30px + 24vw ), 270px );
}

.award p {
	text-align:left !important;
}


#juror {
	background-color:transparent;
}

#juror h2 {
	width:clamp( 160px, calc( 70px + 24vw ), 310px );
	margin:0 auto;
}

.img_juror {
	top:calc(clamp( 80px, calc( 8px + 19.2vw ), 200px ) * -1) !important;
	right:10px !important;
}

.img_juror img {
	width:clamp( 200px, calc( 104.33673469387755px + 25.510204081632654vw ), 300px );
}

.juror_wrap{
	background-color:#FFFFFF;
	background-image:none;
}

#schedule {
	padding:50px 0 clamp(35px, calc(8.000000000000004px + 7.199999999999999vw), 80px);
	background-color:#F0A56C;
	background-image:none;
	position:relative;
	scroll-margin-top:clamp(60px, calc(42px + 4.8vw), 90px);
}

#schedule .sec_inner {
	background-color:transparent;
	padding-bottom:30px;
}

#schedule h2 {
	width:clamp( 140px, calc( 56px + 22.400000000000002vw ), 280px );
	margin:0 auto;
	padding-bottom:clamp( 30px, calc( 21px + 2.4vw ), 45px );
}

.img_schedule {
    top:calc(clamp( 40px, calc( -56px + 25.6vw ), 200px ) * -1) !important;
    left:clamp( 10px, calc( 4px + 1.6vw ), 20px ) !important;
}

.img_schedule img {
	width:clamp( 135px, calc( 0px + 36vw ), 360px );
}

#schedule ul li div, #schedule ul li span {
	font-weight:900 !important;
}

#schedule ul li div:nth-of-type(1) {
	border-right:#FD6803 2px solid;
	color:#FD6803;
}

#schedule ul li div:nth-of-type(2) span {
	letter-spacing:0;
}

#faq {
	padding:clamp( 30px, calc( -12px + 11.200000000000001vw ), 100px ) 20px;
	background-image:url(../img/2604/bg02.png);
	background-repeat:repeat;
	background-size:auto;
	background-position:top left;
}

#faq .sec_inner {
	padding:20px 30px 30px;
	border-radius:15px;
	background-color:#FFFFFF;
}

#faq h2 {
	width:clamp( 140px, calc( 56px + 22.400000000000002vw ), 280px );
	margin:0 auto;
	padding-bottom:clamp( 30px, calc( 21px + 2.4vw ), 45px );
}

#faq h3 {
	padding:5px 0 5px 25px;
	border:none;
	background-image:url(../img/2512/l-border.png);
	background-repeat:no-repeat;
	background-size:contaion;
	background-position:left center;
}

#faq .btn_open {
	margin:0 !important;
	padding:40px 40px 40px 40px;
	border-top:#5D2323 2px dashed;
	border-bottom:none;
	background-image:url(../img/2604/Q.png), url(../img/2512/btn_open.png);
	background-position:top 35px left, top 35px right;
	color:#724141;
}

#faq .btn_open.opened {
	background-image:url(../img/2604/Q.png), url(../img/2512/btn_close.png);
}

#faq .open_cnt {
	padding-bottom:40px;
	background-image:url(../img/2604/A.png);
}

.img_faq img {
	width:clamp( 100px, calc( -7.999999999999986px + 28.799999999999997vw ), 280px );
}

.img_faq {
	right:clamp( 10px, calc( -38px + 12.8vw ), 90px ) !important;
	top:calc(clamp( 30px, calc( 18px + 3.2vw ), 50px ) * -1) !important;
}

#faq .faq_wrap > div:nth-of-type(1) {
	border:none;
}

#contact {
	padding:clamp( 30px, calc( -201.72413793103448px + 30.17241379310345vw ), 100px ) 0 0;
	background-color:transparent;
}

#contact .sec_inner {
	padding:0;
	background-color:transparent;
}

#sns {
	padding:clamp( 80px, calc( 32px + 12.8vw ), 160px ) 0 0;
	background-color:#FFFFFF;
}

#sns h2 {
	width:clamp( 165px, calc( 126px + 10.4vw ), 230px );
	padding-bottom:clamp( 30px, calc( 6px + 6.4vw ), 70px );
}

.img_sns {
	top:calc(clamp( 20px, calc( -4px + 6.4vw ), 60px ) * -1);
	left:clamp( 12px, calc( -146.89655172413794px + 20.689655172413794vw ), 60px );
}

.img_sns img {
	width:clamp( 195px, calc( -781.551724137931px + 127.15517241379311vw ), 490px );
}

#sns .sns_share {
	margin:0;
}

#sns .sns_share li + li {
	margin-left:clamp( 45px, calc( -18.000000000000007px + 16.8vw ), 150px );
}

#sns .sns_share img {
	width:clamp( 40px, calc( -13.999999999999993px + 14.399999999999999vw ), 130px );
	height:auto;
}

.img_footer {
	padding:clamp( 75px, calc( -272.58620689655174px + 45.258620689655174vw ), 180px ) 0;
}

.img_footer img {
	width:clamp( 280px, calc( -1044.1379310344828px + 172.41379310344826vw ), 680px );
}

footer {
	padding-top:0;
}


/* Only SP */
@media only screen and (max-width: 767px) {


h4 {
	padding-bottom:60px;
}

#juror ul {
	-webkit-box-pack:center;
	justify-content:center;
}

#juror ul li:nth-of-type(1) {
	padding-right:2.5%;
}

#juror ul li:nth-of-type(2) {
	padding-left:2.5%;
}

#juror ul li:nth-of-type(3) {
	padding-top:20px;
}



footer {
	padding-bottom:80px;
}

.footer_menu > li > a {
	background-image:none;
	font-weight:900;
}

}


/* Only PC */
@media only screen and (min-width: 768px) {

#about {
	background-size:70% auto ;
	background-position:top 31% center;
}

#about .exsample a:hover {
	text-decoration:none;
}


.step_wrap {
	border-radius:30px;
}

.img_juror {
	right:calc(clamp( 10px, calc( -254.82758620689657px + 34.48275862068966vw ), 90px ) * -1) !important;
}

.img_juror img {
	width:clamp( 300px, calc( -527.5862068965519px + 107.75862068965519vw ), 550px );
}

.img_schedule {
    top: -190px;
    left: 0
}

#faq .btn_open {
	padding:40px 40px 40px 60px;
	background-position:top 30px left, top 35px right;
}


}


@media screen and (max-width: 859px) {
	
#schedule ul li {
	position:relative;
}

#schedule ul li + li {
	margin-top:30px;
}

#schedule ul li + li:after {
	content:url(../img/2512/arrow_sp.png);
	display:block;
	position:absolute;
	top:-20px;
	left:50%;
	transform:translateX(-50%);
}

}


@media screen and (min-width: 860px) {

#schedule ul li div:nth-of-type(1) {
	border-right:none;
	border-bottom:#FD6803 2px solid;
}

#schedule ul li + li:after {
	content:url(../img/2512/arrow_pc.png);
	display:block;
	position:absolute;
	top:50%;
	left:-25px;
	transform:translateY(-50%);
}

}
