/*
 * one-lp-promo.css — 自社サービスの宣伝枠の部品 x-olp.promo（resources/views/components/olp/promo.blade.php）だけが読む（@once で 1 回）。
 * 枠の中はトップ（resources/views/index.blade.php）の枠の写しで、見た目は top.css のまま。ここは包みの規則だけ（写しの HTML は変えない）:
 *  1. 字をトップの body の値に戻す（書体・14px・行間 1.5・#222。769px 以下は 13px。.olp の 16px・行間 1.8・line-break:strict・見出しの auto-phrase を受けない）
 *  2. ヒーローの広い行を本文の幅いっぱいに（80% では枠が折れる）・前の要素（/domain の検索結果の例）との間 32px
 *  3. 600px 未満は右に「?」の分の余白（ほかの部品の文と同じ「?」の 4px 手前まで）
 *  4. 2026-09-29 20:0x のパートナーの決定 2: 色の濃さが足りない文字を濃くする（#0F8EFF → --slp-cta #006FC9。トップは変えない）
 *     GWS: プラン名・価格の文字／サーバー: 「SERVER」の白い文字の地（帯）と製品名
 *     GWS の「詳しく見る」（#top_gws_btn・.btn-orange）も同じ考え方（W9 の検証役の指摘・WCAG 1.4.3）: 白の文字 on #FF7700 は 2.66:1 なので、
 *     地と線を同じ色相の濃い橙 --olp-promo-orange（#B85600・白の文字と 4.81:1）に。ホバー（白地に橙の文字）の文字と線も同じ色。文字は白のまま
 *  5. サーバーの枠（トップは画面の幅いっぱいの帯）を本文の列の中の角の丸い帯にする
 * 色は .olp のトークン（brand-guide §2.1）と、宣伝枠だけの色 --olp-promo-orange（トップの橙を濃くした 1 色・GWS の枠の下に 1 回だけ定義）。
 * 規則は全部 .olp の下（ヘッダー・フッター・トップに効かせない）
 */
.olp .olp-hero__wide:has(>.olp-promo){width:100%}
.olp .olp-hero__wide>*+.olp-promo{margin-top:var(--sp-6)}
.olp .olp-promo{font-family:Roboto,"Hiragino Kaku Gothic ProN","Hiragino Sans",Arial,Meiryo,sans-serif;font-size:14px;line-height:1.5;color:var(--slp-ink);line-break:auto;word-break:normal}
.olp .olp-promo :is(h2,h3){word-break:normal}
@media (max-width:769px){.olp .olp-promo{font-size:13px}}
.olp .olp-promo--gws :is(.gws-promo-plan-name span,.gws-promo-plan-price span,.gws-promo-plan-price strong){color:var(--slp-cta)}
.olp .olp-promo--gws{--olp-promo-orange:#B85600}
.olp .olp-promo--gws .btn-orange{background-color:var(--olp-promo-orange);border-color:var(--olp-promo-orange)}
.olp .olp-promo--gws .btn-orange:hover{background-color:var(--slp-card);border-color:var(--olp-promo-orange);color:var(--olp-promo-orange)}
.olp .olp-promo--rs .server{background:var(--slp-cta);border-radius:var(--slp-r-l);padding:0 24px}
.olp .olp-promo--rs .server .txt .tit{color:var(--slp-cta)}
.olp .olp-promo--rs .server>.wrap{padding:40px 0 48px}
.olp .olp-promo--rs .sec-tit{text-wrap:balance}
@media (min-width:961px){.olp .olp-promo--rs .server .flex{padding:60px 48px;gap:48px}}
@media (max-width:960px){.olp .olp-promo--rs .server{padding:0 16px}}
@media (max-width:769px){.olp .olp-promo--rs .server{padding:0 12px}.olp .olp-promo--rs .server>.wrap{padding:40px 0}.olp .olp-promo--rs .txt p{word-break:auto-phrase;text-wrap:pretty}}
@media (max-width:599.98px){.olp .olp-promo--gws{margin-right:max(0px,calc(var(--olp-help-gap) - 20px - 1px))}.olp .olp-promo--rs{margin-right:max(0px,calc(var(--olp-help-gap) - 12px - 20px))}.olp .olp-promo--gws .gws-promo-heading-logo{max-width:100%}.olp .olp-promo--gws .gws-promo-heading-logo img{min-width:0}.olp .olp-promo--gws .gws-promo-desc{word-break:auto-phrase;text-wrap:balance}}