@charset "utf-8";
/* CSS Document */
html{ margin-top: 0 !important;}
html,body,h1,h2,h3,dl,dt,dd,ul,ol,li,p{ margin: 0; padding: 0;}
body,input,textarea{ font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;}
h1{ color: #2a2359; font-size: 10px !important; height: 12px; line-height: 12px; padding: 4px 0 !important; position: relative; text-align: center; z-index: 1;}
h2{ text-align: center;}
ul,ol,li{ list-style-type: none;}
img{ border: none; outline: none;}
a{ color: #9A0201; text-decoration: none;}
.ul-flex-01{ display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap;}
.first-view-area-01 h2,#slideshow p{ font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;}
.first-view-area-01 li a{transition: all 0.4s;}
.error-text-01{ color: #fd0000; display: none; font-size: 14px !important; font-weight: bold; margin-top: 10px !important; position: relative;}
.error-text-01.error-display,.confirmation-area-01.error-display{ display: block;}
p#confirmation-area-01.confirmation-area-01{ margin-bottom: 60px !important;}
.error-text-01::before{ content: "⇒"; display: inline-block; transform: rotate(-90deg);}
.confirmation-area-01{ display: none; margin-bottom: 80px !important; text-align: center;}
.confirmation-area-01 > span{ background-color: #efefef; border: thick double #898989; display: inline-block; font-size: 18px; font-weight: bold; line-height: 24px; padding: 20px;}
.confirmation-area-01 > span span{ background-color: #fd0036; border-radius: 16px; color: #ffffff; font-size: 12px; margin: 0 4px; padding: 4px 10px; vertical-align: top;}
#lp-telework{ display: none;}
#lp-telework.click-btn-display{ display: block;}
.pointer-events-none{ opacity: .3; pointer-events: none !important;}
.wpcf7{ background: inherit !important; border: none !important; margin: 0 !important;}
.wpcf7 p{ margin-bottom: 0 !important;}
.form-area-01 dd center input,.wpcf7 input.wpcf7-submit,.wpcf7 input.wpcf7-previous{ width: min( 100% , 600px) !important;}

.first-view-area-01{ background-image: url('../images/lp-remote-island/lp-ri-first-view-miyakojima.jpg'); background-position: center -90px; background-size: cover; height: 600px; margin: -20px auto 0; position: relative; width: 100%; z-index: 0;}
.first-view-area-01 > a,.first-view-area-02 > a{ cursor: default; left: 20px; position: absolute; top: 20px; z-index: 1;}
.first-view-area-01 ul,.first-view-area-02 ul{ text-align: center; left: 0; position: absolute; top: 100px; width: 100%; z-index: 1;}
.first-view-area-01 li:first-child p{ color: #ffffff; font-size: 20px; margin-bottom: 30px; text-shadow: 2px 2px 1px rgba( 0, 0, 0, .8), 0 0 1px rgba( 0, 0, 0, .8);}
.first-view-area-01 li:first-child p span{ border-bottom: 1px solid #ffffff; border-top: 1px solid #ffffff; padding: 6px 8px;}
.first-view-area-01 li:nth-child(3) p{ color: #ffffff; font-size: 13px; margin-bottom: 40px;}
.first-view-area-01 li:nth-child(3) p span{ background-color: rgba( 0, 0, 0, .6); border-radius: 11px; display: inline-block; padding: 5px 14px;}
.first-view-area-01 li:nth-child(3) p span br{ display: none;}
.first-view-area-01 li:nth-child(4) p{ color: #ffffff; font-size: 18px; font-weight: bold; line-height: 24px; margin-bottom: 10px; text-shadow: 2px 2px 1px #444444;}
.first-view-area-01 li:nth-child(4) p > span{ display: inline-block; position: relative;}
.first-view-area-01 li:nth-child(4) p > span::before,.first-view-area-01 li:nth-child(4) p > span::after{ background-color: #ffffff; bottom: 0; content: ""; display: inline-block; height: 40px; position: absolute; width: 1px;}
.first-view-area-01 li:nth-child(4) p > span::before{ left: -10px; transform: rotate(-15deg);}
.first-view-area-01 li:nth-child(4) p > span::after{ right: -10px; transform: rotate(15deg);}
.first-view-area-01 li:nth-child(4) p span span{ color: #fff000; font-size: 24px; margin: 0 4px;}
.first-view-area-01 h2{ color: #ffffff; font-size: 64px; line-height: 70px; text-shadow: 2px 2px 3px rgba( 0, 0, 0, .8), 0 0 2px rgba( 0, 0, 0, .8);}
.first-view-area-01 h2 span{ font-size: 84px;}
.first-view-area-01 h2 span:first-child,.first-view-area-01 h3 span:nth-child(3){ position: relative;}
.first-view-area-01 h2 span:first-child::before,.first-view-area-01 h3 span:nth-child(3):before{ content: "※"; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important; font-size: 14px; font-weight: bold; line-height: 20px; position: absolute; right: 0; top: -6px;}
.first-view-area-01 h2 span:nth-child(3){ font-size: 90px; font-weight: normal; margin-left: -20px;}
.first-view-area-01 h2 br,.first-view-area-01 h3 br{ display: none;}
.first-view-area-01 h3{ color: #ffffff; font-size: 30px; font-weight: normal; margin: 10px auto 20px; text-shadow: 2px 2px 3px rgba( 0, 0, 0, .8), 0 0 2px rgba( 0, 0, 0, .8);}
.first-view-area-01 h3 span:nth-child(3):before{ right: -14px;}
.first-view-area-01 li a{ background: linear-gradient(179deg, #ffffff, #faa619, #f1803c ,#fd6a12); border-radius: 10px; box-shadow: 0 6px 12px rgba(0, 0, 0, .3); color: #222222; display: block; font-size: 18px; font-weight: bold; margin: 0 auto; padding: 20px 10px; position: relative; width: min( calc(92% - 20px), 400px);}
.first-view-area-01 li a::before,.first-view-area-01 li a::after{ content: ""; position: absolute; display: inline-block; z-index: 1;}
.first-view-area-01 li a::before{ background-color: #ffffff; border-radius: 50%; height: 24px; top: calc(50% - 12px); right: 20px; width: 24px;}
.first-view-area-01 li a::after{ border: 2px solid #444444; border-bottom: 0; border-left: 0; box-sizing: border-box; color: #444444; height: 8px; line-height: 1; top: calc(50% - 4px); transform: translateX(-25%) rotate(45deg); right: 28px; width: 8px;}
.first-view-area-01 li a:hover{ box-shadow: 0 2px 4px rgba(0, 0, 0, .8); transform: translate( 0, 2px);}
.first-view-area-01 li a > span:first-child{ background: linear-gradient(to bottom, #fbca78, #fabe59, #faa619); border-radius: 8px 8px 6px 6px; height: 32px; left: 2px; position: absolute; top: 2px; width: calc(100% - 4px);}
.first-view-area-01 li a > span:nth-child(2){ position: relative; text-shadow: 2px 2px 1px #ffffff, -2px 2px 1px #ffffff, 2px -2px 1px #ffffff, -2px -2px 1px #ffffff, 1px 0 0 #ffffff, -1px 0 0 #ffffff, 0 1px 0 #ffffff, 0 -1px 0 #ffffff; z-index: 1;}
.first-view-area-01 li a span span{ font-size: 24px;}
.first-view-area-02{ background-image: url('../images/lp-remote-island/lp-ri-first-view-ishigakijima.jpg'); background-position: center; background-size: cover; height: 600px; margin: -20px auto 0; position: relative; width: 100%; z-index: 0;}
.first-view-area-02 ul{ text-align: center; top: 200px; width: 100%;}
.first-view-area-02 li{ background-color: rgba( 255, 255, 255, .8); border-radius: 10px; display: inline-block; padding: 20px 30px; width: min( calc(92% - 60px), 740px);}
.first-view-area-02 p{ font-size: 16px; line-height: 24px;}

.remote-island-photo-01{ animation: scroll-anim 900s linear infinite; background-image: url('../images/lp-remote-island/lp-ri-photo-01.png'); background-position: center left; background-repeat: repeat-x; height: 220px; margin: -60px auto 20px; overflow: hidden; position: relative; width: 100%; z-index: 2;}
@keyframes scroll-anim {
    100% {
      background-position: 500% 0;
    }
}

.participants-area-01,.users-voice-area-01{ background-color: rgba( 0, 232, 197, .05); margin-bottom: 70px; padding: 60px 0 40px; width: 100%;}
.participants-area-01 dt,.participants-area-01 dd,.users-voice-area-01 dt,.users-voice-area-01 dd,.achievements-area-01 dt,.achievements-area-01 dd{ margin: 0 auto; width: min( 92%, 1000px);}
.participants-area-01 h2,.overview-area-01 h2,.held-regularly-area-01 h2,.users-voice-area-01 h2,.achievements-area-01 h2,.step-3-area-01 h2,.form-area-01 h2{ color: #888888; font-size: 40px; line-height: 50px; margin-bottom: 20px;}
.participants-area-01{ margin-bottom: 60px; padding: 40px 0;}
.participants-area-01 h2 br{ display: none;}
.participants-area-01 ul{ background-color: #ffffff; border-radius: 10px; border: 1px solid #0025c3; display: -webkit-flex; display: flex; flex-wrap : wrap; -webkit-justify-content: space-between; justify-content: space-between; padding: 20px 30px;}
.participants-area-01 li{ width: 50%;}
.participants-area-01 li p{ font-size: 20px; font-weight: bold; line-height: 30px; padding-left: 26px; position: relative;}
.participants-area-01 li p span{ font-size: 18px; font-weight: normal;}
.participants-area-01 li p::before,.participants-area-01 dd li p::after{ content: ""; display: inline-block; position: absolute;}
.participants-area-01 li p::before{ border-radius: 4px; border: 1px solid #666666; height: 16px; left: 0; top: 6px; width: 16px;}
.participants-area-01 li p::after{ border-right: 3px solid #fd0036; border-bottom: 3px solid #fd0036; height: 9px; left: 5px; margin-top: -8px; top: 15px; transform: rotate(45deg); width: 5px;}


.overview-area-01,.held-regularly-area-01,.step-3-area-01{ margin: 0 auto 100px; width: min( 92%, 1000px);}
.overview-area-01 h2,.held-regularly-area-01 h2,.users-voice-area-01 h2,.step-3-area-01 h2,.form-area-01 h2{ color: #888888; font-size: 40px; line-height: 50px; margin-bottom: 20px;}

.overview-area-01 li:first-child{ border-radius: 10px; margin-right: 30px !important; overflow: hidden; width: 400px;}
.overview-area-01 li:last-child{ width: calc(100% - 430px);}
.overview-area-01 p{ font-size: 16px; line-height: 26px;}
.overview-area-01 p span span{ color: #0025c3; font-weight: bold;}

.held-regularly-area-01 h2 span span{ font-size: 24px; font-weight: normal;}
.held-regularly-area-01 table{ border-collapse: collapse; margin: 20px auto 6px; table-layout: fixed; width: 100%;}
.held-regularly-area-01 table,.held-regularly-area-01 table th{ border: 1px solid #666666;}
.held-regularly-area-01 table th:first-child{ border-right: 1px solid #ffffff;}
.held-regularly-area-01 table tbody td:nth-child(2){ border-left: 1px dotted #666666; border-right: 1px dotted #666666;}
.held-regularly-area-01 table th,.held-regularly-area-01 table td{ padding: 10px;}
.held-regularly-area-01 table thead{ background-color: #0097c3;}
.held-regularly-area-01 table th p{ color: #ffffff; text-align: center;}
.held-regularly-area-01 table tbody tr:nth-child(even){ background-color: rgba( 0, 151, 195, .1);}
.held-regularly-area-01 table td{ font-size: 20px; text-align: center;}
.held-regularly-area-01 table td span{ font-size: 14px;}
.held-regularly-area-01 dd > p{ font-size: 14px; line-height: 20px;}
.held-regularly-area-01 dd > p:last-child{ margin: 4px auto 100px;}

.users-voice-area-01 dd > ul > li{ margin-bottom: 60px; position: relative;}
.users-voice-area-01 dd > ul > li::before{ background-repeat: no-repeat; content: ""; display: inline-block; height: 310px; position: absolute; top: 0; width: 360px;}
.users-voice-area-01 dd > ul > li:first-child::before{ background-image: url('../images/lp-remote-island/lp-ri-user-voice-01.png');}
.users-voice-area-01 dd > ul > li:nth-child(2)::before{ background-image: url('../images/lp-remote-island/lp-ri-user-voice-02.png');}
.users-voice-area-01 dd > ul > li:nth-child(3)::before{ background-image: url('../images/lp-remote-island/lp-ri-user-voice-03.png');}
.users-voice-area-01 dd > ul > li:last-child::before{ background-image: url('../images/lp-remote-island/lp-ri-user-voice-04.png');}
.users-voice-area-01 dd > ul > li:nth-child(odd){ margin-left: 370px;}
.users-voice-area-01 dd > ul > li:nth-child(odd)::before{ left: -370px;}
.users-voice-area-01 dd > ul > li:nth-child(even){ margin-right: 370px;}
.users-voice-area-01 dd > ul > li:nth-child(even)::before{ right: -370px;}
.users-voice-area-01 dd > ul > li > h3{ color: #00a98f; font-size: 20px; line-height: 30px; margin-bottom: 10px; text-align: justify;}
.users-voice-area-01 dd > ul > li > p{ font-size: 16px; line-height: 26px; margin-bottom: 10px; text-align: justify;}
.users-voice-area-01 dd > ul > li li{ margin-bottom: 6px;}
.users-voice-area-01 dd > ul > li li{ font-size: 12px;}

.achievements-area-01{ margin-bottom: 80px;}
.achievements-area-01 h2 br{ display: none;}
.achievements-area-01 ul.ul-flex-01{ justify-content: center; margin: 0 auto !important; width: min( 100%, 790px) !important;}
.achievements-area-01 ul.ul-flex-01 li{ background-image: url('../images/lp-remote-island/lp-ri-achievements-01.png'); background-repeat: no-repeat; height: 180px; margin: 0 10px !important; text-align: center; width: 180px;}
.achievements-area-01 h3{ font-size: 16px; line-height: 20px; text-shadow: 2px 2px 2px #ffffff, 0 0 1px #ffffff;}
.achievements-area-01 p{ color: #c39026; font-size: 22px; font-weight: bold; line-height: 28px; text-shadow: 2px 2px 1px #ffffff, -1px -1px 0 #ffffff;}
.achievements-area-01 p span{ font-size: 34px;}
.achievements-area-01 p.small{ color: #000000; font-size: 14px; font-weight: normal; line-height: 18px;}
.achievements-area-01 p.small span{ font-size: 14px; font-weight: bold;}
.achievements-area-01 li:first-child h3{ margin-top: 36px;}
.achievements-area-01 li:first-child p{ margin-top: 10px;}
.achievements-area-01 li:nth-child(2) h3{ margin-top: 22px;}
.achievements-area-01 li:nth-child(2) p{ margin-top: 6px;}
.achievements-area-01 li:nth-child(2) p.small{ margin-top: 2px;}
.achievements-area-01 li:nth-child(3) h3{ margin-top: 48px;}
.achievements-area-01 li:nth-child(3) p{ margin-top: 10px;}
.achievements-area-01 li:nth-child(4) h3{ margin-top: 50px;}
.achievements-area-01 li:nth-child(4) p{ margin-top: 6px;}
.achievements-area-01 li:nth-child(4) p.small{ margin-top: 4px;}
.achievements-area-01 li:last-child h3:first-child{ margin-top: 26px;}
.achievements-area-01 li:last-child p{ margin-top: 2px;}
.achievements-area-01 li:last-child h3:nth-child(3){ margin-top: 4px;}

.step-3-area-01 ul{ margin-top: 30px;}
.step-3-area-01 li{ margin-right: 30px; position: relative; width: 280px;}
.step-3-area-01 li:last-child{ margin-right: 0;}
.step-3-area-01 dd ul li::before,.step-3-area-01 dd ul li::after{ border-top: 4px solid rgba( 0, 169, 143, .5); border-right: 4px solid rgba( 0, 169, 143, .5); bottom: 60%; content: ""; display: inline-block; height: 18px; margin: 0 10px; position: absolute; transform: rotate(45deg); width: 18px;}
.step-3-area-01 dd ul li::before{ right: -64px;}
.step-3-area-01 dd ul li::after{ right: -48px;}
.step-3-area-01 dd ul li:nth-child(3)::before,.step-3-area-01 dd ul li:nth-child(3)::after{ display: none;}
.step-3-area-01 dd ul li dt div{ background-image: url('../images/lp-remote-island/lp-ri-step-3-icon.png'); background-position: center 0; background-repeat: no-repeat; height: 130px; text-indent: -9999px; width: 100%;}
.step-3-area-01 dd ul li:nth-child(2) dt div{ background-position: center -150px;}
.step-3-area-01 dd ul li:nth-child(3) dt div{ background-position: center -300px;}
.step-3-area-01 dd ul li dt p{ color: #00a98f; font-size: 22px; font-weight: bold; letter-spacing: 6px; line-height: 28px; margin-bottom: 10px; text-align: center;}
.step-3-area-01 dd ul li dt h3{ color: #0025c3; font-size: 18px; line-height: 28px; text-align: center;}
.step-3-area-01 dd ul li dd p{ font-size: 16px; line-height: 24px; text-align: justify;}

.form-area-01{ margin: 0 auto 80px; width: min( 92%, 1000px);}
.form-area-01 dd > p{ font-size: 16px; line-height: 22px; margin: 0 auto 40px; text-align: center;}
.form-area-01 dd .screen-reader-response{ color: #9A0201; font-size: 14px; font-weight: bold; text-align: center;}
.form-area-01 dd table{ border-collapse: collapse; border-bottom: 2px solid #adadad; border-top: 2px solid #adadad; font-size: 14px; margin-bottom: 40px; table-layout: fixed; width: 100%;}
.form-area-01 dd table tr{ border-bottom: 1px dotted #adadad;}
.form-area-01 dd table tr:nth-child(even){ background-color: rgba( 0, 232, 197, .05);}
.form-area-01 dd table th,.form-area-01 dd table td{ padding: 10px;}
.form-area-01 dd table th{ border-right: 1px dotted #adadad; text-align: left; position: relative; vertical-align: middle; width: 330px;}
.form-area-01 dd table th p > span:first-child{ background-color: #fd0036; border-radius: 13px; color: #ffffff; font-size: 12px; padding: 4px 10px; position: absolute; right: 10px; top: calc(50% - 10px);}
.form-area-01 dd table th p > span:first-child.arbitrarily{ background-color: #868686;}
.form-area-01 dd table th p > span:nth-child(2){ color: #666666; display: inline-block; line-height: 21px; width: calc(100% - 56px);}
.form-area-01 dd table th p > span:nth-child(2) span{ font-size: 12px; font-weight: normal;}

.form-area-01 dd table td p{ margin-bottom: 0 !important;}
.form-area-01 dd table td input{ font-size: 18px; padding: 10px; width: 100%;}
.form-area-01 dd table td .wpcf7-not-valid-tip{ color: #9A0201; display: inline-block; font-size: 14px; font-weight: bold; margin-top: 6px;}
.form-area-01 dd table td select{ font-size: 18px; padding: 10px; max-width: 100% !important; width: 100% !important;}
.form-area-01 dd table td textarea{ background-color: #ffffff; font-size: 16px; padding: 10px; width: 100%;}
.form-area-01 dd center input,.wpcf7 input.wpcf7-submit,.wpcf7 input.wpcf7-previous{ background-color: #00a98f !important; border-radius: 6px; border: 2px solid #57e9d3 !important; box-shadow: 0px 2px 4px #898989; color: #ffffff; font-size: 22px !important; height: auto; letter-spacing: 2px; margin: auto !important; padding: 20px 0; width: auto;}
.form-area-01 dd center input:hover{ opacity: .6;}
.form-area-01 dd .line-area-01{ border-radius: 8px; border: 1px dotted #01b901; margin: 100px auto 80px; padding: 40px 20px 20px; text-align: center;}
.form-area-01 dd .line-area-01 h3{ color: #666666; text-align: center;}
.form-area-01 dd .line-area-01 h3 span{ display: inline-block; font-size: 18.7px; line-height: 28px; padding-left: 50px; position: relative; text-align: left;}
.form-area-01 dd .line-area-01 h3 span::before{ background-image: url("../images/lp-remote-island/line-icon-01.png"); background-size: 100%; content: ""; display: inline-block; height: 40px; margin-right: 10px; left: 0; position: absolute; top: calc(50% - 20px); vertical-align: middle; width: 40px;}
.form-area-01 dd .line-area-01 a{ display: inline-block; color: #ffffff; margin: 20px auto 0;}
.form-area-01 dd .line-area-01 a:hover,.form-area-01 .privacy-link-01:hover{ opacity: .6;}
.form-area-01 .privacy-link-01{ color: #666666; display: block; font-size: 14px; margin-bottom: -8px; text-align: center;}
.form-area-01 .wpcf7-response-output{ color: #9A0201; font-size: 14px; font-weight: bold; margin-top: 20px; text-align: center;}
.form-area-01 .wpcf7 form{ margin: 0 !important;}

footer p{ background-color: #0097c3; color: #ffffff; font-size: 11px; letter-spacing: 2px; padding: 10px; text-align: center;}

#back-to-top{ background-color: rgba( 0, 151, 195, .8); border-radius: 50%; bottom: 90px; color: #ffffff; display: none; height: 60px; position: fixed; right: 10px; text-decoration: none; width: 60px; z-index: 10;}
#back-to-top.back-to-top-on{ display: block;}
#back-to-top:hover{ opacity: .6;}
#back-to-top::before{ border-top: 2px solid #ffffff; border-right: 2px solid #ffffff; bottom: calc(50% - 8px); content: ""; display: inline-block; height: 10px; left: calc(50% - 7px); position: absolute; transform: rotate(-45deg); width: 10px;}

.grecaptcha-badge{ z-index: 20;}

span.wpcf7-not-valid-tip{ display: none !important;}
.accept-area,.form-guide{ text-align: center;}
.accept-area a{ text-decoration: underline;}
.accept-area span.haveto,.confirmation-area-01 > span > span{ background-color: #fd0036 !important; border-radius: 13px !important; color: #ffffff !important; font-size: 12px !important; padding: 4px 10px !important;}
.confirmation-area-01 > span { border: 1px solid #DC3C36 !important; padding: 10px 20px !important;}
#formbtn button{ margin: 0 auto !important;}

@media screen and (max-width: 984px){
  .first-view-area-01 ul{ top: 80px;}
  .first-view-area-01 h2{ font-size: 5.5vw; line-height: 120%;}
  .first-view-area-01 h2 span{ font-size: 7.5vw;}
  .first-view-area-01 h2 span:nth-child(3){ font-size: 9vw;}
  .first-view-area-01 h2 span:first-child::before,.first-view-area-01 h3 span::before{ font-size: 12px;}
  .first-view-area-01 h3{ font-size: 3vw;}
}
@media screen and (max-width: 966px){
  .first-view-area-01{ background-size: 1015px 700px;}
  .participants-area-01 li{ width: 100%;}
}
@media screen and (max-width: 959px){
  .step-3-area-01 ul.ul-flex-01 li{ margin-bottom: 80px !important; width: 100%;}
  .step-3-area-01 ul.ul-flex-01 li:last-child{ margin-bottom: 0 !important;}
  .step-3-area-01 ul.ul-flex-01 li dd p{ text-align: center;}
  .step-3-area-01 ul.ul-flex-01 li::before,.step-3-area-01 ul.ul-flex-01 li::after{ right: calc(50% - 22px); transform: rotate(135deg);}
  .step-3-area-01 ul.ul-flex-01 li::before{ bottom: -36px;}
  .step-3-area-01 ul.ul-flex-01 li::after{ bottom: -50px;}
}
@media screen and (max-width: 879px){
  .overview-area-01 ul.ul-flex-01{ justify-content: center;}
  .overview-area-01 li:first-child{ margin: 0 0 20px !important;}
  .overview-area-01 li:last-child{ width: 100%;}
}
@media screen and (max-width: 789px){
  .users-voice-area-01 dd > ul > li{ margin-bottom: 400px;}
  .users-voice-area-01 dd > ul > li:last-child{ margin-bottom: 40px;}
  .users-voice-area-01 dd > ul > li::before{ top: -320px}
  .users-voice-area-01 dd > ul > li:nth-child(odd){ margin-left: 0; margin-top: 320px;}
  .users-voice-area-01 dd > ul > li:nth-child(odd)::before{ left: calc(50% - 180px);}
  .users-voice-area-01 dd > ul > li:nth-child(even){ margin-right: 0; margin-top: 320px;}
  .users-voice-area-01 dd > ul > li:nth-child(even)::before{ right: calc(50% - 180px);}
}
@media screen and (max-width: 789px){
  .form-area-01 dd table th,.form-area-01 dd table td{ display: block; width: calc(100% - 20px);}
  .form-area-01 dd table th{ border-right: none; padding: 10px 10px 0;}
  .form-area-01 dd table th p > span:first-child{ margin-right: 10px; position: inherit;}
  .form-area-01 dd table th p > span:nth-child(2){ vertical-align: text-top;}
}
@media screen and (max-width: 764px){
  .first-view-area-01 li:nth-child(3) p{ font-size: 12px; line-height: 16px;}
  .first-view-area-01 li:nth-child(3) p span{ border-radius: 21px;}
  .first-view-area-01 li:nth-child(3) p span br{ display: block;}
}
@media screen and (max-width: 711px){
  .achievements-area-01 h2 br{ display: block;}
}
@media screen and (max-width: 669px){
  .achievements-area-01 ul.ul-flex-01 li{ background-size: 100%; height: auto; margin: 0 5px !important; padding-bottom: 6% !important; width: calc( 33.3% - 10px);}
  .achievements-area-01 h3{ font-size: 14px; line-height: 18px;}
  .achievements-area-01 p.small{ font-size: 12px; line-height: 16px;}
  .achievements-area-01 li:first-child h3{ margin-top: 36px;}
  .achievements-area-01 li:nth-child(2) h3{ margin-top: 22px;}
  .achievements-area-01 li:nth-child(3) h3{ margin-top: 48px;}
  .achievements-area-01 li:nth-child(4) h3{ margin-top: 30px;}
  .achievements-area-01 li:last-child h3:first-child{ margin-top: 26px;}
}
@media screen and (max-width: 626px){
  .participants-area-01 h2 br{ display: block;}
}
@media screen and (max-width: 625px){
  .first-view-area-01{ background-size: 1305px 900px; height: 800px;}
  .first-view-area-01 > a,.first-view-area-02 > a{ left: calc(50% - 78px); top: 50px;}
  .first-view-area-01 ul{ top: 120px}
  .first-view-area-01 h2{ font-size: 9vw; line-height: 140%;}
  .first-view-area-01 h2 span{ font-size: 14vw;}
  .first-view-area-01 h2 span:nth-child(3){ font-size: 16vw; margin-left: 0;}
  .first-view-area-01 h2 span:first-child::before,.first-view-area-01 h3 span::before{ font-size: 12px;}
  .first-view-area-01 h2 br,.first-view-area-01 h3 br{ display: block;}
  .first-view-area-01 h3{ font-size: 5vw; line-height: 130%;}
  .first-view-area-01 h3 span:first-child,.first-view-area-01 h3 span:last-child{ display: none;}
  .first-view-area-02 p{ text-align: left;}
}
@media screen and (max-width: 589px){
  .achievements-area-01 ul.ul-flex-01 li{ height: 180px; margin: 0 20px 10px !important; padding-bottom: 0 !important; width: 180px;}
  .achievements-area-01 ul.ul-flex-01 li:nth-child(3){ margin: -20px calc(50% - 90px) -4px !important;}
  .achievements-area-01 h3{ font-size: 16px; line-height: 20px;}
  .achievements-area-01 p.small{ font-size: 14px; line-height: 18px;}
  .achievements-area-01 li:first-child h3{ margin-top: 19%;}
  .achievements-area-01 li:nth-child(2) h3{ margin-top: 12%;}
  .achievements-area-01 li:nth-child(3) h3{ margin-top: 26%;}
  .achievements-area-01 li:nth-child(4) h3{ margin-top: 16%;}
  .achievements-area-01 li:last-child h3:first-child{ margin-top: 14%;}
}
@media screen and (max-width: 500px){
  .first-view-area-01{ background-size: 1160px 800px; height: 700px;}
  .participants-area-01 h2,.overview-area-01 h2,.held-regularly-area-01 h2,.users-voice-area-01 h2,.achievements-area-01 h2,.step-3-area-01 h2,.form-area-01 h2{ font-size: 36px; line-height: 46px;}
}
@media screen and (max-width: 495px){
  .achievements-area-01 ul.ul-flex-01 li:nth-child(3){ margin: 0 calc(50% - 90px) 10px !important;}
}
@media screen and (max-width: 452px){
  .overview-area-01 li:first-child{ width: 100%;}
  .overview-area-01 li:first-child img{ height: auto; width: 100%;}
}
@media screen and (max-width: 412px){
  .users-voice-area-01 dd > ul > li::before{ background-position: center; width: 100%;}
  .users-voice-area-01 dd > ul > li:nth-child(odd)::before{ left: 0%;}
  .users-voice-area-01 dd > ul > li:nth-child(even)::before{ right: 0%;}
}
@media screen and (max-width: 400px){
  .first-view-area-01 li:first-child p{ font-size: 4.5vw;}
  .first-view-area-01 li:nth-child(3) p span{ border-radius: 29px; width: calc(92% - 28px);}
  .first-view-area-01 li:nth-child(3) p span br{ display: none;}
  .first-view-area-01 li:nth-child(4) p{ font-size: 4vw; line-height: 150%;}
  .first-view-area-01 li:nth-child(4) p span span{ font-size: 5.5vw;}
  .first-view-area-01 li a{ font-size: 4vw;}
  .first-view-area-01 li a > span:nth-child(2){ margin-right: 5%;}
  .first-view-area-01 li a span span{ font-size: 5.5vw;}
}
@media screen and (max-width: 389px){
  .held-regularly-area-01 table th:first-child{ width: 60px;}
}