/*
  BITEKI LP Styles
  01. Base / Common
  02. Age Gate
  03. Header / Drawer
  04. Hero / Main Visual
  05. Intro / Benefits / Freedom
  06. Appeal / Support / Salary / Work Style
  07. FAQ / Real Contents / Entry / Job Info
  08. Footer / Fixed Entry
  09. Responsive Overrides
*/

/* 01. Base / Common */
:root{--black:#111;--dark:#222;--gray:#666;--line:#ddd;--light:#f5f5f5;--white:#fff;--shadow:0 10px 28px rgba(0,0,0,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:#fff!important}body{margin:0;color:var(--dark);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;line-height:1.8;background:#fff!important;overflow-x:hidden}a{color:inherit}img{max-width:100%;height:auto;vertical-align:middle}
/* 02. Age Gate */
.age-gate{position:static!important;display:block;width:100%;min-height:auto;margin:0;padding:0 0 40px;background:#fff!important;overflow:visible!important}.age-gate.is-hidden{display:none!important}.age-gate:not(.is-hidden)+.site-shell{display:none!important}.age-gate__panel{width:100%;max-width:640px;margin:0 auto;padding:16px 12px 42px;text-align:center;background:#fff!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important}.age-gate__main-image{display:block;width:100%;max-width:640px;margin:0 auto 24px;border:0;border-radius:0;box-shadow:none}.age-gate__body{margin:0;padding:0;background:#fff!important}.age-gate__label,.section-label{margin:0 0 8px;color:#111;font-size:12px;font-weight:800;letter-spacing:.18em}.age-gate h1{margin:0 0 12px;color:#222;font-size:20px;line-height:1.5}.age-gate p{margin:0 0 10px;color:#666;font-size:14px}.age-gate__question{color:#222!important;font-weight:800}.age-gate__buttons{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%;max-width:390px;margin:22px auto 0}.age-gate button{min-height:46px;padding:12px 16px;border:1px solid #111!important;border-radius:0!important;box-shadow:none!important;font-weight:800;cursor:pointer}.age-gate__enter{color:#fff!important;background:#111!important}.age-gate__exit{color:#111!important;background:#fff!important}.age-gate__mutual-links{width:100%;max-width:468px;margin:28px auto 0;padding:20px 0 0;background:#fff!important;border-top:1px solid #ddd!important;overflow:visible!important}.age-gate__links-title{margin:0 0 12px!important;color:#666;font-size:12px!important;font-weight:800;letter-spacing:.12em}.age-gate__banner-list{display:block;width:100%;height:auto!important;max-height:none!important;margin:0;padding:0;background:#fff!important;overflow:visible!important}.age-gate__banner-list a{display:block;width:100%;margin:0 0 6px;padding:0;line-height:0;background:#fff!important;border:0!important;border-radius:0!important;overflow:visible!important}.age-gate__banner-list img{display:block;width:100%;max-width:468px;height:auto;margin:0 auto;border:0;border-radius:0}
html, body { margin:0 !important; padding:0 !important; background:#fff !important; overflow-x:hidden !important; }
body.age-page-reset:has(.age-gate:not(.is-hidden)) { background:#fff !important; }
.age-gate { position:static !important; inset:auto !important; display:block !important; width:100% !important; min-height:auto !important; height:auto !important; max-height:none !important; margin:0 !important; padding:0 0 40px !important; background:#fff !important; overflow:visible !important; }
.age-gate.is-hidden { display:none !important; }
.age-gate:not(.is-hidden) + .site-shell { display:none !important; }
.age-gate__panel, .age-gate__body, .age-gate__mutual-links, .age-gate__banner-list { background:#fff !important; box-shadow:none !important; border-radius:0 !important; overflow:visible !important; height:auto !important; max-height:none !important; }
.age-gate__panel { width:100% !important; max-width:640px !important; margin:0 auto !important; padding:16px 12px 42px !important; border:0 !important; }
.age-gate__main-image { display:block !important; width:100% !important; max-width:640px !important; margin:0 auto 24px !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; }
.age-gate__buttons { display:grid !important; grid-template-columns:1fr 1fr !important; gap:12px !important; width:100% !important; max-width:390px !important; margin:22px auto 0 !important; }
.age-gate button { min-height:46px !important; border-radius:0 !important; border:1px solid #111 !important; box-shadow:none !important; background:#fff !important; color:#111 !important; font-weight:800 !important; }
.age-gate__enter { background:#111 !important; color:#fff !important; }
.age-gate__exit { background:#fff !important; color:#111 !important; }
.age-gate__mutual-links { width:100% !important; max-width:468px !important; margin:28px auto 0 !important; padding:20px 0 0 !important; border-top:1px solid #ddd !important; }
.age-gate__banner-list { display:block !important; width:100% !important; padding:0 !important; margin:0 !important; }
.age-gate__banner-list a { display:block !important; width:100% !important; margin:0 0 6px !important; padding:0 !important; line-height:0 !important; background:#fff !important; border:0 !important; }
.age-gate__banner-list img { display:block !important; width:100% !important; max-width:468px !important; height:auto !important; margin:0 auto !important; border:0 !important; border-radius:0 !important; }
/* 03. Header / Hero / Shared Sections */
.site-shell{overflow:hidden;padding-bottom:76px;background:#fff}.site-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px clamp(14px,4vw,34px);background:rgba(255,255,255,.96);border-bottom:1px solid #ddd;backdrop-filter:blur(10px)}.site-header__logo img{width:148px}.site-header__nav{display:flex;gap:14px;font-size:13px;font-weight:700}.site-header__nav a{text-decoration:none;color:#666}.hero{position:relative;min-height:690px;display:grid;align-items:center;padding:60px 16px 42px;background:#f5f5f5}.hero__bg{position:absolute;inset:0;opacity:.12;background-image:url('../images/04_main_wide.webp');background-size:cover;background-position:center;filter:grayscale(100%) blur(4px);transform:scale(1.05)}.hero__inner{position:relative;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:34px;max-width:1080px;margin:0 auto}.hero h1{margin:0 0 16px;color:#222;font-size:clamp(30px,6vw,54px);line-height:1.22;letter-spacing:.02em}.hero__lead{max-width:540px;color:#666;font-size:15px}.hero__visual{padding:12px;background:#fff;border:1px solid #ddd;border-radius:0;box-shadow:var(--shadow)}.hero__visual img{width:100%;animation:slowZoom 9s ease-in-out infinite alternate}.hero__actions,.entry__buttons{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 22px;border-radius:0;text-decoration:none;font-weight:800;border:1px solid #111}.btn--line,.btn--dark{color:#fff;background:#111}.btn--ghost{color:#111;background:#fff}.image-copy,.appeal,.salary,.brands,.heaven-parts,.faq,.entry{padding:58px 14px;background:#fff}.section-head{text-align:center;max-width:760px;margin:0 auto 28px}.section-head--left{text-align:left;margin:0 0 24px}.section-head h2{margin:0 0 10px;color:#222;font-size:clamp(24px,5vw,38px);line-height:1.35}.section-head p{margin:0;color:#666;font-size:14px}.image-copy__inner{max-width:760px;margin:0 auto}.image-copy img,.appeal-card img,.salary-card img,.brand-strip img{display:block;width:100%;border:1px solid #ddd;background:#fff}.appeal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:960px;margin:0 auto}.appeal-card,.salary-card,.parts-card,.faq-item{background:#fff;border:1px solid #ddd;box-shadow:var(--shadow)}.photo-motion{padding:64px 14px;background:#f5f5f5}.photo-motion__inner{display:grid;grid-template-columns:.85fr 1.15fr;gap:34px;align-items:center;max-width:1080px;margin:0 auto}.photo-stack{position:relative;min-height:420px}.photo-stack figure{margin:0}.photo-stack__main{position:absolute;inset:0 7% 8% 0;overflow:hidden;background:#fff;border:1px solid #ddd;box-shadow:var(--shadow)}.photo-stack__main img{width:100%;height:100%;object-fit:cover;filter:grayscale(100%);animation:slowZoom 10s ease-in-out infinite alternate}.photo-stack__sub{position:absolute;width:42%;background:#fff;border:1px solid #ddd;box-shadow:var(--shadow)}.photo-stack__sub img{width:100%;filter:grayscale(100%)}.photo-stack__sub--one{right:0;top:7%}.photo-stack__sub--two{right:10%;bottom:0}.salary-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:16px;max-width:980px;margin:0 auto}.salary-card--wide{grid-row:span 2}.brand-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;max-width:1080px;margin:0 auto}.heaven-parts{background:#f5f5f5}.heaven-parts__inner{max-width:1120px;margin:0 auto}.parts-grid{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:18px;align-items:start}.parts-card__head{padding:18px;border-bottom:1px solid #ddd}.parts-card__head p{margin:0 0 4px;color:#111;font-size:11px;font-weight:800;letter-spacing:.16em}.parts-card__head h3{margin:0 0 6px;font-size:20px;color:#222}.parts-card__head span{display:block;color:#666;font-size:13px;line-height:1.7}.iframe-wrap{display:flex;justify-content:center;padding:16px 8px 20px;background:#fff}.iframe-wrap iframe{display:block;max-width:100%}.faq-list{max-width:840px;margin:0 auto;display:grid;gap:12px}.faq-item{padding:18px}.faq-item h3{margin:0 0 6px;font-size:17px}.faq-item p{margin:0;color:#666}.entry{text-align:center}.entry__inner{max-width:820px;margin:0 auto;padding:32px 18px;border:1px solid #ddd;background:#f5f5f5}.entry h2{margin:0 0 12px}.entry p{color:#666}.site-footer{padding:34px 14px 96px;text-align:center;background:#111;color:#fff}.site-footer img{width:130px;filter:brightness(0) invert(1)}.site-footer p{margin:12px 0 0;color:#ccc;font-size:12px}.fixed-entry{position:fixed;left:0;right:0;bottom:0;z-index:80;display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:1px;padding:8px;background:#fff;border-top:1px solid #ddd;box-shadow:0 -6px 20px rgba(0,0,0,.08)}.fixed-entry a{display:flex;align-items:center;justify-content:center;min-height:48px;text-decoration:none;font-size:13px;font-weight:800;border:1px solid #111;background:#fff;color:#111}.fixed-entry a:first-child{background:#111;color:#fff}.bt-reveal{opacity:0;transform:translateY(22px);transition:opacity .75s ease,transform .75s ease}.bt-reveal.is-visible{opacity:1;transform:translateY(0)}@keyframes slowZoom{from{transform:scale(1)}to{transform:scale(1.06)}}@media(max-width:980px){.hero__inner,.photo-motion__inner{grid-template-columns:1fr}.parts-grid{grid-template-columns:1fr;max-width:430px;margin:0 auto}.brand-strip{grid-template-columns:1fr 1fr}.salary-grid{grid-template-columns:1fr}.salary-card--wide{grid-row:auto}.appeal-grid{grid-template-columns:1fr 1fr}.site-header__nav{display:none}}@media(max-width:560px){.age-gate__panel{padding:12px 12px 38px}.age-gate h1{font-size:19px}.age-gate__buttons{max-width:none}.hero{min-height:auto;padding:40px 14px}.appeal-grid{grid-template-columns:1fr}.photo-stack{min-height:330px}.fixed-entry{padding:6px}.fixed-entry a{font-size:12px;min-height:46px}.image-copy,.appeal,.salary,.brands,.heaven-parts,.faq,.entry{padding:44px 12px}.brand-strip{grid-template-columns:1fr}}


/* 07. Real Contents / External Widgets */
.parts-card {
  width: 100%;
}

.iframe-wrap {
  width: 100%;
}

.responsive-widget-iframe {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto;
}

@media (max-width: 980px) {
  .parts-grid {
    width: 100%;
    max-width: none !important;
    margin: 0 auto;
    grid-template-columns: 1fr;
  }

  .heaven-parts__inner {
    width: 100%;
    max-width: none;
  }

  .parts-card {
    width: 100%;
  }

  .iframe-wrap {
    padding: 0;
  }

  .parts-card__head {
    padding: 20px 16px 16px;
  }
}

@media (max-width: 560px) {
  .heaven-parts {
    padding-left: 12px;
    padding-right: 12px;
  }

  .parts-grid {
    gap: 20px;
  }

  .iframe-wrap {
    padding: 0;
    overflow: hidden;
  }

  .responsive-widget-iframe {
    width: 100% !important;
  }
}

/* 05. Intro / Benefits / Freedom */
.hero--text .hero__lead {
  font-size: 16px;
  line-height: 2;
}

.hero-points {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
}

.hero-points span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 6px 12px;
  color: #111;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  background: #fff;
  border: 1px solid #111;
}

.intro-copy,
.first-time,
.flow,
.benefits,
.freedom,
.support-section,
.job-info {
  padding: 58px 14px;
  background: #fff;
}

.intro-copy__inner,
.benefit-highlight,
.support-section__inner,
.job-table,
.treatment {
  max-width: 980px;
  margin: 0 auto;
}

.intro-copy__inner {
  padding: 28px 18px;
  text-align: center;
  border: 1px solid #ddd;
  background: #f7f7f7;
}

.intro-copy__inner h2 {
  margin: 0 0 12px;
  font-size: clamp(24px, 5vw, 36px);
  line-height: 1.35;
}

.intro-copy__inner p:last-child {
  max-width: 720px;
  margin: 0 auto;
  color: #555;
}

.first-time[hidden],
.flow[hidden] {
  display: none !important;
}

.first-time__inner,
.flow__inner {
  max-width: 980px;
  margin: 0 auto;
}

.first-time .section-head,
.flow .section-head {
  margin-bottom: 24px;
}

.first-time__text,
.flow__text,
.flow__note {
  display: grid;
  gap: 12px;
  color: #333;
  font-size: 15px;
  line-height: 2;
}

.first-time__text p,
.flow__text p,
.flow__note p {
  margin: 0;
}

.first-time__points {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.first-time__points div,
.flow-step,
.flow__note {
  border: 1px solid #d9d9d9;
  border-radius: 6px;
  background: #fff;
}

.first-time__points div {
  position: relative;
  padding: 14px 16px 14px 34px;
  color: #111;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0;
}

.first-time__points div::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #111;
  transform: translateY(-50%);
}

.flow-list {
  display: grid;
  gap: 12px;
  width: min(760px, 100%);
  margin: 0 auto;
}

.flow-step {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 14px;
  padding: 15px 16px;
}

.flow-step__number {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid #111;
  color: #111;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
}

.flow-step p {
  margin: 0;
  color: #111;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.7;
}

.flow__note {
  width: min(760px, 100%);
  margin: 14px auto 0;
  padding: 16px;
  text-align: left;
}

.benefit-highlight {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 22px;
  align-items: center;
  padding: 28px 20px;
  border: 2px solid #111;
  background: #fff;
}

.benefit-highlight__main span {
  display: block;
  margin-bottom: 8px;
  color: #666;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .16em;
}

.benefit-highlight__main strong {
  display: block;
  color: #111;
  font-size: clamp(28px, 6vw, 48px);
  line-height: 1.2;
  letter-spacing: .02em;
}

.benefit-highlight ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}

.benefit-highlight li {
  padding: 10px 12px;
  font-weight: 800;
  border: 1px solid #ddd;
  background: #f7f7f7;
}

.note {
  grid-column: 1 / -1;
  margin: 0;
  color: #666;
  font-size: 12px;
  line-height: 1.8;
}

.freedom-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  max-width: 1080px;
  margin: 0 auto;
}

.freedom-card {
  padding: 20px 18px;
  border: 1px solid #ddd;
  background: #fff;
  box-shadow: var(--shadow);
}

.freedom-card span {
  display: inline-flex;
  margin-bottom: 10px;
  padding: 2px 8px;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  background: #111;
}

.freedom-card h3 {
  margin: 0 0 8px;
  font-size: 18px;
  line-height: 1.45;
}

.freedom-card p {
  margin: 0;
  color: #555;
  font-size: 14px;
  line-height: 1.9;
}

.support-section {
  background: #f5f5f5;
}

.support-section__inner {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 26px;
  align-items: start;
}

.support-list {
  display: grid;
  gap: 12px;
}

.support-list div {
  padding: 16px;
  border: 1px solid #ddd;
  background: #fff;
}

.support-list strong,
.support-list span {
  display: block;
}

.support-list strong {
  margin-bottom: 4px;
  font-size: 16px;
}

.support-list span {
  color: #666;
  font-size: 13px;
  line-height: 1.8;
}

.job-table {
  border-top: 1px solid #ddd;
}

.job-table dl {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 0;
  margin: 0;
  border-bottom: 1px solid #ddd;
}

.job-table dt,
.job-table dd {
  margin: 0;
  padding: 15px 14px;
}

.job-table dt {
  font-weight: 900;
  background: #f5f5f5;
  border-right: 1px solid #ddd;
}

.job-table dd {
  color: #444;
}

.treatment {
  margin-top: 26px;
  padding: 24px 18px;
  border: 1px solid #ddd;
  background: #f7f7f7;
}

.treatment h3 {
  margin: 0 0 14px;
  font-size: 22px;
}

.treatment ol {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px 14px;
  margin: 0;
  padding-left: 22px;
}

.treatment li {
  font-weight: 700;
}

.brand-list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
  max-width: 1080px;
  margin: 0 auto 20px;
}

.brand-list article {
  padding: 14px 12px;
  text-align: center;
  border: 1px solid #ddd;
  background: #fff;
}

.brand-list strong,
.brand-list span {
  display: block;
}

.brand-list strong {
  font-size: 14px;
}

.brand-list span {
  margin-top: 4px;
  color: #666;
  font-size: 11px;
}

.faq-list details {
  border: 1px solid #ddd;
  background: #fff;
  box-shadow: var(--shadow);
}

.faq-list summary {
  position: relative;
  display: block;
  padding: 16px 44px 16px 16px;
  font-weight: 900;
  cursor: pointer;
  list-style: none;
}

.faq-list summary::-webkit-details-marker {
  display: none;
}

.faq-list summary::after {
  content: "+";
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 22px;
  line-height: 1;
}

.faq-list details[open] summary::after {
  content: "−";
}

.faq-list details p {
  margin: 0;
  padding: 0 16px 18px;
  color: #555;
  font-size: 14px;
  line-height: 1.9;
}

@media(max-width:980px){
  .benefit-highlight,
  .support-section__inner {
    grid-template-columns: 1fr;
  }

  .freedom-grid {
    grid-template-columns: 1fr 1fr;
  }

  .brand-list {
    grid-template-columns: 1fr 1fr;
  }
}

@media(max-width:560px){
  .intro-copy,
  .first-time,
  .flow,
  .benefits,
  .freedom,
  .support-section,
  .job-info {
    padding: 44px 12px;
  }

  .benefit-highlight {
    padding: 22px 14px;
  }

  .first-time .section-head,
  .flow .section-head {
    margin-bottom: 18px;
  }

  .first-time__text,
  .flow__text,
  .flow__note {
    font-size: 14px;
    line-height: 1.9;
  }

  .first-time__points {
    grid-template-columns: 1fr;
  }

  .first-time__points div {
    padding: 13px 14px 13px 32px;
    font-size: 13px;
  }

  .flow-list {
    gap: 10px;
  }

  .flow-step {
    align-items: start;
    gap: 12px;
    padding: 13px 14px;
  }

  .flow-step__number {
    width: 34px;
    height: 34px;
  }

  .flow-step p {
    font-size: 14px;
  }

  .freedom-grid,
  .brand-list {
    grid-template-columns: 1fr;
  }

  .job-table dl {
    grid-template-columns: 1fr;
  }

  .job-table dt {
    border-right: 0;
    border-bottom: 1px solid #ddd;
  }

  .treatment ol {
    grid-template-columns: 1fr;
  }
}

/* 04. Hero / Main Visual */
.site-shell {
  padding-top: 72px;
}

.site-header--black {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 90;
  height: 72px;
  padding: 8px 14px;
  background: #111 !important;
  border-bottom: 0;
  color: #fff;
  box-shadow: 0 2px 10px rgba(0,0,0,.18);
  backdrop-filter: none;
}

.site-header--black .site-header__logo {
  display: inline-flex;
  align-items: center;
  min-width: 138px;
}

.site-header--black .site-header__logo img {
  width: 128px;
  max-height: 48px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

.site-header__quick {
  display: flex;
  align-items: center;
  gap: 18px;
}

.site-header__quick a {
  display: grid;
  place-items: center;
  min-width: 48px;
  color: #fff;
  text-decoration: none;
  line-height: 1.1;
}

.site-header__quick span {
  display: block;
  font-size: 24px;
  font-weight: 900;
  line-height: 1;
}

.site-header__quick small {
  display: block;
  margin-top: 4px;
  color: rgba(255,255,255,.86);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.hero--portal {
  display: block;
  min-height: 0;
  padding: 0;
  background: #fff;
}

.hero--portal .hero-main-visual {
  width: 100%;
  background: #eee;
  line-height: 0;
  overflow: hidden;
}

.hero--portal .hero-main-visual picture,
.hero--portal .hero-main-visual img {
  display: block;
  width: 100%;
}

.hero--portal .hero-main-visual img {
  aspect-ratio: 1920 / 640;
  height: auto;
  max-height: 640px;
  object-fit: cover;
  object-position: center;
}

.hero-summary {
  max-width: 980px;
  margin: 0 auto;
  padding: 22px 14px 28px;
  background: #fff;
}

.hero-summary > p {
  margin: 0 0 18px;
  color: #333;
  font-size: 16px;
  line-height: 1.9;
}

.shop-summary-card {
  display: grid;
  grid-template-columns: 76px 1fr;
  gap: 14px;
  align-items: center;
  margin: 0 0 18px;
  padding: 14px;
  background: #fff;
  border: 1px solid #e2e2e2;
}

.shop-summary-card img {
  width: 76px;
  height: 76px;
  object-fit: cover;
  border: 1px solid #ddd;
}

.shop-summary-card h1 {
  margin: 0 0 5px;
  color: #222;
  font-size: 26px;
  line-height: 1.25;
  letter-spacing: .08em;
}

.shop-summary-card p {
  margin: 0;
  color: #444;
  font-size: 14px;
  line-height: 1.7;
}

.hero-menu-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 3px;
  background: #fff;
}

.hero-menu-grid a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 8px 6px;
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  text-decoration: none;
  text-align: center;
  background: #111;
  border: 1px solid #fff;
}

@media (max-width: 768px) {
  .site-shell {
    padding-top: 58px;
  }

  .site-header--black {
    height: 58px;
    padding: 6px 10px;
  }

  .site-header--black .site-header__logo img {
    width: 116px;
    max-height: 40px;
  }

  .site-header__quick {
    gap: 12px;
  }

  .site-header__quick a {
    min-width: 42px;
  }

  .site-header__quick span {
    font-size: 22px;
  }

  .site-header__quick small {
    font-size: 10px;
  }

  .hero--portal .hero-main-visual img {
    aspect-ratio: 1 / 1;
    max-height: none;
    object-fit: cover;
  }

  .hero-summary {
    padding: 20px 14px 26px;
  }

  .hero-summary > p {
    font-size: 15px;
  }

  .shop-summary-card {
    grid-template-columns: 64px 1fr;
    gap: 12px;
    padding: 12px;
  }

  .shop-summary-card img {
    width: 64px;
    height: 64px;
  }

  .shop-summary-card h1 {
    font-size: 23px;
  }

  .shop-summary-card p {
    font-size: 13px;
  }

  .hero-menu-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 2px;
  }

  .hero-menu-grid a {
    min-height: 44px;
    font-size: 14px;
  }
}

@media (max-width: 380px) {
  .site-header__quick {
    gap: 8px;
  }

  .site-header__quick a {
    min-width: 38px;
  }

  .site-header__quick small {
    font-size: 9px;
  }

  .hero-menu-grid a {
    font-size: 13px;
  }
}


/* 04. Hero / Header Refinements */
.site-shell {
  padding-top: 60px !important;
  background: #fff !important;
}

.site-header--black {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 1000 !important;
  height: 60px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 16px !important;
  background: #000 !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.site-header--black .site-header__logo {
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
  height: 100% !important;
  text-decoration: none !important;
}

.site-header--black .site-header__logo img {
  display: block !important;
  width: 118px !important;
  max-width: 38vw !important;
  max-height: 34px !important;
  object-fit: contain !important;
  filter: brightness(0) invert(1) !important;
}

.site-header__quick {
  display: none !important;
}

.site-header__menu-button {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 44px !important;
  color: #fff !important;
  text-decoration: none !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

.site-header__menu-icon {
  display: block !important;
  color: #fff !important;
  font-size: 31px !important;
  line-height: 1 !important;
  transform: translateY(-1px);
}

.site-header__menu-text {
  display: block !important;
  color: #fff !important;
  font-size: 13px !important;
  letter-spacing: .04em !important;
}

.hero--portal {
  display: block !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: #fff !important;
}

.hero--portal .hero-main-visual {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  line-height: 0 !important;
  overflow: hidden !important;
}

.hero--portal .hero-main-visual picture,
.hero--portal .hero-main-visual img {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
}

.hero--portal .hero-main-visual img {
  aspect-ratio: 1920 / 640 !important;
  height: auto !important;
  max-height: 640px !important;
  object-fit: cover !important;
  object-position: center !important;
}

.hero-summary {
  width: 100% !important;
  max-width: 980px !important;
  margin: 0 auto !important;
  padding: 22px 16px 26px !important;
  background: #fff !important;
  border: 0 !important;
}

.hero-summary__lead,
.hero-summary > p {
  margin: 0 0 22px !important;
  color: #333 !important;
  font-size: 16px !important;
  line-height: 2 !important;
  font-weight: 500 !important;
  text-align: left !important;
}

.shop-summary-card {
  display: grid !important;
  grid-template-columns: 70px 1fr !important;
  gap: 14px !important;
  align-items: center !important;
  margin: 0 0 22px !important;
  padding: 0 !important;
  background: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
}

.shop-summary-card img {
  width: 70px !important;
  height: 70px !important;
  object-fit: cover !important;
  border: 1px solid #ddd !important;
  background: #fff !important;
}

.shop-summary-card h1 {
  margin: 0 0 4px !important;
  color: #222 !important;
  font-size: 24px !important;
  line-height: 1.25 !important;
  font-weight: 900 !important;
  letter-spacing: .04em !important;
}

.shop-summary-card p {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0 10px !important;
  margin: 0 !important;
  color: #333 !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
  font-weight: 500 !important;
}

.hero-menu-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 2px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
}

.hero-menu-grid a {
  min-height: 46px !important;
  padding: 8px 4px !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  background: #000 !important;
  border: 0 !important;
}

@media (max-width: 768px) {
  .site-shell {
    padding-top: 56px !important;
  }

  .site-header--black {
    height: 56px !important;
    padding: 0 14px !important;
  }

  .site-header--black .site-header__logo img {
    width: 112px !important;
    max-height: 32px !important;
  }

  .site-header__menu-icon {
    font-size: 30px !important;
  }

  .site-header__menu-text {
    font-size: 12px !important;
  }

  .hero--portal .hero-main-visual img {
    aspect-ratio: 1 / 1 !important;
    max-height: none !important;
    object-fit: cover !important;
  }

  .hero-summary {
    padding: 20px 18px 24px !important;
  }

  .hero-summary__lead,
  .hero-summary > p {
    margin-bottom: 24px !important;
    font-size: 16px !important;
    line-height: 2 !important;
  }

  .shop-summary-card {
    grid-template-columns: 64px 1fr !important;
    gap: 14px !important;
  }

  .shop-summary-card img {
    width: 64px !important;
    height: 64px !important;
  }

  .shop-summary-card h1 {
    font-size: 22px !important;
  }

  .shop-summary-card p {
    font-size: 13px !important;
  }

  .hero-menu-grid a {
    min-height: 44px !important;
    font-size: 14px !important;
  }
}

@media (max-width: 380px) {
  .hero-summary {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .hero-menu-grid a {
    font-size: 13px !important;
  }
}


/* 03. Header Logo */
.site-header--black .site-header__logo img {
  width: 132px !important;
  max-width: 42vw !important;
  max-height: 44px !important;
  object-fit: contain !important;
  filter: none !important;
}
.site-footer img {
  width: 150px !important;
  filter: none !important;
}
@media (max-width: 768px) {
  .site-header--black .site-header__logo img {
    width: 126px !important;
    max-height: 42px !important;
  }
}

/* 09. White Background Reset */
html,
body,
.site-shell,
main,
section,
.hero,
.hero--portal,
.hero-summary,
.intro-copy,
.benefits,
.freedom,
.support-section,
.job-info,
.image-copy,
.appeal,
.salary,
.brands,
.heaven-parts,
.faq,
.entry,
.photo-motion,
.hero-main-visual,
.heaven-parts__inner,
.photo-motion__inner,
.support-section__inner {
  background: #fff !important;
}

/* グレーの塗りカードを白背景＋線だけにする */
.intro-copy__inner,
.entry__inner,
.benefit-highlight li,
.support-list div,
.appeal-card,
.salary-card,
.parts-card,
.faq-item,
.freedom-card,
.treatment,
.job-table,
.shop-summary-card,
.hero__visual,
.photo-stack__main,
.photo-stack__sub {
  background: #fff !important;
}

/* 背景画像の薄いグレー演出は使わない */
.hero__bg {
  display: none !important;
}

/* 区切りは背景色ではなく余白と線で見せる */
.intro-copy__inner,
.entry__inner,
.benefit-highlight,
.support-list div,
.freedom-card,
.faq-item,
.parts-card,
.appeal-card,
.salary-card {
  box-shadow: none !important;
}

/* ヘッダー・フッター・固定応募ボタンの黒は維持 */
.site-header--black,
.site-footer,
.fixed-entry a:first-child,
.btn--line,
.btn--dark,
.hero-menu-grid a,
.freedom-card span {
  background: #000 !important;
}



/* 04. Pickup Slider
   native横スクロールは使わず、transformのみで切り替えます。 */
.pickup-slider {
  padding: 0 0 34px !important;
  background: #fff !important;
}

.pickup-slider__inner {
  width: min(100%, 640px);
  margin: 0 auto;
  padding: 0 12px;
  background: #fff !important;
}

.pickup-slider__viewport {
  position: relative;
  width: 100%;
  max-width: 580px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #e5e5e5;
  overflow: hidden;
  touch-action: pan-y;
}

.pickup-slider__track {
  display: flex;
  width: 100%;
  overflow: visible;
  transform: translate3d(0, 0, 0);
  transition: transform 0.32s ease;
  will-change: transform;
}

.pickup-slider__track.is-dragging {
  transition: none;
}

.pickup-slider__slide {
  flex: 0 0 100%;
  width: 100%;
  min-width: 100%;
  line-height: 0;
  background: #fff;
}

.pickup-slider__slide img {
  display: block;
  width: 100%;
  aspect-ratio: 580 / 240;
  height: auto;
  object-fit: cover;
  background: #fff;
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}

.pickup-slider__arrow {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 32px;
  height: 48px;
  padding: 0;
  transform: translateY(-50%);
  border: 0;
  border-radius: 0;
  color: #fff;
  font-size: 34px;
  line-height: 1;
  background: rgba(0, 0, 0, 0.45);
  cursor: pointer;
}

.pickup-slider__arrow--prev { left: 0; }
.pickup-slider__arrow--next { right: 0; }

.pickup-slider__dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 12px;
}

.pickup-slider__dots button {
  width: 7px;
  height: 7px;
  padding: 0;
  border: 1px solid #111;
  border-radius: 50%;
  background: #fff;
}

.pickup-slider__dots button.is-active {
  background: #111;
}

@media (max-width: 640px) {
  .pickup-slider { padding-bottom: 30px !important; }
  .pickup-slider__inner { padding: 0 10px; }
  .pickup-slider__viewport { max-width: none; }
  .pickup-slider__arrow { width: 28px; height: 44px; font-size: 30px; }
}


/* ==============================
   v21: ONDO風 ムービングフォト演出 + 丸MENU
============================== */

.site-header--black {
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
  min-height: 68px !important;
  padding: 10px 18px !important;
  background: #000 !important;
  border-bottom: 0 !important;
}

.site-header--black .site-header__logo img {
  width: 156px !important;
  max-height: 46px !important;
  object-fit: contain !important;
}

.site-header__menu-button {
  width: 62px !important;
  height: 62px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(255,255,255,.85) !important;
  border-radius: 50% !important;
  color: #fff !important;
  text-decoration: none !important;
  background: transparent !important;
  line-height: 1 !important;
}

.site-header__menu-icon {
  display: none !important;
}

.site-header__menu-text {
  display: block !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .14em !important;
}

.motion-gallery {
  position: relative;
  overflow: hidden;
  height: 470px;
  padding: 34px 0 28px;
  background: #fff;
  border-bottom: 1px solid #eee;
}

.motion-gallery::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 120px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255,255,255,0), #fff 84%);
}

.motion-gallery__label {
  position: absolute;
  top: 20px;
  left: 24px;
  z-index: 4;
  margin: 0;
  color: #111;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .18em;
}

.motion-gallery__stage {
  position: relative;
  height: 100%;
  width: 100%;
}

.motion-gallery__row {
  position: absolute;
  left: 0;
  display: flex;
  align-items: flex-start;
  gap: 18px;
  width: max-content;
  will-change: transform;
}

.motion-gallery__row--top {
  top: 54px;
  animation: bitekiMarqueeLeft 34s linear infinite;
}

.motion-gallery__row--bottom {
  top: 240px;
  animation: bitekiMarqueeRight 38s linear infinite;
}

.motion-gallery figure {
  flex: 0 0 auto;
  margin: 0;
  background: #fff;
  box-shadow: 0 14px 34px rgba(0,0,0,.08);
  overflow: hidden;
}

.motion-gallery img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  user-select: none;
  -webkit-user-drag: none;
}

.motion-gallery .is-lg { width: 270px; height: 203px; }
.motion-gallery .is-md { width: 225px; height: 169px; }
.motion-gallery .is-sm { width: 180px; height: 135px; }
.motion-gallery .is-tall { width: 208px; height: 156px; }
.motion-gallery .is-down { margin-top: 54px; }
.motion-gallery .is-up { margin-top: -24px; }
.motion-gallery .is-soft { opacity: .82; }

@keyframes bitekiMarqueeLeft {
  0% { transform: translate3d(0,0,0); }
  100% { transform: translate3d(-50%,0,0); }
}

@keyframes bitekiMarqueeRight {
  0% { transform: translate3d(-50%,0,0); }
  100% { transform: translate3d(0,0,0); }
}

@media (min-width: 769px) {
  .motion-gallery {
    height: 500px;
  }

  .motion-gallery .is-lg { width: 340px; height: 255px; }
  .motion-gallery .is-md { width: 280px; height: 210px; }
  .motion-gallery .is-sm { width: 220px; height: 165px; }
  .motion-gallery .is-tall { width: 250px; height: 188px; }
}

@media (max-width: 560px) {
  .site-header--black {
    min-height: 66px !important;
    padding: 9px 16px !important;
  }

  .site-header--black .site-header__logo img {
    width: 146px !important;
  }

  .site-header__menu-button {
    width: 58px !important;
    height: 58px !important;
  }

  .motion-gallery {
    height: 455px;
    padding-top: 26px;
  }

  .motion-gallery__label {
    left: 18px;
    top: 16px;
    font-size: 11px;
  }

  .motion-gallery__row {
    gap: 14px;
  }

  .motion-gallery__row--top {
    top: 48px;
    animation-duration: 30s;
  }

  .motion-gallery__row--bottom {
    top: 232px;
    animation-duration: 34s;
  }

  .motion-gallery .is-lg { width: 235px; height: 176px; }
  .motion-gallery .is-md { width: 204px; height: 153px; }
  .motion-gallery .is-sm { width: 168px; height: 126px; }
  .motion-gallery .is-tall { width: 190px; height: 143px; }
}

@media (prefers-reduced-motion: reduce) {
  .motion-gallery__row {
    animation: none !important;
  }
}


/* ==============================
   v22: 固定ヘッダー + MENU小型化
============================== */
.site-shell {
  padding-top: 66px !important;
}

.site-header--black {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 1000 !important;
  min-height: 66px !important;
  padding: 8px 18px !important;
  background: #000 !important;
  border-bottom: 0 !important;
}

.site-header--black .site-header__logo img {
  width: 150px !important;
  max-height: 44px !important;
  object-fit: contain !important;
}

.site-header__menu-button {
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.86) !important;
  border-radius: 50% !important;
}

.site-header__menu-text {
  font-size: 9.5px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

@media (max-width: 560px) {
  .site-shell {
    padding-top: 62px !important;
  }

  .site-header--black {
    min-height: 62px !important;
    padding: 7px 16px !important;
  }

  .site-header--black .site-header__logo img {
    width: 142px !important;
    max-height: 40px !important;
  }

  .site-header__menu-button {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
  }

  .site-header__menu-text {
    font-size: 9px !important;
    letter-spacing: .1em !important;
  }
}

/* =========================================================
   v23: APPEAL POINT STORY PANEL
   既存6枚グリッドを廃止し、9枚画像を左右から差し込む見せ方へ
========================================================= */
.appeal--story {
  background: #fff !important;
  overflow: hidden;
}

.appeal--story .section-head {
  margin-bottom: 30px;
}

.story-panel-list {
  position: relative;
  display: grid;
  gap: 24px;
  width: min(100%, 860px);
  margin: 0 auto;
  padding: 4px 0 10px;
}

.story-panel-list::before {
  content: "";
  position: absolute;
  top: 20px;
  bottom: 20px;
  left: 50%;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(0,0,0,.18), transparent);
  transform: translateX(-50%);
  pointer-events: none;
}

.story-panel {
  position: relative;
  width: min(82%, 580px);
  margin: 0;
  padding: 0;
  background: #fff;
  border: 1px solid #111;
  box-shadow: 10px 10px 0 rgba(0,0,0,.08);
  transition:
    opacity .8s ease,
    transform .8s cubic-bezier(.18,.8,.25,1),
    box-shadow .3s ease;
}

.story-panel--left {
  justify-self: start;
  transform: translateX(-54px) rotate(-1.4deg);
}

.story-panel--right {
  justify-self: end;
  transform: translateX(54px) rotate(1.4deg);
}

.story-panel.bt-reveal {
  opacity: 0;
}

.story-panel--left.bt-reveal {
  transform: translateX(-86px) rotate(-3deg);
}

.story-panel--right.bt-reveal {
  transform: translateX(86px) rotate(3deg);
}

.story-panel.is-visible,
.story-panel--left.is-visible,
.story-panel--right.is-visible {
  opacity: 1;
  transform: translateX(0) rotate(0deg);
}

.story-panel img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.story-panel__number {
  position: absolute;
  top: -13px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 74px;
  height: 28px;
  padding: 0 10px;
  color: #fff;
  background: #111;
  border: 1px solid #111;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
}

.story-panel--left .story-panel__number {
  left: 12px;
}

.story-panel--right .story-panel__number {
  right: 12px;
}

.story-panel:nth-child(3n+1) {
  box-shadow: -10px 10px 0 rgba(0,0,0,.06);
}

.story-panel:nth-child(3n+2) {
  margin-top: -2px;
}

.story-panel:nth-child(3n) {
  margin-top: 6px;
}

@media (hover:hover) {
  .story-panel:hover {
    box-shadow: 0 14px 32px rgba(0,0,0,.13);
  }
}

@media (max-width: 760px) {
  .story-panel-list {
    gap: 22px;
    width: 100%;
    padding: 0 2px 8px;
  }

  .story-panel-list::before {
    left: 22px;
    opacity: .55;
  }

  .story-panel {
    width: 88%;
    border-width: 1px;
  }

  .story-panel--left {
    justify-self: start;
  }

  .story-panel--right {
    justify-self: end;
  }
}

@media (max-width: 480px) {
  .appeal--story {
    padding-top: 48px !important;
    padding-bottom: 50px !important;
  }

  .appeal--story .section-head {
    text-align: left;
    margin-bottom: 28px;
  }

  .story-panel-list {
    gap: 20px;
  }

  .story-panel {
    width: 91%;
    box-shadow: 7px 7px 0 rgba(0,0,0,.08);
  }

  .story-panel--left.bt-reveal {
    transform: translateX(-52px) rotate(-2.6deg);
  }

  .story-panel--right.bt-reveal {
    transform: translateX(52px) rotate(2.6deg);
  }

  .story-panel.is-visible,
  .story-panel--left.is-visible,
  .story-panel--right.is-visible {
    transform: translateX(0) rotate(0deg);
  }

  .story-panel__number {
    top: -12px;
    height: 26px;
    min-width: 68px;
    font-size: 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .story-panel,
  .story-panel.bt-reveal,
  .story-panel--left.bt-reveal,
  .story-panel--right.bt-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* =========================================================
   v29: APPEAL POINT VERTICAL SLIDE
   写真を1枚ずつ大きく見せる縦スライド型へ
========================================================= */
.appeal--story {
  background: #fff !important;
}

.appeal--story .section-head {
  text-align: center !important;
  margin: 0 auto 30px !important;
}

.story-panel-list {
  display: grid !important;
  gap: 28px !important;
  width: min(100%, 680px) !important;
  margin: 0 auto !important;
  padding: 2px 0 8px !important;
}

.story-panel-list::before {
  display: none !important;
}

.story-panel,
.story-panel--left,
.story-panel--right {
  justify-self: center !important;
  width: min(100%, 640px) !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid #d8d8d8 !important;
  box-shadow: none !important;
  transform: none !important;
}

.story-panel.bt-reveal,
.story-panel--left.bt-reveal,
.story-panel--right.bt-reveal {
  opacity: 0 !important;
  transform: translate3d(0, 34px, 0) scale(.985) !important;
}

.story-panel.is-visible,
.story-panel--left.is-visible,
.story-panel--right.is-visible {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
}

.story-panel img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
}

.story-panel__number,
.story-panel--left .story-panel__number,
.story-panel--right .story-panel__number {
  top: 12px !important;
  left: 12px !important;
  right: auto !important;
  min-width: 72px !important;
  height: 28px !important;
  color: #fff !important;
  background: rgba(17, 17, 17, .92) !important;
  border: 0 !important;
}

@media (hover:hover) {
  .story-panel:hover {
    box-shadow: 0 14px 32px rgba(0,0,0,.10) !important;
  }
}

@media (max-width: 560px) {
  .appeal--story {
    padding-top: 46px !important;
    padding-bottom: 48px !important;
  }

  .appeal--story .section-head {
    text-align: center !important;
    margin-bottom: 24px !important;
  }

  .story-panel-list {
    gap: 18px !important;
  }

  .story-panel {
    width: 100% !important;
  }

  .story-panel__number {
    top: 10px !important;
    left: 10px !important;
    min-width: 66px !important;
    height: 26px !important;
    font-size: 10px !important;
  }
}

/* =========================================================
   v30: FIRST TIME / FLOW POLISH + APPEAL HORIZONTAL SCROLL
========================================================= */
.first-time__inner,
.flow__inner {
  padding: 28px 18px !important;
  text-align: center !important;
  border: 1px solid #ddd !important;
  background: #f7f7f7 !important;
}

.first-time .section-head,
.flow .section-head {
  max-width: 760px !important;
  margin: 0 auto 24px !important;
  text-align: center !important;
}

.first-time__text,
.flow__text,
.flow__note {
  max-width: 760px !important;
  margin: 0 auto !important;
  text-align: center !important;
  color: #555 !important;
}

.first-time__points {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 8px !important;
  max-width: 880px !important;
  margin: 24px auto 0 !important;
}

.first-time__points div {
  display: grid !important;
  place-items: center !important;
  min-height: 82px !important;
  padding: 16px 10px !important;
  text-align: center !important;
  line-height: 1.55 !important;
  border-color: #d8d8d8 !important;
  background: #fff !important;
}

.first-time__points div::before {
  display: none !important;
}

.flow-list {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: min(100%, 920px) !important;
  margin: 24px auto 0 !important;
}

.flow-step {
  display: grid !important;
  grid-template-columns: 1fr !important;
  place-items: center !important;
  gap: 10px !important;
  min-height: 132px !important;
  padding: 18px 10px !important;
  text-align: center !important;
  border-color: #d8d8d8 !important;
}

.flow-step__number {
  width: 42px !important;
  height: 42px !important;
  margin: 0 auto !important;
  color: #fff !important;
  background: #111 !important;
  border-color: #111 !important;
}

.flow-step p {
  font-size: 14px !important;
  line-height: 1.65 !important;
  text-align: center !important;
}

.flow__note {
  width: min(760px, 100%) !important;
  margin-top: 20px !important;
  padding: 16px 18px !important;
  border-color: #d8d8d8 !important;
  background: #fff !important;
}

.appeal--story {
  overflow: hidden !important;
}

.story-panel-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: min(100%, 980px) !important;
  margin: 0 auto !important;
  padding: 2px 0 8px !important;
}

.story-panel,
.story-panel--left,
.story-panel--right {
  width: 100% !important;
}

.story-panel img {
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
}

@media (max-width: 760px) {
  .first-time__inner,
  .flow__inner {
    padding: 28px 16px !important;
  }

  .first-time__points {
    grid-template-columns: 1fr !important;
    gap: 9px !important;
    max-width: 420px !important;
  }

  .first-time__points div {
    min-height: 54px !important;
    padding: 13px 14px !important;
  }

  .flow-list {
    grid-template-columns: 1fr !important;
    max-width: 420px !important;
  }

  .flow-step {
    min-height: 0 !important;
    padding: 16px 14px !important;
  }

  .story-panel-list {
    display: flex !important;
    gap: 12px !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 -12px !important;
    padding: 2px 12px 18px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .story-panel-list::-webkit-scrollbar {
    display: none !important;
  }

  .story-panel,
  .story-panel--left,
  .story-panel--right {
    flex: 0 0 min(82vw, 330px) !important;
    scroll-snap-align: center !important;
  }
}

@media (max-width: 480px) {
  .first-time__inner,
  .flow__inner {
    padding: 26px 14px !important;
  }

  .first-time__text,
  .flow__text,
  .flow__note {
    font-size: 14px !important;
    line-height: 1.95 !important;
  }

  .story-panel,
  .story-panel--left,
  .story-panel--right {
    flex-basis: 84vw !important;
  }
}

/* =========================================================
   v31: FIRST TIME / FLOW SPACING TUNE
   本文とカード群の間を少し広げて窮屈さを解消
========================================================= */
.first-time .section-head,
.flow .section-head {
  margin-bottom: 34px !important;
}

.first-time__points,
.flow-list {
  margin-top: 34px !important;
}

.flow__note {
  margin-top: 28px !important;
}

@media (max-width: 760px) {
  .first-time .section-head,
  .flow .section-head {
    margin-bottom: 32px !important;
  }

  .first-time__points,
  .flow-list {
    margin-top: 32px !important;
  }

  .flow__note {
    margin-top: 26px !important;
  }
}

@media (max-width: 480px) {
  .first-time .section-head,
  .flow .section-head {
    margin-bottom: 30px !important;
  }

  .first-time__points,
  .flow-list {
    margin-top: 30px !important;
  }
}


/* =========================================================
   v24: LINEボタン色 + 応募ボタン配置調整
   - 固定下部ボタンは3等分
   - LINEはLINEグリーン
   - 応募セクションはLINEを横幅いっぱい、下段に電話/メールを均等配置
========================================================= */
:root {
  --line-green: #06c755;
  --line-green-dark: #05a848;
}

/* 固定下部ボタン：3つを均等サイズへ */
.fixed-entry {
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 1px !important;
}

.fixed-entry a,
.fixed-entry a:first-child {
  min-width: 0 !important;
  width: 100% !important;
}

.fixed-entry a:first-child,
.fixed-entry__line {
  background: var(--line-green) !important;
  border-color: var(--line-green) !important;
  color: #fff !important;
}

.fixed-entry a:first-child:hover,
.fixed-entry__line:hover {
  background: var(--line-green-dark) !important;
  border-color: var(--line-green-dark) !important;
}

/* 応募セクション：LINEを上段フル幅、電話/メールを下段2分割 */
.entry__buttons,
.hero__actions.entry__buttons {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 520px !important;
  margin: 22px auto 0 !important;
}

.entry__buttons .btn {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
}

.entry__buttons .btn--line {
  grid-column: 1 / -1 !important;
  background: var(--line-green) !important;
  border-color: var(--line-green) !important;
  color: #fff !important;
}

.entry__buttons .btn--line:hover {
  background: var(--line-green-dark) !important;
  border-color: var(--line-green-dark) !important;
}

.entry__buttons .btn--ghost,
.entry__buttons .btn--mail {
  color: #111 !important;
  background: #fff !important;
  border-color: #111 !important;
}

/* 念のため、ヒーロー側で同じクラスが使われた場合もLINEは緑にする */
.btn--line {
  background: var(--line-green) !important;
  border-color: var(--line-green) !important;
  color: #fff !important;
}

.btn--line:hover {
  background: var(--line-green-dark) !important;
  border-color: var(--line-green-dark) !important;
}

@media (max-width: 420px) {
  .fixed-entry {
    padding: 6px !important;
  }

  .fixed-entry a {
    min-height: 44px !important;
    font-size: 12px !important;
  }

  .entry__buttons {
    gap: 8px !important;
  }

  .entry__buttons .btn {
    min-height: 46px !important;
    font-size: 13px !important;
  }
}


/* ==============================
   v26 ONDO-style slide menu
============================== */
.site-header--black {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 900 !important;
}
.site-shell {
  padding-top: 86px !important;
}
.site-header__menu-button {
  width: 76px !important;
  height: 76px !important;
  min-width: 76px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  border: 1.5px solid rgba(255,255,255,.86) !important;
  background: transparent !important;
  color: #fff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  cursor: pointer !important;
  appearance: none !important;
}
.site-header__menu-icon { display: none !important; }
.site-header__menu-text {
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: .16em !important;
  line-height: 1 !important;
}
.drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 910;
  background: rgba(0,0,0,.42);
  opacity: 0;
  visibility: hidden;
  transition: opacity .42s ease, visibility .42s ease;
}
.drawer-menu {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 920;
  width: min(72vw, 560px);
  height: 100dvh;
  padding: 42px 38px 34px;
  background: rgba(255,255,255,.94);
  color: #111;
  box-shadow: -18px 0 46px rgba(0,0,0,.16);
  transform: translateX(104%);
  transition: transform .52s cubic-bezier(.22,1,.36,1);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  backdrop-filter: blur(14px);
}
.drawer-menu::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(circle at 20% 20%, rgba(0,0,0,.04), transparent 34%);
}
.drawer-menu > * { position: relative; }
body.drawer-open {
  overflow: hidden;
}
body.drawer-open .drawer-backdrop {
  opacity: 1;
  visibility: visible;
}
body.drawer-open .drawer-menu {
  transform: translateX(0);
}
body.drawer-open .site-shell {
  transform: translateX(-12vw);
  filter: grayscale(.15) brightness(.78);
}
.site-shell {
  transition: transform .52s cubic-bezier(.22,1,.36,1), filter .52s ease;
}
.drawer-menu__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 58px;
}
.drawer-menu__head p {
  margin: 0;
  color: #777;
  font-size: 13px;
  letter-spacing: .32em;
  font-weight: 700;
}
.drawer-menu__close {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  border: 0;
  background: transparent;
  color: #111;
  cursor: pointer;
  padding: 0;
  appearance: none;
}
.drawer-menu__close span {
  width: 42px;
  height: 42px;
  border: 1px solid #bbb;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  line-height: 1;
  font-weight: 300;
}
.drawer-menu__close em {
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .22em;
}
.drawer-menu__nav {
  display: grid;
  margin-bottom: 58px;
  border-top: 1px solid #d8d8d8;
}
.drawer-menu__nav a {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  min-height: 82px;
  text-decoration: none;
  color: #111;
  border-bottom: 1px solid #d8d8d8;
}
.drawer-menu__nav span {
  font-size: clamp(24px, 6vw, 34px);
  font-weight: 500;
  letter-spacing: .28em;
  line-height: 1;
}
.drawer-menu__nav em {
  font-style: normal;
  color: #777;
  font-size: 14px;
  letter-spacing: .18em;
}
.drawer-menu__contact {
  display: grid;
  gap: 12px;
  margin-bottom: 58px;
}
.drawer-menu__contact a {
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-weight: 800;
  letter-spacing: .06em;
}
.drawer-menu__line {
  background: #06c755;
  color: #fff;
}
.drawer-menu__tel {
  border: 1px solid #111;
  color: #111;
  background: #fff;
}
.drawer-menu__brand {
  margin-top: auto;
  color: #666;
}
.drawer-menu__brand img {
  width: 160px;
  display: block;
  margin-bottom: 18px;
}
.drawer-menu__brand p {
  margin: 0;
  font-size: 13px;
  letter-spacing: .18em;
}
@media (max-width: 560px) {
  .site-shell { padding-top: 74px !important; }
  .site-header--black { min-height: 74px !important; padding: 9px 24px !important; }
  .site-header__menu-button {
    width: 62px !important;
    height: 62px !important;
    min-width: 62px !important;
  }
  .site-header__menu-text { font-size: 11px !important; letter-spacing: .16em !important; }
  .drawer-menu {
    width: 72vw;
    padding: 34px 28px 28px;
  }
  body.drawer-open .site-shell { transform: translateX(-22vw); }
  .drawer-menu__head { margin-bottom: 52px; }
  .drawer-menu__close span { width: 38px; height: 38px; font-size: 22px; }
  .drawer-menu__close em { font-size: 10px; }
  .drawer-menu__nav a { min-height: 76px; }
  .drawer-menu__nav span { font-size: 23px; letter-spacing: .22em; }
  .drawer-menu__nav em { font-size: 12px; }
  .drawer-menu__brand img { width: 136px; }
}
@media (max-width: 390px) {
  .drawer-menu { width: 76vw; padding-left: 24px; padding-right: 24px; }
  body.drawer-open .site-shell { transform: translateX(-24vw); }
  .drawer-menu__nav span { font-size: 21px; letter-spacing: .18em; }
}

/* ==============================
   v27 drawer menu fix
   MENUの反応安定化＋丸ボタン小型化
============================== */
.site-header--black {
  z-index: 3000 !important;
  min-height: 72px !important;
  height: 72px !important;
  padding: 8px 24px !important;
}

.site-shell {
  padding-top: 72px !important;
}

.site-header__menu-button {
  position: relative !important;
  z-index: 3002 !important;
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  min-height: 56px !important;
  border-radius: 50% !important;
  border: 1.25px solid rgba(255, 255, 255, .9) !important;
  background: transparent !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  -webkit-tap-highlight-color: transparent !important;
}

.site-header__menu-text {
  font-size: 10px !important;
  letter-spacing: .16em !important;
  line-height: 1 !important;
  color: #fff !important;
}

.drawer-backdrop {
  z-index: 4000 !important;
  pointer-events: none !important;
}

.drawer-menu {
  z-index: 4010 !important;
  pointer-events: auto !important;
}

body.drawer-open .drawer-backdrop {
  pointer-events: auto !important;
}

@media (max-width: 560px) {
  .site-header--black {
    min-height: 72px !important;
    height: 72px !important;
    padding: 8px 24px !important;
  }

  .site-shell {
    padding-top: 72px !important;
  }

  .site-header__menu-button {
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    min-height: 54px !important;
  }

  .site-header__menu-text {
    font-size: 9.5px !important;
    letter-spacing: .15em !important;
  }
}

/* ==============================
   v28 menu light tune
   黒い透かしを削除＋文字サイズを小さく
============================== */
.drawer-backdrop {
  background: transparent !important;
  opacity: 0 !important;
}
body.drawer-open .drawer-backdrop {
  opacity: 1 !important;
  visibility: visible !important;
}
body.drawer-open .site-shell {
  transform: none !important;
  filter: none !important;
}
.drawer-menu {
  width: min(78vw, 520px) !important;
  background: #fff !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: -12px 0 28px rgba(0,0,0,.10) !important;
  padding: 30px 34px 30px !important;
}
.drawer-menu::before {
  display: none !important;
}
.drawer-menu__head {
  margin-bottom: 34px !important;
}
.drawer-menu__head p {
  font-size: 10px !important;
  letter-spacing: .30em !important;
  color: #999 !important;
}
.drawer-menu__close {
  gap: 9px !important;
}
.drawer-menu__close span {
  width: 34px !important;
  height: 34px !important;
  font-size: 20px !important;
  border-color: #aaa !important;
}
.drawer-menu__close em {
  font-size: 9px !important;
  letter-spacing: .24em !important;
}
.drawer-menu__nav {
  margin-bottom: 34px !important;
  border-top-color: #e1e1e1 !important;
}
.drawer-menu__nav a {
  min-height: 58px !important;
  border-bottom-color: #e1e1e1 !important;
}
.drawer-menu__nav span {
  font-size: clamp(17px, 4.6vw, 24px) !important;
  letter-spacing: .20em !important;
  font-weight: 600 !important;
}
.drawer-menu__nav em {
  font-size: 10px !important;
  letter-spacing: .16em !important;
  color: #888 !important;
}
.drawer-menu__contact {
  gap: 10px !important;
  margin-bottom: 34px !important;
}
.drawer-menu__contact a {
  min-height: 44px !important;
  font-size: 13px !important;
}
.drawer-menu__brand img {
  width: 124px !important;
  margin-bottom: 12px !important;
}
.drawer-menu__brand p {
  font-size: 10px !important;
  letter-spacing: .18em !important;
}
.site-header__menu-button {
  width: 50px !important;
  height: 50px !important;
  min-width: 50px !important;
  min-height: 50px !important;
}
.site-header__menu-text {
  font-size: 9px !important;
  letter-spacing: .14em !important;
}

@media (max-width: 560px) {
  .drawer-menu {
    width: 78vw !important;
    padding: 28px 26px 26px !important;
  }
  .drawer-menu__head {
    margin-bottom: 30px !important;
  }
  .drawer-menu__nav a {
    min-height: 56px !important;
  }
  .drawer-menu__nav span {
    font-size: 18px !important;
    letter-spacing: .18em !important;
  }
  .drawer-menu__nav em {
    font-size: 10px !important;
  }
  .site-header__menu-button {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
  }
  .site-header__menu-text {
    font-size: 8.5px !important;
  }
}
@media (max-width: 390px) {
  .drawer-menu {
    width: 80vw !important;
    padding-left: 22px !important;
    padding-right: 22px !important;
  }
  .drawer-menu__nav span {
    font-size: 17px !important;
    letter-spacing: .16em !important;
  }
}


/* 03. Drawer Menu */
.drawer-menu { background:#ffffff !important; }
.drawer-menu::before { display:none !important; }
.drawer-menu__head { margin-bottom: 34px !important; }
.drawer-menu__head p { font-size: 12px !important; letter-spacing: .26em !important; color:#9a9a9a !important; }
.drawer-menu__close span { width: 44px !important; height: 44px !important; font-size: 26px !important; border-color:#bcbcbc !important; color:#444 !important; }
.drawer-menu__close em { font-size: 11px !important; letter-spacing: .24em !important; color:#505050 !important; }
.drawer-menu__nav { gap: 0 !important; }
.drawer-menu__nav a { min-height: 66px !important; padding: 12px 0 !important; border-bottom: 1px solid #d8d8d8 !important; }
.drawer-menu__nav a:first-child { border-top: 1px solid #d8d8d8 !important; }
.drawer-menu__nav span { font-size: 15px !important; font-weight: 500 !important; letter-spacing: .12em !important; color:#5f5f5f !important; line-height:1.5 !important; }
.drawer-menu__nav em { font-size: 12px !important; font-style: normal !important; letter-spacing: .14em !important; color:#9f9f9f !important; }
.drawer-menu__contact { margin-top: 28px !important; }
.drawer-menu__contact a { font-size: 15px !important; }
.drawer-menu__brand { margin-top: 24px !important; opacity:.95 !important; }
.drawer-menu__brand p { font-size: 11px !important; letter-spacing: .18em !important; color:#7e7e7e !important; }
@media (max-width: 640px) {
  .drawer-menu { width: 74vw !important; padding: 22px 20px 24px !important; }
  .drawer-menu__nav a { min-height: 60px !important; }
  .drawer-menu__nav span { font-size: 14px !important; letter-spacing: .1em !important; }
  .drawer-menu__nav em { font-size: 11px !important; }
  .drawer-menu__head { margin-bottom: 28px !important; }
  .drawer-menu__close span { width: 40px !important; height: 40px !important; font-size: 24px !important; }
}


/* 04. Main Visual Tweaks */
.drawer-menu__brand--text-only {
  margin-top: 28px !important;
  text-align: left !important;
}
.drawer-menu__brand--text-only p {
  margin: 0 !important;
  font-size: 11px !important;
  letter-spacing: .2em !important;
  color: #777 !important;
}
.drawer-menu__brand--text-only img {
  display: none !important;
}

/* PC版メインビジュアルは1920×1080画像を使用 */
@media (min-width: 769px) {
  .hero-visual img,
  .hero__visual img,
  .main-visual img,
  .hero-picture img {
    width: 100%;
    height: auto;
    object-fit: cover;
  }
}


/* 03. Drawer Link Adjustment */
html {
  scroll-behavior: smooth;
}

section[id] {
  scroll-margin-top: 94px;
}


/* 03/04. Drawer Link and PC Visual Fix */
html {
  scroll-behavior: smooth;
}

section[id] {
  scroll-margin-top: 96px;
}

/* PC版メインビジュアルをモニター幅に合わせて見切れにくくする */
@media (min-width: 769px) {
  .hero-visual,
  .hero__visual,
  .main-visual,
  .hero-picture,
  .hero__image,
  .hero-media {
    background: #fff !important;
  }

  .hero-visual picture,
  .hero__visual picture,
  .main-visual picture,
  .hero-picture picture {
    display: block;
    width: 100%;
  }

  .hero-visual img,
  .hero__visual img,
  .main-visual img,
  .hero-picture img,
  .hero__image img,
  .hero-media img {
    display: block;
    width: 100% !important;
    height: auto !important;
    max-height: calc(100vh - 92px);
    object-fit: contain !important;
    object-position: center center !important;
    margin: 0 auto;
  }
}


/* 04. PC Main Visual */
@media (min-width: 769px) {
  .hero.hero--portal {
    padding-top: 0 !important;
  }

  .hero-visual,
  .hero__visual,
  .main-visual,
  .hero-picture,
  .hero__image,
  .hero-media,
  .hero-main,
  .hero__mainvisual {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: visible !important;
    background: #fff !important;
  }

  .hero-visual picture,
  .hero__visual picture,
  .main-visual picture,
  .hero-picture picture,
  .hero__image picture,
  .hero-media picture,
  .hero-main picture,
  .hero__mainvisual picture {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: auto !important;
  }

  .hero-visual img,
  .hero__visual img,
  .main-visual img,
  .hero-picture img,
  .hero__image img,
  .hero-media img,
  .hero-main img,
  .hero__mainvisual img,
  img[src*="main-visual-pc-v32.jpg"] {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: none !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: contain !important;
    object-position: center center !important;
    margin: 0 auto !important;
  }
}

/* Large desktop: keep visual inside viewport height when browser is short */
@media (min-width: 1200px) and (max-height: 850px) {
  img[src*="main-visual-pc-v32.jpg"] {
    max-height: calc(100vh - 86px) !important;
    width: auto !important;
    max-width: 100% !important;
  }
}


/* 04. PC Main Visual Rebuild
   PCではメインビジュアルを「切り抜きなしの普通の画像」として表示する */
@media (min-width: 769px) {
  /* ヒーロー周辺の高さ固定・比率固定をリセット */
  .hero,
  .hero--portal,
  .hero-visual,
  .hero__visual,
  .hero-picture,
  .hero-media,
  .main-visual,
  .hero__image,
  .hero-main,
  .hero__mainvisual,
  .pc-visual-rebuild {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: visible !important;
    background: #fff !important;
  }

  .hero--portal {
    display: block !important;
  }

  /* pictureを通常ブロック化 */
  .pc-visual-rebuild,
  .hero picture,
  .hero--portal picture,
  .hero-visual picture,
  .hero__visual picture,
  .hero-picture picture,
  .main-visual picture {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: visible !important;
  }

  /* 画像そのものを横幅100%、高さ自動に固定 */
  .pc-visual-rebuild img,
  .pc-visual-rebuild__img,
  .hero img[src*="main-visual-pc-v32.jpg"],
  img[src*="main-visual-pc-v32.jpg"] {
    display: block !important;
    position: static !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: none !important;
    min-height: 0 !important;
    object-fit: contain !important;
    object-position: center center !important;
    aspect-ratio: auto !important;
    transform: none !important;
    margin: 0 auto !important;
  }

  /* PCではスマホ用の正方形比率や高さ指定を無効化 */
  .hero__main,
  .hero__media,
  .hero__visual-wrap,
  .hero-visual-wrap {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: visible !important;
  }
}

/* 横長モニターでは巨大化しすぎないように任意で中央寄せ */
@media (min-width: 1400px) {
  img[src*="main-visual-pc-v32.jpg"] {
    width: 100% !important;
  }
}


/* 04. PC/Mobile Main Visual Switch */
.main-visual-picture {
  display: block;
  width: 100%;
}

.main-visual-picture img {
  display: block;
  width: 100%;
  height: auto;
}

@media (min-width: 769px) {
  .main-visual-picture {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
    aspect-ratio: auto !important;
    background: #fff !important;
  }

  .main-visual-picture img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center center !important;
    aspect-ratio: 16 / 9 !important;
  }
}

@media (max-width: 768px) {
  .main-visual-picture img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
  }
}


/* 04. PC/SP Main Visual Forced Switch */
.main-visual-switch {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  overflow: visible !important;
  background: #fff !important;
}

.main-visual-switch img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  margin: 0 auto !important;
  transform: none !important;
}

.main-visual-switch__pc {
  display: block !important;
}

.main-visual-switch__sp {
  display: none !important;
}

@media (max-width: 768px) {
  .main-visual-switch__pc {
    display: none !important;
  }

  .main-visual-switch__sp {
    display: block !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
  }
}

@media (min-width: 769px) {
  .main-visual-switch__pc {
    display: block !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
  }

  .main-visual-switch__sp {
    display: none !important;
  }

  /* 親枠側の切り抜き指定をさらに無効化 */
  .hero,
  .hero--portal,
  .hero-visual,
  .hero__visual,
  .hero-picture,
  .hero-media,
  .main-visual,
  .hero__image,
  .hero-main,
  .hero__mainvisual,
  .hero__visual-wrap,
  .hero-visual-wrap {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: visible !important;
  }
}


/* 04. Main Visual Single Display Fix */
/* 既存CSSより後で、PC/SPの表示を強制的に1枚だけにする */
.main-visual-switch {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  overflow: hidden !important;
  background: #fff !important;
}

.main-visual-switch img {
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  margin: 0 auto !important;
}

/* default = smartphone */
.main-visual-switch .main-visual-switch__pc {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

.main-visual-switch .main-visual-switch__sp {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
}

/* smartphone square */
@media screen and (max-width: 768px) {
  .main-visual-switch {
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
  }

  .main-visual-switch .main-visual-switch__pc {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
  }

  .main-visual-switch .main-visual-switch__sp {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }
}

/* desktop wide visual */
@media screen and (min-width: 769px) {
  .main-visual-switch {
    aspect-ratio: auto !important;
    overflow: visible !important;
  }

  .main-visual-switch .main-visual-switch__pc {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: center center !important;
    pointer-events: auto !important;
  }

  .main-visual-switch .main-visual-switch__sp {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }
}


/* 04. Smartphone Main Visual Restore */
.hero-main-visual {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  background: #fff !important;
}

.hero-main-visual .main-visual-switch {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  background: #fff !important;
}

.hero-main-visual .main-visual-switch img {
  max-width: 100% !important;
  margin: 0 auto !important;
  transform: none !important;
}

/* default/sp */
.hero-main-visual .main-visual-switch__pc {
  display: none !important;
}

.hero-main-visual .main-visual-switch__sp {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* PC */
@media screen and (min-width: 769px) {
  .hero-main-visual .main-visual-switch__pc {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: center center !important;
  }

  .hero-main-visual .main-visual-switch__sp {
    display: none !important;
  }
}


/* ==============================
   04. Main Visual Final Reset
   PC/SPの切替と余白をここで最終上書き
============================== */

/* ヒーロー全体の謎の高さ・余白をリセット */
.hero.hero--portal,
.hero--portal,
.hero {
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
  overflow: visible !important;
}

/* メインビジュアル枠は画像の高さだけにする */
#mainVisual.hero-main-visual,
.hero-main-visual#mainVisual {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
  line-height: 0 !important;
  opacity: 1 !important;
  transform: none !important;
}

/* 画像の共通設定 */
#mainVisual img {
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  max-width: 100% !important;
  transform: none !important;
}

/* スマホ初期値：SPだけ表示 */
#mainVisual .main-visual-pc {
  display: none !important;
}

#mainVisual .main-visual-sp {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* PC：PCだけ表示 */
@media screen and (min-width: 769px) {
  #mainVisual .main-visual-pc {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: center center !important;
  }

  #mainVisual .main-visual-sp {
    display: none !important;
  }

  #mainVisual.hero-main-visual,
  .hero-main-visual#mainVisual {
    overflow: visible !important;
  }
}

/* メインビジュアル直後の余白を詰める */
#mainVisual + .hero-summary,
.hero-summary {
  margin-top: 0 !important;
}

@media screen and (min-width: 769px) {
  #mainVisual + .hero-summary,
  .hero-summary {
    padding-top: 28px !important;
  }
}

@media screen and (max-width: 768px) {
  #mainVisual + .hero-summary,
  .hero-summary {
    padding-top: 28px !important;
  }
}

/* 06. Salary / Work Style PC Image Layout */
@media screen and (min-width: 769px) {
  .salary-grid,
  .brand-strip {
    grid-template-columns: 1fr !important;
    width: 100%;
    max-width: 640px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .salary-card--wide {
    grid-row: auto !important;
  }

  .salary-card,
  .brand-strip img {
    width: 100%;
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* 07. Real Contents PC Card Bottom Alignment */
@media screen and (min-width: 981px) {
  .parts-grid {
    align-items: stretch !important;
  }

  .parts-card {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
  }

  .iframe-wrap {
    flex: 1 1 auto !important;
    align-items: stretch !important;
  }

  .iframe-wrap iframe {
    min-height: 100% !important;
  }
}

/* 08. APPEAL POINT final override: mobile horizontal scroll */
@media screen and (max-width: 768px) {
  #appeal .story-panel-list {
    display: flex !important;
    grid-template-columns: none !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    gap: 12px !important;
    width: auto !important;
    max-width: none !important;
    margin-left: -12px !important;
    margin-right: -12px !important;
    padding: 2px 12px 18px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;
  }

  #appeal .story-panel-list::-webkit-scrollbar {
    display: none !important;
  }

  #appeal .story-panel,
  #appeal .story-panel--left,
  #appeal .story-panel--right {
    flex: 0 0 84vw !important;
    width: 84vw !important;
    max-width: 340px !important;
    min-width: 0 !important;
    justify-self: auto !important;
    scroll-snap-align: center !important;
  }

  #appeal .story-panel img {
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
  }
}

@media screen and (min-width: 769px) {
  #appeal .story-panel-list {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* 09. Mobile spacing and FLOW number layout tune */
@media screen and (max-width: 768px) {
  .first-time,
  .flow,
  .entry,
  .job-info {
    padding-top: 34px !important;
    padding-bottom: 34px !important;
  }

  .entry {
    padding-bottom: 24px !important;
  }

  .job-info {
    padding-top: 30px !important;
  }

  .first-time__inner,
  .flow__inner,
  .entry__inner {
    padding: 24px 14px !important;
  }

  .first-time .section-head,
  .flow .section-head {
    margin-bottom: 22px !important;
  }

  .first-time__text {
    max-width: 680px !important;
    text-align: left !important;
    line-height: 1.9 !important;
  }

  .first-time__text p {
    text-align: left !important;
  }

  .first-time__points,
  .flow-list {
    margin-top: 24px !important;
  }

  .first-time__points {
    gap: 8px !important;
  }

  .first-time__points div {
    min-height: 50px !important;
    justify-items: center !important;
  }

  .flow-list {
    gap: 10px !important;
  }

  .flow-step {
    display: grid !important;
    grid-template-columns: 42px 1fr !important;
    place-items: initial !important;
    align-items: center !important;
    gap: 14px !important;
    min-height: 74px !important;
    padding: 14px 16px !important;
    text-align: left !important;
  }

  .flow-step__number {
    width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    color: #111 !important;
    background: #fff !important;
    border: 1px solid #111 !important;
    font-size: 13px !important;
  }

  .flow-step p {
    text-align: left !important;
    line-height: 1.55 !important;
  }

  .flow__note {
    margin-top: 18px !important;
    padding: 14px 16px !important;
    text-align: left !important;
  }

  .flow__note p {
    text-align: left !important;
  }
}

@media screen and (max-width: 420px) {
  .first-time,
  .flow,
  .entry,
  .job-info {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  .first-time__inner,
  .flow__inner,
  .entry__inner {
    padding: 22px 12px !important;
  }

  .flow-step {
    grid-template-columns: 40px 1fr !important;
    gap: 12px !important;
    padding: 13px 14px !important;
  }

  .flow-step__number {
    width: 40px !important;
    height: 40px !important;
  }
}

/* 10. Hide pickup dots and show APPEAL next slide peek */
.pickup-slider__dots {
  display: none !important;
}

@media screen and (max-width: 768px) {
  #appeal .story-panel-list {
    gap: 12px !important;
    margin-left: -14px !important;
    margin-right: -14px !important;
    padding-left: 14px !important;
    padding-right: 42px !important;
  }

  #appeal .story-panel,
  #appeal .story-panel--left,
  #appeal .story-panel--right {
    flex: 0 0 76vw !important;
    width: 76vw !important;
    max-width: 315px !important;
  }
}

@media screen and (max-width: 420px) {
  #appeal .story-panel,
  #appeal .story-panel--left,
  #appeal .story-panel--right {
    flex-basis: 74vw !important;
    width: 74vw !important;
  }
}

/* 11. Mobile vertical rhythm final tune */
@media screen and (max-width: 768px) {
  .intro-copy,
  .first-time,
  .pickup-slider,
  .benefits,
  .freedom,
  .appeal,
  .support-section,
  .salary,
  .brands,
  .faq,
  .flow,
  .heaven-parts,
  .entry,
  .job-info {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }

  .pickup-slider {
    padding-top: 18px !important;
    padding-bottom: 24px !important;
  }

  .section-head,
  .appeal--story .section-head,
  .heaven-parts .section-head {
    margin-bottom: 20px !important;
  }

  .intro-copy__inner,
  .first-time__inner,
  .flow__inner,
  .entry__inner,
  .benefit-highlight {
    padding-top: 22px !important;
    padding-bottom: 22px !important;
  }

  .freedom-grid,
  .support-list,
  .salary-grid,
  .brand-list,
  .faq-list,
  .parts-grid,
  .job-table {
    margin-top: 0 !important;
  }

  #appeal .story-panel-list {
    padding-bottom: 10px !important;
  }
}

@media screen and (max-width: 420px) {
  .intro-copy,
  .first-time,
  .benefits,
  .freedom,
  .appeal,
  .support-section,
  .salary,
  .brands,
  .faq,
  .flow,
  .heaven-parts,
  .entry,
  .job-info {
    padding-top: 26px !important;
    padding-bottom: 26px !important;
  }

  .pickup-slider {
    padding-top: 16px !important;
    padding-bottom: 22px !important;
  }
}

/* 12. FIRST TIME text-to-card breathing room */
@media screen and (max-width: 768px) {
  .first-time__points {
    margin-top: 34px !important;
  }
}

@media screen and (max-width: 420px) {
  .first-time__points {
    margin-top: 32px !important;
  }
}