/*
Theme Name: SRサービス 公式サイト
Version: 1.1
Description: SRサービスの施工実績投稿対応テーマ
*/

*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Noto Sans JP",sans-serif;color:#333;background:#fff;line-height:1.8}
header{background:#fff;border-bottom:1px solid #e8edf0;padding:16px 6%;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:10}
.logo{font-size:25px;font-weight:800;color:#285b68}.logo small{display:block;font-size:11px;color:#7a8b91;font-weight:500;line-height:1.2}
.header-btn{background:#f3a44d;color:#fff;padding:9px 17px;border-radius:24px;text-decoration:none;font-weight:700}
.hero{background:linear-gradient(135deg,#e9f7f7,#fff4e5);padding:70px 7% 65px}
.hero-inner{max-width:1100px;margin:auto}.tag{display:inline-block;background:#fff;color:#328090;border-radius:20px;padding:5px 15px;font-size:14px;font-weight:700}
.hero h1{font-size:42px;line-height:1.45;margin:15px 0 14px;color:#245663}.hero p{font-size:18px;color:#53656a;max-width:700px}
.main-btn{display:inline-block;background:#f3a44d;color:#fff;padding:14px 28px;border-radius:28px;text-decoration:none;font-weight:800;margin-top:10px;box-shadow:0 5px 15px #f3a44d33}
section{max-width:1100px;margin:auto;padding:60px 7%}
h2{text-align:center;color:#285b68;font-size:30px;margin:0 0 10px}.lead{text-align:center;color:#6d7b80;margin:0 0 32px}
.service-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.service{background:#fff;border:1px solid #e6eeee;border-radius:18px;padding:25px;box-shadow:0 5px 18px #285b6810}
.service h3{margin:0;color:#285b68;font-size:20px}.service p{color:#667579;margin:8px 0 15px}
.price-label{font-size:13px;color:#849296}.price{font-size:27px;font-weight:800;color:#ef8e2e;line-height:1.2}.note{font-size:12px;color:#8a9699}
.service-btn{display:block;text-align:center;background:#e8f5f5;color:#286574;text-decoration:none;padding:8px;border-radius:20px;margin-top:16px;font-weight:700}
.about{background:#f7fbfb;max-width:none}.about-inner{max-width:1000px;margin:auto}
.points{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.point{text-align:center;background:#fff;border-radius:15px;padding:20px;border:1px solid #e5eeee}.point strong{color:#285b68}
.area{background:#eaf7f8;max-width:none}.area-inner{text-align:center;max-width:1000px;margin:auto}.area strong{color:#ef8e2e}
.contact{background:#fff4e5;max-width:none;text-align:center}.contact .main-btn{margin:8px}
footer{background:#285b68;color:#eaf5f6;text-align:center;padding:30px}
@media(max-width:600px){
header{padding:13px 5%}.logo{font-size:20px}.header-btn{font-size:13px;padding:8px 12px}
.hero{padding:50px 6%}.hero h1{font-size:30px}.hero p{font-size:16px}
section{padding:45px 6%}h2{font-size:26px}.points{grid-template-columns:1fr}.service-grid{grid-template-columns:1fr}
}


.fixed-phone{position:fixed;left:0;right:0;bottom:0;z-index:99999;background:#fff;border-top:2px solid #e8edf0;box-shadow:0 -5px 20px rgba(40,91,104,.16);min-height:70px;display:flex;align-items:center;justify-content:center;gap:28px;padding:9px 16px}
.fixed-phone-text{display:flex;align-items:center;gap:10px;color:#285b68}.phone-icon{font-size:25px}.fixed-phone-text span:last-child{display:flex;flex-direction:column;line-height:1.15}.fixed-phone-text small{font-size:11px;color:#74868b}.fixed-phone-text strong{font-size:22px;letter-spacing:.5px}
.fixed-phone a{background:#f3a44d;color:#fff;text-decoration:none;font-weight:800;padding:10px 23px;border-radius:25px;white-space:nowrap}
body{padding-bottom:82px}
@media(max-width:600px){.fixed-phone{min-height:66px;gap:10px;padding:8px 10px}.fixed-phone-text strong{font-size:18px}.fixed-phone a{padding:9px 13px;font-size:13px}}

.wp-admin-bar-showing header{top:32px}
.site-posts{background:#f7fbfb;max-width:none}.posts-inner{max-width:1100px;margin:auto}.post-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.post-card{background:white;border:1px solid #e6eeee;border-radius:16px;overflow:hidden}.post-card img{width:100%;height:190px;object-fit:cover}.post-card-body{padding:18px}.post-card h3{margin:4px 0;color:#285b68}.post-card a{color:#285b68}.archive-link{display:block;text-align:center;margin-top:22px}.article{max-width:850px}.article img{max-width:100%;height:auto}.post-meta{color:#778;font-size:14px}body{overflow-wrap:anywhere}

/* v1.1: スマホでヘッダーと固定電話バーがコンテンツに重ならないよう調整 */
html{scroll-padding-top:110px}
body{padding-bottom:calc(94px + env(safe-area-inset-bottom,0px))}
header{gap:12px;min-width:0}
header .logo{min-width:0;overflow-wrap:anywhere;line-height:1.35}
header .header-btn{flex-shrink:0}
.fixed-phone{height:auto;min-height:70px;padding-bottom:calc(9px + env(safe-area-inset-bottom,0px));max-width:100vw}
.fixed-phone-text{min-width:0}
.fixed-phone-text strong{white-space:nowrap}
body.admin-bar header{top:32px}
@media(max-width:782px){body.admin-bar header{top:46px}}
@media(max-width:600px){
 header{position:relative;top:auto!important;align-items:center;padding:12px 4%}
 header .logo{font-size:clamp(15px,4.2vw,20px)}
 header .header-btn{font-size:12px;padding:8px 10px}
 .hero{padding-top:38px}
 .fixed-phone{gap:3px;justify-content:center;padding-left:7px;padding-right:7px}
 .fixed-phone-text{gap:5px}
 .fixed-phone-text strong{font-size:clamp(14px,4.2vw,18px)}
 .fixed-phone .phone-icon{font-size:20px}
 .fixed-phone a{font-size:12px;padding:10px 9px}
 body{padding-bottom:calc(100px + env(safe-area-inset-bottom,0px))}
}
@media(max-width:360px){.fixed-phone-text small{font-size:9px}.fixed-phone a{padding:9px 8px}}
