
:root{
  --primary:#2ea7e0;
  --primary-dark:#1b7fb8;
  --primary-soft:#eaf7ff;
  --accent:#38bdf8;
  --text:#1f2937;
  --muted:#6b7280;
  --bg:#ffffff;
  --white:#fff;
  --shadow:0 18px 40px rgba(46,167,224,0.14);
  --radius:24px;
  --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic","Meiryo",sans-serif;
  color:var(--text);
  background:#fff;
  line-height:1.7;
}
img{max-width:100%;display:block}
a{color:inherit}
.container{width:min(var(--max), calc(100% - 32px)); margin:0 auto}
.topbar{
  position:sticky; top:0; z-index:30;
  background:rgba(255,255,255,.94); backdrop-filter: blur(10px);
  border-bottom:1px solid #c9e8f7;
}
.nav{
  min-height:78px; display:flex; align-items:center; gap:18px;
}
.brand{display:flex; align-items:center; text-decoration:none; min-width:0}
.brand img{display:block; height:52px; width:auto; max-width:min(42vw, 360px)}
.nav-toggle{
  margin-left:auto; display:none; border:1px solid #8fd3f4; background:#f2fbff;
  color:#116e9e; border-radius:12px; padding:10px 14px; font-weight:700;
}
.nav-links{
  margin-left:auto; display:flex; align-items:center; gap:14px; min-width:0;
}
.nav-links a{
  text-decoration:none; white-space:nowrap; font-size:15px; font-weight:700; color:#21516d;
}
.button{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:48px; padding:12px 20px; border-radius:18px; border:1px solid transparent;
  background:#1ea7e1; color:#fff; text-decoration:none; font-weight:800;
  box-shadow:0 12px 30px rgba(30,167,225,.18);
  cursor:pointer;
}
.button:hover{background:#0f8cc9}
.button.secondary{
  background:#f2fbff; color:#0f8cc9; border-color:#8fd3f4; box-shadow:none;
}
.page-main-visual{line-height:0;background:#fff}
.page-main-visual img{width:100%;height:auto}
.hero,.page-hero{padding:58px 0 72px;background:#fff}
.hero-inner,.page-head{
  display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:30px; align-items:start;
}
.eyebrow,.badge{
  display:inline-flex; align-items:center; gap:8px;
  color:#2ea7e0; background:#eaf7ff; border:1px solid #c9e8f7;
  border-radius:999px; padding:8px 14px; font-size:.82rem; font-weight:800; letter-spacing:.04em;
}
h1{font-size:clamp(2rem,4vw,3.4rem); line-height:1.2; margin:16px 0}
h2{font-size:clamp(1.6rem,3vw,2.5rem); line-height:1.25; margin:10px 0 12px}
h3{font-size:1.2rem; line-height:1.35; margin:0 0 10px}
.lead{font-size:1.06rem; color:#4b5563}
.checks,.list-clean{padding-left:1.1rem}
.checks li,.list-clean li{margin-bottom:8px}
.cta-bar,.button-row{display:flex; flex-wrap:wrap; gap:12px; margin-top:20px}
.stats,.kicker-grid,.grid{display:grid; gap:18px}
.stats{grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:22px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.card,.hero-panel,.page-image-card,.service-card,.faq-item,.contact-box,.stat,.kicker{
  background:#fff; border:1px solid #c9e8f7; border-radius:var(--radius); box-shadow:var(--shadow);
}
.card,.hero-panel,.service-card,.stat,.kicker{padding:24px}
.page-image-card{padding:14px}
.page-image-card img,.image-panel img{border-radius:18px}
.section{padding:72px 0}
.section.subtle{background:linear-gradient(180deg,#fff 0%, #f7fcff 100%)}
.icon{font-size:30px; margin-bottom:12px}
.small{font-size:.92rem; color:#6b7280}
.linkline a{color:#0f8cc9; text-decoration:none; font-weight:800}
.steps{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:18px; counter-reset:item; padding:0; list-style:none; margin-top:26px}
.steps li{background:#fff;border:1px solid #c9e8f7;border-radius:22px;padding:22px;box-shadow:var(--shadow)}
.steps li h3:before{counter-increment:item; content:counter(item) ". "; color:#1ea7e1}
.breadcrumb{color:#1f5f87;font-size:.92rem;margin-bottom:18px}
.breadcrumb a{text-decoration:none;color:#116e9e}
.contact-box .grid{align-items:start}
.contact-note{color:#6b7280; font-size:.95rem}
.contact-visual img{border-radius:18px; border:1px solid #c9e8f7}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
label{display:block; margin-bottom:8px; font-weight:700; color:#1f5f87}
input,select,textarea{
  width:100%; border:1px solid #8fd3f4; border-radius:16px; padding:13px 14px;
  font:inherit; background:#fff;
}
input:focus,select:focus,textarea:focus{
  outline:none; border-color:#1ea7e1; box-shadow:0 0 0 4px rgba(30,167,225,.10)
}
textarea{min-height:140px; resize:vertical}
.footer-grid{display:grid; grid-template-columns:1.4fr .8fr; gap:20px}
footer{padding:48px 0 62px; background:#f7fcff; border-top:1px solid #c9e8f7}
.image-grid-2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; margin-top:24px}
.image-panel{background:#fff;border:1px solid #c9e8f7;border-radius:22px;padding:14px;box-shadow:var(--shadow)}
.single-image-wrap{margin-top:24px}
.single-image-wrap .image-panel{max-width:760px;margin:0 auto}
.hp-field{position:absolute;left:-9999px}
.faq-item button{
  width:100%; text-align:left; background:transparent; border:0; cursor:pointer;
  padding:18px 18px 18px 16px; display:flex; gap:12px; align-items:center;
  font-size:1rem; font-weight:800; color:#1f2937
}
.faq-item .plus{margin-left:auto; color:#0f8cc9; font-size:1.15rem}
.faq-item .answer{display:none; padding:0 18px 18px 18px; color:#4b5563}
.faq-item.active .answer{display:block}
.faq-search-shell,.concierge-shell{
  margin-top:24px; margin-bottom:28px; background:linear-gradient(180deg,#fff 0%, #f7fcff 100%);
  border:1px solid #c9e8f7; border-radius:22px; padding:20px; box-shadow:var(--shadow)
}
.faq-search-input,.concierge-textarea{width:100%; border:1px solid #8fd3f4;border-radius:16px;padding:14px 16px;font:inherit;background:#fff}
.faq-tools{margin-top:16px;display:grid;gap:14px}
.faq-chip-row{display:flex;flex-wrap:wrap;gap:10px}
.faq-chip{display:inline-flex;align-items:center;border:1px solid #8fd3f4;background:#f2fbff;color:#0f8cc9;border-radius:999px;padding:.55rem .95rem;font-size:.92rem;font-weight:800;cursor:pointer}
.faq-chip.active{background:#1ea7e1;color:#fff;border-color:#1ea7e1}
.faq-utility-row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.faq-mini-btn{border:1px solid #8fd3f4;background:#fff;color:#116e9e;border-radius:12px;padding:.65rem .95rem;font-weight:700;cursor:pointer}
.faq-group{margin-top:22px}
.faq-group-title{margin-bottom:14px;padding:12px 16px;border-left:6px solid #1ea7e1;background:#f2fbff;color:#116e9e;font-size:1.05rem;font-weight:800;border-radius:12px}
.faq-meta{color:#6b7280;font-size:.95rem}
.faq-empty{background:#f2fbff;border:1px dashed #8fd3f4;border-radius:18px;padding:20px;color:#1f5f87;margin-top:20px}
.faq-q-index{flex:0 0 auto;min-width:58px;color:#0f8cc9;font-size:.88rem;font-weight:900;letter-spacing:.04em}
.concierge-chat{border:1px solid #c9e8f7;border-radius:20px;background:#fff;min-height:280px;max-height:520px;overflow:auto;padding:16px}
.chat-bubble{max-width:min(88%,760px);border-radius:18px;padding:14px 16px;line-height:1.9;margin:0 0 14px;white-space:pre-wrap;word-break:break-word}
.chat-bubble.user{margin-left:auto;background:#f2fbff;border:1px solid #8fd3f4;color:#1f5f87}
.chat-bubble.bot{background:#fff;border:1px solid #c9e8f7;color:#3f3f46}
.chat-meta{display:block;font-size:.78rem;font-weight:700;color:#116e9e;margin-bottom:6px}
.typing-dots{display:inline-flex;gap:6px;align-items:center;min-height:18px}
.typing-dots span{width:8px;height:8px;border-radius:999px;background:#38bdf8;display:inline-block;animation:typingBlink 1.2s infinite ease-in-out}
.typing-dots span:nth-child(2){animation-delay:.15s}.typing-dots span:nth-child(3){animation-delay:.3s}
@keyframes typingBlink{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-2px)}}
.concierge-input-wrap{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end}
.concierge-send{white-space:nowrap;min-height:54px}
.concierge-help{margin-top:10px;color:#6b7280;font-size:.9rem}
.inline-notice{margin:14px 0 0;color:#1f5f87;font-size:.96rem}
.inline-actions{display:flex; flex-wrap:wrap; gap:12px; margin-top:14px}
@media (min-width:1200px){
  .topbar .container.nav{
    width: calc(100% - 36px); max-width:1460px;
    display:grid; grid-template-columns:auto minmax(0,1fr); gap:18px; padding-left:18px; padding-right:18px
  }
  .topbar .nav-links{justify-content:space-between; gap:10px; width:100%; flex-wrap:nowrap}
  .topbar .nav-links>a{font-size:clamp(13px,.9vw,16px); letter-spacing:-0.04em}
  .topbar .nav-links>a.button.secondary{padding:14px 16px; font-size:14px}
}
@media (max-width:1100px){
  .hero-inner,.page-head,.stats,.grid-3,.grid-2,.footer-grid,.image-grid-2,.form-grid{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .nav-toggle{display:inline-flex}
  .nav-links{display:none; width:100%; padding-bottom:16px; grid-column:1 / -1; flex-direction:column; align-items:flex-start}
  .nav-links.open{display:flex}
  .nav{flex-wrap:wrap}
}
@media (max-width:900px){
  .concierge-input-wrap{grid-template-columns:1fr}
  .concierge-send{width:100%}
  .steps{grid-template-columns:1fr}
  .faq-q-index{min-width:52px}
  .faq-item .answer{padding:0 14px 16px 14px}
  .faq-item button{padding:16px 14px; align-items:flex-start}
}
