/* 2026-11-03 home_visual.py：トップ・読みもの一覧・探し方・フッターを絵つきでやわらかく（記事ページは読み込まない） */
:root{--hv-green:#2f7d5b;--hv-green-d:#1f5a43;--hv-orange:#f08c2e;--hv-sky:#4fa8d8;--hv-cream:#fffaf1;--hv-mint:#eef7ef;--hv-line:#dcebdc}
.hv-section{padding:44px 0}
.hv-section h2{font-size:clamp(24px,3.2vw,32px);line-height:1.5;margin:0 0 8px;color:var(--hv-green-d)}
.hv-lead{font-size:17px;line-height:1.8;margin:0 0 22px;color:#3d5148}
.hv-find{background:linear-gradient(180deg,#fff 0,var(--hv-cream) 100%)}
.hv-find-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.hv-find-card{display:flex;flex-direction:column;background:#fff;border:2px solid var(--hv-line);border-radius:22px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 6px 18px rgba(47,125,91,.08);transition:transform .15s,box-shadow .15s}
.hv-find-card:hover,.hv-find-card:focus-visible{transform:translateY(-3px);box-shadow:0 10px 24px rgba(47,125,91,.16);border-color:var(--hv-green)}
.hv-find-card img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;background:#f7fbf6}
.hv-find-text{display:flex;flex-direction:column;gap:6px;padding:16px 18px 18px}
.hv-find-text strong{font-size:21px;color:var(--hv-green-d)}
.hv-find-text span{font-size:16px;line-height:1.7;color:#3d5148}
.hv-find-text .hv-go{color:var(--hv-orange);font-weight:700;margin-top:4px}
.hv-howto{margin-top:26px;background:#fff;border:0;border-radius:18px;padding:18px 20px}
.hv-howto-title{font-weight:700;font-size:18px;margin:0 0 12px;color:var(--hv-green-d)}
.hv-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;list-style:none;margin:0;padding:0;counter-reset:none}
.hv-steps li{position:relative;margin:0}
.hv-steps .hv-step-box{display:flex;align-items:center;gap:10px;height:100%;padding:12px 14px;border-radius:14px;background:var(--hv-mint);color:#244f40;font-weight:700;font-size:16px;line-height:1.5;text-decoration:none;box-sizing:border-box}
.hv-steps a.hv-step-box{background:#e3f1e6;text-decoration:none;text-underline-offset:3px}
.hv-steps li:nth-child(3) .hv-step-box{background:#fff1e2}
.hv-step-num{flex:0 0 34px;height:34px;border-radius:50%;background:var(--hv-orange);color:#fff;display:inline-flex!important;align-items:center;justify-content:center;font-size:17px;text-decoration:none}
.hv-steps li:not(:last-child)::after{content:"";position:absolute;right:-10px;top:50%;width:8px;height:8px;border-top:3px solid #9cc8a6;border-right:3px solid #9cc8a6;transform:translateY(-50%) rotate(45deg)}
.hv-howto-band{display:grid;grid-template-columns:150px 1fr;gap:18px;align-items:center;margin:20px 0 26px}
.hv-howto-band .hv-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
.hv-howto-band .hv-steps li::after{display:none}
.hv-howto-art img{display:block;width:150px;height:150px;border-radius:18px;object-fit:cover}
.hv-cats{background:var(--hv-mint)}
.hv-cat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.hv-cat-card{display:flex;flex-direction:column;background:#fff;border-radius:20px;overflow:hidden;text-decoration:none;color:inherit;border:2px solid transparent;box-shadow:0 4px 14px rgba(31,90,67,.08);transition:transform .15s,border-color .15s}
.hv-cat-card:hover,.hv-cat-card:focus-visible{transform:translateY(-3px);border-color:var(--hv-orange)}
.hv-cat-card img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.hv-cat-text{display:flex;flex-direction:column;gap:2px;padding:12px 14px 16px}
.hv-cat-text strong{font-size:19px;color:var(--hv-green-d)}
.hv-cat-text span{font-size:15px;line-height:1.6;color:#4a5f55}
.hv-more{margin:22px 0 0;text-align:center}
.hv-more a,.hv-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 22px;border-radius:999px;background:#fff;border:2px solid var(--hv-green);color:var(--hv-green-d);font-weight:700;text-decoration:none}
.hv-hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.hv-btn-main{background:var(--hv-orange);border-color:var(--hv-orange);color:#fff!important}
.hero-art img{border-radius:28px}
/* 読みもの一覧 */
.hv-guide-hero{margin:0 0 18px}
.hv-guide-hero img{display:block;width:100%;height:auto;max-height:340px;object-fit:cover;border-radius:24px}
.discovery-groups.hv-groups{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.discovery-groups.hv-groups a{display:flex!important;flex-direction:column;align-items:center;gap:6px;padding:10px 8px 12px!important;background:#fff!important;border:2px solid var(--hv-line);border-radius:18px!important;text-decoration:none;color:var(--hv-green-d)!important;font-weight:700}
.discovery-groups.hv-groups a:hover,.discovery-groups.hv-groups a:focus-visible{border-color:var(--hv-orange)}
.discovery-groups.hv-groups img{width:88px;height:88px;border-radius:16px;object-fit:cover}
.hv-topic-head{display:flex;align-items:center;gap:12px}
.hv-topic-icon{width:56px;height:56px;border-radius:14px;object-fit:cover;flex:0 0 56px}
.discovery-tile.hv-thumb{padding:0!important;background:#f3f8f2;overflow:hidden;flex:0 0 132px!important;height:88px!important}
.discovery-tile.hv-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.discovery-tile.hv-thumb-cat{flex-direction:column;gap:2px;flex:0 0 96px!important;height:auto!important;min-height:88px;padding:6px!important;background:#f3f8f2!important;font-size:13px!important}
.discovery-tile.hv-thumb-cat img{width:58px;height:58px;border-radius:12px;object-fit:cover}
.hv-li-thumb{width:72px;height:48px;object-fit:cover;border-radius:8px;vertical-align:middle;margin-right:10px}
.discovery-main .hv-find{margin:36px 0 0;border-radius:22px;padding:28px 0}
/* フッター */
footer.bgx-soft-footer{background:var(--hv-cream)!important;color:#2f4238!important;border-top:6px solid #cfe7d4;margin-top:48px;padding:36px 0 24px}
footer.bgx-soft-footer p,footer.bgx-soft-footer span{color:#2f4238!important}
footer.bgx-soft-footer a,footer.bgx-soft-footer a:visited{color:var(--hv-green-d)!important;text-decoration:none}
footer.bgx-soft-footer a:hover{text-decoration:none!important}
.hv-foot-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:32px;align-items:start}
.hv-foot-name{font-size:22px;font-weight:800;margin:0 0 6px;color:var(--hv-green-d)!important}
.hv-foot-name span{font-size:13px;font-weight:600}
.hv-foot-art{display:block;width:100%;max-width:300px;height:auto;margin-top:12px;border-radius:18px}
.hv-foot-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.hv-foot-cols nav,.hv-foot-run{display:flex;flex-direction:column;gap:2px;background:#fff;border-radius:18px;padding:16px 18px;box-shadow:0 3px 10px rgba(31,90,67,.06)}
.hv-foot-cols a{display:block;padding:6px 0;line-height:1.6;font-size:16px}
.hv-foot-h{display:flex;align-items:center;gap:8px;font-weight:800;font-size:17px;margin:0 0 6px}
.hv-dot{width:14px;height:14px;border-radius:50%;display:inline-block}
.hv-dot-g{background:var(--hv-green)}.hv-dot-o{background:var(--hv-orange)}.hv-dot-b{background:var(--hv-sky)}
footer.bgx-soft-footer .hv-foot-run .bgx-policy{display:flex!important;flex-direction:column;gap:0!important;background:transparent!important;padding:0!important;margin:0!important;max-width:none;border-radius:0}
footer.bgx-soft-footer .hv-foot-run .bgx-policy a{color:var(--hv-green-d)!important;text-decoration:none!important}
.hv-foot-source{margin-top:22px;font-size:13px;line-height:1.8;color:#5a6b62}
.hv-foot-source .source-block{border-top:1px solid #e4dccb;padding-top:14px}
.hv-foot-source p{color:#5a6b62!important}
.hv-foot-source a{text-decoration:underline!important}
@media(max-width:900px){.hv-cat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hv-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.hv-steps li::after{display:none}.hv-foot-top{grid-template-columns:1fr}.hv-foot-art{max-width:240px}}
@media(max-width:767px){
.hv-section{padding:32px 0}
.hv-find-grid{grid-template-columns:1fr;gap:12px}
.hv-find-card{flex-direction:row;align-items:center}
.hv-find-card img{width:112px;flex:0 0 112px;aspect-ratio:1/1}
.hv-find-text{padding:12px 14px}
.hv-find-text strong{font-size:19px}
.hv-find-text span{font-size:15px}
.hv-steps{grid-template-columns:1fr}
.hv-howto{padding:14px}
.hv-howto-band{grid-template-columns:1fr}
.hv-howto-band .hv-steps{grid-template-columns:1fr}
.hv-howto-art img{width:120px;height:120px}
.hv-cat-grid{gap:10px}
.hv-cat-text{padding:10px 10px 12px}
.hv-cat-text strong{font-size:17px}
.hv-cat-text span{font-size:13px}
.hv-hero-actions .hv-btn{flex:1 1 100%}
.discovery-groups.hv-groups{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.discovery-groups.hv-groups a{padding:6px 2px 8px!important;font-size:12px;border-radius:12px!important;line-height:1.3;text-align:center}
.discovery-groups.hv-groups img{width:100%;max-width:64px;height:auto;aspect-ratio:1/1;border-radius:10px}
.discovery-tile.hv-thumb{flex:0 0 104px!important;height:72px!important}
.hv-guide-hero img{max-height:220px}
.hv-foot-cols{grid-template-columns:1fr;gap:12px}
}
.search-container .hv-cats{border-radius:24px;margin:28px 0;padding:28px 22px}
.search-container .hv-cats>.container{padding:0;max-width:none}
@media(max-width:767px){.search-container .hv-cats{margin:22px -8px;padding:22px 12px}}

footer.bgx-soft-footer .hv-foot-run .bgx-policy{box-shadow:none!important;border:0!important}
/* 事業所カードの「Google マップで開く」 */
.card-map{margin:4px 0 8px;font-size:15px;line-height:1.6}
.card-map a{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:4px 12px;border-radius:999px;background:#eaf4fb;color:#1d5f86!important;font-weight:700;text-decoration:none;max-width:100%;box-sizing:border-box}
.card-map a::before{content:"";width:10px;height:10px;border-radius:50% 50% 50% 0;background:#e8603c;transform:rotate(-45deg);flex:0 0 10px}
.card-map a:hover{text-decoration:none}
.compare-card .card-map{margin:10px 22px}
/* Column hero items need a definite cross size: h1 is an inline-size container. */
@media(max-width:760px){.hero .hero-grid{align-items:stretch}}

.hv-steps a.hv-step-box::after{content:"›";margin-inline-start:auto;color:#1d5b44;font-size:24px;line-height:1;font-weight:700}
.hv-steps a.hv-step-box:hover,.hv-steps a.hv-step-box:focus-visible{background:#cfe7d6}
.hv-steps a.hv-step-box:focus-visible{outline:2px solid #28654f;outline-offset:2px}

.hv-steps li:not(:last-child)::after{display:none}
