
@media screen and (max-width: 560px) {
.wonder-header .wonder-header-inner .wonder-header-cta-wrapper {
rgba(53, 152, 219, 0.8) !important
}
}


@media screen and (max-width: 560px) {
.wonder-header .wonder-header-inner .wonder-header-logo-wrapper .wonder-header-main .wonder-header-logo img {
           width: 38% !important;
           height: 75% !important;
           margin: auto !important;
}
.wonder-header.section-main-container {
    height: 55px !important;
}
.wonder-header-main {
    height: 30px !important;
}
.swiper-wrapper-structure {
    display: -webkit-box !important;
}
[data-section-type=access] .wonder-default-main-content div.wonder-scroll-container.enabled ul li {
width: 350px !important;
}
}


@media screen and (min-width: 561px) {
.wonder-header .wonder-header-inner .wonder-header-logo-wrapper .wonder-header-main .wonder-header-logo img {
           max-width: unset !important;
           width: 170px !important;
}
 .wonder-header-text {
    margin-left:0px!important;
  }
}


@media screen and (min-width: 561px) {
    .wonder-profile-txt-box {
        width: 42.5vw !important; 
    }
.flip-target {
flex-direction: row-reverse !important;
}
}
@media screen and (max-width: 560px) {
    .wonder-default-main-content {
        width: unset !important;
    }
    .wonder-profile-txt-box {
        width: unset !important; 
    }
    .wonder-profile-img {
        width: unset !important;
    }
}


  div.wonder-footer-main .wonder-footer-logo img {
    width: 180px !important;
    height: 60px !important;
  }
.wonder-tab-container.enabled input.tab-input:checked+.tab-item {
    background-color: #38B2AF !important;
}


    @media screen and (max-width: 560px){
        [data-section-type=appeal] .wonder-scroll-container:not(.enabled) .scroll-contents:not(.swiper-active) ul:not(.card-container) .wonder-img-scroll-container
        {
            width: 90% !important;
        }
        [data-section-type=appeal] .wonder-scroll-container:not(.enabled) .scroll-contents:not(.swiper-active) ul:not(.card-container) li.swiper-slide-structure .wonder-li-container
        {
            flex-direction: column !important;
        }
        [data-section-type="tile"] .card-container {
            display: flex !important;
            flex-flow: column;
        }
    }
[data-section-type=profile] .wonder-profile-cont-box {
justify-content: center !important;
}


@media screen and (max-width: 560px) {
    .wonder-profile-cont-box {
        display: flex; /* 必ずフレックスボックスを有効化 */
        flex-direction: column; /* 子要素を縦方向に配置 */
    }

    .wonder-profile-img {
        order: -1; /* 画像を先頭に移動 */
    }

    .wonder-profile-txt-box {
        width: 100%; /* テキストボックスの幅を100%に調整 */
    }
}


@media screen and (max-width: 560px) {
    .wonder-cv-button-txt-block {
        margin-left: unset !important;
    }
}


@media screen and (min-width: 561px) {
    .text-shadow-7 {
        margin-right: 0px !important;
    }
    #id-7chxk14au img[data-composition-img-id="headerLogo"] {
        width: 40% !important;
    }
}


  @media screen and (min-width: 561px) {
    [data-section-type="profile"].wonder-profile .wonder-profile-txt-box {
      width: 480px !important;
    }
  }


@media screen and (min-width: 561px) {
  [data-section-type="cv"].wonder-cv .wonder-cv-wrapper .wonder-cv-inner-content-wrapper .wonder-cv-title {
        margin-bottom: 0;
        margin: auto;
  }
  .wonder-cv[data-composition-type=C] .wonder-cv-wrapper .wonder-cv-inner-content-wrapper .wonder-cv-block .wonder-cv-button-block {
    width: 320px !important;
  }
  .wonder-cv[data-composition-type="C"] .wonder-cv-wrapper {
    padding-bottom: 30px;
  }
}
@media screen and (max-width: 560px) {
  .wonder-cv[data-composition-type=C] .wonder-cv-wrapper .wonder-cv-inner-content-wrapper .wonder-cv-block .wonder-cv-button-block {
    width: 90% !important;
  }
}


  @media screen and (min-width: 561px) {
    [data-section-type="cv"].wonder-cv .wonder-cv-wrapper .wonder-cv-inner-content-wrapper .wonder-cv-block {
      height: 70px;
      padding-bottom: 12px;
    }
  }


    @media screen and (min-width: 561px) {
        [data-section-type="profile"].gaiyo .flip-target {
            flex-direction: row !important;
        }
        .wonder-cv .wonder-cv-wrapper .wonder-cv-back-img {
            width: 70% !important;
        }
        [data-section-type="cv"].wonder-cv .wonder-cv-wrapper .wonder-cv-inner-content-wrapper .wonder-cv-block {
            margin-right: auto;
            margin-left: auto;
        }
    }


@media screen and (max-width: 560px) {
    .wonder-cv[data-composition-type=B] .wonder-cv-wrapper .wonder-cv-button-block {
        width: 40% !important;
    }
}


.wonder-header[data-header-overlap=true] .wonder-cv-button-block.wonder-cv-tel-block {
border: 1px solid #a3a3a3 !important;
background: linear-gradient(0deg, #b6b6b6 22%, #a3a3a3 80%) !important;

}

.wonder-header[data-header-overlap=true] .wonder-cv-button-block.wonder-cv-tel-block a.tel-link {

text-shadow: 0px 0px 0px #fff !important;

}

.wonder-cv-mail-block {
    background: linear-gradient(0deg, #ff98a1 22%, #e57e87 80%) !important;
    border: 1px solid #e57e87 !important;
}

.wonder-cv-mail-block .wonder-cv-mail-text {

text-shadow: 0px 0px 0px #fff !important;

}


 
.wonder-header .fixed-banner-container .wonder-fix-banner-contents .wonder-fix-banner-image img {
    width: 30px !important;
    height: 30px !important;

}


/* ---------------------------------------------------- */
/* PCサイズ (min-width: 561px) のみ適用するスタイル - 全スライド適用 */
/* ---------------------------------------------------- */
@media (min-width: 561px) {
    /* 1. スライド全体を囲む ul 要素の幅を調整 */
    #id-lkkaox530 .row-el.card-container.scroll-card-container {
        white-space: nowrap;
        width: fit-content !important;
        min-width: fit-content !important;
    }

    /* 2. 幅を2倍にしたい特定のスライド要素に固定幅を適用 (セレクタから :first-child を削除) */
    #id-lkkaox530 .row-el.card-container .col-el.swiper-slide {
        width: 800px !important; /* ※この「800px」は、カード2枚分の適切な幅に調整してください。 */
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
    }

    /* 3. スライド内のカード本体の幅も100%に設定し、親の幅（800px）に合わせる (セレクタから :first-child を削除) */
    #id-lkkaox530 .row-el.card-container .col-el.swiper-slide .wonder-result-main,
    #id-lkkaox530 .row-el.card-container .col-el.swiper-slide .wonder-result-main-width {
        width: 100% !important;
    }

    /* 4. 画像ブロック内のBefore/Afterの幅は、親（800px）に対して50%ずつ（400px）になるように設定 (セレクタから :first-child を削除) */
    #id-lkkaox530 .row-el.card-container .col-el.swiper-slide .wonder-img-block > div {
        flex: 1 1 50% !important;
    }

    /* ---------------------------------------------------- */
    /* 新規追加・修正: テキストがはみ出さないように調整 */
    /* ---------------------------------------------------- */

    /* タイトルテキストのコンテナ調整 (セレクタから :first-child を削除) */
    #id-lkkaox530 .row-el.card-container .col-el.swiper-slide .wonder-result-main-title-wrapper .wonder-title-text-wrapper {
        max-width: none !important; 
        flex: 1 !important; 
        padding-left: 10px !important; 
        padding-right: 10px !important; 
    }

    /* 本文テキストのコンテナ調整 (セレクタから :first-child を削除) */
    #id-lkkaox530 .row-el.card-container .col-el.swiper-slide .wonder-reason-voice-block .wonder-voice-text {
        max-width: none !important; 
        padding-left: 20px !important; 
        padding-right: 20px !important; 
    }

    /* 医師のコメント、お客様の声などのテキスト調整（共通化のため） (セレクタから :first-child を削除) */
    #id-lkkaox530 .row-el.card-container .col-el.swiper-slide .wonder-reason-voice-block .wonder-padding {
        max-width: none !important; 
        flex: 1 !important; 
        padding-left: 10px !important; 
        padding-right: 10px !important; 
    }
    
    /* tableのtd/th内のテキストを囲むdivの幅も調整 (セレクタから :first-child を削除) */
    #id-lkkaox530 .row-el.card-container .col-el.swiper-slide .tbl-implant th > div,
    #id-lkkaox530 .row-el.card-container .col-el.swiper-slide .tbl-implant td > div {
        width: 100% !important; 
        white-space: normal !important; 
    }

    /* テキストそのもののspanタグにも念のため調整 (セレクタから :first-child を削除) */
    #id-lkkaox530 .row-el.card-container .col-el.swiper-slide span.wordBreak-break-all {
        white-space: normal !important; 
        word-break: break-all !important; 
    }
}


/* ---------------------------------------------------- */
/* スマホサイズ (max-width: 560px) のみ適用するスタイル */
/* ---------------------------------------------------- */
@media (max-width: 560px) {
    /* ... 隙間調整のためのマージン設定（省略なし） ... */
    #id-lkkaox530 .col-el.swiper-slide {
        margin-right: 0px !important; 
        margin-left: 0 !important; 
    }

    #id-lkkaox530 .row-el.card-container,
    #id-lkkaox530 .main-contents.scroll-contents {
        padding-left: 4px !important; /* 9割サイズに調整 */
        padding-right: 0px !important; 
    }
    
    #id-lkkaox530 .col-el.swiper-slide:not(:first-child) {
        margin-left: -4px !important; /* 9割サイズに調整 */
    }
    /* ... カード内要素のフォントサイズ・パディング設定（省略なし） ... */

    /* カード内のコンテンツエリアのパディング（横幅に影響）*/
    #id-lkkaox530 .col-el.swiper-slide .wonder-result-main-element {
        padding-left: 0px !important; 
        padding-right: 0px !important; 
    }

    /* ---------------------------------------------------- */
    /* ★ 表の横幅強制調整: テキスト幅への視覚的統一 ★ */
    /* ---------------------------------------------------- */
    
    #id-lkkaox530 .col-el.swiper-slide .tbl-implant {
        /* 表の幅を自動にし、左右マージンで中央寄せ */
        width: auto !important; 
        margin-left: auto !important; 
        margin-right: auto !important;
        
        /* 視覚的な横幅を縮小するために scale 変換を使用（現在の9割） */
        transform: scaleX(0.9);
        transform-origin: top center; /* 中央を基準に縮小 */
        
        table-layout: fixed !important;
        padding-left: 0px !important; 
        padding-right: 0px !important;
        border-collapse: collapse;
    }

    /* テーブルセルのパディングと改行制御はそのまま維持 */
    #id-lkkaox530 .col-el.swiper-slide .tbl-implant th,
    #id-lkkaox530 .col-el.swiper-slide .tbl-implant td {
        padding-top: 1px !important; 
        padding-bottom: 1px !important; 
        padding-left: 1px !important;  
        padding-right: 1px !important;
        
        font-size: 8px !important;
        word-wrap: break-word !important;
        word-break: break-all !important;
    }
    
    #id-lkkaox530 .col-el.swiper-slide .tbl-implant th {
        width: 25% !important; 
        white-space: normal !important;
    }
    #id-lkkaox530 .col-el.swiper-slide .tbl-implant td {
        width: 75% !important; 
    }
}


[data-section-type=result] .wonder-default-main-content .row-el .wonder-result-main .wonder-result-main-width .wonder-result-main-title-wrapper {

    background-color: #bd9c73 !important;
}

[data-section-type=result] .wonder-default-main-content .row-el .wonder-result-main .wonder-result-main-width .wonder-result-main-element .wonder-img-block .wonder-img-right .wonder-img-index-right {
    background-color: #bd9c73 !important;

}

[data-section-type=result] .wonder-default-main-content .row-el .wonder-result-main .wonder-result-main-width .wonder-result-main-title-wrapper .wonder-title-icon {

border-color: #dac0a3 !important;

}




@media screen and (max-width: 560px) {
    .wonder-cv .wonder-cv-block .wonder-cv-button-block {
        width: 320px !important;
        height: 70px !important;
    }
    .wonder-cv .wonder-cv-block .wonder-cv-button-block a.wonder-cv-button-link .wonder-cv-icon-container {
      left: 20px !important;
    }

}


[data-section-type=profile] .wonder-profile-cont-box .wonder-profile-txt-box .wonder-profile-txt-ttl02 {

border-color: #dac0a3 !important;

}

.card-container [data-card-type=profile-1] .wonder-profile-cont-box .wonder-profile-txt-box .wonder-description-content .wonder-profile-txt-ttl03 {

border-color: #dac0a3 !important;

}

[data-section-type=profile] .wonder-profile-cont-box .wonder-profile-txt-box {

    padding-bottom: 10px !important;
}




@media screen and (max-width: 560px) {
    a.wonder-cv-button-link .cv-button-top-container .wonder-cv-icon-container img {
        width: 65% !important;
    }
}


.wonder-keyvisual .wonder-payment-method-img-container .payment-icon-box-wrapper {
    background: rgba(255, 255, 255, 0.5) !important;
}

.wonder-keyvisual .wonder-payment-method-img-container .payment-icon-box {
    background: rgba(255, 255, 255, 0) !important;
}



@media screen and (max-width: 560px) {
  .wonder-keyvisual-main .wonder-keyvisual-text-wrapper img {
    width: 80% !important;
  }
}


@media screen and (max-width: 560px) {
  [data-section-type="profile"] .wonder-default-main-content .wonder-profile-img img {
    width: 100% !important;
  }
}
@media screen and (min-width: 561px) {
  .smallerPic {
    width: 570px !important;
  }
}
