/* INFINITY サポートサイト（/support/）だけの部品。土台は会社サイトの /assets/site.*.css。
   値は直書き（変数なし）。色は Navy #1D2D50 / Orange #F48B21、面は #E9EEF6、中間の青 #3B5488。 */

/* ヘッダー: 1段目 = ロゴ・検索・ボタン、2段目 = 分類のメニュー（横に流せる） */
.sp-header .brand span{display:block;font-size:16px;font-weight:900;color:#1D2D50;border-left:2px solid #1D2D50;padding-left:16px;white-space:nowrap}
.sp-header .header-inner{min-height:80px}
.sp-search{margin-left:auto;display:flex;align-items:center;gap:8px;min-width:0}
.sp-search input{width:280px;max-width:100%;min-height:44px;padding:8px 16px;border:2px solid #1D2D50;border-radius:999px;font:inherit;font-size:16px;background:#fff;color:#000}
.sp-search input:focus{outline:3px solid #F48B21;outline-offset:2px}
.sp-search button{min-height:44px;padding:8px 24px;border:2px solid #1D2D50;border-radius:999px;background:#1D2D50;color:#fff;font:inherit;font-size:15px;font-weight:700;cursor:pointer;white-space:nowrap}
.sp-search button:hover{background:#3B5488}
.sp-header .header-cta .button.secondary{display:inline-flex}
.sp-nav{border-top:1px solid #e5e5e5;background:#E9EEF6}
.sp-nav-inner{max-width:1920px;margin:auto;padding:8px 40px;display:flex;gap:8px;overflow-x:auto;scrollbar-width:thin}
.sp-nav a{flex:none;display:flex;align-items:center;min-height:44px;padding:4px 16px;border-radius:999px;border:2px solid transparent;font-size:15px;font-weight:700;color:#1D2D50;text-decoration:none;white-space:nowrap}
.sp-nav a:hover{background:#fff;border-color:#1D2D50}
.sp-nav a[aria-current="page"]{background:#1D2D50;color:#fff}

/* トップ: よく使うもの */
.sp-quick{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.sp-quick li{margin:0;min-width:0}
.sp-quick a{display:flex;flex-direction:column;height:100%;padding:24px;border:3px solid #1D2D50;border-radius:24px;background:#fff;text-decoration:none;color:#000;box-sizing:border-box;transition:transform .15s,box-shadow .15s}
.sp-quick a:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 #3B5488}
.sp-quick li.pick a{background:#1D2D50;color:#fff;box-shadow:8px 8px 0 #F48B21}
.sp-quick small{font-size:14px;font-weight:900;letter-spacing:.08em;color:#3B5488}
.sp-quick li.pick small{color:#C9D6EC}
.sp-quick h3{margin-top:8px;font-size:22px;font-weight:900;line-height:1.5;color:#1D2D50}
.sp-quick li.pick h3{color:#fff}
.sp-quick p{margin:8px 0 24px;font-size:16px;line-height:1.75;max-width:none}
.sp-quick .text-link{margin-top:auto;align-self:flex-start}
.sp-quick li.pick .text-link{color:#fff}

/* トップ: 新着情報 */
.sp-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:start}
.sp-cols .panel{display:flex;flex-direction:column;height:100%;box-sizing:border-box}
.sp-cols .panel h3{font-size:22px}
.sp-cols .panel .text-link{margin-top:auto;align-self:flex-start}
.sp-news{list-style:none;margin:16px 0 24px;padding:0}
.sp-news li{margin:0;border-top:1px solid #C9D6EC}
.sp-news li:last-child{border-bottom:1px solid #C9D6EC}
.sp-news a{display:block;padding:12px 0;text-decoration:none;color:#000}
.sp-news a:hover span{text-decoration:underline;text-decoration-color:#F48B21;text-decoration-thickness:3px}
.sp-news time{display:block;font-size:14px;font-weight:700;color:#666;font-variant-numeric:tabular-nums}
.sp-news span{display:block;font-size:16px;line-height:1.6;font-weight:700;color:#1D2D50}

/* 一覧: 絵が無い記事は、分類の名前を書いた面にする */
.post-list figure.no-thumb{display:flex;align-items:center;justify-content:center;background:#E9EEF6;margin:0}
.post-list figure.no-thumb span{padding:16px;font-size:18px;font-weight:900;color:#3B5488;text-align:center;line-height:1.5}
.sp-site .band .post-list+.button-group{margin-top:40px}

/* 記事の本文: 古い記事に入っている埋め込みと表を、枠からはみ出させない */
.sp-site .prose iframe,.sp-site .prose video,.sp-site .prose embed,.sp-site .prose object{max-width:100%}
.sp-site .prose .wp-block-embed__wrapper{position:relative}
.sp-site .prose figure.wp-block-embed.is-type-video .wp-block-embed__wrapper iframe{width:100%;height:auto;aspect-ratio:16/9}
.sp-site .prose table{display:block;overflow-x:auto}
.sp-site .prose img{max-width:100%;height:auto}

@media (max-width:1200px){
.sp-quick{grid-template-columns:repeat(2,minmax(0,1fr))}
.sp-search input{width:200px}
}
@media (max-width:1024px){
.sp-header .header-inner{flex-wrap:wrap;min-height:72px}
.sp-search{order:3;flex:1 1 100%;margin:0 0 8px}
.sp-search input{flex:1;width:auto}
.sp-header .header-cta{margin-left:auto}
.sp-header .header-cta .button.secondary{display:none}
.sp-nav-inner{padding:8px 24px}
.sp-cols{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:767px){
.sp-header .brand span{display:block;font-size:13px;padding-left:8px}
.sp-nav-inner{padding:8px 16px}
.sp-nav a{font-size:14px;padding:4px 12px}
.sp-quick{grid-template-columns:minmax(0,1fr);gap:16px}
.sp-quick a{padding:20px}
.sp-quick h3{font-size:20px}
.sp-quick p{margin-bottom:16px}
}

/* 本文は WordPress の記事のまま（文節の区切りが入っていない）ので、会社サイトの keep-all は使わず、ふつうの折り返しに戻す */
.sp-site main,.sp-site .site-footer{word-break:normal;overflow-wrap:break-word;line-break:strict}
.sp-site,.sp-site button,.sp-site input{font-family:SFPro,Arial,"Noto Sans JP","Noto Sans KR",sans-serif}
/* プラグインの CSS が .header-cta を絶対配置にするので、ふつうの並びに戻す */
.sp-header .header-cta{position:static;inset:auto;transform:none;flex:none}
/* プラグインの CSS がリンクを青（#004e8e）にするので、会社サイトと同じ「親の色を引き継ぐ」に戻す。本文のリンクだけ紺 */
.sp-site a{color:inherit}
.sp-site .prose a{color:#1D2D50}
.sp-site .site-footer a{color:inherit}
/* 紺の帯の中の白いカードは、見出しとリンクを紺にする（帯の白い文字色を引き継がせない） */
.sp-site .band-navy .panel h3,.sp-site .band-navy .panel .text-link{color:#1D2D50}
.sp-site .band-navy .panel p{color:#000}