/* 相談ガイドの表示を所有する。ページ枠・購入フォームの責務には入らない。
   leadは全幅で1rem/1.75。旧15px・SP14px・layout-fixesの再上書きをここへ統合。 */
html body .wn-page-companion{box-sizing:border-box;display:grid;grid-template-columns:100px minmax(0,1fr);gap:16px;align-items:center;max-width:1080px;width:calc(100% - 32px);margin:18px auto;padding:18px 22px;border:1px solid #ead8bc;border-radius:22px;background:linear-gradient(120deg,#fffaee,#fff 85%);color:#202b49;clear:both}
/* An embedded companion uses its reading/layout parent's existing gutter. */
html body :is(.page__text,.page-default__content,.hp-listing__description,.post-single__content)>.wn-page-companion{width:100%;max-width:none;margin-inline:0}
html body .wn-page-companion>img{display:block;width:100px;height:100px;object-fit:contain;background:white;border-radius:50%;margin:0;transition:transform .3s ease}
html body .wn-page-companion__body{min-width:0}
html body .wn-page-companion .wn-page-companion__label{font-size:12px!important;font-weight:700;letter-spacing:.06em;color:#925012;margin:0 0 6px;line-height:1.6}
html body .wn-page-companion .wn-page-companion__title{font-size:20px!important;font-weight:700;line-height:1.6!important;color:inherit;margin:0 0 12px}
html body .wn-page-companion .wn-page-companion__lead{font-size:1rem;font-weight:400;line-height:1.75;color:#53627b;margin:0}
html body .wn-page-companion .wn-page-companion__prep{margin:14px 0 0;padding:0;border:0;border-top:1px solid #e3dccc;background:transparent;color:inherit}
html body .wn-page-companion .wn-page-companion__prep-title{margin:0 0 8px;padding:12px 0 0;font-size:18px!important;font-weight:700;line-height:1.8;color:inherit}
html body .wn-page-companion .wn-page-companion__prep-title span{font-size:13px;font-weight:400;display:inline-block}
html body .wn-page-companion ul{display:grid;gap:8px;list-style:disc;margin:12px 0 18px;padding:0 0 0 22px;font-size:14px!important;line-height:1.8}
html body .wn-page-companion li{margin:0;padding:0}
html body .wn-page-companion__link{display:inline-flex;align-items:center;gap:20px;min-height:44px;padding:10px 18px;border-radius:10px;background:#202b49;color:#fff!important;text-decoration:none!important;font-size:14px;font-weight:700;box-sizing:border-box}
html body .wn-page-companion .wn-page-companion__prep-title:focus-visible,html body .wn-page-companion__link:focus-visible{outline:3px solid #a55b11;outline-offset:4px}
html body .wn-page-companion.is-arriving>img{animation:wn-page-greeting .8s ease-out 1}
html body .wn-page-companion details[open] ul{animation:wn-page-list .25s ease-out 1}
/* 広域auto-phraseの「に。」だけの改行を防ぐ、相談見出し固有の例外。 */
html body .wn-page-companion__title{word-break:normal!important;text-wrap:balance}
@keyframes wn-page-greeting{0%{transform:translateY(8px) rotate(-5deg)}60%{transform:translateY(-3px) rotate(3deg)}100%{transform:none}}
@keyframes wn-page-list{from{transform:translateY(4px)}to{transform:none}}
@media(hover:hover){html body .wn-page-companion:hover>img{transform:translateY(-3px)}html body .wn-page-companion__link:hover{background:#35466f}}
@media(max-width:600px){html body .wn-page-companion{grid-template-columns:64px minmax(0,1fr);align-items:start;border-radius:18px}html body .wn-page-companion>img{width:64px;height:64px}html body .wn-page-companion .wn-page-companion__title{font-size:17px!important}html body .wn-page-companion__link{width:100%;justify-content:space-between}html body .wn-page-companion summary{font-size:13px!important}}
html[data-theme=dark] body .wn-page-companion{background:linear-gradient(120deg,#302e29,#202a40);border-color:#74634d;color:#f1f5fc}
html[data-theme=dark] body .wn-page-companion .wn-page-companion__label{color:#ffd49a}
html[data-theme=dark] body .wn-page-companion .wn-page-companion__lead{color:#cbd5e6}
html[data-theme=dark] body .wn-page-companion details{border-color:#69768b}
html[data-theme=dark] body .wn-page-companion__link{border:1px solid #8697b2}
@media(prefers-reduced-motion:reduce){html body .wn-page-companion *{animation:none!important;transition:none!important;transform:none!important}}

/* 狭い画面では説明とチェック項目を画像下の全幅へ回す。 */
@media(max-width:600px){html body .wn-page-companion__body{display:contents}html body .wn-page-companion>img{grid-column:1;grid-row:1/3}html body .wn-page-companion .wn-page-companion__label,html body .wn-page-companion .wn-page-companion__title{grid-column:2;margin:0!important}html body .wn-page-companion .wn-page-companion__lead,html body .wn-page-companion details{grid-column:1/-1}html body .wn-page-companion details{margin-top:6px}}

/* 相談ガイドの全体表示・埋込先別の既存variantをこのファイルに集約。
   通常枠、公式サイトの二列版、記事の折畳み内、商品説明内の違いは既存条件のまま保つ。
   余白はこのownerの通常詳細度で決める。文字・リンクの重要指定はhostの装飾から部品を保護する既存例外。 */

/* polish.cssから相談ガイドの規則を移管。部品の変更はこのowner内で行う。 */
html body .wn-page-companion .wn-consult{margin-top:10px}
@media(max-width:879px){
 html body .wn-page-companion{padding:16px}}

/* layout-fixes.cssから相談ガイドの規則を移管。部品の変更はこのowner内で行う。 */
/* 埋め込み相談とチェック項目は画像列を跨いで収める。 */
html body[class] .wn-page-companion > .wn-consult{
    grid-column: 1 / -1;
    min-width: 0;
}
@media (max-width: 600px) {
    html body[class] .wn-page-companion .wn-page-companion__prep{
        grid-column: 1 / -1;
        min-width: 0;
    }}


/* 記事向けのカード装飾を相談のチェック項目へ適用しない。 */
html body[class] .wn-page-companion .wn-page-companion__prep ul > li{
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    transform: none;
    transition: none;
}
/* ULが外側marker用の22pxを確保するため、LIに余白を二重付与しない。 */
html body[class] .wn-page-companion .wn-page-companion__prep > ul > li{
    display: list-item;
    list-style: disc outside;
    padding: 0 ;
    color: inherit;
}
html body[class] .wn-page-companion .wn-page-companion__prep > ul > li::before{
    content: none;
    display: none;
}
html body[class] .wn-page-companion .wn-page-companion__prep-title{
    line-height: 1.6 !important;
    word-break: normal;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
}
html body[class] .wn-page-companion .wn-page-companion__prep-title::before,
html body[class] .wn-page-companion .wn-page-companion__prep-title::after{
    content: none;
}

/* ui-consistency.cssから相談ガイドの規則を移管。部品の変更はこのowner内で行う。 */
/* ビューポートでなく相談枠自身が620px以下のときに一列に戻す。
   公式サイトの二列版でも狭い親columnに入るため、親幅を判断基準にする。 */

html body[class] .wn-page-companion{
  container: wn-companion / inline-size;
}


@container wn-companion (max-width: 620px) {
  html body[class] .wn-page-companion .wn-page-companion__body{
    display: block;
  }
  
  html body[class] .wn-page-companion .wn-page-companion__body .wn-page-companion__prep{
    margin-top: 20px;
    padding: 20px 0 0;
    border-left: 0;
    border-top: 1px solid #e3dccc;
  }}


html body[class] .wn-page-companion__prep ul{
  grid-template-columns: minmax(0, 1fr);
}

html body[class] .wn-page-companion__prep li{
  min-width: 0;
  overflow-wrap: anywhere;
}

/* wn-body-redesign.cssから相談ガイドの規則を移管。部品の変更はこのowner内で行う。 */
@media(max-width:760px){html body.wn-r26-product .r26-product-terms .wn-page-companion{width:100%;margin-inline:0}}