*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
--sky-50:#eefcff;
--sky-100:#d8f5ff;
--sky-200:#b4ebff;
--sky-300:#84ddff;
--sky-400:#4ecdf5;
--sky-500:#5391a6;
--sky-600:#5391a6;
--sky-700:#5391a6;
--sky-800:#116586;
--sky-900:#0f526d;
--sky-950:#0b3548;
--accent:#90c569;
--accent-hover:#90c569;
--text-primary:#1e293b;
--text-secondary:#475569;
--text-light:#64748b;
--white:#ffffff;
--gray-50:#f8fafc;
--gray-100:#f1f5f9;
--gray-200:#e2e8f0;
--gray-800:#1e293b;
--radius:12px;
--radius-lg:20px;
--shadow-sm:0 1px 3px rgba(0,0,0,.08);
--shadow-md:0 4px 20px rgba(0,0,0,.08);
--shadow-lg:0 10px 40px rgba(0,0,0,.1);
--font-jp:'Noto Sans JP',sans-serif;
--font-en:'Montserrat','Noto Sans JP',sans-serif;
}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font-jp);color:var(--text-primary);line-height:1.8;background:var(--white);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit}
.container{max-width:1080px;margin:0 auto;padding:0 20px}

.header{
background:var(--white);
border-bottom:1px solid var(--gray-200);
padding:12px 0;
position:sticky;top:0;z-index:100;
}
.header-inner{display:flex;align-items:center;justify-content:space-between;max-width:1080px;margin:0 auto;padding:0 20px}
.header-logo{display:inline-flex;align-items:center}
.header-logo-image{width:210px;height:auto}
.line-icon{
width:20px;
height:20px;
object-fit:contain;
display:block;
flex-shrink:0;
position:relative;
top:1px;
}
.sp-break{display:none}
.sp400-break{display:none}
.header-right{display:flex;align-items:center;gap:16px}
.header-hours-wrap{display:flex;align-items:center;gap:6px}
.header-hours-label{
font-size:.7rem;
font-weight:700;
line-height:1.1;
color:#111;
text-align:center;
border:1px solid #111;
padding:4px 6px;
border-radius:4px;
background:var(--white);
}
.header-hours{font-size:.78rem;font-weight:700;color:#111;white-space:nowrap}
.header-tel{
font-family:var(--font-en);font-size:1.1rem;font-weight:700;color:var(--sky-700);
display:flex;align-items:center;gap:6px;position:relative;padding-top:14px;
}
.header-tel-note{
position:absolute;top:-2px;left:10px;
font-size:.62rem;font-weight:500;font-family:var(--font-jp);color:var(--text-light);
white-space:nowrap;line-height:1;
}
.header-tel svg{width:18px;height:18px;fill:var(--sky-700)}
.header-cta{
background:var(--accent);color:var(--white);
padding:10px 24px;border-radius:50px;
font-size:.85rem;font-weight:700;
border:2px solid transparent;
box-shadow:6px 6px 0 rgba(0,0,0,.28);
transition:all .2s ease;
display:flex;align-items:center;gap:6px;
}
.header-cta:hover{
background:var(--accent-hover);
border-color:#4f7c2e;
transform:translate(4px,4px);
box-shadow:2px 2px 0 rgba(0,0,0,.2);
}
.header-cta svg{width:18px;height:18px;fill:var(--white)}

.line-wave-btn{
position:relative;
overflow:visible;
isolation:isolate;
transform-origin:center;
animation:none;
}
.line-wave-btn::before,
.line-wave-btn::after{
content:none;
position:absolute;
inset:0;
border-radius:999px;
background:#bfeec9;
z-index:-10;
pointer-events:none;
transform:translate3d(0,0,0);
opacity:0;
}

.line-wave-btn .line-icon{
width:24px;
height:24px;
position:static;
top:auto;
align-self:center;
}
.hero-cta-group .line-wave-btn{
animation:lineBeat 1.8s ease-in-out infinite;
}
.hero-cta-group .line-wave-btn:hover,
.hero-cta-group .line-wave-btn:active{
animation-play-state:paused;
}
.header-cta.line-wave-btn{
padding:12px 28px;
font-size:.9rem;
}
.hero-cta-group .btn-secondary.line-wave-btn{
padding:14px 24px;
font-size:.98rem;
}
.cta-buttons .btn-primary.line-wave-btn{
padding:20px 50px;
font-size:1.16rem;
}
.floating-cta .f-line.line-wave-btn{
padding:13px 14px;
font-size:.9rem;
}

@keyframes lineBeat{
0%,42%,100%{transform:scale(1)}
12%{transform:scale(1.06)}
22%{transform:scale(.98)}
30%{transform:scale(1.04)}
}

@media(max-width:640px){
.header-logo-image{width:160px}
.header-hours-wrap{display:none}
.header-tel{display:none}
.header-cta{padding:8px 18px;font-size:.8rem}
}
@media (min-width:641px) and (max-width:960px){
.header-hours-wrap{display:none}
.header-tel{
font-size:.98rem;
padding-top:14px;
}
.header-tel-note{
font-size:0;
left:24px;
top:-1px;
color:#111;
}
.header-tel-note::before{
content:"営業時間 平日 8:00〜18:00";
font-size:.58rem;
font-weight:700;
font-family:var(--font-jp);
line-height:1;
white-space:nowrap;
}
.header-cta{
padding:8px 16px;
font-size:.76rem;
}
.hero-cta-group{
    margin-top:4px !important;
}
.hero-cta-group .btn-primary,
.hero-cta-group .btn-secondary{
padding:10px 0px;
}
}

.hero{
position:relative;
overflow:hidden;
min-height:680px;
padding:24px 0;
background:var(--sky-100);
}
.hero-bg{
position:absolute;
inset:0;
display:grid;
grid-template-columns:1fr 1fr;
grid-template-rows:1fr 1fr;
z-index:0;
}
.hero-bg-top-left{
background:
linear-gradient(rgba(10,20,30,.2),rgba(10,20,30,.1)),
url("../images/sink_clean.jpg") center/cover no-repeat;
}
.hero-bg-top-right{
background:
linear-gradient(rgba(10,20,30,.22),rgba(10,20,30,.12)),
url("../images/air-conditioning_clean1.jpg") center/cover no-repeat;
}
.hero-bg-bottom-left{
background:
linear-gradient(rgba(10,20,30,.18),rgba(10,20,30,.12)),
url("../images/toilet_clean1.jpg") center bottom/cover no-repeat;
}
.hero-bg-bottom-right{
background:
linear-gradient(rgba(10,20,30,.2),rgba(10,20,30,.12)),
url("../images/floor_clean.jpg") center/cover no-repeat;
}
.hero::after{
content:'';position:absolute;inset:0;
background:linear-gradient(90deg,rgba(255,255,255,.1) 0%,rgba(255,255,255,0) 55%);
pointer-events:none;
}
.hero-inner{
max-width:1200px;
margin:0 auto;
padding:0 20px;
min-height:632px;
display:flex;
justify-content:center;
align-items:center;
position:relative;
z-index:2;
}
.hero-circle{
width:clamp(400px,56vw,700px);
height:clamp(400px,56vw,700px);
background:rgba(255,255,255,.95);
border:3px solid var(--sky-500);
border-radius:50%;
box-shadow:0 20px 50px rgba(0,0,0,.12);
padding:clamp(20px,3.3vw,46px);
text-align:center;
display:flex;
flex-direction:column;
justify-content:center;
box-sizing:border-box;
}
.hero-kicker{
font-size:clamp(.8rem,1.2vw,1rem);
font-weight:700;
color:var(--sky-700);
letter-spacing:.06em;
margin-bottom:6px;
}
.hero-title{
font-size:clamp(1.5rem,4.2vw,3rem);
font-weight:900;
line-height:1.35;
color:var(--sky-900);
margin-bottom:10px;
letter-spacing:.02em;
}
.hero-sub{
font-size:clamp(.82rem,1.2vw,1rem);
color:var(--text-secondary);
line-height:1.6;
margin-bottom:14px;
}
.hero-achievements{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
column-gap:clamp(8px,1.4vw,14px);
align-items:stretch;
margin-bottom:16px;
width:100%;
}
.hero-achievement{
display:grid;
grid-template-columns:clamp(18px,2.6vw,34px) minmax(0,1fr) clamp(18px,2.6vw,34px);
align-items:center;
justify-items:center;
column-gap:0;
min-width:0;
position:relative;
}
.laurel{width:clamp(20px,2.8vw,36px);height:auto;opacity:.95;flex-shrink:0;position:relative;z-index:1}
.hero-achievement-body{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;text-align:center;position:relative;z-index:2}
.hero-num{
display:block;
font-family:var(--font-en);
font-size:clamp(1.12rem,2.2vw,1.85rem);
font-weight:700;
color:var(--accent-hover);
line-height:1.1;
margin-bottom:2px;
white-space:nowrap;
}
.hero-label{
font-size:clamp(.68rem,1.02vw,.9rem);
font-weight:700;
color:var(--sky-800);
white-space:nowrap;
}
.hero-cta-group{
display:flex;
gap:18px;
flex-direction:column;
align-items:center;
margin-top:26px;
}
.hero-cta-group a{
width:min(100%,320px);
justify-content:center;
}
.hero-cta-group .btn-primary{
background:var(--white);
color:var(--sky-700);
border:2px solid var(--sky-300);
box-shadow:6px 6px 0 rgba(0,0,0,.22);
}
.hero-cta-group .btn-primary svg{fill:var(--sky-600)}
.hero-cta-group .btn-primary:hover{
background:var(--sky-50);
border-color:var(--sky-500);
transform:translate(4px,4px);
box-shadow:2px 2px 0 rgba(0,0,0,.2);
}
.hero-cta-group .btn-secondary{
background:var(--accent);
color:var(--white);
border:2px solid transparent;
box-shadow:6px 6px 0 rgba(0,0,0,.28);
}
.hero-cta-group .btn-secondary svg{fill:var(--white)}
.hero-cta-group .btn-secondary:hover{
background:var(--accent-hover);
border-color:#4f7c2e;
transform:translate(4px,4px);
box-shadow:2px 2px 0 rgba(0,0,0,.2);
}
.btn-primary{
background:var(--accent);color:var(--white);
padding:12px 20px;border-radius:50px;
font-size:.92rem;font-weight:700;
box-shadow:6px 6px 0 rgba(0,0,0,.28);
transition:all .3s;
display:inline-flex;align-items:center;gap:8px;
border:none;cursor:pointer;
}
.btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px);box-shadow:8px 8px 0 rgba(0,0,0,.32)}
.btn-primary svg{width:20px;height:20px;fill:var(--white)}
.btn-secondary{
background:var(--white);color:var(--sky-700);
padding:12px 20px;border-radius:50px;
font-size:.92rem;font-weight:700;
border:2px solid var(--sky-300);
box-shadow:6px 6px 0 rgba(0,0,0,.22);
transition:all .3s;
display:inline-flex;align-items:center;gap:8px;
cursor:pointer;
}
.btn-secondary:hover{background:var(--sky-50);border-color:var(--sky-500);transform:translateY(-2px);box-shadow:8px 8px 0 rgba(0,0,0,.28)}
.btn-secondary svg{width:20px;height:20px;fill:var(--sky-600)}
@media(max-width:900px){
.hero{min-height:620px;padding:20px 0}
.hero-bg{grid-template-columns:1fr 1fr}
.hero-inner{min-height:580px}
.hero-circle{width:clamp(360px,74vw,560px);height:clamp(360px,74vw,560px)}
}
@media(max-width:500px){
.hero{min-height:520px}
.hero-bg{grid-template-columns:1fr 1fr}
.hero-inner{min-height:500px}
.hero-circle{width:clamp(320px,94vw,420px);height:clamp(320px,94vw,420px);padding:16px}
.hero-kicker{font-size:.75rem;margin-bottom:2px}
.hero-title{font-size:1.45rem;line-height:1.25;margin-bottom:6px}
.hero-sub{font-size:.72rem;line-height:1.4;margin-bottom:8px}
.hero-achievements{column-gap:6px;margin-bottom:8px}
.hero-achievement{
grid-template-columns:22px minmax(0,1fr) 22px;
column-gap:0;
}
.laurel{width:24px}
.hero-num{font-size:1.16rem}
.hero-label{font-size:.72rem}
.hero-cta-group{gap:6px}
.btn-primary,.btn-secondary{padding:8px 12px;font-size:.78rem}
.hero-cta-group{flex-direction:column;align-items:stretch}
.btn-primary,.btn-secondary{justify-content:center}
}

.section{padding:80px 0}
.section-alt{background:var(--gray-50)}
.section-sky{background:linear-gradient(135deg,var(--sky-50),var(--sky-100))}
#profile{background:var(--sky-50)}
#menu{background:var(--gray-50)}
.section-title{text-align:center;margin-bottom:48px}
.section-title .en{
font-family:var(--font-en);
font-size:.85rem;font-weight:600;
color:var(--sky-500);
text-transform:uppercase;
letter-spacing:.1em;
display:block;
margin-bottom:8px;
}
.section-title h2{font-size:1.75rem;font-weight:900;color:var(--sky-950);line-height:1.5}
.section-title h2 .accent{color:inherit}
.section-title p{font-size:.95rem;color:var(--text-secondary);margin-top:12px}
@media(max-width:640px){
.section{padding:60px 0}
.section-title h2{font-size:1.35rem}
}

.problems{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:20px;
}
.problem-card{
background:var(--white);
border:1px solid var(--gray-200);
border-radius:var(--radius);
padding:28px 24px;
display:flex;align-items:flex-start;gap:16px;
transition:transform .3s,box-shadow .3s;
}
.problem-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.problem-icon{
width:48px;height:48px;
background:var(--sky-100);
border-radius:50%;
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
font-size:1.4rem;
}
.problem-text{font-size:.95rem;font-weight:500;line-height:1.7}
.problem-text strong{color:var(--sky-700)}

.problem-arrow{text-align:center;margin-top:40px}
.problem-arrow-box{
display:inline-block;
background:var(--sky-600);
color:var(--white);
padding:16px 40px;
border-radius:var(--radius);
font-size:1.1rem;
font-weight:900;
position:relative;
}
.problem-arrow-box::before{
content:'';position:absolute;top:-16px;left:50%;transform:translateX(-50%);
border:10px solid transparent;border-bottom-color:var(--sky-600);
}

.featured-carousel{
display:flex;
align-items:center;
gap:12px;
max-width:1080px;
margin:0 auto;
padding:0 20px;
}
.featured-nav{
width:40px;height:40px;border-radius:50%;
border:1px solid var(--gray-200);
background:var(--white);color:var(--sky-700);
font-size:1rem;font-weight:700;cursor:pointer;
display:flex;align-items:center;justify-content:center;
box-shadow:var(--shadow-sm);
}
.featured-slider-wrap{
overflow:hidden;
padding:0 0 6px;
flex:1;
}
.featured-track{
display:flex;
gap:16px;
padding:0;
transform:translateX(0);
}
.featured-item{
flex:0 0 calc((100% - 16px)/2);
height:auto;
margin:0;
border-radius:0;
overflow:hidden;
box-shadow:none;
}
.featured-item img{
width:100%;
height:auto;
object-fit:contain;
display:block;
}
@media(max-width:640px){
.featured-carousel{gap:8px}
.featured-nav{width:34px;height:34px;font-size:.85rem}
.featured-track{gap:10px}
.featured-item{flex-basis:92%;height:auto}
}
.featured-item img{
-webkit-touch-callout:none;
-webkit-user-select:none;
user-select:none;
}

.image-lightbox{
position:fixed;
inset:0;
background:rgba(0,0,0,.92);
display:none;
align-items:center;
justify-content:center;
z-index:9999;
padding:20px;
}
.image-lightbox.is-open{display:flex}
.image-lightbox .lightbox-img{
width:100%;
height:100%;
max-width:100%;
max-height:100%;
object-fit:contain;
display:block;
}
.lightbox-close{
position:absolute;
top:16px;
left:16px;
background:#fff;
color:#222;
border:none;
border-radius:30px;
padding:10px 20px;
font-size:.95rem;
font-weight:700;
cursor:pointer;
box-shadow:0 4px 12px rgba(0,0,0,.3);
z-index:1;
font-family:inherit;
}
.lightbox-close:hover{background:#f3f3f3}
@media(max-width:640px){
.image-lightbox{padding:12px}
.lightbox-close{top:12px;left:12px;padding:8px 16px;font-size:.9rem}
}

.trust{padding-top:44px;padding-bottom:44px}
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.trust-metric{
background:var(--white);
border:1px solid var(--gray-200);
border-radius:var(--radius);
padding:20px 18px;
box-shadow:var(--shadow-sm);
}
.trust-metric strong{display:block;font-size:1.05rem;color:var(--sky-900);margin-bottom:4px}
.trust-metric span{font-size:.85rem;color:var(--text-secondary);line-height:1.6}
@media(max-width:900px){.trust-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.trust-grid{grid-template-columns:1fr}}

.reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-bottom:40px}
.reason-card{
background:var(--white);
border-radius:var(--radius-lg);
overflow:hidden;
box-shadow:var(--shadow-md);
transition:transform .3s;
}
.reason-card:hover{transform:none}
.reason-img{height:220px;overflow:hidden}
.reason-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.reason-card:hover .reason-img img{transform:none}
.reason-body{padding:28px 24px}
.reason-num{
font-family:var(--font-en);
font-size:.75rem;font-weight:700;
color:var(--sky-500);
text-transform:uppercase;
letter-spacing:.08em;
margin-bottom:8px;
}
.reason-body h3{font-size:1.15rem;font-weight:900;margin-bottom:12px;color:var(--sky-900);line-height:1.5}
.reason-body p{font-size:.9rem;color:var(--text-secondary);line-height:1.8}
@media(max-width:800px){.reasons{grid-template-columns:1fr;max-width:480px;margin-left:auto;margin-right:auto}}

.ba-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ba-card{
background:var(--white);
border:1px solid var(--gray-200);
border-radius:var(--radius-lg);
padding:20px;
box-shadow:var(--shadow-sm);
}
.ba-card h3{font-size:1rem;color:var(--sky-900);margin-bottom:14px}
.ba-images{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ba-images figure{display:flex;flex-direction:column;gap:8px;margin:0}
.ba-images img{width:100%;height:220px;object-fit:cover;border-radius:10px}
.ba-images figcaption{
display:block;
text-align:center;
background:transparent;
color:#111;
font-size:.8rem;
font-weight:800;
line-height:1.2;
letter-spacing:.04em;
}
@media(max-width:900px){.ba-grid{grid-template-columns:1fr}}

.menu-subtitle{
font-size:1.5rem;
font-weight:700;
color:var(--sky-900);
margin:0 0 12px;
}
.price-table-wrap{overflow-x:auto;margin-bottom:32px}
.price-table{
width:100%;border-collapse:collapse;
background:var(--white);
border-radius:var(--radius);
overflow:hidden;
box-shadow:var(--shadow-sm);
}
.price-table thead th{
background:var(--sky-700);color:var(--white);
padding:16px 20px;
font-size:.9rem;font-weight:700;
text-align:left;
}
.price-table tbody td{
padding:16px 20px;
font-size:.9rem;
border-bottom:1px solid var(--gray-200);
vertical-align:top;
line-height:1.7;
}
.price-table th:nth-child(1),.price-table td:nth-child(1){width:62%}
.price-table th:nth-child(2),.price-table td:nth-child(2){width:18%;white-space:nowrap}
.price-table th:nth-child(3),.price-table td:nth-child(3){width:20%;white-space:nowrap}
.price-table tbody tr:nth-child(odd){background:var(--white)}
.price-table tbody tr:nth-child(even){background:var(--sky-50)}
.price-table tbody tr:nth-child(odd):hover{background:var(--white)}
.price-table tbody tr:nth-child(even):hover{background:var(--sky-50)}
.price-table tbody tr:last-child td{border-bottom:none}
.price-table tbody tr:hover{background:inherit}
.price-table .price{
font-family:var(--font-en);
font-weight:700;
color:var(--sky-700);
font-size:1.05rem;
white-space:nowrap;
}
.price-table tr.option-row td{font-size:.85rem;color:var(--text-secondary);padding-top:4px;padding-bottom:4px}
.price-table tr.option-row .price{font-size:.9rem;color:var(--text-secondary)}
.price-table .popular{
background:var(--sky-50);
}
.popular-badge{
display:inline-block;
background:var(--accent);
color:var(--white);
font-size:.65rem;
font-weight:700;
padding:2px 8px;
border-radius:50px;
margin-left:8px;
vertical-align:middle;
}
.price-notes{
display:flex;flex-wrap:wrap;gap:16px;
margin-top:20px;
}
.price-note{
display:flex;align-items:center;gap:8px;
background:var(--white);
padding:12px 20px;
border-radius:50px;
font-size:.85rem;font-weight:500;
color:var(--sky-800);
box-shadow:var(--shadow-sm);
}
.price-note svg{width:20px;height:20px;fill:var(--sky-500);flex-shrink:0}
@media(max-width:640px){
.price-notes{flex-direction:column}
}

.deal-title{margin:-4px 0 16px}
.deal-title h3{font-size:1.5rem;color:var(--sky-900);margin-bottom:4px}
.deal-title p{font-size:.9rem;color:var(--text-secondary)}
.deal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px}
.deal-card{
background:var(--white);
border:1px solid var(--gray-200);
border-radius:var(--radius);
padding:28px 20px 20px;
box-shadow:var(--shadow-sm);
position:relative;
}
.deal-name{font-size:1rem;font-weight:700;color:var(--sky-900);margin-bottom:10px}
.deal-count{font-size:1.45em;font-weight:900;line-height:1;color:inherit}
.deal-meta{font-size:1.05rem;font-weight:700;color:var(--sky-800);margin-bottom:12px}
.deal-list{margin:0 0 14px 1.1rem;padding:0}
.deal-list li{font-size:.85rem;color:var(--text-secondary);line-height:1.7;margin-bottom:4px}
.deal-price{
font-family:var(--font-en);
font-size:1.3rem;
font-weight:700;
color:var(--sky-700);
display:flex;
align-items:center;
gap:8px;
flex-wrap:wrap;
}
.deal-off-badge{
width:54px;
height:54px;
border-radius:50%;
background:#e76363;
border:2px solid #ff1f1f;
color:var(--white);
display:inline-flex;
flex-direction:column;
align-items:center;
justify-content:center;
line-height:1;
flex-shrink:0;
margin-left:12px;
box-shadow:0 3px 8px rgba(120,40,40,.24);
}
.deal-off-badge strong{
font-family:var(--font-en);
font-size:1rem;
font-weight:700;
}
.deal-off-badge small{
font-size:.62rem;
font-weight:700;
letter-spacing:.03em;
margin-top:2px;
}
.deal-card.popular-deal{
background:#f3f9ed;
border:2px solid #90c569;
box-shadow:0 10px 24px rgba(144,197,105,.2);
}
.deal-card.popular-deal .deal-name{color:var(--sky-900)}
.deal-card.popular-deal .popular-badge{
position:absolute;
top:-12px;
left:14px;
margin-left:0;
padding:4px 12px;
background:#90c569;
color:var(--white);
font-size:.72rem;
border-radius:999px;
box-shadow:0 3px 8px rgba(79,124,46,.35);
}
@media(max-width:900px){.deal-grid{grid-template-columns:1fr}}

.flow-steps{position:relative;max-width:720px;margin:0 auto}
.flow-step{
display:flex;gap:24px;align-items:center;
margin-bottom:40px;
position:relative;
}
.flow-step:last-child{margin-bottom:0}
.flow-step::before{
content:'';
position:absolute;
left:28px;top:50%;bottom:-100px;
width:2px;
background:var(--sky-200);
}
.flow-step:last-child::before{display:none}
.flow-num{
width:56px;height:56px;
background:linear-gradient(135deg,var(--sky-500),var(--sky-600));
color:var(--white);
border-radius:50%;
display:flex;align-items:center;justify-content:center;
font-family:var(--font-en);
font-size:1.1rem;font-weight:700;
flex-shrink:0;
position:relative;
z-index:2;
box-shadow:0 4px 12px rgba(34,184,230,.3);
}
.flow-content{
background:var(--white);
border-radius:var(--radius);
padding:24px 28px;
box-shadow:var(--shadow-sm);
flex:1;
border:1px solid var(--gray-200);
}
.flow-content h3{font-size:1.05rem;font-weight:700;margin-bottom:6px;color:var(--sky-900)}
.flow-content p{font-size:.88rem;color:var(--text-secondary);line-height:1.7}
@media(max-width:640px){
.flow-step{gap:16px}
.flow-num{width:44px;height:44px;font-size:.9rem}
.flow-step::before{left:22px;top:50%;bottom:-84px}
.flow-content{padding:20px}
}

.area-section{text-align:center}
.area-cities{
font-size:1.08rem;
font-weight:700;
color:var(--sky-800);
margin:0 0 18px;
line-height:1.8;
}
.area-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-bottom:24px}
.area-badge{
background:var(--white);
border:2px solid var(--sky-300);
color:var(--sky-800);
padding:10px 28px;
border-radius:50px;
font-size:.95rem;
font-weight:700;
}
.area-note{font-size:.9rem;color:var(--text-secondary)}

.target-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.target-card{
background:var(--white);
border-radius:var(--radius);
padding:24px;
border:1px solid var(--gray-200);
box-shadow:var(--shadow-sm);
}
.target-card h3{font-size:1.05rem;color:var(--sky-900);margin-bottom:8px}
.target-card p{font-size:.9rem;color:var(--text-secondary);line-height:1.8}
@media(max-width:900px){.target-grid{grid-template-columns:1fr}}

.profile-card{
max-width:720px;margin:0 auto;
background:var(--white);
border-radius:var(--radius-lg);
padding:40px;
box-shadow:var(--shadow-md);
display:flex;gap:32px;align-items:center;
}
.profile-illust{
width:140px;height:140px;
background:var(--sky-100);
border-radius:50%;
display:flex;align-items:center;justify-content:center;
flex-shrink:0;
overflow:hidden;
}
.profile-illust img{width:100%;height:100%;object-fit:cover}
.profile-info h3{font-size:1.2rem;font-weight:900;margin-bottom:4px;color:var(--sky-900)}
.profile-info .position{font-size:.85rem;color:var(--text-light);margin-bottom:12px}
.profile-info p{font-size:.9rem;color:var(--text-secondary);line-height:1.8}
.profile-info .badge-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.profile-info .badge-item{
background:var(--sky-50);
color:var(--sky-700);
padding:4px 14px;
border-radius:50px;
font-size:.78rem;font-weight:700;
border:1px solid var(--sky-200);
}
@media(max-width:640px){
.profile-card{flex-direction:column;text-align:center;padding:28px 24px}
.profile-illust{width:100px;height:100px}
.profile-info .badge-row{justify-content:center}
}

.faq-list{max-width:720px;margin:0 auto}
.faq-item{
background:var(--white);
border:1px solid var(--gray-200);
border-radius:var(--radius);
margin-bottom:12px;
overflow:hidden;
transition:box-shadow .3s;
}
.faq-item:hover{box-shadow:var(--shadow-sm)}
.faq-q{
padding:20px 24px;
font-size:.95rem;
font-weight:700;
cursor:pointer;
display:flex;
align-items:center;
gap:12px;
user-select:none;
}
.faq-q::before{
content:'Q';
background:var(--sky-600);color:var(--white);
width:32px;height:32px;
border-radius:50%;
display:flex;align-items:center;justify-content:center;
font-family:var(--font-en);font-size:.85rem;font-weight:700;
flex-shrink:0;
}
.faq-q::after{
content:'';
margin-left:auto;
width:12px;height:12px;
border-right:2px solid var(--text-light);
border-bottom:2px solid var(--text-light);
transform:rotate(45deg);
transition:transform .3s;
flex-shrink:0;
}
.faq-item.open .faq-q::after{transform:rotate(-135deg)}
.faq-a{
max-height:0;overflow:hidden;
transition:max-height .4s ease,padding .3s;
}
.faq-item.open .faq-a{max-height:400px}
.faq-a-inner{
padding:0 24px 20px 68px;
font-size:.9rem;
color:var(--text-secondary);
line-height:1.8;
}

.cta-section{
background:linear-gradient(135deg,var(--sky-700),var(--sky-900));
padding:80px 0;
text-align:center;
color:var(--white);
position:relative;
overflow:hidden;
}
.cta-section::before{
content:'';position:absolute;top:-60px;right:-60px;width:300px;height:300px;
background:rgba(255,255,255,.04);border-radius:50%;
}
.cta-section::after{
content:'';position:absolute;bottom:-80px;left:-40px;width:400px;height:400px;
background:rgba(255,255,255,.03);border-radius:50%;
}
.cta-content{position:relative;z-index:2}
.cta-section h2{font-size:1.75rem;font-weight:900;margin-bottom:12px;line-height:1.5}
.cta-section p{font-size:1rem;margin-bottom:32px;opacity:.85;line-height:1.8}
.cta-buttons{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:24px}
.cta-buttons .btn-primary{
font-size:1.1rem;
padding:18px 44px;
border:2px solid transparent;
box-shadow:6px 6px 0 rgba(0,0,0,.28);
transition:all .2s ease;
}
.cta-buttons .btn-primary:hover{
background:var(--accent-hover);
border-color:#4f7c2e;
transform:translate(4px,4px);
box-shadow:2px 2px 0 rgba(0,0,0,.2);
}
.cta-tel{font-family:var(--font-en);font-size:1.5rem;font-weight:700;margin-top:24px;margin-bottom:8px;display:flex;align-items:center;justify-content:center;gap:8px;color:var(--white)}
.cta-tel svg{width:24px;height:24px;fill:var(--white)}
.cta-hours{font-size:.85rem;opacity:.7}
@media(max-width:640px){
.cta-section{padding:60px 0}
.cta-section h2{font-size:1.4rem}
.cta-tel{font-size:1.2rem}
.cta-buttons{flex-direction:column;align-items:center}
}

.footer{
background:var(--gray-800);
color:rgba(255,255,255,.7);
padding:40px 0 100px;
text-align:center;
font-size:.82rem;
}
.footer-name{font-family:var(--font-en);font-size:1rem;font-weight:600;color:var(--white);margin-bottom:4px}
.footer-address{margin-bottom:16px;line-height:1.8}
.footer-copy{font-size:.75rem;opacity:.5}

.floating-cta{
display:none;
position:fixed;bottom:0;left:0;right:0;
background:var(--white);
border-top:1px solid var(--gray-200);
padding:10px 16px;
z-index:200;
box-shadow:0 -4px 20px rgba(0,0,0,.1);
}
.floating-cta-inner{
display:flex;gap:8px;
max-width:480px;margin:0 auto;
}
.floating-cta a{
flex:1;
padding:12px;
border-radius:50px;
font-size:.85rem;
font-weight:700;
text-align:center;
display:flex;align-items:center;justify-content:center;gap:6px;
border:2px solid transparent;
box-shadow:4px 4px 0 rgba(0,0,0,.22);
transition:all .2s ease;
}
.floating-cta .f-line{background:var(--accent);color:var(--white)}
.floating-cta .f-tel{background:var(--sky-600);color:var(--white)}
.floating-cta a svg{width:18px;height:18px;fill:var(--white)}
.floating-cta .f-line:hover,.floating-cta .f-line:active{
transform:translate(3px,3px);
box-shadow:1px 1px 0 rgba(0,0,0,.16);
border-color:#4f7c2e;
}
.floating-cta .f-tel:hover,.floating-cta .f-tel:active{
transform:translate(3px,3px);
box-shadow:1px 1px 0 rgba(0,0,0,.16);
border-color:#3d6f7f;
}
@media(max-width:800px){.floating-cta{display:block}}

.fade-in{opacity:0;transform:translateY(24px);transition:opacity .7s,transform .7s}
.fade-in.visible{opacity:1;transform:translateY(0)}

/* Smartphone layout: 500px and below */
@media(max-width:500px){
.section{padding:40px 0}
.section-title{margin-bottom:24px}
.header-right{gap:10px}
.header-hours-wrap{
display:flex;
align-items:center;
gap:4px;
position:relative;
top:1px;
}
.header-hours-label{
font-size:.58rem;
padding:3px 4px;
}
.header-hours{
font-size:.62rem;
}
.header-cta{display:none}
.line-wave-btn .line-icon{width:20px;height:20px}
.hero-cta-group .btn-secondary.line-wave-btn{
padding:8px 14px;
font-size:.8rem;
}
.hero{min-height:520px;padding:18px 0}
.hero-inner{min-height:500px}
.hero-bg-top-right{background-position:70% center}
.hero-bg-bottom-left{background-position:68% center}
.hero-circle{
width:88vw;
height:88vw;
max-width:390px;
max-height:390px;
min-width:300px;
min-height:300px;
border-radius:50%;
padding:14px;
}
.hero-num{font-size:.90rem}
.hero-label{font-size:.60rem}
.hero-label-service{font-size:.54rem}
.hero-cta-group{
gap:6px;
margin-top:10px;
padding:0;
align-items:center;
}
.hero-cta-group a{
width:100%;
max-width:210px;
padding:7px 10px;
font-size:.74rem;
margin:0 auto;
}
.hero-cta-group .btn-primary{box-shadow:3px 3px 0 rgba(0,0,0,.2)}
.hero-cta-group .btn-primary:hover{box-shadow:1px 1px 0 rgba(0,0,0,.16)}
.hero-cta-group .btn-secondary{box-shadow:3px 3px 0 rgba(0,0,0,.2)}
.hero-cta-group .btn-secondary:hover{box-shadow:1px 1px 0 rgba(0,0,0,.16)}

.section-title .en{font-size:.72rem}
.section-title h2{font-size:1.2rem;line-height:1.4}
.section-title p{font-size:.82rem;line-height:1.6}
.ba-card{padding:12px}
.price-table-wrap{margin-bottom:16px}
.deal-title{margin:0 0 10px}
.deal-grid{gap:10px;margin-bottom:14px}
.deal-card{
padding:20px 14px 14px;
display:grid;
grid-template-columns:minmax(0,1fr) auto;
grid-template-areas:
"name price"
"meta meta";
column-gap:8px;
row-gap:6px;
align-items:center;
}
.price-notes{gap:10px;margin-top:12px}
.price-note{padding:8px 12px}
.reason-img{height:170px}
.reason-body{padding:18px 16px}
.reason-body h3{font-size:1rem;margin-bottom:8px}
#reasons .reason-body h3 br{display:none}
.reason-body p{font-size:.82rem;line-height:1.65}
.target-card h3{font-size:.95rem}
.target-card p{font-size:.82rem;line-height:1.65}
.target-card{padding:16px}
.flow-content h3{font-size:.92rem}
.flow-content p{font-size:.8rem;line-height:1.6}
.flow-step{margin-bottom:20px}
.flow-content{padding:14px}
.faq-q{font-size:.84rem;padding:16px 16px}
.faq-a-inner{font-size:.8rem;line-height:1.65;padding:0 16px 16px 56px}
.price-note{font-size:.78rem}
.deal-name{
grid-area:name;
font-size:.9rem;
line-height:1.35;
margin-bottom:0;
display:flex;
align-items:center;
min-height:1.35em;
}
.deal-meta{
grid-area:meta;
font-size:.82rem;
margin-bottom:0;
}
.deal-price{
grid-area:price;
font-size:.9rem;
line-height:1.35;
justify-self:end;
align-self:center;
margin:0;
gap:4px;
flex-wrap:nowrap;
min-height:1.35em;
position:relative;
top:1px;
margin-right:4px;
}
.deal-off-badge{
width:42px;
height:42px;
margin-left:2px;
}
.deal-off-badge strong{font-size:.85rem}
.deal-off-badge small{font-size:.56rem}
.area-cities{font-size:.9rem;line-height:1.7;margin-bottom:12px}
.area-badge{font-size:.8rem;padding:8px 18px}
.area-note{font-size:.72rem}

.deal-title h3{font-size:1.05rem}
.price-table thead th{font-size:.76rem;padding:10px 10px}
.price-table tbody td{font-size:.76rem;padding:10px 10px;line-height:1.55}
.price-table .price{font-size:.9rem}
.sp-break{display:inline}
#profile .profile-info p{text-align:left}
.cta-section .cta-content > p{text-align:left;font-size:.82rem;line-height:1.65}
.cta-section h2{font-size:1.3rem;line-height:1.4}
.cta-tel{font-size:1.1rem}
.cta-hours{font-size:.95rem}
.cta-section{padding:40px 0}
#profile .profile-info p{font-size:.82rem;line-height:1.65}
.menu-subtitle{font-size:1.05rem}
.featured-track{gap:8px}
.featured-item{
flex:0 0 100%;
height:auto;
}
.featured-slider-wrap{padding:0}
.featured-item img{
height:auto;
object-fit:contain;
}
}

@media(max-width:400px){
.header-logo-image{width:140px}
.header-cta{
padding:6px 12px;
font-size:.72rem;
gap:4px;
}
.header-cta .line-icon{width:16px;height:16px}
.line-wave-btn .line-icon{width:18px;height:18px}
.hero-circle{
width:86vw;
height:86vw;
max-width:340px;
max-height:340px;
min-width:280px;
min-height:280px;
border-radius:50%;
padding:12px;
}
.hero-cta-group a{
max-width:190px;
padding:6px 8px;
font-size:.68rem;
}
.hero-sub{
font-size:.68rem;
line-height:1.35;
}
.price-table td:first-child{
font-size:.70rem;
line-height:1.45;
}
.deal-name{font-size:.86rem}
.deal-count{font-size:1.38em}
.deal-price{font-size:.86rem}
.deal-off-badge strong{font-size:.8rem}
.deal-off-badge small{font-size:.54rem}
.area-cities{font-size:.84rem}
.sp400-break{display:inline}
}
