@charset "UTF-8";

/*----------------------------------------------------------------------------------------------------

  reset

----------------------------------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  font-weight: normal;
  /* Yutaka added */
  vertical-align: baseline;
  box-sizing:border-box;
}

body {
  line-height: 1;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

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

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* Yutaka added */
table, tr, th, td, caption {
  vertical-align: middle;
  text-align: left;
}

img {
  vertical-align: top;
  font-size: 0;
  line-height: 0;
}

input[type="submit"],
input[type="button"] {
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
}

input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}

input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}

/*----------------------------------------------------------------------------------------------------

  custom properties

----------------------------------------------------------------------------------------------------*/
:root {
  --width-container: 1200px;
  --color-primary: #004397;
  --color-secondary: #00C3FB;
  --color-accent: linear-gradient(90deg, #29cdfc, #1280c3 50%, #004397);
  --color-white: #fff;
  --color-font: #074684;
  --color-blue-light: #E8F9FF;
  --color-gray-light: #F2F2F2;
  --color-gray-dark: #CBCBCB;
  --font-family-ja: "Zen Kaku Gothic New", sans-serif;
  --font-family-en: "Josefin Sans", sans-serif;
  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-md: 18px;
  --font-size-lg: 20px;
  --font-size-xl: 24px;
  --font-size-2xl: 32px;
  --font-size-3xl: 42px;
  --font-size-4xl: 56px;
  --font-size-5xl: 72px;
  --line-height-xs: 1.6;
  --line-height-sm: 1.6;
  --line-height-md: 1.7;
  --line-height-lg: 1.6;
  --line-height-xl: 1.4;
  --line-height-2xl: 1.3;
  --line-height-3xl: 1.25;
  --line-height-4xl: 1.15;
  --line-height-5xl: 1.1;
  --letter-spacing-xs: 0.02em;
  --letter-spacing-sm: 0.01em;
  --letter-spacing-md: 0em;
  --letter-spacing-lg: -0.01em;
  --letter-spacing-xl: -0.015em;
  --letter-spacing-2xl: -0.02em;
  --letter-spacing-3xl: -0.025em;
  --letter-spacing-4xl: -0.03em;
  --letter-spacing-5xl: -0.035em;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-xxl: 48px;
  --space-3l: 64px;
  --space-4l: 96px;
  --space-5l: 128px;
  --space-6l: 160px;
  --space-7l: 192px;
}
@media screen and (max-width: 768px) {
  :root {
    --font-size-xs: 10px;
    --font-size-sm: 12px;
    --font-size-md: 16px;
    --font-size-lg: 18px;
    --font-size-xl: 20px;
    --font-size-2xl: 26px;
    --font-size-3xl: 28px;
    --font-size-4xl: 30px;
    --font-size-5xl: 56px;
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 12px;
    --space-lg: 16px;
    --space-xl: 24px;
    --space-xxl: 32px;
    --space-3l: 48px;
    --space-4l: 64px;
    --space-5l: 96px;
    --space-6l: 128px;
    --space-7l: 160px;
  }
}


/*----------------------------------------------------------------------------------------------------

  body

----------------------------------------------------------------------------------------------------*/

html {
  -webkit-text-size-adjust: 100%;
}

body {
  font-size: var(--font-size-md);
  line-height: var(--line-height-md);
  font-family: var(--font-family-ja);
  color: var(--color-font);
  -webkit-font-smoothing: antialiased; /* Mac Safari/Chrome */
  -moz-osx-font-smoothing: grayscale;  /* Mac Firefox */
}

a {
  transition: all 0.3s ease;
  text-decoration: none;
  color: #00B7EC;
}
  a:hover {
    opacity: 0.7;
  }

.pc-only {
  display: block;
}

.sp-only {
  display: none;
}

@media screen and (max-width: 768px) {
  .pc-only {
    display: none;
  }
  .sp-only {
    display: block;
  }
}

.aligncenter {
  display: block;
  margin-inline: auto;
}

.aligncenter,
.alignright,
.alignleft,
.alignnone {
  &:not(:first-child) {
    margin-top: 1em;
  }
}

.container {
  width: 100%;
  max-width: var(--width-container);
  margin-inline: auto;
  padding-left: 20px;
  padding-right: 20px;
}

@media screen and (max-width: 768px) {
  .container {
    padding-left: 20px;
    padding-right: 20px;
  }
}

/*----------------------------------------------------------------------------------------------------

  header

----------------------------------------------------------------------------------------------------*/

.header {
  position: sticky;
  top: 0;
  z-index: 999;
  background: #fff;
  box-shadow: 0px 0px 60px 0px rgba(0, 49, 99, 0.1);
  transition: background-color 0.5s;
}

  .header__body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 84px;
    padding: 0 30px 0 40px;
  }
    .header__logo {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      width: 178px;
      position: relative;
      z-index: 999;
    }
      .header__logo .header__img {
        width: 100%;
      }

@media screen and (max-width: 768px) {
  .header {
    background: none;
    box-shadow: none;
  }
    .header__body {
      height: 100px;
      padding: 0 20px 0 25px;
    }
      .header__logo {
        width: 227px;
      }

  /* .header--scrolled {
    background: #fff;
    box-shadow: 0px 0px 60px 0px rgba(0, 49, 99, 0.1);
  } */
}

/* 下層ページは常に青文字 */
body:not(.home) .gnav-list__link {
  color: var(--color-primary);
}

.header__contact .btn {
  background: var(--color-primary);
  padding: 0.60em 1.4em 0.60em 1.4em;
  font-size: 16px;
}
  .header__contact .btn::before, .header__contact .btn::after{
    display: none;
  }

@media screen and (max-width: 1199px) {
  .header__contact {
    display: none;
  }
}

.header__nav {
  margin-left: auto;
  margin-right: 35px;
}

@media screen and (max-width: 1199px) {
  .header__nav {
    display: none;
  }
}

/*---------------------
  pc gnav
---------------------*/
.gnav-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 48px;
}
  .gnav-list__item {
    position: relative;
    display: block;
    padding-block: 1rem;
  }
  .gnav-list__link {
    display: block;
    color: inherit;
    font-weight: 600;
    font-size: 17px;
    position: relative;
  }
    .gnav-list__link::before {
      content: "";
      display: block;
      position: absolute;
      top: 50%;
      left: -20px;
      transform: translateY(-50%);
      width: 12px;
      height: 12px;
      border-radius: 50%;
      background: var(--color-accent);
    }
    .gnav-list__link--has-child {
      margin: 0 25px 0 0;
    }


  .gnav-list__child {
    display: none;           /* ← 初期描画を消す */
    visibility: hidden;
    width: fit-content;
    position: absolute;
    left: 50%;
    top: 100%;
    -webkit-box-shadow: 0px 3px 10px 2px rgba(0, 49, 99, 0.2);
    box-shadow: 0px 3px 10px 2px rgba(0, 49, 99, 0.2);
    z-index: 0;
    transition: all .5s;
    transform: translateX(-50%) scaleY(0);
    transform-origin: center top; /*transformの基準点を設定　上部中央*/
    opacity: 0;
  }
    .gnav-list__child::before {
      content: "";
      display: block;
      position: absolute;
      top: -9px;
      left: 50%;
      transform: translateX(-50%);
      width: 0;
      height: 0;
      border-style: solid;
      border-width: 0 10px 10px 10px;
      border-color: transparent transparent #fff transparent;
      filter: drop-shadow(0 0px 5px rgba(0, 49, 99, 0.2));
      z-index: -1;
    }
    .gnav-list__child li {
      background: #fff;
    }
      .gnav-list__child li:first-child {
        padding-top: 15px;
      }
      .gnav-list__child li:last-child {
        padding-bottom: 15px;
      }
      .gnav-list__child a {
        display: block;
        padding: 5px 20px;
        white-space: nowrap;
        color: inherit;
        font-weight: 500;
      }
    .gnav-list__item:hover .gnav-list__child {
      display: block;
      visibility: visible;
      opacity: 1;
      transform: translateX(-50%) scaleY(1);
    }

@media screen and (max-width: 1199px) {
  .gnav-list__link::before {
    display: none;
  }
}

@media screen and (max-width: 1199px) {
  /* PC用の矢印を強制OFF */
  .gnav-list__link--has-child::after {
    content: none !important;
    border: none !important;
    width: 0 !important;
    height: 0 !important;
  }
}

.gnav-list__item::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: 30px; /* ← 隙間を埋める */
}

/*---------------------
  sp gnav
---------------------*/
/*menu-btn*/
  .menu-btn {
    width: 60px;
    height: 60px;
    cursor: pointer;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
    display: flex;
    position: relative;
    z-index: 999;
    border-radius: 5px;
    box-shadow: 0px 0px 20px 0px rgba(0, 49, 99, 0.3);
    background: #fff;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
  }
    .menu-btn .menu-btn__inner {
      width: 28px;
    }
      .menu-btn .menu-btn__line {
        cursor: pointer;
        display: block;
        height: 2px;
        width: 100%;
        background: var(--color-primary);
        -webkit-transition: all .3s ease-in-out;
        -moz-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
      }
        .menu-btn .menu-btn__line--bottom {
          margin-top: 4px;
          width: 50%;
        }
          .menu-btn--open .menu-btn {
            box-shadow: none;
          }
            .menu-btn--open .menu-btn .menu-btn__line--top {
              -webkit-transform: translateY(3px) translateX(0) rotate(45deg);
              -ms-transform: translateY(3px) translateX(0) rotate(45deg);
              transform: translateY(3px) translateX(0) rotate(45deg);
            }

            .menu-btn--open .menu-btn .menu-btn__line--bottom {
              width: 100%;
              -webkit-transform: translateY(-3px) translateX(0) rotate(-45deg);
              -ms-transform: translateY(-3px) translateX(0) rotate(-45deg);
              transform: translateY(-3px) translateX(0) rotate(-45deg);
            }

/* 開いたとき（×状態）のメニュー背景と角丸 */
.header.menu-btn--open .menu-btn {
  background: #004397;
  border-radius: 5px;
}

/* 開いたとき（×状態）の線色を白に変更 */
.header.menu-btn--open .menu-btn .menu-btn__line {
  background-color: #fff;
}


@media screen and (min-width: 1200px) {
  .menu-btn {
    display: none;
  }
}

/*sp-gnav*/
/* 初期読み込み */
.sp-gnav {
  display: none;
  opacity: 0;
  visibility: hidden;
}
.sp-gnav.is-show {
  display: block;
  opacity: 1;
  visibility: visible;
}

.sp-gnav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: #fff;
  z-index: 1;
  opacity: 0;
  pointer-events: none;
  -webkit-transition-property: opacity;
  transition-property: opacity;
  -webkit-transition-duration: 0.6s;
  transition-duration: 0.6s;
  -webkit-transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
  box-sizing: border-box;
}
  .sp-gnav .sp-gnav__inner {
    margin-inline:auto;
    padding: 120px 0 0 0;
    width: 400px;
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
    -webkit-transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    overflow: hidden;
  }

  .sp-gnav.is-show {
    opacity: 1;
    pointer-events: auto;
  }
    .sp-gnav.is-show .sp-gnav__inner {
      -webkit-transform: scale(1);
      transform: scale(1);
    }
    .sp-gnav.is-show .sp-gnav__inner::-webkit-scrollbar {
      -webkit-appearance: none;
      width: 7px;
      margin-top: -10px;
    }
    .sp-gnav.is-show .sp-gnav__inner::-webkit-scrollbar-thumb {
      border-radius: 4px;
      background-color: rgba(255, 255, 255, 0.3);
      box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);
    }
    .sp-gnav.is-show .sp-gnav__inner::-webkit-scrollbar-button {
      display: none;
      height: 0px;
    }
    .sp-gnav.is-show .sp-gnav__inner::-webkit-scrollbar-corner,
    .sp-gnav.is-show .sp-gnav__inner::-webkit-resizer,
    .sp-gnav.is-show .sp-gnav__inner::-webkit-scrollbar-track-piece {
      height: 0;
      display: none;
    }
    .sp-gnav.is-show .sp-gnav__inner::-webkit-scrollbar:horizontal {
      height: 0px;
    }

  .sp-gnav .sp-gnav-list .gnav-list__item {
    padding: 28px 0 28px 0;
  }

    .sp-gnav .gnav-list__link {
      position: relative;
      display: inline-block;
      font-size: 20px;
      color: var(--color-primary);
    }
      /* .sp-gnav .gnav-list__link::before {
        top: 52%;
        left: -22px;
        width: 14px;
        height: 14px;
      } */
      .sp-gnav-list__child {
        margin: 10px 0 0 0;
        display: none;
        padding-left: 25px;
      }
        .sp-gnav-list__child li {
          padding: 0.2em 0;
        }
        .sp-gnav-list__child a {
          font-size: 16px;
          font-weight: 500;
          color: inherit;
        }

    .sp-gnav .header__contact {
      display: block;
    }
      .sp-gnav .header__contact .btn {
        width: 100%;
        padding: 0.60em 0;
        font-size: 16px;
        display: flex;
        justify-content :center;
      }


@media screen and (max-width: 1199px) {
  .gnav-list__item {
    border-bottom: 1px solid #C7C7C7;
  }
}

@media screen and (max-width: 768px) {

  .sp-gnav .sp-gnav__inner {
    padding: 100px 30px 0 30px;
    width: 100%;
  }

  .sp-gnav .sp-gnav-list .gnav-list__item {
    padding-bottom:25px;
  }

    .sp-gnav .gnav-list__link {
      font-size: 16px;
    }
      /* .sp-gnav .gnav-list__link::before {
        top: 56%;
        left: -18px;
        width: 10px;
        height: 10px;
      } */
      .sp-gnav-list__child {
        margin: 10px 0 0 0;
      }
        .sp-gnav-list__child li {
          padding: 0.2em 0;
        }
        .sp-gnav-list__child a {
          font-size: 15px;
        }
      .gnav-list__item.is-open .gnav-list__link--has-child::after {
        top: 40%;
        right: -21px;
      }

      .sp-gnav .header__contact .btn {
        padding: 0.60em 0;
        font-size: 15px;
      }
}

@media screen and (min-width: 1200px) {
  .sp-toggle {
    display: none;
  }
}

@media screen and (max-width: 1199px) {

  .gnav-list__item {
    position: relative;
  }

  .sp-toggle {
    position: absolute;
    right: 0;
    top: 40px;
    transform: translateY(-50%);

    width: 46px;
    height: 46px;

    border: 1px solid #C7C7C7;
    border-radius: 5px;

    display: flex;
    align-items: center;
    justify-content: center;

    cursor: pointer;
  }

  /* 横線（初期状態：ー） */
  .sp-toggle::after {
    content: "";
    width: 18px;
    height: 2px;
    background-color: currentColor;
  }
  .sp-toggle::before {
    content: "";
    width: 2px;
    height: 18px;
    background-color: currentColor;
    position: absolute;
  }

  /* 縦線（開いたとき → + になる） */
  .gnav-list__item.is-open .sp-toggle::before {
    content: "";
    width: 18px;
    height: 2px;
    background-color: currentColor;
    position: absolute;
  }
}

/*----------------------------------------------------------------------------------------------------

  main

----------------------------------------------------------------------------------------------------*/

/*---------------------
  hero
---------------------*/
.hero {
  padding: 178px 0 25px 0;
}
  .hero .container {
    padding: 0 40px;
    position: relative;
    height: 270px;
    max-width: 100%;
  }
    .hero__title {
      display: flex;
      align-items: center;
      margin: 0 auto;
      padding: 0 0 50px 0;
      position: relative;
      z-index: 888;
      width: 100%;
      max-width: 1200px;
      height: 100%;
      background-image: linear-gradient(90deg, #ffffff 31%, transparent 31%);
    }
      .hero__title-en {
        margin: 0 0 28px 0;
        display: flex;
        gap: 0.4em;
      }
        .hero__title-en img {
          margin: -6px 0 0 0;
          width: 30px;
        }
        .hero__title-en em {
          display: inline-block;
          font-size: 24px;
          font-weight: 500;
          font-family: var(--font-family-en);
          background: linear-gradient(90deg, #29c5f1, #004397);
          -webkit-background-clip: text;
          -webkit-text-fill-color: transparent;
          line-height: 1.0em;
        }
      .hero__title-ja {
        display: block;
        font-size:var(--font-size-4xl);
        font-weight: 600;
        line-height: 1.0em;
      }
    .hero .hero__img{
      position: absolute;
      top: 0;
      right: 0;
      width: 66%;
    }
      .hero .hero__img img{
        height: 270px;
        width: 100%;
        object-fit: cover;
      }

@media screen and (max-width: 768px) {
  .hero {
    padding: 110px 0 12px 0;
  }
    .hero .container {
      padding: 0 20px;
      height: 147px;
      max-width: 100%;
    }
      .hero__title {
        margin: 0 auto;
        padding: 0 0 20px 0;
        max-width: inherit;
        background-image: none;
      }
        .hero__title-en {
          margin: 0 0 16px 0;
          gap: 0.4em;
        }
          .hero__title-en img {
            margin: -4px 0 0 0;
            width: 20px;
          }
          .hero__title-en em {
            font-size: 16px;
          }
        .hero__title-ja {
          font-size: 28px;
        }
      .hero .hero__img{
        width: 76%;
      }
        .hero .hero__img img{
          height: 147px;
        }
}

/*---------------------
  パンくず
---------------------*/
.breadcrumb {
  padding: 0 40px;
}
  .breadcrumb__list {
    margin: 0 auto;
    max-width: 1200px;
    display: flex;
    justify-content: flex-end;
  }
    .breadcrumb__item {
      color: var(--color-primary);
      font-size: var(--font-size-xs);
      font-weight: 500;
    }
      .breadcrumb__item:not(:first-child):before {
        content: "";
        transform: rotate(-60deg);
        position: relative;
        display: inline-block;
        width: 1.1em;
        height: 1px;
        background: var(--color-secondary);
        margin: 0 0.5em 0.3em;
      }
      .breadcrumb__link {
        color: var(--color-primary);
        text-decoration: underline;
        font-weight: 500;
      }

@media screen and (max-width: 768px) {
  .breadcrumb {
    padding: 0 20px;
  }
}

/* 現在のページ（最後の項目）だけ下線削除 */
.breadcrumb__item:last-child .breadcrumb__link {
  text-decoration: none;
  pointer-events: none;
}

/*---------------------
  contact
---------------------*/
.contact-footer-bg {
  background-image: url('../images/contact-footer-bg.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}


.contact {
  background: transparent;
  background-size: cover;
}
  .contact .container {
    padding: 90px 40px 50px 40px;
    max-width: 100%;
    background-image: linear-gradient(0deg, transparent 80%, #ffffff);
  }
    .contact__title {
      text-align: center;
      padding: 0 0 35px 0;
    }
      .contact__title-en {
        display: block;
        margin: 0 0 0.06em 0;
        font-weight: 700;
        font-family: var(--font-family-en);
        font-size: 56px;
        line-height: 1.0em;
      }
      .contact__title-ja {
        display: block;
        font-weight: 500;
        font-size: 18px;
      }
    .contact__lead {
      text-align: center;
      padding: 0 0 50px 0;
      line-height: var(--line-height-md);
    }

  .contact__list {
    display: flex;
    justify-content: center;
    gap: 36px;
    max-width: 960px;
    margin: auto;
  }
    .contact__item {
      width: 100%;
      margin-inline: 0;
    }
      .contact__btn {
        width: 100%;
        height: 98px;
        display:flex;
        align-items: center;
        justify-content: center;
        color: var(--color-primary);
        background: var(--color-white);
        border: 1.5px solid var(--color-primary);
        border-radius: 49px;
        font-size: 24px;
      }

      .contact__btn--form {
        font-size: 16px;
      }

        .contact__btn--inner {
          display: inline-block;
          align-items: center;
          font-weight: 600;
          position: relative;
          padding-right: 30px;
        }

        .contact__btn--inner--form {
          padding-right: 42px;
          font-size: 22px;
        }

          .contact__btn--inner::before {
            content: '';
            width: 15px;
            height: 3px;
            position: absolute;
            margin-top: -5px;
            top: 50%;
            transform: rotate(45deg);
            right: -33px;
            background: var(--color-primary);
            border-radius: 1.5px;
          }
          .contact__btn--inner::after {
            content: '';
            width: 15px;
            height: 3px;
            position: absolute;
            margin-top: 4px;
            top: 50%;
            transform: rotate(-45deg);
            right: -33px;
            background: var(--color-primary);
            border-radius: 1.5px;
          }
          .contact__btn--inner em {
            display: block;
            width: 30px;
            height: 3px;
            position: absolute;
            margin-top: -0.5px;
            top: 50%;
            right: -28px;
            background: var(--color-primary);
            border-radius: 1.5px;
          }

        .contact__btn-tel {
          color: var(--color-white);
          background: var(--color-primary);
          font-size: 17px;
          text-align: center;
          line-height: 1.7em;
          border: 1.5px solid var(--color-white);
        }
          .contact__btn-tel .contact__btn--inner::before {
            background: var(--color-white);
            right: -50px;
          }
          .contact__btn-tel .contact__btn--inner::after {
            background: var(--color-white);
            right: -50px;
          }
          .contact__btn-tel .contact__btn--inner em {
            background: var(--color-white);
            right: -48px;
          }
          .contact-tel {
            display: block;
            font-weight: 600;
            font-size: 24px;
          }

@media screen and (max-width: 768px) {
  .contact .container {
    padding: 50px 20px 40px 20px;
    background-image: linear-gradient(0deg, transparent 80%, #ffffff);
  }
    .contact__title {
      padding: 0 0 25px 0;
    }
      .contact__title-en {
        margin: 0 0 0.05em 0;
        font-size: 42px;
      }
      .contact__title-ja {
        font-size: 16px;
      }
    .contact__lead {
      padding: 0 0 30px 0;
      font-size: 14px;
    }

  .contact__list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width:inherit;
  }

  .contact__item {
      width: 323px;
      margin-inline: auto;
    }

    .contact__btn {
      height: 66px;
      border-radius: 33px;
      font-size: 16px;
    }

    .contact__btn--form {
        font-size: 24px;
      }

      .contact__btn--inner--form {
          font-size: 16px;
        }

      .contact__btn--inner {
        padding-right: 20px;
      }
        .contact__btn--inner::before {
          width: 8px;
          height: 1.5px;
          margin-top: -3px;
          right: -29px;
        }
        .contact__btn--inner::after {
          width: 8px;
          height: 1.5px;
          margin-top: 2px;
          right: -29px;
        }
        .contact__btn--inner em {
          width: 16px;
          height: 1.5px;
          margin-top: -0.5px;
          right: -25px;
        }

      .contact__btn-tel {
        font-size: 12px;
        line-height: 1.7em;
      }
        .contact__btn-tel .contact__btn--inner::before {
          right: -50px;
        }
        .contact__btn-tel .contact__btn--inner::after {
          right: -50px;
        }
        .contact__btn-tel .contact__btn--inner em {
          right: -48px;
        }
        .contact-tel {
          font-size: 16px;
        }

}


/*----------------------------------------------------------------------------------------------------

  footer

----------------------------------------------------------------------------------------------------*/
.footer {
  padding: 100px 40px;
  background: transparent;
  color: var(--color-primary);
  font-size: 14px;
}
  .footer a {
    color: var(--color-primary);
  }

  .footer .footer__main {
    padding: 0 0 50px 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }

    .footer__signature {
      padding: 0 0 50px 0
    }
      .footer__logo {
        margin: 0 0 15px 0;
        display: block;
        width: 194px;
      }
        .footer__logo img {
          width: 100%
        }
      .org {
        line-height: 1.6em;
      }
        .org__addr {
          padding: 0 0 25px 0;
        }

    .footer__menu {
      display: flex;
      flex-wrap: wrap;
      gap: 35px;
    }
      .fnav-list {
        white-space: nowrap;
      }
        .fnav-list:nth-of-type(1) {
          margin: 0 40px 0 0;
        }
        .fnav-list:nth-of-type(2) {
          margin: 0 60px 0 0;
        }
        .fnav-list__item {
        }
          .fnav-list__link {
            display: inline-block;
            font-size: 16px;
            font-weight: 600;
            margin: 0 0 20px 0;
          }

        .fchild-list {
        }
          .fchild-list__item {
            font-size: 14px;
            font-weight: 500;
            margin: 0 0 12px 0;
          }

.fchild-list__item:first-child {
  margin: 24px 0 12px 0;
}

  .footer__other {
    display: flex;
    justify-content: space-between;
  }
    .footer-list {
      display: flex;
      justify-content: center;
      gap: 30px;
    }
      .footer-list__link {
        display: block;
        text-decoration: underline;
        font-size: 13px;
        white-space: nowrap;
        font-weight: 500;
      }
    .footer__copyright {
      font-size: 12px;
      font-weight: 500;
      font-family: var(--font-family-en)
    }
      .footer__copyright em{
        font-weight: 500;
      }

@media screen and (max-width: 768px) {
  .footer {
    padding: 55px 20px;
  }
    .footer .footer__main {
      padding: 0 0 40px 0;
      justify-content: center;
    }

      .footer__signature {
        margin: auto;
        padding: 0;
        width: fit-content;
      }
        .footer__logo {
          margin: 0 0 15px 0;
          width: 209px;
        }
        .org {
          line-height: 1.6em;
          width: fit-content;
          margin: auto;
        }
          .org__addr {
            padding: 0 0 25px 0;
          }

      .footer__menu {
        display: none;
      }

    .footer__other {
      display: block;
    }
      .footer-list {
        display: flex;
        justify-content: center;
        gap: 30px;
      }
        .footer-list__link {
          margin: 0 0 30px 0;
          font-size: 13px;
        }
        .footer__copyright {
          font-size: 11px;
          text-align: center;
        }
          .footer__copyright em{
            display: none;
          }
}

/* ブログ用別窓アイコン（PCフッター、SPメニューに設置） */
.icon-new-window {
  width: 11px;
  height: 11px;
  margin: 0 0 3px 5px;
  vertical-align: middle;
  display: inline-block;
}

/*----------------------------------------------------------------------------------------------------

  component

----------------------------------------------------------------------------------------------------*/

  .h1-section__title {
    font-size: var(--font-size-3xl);
    line-height: var(--line-height-3xl);
    color: var(--color-primary);
    font-weight: 600;
    margin-block: var(--space-3l) var(--space-xl);
  }

  .h2-section__title {
    font-size: var(--font-size-2xl);
    line-height: var(--line-height-2xl);
    color: var(--color-primary);
    font-weight: 600;
    margin-block: var(--space-xxl) var(--space-lg);
  }

/*------------------------------
  component__anchor-link
------------------------------*/
/* .component__anchor-link {
  padding: 10px 0 0 0;
}
  .anchor-link--wrap{
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
  }
    .anchor-link {
      display: inline-block flex;
      align-items: center;
      gap: 0.8em;
      color: var(--color-primary);
      background: var(--color-blue-light);
      padding: 0.64em 3.4em 0.64em 1.8em;
      font-weight: 600;
      font-size: var(--font-size-md);
      position: relative;
      border: 1.5px solid var(--color-primary);
      border-radius: 5px;
    }
      .anchor-link::before {
        content: '';
        width: 1.5px;
        height: 0.56em;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 1.78em;
        background: var(--color-primary);
      }
      .anchor-link::after {
        content: '';
        width: 0.34em;
        height: 0.34em;
        border: 1.5px solid var(--color-primary);
        border-left: 0;
        border-top: 0;
        transform: rotate(45deg);
        position: absolute;
        margin-top: -0.1em;
        top: 50%;
        right: 1.60em;
      }


@media screen and (max-width: 768px) {
  .component__anchor-link {
    padding: 40px 0 0 0;
  }
    .component__anchor-link .container{
    }
      .anchor-link {
        gap: 0.7em;
        padding: 0.64em 2.8em 0.64em 1.2em;
        font-size: 15px;
        line-height: 1.4em;
      }
        .anchor-link::before {
          height: 0.72em;
          right: 1.57em;
        }
        .anchor-link::after {
          width: 0.34em;
          height: 0.34em;
          margin-top: -0.1em;
          right: 1.4em;
        }

} */

/*------------------------------
  goto (ページ内リンク自動生成)
------------------------------*/
.goto {
  padding: 10px 0 0 0;
}
  .goto__wrap {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
  }
    .goto__link {
      display: inline-flex;
      align-items: center;
      gap: 0.8em;
      color: var(--color-primary);
      background: var(--color-blue-light);
      padding: 0.64em 3.4em 0.64em 1.8em;
      font-weight: 600;
      font-size: var(--font-size-md);
      position: relative;
      border: 1.5px solid var(--color-primary);
      border-radius: 5px;
      text-decoration: none;
    }
      .goto__link::before {
        content: '';
        width: 1.5px;
        height: 0.56em;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 1.78em;
        background: var(--color-primary);
      }
      .goto__link::after {
        content: '';
        width: 0.34em;
        height: 0.34em;
        border: 1.5px solid var(--color-primary);
        border-left: 0;
        border-top: 0;
        transform: rotate(45deg);
        position: absolute;
        margin-top: -0.1em;
        top: 50%;
        right: 1.60em;
      }


@media screen and (max-width: 768px) {
  .goto {
    padding: 40px 0 0 0;
  }
    .goto__link {
      gap: 0.7em;
      padding: 0.64em 2.8em 0.64em 1.2em;
      font-size: 15px;
      line-height: 1.4em;
    }
      .goto__link::before {
        height: 0.72em;
        right: 1.57em;
      }
      .goto__link::after {
        width: 0.34em;
        height: 0.34em;
        margin-top: -0.1em;
        right: 1.4em;
      }
}

/* ページ内リンクのスクロール位置調整 */
.h1[id], .h2[id], .h3[id], .h4[id], .h5[id] {
  scroll-margin-top: 100px; /* 上に100px余白を作る */
}

/*---------------------
  component__heading
---------------------*/
.component__heading{
  padding: 0 40px 80px 40px;
}

.h1 {
  font-size: var(--font-size-3xl);
  font-weight: 600;
  line-height: var(--line-height-xl);
  margin-block: var(--space-3l) var(--space-xl);
}

  .h1-decorated {
    margin-block: 96px 64px;
    text-align: center;
  }

    .h1-decorated .h1-decorated-ja {
      display: block;
      font-size: 48px;
      font-weight: 600;
      margin-bottom: 40px;
    }
    .h1-decorated .h1-decorated-en {
      display: flex;
      justify-content: center;
      gap: 6px;
    }

      .h1-decorated .h1-decorated-en img{
        width: 28px;
        height: auto;
        object-fit: contain;
      }
      .h1-decorated .h1-decorated-en em{
        font-weight: 600;
        font-family: var(--font-family-en);
        font-size: var(--font-size-lg);
        background: linear-gradient(90deg, #29c5f1, #004397);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
      }


.h2 {
  font-size: var(--font-size-2xl);
  color: var(--color-primary);
  font-weight: 600;
  line-height: var(--line-height-2xl);
  margin-block: var(--space-xxl) var(--space-lg);
}
  .h2-light-blue {
    color: var(--color-secondary);
  }
  .h2-underline {
    position: relative;
    display: block;
    margin-bottom: 50px;
  }
    .h2-underline::after {
      content: '';
      position: absolute;
      left: 0;
      bottom: -22px;
      width: 100%;
      height: 4px;
      background: linear-gradient(90deg, #29cdfc, #004397 13%, #d7dde4 13%);
    }
  .h2-marker{
    color: var(--color-white);
    display:inline;
    background:var(--color-primary);
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    padding: 0.1em 0.4em 0.15em;
    font-weight: 600;
    line-height: 1.85em;
  }
    .h2-underline--thin {
      font-size: var(--font-size-2xl);
      color: var(--color-primary);
      font-weight: 600;
      line-height: var(--line-height-2xl);
      margin-block: var(--space-xl) var(--space-lg);
      padding-bottom: 18px;
      border-bottom: solid #99D2E2 1px;
    }

.h3 {
  font-size: 28px;
  font-weight: 600;
  color: var(--color-primary);
  line-height: var(--line-height-xl);
  margin-block: var(--space-xl) var(--space-lg);
  padding-bottom: 18px;
  border-bottom: solid #99D2E2 1px;
}

.h4 {
  background: var(--color-blue-light);
  font-size: var(--font-size-xl);
  font-weight: 600;
  line-height: var(--line-height-xl);
  margin-block: var(--space-xl) var(--space-lg);
  padding: 0.40em 0.6em 0.45em;
}

.h5 {
  font-size: var(--font-size-lg);
  font-weight: 600;
  line-height: var(--line-height-xl);
  margin-block: var(--space-lg) var(--space-md);
  padding: 0 0 0 1.5em;
  position: relative;
}
  .h5::before {
    content: "";
    display: block;
    position: absolute;
    top: 0.26em;
    left: 0;
    width: 1.0em;
    height: 1.0em;
    border-radius: 50%;
    background: var(--color-accent);
  }



@media screen and (max-width: 768px) {
  .component__heading{
    padding: 0 20px 40px 20px;
  }

  .h1-decorated {
    margin-block: 64px 32px;
  }
    .h1-decorated .h1-decorated-ja {
      margin-bottom: 26px;
      font-size: 34px;
    }
    .h1-decorated .h1-decorated-en img{
      width: 24px;
    }

    .h2-underline {
      margin-bottom: 38px;
    }
      .h2-underline::after {
        bottom: -18px;
      }

  .h3 {
    font-size: 24px;
    padding-bottom: 14px;
  }

}

/*---------------------
  component__list
---------------------*/
.component__list{
  padding: 0 40px 80px 40px;
}
  .component__list .container{
    display: grid;
    gap:60px;
  }
    .ul {
      padding: 0 0 0 1.30em;
    }
      .ul li {
        padding: 0 0 1.20em 0;
        position: relative;
      }
        .ul li::before {
          content: "";
          display: block;
          position: absolute;
          top: 0.72em;
          left: -1.00em;
          width: 0.34em;
          height: 0.34em;
          border-radius: 50%;
          background: #D7DDE4;
        }
        .ul li:last-child{
          padding: 0 0 0 0;
        }

    .ol {
      counter-reset: num;
      padding: 0 0 0 2.52em;
    }
      .ol li {
        counter-increment: num;
        position: relative;
        padding: 0 0 1.20em 0;
      }
        .ol li::before {
          content: counter(num, decimal-leading-zero) "";
          position: absolute;
          top: -0.16em;
          left: -1.6em;
          font-family: var(--font-family-en);
          font-weight: 500;
          font-size: 24px;
          background: linear-gradient(90deg, #29c5f1, #004397);
          -webkit-background-clip: text;
          -webkit-text-fill-color: transparent;
        }
        .ol li:last-child{
          padding: 0 0 0 0;
        }

@media screen and (max-width: 768px) {
  .component__list{
    padding: 0 20px 40px 20px;
  }
    .ol li::before {
      top: -0.14em;
      left: -1.6em;
      font-size: 20px;
    }
}

/*------------------------------
  component__numbered-title
------------------------------*/
.component__numbered-title {
  padding: 0 40px 80px 40px;
}
  .numbered-title {
    display: flex;
    gap: 14px;
    font-weight: 600;
    font-size: 24px;
    margin-block: var(--space-xl) var(--space-lg);
    line-height: var(--line-height-xl);
  }
    .numbered-title .num{
      font-family: var(--font-family-en);
      margin-top: 0.12em;
      font-weight: 600;
      font-size: 33px;
      background: linear-gradient(90deg, #29c5f1, #004397);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      line-height: 1.0em;
    }

@media screen and (max-width: 768px) {
  .component__numbered-title {
    padding: 0 20px 40px 20px;
  }
    .numbered-title {
      gap: 10px;
      font-size: 20px;
    }
      .numbered-title .num{
        margin-top: 0.18em;
        font-size: 24px;
      }
}

/*------------------------------
  component__note
------------------------------*/
.component__note {
  padding: 0 40px 80px 40px;
}
  .component__note .container{
    display: grid;
    gap: 12px;
  }
  .note{
    font-size: 14px;
    font-weight: 500;
    color: #919EAE;
  }
  .note-important{
    font-size: 14px;
    font-weight: 600;
    color: #E3005F;
  }
  .strong{
    font-weight: 600;
    font-size: var(--font-size-md);
    background: linear-gradient(to bottom, transparent 70%, #89E5FF 70%);
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
  }
  .text-link{
    color: #00B7EC;
    font-weight: 500;
    text-decoration: underline;
    font-size: var(--font-size-md);
  }

@media screen and (max-width: 768px) {
  .component__note {
    padding: 0 20px 40px 20px;
  }
}


/*------------------------------
  component__box
------------------------------*/
.component__box{
  padding: 0 40px 80px 40px;
}
  .component__box .container{
    display: grid;
    gap: 40px;
  }

    .box {
      background: var(--color-blue-light);
      padding: 48px;
      display: grid;
      /* gap: 15px; */
    }
      .box__title {
        font-size: var(--font-size-xl);
        font-weight: 600;
      }
      .box--bordered {
        background: none;
        border: 1px solid #D7DDE4;
      }


@media screen and (max-width: 768px) {
  .component__box{
    padding: 40px 20px 24px 20px;
  }
    .component__box .container{
      gap: 30px;
    }
      .box {
        padding: 24px;
        /* gap: 6px; */
      }
}

/*------------------------------
  component__table
------------------------------*/
.component__table{
  padding: 0 40px 80px 40px;
}
.component__table .container{
  display: grid;
  gap: 40px;
}

.table {
  border: 1px solid #D7DDE4;
  border-bottom: none;
  width: 100%;
  table-layout: fixed; /* ← 追加（横はみ出し防止） */
  border-collapse: collapse;
  border-spacing: 0;
}

.table tr{
  border-bottom: 1px solid #D7DDE4;
}

.table th,
.table td{
  padding: var(--space-md);
  word-break: break-word;      /* ← 追加 */
  overflow-wrap: anywhere;     /* ← 追加 */
}

.table th {
  font-size: var(--font-size-md);
  font-weight: 600;
  border-right: 1px solid #D7DDE4;
  background: #F4F8F9;
}

/* ---------- type01 ---------- */
.table-type01{
  border:none;
  border-top: 1px solid #D7DDE4;
}

.table-type01 th {
  width: 22%;
  background:none;
  border-right: none;
  padding: var(--space-lg);
  padding-left: 0;
}

.table-type01 td {
  width: 78%;
  padding: var(--space-lg);
  padding-left: 0;
}

/* ---------- SP ---------- */
@media screen and (max-width: 768px) {

  .component__table{
    padding: 0 20px 20px 20px;
  }

  .component__table .container{
    gap: 30px;
  }

  /* type01 */
  .table-type01,
  .table-type01 tr{
    display: block;
  }

  .table-type01 th,
  .table-type01 td{
    display: block;
    width: 100%;
    box-sizing: border-box; /* ← 追加 */
  }

  .table-type01 th {
    border-bottom: 1px solid #D7DDE4;
  }

  .table-type01 td {
    padding-right: 0;
  }

  /* type03 */
  .table-type03,
  .table-type03 tr{
    display: block;
  }

  .table-type03 th,
  .table-type03 td{
    display: block;            /* ← inline-block をやめる */
    width: 100%;
    box-sizing: border-box;    /* ← 追加 */
  }

  .table-type03 th {
    border-right: none;
    border-bottom: 1px solid #D7DDE4;
  }

  /* URL対策（決定打） */
  .table-type03 td a{
    display: block;
    word-break: break-all;
    overflow-wrap: anywhere;
  }

  .table-type03 {
    display: block;
    width: 100%;
  }
  .table-type03 tbody {
    display: block;
    width: 100%;
  }

  .table th,
  .table td {
    width: auto;
    box-sizing: border-box;
  }
}

/* ---------- type03-recruit（採用情報用・2列目を広く） ---------- */
.table-type03-recruit th {
  width: 22%;
}

.table-type03-recruit td {
  width: 78%;
}

/* ---------- SP ---------- */
@media screen and (max-width: 768px) {
  .table-type03-recruit,
  .table-type03-recruit tr{
    display: block;
  }

  .table-type03-recruit th,
  .table-type03-recruit td{
    display: block;
    width: 100%;
    box-sizing: border-box;
  }

  .table-type03-recruit th {
    border-right: none;
    border-bottom: 1px solid #D7DDE4;
  }
}

/*------------------------------
  component__btn
------------------------------*/
.component__btn {
  padding: 0 40px 80px 40px;
}
  .component__btn .container {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
  }
    .btn {
      display: inline-flex;
      align-items: center;
      gap: 0.8em;
      text-decoration: none;
      color: var(--color-white);
      background: var(--color-accent);
      padding: 0.64em 2.2em;
      /* padding: 0.60em 3.8em 0.64em 1.6em; */
      transition: 0.2s ease-out;
      font-weight: 600;
      font-size: var(--font-size-md);
      position: relative;
      border-radius: 5px;
    }
      /* .btn::before {
        content: '';
        width: 0.80em;
        height: 1.5px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 1.64em;
        background: var(--color-white);
      } */
      /* .btn::after {
        content: '';
        width: 0.34em;
        height: 0.34em;
        border: 1.5px solid var(--color-white);
        border-left: 0;
        border-bottom: 0;
        transform: rotate(45deg);
        transform-origin: top right;
        position: absolute;
        top: 50%;
        right: 1.6em;
      } */

        .btn img {
          height: 24px;
        }
        .btn--file img {
          height: 24px;
        }
        .btn--fexternal {
          padding: 0.64em 2.2em;
        }
          .btn--fexternal img{
            height: 24px;
          }
          .btn--fexternal::before,.btn--fexternal::after{
            display: none;
          }

@media screen and (max-width: 768px) {
  .component__btn{
    padding: 0 0 40px 0;
  }
    .component__btn .container{
      gap: 10px;
    }
      .btn {
        gap: 0.7em;
        padding: 10px 12px 10px 18px;
        font-size: 15px;
        line-height: 1.4em;
      }
        .btn::before {
          width: 0.80em;
          height: 1px;
          right: 1.44em;
        }
        .btn::after {
          width: 0.34em;
          height: 0.34em;
          right: 1.4em;
        }
        .btn img {
            height: 24px;
          }
          .btn--file img {
            height: 24px;
          }
            .btn--fexternal {
              padding: 0.78em 1.4em;
            }
            .btn--fexternal img{
              height: 30px;
            }
}

/*------------------------------
  一覧へ戻る
------------------------------*/

.single-pager-list {
  margin: 114px auto 0;
  max-width: 287px;
  display: block;
  align-items: center;
  gap: 0.8em;
  text-decoration: none;
  color: var(--color-white);
  background: var(--color-accent);
  padding: 0.64em 2.2em;
  /* padding: 0.60em 3.8em 0.64em 1.6em; */
  transition: 0.2s ease-out;
  font-weight: 600;
  font-size: var(--font-size-md);
  position: relative;
  border-radius: 5px;
}

.single-pager-list a {
  text-decoration: none;
  color: var(--color-white);
  font-weight: 600;
  font-size: var(--font-size-md);
}

@media screen and (max-width: 768px) {
.single-pager-list {
  margin: 84px auto 0;
  max-width: 222px;
  gap: 0.7em;
  padding: 0.78em 2.8em 0.78em 1.4em;
  font-size: 15px;
  line-height: 1.4em;
}

  .single-pager-list a {
    font-size: 15px;
    line-height: 1.4em;
  }

  .single-pager-list::before {
    width: 0.80em;
    height: 1px;
    right: 1.44em;
  }
  .single-pager-list::after {
    width: 0.34em;
    height: 0.34em;
    right: 1.4em;
  }
  .single-pager-list img {
      height: 24px;
    }
}

/*------------------------------
  component__gallery
------------------------------*/
.component__gallery {
  padding: 20px 0 20px 0;
}
  .gallery--wrap {
    display: grid;
    gap: 40px;
  }
    .gallery__list {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 24px;
    }
      .gallery__img {
        width: 100%;
        height: auto;
        display: block;
        border-radius: 15px;
        object-fit: cover;
      }
      .gallery__caption {
        margin-top: 8px;
        font-size: var(--font-size-sm);
        font-weight: 500;
        line-height: var(--line-height-lg);
      }

    .gallery__list--col3{
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
    }

.gallery__figure {
  width: 100%;
}

.gallery__map {
  position: relative;
  width: 100%;
  aspect-ratio: 576 / 404;
  border-radius: 15px;
  overflow: hidden;
}

.gallery__map iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}


@media screen and (max-width: 768px) {
  .component__gallery {
    padding: 40px 0 20px 0;
  }
    .gallery--wrap {
      display: grid;
      gap: 20px;
    }
      .gallery__list {
        grid-template-columns: 1fr;
        gap: 10px;
      }
        .gallery__img {
          border-radius: 5px;
        }
        .gallery__caption {
          margin-top: 4px;
          font-weight: 500;
        }
      .gallery__list--col3{
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
      }
}

/*------------------------------
  component__other-page
------------------------------*/
.component__other-page {
  padding: 0 40px 96px 40px;
}

  .other-page__list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px 48px;
  }
    .other-page__btn {
      width: 100%;
      height: 90px;
      display:flex;
      align-items: center;
      justify-content: center;
      color: var(--color-white);
      background: var(--color-accent);
      border-radius: 5px;
    }
      .other-page__btn--inner {
        display: inline-flex;
        align-items: center;
        font-weight: 600;
        font-size: var(--font-size-lg);
        position: relative;
        padding-right: 1.8em;
      }
        .other-page__btn--inner::before {
          content: '';
          width: 0.72em;
          height: 1.5px;
          position: absolute;
          top: 50%;
          transform: translateY(-50%);
          right: 0em;
          background: var(--color-white);
        }
        .other-page__btn--inner::after {
          content: '';
          width: 0.26em;
          height: 0.26em;
          border: 1.5px solid var(--color-white);
          border-left: 0;
          border-bottom: 0;
          transform: rotate(45deg);
          transform-origin: top right;
          position: absolute;
          top: 50%;
          right: -0.1em;
        }

@media screen and (max-width: 768px) {
  .component__other-page {
    padding: 0 20px 40px 20px;
  }
    .other-page__list {
      grid-template-columns: repeat(1, 1fr);
      gap: 15px 0;
    }
      .other-page__btn {
        height: 74px;
      }
        .other-page__btn--inner {
          padding-right: 1.8em;
        }
          .other-page__btn--inner::before {
            width: 0.72em;
            height: 1.5px;
            right: 0em;
          }
          .other-page__btn--inner::after {
            width: 0.34em;
            height: 0.34em;
            right: -0.1em;
          }

}

/*------------------------------
  page-article
------------------------------*/

.page-article {
  padding-top: 100px;
  padding-bottom: 120px;
}

@media screen and (max-width: 768px) {
  .page-article {
    padding-top: 60px;
    padding-bottom: 80px;
  }
}

.post-type-page {
  p {
    margin-block: 1em;
  }
  /* interview__qa-labelクラスには適用しない */
    p.interview__qa-label {
        margin-block: 0;
    }
}


/*------------------------------
  レイアウト設定
------------------------------*/
.row {
  display: flex;
  flex-wrap: wrap;
}

/* =========================
  item
========================= */
.row__item {
  width: 100%;
}

.row__item--bg-lightblue {
  background-color: var(--color-lightblue);
}

/* =========================
  mobile（常時）
========================= */
.row__item--mobile-1  { width: calc(100% * 1 / 12); }
.row__item--mobile-2  { width: calc(100% * 2 / 12); }
.row__item--mobile-3  { width: calc(100% * 3 / 12); }
.row__item--mobile-4  { width: calc(100% * 4 / 12); }
.row__item--mobile-5  { width: calc(100% * 5 / 12); }
.row__item--mobile-6  { width: calc(100% * 6 / 12); }
.row__item--mobile-7  { width: calc(100% * 7 / 12); }
.row__item--mobile-8  { width: calc(100% * 8 / 12); }
.row__item--mobile-9  { width: calc(100% * 9 / 12); }
.row__item--mobile-10 { width: calc(100% * 10 / 12); }
.row__item--mobile-11 { width: calc(100% * 11 / 12); }
.row__item--mobile-12 { width: 100%; }

/* =========================
  tablet
========================= */
@media (min-width: 768px) {
  .row__item--tablet-1  { width: calc(100% * 1 / 12); }
  .row__item--tablet-2  { width: calc(100% * 2 / 12); }
  .row__item--tablet-3  { width: calc(100% * 3 / 12); }
  .row__item--tablet-4  { width: calc(100% * 4 / 12); }
  .row__item--tablet-5  { width: calc(100% * 5 / 12); }
  .row__item--tablet-6  { width: calc(100% * 6 / 12); }
  .row__item--tablet-7  { width: calc(100% * 7 / 12); }
  .row__item--tablet-8  { width: calc(100% * 8 / 12); }
  .row__item--tablet-9  { width: calc(100% * 9 / 12); }
  .row__item--tablet-10 { width: calc(100% * 10 / 12); }
  .row__item--tablet-11 { width: calc(100% * 11 / 12); }
  .row__item--tablet-12 { width: 100%; }
}

/* =========================
  desktop
========================= */
@media (min-width: 1024px) {
  .row__item--desktop-1  { width: calc(100% * 1 / 12); }
  .row__item--desktop-2  { width: calc(100% * 2 / 12); }
  .row__item--desktop-3  { width: calc(100% * 3 / 12); }
  .row__item--desktop-4  { width: calc(100% * 4 / 12); }
  .row__item--desktop-5  { width: calc(100% * 5 / 12); }
  .row__item--desktop-6  { width: calc(100% * 6 / 12); }
  .row__item--desktop-7  { width: calc(100% * 7 / 12); }
  .row__item--desktop-8  { width: calc(100% * 8 / 12); }
  .row__item--desktop-9  { width: calc(100% * 9 / 12); }
  .row__item--desktop-10 { width: calc(100% * 10 / 12); }
  .row__item--desktop-11 { width: calc(100% * 11 / 12); }
  .row__item--desktop-12 { width: 100%; }
}

/* =========================
  spacing modifiers
========================= */
.row--min {
  margin: -10px;
}
.row--min .row__item {
  padding: 10px;
}

.row--std {
  margin: -24px;
}
.row--std .row__item {
  padding: 24px;
}

.row--wide {
  margin: -24px;
}
@media (min-width: 768px) {
  .row--wide {
    margin: -40px;
  }
}
.row--wide .row__item {
  padding: 24px;
}
@media (min-width: 768px) {
  .row--wide .row__item {
    padding: 40px;
  }
}


/* =========================
  utility
========================= */
.row--mt {
  margin-top: 4rem !important;
}

.row--center {
  justify-content: center;
}

.row--align-center {
  align-items: center;
}

/* =========================
  文字強調
========================= */
strong {
  font-weight: 700;
}

/* =========================
  画像中央配置
========================= */
.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

img.aligncenter {
    display: block;
    margin: 0 auto;
}

/* =========================
  動画用
========================= */
.video-wrap {
  position: relative;
  width: 100%;
  max-width: 800px;
  aspect-ratio: 16 / 9;
  margin: 0 auto;
}

.video-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}