body, h1, h2, h3, h4, h5, h6, p, li, a, button, input, textarea { font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', sans-serif !important; } .is-layout-constrained:where(:not(.alignfull):not(.alignwide)) > .alignfull { margin-left: 0 !important; margin-right: 0 !important; } .small-text { font-size: 15px; } .standout-button { display: block; /* ブロック要素指定 */ width: 400px; /* 横幅を400pxに */ box-sizing: border-box; /* 要素の幅と高さの計算にパディングとボーダーを含める */ text-align: center; /* テキストを中央配置に */ margin: 20px auto; /* 上下のマージンを20px、左右のマージンを自動で中央揃えに */ padding: 1rem 1rem; /* パディングを1remに */ background-color: #D71815; /* 背景色を赤色に */ color: white !important; /* テキスト色を白に強制指定 */ font-weight: bold; /* テキストを太字に */ border: none; /* 境界線なし */ border-radius: 5px; /* 角の丸みを5pxに設定 */ border-bottom: 7px solid #9E2525; /* ボタンの下側に影を作る */ transition: all 0.1s ease; /* ボタンの影の変化にアニメーションを設定 */ } .standout-button:hover { background-color: #D71815; /* 同じ赤色 */ transform: translateY(4px); /* ボタンを下に少し動かす */ border-bottom: 7px solid transparent; /* border-bottomを透明にする */ } @media (max-width: 390px) { .standout-button { width: 300px!important; } } @media (max-width: 576px) { .standout-button { width: 360px; /* 横幅を400pxに */ } } .send-flow-standout-button { display: block; /* ブロック要素指定 */  width: 330px; /* 横幅を330pxに */ box-sizing: border-box; /* 要素の幅と高さの計算にパディングとボーダーを含める */ text-align: center; /* テキストを中央配置に */ margin: 20px auto; /* 上下のマージンを20px、左右のマージンを自動で中央揃えに */ padding: 1rem 1rem; /* パディングを1remに */ background-color: #D71815; /* 背景色を赤色に */ color: white !important; /* テキスト色を白に強制指定 */ font-weight: bold; /* テキストを太字に */ border: none; /* 境界線なし */ border-radius: 5px; /* 角の丸みを5pxに設定 */ border-bottom: 7px solid #9E2525; /* ボタンの下側に影を作る */ transition: all 0.1s ease; /* ボタンの影の変化にアニメーションを設定 */ } .send-flow-standout-button:hover { background-color: #D71815; /* 同じ赤色 */ transform: translateY(4px); /* ボタンを下に少し動かす */ border-bottom: 7px solid transparent; /* border-bottomを透明にする */ } .table_box{  max-width: 80%; height: 80%; overflow-x: auto; overflow-y: auto; -webkit-overflow-scrolling: touch; } table { border-collapse: collapse; border-spacing: 0; width: 100%; } th, td { vertical-align: middle; padding: 20px; border: 1px solid #ffffff; color: #000; font-size: 14px; text-align: left; white-space: nowrap; } th { background: #ffffff; } td { background: #ffffff; } .sticky_row { position: sticky; top: 0; left: 0; background: none; border-left: none; border-right: none; } .sticky_row::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-left: 1px solid #ffffff; border-right: 1px solid #ffffff; background: #ffffff; z-index: -1; } .sticky_col { position: sticky; top: 0; left: 0; background: none; border-top: none; border-bottom: none; } .sticky_col::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-top: 1px solid #ffffff; border-bottom: 1px solid #ffffff; background: #ccc; z-index: -1; } .sticky_cross { position: sticky; top: 0; left: 0; background: none; border-top: none; border-bottom: none; border-left: none; border-right: none; z-index: 1; } .sticky_cross::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-top: 1px solid #ffffff; border-bottom: 1px solid #ffffff; border-left: 1px solid #ffffff; border-right: 1px solid #ffffff; background: #ccc; z-index: -1; } /*PCでは無効(改行しない)*/ .sma{ display: none; } /*スマートフォンでは有効(改行する)*/ @media screen and (max-width:768px) { .sma{ display: block; } } .fcportal-table { width: 100%; table-layout: fixed; } .fcportal-table td { word-break: break-word; /* 長い単語を改行 */ overflow-wrap: break-word; /* コンテンツ全体に適用 */ white-space: normal; /* 強制的な非改行を無効化 */ } /* 電話番号一覧 */ .tel-standout-button a::before { content: ""; background: url(png/i-phone.png) 50% 50% no-repeat; background-size: 20px 20px; display: inline-block; margin-right: 8px; width: 20px; height: 20px; vertical-align: -15%; } .tel-standout-button { border: 1px solid!important; /* 境界線なし */ border-color: #000; border-radius: 2px; /* 角の丸みを2pxに設定 */ display: block; /* ブロック要素指定 */ width: 400px; /* 横幅を400pxに */ box-sizing: border-box; /* 要素の幅と高さの計算にパディングとボーダーを含める */ text-align: center; /* テキストを中央配置に */ margin: 20px auto; /* 上下のマージンを20px、左右のマージンを自動で中央揃えに */ padding: 1rem 1rem; /* パディングを1remに */ background-color: #fff; /* 背景色を赤色に */ transition: all 0.1s ease; /* ボタンの影の変化にアニメーションを設定 */ } .tel-standout-button:hover { background-color: #cccccc; /* 同じ赤色 */ } .tel-standout-button a::before { content: ""; background: url(png/i-phone.png) 50% 50% no-repeat; background-size: 20px 20px; display: inline-block; margin-right: 8px; width: 20px; height: 20px; vertical-align: -15%; } .sim-standout-button { display: block; /* ブロック要素指定 */ width: 400px; /* 横幅を400pxに */ line-height: 1.7; box-sizing: border-box; /* 要素の幅と高さの計算にパディングとボーダーを含める */ text-align: center; /* テキストを中央配置に */ margin: 1rem auto 3rem auto!important; padding: 0.7rem;; /* パディングを1remに */ background-color: #D71815; /* 背景色を赤色に */ color: white !important; /* テキスト色を白に強制指定 */ border: none; /* 境界線なし */ border-radius: 5px; /* 角の丸みを5pxに設定 */ border-bottom: 7px solid #9E2525; /* ボタンの下側に影を作る */ transition: all 0.1s ease; /* ボタンの影の変化にアニメーションを設定 */ } .sim-standout-button:hover { background-color: #D71815; /* 同じ赤色 */ transform: translateY(4px); /* ボタンを下に少し動かす */ border-bottom: 7px solid transparent; /* border-bottomを透明にする */ } .sim-2 { position: relative!important; font-size: 20px; font-weight: bold; margin: 10px!important; } @media (max-width: 375px) { .sim-standout-button { width: 300px!important; } .sim-2 { font-size: 16px!important; } } @media (max-width: 576px) { .sim-standout-button { width: 380px!important; } .sim-2 { font-size: 20px!important; } } .sim-standout-button .sim-1::before { content: ""; position: absolute!important; background: url(png/%e6%96%99%e9%87%91%e3%82%b7%e3%83%a5%e3%83%9f%e3%83%ac%e3%83%bc%e3%82%b7%e3%83%a7%e3%83%b3%e3%83%90%e3%83%8a%e3%83%bc_%e3%82%a2%e3%82%a4%e3%82%b3%e3%83%b3.png) 50% 50% no-repeat; background-size: 30px 30px; width: 30px; height: 30px; margin-left: -25px!important; margin-top: -5px!important; } .sim-standout-button .sim-3::after { content: ""; position: absolute!important; background: url(png/1758147.png) 50% 50% no-repeat; background-size: 30px 30px; display: inline-block; width: 30px; height: 30px; vertical-align: 10% } .gmap_iframe { aspect-ratio: 3 / 2!important; max-width: 1000px; width: 100%; height: auto; } .__nearbystore::before { content:""; background: url(webp/nearbystore.webp) 50% 50% no-repeat; background-size: 20px 20px; display: inline-block; margin-right: 6px; width: 20px; height: 20px; vertical-align: -11% } .arrow_s a { display: inline-flex; /* 横並びにする */ align-items: center; /* 垂直中央 */ gap: 6px; /* テキストと矢印の隙間 */ text-decoration: none; color: #212529; font-weight: bold; position: relative; } .arrow_s a::after { content: ''; display: inline-block; width: 6px; height: 6px; border-top: 2px solid #212529; border-right: 2px solid #212529; transform: rotate(45deg); transition: transform 0.3s ease; } .arrow_s a:hover::after { transform: rotate(45deg) translate(2px, -2px); /* ホバーで少し動かす */ } .price-qa-icon { display: inline-flex; align-items: center; justify-content: center; font-size: 15px; /* アイコンのサイズ */ color: #bbb; /* グレー */ cursor: pointer; margin-left: 6px; /* テキストとの間隔 */ } .price-qa-icon:hover { color: #333; /* hover時に少し濃く */ } .price-qa-icon.q-icon-right { margin-left: 6px; margin-right: 0; float: right; } .price-qa-icon.q-icon-left { margin-right: 6px; float: left; } /* 吹き出し本体 */ .price-qa-popover { position: absolute; z-index: 999;  max-width: 240px; background: #fff; border: 1px solid #e6e6e6; box-shadow: 0 6px 18px rgba(0,0,0,0.08); border-radius: 8px; padding: 10px 12px; font-size: 13px;  color: #333; line-height: 1.5; } /* タイトル */ .price-qa-popover strong { display: block; font-weight: 600;  margin-bottom: 0px!important; color: #222; font-size: 14px; } /* 吹き出し矢印(二重レイヤー方式) */ .price-qa-popover::before, .price-qa-popover::after { content: ""; position: absolute; left: 16px; width: 10px; height: 10px; transform: rotate(45deg); } .price-qa-popover::before { background: #e6e6e6; /* 外枠 */ bottom: -7px; z-index: -1; } .price-qa-popover::after { background: #fff; /* 中身 */ bottom: -6px; z-index: 1; } @media (max-width: 480px) { .price-qa-popover { max-width: 90vw; font-size: 14px; } } /* 料金表セル内にフレックスで収める */ .price-table-note-cell { display: flex; align-items: center; } .br-sp { display: none; } @media (max-width: 576px) { .br-sp { display: block; } } .blog-mid-cta { text-align: center!important; margin-top: 20px!important; padding: 20px; background-color: #f5f5f5; } .blog-mid-cta p:nth-child(1) { font-size: 13px; color: #555; margin-bottom: 15px; } .img-60 img, .vertical-img img { max-width: 100% !important; /* auto → 100% にする */ max-height: 50vh !important; width: auto !important; height: auto !important; /* 縦横比を保つため追加推奨 */ display: block; /* 中央寄せするなら margin で調整可 */ } /* PCでは通常表示 */ .device-eyecatch { position: relative; z-index: 1; } /* スマホでは背景化 */ @media (max-width: 768px) { .device-eyecatch { position: absolute; top: 0; left: 0; width: 100%; opacity: 0.07; z-index: 0; } .device-eyecatch img { width: 100%; height: auto; object-fit: cover; } /* 背景の下に敷くため、テキスト側を前面に */ .wp-block-column:first-child { position: relative; z-index: 1; } /* 親コンテナはrelativeにする必要あり */ .wp-block-columns { position: relative; } } /* ★★★ 追加: メニューボタンを最前面に ★★★ */ .b__header .__menu { position: relative; z-index: 999; } .custom-h2 { font-size: var(--wp--preset--font-size--regular)!important; font-weight: normal; /* 太字を解除 */ line-height: var(--line-height-sub); } .yearend-info {  margin-top: 20px!important; margin-bottom: 20px!important; padding: 16px; border: 1px solid #ddd; background: #fafafa; } .yearend-info h3 { margin-bottom: 12px; font-size: 1.1rem; font-weight: bold; } /* ===== 横並びコンテナ ===== */ .yearend-cont { display: flex; flex-wrap: wrap; gap: 8px; } /* ===== 1日分ボックス ===== */ .yearend-box { width: calc(20% - 8px); border: 1px solid #ccc; background: #fff; text-align: center; padding: 8px 4px; } .yearend-box dt { font-weight: bold; background: #f0f0f0; padding: 4px; margin-bottom: 6px; font-size: 0.9rem; } .yearend-box dd { margin-top: 10px!important; font-size: 0.85rem; } /* ===== タブレット ===== */ @media screen and (max-width: 860px) { .yearend-box { width: calc(33.333% - 8px); } } /* ===== スマホ ===== */ @media screen and (max-width: 480px) { .yearend-box { width: calc(50% - 8px); } } /* 補足文 */ .yearend-info .note { text-align: center; margin-top: 8px; font-size: 0.85rem; color: #555; } /* ===== 年末年始ブロック内のWP余白リセット ===== */ .yearend-info dl, .yearend-info dt, .yearend-info dd { margin: 0; }