﻿
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0
}
audio, canvas, iframe, img, svg, video {
  vertical-align: middle
}
fieldset {
  border: 0;
  margin: 0;
  padding: 0
}
textarea {
  resize: vertical
}
.browserupgrade {
  margin: .2em 0;
  background: #ccc;
  color: #000;
  padding: .2em 0
}
.page_format {
  font-size: 1.3rem;
  line-height: 1.8
}
@media(min-width: 480px) {
  .page_format {
    font-size: calc(1.3rem + (1vw - 4.8px) * 0.1086956522)
  }
}
@media(min-width: 1400px) {
  .page_format {
    font-size: 1.4rem
  }
}


*, *::before, *::after {
  box-sizing: border-box
}
.hidden {
  display: none !important;
  visibility: hidden
}
.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px
}
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto
}
.invisible {
  visibility: hidden
}
.clearfix {
  *zoom: 1
}
.clearfix:before {
  content: " ";
  display: table
}
.clearfix:after {
  content: " ";
  display: table;
  clear: both
}
.wrap {
  width: 89.3333333333vw;
  max-width: 1024px;
  margin: 0 auto
}
.inline-block {
  display: inline-block
}
.sp-block {
  display: block
}
@media screen and (min-width: 640px) {
  .sp-block {
    display: inline
  }
}
.txt-center {
  text-align: center
}
.round-button {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 0;
  width: 100%;
  max-width: 250px;
  margin: 0 auto;
  padding: .7em 3em;
  border: 2px solid #000;
  border-radius: 40px;
  color: #fff;
  font-size: 1.2rem;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  overflow: hidden
}
@media(min-width: 480px) {
  .round-button {
    font-size: calc(1.2rem + (1vw - 4.8px) * 0.4347826087)
  }
}
@media(min-width: 1400px) {
  .round-button {
    font-size: 1.6rem
  }
}
@media screen and (min-width: 480px) {
  .round-button {
    max-width: 360px
  }
}
.round-button.green {
  border-color: #8bc63e
}
@media screen and (min-width: 480px) {
  .round-button.green:hover {
    color: #8bc63e
  }
  .round-button.green:hover .arrow-icon {
    background: #8bc63e;
    color: #fff
  }
}
.round-button.green::before {
  background: #8bc63e
}
.round-button.green .arrow-icon {
  color: #8bc63e
}
.round-button.yellow {
  color: #000
}
@media screen and (min-width: 480px) {
  .round-button.yellow:hover .arrow-icon {
    background: #fff200;
    color: #000
  }
}
.round-button.yellow::before {
  background: #fff200
}
.round-button.yellow .arrow-icon {
  background: #000;
  color: #fff
}
.round-button.gray {
  border-color: #b7b7b7
}
@media screen and (min-width: 480px) {
  .round-button.gray:hover {
    color: #b7b7b7
  }
  .round-button.gray:hover .arrow-icon {
    background: #b7b7b7;
    color: #fff
  }
}
.round-button.gray::before {
  background: #b7b7b7
}
.round-button.gray .arrow-icon {
  color: #b7b7b7
}
.round-button.white {
  border-color: #fff;
  color: #000
}
@media screen and (min-width: 480px) {
  .round-button.white:hover {
    color: #fff
  }
  .round-button.white:hover .arrow-icon {
    background: #fff;
    color: #000
  }
}
.round-button.white::before {
  background: #fff
}
.round-button.white::after {
  background: #000
}
.round-button.white .arrow-icon {
  background: #000;
  color: #fff
}
@media screen and (min-width: 480px) {
  .round-button:hover {
    color: #000
  }
  .round-button:hover::after {
    transform-origin: 0 50%;
    transform: scaleX(1)
  }
  .round-button:hover .arrow-icon {
    background: #000;
    color: #fff
  }
}
.round-button::before, .round-button::after {
  display: block;
  position: absolute;
  top: -2px;
  left: -2px;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  content: ""
}
.round-button::before {
  z-index: -2;
  background: #000
}
.round-button::after {
  z-index: -1;
  background: #fff;
  transform-origin: 100% 50%;
  transition: transform .4s ease;
  transform: scaleX(0)
}
.round-button .arrow-icon {
  position: absolute;
  top: 50%;
  right: .5em;
  background: #fff;
  color: #000;
  transition: .4s ease;
  transform: translateY(-50%)
}
.round-button .blank-icon {
  position: absolute;
  top: 50%;
  right: 1em;
  transition: .4s ease;
  transform: translateY(-50%)
}
.arrow-icon {
  display: block;
  position: relative;
  width: 6.1333333333vw;
  max-width: 35px;
  height: 6.1333333333vw;
  max-height: 35px;
  background: #fff;
  border-radius: 50%;
  color: #000
}
.arrow-icon::before {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 56.5217391304%;
  height: 2px;
  background: currentColor;
  transform: translate(-50%, -50%);
  content: ""
}
.arrow-icon::after {
  display: block;
  position: absolute;
  top: 50%;
  left: 40%;
  width: 30.4347826087%;
  height: 30.4347826087%;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
  content: ""
}
.arrow-icon.green {
  background: #8bc63e;
  color: #fff
}
.arrow-icon.black {
  background: #000;
  color: #fff
}
.blank-icon {
  display: inline-block;
  position: relative;
  width: 2.1rem;
  height: 1.6rem
}
.blank-icon::before, .blank-icon::after {
  position: absolute;
  content: ""
}
.blank-icon::before {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 78.7878787879%;
  height: 70.8333333333%;
  border: 2px solid currentColor
}
.blank-icon::after {
  position: absolute;
  top: 0;
  right: 0;
  width: 75.7575757576%;
  height: 66.6666666667%;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor
}
.arrow-up-icon {
  position: relative;
  width: 2.9333333333vw;
  max-width: 17px;
  height: 4vw;
  max-height: 20px
}
.arrow-up-icon::before {
  display: block;
  position: absolute;
  top: 0;
  left: 50%;
  width: 2px;
  height: 100%;
  background: currentColor;
  transform: translateX(-50%);
  content: ""
}
.arrow-up-icon::after {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1rem;
  height: 1rem;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: translateX(-50%) rotate(-45deg);
  content: ""
}
.arrow-down-icon {
  position: relative;
  width: 2.9333333333vw;
  max-width: 17px;
  height: 4vw;
  max-height: 20px
}
.arrow-down-icon::before {
  display: block;
  position: absolute;
  top: 0;
  left: 50%;
  width: 2px;
  height: 100%;
  background: currentColor;
  transform: translateX(-50%);
  content: ""
}
.arrow-down-icon::after {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 1rem;
  height: 1rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateX(-50%) rotate(45deg);
  content: ""
}
.primary-color {
  color: #8bc63e
}
.second-color {
  color: #ef5350
}
.content-block {
  padding: 10.6666666667% 0 0;
}
@media screen and (min-width: 640px) {
  .content-block {
    padding: 5.7em 0
  }
}
.content-container + .content-container {
  margin-top: 8.9552238806%
}
@media screen and (min-width: 640px) {
  .content-container + .content-container {
    margin-top: 5.7em
  }
}
.content-container .content-inner + .content-inner {
  margin-top: 8.9552238806%
}
@media screen and (min-width: 640px) {
  .content-container .content-inner + .content-inner {
    margin-top: 3.5em
  }
}
.button-box {
  margin-top: 4.4776119403%
}
@media screen and (min-width: 640px) {
  .button-box {
    margin-top: 2.5em
  }
}
.en {
  font-family: "Oswald", sans-serif;
  letter-spacing: .15em
}
.txt_catch {
  margin-bottom: 1.5em;
  color: #8bc63e;
  font-size: 2.1rem;
  font-weight: bold;
  text-align: center
}
@media(min-width: 480px) {
  .txt_catch {
    font-size: calc(2.1rem + (1vw - 4.8px) * 0.9782608696)
  }
}
@media(min-width: 1400px) {
  .txt_catch {
    font-size: 3rem
  }
}
.tl_h03 {
  position: relative;
  margin-bottom: 1.5em;
  padding-bottom: .6em;
  font-size: 2rem;
  text-align: center;
  font-weight: bold;
}
@media(min-width: 480px) {
  .tl_h03 {
    font-size: calc(2rem + (1vw - 4.8px) * 1.0869565217)
  }
}
@media(min-width: 1400px) {
  .tl_h03 {
    font-size: 3rem
  }
}
.tl_h03::after {
  display: block;
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 5em;
  height: .25em;
  background-size: auto auto;
  background-color: transparent;
  background-image: repeating-linear-gradient(115deg, transparent, transparent 0.25em, #8bc63e 0.25em, #8bc63e 0.45em);
  transform: translateX(-50%);
  content: ""
}
@media screen and (min-width: 640px) {
  .tl_h03::after {
    width: 4.2em;
    background-image: repeating-linear-gradient(115deg, transparent, transparent 0.26em, #8bc63e 0.26em, #8bc63e 0.53em)
  }
}
.tl_block {
  position: relative;
  margin-bottom: 1.5em;
  padding: .7em .5em .7em 1.6em;
  color: #fff;
  background: #8bc63e;
  font-size: 1.7rem;
  line-height: 1.4;
  overflow: hidden;
  font-weight: bold;
}
@media(min-width: 480px) {
  .tl_block {
    font-size: calc(1.7rem + (1vw - 4.8px) * 0.7608695652)
  }
}
@media(min-width: 1400px) {
  .tl_block {
    font-size: 2.4rem
  }
}
.tl_block::before {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 2.2388059701%;
  max-width: 10px;
  height: 110%;
  background-size: auto auto;
  background-color: transparent;
  background-image: repeating-linear-gradient(-16deg, transparent, transparent 0.44em, #000 0.44em, #000 0.88em);
  content: ""
}
@media screen and (min-width: 640px) {
  .tl_block::before {
    background-image: repeating-linear-gradient(-16deg, transparent, transparent 0.33em, #000 0.33em, #000 0.75em)
  }
}
.tl_block .small {
  font-size: 1.2rem
}
.content-title04 {
  margin-bottom: 1.5em;
  padding-left: 1em;
  border-left: 3px solid #8bc63e;
  font-size: 1.6rem;
  line-height: 1.4
}
@media(min-width: 480px) {
  .content-title04 {
    font-size: calc(1.6rem + (1vw - 4.8px) * 0.4347826087)
  }
}
@media(min-width: 1400px) {
  .content-title04 {
    font-size: 2rem
  }
}
@media screen and (min-width: 640px) {
  .content-title04 {
    padding-left: 1.2em;
    border-left-width: 6px
  }
}
.doted-title {
  margin-bottom: .6em;
  font-size: 1.6rem
}
@media(min-width: 480px) {
  .doted-title {
    font-size: calc(1.6rem + (1vw - 4.8px) * 0.4347826087)
  }
}
@media(min-width: 1400px) {
  .doted-title {
    font-size: 2rem
  }
}
.doted-title::before {
  display: inline-block;
  position: relative;
  margin-right: .5em;
  width: .8em;
  height: .8em;
  border-radius: 50%;
  background: #8bc63e;
  content: ""
}
.content-lead {
  font-size: 1.3rem
}
@media(min-width: 480px) {
  .content-lead {
    font-size: calc(1.3rem + (1vw - 4.8px) * 0.3260869565)
  }
}
@media(min-width: 1400px) {
  .content-lead {
    font-size: 1.6rem
  }
}
.list-circle > li {
  position: relative;
  padding-left: 1.5rem
}
.list-circle > li::before {
  position: absolute;
  top: calc(.9em - .4rem);
  left: 0;
  width: .8rem;
  height: .8rem;
  border-radius: 50%;
  background: #8bc63e;
  content: ""
}
.list-number {
  counter-reset: list-number
}
.list-number > li {
  counter-increment: list-number
}
.list-number > li::before {
  display: inline-block;
  margin-right: .5em;
  color: #8bc63e;
  content: counter(list-number) "."
}
.content-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between
}
@media screen and (min-width: 640px) {
  .content-group.img-first {
    flex-direction: row-reverse
  }
}
.content-group.img-first .img-box {
  margin-bottom: 1.5em
}
@media screen and (min-width: 640px) {
  .content-group.img-first .img-box {
    margin-bottom: 0
  }
}
.content-group.img-first .txt-box {
  margin-bottom: 0
}
.content-group.reverse .img-box {
  margin-bottom: 2em
}
@media screen and (min-width: 640px) {
  .content-group.reverse .img-box {
    margin-bottom: 0
  }
}
.content-group.reverse .txt-box {
  margin-bottom: 0
}
.content-group .txt-box {
  width: 100%;
  margin-bottom: 1em
}
@media screen and (min-width: 640px) {
  .content-group .txt-box {
    width: 48.4375%;
    margin-bottom: 0
  }
}
.content-group .content-group-title {
  margin-bottom: .5em;
  font-size: 1.6rem
}
@media(min-width: 480px) {
  .content-group .content-group-title {
    font-size: calc(1.6rem + (1vw - 4.8px) * 0.4347826087)
  }
}
@media(min-width: 1400px) {
  .content-group .content-group-title {
    font-size: 2rem
  }
}
.content-group .img-box {
  width: 100%
}
@media screen and (min-width: 640px) {
  .content-group .img-box {
    width: 48.4375%
  }
}
.content-group .img-box img {
  width: 100%
}
.link-txt {
  color: #8bc63e;
  font-weight: bold;
  text-decoration: underline
}
.link-txt:hover {
  text-decoration: none
}
.link-txt .blank-icon {
  margin-left: .3em
}
.color-box {
  position: relative;
  padding: 5.9701492537%;
  background: #f2f8e9
}
@media screen and (min-width: 640px) {
  .color-box {
    padding: 2.8em
  }
}
.color-box.gray {
  background: #e6e6e6
}
.color-box.white {
  background: #fff
}
.color-box .box-title {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  width: fit-content;
  margin: 0 auto;
  padding: .3em 1em;
  background: #8bc63e;
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  line-height: 1;
  transform: translateY(-50%)
}
@media(min-width: 480px) {
  .color-box .box-title {
    font-size: calc(1.8rem + (1vw - 4.8px) * 1.3043478261)
  }
}
@media(min-width: 1400px) {
  .color-box .box-title {
    font-size: 3rem
  }
}
.color-box .box-catch {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 1.35em;
  font-size: 1.8rem;
  font-style: italic;
  text-align: center;
  line-height: 1.4
}
@media(min-width: 480px) {
  .color-box .box-catch {
    font-size: calc(1.8rem + (1vw - 4.8px) * 1.5217391304)
  }
}
@media(min-width: 1400px) {
  .color-box .box-catch {
    font-size: 3.2rem
  }
}
.color-box .box-catch > span {
  padding: .2em .4em;
  background: #fff
}
.color-box .box-catch > span + span {
  margin-top: .5em
}
.color-box .box-inner + .box-inner {
  margin-top: 5.9701492537%
}
@media screen and (min-width: 640px) {
  .color-box .box-inner + .box-inner {
    margin-top: 2.8em
  }
}
.color-box .title {
  margin-bottom: 1em;
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.6
}
@media(min-width: 480px) {
  .color-box .title {
    font-size: calc(1.6rem + (1vw - 4.8px) * 0.4347826087)
  }
}
@media(min-width: 1400px) {
  .color-box .title {
    font-size: 2rem
  }
}
.color-box .title .large {
  font-size: 130%
}
.border-container {
  padding: 5.9701492537%;
  border: 2px solid #8bc63e
}
@media screen and (min-width: 640px) {
  .border-container {
    padding: 2.85em
  }
}
.border-container .container-title {
  margin-bottom: 1.5em;
  color: #8bc63e;
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center
}
@media(min-width: 480px) {
  .border-container .container-title {
    font-size: calc(1.6rem + (1vw - 4.8px) * 0.4347826087)
  }
}
@media(min-width: 1400px) {
  .border-container .container-title {
    font-size: 2rem
  }
}
.content-catch {
  margin-bottom: 1.5em;
  font-size: 1.7rem;
  font-weight: bold;
  text-align: center
}
@media(min-width: 480px) {
  .content-catch {
    font-size: calc(1.7rem + (1vw - 4.8px) * 0.7608695652)
  }
}
@media(min-width: 1400px) {
  .content-catch {
    font-size: 2.4rem
  }
}
.note {
  margin-top: 1em;
  padding-left: 1em;
  font-size: 1.1rem;
  text-indent: -1em
}
@media(min-width: 480px) {
  .note {
    font-size: calc(1.1rem + (1vw - 4.8px) * 0.2173913043)
  }
}
@media(min-width: 1400px) {
  .note {
    font-size: 1.3rem
  }
}
.notes {
  margin-top: 1em;
  font-size: 1.1rem
}
@media(min-width: 480px) {
  .notes {
    font-size: calc(1.1rem + (1vw - 4.8px) * 0.2173913043)
  }
}
@media(min-width: 1400px) {
  .notes {
    font-size: 1.3rem
  }
}
.notes > li {
  padding-left: 1em;
  text-indent: -1em
}
.card-group {
  display: flex;
  flex-wrap: wrap
}
@media screen and (min-width: 640px) {
  .card-group {
    margin: 0 -1.5625%
  }
}
.card-group.center {
  justify-content: center
}
.card-group .card-content {
  width: 100%;
  margin-bottom: 8%
}
@media screen and (min-width: 640px) {
  .card-group .card-content {
    width: 46.9696969697%;
    margin: 0 1.5151515152% 5.6818181818%
  }
}
.card-group .category {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 3em;
  padding: .2em;
  background: #000;
  color: #fff;
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.4
}
@media(min-width: 480px) {
  .card-group .category {
    font-size: calc(1.6rem + (1vw - 4.8px) * 0.652173913)
  }
}
@media(min-width: 1400px) {
  .card-group .category {
    font-size: 2.2rem
  }
}
.card-group .img-box {
  margin-bottom: 1.2em
}
.card-group .txt-box {
  width: 100%
}
.card-group .card-title {
  margin-bottom: .5em;
  color: #8bc63e;
  font-size: 1.6rem;
  text-align: center
}
@media(min-width: 480px) {
  .card-group .card-title {
    font-size: calc(1.6rem + (1vw - 4.8px) * 0.4347826087)
  }
}
@media(min-width: 1400px) {
  .card-group .card-title {
    font-size: 2rem
  }
}
.card-group.col-3 {
  margin: 0 -2.2388059701%
}
@media screen and (min-width: 640px) {
  .card-group.col-3 {
    margin: 0 -1.5625%
  }
}
.card-group.col-3 .card-content {
  width: 45.7142857143%;
  margin: 0 2.1428571429% 8.5714285714%
}
@media screen and (min-width: 640px) {
  .card-group.col-3 .card-content {
    width: 30.303030303%;
    margin: 0 1.5151515152% 5.6818181818%
  }
}
.qa {
  font-size: 1.2rem
}
@media(min-width: 480px) {
  .qa {
    font-size: calc(1.2rem + (1vw - 4.8px) * 0.2173913043)
  }
}
@media(min-width: 1400px) {
  .qa {
    font-size: 1.4rem
  }
}
.qa + .qa {
  margin-top: 1em
}
.qa.open .plus-icon::after {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(0)
}
.qa.open .answer {
  display: flex;
  animation: .6s fadeIn ease
}
.qa .question::before, .qa .answer::before {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1.75em;
  height: 1.75em;
  margin-right: .7em;
  background: #8bc63e;
  border-radius: 50%;
  color: #fff;
  font-size: 1.4rem
}
@media(min-width: 480px) {
  .qa .question::before, .qa .answer::before {
    font-size: calc(1.4rem + (1vw - 4.8px) * 0.2173913043)
  }
}
@media(min-width: 1400px) {
  .qa .question::before, .qa .answer::before {
    font-size: 1.6rem
  }
}
.qa .question {
  display: flex;
  align-items: center;
  position: relative;
  padding: .8em 2.5em .8em .5em;
  border-bottom: 1px solid #e2e2e2;
  cursor: pointer
}
.qa .question::before {
  content: "Q"
}
.qa .plus-icon {
  display: block;
  position: absolute;
  top: 50%;
  right: .5em;
  width: 1.6em;
  height: 1.6em;
  border: 1px solid #8bc63e;
  transform: translateY(-50%)
}
@media screen and (min-width: 640px) {
  .qa .plus-icon {
    border-width: 2px
  }
}
.qa .plus-icon::before, .qa .plus-icon::after {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 45%;
  height: 1px;
  background: #8bc63e;
  transform: translate(-50%, -50%);
  content: ""
}
@media screen and (min-width: 640px) {
  .qa .plus-icon::before, .qa .plus-icon::after {
    height: 2px
  }
}
.qa .plus-icon::after {
  transition: .2s ease;
  transform: translate(-50%, -50%) rotate(90deg)
}
.qa .answer {
  display: none;
  align-items: center;
  margin-top: 1.4925373134%;
  padding: .8em .5em;
  background: #f2f8e9;
  font-weight: bold
}
@media screen and (min-width: 640px) {
  .qa .answer {
    margin-top: 1em
  }
}
.qa .answer::before {
  content: "A"
}
.anchor-list {
  display: flex;
  flex-wrap: wrap
}
@media screen and (min-width: 480px) {
  .anchor-list {
    margin: 0 -2.2388059701%
  }
}
@media screen and (min-width: 768px) {
  .anchor-list {
    margin: 0 -1.5625%
  }
}
.anchor-list.center {
  justify-content: center
}
.anchor-list > li {
  width: 100%;
  margin-bottom: 7%
}
@media screen and (min-width: 480px) {
  .anchor-list > li {
    width: 45.7142857143%;
    margin: 0 2.1428571429% 4.2857142857%
  }
}
@media screen and (min-width: 768px) {
  .anchor-list > li {
    width: 30.303030303%;
    margin: 0 1.5151515152% 3.0303030303%
  }
}
.anchor-list a {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  height: 100%;
  padding: .7em 2.2em;
  background: #f2f8e9;
  border: 2px solid #f2f8e9;
  border-radius: 3em;
  text-align: center;
  font-weight: bold;
  text-decoration: none;
  transition: .4s ease
}
.anchor-list a:hover {
  border-color: #8bc63e;
  background: #fff;
  color: #8bc63e
}
.anchor-list .arrow-up-icon, .anchor-list .arrow-down-icon {
  position: absolute;
  top: 50%;
  right: 1em;
  color: #8bc63e;
  transform: translateY(-50%)
}
.cont-mtab {
  display: flex;
  justify-content: center;
  position: relative;
  z-index: 1
}
.cont-mtab > li {
  width: 32.5373134328%
}
.cont-mtab > li + li {
  margin-left: 1.1940298507%
}
.cont-mtab a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 1em .2em;
  border: 2px solid #8bc63e;
  color: #8bc63e;
  font-size: 1.3rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
  text-decoration: none;
  transition: .4s ease
}
@media(min-width: 480px) {
  .cont-mtab a {
    font-size: calc(1.3rem + (1vw - 4.8px) * 0.7608695652)
  }
}
@media(min-width: 1400px) {
  .cont-mtab a {
    font-size: 2rem
  }
}
.cont-mtab a:hover, .cont-mtab a.active {
  background: #8bc63e;
  color: #fff
}
.cont-mtab a.active {
  position: relative;
  pointer-events: none
}
.cont-mtab a.active::after {
  display: block;
  position: absolute;
  top: 100%;
  left: 50%;
  border-top: 1.4rem solid #8bc63e;
  border-right: 1rem solid transparent;
  border-left: 1rem solid transparent;
  transform: translateX(-50%);
  content: ""
}
.cont-tab {
  display: none
}
.cont-tab.show {
  display: block;
  animation: .8s fadeIn ease
}
table .w10 {
  width: 10%
}
table .w15 {
  width: 15%
}
table .w20 {
  width: 20%
}
table .w25 {
  width: 25%
}
table .w30 {
  width: 30%
}
table .w35 {
  width: 35%
}
table .w40 {
  width: 40%
}
table .w45 {
  width: 45%
}
table .w50 {
  width: 50%
}
table .w55 {
  width: 55%
}
table .w60 {
  width: 60%
}
table .w65 {
  width: 65%
}
table .w70 {
  width: 70%
}
table .w75 {
  width: 75%
}
table .w80 {
  width: 80%
}
table .w85 {
  width: 85%
}
table .w90 {
  width: 90%
}
table .w95 {
  width: 95%
}
table .w100 {
  width: 100%
}
table .w23 {
  width: 23%
}
.tbl_st01 {
  width: 100%;
  border-top: 2px solid #e2e2e2;
  border-left: 2px solid #e2e2e2
}
.tbl_st01 th, .tbl_st01 td {
  padding: 2vw 1vw;
  border-right: 2px solid #e2e2e2;
  border-bottom: 2px solid #e2e2e2
}
@media screen and (min-width: 640px) {
  .tbl_st01 th, .tbl_st01 td {
    padding: 1em
  }
}
.tbl_st01 thead th {
  background: #8bc63e;
  font-size: 1.3rem
}
@media(min-width: 480px) {
  .tbl_st01 thead th {
    font-size: calc(1.3rem + (1vw - 4.8px) * 0.3260869565)
  }
}
@media(min-width: 1400px) {
  .tbl_st01 thead th {
    font-size: 1.6rem
  }
}
.tbl_st01 tbody th {
  background: #f9f9f9;
  text-align: left
}
.tbl_st01 .bg-gray {
  background: #f9f9f9
}
.tbl_st01 .light-green {
  background: #f2f8e9
}
.tbl_st01.color02 tbody th {
  background: #f2f8e9;
  text-align: left
}
.tbl_st01.color02 tbody td {
  background: #fff
}
.table-center {
  text-align: center
}
.step-box {
  position: relative;
  margin-bottom: 8.9552238806%;
  padding: 5.9701492537%;
  background: #f9f9f9;
  border: 2px solid #8bc63e;
  counter-increment: step-number
}
@media screen and (min-width: 640px) {
  .step-box {
    margin-bottom: 5.7em;
    padding: 2.85em
  }
}
.step-box::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  width: fit-content;
  margin: 0 auto;
  padding: .3em 1em;
  background: #8bc63e;
  font-family: "Oswald", sans-serif;
  color: #fff;
  font-size: 1.8rem;
  font-weight: 500;
  text-align: center;
  line-height: .9;
  letter-spacing: .15em;
  transform: translateY(-50%);
  content: "STEP"counter(step-number, decimal-leading-zero)
}
@media(min-width: 480px) {
  .step-box::before {
    font-size: calc(1.8rem + (1vw - 4.8px) * 1.3043478261)
  }
}
@media(min-width: 1400px) {
  .step-box::before {
    font-size: 3rem
  }
}
.step-box .step-title {
  margin-bottom: 1em;
  font-size: 2.1rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.4
}
@media(min-width: 480px) {
  .step-box .step-title {
    font-size: calc(2.1rem + (1vw - 4.8px) * 0.9782608696)
  }
}
@media(min-width: 1400px) {
  .step-box .step-title {
    font-size: 3rem
  }
}
.step-box .step-title .large {
  font-size: 150%
}
.step-box .step-content {
  font-size: 1.3rem
}
@media(min-width: 480px) {
  .step-box .step-content {
    font-size: calc(1.3rem + (1vw - 4.8px) * 0.3260869565)
  }
}
@media(min-width: 1400px) {
  .step-box .step-content {
    font-size: 1.6rem
  }
}
@keyframes fadeIn {
  from {
    opacity: 0
  }
  to {
    opacity: 1
  }
}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 90;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .6);
  transition: .2s;
  visibility: hidden;
  opacity: 0
}
.site-id {
  position: relative;
  z-index: 1;
  width: 59.7333333333vw;
  max-width: 321px
}
@media screen and (min-width: 1024px) {
  .site-id {
    width: 22.9285714286vw
  }
}
.menu-wrapper {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 360px;
  position: fixed;
  top: 0;
  left: 100%;
  z-index: 98;
  height: calc(100% - 5rem);
  background: #fff;
  margin-top: 5rem;
  padding-bottom: 2rem;
  transition: .3s ease;
  overflow: hidden auto
}
@media screen and (min-width: 480px) {
  .menu-wrapper {
    height: calc(100% - 7rem);
    margin-top: 7rem
  }
}
@media screen and (min-width: 1024px) {
  .menu-wrapper {
    flex-direction: row;
    align-items: flex-end;
    position: static;
    max-width: none;
    margin-top: 0;
    padding-bottom: 0;
    transition: none;
    overflow: visible
  }
}
.menu-wrapper .main-menu {
  display: flex;
  flex-direction: column
}
@media screen and (min-width: 1024px) {
  .menu-wrapper .main-menu {
    display: flex;
    align-items: flex-end;
    margin-left: auto
  }
}
.menu-wrapper .other-menu-box {
  display: flex;
  flex-direction: column
}
@media screen and (max-width: 1023px) {
  .menu-wrapper .other-menu-box {
    width: 90%;
    margin: 0 auto
  }
}
@media screen and (min-width: 1024px) {
  .menu-wrapper .other-menu-box {
    flex-direction: row;
    margin-left: 1em;
    flex-shrink: 0
  }
}
.menu-wrapper .other-menu {
  margin-top: 2em
}
@media screen and (min-width: 1024px) {
  .menu-wrapper .other-menu {
    position: relative;
    width: 7.1428571429vw;
    max-width: 100px;
    height: 7.1428571429vw;
    max-height: 100px;
    margin-top: 0
  }
}
.menu-wrapper .other-menu.become-menu {
  margin-right: 1px
}
@media screen and (min-width: 1024px) {
  .menu-wrapper .other-menu:hover .other-button {
    background: #8bc63e;
    color: #000
  }
  .menu-wrapper .other-menu:hover .other-menu-inner {
    transform: scaleY(1)
  }
}
.menu-wrapper .other-menu a {
  text-decoration: none
}
.menu-wrapper [name=other-button] {
  display: none
}
.menu-wrapper [name=other-button]:checked ~ .other-menu-inner {
  max-height: 100rem
}
.menu-wrapper [name=other-button]:checked ~ .other-button-label .other-button {
  border-bottom-color: #8bc63e
}
.menu-wrapper [name=other-button]:checked ~ .other-button {
  border-bottom-color: #8bc63e
}
.menu-wrapper [name=other-button]:checked ~ .other-button.become-button {
  border-right-color: #000
}
.menu-wrapper [name=other-button]:checked ~ .other-button .nav-plus-icon::after {
  opacity: 0;
  transform: translateY(-50%) rotate(0)
}
.menu-wrapper .other-button {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  padding: 1em;
  background: #000;
  border: 2px solid #000;
  color: #fff;
  font-size: 1.4rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
  text-decoration: none;
  transition: .3s ease;
  cursor: pointer
}
@media screen and (min-width: 1024px) {
  .menu-wrapper .other-button {
    height: 100%;
    padding: 0 .2em;
    font-size: 1.1rem
  }
}
.menu-wrapper .other-button.become-button {
  pointer-events: none
}
@media screen and (min-width: 1024px) {
  .menu-wrapper .other-button.become-button {
    pointer-events: auto
  }
}
@media screen and (min-width: 1024px) {
  .menu-wrapper .other-button.visitor-button {
    border-right: 0;
    font-size: 1.4rem;
    pointer-events: none
  }
}
@media screen and (max-width: 1023px) {
  .menu-wrapper .other-button:hover {
    background: #8bc63e;
    color: #000
  }
}
.menu-wrapper .other-button-label {
  cursor: pointer
}
@media screen and (max-width: 1023px) {
  .menu-wrapper .other-button-label:hover .other-button {
    background: #8bc63e;
    color: #000
  }
}
.menu-wrapper .other-menu-inner {
  max-height: 0;
  overflow: hidden;
  color: #fff;
  transition: .6s ease
}
@media screen and (min-width: 1024px) {
  .menu-wrapper .other-menu-inner {
    position: absolute;
    top: 100%;
    right: 0;
    width: 270px;
    max-height: 100vh;
    transition-duration: .4s;
    transform-origin: center top;
    transform: scaleY(0);
    overflow: visible
  }
}
.menu-wrapper .other-list a {
  display: block;
  padding: 1em;
  background: #000;
  border-bottom: 1px solid #8bc63e;
  color: #fff;
  font-size: 1.4rem;
  font-weight: bold;
  text-decoration: none;
  transition: .3s ease
}
@media screen and (min-width: 1024px) {
  .menu-wrapper .other-list a {
    font-size: 1.2rem
  }
}
.menu-wrapper .other-list a:hover {
  background: #8bc63e;
  color: #000
}
@media screen and (min-width: 1024px) {
  .header-top {
    margin-bottom: 1%
  }
}
.header-top .other-link {
  display: flex;
  width: 100%
}
@media screen and (min-width: 1024px) {
  .header-top .other-link {
    margin-left: auto
  }
}
.header-top .other-link li {
  flex: 1;
  line-height: 1
}
@media screen and (min-width: 1024px) {
  .header-top .other-link li {
    flex: none
  }
}
.header-top .other-link li + li {
  position: relative
}
.header-top .other-link li + li::before {
  position: absolute;
  top: 50%;
  left: 0;
  width: 2px;
  height: 80%;
  background: #fff;
  transform: translateY(-50%);
  content: ""
}
@media screen and (min-width: 1024px) {
  .header-top .other-link li + li::before {
    display: none
  }
}
@media screen and (min-width: 1024px) {
  .header-top .other-link li + li {
    margin-left: 1vw;
    padding-left: 1vw;
    border-left: 1px solid currentColor
  }
}
.header-top .other-link a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 1.5em .3em;
  background: #000;
  text-decoration: none;
  color: #fff;
  font-size: 1.2rem;
  font-weight: bold;
  text-align: center;
  transition: .3s ease
}
@media screen and (min-width: 1024px) {
  .header-top .other-link a {
    flex-direction: row;
    align-items: baseline;
    width: auto;
    height: auto;
    background: none;
    padding: 0;
    color: #000;
    font-size: 1.3rem
  }
}
.header-top .other-link a:hover {
  background: #8bc63e;
  color: #000
}
@media screen and (min-width: 1024px) {
  .header-top .other-link a:hover {
    background: none;
    color: #8bc63e
  }
}
.icon-marker {
  margin-right: .5em;
  width: 1.8rem
}
@media screen and (min-width: 1024px) {
  .icon-marker {
    width: 1rem;
    margin-right: .3em
  }
}
.icon-marker svg {
  width: 100%;
  fill: currentColor
}
.nav-categories {
  display: flex;
  flex-direction: column;
  width: 100%
}
@media screen and (min-width: 1024px) {
  .nav-categories {
    flex-direction: row;
    width: auto
  }
}
.nav-categories > li {
  display: flex;
  flex-direction: column;
  width: 100%;
  font-size: 1.1rem
}
@media(min-width: 480px) {
  .nav-categories > li {
    font-size: calc(1.1rem + (1vw - 4.8px) * 0.3260869565)
  }
}
@media(min-width: 1400px) {
  .nav-categories > li {
    font-size: 1.4rem
  }
}
@media screen and (min-width: 1024px) {
  .nav-categories > li {
    width: auto
  }
}
@media screen and (min-width: 1024px) {
  .nav-categories > li:hover .category-inner {
    transform: scaleY(1)
  }
  .nav-categories > li:hover .category-label::after {
    opacity: 1
  }
}
@media screen and (min-width: 1024px) {
  .nav-categories > li + li {
    margin-left: 1.8vw
  }
}
.nav-categories > li .en {
  margin-right: .5em;
  font-family: "Oswald", sans-serif;
  color: #8bc63e;
  font-size: 133%;
  letter-spacing: .07em
}
@media screen and (min-width: 1024px) {
  .nav-categories > li .en {
    margin-right: 0
  }
}
.nav-categories > li [type=checkbox] {
  display: none
}
.nav-categories > li [type=checkbox]:checked ~ .category-inner {
  max-height: 200rem
}
.nav-categories > li [type=checkbox]:checked ~ label .nav-plus-icon::after {
  opacity: 0;
  transform: translateY(-50%) rotate(0)
}
.nav-categories > li label {
  cursor: pointer
}
.nav-categories .category-label {
  display: flex;
  align-items: baseline;
  position: relative;
  width: 100%;
  padding: 1em 2em 1em 1em;
  border-bottom: 1px solid #000;
  text-decoration: none;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1.4
}
@media screen and (max-width: 1023px) {
  .nav-categories .category-label:not(.clickable) {
    pointer-events: none
  }
}
@media screen and (min-width: 1024px) {
  .nav-categories .category-label {
    flex-direction: column;
    align-items: center;
    width: auto;
    padding: 0 0 13%;
    border-bottom: 0;
    font-size: .9em;
    pointer-events: all
  }
}
.nav-categories .category-label::after {
  display: block;
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 6rem;
  height: 2px;
  background: #8bc63e;
  transition: .3s ease;
  opacity: 0;
  transform: translateX(-50%);
  content: ""
}
.nav-categories .category-inner {
  max-height: 0;
  overflow: hidden;
  transition: .6s ease
}
@media screen and (min-width: 1024px) {
  .nav-categories .category-inner {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    max-height: calc(100vh - 10rem);
    padding: 6.4285714286% 0;
    background: #fff;
    transition-duration: .2s;
    transform-origin: top center;
    transform: scaleY(0);
    overflow-y: auto
  }
}
@media screen and (min-width: 1024px)and (min-width: 640px) {
  .nav-categories .category-inner {
    padding: 6.4em 0
  }
}
.nav-categories .category-inner .category-row {
  display: flex;
  flex-direction: column;
  width: 100%
}
@media screen and (min-width: 1024px) {
  .nav-categories .category-inner .category-row {
    flex-direction: row;
    margin: 0 -1.5625%
  }
}
@media screen and (max-width: 1023px) {
  .nav-categories .category-inner .wrap {
    width: 100%
  }
}
.nav-categories .category-inner .col {
  width: 100%
}
@media screen and (min-width: 1024px) {
  .nav-categories .category-inner .col {
    width: 21.9696969697%;
    margin: 0 1.5151515152%
  }
}
@media screen and (min-width: 1024px) {
  .nav-categories .category-inner .col > a {
    padding: 0;
    border-bottom: 0
  }
}
.nav-categories .category-inner .col > a:hover .nav-img img {
  transform: scale(1.1)
}
.nav-categories .category-inner a {
  display: block;
  padding: .8em 1em;
  background: #8bc63e;
  border-bottom: 1px solid #000;
  font-size: 1.4rem;
  font-weight: bold;
  text-decoration: none;
  transition: .3s ease
}
@media screen and (min-width: 1024px) {
  .nav-categories .category-inner a {
    background: none
  }
}
.nav-categories .category-inner a:hover {
  background: #fff
}
@media screen and (max-width: 1023px) {
  .nav-categories .category-inner a:hover {
    color: #8bc63e
  }
}
@media screen and (min-width: 1024px) {
  .nav-categories .category-list a {
    position: relative;
    padding: .6em 1.8em .6em .3em;
    border-bottom-color: #d7d7d7;
    font-size: 1.3rem
  }
}
@media screen and (min-width: 1024px) {
  .nav-categories .category-list a:hover {
    background: #8bc63e
  }
}
@media screen and (min-width: 1024px) {
  .nav-categories .category-list a::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 1rem;
    width: .8rem;
    height: .8rem;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: translateY(-50%) rotate(45deg);
    content: ""
  }
}
.nav-categories .nav-img {
  display: none
}
@media screen and (min-width: 1024px) {
  .nav-categories .nav-img {
    display: block;
    overflow: hidden
  }
}
.nav-categories .nav-img img {
  transition: .3s ease
}
@media screen and (min-width: 1024px) {
  .nav-categories .nav-label {
    display: flex;
    align-items: center;
    position: relative;
    max-height: 3.4em;
    padding: 1em 1.8em 1em 1em;
    background: #8bc63e;
    line-height: 1.2
  }
}
@media screen and (min-width: 1024px) {
  .nav-categories .nav-label::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 1rem;
    width: .8rem;
    height: .8rem;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: translateY(-50%) rotate(45deg);
    content: ""
  }
}
.nav-categories .category-name {
  display: none
}
@media screen and (min-width: 1024px) {
  .nav-categories .category-name {
    display: block;
    margin-bottom: 1.8em;
    border-bottom: 2px solid #d7d7d7;
    font-weight: bold
  }
}
.nav-categories .category-name .en {
  margin-right: .3em;
  font-size: 200%;
  font-weight: 500
}
.nav-plus-icon {
  display: block;
  position: absolute;
  top: 50%;
  right: .5em;
  width: 1.8rem;
  height: 1.8rem;
  transform: translateY(-50%)
}
@media screen and (min-width: 1024px) {
  .nav-plus-icon {
    display: none
  }
}
.nav-plus-icon::before, .nav-plus-icon::after {
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 2px;
  background: currentColor;
  transform: translateY(-50%);
  content: ""
}
.nav-plus-icon::after {
  transition: transform .3s ease, opacity .3s ease;
  transform: translateY(-50%) rotate(90deg)
}
.nav-arrow-icon {
  position: absolute;
  top: 50%;
  right: .7em;
  width: 1.8rem;
  height: 1.8rem;
  transform: translateY(-50%)
}
@media screen and (min-width: 1024px) {
  .nav-arrow-icon {
    display: none
  }
}
.nav-arrow-icon::before, .nav-arrow-icon::after {
  display: block;
  position: absolute;
  content: ""
}
.nav-arrow-icon::before {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 2px;
  background: currentColor;
  transform: translateY(-50%)
}
.nav-arrow-icon::after {
  position: absolute;
  top: 50%;
  right: 0;
  width: 1.2rem;
  height: 1.2rem;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: translateY(-50%) rotate(45deg)
}
.block-menus {
  display: flex;
  flex-direction: column;
  margin-top: 2em
}
@media screen and (min-width: 1024px) {
  .block-menus {
    flex-direction: row-reverse;
    width: auto;
    margin: 0
  }
}
.block-menus li {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  font-size: 1.4rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.2
}
@media screen and (min-width: 1024px) {
  .block-menus li {
    width: 7.1428571429vw;
    max-width: 100px;
    height: 7.1428571429vw;
    max-height: 100px
  }
}
.block-menus li + li {
  margin-top: 1.5em
}
@media screen and (min-width: 1024px) {
  .block-menus li + li {
    margin-top: 0
  }
}
@media screen and (min-width: 1024px) {
  .block-menus li + li a {
    border-right: 0
  }
}
.block-menus li.block-oc a {
  background: #8bc63e
}
.block-menus li.block-oc a:hover {
  background: #fff200
}
.block-menus li a {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  height: 100%;
  padding-top: .5em;
  background: #fff200;
  border: 2px solid #000;
  text-decoration: none;
  transition: .3s ease
}
@media screen and (min-width: 1024px) {
  .block-menus li a {
    flex-direction: column-reverse;
    padding: 0 5%
  }
}
.block-menus li a:hover {
  background: #8bc63e
}
.block-menus .icon {
  margin-left: 3%
}
@media screen and (min-width: 1024px) {
  .block-menus .icon {
    margin: 0 0 .5em
  }
}
.block-menus .txt {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem
}
@media screen and (max-width: 1023px) {
  .block-menus .en {
    margin-bottom: .3em
  }
}
.block-menus .large {
  font-size: 1.5em
}
@media screen and (min-width: 1024px) {
  .block-menus .large {
    font-size: 1.2rem
  }
}
.block-menus .block-oc .icon {
  width: 34.1791044776%
}
@media screen and (min-width: 1024px) {
  .block-menus .block-oc .icon {
    width: 4.4285714286vw;
    max-width: 62px
  }
}
.block-menus .block-request .icon {
  width: 16.7164179104%
}
@media screen and (min-width: 1024px) {
  .block-menus .block-request .icon {
    width: 3.1428571429vw;
    max-width: 44px
  }
}
@media screen and (max-width: 1023px) {
  .block-menus .block-request .large {
    margin-top: .3em
  }
}
.aoentry-link {
  margin-top: 2em
}
@media screen and (min-width: 1024px) {
  .aoentry-link {
    display: none
  }
}
.aoentry-link a {
  display: block;
  padding: 1em;
  background: #e8618a;
  border: 2px solid #000;
  color: #fff;
  font-size: 1.4rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
  text-decoration: none;
  transition: .3s ease
}
.aoentry-link a:hover {
  background: #000
}
.contact-link {
  margin-top: 2em
}
@media screen and (min-width: 1024px) {
  .contact-link {
    display: none
  }
}
.contact-link a {
  display: block;
  padding: 1em;
  background: #000;
  border: 2px solid #000;
  color: #fff;
  font-size: 1.4rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
  text-decoration: none;
  transition: .3s ease
}
.contact-link a:hover {
  background: #8bc63e;
  color: #000
}
.cv-list {
  display: flex;
  position: fixed;
  bottom: 0;
  right: 0;
  z-index: 10;
  width: 100%;
  max-width: 480px;
  transition: transform .3s ease
}
.cv-list.col-2 {
  height: 4.5em
}
@media screen and (min-width: 480px) {
  .cv-list.col-2 {
    max-width: 320px
  }
}
@media screen and (min-width: 1024px) {
  .cv-list {
    top: 50%;
    bottom: auto;
    width: auto;
    max-width: none;
    transform: translate(100%, -50%)
  }
}
@media screen and (min-width: 1024px) {
  .cv-list.show {
    transform: translate(0, -50%)
  }
}
.cv-list li {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
  font-size: 1.3rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.2
}
@media screen and (min-width: 1024px) {
  .cv-list li {
    flex: none;
    font-size: 1.2rem
  }
}
.cv-list li + li {
  position: relative
}
.cv-list li + li::before {
  position: absolute;
  top: 50%;
  left: 0;
  z-index: 1;
  width: 2px;
  height: 80%;
  background: #000;
  transform: translateY(-50%);
  content: ""
}
@media screen and (min-width: 1024px) {
  .cv-list li + li::before {
    display: none
  }
}
.cv-list li a {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  text-decoration: none;
  width: 100%;
  height: 100%;
  background: #fff200;
  transition: .3s ease
}
.cv-list li a:hover {
  background: #8bc63e
}
.cv-list .cv-icon {
  max-height: 100%;
  margin-right: .5em
}
@media screen and (min-width: 1024px) {
  .cv-list .cv-icon {
    margin: 0 0 .5em
  }
}
.cv-list .cv-icon img {
  width: 100%
}
@media screen and (min-width: 1024px) {
  .cv-list .sp-only {
    display: none
  }
}
.cv-list .cv-oc a {
  background: #8bc63e
}
.cv-list .cv-oc a:hover {
  background: #fff200
}
.cv-list .cv-oc .cv-icon {
  width: 38%
}
.cv-list .cv-request .cv-icon {
  width: 33.2%
}
@media screen and (min-width: 1024px) {
  .cv-list .cv-vertical {
    writing-mode: vertical-rl;
    text-orientation: upright;
    box-shadow: 0 0 .8rem rgba(255, 255, 255, .6)
  }
}
@media screen and (min-width: 1024px) {
  .cv-list .cv-web a {
    flex-direction: row;
    padding: 1.5em .5em;
    border: 2px solid #000
  }
}
@media screen and (min-width: 1024px) {
  .cv-list .cv-web a:hover {
    background: #000;
    color: #fff
  }
  .cv-list .cv-web a:hover svg {
    fill: #fff
  }
}
.cv-list .cv-web a svg {
  transition: .3s ease
}
.cv-list .cv-aoentry a {
  background: #e8618a;
  color: #fff
}
@media screen and (min-width: 1024px) {
  .cv-list .cv-aoentry a {
    padding: 1.5em .5em;
    border: 2px solid #000
  }
}
.cv-list .cv-aoentry a:hover {
  background: #000
}
.cv-list .cv-line a {
  background: #07b53b;
  color: #fff
}
@media screen and (min-width: 1024px) {
  .cv-list .cv-line a {
    padding: 1.5em .5em;
    border: 2px solid #07b53b
  }
}
.cv-list .cv-line a:hover {
  background: #fff;
  color: #07b53b
}
.cv-list .en {
  font-weight: 600
}
.mv {
  position: relative;
}
.mv-inner {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 50%;
  width: 89.3333333333%;
  max-width: 1024px;
  height: 100%;
  transform: translateX(-50%)
}
.mv-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  width: 63.4328358209%;
  min-height: 52%;
  padding: 8.9552238806%;
  background: #8bc63e;
  box-shadow:0 0 5px 5px rgba(0,0,0,0.05);
  overflow: hidden;
}
@media screen and (max-width: 600px) {
  .mv-inner {
    align-items: flex-end;
  }
  .mv-content {
    margin-bottom: -1rem;
  }
}
@media screen and (min-width: 601px) {
  .mv-content {
    width: 51.5625%;
    padding: 4.8828125% 5.859375%;
    min-height: 60%;
  }
}
.mv-content::after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 2.3529411765%;
  height: 110%;
  background-size: auto auto;
  background-color: transparent;
  background-image: repeating-linear-gradient(-16deg, transparent, transparent 0.38em, #000 0.38em, #000 0.76em);
  content: ""
}
@media screen and (min-width: 640px) {
  .mv-content::after {
    background-image: repeating-linear-gradient(-16deg, transparent, transparent 0.57em, #000 0.57em, #000 1.28em)
  }
}
.mv-title {
  color: #FFF;
  font-size: 2rem;
  letter-spacing: 0.1em;
  line-height: 1.4;
  font-weight: bold;
}
@media(min-width: 480px) {
  .mv-title {
    font-size: calc(1.6rem + (1vw - 4.8px) * 1.3043478261)
  }
}
@media(min-width: 1400px) {
  .mv-title {
    font-size: 2.8rem
  }
}
.mv-category {
  margin-bottom: .3em;
  font-size: 1.2rem;
  font-weight: bold;
}
@media(min-width: 480px) {
  .mv-category {
    font-size: calc(1.2rem + (1vw - 4.8px) * 0.652173913)
  }
}
@media(min-width: 1400px) {
  .mv-category {
    font-size: 1.8rem
  }
}
.mv-bg {
  width: 85.3333333333vw;
  margin-left: auto;
  overflow: hidden
}
@media screen and (min-width: 640px) {
  .mv-bg {
    width: calc(50% + 25.7142857143vw);
    max-height: 310px
  }
}
@media screen and (min-width: 1280px) {
  .mv-bg {
    width: calc(50% + 361px)
  }
}
.mv-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover
}
.breadcrumb {
  display: none
}
@media screen and (min-width: 640px) {
  .breadcrumb {
    display: block;
    padding: 1em 0;
    background: #f9f9f9
  }
}
.breadcrumb ol {
  display: flex
}
.breadcrumb ol > li {
  display: flex;
  align-items: center;
  color: #8bc63e;
  font-size: 1.1rem;
  font-weight: bold
}
@media(min-width: 480px) {
  .breadcrumb ol > li {
    font-size: calc(1.1rem + (1vw - 4.8px) * 0.2173913043)
  }
}
@media(min-width: 1400px) {
  .breadcrumb ol > li {
    font-size: 1.3rem
  }
}
.breadcrumb ol > li + li {
  margin-left: .6em
}
.breadcrumb ol > li + li::before {
  display: block;
  width: .6rem;
  height: .6rem;
  margin-right: .6em;
  border-top: 1px solid #000;
  border-right: 1px solid #000;
  transform: rotate(45deg);
  content: ""
}
.breadcrumb ol a {
  color: #000;
  text-decoration: none;
  transition: .3s ease
}
.breadcrumb ol a:hover {
  color: #8bc63e
}
.main-container {
  padding: 10.6666666667% 0 0;
}
@media screen and (min-width: 640px) {
  .main-container {
    padding: 8.5em 0
  }
}
.follow-container {
  position: relative;
  padding: 3em 0
}
@media screen and (min-width: 640px) {
  .follow-container {
    padding: 6em 0
  }
}
.follow-container .title {
  margin-bottom: 1em;
  font-family: "Oswald", sans-serif;
  font-size: 2.1rem;
  font-weight: 700;
  text-align: center;
  line-height: 1em;
  letter-spacing: .12em
}
@media(min-width: 480px) {
  .follow-container .title {
    font-size: calc(2.1rem + (1vw - 4.8px) * 2.2826086957)
  }
}
@media(min-width: 1400px) {
  .follow-container .title {
    font-size: 4.2rem
  }
}
.follow-container .title span {
  color: #8bc63e
}
.follow-container .sns-list {
  display: flex;
  justify-content: space-between;
  max-width: 568px;
  margin: 0 auto;
  transition: .6s ease-out
}
.follow-container .sns-list.in {
  opacity: 1;
  visibility: visible;
  transform: translateY(0)
}
.follow-container .sns-list li {
  width: 15.6690140845%
}
.covid-block {
  margin-top: 8%
}
@media screen and (min-width: 640px) {
  .covid-block {
    margin-top: 4.2em
  }
}
.covid-block [name=covid-check] {
  display: none
}
.covid-block [name=covid-check]:checked ~ .button-label .plus-icon::after {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(0)
}
.covid-block [name=covid-check]:checked ~ .covid-container {
  max-height: 100rem
}
.covid-block .button-label {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  padding: 1.2em 3em;
  background: #000;
  border: 2px solid #000;
  border-radius: 40px;
  color: #fff;
  font-size: 1.2rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
  transition: .4s ease-out;
  cursor: pointer
}
@media(min-width: 480px) {
  .covid-block .button-label {
    font-size: calc(1.2rem + (1vw - 4.8px) * 0.8695652174)
  }
}
@media(min-width: 1400px) {
  .covid-block .button-label {
    font-size: 2rem
  }
}
@media screen and (min-width: 640px) {
  .covid-block .button-label {
    padding: 1em 3em
  }
}
.covid-block .button-label:hover {
  background: #fff;
  color: #000
}
.covid-block .button-label:hover .plus-icon {
  background: #000
}
.covid-block .button-label:hover .plus-icon::before, .covid-block .button-label:hover .plus-icon::after {
  background: #fff
}
.covid-block .plus-icon {
  position: absolute;
  top: 50%;
  right: .5em;
  width: 7.4666666667vw;
  max-width: 42px;
  height: 7.4666666667vw;
  max-height: 42px;
  background: #fff;
  border-radius: 50%;
  transition: background .4s ease-out;
  transform: translateY(-50%)
}
.covid-block .plus-icon::before, .covid-block .plus-icon::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 46.4285714286%;
  height: 2px;
  background: #000;
  transition: .4s ease-out;
  transform: translate(-50%, -50%);
  content: ""
}
.covid-block .plus-icon::after {
  transform: translate(-50%, -50%) rotate(90deg)
}
.covid-container {
  max-height: 0;
  overflow: hidden;
  font-size: 1.2rem;
  text-align: center
}
@media(min-width: 480px) {
  .covid-container {
    font-size: calc(1.2rem + (1vw - 4.8px) * 0.4347826087)
  }
}
@media(min-width: 1400px) {
  .covid-container {
    font-size: 1.6rem
  }
}
.covid-container .inner {
  padding-top: 5%
}
.covid-container .title {
  margin-bottom: 1.5em;
  color: #8bc63e;
  font-size: 1.6rem;
  text-align: center
}
@media(min-width: 480px) {
  .covid-container .title {
    font-size: calc(1.6rem + (1vw - 4.8px) * 0.652173913)
  }
}
@media(min-width: 1400px) {
  .covid-container .title {
    font-size: 2.2rem
  }
}
.covid-container .icon-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  margin-bottom: 1em
}
.covid-container .icon-list li {
  width: 18%;
  margin: 0 1% 2%
}
@media screen and (min-width: 768px) {
  .covid-container .icon-list li {
    width: 8%;
    margin: 0 1%
  }
}
.covid-container .covid-button-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 1em
}
.covid-container .covid-button-list > li {
  width: 100%;
  margin-bottom: 3%
}
@media screen and (min-width: 640px) {
  .covid-container .covid-button-list > li {
    width: 48.4375%
  }
}
.covid-container .covid-button-list a {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  height: 100%;
  padding: .8em 1.5em;
  background: #464646;
  border: 2px solid #464646;
  color: #fff;
  font-size: 1.2rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
  text-decoration: none;
  transition: .3s ease
}
@media(min-width: 480px) {
  .covid-container .covid-button-list a {
    font-size: calc(1.2rem + (1vw - 4.8px) * 0.4347826087)
  }
}
@media(min-width: 1400px) {
  .covid-container .covid-button-list a {
    font-size: 1.6rem
  }
}
.covid-container .covid-button-list a:hover {
  background: #fff;
  color: #464646
}
.covid-container .covid-button-list a::after {
  display: block;
  position: absolute;
  top: 50%;
  right: .5em;
  width: .8rem;
  height: .8rem;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
  content: ""
}
.covid-container .archive-box {
  margin-top: 1.5em;
  padding: 8.9552238806%;
  border: 2px solid #ef5350;
  color: #ef5350
}
@media screen and (min-width: 640px) {
  .covid-container .archive-box {
    padding: 2.8em
  }
}


/*フォーマットcss追記*/
.border-box-gray {
  border: 2px solid #ddd;
  padding: 2rem;
  font-size: 1.5rem;
  margin: 2rem 0;
}
.background-box-gray {
  background: #F5F5F5;
  padding: 2rem;
  margin: 2rem 0;
}
.red-color {
  color: red;
}
.note-red {
  font-size: 1.4rem;
  color: red;
  margin: 1rem 0;
}
.note-list {
  margin: 2rem 0 2rem 1rem;
}
.note-list li{
  font-size: 1.1rem !important;
  line-height: 1.2em;
  margin-top: 0.7em;
  text-indent: -1rem;
}
.text-margin {
  margin: 1.5rem 0;
}
.text-default{
  font-size: 1.4rem;
}
.btn-no-link {
  position: relative;
  opacity: 0.2;
}
.btn-no-link::after {
  content: "";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

