/* ========== Logo Carousel ========== */
.logo-carousel{position:relative;overflow:hidden;background:#fff;padding:1rem 0 1.5rem}
.logo-carousel .logo-track{display:flex;gap:0;align-items:center;animation:logo-scroll-var 26s linear infinite;flex-wrap:nowrap;justify-content:flex-start;padding:8px 0;will-change:transform}
.logo-carousel .logo-slide{margin-right:clamp(16px,3.5vw,32px)}
.logo-carousel .logo-slide{flex:0 0 auto;display:flex;align-items:center;justify-content:center;min-width:300px}
.logo-carousel .logo-slide{min-width:auto}
.logo-carousel .logo-slide img{display:block;height:80px;width:auto;object-fit:contain;opacity:1;transition:transform .2s ease}
.logo-carousel .logo-slide img:hover{transform:scale(1.02)}


@keyframes logo-scroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes logo-scroll-var{0%{transform:translateX(0)}100%{transform:translateX(calc(var(--scroll-distance, 50%) * -1))}}

/* 補足: カルーセル下の説明テキスト */
.fv .logo-caption{margin:6px 0 12px;text-align:center;color:#222;font-size:17px;font-weight:700;line-height:1.6}

/* ========== 上部の黄色バナー（特長サマリー） ========== */
.value-banner{background:#fff200;padding:12px 0 14px;margin-top:-2px;border-top:2px solid #fff200}
.value-banner .value-inner{max-width:1100px;margin:0 auto;padding:0 16px;display:flex;align-items:center;justify-content:center;gap:24px}
.value-banner .value-card{position:relative;display:flex;align-items:center;gap:16px;background:#fff;border:2px solid #23a9e6;border-radius:10px;padding:14px 18px;box-shadow:0 4px 0 rgba(0,0,0,.08)}
.value-banner .value-card{width:300px}
.value-banner .value-badge{flex:0 0 auto;display:inline-grid;place-items:center;width:74px;height:74px;border-radius:50%;background:#23a9e6;color:#fff;font-weight:900;line-height:1.15;text-align:center;font-size:clamp(12px,1.2vw,14px)}
.value-banner .value-body{display:flex;flex-direction:column;flex:1 1 auto;min-width:0}
.value-banner .value-title{margin:0;font-weight:900;font-size:clamp(20px,2.1vw,26px);line-height:1.2;color:#0b3a4a}
.value-banner .value-title .em{color:#00a0df}
.value-banner .value-desc{margin:4px 0 0 0;color:#2f3a45;line-height:1.4;font-weight:700;font-size:clamp(13px,1.3vw,16px)}
.value-banner .value-plus{font-weight:900;font-size:42px;line-height:1;color:#00a0df;display:inline-flex;align-items:center;padding:0 4px}
.value-banner .value-note{max-width:900px;margin:10px auto 0;padding:0 16px;text-align:center;color:#111;font-size:clamp(14px,1.25vw,16px);font-weight:700}

@media (max-width: 900px){
  .value-banner .value-inner{gap:12px}
  .value-banner .value-card{padding:12px 12px;gap:12px;width:auto}
  .value-banner .value-badge{width:60px;height:60px;font-size:13px}
  .value-banner .value-title{font-size:18px}
  .value-banner .value-plus{font-size:28px}
}


@media (max-width: 767px){
	.logo-carousel{padding:1rem 0 1.25rem}
    .logo-carousel .logo-track{gap:0;padding:4px 0;animation:logo-scroll-var 46.8s linear infinite;justify-content:flex-start;flex-wrap:nowrap}
	.logo-carousel .logo-slide{min-width:auto}
	.logo-carousel .logo-slide{margin-right:12px}
	.logo-carousel .logo-slide img{height:56px;max-width:120px}
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
	.logo-carousel .logo-track{animation-duration:60s;animation-iteration-count:infinite}
}