@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* Henro Light: site-wide custom styles */
#body_wrap:has(.hl-hero) { --hl-indigo: #173B4D; --hl-ink: #2C3A43; --hl-grey: #5E6D77; --hl-sun: #F5A524; --hl-cream: #FFF6EA; --hl-sky: #EAF4FA; --hl-mint: #EDF8F1; --hl-peach: #FFF0EC; color: var(--hl-ink); }
#body_wrap:has(.hl-hero) .p-breadcrumb, #body_wrap:has(.hl-hero) .c-pageTitle { display: none; }
#body_wrap:has(.hl-hero) .l-content { padding-top: 0px; }
#body_wrap:has(.hl-hero) .post_content { margin-top: 0px; }
#body_wrap:has(.hl-hero) .l-header .c-iconBtn { display: none; }
#body_wrap:has(.hl-hero) .post_content h1, #body_wrap:has(.hl-hero) .post_content h2, #body_wrap:has(.hl-hero) .post_content h3 { color: var(--hl-indigo); font-family: "Avenir Next", Nunito, "Segoe UI", sans-serif; letter-spacing: -0.015em; line-height: 1.25; }
#body_wrap:has(.hl-hero) .post_content h2 { background: transparent; border: 0px; box-shadow: none; font-size: clamp(1.75rem, 3vw, 2.4rem); margin-bottom: 1.2rem; padding: 0px; }
#body_wrap:has(.hl-hero) .post_content h2::before, #body_wrap:has(.hl-hero) .post_content h2::after, #body_wrap:has(.hl-hero) .post_content h3::before, #body_wrap:has(.hl-hero) .post_content h3::after { content: none; }
#body_wrap:has(.hl-hero) .post_content h3 { background: transparent; border: 0px; box-shadow: none; font-size: clamp(1.25rem, 2vw, 1.55rem); margin-bottom: 0.7rem; padding: 0px; }
#body_wrap:has(.hl-hero) .post_content p { line-height: 1.8; }
#body_wrap:has(.hl-hero) .post_content strong { color: var(--hl-indigo); }
#body_wrap:has(.hl-hero) .post_content .wp-block-button__link { background: var(--hl-sun); border-radius: 999px; color: var(--hl-indigo); font-weight: 700; padding: 0.95em 1.6em; text-decoration: none; }
#body_wrap:has(.hl-hero) .post_content .wp-block-button__link:hover { background: rgb(255, 208, 115); color: var(--hl-indigo); }
.hl-hero { background: rgb(255, 255, 255); padding: clamp(3rem, 7vw, 6rem) max(24px, -550px + 50vw); }
.hl-hero > .wp-block-group__inner-container { display: grid; gap: 1rem 3rem; grid-template-columns: minmax(0px, 1fr) minmax(0px, 0.88fr); max-width: 1100px; margin: auto; }
.hl-hero > .wp-block-group__inner-container > :not(.hl-hero-art):not(:last-child) { grid-column: 1; }
.hl-hero > .wp-block-group__inner-container > :last-child { grid-column: 1 / -1; }
.hl-lang { display: flex; gap: 0.4rem; justify-self: end; grid-column: 1 / -1 !important; }
.hl-lang a { border-radius: 999px; color: var(--hl-indigo); font-size: 0.82rem; font-weight: 700; padding: 0.35rem 0.75rem; text-decoration: none; }
.hl-lang a[aria-current="page"] { background: var(--hl-cream); }
.hl-hero-art { align-self: center; grid-area: 2 / 2 / span 4; margin: 0px; }
.hl-hero-art svg { display: block; width: 100%; height: auto; border-radius: 24px; }
.hl-hero { --sky-tint: #EAF4FA; --sun: #F5A524; --indigo: #173B4D; --coral: #F2765B; --sky: #3B9FD8; --cream: #FFF6EA; --sun-ink: #9A5A00; }
.hl-hero .wp-block-heading { font-size: clamp(2.7rem, 4vw, 3.6rem); max-width: 12em; margin: 0.35em 0px 0.55em; line-height: 1.1 !important; }
.hl-hero > .wp-block-group__inner-container > p:first-of-type { display: inline-block; background: var(--hl-cream); border-radius: 999px; color: rgb(154, 90, 0); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.11em; justify-self: start; padding: 0.45rem 0.95rem; text-transform: uppercase; }
.hl-hero .wp-block-heading + p { font-size: clamp(1.1rem, 1.5vw, 1.35rem); max-width: 42em; }
.hl-hero .wp-block-buttons + p { color: var(--hl-grey); font-size: 0.92rem; margin-top: 2rem; max-width: 52em; }
.hl-services, .hl-how-it-works, .hl-features, .hl-launch { margin: 0px auto; padding: 4rem 0px; }
.hl-services .hl-service-grid { align-items: stretch; gap: 1.5rem; }
.hl-service-grid > .wp-block-column { background: var(--hl-cream); border-radius: 16px; padding: clamp(1.4rem, 3vw, 2rem); }
.hl-service-grid > .wp-block-column:nth-child(2) { background: var(--hl-sky); }
.hl-service-card > .wp-block-group__inner-container > p:nth-of-type(1) { background: rgb(255, 255, 255); border-radius: 999px; color: rgb(154, 90, 0); display: inline-block; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.04em; padding: 0.3rem 0.75rem; }
.hl-service-grid > .wp-block-column:nth-child(2) .hl-service-card > .wp-block-group__inner-container > p:nth-of-type(1) { color: rgb(27, 110, 156); }
.hl-service-card p { margin-bottom: 0.8rem; }
.hl-service-card .wp-block-buttons { margin-top: 1.3rem; }
.hl-how-it-works .swell-block-step { display: grid; gap: 1.5rem; grid-template-columns: repeat(3, minmax(0px, 1fr)); }
.hl-how-it-works .swell-block-step__item { background: var(--hl-sky); border-radius: 16px; margin: 0px; padding: 1.5rem; }
.hl-how-it-works .swell-block-step__item:nth-child(2) { background: var(--hl-mint); }
.hl-how-it-works .swell-block-step__item:nth-child(3) { background: var(--hl-peach); }
.hl-how-it-works .swell-block-step__item::before, .hl-how-it-works .swell-block-step__item::after { display: none; }
.hl-how-it-works .swell-block-step__number { background: var(--hl-indigo); }
.hl-how-it-works .swell-block-step__title { color: var(--hl-indigo); }
.hl-feature-columns { gap: 1.25rem; }
.hl-feature-columns > .wp-block-column { background: var(--hl-sky); border-radius: 16px; padding: 1.5rem; }
.hl-feature-columns > .wp-block-column:nth-child(2) { background: var(--hl-mint); }
.hl-feature-columns > .wp-block-column:nth-child(3) { background: var(--hl-peach); }
.hl-founder { background: rgb(23, 59, 77); color: rgb(234, 241, 245); padding: clamp(3.5rem, 7vw, 6rem) max(24px, -550px + 50vw); }
.hl-founder .hl-founder-columns { margin: auto; max-width: 1100px; }
#body_wrap:has(.hl-hero) .hl-founder h2, #body_wrap:has(.hl-hero) .hl-founder p, #body_wrap:has(.hl-hero) .hl-founder strong { color: rgb(255, 255, 255); }
.hl-founder .wp-block-column:first-child p:first-of-type { font-size: clamp(1.5rem, 2.7vw, 2.2rem); font-weight: 700; line-height: 1.5; }
.hl-launch { background: var(--hl-cream); border-radius: 16px; margin: 4rem auto; padding: clamp(1.5rem, 4vw, 3rem); }
html[lang="ja"] #body_wrap:has(.hl-hero) .post_content h1, html[lang="ja"] #body_wrap:has(.hl-hero) .post_content h2, html[lang="ja"] #body_wrap:has(.hl-hero) .post_content h3 { font-family: "Hiragino Maru Gothic ProN", "Noto Sans JP", sans-serif; letter-spacing: 0.01em; line-height: 1.45; }
html[lang="ja"] #body_wrap:has(.hl-hero) .post_content p { line-height: 1.9; }
@media (max-width: 900px) {
  .hl-hero { padding: 3rem 22px; }
  .hl-hero > .wp-block-group__inner-container { display: block; }
  .hl-lang { justify-content: flex-end; margin-bottom: 2rem; }
  .hl-hero-art { margin: 2rem 0px; }
  .hl-hero .wp-block-heading { font-size: clamp(2.1rem, 8vw, 3rem); }
  .hl-how-it-works .swell-block-step { grid-template-columns: 1fr; }
  .hl-service-grid, .hl-feature-columns { flex-direction: column; gap: 1rem; }
  .hl-service-grid > .wp-block-column, .hl-feature-columns > .wp-block-column { flex-basis: auto !important; width: 100%; }
  .hl-services, .hl-how-it-works, .hl-features { padding: 3rem 0px; }
  .hl-founder { padding: 3rem 22px; }
  .hl-launch { margin: 3rem auto; }
}

/* Henro Light: long-term storage pages */
.hl-storage{color:#243026}.hl-storage>.wp-block-group{margin-top:0}.hl-storage__hero{padding:clamp(3.5rem,8vw,6.5rem) 1.25rem 3.5rem;background:linear-gradient(135deg,#f6f1e7 0%,#eef3e8 100%);border-radius:0 0 2rem 2rem}.hl-storage__hero h1{max-width:18ch;margin:.45rem 0 1.25rem;font-size:clamp(2.35rem,6vw,4.6rem);line-height:1.05;letter-spacing:-.035em;color:#28372b}.hl-storage__lead{max-width:49rem;font-size:clamp(1.06rem,2vw,1.3rem);line-height:1.8}.hl-kicker{margin:0 0 .5rem;color:#9b5f21;font-size:.78rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.hl-status{max-width:53rem;margin:1.5rem 0;padding:1rem 1.2rem;background:rgba(255,255,255,.76);border-left:4px solid #d78a35;border-radius:.35rem;line-height:1.7}.hl-storage .wp-block-button__link{border-radius:999px;font-weight:700}.hl-storage__facts{margin-top:-1.25rem;padding:0 1.25rem;position:relative;z-index:2}.hl-storage__facts .wp-block-columns{gap:1px;overflow:hidden;background:#dfe5dc;border:1px solid #dfe5dc;border-radius:1rem;box-shadow:0 12px 35px rgba(42,56,44,.08)}.hl-storage__facts .wp-block-column{margin:0;padding:1.4rem 1.2rem;background:#fff}.hl-storage__facts p{margin:.25rem 0 0}.hl-fact__value{color:#355a3b;font-size:1.2rem;font-weight:800}.hl-storage__section{padding:clamp(3.5rem,7vw,6rem) 1.25rem}.hl-storage__section h2{margin-top:0;color:#2d4932;font-size:clamp(1.8rem,4vw,2.8rem);line-height:1.2}.hl-storage__section h3{margin:.15rem 0 .35rem;font-size:1.18rem}.hl-storage__section li{margin:.55rem 0;line-height:1.7}.hl-storage__section--tint{background:#f4f6f0}.hl-steps{display:grid;gap:.9rem;margin-top:2rem}.hl-step{display:grid;grid-template-columns:3rem 1fr;gap:1rem;align-items:start;padding:1.25rem;background:#fff;border:1px solid #dfe5dc;border-radius:.85rem;box-shadow:0 8px 24px rgba(42,56,44,.05)}.hl-step__number{display:grid;width:2.55rem;height:2.55rem;margin:0;place-items:center;border-radius:50%;background:#426b48;color:#fff;font-weight:800}.hl-step p:last-child{margin-bottom:0}.hl-note{padding:1.15rem 1.25rem;background:#fff7e9;border:1px solid #efd2a6;border-radius:.75rem}.hl-storage__section--open{background:#263d2d;color:#f7f5ef}.hl-storage__section--open h2,.hl-storage__section--open .hl-kicker{color:#fff}.hl-storage__faq details{margin:.75rem 0;padding:1rem 1.15rem;border:1px solid #dfe5dc;border-radius:.7rem;background:#fff}.hl-storage__faq summary{color:#2d4932;font-weight:750;cursor:pointer}.hl-storage__cta{padding:clamp(3.5rem,7vw,5rem) 1.25rem;text-align:center;background:#e9c985}.hl-storage__cta h2{margin-top:0;color:#293a2c}.hl-storage__cta .wp-block-buttons{justify-content:center}@media(max-width:781px){.hl-storage__facts .wp-block-column{flex-basis:100%!important}.hl-storage__section{padding-block:3.5rem}}#body_wrap:has(.hl-storage) .p-breadcrumb,#body_wrap:has(.hl-storage) .c-pageTitle{display:none}#body_wrap:has(.hl-storage) .l-content{padding-top:0}#body_wrap:has(.hl-storage) .post_content{margin-top:0}#body_wrap:has(.hl-storage) .post_content h2,#body_wrap:has(.hl-storage) .post_content h3{background:transparent;border:0;box-shadow:none;padding:0}#body_wrap:has(.hl-storage) .post_content h2:before,#body_wrap:has(.hl-storage) .post_content h2:after,#body_wrap:has(.hl-storage) .post_content h3:before,#body_wrap:has(.hl-storage) .post_content h3:after{display:none}

/* Japanese typography overrides */
html[lang="ja"] .hl-storage__hero h1{line-height:1.35;letter-spacing:.01em}html[lang="ja"] .hl-storage__lead{line-height:1.9}html[lang="ja"] .hl-kicker{letter-spacing:.12em;text-transform:none}html[lang="ja"] .hl-status{line-height:1.8}html[lang="ja"] .hl-storage__section h2{line-height:1.45}html[lang="ja"] .hl-storage__section p,html[lang="ja"] .hl-storage__section li{line-height:1.9}

/* ヒーローのキャッチコピーを見出しタグから段落へ変えたぶん（2026-10-09） */
.hl-hero .hl-hero__title { color: var(--hl-indigo); font-family: "Avenir Next", Nunito, "Segoe UI", sans-serif; font-weight: 700; letter-spacing: -0.015em; font-size: clamp(2.7rem, 4vw, 3.6rem); max-width: 12em; margin: 0.35em 0 0.55em; line-height: 1.1 !important; }
html[lang="ja"] .hl-hero .hl-hero__title { font-family: "Hiragino Maru Gothic ProN", "Noto Sans JP", sans-serif; letter-spacing: 0.01em; }
.hl-hero .hl-hero__title + p { font-size: clamp(1.1rem, 1.5vw, 1.35rem); max-width: 42em; }
@media (max-width: 900px) { .hl-hero .hl-hero__title { font-size: clamp(2.1rem, 8vw, 3rem); } }
.hl-storage__hero .hl-storage__title { max-width: 18ch; margin: .45rem 0 1.25rem; font-size: clamp(2.35rem, 6vw, 4.6rem); font-weight: 700; line-height: 1.05; letter-spacing: -.035em; color: #28372b; }
.hl-storage__tagline { max-width: 40rem; margin: -.35rem 0 1rem; color: #355a3b; font-size: clamp(1.2rem, 2.4vw, 1.6rem); font-weight: 800; line-height: 1.5; }
html[lang="ja"] .hl-storage__hero .hl-storage__title { line-height: 1.35; letter-spacing: .01em; }
/* 長期保管ページでは本文ヒーローの見出しを表示し、テーマ側の重複タイトルは描画しない */
#body_wrap:has(.hl-storage) .c-pageTitle { display: none; }

/* Henro Light：ヘッダーのブランドマーク */
.c-headLogo.-txt .c-headLogo__link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.c-headLogo.-txt .c-headLogo__link::before {
  content: "";
  display: block;
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  background: url("./assets/img/brand-mark.svg") center / contain no-repeat;
}

@media (max-width: 959px) {
  .c-headLogo.-txt .c-headLogo__link {
    gap: 7px;
  }

  .c-headLogo.-txt .c-headLogo__link::before {
    width: 30px;
    height: 30px;
  }
}

/* Long-term storage page titles: one H1, two visual lines (2026-10-15) */
.hl-storage__hero h1.hl-page-title { max-width: 24ch; }
.hl-page-title__context,
.hl-page-title__main { display: block; }
.hl-page-title__context {
  margin-bottom: .55rem;
  color: #9b5f21;
  font-size: clamp(.95rem, 1.6vw, 1.15rem);
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: .08em;
}
.hl-page-title__main {
  color: #28372b;
  font-size: clamp(2rem, 4.5vw, 3.4rem);
  line-height: 1.12;
  letter-spacing: -.025em;
}
html[lang="ja"] .hl-page-title__context { line-height: 1.5; letter-spacing: .06em; }
html[lang="ja"] .hl-page-title__main { line-height: 1.35; letter-spacing: .01em; }

/* 長期保管「ご利用の流れ」：誰がするかのタグ（2026-10-21）
   見出しの文字（目次・検索向けの見出し）に入れないよう、CSS で付ける */
#body_wrap:has(.hl-storage) .post_content .hl-step--you .swell-block-step__title::before,
#body_wrap:has(.hl-storage) .post_content .hl-step--hl .swell-block-step__title::before {
  display: block;
  position: static;
  width: fit-content;
  height: auto;
  margin: 0 0 .4rem;
  padding: .15em .7em;
  border: 0;
  border-radius: 999px;
  transform: none;
  background: #EAF4FA;
  color: #1B6E9C;
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#body_wrap:has(.hl-storage) .post_content .hl-step--you .swell-block-step__title::before { content: "You"; }
html[lang="ja"] #body_wrap:has(.hl-storage) .post_content .hl-step--you .swell-block-step__title::before { content: "お客様"; letter-spacing: .06em; }
#body_wrap:has(.hl-storage) .post_content .hl-step--hl .swell-block-step__title::before {
  content: "Henro Light";
  background: #FFF6EA;
  color: #9A5A00;
  text-transform: none;
}