html {
        scroll-behavior: smooth;
      }

      body {
        font-family: "Noto Sans JP", sans-serif;
        color: #333;
        background-color: #fff;
        scroll-behavior: smooth;
      }

      header {
        background-color: #0d1b2a;
        color: #fff;
      }

      .navbar-brand {
        font-weight: 700;
        letter-spacing: 0.05em;
      }

      .hero {
        background: url("https://iplusone.co.jp/storage/gallery/blog/2025/10/10/techo-bg.jpg") center/cover no-repeat;
        color: white;
        text-align: center;
        padding: 160px 20px;
        position: relative;
      }

      .hero::after {
        content: "";
        position: absolute;
        inset: 0;
        background: rgba(0, 0, 0, 0.45);
      }

      .hero h1,
      .hero p {
        position: relative;
        z-index: 2;
      }

      .concept-card {
        transition: transform 0.3s;
        border: none;
        border-radius: 1rem;
      }

      .concept-card:hover {
        transform: translateY(-6px);
      }

      footer {
        background-color: #0d1b2a;
        color: #fff;
        padding: 30px 0;
        font-size: 0.9rem;
      }

      .section-title {
        font-weight: 700;
        font-size: 1.8rem;
        margin-bottom: 1.5rem;
        text-align: center;
        color: #0d1b2a;
      }

      .btn-main {
        background-color: #1b4965;
        color: #fff;
        border-radius: 50px;
        padding: 10px 30px;
        font-weight: 600;
      }

      .btn-main:hover {
        background-color: #163d56;
        color: #fff;
      }

      #hero-carousel .carousel-caption {
        background: rgba(0, 0, 0, 0.45);
        border-radius: 1rem;
        padding: 2rem;
      }
      #hero-carousel h1 {
        font-size: 2.2rem;
      }
      .btn-main {
        background-color: #1b4965;
        color: #fff;
        border-radius: 50px;
        padding: 10px 30px;
        font-weight: 600;
      }
      .btn-main:hover {
        background-color: #163d56;
        color: #fff;
      }

      #problems .list-group-item {
        font-size: 1.05rem;
        background: #fff;
        border: none;
        border-bottom: 1px solid #eee;
      }
      #problems .list-group-item:last-child {
        border-bottom: none;
      }
      #problems .list-group-item::before {
        content: "✔";
        color: #1b4965;
        font-weight: bold;
        margin-right: 10px;
      }

      #about2 .card {
        border-radius: 1rem;
        transition: transform 0.25s ease, box-shadow 0.25s ease;
      }
      #about2 .card:hover {
        transform: translateY(-4px);
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
      }
      #about2 .card-header {
        font-size: 1.25rem;
        letter-spacing: 0.05em;
        border-bottom: none;
      }
      #about2 .card-body {
        border-top: 4px solid #f7b731; /* ゴールドライン */
      }
      #about2 p {
        font-size: 1rem;
        line-height: 1.7;
        color: #444;
      }
      #about2 h5 {
        color: #224488;
      }

      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-family: "Noto Sans JP", sans-serif;
        font-weight: 700;
      }
      p,
      li {
        font-family: "Noto Sans JP", sans-serif;
        font-weight: 400;
      }

      #founder-story {
        background: linear-gradient(180deg, #fff, #f9f9f9);
      }
      #founder-story .col-md-5 img {
        border: 6px solid #f2f2f2;
        border-radius: 1rem;
      }
      #founder-story .p-3 {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
      }
      #founder-story ul li {
        margin-bottom: 0.6rem;
      }
      #founder-story i.fa-arrow-down {
        animation: bounce 1.5s infinite;
      }
      @keyframes bounce {
        0%,
        100% {
          transform: translateY(0);
        }
        50% {
          transform: translateY(6px);
        }
      }

      @media (max-width: 768px) {
        [style*="background-attachment: fixed"] {
          background-attachment: scroll !important;
        }
      }

      /* スマホ向け画像フィット調整 */
      @media (max-width: 768px) {
        /* カルーセル画像を画面にフィット */
        #hero-carousel .carousel-item img {
          width: 100%;
          height: auto;
          object-fit: cover;
        }

        /* パララックス背景（fixed無効化） */
        [style*="background-attachment: fixed"] {
          background-attachment: scroll !important;
          background-size: cover !important;
          background-position: center center !important;
        }

        /* セクション画像の幅を強制100% */
        section img.img-fluid {
          max-width: 100% !important;
          height: auto !important;
        }

        /* hero文字サイズの微調整 */
        #hero-carousel h1 {
          font-size: 1.6rem !important;
        }
        #hero-carousel p {
          font-size: 1rem !important;
        }
      }

      /* iPhone SEなど極小端末にも対応 */
      @media (max-width: 480px) {
        .carousel-caption {
          padding: 1rem !important;
        }
        .carousel-caption h1 {
          font-size: 1.4rem !important;
        }
        .carousel-caption p {
          font-size: 0.9rem !important;
        }
      }

      /* 初期状態：非表示＋透明 */
      .fade-section {
        opacity: 0;
        transform: translateY(30px);
        transition: opacity 0.8s ease, transform 0.8s ease;
      }

      /* 表示状態 */
      .fade-section.visible {
        opacity: 1;
        transform: translateY(0);
      }

      #contact form .form-control {
        border-radius: 0.5rem;
        border: 1px solid #ccc;
        padding: 0.75rem 1rem;
        font-size: 1rem;
      }

      #contact form .form-control:focus {
        border-color: #1b4965;
        box-shadow: 0 0 0 0.2rem rgba(27, 73, 101, 0.25);
      }

      #contact button.btn-main {
        background-color: #1b4965;
        color: #fff;
        border-radius: 50px;
        padding: 10px 30px;
        font-weight: 600;
      }

      #contact button.btn-main:hover {
        background-color: #163d56;
      }


    /* スタイル調整 */
      /* PC（デフォルト） */
      .display-text {
        font-size: 2rem;
        line-height: 1.6;
      }
      .lead-text {
        font-size: 1.25rem;
        line-height: 1.8;
        color: #f8f5f6;
        font-weight: 600;
      }

      /* タブレット以下 */
      @media (max-width: 992px) {
        section[style*="mentor_maching_1200x800"] {
          height: 360px;
          background-attachment: scroll !important; /* iOS対策 */
        }
        .display-text {
          font-size: 1.4rem;
          line-height: 1.5;
        }
        .lead-text {
          font-size: 1rem;
          line-height: 1.6;
        }
      }

      /* スマートフォン */
      @media (max-width: 576px) {
        section[style*="mentor_maching_1200x800"] {
          height: auto;
          padding: 3rem 1rem;
        }
        .display-text {
          font-size: 1.1rem;
          line-height: 1.5;
        }
        .lead-text {
          font-size: 0.9rem;
          line-height: 1.6;
        }
      }
.section-title {
    border-bottom: 3px solid #d45a1e;
    padding-bottom: .5rem;
}
#page-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  font-size: 14px;
  line-height: 1;
  z-index: 99;
}
#page-top a {
  background: #ab101b;
  text-decoration: none;
  color: #fff;
  width: 70px;
  padding: 28px 5px;
  text-align: center;
  display: block;
  border-radius: 90px;
  opacity: 0.9;
  transition: all .3s ease;
}
#page-top a:hover {
  text-decoration: none;
  opacity: .5;
}