.areas-page{background:#f8f6f1}.areas-hero{min-height:390px;display:flex;align-items:flex-end;padding:95px max(8vw,calc((100% - 1440px)/2)) 72px;background:linear-gradient(90deg,rgba(22,36,31,.78),rgba(22,36,31,.18)),url('../images/hero-onsen.png') center 58%/cover;color:#fff}.areas-hero>div{max-width:720px}.areas-hero p,.areas-map-intro small,.areas-list-intro small{margin:0;color:#d8dfdb;font-size:9px;letter-spacing:.24em}.areas-hero h2{margin:18px 0 16px;font:400 clamp(34px,4.2vw,58px)/1.45 var(--serif);letter-spacing:.08em}.areas-hero span{font-size:12px;line-height:2;letter-spacing:.04em}.areas-content{width:min(calc(100% - 64px),1440px);margin:auto;padding:85px 0 120px}.areas-map-intro,.areas-list-intro{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(360px,1fr);align-items:end;gap:70px;max-width:1180px;margin:0 auto}.areas-map-intro h2,.areas-list-intro h2{margin:10px 0 0;font:400 clamp(28px,3vw,40px) var(--serif);letter-spacing:.06em}.areas-map-intro small,.areas-list-intro small{color:#9a654b}.areas-map-intro p,.areas-list-intro p{margin:0;color:#68756f;font-size:11px;line-height:2}.areas-page .onsen-selector{margin-top:34px}.areas-page .region-tabs{justify-content:center;margin:88px 0 28px;padding-top:36px;border-top:1px solid #d8d3ca}.areas-list-intro{margin-top:0;margin-bottom:32px}.areas-page .region-visual-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 95px}.areas-page .region-visual-grid a{position:relative;min-height:300px;padding:25px;overflow:hidden}.areas-page .region-visual-grid a:after{position:absolute;inset:0;border:1px solid rgba(255,255,255,.25);content:"";pointer-events:none}.areas-page .region-visual-grid strong{font-size:29px}.areas-page .region-visual-grid i{margin-top:13px;color:#eee;font-size:9px;font-style:normal;letter-spacing:.06em;opacity:0;transform:translateY(5px);transition:.2s}.areas-page .region-visual-grid a:hover i{opacity:1;transform:none}.areas-page .areas-directory{max-width:1180px;margin:auto}.areas-page .areas-directory>section+section{margin-top:95px}.areas-page .areas-region-title{padding-bottom:23px}.areas-page .prefecture-grid{gap:12px;margin-top:20px}.areas-page .prefecture-grid article{padding:27px 25px;border:0;box-shadow:0 8px 28px rgba(38,52,47,.055);transition:transform .2s,box-shadow .2s}.areas-page .prefecture-grid article:hover{transform:translateY(-3px);box-shadow:0 15px 36px rgba(38,52,47,.1)}.areas-page .prefecture-grid li a small{color:#9a654b}.areas-page .prefecture-grid li a:hover span{color:#8a5d47}.areas-page .data-notice{margin:20px auto;max-width:1180px}
@media(max-width:1000px){.areas-page .region-visual-grid{grid-template-columns:repeat(2,1fr)}.areas-map-intro,.areas-list-intro{grid-template-columns:1fr;gap:18px}}
@media(max-width:700px){.areas-hero{min-height:330px;padding:80px 22px 48px}.areas-hero h2{font-size:32px}.areas-content{width:100%;padding:55px 18px 80px}.areas-page .onsen-selector{margin-top:25px}.areas-page .region-tabs{justify-content:flex-start;margin-top:58px;overflow:auto;flex-wrap:nowrap;padding-bottom:5px}.areas-page .region-tabs a{flex:0 0 auto}.areas-page .region-visual-grid{grid-template-columns:1fr 1fr;gap:7px;margin-bottom:65px}.areas-page .region-visual-grid a{min-height:205px;padding:18px}.areas-page .region-visual-grid strong{font-size:22px}.areas-page .region-visual-grid i{display:none}.areas-page .areas-directory>section+section{margin-top:65px}}