/* スマホ */
@media screen and (max-width: 768px) {
  /* 電話発信：SPのみ有効化（base の無効化を解除） */
  .cta-btn--phone,
  .cta-btn--phone-card,
  .header-btn.header-black-btn:first-child,
  .p-price-notice__btn--tel,
  .p-contact-thanks__phone,
  .p-contact__phone {
    pointer-events: auto;
    cursor: pointer;
  }

  /* single / archive / search ページのコンテンツ余白（SP縮小）
     ※ post-type-archive-case は独自レイアウトのため除外 */
  .single:not(.single-case) #content.l-content,
  .archive:not(.post-type-archive-case) #content.l-content,
  .search #content.l-content {
    padding-top: 4rem !important;
    padding-bottom: 4rem;
    max-width: 600px;
    padding-inline: var(--space-ml);
  }

  /*************************** 01. 枠組共通 ***********************/
  .sp {
    display: initial;
  }

  .pc {
    display: none;
  }

  /* SWELLタイトルエリア高さ */
  .l-topTitleArea {
    min-height: 160px;
  }

  .section {
    padding-top: 6.6rem;
    padding-bottom: 6.6rem;
  }

  .l-inner {
    max-width: 600px;
    padding-inline: var(--space-ml);
  }
  h1 {
    font-size: 2.8rem;
  }
  h2 {
    font-size: 4rem;
  }
  h3 {
    font-size: 2.4rem;
  }

  /*************************** 02. header（ヘッダー） ***********************/
  .l-header {
    height: 60px;
    display: flex;
    align-items: center;
  }

  /* SP: タップ時opacity */
  .header-btn.header-black-btn:first-child {
    width: 100%;
  }
  .header-btn.header-black-btn:first-child:active {
    opacity: var(--opacity-hover);
  }

  .-parallel-bottom .l-header__logo {
    width: clamp(12rem, 35vw, 20rem);
    height: auto;
    margin: 0;
  }
  .header-btn.header-black-btn:last-child::after {
    width: 22px;
    height: 22px;
  }
  /*************************** 03. 共通パーツ ***********************/
  /* .side-btn-container / .p-sp-fixed-cta / .p-fixBtnWrap は common/styles.css の @media (max-width: 1023px) に集約済み */
  .concept .catchcopy br {
    display: inherit;
  }

  .concept .concept-bg {
    font-size: 4.8rem;
  }

  ul.before-after li:first-child::after {
    font-size: 10rem;
  }

  ul.before-after li:first-child::before {
    font-size: 2.8rem;
    margin-bottom: 0.6rem;
  }

  ul.before-after li:last-child::before {
    font-size: 2.8rem;
    margin-bottom: 0.6rem;
  }

  .conversion a {
    padding: 2.8rem 0;
    font-size: 2.8rem;
  }

  .miniConversion {
    width: 100%;
  }

  .miniConversion a {
    padding: 2rem;
    font-size: 2rem;
  }

  div.largeT table thead {
    display: none;
  }

  div.largeT table tbody tr {
    background: var(--white);
  }

  div.largeT table tbody th {
    background: var(--bg);
    display: block;
    border: none;
  }

  div.largeT table tbody td {
    display: flex;
    border-left: none;
    border-right: none;
  }

  div.largeT table tbody td::before {
    content: attr(data-label);
    font-weight: bold;
    flex-shrink: 0;
    margin-right: 1.6rem;
  }

  div.largeT table tbody td:last-child {
    padding-bottom: 4rem;
  }

  dl.table {
    flex-direction: column;
    border-top: 1px solid var(--border);
  }

  dl.table dt {
    width: 100%;
    padding: 1.4rem 0.8rem 0.2rem;
    background: none;
    font-weight: bold;
    border-bottom: none;
  }

  dl.table dd {
    width: 100%;
    padding: 0.2rem 0.8rem 1.4rem;
  }

  .flex-container-four > * {
    width: 48%;
    margin: 0 1% 3%;
  }

  .p-relatedPosts > .p-postList__item {
    width: 100%;
  }

  .related-article-container {
    flex-direction: column;
  }

  .related-article-box {
    width: 100%;
    margin-bottom: 3rem;
  }

  .related-article-box div.img img {
    width: 18rem;
    height: 12rem;
  }

  .related-article-box div.txt {
    width: calc(100% - 19rem);
  }
  div.leftImg .img,
  div.rightImg .img {
    float: inherit;
    margin: 0 auto 1rem;
    width: 60%;
  }

  .flow-section-container {
    background: none;
  }

  .flow-section-container section {
    width: 100%;
  }

  .flow-section-container section:not(:last-child) {
    background: url(/images/icons/flow-bottom-start-gray.svg) no-repeat center
      bottom;
    padding-bottom: 5rem;
    background-size: 15rem;
  }

  .flow-section-container section:nth-child(odd) {
    margin-left: 0;
  }
  ul.sixColumns.area-support-box li {
    width: 31.3333%;
  }

  /*************************** 04. breadcrumb（パンくず） ***********************/
  /*************************** 05. aside（サイドバー） ***********************/
  /*************************** 06. footer（フッター） ***********************/
  .footer-conversion {
    display: flex;
    list-style: none;
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: 10;
  }

  .footer-conversion li {
    width: 100%;
    margin: 0;
    text-align: left;
    position: relative;
  }

  .footer-conversion li a {
    display: block;
    font-size: 16px;
    font-weight: bold;
    padding: 10px;
    padding-left: 48px;
    color: var(--white);
  }

  .footer-conversion li a .arrow-icon {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    width: 10px;
  }

  .footer-conversion li:first-child {
    background: #222222;
  }

  .footer-conversion li:nth-child(2) {
    background: #00885a;
  }

  .footer-conversion li:nth-child(3) {
    background: #50c900;
  }

  .c-widget__title.-spmenu {
    display: none;
  }

  .custom-footer {
    padding: 10px 0 0;
  }

  .footer-divider {
    margin-top: 40px;
    margin-bottom: 30px;
  }

  .footer-top {
    justify-content: center;
  }

  .footer-box {
    padding: 0;
  }

  .footer-box h3 {
    font-size: 22px;
  }

  .footer-links {
    gap: 1%;
    align-items: center;
    justify-content: left;
  }

  .footer-links li {
    padding: 0;
    width: 48%;
  }

  .footer-links li::after {
    display: none;
  }

  .footer-box p {
    text-align: left;
    margin-bottom: 0;
    font-size: 12px;
  }

  .footer-box p.footer-label {
    text-align: center;
  }
  .footer-logo {
    width: 80%;
  }

  /* バッジSPサイズ → page/smart.css で管理 */
  div.cta-buttons {
    flex-direction: column;
    align-items: stretch; /* 全ボタンで幅を同じにする */
    gap: 5.6rem;
    padding-top: 0;
    width: 100%;
    margin: 0 auto;
  }

  .cta-btn {
    width: 100%;
    margin: 0 auto;
  }

  /* SP: 電話ボタン — タップ可能（共通.cta-btnのSP定義に従う） */

  /* SP: 電話ボタン（フッターCTA カード型）— nowrapを維持しつつフォントサイズを縮小して1行に収める */
  .cta-btn--phone-card .cta-btn-number {
    white-space: nowrap;
    font-size: clamp(1.8rem, 6vw, 2.4rem); /* SPで極力1行に収まるように縮小 */
  }

  .cta-btn--phone-card .cta-btn-hours {
    white-space: nowrap;
    text-align: center;
    font-size: clamp(0.9rem, 3vw, 1.2rem);
  }

  .cta-btn-text {
    font-size: 2.2rem;
  }

  /* SP: メール/LINE ボタン — 矢印は絶対配置（Figma: right 7px, 縦中央） */
  .cta-btn--mail .cta-btn-arrow,
  .cta-btn--line .cta-btn-arrow {
    right: 0.7rem;
  }
  img.c-voice-card__avatar {
    width: 100px;
    height: 100px;
  }
  .c-voice-card__header {
    gap: 30px;
    justify-content: space-around;
  }

  /* CTAセクション SP（768px以下） */
  .c-cta-section {
    padding: 60px 20px;
  }
  .c-cta-section__subheading {
    font-size: 1.5rem;
  }

  /* フッターロゴ SP */
  .site-footer-logo img {
    max-width: 220px;
  }

  /* ===== フッター SP ===== */
  .site-footer-top {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }

  /* [3] フッターロゴ拡大：tablet.css の !important を上書き */
  img.wp-image-5873 {
    max-width: 390px !important;
    height: auto !important;
  }

  .site-footer-nav {
    flex-direction: column;
    gap: 34px;
  }

  .site-footer-nav-col {
    gap: 16px;
  }

  /* ===== c-deco-heading SP ===== */
  .c-deco-heading {
    gap: 10px;
  }
  .c-deco-heading[id] {
    scroll-margin-top: 80px;
  }
  .c-deco-heading__text {
    font-size: 1.8rem;
    line-height: 1.5;
  }
  .c-deco-heading__text--large {
    font-size: 2.4rem;
    line-height: 1.4;
  }
  .c-deco-heading__emphasis {
    font-size: 2.4rem;
  }
  .c-deco-heading__sub {
    font-size: 2rem;
  }
  .p-faq-item__question-text {
    font-size: 1.6rem;
  }
  div.top-problem__inner {
    gap: 4rem;
    padding-inline: var(--space-ml);
  }
  .top-problem__item:nth-child(1)::after {
    display: none;
  }

  section.top-answer {
    padding-top: 6rem;
    padding-bottom: 5rem;
  }
  .top-answer__deco {
    display: none;
  }
  /* ===== c-section-header SP ===== */
  .c-section-header {
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: 1rem;
  }
  .c-section-header-ja {
    font-size: 2.8rem;
    line-height: 1.4;
    white-space: normal;
    flex-shrink: 1;
    min-width: 0;
  }
  .p-mv-merits .c-section-header-ja {
    font-size: 2.8rem;
    line-height: 3.4rem;
  }
  .c-section-note {
    font-size: 1.4rem;
  }

  .c-section-header__sub,
  .p-reason-heading__sub {
    gap: 2rem;
  }

  .c-section-header__line,
  .p-reason-heading__line {
    width: 5rem;
  }

  .c-section-header__en,
  .p-reason-heading__en {
    font-size: 1.4rem;
    line-height: 2;
  }

  /* ===== c-case-card スマホ ===== */
  .c-case-card {
    gap: 12px;
  }
  .c-case-card__body {
    gap: 1.2rem;
  }
  .c-case-card__title {
    font-size: var(--fz-m);
  }
  .c-case-card__company {
    padding-top: 10px;
  }

  /* [7] フッター：営業時間・住所を左寄せ */
  .l-footer p.sp_only {
    text-align: left;
  }

  /* [8] フッター：住所リンクを通常テキスト風に（WordPress管理側でリンク削除が正式対応） */
  .l-footer p.sp_only:nth-of-type(2) a {
    color: inherit;
    text-decoration: none;
    pointer-events: none;
    cursor: text;
  }

  /* [9] フッターナビ全体の文字サイズを少し縮小 */
  .site-footer-nav-col a,
  .site-footer-nav-heading {
    font-size: 1.4rem;
  }

  /* [2] フッター SWELLブロックカラム 本文フォント縮小 */
  .l-footer .swell-block-columns__inner .swell-block-column p {
    font-size: 1.2rem;
  }

  /* c-service-btn：幅いっぱい */
  .c-service-btn-wrap {
    width: 100%;
  }
  .c-service-btn {
    width: 100%;
  }

  /* c-service-btn：ホバーをopacityのみに */
  .c-service-btn:hover {
    background: var(--white);
    opacity: var(--opacity-hover);
  }
  .c-service-btn:hover .c-service-btn__sub,
  .c-service-btn:hover .c-service-btn__main {
    color: var(--main);
  }
  /* c-service-btn と同じサイズに揃える */
  .header-btn.header-black-btn.c-service-btn {
    height: 6.8rem;
    width: 100%;
  }

  /* ユーティリティ: SP表示切り替え */
  .u-mobile {
    display: block;
  }
  .u-desktop {
    display: none;
  }

  /* category-column: postList 強制1カラム */
  #body_wrap.category-column
    #main_content
    .p-postList.-type-card
    .p-postList__item,
  #body_wrap.category-column
    #main_content
    .p-postList.-type-thumb
    .p-postList__item,
  #body_wrap.category-column
    #main_content
    .p-postList.-pc-col3
    .p-postList__item,
  #body_wrap.category-column
    #main_content
    .p-postList.-sp-col1
    .p-postList__item {
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
  }

  /* category-news: 行リスト SP レイアウト */
  .category-news .p-postList__link {
    grid-template-columns: auto 1fr;
    gap: 1rem 1.2rem;
    padding: 1.4rem 0.5rem;
  }
  .category-news .c-postTimes__posted {
    grid-column: 1;
    grid-row: 1;
  }
  .category-news .c-postThumb__cat {
    grid-column: 2;
    grid-row: 1;
  }
  .category-news .p-postList__title {
    grid-column: 1 / -1;
    grid-row: 2;
    white-space: normal;
    font-size: 1.5rem;
  }

  /* メディア掲載カテゴリーアーカイブ：SP帯は1列 */
  .category-media .p-postList {
    grid-template-columns: 1fr;
  }

  /* FAQ アイテム SP */
  .p-faq-item__question {
    gap: 1.2rem;
    padding: 0 0.8rem;
    min-height: 8rem;
  }
  .p-faq-item__q-icon,
  .p-faq-item__a-icon {
    width: 3rem;
    height: 3rem;
    flex-shrink: 0;
  }
  .p-faq-item__icon-label {
    font-size: 1.3rem;
  }
  /* .p-faq-item__question-text は既存定義済みのためスキップ */
  .p-faq-item__toggle {
    width: 2rem;
    height: 2rem;
  }
  .p-faq-item__answer-inner {
    gap: 1.2rem;
    padding: 0 0.8rem 2.4rem;
  }
  .p-faq-item__answer-text {
    font-size: 1.5rem;
  }

  /* ボタン SP */
  .c-btn-wrap {
    margin-top: 4rem;
  }
  .c-btn {
    width: 100%;
  }

  /* c-grad-panel（PC 2.2rem × 65% = 1.4rem） */
  .c-grad-panel__header {
    font-size: 1.4rem;
  }

  .p-page__content {
    margin-top: 6.4rem;
    margin-bottom: 6.4rem;
  }

  .site-footer-info-group {
    gap: 18px;
    flex-direction: column;
  }

  .w-footer__box {
    padding: 3rem 1rem;
  }
}

/* ========== 375〜600px スマホ中間調整 ========== */
@media screen and (max-width: 600px) {
  /* l-inner：20pxパディングを維持しつつ少し余裕を持たせる */
  .l-inner {
    padding-inline: var(--space-ml); /* 20px 維持 */
  }

  /* CTAセクション */
  .c-cta-section {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }

  /* フッター固定CTAバー：読みやすいサイズ */
  .footer-conversion li a {
    font-size: 15px;
    padding: 12px 10px 12px 46px;
  }

  /* デコ見出し */
  .c-deco-heading__text {
    font-size: 1.6rem;
  }
}

/* ========== 固定LINEバナー：SP縮小 ========== */
.side-line-banner {
  display: none;
}

/* ========== 320px 極小画面対応 ========== */
@media screen and (max-width: 374px) {
  /* ヘッダーロゴの固定幅を解除 */
  .-parallel-bottom .l-header__logo {
    width: auto;
    max-width: calc(100vw - 120px);
  }

  /* CTA の横パディングを縮小 */
  .c-cta-section {
    padding: 6rem 0 6rem;
  }

  /* フッター固定CTAバーのフォント縮小 */
  .footer-conversion li a {
    font-size: 13px;
    padding-left: 36px;
  }

  /* フッターロゴ縮小 */
  .site-footer-logo img {
    max-width: 250px;
  }
}
