@charset "UTF-8";
/* =================================
Reset + Base
================================= */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: #222;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.6rem;
  line-height: 1.8;
  background-color: #fff;
  overflow-x: hidden;
}

@media screen and (max-width: 768px) {
  body {
    font-size: 1.5rem;
    line-height: 1.8;
  }
}

img {
  display: block;
  width: 100%;
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
}

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
}

button,
input,
textarea,
select {
  font: inherit;
}
  /* =================================
  Layout
  ================================= */
  .header,
  .footer,
  .fv,
  .top-about,
  .top-news,
  .top-works,
  .top-access,
  .top-contact {
    width: 100%;
  }
  
 /* =================================
Common
================================= */
main {
  padding-top: 90px;
}

.main--has-fv {
  padding-top: 0;
}

.section-title {
  text-align: center;
  margin-bottom: 6rem;
}

.section-title__main {
  font-family: "Bebas Neue", sans-serif;
  font-size: 7rem;
  letter-spacing: 0.08em;
  line-height: 1;
  font-weight: 700;
}

.section-title__sub {
  margin-top: 1.6rem;
  font-size: 1.8rem;
  letter-spacing: 0.08em;
}

.section-title--white {
  color: #fff;
}

.section-title--left {
  text-align: left;
}

.section-title--sm .section-title__main {
  font-size: 5rem;
}

.section-title--sm .section-title__sub {
  font-size: 1.6rem;
}

.section-title--mt-lg {
  margin-top: 12rem;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 220px;
  padding: 1.2rem 2.4rem;
  font-size: 1.4rem;
  transition: 0.3s;
  cursor: pointer;
}

.btn--line {
  color: #fff;
  border: 1px solid #fff;
}

.btn--border {
  color: #1d36c9;
  border: 1px solid #1d36c9;
}

.btn--white-arrow {
  color: #111;
  background-color: #fff;
}

/* =================================
Page FV
================================= */
.page-fv {
  position: relative;
  height: 420px;
  overflow: hidden;
}

.page-fv__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.page-fv__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.page-fv__inner {
  position: relative;
  z-index: 2;
  max-width: 1200px;
  height: 100%;
  margin: 0 auto;
  padding: 90px 40px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.page-fv .section-title {
  margin-bottom: 0;
}

.page-fv .section-title__main {
  font-family: "Bebas Neue", sans-serif;
  font-size: clamp(6rem, 10vw, 9rem);
  letter-spacing: 0.08em;
  line-height: 1;
  color: #fff;
}

.page-fv .section-title__sub {
  margin-top: 1rem;
  font-size: 2.4rem;
  letter-spacing: 0.2em;
  color: #fff;
}

/* =================================
SP
================================= */
@media screen and (max-width: 768px) {
  main {
    padding-top: 70px;
  }

  .main--has-fv {
    padding-top: 0;
  }

  .section-title {
    margin-bottom: 4rem;
  }

  .section-title__main {
    font-size: 4.5rem;
  }

  .section-title__sub {
    font-size: 1.5rem;
    margin-top: 1rem;
  }

  .section-title--sm .section-title__main {
    font-size: 3.6rem;
  }

  .section-title--mt-lg {
    margin-top: 5rem;
  }

  .btn {
    min-width: 180px;
    padding: 1rem 2rem;
    font-size: 1.3rem;
  }

  .page-fv {
    height: 300px;
  }

  .page-fv__inner {
    padding: 70px 20px 0;
  }

  .page-fv .section-title__main {
    font-size: clamp(4rem, 12vw, 6rem);
    letter-spacing: 0.06em;
  }

  .page-fv .section-title__sub {
    font-size: 1.6rem;
    margin-top: 0.6rem;
  }
}
/* =================================
Header
================================= */

.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 90px;
    background-color: #ffffff;
    z-index: 1000;
  }
  
  .header__inner {
    max-width: 1200px;
    height: 100%;
    margin: 0 auto;
    padding: 0 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  
  /* ロゴ */
  .header__logo {
    width: 160px;
  }
  
  .header__logo img {
    width: 100%;
    height: auto;
    display: block;
  }
  
  /* ナビ（まず共通で定義） */
  .header__nav {
    display: block;
  }
  
  .header__nav-list {
    display: flex;
    gap: 52px;
  }
  
  .header__nav-item a {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1;
  }
  
  /* 英語 */
  .nav-en {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0.07em;
    font-family: "Bebas Neue", sans-serif;
  }
  
  /* 日本語 */
  .nav-ja {
    margin-top: 6px;
    font-size: 12px;
    font-weight: bold;
  }
  
  /* hover */
  .header__nav-item a:hover .nav-en,
  .header__nav-item a:hover .nav-ja {
    color: #1d36c9;
  }
  
  /* ハンバーガー */
  .header__hamburger {
    display: none;
    position: relative;
    width: 56px;
    height: 56px;
    border: none;
    background: transparent;
    cursor: pointer;
    padding: 0;
    z-index: 1100;
    transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
  }
  
  .header__hamburger::before {
    content: "";
    position: absolute;
    inset: 8px;
    border-radius: 50%;
    background-color: rgba(29, 54, 201, 0.08);
    transform: scale(0);
    transition: transform 0.35s ease;
  }
  
  .header__hamburger-line {
    position: absolute;
    left: 50%;
    width: 30px;
    height: 2px;
    background-color: #02126A;
    border-radius: 999px;
    transform: translateX(-50%);
    transition:
      top 0.35s ease,
      transform 0.35s ease,
      opacity 0.25s ease,
      background-color 0.3s ease;
  }
  
  .header__hamburger-line:nth-child(1) {
    top: 18px;
  }
  
  .header__hamburger-line:nth-child(2) {
    top: 27px;
  }
  
  .header__hamburger-line:nth-child(3) {
    top: 36px;
  }
  
  /* 開いた時 */
  .header.is-open .header__hamburger {
    transform: rotate(360deg);
  }
  
  .header.is-open .header__hamburger::before {
    transform: scale(1);
  }
  
  .header.is-open .header__hamburger-line:nth-child(1) {
    top: 27px;
    transform: translateX(-50%) rotate(45deg);
  }
  
  .header.is-open .header__hamburger-line:nth-child(2) {
    opacity: 0;
  }
  
  .header.is-open .header__hamburger-line:nth-child(3) {
    top: 27px;
    transform: translateX(-50%) rotate(-45deg);
  }
  
  /* =================================
  Responsive
  ================================= */

    @media screen and (max-width: 768px) {
        body.is-fixed {
            overflow: hidden;
          }
  

  
    .btn {
      min-width: 180px;
      padding: 1rem 2rem;
      font-size: 1.3rem;
    }
  
    .header {
      height: 70px;
    }
  
    .header__inner {
      padding: 0 20px;
    }
  
    .header__logo {
      width: 120px;
    }
  
    .header__hamburger {
      display: block;
    }
  
    .header__nav {
      display: none;
      position: fixed;
      top: 70px;
      right: 0;
      width: 80%;
      height: calc(100dvh - 70px);
      background-color: #ffffff;
      padding: 110px 0 40px;
      opacity: 0;
      transform: translateX(100%);
      pointer-events: none;
      backface-visibility: hidden;
      will-change: transform, opacity;
    }

    .header__nav.is-active {
      display: block;
      opacity: 1;
      transform: translateX(0);
      pointer-events: auto;
      animation: slideMenuIn 0.45s cubic-bezier(0.22, 1, 0.36, 1);
    }
  
    .header__nav.is-closing {
      display: block;
      opacity: 0;
      transform: translateX(100%);
      pointer-events: none;
      animation: slideMenuOut 0.35s ease forwards;
    }
  
    .header__nav-list {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 28px;
    }
  
    .header__nav-item a {
      padding: 8px 0;
    }
  
    .nav-en {
      font-size: 24px;
    }
  
    .nav-ja {
      margin-top: 8px;
      font-size: 13px;
    }
  }
  
  @keyframes slideMenuIn {
    from {
      opacity: 0;
      transform: translateX(100%);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }
  
  @keyframes slideMenuOut {
    from {
      opacity: 1;
      transform: translateX(0);
    }
    to {
      opacity: 0;
      transform: translateX(100%);
    }
  }
  
  @media screen and (min-width: 769px) {
    .header__hamburger {
      display: none;
    }
    .header__nav {
      /* アニメーションを無効化して固定表示 */
      transform: none !important;
      opacity: 1 !important;
      visibility: visible !important;
      pointer-events: auto !important;
      transition: none !important; 
      position: static;
      width: auto;
      height: auto;
      background: none;
      padding: 0;
    }
    .header__nav-list {
      display: flex;
      gap: 48px;
    }
  }
  /* =================================
  FV
  ================================= */
  .fv {
    background: #1a1a1a;
    height: 100vh;
    display: flex;
    align-items: center; /* 上下中央 */
    overflow: hidden;
  }
  
  .fv-container {
    width: 100%;
    padding-left: 5%; /* 左端に寄せる */
    margin-top: 28%;
  }
  
  /* ロゴとラインを横に並べる */
  .main-visual-flex {
    display: flex;
    align-items: flex-end; /* 下端（Tのライン）で揃える */
    width: calc(100% - 40px); /* 右端の余白40pxを確保 */
  }
  
  .logo-area {
    flex-shrink: 0; /* ロゴが潰れないように固定 */
  }
  
  .logo-main {
    display: flex;
    align-items: flex-end;
    gap: 10px;
  }
  
  .logo-item {
    height: 60px; 
    opacity: 0;
    transform: translateY(20px) scale(0.9);
    filter: blur(10px); 
    transition: 
      opacity 1.2s ease-out, 
      transform 1.2s cubic-bezier(0.22, 1, 0.36, 1), 
      filter 1.2s ease-out;
    will-change: transform, opacity, filter;
  }
  .logo-e {
    margin-right: -28px;
  }
  .logo-s {
    margin-right: -8px; 
  }
  .logo-fukuyama {
    height: 18px;
    margin-top: 10px;
    margin-left: 115px;
    opacity: 0;
    transition: opacity 1s ease-in-out;
  }
  
.line-container {
    flex-grow: 1;
    display: flex;
    align-items: center;
    margin-bottom: 15px; /* Tの横棒の高さに合うまで上下させて！ */
    margin-left: -35px;
    position: relative;
    z-index: 1;
  }
  
  .fv-copy-img {
    position: absolute;
    right: 40px;   
    bottom: 20px; 
    width: 210px;
    height: auto;
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.2));
    opacity: 0;
    transform: translateX(-15px);
    transition: 
      opacity 1.2s ease, 
      transform 1.2s cubic-bezier(0.22, 1, 0.36, 1);
    z-index: 2;
  }
  
  /* 表示された時のクラス（JSで付与） */
  .fv-copy-img.is-visible {
    opacity: 1;
    transform: translateX(0);
  }
  @media screen and (max-width: 480px) {
    .line-container {
      position: static; /* 基準を解除 */
    }
  
    /* 2. ロゴエリアを基準にする */
    .logo-area {
      position: relative;
    }
  
    /* 3. キャッチコピーをロゴの真上に配置 */
    .fv-copy-img {
      position: absolute;
      bottom: 100%;
      left: 50px; 
      right: auto; 
      margin-bottom: 40px;
    }
  
    /* 4. アニメーション完了時の位置 */
    .fv-copy-img.is-visible {
      opacity: 1;
      transform: translateY(0);
    }
  }
  /* スマホ用のサイズと位置調整 */
  @media screen and (max-width: 768px) {
    .fv-copy-img {
      width: 120px;
      right: 34px;
      bottom: 16px;    /* ロゴが小さくなった分、下げる */
    }
  }
  .line-body {
    height: 4px;
    background: #fff;
    width: 0%; /* JSで伸ばす */
    transition: width 1.5s cubic-bezier(0.22, 1, 0.36, 1);
  }
  
  .line-dot {
    width: 30px;
    height: 30px;
    margin-left: -10px;
    opacity: 0;
    transition: opacity 0.5s ease;
  }
  
  .is-visible {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
    filter: blur(0) !important;
  }
/* --- 背景スライダー追加分 --- */
.fv {
    position: relative;
    background: #000; /* ロゴ側の背景色 */
  }
  
  .fv-bg-slider {
    position: absolute;
    top: 0;
    right: 0;
    width: 67%;
    height: 100%;
    z-index: 0;
    opacity: 0; /* ← 追加 */
    transition: opacity 1.5s ease-in-out; /* ← 追加 */
  }
  
  .fv-bg-item {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 2s ease-in-out; /* フェードの速度 */
    background-size: cover;
    background-position: center;
  }
  
  .fv-bg-item.is-active {
    opacity: 1;
  }
  
  /* PC用 */
.fv-bg-item:nth-child(1) { background-image: url('../images/pc-img1.jpg'); }
.fv-bg-item:nth-child(2) { background-image: url('../images/pc-img2.jpg'); }
.fv-bg-item:nth-child(3) { background-image: url('../images/pc-img3.jpg'); }

  
  /* スマホ向けの調整 */
  @media screen and (max-width: 768px) {
    .fv-bg-slider {
      width: 100%; /* スマホ：全画面表示 */
    }
    
  /* スマホ用 */
.fv-bg-item:nth-child(1) { background-image: url('../images/sp-img1.jpg'); }
.fv-bg-item:nth-child(2) { background-image: url('../images/sp-img2.jpg'); }
.fv-bg-item:nth-child(3) { background-image: url('../images/sp-img3.jpg'); }
  
    /* ロゴが画像に埋もれないように前面へ */
    .fv-container {
      position: relative;
      z-index: 10;
    }
  }

@media screen and (max-width: 768px) {
    .fv {
        height: 65vh;
      }
    .fv-container {
      padding-left: 20px;
      margin-top: 30%;
    }
  
    .main-visual-flex {
      width: calc(100% - 20px); /* 右端の余白を少し詰める */
    }
  
    .logo-item {
      height: 35px;
    }
  
    .logo-e {
        margin-right: -19px;
      }
      .logo-s {
        margin-right: -7px; 
      }
    .logo-fukuyama {
      height: 13px; /* 福山の文字も小さく */
      margin-left: 55px; /* Sの下に来るように再調整 */
      margin-top: 4px;
    }
  
    /* ラインの高さ調整（ロゴが小さくなった分、下げる） */
    .line-container {
      margin-bottom: 6.5px; /* 50pxのロゴに合わせた高さ。ズレたらここを調整！ */
      padding-left: 3px;
    }
    .line-body {
        height: 3px;
      }
    .line-dot {
      width: 24px; /* ドットも控えめに */
      height: 24px;
      margin-left: -8px;
    }
  }
  @media screen and (max-width: 468px) {
    .fv-container {
        margin-top: 60%;
      }}


  @media screen and (max-width: 768px) {
    .btn {
      min-width: 180px;
      padding: 1rem 2rem;
      font-size: 1.3rem;
    }
    main{
      padding-top:70px;
      }
  
    }
  
/* =================================
Top About
================================= */
.top-about {
    padding: 8rem 0 9rem;
    background-color: #101010;
    color: #ffffff;
    overflow: hidden;
  }
  
  .top-about__inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 4rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 46%;
    align-items: center;
    gap: 6rem;
  }
  
  .top-about__content {
    max-width: 62rem;
  }
  
  .top-about__text p {
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 2.15;
    letter-spacing: 0.03em;
  }
  
  .top-about__text p + p {
    margin-top: 0.6em;
  }
  
  .top-about__button {
    margin-top: 6rem;
    text-align: center;
  }
  
  .btn-border {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 25.6rem;
    min-height: 6.2rem;
    padding: .8rem 3rem;
    border: 1px solid #ffffff;
    color: #ffffff;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.4;
    transition: opacity 0.3s, background-color 0.3s, color 0.3s;
  }
  
  .btn-border:hover {
    background-color: #ffffff;
    color: #111111;
  }
  
  .top-about__image {
    min-width: 0;
  }
  
  .top-about__image img {
    display: block;
    width: 100%;
    height: auto;
  }
  

  @media screen and (max-width: 768px) {
    .top-about {
      padding: 0;
      background-color: #050505;
    }
  
    .top-about__inner {
      position: relative;
      display: block;
      max-width: none;
      min-height: 56rem;
      padding: 0;
    }
  
    .top-about__image {
      position: relative;
      width: 100%;
      height: 56rem;
    }
  
    .top-about__image::after {
      content: "";
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.45);
      z-index: 1;
    }
  
    .top-about__image img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  
    .top-about__content {
      position: absolute;
      inset: 0;
      z-index: 2;
      max-width: none;
      padding: 5rem 2rem 4rem;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
  
    .top-about__text p {

      line-height: 1.95;
      letter-spacing: 0.03em;
    }
  
    .top-about__text p + p {
      margin-top: 0.6em;
    }
  
    .top-about__button {
      margin-top: 3.2rem;
      text-align: center;
    }
  
    .btn-border {
      min-width: 22rem;
      min-height: 5.4rem;
      padding: .7rem 2.4rem;
      font-size: 1.5rem;
    }
  }
  
/* =================================
Top News
================================= */
.top-news {
    padding: 10rem 0 11rem;
  }
  
  .top-news__inner {
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 4rem;
  }
  

  .top-news__list {
    margin-top: 8rem;
    border-top: 1px solid transparent;
  }
  
  .news-item {
    display: grid;
    grid-template-columns: 11rem 13.2rem 1fr;
    align-items: center;
    column-gap: 4.2rem;
    padding: 2.6rem 0 1.4rem;
    border-bottom: 1px solid #c8c8c8;
    color: #2b2323;
    transition: opacity 0.3s;
  }
  
  .news-item:hover {
    opacity: 0.7;
  }
  
  .news-item__date {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.4;
  }
  
  .news-item__category {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 3rem;
    padding: 0.2rem 1.4rem;
    background-color: #2339d6;
    color: #fff;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.2;
    text-align: center;
  }
  
  .news-item__title {
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.6;
  }
  
  .top-news__button {
    margin-top: 5.6rem;
    text-align: center;
  }
  
  .btn-news {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 19.6rem;
    min-height: 5rem;
    padding: .8rem 2.4rem;
    border: 1px solid #2339d6;
    color: #2b2323;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.4;
    background-color: transparent;
    transition: background-color 0.3s, color 0.3s;
  }
  
  .btn-news:hover {
    background-color: #2339d6;
    color: #fff;
  }
  @media screen and (max-width: 768px) {
  
    .top-news {
      padding: 7rem 0 7rem;
    }
  
    .top-news__inner {
      padding: 0 2rem;
    }
  
    .top-news__list {
      margin-top: 4.4rem;
    }
  
    .news-item {
      grid-template-columns: 1fr;
      row-gap: 1.2rem;
      padding: 2rem 0;
    }
  
    .news-item__date {
      font-size: 1.5rem;
    }
  
    .news-item__category {
      justify-self: start;
      min-height: 3rem;
      padding: 0.4rem 1.4rem;
      font-size: 1.3rem;
    }
  
    .news-item__title {
      font-size: 1.7rem;
      line-height: 1.6;
    }
  
    .top-news__button {
      margin-top: 4rem;
    }
  
    .btn-news {
      min-width: 18rem;
      min-height: 4.8rem;
      padding: .7rem 2.4rem;
      font-size: 1.5rem;
    }
  }
/* =================================
Top works
================================= */
.top-works {
    padding: 10rem 0 9rem;
    background: linear-gradient(to right, #02126A 0%, #0423D0 100%);
    overflow: hidden;
  }
  
  .top-works__inner {
    max-width: 1440px;
    margin: 0 auto;
  }
  

  /* ------------------------
     スライダー全体
  ------------------------ */
  .works-slider-wrap {
    position: relative;
    margin-top: 7rem;
    overflow: hidden;
    background: inherit;
  }
  
  /* 両端のフェード
     背景と同じグラデを継承して、maskで自然に消す */
  .works-slider-wrap::before,
  .works-slider-wrap::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 16%;
    z-index: 5;
    pointer-events: none;
    background: inherit;
  }
  
  .works-slider-wrap::before {
    left: 0;
    -webkit-mask-image: linear-gradient(to right, #000 18%, transparent 100%);
    mask-image: linear-gradient(to right, #000 18%, transparent 100%);
  }
  
  .works-slider-wrap::after {
    right: 0;
    -webkit-mask-image: linear-gradient(to left, #000 18%, transparent 100%);
    mask-image: linear-gradient(to left, #000 18%, transparent 100%);
  }
  
  /* スライダー本体 */
  .works-slider {
    width: min(1120px, calc(100% - 160px));
    margin: 0 auto;
    overflow: visible;
  }
  
  /* スライド基本状態 */
  .works-slider .swiper-slide {
    opacity: 0.28;
    transform: scale(0.92);
    transition: opacity 0.4s ease, transform 0.4s ease;
  }
  
  /* 中央3枚だけはっきり */
  .works-slider .swiper-slide-active,
  .works-slider .swiper-slide-prev,
  .works-slider .swiper-slide-next {
    opacity: 1;
    transform: scale(1);
  }
  

  .works-card {
    background-color: #fff;
    overflow: hidden;
    max-width: 360px;
    margin: 0 auto;
  }
  .works-card a {
    display: block;
    color: inherit;
    text-decoration: none;
    transition: transform 0.3s ease;
  }
  
  .works-card a:hover {
    transform: translateY(-4px);
  }
  
  .works-card__image {
    aspect-ratio: 286 / 235;
    overflow: hidden;
  }
  
  .works-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  
  .works-card__body {
    display: flex;
    justify-content: center;
    min-height: 8.2rem;
    padding: 1.6rem 1.2rem;
    background-color: #f4f3ef;
    text-align: center;
    flex-direction: column;
    align-items: center; 
  }
  
  .works-card__title {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.5;
    color: #2b2323;
  }
  
  /* ------------------------
     矢印ボタン
  ------------------------ */
  .works-slider-button {
    position: absolute;
    top: 50%;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 5.6rem;
    height: 5.6rem;
    border: none;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.72);
    transform: translateY(-50%);
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.3s ease;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  }
  
  .works-slider-button:hover {
    background-color: rgba(255, 255, 255, 0.58);
  }
  
  .works-slider-button--prev {
    left: 2rem;
  }
  
  .works-slider-button--next {
    right: 2rem;
  }
  
  .works-slider-button span {
    position: relative;
    display: block;
    width: 1.4rem;
    height: 1.4rem;
  }
  
  .works-slider-button--prev span::before,
  .works-slider-button--next span::before {
    content: "";
    position: absolute;
    inset: 0;
    border-top: 2px solid #1230db;
    border-right: 2px solid #1230db;
  }
  
  .works-slider-button--prev span::before {
    transform: rotate(-135deg);
    left: 0.2rem;
    top: 0.1rem;
  }
  
  .works-slider-button--next span::before {
    transform: rotate(45deg);
    right: 0.2rem;
    top: 0.1rem;
  }
  
  .top-works__button {
    margin-top: 7rem;
    text-align: center;
  }
  
  .btn-works {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 25.6rem;
    min-height: 5.2rem;
    padding: .8rem 2.4rem;
    border: 1px solid #fff;
    background: transparent;
    color: #fff;
    font-size: 1.7rem;
    font-weight: 500;
    line-height: 1.4;
    transition: background-color 0.3s ease, color 0.3s ease;
    text-decoration: none;
  }
  
  .btn-works:hover {
    background-color: rgba(255, 255, 255, 0.12);
  }
  
  /* ------------------------
     タブレット
  ------------------------ */
  @media (max-width: 1024px) {
    .works-slider {
      width: calc(100% - 120px);
    }
  
    .works-slider-wrap::before,
    .works-slider-wrap::after {
      width: 12%;
    }

  }
  
  /* ------------------------
     SP
  ------------------------ */
  @media (max-width: 768px) {
    .top-works {
      padding: 8rem 0 7rem;
    }

  
    .works-slider-wrap {
      margin-top: 5rem;
    }
  
    .works-slider {
        width: calc(100% - 72px);
      }
    
      .works-slider-wrap::before,
      .works-slider-wrap::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        width: 64px;
        z-index: 5;
        pointer-events: none;
      }
    
      .works-slider-wrap::before {
        left: 0;
        background: linear-gradient(
          to right,
          rgba(2, 18, 106, 0.95) 0%,
          rgba(2, 18, 106, 0.75) 35%,
          rgba(2, 18, 106, 0) 100%
        );
        -webkit-mask-image: none;
        mask-image: none;
      }
    
      .works-slider-wrap::after {
        right: 0;
        background: linear-gradient(
          to left,
          rgba(4, 35, 208, 0.95) 0%,
          rgba(4, 35, 208, 0.75) 35%,
          rgba(4, 35, 208, 0) 100%
        );
        -webkit-mask-image: none;
        mask-image: none;
      }
  
    .works-slider-button {
      width: 4.8rem;
      height: 4.8rem;
    }
  
    .works-slider-button--prev {
      left: 0.8rem;
    }
  
    .works-slider-button--next {
      right: 0.8rem;
    }
  
    .works-card__body {
      min-height: 7.2rem;
      padding: 1.4rem 1rem;
    }
  
    .works-card__title {
      font-size: 1.4rem;
    }
  
    .top-works__button {
      margin-top: 5rem;
    }
  
    .btn-works {
      min-width: 22rem;
      min-height: 4.8rem;
      font-size: 1.5rem;
      padding: .7rem 2.4rem;
    }
  }
/* =================================
Top Access
================================= */
.top-access {
    padding: 10rem 0;
  }
  
  .top-access__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 4rem;
  }

  
  .top-access__map {
    overflow: hidden;
  }
  
  .top-access__map iframe {
    display: block;
    width: 100%;
    height: 48rem;
  }
  
  .top-access__info {
    margin-top: 4rem;
    padding: 3.2rem;
  }
  
  .access-info__row {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 2rem;
    padding: 1.6rem 0;
    border-bottom: 1px solid #e5e5e5;
  }
  
  .access-info__row:first-child {
    padding-top: 0;
  }
  
  .access-info__row:last-child {
    padding-bottom: 0;
    border-bottom: none;
  }
  
  .access-info__row dt {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1d36c9;
  }
  
  .access-info__row dd {
    font-size: 1.5rem;
    line-height: 1.8;
  }
  
  .access-info__row dd a {
    transition: opacity 0.3s;
  }
  
  .access-info__row dd a:hover {
    opacity: 0.7;
  }
/* =================================
Top Contact
================================= */
.top-contact {
    position: relative;
    overflow: hidden;
    padding: 0 0 8rem;
    color: #ffffff;
  }
  
  .top-contact__bg {
    position: absolute;
    inset: 0;
    z-index: 1;
  }
  
  .top-contact__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .top-contact__overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    background: rgba(0, 0, 0, 0.28);
  }
  
  .top-contact__inner {
    position: relative;
    z-index: 3;
    max-width: 1200px;
    margin: 0 auto;
    padding: 100px 4rem 0;
  }

  
  .top-contact__lead {
    text-align: center;
    font-size: 2rem;
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.8;
  }
  
  /* =========================
  PC
  ========================= */
  .contact-box {
    display: grid;
    grid-template-columns: 1fr 1px 1fr;
    align-items: center;
    gap: 5rem;
    max-width: 980px;
    margin: 5rem auto 0;
  }
  
  .contact-box__divider {
    width: 1px;
    height: 26rem;
    background-color: rgba(255, 255, 255, 0.9);
  }
  
  .contact-box__item {
    text-align: center;
  }
  
  .contact-box__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 9rem;
    height: 9rem;
    margin: 0 auto 3rem;
    background-color: rgba(9, 43, 234, 0.65);
    border-radius: 50%;
  }
  
  .contact-box__icon img {
    width: 3.8rem;
    height: 3.8rem;
    object-fit: contain;
  }
  
  .contact-box__label {
    margin-bottom: 2rem;
    font-size: 1.8rem;
    font-weight: 400;
  }
  
  .contact-box__tel {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 0.8rem;
    margin-bottom: 2rem;
    line-height: 1;
  }
  
  .contact-box__tel-head {
    font-family: "Bebas Neue", sans-serif;
    font-size: 3.2rem;
    letter-spacing: 0.04em;
  }
  
  .contact-box__tel a {
    font-family: "Bebas Neue", sans-serif;
    font-size: 6rem;
    letter-spacing: 0.04em;
    line-height: 1;
  }
  
  .contact-box__note {
    font-size: 1.6rem;
    line-height: 1.8;
  }
  
  .contact-box__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    min-width: 28.5rem;
    margin-top: 3rem;
    padding: 1.8rem 2rem;
    background-color: #ffffff;
    color: #111111;
    font-size: 1.8rem;
    font-weight: 700;
    transition: 0.3s;
  }
  
  .contact-box__button:hover {
    opacity: 0.85;
  }
  
  .contact-box__arrow {
    font-size: 2.4rem;
    font-weight: 400;
    line-height: 1;
    color: #1d36c9;
    margin-left: 10px;
    margin-bottom: 2px;
  }
  
  .pc-only {
    display: block;
  }
  
  .sp-only {
    display: none;
  }
  
  @media screen and (max-width: 900px) {
    .top-contact {
      padding: 7rem 0 6rem;
    }
  
    .top-contact__inner {
      padding: 0 2rem;
    }

  
    .top-contact__lead {
      font-size: 1.8rem;
      line-height: 1.7;
    }
  
    .contact-box {
      grid-template-columns: 1fr;
      gap: 0;
      max-width: none;
      margin-top: 4rem;
    }
  
    /* ←ここが重要 */
    .contact-box__divider {
      display: block;
      width: 100%;
      height: 1px;
      margin: 4rem 0;
      background-color: rgba(255, 255, 255, 0.9);
    }
  
    .contact-box__item {
      padding: 0;
    }
  
    .contact-box__icon {
      width: 8rem;
      height: 8rem;
      margin-bottom: 2.4rem;
    }
  
    .contact-box__icon img {
      width: 3.2rem;
      height: 3.2rem;
    }
  
    .contact-box__label {
      margin-bottom: 1.6rem;
      font-size: 1.7rem;
    }
  
    .contact-box__tel {
      flex-wrap: wrap;
      gap: 0.6rem;
      margin-bottom: 1.6rem;
    }
  
    .contact-box__tel-head {
      font-size: 2.8rem;
    }
  
    .contact-box__tel a {
      font-size: 4.4rem;
    }
  
    .contact-box__note {
      font-size: 1.5rem;
    }
  
    .contact-box__button {
      min-width: auto;
      width: 100%;
      max-width: 26rem;
      margin-top: 2.4rem;
      padding: 1.6rem 2rem;
      font-size: 1.7rem;
    }
  
    .pc-only {
      display: none;
    }
  
    .sp-only {
      display: block;
    }
  }
/* =================================
Footer
================================= */
.footer {
    background: #1f1f1f;
    color: #fff;
    padding: 60px 0 40px; /* 左右paddingはinnerに任せる */
    overflow-x: hidden; /* 保険 */
  }
  
  .footer__inner {
    justify-content: space-between; /* ← 追加 */
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px; /* ここだけで左右を管理 */
    box-sizing: border-box;
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 40px;
  }
  
  .footer__logo {
    flex: 0 0 180px;
  }
  
  .footer__logo img {
    width: 180px;
    height: auto;
    display: block;
  }
  
  .footer__nav-area {
    flex: 0 1 auto; /* ← 1 1 0 から変更 */
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
  }
  
  .footer__nav-group {
    min-width: 120px;
  }
  
  .footer__nav-title {
    font-weight: 600;
    margin: 0 0 10px;
  }
  
  .footer__nav-title--space {
    margin-top: 20px;
  }
  
  .footer__nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .footer__nav-list li {
    margin-bottom: 6px;
  }
  
  .footer a {
    color: #fff;
    text-decoration: none;
    font-size: 14px;
  }
  
  .footer a:hover {
    opacity: 0.7;
  }
  
  .footer__bottom {
    max-width: 1200px;
    margin: 40px auto 0;
    padding: 0 40px;
    box-sizing: border-box;
    text-align: center;
  }
  
  .footer__privacy {
    margin-bottom: 10px;
  }
  
  .footer__copyright {
    font-size: 12px;
    opacity: 0.7;
  }
  
 
/* =================================
Responsive
================================= */
@media screen and (max-width: 768px) {



    .top-access {
        padding: 7rem 0;
      }
      
      .top-access__inner {
        padding: 0 2rem;
      }
      
      .top-access__map iframe {
        height: 32rem;
      }
      
      .top-access__info {
        margin-top: 2.4rem;
        padding: 2.4rem 2rem;
      }
      
      .access-info__row {
        grid-template-columns: 1fr;
        gap: 0.8rem;
        padding: 1.4rem 0;
      }
      
      .access-info__row dt,
      .access-info__row dd {
        font-size: 1.4rem;
      }


    
       


    .footer__inner {
      padding: 0 20px;
      flex-direction: column;
      gap: 30px;
    }
  
    .footer__bottom {
      padding: 0 20px;
    }
  
    .footer__logo {
      flex: 0 0 auto;
    }
  
    .footer__nav-area {
      width: 100%;
      gap: 24px 32px;
    }
  
    .footer__nav-group {
      min-width: calc(50% - 16px);
    }
  }








/* =================================
Service Heading（余白調整）
================================= */
.service-heading {
    padding: 8rem 0 4rem; /* ←上しっかり・下は少し軽め */
  }
  
  .service-heading__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
  }
  
  /* スマホ */
  @media screen and (max-width: 768px) {
    .service-heading {
      padding: 5rem 0 3rem;
    }
  
    .service-heading__inner {
      padding: 0 20px;
    }
  }
  
  
  /* =================================
Service List
================================= */
.service-list {
    padding: 0;
    background-color: #f7f7f7;
  }
  
  .service-list__inner {
    max-width: none;
    margin: 0;
    padding: 0;
  }
  
  .service-card {
    position: relative;
    overflow: hidden;
    width: 100%;
    background-color: #111;
  }
  
  .service-card__image {
    position: relative;
    height: 400px;
  }
  
  .service-card__image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.38);
  }
  
  .service-card__image img {
    width: 100%;
    height: 100%;
    height: 400px;
    object-fit: cover;
    display: block;
  }

  
  .service-card__overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
  }
  
  .service-card__content {
    position: relative;
    max-width: 560px;
    margin-left: 8%;
    color: #ffffff;
  }
  
  .service-card--reverse .service-card__overlay {
    justify-content: flex-end;
  }
  
  .service-card--reverse .service-card__content {
    margin-left: 0;
    margin-right: 8%;
  }
  
  /* 英語ラベル */
  .service-card__label {
    position: absolute;
    right: -43vw;
    bottom: -11%;
    z-index: 3;
    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(6rem, 10vw, 11rem);
    line-height: 1;
    letter-spacing: 0.04em;
    color: rgba(255, 255, 255, 0.303);
    pointer-events: none;
    white-space: nowrap;
  }
  
  .service-card--reverse .service-card__label {
    right: auto;
    left: -43vw;
  }
  
  .service-card__title {
    font-size: 3.6rem;
    font-weight: 700;
    color: #ffffff;
  }
  
  .service-card__text {
    margin-top: 2rem;
    font-size: 1.7rem;
    line-height: 2;
    color: #ffffff;
  }
  @media screen and (max-width: 1170px) {

    .service-card__label {
        right: -35vw;
        font-size: clamp(6rem, 10vw, 10rem);
      }
      
      .service-card--reverse .service-card__label {
        left: -35vw;
      }
    }
/* =================================
SP（左寄せ統一）
================================= */
@media screen and (max-width: 970px) {

    .service-card__overlay {
      align-items: flex-end;
    }
  
    .service-card__content {
      margin: 0 !important; 
      padding: 3rem 2rem;
      display: flex;
      flex-direction: column;
  
      text-align: left; /* ←これ重要 */
      align-items: flex-start; /* ←これも重要 */
    }
  
    /* 英語ラベル */
    .service-card__label {
      position: static;
      display: block;
      margin-bottom: 1rem;
  
      font-size: 6rem;
      color: rgba(255,255,255,0.6);
      white-space: normal;
  
      text-align: left; /* 念のため */
    }
  
    /* タイトル */
    .service-card__title {
      font-size: 2.6rem;
      text-align: left;
    }
  
    /* テキスト */
    .service-card__text {
      font-size: 1.5rem;
      text-align: left;
    }
  
  }
  /* =================================
Service FAQ
================================= */
.service-faq {
    padding: 10rem 0;
    background-color: #ffffff;
  }
  
  .service-faq__inner {
    max-width: 1040px;
    margin: 0 auto;
    padding: 0 40px;
  }
  
  .faq-list {
    margin-top: 6rem;
  }
  
  .faq-item {
    padding: 3rem 0;
    border-bottom: 1px solid #d7d7d7;
  }
  
  .faq-item:first-child {
    border-top: 1px solid #d7d7d7;
  }
  
  .faq-item__question,
  .faq-item__answer {
    display: grid;
    grid-template-columns: 4rem 1fr;
    column-gap: 2rem;
    align-items: start;
  }
  
  .faq-item__answer {
    margin-top: 1.6rem;
  }
  
  /* Q・A 丸デザイン */
  .faq-item__label {
    display: flex;
    align-items: center;
    justify-content: center;
  
    width: 4rem;
    height: 4rem;
  
    border-radius: 50%;
    font-family: "Bebas Neue", sans-serif;
    font-size: 1.8rem;
    line-height: 1;
  }
  
  /* Q：青背景 */
  .faq-item__question .faq-item__label {
    background-color: #1d36c9;
    color: #ffffff;
  }
  
  /* A：白背景＋青枠 */
  .faq-item__answer .faq-item__label {
    background-color: #ffffff;
    color: #1d36c9;
    border: 1.5px solid #1d36c9;
  }
  
  .faq-item__text {
    font-size: 1.7rem;
    line-height: 1.9;
    color: #2b2323;
  }
  
  /* =================================
  SP
  ================================= */
  @media screen and (max-width: 768px) {
  
    .service-faq {
      padding: 6rem 0;
    }
  
    .service-faq__inner {
      padding: 0 20px;
    }
  
    .faq-list {
      margin-top: 4rem;
    }
  
    .faq-item {
      padding: 2rem 0;
    }
  
    .faq-item__question,
    .faq-item__answer {
      grid-template-columns: 3.2rem 1fr;
      column-gap: 1rem;
    }
  
    .faq-item__label {
      width: 3.2rem;
      height: 3.2rem;
      font-size: 1.5rem;
    }
  
    .faq-item__text {
      font-size: 1.5rem;
      line-height: 1.8;
    }
  
  }
/* =================================
Company Page
================================= */
.company-message {
    position: relative;
    padding: 10rem 0;
    background-color: #0b0b0b;
    overflow: hidden;
  }
  
  /* 右側に青のライト */
  .company-message::after {
    content: "";
    position: absolute;
    top: 0;
    right: -20%;
    width: 60%;
    height: 100%;
    background: radial-gradient(
      circle at right center,
      rgba(29, 54, 201, 0.35) 0%,
      rgba(29, 54, 201, 0.15) 30%,
      rgba(29, 54, 201, 0.05) 50%,
      transparent 70%
    );
    z-index: 0;
  }
  
  .company-message__inner {
    position: relative;
    z-index: 1;
    max-width: 1050px;
    margin: 0 auto;
    padding: 0 40px;
  }

  /* 本文 */
  .company-message__body {
    margin-top: 6rem;
  }
  
  .company-message__body p {
    font-size: 1.8rem;
    line-height: 2.2;
    text-align: center;
    color: #e5e5e5;
  }
  
  .company-message__body p + p {
    margin-top: 3.2rem;
  }
  
  /* 署名（ここがポイント） */
  .company-message__signature {
    margin-top: 6rem;
    text-align: right;
  }
  
  .company-message__signature p {
    font-size: 2rem;
    line-height: 1.8;
    color: #ffffff;
  
    /* 明朝系 */
    font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
    letter-spacing: 0.08em;
  }
  
  
  /* INFORMATION */
  .company-info {
    padding: 10rem 0;
    background-color: #ffffff;
  }
  
  .company-info__inner {
    max-width: 1040px;
    margin: 0 auto;
    padding: 0 40px;
  }

  
  .company-info__image {
    margin-top: 5rem;
  }
  
  .company-info__image img {
    display: block;
    width: 100%;
    height: auto;
  }
  
  .company-info__list {
    margin-top: 5rem;
    border-top: 1px solid #d7d7d7;
  }
  
  .company-info__item {
    display: grid;
    grid-template-columns: 16rem 1fr;
    column-gap: 2rem;
    padding: 2rem 0;
    border-bottom: 1px solid #d7d7d7;
  }
  
  .company-info__item dt {
    font-size: 1.6rem;
    font-weight: 700;
    color: #2b2323;
  }
  
  .company-info__item dd {
    font-size: 1.6rem;
    line-height: 1.9;
    color: #2b2323;
  }
  
 /* =================================
  SP
  ================================= */
  @media screen and (max-width: 768px) {
  
    .company-message {
      padding: 6rem 0;
    }
  
    .company-message__inner {
      padding: 0 20px;
    }
  
    .company-message__body {
      margin-top: 4rem;
    }
  
    .company-message__body p {
      font-size: 1.6rem;
      line-height: 1.9;
      text-align: left;
    }
  
    .company-message__body p + p {
      margin-top: 2.4rem;
    }
  
    .company-message__signature {
      margin-top: 4rem;
    }
  
    .company-message__signature p {
      font-size: 1.7rem;
    }
  
  
    .company-info {
      padding: 6rem 0;
    }
  
    .company-info__inner {
      padding: 0 20px;
    }
  
    .company-info__image {
      margin-top: 3.2rem;
    }
  
    .company-info__list {
      margin-top: 3.2rem;
    }
  
    .company-info__item {
      grid-template-columns: 1fr;
      row-gap: 0.8rem;
      padding: 1.6rem 0;
    }
  
    .company-info__item dt,
    .company-info__item dd {
      font-size: 1.5rem;
    }
  
  }
/* =================================
Privacy Policy
================================= */
.privacy-policy {
    padding: 0 0 10rem;
  }
  
  .privacy-policy__inner {
    max-width: 1040px;
    margin: 0 auto;
    padding: 0 40px;
  }
  
  .privacy-policy__lead {
    margin-bottom: 6rem;
  }
  
  .privacy-policy__lead p {
    font-size: 1.7rem;
    line-height: 2;
    color: #2b2323;
  }
  
  /* 各ブロック */
  .privacy-policy__section + .privacy-policy__section {
    margin-top: 4rem;
  }
  
  .privacy-policy__title {
    font-size: 2.2rem;
    font-weight: 700;
    margin-bottom: 1.6rem;
    color: #2b2323;
    border-left: 4px solid #001e63;
    padding-left: 1.2rem;
  }
  
  .privacy-policy__text {
    font-size: 1.6rem;
    line-height: 2;
    color: #2b2323;
  }
  
  /* リスト */
  .privacy-policy__list {
    margin-top: 1.6rem;
    padding-left: 2rem;
  }
  
  .privacy-policy__list li {
    font-size: 1.6rem;
    line-height: 2;
    color: #2b2323;
    list-style: disc;
  }
  
  /* お問い合わせ */
  .privacy-policy__contact {
    margin-top: 1.6rem;
    font-size: 1.6rem;
    line-height: 2;
    color: #2b2323;
  }
  
  @media screen and (max-width: 768px) {
  
    .privacy-policy {
      padding: 6rem 0;
    }
  
    .privacy-policy__inner {
      padding: 0 20px;
    }
  
    .privacy-policy__lead {
      margin-bottom: 4rem;
    }
  
    .privacy-policy__lead p {
      font-size: 1.5rem;
    }
  
    .privacy-policy__title {
      font-size: 1.8rem;
    }
  
    .privacy-policy__text,
    .privacy-policy__list li,
    .privacy-policy__contact {
      font-size: 1.5rem;
    }
  }


/* =================================
Single News
================================= */
.single-news-page {
  background-color: #fff;
  color: #2b2323;
}

.single-news {
  padding: 7rem 0 10rem;
}

.single-news__inner {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 4rem;
}


.single-news__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.6rem;
  margin-bottom: 2.4rem;
}

.single-news__date {
  font-size: 1.6rem;
  line-height: 1.4;
  color: #555;
}

.single-news__category {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  padding: 0.2rem 1.4rem;
  background-color: #2339d6;
  color: #fff;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.2;
  text-align: center;
}

.single-news__title {
  font-size: 3.2rem;
  font-weight: 500;
  line-height: 1.5;
  color: #2b2323;
}

.single-news__thumbnail {
  margin-top: 3.6rem;
}

.single-news__thumbnail img {
  width: 100%;
  height: auto;
  display: block;
}

.single-news__content {
  margin-top: 4rem;
  font-size: 1.7rem;
  line-height: 2;
  color: #2b2323;
}

.single-news__content p + p {
  margin-top: 1.4em;
}

.single-news__content h2,
.single-news__content h3,
.single-news__content h4 {
  margin-top: 2.2em;
  margin-bottom: 0.8em;
  line-height: 1.5;
}

.single-news__content h2 {
  font-size: 2.6rem;
}

.single-news__content h3 {
  font-size: 2.2rem;
}

.single-news__content h4 {
  font-size: 1.9rem;
}

.single-news__content img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 3rem auto;
}

.single-news__content a {
  color: #2339d6;
  text-decoration: underline;
}

.single-news__content ul,
.single-news__content ol {
  margin: 1.6em 0;
  padding-left: 1.5em;
}

.single-news__content ul {
  list-style: disc;
}

.single-news__content ol {
  list-style: decimal;
}

.single-news__footer {
  margin-top: 6rem;
  text-align: center;
}

.single-news__back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 19.6rem;
  min-height: 5rem;
  padding: 0.8rem 2.4rem;
  border: 1px solid #2339d6;
  color: #2b2323;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.4;
  background-color: transparent;
  transition: background-color 0.3s, color 0.3s;
}

.single-news__back:hover {
  background-color: #2339d6;
  color: #fff;
}

/* =================================
SP
================================= */
@media screen and (max-width: 768px) {
 
  .single-news {
    padding: .5rem 0 7rem;
  }

  .single-news__inner {
    padding: 0 2rem;
  }

  .single-news__article {
    padding-top: 3rem;
  }

  .single-news__meta {
    gap: 1rem;
    margin-bottom: 2rem;
  }

  .single-news__date {
    font-size: 1.5rem;
  }

  .single-news__category {
    min-height: 3rem;
    padding: 0.4rem 1.2rem;
    font-size: 1.3rem;
  }

  .single-news__title {
    font-size: 2.4rem;
    line-height: 1.6;
  }

  .single-news__thumbnail {
    margin-top: 2.8rem;
  }

  .single-news__content {
    margin-top: 3rem;
    font-size: 1.5rem;
    line-height: 1.95;
  }

  .single-news__content h2 {
    font-size: 2.1rem;
  }

  .single-news__content h3 {
    font-size: 1.9rem;
  }

  .single-news__content h4 {
    font-size: 1.7rem;
  }

  .single-news__footer {
    margin-top: 4.5rem;
  }

  .single-news__back {
    min-width: 18rem;
    min-height: 4.8rem;
    padding: 0.7rem 2.4rem;
    font-size: 1.5rem;
  }
}

/* =================================
Archive News
================================= */
.archive-news-page {
  background-color: #fff;
  color: #2b2323;
}

.archive-news {
  padding: 12rem 0 10rem;
}

.archive-news__inner {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 4rem;
}

.archive-news__list {
  margin-top: 6rem;
  border-top: 1px solid transparent;
}

.archive-news__empty {
  font-size: 1.6rem;
  text-align: center;
  padding: 4rem 0;
}


/* =================================
Paging
================================= */
.paging {
  margin-top: 5rem;
  width: 100%;
}

/* ul */
.paging .page-numbers {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* li */
.paging .page-numbers li {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* 共通 */
.paging .page-numbers a,
.paging .page-numbers span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4rem;
  height: 4rem;
  padding: 0 0.8rem;
  font-size: 1.6rem;
  line-height: 1;
  text-decoration: none;
  color: #2b2323;
  background: transparent;
  box-sizing: border-box;
  transition: color 0.3s, background-color 0.3s, border-color 0.3s;
}

/* 数字だけ枠線 */
.paging .page-numbers a:not(.prev):not(.next),
.paging .page-numbers span:not(.prev):not(.next):not(.dots) {
  border: 1px solid #2b2323;
}

/* 現在ページ */
.paging .page-numbers .current {
  background-color: #2339d6;
  color: #fff;
  border: 1px solid #2339d6;
  font-weight: 700;
}

/* 矢印 */
.paging .page-numbers .prev,
.paging .page-numbers .next {
  min-width: auto;
  height: auto;
  padding: 0 0.4rem;
  border: none;
  font-size: 2rem;
}

/* dots */
.paging .page-numbers .dots {
  min-width: auto;
  height: auto;
  padding: 0;
  border: none;
}

/* hover */
.paging .page-numbers a:not(.prev):not(.next):hover {
  border-color: #2339d6;
  color: #2339d6;
  background-color: #d1d9f4;
}

.paging .page-numbers a.prev:hover,
.paging .page-numbers a.next:hover {
  color: #2339d6;
}

/* SP */
@media screen and (max-width: 768px) {
  .paging {
    margin-top: 4rem;
  }

  .paging .page-numbers {
    gap: 0.5rem;
  }

  .paging .page-numbers a,
  .paging .page-numbers span {
    min-width: 3.5rem;
    height: 3.5rem;
    font-size: 1.4rem;
  }
}
/* ========================
contact
======================== */
.page-contact{
  margin-top: 120px;
}

.contact__container {
  max-width: 640px;
  margin: auto;
}

.sec-ttl_inner{
  text-align: center;
}


.contact-txts{
  margin: 50px auto 15px;
  padding:0 20px;
  max-width: 640px;
}

.contact-txt{
  line-height: 1.8;
  color: #333;
  font-size: 1.6rem;
  font-weight:normal;
  text-align-last: left;
  font-weight: bold;
  margin-bottom: 5px;
}

.contact_form{
  max-width: 700px;
  margin: 5px auto 70px;
  padding: 20px;
}

.CF7_table {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 600px;
  margin: auto;
}

.CF7_table tr {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-top: 15px;
  text-align: left;
  width: 100%;
}

.CF7_table th {
  font-weight: bold;
  font-size: 1.6rem;
  color: #333;
  margin: 16px 0 5px;
}

.CF7_table td {
  display: flex;
  flex-direction: column;
}

.CF7_table input,
.CF7_table textarea,
.CF7_table select {
  width: 100%;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 14px;
  background: #ffffff;
}

.CF7_table textarea {
  height: 200px;
  resize: vertical;
}

.wpcf7-form-control{
  letter-spacing: 1px;
}

.CF7_req{
  display: inline-flex;
  align-items: center;
  background: #0a1951;
  color: #fff;
  font-size: 12px;
  padding: 2px 11px 3px;
  border-radius:14px;
  margin-left: 20px;
  height: 22px;
  font-weight: bold;
}

.CF7_unreq{
  display: inline-flex;
  align-items: center;
  background: #fff;
  color:#242424;
  border:solid .8px  #1a510a;
  font-size: 12px;
  padding: 2px 11px 3px;
  border-radius:14px;
  margin-left: 20px;
  height: 22px;
}

/* ラジオボタンとチェックボックスのスタイル */
.wpcf7-list-item {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  align-items: center;
  margin: 8px 0 6px;
  font-size: 1.5rem;
  text-align: left;
}

.wpcf7-list-item input {
  width: auto;
  margin: 0 8px;
}

input, textarea {
  padding: 10px;
}

input:focus, textarea:focus {
  border-color: #35200b;
  box-shadow: 0 0 2px rgba(47, 26, 10, 0.5);
  outline: none;
}

.CF7_table td .checkbox-group {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.CF7_table td .checkbox-group label {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 14px;
  color: #333;
}

.cf7-cf-turnstile {
display: block;
margin: 0 auto;
text-align: center;
}

.CF7_btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 40px;
  width: 100%;
}

.info-top__btn_group{
  text-align: center;
  margin: 60px 0 30px;
}

.CF7_btn input[type="submit"] {
  color: #ffffff;
  background-color: #0b1cb6;
  padding: 13px 60px 14px 60px;
  border-radius: 25px;
  font-size: 1.4rem;
  font-weight: 600;
  position: relative;
  margin: 0 -10px 0 -20px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .2);
  transition: .3s;
  border: none;
  outline: none;
}

.CF7_btn input[type="submit"]:hover {
  opacity: 0.6;
}

.CF7_btn input[type="submit"]:disabled {
  background-color: #999;
}

.wpcf7-spinner {
  display: none !important;
}

.CF7_acceptance_wrap{
  margin:25px 0 55px 24px ;
}

.wpcf7-not-valid-tip{
  /* display: none !important; */
  margin: 8px 0;
  font-size: 1.5rem;
  font-weight: bold;
}

@media screen and (max-width:768px) {
  .contact-txt{
      font-size: 1.5rem;
  }

  .CF7_acceptance_wrap{
      margin:25px 0 55px -5px ;
    }
}

/* =================================
Single Works
================================= */
.single-works-page {
  background: linear-gradient(180deg, #02126A 0%, #0423D0 100%);
  color: #ffffff;
}

.single-works {
  padding: 7rem 0 10rem;
}

.single-works__inner {
  max-width: 980px;
  margin: 0 auto;
  padding: 0 4rem;
}

.single-works__article {
  color: #ffffff;
}

/* ===== META ===== */
.single-works__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.6rem;
  margin-bottom: 2.4rem;
}

.single-works__date {
  font-size: 1.6rem;
  color: rgba(255, 255, 255, 0.8);
}

.single-works__category {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  padding: 0.2rem 1.4rem;
  background-color: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.35);
  color: #fff;
  font-size: 1.4rem;
}

/* ===== TITLE ===== */
.single-works__title {
  font-size: 3.4rem;
  font-weight: 700;
  line-height: 1.5;
}

/* ===== THUMB ===== */
.single-works__thumbnail {
  margin-top: 3.6rem;
}

.single-works__thumbnail img {
  width: 100%;
  height: auto;
  display: block;
}

/* ===== CONTENT ===== */
.single-works__content {
  margin-top: 4rem;
  font-size: 1.7rem;
  line-height: 2;
}

.single-works__content p + p {
  margin-top: 1.4em;
}

.single-works__content h2,
.single-works__content h3,
.single-works__content h4 {
  margin-top: 2.2em;
  margin-bottom: 0.8em;
  line-height: 1.5;
}

.single-works__content h2 { font-size: 2.6rem; }
.single-works__content h3 { font-size: 2.2rem; }
.single-works__content h4 { font-size: 1.9rem; }

.single-works__content a {
  color: #ffffff;
  text-decoration: underline;
}

/* =================================
🔥 ギャラリー（ここが本命）
================================= */

/* WP標準ギャラリー強制上書き */
.single-works__content .wp-block-gallery,
.single-works__content .wp-block-gallery.has-nested-images,
.single-works__content .wp-block-gallery.is-layout-flex {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  margin-top: 4rem;
}

/* 余白リセット */
.single-works__content .wp-block-image {
  margin: 0 !important;
  width: 100% !important;
}

/* 画像 */
.single-works__content .wp-block-image img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
  border-radius: 6px;
}

/* ホバー */
.single-works__content .wp-block-image img:hover {
  opacity: 0.9;
  transform: translateY(-3px);
  transition: 0.3s;
}

/* ===== BACK BUTTON ===== */
.single-works__footer {
  margin-top: 6rem;
  text-align: center;
}

.single-works__back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20rem;
  min-height: 5.2rem;
  padding: 0.8rem 2.4rem;
  border: 1px solid #ffffff;
  color: #ffffff;
  font-size: 1.6rem;
  background-color: transparent;
  transition: 0.3s;
}

.single-works__back:hover {
  background-color: #ffffff;
  color: #0423D0;
}

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

  .single-works {
    padding: 3rem 0 7rem;
  }

  .single-works__inner {
    padding: 0 2rem;
  }

  .single-works__title {
    font-size: 2.5rem;
  }

  .single-works__content {
    font-size: 1.5rem;
  }

  /* 🔥 スマホは1列 */
  .single-works__content .wp-block-gallery,
  .single-works__content .wp-block-gallery.has-nested-images,
  .single-works__content .wp-block-gallery.is-layout-flex {
    grid-template-columns: 1fr !important;
    gap: 1.6rem;
  }

}

/* =================================
Archive Works
================================= */
.archive-works-page {
  background: linear-gradient(180deg, #02126A 0%, #0423D0 100%);
  color: #ffffff;
}

.archive-works {
  padding: 7rem 0 10rem;
}

.archive-works__inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 4rem;
}

.archive-works__list {
  margin-top: 6rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
}

.archive-works__item {
  border: 1px solid rgba(255, 255, 255, 0.18);
  background-color: rgba(255, 255, 255, 0.06);
  transition: transform 0.3s ease, background-color 0.3s ease, opacity 0.3s ease;
}

.archive-works__item:hover {
  transform: translateY(-4px);
  background-color: rgba(255, 255, 255, 0.1);
}

.archive-works__link {
  display: grid;
  grid-template-columns: 280px 1fr;
  color: inherit;
  text-decoration: none;
}

.archive-works__thumbnail {
  overflow: hidden;
}

.archive-works__thumbnail img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 220px;
  object-fit: cover;
}

.archive-works__body {
  padding: 2.4rem 2.8rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.archive-works__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.2rem;
  margin-bottom: 1.6rem;
}

.archive-works__date {
  font-size: 1.5rem;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.8);
}

.archive-works__category {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  padding: 0.2rem 1.2rem;
  background-color: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.35);
  color: #fff;
  font-size: 1.3rem;
  font-weight: 500;
  line-height: 1.2;
  text-align: center;
}

.archive-works__title {
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.6;
  color: #ffffff;
}

.archive-works__empty {
  margin-top: 6rem;
  font-size: 1.6rem;
  text-align: center;
  color: rgba(255, 255, 255, 0.9);
}

/* =================================
Paging（Archive Works用上書き）
================================= */
.archive-works__paging {
  margin-top: 5rem;
}

.archive-works__paging .page-numbers a,
.archive-works__paging .page-numbers span {
  color: #ffffff;
}

.archive-works__paging .page-numbers a:not(.prev):not(.next),
.archive-works__paging .page-numbers span:not(.prev):not(.next):not(.dots) {
  border: 1px solid #ffffff;
}

.archive-works__paging .page-numbers .current {
  background-color: #ffffff;
  color: #0423D0;
  border: 1px solid #ffffff;
  font-weight: 700;
}

.archive-works__paging .page-numbers a:not(.prev):not(.next):hover {
  border-color: #ffffff;
  color: #0423D0;
  background-color: rgba(255, 255, 255, 0.9);
}

.archive-works__paging .page-numbers a.prev:hover,
.archive-works__paging .page-numbers a.next:hover {
  color: #ffffff;
  opacity: 0.75;
}

/* =================================
SP
================================= */
@media screen and (max-width: 768px) {
  .archive-works {
    padding: 3rem 0 7rem;
  }

  .archive-works__inner {
    padding: 0 2rem;
  }

  .archive-works__list {
    margin-top: 4rem;
    gap: 2rem;
  }

  .archive-works__link {
    grid-template-columns: 1fr;
  }

  .archive-works__thumbnail img {
    min-height: auto;
    aspect-ratio: 4 / 3;
  }

  .archive-works__body {
    padding: 1.8rem 1.6rem 2rem;
  }

  .archive-works__meta {
    gap: 1rem;
    margin-bottom: 1.2rem;
  }

  .archive-works__date {
    font-size: 1.4rem;
  }

  .archive-works__category {
    font-size: 1.2rem;
    min-height: 2.8rem;
    padding: 0.2rem 1rem;
  }

  .archive-works__title {
    font-size: 1.9rem;
    line-height: 1.6;
  }

  .archive-works__paging {
    margin-top: 4rem;
  }
}