:root{--main:#234f68;--dark:#173849;--accent:#c94b32;--light:#f5f7f8;--border:#dfe5e8;--text:#333;--muted:#666}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;color:var(--text);background:#fff;font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP","Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:1.8}
img{max-width:100%;height:auto;display:block}a{color:var(--main)}
.container{width:min(1120px,92%);margin:auto}.section{padding:65px 0}
.section-title{text-align:center;color:var(--dark);font-size:clamp(1.6rem,3vw,2.2rem);line-height:1.4;margin:0 0 12px}
.section-lead{max-width:760px;margin:0 auto 35px;text-align:center;color:var(--muted)}
.site-header{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:1000}
.header-inner{min-height:70px;display:flex;align-items:center;justify-content:space-between;gap:15px}
.logo{text-decoration:none;color:var(--dark);font-weight:800;font-size:1.3rem;line-height:1.2}.logo small{display:block;font-size:.7rem;color:var(--muted)}
.header-contact{display:flex;align-items:center;gap:10px}.header-phone{font-weight:800;text-decoration:none;white-space:nowrap}
.header-button{padding:9px 15px;border-radius:8px;background:var(--accent);color:#fff;text-decoration:none;font-weight:800}
.nav{background:var(--dark)}.nav-inner{display:flex;overflow-x:auto;white-space:nowrap}.nav a{flex:0 0 auto;padding:9px 14px;color:#fff;text-decoration:none;font-size:.9rem}
.hero{background:linear-gradient(135deg,#eef4f6,#fff);padding:42px 0 55px}.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
.hero h1{margin:0 0 15px;color:var(--dark);font-size:clamp(2rem,4.2vw,3.35rem);line-height:1.25}
.hero-catch{font-weight:700;font-size:1.2rem}.badges{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.badge{padding:5px 11px;border-radius:999px;background:#fff;border:1px solid #ccd8dd;color:var(--dark);font-weight:700;font-size:.86rem}
.hero-buttons{display:flex;flex-wrap:wrap;gap:10px}.btn{display:inline-block;padding:12px 20px;border-radius:9px;text-decoration:none;font-weight:800;text-align:center}
.btn-primary{background:var(--accent);color:#fff}.btn-secondary{background:var(--main);color:#fff}.btn-outline{background:#fff;border:1px solid var(--main);color:var(--main)}
.hero-photo{border-radius:12px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.12)}.hero-photo img{width:100%;aspect-ratio:4/3;object-fit:cover}.hero-note{text-align:center;color:var(--muted);font-size:.9rem}
.notice{max-width:900px;margin:0 auto 25px;padding:17px 20px;background:#fff8e9;border-left:5px solid #d79b26;border-radius:5px}
.rooms{display:grid;grid-template-columns:repeat(2,1fr);gap:23px}.room-card{border:1px solid var(--border);border-radius:12px;overflow:hidden;box-shadow:0 5px 18px rgba(0,0,0,.05)}

.room-card-main{overflow:hidden}
.room-gallery{
  display:grid;
  grid-template-columns:1.45fr 1fr 1fr;
  gap:8px;
  margin:0 0 20px;
}
.room-gallery a{display:block;overflow:hidden;border-radius:8px;background:#eee}
.room-gallery img{
  display:block;width:100%;height:145px;object-fit:cover;
}
.room-gallery a:first-child{grid-row:span 2}
.room-gallery a:first-child img{height:298px}
.room-plan{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  align-items:center;
  margin:20px 0;
}
.room-plan img{
  display:block;width:100%;height:auto;border:1px solid var(--border);border-radius:8px;background:#fff;
}
.room-summary{
  display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 16px;
}
.room-summary span{
  background:var(--light);border-radius:999px;padding:5px 10px;
  font-size:.86rem;font-weight:700;
}
.room-price-large{
  font-size:1.8rem;font-weight:900;line-height:1.2;margin:4px 0 5px;color:var(--accent);
}
.room-price-large small{font-size:.9rem;font-weight:500}
.room-note{
  background:var(--light);border-radius:9px;padding:11px 13px;margin:12px 0;
  font-size:.9rem;
}
.room-buttons{display:flex;flex-wrap:wrap;gap:9px;margin-top:16px}
.room-buttons .btn{flex:1;min-width:190px;text-align:center;text-decoration:none}
.photo-caption-note{font-size:.82rem;color:var(--muted);margin-top:6px}
@media(max-width:800px){
  .room-gallery{grid-template-columns:1fr 1fr}
  .room-gallery a:first-child{grid-column:span 2;grid-row:auto}
  .room-gallery img,.room-gallery a:first-child img{height:150px}
  .room-gallery a:first-child img{height:220px}
  .room-plan{grid-template-columns:1fr}
  .room-price-large{font-size:1.65rem}
  .room-buttons{flex-direction:column}
  .room-buttons .btn{width:100%}
}

.room-head{padding:17px 20px;background:var(--dark);color:#fff}.room-head h3{margin:0;font-size:1.4rem}.room-body{padding:21px}.room-price{font-size:1.45rem;font-weight:800;color:var(--accent)}
.room-table{width:100%;border-collapse:collapse;margin:12px 0}.room-table th,.room-table td{padding:7px 4px;border-bottom:1px solid var(--border);text-align:left}.room-table th{width:34%;color:var(--muted);font-weight:600}
.features{background:var(--light)}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.feature{background:#fff;border:1px solid var(--border);border-radius:10px;padding:23px 18px;text-align:center}.feature-icon{font-size:2rem}.feature h3{margin:5px 0;color:var(--dark)}.feature p{margin:0;color:var(--muted);font-size:.94rem}
.highlight{background:var(--dark);color:#fff}.highlight-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;text-align:center}.highlight-item strong{display:block;font-size:1.5rem}
.photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.photo-item{margin:0;border:1px solid var(--border);border-radius:9px;overflow:hidden}.photo-item img{width:100%;aspect-ratio:4/3;object-fit:cover}.photo-item figcaption{padding:8px 11px;font-weight:700}
.recommend{background:var(--light)}.recommend-list{max-width:820px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:11px}.recommend-list div{background:#fff;padding:13px 16px;border:1px solid var(--border);border-radius:8px;font-weight:700}
.owner-box{max-width:950px;margin:auto;display:grid;grid-template-columns:170px 1fr;gap:28px}.owner-photo{width:150px;margin:auto}.owner-box h3{color:var(--dark)}
.about{background:var(--light)}.about-text{max-width:900px;margin:auto}
.contact{background:linear-gradient(135deg,#f6eee9,#fff)}.contact-box{text-align:center;max-width:900px;margin:auto}.contact-points{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:22px 0}.contact-points span{background:#fff;border:1px solid #ddd;padding:6px 11px;border-radius:999px}.contact-buttons{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}.contact-phone{font-size:1.5rem;font-weight:800;margin-top:20px}.contact-phone a{text-decoration:none;color:var(--dark)}
.footer{padding:32px 0;background:#1d262b;color:#fff;text-align:center;font-size:.88rem}.footer a{color:#fff}.footer-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 18px;margin-bottom:15px}
.fixed-contact{display:none}
@media(max-width:800px){
.section{padding:50px 0}.header-phone{display:none}.hero{padding-top:28px}.hero-grid{grid-template-columns:1fr;gap:25px}
.rooms,.feature-grid{grid-template-columns:1fr}.highlight-grid{grid-template-columns:1fr;gap:4px}.photo-grid{grid-template-columns:1fr 1fr}.recommend-list{grid-template-columns:1fr}
.owner-box{grid-template-columns:1fr;text-align:center}.owner-box p{text-align:left}
.fixed-contact{position:fixed;left:10px;right:10px;bottom:10px;display:grid;grid-template-columns:1fr 1fr;gap:8px;z-index:1100}
.fixed-contact a{padding:12px 8px;border-radius:8px;text-align:center;text-decoration:none;font-weight:800;box-shadow:0 3px 12px rgba(0,0,0,.18)}.fixed-contact .call{background:#fff;color:var(--dark)}.fixed-contact .mail{background:var(--accent);color:#fff}body{padding-bottom:65px}}
@media(max-width:520px){.logo{font-size:1.08rem}.header-button{padding:8px 11px;font-size:.82rem}.nav a{padding:8px 11px;font-size:.8rem}.hero-buttons .btn{width:100%}.photo-grid{grid-template-columns:1fr}}
.hero-grid{
  display:grid;
  grid-template-columns:1.4fr .6fr;
  gap:22px;
}

.main-photo img{
  width:100%;
  height:auto;
  object-fit:contain;
}

/* ==================================================
   E-2室内写真：縦長・横長どちらも切らずに表示
   ================================================== */
.photo-grid img{
  width:100%;
  height:auto;
  max-height:320px;
  object-fit:contain;
  background:#f5f5f5;
}

@media(max-width:750px){
  .photo-grid img{
    height:auto;
    max-height:260px;
  }
}

/* ===== お問い合わせフォーム用 ===== */
.form-row{margin-bottom:19px}
.required{background:#c94b32;color:#fff}
.optional{display:inline-block;margin-left:7px;padding:2px 7px;border-radius:4px;font-size:.72rem;font-weight:700;vertical-align:middle}
.optional{background:#eef1f3;color:#666}
.name-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.name-grid{grid-template-columns:1fr}
.name-part small{display:block;color:var(--muted);margin-bottom:4px}
textarea{width:100%;border:1px solid #cfd7dc;border-radius:7px;padding:11px 12px;font:inherit;background:#fff}
textarea{min-height:150px;resize:vertical}
.help{margin:6px 0 0;color:var(--muted);font-size:.86rem}
button{border:0;border-radius:9px;padding:13px 25px;font:inherit;font-weight:800;cursor:pointer}
button{width:100%}
.submit{background:var(--accent);color:#fff;min-width:190px}
.reset{background:#eef1f3;color:#444}
.mobile-top{background:var(--accent)}
.form-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}
.form-actions button{border:0;border-radius:9px;padding:13px 25px;font:inherit;font-weight:800;cursor:pointer}
.form-actions .submit{background:var(--accent);color:#fff;min-width:190px}
.form-actions .reset{background:#eef1f3;color:#444}

@media(max-width:600px){
  .name-grid{grid-template-columns:1fr}
  .form-actions{flex-direction:column}
  .form-actions button{width:100%}
}
