/* SP修正コメント1 最終上書き。PC表示には影響させません。 */
.hero-sp-intro,.sleeping-arrow,.sleeping-dots{display:none}

/* セクション見出しの共通書体：主見出しは明朝、添え英字はゴシックの標準ウェイト */
.section-heading h2,.guarantee h2,.no-push h2,.final-cta h2{font-family:var(--serif);font-weight:700}
.section-heading .en,.guarantee .en,.no-push .en,.final-cta .en{font-family:var(--sans);font-weight:400}

@media(max-width:900px){
  :root{--sp-content:320px}
  .button:not(.header-cta){width:290px;height:62px;min-height:62px}

  .hero{display:flex;flex-direction:column;background:var(--cream)}
  .hero-sp-intro{display:block;order:1;width:var(--sp-content);margin:0 auto;padding:30px 0 26px;font-size:15px;font-weight:400;line-height:1.75;text-align:left}
  .hero-image{order:2;width:100%;min-height:355px;background-size:auto 120%;background-position:76% 44%}
  .hero-copy{order:3;width:var(--sp-content);min-height:0;margin:0 auto;padding:58px 0 70px;text-align:left}
  .hero-copy .hero-lead{display:none}
  .hero h1{margin-bottom:24px;font-family:var(--serif);font-size:31px;line-height:1.55;text-align:left;white-space:nowrap}
  .hero-copy>p:not(.hero-lead){font-size:15px;line-height:1.8;text-align:left}
  .hero-actions{width:290px;margin:30px auto 0;gap:20px}

  .section-heading,.small-heading,.concerns-layout,.concerns-end,.sleeping-slider,.promise-grid,
  .slider-wrap,.search-heading,.product-search,.category-filters,.guarantee-inner,.category-grid,
  .step-grid,.flow-notes,.faq-list,.no-push-copy>*{width:var(--sp-content);max-width:100%;margin-left:auto;margin-right:auto}
  .section-heading h2{letter-spacing:.02em}

  .concerns-layout{display:grid;grid-template-columns:1fr;max-width:var(--sp-content)}
  .concerns-person{grid-column:1;grid-row:1;width:184px;max-height:235px;margin:0 auto -4px;transform:none}
  .concern-list.left,.concern-list.right{grid-column:1;display:grid;gap:12px;margin:0}
  .concern-list.left{grid-row:2}.concern-list.right{grid-row:3;margin-top:12px}
  .concern-list article,.concern-list.right article{display:grid;width:320px;max-width:100%;height:91px;padding:4px 12px;grid-template-columns:82px 54px minmax(0,1fr);column-gap:4px;border-radius:14px}
  .concern-list article:nth-child(even){transform:translateX(12px)!important}
  .concern-list article:nth-child(odd){transform:translateX(-12px)!important}
  .concern-list img,.concern-list.right img{position:static;grid-column:1;grid-row:1;display:block;width:76px;height:auto;aspect-ratio:1/1;align-self:center;justify-self:start;object-fit:contain}
  .concern-list b,.concern-list.right b{grid-column:2;grid-row:1;align-self:center;justify-self:center;padding:0;text-align:center;font-size:30px}
  .concern-list p,.concern-list.right p{grid-column:3;grid-row:1;align-self:center;padding-left:8px;margin:0;font-size:14px;line-height:1.55}
  .concern-list article::after,.concern-list.right article::after{left:auto;right:64px;top:auto;bottom:-12px;transform:none;border:0;border-left:13px solid transparent;border-top:13px solid #fff}
  .concerns-end{margin-top:48px;font-size:18px;line-height:1.75;text-align:center}

  .sleeping{overflow:hidden}
  .sleeping .section-heading h2{font-size:27px;line-height:1.6}
  .sleeping-slider{position:relative}
  .sleeping-grid{display:flex;width:320px;max-width:none;gap:16px;margin:0;overflow:hidden;scroll-snap-type:x mandatory}
  .sleeping-grid figure{flex:0 0 320px;margin:0;overflow:hidden;background:#efeae3;border-radius:12px;scroll-snap-align:start}
  .sleeping-grid img{width:100%;aspect-ratio:320/260;object-fit:cover;border-radius:12px 12px 0 0}
  .sleeping-grid figcaption{min-height:60px;padding:15px 12px;background:#efeae3;font-size:16px}
  .sleeping-arrow{display:grid;place-items:center;position:absolute;top:118px;z-index:3;width:44px;height:44px;padding:0;border:1px solid #b9d9bb;border-radius:50%;background:#fff;color:var(--green);font-size:29px;line-height:1}
  .sleeping-prev{left:-17px}.sleeping-next{right:-17px}
  .sleeping-dots{display:flex;justify-content:center;gap:10px;margin-top:22px}
  .sleeping-dots i{display:block;width:14px;height:8px;border-radius:9px;background:#ddd6cf}
  .sleeping-dots i.is-active{width:54px;background:var(--green)}

  .promises .section-heading h2{font-size:29px;line-height:1.55}
  .promise-grid article{display:grid;grid-template-columns:72px 1fr;grid-template-rows:auto auto 1fr;column-gap:18px;min-height:0;padding:34px 8px;text-align:left}
  .promise-grid article:first-child{padding-top:12px}
  .promise-grid span{grid-column:1/-1;margin-bottom:12px;font-size:29px;text-align:left}
  .promise-grid img{grid-column:1;grid-row:2/4;width:72px;height:72px;margin:2px 0 0}
  .promise-grid h3{grid-column:2;grid-row:2;margin:0 0 8px;font-size:18px;text-align:left}
  .promise-grid p{grid-column:2;grid-row:3;margin:0;font-size:14px;line-height:1.75;text-align:left}

  .price .section-heading h2{font-size:28px;line-height:1.55}
  .slider-wrap{max-width:var(--sp-content)}
  .slider-arrow{width:44px;height:44px;border-color:#b9d9bb;font-size:28px;line-height:40px}
  .slider-arrow.prev{left:-14px}.slider-arrow.next{right:-14px}
  .product-search::before{left:auto;right:17px}
  .product-search input{padding-right:50px;padding-left:20px}
  .category-filters{grid-template-columns:repeat(5,1fr)}

  .guarantee-inner{align-items:stretch;text-align:left}
  .guarantee .en,.guarantee h2,.guarantee h2+p,.guarantee .condition,.guarantee .note{width:320px;max-width:100%;margin-left:auto;margin-right:auto;text-align:left}
  .guarantee h2{font-size:29px;line-height:1.55}
  .guarantee h2+p{font-size:16px;line-height:1.8;color:var(--green)}
  .guarantee .condition{font-size:16px}
  .guarantee .button{width:290px;margin-left:auto;margin-right:auto}
  .guarantee .note{font-size:13px;line-height:1.7}

  .categories .section-heading h2{font-size:29px}
  .categories .wide{width:290px;height:62px;min-height:62px;line-height:1.45}

  .flow .section-heading>p:not(.en){font-size:28px;line-height:1.55}
  .step-grid{max-width:var(--sp-content)}
  .step-grid b{position:static;display:block;width:max-content;margin:-1px 0 0;padding:6px 20px;background:var(--green);font-size:15px}
  .step-grid article div{padding-top:24px}
  .flow-notes{font-size:14px;text-align:left}

  .no-push-copy{padding-left:0;padding-right:0}
  .no-push h2{font-size:27px;line-height:1.6;white-space:nowrap}
  .no-push-copy>p:not(.en){font-size:16px;line-height:1.8}

  .faq>.button{width:290px;height:62px;min-height:62px}
  .final-cta h2{font-family:var(--serif);font-size:28px;font-weight:700;line-height:1.65}
  .final-cta>p:not(.en){font-family:var(--sans)}
  .final-cta .button{width:290px;height:62px;min-height:62px}
  footer{padding:42px 0;text-align:left}
  footer .logo{display:block;width:132px;margin:0 auto 34px}
  footer nav{width:320px;margin:0 auto 34px;grid-template-columns:1fr 1fr;gap:14px 42px;text-align:left}
  footer small{display:block;width:320px;margin:0 auto;text-align:center}

  html,body{max-width:100%;overflow-x:hidden}
}

/* PC 02カード：指定改行より前に「が」だけ折り返されるのを防ぐ */
@media(min-width:1181px){
  .concern-list.left article:nth-child(2){width:352px}
  .concern-list.left article:nth-child(2) p{white-space:nowrap}
}

/* SP修正コメント2 */
@media(max-width:900px){
  .hero-sp-intro{padding-top:18px;padding-bottom:18px}
  .hero-image{min-height:355px;background-size:auto 105%;background-position:73% 55%}
  .hero-copy{padding-top:48px}

  .concern-list.left article,.concern-list.right article{grid-template-columns:82px 54px minmax(0,1fr)!important}
  .concern-list.left article:nth-child(odd),.concern-list.right article:nth-child(even){transform:translateX(-8px)!important}
  .concern-list.left article:nth-child(even),.concern-list.right article:nth-child(odd){transform:translateX(4px)!important}
  .concern-list.left article img{width:84px;transform:translateX(-4px)}
  .concern-list.left article:nth-child(odd)::after,.concern-list.right article:nth-child(even)::after{left:auto;right:55px;border:0;border-left:13px solid transparent;border-top:13px solid #fff}
  .concern-list.left article:nth-child(even)::after,.concern-list.right article:nth-child(odd)::after{right:auto;left:55px;border:0;border-right:13px solid transparent;border-top:13px solid #fff}
  .concern-list p,.concern-list.right p{padding-left:4px;font-size:14px;white-space:normal}

  .sleeping-grid{overflow:visible}
  .sleeping-slider{overflow:hidden;width:348px;max-width:calc(100vw - 27px);margin-right:0}
  .sleeping-grid figure{flex-basis:282px}
  .sleeping-grid img{aspect-ratio:282/242}
  .sleeping-prev{left:1px}.sleeping-next{right:25px}
  .sleeping-arrow{top:108px;font-size:34px;line-height:1;align-items:center;padding-bottom:4px}
  .sleeping-dots{width:320px;margin-left:0}

  .section-heading .en,.promises .section-heading .en,.price .section-heading .en,.categories .section-heading .en,
  .flow .section-heading .en,.faq .section-heading .en,.final-cta .en{font-weight:400}

  .promise-grid article{grid-template-columns:78px minmax(0,1fr);grid-template-rows:auto auto;column-gap:18px}
  .promise-grid span{grid-column:1;grid-row:1;align-self:center;justify-self:center;margin:0;font-size:29px;text-align:center}
  .promise-grid h3{grid-column:2;grid-row:1;align-self:center;margin:0;font-size:18px;text-align:left}
  .promise-grid img{grid-column:1;grid-row:2;width:78px;height:78px;margin:16px 0 0}
  .promise-grid p{grid-column:2;grid-row:2;margin:16px 0 0;font-size:14px;line-height:1.75;text-align:left}

  .guarantee-inner,.guarantee .en,.guarantee h2,.guarantee h2+p,.guarantee .condition,.guarantee .note{text-align:center}
  .guarantee h2{font-family:var(--sans);font-size:28px;line-height:1.55}
  .guarantee h2+p{line-height:1.7}
  .guarantee .condition{margin-top:0}

  .categories .wide{justify-content:center;text-align:center}
  .categories .wide>span{right:18px}
  .flow .section-heading>p:not(.en){margin-top:4px;margin-bottom:10px}

  .no-push-image{height:350px;background-size:auto 102%;background-position:72% 58%}
  .no-push-copy{padding-left:27.5px;padding-right:27.5px}
  .no-push-copy>*{width:320px!important;max-width:100%;margin-left:auto;margin-right:auto}

  .final-cta h2 .sp-only{display:block!important}
  .final-cta h2 .pc-only{display:none!important}

  footer nav{display:grid;grid-template-columns:1fr;width:320px;gap:13px;text-align:left}
}

/* SP修正コメント3 */
@media(max-width:900px){
  .hero-sp-intro{padding-top:12px;padding-bottom:12px}
  .hero-image{background-size:auto 105%;background-position:92% 58%}

  .concern-list article::after,.concern-list.right article::after{width:30px;height:18px;border:0!important;background:#fff}
  .concern-list.left article:nth-child(odd)::after,.concern-list.right article:nth-child(even)::after{
    left:auto;right:55px;clip-path:polygon(0 0,100% 0,0 100%)
  }
  .concern-list.left article:nth-child(even)::after,.concern-list.right article:nth-child(odd)::after{
    right:auto;left:55px;clip-path:polygon(0 0,100% 0,100% 100%)
  }

  .sleeping-grid{overflow:visible;transition:transform .35s ease;will-change:transform}
  .sleeping-arrow{font-size:38px;line-height:1;padding:0 0 5px}

  .slider-wrap{overflow:visible}
  .slider-arrow{display:grid;place-items:center;font-size:38px;line-height:1;padding:0 0 5px}
  .slider-arrow.prev{left:-18px}.slider-arrow.next{right:-18px}

  .guarantee h2{font-family:var(--serif);font-weight:700}
  .guarantee .en{font-family:var(--sans);font-weight:400}
  .final-cta h2{font-family:var(--serif);font-weight:700}
  .final-cta .en{font-family:var(--sans);font-weight:400}
}

/* SP商品スライダー：320px基準のカードを保ち、右端に次の商品を見せる */
@media(max-width:900px){
  .price{--price-card-width:min(320px,calc(100vw - 55px))}
  .price .slider-wrap{
    width:calc(var(--price-card-width) + 28px);
    max-width:none;
    margin-left:calc((100% - var(--price-card-width))/2);
    margin-right:0;
    overflow:visible;
  }
  .price .product-slider{gap:16px;overflow:visible}
  .price .product-slider .product-card{flex:0 0 var(--price-card-width)}
  .price .slider-arrow.prev{left:-17px}
  .price .slider-arrow.next{left:calc(var(--price-card-width) - 22px);right:auto}
}

/* SPハンバーガーメニュー最終調整 */
@media(max-width:900px){
  .menu-button{position:relative;padding:0}
  .menu-button span{position:absolute;left:11px;width:18px;height:1.5px;margin:0;background:#fff;transform-origin:center;transition:top .25s ease,transform .25s ease,opacity .2s ease}
  .menu-button span:nth-child(1){top:14px}
  .menu-button span:nth-child(2){top:19px}
  .menu-button span:nth-child(3){top:24px}
  .menu-button.is-open span:nth-child(1){top:19px;transform:rotate(45deg)}
  .menu-button.is-open span:nth-child(2){opacity:0}
  .menu-button.is-open span:nth-child(3){top:19px;transform:rotate(-45deg)}

  .mobile-menu{padding:48px 27px 56px}
  .mobile-menu nav a{font-family:var(--sans);font-weight:600}
  .mobile-menu nav a > span{position:relative;flex:0 0 14px;width:14px;height:14px;margin-left:auto;font-size:0;line-height:1}
  .mobile-menu-actions .button > span{position:absolute;right:30px;width:14px;height:14px;margin:0;font-size:0;line-height:1}
  .mobile-menu nav a > span::before,.mobile-menu-actions .button > span::before{
    content:"";position:absolute;left:2px;top:3px;width:7px;height:7px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg)
  }
  .mobile-menu nav a > span{color:var(--green)}
  .mobile-menu-actions .button-outline > span{background:url(../images/arrow2.svg) center/8px 12px no-repeat}
  .mobile-menu-actions .button-outline > span::before{content:none}
  .mobile-menu-actions{display:grid;width:290px;max-width:100%;gap:16px;margin:36px auto 0}
  .mobile-menu-actions .button{position:relative;justify-content:center;width:290px;max-width:100%;height:62px;min-height:62px;margin:0 auto;padding:0 50px;text-align:center}

}
