@charset "UTF-8";

/* Google Fonts - Noto Serif JP */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');

/* ローダーを非表示 */
.loader {
  display: none;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

/* ファーストビューを確実に表示 */
.page-wrapper .home_hero {
  opacity: 1;
  visibility: visible;
}

.page-wrapper .home_hero .home_hero_text {
  opacity: 1;
  visibility: visible;
  transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
}

.page-wrapper .home_hero .home_card {
  opacity: 1;
  visibility: visible;
  transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
}

/* ビデオ背景を表示 */
.page-wrapper .home_hero .home_video {
  opacity: 1;
  visibility: visible;
}

/* 画像オーバーレイを非表示（アニメーション用だったもの） */
.image-wipe {
  display: none;
}

/* スタッフ紹介セクションを確実に表示 */
.home-team {
  position: relative;
  z-index: 10;
  background-color: #fff;
}

/* お客様の声セクションの背景を確実に表示 */
.home-testimonials {
  position: relative;
  z-index: 10;
}

/* お客様の声 - レビューカードスライダー */
.review-slider-container-7291 {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 20px;
  position: relative;
}

.review-slider-wrapper-7291 {
  overflow: hidden;
  position: relative;
}

.review-slider-track-7291 {
  display: flex;
  transition: transform 0.5s ease;
  gap: 20px;
}

.review-card-7291 {
  flex: 0 0 calc(33.333% - 14px);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 12px;
  padding: 30px;
  box-sizing: border-box;
  backdrop-filter: blur(10px);
}

.review-attr-7291 {
  font-size: 0.85rem;
  color: #999;
  margin-bottom: 12px;
}

.review-stars-7291 {
  font-size: 1.2rem;
  color: #ffd700;
  margin-bottom: 15px;
  letter-spacing: 2px;
}

.review-title-7291 {
  font-size: 1.1rem;
  font-weight: 600;
  color: #fff;
  margin: 0 0 15px 0;
  line-height: 1.5;
}

.review-text-7291 {
  font-size: 0.9rem;
  color: #bbb;
  line-height: 1.8;
  margin: 0;
}

.review-slider-nav-7291 {
  display: flex;
  justify-content: center;
  gap: 15px;
  margin-top: 30px;
}

.review-prev-7291,
.review-next-7291 {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: transparent;
  color: #fff;
  font-size: 1.2rem;
  cursor: pointer;
  transition: all 0.3s ease;
}

.review-prev-7291:hover,
.review-next-7291:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.5);
}

/* レスポンシブ - タブレット */
@media screen and (max-width: 992px) {
  .review-card-7291 {
    flex: 0 0 calc(50% - 10px);
  }
}

/* レスポンシブ - スマートフォン */
@media screen and (max-width: 576px) {
  .review-card-7291 {
    flex: 0 0 100%;
  }

  .review-slider-container-7291 {
    padding: 30px 15px;
  }

  .review-card-7291 {
    padding: 25px;
  }

  .review-title-7291 {
    font-size: 1rem;
  }
}

/* スライダーを確実に表示 */
.process-slider.w-slider {
  opacity: 1;
  visibility: visible;
}

.process-slider .w-slider-mask {
  overflow: visible;
}

.process-slider .slide,
.process-slider .w-slide {
  opacity: 1;
  visibility: visible;
}

/* トップ背景画像 */
.home-hero-image-5827 {
  width: 100%;
  height: 100%;
}

.home-hero-image-5827 picture {
  display: block;
  width: 100%;
  height: 100%;
}

.hero-bg-image-5827 {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* ヘッダーロゴを変更 */
.nav-logo-black,
.nav-logo-black.desktop,
.nav-logo-black.desktop.w--current,
.nav-logo-black.mobile,
.nav-logo-black.mobile.w--current {
  background-image: url("../images/common/header-logo-black.svg");
}

/* nav-logo-whiteの背景画像もblackに変更（念のため） */
.nav-logo-white,
.nav-logo-white.w--current {
  background-image: url("../images/common/header-logo-black.svg");
}

/* メニューアニメーション */
.navbar .open-nav-container {
  display: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.navbar .open-nav-container.is-open {
  display: flex;
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* メニュー内リンクのアニメーション */
.navbar .open-nav-container .open-nav-links .link-1,
.navbar .open-nav-container .open-nav-links .link-2,
.navbar .open-nav-container .open-nav-links .link-3,
.navbar .open-nav-container .open-nav-links .link-4 {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.navbar .open-nav-container.is-open .open-nav-links .link-1 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.15s;
}

.navbar .open-nav-container.is-open .open-nav-links .link-2 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.25s;
}

.navbar .open-nav-container.is-open .open-nav-links .link-3 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.35s;
}

.navbar .open-nav-container.is-open .open-nav-links .link-4 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.45s;
}

/* すべての要素を表示（ローダー削除後の対応） */
.page-wrapper [style*="opacity: 0"],
.page-wrapper [style*="opacity:0"] {
  opacity: 1;
  visibility: visible;
  transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
}

/* 各セクションを確実に表示 */
.page-wrapper h2,
.page-wrapper h3,
.page-wrapper .reveal-type,
.page-wrapper .intro-body,
.page-wrapper .logo-carousel-wrapper,
.page-wrapper .process-slider,
.page-wrapper .process-slider-text,
.page-wrapper .mask-container,
.page-wrapper .left-arrow,
.page-wrapper .right-arrow,
.page-wrapper .slide-nav,
.page-wrapper .property,
.page-wrapper .main-testimonial,
.page-wrapper .secondary-testimonial,
.page-wrapper .team-member,
.page-wrapper .cta-section,
.page-wrapper .services-grid,
.page-wrapper .about-section,
.page-wrapper .features-section,
.page-wrapper .stats-section,
.page-wrapper .gallery-section,
.page-wrapper .contact-section,
.page-wrapper section,
.page-wrapper article,
.page-wrapper aside {
  opacity: 1;
  visibility: visible;
  transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
}

/* フォントを全体に適用 */
html,
body,
h1, h2, h3, h4, h5, h6,
p, span, a, li, div,
input, textarea, select, button {
  font-family: 'Noto Serif JP', serif;
}

/* 地図セクション */
.map-section-8471 {
  width: 100%;
  margin: 0;
  padding: 0;
  line-height: 0;
}

.map-section-8471 iframe {
  width: 100%;
  height: 400px;
  border: 0;
  filter: grayscale(100%);
  display: block;
}

@media screen and (max-width: 768px) {
  .map-section-8471 iframe {
    height: 300px;
  }
}

/* フッターセクション */
.footer-section-3842 {
  width: 100%;
  box-sizing: border-box;
  background-color: #1a1a1a;
  padding: 60px 5% 0;
}

.footer-inner-3842 {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 40px;
}

/* 左側：ロゴと文章 */
.footer-left-3842 {
  flex: 1;
  min-width: 250px;
  max-width: 300px;
}

.footer-logo-3842 {
  width: 180px;
  height: auto;
  margin-bottom: 20px;
}

.footer-desc-3842 {
  font-size: 0.9rem;
  line-height: 1.8;
  color: #ccc;
}

/* 中央：リンク3列 */
.footer-center-3842 {
  flex: 2;
  display: flex;
  justify-content: center;
  gap: 60px;
  min-width: 300px;
}

.footer-nav-col-3842 {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.footer-nav-title-3842 {
  font-size: 0.85rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.footer-nav-link-3842 {
  font-size: 0.9rem;
  color: #aaa;
  text-decoration: none;
  transition: color 0.3s ease;
}

.footer-nav-link-3842:hover {
  color: #fff;
}

/* 右側：会社情報 */
.footer-right-3842 {
  flex: 1;
  min-width: 200px;
  max-width: 280px;
  text-align: right;
}

.footer-company-name-3842 {
  font-size: 1rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 15px;
}

.footer-company-info-3842 {
  font-size: 0.85rem;
  line-height: 1.9;
  color: #ccc;
}

.footer-company-info-3842 a {
  color: #ccc;
  text-decoration: none;
  transition: color 0.3s ease;
}

.footer-company-info-3842 a:hover {
  color: #fff;
}

/* コピーライト */
.footer-copyright-3842 {
  max-width: 1200px;
  margin: 0 auto;
  padding: 30px 0;
  margin-top: 40px;
  border-top: 1px solid #333;
  text-align: center;
  font-size: 0.8rem;
  color: #888;
}

/* レスポンシブ */
@media screen and (max-width: 992px) {
  .footer-inner-3842 {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .footer-left-3842 {
    max-width: 100%;
    text-align: center;
  }

  .footer-logo-3842 {
    margin: 0 auto 20px;
  }

  .footer-center-3842 {
    justify-content: center;
  }

  .footer-right-3842 {
    max-width: 100%;
    text-align: center;
  }
}

@media screen and (max-width: 576px) {
  .footer-section-3842 {
    padding: 40px 5% 0;
  }

  .footer-center-3842 {
    flex-direction: column;
    gap: 30px;
    align-items: center;
  }

  .footer-nav-col-3842 {
    align-items: center;
  }
}

/* 動画背景 */
.hero-bg-video-5827 {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.mask-video {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.mask-video .bg-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ヘッダーロゴの重複を防ぐ - スマホ時はnav-logo-whiteを非表示、nav-logo-blackを表示 */
@media screen and (max-width: 768px) {
  .navbar .navbar-container a.nav-logo-white,
  .navbar .navbar-container a.nav-logo-white.w--current,
  .navbar .navbar-container a.nav-logo-white.w-inline-block {
    display: none;
  }
  
  .navbar .navbar-container a.nav-logo-black,
  .navbar .navbar-container a.nav-logo-black.w--current,
  .navbar .navbar-container a.nav-logo-black.w-inline-block {
    display: block;
  }
}

/* ヒーローセクションのテキストを画面の真ん中に配置 */
.home_hero .home_hero_text {
  justify-content: center;
}

@media screen and (max-width: 768px) {
  .home_hero .home_hero_text {
    justify-content: center;
    align-items: center;
    text-align: center;
  }
  
  .home_hero .home_hero_text h1 {
    text-align: center;
  }
  
  .home_hero .home_hero_text .hero_body_container {
    text-align: center;
  }
}

/* 「創業以来...」のテキストをスマホで非表示 */
@media screen and (max-width: 768px) {
  .home_card .card-text-container .body-small {
    display: none;
  }
}

/* ヒーローセクション内のロゴをスマホで非表示 */
@media screen and (max-width: 768px) {
  .home_hero_text .logo_symbol {
    display: none;
  }
}

/* ロゴカルーセルをスマホで2列表示 */
@media screen and (max-width: 768px) {
  .home-logos {
    padding-left: 5%;
    padding-right: 5%;
    box-sizing: border-box;
  }
  
  .logo-carousel {
    width: 100%;
    max-width: 100%;
    padding: 0;
    box-sizing: border-box;
  }
  
  .logo-carousel-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    width: 100%;
    box-sizing: border-box;
  }
  
  .logo-carousel-wrapper .featured-logo {
    min-width: auto;
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
  }
}