/* 不動産取引価格情報検索サイト - style.css */
*,*::before,*::after{box-sizing:border-box;}
html{font-size:16px;scroll-behavior:smooth;}
body{margin:0;padding:0;font-family:'Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS PGothic',sans-serif;line-height:1.7;color:#333;background:#fff;}
img{max-width:100%;height:auto;display:block;}
a{color:#1a73e8;text-decoration:none;}
a:hover{color:#0d4ea6;text-decoration:underline;}
ul,ol{margin:0;padding:0;list-style:none;}
p{margin:0 0 1rem;}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 1.5rem;}

.site-header{position:sticky;top:0;z-index:100;background:#1a3a5c;box-shadow:0 2px 6px rgba(0,0,0,.2);}
.site-header .container{display:flex;align-items:center;justify-content:space-between;height:60px;}
.site-logo{margin:0;font-size:1.05rem;font-weight:700;}
.site-logo a{color:#fff;}
.site-nav ul{display:flex;gap:1rem;}
.site-nav a{color:rgba(255,255,255,.85);font-size:.88rem;padding:.25rem .5rem;border-radius:4px;transition:background .2s;}
.site-nav a:hover,.site-nav a[aria-current="page"]{background:rgba(255,255,255,.15);color:#fff;text-decoration:none;}

.hero{background:linear-gradient(135deg,#1a3a5c 0%,#2667a0 100%);color:#fff;padding:4rem 0 3rem;text-align:center;}
.hero-sm{padding:2.5rem 0 2rem;}
.hero-title{font-size:clamp(1.4rem,4vw,2.2rem);font-weight:700;margin:0 0 .75rem;line-height:1.3;color:#fff;}
.hero-sub{font-size:clamp(.88rem,2vw,1rem);color:rgba(255,255,255,.88);max-width:680px;margin:0 auto;}

.breadcrumb{background:#f4f6f9;border-bottom:1px solid #e2e6ea;padding:.6rem 0;font-size:.85rem;}
.breadcrumb ol{display:flex;flex-wrap:wrap;gap:.25rem;padding:0 1.5rem;max-width:1200px;margin:0 auto;}
.breadcrumb li{display:flex;align-items:center;}
.breadcrumb li+li::before{content:'>';margin-right:.25rem;color:#999;}
.breadcrumb a{color:#1a73e8;}

.section-title{font-size:1.4rem;font-weight:700;text-align:center;margin:0 0 1.5rem;color:#1a3a5c;}
.section-title span{display:inline-block;border-bottom:3px solid #2667a0;padding-bottom:.3rem;}
.about-section{padding:3rem 0;background:#fff;}
.about-body{max-width:760px;margin:0 auto;background:#f8f9fc;border-left:4px solid #2667a0;padding:1.25rem 1.5rem;border-radius:0 8px 8px 0;}
.about-body p{color:#444;}
.link-arrow{font-weight:600;}

.search-section{padding:3rem 0;background:#f4f6f9;}
.search-note{text-align:center;font-size:.9rem;color:#555;margin-bottom:1.5rem;}
.note-red{color:#d32f2f;font-weight:bold;}
.search-form-wrap{background:#fff;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.08);padding:2rem;margin-bottom:2rem;}
.search-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1.25rem;}
.search-item{display:flex;flex-direction:column;gap:.35rem;}
.search-item label{font-size:.85rem;font-weight:700;color:#1a3a5c;}
.selection{width:100%;padding:.55rem .75rem;font-size:.95rem;color:#333;border:2px solid #c8d3df;border-radius:6px;background:#fff;cursor:pointer;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath stroke='%231a3a5c' stroke-width='1.5' fill='none' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center;padding-right:2.2rem;}
.selection:focus{outline:none;border-color:#2667a0;box-shadow:0 0 0 3px rgba(38,103,160,.18);}

.loading-wrap{text-align:center;padding:2rem;color:#555;display:flex;align-items:center;justify-content:center;gap:.75rem;}
.loading-spinner{display:inline-block;width:22px;height:22px;border:3px solid #c8d3df;border-top-color:#2667a0;border-radius:50%;animation:spin .7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.error-msg{text-align:center;padding:1.5rem;color:#c62828;background:#fff3f3;border:1px solid #ffcdd2;border-radius:6px;}
.no-data{text-align:center;padding:2rem;color:#666;background:#fafafa;border:1px dashed #ccc;border-radius:8px;}

.result-section{padding:2rem 0 3rem;}
.area-heading h2{font-size:1.15rem;font-weight:700;color:#1a3a5c;background:#eef3fa;border-left:4px solid #2667a0;padding:.6rem 1rem;border-radius:0 6px 6px 0;margin:0 0 1rem;}

#main_table{margin-top:1rem;}
.table-scroll-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:8px;box-shadow:0 1px 8px rgba(0,0,0,.08);}
#main_table table{width:100%;border-collapse:collapse;min-width:1100px;background:#fff;}
#main_table thead th{background:#1a3a5c;color:#fff;font-size:.78rem;font-weight:700;padding:.6rem .5rem;text-align:center;white-space:nowrap;border-right:1px solid rgba(255,255,255,.15);}
#main_table thead th:last-child{border-right:none;}
#main_table tbody tr:nth-child(even){background:#f5f8fc;}
#main_table tbody tr:hover{background:#e8f0fb;}
#main_table tbody td{font-size:.82rem;padding:.5rem .5rem;border-bottom:1px solid #e8ecf0;border-right:1px solid #e8ecf0;vertical-align:top;color:#333;}
#main_table tbody td:last-child{border-right:none;}

@media(max-width:720px){
  .table-scroll-wrap{border-radius:0;box-shadow:none;}
  #main_table table{min-width:unset;}
  #main_table thead{display:none;}
  #main_table tbody tr{display:block;margin-bottom:1.25rem;border:1px solid #d0d8e4;border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.07);}
  #main_table tbody td{display:flex;align-items:flex-start;gap:.5rem;padding:.5rem .75rem;border-right:none;border-bottom:1px solid #e8ecf0;font-size:.88rem;}
  #main_table tbody td:last-child{border-bottom:none;}
  #main_table tbody td::before{content:attr(data-label);flex-shrink:0;min-width:130px;font-size:.75rem;font-weight:700;color:#fff;background:#2667a0;padding:.15rem .45rem;border-radius:3px;line-height:1.5;}
}

.pref-section{padding:2.5rem 0 3rem;}
.pref-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.75rem;margin-top:.5rem;}
.pref-list li a{display:block;padding:.65rem .5rem;text-align:center;background:#fff;border:1px solid #c8d3df;border-radius:8px;font-size:.9rem;color:#1a3a5c;font-weight:600;transition:background .15s,box-shadow .15s;box-shadow:0 1px 3px rgba(0,0,0,.05);}
.pref-list li a:hover{background:#eef3fa;box-shadow:0 3px 8px rgba(0,0,0,.1);text-decoration:none;}

.city-block{margin-bottom:2.5rem;}
.city-name{font-size:1.05rem;font-weight:700;color:#1a3a5c;background:#eef3fa;border-left:4px solid #2667a0;padding:.55rem 1rem;border-radius:0 6px 6px 0;margin:0 0 .75rem;}
.period-list{display:flex;flex-wrap:wrap;gap:.4rem;}
.period-list li a{display:inline-block;padding:.3rem .65rem;background:#fff;border:1px solid #c8d3df;border-radius:4px;font-size:.82rem;color:#2667a0;transition:background .15s;}
.period-list li a:hover{background:#2667a0;color:#fff;text-decoration:none;border-color:#2667a0;}

.site-footer{background:#1a3a5c;color:rgba(255,255,255,.75);padding:2rem 0;margin-top:2rem;}
.footer-nav ul{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-bottom:.75rem;}
.footer-nav a{color:rgba(255,255,255,.8);font-size:.85rem;}
.footer-nav a:hover{color:#fff;text-decoration:none;}
.copyright{text-align:center;font-size:.8rem;color:rgba(255,255,255,.55);}
.copyright a{color:rgba(255,255,255,.7);}
.copyright a:hover{color:#fff;}

#pagetop{display:none;position:fixed;bottom:20px;right:20px;width:46px;height:46px;background:#2667a0;color:#fff;border:none;border-radius:50%;font-size:1.4rem;cursor:pointer;box-shadow:0 3px 10px rgba(0,0,0,.2);transition:background .2s,transform .2s;z-index:99;line-height:1;}
#pagetop:hover{background:#1a3a5c;transform:translateY(-2px);}

@media(max-width:768px){
  .search-form-wrap{padding:1.25rem;}
  .search-row{grid-template-columns:1fr 1fr;}
}
@media(max-width:480px){
  .search-row{grid-template-columns:1fr;}
  .site-nav ul{gap:.3rem;}
  .site-nav a{font-size:.78rem;padding:.2rem .3rem;}
}