:root{
  --top-bar-h:43px;
  --header-main-h:52px;
  --body-pad-top:calc(var(--top-bar-h) + var(--header-main-h));
  --admin-bar-h:60px;
}
*{margin:0;padding:0;box-sizing:border-box;min-width:0;}
html{width:100%;scrollbar-gutter:stable;}
body.admin-mode{padding-top:calc(var(--body-pad-top) + var(--admin-bar-h));}
body{
  overflow-wrap: break-word;
  font-family:'Noto Sans JP',sans-serif;
  background:#fff;color:#111;
  -webkit-font-smoothing:antialiased;
  width:100%;max-width:100%;
  padding-top:var(--body-pad-top);
  overflow-x:clip;
}
body.page-loading-active{overflow-x:clip;}
/* body::before はファイル末尾の最終調整セクションで定義 */
.sr-only{
  position:absolute;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}
section[id],.anchor-target{scroll-margin-top:0;}
.anchor-target{display:block;height:1px;}

/* ══ 全画面ローディング ══ */
.page-loading{
  position:fixed;inset:0;
  z-index:1200;
  display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;
  padding:24px;text-align:center;
  background:rgba(255,255,255,.96);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .32s ease,visibility .32s ease;
  contain:layout paint style;
  transform:translateZ(0);
  will-change:opacity;
  backface-visibility:hidden;
}
.page-loading.show{
  opacity:1;visibility:visible;pointer-events:auto;
}
.page-loading.is-hiding{
  opacity:0;visibility:hidden;pointer-events:none;
}
.loading-gif{
  width:min(42vw,170px);min-width:118px;height:auto;display:block;
  transform:translateZ(0);
  backface-visibility:hidden;
}
.loading-text{
  color:#E53030;font-size:20px;font-weight:900;line-height:1.2;
}
@media (max-width:480px){
  .loading-gif{width:min(54vw,150px);}
  .loading-text{font-size:18px;}
}
@media (prefers-reduced-motion:reduce){
  .page-loading{transition:none;}
}

/* ══ 文字組み ══ */
:where(
  .hero-sub,
  .hero-h1,
  .hero-h1-suffix,
  .step-title,
  .footer-company,
  .footer-company-name,
  .recruit-card-title,
  .lineup-all-name,
  .product-name,
  .product-detail-name,
  .promise-info h4,
  .philosophy-motto,
  .customizer-title,
  .customizer-summary-main,
  .customizer-preset-name
){
  line-break: strict;
  text-wrap: balance;
}

:where(
  .step-desc,
  .process-note,
  .footer-info,
  .philosophy-body p,
  .recruit-empty p,
  .recruit-field-value,
  .promise-info p,
  .product-detail-desc,
  .cloud-status-banner-sub,
  .cloud-snippet-note,
  .add-modal-note,
  .recruit-modal-note,
  .staff-modal p,
  .customizer-copy,
  .customizer-note,
  .customizer-summary-sub,
  .customizer-preset-meta
){
  line-break: strict;
  text-wrap: pretty;
  word-break: normal;
  overflow-wrap: anywhere;
}

/* ══ トップバー ══ */
.top-bar{
  display:flex;justify-content:flex-end;align-items:center;
  height:43px;
  background:#fff;
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:1000;
}
.top-bar-btn{
  background:#E53030;color:#fff;
  font-size:12.5px;font-weight:700;
  padding:10px 18px;letter-spacing:.05em;
  text-decoration:none;display:inline-block;
  font-family:'Noto Sans JP',sans-serif;
  transition:background .2s;
}
.top-bar-btn:hover{background:#b71c1c}

/* ══ ヘッダー ══ */
header{
  background:#fff;
  border-bottom:1.5px solid #ddd;
  position:fixed;
  top:43px;
  left:0;
  right:0;
  z-index:1000;
}
.header-inner{
  display:flex;align-items:center;
  padding:8px 14px;gap:8px;
  max-width:1440px;margin:0 auto;
}
.logo-wrap{
  display:flex;align-items:center;
  gap:8px;flex-shrink:0;
}
.logo-wrap img{height:32px;width:auto;display:block}
.logo-wrap h3{
  font-size:11px;font-weight:700;color:#333;
  letter-spacing:.03em;white-space:nowrap;margin:0;
}
.header-nav{
  display:flex;flex-wrap:wrap;gap:0;
  flex:1;justify-content:center;align-items:center;
  padding:0 4px;
}
.header-nav a{
  font-size:9.5px;color:#333;text-decoration:none;
  padding:3px 5px;font-weight:500;white-space:nowrap;
  transition:color .2s;
}
.header-nav a:hover{color:#E53030}
.header-right{display:flex;align-items:center;gap:6px;flex-shrink:0}
.cart-btn-header{
  position:relative;
  background:none;border:1.5px solid #bbb;
  border-radius:99px;padding:5px 14px;
  font-size:12px;font-weight:700;color:#333;
  cursor:pointer;font-family:'Noto Sans JP',sans-serif;
  transition:all .2s;white-space:nowrap;
}
.cart-btn-header:hover{border-color:#E53030;color:#E53030}
.cart-badge{
  position:absolute;top:-5px;right:-8px;
  background:#E53030;color:#fff;
  font-size:10px;font-weight:700;
  min-width:16px;height:16px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  padding:0 3px;pointer-events:none;
  animation:cartPop .3s ease;
}
@keyframes cartPop{0%{transform:scale(0)}50%{transform:scale(1.3)}100%{transform:scale(1)}}

/* ══ カートモーダル ══ */
.cart-modal-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.55);z-index:2600;
  align-items:flex-start;justify-content:flex-end;
}
.cart-modal-overlay.open{display:flex;}
.cart-modal{
  background:#fff;width:360px;max-width:100vw;
  height:100dvh;display:flex;flex-direction:column;
  box-shadow:-4px 0 28px rgba(0,0,0,.2);
  overflow:hidden;
}
.cart-modal-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 20px 14px;border-bottom:1.5px solid #eee;flex-shrink:0;
}
.cart-modal-head h3{font-size:16px;font-weight:900;color:#111;}
.cart-modal-close{
  background:none;border:none;font-size:22px;cursor:pointer;
  color:#555;line-height:1;padding:4px 6px;transition:color .2s;
}
.cart-modal-close:hover{color:#E53030;}
.cart-modal-body{flex:1;overflow-y:auto;padding:12px 16px;}
.cart-empty{
  text-align:center;padding:56px 20px;color:#aaa;font-size:14px;
}
.cart-item{
  display:flex;gap:12px;align-items:flex-start;
  padding:12px 0;border-bottom:1px solid #f0f0f0;
}
.cart-item:last-child{border-bottom:none;}
.cart-item-img{
  width:64px;height:64px;flex-shrink:0;
  background:#f5f5f5;border-radius:6px;overflow:hidden;
}
.cart-item-img img{width:100%;height:100%;object-fit:cover;display:block;}
.cart-item-no-img{
  width:100%;height:100%;display:flex;align-items:center;
  justify-content:center;font-size:22px;color:#ddd;
}
.cart-item-info{flex:1;min-width:0;}
.cart-item-name{font-size:13px;font-weight:700;color:#111;margin-bottom:3px;}
.cart-item-meta{font-size:11px;color:#888;margin-bottom:6px;line-height:1.5;}
.cart-item-swatches{display:flex;gap:4px;margin-bottom:6px;}
.cart-item-swatch{
  width:14px;height:14px;border-radius:50%;
  border:1px solid rgba(0,0,0,.12);flex-shrink:0;
}
.cart-item-qty-row{display:flex;align-items:center;gap:8px;}
.cart-item-qty-btn{
  width:26px;height:26px;border:1.5px solid #ddd;border-radius:50%;
  background:#fff;font-size:15px;font-weight:700;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  color:#333;line-height:1;transition:border-color .2s,color .2s;
  font-family:'Noto Sans JP',sans-serif;
}
.cart-item-qty-btn:hover{border-color:#E53030;color:#E53030;}
.cart-item-qty{font-size:13px;font-weight:700;min-width:20px;text-align:center;}
.cart-item-price{font-size:12px;color:#E53030;font-weight:700;margin-top:2px;}
.cart-item-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px;}
.cart-item-buy-btn{
  border:none;border-radius:99px;background:#E53030;color:#fff;
  font-size:11px;font-weight:900;padding:7px 12px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;
}
.cart-item-buy-btn:hover{background:#B71C1C;}
.cart-item-del{
  background:none;border:none;font-size:17px;color:#bbb;
  cursor:pointer;padding:2px 4px;line-height:1;
  transition:color .2s;flex-shrink:0;
}
.cart-item-del:hover{color:#E53030;}
.cart-modal-footer{
  border-top:1.5px solid #eee;padding:16px 20px;flex-shrink:0;
  background:#fff;
}
.cart-total-row{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:14px;
}
.cart-total-label{font-size:13px;font-weight:700;color:#555;}
.cart-total-price{font-size:20px;font-weight:900;color:#111;}
.cart-checkout-btn{
  display:block;width:100%;text-align:center;
  background:#E53030;color:#fff;font-size:14px;font-weight:700;
  padding:14px;border-radius:99px;border:none;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;transition:background .2s;
  text-decoration:none;
}
.cart-checkout-btn:hover{background:#B71C1C;}
.cart-clear-btn{
  display:block;width:100%;text-align:center;margin-top:8px;
  background:none;border:none;color:#aaa;font-size:12px;
  cursor:pointer;font-family:'Noto Sans JP',sans-serif;
  transition:color .2s;
}
.cart-clear-btn:hover{color:#E53030;}



/* カートに入れるボタン（商品カード・一覧共通） */
.product-buy-btn{
  display:block;width:calc(100% - 24px);margin:0 12px 12px;
  text-align:center;background:#E53030;color:#fff;
  font-size:12px;font-weight:700;padding:9px 12px;
  border-radius:99px;border:none;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;
  transition:background .2s;
}
.product-buy-btn:hover{background:#B71C1C;}
.lineup-all-buy-link{
  display:block;font-size:12px;font-weight:700;color:#fff;
  background:#E53030;padding:8px 14px;margin:0 14px 14px;
  border:none;cursor:pointer;font-family:'Noto Sans JP',sans-serif;
  border-radius:99px;text-align:center;transition:background .2s;
}
.lineup-all-buy-link:hover{background:#B71C1C;}

/* ハンバーガーボタンと開閉アニメーション */
.menu-toggle{
  flex-shrink:0;
  background:none;border:1.5px solid #bbb;
  border-radius:4px;width:36px;height:36px;
  cursor:pointer;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:5px;
  transition:border-color .2s;
}
.menu-toggle:hover{border-color:#E53030}
.menu-toggle span{
  display:block;width:18px;height:2px;background:#333;
  border-radius:1px;transition:all .3s ease-in-out;
}
.menu-toggle.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle.active span:nth-child(2) { opacity: 0; }
.menu-toggle.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ══ モバイルメニュー ══ */
.mobile-menu{
  display:none;position:fixed;
  inset:0;background:rgba(255,255,255,.97);
  z-index:999;flex-direction:column;
  align-items:center;justify-content:center;gap:0;
}
.mobile-menu.open{display:flex}
.mobile-menu a{
  font-size:17px;font-weight:700;color:#111;
  text-decoration:none;padding:16px 40px;
  width:100%;text-align:center;
  border-bottom:1px solid #eee;
  transition:background .2s,color .2s;
}
.mobile-menu a:first-of-type{border-top:1px solid #eee}
.mobile-menu a:hover{background:#FFF5F5;color:#E53030}
.menu-close{
  position:absolute;top:16px;right:20px;
  background:none;border:none;font-size:26px;
  cursor:pointer;color:#555;line-height:1;padding:4px 8px;
}
.menu-close:hover{color:#E53030}

/* ══ ヒーローセクション ══ */
.hero{
  background:#fff;
  padding:20px 16px 0;
  overflow:hidden;position:relative;
  max-width:1440px;margin:0 auto;
}
.hero-sub{font-size:13px;font-weight:700;color:#FF0019;margin-bottom:6px;letter-spacing:.01em;}
.hero-h1{font-size:30px;font-weight:900;line-height:1.1;color:#111;margin-bottom:4px;}
.hero-h1-accent{display:flex;align-items:center;gap:8px;margin-bottom:20px;line-height:1.1;flex-wrap:wrap;}
.hero-badge{
  display:inline-flex;align-items:center;justify-content:center;
  background-color:#EB0F2B;color:#fff;
  font-size:28px;font-weight:900;
  padding:4px 12px 6px;border-radius:6px;
  transform:rotate(-5deg);transform-origin:center;
  letter-spacing:.01em;flex-shrink:0;
}
.hero-h1-suffix{font-size:30px;font-weight:900;color:#111;}
.hero-cta{display:flex;gap:10px;margin-bottom:22px;flex-wrap:wrap;}
.btn-outline-round{
  border:2px solid #222;border-radius:99px;
  background:#fff;color:#111;
  font-size:13.5px;font-weight:700;
  padding:10px 22px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;
  text-decoration:none;display:inline-block;
  white-space:nowrap;transition:all .2s;line-height:1.4;
}
.btn-outline-round:hover{background:#f0f0f0}
.btn-red-round{
  border:none;border-radius:99px;
  background:#e53030;color:#fff;
  font-size:13.5px;font-weight:700;
  padding:10px 28px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;
  text-decoration:none;display:inline-block;
  white-space:nowrap;transition:background .2s;line-height:1.4;
}
.btn-red-round:hover{background:#c82020}
.shop-buttons{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;max-width:100%;
}
.shop-button-item{
  position:relative;display:inline-flex;align-items:center;max-width:100%;
}
.shop-button-item .btn-red-round{
  max-width:100%;overflow:hidden;text-overflow:ellipsis;
}
.shop-link-delete{
  display:none;position:absolute;right:7px;top:50%;
  transform:translateY(-50%);
  width:22px;height:22px;border:none;border-radius:50%;
  background:rgba(20,20,20,.82);color:#fff;
  font-size:12px;font-weight:900;line-height:1;
  cursor:pointer;align-items:center;justify-content:center;
  font-family:'Noto Sans JP',sans-serif;
}
.admin-mode .shop-link-delete{display:flex;}
.admin-mode .shop-button-item .btn-red-round{padding-right:42px;}
.shop-link-delete:hover{background:#111;}
.shop-add-btn{
  display:none;border:2px dashed #ddd;border-radius:99px;
  background:#fff;color:#E53030;
  font-size:13.5px;font-weight:700;
  padding:8px 20px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;
  white-space:nowrap;line-height:1.4;
  align-items:center;justify-content:center;
  transition:background .2s,border-color .2s;
}
.admin-mode .shop-add-btn{display:inline-flex;}
.shop-add-btn:hover{background:#FFF5F5;border-color:#E53030;}
.btn-black-round{
  border:none;border-radius:99px;
  background:#111;color:#fff;
  font-size:13.5px;font-weight:700;
  padding:10px 28px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;
  text-decoration:none;display:inline-block;
  white-space:nowrap;transition:background .2s;line-height:1.4;
}
.btn-black-round:hover{background:#333}
.btn-white-round{
  border:2px solid #222;border-radius:99px;
  background:#fff;color:#111;
  font-size:13.5px;font-weight:700;
  padding:10px 28px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;
  text-decoration:none;display:inline-block;
  white-space:nowrap;transition:all .2s;line-height:1.4;
}
.btn-white-round:hover{background:#f0f0f0}

/* ── ヒーロービジュアル ── */
.hero-visual{
  position:relative;height:300px;
  margin:0 -16px;overflow:hidden;
}
.hero-jersey{
  position:absolute;left:-30px;bottom:0;
  width:340px;transform:rotate(-10deg) translateY(20px);z-index:2;
}
.hero-jersey img{width:100%;height:auto;display:block;filter:drop-shadow(0 8px 24px rgba(0,0,0,.18));}
.hero-kuma{
  position:absolute;right:24px;top:85px;
  width:90px;z-index:4;pointer-events:none;
}
.hero-kuma svg{width:100%;height:auto;display:block}
.hero-circle{
  position:absolute;right:10px;bottom:28px;
  width:128px;height:128px;border-radius:50%;
  border:3px solid #E53030;background:#fff;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  text-align:center;z-index:5;padding:12px;
  box-shadow:0 2px 16px rgba(12,26,110,.12);
}
.hero-circle-text{font-size:11.5px;font-weight:700;color:#E53030;line-height:1.65;}
.hero-circle-arrow{margin-top:5px;color:#E53030;font-size:16px;font-weight:900;}

/* ══ 共通 ══ */
.btn-pill{
  display:inline-block;border:2px solid #222;border-radius:99px;
  background:#fff;color:#111;font-size:14px;font-weight:700;
  padding:11px 26px;font-family:'Noto Sans JP',sans-serif;
  text-decoration:none;cursor:pointer;
  white-space:nowrap;transition:all .2s;line-height:1.4;
}
.btn-pill:hover{background:#f0f0f0}
.section-tag{
  display:inline-block;background:#E53030;color:#fff;
  font-size:15px;font-weight:700;padding:10px 20px;
  border-radius:6px;font-family:'Noto Sans JP',sans-serif;
  border:none;cursor:default;
}
.lineup-label{margin-bottom:20px;}
.btn-center{text-align:center;}

/* ══ デザインガイド ══ */
.guide-section{
  padding:32px 16px;background:#fff;border-top:2px solid #eee;
  max-width:1440px;margin:0 auto;
}
.guide-intro{
  max-width:760px;margin:20px auto 22px;
  font-size:14px;color:#555;line-height:1.9;
}
.guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.guide-card{
  background:#fff;border:1.5px solid #eee;border-radius:14px;
  overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.05);
  position:relative;
  transition:transform .2s,box-shadow .2s,border-color .2s;
}
.guide-card:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(0,0,0,.08);
  border-color:#f3b6b6;
}
.guide-thumb{
  display:block;aspect-ratio:16/9;background:#f7f7f7;
  overflow:hidden;
}
.guide-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.guide-admin-edit-btn{
  display:none;
  position:absolute;top:10px;right:10px;z-index:5;
  padding:7px 12px;border:none;border-radius:999px;
  background:#E53030;color:#fff;font-size:12px;font-weight:900;
  font-family:'Noto Sans JP',sans-serif;cursor:pointer;
  box-shadow:0 6px 18px rgba(229,48,48,.25);
}
body.admin-mode .guide-admin-edit-btn{display:inline-flex;align-items:center;justify-content:center;}
.guide-body{padding:14px;} /* 18pxから14pxに余白を縮小 */
.guide-kicker{
  font-family:'DM Mono',monospace;
  font-size:10px;font-weight:500;letter-spacing:.08em; /* 11pxから10pxに縮小 */
  color:#E53030;margin-bottom:6px;
}
.guide-title{
  font-size:15px;font-weight:700;color:#111; /* 18pxから15pxに縮小 */
  line-height:1.4;margin-bottom:6px;
}
.guide-title a{color:inherit;text-decoration:none;}
.guide-desc{
  font-size:12px;color:#666;line-height:1.6; /* 13pxから12pxに縮小、行間も調整 */
  margin-bottom:12px;
}
.guide-link{
  color:#E53030;text-decoration:none;font-size:12px; /* 13pxから12pxに縮小 */
  font-weight:700;letter-spacing:.02em;
}

/* ══ キャラクターアクセント ══ */
.hero,.lineup-section,.customizer-section,.process-section,.contact-section,.philosophy-section{
  position:relative;
  isolation:isolate;
}
.hero > :not(.mascot-accent),
.lineup-section > :not(.mascot-accent),
.customizer-section > :not(.mascot-accent),
.process-section > :not(.mascot-accent),
.contact-section > :not(.mascot-accent),
.philosophy-section > :not(.mascot-accent){
  position:relative;
  z-index:2;
}
.mascot-accent{
  position:absolute;
  z-index:1;
  pointer-events:none;
  user-select:none;
  line-height:0;
}
.mascot-accent img{
  display:block;
  width:100%;
  height:auto;
  filter:drop-shadow(0 12px 26px rgba(229,48,48,.16));
}
.mascot-accent--hero{
  top:16px;
  right:22px;
  width:clamp(96px,12vw,148px);
}
.mascot-accent--lineup{
  right:10px;
  bottom:8px;
  width:clamp(114px,14vw,150px);
}
.mascot-accent--customize{
  top:20px;
  right:22px;
  width:clamp(116px,15vw,160px);
}
.mascot-accent--process{
  right:18px;
  bottom:10px;
  width:clamp(104px,14vw,142px);
}
.mascot-accent--contact{
  top:20px;
  right:20px;
  width:clamp(116px,14vw,146px);
}
.mascot-accent--philosophy{
  right:18px;
  bottom:10px;
  width:clamp(102px,13vw,132px);
}
@media (min-width: 960px){
  .hero{padding-right:clamp(170px,20vw,240px);}
  .customizer-head{padding-right:clamp(120px,14vw,190px);}
  .contact-form{padding-right:clamp(90px,10vw,150px);}
  .philosophy-body{padding-right:clamp(80px,9vw,140px);}
  .process-note{padding-right:clamp(90px,10vw,130px);}
}
@media (max-width: 959px){
  .mascot-accent--hero{display:none;}
  .mascot-accent--lineup{width:96px;right:6px;bottom:8px;opacity:.96;}
  .mascot-accent--customize{width:84px;top:14px;right:10px;}
  .mascot-accent--process{display:none;}
  .mascot-accent--contact{width:84px;top:12px;right:10px;}
  .mascot-accent--philosophy{display:none;}
  .customizer-head{padding-right:86px;}
  .contact-form{padding-right:22px;}
}

/* ══ 新着スライダー ══ */
.news-section{
  padding:28px 0 32px;
  border-top:2px solid #eee;background:#fff;
  max-width:1440px;margin:0 auto;
}
.section-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:0 16px;margin-bottom:18px;
}
.slider-outer{position:relative;padding:0 16px;}
.slider-viewport{overflow:hidden;}
.slider-track{display:flex;align-items:flex-start;gap:10px;transition:transform .3s ease;will-change:transform;}
.slider-card{
  flex-shrink:0;border-radius:10px;overflow:hidden;
  background:#f7f7f7;box-shadow:0 2px 8px rgba(0,0,0,.06);
  aspect-ratio: 1 / 1;
  position:relative;min-height:0;
}
.slider-card-link{display:block;width:100%;height:100%;}
.slider-card-btn{display:block;width:100%;height:100%;border:none;padding:0;background:none;cursor:pointer;transition:opacity .18s;}
.slider-card-btn:hover{opacity:.85;}
.slider-card img{width:100%;height:100%;display:block;object-fit:contain;}

/* ── ニュース詳細モーダル ── */
.news-detail-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.72);z-index:2500;
  align-items:center;justify-content:center;
  padding:16px;
}
.news-detail-overlay.open{display:flex;}
.news-detail-modal{
  background:#fff;border-radius:16px;
  width:460px;max-width:94vw;max-height:92dvh;
  overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 20px 70px rgba(0,0,0,.35);
  position:relative;
}
.news-detail-close-x{
  position:absolute;top:10px;right:12px;
  background:rgba(0,0,0,.45);color:#fff;
  border:none;border-radius:50%;width:34px;height:34px;
  font-size:20px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  z-index:1;transition:background .18s;
}
.news-detail-close-x:hover{background:rgba(0,0,0,.7);}
.news-detail-img{
  width:100%;flex:1 1 auto;overflow:hidden;
  background:#f5f5f5;display:flex;align-items:center;justify-content:center;
  max-height:70dvh;
}
.news-detail-img img{
  width:100%;height:100%;object-fit:contain;display:block;
}
.news-detail-actions{
  padding:16px 20px;display:flex;gap:10px;flex-wrap:wrap;
}
.news-detail-actions:empty{display:none;}
.news-detail-link{
  flex:1;display:block;text-align:center;
  background:#E53030;color:#fff;
  font-size:14px;font-weight:700;
  padding:13px 20px;border-radius:99px;
  text-decoration:none;transition:background .2s;
  white-space:nowrap;font-family:'Noto Sans JP',sans-serif;
}
.news-detail-link:hover{background:#B71C1C;}
.slider-card.admin-add-card{min-height:0;}
.slider-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  background:#fff;border:1.5px solid #ccc;border-radius:50%;
  width:38px;height:38px;cursor:pointer;font-size:20px;font-weight:700;
  color:#555;display:flex;align-items:center;justify-content:center;
  transition:all .2s;box-shadow:0 2px 6px rgba(0,0,0,.08);
  z-index: 10;
}
.slider-arrow:hover{background:#f5f5f5;border-color:#999}
.slider-arrow.prev{left:0}.slider-arrow.next{right:0}

/* ══ ラインナップ ══ */
.lineup-section{
  padding:32px 16px;background:#fff;border-top:2px solid #eee;
  max-width:1440px;margin:0 auto;
}
.products-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:24px;}
.product-card{
  background:#fff;border-radius:10px;overflow:hidden;
  box-shadow:0 2px 10px rgba(0,0,0,.08);transition:transform .2s,box-shadow .2s;
  position:relative;
  display:flex;flex-direction:column;
}
.product-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.12);}
.product-thumb{width:100%;aspect-ratio:1/1;background:#f9f9f9;overflow:hidden;max-height:350px;flex-shrink:0;}
.product-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.product-name{font-size:14px;font-weight:700;padding:10px 12px 8px;color:#111;}
.product-link{
  display:block;width:100%;text-align:left;background:none;border:none;cursor:pointer;font-family:inherit;
  font-size:12px;font-weight:700;color:#E53030;
  padding:0 12px 12px;text-decoration:none;transition:color .2s;
  flex:1;
}
.product-link:hover{color:#8B0000}


/* ══ ウェアカスタマイズ ══ */
.customizer-section{
  padding:32px 16px;background:#f7f7f7;border-top:2px solid #eee;
  max-width:1440px;margin:0 auto;
}
.customizer-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:14px;margin-bottom:18px;flex-wrap:wrap;
}
.customizer-title{font-size:22px;font-weight:900;color:#111;line-height:1.25;margin-top:12px;}
.customizer-copy{font-size:13px;color:#666;line-height:1.8;max-width:660px;margin-top:8px;}
.customizer-admin-tools{display:none;gap:8px;flex-wrap:wrap;}
.admin-mode .customizer-admin-tools{display:flex;}
body.customizer-hidden:not(.admin-mode) #customize,
body.customizer-hidden:not(.admin-mode) [data-customizer-link]{display:none!important;}
body.admin-mode.customizer-hidden #customize{
  border:2px dashed rgba(229,48,48,.55);
  background:#fffafa;
}
.customizer-visibility-notice{
  display:none;border:1.5px solid #F4B4B4;background:#FFF5F5;color:#B71C1C;
  border-radius:8px;padding:10px 12px;margin:-4px 0 14px;
  font-size:12px;font-weight:800;line-height:1.6;
}
body.admin-mode.customizer-hidden .customizer-visibility-notice{display:block;}
.customizer-shell{display:grid;grid-template-columns:1fr;gap:14px;}
.customizer-preview-panel,
.customizer-controls-panel{
  background:#fff;border:1.5px solid #e6e6e6;border-radius:8px;
  padding:16px;box-shadow:0 2px 10px rgba(0,0,0,.04);
}
.wear-preview-canvas{
  position:relative;aspect-ratio:1/1;min-height:300px;min-width:0;
  background:
    linear-gradient(90deg,rgba(0,0,0,.04) 1px,transparent 1px),
    linear-gradient(0deg,rgba(0,0,0,.04) 1px,transparent 1px),
    #fafafa;
  background-size:32px 32px;border:1.5px solid #eee;border-radius:8px;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.wear-preview-canvas::before{
  content:'';position:absolute;inset:18px;border:1.5px dashed rgba(0,0,0,.08);
  border-radius:8px;pointer-events:none;
}
.wear-svg{width:min(96%,620px);height:auto;display:block;filter:drop-shadow(0 18px 18px rgba(0,0,0,.14));z-index:1;}
.preview-color-layout .wear-svg{max-height:calc(100% - 20px);}
.wear-design{display:none;overflow:visible;}
.wear-preview-canvas[data-type="tshirt"] .wear-design[data-design="tshirt"],
.wear-preview-canvas[data-type="vest"] .wear-design[data-design="vest"],
.wear-preview-canvas[data-type="jacket"] .wear-design[data-design="jacket"]{display:block;}
.wear-part{transition:fill .2s ease,opacity .2s ease;}
.wear-image-color{opacity:.96;}
.wear-pdf-part{opacity:.96;}
.wear-image-shade{fill:#000;opacity:.08;pointer-events:none;}
.wear-line-art{mix-blend-mode:multiply;pointer-events:none;}
.wear-pdf-lines{fill:#111;opacity:.92;mix-blend-mode:multiply;pointer-events:none;}
.wear-pdf-lines path{fill:#111;}
.wear-outline{fill:none;stroke:#171717;stroke-width:.9;stroke-linejoin:round;stroke-linecap:round;pointer-events:none;}
.wear-stitch{fill:none;stroke:#1b1b1b;stroke-width:.7;stroke-linecap:round;stroke-dasharray:2 2;opacity:.45;pointer-events:none;}
.wear-seam{fill:none;stroke:#0f0f0f;stroke-width:.6;stroke-linecap:round;stroke-linejoin:round;opacity:.32;pointer-events:none;}
.wear-seam.light{stroke:#fff;opacity:.22;}
.wear-fold{fill:none;stroke:#fff;stroke-width:.9;stroke-linecap:round;opacity:.18;pointer-events:none;}
.wear-fold.dark{stroke:#111;opacity:.07;}
.wear-shadow{fill:#111;opacity:.14;pointer-events:none;}
.wear-highlight{fill:#fff;opacity:.18;pointer-events:none;}
.wear-texture{pointer-events:none;mix-blend-mode:soft-light;opacity:.18;}
.wear-rib{fill:none;stroke:#fff;stroke-width:.45;stroke-linecap:round;opacity:.2;pointer-events:none;}
.wear-print{
  font-family:'DM Mono','Noto Sans JP',sans-serif;font-weight:700;text-anchor:middle;letter-spacing:.06em;
  pointer-events:auto;cursor:grab;user-select:none;touch-action:none;
  transition:filter .16s ease,stroke .16s ease,stroke-width .16s ease;
}
.wear-print:active{cursor:grabbing;}
.wear-print.active{
  paint-order:stroke;stroke:#fff;stroke-width:.8px;stroke-linejoin:round;
  filter:drop-shadow(0 0 4px rgba(229,48,48,.68));
}
body.customizer-dragging{cursor:grabbing;}
.wear-print-name{font-size:10px;}
.wear-print-number{font-size:27px;}
.wear-uploaded-logo{
  pointer-events:auto;cursor:grab;user-select:none;touch-action:none;
  transition:filter .16s ease;
}
.wear-uploaded-logo:active{cursor:grabbing;}
.wear-uploaded-logo.active{
  filter:drop-shadow(0 0 4px rgba(229,48,48,.68));
  outline:2px solid rgba(229,48,48,.55);outline-offset:2px;
}
.wear-zipper{stroke:#1b1b1b;stroke-width:1.5;opacity:.65;}
.direct-print-panel{
  display:grid;grid-template-columns:1fr;gap:10px;margin-top:12px;
  border:1.5px solid #eee;border-radius:8px;background:#fff;padding:10px;
}
.direct-print-tabs{
  display:grid;grid-template-columns:repeat(2,1fr);gap:6px;
}
.direct-print-tabs.has-image-tab{
  grid-template-columns:repeat(3,1fr);
}
.direct-print-tab{
  min-height:38px;border:2px solid #ddd;border-radius:8px;background:#fff;color:#333;
  font-size:12px;font-weight:900;cursor:pointer;font-family:'Noto Sans JP',sans-serif;
  transition:border-color .2s,background .2s,color .2s;
}
.direct-print-tab:hover,.direct-print-tab.active{border-color:#E53030;background:#FFF5F5;color:#E53030;}
.direct-print-tools{
  display:grid;grid-template-columns:repeat(6,minmax(34px,1fr));gap:6px;
}
.direct-print-actions{
  display:flex;justify-content:flex-start;align-items:center;gap:8px;flex-wrap:wrap;
}
.direct-print-actions .customizer-action-btn{
  min-height:38px;border-radius:8px;padding:8px 12px;
  font-size:11px;line-height:1.2;white-space:normal;
  display:inline-flex;align-items:center;justify-content:center;text-align:center;
}
.direct-print-btn{
  min-height:38px;border:1.5px solid #ddd;border-radius:8px;background:#fafafa;color:#111;
  font-size:15px;font-weight:900;cursor:pointer;font-family:'DM Mono','Noto Sans JP',sans-serif;
  transition:border-color .2s,background .2s,color .2s;
}
.direct-print-btn:hover{border-color:#E53030;background:#FFF5F5;color:#E53030;}
.customizer-undo-btn{
  min-height:38px;border-radius:8px;padding:8px 14px;
}
.customizer-undo-btn:not(:disabled){
  border-color:#E53030;color:#E53030;background:#FFF5F5;
}
.customizer-summary{
  display:grid;grid-template-columns:1fr;gap:8px;margin-top:14px;
}
.customizer-summary-box{
  border:1.5px solid #eee;border-radius:8px;padding:12px 14px;background:#fff;
}
.customizer-summary-box.estimate-live{
  border-color:#E53030;background:#FFF5F5;
}
.customizer-summary-label{
  font-size:10px;font-weight:700;color:#999;letter-spacing:.09em;
  text-transform:uppercase;margin-bottom:4px;
}
.customizer-summary-main{font-size:18px;font-weight:900;color:#111;line-height:1.25;}
.customizer-summary-sub{font-size:11px;color:#777;line-height:1.55;margin-top:3px;}
.customizer-controls{display:grid;gap:18px;}
.customizer-block{border-bottom:1px solid #eee;padding-bottom:16px;}
.customizer-block:last-child{border-bottom:none;padding-bottom:0;}
.customizer-block-title{
  font-size:12px;font-weight:900;color:#111;letter-spacing:.06em;
  margin-bottom:10px;text-transform:uppercase;
}
.customizer-type-strip{margin-bottom:12px;}
.customizer-type-strip .wear-type-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
.preview-color-layout{
  display:grid;grid-template-columns:minmax(0,1fr) clamp(124px,30vw,146px);
  gap:10px;align-items:start;
}
.preview-color-panel{
  min-width:0;border-left:1px solid #eee;padding-left:10px;
  position:relative;z-index:2;
}
.preview-color-panel .customizer-block-title{margin-bottom:8px;}
.preview-color-panel .color-control-grid{grid-template-columns:1fr;gap:8px;}
.preview-color-panel .color-control{gap:7px;}
.preview-color-panel .color-control-head{display:none;}
.preview-color-panel .color-control-label{font-size:11px;}
.preview-color-panel .color-control-value{display:none;}
.preview-color-panel .swatch-row{gap:6px;flex-wrap:nowrap;margin-bottom:0;}
.preview-color-panel .selected-color-chip{width:22px;height:22px;}
.color-part-tabs{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;
}
.color-part-tab{
  min-width:0;min-height:32px;border:1.5px solid #ddd;border-radius:8px;
  background:#fff;color:#222;display:flex;align-items:center;justify-content:center;
  gap:4px;padding:5px 4px;font-size:10px;font-weight:900;line-height:1;
  font-family:'Noto Sans JP',sans-serif;cursor:pointer;
  transition:border-color .18s,background .18s,color .18s;
}
.color-part-tab.active{border-color:#E53030;background:#FFF5F5;color:#E53030;}
.color-part-dot{
  width:11px;height:11px;border-radius:50%;background:var(--swatch,#fff);
  border:1px solid #bbb;box-shadow:inset 0 0 0 1px rgba(0,0,0,.05);flex:0 0 auto;
}
.color-part-tab-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.color-active-summary{
  display:grid;grid-template-columns:24px minmax(0,1fr);gap:7px;align-items:center;
}
.color-active-title{font-size:11px;font-weight:900;color:#222;line-height:1.2;}
.wear-type-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;}
.wear-type-btn{
  background:#fff;border:2px solid #ddd;border-radius:8px;
  min-height:62px;padding:9px 8px;cursor:pointer;font-family:'Noto Sans JP',sans-serif;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;transition:border-color .2s,background .2s,color .2s;
}
.wear-type-btn:hover,.wear-type-btn.active{border-color:#E53030;background:#FFF5F5;color:#E53030;}
.wear-type-name{font-size:13px;font-weight:900;line-height:1.2;}
.wear-type-price{font-size:10px;font-weight:700;color:#888;font-family:'DM Mono',monospace;}
.color-control-grid{display:grid;grid-template-columns:1fr;gap:14px;}
.color-control{display:grid;gap:8px;min-width:0;}
.color-control-head{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.color-control-label{font-size:12px;font-weight:900;color:#333;}
.color-control-value{font-size:10px;color:#888;font-family:'DM Mono',monospace;text-align:right;overflow-wrap:anywhere;}
.swatch-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.color-swatch{
  width:32px;height:32px;border-radius:50%;border:2px solid #ddd;
  background:var(--swatch,#fff);cursor:pointer;position:relative;
  transition:transform .2s,border-color .2s,box-shadow .2s;
}
.color-swatch:hover{transform:translateY(-1px);border-color:#888;}
.color-swatch.active{border-color:#111;box-shadow:0 0 0 3px #fff,0 0 0 5px #111;}
.color-swatch[data-color="#ffffff"]{box-shadow:inset 0 0 0 1px #ddd;}
.color-current-name{
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:8.5px;font-weight:800;color:#777;line-height:1.25;
}
.cmyk-swatch-grid{
  display:grid;grid-template-columns:repeat(5,22px);gap:4px;
}
.cmyk-swatch-btn{
  width:22px;height:22px;border:1.5px solid #d6d6d6;border-radius:50%;
  background:var(--swatch,#fff);cursor:pointer;padding:0;position:relative;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.05);
  transition:transform .18s,border-color .18s,box-shadow .18s;
}
.cmyk-swatch-btn:hover{transform:translateY(-1px);border-color:#777;}
.cmyk-swatch-btn.active{
  border-color:#111;box-shadow:0 0 0 2px #fff,0 0 0 4px #111,inset 0 0 0 1px rgba(0,0,0,.04);
}
.cmyk-swatch-btn[data-color="#f7f7f2"],
.cmyk-swatch-btn[data-color="#ffffff"]{box-shadow:inset 0 0 0 1px #ccc;}
.cmyk-swatch-btn.active[data-color="#f7f7f2"],
.cmyk-swatch-btn.active[data-color="#ffffff"]{box-shadow:0 0 0 2px #fff,0 0 0 4px #111,inset 0 0 0 1px #ccc;}
.custom-color-input{
  width:34px;height:34px;border:none;background:transparent;cursor:pointer;padding:0;
}
.selected-color-chip{
  width:34px;height:34px;border-radius:50%;border:2px solid #111;
  background:var(--swatch,#fff);box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);
  flex-shrink:0;
}
.customizer-field-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
.customizer-field{display:grid;gap:5px;}
.customizer-field.full{grid-column:1/-1;}
.customizer-field label{font-size:11px;font-weight:900;color:#555;letter-spacing:.04em;}
.customizer-input,
.customizer-select,
.customizer-textarea{
  width:100%;border:2px solid #ddd;border-radius:8px;background:#fff;
  padding:10px 12px;font-size:13px;font-family:'Noto Sans JP',sans-serif;
  transition:border-color .2s;
}
.customizer-input:focus,
.customizer-select:focus,
.customizer-textarea:focus{outline:none;border-color:#E53030;}
.customizer-textarea{min-height:80px;resize:vertical;line-height:1.7;}
.customizer-live-estimate{
  grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto;
  gap:6px 12px;align-items:center;border:2px solid #E53030;border-radius:8px;
  background:#FFF5F5;padding:11px 12px;
}
.customizer-live-estimate-label{
  font-size:11px;font-weight:900;color:#E53030;letter-spacing:.04em;
}
.customizer-live-estimate-sub{font-size:11px;color:#777;line-height:1.45;margin-top:2px;}
.customizer-live-estimate-main{
  font-size:20px;font-weight:900;color:#111;white-space:nowrap;
}
.customizer-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:16px;}
.customizer-action-btn{
  border:none;border-radius:99px;background:#E53030;color:#fff;
  font-size:13px;font-weight:900;padding:11px 20px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;transition:background .2s;
  white-space:nowrap;
}
.customizer-actions .customizer-action-btn{
  min-height:44px;padding:10px 16px;line-height:1.25;
  display:inline-flex;align-items:center;justify-content:center;text-align:center;
  white-space:normal;width:auto;min-width:0;flex:0 1 auto;
}
.customizer-action-btn:hover{background:#B71C1C;}
.customizer-action-btn:disabled,
.direct-print-btn:disabled{
  opacity:.45;cursor:not-allowed;pointer-events:none;
}
.customizer-action-btn.sub{
  background:#111;color:#fff;
}
.customizer-action-btn.sub:hover{background:#333;}
.customizer-action-btn.checkout{
  background:#111;color:#fff;
}
.customizer-action-btn.checkout:hover{background:#333;}
.customizer-action-btn.light{
  background:#fff;color:#111;border:2px solid #222;padding:9px 18px;
}
.customizer-action-btn.light:hover{background:#f0f0f0;}
.customizer-action-btn.visibility{
  background:#fff;color:#111;border:2px solid #222;padding:9px 18px;
}
.customizer-action-btn.visibility.is-hidden-state{
  border-color:#E53030;color:#E53030;background:#FFF5F5;
}
.customizer-note{font-size:11px;color:#999;line-height:1.7;margin-top:8px;}
.customizer-presets{margin-top:18px;}
.customizer-preset-grid{display:grid;grid-template-columns:1fr;gap:10px;margin-top:10px;}
.customizer-preset-card{
  background:#fff;border:1.5px solid #e6e6e6;border-radius:8px;
  padding:12px;position:relative;display:grid;gap:10px;
}
.customizer-preset-name{font-size:14px;font-weight:900;color:#111;padding-right:64px;}
.customizer-preset-meta{font-size:11px;color:#777;line-height:1.55;}
.customizer-mini-swatches{display:flex;gap:5px;align-items:center;}
.customizer-mini-swatch{width:18px;height:18px;border-radius:50%;border:1px solid #ddd;background:var(--swatch);}
.customizer-preset-use{
  border:none;background:#111;color:#fff;border-radius:99px;
  font-size:12px;font-weight:900;padding:9px 16px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;justify-self:start;
}
.customizer-card-admin{
  display:none;position:absolute;top:9px;right:9px;gap:6px;
}
.admin-mode .customizer-card-admin{display:flex;}
.customizer-card-admin button{
  border:none;border-radius:50%;width:28px;height:28px;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  font-size:12px;font-weight:900;color:#fff;line-height:1;
}
.customizer-card-admin .edit{background:rgba(30,80,200,.86);}
.customizer-card-admin .delete{background:rgba(229,48,48,.92);}
.customizer-empty{
  border:2px dashed #ddd;border-radius:8px;padding:18px;text-align:center;
  color:#999;font-size:13px;background:#fff;
}
.customizer-modal .modal-color-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:10px;
}
.preset-color-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:14px;
}
.preset-color-control{
  display:grid;gap:6px;
}
.preset-color-control label{
  font-size:11px;font-weight:900;color:#555;letter-spacing:.04em;margin:0;
}
.preset-color-control .swatch-row{
  gap:7px;
}
.preset-color-control .selected-color-chip{width:28px;height:28px;}
.preset-cmyk-grid{
  display:grid;grid-template-columns:repeat(5,18px);gap:5px;
}
.preset-cmyk-grid .cmyk-swatch-btn{width:18px;height:18px;}
.preset-color-name{
  font-size:10px;color:#888;font-family:'DM Mono',monospace;line-height:1.3;
}
.customizer-modal input,
.customizer-modal select,
.customizer-modal textarea{
  width:100%;padding:10px 12px;font-size:13px;
  border:2px solid #ddd;border-radius:6px;font-family:'Noto Sans JP',sans-serif;
  margin-bottom:14px;box-sizing:border-box;background:#fff;
}
.customizer-modal .preset-color-control input[type="hidden"]{display:none;}
.customizer-modal textarea{resize:vertical;min-height:70px;}

/* ══ ギャラリーセクション ══ */
.gallery-section{
  padding:32px 16px;background:#fff;border-top:2px solid #eee;
  max-width:1440px;margin:0 auto;
}
.gallery-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:8px;margin-top:16px;
}
.gallery-item{
  overflow:hidden;border-radius:10px;
  box-shadow:0 2px 10px rgba(0,0,0,.08);
  transition:transform .2s,box-shadow .2s;
  aspect-ratio:1/1;
  position:relative;
}
.gallery-item:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.12);}
.gallery-item img{width:100%;height:100%;display:block;object-fit:cover;}

/* ══ 発注の流れセクション ══ */
.process-section{
  padding:32px 16px;background:#f9f9f9;border-top:2px solid #eee;
  max-width:1440px;margin:0 auto;
}
.process-steps{display:grid;grid-template-columns:1fr;gap:16px;margin-top:20px;}
.process-step{
  background:#fff;border-radius:10px;padding:20px 22px;
  box-shadow:0 2px 8px rgba(0,0,0,.06);transition:box-shadow .2s;
}
.process-step:hover{box-shadow:0 4px 14px rgba(0,0,0,.1);}
.step-num{
  display:inline-block;background:#E53030;color:#fff;
  font-size:13px;font-weight:700;padding:5px 14px;
  border-radius:6px;margin-bottom:10px;
  font-family:'DM Mono',monospace;letter-spacing:.06em;
}
.step-title{font-size:17px;font-weight:700;margin-bottom:8px;color:#111;}
.step-desc{font-size:13px;color:#666;line-height:1.75;}
.process-note{font-size:12px;color:#aaa;line-height:1.8;margin-top:16px;}

/* ══ お問い合わせセクション ══ */
.contact-section{
  padding:32px 16px;background:#fff;border-top:2px solid #eee;
  max-width:1440px;margin:0 auto;
}
.contact-form{max-width:600px;margin:20px auto 0;}
.footer-company{font-size:16px;font-weight:700;margin-bottom:8px;}
.footer-info{font-size:13px;color:#666;line-height:1.8;margin-bottom:20px;}
.footer-info a{color:#E53030;text-decoration:none;}
.form-group{margin-bottom:18px;}
.form-label{display:block;font-size:13px;font-weight:700;margin-bottom:6px;color:#333;}
.form-input,.form-textarea{
  width:100%;padding:11px 14px;font-size:14px;
  border:2px solid #ddd;border-radius:6px;
  font-family:'Noto Sans JP',sans-serif;transition:border-color .2s;
}
.form-input:focus,.form-textarea:focus{outline:none;border-color:#E53030;}
.form-textarea{resize:vertical;min-height:120px;}
.form-submit{
  width:100%;background:#E53030;color:#fff;
  font-size:14px;font-weight:700;padding:14px;
  border:none;border-radius:6px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;transition:background .2s;
}
.form-submit:hover{background:#B71C1C;}

/* ══ 理念セクション ══ */
.philosophy-section{
  padding:48px 16px;background:#111;color:#fff;
  border-top:2px solid #eee;text-align:center;
  max-width:1440px;margin:0 auto;
}
.philosophy-section .section-tag{background:#E53030;}
.philosophy-motto{
  font-size:19px;font-weight:900;line-height:1.6;
  margin:20px 0;color:#fff;word-break:auto-phrase;
}
.philosophy-body{
  font-size:14px;color:#bbb;line-height:1.9;
  max-width:600px;margin:0 auto;
}
.philosophy-body p{margin-bottom:12px;}

/* ══ 採用セクション ══ */
.recruit-section{
  padding:32px 16px;background:#f9f9f9;border-top:2px solid #eee;
  max-width:1440px;margin:0 auto;
}
.recruit-empty{
  max-width:560px;margin:16px auto 0;text-align:center;
  padding:28px 20px;background:#fff;
  border:2px dashed #ddd;border-radius:10px;
}
.recruit-empty p{font-size:14px;color:#888;line-height:1.8;}
/* ══ 求人カード ══ */
.recruit-grid{display:grid;grid-template-columns:1fr;gap:16px;margin-top:16px;}
.recruit-card{
  background:#fff;border-radius:12px;overflow:hidden;
  box-shadow:0 2px 10px rgba(0,0,0,.07);
  border:1.5px solid #eee;
  transition:box-shadow .2s;
  position:relative;
}
.recruit-card:hover{box-shadow:0 4px 18px rgba(0,0,0,.12);}
.recruit-card-header{
  background:#111;color:#fff;
  padding:16px 20px 14px;
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
}
.recruit-card-type{
  font-size:10px;font-weight:700;letter-spacing:.1em;
  background:#E53030;color:#fff;
  padding:3px 10px;border-radius:99px;
  display:inline-block;margin-bottom:6px;
}
.recruit-card-title{font-size:17px;font-weight:700;line-height:1.3;color:#fff;}
.recruit-card-body{padding:18px 20px;}
.recruit-field{display:flex;gap:10px;margin-bottom:10px;font-size:13px;line-height:1.6;}
.recruit-field:last-child{margin-bottom:0;}
.recruit-field-label{
  flex-shrink:0;font-weight:700;color:#555;
  font-size:11px;letter-spacing:.04em;
  min-width:56px;padding-top:1px;
}
.recruit-field-value{color:#333;white-space:pre-wrap;word-break:break-word;}
.recruit-card-footer{
  padding:12px 20px 16px;border-top:1px solid #f0f0f0;
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
}
.recruit-apply-btn{
  background:#E53030;color:#fff;
  font-size:13px;font-weight:700;padding:9px 22px;
  border:none;border-radius:99px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;
  transition:background .2s;text-decoration:none;
  display:inline-block;
}
.recruit-apply-btn:hover{background:#B71C1C;}
.recruit-deadline{font-size:11px;color:#aaa;}

/* 求人追加モーダル */
.recruit-modal-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.6);z-index:2000;
  align-items:flex-start;justify-content:center;
  padding:20px 0;overflow-y:auto;
}
.recruit-modal-overlay.open{display:flex;}
.recruit-modal{
  background:#fff;border-radius:14px;
  padding:28px 24px;width:520px;max-width:95vw;
  box-shadow:0 12px 48px rgba(0,0,0,.22);
  margin:auto;
}
.recruit-modal h4{font-size:16px;font-weight:700;margin-bottom:20px;color:#111;}
.recruit-modal label{
  display:block;font-size:11px;font-weight:700;
  color:#555;margin-bottom:5px;letter-spacing:.05em;text-transform:uppercase;
}
.recruit-modal input,.recruit-modal select,.recruit-modal textarea{
  width:100%;padding:10px 13px;font-size:13px;
  border:2px solid #ddd;border-radius:6px;
  font-family:'Noto Sans JP',sans-serif;
  margin-bottom:14px;box-sizing:border-box;
  background:#fff;transition:border-color .2s;
}
.recruit-modal input:focus,.recruit-modal select:focus,.recruit-modal textarea:focus{
  outline:none;border-color:#E53030;
}
.recruit-modal textarea{resize:vertical;min-height:80px;}
.recruit-modal-btns{display:flex;gap:8px;margin-top:6px;}
.recruit-modal-btns button{
  flex:1;padding:12px;border-radius:6px;
  font-size:13px;font-weight:700;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;border:none;transition:background .2s;
}
.btn-recruit-save{background:#E53030;color:#fff;}
.btn-recruit-save:hover{background:#B71C1C;}
.btn-recruit-cancel{background:#f0f0f0;color:#555;}
.btn-recruit-cancel:hover{background:#e0e0e0;}
.recruit-modal-note{font-size:11px;color:#aaa;margin:-10px 0 12px;line-height:1.6;}

/* 求人削除・編集ボタン */
.recruit-admin-btns{
  display:none;
  position:absolute;top:10px;right:10px;
  gap:6px;
}
.admin-mode .recruit-admin-btns{display:flex;}
.recruit-edit-btn,.recruit-del-btn{
  border:none;border-radius:50%;
  width:28px;height:28px;font-size:13px;
  cursor:pointer;font-weight:700;
  display:flex;align-items:center;justify-content:center;
  transition:background .2s;line-height:1;
}
.recruit-edit-btn{background:rgba(30,80,200,.85);color:#fff;}
.recruit-edit-btn:hover{background:#1e50c8;}
.recruit-del-btn{background:rgba(229,48,48,.9);color:#fff;}
.recruit-del-btn:hover{background:#B71C1C;}

@media(min-width:768px){
  .recruit-grid{grid-template-columns:repeat(2,1fr);gap:20px;}
}
@media(min-width:1024px){
  .recruit-grid{grid-template-columns:repeat(2,1fr);gap:24px;}
}


/* ══ フッター ══ */
footer{
  background:#111;color:#fff;padding:32px 16px;text-align:center;
}
.footer-company-name{font-size:17px;font-weight:700;margin-bottom:10px;}
.footer-address{font-size:12px;color:#ccc;line-height:1.8;margin-bottom:18px;}
.footer-copyright{font-size:11px;color:#666;padding-top:18px;border-top:1px solid #333;}

/* ══ スタッフ管理UI ══ */
/* ログインモーダル */
.staff-modal-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.55);z-index:2000;
  align-items:center;justify-content:center;
}
.staff-modal-overlay.open{display:flex}
.staff-modal{
  background:#fff;border-radius:12px;
  padding:32px 28px;width:320px;max-width:90vw;
  box-shadow:0 8px 40px rgba(0,0,0,.18);
}
.staff-modal h3{font-size:16px;font-weight:700;margin-bottom:6px;color:#111;}
.staff-modal p{font-size:12px;color:#888;margin-bottom:20px;}
.staff-modal input{
  width:100%;padding:10px 14px;font-size:14px;
  border:2px solid #ddd;border-radius:6px;
  font-family:'Noto Sans JP',sans-serif;
  margin-bottom:10px;box-sizing:border-box;
}
.staff-modal input:focus{outline:none;border-color:#E53030;}
.staff-modal-error{
  display:none;font-size:12px;color:#E53030;
  margin-bottom:10px;font-weight:700;
}
.staff-modal-btns{display:flex;gap:8px;}
.staff-modal-btns button{
  flex:1;padding:11px;border-radius:6px;
  font-size:13px;font-weight:700;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;border:none;
}
.staff-modal-btns .btn-login{background:#E53030;color:#fff;transition:background .2s;}
.staff-modal-btns .btn-login:hover{background:#B71C1C;}
.staff-modal-btns .btn-cancel{background:#f0f0f0;color:#555;transition:background .2s;}
.staff-modal-btns .btn-cancel:hover{background:#e0e0e0;}

/* 管理バー */
.admin-bar{
  display:none;position:fixed;
  top:var(--body-pad-top);left:0;right:0;z-index:990;
  background:#111;color:#fff;
  padding:7px 12px 8px;
  flex-direction:column;gap:6px;
}
.admin-bar[hidden],body:not(.admin-mode) .admin-bar{display:none!important;}
.admin-bar.visible{display:flex;}
.admin-bar-row1{display:flex;align-items:center;gap:8px;}
.admin-bar-row2{
  display:flex;align-items:center;gap:6px;
  flex-wrap:nowrap;overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;padding-bottom:1px;
}
.admin-bar-row2::-webkit-scrollbar{display:none;}
.admin-bar-label{font-size:12px;font-weight:700;letter-spacing:.05em;}
.admin-bar-badge{
  background:#E53030;color:#fff;
  font-size:10px;font-weight:700;
  padding:3px 8px;border-radius:99px;flex-shrink:0;
}
.admin-bar-logout{
  background:none;border:1.5px solid #666;color:#ccc;
  font-size:11px;font-weight:700;padding:5px 14px;
  border-radius:99px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;transition:all .2s;
  flex-shrink:0;margin-left:auto;
}
.admin-bar-logout:hover{border-color:#fff;color:#fff;}

html.staff-mode section[id],
html.staff-mode .anchor-target{
  scroll-margin-top:calc(var(--body-pad-top) + var(--admin-bar-h) + 18px)!important;
}

/* 商品カード 削除ボタン */
.admin-delete-btn{
  display:none;
  position:absolute;top:8px;right:8px;
  background:rgba(229,48,48,.9);color:#fff;
  border:none;border-radius:50%;
  width:28px;height:28px;font-size:14px;
  cursor:pointer;font-weight:700;
  align-items:center;justify-content:center;
  z-index:10;transition:background .2s;line-height:1;
}
.admin-mode .admin-delete-btn{display:flex;}
.admin-delete-btn:hover{background:#B71C1C;}

/* ニュース編集ボタン（スライダーカード内・左上） */
.admin-news-edit-btn{
  display:none;
  position:absolute;top:8px;left:8px;
  background:rgba(30,80,200,.85);color:#fff;
  border:none;border-radius:50%;
  width:28px;height:28px;font-size:12px;font-weight:700;
  cursor:pointer;
  align-items:center;justify-content:center;
  z-index:10;transition:background .2s;line-height:1;
}
.admin-mode .admin-news-edit-btn{display:flex;}
.admin-news-edit-btn:hover{background:#1e50c8;}

/* 追加カード */
.admin-add-card{
  display:none;
  background:#fafafa;border:2.5px dashed #ddd;
  border-radius:10px;cursor:pointer;
  align-items:center;justify-content:center;
  flex-direction:column;gap:8px;
  transition:border-color .2s,background .2s;
  min-height:120px;
}
.admin-mode .admin-add-card{display:flex;}
.admin-add-card:hover{border-color:#E53030;background:#FFF5F5;}
.admin-add-icon{font-size:28px;color:#ccc;font-weight:300;line-height:1;}
.admin-add-card:hover .admin-add-icon{color:#E53030;}
.admin-add-label{font-size:12px;font-weight:700;color:#aaa;}
.admin-add-card:hover .admin-add-label{color:#E53030;}

/* ギャラリー追加カード */
.gallery-item.admin-add-card{
  aspect-ratio:1/1;min-height:0;
}

/* 追加フォームモーダル */
.add-modal-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.55);z-index:2000;
  align-items:center;justify-content:center;
}
.add-modal-overlay.open{display:flex}
.add-modal{
  background:#fff;border-radius:12px;
  padding:28px 24px;width:380px;max-width:92vw;
  box-shadow:0 8px 40px rgba(0,0,0,.18);
}
.add-modal h4{font-size:15px;font-weight:700;margin-bottom:16px;color:#111;}
.add-modal label{display:block;font-size:12px;font-weight:700;color:#555;margin-bottom:5px;}
.add-modal input{
  width:100%;padding:10px 12px;font-size:13px;
  border:2px solid #ddd;border-radius:6px;
  font-family:'Noto Sans JP',sans-serif;
  margin-bottom:14px;box-sizing:border-box;
}
.add-modal input:focus{outline:none;border-color:#E53030;}
.add-modal-note{
  font-size:11px;color:#aaa;
  margin:-10px 0 14px;line-height:1.6;
}
.staff-image-field{
  display:flex;gap:8px;align-items:stretch;
  margin-bottom:14px;
}
.staff-image-field input[type="text"]{
  flex:1;margin-bottom:0;
}
.staff-upload-btn{
  flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
  padding:0 14px;font-size:12px;font-weight:700;color:#E53030;
  border:2px solid #E53030;border-radius:6px;cursor:pointer;white-space:nowrap;
}
.staff-upload-btn input{display:none;}
.staff-upload-btn.is-uploading{opacity:.6;pointer-events:none;}
.add-modal-btns{display:flex;gap:8px;}
.add-modal-btns button{
  flex:1;padding:11px;border-radius:6px;
  font-size:13px;font-weight:700;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;border:none;
}
.add-modal-btns .btn-add{background:#E53030;color:#fff;transition:background .2s;}
.add-modal-btns .btn-add:hover{background:#B71C1C;}
.add-modal-btns .btn-addcancel{background:#f0f0f0;color:#555;transition:background .2s;}
.add-modal-btns .btn-addcancel:hover{background:#e0e0e0;}

/* ══ クラウド同期ステータス ══ */
.sync-dot{
  display:inline-block;width:9px;height:9px;
  border-radius:50%;flex-shrink:0;transition:background .4s;
}
.sync-dot.synced{background:#4CAF50;}
.sync-dot.syncing{background:#FFC107;animation:syncPulse .7s infinite alternate;}
.sync-dot.offline{background:#9E9E9E;}
.sync-dot.error{background:#E53030;animation:syncPulse .7s infinite alternate;}
.sync-dot.noconfig{background:#555;}
@keyframes syncPulse{from{opacity:.35}to{opacity:1}}
.sync-label{font-size:11px;color:#ccc;white-space:nowrap;}
.sync-time{font-size:10px;color:#666;white-space:nowrap;letter-spacing:.02em;}
.admin-bar-center{display:contents;}
.admin-cloud-btn{
  background:none;border:1.5px solid #555;color:#aaa;
  font-size:11px;font-weight:700;padding:4px 12px;
  border-radius:99px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;transition:all .2s;
  white-space:nowrap;flex-shrink:0;
}
.admin-cloud-btn:hover{border-color:#fff;color:#fff;}
.admin-cloud-btn.configured{border-color:#4CAF50;color:#4CAF50;}
.admin-cloud-btn.configured:hover{border-color:#81C784;color:#81C784;}
.admin-cloud-btn.is-hidden-state{border-color:#E53030;color:#ffb3b3;}
.admin-cloud-btn.is-hidden-state:hover{border-color:#fff;color:#fff;}

/* ══ 管理バー同期ボタン・タイム ══ */
.admin-sync-btn{
  background:none;border:1.5px solid #555;color:#bbb;
  font-size:11px;font-weight:700;padding:4px 10px;
  border-radius:99px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;transition:all .2s;
  white-space:nowrap;flex-shrink:0;
}
.admin-sync-btn:hover{border-color:#fff;color:#fff;}
.admin-sync-btn:disabled{border-color:#333;color:#444;cursor:not-allowed;opacity:.5;}
.admin-sync-btn--push{border-color:#4CAF50;color:#4CAF50;}
.admin-sync-btn--push:hover{border-color:#81C784;color:#81C784;background:rgba(76,175,80,.1);}
/* エラーバナー */
.sync-error-banner{
  display:none;
  background:rgba(229,48,48,.18);border:1px solid rgba(229,48,48,.45);
  color:#ff8a80;font-size:11px;font-weight:700;
  padding:3px 8px;border-radius:6px;
  align-items:center;gap:6px;flex-shrink:0;
}
.sync-error-banner.show{display:flex;}
.sync-error-retry{
  background:rgba(229,48,48,.35);border:none;color:#fff;
  font-size:10px;font-weight:700;padding:2px 7px;border-radius:4px;
  cursor:pointer;font-family:'Noto Sans JP',sans-serif;transition:background .2s;
  white-space:nowrap;
}
.sync-error-retry:hover{background:rgba(229,48,48,.7);}

/* ══ トースト通知 ══ */
.sync-toast{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);
  background:#111;color:#fff;
  font-size:13px;font-weight:700;
  padding:10px 22px;border-radius:99px;
  opacity:0;pointer-events:none;z-index:9999;
  transition:opacity .3s,transform .3s;
  white-space:nowrap;
}
.sync-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.sync-toast.ok{background:#2a7a4a;}
.sync-toast.ng{background:#C62828;}

/* ══ クラウド設定モーダル ══ */
.cloud-modal-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.7);z-index:3000;
  align-items:center;justify-content:center;
  padding:12px;
}
.cloud-modal-overlay.open{display:flex;}
.cloud-modal{
  background:#fff;border-radius:18px;
  width:480px;max-width:97vw;max-height:92dvh;
  overflow-y:auto;
  box-shadow:0 20px 64px rgba(0,0,0,.35);
}
.cloud-modal-head{
  background:linear-gradient(135deg,#111 0%,#222 100%);color:#fff;
  padding:18px 22px 16px;
  display:flex;align-items:center;gap:14px;
  position:sticky;top:0;z-index:1;
}
.cloud-modal-head-icon{font-size:26px;line-height:1;flex-shrink:0;}
.cloud-modal-head-text h3{font-size:17px;font-weight:700;margin:0 0 3px;}
.cloud-modal-head-text p{font-size:11px;color:#999;margin:0;}
.cloud-modal-close-x{
  margin-left:auto;background:rgba(255,255,255,.1);border:none;
  color:#fff;border-radius:50%;width:30px;height:30px;
  font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:background .2s;
}
.cloud-modal-close-x:hover{background:rgba(255,255,255,.25);}
.cloud-modal-body{padding:20px 22px 24px;}
.cloud-head-badge{
  font-size:10px;font-weight:700;padding:2px 8px;border-radius:99px;
  flex-shrink:0;letter-spacing:.04em;
}
.cloud-head-badge.ok{background:#4CAF50;color:#fff;}
.cloud-head-badge.ng{background:#E53030;color:#fff;}
.cloud-head-badge.info{background:#555;color:#ccc;}
/* 状態バナー */
.cloud-status-banner{
  border-radius:12px;padding:12px 16px;
  margin-bottom:18px;
  display:flex;align-items:center;gap:12px;
}
.cloud-status-banner.ok {background:#E8F5E9;border:1.5px solid #A5D6A7;}
.cloud-status-banner.ng {background:#FFEBEE;border:1.5px solid #EF9A9A;}
.cloud-status-banner.info{background:#F3F4F6;border:1.5px solid #E0E0E0;}
.cloud-status-banner-icon{font-size:22px;flex-shrink:0;}
.cloud-status-banner-texts{flex:1;}
.cloud-status-banner-title{font-size:13px;font-weight:700;margin-bottom:2px;}
.cloud-status-banner-sub{font-size:11px;color:#666;line-height:1.55;}
.cloud-status-banner.ok  .cloud-status-banner-title{color:#1B5E20;}
.cloud-status-banner.ng  .cloud-status-banner-title{color:#B71C1C;}
.cloud-status-banner.info .cloud-status-banner-title{color:#333;}
/* セクション見出し */
.cloud-section-label{
  font-size:10px;font-weight:700;color:#999;letter-spacing:.08em;
  text-transform:uppercase;margin:0 0 10px;
  display:flex;align-items:center;gap:6px;
}
.cloud-section-label::after{content:'';flex:1;height:1px;background:#eee;}
/* フィールド */
.cloud-field{margin-bottom:14px;}
.cloud-field-label{
  display:block;font-size:11px;font-weight:700;color:#444;margin-bottom:5px;
}
.cloud-field-hint{font-weight:400;color:#aaa;margin-left:4px;}
.cloud-input{
  width:100%;padding:11px 14px;font-size:13px;
  border:2px solid #E0E0E0;border-radius:10px;
  font-family:'Noto Sans JP',sans-serif;box-sizing:border-box;
  transition:border-color .2s,background .2s;background:#FAFAFA;
}
.cloud-input:focus{outline:none;border-color:#E53030;background:#fff;}
.cloud-input.has-value{border-color:#4CAF50;background:#fff;}
.cloud-input-wrap{position:relative;}
.cloud-input-wrap .cloud-input{padding-right:42px;}
.cloud-eye-btn{
  position:absolute;right:10px;top:50%;transform:translateY(-50%);
  background:none;border:none;cursor:pointer;
  padding:0 4px;color:#aaa;transition:color .2s;
}
.cloud-eye-btn:hover{color:#333;}
/* SQL折りたたみ */
.cloud-sql-toggle{
  width:100%;background:none;border:1.5px solid #E0E0E0;
  border-radius:8px;padding:10px 14px;
  font-size:12px;font-weight:700;color:#555;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;
  text-align:left;display:flex;align-items:center;gap:8px;
  transition:all .2s;margin-bottom:4px;
}
.cloud-sql-toggle:hover{border-color:#999;color:#111;}
.cloud-sql-toggle-icon{flex-shrink:0;font-size:10px;transition:transform .2s;}
.cloud-sql-toggle.open .cloud-sql-toggle-icon{transform:rotate(90deg);}
.cloud-sql-block{
  display:none;background:#1a1a1a;border-radius:10px;
  padding:14px 16px;margin-bottom:14px;position:relative;
}
.cloud-sql-block.open{display:block;}
.cloud-sql-block pre{
  font-family:'DM Mono',monospace;font-size:11px;
  color:#A5D6A7;line-height:1.8;margin:0;white-space:pre-wrap;
}
.cloud-sql-copy{
  position:absolute;top:8px;right:8px;
  background:rgba(255,255,255,.15);color:#fff;
  font-size:10px;font-weight:700;border:none;
  border-radius:4px;padding:3px 8px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;transition:background .2s;
}
.cloud-sql-copy:hover{background:rgba(255,255,255,.3);}
/* メッセージ */
.cloud-modal-msg{
  font-size:12px;font-weight:700;padding:10px 14px;
  border-radius:10px;margin-bottom:14px;display:none;line-height:1.6;
}
.cloud-modal-msg.success{background:#E8F5E9;color:#2E7D32;display:block;}
.cloud-modal-msg.error  {background:#FFEBEE;color:#C62828;display:block;}
.cloud-modal-msg.info   {background:#E3F2FD;color:#1565C0;display:block;}
/* スニペット */
.cloud-snippet-wrap{
  background:#1a1a1a;border-radius:10px;
  padding:12px 14px;position:relative;margin-bottom:6px;
}
.cloud-snippet-label{
  font-size:10px;font-weight:700;color:#666;
  letter-spacing:.06em;text-transform:uppercase;margin-bottom:5px;
}
.cloud-snippet-code{
  font-family:'DM Mono',monospace;font-size:11px;
  color:#A5D6A7;line-height:1.9;word-break:break-all;user-select:all;
}
.cloud-snippet-copy{
  position:absolute;top:8px;right:8px;
  background:rgba(255,255,255,.15);color:#fff;
  font-size:10px;font-weight:700;border:none;
  border-radius:4px;padding:3px 8px;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;transition:background .2s;
}
.cloud-snippet-copy:hover{background:rgba(255,255,255,.3);}
.cloud-snippet-note{font-size:11px;color:#aaa;margin-top:5px;line-height:1.6;}
/* ボタン */
.cloud-modal-actions{display:flex;gap:8px;margin-top:18px;}
.cloud-modal-actions button{
  flex:1;padding:13px;border-radius:10px;
  font-size:14px;font-weight:700;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;border:none;transition:all .2s;
}
.btn-cloud-connect{background:#E53030;color:#fff;}
.btn-cloud-connect:hover{background:#B71C1C;}
.btn-cloud-connect:disabled{background:#ccc;cursor:not-allowed;}
.btn-cloud-close-modal{background:#F0F0F0;color:#555;}
.btn-cloud-close-modal:hover{background:#E0E0E0;}
.btn-cloud-disconnect{
  display:none;background:none;border:1.5px solid #FFCDD2;
  color:#C62828;cursor:pointer;border-radius:10px;
  font-family:'Noto Sans JP',sans-serif;font-size:12px;font-weight:700;
  text-align:center;width:100%;margin-top:10px;padding:10px;
  transition:all .2s;
}
.btn-cloud-disconnect:hover{background:#FFEBEE;}

/* ══ 新着バッジ（NEW） ══ */
.badge-new {
  position: absolute;
  top: 10px;
  left: 10px;
  background: #E53030;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 4px 8px;
  border-radius: 4px;
  z-index: 5;
  letter-spacing: .05em;
  box-shadow: 0 2px 6px rgba(229,48,48,.3);
  pointer-events: none;
}

/* ══ スマホ専用微調整 (〜479px) ══ */
@media (max-width:1023px){
  .header-nav{display:none;}
}
@media (max-width:767px){
  .customizer-section{scroll-margin-top:0;}
  .customizer-preview-panel{overflow:hidden;}
  .preview-color-layout{grid-template-columns:minmax(0,1fr) clamp(120px,30vw,150px);gap:10px;}
  .preview-color-layout .wear-preview-canvas{
    aspect-ratio:auto;min-height:0;height:clamp(240px,56vw,320px);
  }
  .wear-preview-canvas{min-height:0;}
  .wear-svg{width:min(100%,520px);max-height:calc(100% - 18px);}
  .direct-print-panel{position:relative;z-index:1;}
  .customizer-actions{gap:8px;margin-top:14px;}
  .customizer-actions .customizer-action-btn{width:auto;min-height:42px;padding:9px 14px;font-size:12px;}
  .direct-print-actions{gap:7px;}
  .direct-print-actions .customizer-action-btn{flex:1 1 88px;padding:8px 8px;font-size:10.5px;}
}
@media (max-width:479px){
  .hero{padding:16px 12px 0;}
  .hero-h1{font-size:26px;}
  .hero-badge{font-size:24px;padding:3px 10px 5px;}
  .hero-h1-suffix{font-size:26px;}
  .hero-cta .btn-outline-round,
  .hero-cta .btn-red-round,
  .hero-cta .shop-add-btn{font-size:12px;padding:9px 18px;}
  .admin-mode .shop-button-item .btn-red-round{padding-right:38px;}
  .header-inner{padding:6px 10px;}
  .logo-wrap img{height:28px;}
  .logo-wrap h3{font-size:10px;}
  .admin-cloud-btn{display:inline-block;}
  .sync-label{font-size:10px;}
  .cloud-modal,.add-modal,.staff-modal{padding:22px 16px;}
  .lineup-section,.gallery-section,
  .process-section,.guide-section,.contact-section,.philosophy-section,
  .recruit-section,.news-section,.customizer-section{padding-left:12px;padding-right:12px;}
  .form-input,.form-textarea{font-size:16px;}
  .product-name{font-size:13px;padding:8px 10px 6px;}
  .product-link{font-size:11px;padding:0 10px 10px;}
  .gallery-grid{grid-template-columns:repeat(3,1fr);gap:6px;}
  .step-title{font-size:15px;}
  .step-desc{font-size:12px;}
  .guide-grid{gap:10px;}
  .guide-body{padding:12px;}
  .guide-kicker{font-size:10px;margin-bottom:6px;}
  .guide-title{font-size:14px;line-height:1.4;margin-bottom:6px;}
  .guide-desc{font-size:11.5px;line-height:1.65;margin-bottom:10px;}
  .guide-link{font-size:11.5px;}
  .customizer-head{gap:10px;margin-bottom:12px;}
  .customizer-copy{font-size:12px;line-height:1.65;}
  .customizer-admin-tools{width:100%;gap:8px;}
  .customizer-admin-tools .customizer-action-btn{flex:1 1 136px;text-align:center;}
  .customizer-preview-panel,
  .customizer-controls-panel{padding:10px;border-radius:8px;}
  .preview-color-layout{grid-template-columns:minmax(0,1fr) clamp(108px,34vw,126px);gap:8px;}
  .preview-color-panel{padding-left:8px;}
  .preview-color-layout .wear-preview-canvas{
    aspect-ratio:auto;min-height:0;height:clamp(210px,61vw,238px);
  }
  .wear-preview-canvas{aspect-ratio:4/3;min-height:238px;background-size:24px 24px;}
  .wear-preview-canvas::before{inset:10px;}
  .wear-svg{width:min(100%,360px);filter:drop-shadow(0 10px 12px rgba(0,0,0,.13));}
  .direct-print-panel{gap:8px;margin-top:10px;padding:9px;}
  .direct-print-tabs{gap:7px;}
  .direct-print-tab{min-height:44px;font-size:13px;}
  .direct-print-tools{grid-template-columns:repeat(6,minmax(40px,1fr));gap:7px;}
  .direct-print-btn{min-height:44px;font-size:16px;}
  .customizer-summary{gap:6px;margin-top:10px;}
  .customizer-summary-box{padding:10px 11px;}
  .customizer-block{padding-bottom:14px;}
  .wear-type-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;}
  .wear-type-btn{min-height:54px;padding:7px 4px;}
  .wear-type-name{font-size:12px;}
  .wear-type-price{font-size:9px;}
  .color-control-head{align-items:flex-start;}
  .color-control-value{max-width:64%;font-size:9px;line-height:1.4;}
  .swatch-row{gap:7px;}
  .selected-color-chip{width:38px;height:38px;}
  .preview-color-panel .color-control-grid{gap:9px;}
  .preview-color-panel .color-control-label{font-size:10.5px;}
  .preview-color-panel .selected-color-chip{width:24px;height:24px;}
  .preview-color-panel .swatch-row{gap:4px;margin-bottom:4px;}
  .color-current-name{font-size:8px;}
  .cmyk-swatch-grid{grid-template-columns:repeat(4,24px);gap:3px;}
  .cmyk-swatch-btn{width:24px;height:24px;}
  .preset-cmyk-grid{grid-template-columns:repeat(5,18px);gap:5px;}
  .preset-cmyk-grid .cmyk-swatch-btn{width:18px;height:18px;}
  .custom-color-input{width:40px;height:40px;}
  .customizer-field-grid{grid-template-columns:1fr;}
  .customizer-input,
  .customizer-select,
  .customizer-textarea{font-size:16px;padding:10px 11px;}
  .customizer-actions{gap:8px;margin-top:14px;}
  .customizer-actions .customizer-action-btn{width:auto;min-height:42px;padding:9px 14px;font-size:12px;}
  .direct-print-actions{gap:7px;}
  .direct-print-actions .customizer-action-btn{flex:1 1 88px;padding:8px 8px;font-size:10.5px;}
  .customizer-title{font-size:19px;}
}

/* ══ 商品一覧オーバーレイ ══ */
.lineup-all-overlay{
  display:none;position:fixed;inset:0;
  background:#fff;z-index:2000;
  flex-direction:column;overflow:hidden;
}
.lineup-all-overlay.open{display:flex;}
/* スクロールエフェクト削除 */
.lineup-all-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 20px;border-bottom:1.5px solid #eee;
  background:#fff;position:sticky;top:0;z-index:10;flex-shrink:0;
}
.lineup-all-title{
  display:flex;align-items:center;gap:10px;
}
.lineup-all-title .section-tag{font-size:14px;padding:8px 16px;cursor:default;}
.lineup-all-count{font-size:12px;color:#999;font-weight:500;}
.lineup-all-close{
  background:none;border:1.5px solid #ccc;border-radius:50%;
  width:36px;height:36px;font-size:18px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  color:#555;transition:all .2s;flex-shrink:0;
}
.lineup-all-close:hover{border-color:#E53030;color:#E53030;}
.lineup-all-inner{
  flex:1;overflow-y:auto;padding:24px 16px 48px;
  -webkit-overflow-scrolling:touch;
}
.lineup-all-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
  max-width:1200px;margin:0 auto;
}
.lineup-all-card{
  background:#fff;border-radius:10px;overflow:hidden;
  box-shadow:0 2px 10px rgba(0,0,0,.08);
  transition:transform .2s,box-shadow .2s;
  position:relative;
}
.lineup-all-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.12);}
.lineup-all-thumb{
  width:100%;aspect-ratio:1/1;background:#f9f9f9;
  overflow:hidden;
}
.lineup-all-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.lineup-all-name{font-size:15px;font-weight:700;padding:12px 14px 8px;color:#111;}
.lineup-all-link{
  display:block;font-size:12px;font-weight:700;color:#E53030;
  padding:0 14px 12px;text-decoration:none;transition:color .2s;
}
.lineup-all-link:hover{color:#8B0000;}
.lineup-all-buy-link{
  display:block;font-size:12px;font-weight:700;color:#fff;
  background:#E53030;padding:8px 14px;margin:0 14px 14px;
  text-decoration:none;border-radius:99px;text-align:center;
  transition:background .2s;
}
.lineup-all-buy-link:hover{background:#B71C1C;}
.product-buy-btn{
  display:block;width:calc(100% - 24px);margin:0 12px 12px;
  text-align:center;background:#E53030;color:#fff;
  font-size:12px;font-weight:700;padding:9px 12px;
  border-radius:99px;text-decoration:none;
  transition:background .2s;
}
.product-buy-btn:hover{background:#B71C1C;}
.lineup-all-empty{
  text-align:center;padding:60px 20px;color:#aaa;font-size:14px;
}
@media(min-width:480px){
  .lineup-all-grid{grid-template-columns:repeat(3,1fr);gap:20px;}
}
@media(min-width:768px){
  .lineup-all-header{padding:16px 32px;}
  .lineup-all-inner{padding:32px 24px 64px;}
  .lineup-all-grid{grid-template-columns:repeat(3,1fr);gap:24px;}
  .lineup-all-name{font-size:16px;}
}
@media(min-width:1024px){
  .lineup-all-grid{grid-template-columns:repeat(4,1fr);gap:28px;}
}

/* ══ レスポンシブ ══ */
@media (min-width:768px){
  body{max-width:768px;margin:0 auto;}
  .header-inner{padding:12px 24px;gap:12px;}
  .logo-wrap img{height:38px;}
  .logo-wrap h3{font-size:13px;}
  .header-nav a{font-size:11px;padding:4px 7px;}
  .hero{padding:32px 24px 0;}
  .hero-sub{font-size:16px;}
  .hero-h1{font-size:44px;}
  .hero-h1-suffix{font-size:44px;}
  .hero-badge{font-size:42px;padding:6px 20px 8px;}
  .hero-cta .btn-outline-round,.hero-cta .btn-red-round,.hero-cta .shop-add-btn{font-size:15px;padding:12px 30px;}
  .admin-mode .shop-button-item .btn-red-round{padding-right:44px;}
  .hero-visual{height:380px;margin:0 -24px;}
  .hero-jersey{left:-40px;width:420px;}
  .hero-kuma{right:41px;top:115px;width:100px;}
  .hero-circle{right:16px;bottom:40px;width:150px;height:150px;}
  .hero-circle-text{font-size:13px;}
  .section-header{padding:0 24px;margin-bottom:24px;}
  .section-tag{font-size:17px;padding:12px 24px;}
  .btn-pill{font-size:15px;padding:12px 30px;}
  .slider-outer{padding:0 24px;}
  .slider-arrow{width:44px;height:44px;font-size:24px;}
  .news-section,.lineup-section,.gallery-section,.process-section,
  .guide-section,
  .contact-section,.philosophy-section,.recruit-section,.customizer-section{padding:40px 24px;}
  .products-grid{grid-template-columns:repeat(2,1fr);gap:20px;}
  .gallery-grid{grid-template-columns:repeat(4,1fr);gap:16px;}
  .process-steps{grid-template-columns:repeat(3,1fr);gap:18px;}
  .guide-grid{grid-template-columns:repeat(2,1fr);gap:18px;}
  .philosophy-motto{font-size:22px;}
  .admin-cloud-btn{display:inline-block;}
  .customizer-shell{grid-template-columns:1fr;gap:18px;align-items:start;}
  .preview-color-layout{grid-template-columns:minmax(0,1fr) minmax(210px,260px);gap:16px;}
  .preview-color-layout .wear-preview-canvas{
    aspect-ratio:auto;min-height:0;height:clamp(320px,52vw,430px);
  }
  .preview-color-panel{
    border-left:1px solid #eee;border-top:none;
    padding-left:16px;padding-top:0;
  }
  .customizer-summary{grid-template-columns:repeat(2,1fr);}
  .color-control-grid{grid-template-columns:repeat(2,1fr);}
  .preview-color-panel .color-control-grid{grid-template-columns:1fr;}
  .preview-color-panel .color-control-value{display:none;}
  .customizer-controls .customizer-field-grid{grid-template-columns:repeat(2,1fr);}
  .customizer-preset-grid{grid-template-columns:repeat(2,1fr);}
  .wear-type-grid{grid-template-columns:repeat(3,1fr);}
}
@media (min-width:1024px){
  body{max-width:1024px;margin:0 auto;}
  .header-inner{padding:16px 40px;gap:16px;}
  .logo-wrap img{height:44px;}
  .logo-wrap h3{font-size:15px;}
  .header-nav a{font-size:13px;padding:5px 10px;}
  .hero{padding:48px 40px 0;}
  .hero-sub{font-size:18px;}
  .hero-h1{font-size:56px;}
  .hero-h1-suffix{font-size:56px;}
  .hero-badge{font-size:52px;padding:8px 24px 10px;}
  .hero-cta .btn-outline-round,.hero-cta .btn-red-round,.hero-cta .shop-add-btn{font-size:16px;padding:14px 36px;}
  .admin-mode .shop-button-item .btn-red-round{padding-right:48px;}
  .hero-visual{height:420px;margin:0 -40px;}
  .hero-jersey{left:-50px;width:460px;}
  .hero-kuma{right: 50px;top: 99px;width: 105px;}
  .hero-circle{right: 27px;bottom: 121px;width: 150px;height: 150px;}
  .hero-circle-text{font-size:13px;}
  .hero-circle-arrow{font-size:22px;}
  .news-section,.lineup-section,.gallery-section,.process-section,
  .guide-section,
  .contact-section,.philosophy-section,.recruit-section,.customizer-section{padding:56px 40px;}
  .products-grid{grid-template-columns:repeat(3,1fr);gap:28px;}
  .product-name{font-size:19px;padding:16px 20px 12px;}
  .product-link{font-size:14px;padding:0 20px 16px;}
  .gallery-grid{grid-template-columns:repeat(5,1fr);gap:18px;}
  .section-header{padding:0 40px;}
  .slider-outer{padding:0 40px;}
  .slider-arrow{width:50px;height:50px;font-size:26px;}
  .guide-grid{grid-template-columns:repeat(4,1fr);gap:20px;}
  .guide-body{padding:16px;} /* 20pxから16pxに縮小 */
  .guide-title{font-size:16px;} /* 19pxから16pxに縮小 */
  .customizer-shell{grid-template-columns:minmax(340px,.85fr) minmax(0,1.15fr);gap:24px;}
  .customizer-preview-panel{position:sticky;top:116px;}
  .preview-color-layout{grid-template-columns:1fr;}
  .preview-color-layout .wear-preview-canvas{height:auto;min-height:300px;aspect-ratio:1/1;}
  .preview-color-panel{
    border-left:none;border-top:1px solid #eee;
    padding-left:0;padding-top:10px;
  }
  .preview-color-panel .color-control-grid{grid-template-columns:repeat(2,1fr);}
  .preview-color-panel .color-control-value{display:inline;text-align:right;}
  .customizer-preset-grid{grid-template-columns:repeat(3,1fr);}
}
@media (min-width:1440px){
  body{max-width:1440px;margin:0 auto;}
  .header-inner{padding:20px 60px;}
  .hero{padding:64px 60px 0;}
  .hero-sub{font-size:20px;}
  .hero-h1{font-size:68px;}
  .hero-h1-suffix{font-size:68px;}
  .hero-badge{font-size:64px;padding:10px 28px 12px;}
  .hero-visual{height:480px;margin:0 -60px;}
  .hero-jersey{left:-60px;width:500px;}
  .hero-kuma{right:65px;top:200px;width:110px;}
  .hero-circle{right:40px;bottom:60px;width:160px;height:160px;}
  .preview-color-layout{grid-template-columns:minmax(0,1fr) 146px;}
  .preview-color-panel{
    border-left:1px solid #eee;border-top:none;
    padding-left:10px;padding-top:0;
  }
  .preview-color-panel .color-control-grid{grid-template-columns:1fr;}
  .preview-color-panel .color-control-value{display:none;}
  .hero-circle-text{font-size:14px;}
  .section-header{padding:0 60px;}
  .slider-outer{padding:0 60px;}
  .news-section,.lineup-section,.gallery-section,.process-section,
  .guide-section,
  .contact-section,.philosophy-section,.recruit-section,.customizer-section{padding:72px 60px;}
  .products-grid{gap:32px;}
  .gallery-grid{gap:28px;}
}
	
/* ── ヒーロー 3つの強みパネル ── */
.hero-promises {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 48px;
  margin-bottom: 24px;
  z-index: 10;
  position: relative;
  flex: 1 0 100%;
}
.promise-card {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: rgba(255, 255, 255, 0.9);
  border: 1.5px solid #eee;
  border-radius: 12px;
  padding: 16px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
  transition: transform .2s, box-shadow .2s;
  backdrop-filter: blur(4px);
}
.promise-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(229, 48, 48, 0.08);
  border-color: #ffcdd2;
}
.promise-num {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #FFF5F5;
  color: #E53030;
  font-family: 'DM Mono', monospace;
  font-size: 15px;
  font-weight: 700;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  flex-shrink: 0;
}
.promise-info h4 {
  font-size: 14px;
  font-weight: 700;
  color: #111;
  margin-bottom: 6px;
  line-height: 1.4;
}
.promise-info p {
  font-size: 11.5px;
  color: #666;
  line-height: 1.6;
}

/* ── レスポンシブ対応 ── */
@media (min-width: 768px) {
  .hero-promises { grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 52px; margin-bottom: 32px; }
  .promise-card { flex-direction: column; padding: 20px; gap: 12px; }
  .promise-num { width: 40px; height: 40px; font-size: 16px; }
  .promise-info h4 { font-size: 15px; }
  .promise-info p { font-size: 12px; }
}
@media (min-width: 1024px) {
  .hero-promises { gap: 20px; }
  .promise-card { padding: 24px; }
  .promise-info h4 { font-size: 16px; margin-bottom: 8px; }
  .promise-info p { font-size: 13px; }
}
@media (max-width: 479px) {
  .hero-promises { margin-bottom: 20px; }
  .promise-card { padding: 14px; gap: 12px; }
  .promise-num { width: 32px; height: 32px; font-size: 13px; }
  .promise-info h4 { font-size: 13px; }
  .promise-info p { font-size: 11px; }
}

/* ══ 商品詳細モーダル ══ */
.product-detail-overlay{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.65);z-index:2500;
  align-items:center;justify-content:center;
  padding:16px;
}
.product-detail-overlay.open{display:flex;}
.product-detail-modal{
  background:#fff;border-radius:16px;
  width:480px;max-width:95vw;max-height:90dvh;
  overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 16px 60px rgba(0,0,0,.28);
}
.product-detail-img{
  width:100%;aspect-ratio:1/1;background:#f5f5f5;
  overflow:hidden;flex-shrink:0;max-height:54vw;
}
@media(min-width:480px){.product-detail-img{max-height:260px;}}
.product-detail-img img{
  width:100%;height:100%;object-fit:cover;display:block;
}
.product-detail-body{
  padding:20px 22px 24px;
  display:flex;flex-direction:column;gap:14px;
  overflow-y:auto;
}
.product-detail-name{
  font-size:20px;font-weight:900;color:#111;
  letter-spacing:.02em;
}
.product-detail-actions{
  display:flex;gap:10px;flex-wrap:wrap;
}
.product-detail-link{
  flex:1;display:block;text-align:center;
  background:#E53030;color:#fff;
  font-size:14px;font-weight:700;
  padding:13px 20px;border-radius:99px;
  text-decoration:none;transition:background .2s;
  white-space:nowrap;
}
.product-detail-link:hover{background:#B71C1C;}
.product-detail-close{
  background:#f0f0f0;color:#555;
  font-size:14px;font-weight:700;
  padding:13px 20px;border-radius:99px;
  border:none;cursor:pointer;
  font-family:'Noto Sans JP',sans-serif;
  transition:background .2s;white-space:nowrap;
}
.product-detail-close:hover{background:#e0e0e0;}
	
	.upload-box{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;

  width:100%;
  min-height:120px;

  border:2px dashed #ddd;
  border-radius:12px;

  background:#fafafa;

  cursor:pointer;

  transition:.2s;
}
.logo-upload-input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
  clip:rect(0,0,0,0);
  clip-path:inset(50%);
}

.upload-box:hover,
.upload-box.is-dragover{
  border-color:#E53030;
  background:#FFF5F5;
}
.upload-box.is-dragover{
  box-shadow:0 0 0 4px rgba(229,48,48,.08);
  transform:translateY(-1px);
}
.upload-box:focus-visible{
  outline:none;
  border-color:#E53030;
  box-shadow:0 0 0 4px rgba(229,48,48,.12);
}

.upload-box span{
  font-size:13px;
  font-weight:700;
  color:#777;
}
.logo-upload-hint{
  display:block;
  margin-top:4px;
  font-size:11px;
  font-weight:600;
  color:#999;
}
.upload-box.is-maxed{
  opacity:.55;
  pointer-events:none;
}
.logo-preview-list{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:10px;
}
.logo-preview-item{
  position:relative;
  flex:1 1 88px;
  max-width:calc(33.333% - 7px);
  min-width:72px;
}
.logo-preview-item img{
  width:100%;
  aspect-ratio:1;
  object-fit:contain;
  border-radius:8px;
  background:#f5f5f5;
  display:block;
  cursor:pointer;
}
.logo-preview-item.is-active img{
  outline:2px solid #E53030;
  outline-offset:2px;
}
.logo-preview-clear{
  position:absolute;
  top:8px;right:8px;
  z-index:2;
  width:30px;height:30px;
  border:none;border-radius:50%;
  background:rgba(17,17,17,.75);
  color:#fff;
  font-size:20px;line-height:1;
  font-family:'Noto Sans JP',sans-serif;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background .2s,transform .15s;
}
.logo-preview-clear:hover{background:#E53030;}
.logo-preview-clear:active{transform:scale(.94);}

/* ══ レスポンシブ最終調整 ══ */
body{
  max-width:none!important;
  margin:0!important;
}
img,svg,video{
  max-width:100%;
  height:auto;
}
.top-bar,
header{
  left:0;
  right:0;
}
.header-inner,
.hero,
.news-section,
.lineup-section,
.customizer-section,
.gallery-section,
.process-section,
.guide-section,
.contact-section,
.philosophy-section,
.recruit-section,
footer{
  width:100%;
  max-width:1440px;
  margin-left:auto;
  margin-right:auto;
}
.header-inner{
  padding-left:clamp(12px,3vw,60px);
  padding-right:clamp(12px,3vw,60px);
}
.hero,
.news-section,
.lineup-section,
.customizer-section,
.gallery-section,
.process-section,
.guide-section,
.contact-section,
.philosophy-section,
.recruit-section{
  padding-left:clamp(14px,4vw,60px);
  padding-right:clamp(14px,4vw,60px);
}
.hero-visual{
  height:clamp(280px,38vw,480px);
}
.hero-jersey{
  width:clamp(300px,42vw,500px);
}
.hero-kuma{
  width:clamp(80px,10vw,110px);
}
.products-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));
}
.gallery-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(110px,100%),1fr));
}
.guide-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr));
}
.process-steps{
  grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr));
}
.recruit-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));
}
.customizer-shell{
  grid-template-columns:minmax(320px,.9fr) minmax(0,1.1fr);
}
.mascot-accent img{
  object-fit:contain;
}
.mascot-accent--hero{width:clamp(96px,12vw,160px);}
.mascot-accent--lineup{width:clamp(90px,11vw,142px);}
.mascot-accent--customize{width:clamp(92px,12vw,150px);}
.mascot-accent--process{width:clamp(84px,10vw,128px);}
.mascot-accent--contact{width:clamp(92px,11vw,140px);}
.mascot-accent--philosophy{width:clamp(84px,10vw,128px);}

/* ══ キャラ重なり・文章位置の補正 ══ */
.process-section{
  overflow:hidden;
  padding-bottom:clamp(88px,8vw,118px)!important;
}
.process-section .lineup-label{
  text-align:left;
}
.process-steps{
  align-items:stretch;
}
.process-step{
  min-height:0;
}
.process-note{
  max-width:calc(100% - clamp(120px,13vw,180px));
  padding-right:0!important;
}
.mascot-accent--process{
  z-index:3;
  right:clamp(22px,4vw,56px);
  bottom:clamp(22px,4vw,44px);
  width:clamp(82px,8.5vw,118px);
}
.philosophy-section{
  overflow:hidden;
  padding-bottom:clamp(64px,8vw,96px)!important;
}
.philosophy-section .lineup-label,
.philosophy-motto,
.philosophy-body{
  max-width:680px;
  margin-left:auto;
  margin-right:auto;
  padding-right:0!important;
}
.philosophy-body{
  text-wrap:pretty;
}
.mascot-accent--philosophy{
  z-index:3;
  right:clamp(36px,5vw,72px);
  bottom:clamp(28px,4vw,54px);
  width:clamp(82px,8vw,116px);
}
@media (max-width:1023px){
  .customizer-shell{
    grid-template-columns:1fr!important;
  }
  .customizer-preview-panel{
    position:static!important;
  }
  .products-grid,
  .gallery-grid,
  .guide-grid,
  .process-steps,
  .recruit-grid{
    gap:clamp(12px,3vw,20px);
  }
}

/* =========================================================
   2026-05-29 premium hero polish
   トップキャラのレスポンシブ崩れ補正と、高級感のある企業向けトーンの最終調整
   ========================================================= */
:root{
  --corp-navy:#1b2638;
  --corp-navy-deep:#111927;
  --corp-slate:#5f6978;
  --corp-border:#ded5c8;
  --corp-bg:#f4f0e8;
  --corp-surface:#fffdf8;
  --corp-surface-2:#f8f4ed;
  --corp-accent:#b78b45;
  --corp-accent-dark:#7c5c2a;
  --corp-gold-soft:#eadcc4;
  --corp-shadow:0 22px 54px rgba(17,25,39,.1);
  --corp-shadow-soft:0 14px 32px rgba(17,25,39,.08);
}
body{
  background:
    radial-gradient(ellipse at 8% 0%,rgba(183,139,69,.12),transparent 34%),
    radial-gradient(ellipse at 94% 8%,rgba(27,38,56,.08),transparent 32%),
    linear-gradient(180deg,#f7f3ec 0%,#eef2f6 100%)!important;
}
header{
  border-bottom:1px solid rgba(222,213,200,.9)!important;
  box-shadow:0 12px 32px rgba(17,25,39,.06)!important;
}
.header-nav a:hover,
.header-nav a:focus-visible{
  background:#f7f1e7!important;
  color:var(--corp-accent-dark)!important;
}
.hero{
  position:relative!important;
  min-height:clamp(620px,58vw,760px)!important;
  padding:clamp(58px,6vw,92px) clamp(24px,6vw,84px) clamp(54px,6vw,82px)!important;
  padding-right:clamp(320px,34vw,500px)!important;
  background:
    linear-gradient(105deg,rgba(255,255,255,.98) 0 62%,rgba(248,244,237,.72) 62% 100%),
    radial-gradient(ellipse at 84% 40%,rgba(234,220,196,.88),transparent 42%),
    linear-gradient(180deg,#fffdfa 0%,#f5f1ea 100%)!important;
  border-color:rgba(222,213,200,.92)!important;
  border-radius:0 0 26px 26px!important;
  box-shadow:0 28px 70px rgba(17,25,39,.11)!important;
}
.hero::after{
  content:""!important;
  position:absolute!important;
  top:clamp(72px,8vw,124px)!important;
  right:clamp(28px,5vw,86px)!important;
  width:clamp(230px,26vw,390px)!important;
  height:clamp(250px,30vw,430px)!important;
  border:1px solid rgba(183,139,69,.24)!important;
  border-radius:42% 58% 48% 52%/50% 44% 56% 50%!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.88),rgba(248,241,230,.42)),
    radial-gradient(circle at 34% 24%,rgba(255,255,255,.95),transparent 34%)!important;
  box-shadow:0 24px 60px rgba(17,25,39,.08)!important;
  z-index:0!important;
}
.hero-sub{
  color:var(--corp-accent-dark)!important;
  border-color:rgba(183,139,69,.34)!important;
  background:rgba(255,255,255,.84)!important;
}
.hero-sub::before{
  content:"";
  width:24px;
  height:1px;
  background:var(--corp-accent);
}
.hero-h1,
.hero-h1-suffix{
  color:var(--corp-navy-deep)!important;
  text-shadow:none!important;
  letter-spacing:.01em!important;
}
.hero-h1-suffix{
  color:#273449!important;
}
.hero-h1-suffix::after{
  height:3px!important;
  width:min(420px,70%)!important;
  background:linear-gradient(90deg,var(--corp-accent),rgba(183,139,69,.18))!important;
  border-radius:999px!important;
}
.hero-desc{
  color:var(--corp-slate)!important;
  background:none!important;
  text-decoration:none!important;
  font-weight:700!important;
}
.hero-cta-row .btn-red-round,
.hero-cta .btn-red-round{
  background:linear-gradient(135deg,var(--corp-navy-deep),#273852)!important;
  border:1px solid rgba(17,25,39,.92)!important;
  box-shadow:0 14px 30px rgba(17,25,39,.18)!important;
}
.hero-cta-row .btn-red-round::after{
  content:"→";
}
.hero-cta-row .btn-outline-round,
.hero-cta .btn-outline-round{
  background:rgba(255,255,255,.88)!important;
  border:1px solid rgba(183,139,69,.44)!important;
  color:var(--corp-navy)!important;
  box-shadow:0 10px 24px rgba(17,25,39,.06)!important;
}
.hero-feature-card{
  border-color:rgba(222,213,200,.94)!important;
  background:linear-gradient(180deg,#fff 0%,#fbf8f2 100%)!important;
}
.hero-feature-card::before{
  background:linear-gradient(180deg,var(--corp-accent),rgba(183,139,69,.28))!important;
}
.mascot-accent--hero{
  position:absolute!important;
  z-index:3!important;
  width:clamp(245px,24vw,350px)!important;
  right:clamp(42px,8vw,116px)!important;
  top:clamp(124px,13vw,184px)!important;
  margin:0!important;
}
.mascot-accent--hero img{
  filter:drop-shadow(0 28px 38px rgba(17,25,39,.16))!important;
}
.hero-mascot-bubble{
  left:50%!important;
  right:auto!important;
  top:clamp(-18px,-1vw,-8px)!important;
  transform:translateX(-50%)!important;
  border-color:rgba(183,139,69,.38)!important;
  color:var(--corp-navy)!important;
  box-shadow:0 18px 34px rgba(17,25,39,.14)!important;
  white-space:nowrap;
}
.hero-mascot-bubble::after{
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  border-top-color:rgba(183,139,69,.38)!important;
}
@media (max-width:1180px){
  .hero{
    padding-right:clamp(250px,31vw,360px)!important;
  }
  .mascot-accent--hero{
    width:clamp(220px,26vw,290px)!important;
    right:clamp(22px,4vw,46px)!important;
    top:clamp(132px,15vw,176px)!important;
  }
}
@media (max-width:1023px){
  .hero{
    display:grid!important;
    grid-template-columns:minmax(0,1fr);
    padding:42px 18px 40px!important;
  }
  .hero-sub{order:1;}
  .hero-h1{order:2;}
  .hero-h1-accent{order:3;}
  .hero-desc{order:4;}
  .hero-cta{order:5;}
  .hero-shop-links{order:6;}
  .mascot-accent--hero{
    order:7;
    position:relative!important;
    width:min(44vw,230px)!important;
    right:auto!important;
    top:auto!important;
    margin:clamp(18px,3vw,28px) auto clamp(8px,2vw,18px)!important;
  }
  .hero-features{
    order:8;
  }
  .hero::after{
    top:auto!important;
    right:50%!important;
    bottom:clamp(210px,32vw,300px)!important;
    width:min(52vw,300px)!important;
    height:min(58vw,330px)!important;
    transform:translateX(50%)!important;
  }
  .hero-mascot-bubble{
    top:-10px!important;
    max-width:min(250px,80vw)!important;
    white-space:normal;
    text-align:center;
  }
}
@media (min-width:560px) and (max-width:1023px){
  .hero{
    display:block!important;
    padding:42px clamp(20px,4vw,32px) 42px!important;
    padding-right:clamp(190px,34vw,260px)!important;
  }
  .mascot-accent--hero{
    position:absolute!important;
    width:clamp(165px,28vw,220px)!important;
    right:clamp(18px,4vw,38px)!important;
    top:clamp(150px,22vw,210px)!important;
    margin:0!important;
  }
  .hero::after{
    top:clamp(128px,19vw,188px)!important;
    right:clamp(8px,3vw,26px)!important;
    bottom:auto!important;
    width:clamp(180px,34vw,270px)!important;
    height:clamp(190px,38vw,292px)!important;
    transform:none!important;
  }
  .hero-features{
    margin-top:34px!important;
  }
  .hero-mascot-bubble{
    max-width:190px!important;
    padding:10px 12px!important;
    font-size:11.5px!important;
    line-height:1.55!important;
  }
}
@media (max-width:767px){
  .hero{
    padding:34px 18px 36px!important;
  }
  .hero-h1,
  .hero-h1-suffix{
    font-size:clamp(31px,9.2vw,44px)!important;
    line-height:1.1!important;
  }
  .hero-desc{
    max-width:100%!important;
  }
  .mascot-accent--hero{
    order:5;
  }
  .hero-cta{order:6;}
  .hero-shop-links{order:7;}
  .hero-features{order:8;}
  .mascot-accent--hero{
    width:min(52vw,210px)!important;
  }
  .hero::after{
    bottom:clamp(250px,70vw,420px)!important;
    width:min(66vw,260px)!important;
    height:min(72vw,285px)!important;
  }
}
@media (max-width:559px){
  .hero::after{
    bottom:clamp(310px,88vw,500px)!important;
  }
  .mascot-accent--hero{
    margin:clamp(14px,4vw,22px) auto clamp(12px,4vw,24px)!important;
  }
}
@media (max-width:767px){
  .hero{
    padding-top:18px;
  }
  .hero-cta,
  .shop-buttons{
    gap:8px;
  }
  .hero-cta .btn-outline-round,
  .hero-cta .btn-red-round,
  .hero-cta .shop-add-btn,
  .btn-pill{
    max-width:100%;
    white-space:normal;
    text-align:center;
  }
  .products-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .lineup-all-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .customizer-actions .customizer-action-btn{
    flex:1 1 140px;
  }
  .mascot-accent--lineup,
  .mascot-accent--customize,
  .mascot-accent--contact{
    width:clamp(68px,22vw,92px);
  }
  .process-note{
    max-width:none;
    padding-right:0!important;
  }
  .mascot-accent--process,
  .mascot-accent--philosophy{
    display:none;
  }
}
@media (max-width:420px){
  .products-grid,
  .lineup-all-grid{
    grid-template-columns:1fr;
  }
  .hero-visual{
    height:260px;
  }
  .hero-jersey{
    left:-48px;
  }
}

/* ══ ヒーロー改良：サンプル寄せ ══ */
.hero-h1{
  margin-top:0;
  color:var(--kawaii-red)!important;
  font-size:clamp(42px,6.5vw,80px)!important;
  line-height:1.08;
  letter-spacing:-.01em;
  font-weight:900;
}
.hero-h1-suffix{
  font-size:clamp(42px,6.5vw,80px)!important;
  color:#222!important;
  line-height:1.08;
  font-weight:900;
}
.hero-h1-accent{
  margin-bottom:18px;
}
.hero-desc{
  font-size:clamp(13px,1.4vw,16px);
  color:#444;
  line-height:1.75;
  margin-bottom:26px;
  max-width:480px;
  font-weight:500;
}
.hero-cta-row{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:wrap;
  gap:10px!important;
  align-items:center;
  margin-bottom:0!important;
}
.hero-cta-row .btn-red-round,
.hero-cta-row .btn-outline-round{
  font-size:clamp(13px,1.2vw,15px)!important;
  padding:12px 24px!important;
}
/* 4-feature row */
.hero-features{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-top:32px;
  position:relative;
  z-index:3;
}
.hero-feature-card{
  background:rgba(255,255,255,.96);
  border:1px solid rgba(255,47,63,.13);
  border-radius:18px;
  padding:16px 14px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  text-align:center;
  box-shadow:0 8px 22px rgba(255,47,63,.07);
  transition:transform .2s,box-shadow .2s;
}
.hero-feature-card:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(255,47,63,.12);
}
.hero-feature-mascot{
  width:52px;
  height:52px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-feature-mascot img{
  width:100%;
  height:100%;
  object-fit:contain;
  filter:drop-shadow(0 4px 8px rgba(255,47,63,.15));
}
.hero-feature-title{
  font-size:13px;
  font-weight:900;
  color:#222;
  line-height:1.3;
}
.hero-feature-desc{
  font-size:11px;
  color:#666;
  line-height:1.6;
}
/* 吹き出し */
.hero-mascot-bubble{
  position:absolute;
  top:-10px;
  right:100%;
  margin-right:14px;
  background:#fff;
  border:2px solid var(--kawaii-line);
  border-radius:18px 18px 4px 18px;
  padding:10px 14px;
  font-size:12px;
  font-weight:700;
  color:var(--kawaii-red);
  line-height:1.6;
  white-space:nowrap;
  box-shadow:0 8px 20px rgba(255,47,63,.1);
  pointer-events:none;
}
.hero-mascot-bubble::after{
  content:'';
  position:absolute;
  bottom:-12px;
  right:14px;
  border:6px solid transparent;
  border-top:6px solid var(--kawaii-line);
}
/* マスコット位置の調整 */
.mascot-accent--hero{
  position:absolute;
  z-index:3;
  right:clamp(20px,4vw,80px)!important;
  top:clamp(40px,5vw,80px)!important;
  width:clamp(200px,26vw,380px)!important;
  display:block!important;
}
.mascot-accent--hero img{
  filter:drop-shadow(0 20px 36px rgba(255,47,63,.2));
}
/* モバイル */
@media(max-width:1023px){
  .hero-features{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .mascot-accent--hero{
    position:relative!important;
    right:auto!important;
    top:auto!important;
    width:min(58vw,240px)!important;
    margin:18px auto 0;
  }
  .hero-mascot-bubble{
    right:auto!important;
    left:50%;
    transform:translateX(-50%);
    top:-46px;
    margin-right:0;
    border-radius:18px 18px 18px 4px;
  }
}
@media(max-width:600px){
  .hero-features{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-top:22px;
  }
  .hero-feature-mascot{width:40px;height:40px;}
  .hero-feature-title{font-size:11.5px;}
  .hero-feature-desc{font-size:10px;}
}
@media(min-width:1024px){
  .hero{
    padding-right:clamp(300px,32vw,450px)!important;
  }
}


:root{
  --top-bar-h:0px;
  --header-main-h:82px;
  --kawaii-red:#ff2f3f;
  --kawaii-red-dark:#e42532;
  --kawaii-pink:#fff1f2;
  --kawaii-pink-2:#ffe4e7;
  --kawaii-cream:#fffaf7;
  --kawaii-line:#ffc9cf;
  --kawaii-text:#202020;
  --kawaii-shadow:0 18px 45px rgba(255,47,63,.13);
}
html{scroll-behavior:smooth;}
section[id],
.anchor-target{
  scroll-margin-top:calc(var(--body-pad-top) + 18px)!important;
}
body{
  background:
    linear-gradient(90deg,rgba(255,47,63,.045) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,47,63,.035) 1px,transparent 1px),
    radial-gradient(circle at 13% 13%,rgba(255,47,63,.12) 0 9px,transparent 10px),
    radial-gradient(circle at 88% 16%,rgba(255,47,63,.14) 0 13px,transparent 14px),
    var(--kawaii-cream);
  background-size:38px 38px,38px 38px,100% 100%,100% 100%,auto;
  color:var(--kawaii-text);
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(159deg,transparent 0 56%,rgba(255,47,63,.08) 56% 64%,transparent 64%),
    radial-gradient(ellipse at 19% 18%,rgba(255,47,63,.1) 0 20%,transparent 44%),
    radial-gradient(ellipse at 88% 7%,rgba(255,47,63,.09) 0 18%,transparent 45%);
}
.top-bar{
  top:14px;
  left:auto;
  right:clamp(14px,3vw,34px);
  width:auto;
  height:auto;
  background:transparent;
  z-index:1300;
}
.top-bar-btn{
  border-radius:999px;
  padding:12px 22px;
  background:linear-gradient(135deg,var(--kawaii-red),#ff6470);
  box-shadow:0 12px 26px rgba(255,47,63,.22);
}
header{
  top:0;
  background:rgba(255,255,255,.93);
  border-bottom:1px solid rgba(255,47,63,.14);
  box-shadow:0 12px 34px rgba(255,47,63,.08);
  backdrop-filter:blur(14px);
}
.header-inner{
  min-height:82px;
  padding-top:10px;
  padding-bottom:10px;
}
.logo-wrap{gap:10px;}
.logo-wrap img{
  display:block;
  height:44px;
  width:auto;
  object-fit:contain;
}
.logo-wrap::before{
  content:none;
}
.logo-wrap h3{
  font-size:15px;
  font-weight:900;
  letter-spacing:.03em;
  color:#1d1d1d;
}
.logo-wrap::after{
  content:none;
}
.header-nav{gap:clamp(12px,2vw,28px);}
.header-nav a{
  position:relative;
  padding:7px 0;
  font-size:13px;
  font-weight:900;
  color:#222;
}
.header-nav a::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-12px;
  width:0;
  height:3px;
  border-radius:999px;
  background:var(--kawaii-red);
  transform:translateX(-50%);
  transition:width .18s ease;
}
.header-nav a:hover::after,
.header-nav a:focus-visible::after{width:22px;}
.cart-btn-header{
  border:1.5px solid var(--kawaii-line);
  background:#fff;
  color:var(--kawaii-red);
  border-radius:999px;
  padding:10px 20px;
  box-shadow:0 10px 24px rgba(255,47,63,.08);
}
.cart-badge{background:var(--kawaii-red);}
.menu-toggle{
  border-color:var(--kawaii-line);
  border-radius:14px;
  background:#fff;
}
.mobile-menu{border-left:1px solid rgba(255,47,63,.12);}

.hero{
  min-height:clamp(610px,62vw,820px);
  padding:clamp(54px,7vw,96px) clamp(20px,6vw,86px) clamp(116px,14vw,170px)!important;
  background:
    radial-gradient(circle at 12% 18%,rgba(255,47,63,.12) 0 12px,transparent 13px),
    radial-gradient(circle at 88% 13%,rgba(255,47,63,.12) 0 14px,transparent 15px),
    linear-gradient(170deg,rgba(255,47,63,.08),transparent 36%),
    linear-gradient(155deg,#fff 0%,#fff7f8 48%,#ffe5e8 100%);
  border:1px solid rgba(255,47,63,.11);
  border-radius:0 0 42px 42px;
  box-shadow:var(--kawaii-shadow);
}
.hero::before{
  content:"";
  position:absolute;
  left:-8%;
  right:-8%;
  bottom:-76px;
  height:220px;
  background:rgba(255,47,63,.12);
  border-radius:50% 50% 0 0/100% 100% 0 0;
  transform:rotate(-2deg);
  z-index:0;
}
.hero-sub{
  display:inline-block;
  color:var(--kawaii-red);
  background:#fff;
  border:1px solid var(--kawaii-line);
  border-radius:999px;
  padding:8px 16px;
  font-weight:900;
  box-shadow:0 8px 20px rgba(255,47,63,.08);
}
.hero-h1,
.hero-h1-suffix{
  font-size:clamp(34px,5.2vw,64px)!important;
  line-height:1.12;
  letter-spacing:0;
}
.hero-h1{
  margin-top:22px;
  color:var(--kawaii-red)!important;
}
.hero-h1-suffix{
  display:inline-block;
  color:#222!important;
}
.hero-h1-suffix::first-letter{color:inherit;}
.hero-h1-accent{margin-bottom:28px;}
.hero > .hero-cta{
  max-width:620px;
  position:static!important;
  z-index:4;
}
.hero-cta > .btn-outline-round,
.hero-cta > .shop-buttons{
  position:relative;
  z-index:4;
}
.hero-cta .btn-outline-round,
.hero-cta .btn-red-round,
.hero-cta .shop-add-btn,
.btn-pill{
  border-radius:999px;
  border-color:var(--kawaii-red);
  color:var(--kawaii-red);
  background:#fff;
  box-shadow:0 10px 26px rgba(255,47,63,.09);
}
.hero-cta .btn-outline-round:first-child,
.btn-red-round,
.customizer-action-btn.checkout,
.form-submit,
.product-buy-btn,
.lineup-all-buy-link{
  background:linear-gradient(135deg,var(--kawaii-red),#ff5c69)!important;
  color:#fff!important;
  border-color:transparent!important;
}
.shop-buttons .btn-red-round{
  background:#fff!important;
  color:var(--kawaii-red)!important;
  border:2px solid var(--kawaii-red)!important;
}
.mascot-accent--hero{
  display:block!important;
  z-index:3;
  width:clamp(300px,35vw,540px)!important;
  right:clamp(32px,8vw,130px)!important;
  top:clamp(84px,9vw,130px)!important;
  bottom:auto!important;
}
.mascot-accent--hero img{filter:drop-shadow(0 26px 38px rgba(255,47,63,.2));}
@media(min-width:1024px){
  .hero-mascot-bubble{
    right:auto;
    left:clamp(28px,5vw,86px);
    top:clamp(-22px,-1.4vw,-10px);
    margin-right:0;
  }
  .hero-mascot-bubble::after{
    right:18px;
  }
}
.hero-promises{
  display:none!important;
}
.promise-card{
  background:rgba(255,255,255,.93);
  border:1px solid rgba(255,47,63,.15);
  border-radius:22px;
  box-shadow:var(--kawaii-shadow);
  padding:22px;
}
.promise-num{
  color:var(--kawaii-red);
  font-family:'DM Mono',monospace;
  font-weight:900;
}
.promise-info h4{
  color:#222;
  font-weight:900;
}
.promise-info{
  min-width:0;
}
.promise-info p{color:#666;}

.news-section,
.lineup-section,
.customizer-section,
.gallery-section,
.process-section,
.guide-section,
.contact-section,
.philosophy-section,
.recruit-section{
  position:relative;
  margin-top:22px!important;
  border:1px solid rgba(255,47,63,.12)!important;
  border-radius:34px!important;
  box-shadow:var(--kawaii-shadow);
  background:rgba(255,255,255,.86)!important;
  overflow:hidden;
}
.news-section > *,
.gallery-section > *,
.guide-section > *,
.recruit-section > *{
  position:relative;
  z-index:1;
}
.lineup-section::after,
.customizer-section::after,
.process-section::after,
.guide-section::after,
.contact-section::after,
.recruit-section::after{
  content:"";
  position:absolute;
  inset:14px;
  z-index:0;
  pointer-events:none;
  border:1px dashed rgba(255,47,63,.09);
  border-radius:28px;
}
.section-tag{
  background:linear-gradient(135deg,var(--kawaii-red),#ff626f)!important;
  border-radius:14px;
  box-shadow:0 12px 26px rgba(255,47,63,.16);
}
.product-card,
.guide-card,
.process-step,
.recruit-card,
.customizer-preview-panel,
.customizer-controls-panel,
.contact-form,
.slider-card,
.gallery-item{
  border:1px solid transparent!important;
  border-radius:22px!important;
  box-shadow:0 14px 36px rgba(255,47,63,.08)!important;
  background:#fff!important;
}
.product-card:hover,
.guide-card:hover,
.gallery-item:hover,
.process-step:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 40px rgba(255,47,63,.13)!important;
  border-color:rgba(255,47,63,.38)!important;
}
.product-thumb,
.lineup-all-thumb,
.guide-thumb{
  background:linear-gradient(135deg,#fff,#fff0f2)!important;
}
.product-name,
.lineup-all-name,
.guide-title,
.step-title{
  font-weight:900;
  color:#222;
}
.product-name{
  font-size:clamp(15px,1.35vw,18px)!important;
  line-height:1.38;
  min-height:3.2em;
  padding-bottom:6px!important;
}
.product-link{
  margin-top:auto;
  padding-top:8px!important;
}
.product-desc{
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.product-card{
  min-height:0;
}
.product-thumb{
  aspect-ratio:1.18/1!important;
  max-height:260px!important;
}
.product-thumb img{
  object-fit:cover;
}
.product-link,
.guide-link{color:var(--kawaii-red)!important;}
.recruit-apply-btn{color:#fff!important;}

.customizer-section{
  background:linear-gradient(135deg,#fff,#fff2f4)!important;
}
.customizer-head{
  align-items:flex-start;
  margin-bottom:24px;
}
.customizer-title{
  font-size:clamp(24px,3vw,38px);
  font-weight:900;
  color:#222;
}
.customizer-copy{
  color:#555;
  font-weight:700;
}
.customizer-shell{gap:26px;}
.wear-preview-canvas{
  border:1.5px solid var(--kawaii-line)!important;
  border-radius:22px!important;
  background-color:#fff!important;
  background-size:28px 28px!important;
}
.wear-preview-canvas::before{
  border-color:rgba(255,47,63,.12);
  border-radius:18px;
}
.wear-type-btn,
.direct-print-tab,
.direct-print-btn,
.customizer-input,
.customizer-select,
.customizer-textarea,
.upload-box{
  border-radius:14px!important;
  border-color:#ffd1d6!important;
}
.wear-type-btn.active,
.color-part-tab.active,
.direct-print-tab.active{
  border-color:var(--kawaii-red)!important;
  background:#fff0f2!important;
  color:var(--kawaii-red)!important;
}
.customizer-live-estimate,
.customizer-summary-box{
  border-color:var(--kawaii-red)!important;
  background:#fff4f5!important;
  border-radius:18px!important;
}
.customizer-action-btn,
.direct-print-btn{
  border-radius:999px!important;
}
.customizer-preset-card,
.lineup-all-card{
  border:1px solid transparent!important;
  border-color:transparent!important;
  border-radius:18px!important;
  background:#fff!important;
}
.lineup-all-card:hover{
  border-color:rgba(255,47,63,.38)!important;
}

.process-section{
  background:linear-gradient(135deg,#fff,#fff6f7)!important;
}
.process-step{min-height:190px;}
.step-num{
  background:#fff0f2!important;
  color:var(--kawaii-red)!important;
  border:1px solid var(--kawaii-line);
  border-radius:999px!important;
}
.contact-section{
  background:linear-gradient(135deg,#fff,#fff6f7)!important;
}
.contact-form{
  padding:clamp(22px,4vw,42px);
}
.form-input,
.form-textarea{
  border-color:#ffd1d6!important;
  border-radius:14px!important;
}
.form-input:focus,
.form-textarea:focus{
  border-color:var(--kawaii-red)!important;
  box-shadow:0 0 0 4px rgba(255,47,63,.09);
}

.philosophy-section{
  background:#111!important;
  border-color:#222!important;
}
.philosophy-section::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,255,255,.03) 1px,transparent 1px);
  background-size:34px 34px;
  pointer-events:none;
}
.philosophy-section .section-tag{
  background:linear-gradient(135deg,var(--kawaii-red),#ff626f)!important;
}
.philosophy-motto{
  font-size:clamp(24px,3vw,38px)!important;
}
.philosophy-body p{color:#cfcfcf;}

.recruit-card-header{
  background:linear-gradient(135deg,#222,#111)!important;
}
.recruit-card-type{
  background:var(--kawaii-red)!important;
}
footer{
  background:linear-gradient(135deg,#fff,#fff0f2)!important;
  color:#222!important;
  border:1px solid rgba(255,47,63,.12);
  border-radius:34px 34px 0 0;
  box-shadow:var(--kawaii-shadow);
}
.footer-address,
.footer-copyright{color:#555!important;}
.footer-copyright{border-top-color:#ffd4d8!important;}
.mascot-accent--lineup{
  right:clamp(24px,4vw,48px);
  top:clamp(24px,4vw,44px);
  bottom:auto;
  width:clamp(64px,7vw,92px)!important;
}
.mascot-accent--customize{
  right:26px;
  top:28px;
  width:clamp(84px,10vw,124px)!important;
}
.mascot-accent--process{
  right:clamp(28px,5vw,72px)!important;
  bottom:clamp(28px,5vw,54px)!important;
  width:clamp(76px,8vw,110px)!important;
}
.mascot-accent--contact{
  right:clamp(24px,5vw,58px)!important;
  top:clamp(20px,4vw,40px)!important;
  width:clamp(88px,10vw,120px)!important;
}
.mascot-accent--philosophy{
  right:clamp(42px,6vw,90px)!important;
  bottom:clamp(34px,5vw,64px)!important;
  width:clamp(76px,9vw,108px)!important;
}

@media (max-width:1023px){
  :root{--header-main-h:74px;}
  .top-bar{display:none;}
  .header-inner{min-height:74px;}
  .logo-wrap img{
    height:38px;
  }
  .logo-wrap::after{display:none;}
  .hero{
    min-height:auto;
    padding-bottom:clamp(34px,8vw,64px)!important;
  }
  .mascot-accent--hero{
    display:block!important;
    position:relative!important;
    right:auto!important;
    top:auto!important;
    width:min(58vw,240px)!important;
    margin:18px auto 0;
  }
  .hero-promises{
    position:relative;
    left:auto;
    right:auto;
    bottom:auto;
    grid-template-columns:1fr;
    margin-top:24px;
  }
  .customizer-head{padding-right:0!important;}
  .contact-form{padding-right:clamp(22px,4vw,42px)!important;}
}
@media (max-width:767px){
  :root{--header-main-h:66px;}
  .header-inner{min-height:66px;}
  .logo-wrap h3{font-size:12px;}
  .hero{
    border-radius:0 0 28px 28px;
  }
  .hero-h1,
  .hero-h1-suffix{
    font-size:clamp(32px,10vw,46px)!important;
  }
  .news-section,
  .lineup-section,
  .customizer-section,
  .gallery-section,
  .process-section,
  .guide-section,
  .contact-section,
  .philosophy-section,
  .recruit-section{
    border-radius:24px!important;
    margin-top:16px!important;
  }
  .lineup-section::after,
  .customizer-section::after,
  .process-section::after,
  .guide-section::after,
  .contact-section::after,
  .recruit-section::after{
    inset:9px;
    border-radius:20px;
  }
  .products-grid,
  .guide-grid,
  .process-steps,
  .recruit-grid{
    grid-template-columns:1fr!important;
  }
  .gallery-grid{
    grid-template-columns:repeat(3,1fr)!important;
    gap:6px!important;
  }
  .section-tag{
    font-size:14px;
    padding:10px 16px;
  }
  .logo-wrap h3{
    display:block;
    font-size:11px;
  }
  .cart-btn-header{
    position:relative;
    width:40px;
    min-width:40px;
    padding:0;
    font-size:0;
    border-radius:14px;
  }
  .cart-btn-header::before{
    content:"";
    width:17px;
    height:13px;
    border:2px solid currentColor;
    border-top:none;
    border-radius:2px 2px 4px 4px;
    transform:skewX(-8deg);
  }
  .cart-btn-header::after{
    content:"";
    position:absolute;
    left:13px;
    bottom:8px;
    width:4px;
    height:4px;
    border-radius:50%;
    background:currentColor;
    box-shadow:12px 0 0 currentColor;
  }
  .promise-card{
    width:100%;
    max-width:100%;
  }
  .promise-info p{
    overflow-wrap:anywhere;
  }
  .mascot-accent--lineup,
  .mascot-accent--customize,
  .mascot-accent--contact{
    opacity:.9;
  }
}

/* ══ 仕上げ調整：フッター・終盤・レスポンシブの重なり対策 ══ */
/* デスクトップ：デザインガイドボタンとカートボタンの重なり回避 */
@media(min-width:1024px){
  .header-inner{
    padding-right:clamp(160px,17vw,210px)!important;
  }
}
.menu-toggle{display:none!important;}
.btn-pill,
.product-buy-btn,
.lineup-all-buy-link,
.customizer-action-btn,
.form-submit,
.cart-btn-header{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.btn-center{
  position:relative;
  z-index:4;
}
.product-buy-btn,
.lineup-all-buy-link{
  margin-top:auto!important;
}
.contact-section,
.philosophy-section,
.recruit-section{
  max-width:min(1200px,calc(100% - clamp(20px,5vw,72px)))!important;
}
.contact-section{
  margin-top:clamp(24px,4vw,42px)!important;
}
.mascot-accent--contact{
  z-index:4;
}
.philosophy-section{
  border-radius:32px!important;
  box-shadow:0 22px 55px rgba(17,17,17,.18)!important;
}
.recruit-section{
  padding:clamp(32px,5vw,58px) clamp(20px,5vw,62px)!important;
  background:
    radial-gradient(circle at 9% 24%,rgba(255,47,63,.12) 0 10px,transparent 11px),
    radial-gradient(circle at 94% 20%,rgba(255,47,63,.09) 0 18px,transparent 19px),
    linear-gradient(135deg,#fff,#fff4f5)!important;
}
.recruit-section::before{
  content:none;
}
.recruit-section > :not(.mascot-accent){
  position:relative;
  z-index:2;
}
.recruit-empty{
  margin-left:0!important;
  margin-right:clamp(110px,18vw,190px)!important;
  border-color:rgba(255,47,63,.16)!important;
  background:rgba(255,255,255,.82)!important;
  box-shadow:0 14px 36px rgba(255,47,63,.08)!important;
}
footer{
  position:relative;
  isolation:isolate;
  max-width:min(1200px,calc(100% - clamp(20px,5vw,72px)))!important;
  margin:clamp(18px,4vw,34px) auto 0!important;
  padding:clamp(34px,5vw,58px) clamp(26px,6vw,74px) clamp(64px,7vw,82px)!important;
  padding-right:clamp(220px,30vw,390px)!important;
  text-align:left!important;
  overflow:hidden;
  border-radius:32px 32px 0 0!important;
  background:
    radial-gradient(circle at 12% 20%,rgba(255,47,63,.12) 0 11px,transparent 12px),
    radial-gradient(circle at 84% 14%,rgba(255,47,63,.10) 0 16px,transparent 17px),
    linear-gradient(135deg,#fffdfa 0%,#fff4f5 52%,#fff 100%)!important;
}
footer::before{
  content:"";
  position:absolute;
  inset:14px 14px 48px;
  border:1px dashed rgba(255,47,63,.12);
  border-radius:26px 26px 8px 8px;
  pointer-events:none;
  z-index:-1;
}
footer::after{
  content:"";
  position:absolute;
  right:clamp(26px,6vw,84px);
  bottom:44px;
  width:clamp(108px,14vw,180px);
  aspect-ratio:1;
  background:url("https://firebasestorage.googleapis.com/v0/b/so-i-cloud.firebasestorage.app/o/uploads%2Fsozai__kyara-09__png.webp?alt=media&token=a05afc23-eef5-449f-af42-1b74658ed50d") center/contain no-repeat;
  filter:drop-shadow(0 18px 28px rgba(255,47,63,.18));
  z-index:0;
  pointer-events:none;
}
.footer-company-name{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:12px;
  font-size:clamp(20px,2.1vw,28px)!important;
  line-height:1.2;
  margin-bottom:14px!important;
}
/* フッターナビ列 */
.footer-inner{
  display:flex;
  gap:clamp(20px,4vw,52px);
  align-items:flex-start;
  position:relative;
  z-index:1;
  flex-wrap:wrap;
}
.footer-col-info{
  flex-shrink:0;
  min-width:0;
}
.footer-nav-columns{
  display:grid;
  grid-template-columns:repeat(4,auto);
  gap:clamp(14px,3vw,36px);
  min-width:0;
}
.footer-nav-col{}
.footer-nav-heading{
  font-size:11.5px;
  font-weight:900;
  color:#111;
  margin-bottom:9px;
  letter-spacing:.03em;
  white-space:nowrap;
}
.footer-nav-col a{
  display:flex;
  align-items:center;
  min-height:24px;
  font-size:11px;
  color:#666;
  text-decoration:none;
  padding:2px 0;
  white-space:nowrap;
  transition:color .18s;
}
.footer-nav-col a:hover{color:var(--kawaii-red);}
.footer-sns{
  display:flex;
  gap:8px;
  margin-top:14px;
  align-items:center;
}
.footer-sns-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:50%;
  color:#fff;
  text-decoration:none;
  transition:opacity .18s;
}
.footer-sns-link svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
}
.footer-sns-link circle:last-child{
  fill:currentColor;
  stroke:none;
}
.footer-sns-link:hover{opacity:.78;}
.footer-sns-instagram{
  background:linear-gradient(135deg,#f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
}
.footer-company-name::before{
  content:"";
  width:46px;
  height:46px;
  flex:0 0 auto;
  background:url("https://firebasestorage.googleapis.com/v0/b/so-i-cloud.firebasestorage.app/o/uploads%2Frogo_aka__png.webp?alt=media&token=f58ec36d-117b-4e0e-9385-3e42959e3a22") center/contain no-repeat;
}
.footer-address{
  position:relative;
  z-index:1;
  max-width:460px;
  font-size:13px!important;
  line-height:1.9!important;
}
.footer-copyright{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:2;
  margin:0!important;
  padding:14px clamp(18px,4vw,44px)!important;
  border-top:0!important;
  background:linear-gradient(90deg,var(--kawaii-red),#ef2632)!important;
  color:#fff!important;
  text-align:center;
  letter-spacing:.02em;
}

.cart-btn-header,
.product-link,
.guide-link{
  color:var(--kawaii-red-dark)!important;
}

@media (max-width:1023px){
  .menu-toggle{display:flex!important;}
  .header-inner{
    gap:10px;
    justify-content:space-between;
    position:relative;
  }
  .logo-wrap h3{
    display:block;
    font-size:12px;
  }
  .logo-wrap{
    max-width:calc(100% - 104px);
  }
  .header-right{
    position:absolute;
    top:50%;
    right:clamp(10px,3vw,28px);
    transform:translateY(-50%);
    gap:8px;
  }
  .cart-btn-header{
    position:relative;
    width:40px;
    min-width:40px;
    padding:0;
    font-size:0;
    border-radius:14px;
  }
  .cart-btn-header::before{
    content:"";
    width:17px;
    height:13px;
    border:2px solid currentColor;
    border-top:none;
    border-radius:2px 2px 4px 4px;
    transform:skewX(-8deg);
  }
  .cart-btn-header::after{
    content:"";
    position:absolute;
    left:13px;
    bottom:8px;
    width:4px;
    height:4px;
    border-radius:50%;
    background:currentColor;
    box-shadow:12px 0 0 currentColor;
  }
  .customizer-actions,
  .direct-print-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:stretch;
  }
  .customizer-actions .customizer-action-btn,
  .direct-print-actions .customizer-action-btn{
    width:100%;
    white-space:normal;
    text-align:center;
  }
  .contact-section,
  .philosophy-section,
  .recruit-section,
  footer{
    max-width:calc(100% - 28px)!important;
  }
  footer{
    padding-right:clamp(170px,28vw,280px)!important;
  }
}
@media (max-width:767px){
  .hero-cta{
    display:grid!important;
    grid-template-columns:1fr;
    align-items:stretch;
    width:100%;
    max-width:100%;
  }
  .hero-cta > .btn-outline-round,
  .shop-buttons,
  .shop-button-item,
  .shop-button-item .btn-red-round{
    width:100%;
  }
  .shop-buttons{
    display:grid!important;
    grid-template-columns:1fr;
  }
  .customizer-actions,
  .direct-print-actions{
    grid-template-columns:1fr;
  }
  .direct-print-actions{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .direct-print-actions .customizer-undo-btn{
    grid-column:1/-1;
  }
  .recruit-section::before{
    opacity:.18;
    right:-10px;
    bottom:18px;
    width:150px;
  }
  .recruit-empty{
    margin-right:0!important;
  }
  footer{
    max-width:100%!important;
    margin-top:18px!important;
    padding:34px 22px 158px!important;
    text-align:center!important;
    border-radius:28px 28px 0 0!important;
  }
  footer::before{
    inset:10px 10px 44px;
    border-radius:22px 22px 8px 8px;
  }
  footer::after{
    right:50%;
    bottom:48px;
    width:100px;
    transform:translateX(50%);
    opacity:.95;
  }
  .footer-inner{
    flex-direction:column;
    align-items:center;
  }
  .footer-nav-columns{
    grid-template-columns:repeat(2,auto);
    justify-content:center;
    gap:16px 28px;
    margin-top:18px;
  }
  .footer-nav-col{text-align:left;}
  .footer-sns{justify-content:center;}
  .footer-company-name{
    justify-content:center;
    flex-direction:column;
    gap:8px;
    font-size:22px!important;
  }
  .footer-address{
    max-width:none;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
  }
}
@media (max-width:480px){
  .header-inner{
    padding-left:10px!important;
    padding-right:10px!important;
  }
  .logo-wrap{
    gap:7px;
  }
  .logo-wrap img{
    height:32px!important;
    width:auto;
  }
  .logo-wrap h3{
    display:block;
    font-size:11px;
  }
  .cart-btn-header{
    position:relative;
    width:40px;
    min-width:40px;
    padding:0;
    font-size:0;
    border-radius:14px;
  }
  .cart-btn-header::before{
    content:"";
    width:17px;
    height:13px;
    border:2px solid currentColor;
    border-top:none;
    border-radius:2px 2px 4px 4px;
    transform:skewX(-8deg);
  }
  .cart-btn-header::after{
    content:"";
    position:absolute;
    left:13px;
    bottom:8px;
    width:4px;
    height:4px;
    border-radius:50%;
    background:currentColor;
    box-shadow:12px 0 0 currentColor;
  }
  .menu-toggle{
    width:38px!important;
    height:38px!important;
  }
  .product-card,
  .lineup-all-card,
  .guide-card,
  .process-step{
    border-radius:18px!important;
  }
  .product-buy-btn,
  .lineup-all-buy-link,
  .btn-pill,
  .form-submit{
    width:100%;
  }
  .footer-copyright{
    font-size:10px!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }
}

/* ══ 追加調整：ラインナップ・ガイド幅、マスコット吹き出し、スタッフ時の揺れ防止 ══ */
.lineup-section,
.guide-section{
  max-width:min(1080px,calc(100% - clamp(20px,5vw,72px)))!important;
}
.products-grid,
.guide-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(170px,100%),1fr))!important;
  gap:clamp(10px,2vw,18px)!important;
  justify-items:center;
}
.product-card,
.guide-card{
  width:100%;
  max-width:240px;
}
.guide-intro{
  max-width:680px!important;
}
.product-name,
.guide-title{
  overflow-wrap:anywhere;
}
.product-buy-btn{
  width:calc(100% - 20px)!important;
  margin:0 10px 10px!important;
}
@media (min-width:1024px){
  .products-grid{
    grid-template-columns:repeat(auto-fit,minmax(170px,1fr))!important;
  }
  .guide-grid{
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr))!important;
  }
}
@media (max-width:767px){
  .lineup-section,
  .guide-section{
    max-width:100%!important;
  }
  .products-grid,
  .guide-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .product-card,
  .guide-card{
    max-width:none;
  }
  .product-name{
    font-size:12.5px!important;
    min-height:0;
    padding:9px 10px 7px!important;
  }
  .product-link,
  .guide-link{
    font-size:11px!important;
  }
  .guide-body{
    padding:10px!important;
  }
  .guide-title{
    font-size:12.5px!important;
  }
  .guide-desc{
    font-size:10.5px!important;
  }
}
@media (max-width:420px){
  .products-grid,
  .guide-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

html.staff-mode{
  scroll-behavior:auto!important;
}
body.admin-mode .slider-track,
body.admin-mode .sync-toast,
body.admin-mode .menu-toggle span,
body.admin-mode .product-card,
body.admin-mode .guide-card,
body.admin-mode .gallery-item,
body.admin-mode .process-step,
body.admin-mode .lineup-all-card{
  transition:none!important;
}
body.admin-mode .product-card:hover,
body.admin-mode .guide-card:hover,
body.admin-mode .gallery-item:hover,
body.admin-mode .process-step:hover,
body.admin-mode .lineup-all-card:hover{
  transform:none!important;
}

@media (max-width:959px){
  .mascot-accent,
  .mascot-accent--hero,
  .mascot-accent--process,
  .mascot-accent--philosophy{
    display:block!important;
  }
}
@media (max-width:767px){
  .mascot-accent{
    display:block!important;
  }
  .mascot-accent--lineup,
  .mascot-accent--customize,
  .mascot-accent--contact{
    width:clamp(58px,18vw,82px)!important;
  }
  .mascot-accent--process,
  .mascot-accent--philosophy{
    display:block!important;
    width:clamp(58px,18vw,78px)!important;
    right:18px!important;
    bottom:18px!important;
    opacity:.92;
  }
  .process-section,
  .philosophy-section{
    padding-bottom:clamp(96px,28vw,126px)!important;
  }
}

/* ══ 最終調整：明るい背景、移動エフェクト停止、一覧折り返し ══ */
body{
  background:linear-gradient(180deg,#fffefa 0%,#fcf7ee 100%)!important;
}
body::before{
  content:none;
  display:none;
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:none!important;
  opacity:0;
  mix-blend-mode:normal;
}
.hero{
  background:linear-gradient(155deg,#fff 0%,#fcf7ed 100%)!important;
}
.news-section,
.lineup-section,
.customizer-section,
.gallery-section,
.process-section,
.guide-section,
.contact-section,
.recruit-section{
  background:rgba(255,253,249,.96)!important;
}
.customizer-section,
.process-section,
.contact-section,
footer{
  background:linear-gradient(135deg,#fff 0%,#fcf6eb 100%)!important;
}
.product-thumb,
.lineup-all-thumb,
.guide-thumb{
  background:linear-gradient(135deg,#fff,#faf3e6)!important;
}
.hero-shop-links{
  gap:12px!important;
  margin-top:14px;
  position:relative;
  z-index:4;
  align-items:center;
}
.hero-shop-links:not(:empty)::before{
  content:"ショップ";
  color:#777;
  font-size:12px;
  font-weight:700;
}
.hero-shop-links .btn-red-round{
  border:0!important;
  border-bottom:1px solid currentColor!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--kawaii-red)!important;
  font-size:13px!important;
  line-height:1.5!important;
  padding:0 0 1px!important;
}
.hero-shop-links .shop-button-item{
  width:auto!important;
}
.admin-mode .hero-shop-links .shop-button-item .btn-red-round{
  padding-right:30px!important;
}
@media (max-width:767px){
  .hero-cta{
    display:flex!important;
    flex-direction:column;
  }
  .hero-shop-links{
    display:flex!important;
    flex-wrap:wrap;
  }
}
.promise-card:hover,
.hero-feature-card:hover,
.color-swatch:hover,
.cmyk-swatch-btn:hover{
  transform:none!important;
}
.product-card:hover,
.guide-card:hover,
.gallery-item:hover,
.process-step:hover,
.lineup-all-card:hover,
.admin-add-card:hover{
  transform:none!important;
}
.sync-toast,
.sync-toast.show{
  transform:translateX(-50%)!important;
}
.lineup-all-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),220px))!important;
  justify-content:center;
  align-items:stretch;
  gap:clamp(12px,2vw,18px)!important;
  max-width:920px!important;
}
.lineup-all-card{
  display:flex;
  flex-direction:column;
  width:100%;
  height:100%;
  min-width:0;
}
.lineup-all-link{
  margin-top:auto;
}
.lineup-all-buy-link{
  width:auto!important;
  max-width:none!important;
  box-sizing:border-box;
}
@media (max-width:520px){
  .lineup-all-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media (max-width:420px){
  .lineup-all-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    max-width:100%!important;
  }
}

html.is-page-restoring{
  scroll-behavior:auto!important;
}

/* 2026-05-28 hero tune: bigger copy, stronger CTAs, playful accent colors */
:root{
  --soi-sky:#52cfff;
  --soi-yellow:#ffd844;
  --soi-mint:#79f0c7;
  --soi-black:#070707;
}
.hero{
  min-height:clamp(650px,66vw,900px)!important;
  padding-top:clamp(62px,7.6vw,112px)!important;
  background:
    radial-gradient(circle at 9% 82%,rgba(82,207,255,.42) 0 11px,transparent 12px),
    radial-gradient(circle at 21% 76%,rgba(255,216,68,.5) 0 8px,transparent 9px),
    radial-gradient(circle at 77% 17%,rgba(121,240,199,.5) 0 12px,transparent 13px),
    radial-gradient(circle at 86% 61%,rgba(255,216,68,.52) 0 9px,transparent 10px),
    linear-gradient(110deg,rgba(82,207,255,.14) 0 18%,transparent 19%),
    linear-gradient(155deg,#fff 0%,#fff 49%,#fff1f2 100%)!important;
}
.hero::before{
  background:
    linear-gradient(90deg,rgba(255,255,255,.06),rgba(255,255,255,0)),
    linear-gradient(135deg,var(--kawaii-red),#ff4251 54%,#111 54% 100%)!important;
  opacity:.98;
}
.hero::after{
  content:"";
  position:absolute;
  left:clamp(20px,4vw,64px);
  top:clamp(22px,4vw,58px);
  width:clamp(120px,14vw,190px);
  height:clamp(120px,14vw,190px);
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(circle,var(--soi-yellow) 0 9px,transparent 10px) 72% 16%/48px 48px no-repeat,
    radial-gradient(circle,var(--soi-mint) 0 8px,transparent 9px) 8% 70%/52px 52px no-repeat,
    radial-gradient(circle,var(--soi-sky) 0 7px,transparent 8px) 92% 82%/44px 44px no-repeat,
    conic-gradient(from 45deg at 50% 50%,transparent 0 12%,rgba(7,7,7,.1) 12% 14%,transparent 14% 26%,rgba(7,7,7,.1) 26% 28%,transparent 28%);
  border-radius:50%;
  opacity:.9;
}
.hero-h1,
.hero-h1-suffix{
  max-width:min(760px,100%);
  font-size:clamp(54px,9.1vw,122px)!important;
  line-height:.96!important;
  letter-spacing:0!important;
  font-weight:1000!important;
  transform:rotate(-2.3deg);
  transform-origin:left center;
}
.hero-h1{
  color:var(--soi-black)!important;
  text-shadow:4px 5px 0 rgba(255,47,63,.08);
}
.hero-h1-accent{
  margin-top:4px;
  margin-bottom:clamp(26px,3vw,40px)!important;
}
.hero-h1-suffix{
  color:var(--kawaii-red)!important;
  text-shadow:0 8px 0 rgba(255,47,63,.12);
}
.hero-h1-suffix::after{
  content:"";
  display:block;
  width:min(520px,88%);
  height:14px;
  margin:clamp(8px,1.2vw,14px) 0 0 5%;
  background:linear-gradient(90deg,var(--soi-yellow),var(--soi-mint),var(--soi-sky));
  border:3px solid var(--soi-black);
  border-radius:999px;
  transform:rotate(-2deg);
  box-shadow:5px 5px 0 rgba(7,7,7,.12);
}
.hero-desc{
  max-width:720px!important;
  color:#111!important;
  font-size:clamp(16px,1.7vw,24px)!important;
  line-height:1.65!important;
  font-weight:900!important;
  text-decoration:underline;
  text-decoration-color:var(--soi-yellow);
  text-decoration-thickness:6px;
  text-underline-offset:8px;
}
.hero-cta-row{
  gap:clamp(14px,2vw,22px)!important;
  margin-top:clamp(22px,2.4vw,34px)!important;
}
.hero-cta-row .btn-red-round,
.hero-cta-row .btn-outline-round{
  position:relative;
  min-height:clamp(58px,5.4vw,74px);
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:12px;
  border:4px solid var(--soi-black)!important;
  border-radius:999px!important;
  padding:clamp(14px,1.5vw,20px) clamp(24px,3vw,44px)!important;
  font-size:clamp(16px,1.65vw,25px)!important;
  font-weight:1000!important;
  line-height:1.1!important;
  box-shadow:7px 7px 0 var(--soi-black),0 18px 32px rgba(255,47,63,.2)!important;
  transform:rotate(-1deg);
}
.hero-cta-row .btn-red-round{
  background:linear-gradient(135deg,var(--kawaii-red),#ff4251 60%,var(--soi-yellow) 60% 100%)!important;
  color:#fff!important;
}
.hero-cta-row .btn-red-round::after{
  content:"→";
  font-size:1.25em;
}
.hero-cta-row .btn-outline-round{
  background:linear-gradient(135deg,#fff 0 66%,var(--soi-sky) 66% 100%)!important;
  color:var(--soi-black)!important;
  transform:rotate(1deg);
}
.hero-cta-row .btn-outline-round::before{
  content:"✦";
  color:var(--kawaii-red);
}
.hero-cta-row .btn-red-round:hover,
.hero-cta-row .btn-outline-round:hover{
  transform:translateY(-3px) rotate(0deg);
  box-shadow:9px 10px 0 var(--soi-black),0 22px 38px rgba(255,47,63,.22)!important;
}
.hero-feature-card:nth-child(1){
  border-color:rgba(82,207,255,.55)!important;
  box-shadow:0 10px 24px rgba(82,207,255,.14)!important;
}
.hero-feature-card:nth-child(2){
  border-color:rgba(255,216,68,.7)!important;
  box-shadow:0 10px 24px rgba(255,216,68,.18)!important;
}
.hero-feature-card:nth-child(3){
  border-color:rgba(121,240,199,.65)!important;
  box-shadow:0 10px 24px rgba(121,240,199,.18)!important;
}
.hero-feature-card:nth-child(4){
  border-color:rgba(255,47,63,.36)!important;
}
.hero-feature-title::after{
  content:"";
  display:block;
  width:34px;
  height:5px;
  margin:7px auto 0;
  border-radius:999px;
  background:linear-gradient(90deg,var(--soi-sky),var(--soi-yellow),var(--soi-mint));
}
.hero-mascot-bubble{
  border-color:var(--soi-sky)!important;
  color:#111!important;
  background:linear-gradient(135deg,#fff 0 70%,var(--soi-mint) 70% 100%)!important;
  box-shadow:6px 7px 0 rgba(7,7,7,.1)!important;
}
.hero-mascot-bubble::after{
  border-top-color:var(--soi-sky)!important;
}
@media (max-width:1023px){
  .hero-h1,
  .hero-h1-suffix{
    max-width:100%;
    font-size:clamp(44px,12.6vw,82px)!important;
  }
  .hero-desc{
    font-size:clamp(14px,3.8vw,18px)!important;
  }
}
@media (max-width:600px){
  .hero{
    padding-top:34px!important;
  }
  .hero-h1,
  .hero-h1-suffix{
    font-size:clamp(40px,15vw,64px)!important;
    transform:rotate(-1.6deg);
  }
  .hero-cta-row{
    display:grid!important;
    grid-template-columns:1fr;
  }
  .hero-cta-row .btn-red-round,
  .hero-cta-row .btn-outline-round{
    width:100%;
    min-height:58px;
    font-size:17px!important;
  }
}

/* 2026-05-28 hero cleanup: cleaner type/buttons */
.hero{
  min-height:clamp(620px,63vw,840px)!important;
  padding-top:clamp(52px,6.4vw,92px)!important;
  background:
    linear-gradient(115deg,rgba(82,207,255,.16) 0 23%,rgba(255,255,255,0) 23% 100%),
    linear-gradient(155deg,#fff 0%,#fff 57%,#fff4f5 100%)!important;
}
.hero::before{
  background:linear-gradient(135deg,rgba(235,146,154,.58),rgba(228,166,171,.58) 58%,rgba(244,205,209,.64) 58% 100%)!important;
  opacity:.78;
}
.hero::after{
  content:none;
  display:none;
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:clamp(220px,26vw,430px);
  z-index:0;
  pointer-events:none;
  background:none!important;
  opacity:0;
  mix-blend-mode:normal;
  border-radius:inherit;
}
.hero-h1,
.hero-h1-suffix{
  max-width:min(760px,100%);
  transform:none!important;
  letter-spacing:0!important;
  font-weight:1000!important;
  text-shadow:none!important;
}
.hero-h1{
  color:#080808!important;
  font-size:clamp(50px,7.4vw,108px)!important;
  line-height:.98!important;
}
.hero-h1-accent{
  margin-top:6px;
  margin-bottom:clamp(22px,2.6vw,34px)!important;
}
.hero-h1-suffix{
  color:var(--kawaii-red)!important;
  font-size:clamp(54px,8.1vw,118px)!important;
  line-height:.96!important;
}
.hero-h1-suffix::after{
  width:min(500px,76%);
  height:8px;
  margin:clamp(8px,1vw,12px) 0 0 2px;
  border:0;
  background:linear-gradient(90deg,var(--soi-sky),var(--soi-yellow),var(--soi-mint));
  box-shadow:none;
  transform:none;
}
.hero-desc{
  max-width:670px!important;
  display:inline;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
  padding:0 .08em;
  font-size:clamp(15px,1.45vw,21px)!important;
  line-height:1.75!important;
  font-weight:900!important;
  text-decoration:none!important;
  background:linear-gradient(transparent 62%,rgba(255,216,68,.58) 62%);
}
.hero-cta-row{
  gap:clamp(10px,1.5vw,16px)!important;
  margin-top:clamp(24px,2.2vw,32px)!important;
}
.hero-cta-row .btn-red-round,
.hero-cta-row .btn-outline-round{
  min-height:clamp(42px,3.7vw,52px);
  padding:clamp(10px,.9vw,13px) clamp(18px,1.9vw,30px)!important;
  border:2.5px solid #111!important;
  border-radius:999px!important;
  font-size:clamp(13.5px,1.1vw,16.5px)!important;
  font-weight:900!important;
  transform:none!important;
  box-shadow:0 9px 0 rgba(7,7,7,.88),0 15px 28px rgba(255,47,63,.14)!important;
}
.hero-cta-row .btn-red-round{
  background:linear-gradient(135deg,var(--kawaii-red) 0 78%,var(--soi-yellow) 78% 100%)!important;
}
.hero-cta-row .btn-red-round::after{
  font-size:1.05em;
}
.hero-cta-row .btn-outline-round{
  background:linear-gradient(135deg,#fff 0 76%,var(--soi-sky) 76% 100%)!important;
}
.hero-cta-row .btn-outline-round::before{
  content:none!important;
}
.hero-cta-row .btn-red-round:hover,
.hero-cta-row .btn-outline-round:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 11px 0 rgba(7,7,7,.88),0 18px 30px rgba(255,47,63,.16)!important;
}
.hero-feature-card{
  background:rgba(255,255,255,.88)!important;
  backdrop-filter:blur(2px);
}
.hero-mascot-bubble{
  background:#fff!important;
  border-color:var(--soi-mint)!important;
  box-shadow:0 8px 20px rgba(7,7,7,.08)!important;
}
.hero-mascot-bubble::after{
  border-top-color:var(--soi-mint)!important;
}
@media (max-width:1023px){
  .hero{
    min-height:auto!important;
  }
  .hero::after{
    left:clamp(150px,38vw,280px);
    background:none!important;
    opacity:0;
  }
  .hero-h1{
    font-size:clamp(42px,11vw,76px)!important;
  }
  .hero-h1-suffix{
    font-size:clamp(48px,12vw,84px)!important;
  }
}
@media (max-width:600px){
  .hero{
    padding-top:30px!important;
  }
  .hero-h1{
    font-size:clamp(38px,13vw,58px)!important;
  }
  .hero-h1-suffix{
    font-size:clamp(44px,14.4vw,66px)!important;
  }
  .hero-cta-row{
    display:flex!important;
    flex-direction:column;
    align-items:flex-start;
  }
  .hero-cta-row .btn-red-round,
  .hero-cta-row .btn-outline-round{
    width:min(100%,430px);
    min-height:46px;
    font-size:14.5px!important;
    box-shadow:0 6px 0 rgba(7,7,7,.88),0 10px 18px rgba(255,47,63,.11)!important;
  }
}

/* 2026-05-29: top feature cards restored with local sozai illustrations */
.hero-features{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:clamp(10px,1.4vw,18px)!important;
  width:100%;
  max-width:none;
  margin:clamp(28px,3vw,42px) 0 0!important;
  justify-content:stretch;
  align-items:stretch;
}
.hero-feature-card{
  min-width:0;
  min-height:clamp(136px,12.2vw,190px);
  padding:clamp(15px,1.6vw,24px) clamp(12px,1.4vw,20px)!important;
  border:1.5px solid rgba(255,47,63,.14)!important;
  border-radius:24px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 12px 28px rgba(255,47,63,.07)!important;
  overflow:visible;
  gap:clamp(7px,.9vw,12px)!important;
}
.hero-feature-card:hover{
  transform:translateY(-2px);
  box-shadow:0 15px 32px rgba(255,47,63,.11)!important;
}
.hero-features .hero-feature-card:nth-child(n){
  border-color:rgba(255,47,63,.14)!important;
  box-shadow:0 12px 28px rgba(255,47,63,.07)!important;
}
.hero-features .hero-feature-card:nth-child(n):hover{
  box-shadow:0 15px 32px rgba(255,47,63,.11)!important;
}
.hero-feature-mascot{
  display:flex!important;
  width:clamp(42px,4.6vw,66px);
  height:clamp(42px,4.6vw,66px);
  align-items:center;
  justify-content:center;
}
.hero-feature-mascot img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  filter:drop-shadow(0 4px 8px rgba(255,47,63,.15));
}
.hero-feature-title{
  display:block!important;
  margin:0;
  font-size:clamp(14px,1.45vw,22px);
  font-weight:900;
  color:#202020;
  line-height:1.35;
}
.hero-feature-title::after{
  content:none!important;
  display:none!important;
}
.hero-feature-desc{
  display:block!important;
  margin:0;
  font-size:clamp(11px,.96vw,15px);
  font-weight:700;
  color:#666;
  line-height:1.65;
}
.hero-feature-image{
  display:none!important;
}
@media (max-width:1023px){
  .hero-features{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .mascot-accent--hero{
    margin-top:70px!important;
  }
}
@media (max-width:560px){
  .hero-features{
    grid-template-columns:1fr!important;
  }
}
	

/* ════════════════════════════════════════════
   スマホ最適化 追加修正
   ════════════════════════════════════════════ */

/* ── Safe area insets (iPhone ノッチ・ホームインジケーター) ── */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  .mobile-menu {
    padding-bottom: env(safe-area-inset-bottom);
  }
  .cart-modal {
    padding-bottom: env(safe-area-inset-bottom);
  }
  .mobile-float-cta {
    padding-bottom: calc(10px + env(safe-area-inset-bottom)) !important;
  }
}

/* ── モバイルフローティングCTA ── */
.mobile-float-cta {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1100;
  background: rgba(255,255,255,0.96);
  border-top: 1.5px solid rgba(255,47,63,.15);
  padding: 10px 14px;
  gap: 8px;
  box-shadow: 0 -10px 28px rgba(255,47,63,.14);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.mobile-float-cta-btn {
  flex: 1;
  min-height: 50px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 900;
  font-family: 'Noto Sans JP', sans-serif;
  cursor: pointer;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  letter-spacing: .02em;
  transition: opacity .15s, transform .15s;
  -webkit-tap-highlight-color: transparent;
}
.mobile-float-cta-btn:active {
  opacity: .82;
  transform: scale(.97);
}
.mobile-float-cta-btn--primary {
  background: linear-gradient(135deg, var(--kawaii-red), #ff5c69);
  color: #fff;
  box-shadow: 0 8px 20px rgba(255,47,63,.25);
}
.mobile-float-cta-btn--secondary {
  background: #fff;
  color: var(--kawaii-red);
  border: 2px solid rgba(255,47,63,.6);
  flex: 0 0 auto;
  min-width: 80px;
  flex: 0.6;
}
@media (max-width:767px) {
  .mobile-float-cta {
    display: flex;
  }
  /* フローティングCTA分の余白 */
  body {
    padding-bottom: 74px;
  }
  body.admin-mode {
    padding-bottom: 74px;
  }
}
@media (min-width:768px) {
  .mobile-float-cta { display: none !important; }
}

/* ── スライダー矢印：モバイルでタップしやすく ── */
@media (max-width:767px) {
  .slider-arrow {
    width: 44px;
    height: 44px;
    font-size: 22px;
  }
  .slider-arrow.prev { left: 0; }
  .slider-arrow.next { right: 0; }
}

/* ── ギャラリー：超狭い画面では2カラムに ── */
@media (max-width:400px) {
  .gallery-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 5px !important;
  }
}

/* ── ヒーロー：スマホでの余白を削減 ── */
@media (max-width:767px) {
  .hero {
    min-height: auto !important;
    padding-top: clamp(24px, 6vw, 42px) !important;
    padding-bottom: clamp(48px, 10vw, 72px) !important;
  }
}
@media (max-width:480px) {
  .hero {
    padding-top: 20px !important;
    padding-bottom: 42px !important;
  }
  .hero-h1,
  .hero-h1-suffix {
    font-size: clamp(30px, 10vw, 42px) !important;
  }
}

/* ── フッター：モバイルでの余白を調整 ── */
@media (max-width:767px) {
  footer {
    padding: 30px 20px 108px !important;
  }
  footer::after {
    width: 80px !important;
    bottom: 40px !important;
  }
}
@media (max-width:480px) {
  footer {
    padding: 26px 16px 100px !important;
    border-radius: 24px 24px 0 0 !important;
  }
  footer::after {
    width: 70px !important;
    bottom: 36px !important;
  }
  .footer-nav-columns {
    grid-template-columns: repeat(2, auto) !important;
    gap: 14px 22px !important;
  }
  .footer-company-name {
    font-size: 18px !important;
  }
  .footer-address {
    font-size: 12px !important;
  }
}

/* ── モバイルメニュー：スライドアニメーション ── */
.mobile-menu {
  display: flex !important;
  transform: translateX(100%);
  transition: transform .28s cubic-bezier(.4,0,.2,1), visibility 0s linear .28s;
  visibility: hidden;
  pointer-events: none;
}
.mobile-menu.open {
  transform: translateX(0);
  visibility: visible;
  pointer-events: auto;
  transition: transform .28s cubic-bezier(.4,0,.2,1), visibility 0s linear 0s;
}
.mobile-menu a {
  font-size: 16px;
  padding: 18px 32px;
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.menu-close {
  min-width: 44px;
  min-height: 44px;
  top: 14px;
  right: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255,47,63,.08);
}

/* ── タッチターゲット最小サイズ確保 ── */
@media (max-width:767px) {
  .header-nav a,
  .slider-arrow,
  .menu-toggle,
  .cart-btn-header,
  .menu-close {
    min-height: 44px;
    min-width: 44px;
  }
  .form-input,
  .form-textarea,
  .customizer-input,
  .customizer-select {
    font-size: 16px !important; /* iOSズーム防止 */
    min-height: 48px;
  }
  /* 送信ボタン */
  .form-submit {
    min-height: 52px;
    font-size: 15px !important;
  }
  /* カートアイテム操作ボタン */
  .cart-item-qty-btn {
    width: 34px;
    height: 34px;
  }
}

/* ── セクション間の余白をモバイルで最適化 ── */
@media (max-width:767px) {
  .news-section,
  .lineup-section,
  .customizer-section,
  .gallery-section,
  .process-section,
  .guide-section,
  .contact-section,
  .philosophy-section,
  .recruit-section {
    margin-top: 14px !important;
    padding: clamp(20px,5vw,36px) clamp(14px,4vw,28px) !important;
  }
}

/* ── 製作事例：カード角丸をモバイルで調整 ── */
@media (max-width:767px) {
  .gallery-item {
    border-radius: 12px !important;
  }
}

/* ── プロセスステップ：モバイルでコンパクト ── */
@media (max-width:767px) {
  .process-step {
    padding: 16px 18px;
    min-height: 0 !important;
  }
  .step-title {
    font-size: 15px;
  }
  .step-desc {
    font-size: 12.5px;
  }
}

/* ── カスタマイザーセクション：スマホでの操作性向上 ── */
@media (max-width:767px) {
  .direct-print-tab {
    min-height: 46px;
    font-size: 13px;
    padding: 10px 8px;
  }
  .direct-print-btn {
    min-height: 46px;
    font-size: 15px;
  }
  .customizer-action-btn {
    min-height: 44px;
  }
}

/* ── お問い合わせフォーム ── */
@media (max-width:767px) {
  .contact-form {
    padding: 0 !important;
  }
  .form-group {
    margin-bottom: 14px;
  }
}

/* ── ニュースセクションのヘッダー ── */
@media (max-width:767px) {
  .section-header {
    padding: 0 14px;
    margin-bottom: 14px;
  }
}

/* ── スクロールの慣性をスムーズに ── */
.cart-modal-body,
.lineup-all-inner,
.mobile-menu {
  -webkit-overflow-scrolling: touch;
}

/* 2026-05-28 lineup flourish: reference-style pink banner and festive cards */
.lineup-section{
  max-width:min(1180px,calc(100% - clamp(20px,4vw,64px)))!important;
  padding:clamp(34px,5vw,70px) clamp(18px,4.8vw,72px) clamp(36px,5vw,64px)!important;
  border:1px solid rgba(255,47,63,.18)!important;
  border-radius:32px!important;
  overflow:hidden;
  background:
    radial-gradient(circle at 8% 18%,rgba(255,47,63,.13) 0 5px,transparent 6px),
    radial-gradient(circle at 19% 12%,rgba(82,207,255,.36) 0 6px,transparent 7px),
    radial-gradient(circle at 84% 24%,rgba(255,216,68,.42) 0 7px,transparent 8px),
    radial-gradient(circle at 93% 66%,rgba(121,240,199,.36) 0 6px,transparent 7px),
    linear-gradient(180deg,#fff 0%,#fff8f8 44%,#fff 100%)!important;
  box-shadow:0 22px 54px rgba(255,47,63,.12)!important;
}
.lineup-section::before{
  content:"";
  position:absolute;
  left:-72px;
  top:-82px;
  width:clamp(180px,25vw,310px);
  height:clamp(150px,21vw,260px);
  z-index:0;
  border-radius:0 0 52% 0;
  background:
    radial-gradient(circle,rgba(255,47,63,.18) 0 2px,transparent 2.7px) 0 0/14px 14px,
    linear-gradient(135deg,rgba(255,47,63,.14),rgba(255,47,63,.04));
}
.lineup-section::after{
  inset:16px!important;
  border:1.5px dashed rgba(255,47,63,.14)!important;
  border-radius:26px!important;
}
.lineup-showcase-head{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:center;
  min-height:clamp(116px,13vw,162px);
  margin:0 auto clamp(18px,3vw,32px);
  padding-right:clamp(0px,14vw,150px);
  text-align:center;
}
.lineup-heading-copy{
  width:min(760px,100%);
  margin-inline:auto;
}
.lineup-label{
  margin-bottom:14px!important;
}
.lineup-section .section-tag{
  position:relative;
  min-width:clamp(150px,15vw,198px);
  padding:11px 28px!important;
  border-radius:999px!important;
  font-size:clamp(14px,1.5vw,18px)!important;
  letter-spacing:.05em;
  box-shadow:0 12px 26px rgba(255,47,63,.2)!important;
}
.lineup-section .section-tag::before,
.lineup-section .section-tag::after{
  content:"";
  position:absolute;
  top:50%;
  width:18px;
  height:18px;
  background:
    linear-gradient(var(--kawaii-red),var(--kawaii-red)) 50% 0/3px 8px no-repeat,
    linear-gradient(var(--kawaii-red),var(--kawaii-red)) 50% 100%/3px 8px no-repeat;
  opacity:.9;
}
.lineup-section .section-tag::before{
  left:-28px;
  transform:translateY(-50%) rotate(-26deg);
}
.lineup-section .section-tag::after{
  right:-28px;
  transform:translateY(-50%) rotate(26deg);
}
.lineup-title{
  position:relative;
  display:inline;
  color:#222;
  font-size:clamp(24px,4vw,42px);
  font-weight:1000;
  line-height:1.28;
  letter-spacing:0;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
  background:linear-gradient(transparent 67%,rgba(255,160,170,.72) 67%);
}
.lineup-lead{
  margin:clamp(12px,1.6vw,18px) auto 0;
  color:#666;
  font-size:clamp(13px,1.35vw,16px);
  font-weight:700;
  line-height:1.8;
  max-width:690px;
}
.lineup-section .lineup-ornaments{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
}
.lineup-dot,
.lineup-sparkle{
  position:absolute;
  display:block;
}
.lineup-dot{
  width:16px;
  height:16px;
  border:3px solid rgba(255,47,63,.32);
  border-radius:50%;
}
.lineup-dot--a{left:15%;top:18%;}
.lineup-dot--b{right:17%;top:20%;width:11px;height:11px;border-color:rgba(82,207,255,.46);}
.lineup-sparkle{
  width:32px;
  height:32px;
}
.lineup-sparkle::before,
.lineup-sparkle::after{
  content:"";
  position:absolute;
  inset:0;
  margin:auto;
  background:var(--kawaii-red);
  border-radius:999px;
}
.lineup-sparkle::before{width:3px;height:100%;}
.lineup-sparkle::after{width:100%;height:3px;}
.lineup-sparkle--a{right:11%;top:24%;transform:rotate(12deg);opacity:.62;}
.lineup-sparkle--b{left:7%;bottom:18%;transform:rotate(35deg) scale(.72);opacity:.38;}
.lineup-section .mascot-accent--lineup{
  top:clamp(34px,5vw,62px)!important;
  right:clamp(22px,6vw,80px)!important;
  bottom:auto!important;
  width:clamp(92px,14vw,158px)!important;
  z-index:2;
}
.lineup-section .mascot-accent--lineup img{
  filter:drop-shadow(0 18px 26px rgba(255,47,63,.18));
}
.lineup-section .products-grid{
  position:relative;
  z-index:2;
  grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr))!important;
  gap:clamp(14px,2.4vw,26px)!important;
  align-items:stretch;
  justify-items:stretch;
  max-width:1000px;
  margin:0 auto clamp(22px,3vw,34px)!important;
}
.lineup-section .product-card{
  max-width:none!important;
  min-height:100%;
  border:2px solid rgba(255,47,63,.16)!important;
  border-radius:20px!important;
  overflow:hidden;
  background:#fff!important;
  box-shadow:0 16px 36px rgba(255,47,63,.12)!important;
}
.lineup-section .product-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:7px;
  z-index:3;
  background:linear-gradient(90deg,var(--kawaii-red),var(--soi-yellow),var(--soi-sky),var(--soi-mint));
}
.lineup-section .product-card::after{
  content:"ORDER WEAR";
  position:absolute;
  top:16px;
  right:-34px;
  z-index:4;
  width:118px;
  padding:5px 0;
  background:rgba(255,47,63,.92);
  color:#fff;
  font-family:'DM Mono',monospace;
  font-size:9px;
  font-weight:700;
  letter-spacing:.08em;
  text-align:center;
  transform:rotate(35deg);
  pointer-events:none;
}
.lineup-section .product-card:hover{
  transform:translateY(-5px)!important;
  border-color:rgba(255,47,63,.36)!important;
  box-shadow:0 24px 48px rgba(255,47,63,.18)!important;
}
.lineup-section .product-thumb{
  aspect-ratio:1.08/1!important;
  max-height:none!important;
  padding:10px;
  background:
    radial-gradient(circle at 22% 20%,rgba(255,216,68,.28) 0 18px,transparent 19px),
    radial-gradient(circle at 82% 18%,rgba(82,207,255,.22) 0 16px,transparent 17px),
    linear-gradient(135deg,#fff,#fff0f2)!important;
}
.lineup-section .product-thumb img{
  border-radius:14px;
  object-fit:cover;
  box-shadow:0 10px 22px rgba(7,7,7,.07);
}
.lineup-section .product-name{
  min-height:0;
  padding:14px 15px 8px!important;
  font-size:clamp(14px,1.45vw,17px)!important;
  line-height:1.45;
  color:#202020!important;
}
.lineup-section .product-name::after{
  content:"";
  display:block;
  width:46px;
  height:4px;
  margin-top:8px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--kawaii-red),var(--soi-yellow));
}
.lineup-section .product-desc{
  padding:0 15px 13px!important;
  color:#666!important;
  font-size:12px!important;
  line-height:1.7!important;
}
.lineup-section .product-link{
  width:calc(100% - 30px)!important;
  margin:auto 15px 10px!important;
  padding:10px 0 0!important;
  border-top:1px dashed rgba(255,47,63,.18);
  color:var(--kawaii-red)!important;
  font-size:12px!important;
  text-align:left;
}
.lineup-section .product-buy-btn{
  width:calc(100% - 30px)!important;
  min-height:42px;
  margin:0 15px 15px!important;
  border-radius:999px!important;
  font-size:13px!important;
  font-weight:900!important;
  box-shadow:0 10px 22px rgba(255,47,63,.22)!important;
}
.lineup-section .btn-center{
  position:relative;
  z-index:2;
}
.lineup-section .btn-pill{
  border:2px solid var(--kawaii-red)!important;
  color:var(--kawaii-red)!important;
  background:#fff!important;
  box-shadow:0 12px 24px rgba(255,47,63,.12);
}
.lineup-section .btn-pill:hover{
  background:#fff4f5!important;
}
.lineup-section .badge-new,
.lineup-all-card .badge-new{
  left:12px;
  top:12px;
  border-radius:999px;
  padding:5px 11px;
  background:linear-gradient(135deg,var(--kawaii-red),#ff6570);
  box-shadow:0 7px 16px rgba(255,47,63,.28);
}
.lineup-all-card{
  border:2px solid rgba(255,47,63,.14)!important;
  border-radius:20px!important;
  box-shadow:0 14px 32px rgba(255,47,63,.1)!important;
}
.lineup-all-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:6px;
  background:linear-gradient(90deg,var(--kawaii-red),var(--soi-yellow),var(--soi-sky));
}
.lineup-all-thumb{
  padding:9px;
}
.lineup-all-thumb img{
  border-radius:13px;
}
@media (max-width:900px){
  .lineup-showcase-head{
    padding-right:clamp(70px,18vw,120px);
    text-align:left;
    justify-content:flex-start;
  }
  .lineup-heading-copy{
    margin-inline:0;
  }
  .lineup-title{
    font-size:clamp(22px,5.8vw,34px);
  }
}
@media (max-width:767px){
  .lineup-section{
    max-width:100%!important;
    border-radius:24px!important;
    padding:clamp(26px,7vw,38px) clamp(14px,4vw,22px) clamp(30px,7vw,42px)!important;
  }
  .lineup-section::before{
    left:-100px;
    top:-96px;
  }
  .lineup-section::after{
    inset:10px!important;
    border-radius:20px!important;
  }
  .lineup-showcase-head{
    min-height:0;
    padding-right:0;
    margin-bottom:20px;
    text-align:center;
  }
  .lineup-section .mascot-accent--lineup{
    display:none!important;
  }
  .lineup-section .section-tag{
    min-width:136px;
    padding:9px 22px!important;
  }
  .lineup-lead{
    font-size:12.5px;
    line-height:1.75;
  }
  .lineup-section .products-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
  }
  .lineup-section .product-card{
    border-radius:16px!important;
  }
  .lineup-section .product-card::after{
    content:none;
  }
  .lineup-section .product-thumb{
    padding:7px;
  }
  .lineup-section .product-thumb img{
    border-radius:11px;
  }
  .lineup-section .product-name{
    padding:10px 10px 6px!important;
    font-size:12.5px!important;
    line-height:1.42;
  }
  .lineup-section .product-desc{
    padding:0 10px 10px!important;
    font-size:10.8px!important;
    line-height:1.55!important;
    -webkit-line-clamp:3;
  }
  .lineup-section .product-link{
    width:calc(100% - 20px)!important;
    margin:0 10px 8px!important;
    font-size:11px!important;
  }
  .lineup-section .product-buy-btn{
    width:calc(100% - 20px)!important;
    min-height:38px;
    margin:0 10px 10px!important;
    font-size:11.5px!important;
  }
}

/* 2026-05-28 customize icons: decorative-only illustrations, no behavior changes */
.customizer-section{
  overflow:hidden;
}
.customizer-section > .customizer-ornaments{
  position:absolute!important;
  inset:0;
  z-index:1!important;
  pointer-events:none;
}
.customizer-section > .customizer-head,
.customizer-section > .customizer-visibility-notice,
.customizer-section > .customizer-shell,
.customizer-section > .customizer-presets{
  position:relative;
  z-index:3;
}
.customizer-heading{
  display:flex;
  align-items:flex-start;
  gap:clamp(12px,1.7vw,18px);
  max-width:min(820px,100%);
  padding-right:clamp(0px,20vw,250px);
}
.customizer-heading-icon{
  width:clamp(58px,6.4vw,76px);
  height:clamp(58px,6.4vw,76px);
  flex:0 0 auto;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:var(--kawaii-red);
  background:radial-gradient(circle at 35% 25%,#fff 0 19%,#ffd8dc 20% 100%);
  box-shadow:0 16px 30px rgba(255,47,63,.18);
}
.customizer-heading-icon svg{
  width:58%;
  height:58%;
  fill:currentColor;
}
.customizer-heading-icon svg path + path{
  fill:none;
  stroke:#fff;
  stroke-width:4;
  stroke-linecap:round;
}
.customizer-dot-field{
  position:absolute;
  top:clamp(22px,3.2vw,52px);
  right:clamp(290px,29vw,440px);
  width:clamp(86px,10vw,150px);
  height:clamp(54px,6vw,92px);
  opacity:.3;
  background:radial-gradient(circle, var(--kawaii-red) 0 2px, transparent 2.7px) 0 0/14px 14px;
  transform:rotate(-8deg);
}
.customizer-spark{
  position:absolute;
  width:28px;
  height:28px;
  opacity:.55;
}
.customizer-spark::before,
.customizer-spark::after{
  content:"";
  position:absolute;
  inset:0;
  margin:auto;
  border-radius:99px;
  background:var(--kawaii-red);
}
.customizer-spark::before{width:3px;height:100%;}
.customizer-spark::after{width:100%;height:3px;}
.customizer-spark--one{top:74px;right:118px;transform:rotate(25deg) scale(.85);}
.customizer-spark--two{top:154px;left:42px;transform:rotate(-18deg) scale(.65);opacity:.28;}
.customizer-block-title{
  display:flex;
  align-items:center;
  gap:7px;
}
.customizer-block-title::before{
  content:"";
  width:10px;
  height:10px;
  flex:0 0 auto;
  border-radius:3px;
  background:linear-gradient(135deg,var(--kawaii-red),#ff98a1);
  box-shadow:0 0 0 4px rgba(255,47,63,.08);
}
.wear-type-btn{
  position:relative;
  gap:5px!important;
}
.wear-type-btn::before{
  content:"";
  display:block;
  width:34px;
  height:30px;
  margin-bottom:2px;
  background:linear-gradient(135deg,currentColor,#ff7a83);
  opacity:.88;
  clip-path:polygon(26% 5%,42% 5%,47% 16%,53% 16%,58% 5%,74% 5%,96% 21%,84% 44%,75% 36%,75% 96%,25% 96%,25% 36%,16% 44%,4% 21%);
}
.wear-type-btn[data-type="vest"]::before{
  width:28px;
  clip-path:polygon(24% 4%,42% 4%,50% 30%,58% 4%,76% 4%,86% 96%,14% 96%);
}
.wear-type-btn[data-type="jumper"]::before{
  width:36px;
  clip-path:polygon(28% 3%,43% 3%,49% 12%,55% 3%,72% 3%,95% 20%,84% 45%,75% 38%,78% 97%,22% 97%,25% 38%,16% 45%,5% 20%);
}
.wear-type-btn:not(.active)::before{
  color:#777;
  background:linear-gradient(135deg,#707070,#a4a4a4);
}
.upload-box{
  position:relative;
  flex-direction:column;
  gap:6px;
  text-align:center;
  background:
    radial-gradient(circle at 16% 24%,rgba(82,207,255,.16) 0 9px,transparent 10px),
    radial-gradient(circle at 86% 70%,rgba(255,216,68,.2) 0 11px,transparent 12px),
    #fff!important;
}
.upload-icon{
  width:52px;
  height:52px;
  border-radius:18px;
  display:grid;
  place-items:center;
  color:var(--kawaii-red);
  background:#fff0f2;
  box-shadow:0 10px 22px rgba(255,47,63,.13);
}
.upload-icon svg{
  width:32px;
  height:32px;
  fill:none;
  stroke:currentColor;
  stroke-width:4;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.customizer-summary-box{
  position:relative;
  padding-left:76px!important;
  min-height:82px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.customizer-summary-icon{
  position:absolute;
  left:16px;
  top:50%;
  width:44px;
  height:44px;
  transform:translateY(-50%);
  border-radius:16px;
  background:#ffe5e8;
  box-shadow:inset 0 0 0 1px rgba(255,47,63,.12);
}
.customizer-summary-icon::before,
.customizer-summary-icon::after{
  content:"";
  position:absolute;
  inset:0;
  margin:auto;
}
.customizer-summary-icon--shirt::before{
  width:28px;
  height:24px;
  background:var(--kawaii-red);
  clip-path:polygon(26% 5%,42% 5%,47% 16%,53% 16%,58% 5%,74% 5%,96% 21%,84% 44%,75% 36%,75% 96%,25% 96%,25% 36%,16% 44%,4% 21%);
}
.customizer-summary-icon--calc::before{
  width:24px;
  height:30px;
  border:3px solid var(--kawaii-red);
  border-radius:5px;
}
.customizer-summary-icon--calc::after{
  width:4px;
  height:4px;
  border-radius:50%;
  background:var(--kawaii-red);
  box-shadow:
    -7px -4px 0 var(--kawaii-red),
    0 -4px 0 var(--kawaii-red),
    7px -4px 0 var(--kawaii-red),
    -7px 4px 0 var(--kawaii-red),
    0 4px 0 var(--kawaii-red),
    7px 4px 0 var(--kawaii-red),
    -7px 12px 0 var(--kawaii-red),
    7px 12px 0 var(--kawaii-red);
}
.customizer-summary-icon--calc{
  background:url("dentaku.svg") center/contain no-repeat;
  box-shadow:none;
}
.customizer-summary-icon--calc::before,
.customizer-summary-icon--calc::after{
  content:none;
}
.customizer-live-estimate{
  grid-template-columns:42px minmax(0,1fr) auto!important;
}
.customizer-live-icon{
  width:36px;
  height:36px;
  border-radius:12px;
  display:block;
  position:relative;
  background:#fff;
  box-shadow:0 0 0 1px rgba(255,47,63,.16),0 10px 18px rgba(255,47,63,.1);
}
.customizer-live-icon::before{
  content:"";
  position:absolute;
  inset:8px;
  border:2.5px solid var(--kawaii-red);
  border-radius:4px;
}
.customizer-live-icon::after{
  content:"";
  position:absolute;
  left:14px;
  top:17px;
  width:4px;
  height:4px;
  border-radius:50%;
  background:var(--kawaii-red);
  box-shadow:7px 0 0 var(--kawaii-red),0 7px 0 var(--kawaii-red),7px 7px 0 var(--kawaii-red);
}
.customizer-live-icon{
  background:url("dentaku.svg") center/contain no-repeat;
  box-shadow:none;
}
.customizer-live-icon::before,
.customizer-live-icon::after{
  content:none;
}
.customizer-actions .customizer-action-btn,
.direct-print-actions .customizer-action-btn{
  gap:8px;
}
.customizer-actions .customizer-action-btn::before,
.direct-print-actions .customizer-action-btn::before{
  content:"";
  width:18px;
  height:18px;
  flex:0 0 auto;
  background:currentColor;
  opacity:.96;
  -webkit-mask:var(--btn-icon) center/contain no-repeat;
  mask:var(--btn-icon) center/contain no-repeat;
}
.customizer-action-btn.checkout{
  --btn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6h18v12H3zM3 10h18M7 15h5' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.customizer-actions .customizer-action-btn:not(.checkout):not(.light){
  --btn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='9' cy='20' r='1.8'/%3E%3Ccircle cx='18' cy='20' r='1.8'/%3E%3Cpath d='M2 3h3l2.4 11.4a2 2 0 0 0 2 1.6h8.8a2 2 0 0 0 1.9-1.4L22 8H7' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.customizer-action-btn.light{
  --btn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12a8 8 0 1 0 2.4-5.7M4 4v6h6' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.direct-print-actions .customizer-undo-btn{
  --btn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 7H4v5M4.8 10.2a8 8 0 1 1 2.4 7.1' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.direct-print-actions .customizer-action-btn:nth-child(2){
  --btn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5h16v11H8l-4 4V5z' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='9' cy='10.5' r='1.2'/%3E%3Ccircle cx='12' cy='10.5' r='1.2'/%3E%3Ccircle cx='15' cy='10.5' r='1.2'/%3E%3C/svg%3E");
}
.direct-print-actions .customizer-action-btn:nth-child(3){
  --btn-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3v11M7 10l5 5 5-5M4 20h16' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
@media (max-width:1023px){
  .customizer-heading{
    padding-right:clamp(86px,17vw,126px);
  }
  .customizer-dot-field{
    display:none;
  }
}
@media (max-width:767px){
  .customizer-heading{
    padding-right:0;
    gap:10px;
  }
  .customizer-heading-icon{
    width:48px;
    height:48px;
  }
  .customizer-spark{
    display:none;
  }
  .customizer-summary-box{
    padding-left:62px!important;
  }
  .customizer-summary-icon{
    left:12px;
    width:38px;
    height:38px;
    border-radius:14px;
  }
  .customizer-live-estimate{
    grid-template-columns:34px minmax(0,1fr)!important;
  }
  .customizer-live-estimate-main{
    grid-column:1/-1;
    justify-self:end;
  }
  .customizer-live-icon{
    width:32px;
    height:32px;
  }
}

/* =========================================================
   2026-05-29 corporate refinement
   かっちりした企業向けトーンへ調整し、キャラクターは案内役として節度ある見せ方に統一
   ========================================================= */
:root{
  --corp-navy:#303847;
  --corp-navy-deep:#232936;
  --corp-slate:#6a7383;
  --corp-border:#e3ddd6;
  --corp-bg:#f7f4f0;
  --corp-surface:#fffdfa;
  --corp-surface-2:#fbf8f4;
  --corp-accent:#cf3d3d;
  --corp-accent-dark:#a72d2d;
  --corp-shadow:0 18px 44px rgba(35,41,54,.08);
  --corp-shadow-soft:0 10px 28px rgba(35,41,54,.06);
}
html{background:var(--corp-bg);}
body{
  background:linear-gradient(180deg,#f6f8fb 0%,#f3f6fa 100%)!important;
  color:var(--corp-navy-deep)!important;
}
.top-bar{
  height:40px;
  background:linear-gradient(90deg,var(--corp-navy-deep),var(--corp-navy))!important;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.top-bar-btn{
  background:var(--corp-accent)!important;
  color:#fff!important;
  border-radius:0;
  padding:10px 20px;
  font-size:12px;
  letter-spacing:.08em;
}
.top-bar-btn:hover{background:var(--corp-accent-dark)!important;}
header{
  background:rgba(255,255,255,.96)!important;
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--corp-border)!important;
  box-shadow:0 8px 24px rgba(16,31,56,.05);
}
.header-inner{
  max-width:1280px;
  padding:10px 18px;
  gap:18px;
}
.logo-wrap h3,
.header-nav a,
.cart-btn-header,
.menu-toggle{color:var(--corp-navy)!important;}
.header-nav{
  gap:4px;
  justify-content:flex-end;
}
.header-nav a{
  font-size:11px;
  font-weight:700;
  letter-spacing:.06em;
  padding:8px 10px;
  border-radius:999px;
}
.header-nav a:hover{
  background:#eef3f8;
  color:var(--corp-accent)!important;
}
.cart-btn-header{
  border:1px solid var(--corp-border)!important;
  background:#fff!important;
  box-shadow:none!important;
}
.cart-btn-header:hover{
  border-color:var(--corp-navy)!important;
  color:var(--corp-navy)!important;
}
.cart-badge{background:var(--corp-accent)!important;}
.menu-toggle{
  border:1px solid var(--corp-border)!important;
  border-radius:12px!important;
}
.hero{
  min-height:0!important;
  padding:clamp(52px,6vw,88px) clamp(20px,5vw,72px) clamp(54px,7vw,82px)!important;
  background:
    linear-gradient(110deg,rgba(22,36,58,.04) 0 36%,transparent 36%),
    linear-gradient(180deg,#ffffff 0%,#f6f8fb 100%)!important;
  border:1px solid var(--corp-border)!important;
  border-radius:0 0 20px 20px!important;
  box-shadow:0 24px 54px rgba(16,31,56,.07)!important;
  overflow:hidden;
}
.hero::before{
  content:""!important;
  position:absolute;
  inset:auto 0 0 0;
  height:4px;
  background:linear-gradient(90deg,var(--corp-accent),#ef6b6b 45%,var(--corp-navy) 100%);
  transform:none!important;
  border-radius:0;
  z-index:0;
}
.hero-sub{
  display:inline-flex!important;
  align-items:center;
  gap:10px;
  margin-bottom:16px;
  padding:7px 14px;
  border:1px solid #e3ddd6!important;
  border-radius:999px!important;
  background:#fff!important;
  color:var(--corp-slate)!important;
  font-size:12px!important;
  font-weight:700!important;
  letter-spacing:.12em;
  box-shadow:none!important;
}
.hero-h1,
.hero-h1-suffix{
  font-size:clamp(36px,4.8vw,66px)!important;
  line-height:1.08!important;
  color:var(--corp-navy-deep)!important;
}
.hero-h1{
  margin-top:0!important;
  margin-bottom:6px!important;
}
.hero-h1-accent{margin-bottom:18px!important;}
.hero-desc{
  max-width:min(620px,58vw);
  color:var(--corp-slate)!important;
  font-size:clamp(14px,1.55vw,17px)!important;
  line-height:1.9!important;
  margin-bottom:26px!important;
}
.hero-cta{
  gap:12px!important;
  margin-bottom:18px!important;
}
.hero-cta .btn-red-round,
.form-submit,
.product-buy-btn,
.lineup-all-buy-link,
.customizer-action-btn.checkout{
  background:linear-gradient(135deg,var(--corp-navy),#223552)!important;
  color:#fff!important;
  border:1px solid var(--corp-navy)!important;
  box-shadow:var(--corp-shadow-soft)!important;
}
.hero-cta .btn-red-round:hover,
.form-submit:hover,
.product-buy-btn:hover,
.lineup-all-buy-link:hover,
.customizer-action-btn.checkout:hover{
  background:linear-gradient(135deg,#101d30,#1a2a43)!important;
}
.hero-cta .btn-outline-round,
.btn-pill,
.customizer-action-btn.light,
.customizer-action-btn.sub,
.customizer-action-btn.visibility,
.direct-print-btn{
  background:#fff!important;
  color:var(--corp-navy)!important;
  border:1px solid var(--corp-border)!important;
  box-shadow:none!important;
}
.hero-cta .btn-outline-round:hover,
.btn-pill:hover,
.customizer-action-btn.light:hover,
.customizer-action-btn.sub:hover,
.customizer-action-btn.visibility:hover,
.direct-print-btn:hover{
  border-color:var(--corp-navy)!important;
  background:#f6f9fc!important;
}
.hero-shop-links .btn-red-round{
  background:#fff!important;
  color:var(--corp-navy)!important;
  border:1px solid var(--corp-border)!important;
}
.hero-features{
  margin-top:26px!important;
  gap:14px!important;
}
.hero-feature-card{
  position:relative;
  border:1px solid var(--corp-border)!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#fff 0%,#fbfcfe 100%)!important;
  box-shadow:var(--corp-shadow-soft)!important;
}
.hero-feature-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:linear-gradient(180deg,var(--corp-accent),#ec8a8a);
  border-radius:18px 0 0 18px;
}
.hero-feature-mascot{
  width:50px!important;
  height:50px!important;
  border-radius:14px!important;
  background:linear-gradient(180deg,#fff,#f2f5fa)!important;
  box-shadow:inset 0 0 0 1px #e4ded7;
}
.hero-feature-mascot img{
  object-fit:contain;
  padding:6px;
}
.hero-feature-title{
  color:var(--corp-navy)!important;
  font-size:14px!important;
  letter-spacing:.02em;
}
.hero-feature-desc{
  color:var(--corp-slate)!important;
  font-size:12px!important;
  line-height:1.75!important;
}
.hero-mascot-bubble{
  right:auto!important;
  left:clamp(12px,2vw,24px)!important;
  top:clamp(8px,1.5vw,18px)!important;
  margin-right:0!important;
  padding:14px 16px!important;
  border-radius:18px!important;
  border:1px solid #dfd9d1!important;
  background:rgba(255,255,255,.96)!important;
  color:var(--corp-navy)!important;
  font-size:13px!important;
  font-weight:700!important;
  line-height:1.7!important;
  box-shadow:0 14px 30px rgba(16,31,56,.12)!important;
}
.hero-mascot-bubble::after{
  right:auto!important;
  left:24px!important;
  border-top-color:#dfd9d1!important;
}
.mascot-accent img{
  object-fit:contain;
  object-position:center bottom;
  filter:drop-shadow(0 16px 28px rgba(16,31,56,.10));
}
.mascot-accent--hero{
  width:clamp(210px,24vw,340px)!important;
  right:clamp(12px,4vw,54px)!important;
  top:clamp(62px,7vw,112px)!important;
}
.mascot-accent--hero img{filter:drop-shadow(0 24px 34px rgba(16,31,56,.12))!important;}
.lineup-ornaments,
.customizer-ornaments,
.lineup-sparkle,
.lineup-dot,
.customizer-spark,
.customizer-dot-field{display:none!important;}
.news-section,
.lineup-section,
.customizer-section,
.gallery-section,
.process-section,
.guide-section,
.contact-section,
.philosophy-section,
.recruit-section,
footer{
  background:var(--corp-surface)!important;
  border:1px solid var(--corp-border)!important;
  border-radius:20px!important;
  box-shadow:var(--corp-shadow)!important;
}
.lineup-section,
.customizer-section,
.process-section,
.contact-section,
.recruit-section{
  background:linear-gradient(180deg,#fff 0%,var(--corp-surface-2) 100%)!important;
}
.lineup-section::after,
.customizer-section::after,
.process-section::after,
.guide-section::after,
.contact-section::after,
.recruit-section::after,
footer::before{
  content:none!important;
}
.section-tag,
.lineup-all-title .section-tag{
  background:linear-gradient(135deg,var(--corp-navy),#223552)!important;
  color:#fff!important;
  border-radius:999px!important;
  box-shadow:none!important;
  letter-spacing:.08em;
}
.lineup-title,
.customizer-title,
.philosophy-motto,
.recruit-heading h2{
  color:var(--corp-navy-deep)!important;
}
.lineup-lead,
.customizer-copy,
.process-note,
.promise-info p,
.philosophy-body p,
.recruit-empty p,
.recruit-field-value,
.footer-address,
.footer-copyright,
.form-note,
.news-meta,
.news-date,
.product-desc,
.product-detail-desc{
  color:var(--corp-slate)!important;
}
.product-card,
.guide-card,
.process-step,
.recruit-card,
.customizer-preview-panel,
.customizer-controls-panel,
.contact-form,
.slider-card,
.gallery-item,
.lineup-all-card,
.customizer-preset-card{
  border:1px solid #e6e0d9!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:var(--corp-shadow-soft)!important;
}
.product-card:hover,
.guide-card:hover,
.gallery-item:hover,
.process-step:hover,
.lineup-all-card:hover{
  transform:translateY(-4px);
  border-color:#d8d2cc!important;
  box-shadow:0 18px 34px rgba(16,31,56,.10)!important;
}
.product-thumb,
.lineup-all-thumb,
.guide-thumb{
  background:linear-gradient(180deg,#f7f9fc,#eef3f8)!important;
}
.product-name,
.lineup-all-name,
.guide-title,
.step-title,
.news-title,
.contact-lead{
  color:var(--corp-navy)!important;
}
.recruit-card-body .recruit-card-title{color:var(--corp-navy)!important;}
.process-step{
  position:relative;
  min-height:200px;
}
.process-step::before{
  content:"";
  position:absolute;
  left:18px;
  top:18px;
  width:36px;
  height:3px;
  border-radius:999px;
  background:var(--corp-accent);
}
.step-num{
  background:#f4f0eb!important;
  color:var(--corp-navy)!important;
  border:1px solid #e2dcd6!important;
}
.customizer-head{margin-bottom:22px!important;}
.customizer-heading-icon{
  background:linear-gradient(180deg,#20314d,#152239)!important;
  box-shadow:none!important;
}
.wear-preview-canvas,
.customizer-summary-box,
.customizer-live-estimate,
.wear-type-btn,
.color-part-tab,
.direct-print-tab,
.direct-print-btn,
.customizer-input,
.customizer-select,
.customizer-textarea,
.upload-box,
.form-input,
.form-textarea{
  border-color:#dfd9d1!important;
}
.wear-type-btn.active,
.color-part-tab.active,
.direct-print-tab.active{
  background:#eef3f8!important;
  border-color:#a49c94!important;
  color:var(--corp-navy)!important;
}
.customizer-summary-box,
.customizer-live-estimate{
  background:linear-gradient(180deg,#fff,#f6f9fc)!important;
}
.contact-form{
  background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important;
}
.form-input:focus,
.form-textarea:focus{
  border-color:#a49c94!important;
  box-shadow:0 0 0 4px rgba(35,41,54,.08)!important;
}
.philosophy-section{
  background:linear-gradient(135deg,#142238,#0d1727)!important;
  border-color:#1d2b42!important;
  box-shadow:0 22px 48px rgba(12,24,40,.25)!important;
}
.philosophy-section .lineup-label,
.philosophy-section .philosophy-motto,
.philosophy-section .footer-company,
.philosophy-section .footer-company-name,
.philosophy-section .promise-info h4{color:#fff!important;}
.philosophy-body p{color:rgba(255,255,255,.78)!important;}
.recruit-card-header{
  background:linear-gradient(135deg,var(--corp-navy),#223552)!important;
}
.recruit-card-header .recruit-card-title{color:#fff!important;}
.recruit-card-type,
.admin-bar-badge{
  background:var(--corp-accent)!important;
}
footer{
  position:relative;
  overflow:hidden;
  color:var(--corp-navy-deep)!important;
  border-radius:20px 20px 0 0!important;
  padding-right:clamp(170px,20vw,280px)!important;
  background:linear-gradient(180deg,#fff 0%,#f6f8fb 100%)!important;
}
footer::after{
  width:clamp(86px,11vw,132px)!important;
  right:clamp(18px,4vw,48px)!important;
  bottom:26px!important;
  opacity:.92;
  filter:drop-shadow(0 12px 24px rgba(16,31,56,.10))!important;
}
.footer-company-name,
.footer-nav-title,
.footer-nav-col a{
  color:var(--corp-navy)!important;
}
.footer-nav-col a:hover,
.product-link:hover,
.lineup-all-link:hover,
.guide-link:hover{color:var(--corp-accent)!important;}
.mascot-accent--lineup,
.mascot-accent--customize,
.mascot-accent--process,
.mascot-accent--contact,
.mascot-accent--philosophy{
  opacity:.9;
}
.mascot-accent--lineup{
  width:clamp(60px,5.8vw,84px)!important;
  top:24px!important;
  right:22px!important;
}
.mascot-accent--customize{
  width:clamp(72px,7vw,98px)!important;
  top:26px!important;
  right:26px!important;
}
.mascot-accent--process{
  width:clamp(64px,6vw,88px)!important;
  right:28px!important;
  bottom:28px!important;
}
.mascot-accent--contact{
  width:clamp(72px,7vw,98px)!important;
  top:24px!important;
  right:24px!important;
}
.mascot-accent--philosophy{
  width:clamp(64px,6vw,86px)!important;
  right:32px!important;
  bottom:26px!important;
}
@media (max-width:1180px){
  .hero-desc{max-width:100%!important;}
  .mascot-accent--hero{
    width:min(30vw,280px)!important;
    right:14px!important;
  }
}
@media (max-width:1023px){
  .header-nav{justify-content:center;}
  .hero{
    padding:42px 18px 36px!important;
    border-radius:0 0 18px 18px!important;
  }
  .hero-sub{
    font-size:11px!important;
    letter-spacing:.08em;
  }
  .hero-features{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .mascot-accent--hero{
    position:relative!important;
    width:min(48vw,220px)!important;
    right:auto!important;
    top:auto!important;
    margin:18px auto 0!important;
  }
  .hero-mascot-bubble{
    position:absolute!important;
    left:50%!important;
    top:-8px!important;
    transform:translateX(-50%);
    width:max-content;
    max-width:220px;
    text-align:center;
  }
  footer{
    padding-right:clamp(24px,5vw,42px)!important;
  }
  footer::after{display:none!important;}
}
@media (max-width:767px){
  .top-bar{display:none!important;}
  .header-inner{
    gap:10px;
    padding:10px 12px;
  }
  .hero-h1,
  .hero-h1-suffix{
    font-size:clamp(30px,9.4vw,42px)!important;
  }
  .hero-desc{
    font-size:14px!important;
    line-height:1.8!important;
  }
  .hero-features{grid-template-columns:1fr!important;}
  .hero-feature-card{padding-left:16px!important;}
  .mascot-accent--lineup,
  .mascot-accent--customize,
  .mascot-accent--contact,
  .mascot-accent--process,
  .mascot-accent--philosophy{
    display:none!important;
  }
  .hero-mascot-bubble{
    max-width:200px;
    padding:12px 14px!important;
    font-size:12px!important;
  }
  .news-section,
  .lineup-section,
  .customizer-section,
  .gallery-section,
  .process-section,
  .guide-section,
  .contact-section,
  .philosophy-section,
  .recruit-section,
  footer{
    border-radius:16px!important;
  }
}

/* 2026-05-29 final override: keep the top mascot anchored and preserve premium tone */
:root{
  --corp-navy:#1b2638;
  --corp-navy-deep:#111927;
  --corp-slate:#5f6978;
  --corp-border:#ded5c8;
  --corp-bg:#f4f0e8;
  --corp-surface:#fffdf8;
  --corp-surface-2:#f8f4ed;
  --corp-accent:#b78b45;
  --corp-accent-dark:#7c5c2a;
  --corp-gold-soft:#eadcc4;
  --corp-shadow:0 22px 54px rgba(17,25,39,.1);
  --corp-shadow-soft:0 14px 32px rgba(17,25,39,.08);
}
body{
  background:
    radial-gradient(ellipse at 8% 0%,rgba(183,139,69,.12),transparent 34%),
    radial-gradient(ellipse at 94% 8%,rgba(27,38,56,.08),transparent 32%),
    linear-gradient(180deg,#f7f3ec 0%,#eef2f6 100%)!important;
}
.hero{
  position:relative!important;
  min-height:clamp(620px,58vw,760px)!important;
  padding:clamp(58px,6vw,92px) clamp(24px,6vw,84px) clamp(54px,6vw,82px)!important;
  padding-right:clamp(320px,34vw,500px)!important;
  background:
    linear-gradient(105deg,rgba(255,255,255,.98) 0 62%,rgba(248,244,237,.72) 62% 100%),
    radial-gradient(ellipse at 84% 40%,rgba(234,220,196,.88),transparent 42%),
    linear-gradient(180deg,#fffdfa 0%,#f5f1ea 100%)!important;
  border-color:rgba(222,213,200,.92)!important;
  border-radius:0 0 26px 26px!important;
  box-shadow:0 28px 70px rgba(17,25,39,.11)!important;
}
.hero::after{
  content:""!important;
  position:absolute!important;
  top:clamp(72px,8vw,124px)!important;
  right:clamp(28px,5vw,86px)!important;
  width:clamp(230px,26vw,390px)!important;
  height:clamp(250px,30vw,430px)!important;
  border:1px solid rgba(183,139,69,.24)!important;
  border-radius:42% 58% 48% 52%/50% 44% 56% 50%!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.88),rgba(248,241,230,.42)),
    radial-gradient(circle at 34% 24%,rgba(255,255,255,.95),transparent 34%)!important;
  box-shadow:0 24px 60px rgba(17,25,39,.08)!important;
  z-index:0!important;
}
.hero-sub{
  color:var(--corp-accent-dark)!important;
  border-color:rgba(183,139,69,.34)!important;
  background:rgba(255,255,255,.84)!important;
}
.hero-h1,
.hero-h1-suffix{
  color:var(--corp-navy-deep)!important;
  text-shadow:none!important;
  letter-spacing:.01em!important;
}
.hero-h1-suffix::after{
  height:3px!important;
  width:min(420px,70%)!important;
  background:linear-gradient(90deg,var(--corp-accent),rgba(183,139,69,.18))!important;
}
.hero-desc{
  color:var(--corp-slate)!important;
  background:none!important;
  text-decoration:none!important;
  font-weight:700!important;
}
.hero-cta-row .btn-red-round,
.hero-cta .btn-red-round{
  background:linear-gradient(135deg,var(--corp-navy-deep),#273852)!important;
  border:1px solid rgba(17,25,39,.92)!important;
  box-shadow:0 14px 30px rgba(17,25,39,.18)!important;
}
.hero-cta-row .btn-outline-round,
.hero-cta .btn-outline-round{
  background:rgba(255,255,255,.9)!important;
  border:1px solid rgba(183,139,69,.44)!important;
  color:var(--corp-navy)!important;
  box-shadow:0 10px 24px rgba(17,25,39,.06)!important;
}
.hero-feature-card{
  border-color:rgba(222,213,200,.94)!important;
  background:linear-gradient(180deg,#fff 0%,#fbf8f2 100%)!important;
}
.hero-feature-card::before{
  background:linear-gradient(180deg,var(--corp-accent),rgba(183,139,69,.28))!important;
}
.mascot-accent--hero{
  position:absolute!important;
  z-index:3!important;
  width:clamp(245px,24vw,350px)!important;
  right:clamp(42px,8vw,116px)!important;
  top:clamp(124px,13vw,184px)!important;
  margin:0!important;
}
.mascot-accent--hero img{
  filter:drop-shadow(0 28px 38px rgba(17,25,39,.16))!important;
}
.hero-mascot-bubble{
  left:50%!important;
  right:auto!important;
  top:clamp(-18px,-1vw,-8px)!important;
  transform:translateX(-50%)!important;
  border-color:rgba(183,139,69,.38)!important;
  color:var(--corp-navy)!important;
  box-shadow:0 18px 34px rgba(17,25,39,.14)!important;
}
.hero-mascot-bubble::after{
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  border-top-color:rgba(183,139,69,.38)!important;
}
@media (max-width:1180px){
  .hero{
    padding-right:clamp(250px,31vw,360px)!important;
  }
  .mascot-accent--hero{
    width:clamp(220px,26vw,290px)!important;
    right:clamp(22px,4vw,46px)!important;
    top:clamp(132px,15vw,176px)!important;
  }
}
@media (min-width:560px) and (max-width:1023px){
  .hero{
    display:block!important;
    padding:42px clamp(20px,4vw,32px) 42px!important;
    padding-right:clamp(190px,34vw,260px)!important;
  }
  .mascot-accent--hero{
    position:absolute!important;
    width:clamp(165px,28vw,220px)!important;
    right:clamp(18px,4vw,38px)!important;
    top:clamp(150px,22vw,210px)!important;
    margin:0!important;
  }
  .hero::after{
    top:clamp(128px,19vw,188px)!important;
    right:clamp(8px,3vw,26px)!important;
    bottom:auto!important;
    width:clamp(180px,34vw,270px)!important;
    height:clamp(190px,38vw,292px)!important;
    transform:none!important;
  }
  .hero-features{
    margin-top:34px!important;
  }
  .hero-mascot-bubble{
    max-width:190px!important;
    padding:10px 12px!important;
    font-size:11.5px!important;
    line-height:1.55!important;
  }
}
@media (max-width:559px){
  .hero{
    display:grid!important;
    grid-template-columns:minmax(0,1fr);
    padding:34px 18px 36px!important;
  }
  .hero-sub{order:1;}
  .hero-h1{order:2;}
  .hero-h1-accent{order:3;}
  .hero-desc{order:4;}
  .mascot-accent--hero{
    order:5;
    position:relative!important;
    width:min(52vw,210px)!important;
    right:auto!important;
    top:auto!important;
    margin:clamp(14px,4vw,22px) auto clamp(12px,4vw,24px)!important;
  }
  .hero-cta{order:6;}
  .hero-shop-links{order:7;}
  .hero-features{order:8;}
  .hero::after{
    top:auto!important;
    right:50%!important;
    bottom:clamp(310px,88vw,500px)!important;
    width:min(66vw,260px)!important;
    height:min(72vw,285px)!important;
    transform:translateX(50%)!important;
  }
  .hero-h1,
  .hero-h1-suffix{
    font-size:clamp(31px,9.2vw,44px)!important;
    line-height:1.1!important;
  }
  .hero-desc{
    max-width:100%!important;
  }
}

/* 2026-05-29 usability refinement: layout and tap comfort only */
html{
  scroll-padding-top:calc(var(--body-pad-top) + 16px);
}
body{
  color:#182031!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a,
button,
input,
select,
textarea{
  touch-action:manipulation;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible{
  outline:3px solid rgba(183,139,69,.36)!important;
  outline-offset:3px;
}
.header-inner{
  max-width:1240px;
  margin-inline:auto;
}
.header-nav{
  gap:4px!important;
}
.header-nav a{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:8px 11px!important;
  transition:background .18s ease,color .18s ease;
}
.header-nav a:hover,
.header-nav a:focus-visible{
  background:rgba(183,139,69,.1)!important;
}
.cart-btn-header,
.menu-toggle{
  min-width:46px!important;
  min-height:46px!important;
  border-radius:16px!important;
}
.hero{
  min-height:auto!important;
}
@media (min-width:1024px){
  .hero{
    padding-top:clamp(48px,5vw,74px)!important;
    padding-bottom:clamp(42px,5vw,66px)!important;
    padding-right:clamp(300px,32vw,470px)!important;
  }
}
.hero-sub{
  max-width:100%;
  white-space:normal;
}
.hero-desc{
  max-width:700px!important;
  font-size:clamp(15px,1.22vw,18px)!important;
  line-height:1.85!important;
}
.hero-cta,
.hero-cta-row{
  align-items:center!important;
  gap:12px!important;
  margin-top:clamp(20px,2vw,28px)!important;
  margin-bottom:18px!important;
}
.hero-cta .btn-red-round,
.hero-cta .btn-outline-round,
.hero-cta-row .btn-red-round,
.hero-cta-row .btn-outline-round,
.form-submit,
.product-buy-btn,
.lineup-all-buy-link,
.customizer-action-btn{
  min-height:48px;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
}
.hero-cta .btn-red-round,
.hero-cta .btn-outline-round,
.hero-cta-row .btn-red-round,
.hero-cta-row .btn-outline-round{
  padding:0 24px!important;
}
.hero-features{
  margin-top:clamp(24px,2.4vw,32px)!important;
  gap:12px!important;
}
.hero-feature-card{
  display:grid!important;
  grid-template-rows:auto auto 1fr;
  min-height:0!important;
  padding:16px!important;
  border-radius:14px!important;
  align-content:start;
}
.hero-feature-title{
  font-size:clamp(14px,1.08vw,17px)!important;
  line-height:1.4!important;
}
.hero-feature-desc{
  font-size:13px!important;
  line-height:1.7!important;
}
.news-section,
.lineup-section,
.customizer-section,
.gallery-section,
.process-section,
.guide-section,
.contact-section,
.philosophy-section,
.recruit-section{
  padding-top:clamp(42px,5vw,70px)!important;
  padding-bottom:clamp(42px,5vw,70px)!important;
}
.product-card,
.guide-card,
.process-step,
.recruit-card,
.contact-form,
.customizer-preview-panel,
.customizer-controls-panel,
.customizer-preset-card,
.lineup-all-card{
  border-radius:16px!important;
}
.product-card,
.guide-card,
.process-step,
.recruit-card,
.lineup-all-card{
  display:flex;
  flex-direction:column;
}
.product-name,
.lineup-all-name,
.guide-title,
.step-title,
.recruit-card-title{
  line-height:1.45!important;
}
.product-desc,
.lineup-all-desc,
.guide-desc,
.step-desc{
  line-height:1.75!important;
}
.product-buy-btn,
.lineup-all-buy-link,
.guide-link,
.recruit-apply-btn{
  border-radius:999px!important;
}
.customizer-shell{
  gap:clamp(16px,2.2vw,26px)!important;
}
@media (min-width:1100px){
  .customizer-shell{
    grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr)!important;
    align-items:start;
  }
  .customizer-preview-panel{
    position:sticky;
    top:calc(var(--body-pad-top) + 18px);
  }
}
.customizer-preview-panel,
.customizer-controls-panel{
  padding:clamp(16px,2vw,24px)!important;
}
.wear-preview-canvas{
  min-height:clamp(280px,36vw,520px)!important;
}
.direct-print-tab,
.direct-print-btn,
.wear-type-btn,
.color-part-tab{
  min-height:44px!important;
}
.customizer-input,
.customizer-select,
.form-input{
  min-height:48px!important;
}
.customizer-textarea,
.form-textarea{
  min-height:118px!important;
}
.color-swatch,
.selected-color-chip,
.custom-color-input{
  width:36px!important;
  height:36px!important;
}
.cmyk-swatch-grid{
  grid-template-columns:repeat(auto-fit,28px)!important;
  gap:7px!important;
}
.cmyk-swatch-btn{
  width:28px!important;
  height:28px!important;
}
.customizer-actions{
  gap:10px!important;
}
.customizer-actions .customizer-action-btn{
  flex:1 1 170px;
}
.contact-form{
  max-width:760px!important;
}
.form-label,
.customizer-field label{
  color:#293244!important;
}
.form-input,
.form-textarea,
.customizer-input,
.customizer-select,
.customizer-textarea{
  font-size:16px;
}
@media (max-width:767px){
  html{
    scroll-padding-top:82px;
  }
  .header-inner{
    min-height:66px!important;
  }
  .hero{
    padding:28px 18px 32px!important;
    border-radius:0 0 16px 16px!important;
  }
  .hero-sub{
    justify-self:start;
    font-size:10px!important;
    line-height:1.5!important;
    padding:8px 12px!important;
  }
  .hero-h1,
  .hero-h1-suffix{
    font-size:clamp(30px,8.8vw,40px)!important;
    line-height:1.12!important;
  }
  .hero-h1-accent{
    margin-bottom:16px!important;
  }
  .hero-desc{
    margin-bottom:0!important;
    font-size:14px!important;
    line-height:1.8!important;
  }
  .hero::after,
  .mascot-accent--hero{
    display:none!important;
  }
  .hero-cta{
    order:5;
    display:grid!important;
    grid-template-columns:1fr;
    margin-top:22px!important;
  }
  .hero-shop-links{
    order:6;
  }
  .hero-features{
    order:7;
    margin-top:24px!important;
    gap:10px!important;
  }
  .hero-feature-card{
    grid-template-columns:54px minmax(0,1fr);
    grid-template-rows:auto auto;
    column-gap:12px!important;
    row-gap:3px!important;
    padding:14px!important;
    text-align:left!important;
  }
  .hero-feature-mascot{
    grid-row:1/3;
    width:48px!important;
    height:48px!important;
  }
  .hero-feature-title,
  .hero-feature-desc{
    text-align:left!important;
  }
  .news-section,
  .lineup-section,
  .customizer-section,
  .gallery-section,
  .process-section,
  .guide-section,
  .contact-section,
  .philosophy-section,
  .recruit-section{
    padding:34px 16px!important;
    border-radius:14px!important;
  }
  .customizer-preview-panel,
  .customizer-controls-panel,
  .contact-form{
    padding:16px!important;
  }
  .preview-color-layout{
    grid-template-columns:1fr!important;
  }
  .preview-color-panel{
    border-left:0!important;
    padding-left:0!important;
    border-top:1px solid #e6e0d9!important;
    padding-top:12px!important;
  }
  .direct-print-tools{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  .customizer-actions .customizer-action-btn{
    flex:1 1 100%;
    min-height:48px!important;
  }
  .direct-print-actions .customizer-action-btn{
    min-height:46px!important;
  }
  .mobile-float-cta{
    padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px))!important;
  }
  .mobile-float-cta-btn{
    min-height:50px!important;
  }
}
@media (max-width:420px){
  .hero{
    padding-inline:16px!important;
  }
  .hero-feature-card{
    grid-template-columns:48px minmax(0,1fr);
  }
  .hero-feature-mascot{
    width:42px!important;
    height:42px!important;
  }
}

/* 2026-05-29: remove overlapping selected-color summary and keep footer text readable */
.preview-color-panel .color-active-summary{
  display:none!important;
}
.footer-copyright{
  color:#fff!important;
}

/* 2026-05-30: keep the hero speech bubble from overlapping the mascot */
@media (max-width:1023px){
  .mascot-accent--hero{
    display:grid!important;
    grid-template-rows:auto auto;
    align-items:start;
    justify-items:center;
    gap:12px;
    overflow:visible!important;
  }
  .hero-mascot-bubble{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    transform:none!important;
    width:min(100%,300px)!important;
    max-width:300px!important;
    margin:0 auto!important;
    padding:16px 18px!important;
    font-size:clamp(13px,2.4vw,16px)!important;
    line-height:1.58!important;
    text-align:center!important;
    z-index:4!important;
  }
  .hero-mascot-bubble::after{
    left:50%!important;
    right:auto!important;
    bottom:-12px!important;
    transform:translateX(-50%)!important;
  }
  .mascot-accent--hero img{
    width:100%!important;
    max-width:100%!important;
    grid-row:2;
  }
}

@media (max-width:767px){
  .hero{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    row-gap:0!important;
  }
  .hero-desc{
    width:100%!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:auto-phrase;
  }
  .mascot-accent--hero{
    order:5!important;
    position:relative!important;
    display:grid!important;
    width:min(76vw,300px)!important;
    right:auto!important;
    top:auto!important;
    margin:24px auto 18px!important;
  }
  .hero-cta{order:6!important;}
  .hero-shop-links{order:7!important;}
  .hero-features{order:8!important;}
  .hero-mascot-bubble{
    width:min(78vw,300px)!important;
    max-width:300px!important;
    padding:15px 18px!important;
    font-size:clamp(14px,4vw,17px)!important;
    line-height:1.55!important;
    border-radius:28px!important;
  }
}

@media (max-width:420px){
  .mascot-accent--hero{
    width:min(82vw,280px)!important;
    margin-top:22px!important;
  }
  .hero-mascot-bubble{
    width:min(82vw,280px)!important;
    padding:14px 16px!important;
    font-size:clamp(13px,4.1vw,16px)!important;
  }
}

@media (min-width:1024px){
  .mascot-accent--hero{
    display:grid!important;
    grid-template-rows:auto auto;
    justify-items:center;
    align-items:start;
    gap:24px;
    width:clamp(250px,20vw,330px)!important;
    top:clamp(112px,8vw,170px)!important;
    right:clamp(48px,8vw,180px)!important;
    overflow:visible!important;
  }
  .hero-mascot-bubble{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    transform:none!important;
    width:min(100%,300px)!important;
    max-width:300px!important;
    margin:0 auto!important;
    padding:16px 18px!important;
    font-size:clamp(12px,1vw,15px)!important;
    line-height:1.6!important;
    text-align:center!important;
    z-index:4!important;
  }
  .hero-mascot-bubble::after{
    left:50%!important;
    right:auto!important;
    bottom:-12px!important;
    transform:translateX(-50%)!important;
  }
  .mascot-accent--hero img{
    grid-row:2;
    width:100%!important;
    max-width:100%!important;
  }
}

/* 2026-05-31: softer button shadows and stable staff preset color controls */
.hero-cta-row .btn-red-round,
.hero-cta .btn-red-round{
  box-shadow:0 8px 18px rgba(17,25,39,.1)!important;
}
.hero-cta-row .btn-outline-round,
.hero-cta .btn-outline-round{
  box-shadow:0 6px 16px rgba(17,25,39,.04)!important;
}
.hero-cta-row .btn-red-round:hover,
.hero-cta .btn-red-round:hover{
  box-shadow:0 10px 22px rgba(17,25,39,.12)!important;
}
.hero-cta-row .btn-outline-round:hover,
.hero-cta .btn-outline-round:hover{
  box-shadow:0 8px 18px rgba(17,25,39,.05)!important;
}
.customizer-modal .preset-color-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px 18px!important;
}
.customizer-modal .preset-color-control{
  min-width:0;
}
.customizer-modal .preset-cmyk-grid{
  grid-template-columns:repeat(5,28px)!important;
  gap:7px!important;
  align-items:center;
}
.customizer-modal .preset-cmyk-grid .cmyk-swatch-btn{
  width:28px!important;
  height:28px!important;
}
.customizer-modal .preset-color-name{
  min-height:1.4em;
  white-space:normal;
  overflow-wrap:anywhere;
}
.preview-color-panel .color-control-grid,
.preview-color-panel .color-control{
  width:100%;
  max-width:100%;
  min-width:0;
}
.preview-color-panel .cmyk-swatch-grid{
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  justify-items:center;
  gap:8px 6px!important;
  padding:4px;
}
.preview-color-panel .cmyk-swatch-btn{
  width:24px!important;
  height:24px!important;
}
@media (min-width:1440px){
  .preview-color-layout{
    grid-template-columns:minmax(0,1fr) minmax(176px,190px)!important;
    gap:22px!important;
  }
  .preview-color-panel{
    padding-left:0!important;
  }
  .preview-color-layout .wear-preview-canvas{
    width:100%!important;
    max-width:100%!important;
    min-height:0!important;
    height:auto!important;
    aspect-ratio:1/1!important;
  }
}
@media (max-width:560px){
  .customizer-modal .preset-color-grid{
    grid-template-columns:1fr!important;
  }
}

/* 2026-05-31: header cart illustration */
.cart-btn-header{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:46px!important;
  min-width:46px!important;
  height:46px!important;
  min-height:46px!important;
  padding:0!important;
  font-size:0!important;
  line-height:1!important;
}
.cart-btn-header::before,
.cart-btn-header::after{
  content:none!important;
  display:none!important;
}
.cart-header-icon{
  display:block!important;
  width:29px!important;
  height:auto!important;
  max-width:70%!important;
  max-height:22px!important;
  object-fit:contain!important;
  pointer-events:none;
}
.cart-badge{
  top:-6px!important;
  right:-7px!important;
}
@media (max-width:600px){
  .cart-btn-header{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
  }
  .cart-header-icon{
    width:27px;
  }
}

/* ── 求人票テンプレートドロップゾーン ── */
.recruit-template-area{
  border:2px dashed #ccc;
  border-radius:10px;
  padding:16px 12px 12px;
  text-align:center;
  background:#fafafa;
  cursor:pointer;
  transition:border-color .2s,background .2s;
  margin-bottom:6px;
}
.recruit-template-area.dragover{
  border-color:#E53030;
  background:#fff5f5;
}
.recruit-template-area.filled{
  border-color:#2ecc71;
  background:#f0fff4;
}
.recruit-template-icon{ font-size:28px; line-height:1; margin-bottom:6px; }
.recruit-template-text{ font-size:13px; font-weight:600; color:#555; margin-bottom:4px; }
.recruit-template-area.filled .recruit-template-text{ color:#1a7a3f; }
.recruit-template-sub{ font-size:11px; color:#999; margin:4px 0; }
.recruit-template-btn{
  display:inline-block;
  margin-top:4px;
  padding:5px 14px;
  background:#E53030;
  color:#fff;
  border-radius:6px;
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  transition:background .15s;
}
.recruit-template-btn:hover{ background:#c0392b; }
.recruit-template-hint{
  font-size:11px;
  color:#999;
  margin-bottom:10px;
  line-height:1.5;
}