@charset "UTF-8";
.sbs-sp-contact { display: none; }
/* =====================================================================
   シンビサプリ：現行サイト移植部分（.sbs-real）の最低限レスポンシブ
   html/user_data/assets/css/sbs_responsive.css（customize.css の後に読込）
   PC（980px以上）の見た目には一切影響しない
   ===================================================================== */
@media (max-width: 979px) {

  /* ---------- 共通：固定幅のブロックを画面幅に収める ---------- */
  .sbs-real div, .sbs-real p, .sbs-real ul, .sbs-real ol, .sbs-real li, .sbs-real dl,
  .sbs-real table, .sbs-real form, .sbs-real section, .sbs-real iframe, .sbs-real h2, .sbs-real h3 {
    max-width: 100%;
    box-sizing: border-box;
  }
  .sbs-real img { max-width: 100%; height: auto; }
  .sbs-real img[height="52"] { height: auto !important; }
  .sbs-real .box960, .sbs-real .box1100, .sbs-real #maincolumn { width: auto; }
  .sbs-real .galleria-track { max-width: none; }               /* スライダーの帯は除外 */
  .sbs-real img.sbs-rollover { display: none !important; }    /* タッチ端末ではホバー画像不要 */
  .sbs-real input[type="text"], .sbs-real textarea, .sbs-real select { max-width: 100%; box-sizing: border-box; }
  .ec-overlayRole { max-width: 100vw; }
  body { overflow-x: hidden; }

  /* ---------- コンテンツ枠・サイドバー ---------- */
  .sbs-contents { padding: 12px 10px 20px; background-size: auto; }
  .sbs-layout-wide .sbs-contents { padding: 0; }
  .ec-layoutRole .ec-layoutRole__contents { display: block; width: auto; max-width: 100%; }
  .ec-layoutRole .ec-layoutRole__mainWithColumn { width: auto !important; max-width: 100%; }
  .ec-layoutRole__left.sbs-side { display: none !important; }  /* 左メニューはスマホでは非表示（グロナビで代替） */

  /* ---------- ヘッダー ---------- */
  .sbs-real #header { height: auto; }
  /* 上部のSEOテキストは1行のティッカー（動きを減らす設定の端末では「…」で省略） */
  .sbs-real #header h1, .sbs-real #header .sbs-h1 { display: block; margin: 0; padding: 5px 10px; height: auto; width: auto;
    font-size: 10px !important; line-height: 1.4; font-weight: normal; color: #000; white-space: nowrap; overflow: hidden;
    text-overflow: ellipsis; background: #f3f3f3 none !important; border-bottom: 1px solid #e5e5e5; }
  /* 横に流れるティッカー（sbs_real.js で span.sbs-ticker を付与） */
  .sbs-real #header .sbs-ticker { display: inline-block; padding-left: 35%; animation: sbs-ticker 18s linear infinite; }
  .sbs-real #header h1:has(.sbs-ticker), .sbs-real #header .sbs-h1:has(.sbs-ticker) { text-overflow: clip; padding-left: 0; padding-right: 0; }
  .sbs-real #header .left, .sbs-real #header .right { float: none; width: auto; }
  .sbs-real #header .box { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px; padding: 6px 8px; height: auto; }
  .sbs-real #header .box p { float: none; margin: 0; }
  .sbs-real #header .box p:first-child img { width: 150px; }
  .sbs-real #header .box p:nth-child(2) img { width: 120px; }
  .sbs-real #header .box p.f_right { width: 100%; text-align: center; }
  .sbs-real #header .right { position: static; display: flex; gap: 6px; padding: 0 8px 8px; }
  .sbs-real #header .right p { flex: 1 1 50%; margin: 0; }
  .sbs-real #header .right p:empty { display: none; }
  .sbs-real #header .right { justify-content: center; }
  /* ログイン・カートは画像をやめて、同じ配色の文字ボタンにする（画面幅に合わせて伸縮） */
  .sbs-real #header .right p { text-align: center; max-width: 260px; }
  .sbs-real #header .right p a { display: flex; align-items: center; justify-content: center; gap: 8px; height: 44px;
    border-radius: 6px; color: #fff; font-size: 14px; font-weight: bold; text-decoration: none; letter-spacing: .03em;
    box-shadow: 0 2px 0 rgba(0,0,0,.15); }
  .sbs-real #header .right p:nth-child(1) a { background: linear-gradient(#a4d23a, #7fb51a); border: 1px solid #6f9c16; }
  .sbs-real #header .right p:nth-child(2) a { background: linear-gradient(#ff8fae, #f2587f); border: 1px solid #e04870; }
  .sbs-real #header .right p a img { display: none; }
  .sbs-real #header .right p a::before { font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 15px; }
  .sbs-real #header .right p:nth-child(1) a::before { content: "\f007"; }
  .sbs-real #header .right p:nth-child(2) a::before { content: "\f07a"; }
  .sbs-real #header .right p:nth-child(1) a::after { content: "会員ログイン"; }
  .sbs-real #header .right p:nth-child(2) a::after { content: "買い物かごへ"; }

  /* ---------- グローバルナビ（3列×2段） ---------- */
  .sbs-real #gnavi { height: auto; }
  .sbs-real #gnavi ul { display: grid; grid-template-columns: repeat(3, 1fr); width: auto; padding: 0; margin: 0; }
  /* グローバルナビ：スマホでは画像を使わず CSS だけで描画（緑のグラデーション＋白文字＋アイコン） */
  .sbs-real #gnavi { background: #7fb51a; }
  .sbs-real #gnavi li { float: none; width: auto; margin: 0; height: auto; background: none; border: 0; }
  .sbs-real #gnavi li img { display: none !important; }
  .sbs-real #gnavi li a { display: flex; align-items: center; justify-content: center; gap: 8px; height: 46px; padding: 0 6px;
    background: linear-gradient(#a8d63f, #86bb1c); border-right: 1px solid #76a518; border-bottom: 1px solid #76a518;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.35); color: #fff !important; font-size: 14px; font-weight: bold;
    letter-spacing: .08em; text-decoration: none; text-shadow: 0 1px 1px rgba(0,0,0,.25); white-space: nowrap; }
  .sbs-real #gnavi li a:active { background: linear-gradient(#86bb1c, #a8d63f); }
  .sbs-real #gnavi li a::before { font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 15px; width: 1.2em; text-align: center; }
  .sbs-real #gnavi li:nth-child(1) a::before { content: "\f015"; }
  .sbs-real #gnavi li:nth-child(2) a::before { content: "\f4d8"; }
  .sbs-real #gnavi li:nth-child(3) a::before { content: "\f03a"; }
  .sbs-real #gnavi li:nth-child(4) a::before { content: "\f005"; }
  .sbs-real #gnavi li:nth-child(5) a::before { content: "\f02d"; }
  .sbs-real #gnavi li:nth-child(6) a::before { content: "\f1ad"; }
  .sbs-real #gnavi li:nth-child(1) a::after { content: "トップページ"; }
  .sbs-real #gnavi li:nth-child(2) a::after { content: "初めてのお客様へ"; }
  .sbs-real #gnavi li:nth-child(3) a::after { content: "商品一覧"; }
  .sbs-real #gnavi li:nth-child(4) a::after { content: "キャンペーン"; }
  .sbs-real #gnavi li:nth-child(5) a::after { content: "ご利用ガイド"; }
  .sbs-real #gnavi li:nth-child(6) a::after { content: "会社概要"; }

  /* ---------- 横並び（float）を縦積みに ---------- */
  .sbs-real #pagebtm_contactbox .f_left, .sbs-real #footer .f_right, .sbs-real #mark_cpr .f_left { float: none; text-align: center; }
  .sbs-real ul.heightLineParent { margin-right: 0; margin-left: 0; }

  /* ---------- トップ：商品タブ・商品ボックス ---------- */
  /* 商品タブ：画像タブをやめて3等分の文字タブに */
  .sbs-real #item_container_tab { height: auto; margin-bottom: 10px; }
  .sbs-real #item_container_tab ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; height: auto; margin: 0; padding: 0; }
  .sbs-real #item_container_tab li { float: none; width: auto !important; height: auto !important; min-height: 46px; margin: 0 !important;
    padding: 6px 4px; display: flex; align-items: center; justify-content: center; text-align: center; text-indent: 0 !important;
    background: #fff none !important; border: 1px solid #8ec21f; border-radius: 4px 4px 0 0; color: #5f8f12; font-size: 12px;
    font-weight: bold; line-height: 1.35; cursor: pointer; overflow: visible; }
  .sbs-real #item_container_tab li.active { background: #8ec21f none !important; color: #fff; }
  /* 商品エリアの背景画像（PC用の緑の縦線・枠）を外し、スマホ用のすっきりした枠に */
  .sbs-real #item_container, .sbs-real #item_container_inner, .sbs-real #item_container .list_box { background: none !important; }
  .sbs-real #item_container_inner { padding: 12px 0 0 !important; border-top: 3px solid #8ec21f; }
  .sbs-real #item_container .list_box { padding: 0 !important; }
  .sbs-real #item_container .txt_h2 { width: auto !important; margin: 0 0 14px !important; padding: 8px 10px !important; font-size: 15px; line-height: 1.5; text-align: center; }
  .sbs-real #item_list_box .wrap_lineup-top { margin: 0 0 14px !important; padding: 12px !important; border: 1px solid #ddd !important; border-radius: 6px; background: #fff; }
  .sbs-real #item_list_box .wrap_lineup-top h3.subttl_lb { margin: 0 0 4px !important; font-size: 16px; line-height: 1.4; }
  .sbs-real #item_list_box .wrap_lineup-top h4 { margin: 0 0 10px !important; padding: 0 !important; font-size: 12px; line-height: 1.5; text-align: left; }
  .sbs-real #item_list_box .contents_info { width: auto !important; }
  .sbs-real #item_list_box .clickbox h3, .sbs-real #item_list_box .clickbox p.min_mid { text-align: left !important; font-size: 16px; padding-left: 10px; }
  .sbs-real #item_list_box .clickbox > p:not(.min_mid) { text-align: left; font-size: 13px; }
  .sbs-real #item_list_box .contents_info_left, .sbs-real #item_list_box .contents_info_right { float: none !important; width: auto !important; margin: 0 0 10px !important; }

  /* 成分からさがす／目的・お悩みから探す：表を縦積みにし、商品は3列のカードに */
  .sbs-real #seibun_list_box table, .sbs-real #onayami_list_box table,
  .sbs-real #seibun_list_box tbody, .sbs-real #onayami_list_box tbody,
  .sbs-real #seibun_list_box tr, .sbs-real #onayami_list_box tr,
  .sbs-real #seibun_list_box td, .sbs-real #onayami_list_box td { display: block; width: auto !important; height: auto !important; }
  .sbs-real #seibun_list_box tr, .sbs-real #onayami_list_box tr { margin-bottom: 14px; border: 1px solid #e3e3e3; border-radius: 4px; overflow: hidden; background: #fff; }
  .sbs-real #seibun_list_box th, .sbs-real #onayami_list_box th { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px;
    width: auto !important; height: auto !important; padding: 10px 12px !important; background: #f3f8e8; border: 0 !important; text-align: left; }
  .sbs-real #seibun_list_box th p, .sbs-real #onayami_list_box th p { float: none !important; margin: 0 !important; }
  .sbs-real #seibun_list_box th .img img { width: 40px; height: 40px; }
  .sbs-real #seibun_list_box th .name, .sbs-real #onayami_list_box th .name { flex: 1 1 auto; font-size: 15px; font-weight: bold; }
  .sbs-real #seibun_list_box th .btn { flex: 0 0 100%; }
  .sbs-real #seibun_list_box th .btn a { margin: 0 auto; }
  .sbs-real #seibun_list_box td, .sbs-real #onayami_list_box td { padding: 10px 12px !important; border: 0 !important; }
  .sbs-real #seibun_list_box td .ttl, .sbs-real #onayami_list_box td .ttl { width: auto !important; margin: 0 0 10px !important; padding: 6px 10px; font-size: 13px; text-align: left; }
  .sbs-real #seibun_list_box td ul, .sbs-real #onayami_list_box td ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 8px; margin: 0; padding: 0; }
  .sbs-real #seibun_list_box td li, .sbs-real #onayami_list_box td li { float: none !important; width: auto !important; height: auto !important; margin: 0 !important;
    text-align: center; font-size: 11px; line-height: 1.4; }
  .sbs-real #seibun_list_box td li img, .sbs-real #onayami_list_box td li img { width: 60px; height: 60px; }
  .sbs-real #seibun_list_box .txt_h2, .sbs-real #onayami_list_box .txt_h2 { width: auto !important; }

  /* 商品カードは1列に（左右交互のfloatを解除） */
  .sbs-real #item_list_box ul.heightLineParent > li, .sbs-real #item_list_box ul.heightLineParent > a > li,
  .sbs-real #item_list_box ul.heightLineParent > span > li { float: none !important; width: auto !important; box-sizing: border-box; height: auto !important; margin: 0 0 12px !important; }
  .sbs-real #item_list_box ul.heightLineParent { margin: 0 !important; }
  .sbs-real #item_list_box .clickbox { width: auto; }
  .sbs-real #item_list_box li.min_clickbox .btn_wrapm { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 10px; width: auto !important;
    max-width: 330px; margin: 0 auto; padding: 12px; box-sizing: border-box; }
  .sbs-real #item_list_box li.min_clickbox .btn_wrapm::after { display: none; }
  .sbs-real #item_list_box li.min_clickbox .btn_wrapm p { float: none !important; width: auto !important; margin: 0 !important;
    text-align: center; font-size: 12px; line-height: 1.5; }
  .sbs-real #item_list_box li.min_clickbox .btn_wrapm p:first-child { grid-column: 1 / -1; }
  .sbs-real #item_list_box li.min_clickbox .btn_wrapm p a { display: block; margin-bottom: 2px; }
  .sbs-real .list, .sbs-real .list_link, .sbs-real .products_lineup_list { width: auto; }
  .sbs-real .list .left, .sbs-real .list .right, .sbs-real .list_box .left, .sbs-real .list_box .right { float: none; width: auto; margin: 0 auto 10px; }
  .sbs-real iframe { width: 100%; }
  .sbs-real .galleria-slide img { width: 100%; }

  /* ---------- トップ：メディア掲載情報／ご愛用者訪問記 ---------- */
  .sbs-real #top_publicity, .sbs-real #top_customer { float: none !important; width: auto !important; margin: 0 0 24px !important; }
  .sbs-real #top_publicity > p img, .sbs-real #top_customer > p img { width: 100%; max-width: 420px; display: block; }
  .sbs-real #top_publicity .about { height: auto !important; width: auto !important; padding: 14px; background: #f3f3f3; box-sizing: border-box; }
  .sbs-real #top_publicity .about .mediatxt { text-align: left; line-height: 1.7; margin-bottom: 12px; }
  .sbs-real #top_publicity .about .center { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .sbs-real #top_publicity .about .center p { float: none !important; margin: 0 !important; }
  .sbs-real #top_publicity .about .center br { display: none; }
  .sbs-real #top_publicity .about .center img { width: 100%; height: auto; box-shadow: 0 1px 3px rgba(0,0,0,.15); }
  .sbs-real #top_publicity #magazine_link { text-align: right; margin-top: 10px; }
  .sbs-real #top_customer > .clearfix { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .sbs-real #top_customer > .clearfix::after { display: none; }
  .sbs-real #top_customer .heightLine-pub_cus { float: none !important; width: auto !important; height: auto !important; margin: 0 !important;
    padding: 10px; background: #f3f3f3; box-sizing: border-box; }
  .sbs-real #top_customer .heightLine-pub_cus img { width: 100%; height: auto; }
  .sbs-real #top_customer .heightLine-pub_cus p.font_12 { margin: 6px 0 0 !important; text-align: center; line-height: 1.6; }
  .sbs-real #top_customer .heightLine-pub_cus p.font_12 br { display: none; }

  /* ---------- お問い合わせ帯・ガイド帯 ---------- */
  .sbs-pagebtm-below, body .sbs-pagebtm-below { width: auto; padding: 0 10px 30px; }
  /* お電話・メールの問い合わせ：画像バナーを隠し、文字＋ボタンで表示 */
  .sbs-real #pagebtm_contactbox { display: none; }
  .sbs-real .sbs-sp-contact { display: block; margin: 30px 0 15px; padding: 16px 14px; background: #f3f8e8;
    border: 1px solid #cfe3a3; border-radius: 6px; text-align: center; }
  .sbs-real .sbs-sp-contact__lead { margin: 0 0 10px; font-size: 14px; font-weight: bold; color: #333; line-height: 1.5; }
  .sbs-real .sbs-sp-contact__tel, .sbs-real .sbs-sp-contact__mail { display: flex; align-items: center; justify-content: center; gap: 8px;
    height: 50px; border-radius: 6px; color: #fff !important; font-weight: bold; text-decoration: none; box-shadow: 0 2px 0 rgba(0,0,0,.15); }
  .sbs-real .sbs-sp-contact__tel { background: linear-gradient(#a4d23a, #7fb51a); border: 1px solid #6f9c16; font-size: 22px; letter-spacing: .04em; }
  .sbs-real .sbs-sp-contact__time { margin: 6px 0 12px; font-size: 12px; color: #555; }
  .sbs-real .sbs-sp-contact__mail { background: linear-gradient(#ff8fae, #f2587f); border: 1px solid #e04870; font-size: 15px; }
  .sbs-real #pagebtm_guide { width: auto; height: auto; background: #f0f0f0; padding: 10px; }
  .sbs-real #pagebtm_guide table, .sbs-real #pagebtm_guide tbody { display: block; width: 100%; }
  .sbs-real #pagebtm_guide tr:first-child { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .sbs-real #pagebtm_guide tr:nth-child(2) { display: none; }       /* 説明文はスマホでは省略 */
  .sbs-real #pagebtm_guide th { display: block; width: auto !important; height: auto !important; padding: 0 !important; margin: 0; background: none !important; border: 0; }
  .sbs-real #pagebtm_guide th a { display: block; padding: 12px 10px 12px 26px; background: #fff; border: 1px solid #ddd;
    border-left: 4px solid #8ec21f; color: #333; font-size: 13px; text-decoration: none; position: relative; line-height: 1.4; }
  .sbs-real #pagebtm_guide th a::before { content: ""; position: absolute; left: 10px; top: 50%; margin-top: -4px;
    border: 4px solid transparent; border-left: 6px solid #8ec21f; }
  .sbs-real #pagebtm_guide th br { display: none; }

  /* ---------- フッター ---------- */
  .sbs-real #footer #link01, .sbs-real #footer #link02 { height: auto; }
  .sbs-real #footer #link01 .box960 { padding: 10px; line-height: 2; height: auto; }
  .sbs-real #footer #link02 ul { float: none; display: flex; flex-wrap: wrap; gap: 4px 14px; padding: 10px; }
  .sbs-real #footer #link02 li { float: none; margin: 0; }
  .sbs-real #footer #link02 .f_right { text-align: center; }
  .sbs-real #copyright { text-align: center; padding: 0 10px 10px; }

  /* ---------- /welcome ---------- */
  .sbs-real .products_lineup_list ul { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .sbs-real .products_lineup_list li { float: none; width: auto; margin: 0; height: auto !important; }
  .sbs-real .products_lineup_list .heightline-products { height: auto !important; }
  .sbs-real #products_lineup .products_lineup_list ul li .data { width: auto; overflow: hidden; }
  .sbs-real #products_lineup .products_lineup_list ul li .photo { margin-right: 12px; }

  .sbs-real #catchbox #catchtxt { width: auto; height: auto; padding: 12px; background: none; }
  .sbs-real #catchbox h3 { margin-bottom: 0; }
  .sbs-real #welcome_about .oyakusoku_wrap { padding: 190px 12px 15px; background-position: center 10px !important; min-height: 0; height: auto !important; }
  .sbs-real #welcome_container li { float: none; display: inline-block; vertical-align: top; }

  /* ---------- 下層共通：ご利用ガイド系のタブと本文枠 ---------- */
  .sbs-real #welcome_tabs_wrap { background: none; padding-bottom: 0; margin-bottom: 15px; }
  .sbs-real #welcome_tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; height: auto; margin: 0 0 12px; }
  .sbs-real #welcome_tabs li { float: none; width: auto; margin: 0; }
  .sbs-real #welcome_tabs li img { display: none !important; }
  .sbs-real #welcome_tabs a, .sbs-real #welcome_tabs span { display: flex; align-items: center; justify-content: center; min-height: 46px; padding: 6px 8px;
    border: 1px solid #8ec21f; border-radius: 4px; background: #fff !important; color: #5f8f12 !important; font-size: 13px; font-weight: bold;
    line-height: 1.35; text-align: center; text-decoration: none; }
  .sbs-real #welcome_tabs a::after, .sbs-real #welcome_tabs span::after { content: attr(data-label); }
  .sbs-real #welcome_tabs .is-current { background: #8ec21f !important; color: #fff !important; }
  .sbs-real #welcome_tabs li { background: none !important; height: auto !important; }
  .sbs-real h2#pagettl { height: auto; min-height: 0; line-height: 1.4; padding-top: 6px; padding-bottom: 6px; background-size: auto 100%; }
  .sbs-real #welcome_about { width: auto; background: none; padding: 15px 0 0; border-top: 3px solid #8ec21f; }
  .sbs-real #welcome_about img { height: auto; }
  .sbs-real #welcome_about .oyakusoku_wrap { margin-left: 0; margin-right: 0; }
  .sbs-real #catchbox h3 img, .sbs-real #welcome_about > p img, .sbs-real #welcome_about > div > p img { width: 100%; }
  /* ご利用ガイド：メニューカード（枠を1本の線で囲み、アイコンは右上に小さく） */
  .sbs-real #guide_menu_list ul { margin: 0 !important; display: block; }
  .sbs-real #guide_menu_list ul li { float: none !important; width: auto !important; margin: 0 0 14px !important; padding: 0 0 14px !important;
    background: #fff !important; border: 1px solid #ddd; border-radius: 4px; overflow: hidden; }
  .sbs-real #guide_menu_list ul li > p img { width: 100%; display: block; }
  .sbs-real #guide_menu_list ul li .guide_menu_box { border: 0 !important; padding: 12px 12px 0 !important;
    background-size: 56px auto !important; background-position: right 10px top 8px !important; }
  .sbs-real #guide_menu_list ul li .guide_menu_box .txt { padding-right: 66px !important; margin-bottom: 12px; line-height: 1.7; }
  .sbs-real #guide_menu_list ul li .guide_menu_box a { display: block; text-align: center; }
  .sbs-real #guide_menu_list ul li .guide_menu_box a img { width: 100%; max-width: 284px; }
  /* 商品ラインナップ（welcome / guide 共通）：写真＋情報の横並びカード */
  .sbs-real #products_lineup_container { margin-top: 30px; padding-bottom: 0; background: none !important; }
  .sbs-real #products_lineup_container > p img { width: 100%; }
  .sbs-real #products_lineup { background: #f6f6f6 !important; padding: 10px !important; border: 1px solid #e3e3e3; border-top: 0; }
  .sbs-real #products_lineup .products_lineup_list { width: auto !important; margin: 0 !important; padding: 0 !important; }
  .sbs-real #products_lineup .products_lineup_list ul { display: grid !important; grid-template-columns: 1fr !important; gap: 10px; margin: 0 !important; }
  .sbs-real #products_lineup .products_lineup_list ul > a { display: block; text-decoration: none; }
  .sbs-real #products_lineup .products_lineup_list ul li { float: none !important; width: auto !important; height: auto !important; margin: 0 !important;
    padding: 12px; background: #fff; border: 1px solid #e3e3e3; border-radius: 4px; }
  .sbs-real #products_lineup .products_lineup_list .heightline-products { height: auto !important; }
  .sbs-real #products_lineup .products_lineup_list ul li .clearfix { display: flex; gap: 14px; align-items: flex-start; }
  .sbs-real #products_lineup .products_lineup_list ul li .clearfix::after { display: none; }
  .sbs-real #products_lineup .products_lineup_list ul li .photo { float: none !important; flex: 0 0 80px; width: 80px !important; margin: 0 !important; }
  .sbs-real #products_lineup .products_lineup_list ul li .data { float: none !important; flex: 1 1 auto; width: auto !important; }
  .sbs-real #products_lineup .products_lineup_list ul li .data .center { text-align: left; }
  .sbs-real #products_lineup .products_lineup_list ul li > p.center img { width: 100%; max-width: 240px; }
  .sbs-real #products_lineup .btn_lineup { margin: 10px 0 0; }
  .sbs-real #products_lineup .btn_lineup img { width: 100%; max-width: 304px; }
  .sbs-real .guide_con, .sbs-real .guide_sub_con, .sbs-real .guide_sub_con dl, .sbs-real .guide_sub_con dd,
  .sbs-real .carriage_list, .sbs-real .carriage_list li { width: auto !important; float: none; padding-left: 0; padding-right: 0; }
  .sbs-real #under_guidebtn { display: grid; grid-template-columns: 1fr; gap: 8px; height: auto; padding: 12px; margin-bottom: 20px; background: #eee; }
  .sbs-real #under_guidebtn p { float: none; margin: 0; text-align: center; }
  .sbs-real #under_guidebtn p img { width: 100%; max-width: 250px; }
  /* 定期お届け便 */
  .sbs-real #teiki_contents { width: auto; }
  .sbs-real #welcome_about #taikicatch { position: static; width: auto; height: auto; margin: 0 0 15px; }
  .sbs-real #welcome_about #taikicatch img { width: 100%; }
  .sbs-real #teiki_contents img { width: auto; max-width: 100%; }
  .sbs-real #teiki_contents > p img, .sbs-real #teiki_contents .borderimg { width: 100%; }

  /* ガイド系の本文内で左右に並んだ画像（返品・交換／返品・返金 等）は縦積み・中央寄せ */
  .sbs-real #welcome_about .f_left, .sbs-real #welcome_about .f_right { float: none !important; text-align: center; margin: 0 0 12px !important; }
  .sbs-real #welcome_about .f_left img, .sbs-real #welcome_about .f_right img { max-width: 100%; height: auto; }
  .sbs-real #sb_contents .f_left img, .sbs-real #sb_contents .f_right img { width: 100%; max-width: 360px; }
  .sbs-real #sb_contents p.clear img { width: 100%; }
  .sbs-real .guide_sub_con .sub_ttl { font-size: 17px; }

  /* 定期お届け便：特典・コース例・商品一覧 */
  .sbs-real #tokuten_list ul { margin: 0 !important; display: grid; grid-template-columns: 1fr; gap: 10px; }
  .sbs-real #tokuten_list ul li { float: none !important; width: auto !important; margin: 0 !important; text-align: center; }
  .sbs-real #tokuten_list ul li img { width: 100%; max-width: 360px; }
  .sbs-real #teiki_contents .midashi { font-size: 15px; margin-bottom: 15px; }
  .sbs-real #teiki_contents .f_left, .sbs-real #teiki_contents .f_right { float: none !important; text-align: center; margin: 0 0 10px; }
  .sbs-real #teiki_contents .f_left img, .sbs-real #teiki_contents .f_right img { width: 100%; max-width: 360px; }
  .sbs-real #teiki_products_container { background: none !important; padding: 0 !important; margin: 20px 0 !important; }
  .sbs-real #teiki_products { background: none !important; padding: 0 !important; }
  .sbs-real #teiki_products_list { background: #fff !important; width: auto !important; padding: 12px !important; border: 1px solid #e3e3e3; border-top: 4px solid #8ec31f; }
  .sbs-real #teiki_products_list .products_wrap { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 22px !important; padding-bottom: 16px; border-bottom: 1px dotted #ccc; }
  .sbs-real #teiki_products_list .products_wrap::after { display: none; }
  .sbs-real #teiki_products_list .products_wrap .thumb { float: none !important; flex: 0 0 90px; width: 90px !important; margin: 0 !important; }
  .sbs-real #teiki_products_list .products_wrap .thumb img { width: 100%; }
  .sbs-real #teiki_products_list .products_wrap .detail { float: none !important; flex: 1 1 200px; width: auto !important; }
  .sbs-real #teiki_products_list .products_wrap .detail table { border-spacing: 3px 0; }
  .sbs-real #teiki_products_list .products_wrap .detail table th { width: 64px; padding: 8px 4px; font-size: 11px; }
  .sbs-real #teiki_products_list .products_wrap .detail table td { padding: 5px 6px; }
  .sbs-real #teiki_products_list .products_wrap .detail .price { width: auto; float: left; margin-right: 6px; }
  .sbs-real #teiki_products_list .products_wrap .detail .submit, .sbs-real #teiki_products_list .products_wrap .detail p:last-child { float: none !important; text-align: center; margin-top: 10px; }
  .sbs-real #teiki_products_list .midashi { font-size: 15px; }

  /* ---------- 雑誌掲載情報 ---------- */
  .sbs-real #magazine_detail .gallery, .sbs-real #magazine_detail .gallery2, .sbs-real #magazine_detail .gallery3 {
    width: auto !important; height: auto !important; display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: flex-start; padding: 12px !important; margin: 0 0 12px !important; }
  .sbs-real #magazine_detail .gallery > p:first-child, .sbs-real #magazine_detail .gallery2 > p:first-child, .sbs-real #magazine_detail .gallery3 > p:first-child { flex: 0 0 80px; float: none !important; margin: 0 !important; }
  .sbs-real #magazine_detail [class^="txt"] { float: none !important; width: auto !important; min-width: 0; flex-basis: 0; height: auto !important; margin: 0 !important; padding: 0 !important; flex: 1; line-height: 1.7; }
  .sbs-real #magazine_detail [class^="txt"] br { display: none; }
  .sbs-real #magazine_detail .itemlink { position: static !important; display: block; flex: 0 0 100%; text-align: right; }
  /* 記事内の長いURLリンクは折り返す */
  .sbs-real #contents_wrap a, .sbs-real .content_box a { word-break: break-all; }

  /* ---------- キャンペーン ---------- */
  .sbs-real #campaign_detail div[style*="width:710px"] { width: auto !important; height: auto !important; padding: 5px !important; }
  .sbs-real #step1txt, .sbs-real #step3txt { width: auto !important; height: auto !important; padding: 12px !important;
    background: #fff5f8 none !important; border: 1px solid #f6c5d2; border-radius: 4px; line-height: 1.7 !important; margin: 0 0 12px; }
  .sbs-real #step1txt br, .sbs-real #step3txt br { display: none; }
  .sbs-real #step1txt p, .sbs-real #step3txt p { white-space: normal; }
  /* まとめ売り（/cp/360）：PC用の固定幅・絶対配置をすべて解除して縦積みに */
  body .sbs-real #campaign_detail [class*="cp360"], body .sbs-real #campaign_detail [id*="cp360"] {
    float: none !important; position: static !important; width: auto !important; max-width: 100% !important;
    height: auto !important; box-sizing: border-box !important; }
  body .sbs-real #campaign_detail [class*="cp360"] img { max-width: 100%; height: auto; }
  body .sbs-real #campaign_detail [class*="cp360_item"] { margin: 0 0 10px !important; }

  /* ---------- 会社案内 ---------- */
  .sbs-real #corporate_detail #catchtxt { width: auto; height: auto; padding: 12px; }
  .sbs-real #corporate_detail #catchtxt p { line-height: 1.8; margin: 0 0 6px; }
  .sbs-real #corporate_detail #catchtxt br { display: none; }
  .sbs-real #corporate_detail table th { width: 30%; }

  /* ---------- /contact（表を縦積み） ---------- */
  .sbs-real #catch #catchimgtxt { position: static; width: auto; }
  .sbs-real #catch #catchtxt, .sbs-real #catch #box2ttx { width: auto; height: auto; padding: 10px 12px; background-image: none; background-color: #F2FAE3; }
  .sbs-real .formbox #table2 th { width: auto; }
  .sbs-real .formbox #table1 th, .sbs-real .formbox #table1 td, .sbs-real .formbox #table2 td { padding-left: 12px; padding-right: 12px; }
  .sbs-real #catch #catchimgtxt p { text-align: left; }
  .sbs-real #catch #catchimgtxt p[align="right"] { text-align: center; }
  .sbs-real #step { display: flex; gap: 4px; }
  .sbs-real #step p { float: none; flex: 1; margin: 0 !important; }
  .sbs-real #contents_wrap, .sbs-real .formbox { width: auto; padding-left: 8px; padding-right: 8px; }
  .sbs-real #table1, .sbs-real #table2 { width: 100% !important; table-layout: fixed; }
  .sbs-real #table1 label { display: inline-block; }
  .sbs-real #table1, .sbs-real #table2, .sbs-real #table1 tbody, .sbs-real #table2 tbody,
  .sbs-real #table1 tr, .sbs-real #table1 th, .sbs-real #table1 td,
  .sbs-real #table2 tr, .sbs-real #table2 th, .sbs-real #table2 td { display: block; width: auto; }
  .sbs-real #table1 th, .sbs-real #table1 td { width: auto; }
  .sbs-real .txtbox, .sbs-real .txtbox2 { width: 100%; }
  .sbs-real .txtbox3 { width: 40%; }
  .sbs-real .hosoku br { display: none; }
  .sbs-real .contact_pr { width: auto; height: 160px; }
  .sbs-real #mark_cpr { width: auto; height: auto !important; padding: 12px 0; margin: 0 0 20px; text-align: center; overflow: hidden; }
  .sbs-real #mark_cpr p { float: none !important; margin: 0 0 6px !important; text-align: center; font-size: 12px; line-height: 1.7; }
  .sbs-real #mark_cpr br { display: none; }
  /* 女性イラストの下半分（catchimg2）を上の画像と同じ縮尺で左に表示し、本文はその下へ */
  .sbs-real #catch #catchimgtxt { background: url(/html/user_data/sbs/contact/img/catchimg2.jpg) no-repeat left top / 54% auto !important;
    padding: 34% 10px 10px 10px !important; }
  .sbs-real .sbs-imgbtn { margin: 0 2px; max-width: 48%; }
}

@media (max-width: 480px) {
  .sbs-real #gnavi ul { grid-template-columns: repeat(2, 1fr); }
  .sbs-real #item_container_tab li { font-size: 11px; }
  .sbs-real .products_lineup_list ul { grid-template-columns: 1fr; }
}

@keyframes sbs-ticker { from { transform: translateX(0); } to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
  .sbs-real #header .sbs-ticker { animation: none; padding-left: 10px; }
}

/* ---------- PC：下部ガイド帯（5項目）を現行と同じ6項目を1マス160pxで並べる ---------- */
@media (min-width: 980px) {
  .sbs-real #pagebtm_guide { background: #eee; }
  .sbs-real #pagebtm_guide table { width: 960px !important; margin: 0 auto; table-layout: fixed; }
  .sbs-real #pagebtm_guide #guide1 a { display: inline-block; max-width: 4.6em; }
}

/* ---------- ご利用Q&A アコーディオン（PC/SP共通） ---------- */
.sbs-real .sbs-faq__q a { cursor: pointer; }
.sbs-real .sbs-faq__q a::after { content: "＋"; margin-left: .4em; color: #8ec21f; font-weight: bold; }
.sbs-real .sbs-faq.is-open .sbs-faq__q a::after { content: "－"; }
.sbs-real .sbs-faq__a { display: none; margin: 6px 0 14px; padding: 12px 14px 12px 44px; position: relative; background: #f3f8e8; border-left: 3px solid #8ec21f; line-height: 1.8; font-size: 13px; color: #333; }
.sbs-real .sbs-faq__mark { position: absolute; left: 12px; top: 10px; width: 22px; height: 22px; line-height: 22px; text-align: center; border-radius: 50%; background: #f08ca0; color: #fff; font-weight: bold; font-size: 13px; }
.sbs-real .sbs-faq__a img { max-width: 100%; height: auto; }
.sbs-real .sbs-faq.is-open .sbs-faq__a { display: block !important; }
.sbs-real .sbs-faq__a p { background: none !important; padding: 0 !important; margin: 0 0 .5em !important; min-height: 0 !important; height: auto !important; }
/* 成分・お悩みタブ「〜に関する商品」見出しは白文字 */
.sbs-real #seibun_list_box_01 .ttl { color: #fff !important; }
/* 会社案内：見出し背景の写真と画像がずれるためSPでは単色見出しに */
@media (max-width: 979px) {
  .sbs-real #corporate_detail h2 { height: auto; background: none; border-left: 5px solid #8ec21f; padding: 4px 0 4px 12px; margin: 0 0 12px; font-size: 20px; }
  .sbs-real #corporate_detail #catch img { width: 100%; height: auto; }
}
/* 商品LP（/item/*.html）：SPでは左右マージン付きの固定幅要素をはみ出さないように（PCは現行どおり） */
@media (max-width: 979px) {
  .sbs-real #item_detail [class*="mar_l_"], .sbs-real #item_detail [class*="ml"], .sbs-real #item_detail [class*="mar_r_"] { margin-left: 0 !important; margin-right: 0 !important; }
  .sbs-real #item_detail div, .sbs-real #item_detail section, .sbs-real #item_detail h1, .sbs-real #item_detail ul, .sbs-real #item_detail p, .sbs-real #item_detail table { max-width: 100%; box-sizing: border-box; }
  .sbs-real #item_detail img { max-width: 100%; height: auto; }
}
/* 商品一覧（/item・トップ）：NMN枠（#item_list_box_03 入れ子）の固定幅・回り込みをSPで解除 */
@media (max-width: 979px) {
  .sbs-real #item_container #item_list_box_03 { float: none !important; width: auto !important; clear: both; display: block; }
  .sbs-real #item_container #item_list_box_03 li { float: none !important; width: auto !important; }
  .sbs-real #item_container .list_box > ul > a, .sbs-real #item_container .list_box > ul > div { display: block; clear: both; }
  .sbs-real #item_container .list_box > ul > a > li { float: none !important; width: auto !important; }
}
/* 商品LP「おすすめサプリ」：SPは1列・送料無料バッジと価格が重ならないように */
@media (max-width: 979px) {
  .sbs-real #recommend { background-size: 100% auto; }
  .sbs-real #recommend ul li { float: none !important; width: auto !important; padding: 15px 12px !important; }
  .sbs-real #recommend .price { padding-right: 62px !important; }
  .sbs-real #recommend .btn { max-width: 100%; height: auto; }
  .sbs-real #recommend ~ * img, .sbs-real h3 > img[src*="recommend_ttl"] { max-width: 100%; height: auto; }
}
@media (max-width: 979px) { .sbs-real #recommend ul > a { display: block; text-decoration: none; } }
/* 商品LPのカート表：SPでは縦積み（区分→内容量・価格→購入ボタン） */
@media (max-width: 979px) {
  .sbs-real .cart > table, .sbs-real .cart > table > tbody, .sbs-real .cart > table > tbody > tr { display: block; width: 100% !important; }
  .sbs-real .cart > table > tbody > tr > th { display: block; width: auto !important; height: auto !important; padding: 8px 10px 8px 40px !important; text-align: left; writing-mode: horizontal-tb; background-position: left top !important; }
  .sbs-real .cart > table > tbody > tr > th br { display: none; }
  .sbs-real .cart > table > tbody > tr > td { display: block; width: auto !important; padding: 0 !important; }
  .sbs-real .cart table.cart_in { width: 100% !important; }
  .sbs-real .cart table.cart_in tbody { display: block; }
  .sbs-real .cart table.cart_in tr { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 8px 10px; }
  .sbs-real .cart table.cart_in th { width: auto !important; padding: 0 !important; white-space: nowrap; font-weight: normal; }
  .sbs-real .cart table.cart_in th br { display: none; }
  .sbs-real .cart table.cart_in td { display: block; width: auto !important; padding: 0 !important; }
  .sbs-real .cart table.cart_in td.price, .sbs-real .cart table.cart_in td:not(.btn) { flex: 1 1 auto; }
  .sbs-real .cart table.cart_in td.btn { flex: 0 0 100%; text-align: center; }
  .sbs-real .cart table.cart_in td.btn img { max-width: 100%; height: auto; }
  .sbs-real .cart table.cart_in .price_teiki { width: auto !important; float: none !important; }
}
/* 商品LP：SPで画面外にはみ出す見出し・重ね文字の調整（カメリナ＋VE・シルキスタ等） */
@media (max-width: 979px) {
  .sbs-real #item_detail .textbox01 { position: static !important; width: auto !important; margin: 10px 0 !important; }
  .sbs-real #item_detail h3.contents_point_w690, .sbs-real #item_detail h3.contents_point_w690 img { margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; height: auto !important; }
}
@media (max-width: 979px) { .sbs-real #item_detail .contents_point_graybg_mini { float: none !important; width: auto !important; margin: 0 0 15px !important; } }

/* 冬得キャンペーン（/cp/360）：現行LPと同じく 767px以下は左右余白 3.75% */
@media screen and (max-width: 767px) {
  body.sbs-itemonly .sbs-contents { padding-left: 3.75%; padding-right: 3.75%; }
}

/* 2026-10-30 スマホ修正：iPhoneで文字が自動拡大されて表がはみ出すのを防ぐ */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

@media (max-width: 979px) {
  /* 会社案内：会社概要の表を「項目名 → 内容」の縦並びに（Safariで表が右にはみ出すため） */
  .sbs-real #corporate_detail table,
  .sbs-real #corporate_detail tbody,
  .sbs-real #corporate_detail tr,
  .sbs-real #corporate_detail th,
  .sbs-real #corporate_detail td { display: block; width: auto !important; box-sizing: border-box; }
  .sbs-real #corporate_detail th { border-bottom: 0; padding-bottom: 4px; }
  .sbs-real #corporate_detail td { overflow-wrap: anywhere; word-break: normal; }
  .sbs-real #corporate_detail td img { max-width: 100%; height: auto; }

  /* サイトマップ：PCの左右2列を1列に（右列が左にずれて入り込むのを解消） */
  .sbs-real #sitemap_left,
  .sbs-real #sitemap_right { float: none; width: auto; }
  .sbs-real #sitemap_detail ul.icon3:not(:has(li)) { display: none; }
}

/* ログイン中だけ表示するログアウトリンク（ヘッダー右上・ボタンの下） */
.sbs-real #header .sbs-logout { margin: 4px 0 0; text-align: right; font-size: 12px; line-height: 1.4; }
.sbs-real #header .sbs-logout a { color: #555; text-decoration: underline; }
@media (max-width: 979px) { .sbs-real #header .sbs-logout { text-align: center; margin: 6px 0; font-size: 14px; } }

/* 2026-10-30b ログアウト：PCではグローバルナビの下・右端に表示（ボタン画像の下に隠れるため） */
@media (min-width: 980px) {
  .sbs-real #header .right { position: relative; }
  .sbs-real #header .right .sbs-logout { position: absolute; right: 0; top: 161px; margin: 0; text-align: right; white-space: nowrap; font-size: 12px; line-height: 16px; z-index: 5; }
}

/* 2026-10-30b ログアウト：スマホではボタンの下に文字リンクで1行表示。ログイン中は「マイページ」表記 */
@media (max-width: 979px) {
  .sbs-real #header .right { flex-wrap: wrap; }
  .sbs-real #header .right p:not(.sbs-logout) { flex: 1 1 calc(50% - 3px); }
  .sbs-real #header .right .sbs-logout { flex: 1 1 100%; max-width: none; margin: 2px 0 0; text-align: right; }
  .sbs-real #header .right .sbs-logout a { display: inline; height: auto; padding: 0; background: none; border: 0; box-shadow: none; border-radius: 0;
    color: #555; font-size: 13px; font-weight: normal; text-decoration: underline; }
  .sbs-real #header .right .sbs-logout a::before, .sbs-real #header .right .sbs-logout a::after { content: none; }
  .sbs-real #header .right p:nth-child(1) a:not([href*="login"])::after { content: "マイページ"; }
}

/* 2026-11-03 オレンジのボタン（カートへ進む・レジに進む等）がリンク色（緑）・下線になっていたのを白文字に */
.sbs-real a.ec-inlineBtn--action, .sbs-real a.ec-inlineBtn--action:hover,
.sbs-real a.ec-blockBtn--action, .sbs-real a.ec-blockBtn--action:hover { color: #fff; text-decoration: none; font-weight: bold; }