:root{--ink:#000;--accent:#050f77;--paper:#fff;--muted:#f5f5f5;--font:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",Meiryo,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:18px;-webkit-text-size-adjust:100%}
a{color:inherit;text-decoration:none}
a:hover{opacity:.7}
button,input,textarea{font:inherit}
button,a,input,textarea{touch-action:manipulation}
button{cursor:pointer}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-weight:600}
:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.visually-hidden,.skip-link:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link:focus{position:fixed;top:8px;left:8px;z-index:100;background:white;padding:12px}
.site-header{position:sticky;top:0;height:80px;width:100%;z-index:20;background:white;box-shadow:0 2px 4px #0003}
.header-inner{width:746px;max-width:calc(100% - 40px);height:100%;margin:auto;display:flex;align-items:center}
.brand{display:flex;align-items:center;gap:0;white-space:nowrap;font-size:18px;font-weight:600}
.brand img{width:32px;height:32px;object-fit:contain}
.desktop-nav{display:flex;gap:22px;align-items:center;justify-content:center;width:570px;flex-shrink:0;font-size:14px;font-weight:600}
.menu-toggle{display:none;border:0;background:none;padding:0;width:28px;height:28px}
.menu-toggle span{display:block;width:28px;height:1px;background:#000;margin:0 0 11px}
.menu-toggle span:nth-child(2){width:22px;margin-left:6px}
.menu-toggle span:nth-child(3){width:16px;margin-left:12px;margin-bottom:0}
.mobile-menu{border:0;margin:0;padding:0;width:100vw;max-width:none;height:100dvh;max-height:none;background:#fffffff5;color:#000}
.mobile-menu::backdrop{background:transparent}
.mobile-menu[open]{display:flex;align-items:center;justify-content:center}
.mobile-menu nav{display:flex;flex-direction:column;align-items:center;gap:36px;font-size:20px;letter-spacing:2px;font-weight:600}
.menu-close{position:absolute;right:12px;top:8px;font-size:42px;line-height:1;width:36px;height:44px;border:0;background:transparent;font-weight:300}
body:has(.mobile-menu[open]){overflow:hidden}
.home-section{padding:62px 0 128px;scroll-margin-top:80px}
.section-shell{position:relative;width:840px;max-width:calc(100% - 80px);margin:auto}
.vertical-title{position:absolute;left:0;top:0;writing-mode:vertical-rl;border-right:2px solid #000;padding-right:12px;font-size:22px;line-height:1.4;letter-spacing:1px}
.section-content{width:600px;max-width:calc(100% - 120px);margin-left:120px;padding-top:92px}
.history-section .section-content p{font-size:18px;line-height:1.9;letter-spacing:.1em}
.works-section{padding-top:0}
.works-section .section-content{padding-top:104px}
.service{margin-bottom:70px}
.numbered-heading{position:relative;padding:25px 0 0 30px;min-height:87px}
.numbered-heading::before{content:"";position:absolute;left:0;top:27px;width:40px;height:40px;background:linear-gradient(135deg,#fff 49%,var(--accent) 49%,var(--accent) 51%,#fff 51%)}
.service-number{position:absolute;top:0;left:0;line-height:1.4;font-family:Arial,sans-serif;font-size:28px;color:var(--accent)}
.numbered-heading h2,.numbered-heading h3{position:relative;z-index:1;font-size:32px;line-height:1.93;letter-spacing:.04em}
.service>p{font-size:18px;line-height:1.9;margin-top:16px;margin-bottom:23px;letter-spacing:.06em}
.photo-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.photo-gallery img{width:100%;height:126px;object-fit:cover;border-radius:3px}
.affiliate-products{display:grid;grid-template-columns:1fr 1fr;gap:0;min-height:274px;align-items:start;padding-top:5px}
.affiliate-products a{padding:5px 12px}
.affiliate-products img{width:240px;max-width:100%;height:auto}
.shop-banner{display:block;margin-top:10px}
.shop-banner img{width:100%;height:auto}
.shop-products{display:flex;flex-wrap:wrap;justify-content:center;gap:0;margin:20px auto 0}
.shop-products iframe{border:0;width:280px;max-width:100%;height:370px;display:block}
.service-4>p{font-weight:500;line-height:1.4;padding:10px;margin-bottom:0}
.more-wrap{display:flex;justify-content:flex-end;margin-top:38px}
.more-link{display:inline-block;border:1px solid #000;border-radius:40px;padding:5px 23px;font:italic 14px/1.4 Arial,var(--font);letter-spacing:1px;white-space:normal;text-align:center}
.works-section .service:last-of-type{margin-bottom:0}
.news-section{background:var(--muted);padding-top:38px}
.news-section .section-content{width:700px;max-width:calc(100% - 70px);margin-left:70px;padding-top:102px}
.news-row{display:grid;grid-template-columns:350px 1fr;gap:30px;align-items:center;margin-bottom:16px;color:#333}
.news-row img{width:350px;aspect-ratio:800/419;object-fit:cover}
.news-row p,.news-row time{font-size:16px;line-height:1.4;font-weight:500}
.news-row time{display:block;margin-top:20px}
.company-section .section-content{padding-top:66px}
.company-intro{display:flex;align-items:center;gap:22px}
.company-intro img{width:250px;flex-shrink:0;aspect-ratio:628/876;object-fit:cover}
.company-intro p{font-size:18px;line-height:1.9;letter-spacing:.06em}
.company-facts{display:grid;grid-template-columns:1.6fr 1fr;gap:0 36px;margin:80px 0 0;font-size:14px;line-height:1.9}
.company-facts>div{display:flex;align-items:flex-start;padding-bottom:30px}
.company-facts dt{width:80px;flex-shrink:0;margin-right:16px;white-space:nowrap}
.company-facts dd{margin:0;overflow-wrap:anywhere}
.company-facts .partners{grid-column:1/-1}
.contact-section{width:100%;margin:0;padding:100px 20px 110px;background:#f5f5f5;scroll-margin-top:80px}
.contact-section h2{text-align:center;font-size:32px;line-height:1.4}
.contact-intro{max-width:334px;margin:22px auto 43px;font-size:14px;line-height:1.9}
#contact-form{max-width:560px;margin:auto}
.form-field{margin-bottom:54px}
.form-field label{display:flex;align-items:center;gap:6px;font-size:18px;font-weight:600;margin-bottom:15px;line-height:1.4}
.required{font-size:12px;font-weight:500;color:#fff;background:#050f77;padding:1px 7px;line-height:1.4}
.form-field input,.form-field textarea{display:block;width:100%;min-width:0;background:#fff;border:1px solid #dcdcdc;border-radius:0;padding:15px;font-size:16px;color:#333}
.form-field input{height:62px}
.form-field textarea{height:260px;resize:vertical;line-height:1.6}
.honeypot{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.consent{display:flex;align-items:center;flex-direction:column;gap:25px;font-size:14px}
.consent>a{text-decoration:underline;text-underline-offset:4px}
.consent label{display:flex;align-items:center;gap:8px;color:#333}
.consent input{width:16px;height:16px;accent-color:#000;margin:0}
.submit-button{display:block;width:100%;height:65px;margin:40px auto 0;background:#050f77;color:white;border:0;font-size:24px;font-weight:500}
.submit-button:disabled{opacity:.45;cursor:not-allowed}
.form-status{font-size:14px;line-height:1.7;margin-top:20px;white-space:pre-line}
.form-status[data-state="error"]{color:#a11}
.form-status[data-state="success"]{color:#135631}
#turnstile-container{margin:25px auto 0;max-width:100%}
.site-footer{position:relative;background:#323232;color:#eee;padding:24px 24px 16px}
.site-footer nav{display:flex;justify-content:center;flex-wrap:wrap;gap:48px;font-size:16px;line-height:1.4;font-weight:500}
.footer-logo{display:block;width:30px;margin:8px auto 10px}
.footer-logo img{width:30px;height:auto}
.footer-logo img{filter:invert(1)}
.footer-legal{display:flex;justify-content:center;flex-wrap:wrap;gap:0;font-size:10px;line-height:1.4}
.copyright{position:absolute;right:24px;bottom:16px;text-align:right;font-size:10px;margin:0}
.works-hero{width:calc(100% - 100px);max-width:1180px;height:378px;margin:auto;display:flex;justify-content:center;align-items:center;background:url('/assets/river.webp') center/cover;border-radius:0 0 3px 3px}
.works-hero h1{writing-mode:vertical-rl;background:#000b;color:white;padding:20px 8px;font-size:22px;letter-spacing:2px;line-height:1.4}
.works-detail{width:940px;max-width:calc(100% - 80px);margin:99px auto 140px}
.works-detail .numbered-heading{min-height:70px}
.works-detail .numbered-heading h2{line-height:1.4}
.works-detail .service>p{margin-top:25px;margin-bottom:24px}
.works-detail .service{margin-bottom:80px}
.works-detail .photo-gallery img{height:250px;object-fit:contain}
.works-detail .soap-gallery{grid-template-columns:300px 300px}
.works-detail .soap-gallery img{object-fit:cover}
.works-detail .service-4>p{padding:0;line-height:1.9;font-weight:400}
.works-detail .shop-banner{width:800px;max-width:100%;margin:25px auto 0}
.portal-label{text-align:center;font-size:20px!important;margin-top:40px!important}
.legal-page{max-width:1180px;width:calc(100% - 100px);margin:auto;background:#f8f8f8;padding:38px 70px 80px}
.legal-page h1{text-align:center;font-size:24px;line-height:1.4}
.title-rule{width:30px;height:2px;background:#000;margin:25px auto 88px}
.legal-text{font-size:16px;line-height:1.4;font-weight:500;overflow-wrap:anywhere}
.legal-text p,.legal-text ul{margin-bottom:10px}
.legal-text ul{padding-left:20px}
.legal-text a{text-decoration:underline}
.not-found{text-align:center;min-height:467px;max-width:1180px;width:calc(100% - 100px);margin:0 auto 50px;background:#f5f5f5;padding:100px 20px}
.not-found h1{font-size:36px;line-height:1.4;letter-spacing:1px;color:#323232}
.not-found p{font-size:14px;line-height:1.9;margin:24px 0 32px}
.not-found .more-link{font-style:normal;padding:8px 23px}
@media(max-width:840px){
  .header-inner{max-width:calc(100% - 24px);width:100%}.site-header{height:67px}.desktop-nav{display:none}.menu-toggle{display:block;margin-left:auto}
  .section-shell{max-width:calc(100% - 40px)}.section-content{width:auto;max-width:calc(100% - 80px);margin-left:80px}
  .news-section .section-content{max-width:calc(100% - 60px);margin-left:60px}.news-row{grid-template-columns:1fr 1fr;gap:20px}.news-row img{width:100%}
  .company-intro{gap:20px}.company-intro img{width:40%}.company-intro p{font-size:16px}.company-facts{grid-template-columns:1fr;gap:0}
  .works-detail .photo-gallery img{height:auto;aspect-ratio:1}.works-detail .soap-gallery{grid-template-columns:1fr 1fr}
  .works-hero{width:calc(100% - 40px)}.legal-page{width:calc(100% - 40px);padding:38px 35px 70px}
}
@media(max-width:540px){
  html{scroll-padding-top:85px}.brand{font-size:18px}.brand img{width:32px;height:32px}
  .home-section{padding:35px 0 60px}.section-shell{width:100%;max-width:100%}
  .vertical-title{left:10px;font-size:18px;line-height:1.4;letter-spacing:1px;padding-right:7px;width:34px}
  .section-content{width:auto;max-width:none;margin:0 35px 0 48px;padding-top:113px}
  .history-section .section-content p{font-size:14px;line-height:1.9;letter-spacing:.1em}
  .works-section{padding-top:0}.works-section .vertical-title{left:15px}.works-section .section-content{margin:0 25px 0 28px;padding-top:124px}
  .service{margin-bottom:70px}.numbered-heading{padding:38px 0 0 8px;min-height:72px}
  .service-number{font-size:23px}.numbered-heading::before{width:36px;height:36px;top:28px}
  .numbered-heading h2,.numbered-heading h3{font-size:24px;line-height:1.4;letter-spacing:0}
  .service>p{font-size:18px;margin-top:15px;line-height:1.9;letter-spacing:0}
  .photo-gallery{gap:7px}.photo-gallery img{height:75px}
  .affiliate-products{grid-template-columns:1fr;min-height:0;gap:20px;justify-items:center}.affiliate-products a{padding:5px 0}
  .shop-products{gap:20px}.service-4>p{font-size:16px;line-height:1.6;padding:0}.shop-banner{margin-top:20px}
  .more-wrap{margin-top:35px}.more-link{max-width:100%;font-size:14px;padding:5px 16px}
  .news-section{padding-top:35px;padding-bottom:70px}.news-section .section-content{max-width:none;margin:0 24px;padding-top:116px;width:auto}
  .news-row{grid-template-columns:1fr;gap:14px;margin-bottom:34px}.news-row img{width:100%}.news-row p,.news-row time{font-size:14px}.news-row time{margin-top:12px}
  .company-section .section-content{padding-top:113px;margin:0 25px 0 28px}.company-intro{display:block}.company-intro img{width:70%;max-width:250px;margin:0 auto 26px}.company-intro p{font-size:16px;line-height:1.9}
  .company-facts{margin-top:45px;font-size:14px}.company-facts>div{padding-bottom:22px}.company-facts dt{width:78px;margin-right:14px}
  .contact-section{padding:40px 25px 70px}.contact-section h2{font-size:28px}.contact-intro{margin:22px auto 40px}.form-field label{font-size:16px}.form-field{margin-bottom:35px}.form-field input{height:58px}
  .consent{font-size:13px;gap:20px}.submit-button{font-size:22px}.site-footer{padding:24px 22px 20px}.site-footer nav{gap:20px;font-size:12px}.footer-legal{font-size:10px}.copyright{position:static;text-align:center;margin-top:16px}
  .not-found{width:calc(100% - 30px);padding:80px 20px;min-height:420px}.not-found h1{font-size:28px}
  .works-hero{width:calc(100% - 30px);height:250px}.works-hero h1{font-size:20px}.works-detail{max-width:calc(100% - 50px);margin:65px auto 80px}.works-detail .numbered-heading{min-height:72px}.works-detail .service>p{font-size:16px;margin-top:20px}.works-detail .photo-gallery{gap:6px}.works-detail .service{margin-bottom:60px}.works-detail .photo-gallery img{width:100%}
  .legal-page{width:calc(100% - 30px);padding:38px 20px 60px}.legal-page h1{font-size:22px}.legal-text{font-size:14px;line-height:1.6}.title-rule{margin-bottom:55px}
}
@media(max-width:349px){#turnstile-container{width:300px;max-width:none;margin-left:calc((100% - 300px)/2);margin-right:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}