@charset "UTF-8";
@keyframes _fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes _fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes _up {
  0% {
    transform: translateY(20px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes _zoom {
  0% {
    opacity: 0;
    transform: scale(0.5);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes _rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes _blurInAnime {
  from {
    opacity: 0;
    transform: scale(1.02);
    filter: blur(1em);
  }
  to {
    opacity: 1;
    transform: scale(1);
    filter: blur(0);
  }
}
@keyframes _left {
  0% {
    transform: translateX(-30%);
  }
  100% {
    transform: translateX(-50%);
  }
}
@keyframes _right {
  0% {
    transform: translateX(-70%);
  }
  100% {
    transform: translateX(-50%);
  }
}
@keyframes _hover-line {
  0% {
    background: linear-gradient(currentColor, currentColor) 0 100%/0% 2px no-repeat;
  }
  100% {
    background: linear-gradient(currentColor, currentColor) 0 100%/100% 2px no-repeat;
  }
}
._fadeInUp._waiting {
  opacity: 0;
  visibility: hidden;
}
._fadeInUp._running {
  visibility: visible;
  animation: _fadeIn 1200ms, _up 1200ms;
}

._fadeInZoom._waiting {
  opacity: 0;
}
._fadeInZoom._running {
  animation: _fadeIn 400ms forwards, _zoom 400ms cubic-bezier(0.82, 1.65, 0.685, 0.785);
}

._blurIn._waiting {
  visibility: hidden;
  opacity: 0;
}
._blurIn._running {
  visibility: visible;
  animation: _blurInAnime 1000ms forwards;
}

._fadeInSlideLeft._waiting {
  opacity: 0;
  visibility: hidden;
}
._fadeInSlideLeft._running {
  visibility: visible;
  animation: _fadeIn 1200ms, _left 1000ms;
}

#Container {
  font-weight: bold;
}
#Container.is-loading::after {
  animation: _fadeIn 1000ms 400ms forwards;
  background: url("../images/loading.gif") no-repeat center center;
  position: fixed;
  content: "";
  display: block;
  top: 50vh;
  left: 50vw;
  z-index: 1000;
  transform: translate(-50%, -50%);
  width: 100px;
  height: 100px;
  opacity: 0;
}

.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  background-color: #FFF;
}
.header .l-inner {
  box-sizing: border-box;
  max-width: 1140px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media screen and (max-width: 960.98px) {
  .header .l-inner {
    height: clamp(0px, calc(0px + (107 * max(0px, ((100dvw - 0px) / (768))))), 107px);
  }
}
@media print, screen and (min-width: 961px) {
  .header .l-inner {
    height: 70px;
    margin: 0 auto;
    padding: 0 20px;
  }
}
.header #Logo {
  text-align: left;
}
@media screen and (max-width: 960.98px) {
  .header #Logo {
    background-color: #FFF;
    position: relative;
    width: 100%;
    height: clamp(0px, calc(0px + (107 * max(0px, ((100dvw - 0px) / (768))))), 107px);
    z-index: 1000;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 0;
  }
}
@media print, screen and (min-width: 961px) {
  .header #Logo {
    padding: 0 20px;
  }
}
@media screen and (max-width: 960.98px) {
  .header #Logo img {
    height: clamp(0px, calc(0px + (84 * max(0px, ((100dvw - 0px) / (768))))), 84px);
    margin-left: 10px;
  }
}
@media print, screen and (min-width: 961px) {
  .header #Logo img {
    width: 160px;
    height: auto;
  }
}
.header .l-icon {
  position: absolute;
  z-index: 3000;
  top: 50%;
  cursor: pointer;
  transform: translateY(-50%);
}
@media screen and (max-width: 960.98px) {
  .header .l-icon {
    width: 50px;
    height: 50px;
  }
  .header .l-icon span {
    width: 22px;
  }
  .header .l-icon span::before,
  .header .l-icon span::after {
    width: 22px;
  }
}
@media screen and (max-width: 960.98px) {
  .header .l-icon {
    right: 5px;
  }
}
@media print, screen and (min-width: 961px) {
  .header .l-icon {
    display: none;
  }
}
@media (hover: hover) and (pointer: fine) {
  body:not([data-device=touchDevice]) .header .l-icon:hover {
    opacity: 0.7;
    transition: 400ms;
  }
}
.header .l-icon span {
  background: transparent;
  height: 2px;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transition: 0.2s;
  transform: translate(-50%, -50%);
}
.header .l-icon span::before,
.header .l-icon span::after {
  background: #231815;
  height: 2px;
  display: block;
  position: absolute;
  left: 0;
  content: "";
  transition: 0.3s;
  will-change: transform;
}
.header .l-icon span::before {
  transform: rotate(-45deg);
}
.header .l-icon span::after {
  transform: rotate(-135deg);
}
.header.is-nav-closed .l-icon span {
  background: #231815;
}
.header.is-nav-closed .l-icon span::before,
.header.is-nav-closed .l-icon span::after {
  transform: none;
}
@media screen and (max-width: 960.98px) {
  .header.is-nav-closed .l-icon span::before {
    top: -10px;
  }
}
@media screen and (max-width: 960.98px) {
  .header.is-nav-closed .l-icon span::after {
    bottom: -10px;
  }
}
@media screen and (max-width: 960.98px) {
  .header .l-nav {
    background-color: rgba(13, 165, 35, 0.9);
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: clamp(0px, calc(0px + (107 * max(0px, ((100dvw - 0px) / (768))))), 107px);
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    box-sizing: border-box;
    overflow: hidden;
    padding-bottom: 20vh;
    transition: transform 400ms;
  }
}
@media print, screen and (min-width: 961px) {
  .header .l-nav {
    display: flex;
    justify-content: center;
    column-gap: 30px;
  }
}
.header .l-nav li {
  font-size: clamp(1.8rem, calc(18px + (2 * max(0px, ((100dvw - 384px) / (384))))), 2rem);
  letter-spacing: 0.05em;
  left: 1.2em;
}
@media screen and (max-width: 960.98px) {
  .header .l-nav li {
    text-align: left;
    width: clamp(0px, calc(0px + (676 * max(0px, ((100dvw - 0px) / (768))))), 676px);
    margin: 0 auto;
    border-bottom: 1px solid #FFF;
  }
}
.header .l-nav li:first-child {
  border-top: 1px solid #FFF;
}
.header .l-nav li a {
  text-decoration: none;
  position: relative;
}
@media screen and (max-width: 960.98px) {
  .header .l-nav li a {
    width: 100%;
    display: block;
    padding: 1.5em clamp(60px, calc(60px + (140 * max(0px, ((100dvw - 320px) / (448))))), 200px) 1.5em clamp(60px, calc(60px + (180 * max(0px, ((100dvw - 320px) / (448))))), 240px);
    color: #FFF;
    box-sizing: border-box;
  }
}
@media print, screen and (min-width: 961px) {
  .header .l-nav li a {
    padding-right: 1.5em;
    color: #000;
  }
}
.header .l-nav li a span {
  position: relative;
  padding-bottom: 0.3em;
}
@media print, screen and (min-width: 961px) {
  .header .l-nav li a span::after {
    content: "";
    position: absolute;
    width: 0;
    visibility: hidden;
    height: 2px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background-color: #000;
  }
}
.header .l-nav li a::after {
  background-color: currentColor;
  mask: url("../images/icon-link-down.svg") no-repeat center;
  -webkit-mask: url("../images/icon-link-down.svg") no-repeat center;
  mask-size: contain;
  -webkit-mask-size: contain;
  content: "";
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  width: 0.9em;
  height: 0.9em;
}
@media screen and (max-width: 960.98px) {
  .header .l-nav li a::after {
    right: clamp(60px, calc(60px + (190 * max(0px, ((100dvw - 320px) / (448))))), 250px);
  }
}
@media print, screen and (min-width: 961px) {
  .header .l-nav li a::after {
    right: 0;
  }
}
@media screen and (hover: hover) and (pointer: fine) and (max-width: 960.98px) {
  body:not([data-device=touchDevice]) .header .l-nav li a:hover {
    background-color: rgba(255, 255, 255, 0.1);
    transition: background-color 400ms;
  }
}
@media (hover: hover) and (pointer: fine) {
  body:not([data-device=touchDevice]) .header .l-nav li a:hover::after {
    transform: translate(0, -30%);
    transition: transform 400ms;
  }
}
@media print and (hover: hover) and (pointer: fine), screen and (hover: hover) and (pointer: fine) and (min-width: 961px) {
  body:not([data-device=touchDevice]) .header .l-nav li a:hover span::after {
    visibility: visible;
    width: 100%;
    transition: width 300ms;
  }
}
@media screen and (max-width: 960.98px) {
  .header .l-nav li img {
    height: clamp(0px, calc(0px + (46 * max(0px, ((100dvw - 0px) / (768))))), 46px);
  }
}
@media print, screen and (min-width: 961px) {
  .header .l-nav li img {
    height: 14.2px;
  }
}
@media screen and (max-width: 960.98px) {
  .header.is-nav-closed .l-nav {
    pointer-events: none;
    transform: translateY(-101%);
    transition: transform 0ms;
  }
}

.u-anchor {
  position: relative;
}
@media screen and (max-width: 960.98px) {
  .u-anchor {
    top: clamp(-107px, calc(-107px + (107 * max(0px, ((-100dvw + 768px) / (768))))), 0px);
  }
}
@media print, screen and (min-width: 961px) {
  .u-anchor {
    top: -70px;
  }
}

/*============================
#MainArea
============================*/
.is-loading .mainArea {
  visibility: hidden;
  opacity: 0;
}

.is-loaded .mainArea {
  visibility: visible;
  animation: _fadeIn 1000ms;
}

@media screen and (max-width: 960.98px) {
  #MainArea.mainArea {
    padding-top: clamp(0px, calc(0px + (107 * max(0px, ((100dvw - 0px) / (768))))), 107px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea {
    padding-top: 70px;
  }
}
#MainArea.mainArea .l-end-text {
  font-size: clamp(1.2rem, calc(12px + (4 * max(0px, ((100dvw - 384px) / (384))))), 1.6rem);
  line-height: 1.6;
  letter-spacing: 0.1em;
  text-align: justify;
  display: inline-block;
  padding: 1em;
  margin: 0 auto;
}
#MainArea.mainArea .l-main-visual {
  width: 100%;
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .l-main-visual {
    background: url("../images/bg-main-sp.svg") no-repeat 50% 50%/cover;
    height: clamp(0px, calc(0px + (1385 * max(0px, ((100dvw - 0px) / (960))))), 1385px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .l-main-visual {
    background: url("../images/bg-main.svg") no-repeat 50% 50%/cover;
    height: clamp(0px, calc(0px + (650 * max(0px, ((100dvw - 0px) / (1140))))), 650px);
  }
}
#MainArea.mainArea .l-image-main {
  display: block;
  width: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .l-image-main {
    background: url("../images/bg-star-twinkle-sp.svg") no-repeat 50% 50%/cover;
    width: 100%;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .l-image-main {
    background: url("../images/bg-star-twinkle.svg") no-repeat 50% 50%/cover;
    width: clamp(0px, calc(0px + (1140 * max(0px, ((100dvw - 0px) / (1140))))), 1140px);
  }
}
#MainArea.mainArea .l-image-main img {
  opacity: 0;
}
#MainArea.mainArea .l-image-main img._running {
  visibility: visible;
  animation: _fadeIn 400ms 600ms forwards, _zoom 400ms 600ms cubic-bezier(0.82, 1.65, 0.685, 0.785);
}
#MainArea.mainArea .l-text-dates {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .l-text-dates {
    width: 100%;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .l-text-dates {
    width: clamp(0px, calc(0px + (1140 * max(0px, ((100dvw - 0px) / (1140))))), 1140px);
  }
}
#MainArea.mainArea .l-text-dates img {
  opacity: 0;
}
#MainArea.mainArea .l-text-dates img._running {
  visibility: visible;
  animation: _fadeIn 400ms 800ms forwards, _zoom 400ms 800ms cubic-bezier(0.82, 1.65, 0.685, 0.785);
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea {
    padding: clamp(0px, calc(0px + (50 * max(0px, ((100dvw - 0px) / (768))))), 50px) clamp(0px, calc(0px + (30 * max(0px, ((100dvw - 0px) / (768))))), 30px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .outlineArea {
    max-width: 980px;
    padding: clamp(0px, calc(0px + (42 * max(0px, ((100dvw - 0px) / (1140))))), 42px) clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (1140))))), 40px);
    margin: 0 auto;
  }
}
#MainArea.mainArea .outlineArea .l-text-copy {
  text-align: center;
  font-size: clamp(1.4rem, calc(14px + (10 * max(0px, ((100dvw - 384px) / (384))))), 2.4rem);
  line-height: 1.6;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea .l-text-copy {
    letter-spacing: 0.05em;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .outlineArea .l-text-copy {
    letter-spacing: 0.1em;
  }
}
#MainArea.mainArea .outlineArea .l-image-outline {
  position: relative;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea .l-image-outline {
    width: clamp(0px, calc(0px + (700 * max(0px, ((100dvw - 0px) / (768))))), 700px);
    margin: clamp(0px, calc(0px + (66 * max(0px, ((100dvw - 0px) / (768))))), 66px) auto 0;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .outlineArea .l-image-outline {
    width: clamp(0px, calc(0px + (980 * max(0px, ((100dvw - 0px) / (1140))))), 980px);
    margin: clamp(0px, calc(0px + (46 * max(0px, ((100dvw - 0px) / (1140))))), 46px) auto 0;
  }
}
#MainArea.mainArea .outlineArea .l-image-outline .l-button {
  position: absolute;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea .l-image-outline .l-button {
    width: clamp(0px, calc(0px + (220 * max(0px, ((100dvw - 0px) / (768))))), 220px);
    height: clamp(0px, calc(0px + (200 * max(0px, ((100dvw - 0px) / (768))))), 200px);
    top: clamp(0px, calc(0px + (1260 * max(0px, ((100dvw - 0px) / (768))))), 1260px);
    left: clamp(0px, calc(0px + (480 * max(0px, ((100dvw - 0px) / (768))))), 480px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .outlineArea .l-image-outline .l-button {
    width: clamp(0px, calc(0px + (298 * max(0px, ((100dvw - 0px) / (1140))))), 298px);
    height: 80px;
    bottom: 0;
    left: clamp(0px, calc(0px + (508 * max(0px, ((100dvw - 0px) / (1140))))), 508px);
  }
}
#MainArea.mainArea .outlineArea .l-image-outline .l-button a {
  color: #FFF;
  background-color: #38B54A;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  font-size: clamp(1rem, calc(10px + (8 * max(0px, ((100dvw - 320px) / (820))))), 1.8rem);
  line-height: 1.4;
  text-decoration: none;
  position: relative;
  border-radius: clamp(0px, calc(0px + (8 * max(0px, ((100dvw - 0px) / (480))))), 8px);
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea .l-image-outline .l-button a {
    letter-spacing: 0;
    padding: 0.5em 0 2em;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .outlineArea .l-image-outline .l-button a {
    letter-spacing: 0.05em;
    padding-right: 1em;
  }
}
@media (hover: hover) and (pointer: fine) {
  body:not([data-device=touchDevice]) #MainArea.mainArea .outlineArea .l-image-outline .l-button a:hover {
    background-color: #0E8014;
    transition: background-color 400ms;
  }
}
#MainArea.mainArea .outlineArea .l-image-outline .l-button a::after {
  position: absolute;
  content: "";
  display: block;
  background-color: currentColor;
  mask: url("/assets/common/images/icon-link-extarnal.svg") no-repeat center;
  -webkit-mask: url("/assets/common/images/icon-link-extarnal.svg") no-repeat center;
  mask-size: contain;
  -webkit-mask-size: contain;
  width: 1.2em;
  height: 1.2em;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea .l-image-outline .l-button a::after {
    transform: translateX(-50%);
    left: 50%;
    bottom: 1em;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .outlineArea .l-image-outline .l-button a::after {
    transform: translateY(-50%);
    top: 50%;
    right: 0.7em;
  }
}
#MainArea.mainArea .outlineArea .l-image-outline .l-button a.l-pre {
  pointer-events: none;
  background-color: #C0C0C0;
}
#MainArea.mainArea .outlineArea .l-image-outline .l-button a span.l-hover-line {
  background: linear-gradient(currentColor, currentColor) 0 100%/0% 1px no-repeat;
  transition: background 400ms cubic-bezier(0.165, 0.84, 0.44, 1); /* easeOutQuart */
  padding-bottom: 0.2em;
}
#MainArea.mainArea .outlineArea .l-image-outline .l-button a:hover span.l-hover-line {
  background: linear-gradient(currentColor, currentColor) 0 100%/100% 1px no-repeat;
}
#MainArea.mainArea .outlineArea .l-image-outline .l-button .l-text {
  line-height: 1.3;
  text-align: justify;
  display: block;
  padding: 0.1em 0 0.1em 0.5em;
  background-color: #FFF;
}
@media screen and (max-width: 480.98px) {
  #MainArea.mainArea .outlineArea .l-image-outline .l-button .l-text {
    font-size: clamp(0px, calc(0px + (10 * max(0px, ((100dvw - 0px) / (384))))), 1rem);
    margin-top: 0.4em;
  }
}
@media print, screen and (min-width: 481px) {
  #MainArea.mainArea .outlineArea .l-image-outline .l-button .l-text {
    font-size: clamp(1rem, calc(10px + (2 * max(0px, ((100dvw - 384px) / (384))))), 1.2em);
    letter-spacing: 0.05em;
    margin-top: 0.6em;
  }
}
#MainArea.mainArea .outlineArea .example {
  border: 1px solid #38B54A;
  text-align: left;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea .example {
    width: clamp(0px, calc(0px + (700 * max(0px, ((100dvw - 0px) / (768))))), 700px);
    margin: clamp(0px, calc(0px + (78 * max(0px, ((100dvw - 0px) / (768))))), 78px) auto 0;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .outlineArea .example {
    margin-top: clamp(0px, calc(0px + (74 * max(0px, ((100dvw - 0px) / (1140))))), 74px);
  }
}
#MainArea.mainArea .outlineArea .example .l-heading {
  font-size: clamp(1.6rem, calc(16px + (4 * max(0px, ((100dvw - 384px) / (384))))), 2rem);
  line-height: 1.2;
  letter-spacing: 0.1em;
  background-color: #38B54A;
  color: #FFF;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea .example .l-heading {
    text-align: center;
    padding: 0.5em;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .outlineArea .example .l-heading {
    padding: 0.5em 2em;
    display: inline-block;
  }
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea .example > .l-inner {
    padding: clamp(0px, calc(0px + (34 * max(0px, ((100dvw - 0px) / (768))))), 34px) clamp(0px, calc(0px + (30 * max(0px, ((100dvw - 0px) / (768))))), 30px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .outlineArea .example > .l-inner {
    padding: 0 clamp(0px, calc(0px + (50 * max(0px, ((100dvw - 0px) / (1140))))), 50px) clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (1140))))), 40px) clamp(0px, calc(0px + (50 * max(0px, ((100dvw - 0px) / (1140))))), 50px);
    margin-top: clamp(-14px, calc(-14px + (14 * max(0px, ((-100dvw + 1140px) / (1140))))), 0px);
  }
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea .example > .l-inner .l-text-example {
    padding-left: clamp(0px, calc(0px + (100 * max(0px, ((100dvw - 0px) / (768))))), 100px);
  }
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea .example > .l-inner .l-text-example img {
    width: clamp(0px, calc(0px + (504 * max(0px, ((100dvw - 0px) / (768))))), 504px);
    margin: 0 auto;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .outlineArea .example > .l-inner .l-text-example img {
    width: 100%;
  }
}
#MainArea.mainArea .outlineArea .example > .l-inner .l-text {
  font-size: clamp(1.2rem, calc(12px + (6 * max(0px, ((100dvw - 384px) / (384))))), 1.8rem);
  line-height: 1.5;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea .example > .l-inner .l-text {
    margin-top: 2.5em;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .outlineArea .example > .l-inner .l-text {
    margin-top: 1.5em;
  }
}
#MainArea.mainArea .outlineArea .example > .l-inner .l-note {
  font-size: clamp(1.2rem, calc(12px + (6 * max(0px, ((100dvw - 384px) / (384))))), 1.8rem);
  line-height: 1.5;
  letter-spacing: 0.05em;
  margin-top: 0.5em;
}
#MainArea.mainArea .outlineArea .l-notes {
  text-align: left;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea .l-notes {
    background: url("../images/icon-attention.svg") no-repeat 50% 0/clamp(0px, calc(0px + (102 * max(0px, ((100dvw - 0px) / (768))))), 102px);
    padding-top: clamp(0px, calc(0px + (138 * max(0px, ((100dvw - 0px) / (768))))), 138px);
    width: clamp(0px, calc(0px + (700 * max(0px, ((100dvw - 0px) / (768))))), 700px);
    margin: clamp(0px, calc(0px + (45 * max(0px, ((100dvw - 0px) / (768))))), 45px) auto 0;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .outlineArea .l-notes {
    background: url("../images/icon-attention.svg") no-repeat 0 0/clamp(0px, calc(0px + (70 * max(0px, ((100dvw - 0px) / (1140))))), 70px);
    margin-top: clamp(0px, calc(0px + (36 * max(0px, ((100dvw - 0px) / (1140))))), 36px);
    padding-left: clamp(0px, calc(0px + (94 * max(0px, ((100dvw - 0px) / (1140))))), 94px);
  }
}
#MainArea.mainArea .outlineArea .l-notes li {
  text-align: justify;
  color: #38B54A;
  font-size: clamp(1.2rem, calc(12px + (6 * max(0px, ((100dvw - 384px) / (384))))), 1.8rem);
  line-height: 1.4;
  letter-spacing: 0.05em;
  padding-left: 1.1em;
  text-indent: -1.1em;
}
#MainArea.mainArea .outlineArea .l-button-notes {
  max-width: 100%;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .outlineArea .l-button-notes {
    width: clamp(0px, calc(0px + (700 * max(0px, ((100dvw - 0px) / (768))))), 700px);
    margin: clamp(0px, calc(0px + (90 * max(0px, ((100dvw - 0px) / (768))))), 90px) auto 0;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .outlineArea .l-button-notes {
    width: 588px;
    margin: clamp(0px, calc(0px + (58 * max(0px, ((100dvw - 0px) / (1140))))), 58px) auto 0;
  }
}
#MainArea.mainArea .outlineArea .l-button-notes a {
  text-align: center;
  font-size: clamp(1.6rem, calc(16px + (12 * max(0px, ((100dvw - 384px) / (384))))), 2.8rem);
  color: #FF0000;
  line-height: 1.2;
  letter-spacing: 0.1em;
  text-decoration: none;
  display: block;
  position: relative;
  padding: 0.5em 1.5em;
  border: clamp(0px, calc(0px + (2 * max(0px, ((100dvw - 0px) / (768))))), 2px) solid #FF0000;
  border-radius: 99em;
}
#MainArea.mainArea .outlineArea .l-button-notes a::after {
  background-color: currentColor;
  mask: url("../images/icon-link-down.svg") no-repeat center;
  -webkit-mask: url("../images/icon-link-down.svg") no-repeat center;
  mask-size: contain;
  -webkit-mask-size: contain;
  content: "";
  position: absolute;
  top: 50%;
  right: 1em;
  transform: translate(0, -50%);
  width: 0.9em;
  height: 0.9em;
}
@media (hover: hover) and (pointer: fine) {
  body:not([data-device=touchDevice]) #MainArea.mainArea .outlineArea .l-button-notes a:hover {
    color: #FFF;
    background-color: #FF0000;
    transition: color 400ms, background-color 400ms;
  }
  body:not([data-device=touchDevice]) #MainArea.mainArea .outlineArea .l-button-notes a:hover::after {
    transform: translate(0, -30%);
    transition: transform 400ms;
  }
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea {
    padding: 0 clamp(0px, calc(0px + (30 * max(0px, ((100dvw - 0px) / (768))))), 30px);
    margin-top: clamp(0px, calc(0px + (90 * max(0px, ((100dvw - 0px) / (768))))), 90px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea {
    max-width: 980px;
    padding: 0 clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (1140))))), 40px);
    margin: clamp(0px, calc(0px + (60 * max(0px, ((100dvw - 0px) / (1140))))), 60px) auto 0;
  }
}
#MainArea.mainArea .flowArea .l-heading {
  font-size: clamp(2rem, calc(20px + (8 * max(0px, ((100dvw - 384px) / (384))))), 2.8rem);
  line-height: 1.2;
  letter-spacing: 0.1em;
  background-color: #38B54A;
  color: #FFF;
  padding: 0.5em;
  text-align: center;
}
#MainArea.mainArea .flowArea ol > li {
  display: grid;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li {
    margin-top: clamp(0px, calc(0px + (122 * max(0px, ((100dvw - 0px) / (768))))), 122px);
    grid-template-areas: "dates dates" "step explanation" "contents contents";
    grid-template-columns: clamp(0px, calc(0px + (110 * max(0px, ((100dvw - 0px) / (768))))), 110px) 1fr;
    column-gap: clamp(0px, calc(0px + (38 * max(0px, ((100dvw - 0px) / (768))))), 38px);
    row-gap: clamp(0px, calc(0px + (16 * max(0px, ((100dvw - 0px) / (768))))), 16px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li {
    margin-top: clamp(0px, calc(0px + (94 * max(0px, ((100dvw - 0px) / (1140))))), 94px);
    grid-template-areas: "dates dates" "step explanation" ". contents";
    grid-template-columns: clamp(0px, calc(0px + (110 * max(0px, ((100dvw - 0px) / (1140))))), 110px) 1fr;
    column-gap: clamp(0px, calc(0px + (38 * max(0px, ((100dvw - 0px) / (1140))))), 38px);
    row-gap: clamp(0px, calc(0px + (16 * max(0px, ((100dvw - 0px) / (1140))))), 16px);
  }
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li:first-child {
    margin-top: clamp(0px, calc(0px + (58 * max(0px, ((100dvw - 0px) / (768))))), 58px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li:first-child {
    margin-top: clamp(0px, calc(0px + (58 * max(0px, ((100dvw - 0px) / (1140))))), 58px);
  }
}
#MainArea.mainArea .flowArea ol > li .l-dates {
  grid-area: dates;
  color: #38B54A;
  border-top: clamp(0px, calc(0px + (2 * max(0px, ((100dvw - 0px) / (768))))), 2px) solid #38B54A;
  font-size: clamp(1.4rem, calc(14px + (10 * max(0px, ((100dvw - 384px) / (384))))), 2.4rem);
  line-height: 1.2;
  letter-spacing: 0.1em;
}
#MainArea.mainArea .flowArea ol > li .l-dates span {
  display: inline-block;
  background-color: #FFF;
  transform: translateY(-50%);
  padding: 0 1.5em;
}
#MainArea.mainArea .flowArea ol > li .l-step {
  grid-area: step;
}
#MainArea.mainArea .flowArea ol > li .l-explanation {
  grid-area: explanation;
  text-align: left;
}
#MainArea.mainArea .flowArea ol > li .l-text {
  text-align: justify;
  font-size: clamp(1.4rem, calc(14px + (10 * max(0px, ((100dvw - 384px) / (384))))), 2.4rem);
  line-height: 1.5;
  letter-spacing: 0.05em;
}
#MainArea.mainArea .flowArea ol > li .l-text .l-super {
  font-size: 60%;
  vertical-align: super;
  padding-left: 0.1em;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li .l-notes {
    margin-top: clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (768))))), 40px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-notes {
    margin-top: clamp(0px, calc(0px + (16 * max(0px, ((100dvw - 0px) / (1140))))), 16px);
  }
}
#MainArea.mainArea .flowArea ol > li .l-notes li {
  text-align: justify;
  font-size: clamp(1.2rem, calc(12px + (8 * max(0px, ((100dvw - 384px) / (384))))), 2rem);
  line-height: 1.5;
  letter-spacing: 0.05em;
}
#MainArea.mainArea .flowArea ol > li .l-contents {
  grid-area: contents;
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-button {
  text-align: center;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-button {
    margin: clamp(0px, calc(0px + (35 * max(0px, ((100dvw - 0px) / (768))))), 35px) auto 0;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-button {
    margin: clamp(0px, calc(0px + (46 * max(0px, ((100dvw - 0px) / (1140))))), 46px) auto 0;
  }
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-button a {
  color: #000;
  background-color: #FFF100;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  font-size: clamp(1.8rem, calc(18px + (0 * max(0px, ((100dvw - 384px) / (384))))), 1.8rem);
  line-height: 1.4;
  letter-spacing: 0.05em;
  text-decoration: none;
  position: relative;
  border-radius: clamp(0px, calc(0px + (8 * max(0px, ((100dvw - 0px) / (480))))), 8px);
  padding-right: 1em;
  max-width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-button a {
    width: clamp(0px, calc(0px + (440 * max(0px, ((100dvw - 0px) / (480))))), 440px);
    height: clamp(0px, calc(0px + (92 * max(0px, ((100dvw - 0px) / (480))))), 92px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-button a {
    width: 410px;
    height: 80px;
  }
}
@media (hover: hover) and (pointer: fine) {
  body:not([data-device=touchDevice]) #MainArea.mainArea .flowArea ol > li .l-contents .l-button a:hover {
    background-color: #FFE401;
    transition: background-color 400ms;
  }
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-button a span.l-hover-line {
  background: linear-gradient(currentColor, currentColor) 0 100%/0% 1px no-repeat;
  transition: background 400ms cubic-bezier(0.165, 0.84, 0.44, 1); /* easeOutQuart */
  padding-bottom: 0.2em;
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-button a:hover span.l-hover-line {
  background: linear-gradient(currentColor, currentColor) 0 100%/100% 1px no-repeat;
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-button a::after {
  position: absolute;
  content: "";
  top: 50%;
  right: 0.7em;
  transform: translateY(-50%);
  display: block;
  background-color: currentColor;
  mask-size: contain;
  -webkit-mask-size: contain;
  width: 1.2em;
  height: 1.2em;
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-button a.l-pre {
  color: #FFF;
  pointer-events: none;
  background-color: #C0C0C0;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-button a > span:has(small) {
    line-height: 1.1;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-button a > span:has(small) {
    line-height: 1.4;
  }
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-button a small {
    font-size: 66%;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-button a small {
    font-size: 80%;
  }
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-button.l-button-internal a::after {
  mask: url("/assets/common/images/icon-link-internal.svg") no-repeat center;
  -webkit-mask: url("/assets/common/images/icon-link-internal.svg") no-repeat center;
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-button.l-button-external a::after {
  mask: url("/assets/common/images/icon-link-extarnal.svg") no-repeat center;
  -webkit-mask: url("/assets/common/images/icon-link-extarnal.svg") no-repeat center;
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-button .l-text {
  line-height: 1.4;
  text-align: justify;
  display: inline-block;
  font-size: clamp(1.2rem, calc(12px + (2 * max(0px, ((100dvw - 384px) / (384))))), 1.4em);
  letter-spacing: 0.05em;
  margin: 0.6em auto 0;
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-link {
  color: #38B54A;
  display: inline-block;
  font-size: clamp(1.2rem, calc(12px + (8 * max(0px, ((100dvw - 384px) / (384))))), 2rem);
  line-height: 1.2;
  letter-spacing: 0.05em;
  position: relative;
  padding-right: 1.5em;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-link {
    margin-top: 2em;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-link {
    margin: 1.5em auto 0;
  }
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-link::after {
  position: absolute;
  content: "";
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  display: block;
  background-color: currentColor;
  mask: url("/assets/common/images/icon-link-internal.svg") no-repeat center;
  -webkit-mask: url("/assets/common/images/icon-link-internal.svg") no-repeat center;
  mask-size: contain;
  -webkit-mask-size: contain;
  width: 1.2em;
  height: 1.2em;
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-link a {
  color: #38B54A;
  text-decoration: none;
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-link a span.l-hover-line {
  background: linear-gradient(currentColor, currentColor) 0 100%/100% 1px no-repeat;
  padding-bottom: 0.3em;
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-link a:hover span.l-hover-line {
  animation: _hover-line 400ms forwards cubic-bezier(0.165, 0.84, 0.44, 1); /* easeOutQuart */
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-images {
  display: flex;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images {
    width: clamp(0px, calc(0px + (700 * max(0px, ((100dvw - 0px) / (768))))), 700px);
    margin: clamp(0px, calc(0px + (70 * max(0px, ((100dvw - 0px) / (768))))), 70px) auto 0;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images {
    margin-top: clamp(0px, calc(0px + (55 * max(0px, ((100dvw - 0px) / (1140))))), 55px);
  }
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-horizontal {
    flex-direction: column;
    row-gap: clamp(0px, calc(0px + (170 * max(0px, ((100dvw - 0px) / (768))))), 170px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-horizontal {
    justify-content: space-between;
  }
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-horizontal .l-item {
  position: relative;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-horizontal .l-item:first-child {
    padding: 0 clamp(0px, calc(0px + (12 * max(0px, ((100dvw - 0px) / (768))))), 12px);
  }
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-horizontal .l-item:first-child::after {
  content: "";
  position: absolute;
  display: block;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-horizontal .l-item:first-child::after {
    left: 50%;
    bottom: clamp(-26px, calc(-26px + (26 * max(0px, ((-100dvw + 768px) / (768))))), 0px);
    transform: translate(-50%, 100%);
    width: clamp(0px, calc(0px + (62 * max(0px, ((100dvw - 0px) / (768))))), 62px);
    height: clamp(0px, calc(0px + (114 * max(0px, ((100dvw - 0px) / (768))))), 114px);
    background: url("../images/icon-arrow-down.svg") no-repeat center/contain;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-horizontal .l-item:first-child::after {
    top: 50%;
    right: clamp(-15px, calc(-15px + (15 * max(0px, ((-100dvw + 1140px) / (1140))))), 0px);
    transform: translate(100%, -50%);
    width: clamp(0px, calc(0px + (62 * max(0px, ((100dvw - 0px) / (1140))))), 62px);
    height: clamp(0px, calc(0px + (34 * max(0px, ((100dvw - 0px) / (1140))))), 34px);
    background: url("../images/icon-arrow-right.svg") no-repeat center/contain;
  }
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-horizontal img {
  position: relative;
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-horizontal img {
    width: clamp(0px, calc(0px + (372 * max(0px, ((100dvw - 0px) / (1140))))), 372px);
  }
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-vertical {
  flex-direction: column;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-vertical {
    row-gap: clamp(0px, calc(0px + (170 * max(0px, ((100dvw - 0px) / (768))))), 170px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-vertical {
    row-gap: clamp(0px, calc(0px + (112 * max(0px, ((100dvw - 0px) / (1140))))), 112px);
  }
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-vertical .l-item {
  position: relative;
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-vertical .l-item:first-child::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translate(-50%, 100%);
  display: block;
  background: url("../images/icon-arrow-down.svg") no-repeat center/contain;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-vertical .l-item:first-child::after {
    bottom: clamp(-26px, calc(-26px + (26 * max(0px, ((-100dvw + 768px) / (768))))), 0px);
    width: clamp(0px, calc(0px + (62 * max(0px, ((100dvw - 0px) / (768))))), 62px);
    height: clamp(0px, calc(0px + (114 * max(0px, ((100dvw - 0px) / (768))))), 114px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-vertical .l-item:first-child::after {
    bottom: clamp(-30px, calc(-30px + (30 * max(0px, ((-100dvw + 1140px) / (1140))))), 0px);
    width: clamp(0px, calc(0px + (34 * max(0px, ((100dvw - 0px) / (1140))))), 34px);
    height: clamp(0px, calc(0px + (62 * max(0px, ((100dvw - 0px) / (1140))))), 62px);
  }
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-vertical img {
  position: relative;
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images.l-vertical img {
    width: clamp(0px, calc(0px + (340 * max(0px, ((100dvw - 0px) / (1140))))), 340px);
  }
}
#MainArea.mainArea .flowArea ol > li .l-contents .l-images .l-text {
  margin: 0 auto 0.5em auto;
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-images .l-text {
    width: clamp(0px, calc(0px + (340 * max(0px, ((100dvw - 0px) / (1140))))), 340px);
  }
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-image {
    width: clamp(0px, calc(0px + (700 * max(0px, ((100dvw - 0px) / (768))))), 700px);
    margin: clamp(0px, calc(0px + (50 * max(0px, ((100dvw - 0px) / (768))))), 50px) auto 0;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li .l-contents .l-image {
    margin-top: clamp(0px, calc(0px + (20 * max(0px, ((100dvw - 0px) / (1140))))), 20px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .flowArea ol > li.l-step4 .l-image img {
    width: clamp(0px, calc(0px + (340 * max(0px, ((100dvw - 0px) / (1140))))), 340px);
  }
}
#MainArea.mainArea .flowArea ol > li.l-step5 .l-notes {
  margin-top: clamp(0px, calc(0px + (32 * max(0px, ((100dvw - 0px) / (1140))))), 32px);
}
#MainArea.mainArea .flowArea .l-note-image {
  text-align: right;
  font-size: clamp(1.2rem, calc(12px + (8 * max(0px, ((100dvw - 384px) / (384))))), 2rem);
  line-height: 1.5;
  letter-spacing: 0.05em;
  margin-top: 2em;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .qaArea {
    padding: 0 clamp(0px, calc(0px + (30 * max(0px, ((100dvw - 0px) / (768))))), 30px);
    margin-top: clamp(0px, calc(0px + (90 * max(0px, ((100dvw - 0px) / (768))))), 90px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .qaArea {
    max-width: 980px;
    padding: 0 clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (1140))))), 40px);
    margin: clamp(0px, calc(0px + (70 * max(0px, ((100dvw - 0px) / (1140))))), 70px) auto 0;
  }
}
#MainArea.mainArea .qaArea .l-heading {
  font-size: clamp(2rem, calc(20px + (8 * max(0px, ((100dvw - 384px) / (384))))), 2.8rem);
  line-height: 1.2;
  letter-spacing: 0.1em;
  background-color: #38B54A;
  color: #FFF;
  padding: 0.5em;
  text-align: center;
}
#MainArea.mainArea .qaArea > .l-inner {
  text-align: center;
  background-color: #E3F7E6;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .qaArea > .l-inner {
    padding: clamp(0px, calc(0px + (44 * max(0px, ((100dvw - 0px) / (768))))), 44px) clamp(0px, calc(0px + (30 * max(0px, ((100dvw - 0px) / (768))))), 30px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .qaArea > .l-inner {
    padding: clamp(0px, calc(0px + (44 * max(0px, ((100dvw - 0px) / (1140))))), 44px) clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (1140))))), 40px);
  }
}
#MainArea.mainArea .qaArea dl {
  text-align: left;
}
#MainArea.mainArea .qaArea dl dt {
  font-size: clamp(1.8rem, calc(18px + (6 * max(0px, ((100dvw - 384px) / (384))))), 2.4rem);
  line-height: 1.5;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .qaArea dl dt {
    margin-top: clamp(0px, calc(0px + (100 * max(0px, ((100dvw - 0px) / (768))))), 100px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .qaArea dl dt {
    margin-top: clamp(0px, calc(0px + (56 * max(0px, ((100dvw - 0px) / (1140))))), 56px);
  }
}
#MainArea.mainArea .qaArea dl dt:first-child {
  margin-top: 0;
}
#MainArea.mainArea .qaArea dl dd {
  font-size: clamp(1.4rem, calc(14px + (4 * max(0px, ((100dvw - 384px) / (384))))), 1.8rem);
  line-height: 1.5;
  letter-spacing: 0.05em;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .qaArea dl dd {
    margin-top: clamp(0px, calc(0px + (22 * max(0px, ((100dvw - 0px) / (768))))), 22px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .qaArea dl dd {
    margin-top: clamp(0px, calc(0px + (12 * max(0px, ((100dvw - 0px) / (1140))))), 12px);
  }
}
#MainArea.mainArea .qaArea dl dt, #MainArea.mainArea .qaArea dl dd {
  display: grid;
  grid-template-columns: auto 1fr;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .qaArea dl dt, #MainArea.mainArea .qaArea dl dd {
    column-gap: clamp(0px, calc(0px + (24 * max(0px, ((100dvw - 0px) / (768))))), 24px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .qaArea dl dt, #MainArea.mainArea .qaArea dl dd {
    column-gap: clamp(0px, calc(0px + (15 * max(0px, ((100dvw - 0px) / (1140))))), 15px);
  }
}
#MainArea.mainArea .qaArea dl dt span, #MainArea.mainArea .qaArea dl dd span {
  align-self: center;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .qaArea dl img {
    width: clamp(0px, calc(0px + (62 * max(0px, ((100dvw - 0px) / (768))))), 62px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .qaArea dl img {
    width: clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (1140))))), 40px);
  }
}
#MainArea.mainArea .qaArea .l-button {
  text-align: center;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .qaArea .l-button {
    margin: clamp(0px, calc(0px + (35 * max(0px, ((100dvw - 0px) / (768))))), 35px) auto 0;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .qaArea .l-button {
    margin: clamp(0px, calc(0px + (46 * max(0px, ((100dvw - 0px) / (1140))))), 46px) auto 0;
  }
}
#MainArea.mainArea .qaArea .l-button a {
  color: #000;
  background-color: #FFF100;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  font-size: clamp(1.8rem, calc(18px + (0 * max(0px, ((100dvw - 384px) / (384))))), 1.8rem);
  line-height: 1.4;
  letter-spacing: 0.05em;
  text-decoration: none;
  position: relative;
  border-radius: clamp(0px, calc(0px + (8 * max(0px, ((100dvw - 0px) / (480))))), 8px);
  padding-right: 1em;
  max-width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .qaArea .l-button a {
    width: clamp(0px, calc(0px + (440 * max(0px, ((100dvw - 0px) / (480))))), 440px);
    height: clamp(0px, calc(0px + (92 * max(0px, ((100dvw - 0px) / (480))))), 92px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .qaArea .l-button a {
    width: 410px;
    height: 80px;
  }
}
@media (hover: hover) and (pointer: fine) {
  body:not([data-device=touchDevice]) #MainArea.mainArea .qaArea .l-button a:hover {
    background-color: #FFE401;
    transition: background-color 400ms;
  }
}
#MainArea.mainArea .qaArea .l-button a.l-pre {
  color: #FFF;
  pointer-events: none;
  background-color: #C0C0C0;
}
#MainArea.mainArea .qaArea .l-button a span.l-hover-line {
  background: linear-gradient(currentColor, currentColor) 0 100%/0% 1px no-repeat;
  transition: background 400ms cubic-bezier(0.165, 0.84, 0.44, 1); /* easeOutQuart */
  padding-bottom: 0.2em;
}
#MainArea.mainArea .qaArea .l-button a:hover span.l-hover-line {
  background: linear-gradient(currentColor, currentColor) 0 100%/100% 1px no-repeat;
}
#MainArea.mainArea .qaArea .l-button a::after {
  position: absolute;
  content: "";
  top: 50%;
  right: 0.7em;
  transform: translateY(-50%);
  display: block;
  background-color: currentColor;
  mask: url("/assets/common/images/icon-link-extarnal.svg") no-repeat center;
  -webkit-mask: url("/assets/common/images/icon-link-extarnal.svg") no-repeat center;
  mask-size: contain;
  -webkit-mask-size: contain;
  width: 1.2em;
  height: 1.2em;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .qaArea .l-button a > span:has(small) {
    line-height: 1.1;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .qaArea .l-button a > span:has(small) {
    line-height: 1.4;
  }
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .qaArea .l-button a small {
    font-size: 66%;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .qaArea .l-button a small {
    font-size: 80%;
  }
}
#MainArea.mainArea .qaArea .l-button .l-text {
  line-height: 1.4;
  text-align: justify;
  display: inline-block;
  font-size: clamp(1.2rem, calc(12px + (2 * max(0px, ((100dvw - 384px) / (384))))), 1.4em);
  letter-spacing: 0.05em;
  margin: 0.6em auto 0;
}
#MainArea.mainArea .notesArea {
  text-align: left;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .notesArea {
    padding: 0 clamp(0px, calc(0px + (30 * max(0px, ((100dvw - 0px) / (768))))), 30px);
    margin-top: clamp(0px, calc(0px + (90 * max(0px, ((100dvw - 0px) / (768))))), 90px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .notesArea {
    max-width: 980px;
    padding: 0 clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (1140))))), 40px);
    margin: clamp(0px, calc(0px + (60 * max(0px, ((100dvw - 0px) / (1140))))), 60px) auto 0;
  }
}
#MainArea.mainArea .notesArea .l-heading {
  font-size: clamp(2rem, calc(20px + (8 * max(0px, ((100dvw - 384px) / (384))))), 2.8rem);
  line-height: 1.2;
  letter-spacing: 0.1em;
  color: #38B54A;
  padding-bottom: 0.3em;
  border-bottom: 1px solid #000;
  margin-bottom: 0.5em;
}
#MainArea.mainArea .notesArea .l-heading::before {
  content: "■";
}
#MainArea.mainArea .notesArea .l-heading + h3 {
  margin-top: 0;
}
#MainArea.mainArea .notesArea h3 {
  text-align: left;
  font-size: clamp(1.6rem, calc(16px + (8 * max(0px, ((100dvw - 384px) / (384))))), 2.4rem);
  line-height: 1.4;
  letter-spacing: 0.05em;
  color: #38B54A;
  margin-top: 2.5em;
}
#MainArea.mainArea .notesArea h3:first-child {
  margin-top: 0;
}
#MainArea.mainArea .notesArea h3 + p {
  margin-top: 0.2em;
}
#MainArea.mainArea .notesArea p {
  text-align: left;
  font-size: clamp(1.4rem, calc(14px + (4 * max(0px, ((100dvw - 384px) / (384))))), 1.8rem);
  line-height: 1.5;
  letter-spacing: 0.05em;
  margin-top: 1.5em;
}
#MainArea.mainArea .notesArea p:first-child {
  margin-top: 0;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .stockPointArea,
  #MainArea.mainArea .keioPointArea {
    padding: 0 clamp(0px, calc(0px + (30 * max(0px, ((100dvw - 0px) / (768))))), 30px);
    margin-top: clamp(0px, calc(0px + (90 * max(0px, ((100dvw - 0px) / (768))))), 90px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .stockPointArea,
  #MainArea.mainArea .keioPointArea {
    max-width: 980px;
    padding: 0 clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (1140))))), 40px);
    margin: clamp(0px, calc(0px + (70 * max(0px, ((100dvw - 0px) / (1140))))), 70px) auto 0;
  }
}
#MainArea.mainArea .stockPointArea .l-heading,
#MainArea.mainArea .keioPointArea .l-heading {
  font-size: clamp(2rem, calc(20px + (8 * max(0px, ((100dvw - 384px) / (384))))), 2.8rem);
  line-height: 1.2;
  letter-spacing: 0.1em;
  background-color: #38B54A;
  color: #FFF;
  padding: 0.5em;
  text-align: center;
}
#MainArea.mainArea .stockPointArea .l-button,
#MainArea.mainArea .keioPointArea .l-button {
  text-align: center;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .stockPointArea .l-button,
  #MainArea.mainArea .keioPointArea .l-button {
    margin: clamp(0px, calc(0px + (35 * max(0px, ((100dvw - 0px) / (768))))), 35px) auto 0;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .stockPointArea .l-button,
  #MainArea.mainArea .keioPointArea .l-button {
    margin: clamp(0px, calc(0px + (46 * max(0px, ((100dvw - 0px) / (1140))))), 46px) auto 0;
  }
}
#MainArea.mainArea .stockPointArea .l-button a,
#MainArea.mainArea .keioPointArea .l-button a {
  color: #000;
  background-color: #FFF100;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  font-size: clamp(1.8rem, calc(18px + (0 * max(0px, ((100dvw - 384px) / (384))))), 1.8rem);
  line-height: 1.4;
  letter-spacing: 0.05em;
  text-decoration: none;
  position: relative;
  border-radius: clamp(0px, calc(0px + (8 * max(0px, ((100dvw - 0px) / (480))))), 8px);
  padding-right: 1em;
  max-width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .stockPointArea .l-button a,
  #MainArea.mainArea .keioPointArea .l-button a {
    width: clamp(0px, calc(0px + (440 * max(0px, ((100dvw - 0px) / (480))))), 440px);
    height: clamp(0px, calc(0px + (92 * max(0px, ((100dvw - 0px) / (480))))), 92px);
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .stockPointArea .l-button a,
  #MainArea.mainArea .keioPointArea .l-button a {
    width: clamp(0px, calc(0px + (410 * max(0px, ((100dvw - 0px) / (768))))), 410px);
    height: clamp(0px, calc(0px + (74 * max(0px, ((100dvw - 0px) / (768))))), 74px);
  }
}
@media (hover: hover) and (pointer: fine) {
  body:not([data-device=touchDevice]) #MainArea.mainArea .stockPointArea .l-button a:hover,
  body:not([data-device=touchDevice]) #MainArea.mainArea .keioPointArea .l-button a:hover {
    background-color: #FFE401;
    transition: background-color 400ms;
  }
}
#MainArea.mainArea .stockPointArea .l-button a span.l-hover-line,
#MainArea.mainArea .keioPointArea .l-button a span.l-hover-line {
  background: linear-gradient(currentColor, currentColor) 0 100%/0% 1px no-repeat;
  transition: background 400ms cubic-bezier(0.165, 0.84, 0.44, 1); /* easeOutQuart */
  padding-bottom: 0.2em;
}
#MainArea.mainArea .stockPointArea .l-button a:hover span.l-hover-line,
#MainArea.mainArea .keioPointArea .l-button a:hover span.l-hover-line {
  background: linear-gradient(currentColor, currentColor) 0 100%/100% 1px no-repeat;
}
#MainArea.mainArea .stockPointArea .l-button a.l-pre,
#MainArea.mainArea .keioPointArea .l-button a.l-pre {
  color: #FFF;
  pointer-events: none;
  background-color: #C0C0C0;
}
#MainArea.mainArea .stockPointArea .l-button a::after,
#MainArea.mainArea .keioPointArea .l-button a::after {
  position: absolute;
  content: "";
  top: 50%;
  right: 0.7em;
  transform: translateY(-50%);
  display: block;
  background-color: currentColor;
  mask-size: contain;
  -webkit-mask-size: contain;
  width: 1.2em;
  height: 1.2em;
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .stockPointArea .l-button a > span:has(small),
  #MainArea.mainArea .keioPointArea .l-button a > span:has(small) {
    line-height: 1.1;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .stockPointArea .l-button a > span:has(small),
  #MainArea.mainArea .keioPointArea .l-button a > span:has(small) {
    line-height: 1.4;
  }
}
@media screen and (max-width: 960.98px) {
  #MainArea.mainArea .stockPointArea .l-button a small,
  #MainArea.mainArea .keioPointArea .l-button a small {
    font-size: 66%;
  }
}
@media print, screen and (min-width: 961px) {
  #MainArea.mainArea .stockPointArea .l-button a small,
  #MainArea.mainArea .keioPointArea .l-button a small {
    font-size: 80%;
  }
}
#MainArea.mainArea .stockPointArea .l-button.l-button-internal a::after,
#MainArea.mainArea .keioPointArea .l-button.l-button-internal a::after {
  mask: url("/assets/common/images/icon-link-internal.svg") no-repeat center;
  -webkit-mask: url("/assets/common/images/icon-link-internal.svg") no-repeat center;
}
#MainArea.mainArea .stockPointArea .l-button.l-button-external a::after,
#MainArea.mainArea .keioPointArea .l-button.l-button-external a::after {
  mask: url("/assets/common/images/icon-link-extarnal.svg") no-repeat center;
  -webkit-mask: url("/assets/common/images/icon-link-extarnal.svg") no-repeat center;
}
#MainArea.mainArea .stockPointArea .l-button .l-text,
#MainArea.mainArea .keioPointArea .l-button .l-text {
  line-height: 1.4;
  text-align: justify;
  display: inline-block;
  font-size: clamp(1.2rem, calc(12px + (2 * max(0px, ((100dvw - 384px) / (384))))), 1.4em);
  letter-spacing: 0.05em;
  margin: 0.6em auto 0;
}

.footerArea {
  background-color: #E6E6E5;
  border-top: none;
}
@media screen and (max-width: 960.98px) {
  .footerArea {
    margin: clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (768))))), 40px) 0 0 0;
    padding: clamp(0px, calc(0px + (50 * max(0px, ((100dvw - 0px) / (768))))), 50px) clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (768))))), 40px);
  }
}
@media print, screen and (min-width: 961px) {
  .footerArea {
    margin: 70px 0 0 0;
    padding: clamp(0px, calc(0px + (50 * max(0px, ((100dvw - 0px) / (768))))), 50px) clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (768))))), 40px);
  }
}
.footerArea .l-link-pagetop {
  width: clamp(0px, calc(0px + (46 * max(0px, ((100dvw - 0px) / (480))))), 46px);
  height: clamp(0px, calc(0px + (46 * max(0px, ((100dvw - 0px) / (480))))), 46px);
  visibility: hidden;
  opacity: 0;
  border-radius: 50%;
  position: fixed;
  z-index: 9000;
  right: clamp(0px, calc(0px + (20 * max(0px, ((100dvw - 0px) / (768))))), 20px);
  bottom: clamp(0px, calc(0px + (20 * max(0px, ((100dvw - 0px) / (768))))), 20px);
  transition: background-color 400ms, opacity 400ms, visibility 400ms;
  background-color: #0054B6;
  pointer-events: none;
}
@media (hover: hover) and (pointer: fine) {
  body:not([data-device=touchDevice]) .footerArea .l-link-pagetop:hover {
    background-color: #00499C;
  }
}
.footerArea .l-link-pagetop.is-visible {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}
.footerArea .l-link-pagetop img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -55%);
  width: clamp(0px, calc(0px + (14 * max(0px, ((100dvw - 0px) / (384))))), 14px);
}
.footerArea .l-link {
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 960.98px) {
  .footerArea .l-link {
    column-gap: clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (768))))), 40px);
  }
}
@media print, screen and (min-width: 961px) {
  .footerArea .l-link {
    column-gap: 40px;
  }
}
.footerArea .l-link li {
  letter-spacing: 0.05em;
  font-size: clamp(1.4rem, calc(14px + (4 * max(0px, ((100dvw - 384px) / (384))))), 1.8rem);
  line-height: 1.4;
  border-left: 1px solid #000;
}
@media screen and (max-width: 960.98px) {
  .footerArea .l-link li {
    padding-left: clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (768))))), 40px);
  }
}
@media print, screen and (min-width: 961px) {
  .footerArea .l-link li {
    padding-left: 40px;
  }
}
.footerArea .l-link li:first-child {
  border-left: none;
}
.footerArea .l-link li a {
  color: #000;
  text-decoration: none;
  padding-bottom: 0.1em;
  border-bottom: 1px solid #000;
}
.footerArea .l-copyright {
  color: #444;
  font-size: clamp(1.1rem, calc(11px + (1 * max(0px, ((100dvw - 384px) / (384))))), 1.2rem);
  line-height: 1.4;
  margin-top: 2em;
  letter-spacing: 0.1em;
}

/*# sourceMappingURL=index.css.map */
