@charset "UTF-8";
/* ------------------------------------- ---------------------------------------- reset html5doctor.com Reset Stylesheet v1.6.1 (http://html5doctor.com/html-5-reset-stylesheet/) Richard Clark (http://richclarkdesign.com) http://cssreset.com ---------------------------------------- ------------------------------------- */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; box-sizing: border-box; }

body { line-height: 1; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

nav ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

/* change colours to suit your needs */
ins { background-color: #ffff99; color: #000000; text-decoration: none; }

/* change colours to suit your needs */
mark { background-color: #ffff99; color: #000000; font-style: italic; font-weight: bold; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }

table { border-spacing: 0; }

/* change border colour to suit your needs */
hr { display: block; height: 1px; border: 0; border-top: 1px solid #686765; margin: 1rem 0; padding: 0; }

input, select { vertical-align: middle; }

li { list-style: none; }

address { font-style: normal; }

a { overflow: hidden; outline: none; text-decoration: none; }

body { font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Helvetica, Arial, sans-serif; }

.fuwatAnime { animation-fill-mode: both; animation-duration: 1.5s; animation-name: fuwatAnime; visibility: visible !important; }

@keyframes fuwatAnime { 0% { opacity: 0;
    transform: translateY(-20px); }
  100% { opacity: 1;
    transform: translateY(0); } }

@keyframes fadeinAnime { 0% { opacity: 0; }
  100% { opacity: 1; } }

@keyframes shutter { 0% { clip-path: polygon(0 100%, 0 100%, 0 100%); }
  50% { clip-path: polygon(0 100%, 0 90%, 10% 100%); }
  80% { clip-path: polygon(0 100%, 0 70%, 30% 100%); }
  100% { clip-path: polygon(0 100%, 0 0, 100% 100%); } }

@font-face { font-family: 'tex'; src: url("../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-regular-webfont.eot"); src: url("../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-regular-webfont.woff") format("woff"), url("../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-regular-webfont.ttf") format("truetype"), url("../fonts/TeX-Gyre-Adventor-fontfacekit/texgyreadventor-regular-webfont.svg#texgyreadventorregular") format("svg"); font-weight: normal; font-style: normal; }

.mix-gradient, .supporter_box1 > dl > dt > a > b, .supporter_box1 > dl > dd > a > b, .supporter_box2 { background-image: linear-gradient(90deg, #00A0E9 0%, #0081CC 100%); }

html { /* Prevent iOS text size adjust after orientation change, without disabling user zoom. */ -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; font-size: 62.5%; }

html { background: #DFECF9; position: relative; z-index: -1; }

html:before { content: ""; width: 80vw; height: 80vw; display: block; background: url(../img/bar.svg) no-repeat left top; background-size: cover; animation: 1.5s shutter ease-in; position: absolute; top: 0w; left: 0; z-index: 0; }

@media (max-width: 899px) { html:before { width: 100vw; height: 120vw; } }

body { font-size: calc(1.6rem * 0.7 + 16vw / 30); line-height: 1.5em; color: #000000; padding: 0; background: url(../img/bg.svg) repeat-y 0 -15vw; background-size: contain; position: relative; z-index: 1; }

@media (max-width: 599px) { body { background: url(../img/bg2.svg) repeat-y 0 -15vw; background-size: contain; } }

#cha1 { padding-top: calc(100px + 3vw); margin-top: calc(-100px + 3vw); display: block; }

@media (max-width: 899px) { #cha1 { padding-top: calc(80px + 3vw); margin-top: calc(-80px + 3vw); } }

#cha2 { padding-top: calc(100px + 3vw); margin-top: calc(-100px + 3vw); display: block; }

@media (max-width: 899px) { #cha2 { padding-top: calc(80px + 3vw); margin-top: calc(-80px + 3vw); } }

#cha3 { padding-top: calc(100px + 3vw); margin-top: calc(-100px + 3vw); display: block; }

@media (max-width: 899px) { #cha3 { padding-top: calc(80px + 3vw); margin-top: calc(-80px + 3vw); } }

#cha4 { padding-top: calc(100px + 3vw); margin-top: calc(-100px + 3vw); display: block; }

@media (max-width: 899px) { #cha4 { padding-top: calc(80px + 3vw); margin-top: calc(-80px + 3vw); } }

#cha5 { padding-top: calc(100px + 3vw); margin-top: calc(-100px + 3vw); display: block; }

@media (max-width: 899px) { #cha5 { padding-top: calc(80px + 3vw); margin-top: calc(-80px + 3vw); } }

#cha6 { padding-top: calc(100px + 3vw); margin-top: calc(-100px + 3vw); display: block; }

@media (max-width: 899px) { #cha6 { padding-top: calc(80px + 3vw); margin-top: calc(-80px + 3vw); } }

#cha7 { padding-top: calc(100px + 3vw); margin-top: calc(-100px + 3vw); display: block; }

@media (max-width: 899px) { #cha7 { padding-top: calc(80px + 3vw); margin-top: calc(-80px + 3vw); } }

#cha8 { padding-top: calc(100px + 3vw); margin-top: calc(-100px + 3vw); display: block; }

@media (max-width: 899px) { #cha8 { padding-top: calc(80px + 3vw); margin-top: calc(-80px + 3vw); } }

#cha9 { padding-top: calc(100px + 3vw); margin-top: calc(-100px + 3vw); display: block; }

@media (max-width: 899px) { #cha9 { padding-top: calc(80px + 3vw); margin-top: calc(-80px + 3vw); } }

#cha10 { padding-top: calc(100px + 3vw); margin-top: calc(-100px + 3vw); display: block; }

@media (max-width: 899px) { #cha10 { padding-top: calc(80px + 3vw); margin-top: calc(-80px + 3vw); } }

header { width: 95%; height: 80px; background-color: #ffffff; display: flex; align-items: center; position: fixed; top: 3vw; left: 2.5%; z-index: 100; }

header > h1 { margin-right: auto; }

header > h1 > a { width: 300px; height: 70px; text-indent: -9999px; margin-left: 15px; background: url(../img/logo.svg) no-repeat left center; background-size: contain; display: block; transition: .3s; }

header > h1 > a:hover { opacity: 0.5; }

@media (max-width: 899px) { header { height: 60px; }
  header > h1 > a { width: 200px; height: 50px; margin-left: 15px; }
  header > nav { width: 100%; } }

#g-nav-list ul { display: flex; align-items: center; justify-content: flex-end; }

#g-nav-list ul li { font-size: calc(1.4rem * 0.7 + 14vw / 30); line-height: 1.3em; margin-left: 1.3em; }

#g-nav-list ul li > a { color: #000000; display: inline-block; position: relative; }

#g-nav-list ul li > a:hover { color: #ee1712; }

@media (min-width: 901px) { #g-nav { margin-top: 5px; margin-right: 20px; } }

@media (max-width: 899px) { #g-nav.panelactive { position: fixed; z-index: 2000; top: 0; left: 0; width: 100%; height: 100vh; }
  #g-nav.panelactive #g-nav-list { display: block; }
  #g-nav.panelactive ul { opacity: 1; }
  #g-nav ul { opacity: 0; position: absolute; z-index: 2000; top: 50%; left: 50%; transform: translate(-50%, -50%); }
  #g-nav ul li { animation-name: gnaviAnime; animation-duration: 1s; animation-delay: .2s; animation-fill-mode: forwards; opacity: 0; }
  #g-nav li { text-align: center; list-style: none; margin-bottom: 0.7em; }
  #g-nav li a { font-size: calc(1.7rem * 0.7 + 17vw / 30); line-height: 1.5em; color: #686765; text-decoration: none; padding: 5px 10px; display: block; text-transform: uppercase; letter-spacing: 0.1em; }
  .circle-bg { position: fixed; z-index: 3; width: 100px; height: 100px; border-radius: 50%; background: #ffffff; transform: scale(0); right: -50px; top: -50px; transition: all .6s; }
  .circle-bg.circleactive { transform: scale(50); }
  #g-nav-list { display: none; position: fixed; z-index: 2000; width: 100%; height: 100vh; overflow: auto; -webkit-overflow-scrolling: touch; }
  #g-nav-list ul { display: block; }
  #g-nav-list ul li { margin-left: 0; }
  @keyframes gnaviAnime { 0% { opacity: 0; }
    100% { opacity: 1; } } }

@media (min-width: 901px) { .openbtn { display: none; } }

@media (max-width: 899px) { .openbtn { width: 50px; height: 50px; cursor: pointer; display: block; position: absolute; top: 5px; right: 5px; z-index: 9999; }
  .openbtn span { display: inline-block; transition: all .4s; position: absolute; left: 14px; height: 1px; background-color: #686765; width: 45%; }
  .openbtn span:nth-of-type(1) { top: 16px; }
  .openbtn span:nth-of-type(2) { top: 24px; }
  .openbtn span:nth-of-type(3) { top: 32px; }
  .openbtn.active span:nth-of-type(1) { top: 18px; left: 18px; transform: translateY(6px) rotate(-45deg); width: 40%; }
  .openbtn.active span:nth-of-type(2) { opacity: 0; }
  .openbtn.active span:nth-of-type(3) { top: 30px; left: 18px; transform: translateY(-6px) rotate(45deg); width: 40%; } }

footer { color: #ffffff; margin: 0; background-color: #000000; }

footer > dl { padding: 2em; display: flex; align-items: flex-end; justify-content: space-between; }

footer > dl > dt > h4 { font-weight: normal; margin-bottom: 0.5em; }

footer > dl > dt > p { font-size: calc(1.3rem * 0.7 + 13vw / 30); line-height: 1.3em; }

footer > dl > dd > a { width: 20vw; margin-left: auto; display: block; transition: .3s; }

footer > dl > dd > a:hover { opacity: 0.3; }

footer > dl > dd > a > img { width: 100%; height: auto; margin: 0 0 0 auto; display: block; }

footer > dl > dd > small { font-size: calc(1rem * 0.7 + 10vw / 28); line-height: 1.3em; text-align: right; margin: 1em 0 0 auto; display: block; }

@media (max-width: 599px) { footer > dl { flex-direction: column; align-items: normal; justify-content: center; }
  footer > dl > dd > a { width: 25vw; } }

.mbv0 { margin-bottom: 0vw !important; }

.mbv1 { margin-bottom: 1vw !important; }

.mbv2 { margin-bottom: 2vw !important; }

.mbv3 { margin-bottom: 3vw !important; }

.mbv4 { margin-bottom: 4vw !important; }

.mbv5 { margin-bottom: 5vw !important; }

.mbv6 { margin-bottom: 6vw !important; }

.mbv7 { margin-bottom: 7vw !important; }

.mbv8 { margin-bottom: 8vw !important; }

.mbv9 { margin-bottom: 9vw !important; }

.mbv10 { margin-bottom: 10vw !important; }

.mbv11 { margin-bottom: 11vw !important; }

.mbv12 { margin-bottom: 12vw !important; }

.mbv13 { margin-bottom: 13vw !important; }

.mbv14 { margin-bottom: 14vw !important; }

.mbv15 { margin-bottom: 15vw !important; }

.mtv0 { margin-top: 0vw !important; }

.mtv1 { margin-top: 1vw !important; }

.mtv2 { margin-top: 2vw !important; }

.mtv3 { margin-top: 3vw !important; }

.mtv4 { margin-top: 4vw !important; }

.mtv5 { margin-top: 5vw !important; }

.mtv6 { margin-top: 6vw !important; }

.mtv7 { margin-top: 7vw !important; }

.mtv8 { margin-top: 8vw !important; }

.mtv9 { margin-top: 9vw !important; }

.mtv10 { margin-top: 10vw !important; }

.mtv11 { margin-top: 11vw !important; }

.mtv12 { margin-top: 12vw !important; }

.mtv13 { margin-top: 13vw !important; }

.mtv14 { margin-top: 14vw !important; }

.mtv15 { margin-top: 15vw !important; }

main { width: 70vw; height: auto; margin: 0 auto; position: relative; }

@media (max-width: 599px) { main { width: 80vw; } }

.content { padding: calc(100px + 3vw) 3vw 3vw 3vw; position: relative; z-index: 10; }

@media (max-width: 899px) { .content { padding: calc(80px + 3vw) 3vw 3vw 3vw; } }

.title_h2 { font-size: calc(1.8rem * 0.7 + 18vw / 30); line-height: 1.3em; text-align: center; font-weight: normal; margin-bottom: 1.5em; }

.title_h2 > i { font-family: 'tex'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1.5rem; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 5.5vw; line-height: 1em; font-style: normal; color: #000000; margin-bottom: 0.2em; display: block; }

.title_h2 > i > span { color: #00A0E9; }

@media (max-width: 899px) { .title_h2 { font-size: calc(1.6rem * 0.7 + 16vw / 30); line-height: 1.3em; }
  .title_h2 > i { font-size: 8vw; line-height: 1.3em; } }

.res_bar { display: none; }

@media (max-width: 599px) { .res_bar { display: block; } }

.inteo_wrap { margin: 5vw 0 10vw 0; }

.inteo_wrap > section { text-align: center; margin-top: 1.5em; margin-bottom: 10vw; }

.inteo_wrap > section > h2 { font-size: 5vw; line-height: 1.3em; color: #ffffff; padding: 0.1em 0.3em; margin-bottom: 0.3em; background-color: #00A0E9; display: inline-block; }

.inteo_wrap > section > h3 { font-size: 3.5vw; line-height: 1.3em; color: #00A0E9; margin-bottom: 0.3em; }

.inteo_wrap > section > p { font-size: 2vw; line-height: 1.5em; }

.inteo_wrap > section > img { width: 80%; height: auto; margin: 3vw auto 0 auto; display: block; }

@media (max-width: 899px) { .inteo_wrap > section > h2 { font-size: 6.5vw; line-height: 1.3em; }
  .inteo_wrap > section > h3 { font-size: 4.8vw; line-height: 1.3em; }
  .inteo_wrap > section > p { font-size: 2.5vw; line-height: 1.5em; }
  .inteo_wrap > section > img { width: 100%; height: auto; } }

@media (max-width: 599px) { .inteo_wrap > section > h2 { font-size: 7.5vw; line-height: 1.3em; }
  .inteo_wrap > section > h3 { font-size: 5.5vw; line-height: 1.3em; }
  .inteo_wrap > section > p { font-size: 3vw; line-height: 1.5em; } }

.inteo_wrap > article > p { line-height: 1.8em; text-indent: 1em; }

@media (max-width: 599px) { .inteo_wrap > article > p { line-height: 1.6em; } }

.inteo_wrap > article > img { width: 100%; height: auto; margin: 1em 0; display: block; }

.inteo_wrap > article > a { text-align: center; color: #000000; display: block; }

.inteo_wrap > article > a:before { content: ""; width: 1.3em; height: 1.3em; vertical-align: text-bottom; margin-right: 0.3em; background: url(../img/icon.svg) no-repeat center center; background-size: contain; display: inline-block; }

.inteo_wrap > article > a:hover { color: #ee1712; }

.content_wrap { margin-bottom: 10vw; }

.content_wrap > article > p { line-height: 1.8em; text-indent: 1em; }

@media (max-width: 599px) { .content_wrap > article > p { line-height: 1.6em; } }

.news_wrap { max-height: 18em; padding: 2em; margin-bottom: 10vw; background-color: #ffffff; display: flex; flex-wrap: wrap; overflow-y: auto; position: relative; }

.news_wrap > li { width: 100%; padding-right: 1em; margin-bottom: 1em; display: block; }

.news_wrap > li:last-of-type { margin-bottom: 0; }

.news_wrap > li > a, .news_wrap > li > i { color: #000000; display: flex; flex-wrap: wrap; }

.news_wrap > li > a > span, .news_wrap > li > i > span { width: 8em; display: block; }

.news_wrap > li > a > p, .news_wrap > li > i > p { width: calc(100% - 8em); }

.news_wrap > li > i { font-style: normal; }

.news_wrap > li > a { text-decoration: underline; }

.news_wrap > li > a:hover { color: #ee1712; }

@media (max-width: 599px) { .news_wrap { padding: 1.2em; }
  .news_wrap > li > a > span, .news_wrap > li > a > p, .news_wrap > li > i > span, .news_wrap > li > i > p { width: 100%; } }

.advisory_wrap { margin: 1.5em 0 1em 0; display: block; }

.advisory_wrap > li { padding: 1em; margin-bottom: 1.2em; background-color: #ffffff; display: flex; justify-content: space-between; }

.advisory_wrap > li:last-of-type { margin-bottom: 0; }

.advisory_wrap > li > img { width: 23%; height: 20%; display: block; }

.advisory_wrap > li > article { width: 73%; }

.advisory_wrap > li > article > b { font-size: calc(1.5rem * 0.7 + 15vw / 30); line-height: 1.3em; font-weight: normal; display: block; }

.advisory_wrap > li > article > h4 { font-size: calc(2.0rem * 0.7 + 20vw / 30); line-height: 1.3em; margin: 0.3em 0 0.5em 0; }

.advisory_wrap > li > article > p { font-size: calc(1.3rem * 0.7 + 13vw / 30); line-height: 1.5em; }

@media (max-width: 599px) { .advisory_wrap > li { justify-content: none; flex-direction: column; }
  .advisory_wrap > li > img { width: 60%; margin: 0 auto 1em auto; }
  .advisory_wrap > li > article { width: 100%; } }

.advisory_small { font-size: calc(1.2rem * 0.7 + 12vw / 30); line-height: 1.3em; text-align: right; margin: 0 0 10vw auto; display: block; }

.supporter_box1 { padding: 2em; margin: 1.5em 0 0 0; background-color: #ffffff; }

.supporter_box1 > b { font-size: calc(2.0rem * 0.7 + 20vw / 30); line-height: 1.3em; color: #00A0E9; text-align: center; margin-bottom: 0.7em; display: block; }

.supporter_box1 > dl { display: flex; justify-content: space-between; }

.supporter_box1 > dl > dt, .supporter_box1 > dl > dd { width: 48%; }

.supporter_box1 > dl > dt > a, .supporter_box1 > dl > dd > a { display: block; }

.supporter_box1 > dl > dt > a > b, .supporter_box1 > dl > dd > a > b { font-size: calc(1.8rem * 0.7 + 18vw / 30); line-height: 1.3em; color: #ffffff; text-align: center; padding: 1em 0.3em; display: block; }

.supporter_box1 > dl > dt > ul, .supporter_box1 > dl > dd > ul { margin-top: 0.5em; }

.supporter_box1 > dl > dt > ul > li, .supporter_box1 > dl > dd > ul > li { font-size: calc(1.5rem * 0.7 + 15vw / 30); line-height: 1.5em; font-weight: bold; text-indent: -1em; padding-left: 1em; margin-bottom: 0.5em; }

.supporter_box1 > dl > dt > ul > li > span, .supporter_box1 > dl > dd > ul > li > span { color: #00A0E9; }

@media (max-width: 599px) { .supporter_box1 { padding: 1.2em; }
  .supporter_box1 > dl { flex-direction: column; justify-content: none; }
  .supporter_box1 > dl > dt, .supporter_box1 > dl > dd { width: 100%; } }

.supporter_box2 { padding: 2em; }

.supporter_box2 > h3 { font-size: calc(2.4rem * 0.7 + 24vw / 30); line-height: 1.3em; color: #ffffff; text-align: center; margin-bottom: 0.7em; }

.supporter_box2 > p { color: #ffffff; line-height: 1.8em; text-indent: 1em; }

.supporter_box2 > address, .supporter_box2 > aside { color: #ffffff; text-align: center; padding: 2em; margin: 2em 0; border: 1px solid #ffffff; display: block; }

.supporter_box2 > address > h5, .supporter_box2 > aside > h5 { font-family: 'tex'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1.5rem; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: calc(2.8rem * 0.7 + 28vw / 30); line-height: 1.3em; font-weight: normal; margin-bottom: 0.6em; display: block; }

.supporter_box2 > address > h4, .supporter_box2 > aside > h4 { font-size: calc(2.4rem * 0.7 + 24vw / 30); line-height: 1.3em; font-weight: normal; margin-bottom: 0.6em; display: block; }

.supporter_box2 > address > p, .supporter_box2 > aside > p { font-size: calc(1.6rem * 0.7 + 16vw / 30); line-height: 1.3em; font-weight: bold; }

.supporter_box2 > address > a, .supporter_box2 > aside > a { font-size: calc(1.6rem * 0.7 + 16vw / 30); line-height: 1.3em; font-weight: bold; color: #ffffff; word-break: break-all; margin-top: 0.3em; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; }

.supporter_box2 > address > a:hover, .supporter_box2 > aside > a:hover { color: #ffff99; }

.supporter_box2 > address > a > b, .supporter_box2 > aside > a > b { font-size: 150%; line-height: 1.3em; display: block; }

.supporter_box2 > article { padding: 2em; margin: 2em 0; background-color: #ffffff; display: block; }

.supporter_box2 > article > h4 { font-size: calc(2.0rem * 0.7 + 20vw / 30); line-height: 1.3em; text-align: center; color: #00A0E9; margin-bottom: 0.6em; display: block; }

.supporter_box2 > article > ul { margin: 1em 0 2em 0; }

.supporter_box2 > article > ul > li { width: 100%; color: #ffffff; font-size: calc(1.7rem * 0.7 + 17vw / 30); line-height: 1.5em; font-weight: bold; padding: 0.8em 1.2em; margin-bottom: 0.5em; background-color: #00A0E9; }

.supporter_box2 > article > ul > li:last-of-type { margin-bottom: 0; }

.supporter_box2 > article > ul > li > span { font-size: 85%; line-height: 1.4em; font-weight: normal; margin-top: 0.3em; display: block; }

.supporter_box2 > article > ol { margin: 1em 0 2em 0; }

.supporter_box2 > article > ol > li { width: 100%; color: #ffffff; font-size: calc(1.5rem * 0.7 + 15vw / 30); line-height: 1.5em; font-weight: bold; padding: 0.8em 1.2em; margin-bottom: 0.5em; background-color: #00A0E9; }

.supporter_box2 > article > ol > li:last-of-type { margin-bottom: 0; }

.supporter_box2 > article > ol > li > a { color: #ffffff; text-decoration: underline; }

.supporter_box2 > article > ol > li > a:hover { color: #ffff99; }

.supporter_box2 > article > em { font-size: calc(2.0rem * 0.7 + 20vw / 30); line-height: 1.3em; text-align: center; font-style: normal; display: block; }

@media (max-width: 599px) { .supporter_box2 { padding: 1.2em; }
  .supporter_box2 > p { line-height: 1.6em; }
  .supporter_box2 > address, .supporter_box2 > article, .supporter_box2 > aside { padding: 1.2em; margin: 1em 0; } }

.supporter_box3 > h3 { font-size: calc(2.0rem * 0.7 + 20vw / 30); line-height: 1.3em; color: #00A0E9; text-align: center; padding: 1em 0.3em; margin-bottom: 1.5em; background-color: #ffffff; }

.supporter_box3 > ul { display: flex; flex-wrap: wrap; }

.supporter_box3 > ul > li { width: 31%; margin-right: 3.5%; margin-bottom: 1.5em; background-color: #ffffff; display: block; }

.supporter_box3 > ul > li:nth-of-type(3n) { margin-right: 0; }

.supporter_box3 > ul > li > a { padding: 0 1em 1em 1em; display: block; }

.supporter_box3 > ul > li > a:hover { opacity: 0.3; }

.supporter_box3 > ul > li > a > img { width: 100%; height: auto; margin-bottom: 1em; display: block; }

.supporter_box3 > ul > li > a > b { font-size: calc(1.3rem * 0.7 + 13vw / 30); line-height: 1.3em; color: #00A0E9; margin-bottom: 0.3em; display: block; }

.supporter_box3 > ul > li > a > p { font-size: calc(1.2rem * 0.7 + 12vw / 30); line-height: 1.3em; text-indent: -3em; padding-left: 3em; margin-top: 0.3em; color: #000000; }

@media (max-width: 599px) { .supporter_box3 > h3 { margin-bottom: 1em; }
  .supporter_box3 > ul > li { width: 47.5%; margin-right: 5%; margin-bottom: 1em; }
  .supporter_box3 > ul > li:nth-of-type(n) { margin-right: 5%; }
  .supporter_box3 > ul > li:nth-of-type(2n) { margin-right: 0; } }

.link_btn_pdf, .link_btn_xlsx, .link_btn_docx, .link_btn_pptx { margin-bottom: 0.7em; }

.link_btn_pdf > a, .link_btn_xlsx > a, .link_btn_docx > a, .link_btn_pptx > a { text-align: center; color: #ffffff; display: block; }

.link_btn_pdf > a:before, .link_btn_xlsx > a:before, .link_btn_docx > a:before, .link_btn_pptx > a:before { content: ""; width: 1.3em; height: 1.3em; vertical-align: text-bottom; margin-right: 0.3em; background: url(../img/icon.svg) no-repeat center center; background-size: contain; display: inline-block; }

.link_btn_pdf > a:hover, .link_btn_xlsx > a:hover, .link_btn_docx > a:hover, .link_btn_pptx > a:hover { color: #ffff99; }

.link_btn_xlsx > a:before { background: url(../img/icon2.svg) no-repeat center center; background-size: contain; }

.link_btn_docx > a:before { background: url(../img/icon3.svg) no-repeat center center; background-size: contain; }

.link_btn_pptx > a:before { background: url(../img/icon4.svg) no-repeat center center; background-size: contain; }

.essay_wrap > p { line-height: 1.8em; text-indent: 1em; }

.essay_wrap > ul { margin-top: 1.5em; display: flex; flex-wrap: wrap; }

.essay_wrap > ul > li { width: 31%; margin-right: 3.5%; margin-bottom: 1.5em; border: 8px solid #7ECEF4; background-color: #ffffff; display: block; }

.essay_wrap > ul > li:nth-of-type(3n) { margin-right: 0; }

.essay_wrap > ul > li > a { width: 100%; height: 100%; display: block; }

.essay_wrap > ul > li > a:hover { opacity: 0.3; }

.essay_wrap > ul > li > a > img { width: 100%; height: auto; display: block; }

.essay_wrap > ul > li > a > p { padding: 1em; }

.essay_wrap > ul > li > a > p > b { font-size: calc(1.3rem * 0.7 + 13vw / 30); line-height: 1.3em; color: #00A0E9; margin-bottom: 0.3em; display: block; }

.essay_wrap > ul > li > a > p > span { font-size: calc(1.2rem * 0.7 + 12vw / 30); line-height: 1.3em; color: #000000; display: block; }

@media (max-width: 599px) { .essay_wrap > p { line-height: 1.6em; }
  .essay_wrap > ul { margin-top: 1em; }
  .essay_wrap > ul > li { width: 47.5%; margin-right: 5%; margin-bottom: 1em; }
  .essay_wrap > ul > li:nth-of-type(n) { margin-right: 5%; }
  .essay_wrap > ul > li:nth-of-type(2n) { margin-right: 0; } }

.coming_soon { color: #7ECEF4; text-align: center; padding: 4em 2em; margin-top: 1.5em; border: 1px solid #7ECEF4; }

.coming_soon > i { font-family: 'tex'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1.5rem; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 5.5vw; line-height: 1em; font-style: normal; margin-bottom: 0.2em; display: block; }

.coming_soon > b { font-size: calc(1.8rem * 0.7 + 18vw / 30); line-height: 1.3em; text-align: center; font-weight: normal; }

@media (max-width: 899px) { .coming_soon > i { font-size: 8vw; }
  .coming_soon > b { font-size: calc(1.6rem * 0.7 + 16vw / 30); line-height: 1.3em; } }

.coming_soon2 { padding: 2em; margin-top: 1.5em; border: 1px solid #686765; }

.coming_soon2 > p { text-indent: 1em; line-height: 1.8em; }

@media (max-width: 899px) { .coming_soon2 { padding: 1em; }
  .coming_soon2 > b { font-size: calc(1.6rem * 0.7 + 16vw / 30); line-height: 1.3em; } }

.end_wrap { position: relative; }

.end_wrap > section { text-align: center; padding: 15vw 2vw 5vw 2vw; background-color: #00A0E9; clip-path: polygon(0 0, 50% 20%, 100% 0, 100% 100%, 0 100%); position: relative; }

.end_wrap > section > h2 { font-size: 4vw; line-height: 1.3em; color: #00A0E9; padding: 0.1em 0.3em; margin-bottom: 0.4em; background-color: #ffffff; display: inline-block; }

.end_wrap > section > h3 { font-size: 3vw; line-height: 1.3em; color: #ffffff; margin-bottom: 0.8em; }

.end_wrap > section > img { width: 35%; height: auto; margin: 0 auto; display: block; }

@media (max-width: 599px) { .end_wrap > section { clip-path: polygon(0 0, 50% 15%, 100% 0, 100% 100%, 0 100%); }
  .end_wrap > section > h2 { font-size: 5vw; line-height: 1.3em; }
  .end_wrap > section > h3 { font-size: 4.5vw; line-height: 1.3em; }
  .end_wrap > section > img { width: 70%; height: auto; } }