:root{
  --honey:#E8A33D; --ink:#2E2A25; --sub:#5F574E; --cream:#FBF6EC; --line:#EDE6DA; --deep:#8A5210;
  --font-body:'Noto Sans JP',sans-serif; --font-head:'Zen Maru Gothic',sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:#fff;color:var(--ink);font-family:var(--font-body);line-height:1.8;-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto}
a{color:var(--deep)} a:hover{color:var(--ink)}
.container{max-width:1120px;margin:0 auto;padding:0 24px}
.section{padding:88px 0} .section--cream{background:var(--cream)}
.section > .container{display:flex;flex-direction:column;gap:40px}

/* header */
.site-header{background:#fff;border-bottom:1px solid var(--line)}
.site-header .container{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 32px;padding-top:14px;padding-bottom:14px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.brand img{width:44px;height:auto;display:block}
.brand__text{display:flex;flex-direction:column;line-height:1.2}
.brand__sub{font-size:11px;letter-spacing:.3em;color:var(--sub)}
.brand__name{font-family:var(--font-head);font-size:24px;font-weight:700;letter-spacing:.1em}
.gnav{display:flex;flex-wrap:wrap;gap:4px 28px}
.gnav a{text-decoration:none;font-size:15px;font-weight:500;padding:12px 4px;color:var(--ink);border-bottom:2px solid transparent}
.gnav a[aria-current="page"],.gnav a:hover{border-bottom-color:var(--honey)}

/* headings */
.eyebrow{display:flex;align-items:center;gap:10px;margin:0;font-size:12px;letter-spacing:.3em;color:var(--deep);font-weight:700}
.eyebrow::before{content:"";width:30px;height:21px;flex-shrink:0;background:url("../img/hex-deco.svg") no-repeat center/contain}
.h2-wrap{display:flex;flex-direction:column;gap:8px}
.h2{margin:0;font-family:var(--font-head);font-size:30px;font-weight:700;letter-spacing:.06em;line-height:1.5}
.page-title{background:var(--cream)}
.page-title .container{padding-top:72px;padding-bottom:64px;display:flex;flex-direction:column;gap:14px}
.page-title h1{margin:0;font-family:var(--font-head);font-size:40px;font-weight:700;letter-spacing:.06em;line-height:1.4}
.lead{margin:0;font-size:15px;line-height:1.9;color:var(--sub);max-width:640px}
.text{margin:0;font-size:15px;line-height:2;color:var(--sub)}

/* buttons */
.btns{display:flex;flex-wrap:wrap;gap:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 32px;border-radius:999px;font-weight:700;font-size:15px;text-decoration:none;border:1.5px solid transparent;font-family:inherit;cursor:pointer}
.btn--primary{background:var(--honey);color:var(--ink)} .btn--primary:hover{background:#DB952C;color:var(--ink)}
.btn--outline{border-color:var(--ink);color:var(--ink);background:transparent} .btn--outline:hover{background:var(--ink);color:#fff}

/* hero */
.hero{background:var(--cream);position:relative;overflow:hidden}
.hero__bg{position:absolute;inset:0;width:100%;height:100%}
.hero .container{position:relative;padding-top:96px;padding-bottom:96px;display:flex;flex-wrap:wrap;align-items:center;gap:48px}
.hero__text{flex:1 1 480px;display:flex;flex-direction:column;gap:24px}
.hero__title{margin:0;font-family:var(--font-head);font-size:46px;line-height:1.45;font-weight:700;letter-spacing:.06em}
.hero__desc{margin:0;font-size:16px;line-height:2;color:var(--sub);max-width:560px}
.hero__visual{flex:1 1 320px;display:flex;justify-content:center}
.hero__stage{position:relative;width:400px;max-width:100%;aspect-ratio:400/340}
.hero__mark{position:absolute;left:20%;top:17.6%;width:60%}
.hero__mark img{width:100%;display:block}
.hero__bee{position:absolute;inset:0;width:100%;height:100%;overflow:visible}

/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.card{display:flex;flex-direction:column;gap:14px;padding:32px;border:1px solid var(--line);border-radius:20px;background:#fff}
.card h3{margin:0;font-family:var(--font-head);font-size:22px;font-weight:700}
.card p{margin:0;font-size:15px;line-height:1.9;color:var(--sub)}
.card a{font-size:14px;font-weight:700;margin-top:auto}

.split{display:flex;flex-wrap:wrap;gap:48px}
.split--center{align-items:center}
.split__main{flex:1 1 480px;display:flex;flex-direction:column;gap:20px}
.split__side{flex:0 1 260px;display:flex;justify-content:center}
.split__side img{width:200px}
.col{flex:1 1 440px;display:flex;flex-direction:column;gap:28px}
.col--narrow{flex:1 1 380px}

/* definition table */
.dl{margin:0;border-top:1px solid var(--line)}
.dl__row{display:flex;flex-wrap:wrap;gap:6px 24px;padding:20px 4px;border-bottom:1px solid var(--line)}
.dl dt{flex:0 0 180px;font-weight:700;font-size:15px}
.dl dd{flex:1 1 320px;margin:0;font-size:15px;line-height:1.9}

.list{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.list li{display:flex;flex-wrap:wrap;gap:4px 20px;padding:18px 4px;border-bottom:1px solid var(--line);font-size:15px;line-height:1.8}
.list time{color:var(--sub)}
.list__year{flex:0 0 140px;font-weight:700;color:var(--deep)}
.list__body{flex:1 1 360px}
.note{margin:0;font-size:14px;color:var(--sub)}

/* service */
.service{display:flex;flex-wrap:wrap;gap:24px 48px;padding:48px 0;border-bottom:1px solid var(--line)}
.service:first-child{padding-top:0}
.service__head{flex:1 1 360px;display:flex;flex-direction:column;gap:14px}
.service__head h2{margin:0;font-family:var(--font-head);font-size:26px;font-weight:700}
.service__list{flex:1 1 400px;margin:0;padding:28px 32px;list-style:none;background:var(--cream);border-radius:20px;display:flex;flex-direction:column;gap:10px}
.service__list li{display:flex;gap:10px;font-size:15px;line-height:1.8}
.service__list li::before{content:"⬢";color:var(--honey)}
.flow{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px}
.flow li{display:flex;flex-direction:column;gap:10px;padding:24px;border-radius:16px;background:#fff;border:1px solid var(--line);counter-increment:step}
.flow{counter-reset:step}
.flow li::before{content:"STEP " counter(step);font-family:var(--font-head);font-weight:700;color:var(--deep);font-size:13px;letter-spacing:.2em}
.flow span{font-weight:700;font-size:16px}

/* company */
.message{display:flex;flex-wrap:wrap;gap:40px;align-items:flex-start}
.message__body{flex:1 1 520px;display:flex;flex-direction:column;gap:22px}
.message__body p{margin:0;font-size:15px;line-height:2.1;color:var(--sub)}
.message__body .sign{color:var(--ink);font-weight:700}
.placeholder{border-radius:20px;background:var(--cream);border:1px dashed #CFC6BA;display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--sub)}
.message__photo{flex:0 1 300px;aspect-ratio:3/4}
.access{display:flex;flex-wrap:wrap;gap:32px}
.access__map{flex:2 1 480px;min-height:320px;overflow:hidden;border-radius:20px;background:var(--cream)}
.access__map iframe{width:100%;height:100%;min-height:320px;border:0}
.access__info{flex:1 1 260px;display:flex;flex-direction:column;gap:12px;font-size:15px;line-height:1.9}
.access__info p{margin:0}

/* contact */
.form{max-width:760px;width:100%;display:flex;flex-direction:column;gap:24px}
.field{display:flex;flex-direction:column;gap:10px}
.field label{display:flex;align-items:center;gap:10px;font-weight:700;font-size:15px}
.badge{font-size:12px;font-weight:700;border-radius:4px;padding:2px 8px;line-height:1.6}
.badge--req{color:#fff;background:#A3441F} .badge--opt{color:var(--sub);background:var(--line)}
.field input,.field textarea{font:inherit;font-size:16px;padding:0 16px;border:1px solid #CFC6BA;border-radius:10px;background:#fff;color:var(--ink)}
.field input{min-height:48px}
.field textarea{padding:14px 16px;resize:vertical;min-height:180px}
.field input:focus,.field textarea:focus{outline:2px solid var(--honey);outline-offset:1px;border-color:var(--honey)}
.agree{display:flex;align-items:center;gap:10px;font-size:15px}
.agree input{width:20px;height:20px;accent-color:var(--honey)}
.cf-turnstile{min-height:65px}
.form-errors{margin:0;padding:24px 28px 24px 48px;border-radius:16px;background:#FBEDE7;border:1px solid #E7C3B4;color:#A3441F;font-size:15px;line-height:1.9;font-weight:500;max-width:760px}

/* privacy */
.policy{max-width:800px;display:flex;flex-direction:column;gap:36px}
.policy p{margin:0;font-size:15px;line-height:2}
.policy h2{margin:0 0 12px;font-family:var(--font-head);font-size:20px;font-weight:700}
.policy .signature{font-size:14px;color:var(--sub);text-align:right}

/* cta / footer */
.cta{background:var(--cream)}
.cta .container{padding-top:80px;padding-bottom:80px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:32px}
.cta__text{flex:1 1 420px;display:flex;flex-direction:column;gap:12px}
.cta__text h2{margin:0;font-family:var(--font-head);font-size:28px;font-weight:700;letter-spacing:.06em;line-height:1.5}
.cta__text p{margin:0;font-size:15px;line-height:1.9;color:var(--sub)}
.site-footer{background:var(--ink);color:#E9E2D6}
.site-footer__main{display:flex;flex-wrap:wrap;justify-content:space-between;gap:32px;padding-top:56px;padding-bottom:32px}
.site-footer .brand{color:#FAF6EF}
.site-footer .brand img{width:48px}
.site-footer .brand__sub{color:#CFC6BA}
.site-footer address{font-style:normal;margin:14px 0 0;font-size:13px;line-height:1.9;color:#CFC6BA}
.fnav{display:flex;flex-wrap:wrap;gap:12px 28px;align-content:flex-start}
.fnav a{color:#E9E2D6;text-decoration:none;font-size:14px} .fnav a:hover{color:#fff;text-decoration:underline}
.copyright{border-top:1px solid #4A443D}
.copyright p{margin:0;padding-top:18px;padding-bottom:18px;font-size:12px;color:#CFC6BA}

@media (max-width:640px){
  .section{padding:64px 0}
  .hero .container{padding-top:56px;padding-bottom:56px}
  .hero__title{font-size:32px}
  .page-title h1{font-size:30px}
  .h2{font-size:24px}
  .cta__text h2{font-size:22px}
  .gnav{gap:0 18px}
}
