/* ボヌールシップ HP — スマホ向けレイアウト（左右対称・全幅） */

@media (max-width: 720px) {
  body {
    overflow-x: hidden;
  }

  .container {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
  }

  .hero {
    padding-top: 32px;
    padding-bottom: 16px;
  }

  .hero-card {
    padding: 18px 16px;
    border-radius: 18px;
  }

  .section {
    padding: 14px 0 8px;
  }

  .section h2,
  .hero-worry-title {
    margin-left: 0;
    margin-right: 0;
    padding: 10px 14px;
    border-left-width: 5px;
  }

  .section-lead,
  .price-guide,
  .hero-lead {
    margin-left: 0;
    margin-right: 0;
  }

  .guide-wrap,
  .hero-worry-block {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding: 16px;
    border-radius: 14px;
    margin-bottom: 18px;
    box-sizing: border-box;
  }

  .reason-grid,
  .hero-worry-grid,
  .cards {
    width: 100%;
    gap: 12px;
  }

  .reason-card,
  .hero-worry-card,
  .card,
  .section-card,
  .news-item,
  .step-block,
  .area-box,
  .accsj,
  .link-card,
  .staff-card,
  .detail-block {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding: 14px 16px;
    box-sizing: border-box;
  }

  .step-block {
    padding: 14px 16px 14px 20px;
  }

  .step-block::before {
    left: 6px;
    width: 5px;
  }

  .step-block h3 {
    padding: 10px 12px;
    margin-left: 0;
    margin-right: 0;
  }

  .flow-list li {
    padding: 14px 16px 14px 52px;
    margin-left: 0;
    margin-right: 0;
  }

  .flow-list li::before {
    left: 14px;
    top: 14px;
  }

  .cta-box {
    padding: 14px 16px;
    margin-left: 0;
    margin-right: 0;
  }

  .price-groups {
    width: 100%;
    gap: 12px;
  }

  .price-group {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  .price-group-title {
    padding: 12px 16px;
    text-align: left;
  }

  .price-guide {
    display: none;
  }

  /* 料金表：行ごとカード（コンパクト3行 / 展開） */
  .price-table-wrap,
  .fee-table-wrap {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    overflow-x: visible;
  }

  .price-table,
  .price-matrix,
  .fee-table {
    min-width: 0;
    width: 100%;
    max-width: 100%;
    margin: 0;
    display: block;
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
  }

  .price-table caption {
    width: 100%;
    padding: 0 0 10px;
    text-align: left;
  }

  .price-table thead,
  .price-matrix thead,
  .fee-table thead {
    display: none;
  }

  .price-table tbody,
  .price-matrix tbody,
  .fee-table tbody {
    display: block;
    width: 100%;
  }

  .price-table tbody tr,
  .price-matrix tbody tr,
  .fee-table tbody tr {
    width: 100%;
    max-width: 100%;
    margin: 0 0 12px;
    padding: 12px 16px;
    background: #fffefb;
    border: 1px solid #e8edf2;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(99, 87, 71, 0.08);
    box-sizing: border-box;
  }

  .price-table tbody tr:last-child,
  .price-matrix tbody tr:last-child,
  .fee-table tbody tr:last-child {
    margin-bottom: 0;
  }

  .price-table th,
  .price-table td,
  .price-matrix th,
  .price-matrix td,
  .fee-table th,
  .fee-table td {
    border: none;
    white-space: normal;
    text-align: left;
    background: transparent;
    box-sizing: border-box;
  }

  .price-cell--empty {
    display: none !important;
  }

  /* 階層：◯ 大区分（price-group-title） */
  .price-group-title::before {
    content: "◯ ";
    font-weight: 700;
  }

  /* 料金グループ：複数行を1カードに */
  .price-matrix tbody tr.price-row--in-group,
  .price-table tbody tr.price-row--in-group,
  .fee-table tbody tr.price-row--in-group {
    box-shadow: none;
  }

  .price-matrix tbody tr.price-row--group-head.price-row--in-group,
  .price-table tbody tr.price-row--group-head.price-row--in-group,
  .fee-table tbody tr.price-row--group-head.price-row--in-group {
    margin-bottom: 0;
    border-bottom: none;
    border-radius: 10px 10px 0 0;
  }

  .price-matrix tbody tr.price-row--group-tier,
  .price-table tbody tr.price-row--group-tier,
  .fee-table tbody tr.price-row--group-tier {
    margin-top: 0;
    margin-bottom: 0;
    padding: 8px 16px 8px 20px;
    border-radius: 0;
    border: none;
    border-left: 1px solid #e8edf2;
    border-right: 1px solid #e8edf2;
    background: #fffefb;
    box-shadow: none;
    border-top: 1px dashed #c5d3dc;
  }

  .price-matrix tbody tr.price-row--group-end,
  .price-table tbody tr.price-row--group-end,
  .fee-table tbody tr.price-row--group-end {
    margin-bottom: 12px;
    border-bottom: 1px solid #e8edf2;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 4px 10px rgba(99, 87, 71, 0.08);
  }

  .price-row--hide-menu td:first-child {
    display: none !important;
  }

  /* ● メニュー見出し */
  .price-matrix tbody tr:not(.price-row--group-tier):not(.price-row--expanded) .price-col-menu::before,
  .price-matrix:not(.price-matrix--with-category) tbody tr:not(.price-row--group-tier):not(.price-row--expanded) td:nth-child(1)::before,
  .price-table tbody tr:not(.price-row--group-tier):not(.price-row--expanded) th::before {
    display: inline !important;
    content: "●" !important;
    margin-right: 0.25em;
    color: #2f6f95;
    font-size: 1em;
    font-weight: 700;
  }

  .price-matrix tbody tr:not(.price-row--group-tier):not(.price-row--expanded) .price-col-cat {
    flex: 0 0 100%;
    width: 100%;
    font-weight: 700;
    color: #3d6f8f;
    font-size: 0.92em;
    padding-bottom: 6px;
    margin-bottom: 2px;
    border-bottom: 1px solid #e8edf2;
  }

  /* バンドル（付き添い・ワークショップ等） */
  .price-row--bundle.price-row--group-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: 0.45em;
    row-gap: 6px;
  }

  .price-row--bundle .price-col-menu {
    flex: 0 0 100%;
    font-weight: 700;
    color: #2f6f95;
    font-size: 1.02em;
  }

  .price-row--bundle .price-col-body,
  .price-row--bundle .price-col-body--span {
    flex: 0 0 100%;
    width: 100%;
    color: #495853;
    font-size: 0.92em;
    line-height: 1.65;
    padding: 2px 0 6px;
  }

  .price-row--bundle.price-row--has-tiers .price-col-unit {
    flex: 0 0 auto;
    order: 20;
    display: flex;
    align-items: baseline;
    gap: 0.35em;
    width: 100%;
    padding-top: 8px;
    margin-top: 4px;
    border-top: 1px dashed #c5d3dc;
    color: #5d6f7a;
  }

  .price-row--bundle.price-row--has-tiers .price-col-price {
    flex: 1 1 auto;
    order: 21;
    margin-left: auto;
    text-align: right;
    font-weight: 700;
    color: #2f6f95;
    font-size: 1.06em;
    padding-top: 8px;
    margin-top: 4px;
    border-top: none;
  }

  .price-row--bundle.price-row--has-tiers .price-col-note:not(.price-cell--empty) {
    flex: 0 0 100%;
    order: 30;
    font-size: 0.9em;
    color: #5f6f6b;
    padding-top: 8px;
    margin-top: 4px;
    border-top: 1px solid #e8edf2;
  }

  .price-row--bundle.price-row--has-tiers .price-col-note:not(.price-cell--empty)::before {
    display: block !important;
    content: "備考" !important;
    font-size: 0.8em;
    font-weight: 700;
    color: #7d8f98;
    margin-bottom: 2px;
  }

  /* ・ 時間別料金行（グループ内） */
  .price-row--group-tier.price-row--tier-only {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    column-gap: 0.5em;
    row-gap: 4px;
  }

  .price-row--group-tier.price-row--tier-only .price-col-body {
    flex: 0 0 auto;
    font-weight: 600;
    color: #495853;
    padding-right: 0.5em;
  }

  .price-row--group-tier.price-row--tier-only .price-col-unit,
  .price-row--group-tier.price-row--tier-only td:first-child {
    flex: 1 1 auto;
    display: flex;
    align-items: baseline;
    gap: 0.35em;
    color: #5d6f7a;
  }

  .price-row--group-tier.price-row--tier-only .price-col-unit::before,
  .price-row--group-tier.price-row--tier-only > td:first-child:not(.price-col-price)::before {
    display: inline !important;
    content: "・" !important;
    color: #7d8f98;
    font-weight: 700;
    margin-right: 0.15em;
  }

  .price-row--group-tier.price-row--tier-only .price-col-price,
  .price-row--group-tier.price-row--tier-only td:last-child {
    flex: 0 0 auto;
    font-weight: 700;
    color: #2f6f95;
    font-size: 1.05em;
    text-align: right;
    margin-left: auto;
  }

  .price-row--group-tier.price-row--tier-only:not(:has(.price-col-body)) .price-col-unit::before,
  .price-row--group-tier.price-row--tier-only:not(:has(.price-col-body)) > td:first-child::before {
    content: "・" !important;
    font-size: 1em;
    color: #7d8f98;
    font-weight: 700;
  }

  .price-row--group-tier.price-row--tier-only:has(.price-col-body) .price-col-body::before {
    display: inline !important;
    content: "・" !important;
    color: #7d8f98;
    font-weight: 700;
    margin-right: 0.2em;
  }

  .price-row--group-tier.price-row--tier-only:not(:has(.price-col-body)) {
    padding-left: 20px;
  }

  /* --- コンパクト行（最大3行・デフォルト） --- */
  .price-matrix tbody tr:not(.price-row--expanded),
  .price-table tbody tr:not(.price-row--expanded),
  .fee-table tbody tr:not(.price-row--expanded) {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: flex-start;
    column-gap: 0.45em;
    row-gap: 6px;
  }

  .price-matrix tbody tr:not(.price-row--expanded) td::before,
  .price-table tbody tr:not(.price-row--expanded) th::before,
  .price-table tbody tr:not(.price-row--expanded) td::before,
  .fee-table tbody tr:not(.price-row--expanded) th::before,
  .fee-table tbody tr:not(.price-row--expanded) td::before {
    display: none !important;
    content: none !important;
  }

  .price-matrix tbody tr:not(.price-row--expanded) td,
  .price-table tbody tr:not(.price-row--expanded) th,
  .price-table tbody tr:not(.price-row--expanded) td,
  .fee-table tbody tr:not(.price-row--expanded) th,
  .fee-table tbody tr:not(.price-row--expanded) td {
    display: block;
    width: auto;
    max-width: 100%;
    margin: 0;
    padding: 0;
  }

  /* 5列 price-matrix */
  .price-matrix:not(.price-matrix--with-category) tbody tr:not(.price-row--expanded) td:nth-child(1) {
    flex: 0 0 auto;
    font-weight: 700;
    color: #2f6f95;
  }

  .price-matrix:not(.price-matrix--with-category) tbody tr:not(.price-row--expanded) td:nth-child(2) {
    flex: 1 1 8rem;
    min-width: 0;
    color: #495853;
  }

  .price-matrix:not(.price-matrix--with-category) tbody tr:not(.price-row--expanded)::before {
    content: "";
    display: block;
    flex-basis: 100%;
    width: 100%;
    height: 0;
    order: 2;
    border-top: 1px solid #e8edf2;
    margin-top: 4px;
  }

  .price-matrix:not(.price-matrix--with-category) tbody tr:not(.price-row--expanded) td:nth-child(1),
  .price-matrix:not(.price-matrix--with-category) tbody tr:not(.price-row--expanded) td:nth-child(2) {
    order: 1;
  }

  .price-matrix:not(.price-matrix--with-category) tbody tr:not(.price-row--expanded) td:nth-child(3) {
    flex: 0 0 auto;
    order: 3;
    display: flex;
    align-items: baseline;
    gap: 0.35em;
    color: #5d6f7a;
    padding-top: 6px;
  }

  .price-matrix:not(.price-matrix--with-category) tbody tr:not(.price-row--expanded) td:nth-child(3)::before {
    display: inline !important;
    content: "料金" !important;
    font-size: 0.8em;
    font-weight: 700;
    color: #7d8f98;
    flex: 0 0 auto;
  }

  .price-matrix:not(.price-matrix--with-category) tbody tr:not(.price-row--expanded) td:nth-child(4) {
    flex: 1 1 auto;
    order: 4;
    margin-left: auto;
    text-align: right;
    font-weight: 700;
    color: #2f6f95;
    font-size: 1.06em;
    padding-top: 6px;
  }

  .price-matrix:not(.price-matrix--with-category) tbody tr:not(.price-row--expanded) td:nth-child(5) {
    flex: 0 0 100%;
    order: 5;
    font-size: 0.9em;
    color: #5f6f6b;
    padding-top: 4px;
  }

  /* 6列 price-matrix（交流支援・短い行） */
  .price-matrix.price-matrix--with-category tbody tr:not(.price-row--expanded) .price-col-cat {
    flex: 0 0 100%;
    font-weight: 700;
    color: #2f6f95;
    margin-bottom: 2px;
  }

  .price-matrix.price-matrix--with-category tbody tr:not(.price-row--expanded) .price-col-menu {
    flex: 0 0 auto;
    font-weight: 700;
    color: #2f6f95;
  }

  .price-matrix.price-matrix--with-category tbody tr:not(.price-row--expanded) .price-col-body {
    flex: 1 1 8rem;
    min-width: 0;
    color: #495853;
  }

  .price-matrix.price-matrix--with-category tbody tr:not(.price-row--expanded)::before {
    content: "";
    display: block;
    flex-basis: 100%;
    width: 100%;
    height: 0;
    order: 5;
    border-top: 1px solid #e8edf2;
    margin-top: 4px;
  }

  .price-matrix.price-matrix--with-category tbody tr:not(.price-row--expanded) .price-col-cat {
    order: 1;
  }

  .price-matrix.price-matrix--with-category tbody tr:not(.price-row--expanded) .price-col-menu {
    order: 2;
  }

  .price-matrix.price-matrix--with-category tbody tr:not(.price-row--expanded) .price-col-body {
    order: 2;
  }

  .price-matrix.price-matrix--with-category tbody tr:not(.price-row--expanded) .price-col-unit {
    flex: 0 0 auto;
    order: 6;
    display: flex;
    align-items: baseline;
    gap: 0.35em;
    color: #5d6f7a;
    padding-top: 6px;
  }

  .price-matrix.price-matrix--with-category tbody tr:not(.price-row--expanded) .price-col-unit::before {
    display: inline !important;
    content: "料金" !important;
    font-size: 0.8em;
    font-weight: 700;
    color: #7d8f98;
    flex: 0 0 auto;
  }

  .price-matrix.price-matrix--with-category tbody tr:not(.price-row--expanded) .price-col-price {
    flex: 1 1 auto;
    order: 7;
    margin-left: auto;
    text-align: right;
    font-weight: 700;
    color: #2f6f95;
    font-size: 1.06em;
    padding-top: 6px;
  }

  .price-matrix.price-matrix--with-category tbody tr:not(.price-row--expanded) .price-col-note {
    flex: 0 0 100%;
    order: 8;
    font-size: 0.9em;
    color: #5f6f6b;
    padding-top: 4px;
  }

  /* 6列・分類なしの続き行（メニュー省略） */
  .price-matrix.price-matrix--with-category tbody tr:not(.price-row--expanded):not(:has(.price-col-menu)) .price-col-body {
    flex: 0 0 100%;
    font-weight: 700;
    color: #2f6f95;
    border-top: none;
    padding-top: 0;
    margin-top: 0;
  }

  /* 3列 price-table（about） */
  .price-table tbody tr:not(.price-row--expanded) th {
    flex: 0 0 auto;
    font-weight: 700;
    color: #2f6f95;
  }

  .price-table tbody tr:not(.price-row--expanded) td:nth-child(2) {
    flex: 1 1 8rem;
    min-width: 0;
    color: #495853;
  }

  .price-table tbody tr:not(.price-row--expanded) td:nth-child(3) {
    flex: 0 0 100%;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.5em;
    font-weight: 700;
    color: #2f6f95;
    font-size: 1.06em;
    padding-top: 8px;
    margin-top: 2px;
    border-top: 1px solid #e8edf2;
    text-align: right;
  }

  .price-table tbody tr:not(.price-row--expanded) td:nth-child(3)::before {
    display: block !important;
    content: "料金" !important;
    font-size: 0.8em;
    font-weight: 700;
    color: #7d8f98;
    text-align: left;
    flex: 0 0 auto;
  }

  /* 3列 fee-table */
  .fee-table tbody tr:not(.price-row--expanded) th {
    flex: 0 0 auto;
    font-weight: 700;
    color: #2f6f95;
  }

  .fee-table tbody tr:not(.price-row--expanded) td:nth-child(2) {
    flex: 1 1 8rem;
    min-width: 0;
    color: #495853;
  }

  .fee-table tbody tr:not(.price-row--expanded) td:nth-child(3) {
    flex: 0 0 100%;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.5em;
    font-weight: 700;
    color: #2f6f95;
    font-size: 1.06em;
    padding-top: 8px;
    margin-top: 2px;
    border-top: 1px solid #e8edf2;
    text-align: right;
  }

  .fee-table tbody tr:not(.price-row--expanded) td:nth-child(3)::before {
    display: block !important;
    content: "料金" !important;
    font-size: 0.8em;
    font-weight: 700;
    color: #7d8f98;
    text-align: left;
    flex: 0 0 auto;
  }

  /* 備考ありのときのみ3行目ラベル */
  .price-matrix:not(.price-matrix--with-category) tbody tr:not(.price-row--expanded) td:nth-child(5):not(.price-cell--empty)::before,
  .price-matrix.price-matrix--with-category tbody tr:not(.price-row--expanded) .price-col-note:not(.price-cell--empty)::before {
    display: block !important;
    content: "備考" !important;
    font-size: 0.8em;
    font-weight: 700;
    color: #7d8f98;
    margin-bottom: 2px;
  }

  /* --- 展開行（長い説明・詳細あり） --- */
  .price-matrix tbody tr.price-row--expanded,
  .price-table tbody tr.price-row--expanded,
  .fee-table tbody tr.price-row--expanded {
    display: block;
  }

  .price-matrix tbody tr.price-row--expanded td,
  .price-table tbody tr.price-row--expanded th,
  .price-table tbody tr.price-row--expanded td,
  .fee-table tbody tr.price-row--expanded th,
  .fee-table tbody tr.price-row--expanded td {
    display: block;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 6px 0;
  }

  .price-matrix:not(.price-matrix--with-category) tbody tr.price-row--expanded td:nth-child(1)::before,
  .price-matrix:not(.price-matrix--with-category) tbody tr.price-row--expanded td:nth-child(2)::before,
  .price-matrix:not(.price-matrix--with-category) tbody tr.price-row--expanded td:nth-child(3)::before,
  .price-matrix:not(.price-matrix--with-category) tbody tr.price-row--expanded td:nth-child(4)::before,
  .price-matrix:not(.price-matrix--with-category) tbody tr.price-row--expanded td:nth-child(5)::before,
  .price-matrix tbody tr.price-row--expanded .price-col-cat::before,
  .price-matrix tbody tr.price-row--expanded .price-col-menu::before,
  .price-matrix tbody tr.price-row--expanded .price-col-body::before,
  .price-matrix tbody tr.price-row--expanded .price-col-unit::before,
  .price-matrix tbody tr.price-row--expanded .price-col-price::before,
  .price-matrix tbody tr.price-row--expanded .price-col-note::before,
  .price-table tbody tr.price-row--expanded th::before,
  .price-table tbody tr.price-row--expanded td:nth-child(2)::before,
  .price-table tbody tr.price-row--expanded td:nth-child(3)::before,
  .fee-table tbody tr.price-row--expanded th::before,
  .fee-table tbody tr.price-row--expanded td:nth-child(2)::before,
  .fee-table tbody tr.price-row--expanded td:nth-child(3)::before {
    display: block;
    margin-bottom: 3px;
    font-size: 0.75em;
    font-weight: 700;
    color: #7d8f98;
    letter-spacing: 0.02em;
  }

  .price-matrix:not(.price-matrix--with-category) tbody tr.price-row--expanded td:nth-child(1)::before { content: "メニュー"; }
  .price-matrix:not(.price-matrix--with-category) tbody tr.price-row--expanded td:nth-child(2)::before { content: "内容"; }
  .price-matrix:not(.price-matrix--with-category) tbody tr.price-row--expanded td:nth-child(3)::before { content: "時間・単位"; }
  .price-matrix:not(.price-matrix--with-category) tbody tr.price-row--expanded td:nth-child(4)::before { content: "料金（税込）"; }
  .price-matrix:not(.price-matrix--with-category) tbody tr.price-row--expanded td:nth-child(5)::before { content: "備考"; }

  .price-matrix tbody tr.price-row--expanded .price-col-cat::before { content: "分類"; }
  .price-matrix tbody tr.price-row--expanded .price-col-menu::before { content: "メニュー"; }
  .price-matrix tbody tr.price-row--expanded .price-col-body::before { content: "内容"; }
  .price-matrix tbody tr.price-row--expanded .price-col-unit::before { content: "時間・単位"; }
  .price-matrix tbody tr.price-row--expanded .price-col-price::before { content: "料金（税込）"; }
  .price-matrix tbody tr.price-row--expanded .price-col-note::before { content: "備考"; }

  .price-table tbody tr.price-row--expanded th::before { content: "項目"; }
  .price-table tbody tr.price-row--expanded td:nth-child(2)::before { content: "サービス内容"; }
  .price-table tbody tr.price-row--expanded td:nth-child(3)::before { content: "料金（税込）"; }

  .fee-table tbody tr.price-row--expanded th::before { content: "区分"; }
  .fee-table tbody tr.price-row--expanded td:nth-child(2)::before { content: "内容"; }
  .fee-table tbody tr.price-row--expanded td:nth-child(3)::before { content: "目安料金（税込）"; }

  .price-table tbody tr.price-row--expanded th,
  .fee-table tbody tr.price-row--expanded th,
  .price-matrix tbody tr.price-row--expanded .price-col-cat,
  .price-matrix tbody tr.price-row--expanded .price-col-menu,
  .price-matrix:not(.price-matrix--with-category) tbody tr.price-row--expanded td:nth-child(1) {
    font-weight: 700;
    color: #2f6f95;
    font-size: 1em;
    padding-top: 0;
  }

  .price-table tbody tr.price-row--expanded td:last-child,
  .fee-table tbody tr.price-row--expanded td:last-child,
  .price-matrix tbody tr.price-row--expanded .price-col-price,
  .price-matrix:not(.price-matrix--with-category) tbody tr.price-row--expanded td:nth-child(4) {
    font-weight: 700;
    color: #2f6f95;
    font-size: 1.05em;
  }

  .features-figure,
  .features-img,
  .hero-image {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 560px) {
  .container {
    padding-left: 14px;
    padding-right: 14px;
  }

  .hero-card {
    padding: 16px 14px;
  }

  .guide-wrap,
  .hero-worry-block {
    padding: 14px;
  }

  .reason-card,
  .hero-worry-card,
  .card,
  .section-card {
    padding: 12px 14px;
  }

  .section h2,
  .hero-worry-title {
    padding: 10px 12px;
  }

  .price-table tr,
  .price-matrix tr,
  .fee-table tr {
    padding: 12px 14px;
  }
}
