.biz-head{
  padding: 140px 0 40px;
}
@media (max-width: 768px){
  .biz-head{
    padding: 100px 0 20px;
  }
}
.biz-title { 
  font-family: Oswald, sans-serif; 
  font-size: clamp(32px,6vw,64px); 
  text-align:center;
  margin: 0 0 4px; 
}
.biz-sub { 
  display: block;
  font-size: clamp(18px, 3vw, 24px);
  font-size: 1.25rem;
  text-align:center; 
  color: var(--line2);
  margin:0 0 40px; 
}

.biz-localnav{ 
  overflow-y: hidden;  /* 縦スクロールを防ぐ */
  overflow-x:auto; 
}

.biz-tabs { 
  display:flex; 
  gap:12px; 
  padding: 0; 
  white-space: nowrap; 
  margin: 0; /* マージンが余分にないか確認 */
  height: auto; /* 高さを自動に */
  white-space: nowrap;
}
.biz-localnav .biz-tabs{
  overflow-x: auto;
  -webkit-overflow-scrolling: touch; /* iOSでスムーズスクロール */
  scrollbar-width: none; /* Firefox: スクロールバー非表示 */
}
.biz-localnav .biz-tabs::-webkit-scrollbar {
  display: none; /* Chrome, Safari: スクロールバー非表示 */
}
.biz-tabs li { 
  display: flex;
  list-style:none; 
  flex: 1 1 20%;
}
.biz-tabs a {
  display:flex; 
  padding:10px 16px; 
  border:1px solid var(--black); 
  border-radius:14px;
  text-decoration:none; 
  background:#fff; 
  transition:transform .1s ease;
  margin: 0;
  position: relative;
  width: 100%;
}
.biz-tabs a p{
  margin: 0;
}
.biz-arrow {
  position: absolute;
  bottom: 8px;
  right: 8px;
  width: 1.6em;
  height: 1.6em;
  transform: rotate(-45deg); 
  background-color: currentColor;
  -webkit-mask: url("../img/icon-arrow.svg") no-repeat center;
  -webkit-mask-size: contain;
  mask: url("../img/icon-arrow.svg") no-repeat center;
  mask-size: contain;
  transition: transform 0.3s ease;
}

.biz-tabs a:hover {
  background: var(--main);
  border: 1px solid var(--main);
  color: #fff;
}

.biz-tabs a:hover .biz-arrow{
  transform: translateX(8px) rotate(-45deg) translateY(-8px); 
}

.biz-tabs a.is-active { 
  background:#2B3993; 
  border-color:#2B3993; 
  color:#fff; 
}
@media (max-width: 768px){
  .biz-localnav .biz-tabs li{
    flex: 0 0 130px;
  }
}

.biz-lead { 
  margin:0 auto; 
  line-height:1.9; 
}
.biz-lead p{
  margin: 0;
  padding-left: 20px;
  border-left: 3px solid var(--line2);
}
@media (max-width: 768px){
  .biz-lead {
    padding: 40px 0;
  }
}

.biz-subnav{
  text-align: center;
  border-bottom: 1px solid var(--black);
  display: flex;
  justify-content: center;
}
.biz-tabs--sub{
  gap: 0;
}
.biz-subnav .biz-tabs--sub li { 
  width: 20%;
}
.biz-subnav .biz-tabs--sub li a{
  border: none;
  border-right: 1px solid var(--black);
  border-radius: 0;
  justify-content: center;
  white-space: wrap;
}
.biz-subnav .biz-tabs--sub li:first-child a{
  border-left: 1px solid var(--black);
}
.biz-subnav .biz-tabs--sub a.is-active{
  background: var(--black);
}

.biz-list { 
  margin: 0 auto; 
  padding:0 16px; 
  display:grid; 
  gap:40px; 
}

.biz-row { 
  display:grid; 
  column-gap: 20px;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
}

.biz-row__media { 
  grid-row: 1 / span 2;  
}

@media (max-width: 768px){
  .biz-subnav .biz-tabs--sub li a{
    font-size: 12px;
    padding: 8px 2px;
  }
    .biz-row {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .biz-row__title {
    order: 1; /* タイトルを先頭に */
  }

  .biz-row__media {
    order: 2; /* サムネイルを次に */
    margin: 0;

  }

  .biz-row__body {
    order: 3; /* テキストを最後に */
  }

  .biz-row__body .biz-row__text p{
    margin: 0;
  }

  .biz-row__body p:has(.biz-btn){
    text-align: center;
    margin: 24px auto 0;
  }

  .biz-btn{
    width: 280px;
  }

  .biz-list{
    padding:0;
  }
}


.biz-row__media { 
  position:relative; 
}
.biz-row__media img { 
  width:100%; 
  height:auto; 
  display:block; 
}

.biz-swiper__pagination { 
  text-align:center; 
  margin-top:8px; 
}

.biz-row__title-text { 
  font-weight:700; 
  font-size: clamp(18px,2.4vw,24px); 
  margin: 4px 0;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--black);
}
.biz-row__text { color:#333; }
.biz-btn {
  display:inline-flex; 
  justify-content: center;
  align-items:center; 
  gap:8px; padding:10px 16px; 
  border-radius:9999px;
  background:#fff; 
  color:#111; 
  border:1px solid #111; 
  text-decoration:none;
}
.biz-btn:after { content:"→"; display:inline-block; }
.biz-btn:hover { filter: brightness(0.96); }

.biz-cta { background:#ECEBE9; text-align:center; padding: 48px 16px; margin: 48px 0; }
.biz-cta h2 { font-size: clamp(22px,3vw,28px); margin-bottom:8px; }
.biz-cta__btn { display:inline-block; margin-top:12px; padding:12px 24px; border-radius:9999px; background:#111; color:#fff; text-decoration:none; }

/* 2カラム構造 */
.biz-columns {
  display: grid;
  grid-template-columns: 1fr 3fr; /* 左1 : 右3 */
  gap: 2rem;
  margin: 40px auto 80px;
}

.biz-subcat-title {
  font-size: 1.25rem;
  margin-top: 0;
  margin-bottom: 1rem;
  font-weight: 600;
  color: var(--main); /* ブランドカラー例 */
}

.biz-list {
  display: flex;
  flex-direction: column;
  gap: 60px;
}

/* スライダー全体 */
.biz-swiper {
  position: relative;
}

/* スライドラッパー */
.biz-swiper .swiper-wrapper {
  width: 100%;
  min-height: 200px; /* 高さを固定 or 最低高さ */
  position: relative;
}

/* 各スライド */
.biz-swiper .swiper-slide {
  width: 100% !important; /* 1枚＝100%幅 */
  flex-shrink: 0;
  box-sizing: border-box;
}

/* スライド内の画像を縮小 contain で表示 */
.biz-swiper .swiper-slide img {
  aspect-ratio: 3 / 2;  /* スライダーの枠を3:2に固定 */
  width: 100%;
  height: auto; /* 100% は避ける */
  object-fit: contain;      /* contain = 縮小して収める */
  background-color: #f5f5f5; /* 余白が出たら背景色（任意） */
  display: block;
}

/* スマホ時は縦積み */
@media (max-width: 768px) {
  .biz-columns {
    grid-template-columns: 1fr; /* 1カラムに */
    gap: 1.5rem;                /* モバイル用に少し狭めてもOK */
  }
  .biz-subcat-title{
    text-align: center;
  }
}