/* 基本 */
.fs_22px {
	font-size: 2.2rem!important;	 
}
.defList_ind01 li.fs_22px {
    margin-left: 2.2rem;
    text-indent: -2.2rem;
}
.contract-icon01 {
    color: #afd7ec;
    font-size: 2.0rem;
    position: relative;
    bottom: -0.75px;
}
.notexpire_block .contract-icon01 {
    color: #f8c366;
}
@media (max-width: 1023px) {
    .defList_ind01 li.fs_22px{
        font-size: 2.0rem!important;
    }

}
/* 202506 modal_window シミュレーション条件を入力箇所*/
    .flex_block_wrap{
        display: flex;
        align-items: center;
        position: relative;
        width: 100%;
        justify-content: center;
        width: calc(100% - 26.14%);
    }
    .flex_block_wrap:before {
    position: absolute;
    inset: 0;
    display: block;
    width: 1px;
    height: 100%;
    margin: auto;
    content: "";
    background-color: var(--border-color);
}

    .result_wrap.flex{
            display: flex;
            justify-content: center;
            /* gap: 20px; */
            font-size: 1.8rem;
            font-weight: bold;
    }
    .contract-simulation__form{
        gap: 0;
    }
    .result_wrap .flex_block{
            display: flex;
            gap: 20px;
            align-items: center;
            line-height: 2.4rem;
            width: 20rem;
            justify-content: center;
    }
    .result_wrap .flex_block .subject_ages{
        font-size: 2.4rem;
    }
    .result_wrap .flex_block .subject_sex{
        font-size: 2.2rem;
    }
        .contract-simulation-modal__button{
            max-width: 320px;
            max-height: 48px;
        }
    .contract-simulation-modal .contract-simulation-modal__button{
            max-width: 392px;
            max-height: 80px;
            margin-inline: auto;
        }

    @media (max-width: 768px){
    .page-contract-simulation__box.result_wrap_inner{
            max-width: calc(100vw - 32px);
    }
    .page-contract-simulation__box.result_wrap_inner .result_wrap.flex{
            flex-direction: column;
            align-items: center;
            gap: 10px;
    }
    .page-contract-simulation__box.result_wrap_inner .result_wrap.flex .flex_block_wrap{
            width: 100%;
    }
    .result_wrap .flex_block:not(.sex_wrap){
            gap: 10px;
    }
}

/* シミュレーションベーススタイルシート*/
:root {
    --expire-color: #3FB8EC;
    --notexpire-color: #e87e00;
    --expire-bgcolor:#DCEEFA;
    --notexpire-bgcolor:#fdf0ca;
    --basiclink-color:#5b9bd5;
}
.basiclink-color{
    color: var(--basiclink-color);
}
@media (max-width: 1023px) {
}

/* 契約例 */
.contract-case {
    width: 16em;
    margin: auto;
}
@media (min-width: 1024px) {
    .contract-case {
        width: 100%;
        display: flex;
        width: auto;
        justify-content: center;
        gap: 20px;
    }
}

/* ふきだし */
*[type="button"],
*[type="submit"] {
	color: #fff;
}
.bubble-wrap {
  display: flex;
  gap: 24px;
  justify-content: center;
  margin: 40px 0;
}

.bubble {
    position: relative;
    padding: 20px 30px;
    border-radius: 12px;
    color: var(--expire-color);
    font-size: 24px;
    font-weight: 500;
    line-height: 1.6;
    text-align: center;
    width: 100%;
    background-color: var(--expire-bgcolor);
}

.bubble--orange {
  border-color: var(--notexpire-color);
  color: var(--notexpire-color);
  background-color: var(--notexpire-bgcolor);
}
/* .bubble::before{
    content: "";
    position: absolute;
    bottom: -25px;
    left: 50%;
    transform: translateX(-50%);
    border-width: 25px 15px 0 15px;
    border-style: solid;
} */
.bubble::after {
    content: "";
    position: absolute;
    bottom: -19px;
    left: 50%;
    transform: translateX(-50%);
    border-width: 25px 15px 0 15px;
    border-style: solid;
    border-color: var(--expire-bgcolor) transparent transparent transparent;
}

/* .bubble--orange:before {
  border-color: var(--notexpire-color) transparent transparent transparent;
} */

.bubble--orange::after {
  border-color: var(--notexpire-bgcolor) transparent transparent transparent;
}

@media (max-width: 1023px) {
.bubble{
    font-size: 20px;
    padding: 0.75em;
}
}
@media (max-width: 768px) {
.bubble{
    font-size: 18px;
    display: flex;
    align-items: center;
}
            
.bubble-wrap{
    gap: 15px;
}
}
/* ふきだし */

/* タブ */

.tab-nav:not(.is-notexpire),.tab-nav.is-expire {
    border-bottom:  solid var(--expire-color) 4px;
}

.tab-nav.is-notexpire {
  border-bottom: solid var(--notexpire-color) 4px;
}

.tab-nav{
    margin-bottom: 0;
}
.tab-nav__item_expire .tab-nav__button{
    background: var(--expire-color);
    border-color: var(--expire-color);
}
.tab-nav__item_expire .tab-nav__button:not(.tab-nav__button--active),
.tab-nav__item_notexpire .tab-nav__button:not(.tab-nav__button--active){
    opacity: 0.53;
}
.tab-nav__item_notexpire .tab-nav__button{
    background: var(--notexpire-color);
    border-color: var(--notexpire-color);
}
.tab-nav__button--active {
    position: relative;
    color: #ffffff;
    background: var(--expire-color);
    border-color: var(--expire-color);
}

.tab-contents__item{
    padding-block: 40px;
    background-color: #ffffff;
}

.tab-contents .tab-contents__item.expire_block{
    border-color: var(--expire-color);
    border: solid 4px var(--expire-color);
    border-top: unset;
}
.tab-nav__button--active:before{
    background: var(--expire-color);
}
.tab-nav__item_notexpire .tab-nav__button--active:before{
    background: var(--notexpire-color);
}
.tab-contents .tab-contents__item.notexpire_block{
    border-color: var(--notexpire-color);
    border: solid 4px var(--notexpire-color);
    border-top: unset;
}

@media (any-hover: hover) {
    .tab-nav__item_expire .tab-nav__button:not(.tab-nav__button--active):hover {
        color: #ffffff;
        background: var(--expire-color);
        border-color: var(--expire-color);
    }
    .tab-nav__item_notexpire .tab-nav__button:not(.tab-nav__button--active):hover {
        color: #ffffff;
        background: var(--notexpire-color);
        border-color: var(--notexpire-color);
    }
}
@media (max-width: 1023px) {
.tab-nav{
    gap: 24px;
}
}
@media (max-width: 768px) {
.tab-nav{
    gap: 15px;
}
.tab-nav__item_expire .tab-nav__button{
    padding-inline: 5px;
    font-size: 18px;
}
}
/*--
     タブ コンテンツ内
-----------------------------------------------*/
/* 共通 */
    .tab-contents__item .page-contract-simulation__box{
        max-width: 786px;
        margin: 40px auto;
    }
    @media (max-width: 768px) {
        .tab-contents__item .page-contract-simulation__box{
        width: 100%;
        max-width: unset;
        border-radius: unset;
        }
    }
    .simulation-result{
        display: flex;
        align-items: center;
    }
    .simulation-result__price-other{
        font-size: 1.6rem;
        font-weight: normal;
        letter-spacing: 0.45px;
    }
@media (max-width: 768px) {
    .simulation-result__price{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    }
    .simulation-result__price-other{
        display: block;
        width: 100%;
        text-align: center;
        position: relative;
    }

    .simulation-result__price-other{
        width: 100%;
        letter-spacing: 0px;
        white-space: nowrap;
    }
}
    @media (max-width: 1023px) {
}
    /* .simulation-result__price-other.spOnly{
        display: none;
    }
@media (max-width: 1023px) {
    .simulation-result__price-other.pcOnly{
        display: none;
    }*/
    

/*
    
    .simulation-result__price-other .priceparts-01,.simulation-result__price-other .priceparts-02{
        position: absolute;
        height: 3rem;
        font-size: 3em;
        font-weight: 100;
        top: 50%;
        bottom: 50%;
        transform: translateY(-50%);
        line-height: 2.5rem;
    }
    .simulation-result__price-other .priceparts-01{
      left: -1vw;
    }
   .simulation-result__price-other .priceparts-02{
      
       right: -1vw;
    }
} */
/* 保険料払込期間：65歳払込の場合 expire_block */

    .expire_block .page-contract-simulation__box{
        background-color: var(--expire-bgcolor);
        /* max-width: 786px;
        margin: 52px auto 40px; */
    }
    .expire_block .simulation-result__price-total{
        color: var(--expire-color);
        white-space: nowrap;
    }
    /* cont_basictxtbox_wrap */
    .expire_block .cont_basictxtbox_wrap{
        max-width: 962px;
        margin: auto;
    }
    /* expire_block */
    .expire_block{
        position: relative !important;
    }
    .expire_block .cont_diagram_wrap{
        	background: var(--expire-bgcolor);
            padding-block: 30px;
            margin-block: 60px;
    }
    .expire_block .cont_diagram_wrap .page-contract-simulation__title--h3{
        margin-bottom: 30px;
    }
    .expire_block .image.expire_img01{
    max-width: 837px;
    margin: auto;
    }

/* 保険料払込期間：10年の場合 notexpire_block */
    .notexpire_block .page-contract-simulation__box{
        background-color: var(--notexpire-bgcolor);
        /* max-width: 786px;
        margin: 52px auto 40px; */
    }
    .notexpire_block .simulation-result__price-total{
        color: var(--notexpire-color)
    }
    /* cont_basictxtbox_wrap */
    .notexpire_block .cont_basictxtbox_wrap{
        max-width: 962px;
        margin: auto;
    }
    /* expire_block */
    .notexpire_block{
        position: relative !important;
    }
    .notexpire_block .cont_diagram_wrap{
        	background: var(--notexpire-bgcolor);
            padding-block: 30px;
            margin-block: 60px;
    }
    .notexpire_block .cont_diagram_wrap .page-contract-simulation__title--h3{
        margin-bottom: 30px;
    }
    .notexpire_block .image.expire_img01{
    max-width: 837px;
    margin: auto;
    }


@media (max-width: 1023px) {
    .expire_block .image.expire_img01,
    .notexpire_block .image.expire_img01{
        margin-inline: 20px;
    }
}


/* 共通 basic-table */
     .basic-table_wrap{
        max-width: 786px;
        margin:auto;
     }

     .basic-table_wrap .countsize_m{
        font-size: 32px;
     }
     .basic-table_wrap .countsize_b{
        font-size: 36px;
     }
     .basic-table_wrap .basic-table{
        width: 100%;
     }
     .basic-table_wrap .value-a{
        font-size: 2.4rem;
        padding-left: 2px;
     }
     .basic-table_wrap .value-a.esp,
     .basic-table_wrap .value-b
     {
        font-size: 2.8rem;
        padding-left: 2px;
     }
/* 65歳払込期間：65歳払込の場合　expire_block カラー */

     .expire_block .basic-table_wrap .basic-table__data{
        border-top-color: var(--expire-color)!important;
     }
     .expire_block .expire_block .basic-table__data{
        border-right-color: var(--expire-color)!important;
     }
     .expire_block .basic-table_wrap .basic-table__data--header{
        border-right-color: var(--expire-color)!important;
     }
     .expire_block .basic-table:before{
        border-color: var(--expire-color)!important;
     }
     .expire_block .basic-table__data--header{
        background-color: var(--expire-bgcolor);
     }
/* 保険料払込期間：10年の場合 notexpire_block カラー */

     .notexpire_block .basic-table_wrap .basic-table__data{
        border-top-color: var(--notexpire-color)!important;
     }
     .notexpire_block .expire_block .basic-table__data{
        border-right-color: var(--notexpire-color)!important;
     }
     .notexpire_block .basic-table_wrap .basic-table__data--header{
        border-right-color: var(--notexpire-color)!important;
     }
     .notexpire_block .basic-table:before{
        border-color: var(--notexpire-color)!important;
     }
     .notexpire_block .basic-table__data--header{
        background-color: var(--notexpire-bgcolor);
     }

@media (max-width: 1023px) {
     .expire_block .cont_basictxtbox_wrap,
     .notexpire_block .cont_basictxtbox_wrap{
        padding-inline: 20px!important;
     }
     .basic-table_wrap {
    margin-inline: 20px;
    }
     .basic-table__row:not(:first-child) {
    border-top: 2px solid var(--expire-color);
    }
     .notexpire_block .basic-table__row:not(:first-child) {
    border-top: 2px solid var(--notexpire-color);
    }
}
     /* precautions_txt */
     .cont_basictxtbox_wrap.precautions_txt{
        margin-top: 75px;
     }
@media (min-width: 1024px) {
     .cont_basictxtbox_wrap.precautions_txt{
        margin-inline: 20px;
     }
}
@media (max-width: 1023px) {
     .cont_basictxtbox_wrap.precautions_txt{
        margin-top: 40px;
     }
}