/* 561px以上のデスクトップ・タブレット向け設定 */
@media screen and (min-width: 561px) {
    /* テキストと画像を横並びにする設定 */
    .cv-title-wrapper {
        display: flex;          /* 横並びにする */
        justify-content: center; /* 中央に寄せる */
        align-items: center;     /* 垂直方向の高さ合わせ */
        flex-wrap: nowrap;      /* 絶対に改行させない */
        white-space: nowrap;    /* テキストの折り返しを禁止 */
    }

    /* テキスト部分の調整 */
    .cv-title-text {
        margin-right: 10px;      /* 画像との間に少し隙間を作る */
    }

    .wonder-header[data-composition-type=D]:has(.wonder-payment-method-img-container) .wonder-header-inner .wonder-header-logo-wrapper .wonder-header-main .wonder-header-logo img {
      height: 60px !important;
      width: 300px !important;
      max-width: unset !important;
    }
    .wonder-cv .wonder-cv-wrapper .wonder-cv-inner-content-wrapper .wonder-cv-block .wonder-cv-bubble {
      position: relative;
      right: 30px !important;
    }
    [data-section-type="cv"] .wonder-cv-title .cv-title-wrapper img {
      vertical-align: middle;
      width: 355px !important;
      height: 45px !important;
    }
}

/* 560px以下のスマホ向け設定 */
@media screen and (max-width: 560px) {
    /* 吹き出し部分のマージン調整（追加分） */
    .wonder-cv .wonder-cv-wrapper .wonder-cv-inner-content-wrapper .wonder-cv-block .wonder-cv-bubble {
        margin-left: -75px !important;
    }

    .cv-title-wrapper {
        display: block;
        text-align: center;
    }
    
    .cv-icon-img img {
        width: 300px !important;
        margin-top: 10px;
    }

    /* タイトルロゴ全体の中央寄せ設定 */
    .title-logo-container {
        display: flex;
        flex-direction: column; 
        align-items: center;    /* 横方向の中央寄せ */
        justify-content: center;
    }

    .title-logo-image {
        display: flex;
        justify-content: center; /* ロゴと「が」を中央に並べる */
        align-items: center;     /* 上下中央（垂直方向）を揃える */
        width: 100%;
    }

    /* 「が」の文字の微調整（HTML直書きのtop:3pxを打ち消し） */
    .title-logo-image span.display-none-f-pc {
        top: 0 !important;
        margin-left: 5px;        /* ロゴとの間に少し隙間 */
    }
    .wonder-cv .wonder-cv-wrapper .wonder-cv-back-person-img {
      margin-right: 50px !important;
    }
    .wonder-header[data-composition-type=D]:has(.wonder-payment-method-img-container) .wonder-header-inner .wonder-header-logo-wrapper .wonder-header-main .wonder-header-logo img {
      height: 60px !important;
      width: 250px !important;
      max-width: unset !important;
    }
}
[data-section-type="footer"] .wonder-footer-logo img {
  width: 300px !important;
  height: 60px !important;
}


    @media screen and (max-width: 560px) {
        [data-section-type="appeal"] .wonder-scroll-container.enabled .row-el.card-container .col-el .wonder-li-container .wonder-appeal-text-container  {
            margin-top: 15px !important;
            margin-bottom: 15px !important;
        }
        [data-section-type=appeal].introduction-avaiable .wonder-scroll-container.enabled .row-el.card-container .col-el {
          height: 550px !important;
        }
    }


/* 561px以上のデスクトップ・タブレット向け設定 */
@media screen and (min-width: 561px) {
    /* テキストと画像を横並びにする設定 */
    .cv-title-wrapper {
        display: flex;          /* 横並びにする */
        justify-content: center; /* 中央に寄せる */
        align-items: center;     /* 垂直方向の高さ合わせ */
        flex-wrap: nowrap;      /* 絶対に改行させない */
        white-space: nowrap;    /* テキストの折り返しを禁止 */
    }

    /* テキスト部分の調整 */
    .cv-title-text {
        margin-right: 10px;      /* 画像との間に少し隙間を作る */
    }

    /* 画像のサイズ指定 */
    .cv-icon-img img {
        width: 250px !important;
        vertical-align: middle;
    }

    /* ヘッダーロゴへのマージン設定 */
    .wonder-header[data-composition-type=D]:has(.wonder-payment-method-img-container) .wonder-header-inner .wonder-header-logo-wrapper .wonder-header-main .wonder-header-logo img {
        margin-left: 25px !important;
    }
    [data-section-type="util"].service-block {
      display: flex !important;
      justify-content: center !important;
    }
    [data-section-type="cv"] .wonder-cv-wrapper .wonder-cv-title img {
      width: 380px !important;
      top: 15px !important;
      position: relative !important;
    }
    [data-section-type="reason"].logo-title-title .section-whole-wrapper .section-main-title-container .title-container img {
        width: 440px !important;
      height: 70px !important;
      position: relative;
      top: 20px !important;  
    }
    .wonder-cv .wonder-cv-wrapper .wonder-cv-inner-content-wrapper .wonder-cv-title {
      margin-top: -15px !important;
    }
    .wonder-cv .wonder-cv-wrapper .wonder-cv-back-person-img {
      left: 70px !important;
    }
}

/* 560px以下のスマホ向け設定 */
@media screen and (max-width: 560px) {

    .cv-title-wrapper {
        display: block;
        text-align: center;
    }
    
    .cv-icon-img img {
        width: 300px !important;
        margin-top: 10px;
    }

    /* タイトルロゴ全体の中央寄せ設定 */
    .title-logo-container {
        display: flex;
        flex-direction: column; 
        align-items: center;    /* 横方向の中央寄せ */
        justify-content: center;
    }

    .title-logo-image {
        display: flex;
        justify-content: center; /* ロゴと「が」を中央に並べる */
        align-items: center;     /* 上下中央（垂直方向）を揃える */
        width: 100%;
    }

    /* 「が」の文字の微調整（HTML直書きのtop:3pxを打ち消し） */
    .title-logo-image span.display-none-f-pc {
        top: 0 !important;
        margin-left: 5px;        /* ロゴとの間に少し隙間 */
    }
}


    /* ボタンの見た目 */
    .reform-tab-menu { display: flex; justify-content: center; gap: 10px; margin: 0px auto; }
    .tab-btn { padding: 12px 20px; border: 2px solid #f67009; background: #fff; color: #f67009; cursor: pointer; border-radius: 8px; font-weight: bold; }
    .tab-btn.active { background: #f67009; color: #fff; }


    [data-section-type=result] .wonder-default-main-content .row-el .wonder-result-main .wonder-result-main-width .wonder-result-main-title-wrapper,
    .tab-btn.active {
        background-color: rgb(6, 49, 145) !important;
        border-color: rgb(6, 49, 145) !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: rgb(6, 49, 145) !important;
        box-shadow: none !important;
    }
    .tab-btn.active {
        color: white !important;
    }
    .tab-btn {
        border-color: rgb(6, 49, 145) !important;
        background-color: white !important;
        color: rgb(6, 49, 145) !important;
    }


/* 561px以上のデスクトップ・タブレット向け設定 */
@media screen and (min-width: 561px) {
    /* テキストと画像を横並びにする設定 */
    .cv-title-wrapper {
        display: flex;          /* 横並びにする */
        justify-content: center; /* 中央に寄せる */
        align-items: center;     /* 垂直方向の高さ合わせ */
        flex-wrap: nowrap;      /* 絶対に改行させない */
        white-space: nowrap;    /* テキストの折り返しを禁止 */
    }

    /* テキスト部分の調整 */
    .cv-title-text {
        margin-right: 10px;      /* 画像との間に少し隙間を作る */
    }

    .wonder-header[data-composition-type=D]:has(.wonder-payment-method-img-container) .wonder-header-inner .wonder-header-logo-wrapper .wonder-header-main .wonder-header-logo img {
      height: 60px !important;
      width: 300px !important;
      max-width: unset !important;
    }
    .wonder-cv .wonder-cv-wrapper .wonder-cv-inner-content-wrapper .wonder-cv-block .wonder-cv-bubble {
      position: relative;
      right: 30px !important;
    }
    [data-section-type="cv"] .wonder-cv-title .cv-title-wrapper img {
      vertical-align: middle;
      width: 355px !important;
      height: 45px !important;
    }
}

/* 560px以下のスマホ向け設定 */
@media screen and (max-width: 560px) {
    /* 吹き出し部分のマージン調整（追加分） */
    .wonder-cv .wonder-cv-wrapper .wonder-cv-inner-content-wrapper .wonder-cv-block .wonder-cv-bubble {
        margin-left: -75px !important;
    }

    .cv-title-wrapper {
        display: block;
        text-align: center;
    }
    
    .cv-icon-img img {
        width: 300px !important;
        margin-top: 10px;
    }

    /* タイトルロゴ全体の中央寄せ設定 */
    .title-logo-container {
        display: flex;
        flex-direction: column; 
        align-items: center;    /* 横方向の中央寄せ */
        justify-content: center;
    }

    .title-logo-image {
        display: flex;
        justify-content: center; /* ロゴと「が」を中央に並べる */
        align-items: center;     /* 上下中央（垂直方向）を揃える */
        width: 100%;
    }

    /* 「が」の文字の微調整（HTML直書きのtop:3pxを打ち消し） */
    .title-logo-image span.display-none-f-pc {
        top: 0 !important;
        margin-left: 5px;        /* ロゴとの間に少し隙間 */
    }
    .wonder-cv .wonder-cv-wrapper .wonder-cv-back-person-img {
      margin-right: 50px !important;
    }
    .wonder-header[data-composition-type=D]:has(.wonder-payment-method-img-container) .wonder-header-inner .wonder-header-logo-wrapper .wonder-header-main .wonder-header-logo img {
      height: 60px !important;
      width: 250px !important;
      max-width: unset !important;
    }
}
[data-section-type="footer"] .wonder-footer-logo img {
  width: 300px !important;
  height: 60px !important;
}


    @media screen and (max-width: 560px) {
        [data-section-type="appeal"] .wonder-scroll-container.enabled .row-el.card-container .col-el .wonder-li-container .wonder-appeal-text-container  {
            margin-top: 15px !important;
            margin-bottom: 15px !important;
        }
        [data-section-type=appeal].introduction-avaiable .wonder-scroll-container.enabled .row-el.card-container .col-el {
          height: 550px !important;
        }
    }


/* 561px以上のデスクトップ・タブレット向け設定 */
@media screen and (min-width: 561px) {
    /* テキストと画像を横並びにする設定 */
    .cv-title-wrapper {
        display: flex;          /* 横並びにする */
        justify-content: center; /* 中央に寄せる */
        align-items: center;     /* 垂直方向の高さ合わせ */
        flex-wrap: nowrap;      /* 絶対に改行させない */
        white-space: nowrap;    /* テキストの折り返しを禁止 */
    }

    /* テキスト部分の調整 */
    .cv-title-text {
        margin-right: 10px;      /* 画像との間に少し隙間を作る */
    }

    /* 画像のサイズ指定 */
    .cv-icon-img img {
        width: 250px !important;
        vertical-align: middle;
    }

    /* ヘッダーロゴへのマージン設定 */
    .wonder-header[data-composition-type=D]:has(.wonder-payment-method-img-container) .wonder-header-inner .wonder-header-logo-wrapper .wonder-header-main .wonder-header-logo img {
        margin-left: 25px !important;
    }
    [data-section-type="util"].service-block {
      display: flex !important;
      justify-content: center !important;
    }
    [data-section-type="cv"] .wonder-cv-wrapper .wonder-cv-title img {
      width: 380px !important;
      top: 15px !important;
      position: relative !important;
    }
    [data-section-type="reason"].logo-title-title .section-whole-wrapper .section-main-title-container .title-container img {
        width: 440px !important;
      height: 70px !important;
      position: relative;
      top: 20px !important;  
    }
    .wonder-cv .wonder-cv-wrapper .wonder-cv-inner-content-wrapper .wonder-cv-title {
      margin-top: -15px !important;
    }
    .wonder-cv .wonder-cv-wrapper .wonder-cv-back-person-img {
      left: 70px !important;
    }
}

/* 560px以下のスマホ向け設定 */
@media screen and (max-width: 560px) {

    .cv-title-wrapper {
        display: block;
        text-align: center;
    }
    
    .cv-icon-img img {
        width: 300px !important;
        margin-top: 10px;
    }

    /* タイトルロゴ全体の中央寄せ設定 */
    .title-logo-container {
        display: flex;
        flex-direction: column; 
        align-items: center;    /* 横方向の中央寄せ */
        justify-content: center;
    }

    .title-logo-image {
        display: flex;
        justify-content: center; /* ロゴと「が」を中央に並べる */
        align-items: center;     /* 上下中央（垂直方向）を揃える */
        width: 100%;
    }

    /* 「が」の文字の微調整（HTML直書きのtop:3pxを打ち消し） */
    .title-logo-image span.display-none-f-pc {
        top: 0 !important;
        margin-left: 5px;        /* ロゴとの間に少し隙間 */
    }
}


    /* ボタンの見た目 */
    .reform-tab-menu { display: flex; justify-content: center; gap: 10px; margin: 0px auto; }
    .tab-btn { padding: 12px 20px; border: 2px solid #f67009; background: #fff; color: #f67009; cursor: pointer; border-radius: 8px; font-weight: bold; }
    .tab-btn.active { background: #f67009; color: #fff; }


    [data-section-type=result] .wonder-default-main-content .row-el .wonder-result-main .wonder-result-main-width .wonder-result-main-title-wrapper,
    .tab-btn.active {
        background-color: rgb(6, 49, 145) !important;
        border-color: rgb(6, 49, 145) !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: rgb(6, 49, 145) !important;
        box-shadow: none !important;
    }
    .tab-btn.active {
        color: white !important;
    }
    .tab-btn {
        border-color: rgb(6, 49, 145) !important;
        background-color: white !important;
        color: rgb(6, 49, 145) !important;
    }