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


/* Common */
article { padding: 4em 0 1em 0; background-image: url("../images/body_bg.gif"); background-size: 20px auto; }
#container { width: 94%; max-width: 960px; margin: 0 auto; }
.column { padding-bottom: 4em; }
.column h1 { text-align: center; margin-bottom: 1em; padding: 0.5em; border-radius: 2em; background:#0D6FB8; }
.column h1 img { max-width: 350px; }
@media screen and (max-width: 520px) and (orientation: portrait) {
  article { padding: 2em 0 1em 0; }
  .column { padding-bottom: 3em; }
  .column h1 img { width: 90%; }
}


/* Header */
#head-logo { width: 100%; padding: .5em 0; background: #FFF; position: fixed; z-index: 10; }
#head-logo ul { width: 94%; margin: 0 auto; display: flex; align-items: center; }
#head-logo ul li { width: 120px; }
#head-logo ul li:last-child { width: 140px; margin-left: 20px; }
#head-logo ul li img { width: 100%; height: auto; }
#head-logo ul li a { transition: .3s; }
#head-logo ul li a:hover { opacity: .6; }
@media screen and (max-width: 520px) and (orientation: portrait) {
  #head-logo ul { justify-content: center; }
  #head-logo ul li { width: 30%; }
  #head-logo ul li:last-child { width: 35%; margin-left: 5%; }
}

header { width: 100%; padding-top: 5em; border-bottom: solid 30px #203288; background: url("../images/top_background.jpg") no-repeat center center; background-size: cover; }
header h1 { padding-bottom: 2%; }
#header-box { width: 94%; max-width: 960px; margin: 0 auto; padding: 4% 0 2% 0; position: relative; }
#keyvisual { width: 70%; position: absolute; left: 50%; bottom: -2%; transform: translateX(-50%); }
header h2 { width: 18%; height: auto; position: absolute; top: 45%; left: 1%; }
header h3 { font-size: 220%; line-height: 1.2; font-weight: bold; text-align: center; color: #238; display: flex; align-items: center; justify-content: center; text-shadow: 0px 0px 1px #FFF, 1px 1px 1px #FFF, -1px -1px 1px #FFF, -1px 1px 1px #FFF, 1px -1px 1px #FFF, 0 0 2px #FFF, 1px 1px 2px #FFF, 1px -1px 2px #FFF, -1px 1px 2px #FFF, -1px -1px 2px #FFF, 2px 2px 2px #FFF, 2px -2px 2px #FFF, -2px 2px 2px #FFF, -2px -2px 2px #FFF; }
header h3 strong { font-size: 70%; line-height: 1.2; text-align: center; vertical-align: middle; color: #FFF; width: 6em; margin-right: .7em; padding: .4em 0 .3em 0; border-radius: 1em; background: #238; text-shadow: none; display: block; }
header h3 span { padding-right: 1.5em; position: relative; }
header h3 span::before { content: ""; width: 0; height: 0; border-style: solid; border-width: .6em 0 .6em .9em; border-color: transparent transparent transparent #FFF; position: absolute; top: 50%; right: .3em; transform: translateY(-50%); filter: blur(1px); }
header h3 span::after { content: ""; width: 0; height: 0; border-style: solid; border-width: .4em 0 .4em .6em; border-color: transparent transparent transparent #238; position: absolute; top: 50%; right: .5em; transform: translateY(-50%); }
header p.attention { font-size: 93%; line-height: 1.4; text-indent: -1em; text-align: center; color: #C00; padding: .5em 0 0 1em; text-shadow: 0px 0px 1px #FFF, 1px 1px 1px #FFF, -1px -1px 1px #FFF, -1px 1px 1px #FFF, 1px -1px 1px #FFF, 0 0 2px #FFF, 1px 1px 2px #FFF, 1px -1px 2px #FFF, -1px 1px 2px #FFF, -1px -1px 2px #FFF, 2px 2px 2px #FFF, 2px -2px 2px #FFF, -2px 2px 2px #FFF, -2px -2px 2px #FFF; }
header ul.attention { padding-top: .5em; display: flex; align-items: center; justify-content: center; }
header ul.attention li { font-size: 115%; line-height: 1.4; text-align: center; color: #C00; text-shadow: 0px 0px 1px #FFF, 1px 1px 1px #FFF, -1px -1px 1px #FFF, -1px 1px 1px #FFF, 1px -1px 1px #FFF, 0 0 2px #FFF, 1px 1px 2px #FFF, 1px -1px 2px #FFF, -1px 1px 2px #FFF, -1px -1px 2px #FFF, 2px 2px 2px #FFF, 2px -2px 2px #FFF, -2px 2px 2px #FFF, -2px -2px 2px #FFF; }
header img { width: 100%; height: auto; }
header h4 { font-size: 180%; line-height: 1.2; font-weight: bold; text-align: center; color: #203288; width: 90%; max-width: 16em; padding: .3em 0; border: solid 3px #203288; border-radius: 1em; background: #FF3; position: absolute; left: 50%; bottom: -1.6em; transform: translateX(-50%); }
@media screen and (max-width: 520px) and (orientation: portrait) {
  #header-box { padding-bottom: 1em; }
  header h2 { top: 36%; }
  header h3 { font-size: 145%; line-height: 1.2; flex-wrap: wrap; }
  /* header h3 strong { margin: 0 0 .3em 0; margin-right: calc(50% - 3em); margin-left: calc(50% - 3em); } */
  header h4 { font-size: 150%; line-height: 1.2; }
  header ul.attention { flex-direction: column; }
  header ul.attention li { font-size: 93%; line-height: 1.4; text-indent: -1em; padding: 0 0 .2em 1em; }
}


/* Comment */
#comment { padding: 0 0 2em 0; background: #203288; }
#comment dl { width: calc(94% - 4em); max-width:  calc(960px - 4em); margin: 0 auto; padding: 1em 2em; border-radius: 1em; background: #FFF; box-shadow: 0 0 .3em rgba(0,0,0,0.3) inset; display: flex; align-items: center; justify-content: space-between; }
#comment dl dt { width: 15%; }
#comment dl dt img { width: 100%; height: auto; }
#comment dl dd { width: 82%; }
#comment dl dd h1 { font-size: 123%; line-height: 1.4; font-weight: bold; padding-bottom: .4em; }
#comment dl dd p { line-height: 1.6; }
@media screen and (max-width: 520px) and (orientation: portrait) {
  #comment { padding: 0 0 1em 0; }
  #comment dl { width: calc(94% - 2em); padding: 1em; }
  #comment dl dt { width: 25%; margin-bottom: 1em; }
  #comment dl dd { width: 70%; }
  #comment dl dd h1 { font-size: 105%; line-height: 1.4; }
  #comment dl dd p { font-size: 93%; line-height: 1.4; }
}


/* Intro */
#intro { padding: 2em 0; background: #FFF; }
#intro dl { width: 94%; max-width: 960px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
#intro dl dt { width: 15%; }
#intro dl dd { width: 82%; }
#intro dl dd h1 { width: 35%; margin-bottom: 1em; }
#intro dl dd p { font-size: 115%; line-height: 1.8; }
#intro dl dd p strong { font-weight: bold; color: #36B; background: #FE0; }
#intro dl dt img, #intro dl dd h1 img { width: 100%; height: auto; }
#intro ul { width: 96%; max-width: 960px; margin: 0 auto; padding-top: 2em; display: flex; flex-wrap: wrap; justify-content: space-between; }
#intro ul li { width: 16%; }
#intro ul li img { width: 100%; }
@media screen and (max-width: 520px) and (orientation: portrait) {
  #intro dl { flex-direction: column; }
  #intro dl dt { width: 50%; padding-bottom: 2em; }
  #intro dl dd { width: 100%; }
  #intro dl dd h1 { width: 70%; margin: 0 auto .8em auto; }
  #intro dl dd p { font-size: 100%; line-height: 1.4; }
  #intro ul { padding-top: 0; }
  #intro ul li { width: 48%; padding-top: 4%; }
}


/* Rule */
#rule {  }
#rule ul img { width: 100%; height: auto; }
#rule ul { display: flex; flex-wrap: wrap; justify-content: space-between; }
#rule ul li { text-align: center; width: 24%; padding-bottom: 1em; background-color: #FFF; border-radius: 1em; position: relative; }
#rule ul li::before { content: ""; width: 3em; height: 3em; border-radius: 50%; background: #0d6fb8; display: block; position: absolute; right: -1.8em; top: 50%; transform: translateY(-50%); z-index: 2; }
#rule ul li:last-child::before { width: 0; height: 0; background: none; display: none; }
#rule ul li::after { content: ""; width: 0; height: 0; border-style: solid; border-width: .8em 0 .8em 1em; border-color: transparent transparent transparent #FFF; display: block; position: absolute; right: -1em; top: 50%; transform: translateY(-50%); z-index: 3; }
#rule ul li:last-child::after { border: none; display: none; }
#rule ul li h2 { width: 23%; height: auto; position: absolute; top: .5em; left: .5em; }
#rule ul li dl { width: 90%; margin: 0 auto; padding: 2em 0 .5em 0; }
#rule ul li dl dt { width: 70%; margin: 0 auto; padding-bottom: 1em; }
#rule ul li dl dd { min-height: 2.8em; display: flex; align-items: center; justify-content: center; }
#rule ul li dl dd p { font-size: 105%; line-height: 1.4; text-align: center; }
#rule ul li dl dd p span::before { content: "\A"; white-space: pre; }
#rule ul li h3 { width: 85%; margin: 0 auto; }
@media screen and (max-width: 520px) and (orientation: portrait) {
  #rule {  }
  #rule ul { flex-direction: column; }
  #rule ul li { width: 100%; margin-bottom: 1em; padding-bottom: 0; }
  #rule ul li:last-child { margin-bottom: 0; }
  #rule ul li::before { width: 2em; height: 2em; top: auto; right: auto; bottom: -1.6em; left: 50%; transform: translate(-50%,0); }
  #rule ul li::after { border-width: .8em .6em 0 .6em; border-color: #FFF transparent transparent transparent; top: auto; right: auto; bottom: -1.1em; left: 50%; transform: translate(-50%,0); }
  #rule ul li h2 { width: 12%; top: -3%; left: -2%; }
  #rule ul li dl { padding: .5em 0; display: flex; justify-content: space-between; }
  #rule ul li dl dt { width: 30%; padding: 0 0 0 2%; }
  #rule ul li dl dd { width: 55%; padding: 0; }
  #rule ul li dl dd p { text-align: left; }
  #rule ul li dl dd p span::before { content: ""; }
}


/* Overview */
#outline { padding: 2rem; border-radius: 1em; background: #FFF; }
#outline ul { padding-bottom: 2rem; }
#outline ul li { padding: 0 0 1rem 7rem; position: relative; }
#outline ul li:last-child { padding-bottom: 0; }
#outline ul li h3 { line-height: 1.2; text-align: center; color: #FFF; width: 6em; padding: .2rem 0 .3rem 0; border-radius: .9rem; background: #0D6FB8; display: block; position: absolute; top: -.2rem; left: 0; }
#outline ul li span { padding-left: .5rem; }
#outline ul li ol { padding: 0; background: none; }
#outline ul li ol li { line-height: 1.4; padding: 0 0 .3rem 4.8rem; position: relative; }
#outline ul li ol li strong { font-weight: normal; text-align: center; color: #0D6FB8; width: 4rem; border: solid 1px #0D6FB8; border-radius: .3rem; display: block; position: absolute; left: 0; }
#outline ul li ol li i { font-style: normal; }
#outline ul li ul { padding: 0; background: none; }
#outline ul li ul li { line-height: 1.4; padding: 0 0 .2rem 1rem; position: relative; }
#outline ul li ul li i { font-size: 60%; line-height: 1.4; font-style: normal; color: #0D6FB8; position: absolute; left: .2rem; top: .35rem; }
#outline ul li ul.attention { padding-top: .2rem; }
#outline ul li ul.attention li { font-size: 93%; line-height: 1.4; text-indent: -1rem; padding-left: 1rem; }
#outline .map { width: 100%; margin: 0 auto 1rem auto; }
#outline .map iframe { width: 100%; aspect-ratio: 1/.5; }
#outline p.btn { width: 70%; max-width: 240px; margin: 0 auto; }
#outline p.btn a { text-align: center; padding: .6em 0; border-radius: 1.6em; background: #FFF; box-shadow: 0 0 0 3px #203288 inset; display: block; }
#outline p.btn a img { width: 70%; height: auto; filter: invert(16%) sepia(64%) saturate(3103%) hue-rotate(220deg) brightness(82%) contrast(87%); }
#outline p.btn a:hover { background: #203288; }
#outline p.btn a:hover img { filter: invert(100%) sepia(91%) saturate(38%) hue-rotate(321deg) brightness(110%) contrast(110%); }
#outline p.btn-close { font-size: 123%; line-height: 1.2; font-weight: bold; text-align: center; color: #FFF; max-width: 14em; margin: 0 auto; padding: .6em 0; border-radius: 1.4em; background: #999; }
@media screen and (max-width: 520px) and (orientation: portrait) {
  #outline { padding: 1em; }
  #outline ul li { padding: 0 0 1em 0; }
  #outline ul li h3 { margin-bottom: .3em; position: relative; top: 0; }
  #outline ul li span { padding-left: 0; }
  #outline ul li span::before { content: "\A"; white-space: pre; }
  #outline ul li ol li i::before { content: "\A"; white-space: pre; }
}

/*
#overview ul { padding: 2em; border-radius: 1em; background: #FFF; }
#overview ul li { padding: 0 0 1em 7em; position: relative; }
#overview ul li:last-child { padding-bottom: 0; }
#overview ul li h3 { line-height: 1.2; text-align: center; color: #FFF; width: 6em; padding: .2em 0 .3em 0; border-radius: .9em; background: #0D6FB8; display: block; position: absolute; top: -.2em; left: 0; }
#overview ul li span { padding-left: .5em; }
#overview ul li ol { padding: 0; background: none; }
#overview ul li ol li { line-height: 1.4; padding: 0 0 .3em 4.8em; position: relative; }
#overview ul li ol li strong { font-weight: normal; text-align: center; color: #0D6FB8; width: 4em; border: solid 1px #0D6FB8; border-radius: .3em; display: block; position: absolute; left: 0; }
#overview ul li ol li i { font-style: normal; }
#overview ul li ul { padding: 0; background: none; }
#overview ul li ul li { line-height: 1.4; padding: 0 0 .2em 1em; position: relative; }
#overview ul li ul li i { font-size: 60%; line-height: 1.4; font-style: normal; color: #0D6FB8; position: absolute; left: .2em; top: 1.3em; transform: translateY(-50%); }
#overview ul li ul.attention { padding-top: .2em; }
#overview ul li ul.attention li { font-size: 93%; line-height: 1.4; text-indent: -1em; padding-left: 1em; }
@media screen and (max-width: 520px) and (orientation: portrait) {
  #overview ul { padding: 1em; }
  #overview ul li { padding: 0 0 1em 0; }
  #overview ul li h3 { margin-bottom: .3em; position: relative; top: 0; }
  #overview ul li span { padding-left: 0; }
  #overview ul li span::before { content: "\A"; white-space: pre; }
  #overview ul li ol li i::before { content: "\A"; white-space: pre; }
}
*/

/* Regist */
#regist-box { display: flex; flex-wrap: wrap; justify-content: space-between; }
.regist-column { width: calc(32% - 10px); padding: 1.5em 0; border: 5px solid #249; border-radius: 1em; background: #FBE800; position: relative; }
.regist-column h2 { font-size: 300%; line-height: 1.2; font-weight: bold; text-align: center; color: #249; }
.regist-column h2 strong { font-size: 40%; line-height: 1.2; color: #FFF; width: 6em; margin: 0 auto .4em auto; padding: .3em 0; border-radius: .9em; background: #249; display: block; }
.regist-column h3 { font-size: 123%; line-height: 1.3em; font-weight: bold; text-align: center; color: #249; padding: .2em 0 1em 0; }
.regist-column h3 span { padding-left: 1em; }
.regist-column h4 { font-size: 123%; line-height: 1.2; text-align: center; color: #FFF; width: 3.6em; height: 3.6em; border-radius: 50%; background: #249; display: flex; align-items: center; justify-content: center; position: absolute; top: -.6em; right: .8em; }
.regist-column ul { width: 90%; margin: 0 auto; padding: .8em 0; border-top: solid 1px #249; display: flex; flex-wrap: wrap; justify-content: space-between; }
.regist-column ul li { font-size: 105%; line-height: 1.2; width: 100%; padding-bottom: .5em; display: flex; align-items: center; }
.regist-column ul li:last-child { padding-bottom: 0; }
.regist-column ul li h5 { font-size: 100%; line-height: 1.2; text-align: center; color: #FFF; width: 5em; margin-right: .5em; padding: .3em 0; border-radius: 1em; background: #249; display: block; }
.regist-column ul li h5 span { font-size: 80%; line-height: 1.2; padding-top: .1em; display: block; }
.regist-column ul li p { width: calc(100% - 5em); }
.regist-column ul li p span::before { content: "\A"; white-space: pre; }
.regist-column .map { width: 99%; height: 15em; margin: 0 auto 1em auto; }
.regist-column .map iframe { width: 100%; height: 15em; }
.regist-column p.btn { width: 70%; max-width: 240px; margin: 0 auto; }
.regist-column p.btn a { text-align: center; padding: .6em 0; border-radius: 1.6em; background: #FFF; box-shadow: 0 0 0 3px #203288 inset; display: block; }
.regist-column p.btn a img { width: 70%; height: auto; filter: invert(16%) sepia(64%) saturate(3103%) hue-rotate(220deg) brightness(82%) contrast(87%); }
.regist-column p.btn a:hover { background: #203288; }
.regist-column p.btn a:hover img { filter: invert(100%) sepia(91%) saturate(38%) hue-rotate(321deg) brightness(110%) contrast(110%); }
.regist-column p.btn-close { font-size: 123%; line-height: 1.2; font-weight: bold; text-align: center; color: #FFF; max-width: 14em; margin: 0 auto; padding: .6em 0; border-radius: 1.4em; background: #999; }

.regist-column p.period { font-size: 93%; line-height: 1.2; text-align: center; color: #C00; padding-top: .3em; }
#regist p.attention { font-size: 93%; line-height: 1.4; text-align: center; color: #C00; padding-top: .8em; text-shadow: 0px 0px 1px #FFF, 1px 1px 1px #FFF, -1px -1px 1px #FFF, -1px 1px 1px #FFF, 1px -1px 1px #FFF, 0 0 2px #FFF, 1px 1px 2px #FFF, 1px -1px 2px #FFF, -1px 1px 2px #FFF, -1px -1px 2px #FFF, 2px 2px 2px #FFF, 2px -2px 2px #FFF, -2px 2px 2px #FFF, -2px -2px 2px #FFF; }

#shapowell { padding: 1em 1em 0 1em; }
#shapowell a { border-radius: .8em; border: solid 3px #E46C82; background: #FFC; display: block; }
#shapowell a:hover { background: #FED; }
#shapowell img { width: 100%; height: auto; }
@media screen and (max-width: 768px) {
  .regist-column h3 span { padding-left: 0; }
  .regist-column h3 span::before { content: "\A"; white-space: pre; }
  .regist-column h4 { right: -.5em; }
  .regist-column ul li h5 { width: 4em; }
}
@media screen and (max-width: 520px) and (orientation: portrait) {
  #regist-box { flex-direction: column; }
  .regist-column { width: calc(100% - 10px); margin-bottom: 1em; padding: 1em 0; }
  .regist-column:nth-child(1) { order: 2; }
  .regist-column:nth-child(2) { order: 3; margin-bottom: 0; }
  .regist-column:nth-last-child(1) { order: 1; }
  .regist-column h2 { font-size: 240%; line-height: 1.2; }
  .regist-column h2 strong { font-size: 60%; line-height: 1.2; margin: 0 auto .2em auto; }
  .regist-column h3 { font-size: 115%; line-height: 1.3em; padding: .2em 0 .6em 0; }
  .regist-column h4 { font-size: 115%; line-height: 1.2; width: 3em; height: 3em; top: .5em; right: .5em; }
  .regist-column ul { width: 94%; }
  .regist-column ul li { font-size: 93%; line-height: 1.2; width: 48%; display: flex; align-items: center; }
  .regist-column ul li:first-child { width: 100%; }
  .regist-column ul li:nth-child(2) { padding-bottom: 0; }
  .regist-column ul li h5 { width: 5em; }
  .regist-column ul li p span::before { content: ""; }
  #regist p.attention { text-indent: -1em; text-align: justify; padding-left: 1em; }
}


/* Notes */
#notes-box { padding: 2em; border-radius: 1em; background: #FFF; }
#notes-box ul li { line-height: 1.4; padding: 0 0 .2em 1em; position: relative; }
#notes-box ul li:last-child { padding-bottom: 0; }
#notes-box ul li i { font-size: 60%; line-height: 1.4; font-style: normal; color: #0D6FB8; position: absolute; left: .2em; top: 1.3em; transform: translateY(-50%); }
#notes-box dl { padding-top: 1.5em; }
#notes-box dl dt { font-size: 115%; line-height: 1.2; text-align: center; color: #0D6FB8; margin-bottom: .5em; padding: .4em 0 .3em 0; border-radius: .5em; background: #CFE2F1; }
#notes-box dl dd p { padding-bottom: 1em; }
@media screen and (max-width: 520px) and (orientation: portrait) {
  #notes-box { padding: 1em; }
  #notes-box dl dt span::before { content: "\A"; white-space: pre; }
}


/* FAQ */
#faq-box { padding: 2em 2em 1em 2em; border-radius: 1em; background: #FFF; }
#faq-box dl { padding-bottom: 1em; }
#faq-box dl dt { font-size: 115%; line-height: 1.4; font-weight: bold; color: #0D6FB8; padding: 0 0 .1em 1.2em; position: relative; }
#faq-box dl dd { line-height: 1.4; padding-left: 1.4em; position: relative; }
#faq-box dl dt strong { color: #0D6FB8; position: absolute; left: 0; }
#faq-box dl dd strong { color: #F60; position: absolute; left: 0; }
#faq-box dl dd .attention li { font-size: 93%; line-height: 1.4; text-indent: -1em; padding: .2em 0 0 1em; }
@media screen and (max-width: 520px) and (orientation: portrait) {
  #faq-box { padding: 1em 1em .5em 1em; }
}


/* Footer */
footer { padding-bottom: 1rem; }
#contact { text-align: center; color: #FFF; padding: 1.5em 0; background: #0D6FB8; }
#contact-box { width: 94%; max-width: 960px; margin: 0 auto; }
#contact a { color: #FFF; }
#contact a:hover { text-decoration: underline; }
#contact h1 { font-size: 105%; line-height: 1.2; text-align: center; }
#contact p { font-size: 123%; line-height: 1.2; text-align: center; padding-top: .4em; }
#contact p a::before { content: "："; }
#main-sponsor { width: 94%; max-width: 960px; margin: 0 auto; padding: 1.5em 0; border-bottom: solid 1px #808080; display: flex; justify-content: center; }
#main-sponsor dl { width: 20%; }
#main-sponsor dl:nth-of-type(1) { width: 65%; margin-right: 5%; }
#main-sponsor dl dt { font-size: 105%; line-height: 1.2; text-align: center; padding-bottom: .5em; }
#main-sponsor dl dd { text-align: center; min-height: 60%; display: flex; align-items: center; justify-content: center; }
#main-sponsor dl dd img { max-width: 80%; height: auto; }
#main-sponsor dl dd p { font-size: 220%; line-height: 1.2; font-weight: bold; color: #333; }
#main-sponsor dl dd p a { color: #333; }
#main-sponsor dl dd ul { display: flex; justify-content: center; }
#main-sponsor dl dd ul li { font-size: 220%; line-height: 1.2; font-weight: bold; text-align: center; color: #333; width: 4em; padding: 0 .5em; }
#main-sponsor dl dd ul li span { font-size: 40%; line-height: 1.2; font-weight: normal; text-align: center; width: 100%; display: block; }
#sub-sponsor { width: 94%; max-width: 960px; margin: 0 auto; }
#sub-sponsor li { padding: .7em 0 .7em 7em; border-bottom: dotted 1px #808080; position: relative; }
#sub-sponsor li:last-child { border-bottom: none; }
#sub-sponsor li h3 { position: absolute; left: 0; }
#sub-sponsor li h3 span { font-size: 85%; }
#sub-sponsor li a { color: #333; }
#sub-sponsor li a:hover { color: #F60; }
#sub-sponsor li ul { width: 100%; }
#sub-sponsor li ul li { padding: 0; border-bottom: none; display: inline-block; }
#sub-sponsor li ul li:last-child { padding-bottom: 0; border-bottom: none; }
#sub-sponsor li ul li::after { content: "、"; }
#sub-sponsor li ul li:last-child::after { content: ""; }
#sub-sponsor li ul li span { font-size: 85%; padding-left: 1em; }
@media screen and (max-width: 520px) and (orientation: portrait) {
  footer { padding-bottom: 2rem; }
  #contact p { font-size: 100%; line-height: 1.2; }
  #contact p a::before { content: "\A"; white-space: pre; }
  #main-sponsor { padding: .8em 0; }
  #main-sponsor { flex-direction: column; }
  #main-sponsor dl, #main-sponsor dl:nth-of-type(1) { width: 100%; margin: 0 0 .5rem 0; }
  #main-sponsor dl dd img { max-width: 100%; height: auto; }
  #main-sponsor dl dd p { font-size: 140%; line-height: 1.2; font-weight: bold; color: #333; }
  #main-sponsor dl dd ul { flex-direction: column; }
  #main-sponsor dl dd ul li { font-size: 180%; line-height: 1.2; text-align: center; width: auto; padding: 0; }
  #main-sponsor dl dd ul li:first-child { padding-bottom: .1em; }
  #sub-sponsor li { font-size: 93%; line-height: 1.3; padding: .7em 0; }
  #sub-sponsor li h3 { padding-bottom: .2em; position: relative; }
  #sub-sponsor li ul li { font-size: 100%; line-height: 1.3; }
}


#kokoromi { margin-top: 2em; padding: 1.5em 0; border-top: solid 1px #CCC; }
#kokoromi dl { width: min(94%,960px); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
#kokoromi dl dt { width: 140px; }
#kokoromi dl dt img { width: 100%; height: auto; }
#kokoromi dl dd { font-size: 93%; line-height: 1.4; text-align: justify; width: calc(100% - 170px); }
#kokoromi dl dd span::before { content: "\A"; white-space: pre; }
@media only screen and (max-width: 520px) {
  #kokoromi dl { flex-direction: column; }
  #kokoromi dl dt { width: 60%; margin: 0 auto; padding-bottom: .8em; }
  #kokoromi dl dd { width: 100%; }
  #kokoromi dl dd span::before { content: ""; }
}


/* Return Button */
#return-btn { width: 60px; height: 60px; position: fixed; bottom: 10px; right: 10px; z-index: 3; }
#return-btn img { width: 100%; height: auto; }
#return-btn a img { opacity: 1; transition: .3s; }
#return-btn a:hover img { opacity: .8; }
@media only screen and (max-width: 520px) {
	#return-btn { width: 40px; height: 40px; }
}