@charset "utf-8";

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 header 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

header { border-bottom: solid 3px #000000; }
header .headerCredit { background-color: #000000; padding: 6px calc( 40 / 1200 * 100% ); }
header .headerCredit .creditInner { overflow: hidden; max-width: 1080px; font-size: 1.2rem; line-height: 1; color: #ffffff; text-align: right; margin-right: auto; margin-left: auto; }
header .headerCredit dl { float: right; display: table; }
header .headerCredit dl dt { display: table-cell; vertical-align: middle; padding-right: 10px; }
header .headerCredit dl dt span { display: block; border: solid 1px #ffffff; padding: 2px 5px; }
header .headerCredit dl dd { display: table-cell; vertical-align: middle; }
header .headerLogo { padding: 16px calc( 40 / 1200 * 100% ); }
header .headerLogo .logoInner { overflow: hidden; max-width: 1080px; margin-right: auto; margin-left: auto; }
header .headerLogo .logoSet { display: table; width: 100%; }
header .headerLogo .logoSet .setLeft { display: table-cell; width: 320px; vertical-align: top; }
header .headerLogo .logoSet .setRight { display: table-cell; font-size: 1.4rem; line-height: 1.6rem; text-align: right; vertical-align: middle; padding-left: 10px; }

@media screen and (max-width: 767px) {
	header .headerCredit { padding: 10px calc( 15 / 320 * 100% ); }
	header .headerCredit .creditInner { max-width: 500px; font-size: 1.2rem; }
	header .headerCredit dl { float: none; margin-right: auto; margin-left: auto; }
	header .headerLogo { padding: 10px calc( 15 / 320 * 100% ); }
	header .headerLogo .logoInner { max-width: 500px; }
	header .headerLogo .logoSet { display: block; }
	header .headerLogo .logoSet .setLeft { display: block; width: 200px; margin: 0 auto 10px; }
	header .headerLogo .logoSet .setRight { display: block; line-height: 1.6rem; text-align: center; font-feature-settings: "palt"; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 baseBg 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.baseBg { background-color: #fafaef; }
.baseInner { padding: 45px calc( 50 / 1100 * 100% ) 100px; }

@media screen and (max-width: 767px) {
.baseInner { padding: 40px calc( 15 / 320 * 100% ); }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 headerMain 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.headerMain { background: url(../images/header_bg1.jpg) no-repeat center top; background-size: auto 100%; }
.headerMain .mainInner { max-width: 1300px; margin-right: auto; margin-left: auto; }
.headerMain .mainBg { position: relative; padding-top: calc( 750 / 1300 * 100% ); }
.headerMain .mainLogo,
.headerMain .mainTitle,
.headerMain .mainTxt,
.headerMain .mainBar,
.headerMain .mainPresent { position: absolute; top: 0; background-size: cover; font-size: 0; line-height: 0; }
.headerMain .mainLogo { left: 0; width: calc( 158 / 1300 * 100% ); background-image: url(../images/header_logo.gif); border-radius: 50%; padding-top: calc( 158 / 1300 * 100% ); margin: calc( 85 / 1300 * 100% ) 0 0 calc( 16 / 1300 * 100% ); }
.headerMain .mainTitle { left: 0; width: calc( 890 / 1300 * 100% ); background-image: url(../images/header_title1_1.png); margin: calc( 82 / 1300 * 100% ) 0 0 calc( 205 / 1300 * 100% ); }
.headerMain .mainTitle span { display: block; padding-top: calc( 170 / 890 * 100% ); }
.headerMain .mainTxt { right: 0; left: 0; width: calc( 650 / 1300 * 100% ); background-image: url(../images/header_txt.png); padding-top: calc( 150 / 1300 * 100% ); margin: calc( 265 / 1300 * 100% ) auto 0; }
.headerMain .mainBar { right: 0; left: 0; width: calc( 510 / 1300 * 100% ); background-image: url(../images/header_bar1.gif); border-radius: 25px; margin: calc( 450 / 1300 * 100% ) auto 0; }
.headerMain .mainBar span { display: block; padding-top: calc( 50 / 510 * 100% ); }
.headerMain .mainPresent { right: 0; width: calc( 223 / 1300 * 100% ); background-image: url(../images/header_present.png); padding-top: calc( 222 / 1300 * 100% ); margin: calc( 260 / 1300 * 100% ) calc( 54 / 1300 * 100% ) 0 0; }

@media screen and (max-width: 1300px) {
	.headerMain .mainTitle { background-image: url(../images/header_title1_2.png); }
}

@media screen and (max-width: 767px) {
	.headerMain { background: url(../images/header_bg2.jpg) no-repeat center bottom #0087ff; background-size: 768px auto; padding-right: calc( 15 / 320 * 100% ); padding-left: calc( 15 / 320 * 100% ); }
	.headerMain .mainInner { max-width: 500px; }
	.headerMain .mainBg { padding-top: 20px; padding-bottom: 160px; }
	.headerMain .mainLogo,
	.headerMain .mainTitle,
	.headerMain .mainTxt,
	.headerMain .mainBar,
	.headerMain .mainPresent { position: static; }
	.headerMain .mainLogo { width: 110px; padding-top: 110px; margin: 0 auto 15px; }
	.headerMain .mainTitle { max-width: 334px; width: 100%; background-image: url(../images/header_title2.png); margin: 0 auto 30px; }
	.headerMain .mainTitle span { padding-top: calc( 160 / 334 * 100% ); }
	.headerMain .mainTxt { width: 100%; background-image: none; font-size: 1.4rem; line-height: 2.4rem; color: #ffffff; font-weight: 700; padding-top: 0; margin: 0 0 15px; }
	.headerMain .mainBar { max-width: 408px; width: 100%; border-radius: 20px; margin: 0 auto 20px; }
	.headerMain .mainBar span { padding-top: calc( 40 / 408 * 100% ); }
	.headerMain .mainPresent { width: 223px; padding-top: 222px; margin: 0 auto; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 コンテンツ 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

/* ――――――――――――――――――――――――――――――
［ aboutFrame ］
―――――――――――――――――――――――――――――― */

.aboutFrame { position: relative; display: block; max-width: 780px; border: solid 1px #595959; padding: 15px 145px 15px 20px; text-decoration: none; margin: 0 auto 50px; }
.aboutFrame .frameTxt { font-size: 1.6rem; line-height: 2.8rem; }
.aboutFrame .frameBtn { position: absolute; bottom: 15px; right: 20px; display: block; width: 110px; background-color: #ffffff; border: solid 1px #595959; border-radius: 12px; text-decoration: none; }
.aboutFrame .frameBtn span { position: relative; display: block; font-size: 1.5rem; line-height: 2.2rem; text-align: center; }
.aboutFrame .frameBtn span::after { position: absolute; top: 0; right: 8px; bottom: 0; display: block; width: 0; height: 0; border-style: solid; border-width: 4px 0 4px 5px; border-color: transparent transparent transparent #595959; content: ""; margin-top: auto; margin-bottom: auto; }

@media screen and (min-width: 821px) {
	.aboutFrame .frameBtn,
	.aboutFrame .frameBtn span::after { transition: 0.2s ease; }
	.aboutFrame:hover .frameBtn { background-color: #595959; color: #ffffff; }
	.aboutFrame:hover .frameBtn span::after { border-color: transparent transparent transparent #ffffff; }
}

@media screen and (max-width: 767px) {
	.aboutFrame { max-width: 500px; padding: 12px 15px ; margin-bottom: 30px; }
	.aboutFrame .frameTxt { font-size: 1.5rem; line-height: 2.4rem; }
	.aboutFrame .frameBtn { position: static; margin: 10px auto 0; }
}



/* ――――――――――――――――――――――――――――――
［ copyBar ］
―――――――――――――――――――――――――――――― */

.copyBar { max-width: 1000px; margin: 0 auto 35px; }
.copyBar span { display: block; background-image: url(../images/copy_bar1.gif); background-size: cover; font-size: 0; line-height: 0; padding-top: calc( 175 / 1000 * 100% ); }

@media screen and (max-width: 767px) {
	.copyBar { max-width: 290px; margin-bottom: 30px; }
	.copyBar span { background-image: url(../images/copy_bar2.gif); padding-top: calc( 160 / 290 * 100% ); }
}



/* ――――――――――――――――――――――――――――――
［ guideMovie ］
―――――――――――――――――――――――――――――― */

.guideMovie { overflow: hidden; max-width: 990px; margin: 0 auto 80px; }
.guideMovie dl { float: left; width: calc( 310 / 990 * 100% ); border: solid 1px #00a8ff; }
.guideMovie dl:nth-child(2) { margin-right: calc( 30 / 990 * 100% ); margin-left: calc( 30 / 990 * 100% ); }
.guideMovie dl dt { background-color: #00a8ff; font-size: 2rem; line-height: 3rem; color: #ffffff; font-weight: 700; text-align: center; padding: 12px; }
.guideMovie dl dd { background-color: #ffffff; padding-bottom: 24px; }
.guideMovie .movieImg { position: relative; overflow: hidden; display: block; background-color: #000000; }
.guideMovie .movieImg::before,
.guideMovie .movieImg::after { position: absolute; top: 0; bottom: 0; left: 0; display: block; content: ""; margin: auto; z-index: 1; }
.guideMovie .movieImg::before { right: 0; width: 50px; height: 50px; background-color: #000000; border: solid 2px #ffffff; border-radius: 50%; opacity: 0.67; }
.guideMovie .movieImg::after { right: -4px; width: 0; height: 0; border-style: solid; border-width: 8px 0 8px 14px; border-color: transparent transparent transparent #ffffff; }
.guideMovie .movieTxt { font-size: 1.8rem; line-height: 2.6rem; padding: 10px 15px 16px; }
.guideMovie .movieBtn { position: relative; display: block; width: 164px; border: solid 1px #000000; border-radius: 13px; font-size: 1.8rem; line-height: 2rem; text-align: center; text-decoration: none; padding: 2px; margin-right: auto; margin-left: auto; }
.guideMovie .movieBtn::after { position: absolute; top: 0; right: 13px; bottom: 0; display: block; width: 9px; height: 9px; border: solid #000000; border-width: 0 1px 1px 0; content: ""; transform: rotate(-45deg); margin-top: auto; margin-bottom: auto; }

@media screen and (max-width: 1090px) {
	.guideMovie { max-width: 310px; margin-bottom: 40px; }
	.guideMovie dl { float: none; width: 100%; }
	.guideMovie dl:nth-child(2) { margin: 30px 0; }
}

@media screen and (min-width: 821px) {
	.guideMovie .movieImg img,
	.guideMovie .movieImg::before,
	.guideMovie .movieBtn,
	.guideMovie .movieBtn::after { transition: 0.3s ease; }
	.guideMovie .movieImg:hover img { transform: scale(1.11); opacity: 0.7; }
	.guideMovie .movieImg:hover::before { opacity: 1; }
	.guideMovie .movieBtn:hover { background-color: #000000; color: #ffffff; }
	.guideMovie .movieBtn:hover::after { border-color: #ffffff; }
}

@media screen and (max-width: 767px) {
	.guideMovie dl dt { font-size: 1.8rem; }
	.guideMovie .movieTxt { font-size: 1.6rem; line-height: 2.2rem; padding-bottom: 12px; }
	.guideMovie .movieBtn { font-size: 1.6rem; }
}



/* ――――――――――――――――――――――――――――――
［ voteBtn ］
―――――――――――――――――――――――――――――― */

.voteBtn { max-width: 500px; margin: 0 auto 60px; }
.voteBtn a { position: relative; display: block; background-color: #ffd000; border: solid 2px #000000; border-radius: 15px; font-size: 3rem; line-height: 4rem; font-weight: 700; text-align: center; text-decoration: none; padding: 28px 50px; margin-bottom: 15px; }
.voteBtn a::before { position: absolute; top: 0; right: 48px; bottom: 0; display: block; width: 16px; height: 16px; border: solid #000000; border-width: 0 2px 2px 0; content: ""; transform: rotate(-45deg); margin-top: auto; margin-bottom: auto; }
.voteBtn div { font-size: 1.8rem; line-height: 2.6rem; font-weight: 700; text-align: center; }

@media screen and (min-width: 821px) {
	.voteBtn a,
	.voteBtn a::before { transition: 0.2s ease; }
	.voteBtn a:hover { background-color: #000000; color: #ffd000; }
	.voteBtn a:hover::before { border-color: #ffd000; }
}

@media screen and (max-width: 767px) {
	.voteBtn { max-width: 380px; margin-bottom: 40px; }
	.voteBtn a { border-radius: 10px; font-size: 2.4rem; padding: 18px 40px; }
	.voteBtn a::before { right: 38px; }
	.voteBtn div { font-size: 1.5rem; line-height: 2.4rem; }
}



/* ――――――――――――――――――――――――――――――
［ presentFrame ］
―――――――――――――――――――――――――――――― */

.presentFrame { overflow: hidden; max-width: 1000px; background-color: #ffffc8; border: solid 1px #c8a56e; border-radius: 200px; padding: 29px 140px 39px; margin: 0 auto 90px; }
.presentFrame .frameTitle { width: 220px; margin-right: auto; margin-left: auto; }
.presentFrame .frameInner { display: table; }
.presentFrame .frameTxt { display: table-cell; vertical-align: middle; padding-right: 20px; }
.presentFrame .frameTxt .txtMain { font-size: 2.2rem; line-height: 3.6rem; font-weight: 700; margin-bottom: 30px; }
.presentFrame .frameImg { display: table-cell; width: 150px; vertical-align: middle; }

@media screen and (max-width: 1200px) {
	.presentFrame .frameInner { display: flex; flex-wrap: wrap; }
	.presentFrame .frameTxt { order: 2; display: block; padding-right: 0; }
	.presentFrame .frameTxt .txtMain br { display: none; }
	.presentFrame .frameImg { order: 1; display: block; margin: 0 auto 20px; }
}

@media screen and (max-width: 767px) {
	.presentFrame { max-width: 330px; border-radius: 20px; padding: 20px 25px; margin-bottom: 40px; }
	.presentFrame .frameTitle { width: 160px; margin-bottom: 15px; }
	.presentFrame .frameTxt .txtMain { font-size: 1.6rem; line-height: 2.4rem; margin-bottom: 15px; }
	.presentFrame .frameImg { width: 100px; margin: 0 auto 20px; }
}



/* ――――――――――――――――――――――――――――――
［ resultLink ］
―――――――――――――――――――――――――――――― */

.resultLink { max-width: 600px; margin: 0 auto 70px; }
.resultLink a { position: relative; display: block; background-color: #ffffff; border: solid 2px #000000; border-radius: 15px; font-size: 2.6rem; line-height: 3.4rem; font-weight: 700; text-align: center; text-decoration: none; padding: 18px 50px; }
.resultLink a::before { position: absolute; top: 0; right: 35px; bottom: 0; display: block; width: 15px; height: 15px; border-style: solid; border: solid #000000; border-width: 0 2px 2px 0; content: ""; transform: rotate(-45deg); margin-top: auto; margin-bottom: auto; }

@media screen and (min-width: 821px) {
	.resultLink a,
	.resultLink a::before { transition: 0.2s ease; }
	.resultLink a:hover { background-color: #000000; color: #ffffff; }
	.resultLink a:hover::before { border-color: #ffffff; }
}

@media screen and (max-width: 767px) {
	.resultLink { max-width: 500px; margin-bottom: 40px; }
	.resultLink a { border-radius: 10px; font-size: 1.6rem; line-height: 2.2rem; padding: 13px 30px; }
	.resultLink a::before { right: 15px; width: 10px; height: 10px; }
}



/* ――――――――――――――――――――――――――――――
［ awardCeremony ］
―――――――――――――――――――――――――――――― */

.awardCeremony { overflow: hidden; max-width: 900px; background: linear-gradient(90deg, #00af93, #00a8ff 68%); margin-right: auto; margin-left: auto; }
.awardCeremony .ceremonyTitle { border-bottom: solid 1px #ffffff; font-size: 2.6rem; line-height: 4rem; color: #ffffff; font-weight: 700; text-align: center; padding: 20px 20px 10px; }
.awardCeremony .ceremonyBg { background-color: #ffffff; border-radius: 20px; padding: 30px; margin: 10px; }
.awardCeremony .ceremonyInner { overflow: hidden; margin-bottom: 30px; }
.awardCeremony .ceremonyTxt { float: left; width: 310px; font-size: 1.8rem; line-height: 2.8rem; }
.awardCeremony .ceremonyTxt table th { font-weight: 500; text-align: justify; text-align-last: justify; padding-right: 20px; }
.awardCeremony .ceremonyImg { float: right; width: 470px; }
.awardCeremony .ceremonyBtn { width: 280px; margin-right: auto; margin-left: auto; }
.awardCeremony .ceremonyBtn a { position: relative; display: block; border: solid 1px #000000; border-radius: 22px; font-size: 1.6rem; line-height: 3rem; font-weight: 700; text-align: center; text-decoration: none; padding: 6px 30px; }
.awardCeremony .ceremonyBtn a::before { position: absolute; top: 0; right: 20px; bottom: 0; display: block; width: 12px; height: 12px; border-style: solid; border: solid #000000; border-width: 0 1px 1px 0; content: ""; transform: rotate(-45deg); margin-top: auto; margin-bottom: auto; }

@media screen and (max-width: 990px) {
	.awardCeremony .ceremonyTxt { float: none; width: 100%; }
	.awardCeremony .ceremonyImg { float: none; max-width: 470px; width: 100%; margin: 0 auto 20px; }
}

@media screen and (min-width: 821px) {
	.awardCeremony .ceremonyBtn a,
	.awardCeremony .ceremonyBtn a::before { transition: 0.2s ease; }
	.awardCeremony .ceremonyBtn a:hover { background-color: #000000; color: #ffffff; }
	.awardCeremony .ceremonyBtn a:hover::before { border-color: #ffffff; }
}

@media screen and (max-width: 767px) {
	.awardCeremony { max-width: 500px; }
	.awardCeremony .ceremonyTitle { font-size: 1.8rem; line-height: 2.6rem; }
	.awardCeremony .ceremonyInner { margin-bottom: 20px; }
	.awardCeremony .ceremonyBg { border-radius: 15px; padding: 20px; }
	.awardCeremony .ceremonyTxt { font-size: 1.4rem; line-height: 2.2rem; }
	.awardCeremony .ceremonyBtn { max-width: 260px; width: 100%; }
	.awardCeremony .ceremonyBtn a { font-size: 1.4rem; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 footerWrap 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.footerWrap { padding: 100px calc( 50 / 1100 * 100% ) 70px; }

@media screen and (max-width: 767px) {
	.footerWrap { padding: 40px calc( 15 / 320 * 100% ); }
}



/* ――――――――――――――――――――――――――――――
［ footerLink ］
―――――――――――――――――――――――――――――― */

.footerLink { max-width: 900px; margin: 0 auto 85px; }
.footerLink .linkTitle { font-size: 2.5rem; line-height: 3.5rem; font-weight: 700; text-align: center; margin-bottom: 30px; }
.footerLink .linkImg { overflow: hidden; }
.footerLink .linkImg a { display: block; width: 420px; }
.footerLink .linkImg a:nth-child(1) { float: left; }
.footerLink .linkImg a:nth-child(2) { float: right; }

@media screen and (max-width: 990px) {
	.footerLink .linkImg a:nth-child(1),
	.footerLink .linkImg a:nth-child(2) { float: none; margin-right: auto; margin-left: auto; }
	.footerLink .linkImg a:nth-child(1) { margin-bottom: 20px; }
}

@media screen and (min-width: 821px) {
	.footerLink .linkImg a { transition: 0.2s ease; }
	.footerLink .linkImg a:hover { opacity: 0.7; }
}

@media screen and (max-width: 767px) {
	.footerLink { margin-bottom: 60px; }
	.footerLink .linkTitle { font-size: 2rem; line-height: 3rem; margin-bottom: 20px; }
	.footerLink .linkImg a { max-width: 360px; width: 100%; }
}



/* ――――――――――――――――――――――――――――――
［ footerInfo ］
―――――――――――――――――――――――――――――― */

.footerInfo { max-width: 1000px; border: solid #000000; border-width: 1px 0; text-align: center; padding-top: 25px; padding-bottom: 25px; margin: 0 auto 60px; }
.footerInfo .infoTitle { font-size: 2.4rem; line-height: 4rem; font-weight: 700; margin-bottom: 15px; }

@media screen and (max-width: 767px) {
	.footerInfo .infoTitle { font-size: 2rem; line-height: 3rem; margin-bottom: 10px; }
}



/* ――――――――――――――――――――――――――――――
［ footerOrganizer ］
―――――――――――――――――――――――――――――― */

.footerOrganizer { max-width: 760px; margin-right: auto; margin-left: auto; }
.footerOrganizer .organizerTitle { font-size: 2.4rem; line-height: 4rem; font-weight: 700; text-align: center; margin-bottom: 15px; }
.footerOrganizer .organizerLink { overflow: hidden; }
.footerOrganizer .organizerLink a { display: block; width: 360px; }
.footerOrganizer .organizerLink a:nth-child(1) { float: left; }
.footerOrganizer .organizerLink a:nth-child(2) { float: right; }

@media screen and (max-width: 767px) {
	.footerOrganizer .organizerTitle { font-size: 2rem; line-height: 3rem; }
	.footerOrganizer .organizerLink a { max-width: 360px; width: 100%; }
	.footerOrganizer .organizerLink a:nth-child(1),
	.footerOrganizer .organizerLink a:nth-child(2) { float: none; margin-right: auto; margin-left: auto; }
	.footerOrganizer .organizerLink a:nth-child(1) { margin-bottom: 20px; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 pageTop 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

#pageTop { position: relative; height: 100px; }
#pageTop #topBtn { position: fixed; z-index: 10000; right: calc( 50 / 1200 * 100% ); }
#pageTop #topBtn a { position: relative;overflow: hidden; display: block; width: 60px; height: 60px; background-color: #ffffff; border: solid 2px #000000; border-radius: 10px; font-size: 0; line-height: 0; }
#pageTop #topBtn a::before,
#pageTop #topBtn a::after { position: absolute; top: 0; bottom: 0; display: block; width: 18px; height: 3px; background-color: #000000; content: ""; margin: auto; }
#pageTop #topBtn a::before { right: 0; left: 11px; transform: rotate(45deg); }
#pageTop #topBtn a::after { right: 11px; left: 0; transform: rotate(-45deg); }

@media screen and (min-width: 821px) {
	#pageTop #topBtn a,
	#pageTop #topBtn a::before,
	#pageTop #topBtn a::after { transition: 0.2s ease; }
	#pageTop #topBtn a:hover { background-color: #000000; }
	#pageTop #topBtn a:hover::before,
	#pageTop #topBtn a:hover::after { background-color: #f1efd9; }
}

@media screen and (max-width: 767px) {
	#pageTop { height: 75px; }
	#pageTop #topBtn { position: static !important; right: 0; left: 0; }
	#pageTop #topBtn a { margin-right: auto; margin-left: auto; }
}