/* WordPress用の追加スタイル。
   原稿のCSS（common.css / index.css）は変更せず、足りない分だけここに書く。
   ブログ・新着情報の一覧と記事ページは仮デザイン。 */

/* TOP：アイキャッチ画像がある記事 */
.postList .ph{overflow:hidden}
.postList .ph img{width:100%;height:100%;object-fit:cover}

/* 一覧（仮） */
.wpList{max-width:800px;margin:0 auto}
.wpList a{display:grid;grid-template-columns:120px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid #ddd;text-decoration:none}
.wpList.news a{display:block}
.wpList .ph{height:80px;overflow:hidden}
.wpList .ph img{width:100%;height:100%;object-fit:cover}
.wpList time{font-size:12px;color:#666}
.wpList b{display:block;font-size:15px;line-height:1.5}
.wpPager{max-width:800px;margin:24px auto 0;text-align:center}
.wpPager .screen-reader-text{display:none}
.wpPager .page-numbers{display:inline-block;padding:6px 12px;border:1px solid #ddd;text-decoration:none;font-size:13px}
.wpPager .page-numbers.current{background:#333;color:#fff;border-color:#333}

/* 記事（仮） */
.wpArticle{max-width:800px;margin:0 auto}
.wpArticle time{font-size:13px;color:#666}
.wpArticle h1{font-size:24px;line-height:1.5;margin:8px 0 24px}
.wpArticle .eyecatch{margin-bottom:24px}
.wpArticle .body{font-size:15px;line-height:1.9}
.wpArticle .body p{margin:0 0 1.4em}
.wpArticle .body h2{font-size:20px;line-height:1.5;margin:2em 0 .8em;padding-bottom:8px;border-bottom:2px solid #ddd}
.wpArticle .body h3{font-size:17px;line-height:1.5;margin:1.8em 0 .6em}
.wpArticle .body ul,.wpArticle .body ol{margin:0 0 1.4em;padding-left:1.5em}
.wpArticle .body ul{list-style:disc}
.wpArticle .body ol{list-style:decimal}
.wpArticle .body img{max-width:100%;height:auto}

/* よくある質問（/qa/）。TOP原稿（index.css）のFAQと同じ指定。index.cssはTOPでしか読まないためここにも置く */
.faq{max-width:860px;margin:0 auto;border-top:1px solid #ccc}
.faq details{border-bottom:1px solid #ccc}
.faq summary{padding:16px 36px 16px 4px;cursor:pointer;font-weight:700;list-style:none;position:relative}
.faq summary::after{content:"+";position:absolute;right:8px;top:14px;font-size:18px}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 4px 16px;color:#555}
.faq details ul,.faq details ol{padding:0 4px 16px 1.6em;color:#555}
.faq details ul{list-style:disc}
.faq details ol{list-style:decimal}

/* ---------- ホバー時の動き ----------
   マウスで操作できる端末だけに効かせる（スマホで押した後に色が残るのを防ぐ）。
   影は会社ルールの基準値。角丸は付けない。 */
.btn,.heroSearch button,.chips a,.wpPager .page-numbers{transition:background-color .2s,color .2s,border-color .2s}
.needs a,.card{transition:transform .2s,box-shadow .2s,border-color .2s}
.makers a,.linkList a,.areaList a,.newsList a,.faq summary{transition:background-color .2s}
.linkList small,.areaList a span{transition:transform .2s}
.postList .ph img,.wpList .ph img{transition:transform .3s}
.logo,.hd .search,.ft a{transition:opacity .2s,transform .2s}
.gnav a,.heroLinks a{background:linear-gradient(#268ad5,#268ad5) no-repeat left bottom / 0 2px;transition:background-size .2s}
.heroLinks a{background-image:linear-gradient(#fff,#fff)}
.heroSearch button{cursor:pointer}

@media (hover:hover){
  .btn:hover{background:#333;color:#fff}
  .btn.main:hover,.heroSearch button:hover{background:#268ad5;border-color:#268ad5;color:#fff}
  .chips a:hover,.wpPager a.page-numbers:hover{background:#333;border-color:#333;color:#fff}
  .needs a:hover,.card:hover{transform:translateY(-3px);box-shadow:0 0 20px rgba(7,17,31,.18);border-color:#268ad5}
  .makers a:hover,.linkList a:hover,.areaList a:hover,.newsList a:hover{background:#eef6fc}
  .faq summary:hover{background:#f5f5f5}
  .linkList a:hover small,.areaList a:hover span{transform:translateX(4px)}
  .postList a:hover .ph img,.wpList a:hover .ph img{transform:scale(1.06)}
  .postList a:hover b,.wpList a:hover b{text-decoration:underline}
  .gnav a:hover,.heroLinks a:hover{background-size:100% 2px}
  .logo:hover,.ft a:hover{opacity:.7}
  .hd .search:hover{transform:scale(1.15)}
}

@media (prefers-reduced-motion:reduce){
  .needs a:hover,.card:hover,.hd .search:hover,.linkList a:hover small,.areaList a:hover span,.postList a:hover .ph img,.wpList a:hover .ph img{transform:none}
}

@media (max-width:767px){
  .wpList a{grid-template-columns:96px 1fr}
  .wpList .ph{height:64px}
  .wpArticle h1{font-size:20px}
}