body {
  background-color: var(--Color-white);
  position: relative;
  min-width: var(--breakpoints);
  text-align: left;
  font-size: var(--font-size-14);
  font-family: var(--font-poppins);
}

/* ================================== */
/* FirstView */
/* ================================== */

.first-view {
  width: 100%;
  height: 21.6rem;
  overflow: hidden;
  color: var(--Color-white);
  text-align: center;
  font-size: var(--font-h2-size);
  background: var(--bluescale-800) url('../images/first_view_pc.png') no-repeat right;
  background-size: 30%;
  display: flex;
  align-items: center;
  justify-content: center;

  @media (width < 1009px) {
    background: var(--bluescale-800);
  }
}
.first-view__text {
  text-align: center;
}
.first-view__text > h2 {
  color: var(--Color-white);
  font-family: var(--font-poppins);
  font-size: var(--font-size-32);
  line-height: 120%;
  margin-bottom: .1rem;
}
.first-view__text > p {
  color: var(--Color-white);
  font-family: var(--font-noto-sans-jp);
  font-size: var(--font-p-size);
}

/* ================================== */
/* Breadcrumb */
/* ================================== */

.breadcrumbs {
  padding: 1.5rem 2rem;
}
.breadcrumbs__list {
  max-width: 120rem;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  font-size: var(--font-size-14);
}
.breadcrumbs__list > li {
  margin: 0 .5rem;
}
.breadcrumbs__list > li:not(:last-child):after {
  content: '>';
  margin-left: .5rem;
  color: var(--grayscale-gray900);
}
.breadcrumbs__list > li a {
  color: var(--grayscale-gray900);
}

/* ================================== */
/* About Subsidy */
/* ================================== */

.about-subsidy {
  color: var(--grayscale-black);
  text-align: center;
  font-size: var(--font-size-18);
  padding: var(--padding-80) 0 0;

  @media (width < 1009px) {
    padding: var(--padding-24) var(--padding-20);
  }
}
.about-subsidy h2 {
  color: var(--grayscale-black);
  font-family: var(--font-noto-sans-jp);
  font-size: var(--font-size-32);
  font-weight: 700;
  line-height: 120%;
  margin-bottom: .1rem;

  @media (width < 1009px) {
    margin-bottom: 2rem;
  }
}
.about-subsidy p {
  color: var(--grayscale-black);
  font-family: var(--font-noto-sans-jp);
  font-size: var(--font-size-18);
  font-weight: 400;
}
.about-subsidy p:first-of-type {
  color: var(--grayscale-black);
  font-size: var(--font-size-18);
  line-height: 180%;
  margin-bottom: .8rem;
}
.about-subsidy p:last-of-type {
  color: var(--logo-gray);
  font-size: var(--font-size-14);
  line-height: 160%;
  margin-bottom: 40px;
}
.about-subsidy__image {
  max-width: 120rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: stretch;
  border-radius: 1.2rem;
  margin: 0 auto 2rem;
  padding-bottom: 2rem;

  @media (width > 1200px) {
    background: var(--BG-blue-100, #F5FBFF);
    margin-bottom: 60px;
  }
}
.about-subsidy__image .pc-image {
  width: 612px;

  @media (width < 1200px) {
    display: none;
  }
}
.about-subsidy__image .sp-image {
  display: none;

  @media (width < 1200px) {
    display: block;
  }
}

/* ================================== */
/* Menu Anker Link */
/* ================================== */

.menu-anker-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--gap-40);
  margin-bottom: 4rem;

  @media (width < 1200px) {
    display: block;
    padding: var(--padding-20) var(--padding-30);
  }
}
.menu-anker-link li {
  @media (width > 1200px) {
    width: 152px;
  }
  @media (width < 1200px) {
    width: 100%;
  }
}
.menu-anker-link li:nth-of-type(2) {
  @media (width < 1200px) {
    margin: 2rem 0;
  }
}
.menu-anker-link li a {
  display: block;
  text-align: center;
  box-shadow: var(--card-dropshadow-Light);
  border-radius: var(--br-12);
  background-color: var(--Color-white);
  padding: var(--padding-20) var(--padding-20) var(--padding-24);
  position: relative;

  @media (width < 1200px) {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: var(--padding-20);
  }
}
.menu-anker-link li a img {
  display: block;

  @media (width > 1200px) {
    margin: 0 auto;
  }
  @media (width < 1200px) {
    margin-right: 1rem;
  }
}
.menu-anker-link li a .icon {
  margin-bottom: 10px;
}
.menu-anker-link li a span {
  color: var(--grayscale-black);
  font-family: var(--font-poppins);
  font-size: var(--font-size-14);
  font-weight: 600;

  @media (width < 1200px) {
    font-size: var(--font-size-16);
  }
}
.menu-anker-link li .circle {
  display: block;
  width: 3.36rem;
  height: 3.36rem;
  padding: .7rem;
  background: url('./asset/images/bottom_arrow_blue.svg') no-repeat;
  border-radius: 50%;
  position: absolute;
  right: 2rem;

  @media (width > 1200px) {
    left: 0;
    right: 0;
    bottom: -1.5rem;
    margin: auto;
  }
}

/* ================================== */
/* Introduction Section (Common) */
/* ================================== */

.introduction-section {
  width: 100%;
  padding-top: 8.4rem;
  margin-top: -8.4rem;

  @media (width < 1009px) {
    padding-top: 4rem;
    margin-top: -7rem;
  }
}
.introduction-section__bakcground {
  background-color: var(--BG-Gray-100-50);
  padding: var(--padding-60) 12rem;

  @media (width < 1009px) {
    padding: var(--padding-40) var(--padding-20);
  }
}
.introduction-section h2 {
  font-size: var(--font-size-32);
  font-family: var(--font-poppins);
  text-align: center;
  line-height: 120%;
  font-weight: 600;
  margin-bottom: 4rem;

  @media (width < 1009px) {
    font-size: var(--font-size-22);
    padding: var(--padding-40) var(--padding-20) 0;
    margin-bottom: 5rem;
  }
}

/* ================================== */
/* Product */
/* ================================== */

.introduction-section.product {
}
.introduction-section .product-block {
  display: flex;
  justify-content: center;

  @media (width < 1009px) {
    display: block;
  }
}
.introduction-section .product-block li:first-of-type {
  @media (width < 1009px) {
    margin-bottom: 4rem;
  }
  @media (width > 1009px) {
    margin-right: 4rem;
  }
}

.introduction-section .product-block li a {
  width: 58rem;
  overflow: hidden;
  object-fit: cover;
  text-align: center;
  box-shadow: var(--card-dropshadow-Dark);
  cursor: pointer;
  display: block;
  border-radius: 12px;

  @media (width < 1009px) {
    width: 100%;
  }
}

.introduction-section .product-block li:first-of-type a {
  background: var(--BG-blue-200, #ECF5FD);
}

/* ================================== */
/* Schedule */
/* ================================== */

.introduction-section.schedule .introduction-section__bakcground {
  background: var(--Grayscale-Gray-100, #F1F3F6);
}
.introduction-section.schedule h3 {
  color: var(--Grayscale-black, #222);
  font-size: var(--font-size-22);
  font-family: var(--font-noto-sans-jp);
  text-align: center;
  font-weight: 700;
  line-height: 120%;
  margin-bottom: 4rem;
}
.introduction-section.flow .image,
.introduction-section.schedule .image {
  @media (width < 1009px) {
    margin-bottom: 3rem;
  }
  @media (width > 1009px) {
    max-width: 120rem;
    margin: 0 auto 3.5rem;
  }
}

.introduction-section.schedule .schedule-table-list {
  @media (width < 1009px) {
    margin-bottom: 4rem;
  }
  @media (width > 1009px) {
    max-width: 120rem;
    margin: 0 auto 6rem;;
  }
}

/* ================================== */
/* Schedule Table List */
/* ================================== */

.schedule-table-list {
  display: flex;
  justify-content: space-between;

  @media (width < 1009px) {
    display: block;
  }
}
.schedule-table {
  width: 37rem;
  color: var(--Black);
  text-align: center;
  font-family: var(--font-noto-sans-jp);
  font-size: var(--font-size-14);
  font-weight: 500;

  @media (width < 1009px) {
    width: 100%;
  }
}

.schedule-table:nth-of-type(2) {
  @media (width < 1009px) {
    margin: 4rem 0;
  }
}
.schedule-table .pc {
  @media (width < 1009px) {
    display: none;
  }
}
.schedule-table thead th {
  color: white;
  padding: 4px 0;
  border-radius: 8px 8px 0 0;
  background: var(--grayscale-gray800, #A0AFC3);
}
.schedule-table tbody {
  background: white;
}
.schedule-table tbody tr:not(:last-child) th,
.schedule-table tbody tr:not(:last-of-type) td {
  border-bottom: 1px solid var(--grayscale-gray800, #A0AFC3);
}
.schedule-table tbody tr th {
  border-right: 1px dashed #C2CBD8;
  padding: 7.557px 7px;
}
.schedule-table tbody tr td {
  padding: 7.557px 7px;
}
.schedule-table tbody tr:last-of-type th {
  border-radius: 0 0 0 8px;
}
.schedule-table tbody tr:last-of-type td {
  border-radius: 0 0 8px 0;
}

/* ================================== */
/* Flow */
/* ================================== */

.introduction-section.flow .lead-text {
  text-align: center;
  margin: -3rem auto 4rem;
}

.introduction-section.flow .image {
  text-align: center;
}

.introduction-section.flow .procedure {}
.introduction-section.flow .procedure h3 {
  color: var(--grayscale-black);
  font-family: var(--font-noto-sans-jp);
  font-size: var(--font-size-32);
  font-weight: 700;
  line-height: 120%;
  text-align: center;
  margin: 6rem auto 3rem;

  @media (width < 1009px) {
    margin: 4rem auto 2rem
  }
}
.introduction-section.flow .procedure .image {
  text-align: center;

  @media (width < 1009px) {
    width: 50%;
    margin: 0 auto;
  }
}
.introduction-section.flow .procedure__wrapper {
  display: flex;
  gap: var(--gap-40);
  align-items: center;
  justify-content: center;

  @media (width < 1009px) {
    display: block;
  }
}
.introduction-section.flow .cta-button {
  margin: 8rem auto 0;

  @media (width < 1009px) {
    margin: 4rem auto 0;
  }
}

/* ================================== */
/* Flow Explanation */
/* ================================== */

.flow-explanation {
  width: 480px;
  padding: 1.8rem 3rem;
  background: var(--color-white);
  border-radius: 1.2rem;

  @media (width < 1009px) {
    width: 100%;
  }
}
.flow-explanation:last-of-type {
  @media (width < 1009px) {
    margin-top: 1rem;
  }
}
.flow-explanation h4 {
  color: var(--bluescale-blue800, #0089D0);
  text-align: center;
  font-family: var(--font-noto-sans-jp);
  font-size: var(--font-size-22);
  font-weight: 700;
  line-height: 120%;
  margin-bottom: 1.8rem;
}
.flow-explanation h4:first-of-type:before {
  content: '';
  display: block;
  width: 50px;
  height: 65px;
  margin: 0 auto;
  background: url('../images/document_icon.svg') no-repeat;
  background-size: contain;
}
.flow-explanation__list {
  @media (width < 1009px) {
    width: fit-content;
    margin: 0 auto;
  }
}
.flow-explanation__list li {
  color: var(--grayscale-black);
  font-family: var(--font-noto-sans-jp);
  font-size: var(--font-size-18);
  font-weight: 700;
  line-height: 180%;
  display: flex;
  align-items: center;

  @media (width < 1009px) {
    font-size: var(--font-size-12);
  }
}
.flow-explanation__list li:before {
  content: '';
  display: block;
  width: 2.1rem;
  height: 2.1rem;
  background: url('../images/checked_circle_blue.svg') no-repeat;
  background-size: cover;
  margin-right: .8rem;
}

.flow-explanation__list li:nth-of-type(2) {
  @media (width < 1009px) {
    margin: 1.2rem 0;
  }
}


/* ================================== 
/* CTA Button */
/* ================================== */

.cta-button {
  width: 440px;
  color: var(--Color-white);
  text-align: center;
  font-size: var(--font-size-24);
  font-family: var(--font-noto-sans-jp);
  font-weight: 700;
  box-shadow: 0 15.7px 36.3px rgba(0, 65, 110, 0.1);
  border-radius: 55.7px;
  background-color: var(--grayscale-black);
  overflow: hidden;
  padding: 13px 0 var(--padding-15);
  box-sizing: border-box;
  cursor: pointer;

  @media (width < 1009px) {
    width: fit-content;
    font-size: var(--font-size-18);
    padding: var(--padding-14) var(--padding-40);
 }
}
.cta-button .arrow {
  width: 10.9px;
  height: 21.1px;
  margin-left: 12px;
}
.cta-button a {
  display: flex;
  align-items: center;
  justify-content: center;
}
.introduction-section.schedule .cta-button {
  margin: 0 auto;
}


/* ================================== */
/* Common Setting */
/* ================================== */

.pc {
  @media (width < 1009px) {
    display: none;
  }
}
.sp {
  @media (width > 1009px) {
    display: none;
  }
}