/* TOP hero photo-swap design
   写真差し替え用: images/top/hero-main.jpg
   スモーク固定演出: images/top/hero-smoke-overlay.png
*/
:root{
  --hero-photo:url("../images/top/hero-main.jpg");
  --hero-smoke:url("../images/top/hero-smoke-overlay.png");
}

body.modern-home-page{
  background:#fafafa !important;
}

.home-hero-menu{
  position:relative;
  overflow:hidden;
  padding:24px 18px 44px;
  background:#fafafa;
}

.home-hero-menu__inner{
  width:min(1200px, calc(100vw - 36px));
  margin-inline:auto;
  position:relative;
  z-index:2;
}

.home-hero-menu__bg{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:none;
}

.home-photo-hero{
  position:relative;
  min-height:clamp(510px, 58vw, 690px);
  border-radius:28px 28px 0 0;
  overflow:hidden;
  isolation:isolate;
  background:#f7fafb;
  box-shadow:0 24px 60px rgba(17,35,61,.14);
}

.home-photo-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-4;
  background:
    linear-gradient(90deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.90) 25%, rgba(255,255,255,.34) 53%, rgba(255,255,255,.12) 100%),
    linear-gradient(180deg, rgba(255,255,255,.04) 0%, rgba(255,255,255,.12) 68%, rgba(245,250,252,.96) 100%),
    var(--hero-photo) center right / cover no-repeat;
  filter:saturate(1.04) contrast(1.03);
}

.home-photo-hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    var(--hero-smoke) center / cover no-repeat,
    linear-gradient(117deg, rgba(255,255,255,0) 0 56%, rgba(255,255,255,.52) 56.4% 60.4%, rgba(13,65,110,.30) 60.8% 64.7%, rgba(32,154,175,.34) 65.2% 69.6%, rgba(184,213,64,.34) 70% 73%, rgba(255,255,255,0) 73.4%),
    radial-gradient(circle at 72% 46%, rgba(59,132,186,.20), transparent 31%),
    linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.46) 74%, #f7fbfd 100%);
  mix-blend-mode:normal;
}

.home-photo-hero__visual{
  position:absolute;
  right:0;
  top:0;
  bottom:0;
  width:64%;
  z-index:-2;
}

.home-photo-hero__visual::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.02), rgba(255,255,255,0)),
    radial-gradient(circle at 56% 34%, rgba(255,255,255,.38), transparent 30%);
}

.home-photo-hero__copy{
  width:min(470px, 48%);
  padding:78px 0 0 64px;
  color:#0f2a4b;
  text-align:center;
  position:relative;
  z-index:12;
  isolation:isolate;
}

.home-photo-hero__title{
  margin:0;
  color:#0b2b4c;
  font-family:"Yu Mincho","Hiragino Mincho ProN","YuMincho",serif !important;
  font-weight:800;
  letter-spacing:.08em;
  line-height:1;
  text-shadow:0 8px 24px rgba(255,255,255,.68);
  text-align:center;
}

.home-photo-hero__line{
  display:block;
  white-space:nowrap;
  text-align:center;
}

.home-photo-hero__title span{
  display:block;
}

.home-photo-hero__line--small,
.home-photo-hero__title span.home-photo-hero__line--small{
  font-size:clamp(1.65rem, 2.8vw, 2.6rem);
  line-height:1.08;
  margin:0 auto;
}

.home-photo-hero__line--mono,
.home-photo-hero__title span.home-photo-hero__line--mono{
  margin:.08em auto .04em;
  font-size:clamp(3.0rem, 5.05vw, 5.55rem);
  line-height:1.02;
  letter-spacing:.035em;
}

.home-photo-hero__line--create,
.home-photo-hero__title span.home-photo-hero__line--create{
  margin:.04em auto 0;
  font-size:clamp(3.45rem, 5.8vw, 6.35rem);
  line-height:1;
  letter-spacing:.06em;
}

.home-photo-hero__title strong{
  display:block;
  font-size:clamp(2.85rem, 5.2vw, 5.9rem);
  line-height:1.05;
  font-weight:800;
}

.home-photo-hero__en{
  margin:20px auto 12px;
  color:#7e9c1e;
  font-size:.78rem;
  line-height:1.7;
  font-weight:900;
  letter-spacing:.16em;
  text-align:center;
}

.home-photo-hero__text{
  position:relative;
  z-index:30;
  display:block;
  width:max-content;
  max-width:100%;
  margin:0 auto 0;
  padding:15px 26px 16px;
  color:#001f3d;
  font-weight:900;
  font-size:1.06rem;
  line-height:1.7;
  letter-spacing:.065em;
  text-align:left;
  background:#fff;
  border-left:4px solid rgba(152,184,31,.9);
  border-radius:0 14px 14px 0;
  box-shadow:0 0 0 1px rgba(255,255,255,.96), 0 14px 32px rgba(8,32,58,.16);
  text-shadow:none;
  backdrop-filter:none;
  filter:none;
  opacity:1;
  mix-blend-mode:normal;
}

.home-photo-hero__text::before{
  display:none;
}

.home-photo-hero__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  min-height:48px;
  padding:0 24px;
  border-radius:6px;
  background:linear-gradient(135deg,#0f2d50,#073462);
  color:#fff !important;
  font-weight:900;
  box-shadow:0 16px 30px rgba(9,35,71,.22);
}

.home-photo-hero__btn::after{
  content:"→";
  color:#b8d540;
  font-size:1.25rem;
  line-height:1;
}

.home-photo-hero__btn:hover{
  transform:translateY(-3px);
  box-shadow:0 20px 36px rgba(9,35,71,.28);
}

.home-menu-panel{
  position:relative;
  margin-top:-132px;
  z-index:4;
  padding:0 44px 20px;
}

.home-menu-panel::before{
  content:"";
  position:absolute;
  left:0;right:0;top:-46px;height:214px;
  z-index:-1;
  background:
    linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(246,251,253,.22) 22%, rgba(247,250,252,.82) 62%, rgba(247,250,252,.98) 100%);
  backdrop-filter:none;
  pointer-events:none;
}

.home-menu-head{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 0 16px;
}

.home-menu-label{
  margin:0;
  color:#87a320;
  font-size:1.34rem;
  line-height:1;
  font-weight:950;
  letter-spacing:.18em;
}

.home-menu-label::before,
.home-menu-label::after{
  content:"";
  display:inline-block;
  width:82px;
  height:1px;
  margin:0 18px 6px;
  background:linear-gradient(90deg, transparent, rgba(135,163,32,.7));
}
.home-menu-label::after{
  background:linear-gradient(90deg, rgba(135,163,32,.7), transparent);
}

.home-menu-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.home-menu-card{
  --mx:50%;
  --my:50%;
  position:relative;
  min-height:154px;
  overflow:hidden;
  border-radius:18px;
  padding:24px 178px 20px 24px;
  background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.88));
  border:1px solid rgba(220,229,238,.94);
  box-shadow:0 16px 32px rgba(12,26,49,.10);
  isolation:isolate;
  transform:translateZ(0);
  transition:transform .42s cubic-bezier(.16,1,.3,1), box-shadow .42s cubic-bezier(.16,1,.3,1), border-color .42s ease;
}

.home-menu-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    radial-gradient(circle at var(--mx) var(--my), rgba(184,213,64,.28), transparent 24%),
    linear-gradient(90deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.94) 44%, rgba(255,255,255,.62) 64%, rgba(255,255,255,.08) 100%);
  opacity:.96;
  transition:opacity .35s ease;
}

.home-menu-card::after{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  bottom:0;
  height:3px;
  background:linear-gradient(90deg,#98b81f,#2aa9c0,transparent);
  transform:scaleX(.18);
  transform-origin:left;
  opacity:.62;
  transition:transform .42s cubic-bezier(.16,1,.3,1), opacity .42s ease;
}

.home-menu-card:hover{
  transform:translateY(-9px) scale(1.018);
  border-color:rgba(152,184,31,.62);
  box-shadow:0 28px 48px rgba(12,26,49,.20);
}

.home-menu-card:hover::after{
  transform:scaleX(1);
  opacity:1;
}

.home-menu-card__icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:999px;
  background:linear-gradient(135deg,#11375f,#0c2444);
  border:3px solid rgba(184,213,64,.88);
  box-shadow:0 8px 18px rgba(8,30,62,.16);
  margin-bottom:9px;
  transition:transform .42s cubic-bezier(.16,1,.3,1), box-shadow .42s ease, background .42s ease;
}

.home-menu-card:hover .home-menu-card__icon{
  transform:rotate(-8deg) scale(1.14);
  background:linear-gradient(135deg,#98b81f,#0d4f82);
  box-shadow:0 14px 24px rgba(8,30,62,.25), 0 0 0 8px rgba(184,213,64,.16);
}

.home-menu-card__icon svg{
  width:25px;
  height:25px;
  fill:none;
  stroke:#fff;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.home-menu-card__icon--business{background:linear-gradient(135deg,#109da4,#0d5675);}
.home-menu-card__icon--equipment{background:linear-gradient(135deg,#9dbe22,#577817);}
.home-menu-card__icon--movie{background:linear-gradient(135deg,#124d86,#0a2d50);}
.home-menu-card__icon--works{background:linear-gradient(135deg,#1b6d91,#0d3c61);}
.home-menu-card__icon--contact{background:linear-gradient(135deg,#90ad16,#607c11);}

.home-menu-card__body{
  position:relative;
  z-index:2;
}

.home-menu-card h3{
  margin:0 0 8px;
  color:#0b2b4c;
  font-size:1.27rem;
  line-height:1.3;
  font-weight:900;
  letter-spacing:.05em;
}

.home-menu-card p{
  margin:0 0 12px;
  color:#50647b;
  font-size:.9rem;
  line-height:1.75;
  font-weight:700;
}

.home-menu-card__link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#5d7919;
  font-size:.82rem;
  font-weight:900;
}

.home-menu-card__link::before{
  content:"";
  width:18px;height:18px;border-radius:999px;
  border:1px solid rgba(135,163,32,.72);
  background:rgba(255,255,255,.72);
  transition:background .35s ease, transform .35s ease;
}
.home-menu-card__link::after{
  content:"→";
  margin-left:-23px;
  color:#7fa01b;
  font-size:.8rem;
  width:18px;
  text-align:center;
  transition:transform .35s cubic-bezier(.16,1,.3,1), color .35s ease;
}

.home-menu-card:hover .home-menu-card__link::before{
  background:#98b81f;
  transform:scale(1.12);
}

.home-menu-card:hover .home-menu-card__link::after{
  color:#fff;
  transform:translateX(3px);
}

.home-menu-card img{
  position:absolute;
  right:0;
  top:0;
  width:47%;
  height:100%;
  object-fit:cover;
  z-index:0;
  filter:saturate(1.02) contrast(1.02);
  opacity:.94;
  transform:scale(1.01);
  transition:transform .65s cubic-bezier(.16,1,.3,1), filter .65s ease, opacity .65s ease;
}

.home-menu-card:hover img{
  transform:scale(1.11) translateX(-5px);
  filter:saturate(1.16) contrast(1.08);
  opacity:1;
}

.home-menu-card:nth-child(2) img,
.home-menu-card:nth-child(4) img{
  object-position:center;
}

.home-menu-card:nth-child(5) img{
  object-position:center;
}

.home-menu-card:nth-child(6) img{
  object-position:center;
}

.home-menu-card img::selection{background:transparent;}

.home-hero-menu + .strength-section{
  margin-top:0;
}

@media (max-width: 1100px){
  .home-photo-hero__copy{width:52%;padding-left:42px;}
  .home-menu-panel{padding-inline:24px;}
  .home-menu-card{padding-right:142px;}
}

@media (max-width: 900px){
  .home-photo-hero{
    min-height:720px;
    border-radius:24px 24px 0 0;
  }
  .home-photo-hero::before{
    background:
      linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(255,255,255,.65) 48%, rgba(255,255,255,.95) 100%),
      var(--hero-photo) center right / cover no-repeat;
  }
  .home-photo-hero__copy{
    width:auto;
    padding:42px 28px 0;
  }
  .home-menu-panel{margin-top:-170px;padding-inline:18px;}
  .home-menu-grid{grid-template-columns:1fr;}
  .home-menu-card{min-height:144px;padding-right:44%;}
  .home-menu-card img{width:42%;}
}

@media (max-width: 620px){
  .home-hero-menu{padding-inline:12px;}
  .home-hero-menu__inner{width:100%;}
  .home-photo-hero{min-height:620px;border-radius:20px 20px 0 0;}
  .home-photo-hero__line--mono,
  .home-photo-hero__title span.home-photo-hero__line--mono{font-size:2.58rem;}
  .home-photo-hero__line--create,
  .home-photo-hero__title span.home-photo-hero__line--create{font-size:3.1rem;}
  .home-photo-hero__text{font-size:.93rem;line-height:1.85;padding:14px 16px 15px 16px;}
  .home-photo-hero__btn{min-height:44px;font-size:.9rem;}
  .home-menu-panel{padding-inline:10px;}
  .home-menu-card{padding:18px 130px 18px 18px;min-height:146px;}
  .home-menu-card img{width:126px;}
  .home-menu-card h3{font-size:1.12rem;}
  .home-menu-card p{font-size:.82rem;}
  .home-menu-label::before,.home-menu-label::after{width:42px;margin-inline:10px;}
}


/* 2026-09-22: トップページのスモーク演出をさらに弱める */
.home-photo-hero::after{
  background:
    var(--hero-smoke) center / cover no-repeat,
    linear-gradient(117deg,
      rgba(255,255,255,0) 0 56%,
      rgba(255,255,255,.12) 56.4% 60.4%,
      rgba(13,65,110,.08) 60.8% 64.7%,
      rgba(32,154,175,.09) 65.2% 69.6%,
      rgba(184,213,64,.09) 70% 73%,
      rgba(255,255,255,0) 73.4%),
    radial-gradient(circle at 72% 46%, rgba(59,132,186,.05), transparent 31%),
    linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.18) 74%, #f7fbfd 100%) !important;
  opacity:.48;
}