@charset "UTF-8";
/* =========================================================
   MkIIIPD Column
   メインサイトの css/style.css（色・フォント・ヘッダー・フッター・ボタン）の上に重ねる
   ========================================================= */

/* ---------- 共通 ---------- */
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link:focus{position:fixed!important;top:8px;left:8px;width:auto;height:auto;clip:auto;z-index:1000;background:#fff;color:var(--navy);padding:.6em 1em;border-radius:8px;font-weight:700}
.col-main{background:#fff}

/* ---------- ヘッダー：戻るボタンと相談ボタンだけ ---------- */
.col-header .header__inner{justify-content:space-between}
.col-header__btns{display:flex;align-items:center;gap:10px;margin-left:auto;flex-shrink:0}
.col-header__back{background:transparent;color:#fff;border-color:rgba(255,255,255,.55);font-size:14px;padding:.6em 1.2em .6em .9em}
.col-header__back svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.col-header__back:hover,.col-header__back:focus-visible{background:#fff;color:var(--navy);border-color:#fff}
.col-header__cta{font-size:14px;padding:.6em 1.4em}
@media (max-width:767px){
  .col-header__btns{gap:6px}
  .col-header__back{font-size:13px;padding:.5em .9em .5em .7em}
  .col-header__cta{font-size:13px;padding:.55em 1em}
}

/* ---------- 一覧の見出し帯 ---------- */
.col-hero{background:var(--navy);color:#fff;text-align:center;padding:56px 0 52px}
.col-hero__en{font-size:22px;letter-spacing:.14em;color:#998641;line-height:1}
.col-hero__title{margin-top:10px;font-size:clamp(24px,3vw,34px);font-weight:900;line-height:1.45}
.col-hero__lead{margin:14px auto 0;max-width:680px;font-size:15px;line-height:1.9;opacity:.9}

.col-list{background:var(--gray);padding:40px 0 88px}

/* ---------- カテゴリーの切り替え ---------- */
.col-cats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.col-cats__item{display:inline-block;background:#fff;border:1px solid var(--line);color:var(--navy);text-decoration:none;font-size:14px;font-weight:700;padding:.45em 1.1em;border-radius:999px;transition:background-color .2s,color .2s,border-color .2s}
.col-cats__item:hover,.col-cats__item:focus-visible{border-color:var(--navy)}
.col-cats__item.is-current{background:var(--navy);border-color:var(--navy);color:#fff}

/* ---------- カード一覧 ---------- */
.col-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.col-card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;transition:transform .25s ease,box-shadow .25s ease}
.col-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(1,74,115,.14)}
.col-card__link{display:flex;flex-direction:column;height:100%;color:var(--text);text-decoration:none}
.col-card__thumb{position:relative;aspect-ratio:3/2;background:#dfe6ec;overflow:hidden}
/* 注目記事 */
.col-featured{margin-bottom:40px;padding-bottom:40px;border-bottom:1px dashed #c9d2db}
.col-card--featured{box-shadow:0 0 0 2px var(--orange),var(--shadow)}
.col-card__label{position:absolute;top:12px;right:12px;z-index:3;padding:5px 12px 4px;border-radius:4px;background:var(--orange);color:#fff;font-size:17px;line-height:1;letter-spacing:.08em;box-shadow:0 4px 12px rgba(0,0,0,.18)}
.col-card__thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.col-card:hover .col-card__thumb img{transform:scale(1.04)}
.col-card__noimg{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--navy);color:#fff}
.col-card__thumb .col-card__noimg-logo{display:block;width:58%;max-width:300px;height:auto;object-fit:contain}
.col-card:hover .col-card__thumb .col-card__noimg-logo{transform:none}
.col-card__noimg small{display:block;margin-top:.9em;font-size:clamp(14px,1.5vw,17px);line-height:1;letter-spacing:.22em;color:#998641;white-space:nowrap}
.col-card__body{padding:18px 20px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
.col-card__meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.col-card__date{font-family:var(--en);font-size:16px;letter-spacing:.05em;color:var(--muted)}
.col-card__title{font-size:17px;font-weight:900;color:var(--navy);line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.col-card__excerpt{font-size:13.5px;color:var(--muted);line-height:1.75;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.col-card__link:focus-visible{outline:3px solid var(--orange);outline-offset:3px;border-radius:var(--radius)}

.col-chip{display:inline-block;background:var(--navy);color:#fff;font-size:12px;font-weight:700;line-height:1.5;padding:.15em .8em;border-radius:4px;text-decoration:none}
a.col-chip:hover{background:var(--navy-dark);color:#fff}
/* カテゴリーの色分け（スラッグで判定） */
.col-chip--news{background:var(--orange)}
a.col-chip--news:hover{background:#e05a00}
.col-chip--column{background:#998641}
a.col-chip--column:hover{background:#7f6f35}

.col-empty{text-align:center;color:var(--muted);padding:40px 0}

/* ---------- ページ送り ---------- */
.col-pager{margin-top:44px}
.col-pager ul{display:flex;justify-content:center;flex-wrap:wrap;gap:8px}
.col-pager .page-numbers{display:flex;align-items:center;justify-content:center;min-width:44px;height:44px;padding:0 12px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--navy);font-weight:700;text-decoration:none}
.col-pager .prev,.col-pager .next{font-size:22px;line-height:1}
.col-pager .current{background:var(--navy);border-color:var(--navy);color:#fff}
.col-pager .dots{background:transparent;border:0}
.col-pager a.page-numbers:hover{border-color:var(--navy)}

/* ---------- パンくず ---------- */
.col-breadcrumb{margin-bottom:24px;font-size:12.5px;color:var(--muted)}
.col-breadcrumb ol{display:flex;flex-wrap:wrap;gap:4px 0}
.col-breadcrumb li{display:flex;align-items:center}
.col-breadcrumb li+li::before{content:"";width:6px;height:6px;margin:0 10px 0 8px;border-top:1.5px solid #9aa7b2;border-right:1.5px solid #9aa7b2;transform:rotate(45deg)}
.col-breadcrumb a{color:var(--muted);text-decoration:none}
.col-breadcrumb a:hover{color:var(--navy);text-decoration:underline}
.col-breadcrumb span[aria-current]{display:inline-block;max-width:28em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}

/* ---------- 記事ページ ---------- */
.col-single{padding:32px 0 0}
.col-single__container{max-width:880px}
.col-article__head{margin-bottom:24px}
.col-article__meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;font-family:var(--en);font-size:17px;letter-spacing:.05em;color:var(--muted)}
.col-article__updated{font-family:var(--ja);font-size:12.5px;letter-spacing:0}
.col-article__updated time{font-family:var(--en);font-size:16px;letter-spacing:.05em;margin-left:2px}
.col-article__title{margin-top:12px;font-size:clamp(24px,3.2vw,34px);font-weight:900;color:var(--navy);line-height:1.5}
.col-article__eyecatch{margin:0 0 36px;border-radius:var(--radius);overflow:hidden;background:#dfe6ec}
.col-article__eyecatch img{width:100%;height:auto;aspect-ratio:3/1;object-fit:cover;object-position:50% 50%}

/* 本文（メインサイトのCSSで消している余白や箇条書きを、記事用に戻す） */
.entry-content{font-size:17px;line-height:2;color:var(--text);word-wrap:break-word}
.entry-content > *{margin-top:0;margin-bottom:1.5em}
.entry-content > *:last-child{margin-bottom:0}
.entry-content h2{margin:2.4em 0 1em;padding:.5em 0 .5em .9em;font-size:clamp(20px,2.4vw,24px);font-weight:900;line-height:1.5;color:var(--navy);border-left:5px solid var(--navy);background:var(--gray);border-radius:0 6px 6px 0}
.entry-content h3{margin:2em 0 .8em;padding-bottom:.4em;font-size:clamp(18px,2vw,20px);font-weight:900;line-height:1.55;color:var(--navy);border-bottom:2px solid var(--line)}
.entry-content h4{margin:1.8em 0 .6em;font-size:17px;font-weight:900;color:var(--navy)}
.entry-content a{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.entry-content a:hover{color:var(--orange)}
.entry-content strong{font-weight:900;background:linear-gradient(transparent 62%,rgba(255,102,0,.18) 62%)}
.entry-content ul,.entry-content ol{padding-left:1.5em}
.entry-content ul{list-style:disc}
.entry-content ol{list-style:decimal}
.entry-content li+li{margin-top:.35em}
.entry-content li::marker{color:var(--navy)}
.entry-content blockquote{margin-left:0;margin-right:0;padding:1.2em 1.4em;background:var(--gray);border-left:4px solid #b8c4cf;border-radius:0 8px 8px 0;color:#444}
.entry-content blockquote p{margin:0}
.entry-content blockquote cite{display:block;margin-top:.6em;font-size:13px;font-style:normal;color:var(--muted)}
.entry-content img{border-radius:8px;height:auto}
.entry-content figure{margin-left:0;margin-right:0}
.entry-content figcaption,.entry-content .wp-element-caption{margin-top:.6em;font-size:13px;line-height:1.6;color:var(--muted);text-align:center}
.entry-content hr{border:0;border-top:1px solid var(--line);margin:2.5em 0}
.entry-content table{width:100%;border-collapse:collapse;font-size:15px}
.entry-content th,.entry-content td{border:1px solid var(--line);padding:.7em .9em;text-align:left;vertical-align:top}
.entry-content th{background:var(--gray);color:var(--navy);font-weight:700}
.entry-content .wp-block-table{overflow-x:auto}
.entry-content code{background:var(--gray);padding:.1em .4em;border-radius:4px;font-size:.9em}
.entry-content pre{background:#0d1b26;color:#e8eef3;padding:1.2em;border-radius:8px;overflow-x:auto;font-size:14px;line-height:1.7}
.entry-content pre code{background:none;padding:0}
.entry-content .wp-block-button__link{background:var(--navy);color:#fff;text-decoration:none;border-radius:999px;padding:.8em 1.8em;font-weight:700}
.entry-content .wp-block-button__link:hover{background:var(--navy-dark);color:#fff}
.entry-content .alignwide{margin-left:-60px;margin-right:-60px;max-width:none}
.entry-content .alignfull{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);max-width:100vw;width:100vw}
.entry-content .alignfull img{border-radius:0}
.entry-content .aligncenter{margin-left:auto;margin-right:auto;text-align:center}
.entry-content .alignleft{float:left;margin:.3em 1.5em 1em 0;max-width:50%}
.entry-content .alignright{float:right;margin:.3em 0 1em 1.5em;max-width:50%}
.entry-content::after{content:"";display:table;clear:both}
.entry-content iframe{max-width:100%}
.entry-content .wp-block-embed__wrapper{position:relative}
.col-pages{margin-top:2em;font-weight:700}
.col-pages a,.col-pages > span{display:inline-block;margin:0 .3em}

/* タグ */
.col-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:36px}
.col-tags a{display:inline-block;font-size:13px;color:var(--navy);text-decoration:none;background:var(--gray);padding:.3em .9em;border-radius:999px}
.col-tags a:hover{background:var(--line)}

/* 書いた人 */
.col-author{display:flex;gap:18px;align-items:flex-start;margin-top:40px;padding:22px 24px;border:1px solid var(--line);border-radius:var(--radius)}
.col-author img{flex-shrink:0;width:72px;height:72px;border-radius:50%;object-fit:cover;object-position:50% 25%}
.col-author__label{font-size:12px;font-weight:700;color:var(--muted)}
.col-author__name{font-size:18px;font-weight:900;color:var(--navy);line-height:1.4}
.col-author__name .bebas{font-size:16px;color:#998641;margin-left:.6em;font-weight:400}
.col-author__text{margin-top:6px;font-size:14px;line-height:1.8}

/* ---------- 記事下のCTA ---------- */
.col-cta{position:relative;overflow:hidden;margin:56px 0 0;background:var(--navy);color:#fff;border-radius:16px;padding:44px 40px 36px;text-align:center;box-shadow:0 10px 30px rgba(1,74,115,.18)}
.col-cta::before{content:"";position:absolute;top:-60px;right:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(255,102,0,.22) 0%,rgba(255,102,0,0) 70%);pointer-events:none}
.col-cta__en{position:relative;font-size:22px;letter-spacing:.14em;color:var(--orange);line-height:1}
.col-cta__title{position:relative;margin-top:10px;font-size:clamp(20px,2.6vw,26px);font-weight:900;line-height:1.55}
.col-cta__text{position:relative;margin:14px auto 0;max-width:600px;font-size:15px;line-height:1.95;opacity:.92}
.col-cta__btns{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:26px}
.col-cta__btn{min-height:52px}
.col-cta__btn--sub{background:#40e0d0;color:var(--navy);box-shadow:0 4px 12px rgba(0,0,0,.18)}
.col-cta__btn--sub:hover,.col-cta__btn--sub:focus-visible{background:#2ccbbb;color:var(--navy)}
.col-cta__note{position:relative;margin-top:20px;font-size:12px;opacity:.7}

/* ---------- 前後の記事 ---------- */
.col-postnav{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:40px 0 0}
.col-postnav__item{display:flex;flex-direction:column;gap:4px;padding:16px 20px;border:1px solid var(--line);border-radius:var(--radius);text-decoration:none;color:var(--text);transition:border-color .2s,background-color .2s}
.col-postnav__item:hover{border-color:var(--navy);background:var(--gray)}
.col-postnav__item--next{text-align:right}
.col-postnav__label{font-size:12px;font-weight:700;color:var(--muted)}
.col-postnav__item--prev .col-postnav__label::before{content:"‹ "}
.col-postnav__item--next .col-postnav__label::after{content:" ›"}
.col-postnav__title{font-size:14.5px;font-weight:700;color:var(--navy);line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ---------- 関連記事 ---------- */
.col-related{background:var(--gray);margin-top:72px;padding:64px 0 80px}
.col-related__title{display:flex;flex-direction:column;align-items:center;gap:4px;margin-bottom:32px;font-size:clamp(20px,2.4vw,26px);font-weight:900;color:var(--navy)}
.col-related__title .bebas{font-size:20px;letter-spacing:.14em;color:#998641;font-weight:400}
.col-related__more{margin-top:36px;text-align:center}
.col-single > .container:last-of-type{padding-bottom:0}
.col-single:not(:has(.col-related)) .col-single__container{padding-bottom:88px}

.col-404{text-align:center;display:flex;flex-direction:column;align-items:center;gap:20px}

/* =========================================================
   タブレット・スマホ
   ========================================================= */


/* ---- 記事の要点（抜粋） ---- */
.col-summary{position:relative;margin:0 0 36px;padding:24px 28px 22px;background:#fff;border:1px solid var(--line);border-top:4px solid var(--navy);border-radius:var(--radius);box-shadow:0 10px 28px rgba(1,57,87,.08)}
.col-summary__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.col-summary__en{margin:0;font-size:22px;line-height:1;letter-spacing:.08em;color:var(--orange)}
.col-summary__title{margin:0;font-size:16px;font-weight:900;line-height:1.4;color:var(--navy)}
.col-summary__time{display:inline-flex;align-items:center;gap:5px;margin:0 0 0 auto;font-size:12.5px;font-weight:700;color:var(--muted)}
.col-summary__list{margin:0;padding:0;list-style:none}
.col-summary__list li{display:flex;gap:14px;align-items:flex-start;padding:10px 0;border-top:1px dashed var(--line)}
.col-summary__list li:first-child{border-top:none;padding-top:2px}
.col-summary__num{flex:0 0 auto;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--navy);color:#fff;font-size:18px;line-height:1;letter-spacing:.02em}
.col-summary__text{flex:1;padding-top:3px;font-size:17px;font-weight:700;line-height:1.75;color:var(--text)}
.col-summary__lead{margin:0;font-size:17px;font-weight:700;line-height:1.9;color:var(--text)}

/* ---- 目次（自動生成） ---- */
.col-toc{margin:2.2em 0 2.6em;background:var(--gray);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.col-toc__summary{display:flex;align-items:center;gap:12px;padding:14px 22px;background:var(--navy);color:#fff;cursor:pointer;list-style:none;-webkit-tap-highlight-color:transparent;user-select:none}
.col-toc__summary::-webkit-details-marker{display:none}
.col-toc__summary::marker{content:""}
.col-toc__summary:hover{background:var(--navy-dark)}
.col-toc__summary:focus-visible{outline:3px solid var(--orange);outline-offset:-3px}
.col-toc__label{font-size:16px;font-weight:900;letter-spacing:.12em;color:var(--orange);line-height:1.4}
.col-toc__toggle{display:inline-flex;align-items:center;gap:8px;margin-left:auto;font-size:12.5px;font-weight:700;color:rgba(255,255,255,.85);letter-spacing:.04em}
.col-toc__close-text{display:none}
.col-toc[open] .col-toc__open-text{display:none}
.col-toc[open] .col-toc__close-text{display:inline}
.col-toc__arrow{width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid #fff;transition:transform .25s ease}
.col-toc[open] .col-toc__arrow{transform:rotate(180deg)}
.col-toc__body{padding:12px 24px 14px}
.col-toc[open] .col-toc__body{animation:colTocOpen .3s ease}
@keyframes colTocOpen{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.entry-content .col-toc__list{margin:0;padding:0;list-style:none;counter-reset:toc}
.entry-content .col-toc__list li{position:relative;margin:0;padding:.45em 0 .45em 2.2em;border-top:1px dashed var(--line);font-size:15.5px;line-height:1.6;counter-increment:toc}
.entry-content .col-toc__list li:first-child{border-top:none}
.entry-content .col-toc__list li::before{content:counter(toc,decimal-leading-zero);position:absolute;left:0;top:.42em;font-family:var(--en);font-size:18px;letter-spacing:.04em;color:var(--navy);opacity:.6}
.entry-content .col-toc__list a{color:var(--text);text-decoration:none}
.entry-content .col-toc__list a:hover,.entry-content .col-toc__list a:focus-visible{color:var(--navy);text-decoration:underline}

@media (max-width:1024px){
  .col-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .entry-content .alignwide{margin-left:0;margin-right:0}
}
@media (max-width:767px){
  .col-hero{padding:40px 0 36px}
  .col-hero__lead{font-size:14px;text-align:left}
  .col-list{padding:28px 0 64px}
  .col-cats{gap:6px;margin-bottom:20px}
  .col-cats__item{font-size:13px}
  .col-grid{grid-template-columns:1fr;gap:16px}
  .col-featured{margin-bottom:28px;padding-bottom:28px}
  .col-single{padding-top:20px}
  .col-article__eyecatch{margin-bottom:28px;margin-left:-18px;margin-right:-18px;border-radius:0}
  .entry-content{font-size:18px;line-height:1.95;letter-spacing:.04em}
  .col-toc__summary{padding:13px 18px}
  .col-toc__body{padding:8px 18px 10px}
  .col-summary{padding:18px 18px 16px;margin-bottom:28px}
  .col-summary__time{margin-left:0;flex-basis:100%}
  .col-summary__num{width:30px;height:30px;font-size:16px}
  .col-summary__text,.col-summary__lead{font-size:16.5px}
  .entry-content .col-toc__list li{font-size:15px;letter-spacing:0}
  .entry-content .alignleft,.entry-content .alignright{float:none;margin:0 0 1.5em;max-width:100%}
  .col-author{padding:18px;gap:14px}
  .col-author img{width:56px;height:56px}
  .col-cta{margin-top:44px;padding:34px 20px 28px;border-radius:14px}
  .col-cta__text{text-align:left}
  .col-cta__btns{flex-direction:column}
  .col-cta__btn{width:100%;font-size:15px;padding-left:16px;padding-right:16px;text-wrap:balance;word-break:keep-all;overflow-wrap:anywhere}
  .col-postnav{grid-template-columns:1fr}
  .col-postnav__item--next{text-align:left}
  .col-related{margin-top:56px;padding:48px 0 60px}
  .col-single:not(:has(.col-related)) .col-single__container{padding-bottom:64px}
  .col-breadcrumb span[aria-current]{max-width:14em}
}
@media (prefers-reduced-motion:reduce){
  .col-toc[open] .col-toc__body{animation:none}
  .col-toc__arrow{transition:none}
  .col-card,.col-card__thumb img{transition:none}
}