.home_page .key {
    --height: 65vw;
    --min-height: 550px;
    --max-height: 1080px;
    height: var(--height);
    min-height: var(--min-height);
    max-height: var(--max-height);
    background-size: cover;
    background-color: var(--main-color);
    z-index: 0
}

.home_page .key .inner {
    position: relative;
    padding: 0;
    width: 100%
}

.home_page .key .mv_slider:not(.slick-slider) {
    display: flex;
    overflow: hidden;
    opacity: 0
}

.home_page .key_video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.home_page .key_video:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2)
}

.home_page .key_video video {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.home_page .key .key_text {
    position: relative;
    overflow: hidden;
    font-size: 10px
}

.home_page .key .key_text .item {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    height: var(--height);
    min-height: var(--min-height);
    max-height: var(--max-height);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding-top: 8.1em
}

.home_page .key .catch {
    margin: auto;
    text-align: center
}

.home_page .key h2,
.home_page .key p {
    color: #fff;
    font-weight: 700
}

.home_page .key h2 {
    margin-bottom: 0.5333333333em;
    font-size: 6em;
    line-height: 1.3667;
    letter-spacing: 0.16em;
    text-shadow: 1px 1.732px 0px rgba(0, 0, 0, 0.75), 0px 0px 50px rgba(0, 0, 0, 0.5), 0px 0px 36px rgba(0, 0, 0, 0.5)
}

.home_page .key h2 .tt_sm {
    font-size: 0.6em
}

.home_page .key p {
    font-size: 2.6em;
    line-height: 1.846153;
    letter-spacing: 0.1em;
    text-shadow: 1px 1.732px 0px rgba(0, 0, 0, 0.75), 0px 0px 10px rgba(0, 0, 0, 0.5), 0px 0px 16px rgba(0, 0, 0, 0.8)
}

.home_page .topic_path {
    display: none
}

@media screen and (min-width:1921px) {
    .home_page .key {
        --max-height: 1300px;
        --height: 50vw
    }
}

@media only screen and (max-width:1560px) and (min-width:769px) and (orientation:landscape) {
    .home_page .key {
        --max-height: 100vh
    }

    .home_page .key .key_text {
        font-size: min(10px, 0.6vw)
    }
}

@media only screen and (max-width:1170px) and (min-width:769px) {
    .home_page .key .key_text {
        font-size: min(0.8vw, 1vh)
    }
}

.wrap_title h3 {
    color: var(--cl-tl);
    font-size: 40px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0.1em;
    font-feature-settings: "palt"
}

.wrap_title .en {
    color: var(--clr2);
    font-size: 22px;
    font-weight: 500;
    line-height: 1;
    margin-bottom: 8px;
    text-transform: uppercase
}

.wrap_title .en.tl_en {
    position: relative;
    padding-left: 0.9090909091em;
    top: -0.1363636364em
}

.wrap_title .en.tl_en:before {
    content: "";
    position: absolute;
    top: 0.4090909091em;
    left: 0;
    width: round(0.3636363636em, 1px);
    height: round(0.3636363636em, 1px);
    border-radius: 50%;
    background-color: var(--clr2)
}

.wrap_title.st01 h3 {
    margin-bottom: 15px
}

.wrap_title.st01 .en.tl_en {
    padding-left: 22px
}

.wrap_title.st01 .en.tl_en:before {
    left: 2px
}

.wrap_title.st02 {
    text-align: center
}

.wrap_title.st02 .en {
    color: var(--cl-tl);
    margin-bottom: 9px
}

.wrap_title.st02 h3 {
    position: relative;
    display: flex;
    align-items: center;
    color: var(--clr1)
}

.wrap_title.st02 h3:after,
.wrap_title.st02 h3:before {
    content: "";
    position: relative;
    top: 1px;
    display: block;
    width: 100%;
    height: 1px;
    background-color: var(--cl-tl)
}

.wrap_title.st02 h3 span {
    flex: 0 0 auto;
    padding: 0 34px
}

.wrap_title.tl_white .en,
.wrap_title.tl_white h3 {
    color: #ffffff
}

.wrap_title.tl_white .en {
    font-weight: 400
}

@media only screen and (min-width:769px) {
    .b_grid {
        display: grid
    }

    .b_grid .column-star1 {
        grid-row: 1/span 3
    }

    .b_grid .column-star2 {
        grid-column-start: 2;
        grid-row: 1/span 3
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1300px) {
    .wrap_title h3 {
        font-size: 30px
    }

    .wrap_title .en {
        font-size: 18px;
        margin-bottom: 3px
    }

    .wrap_title.st01 h3 {
        margin-bottom: 7px
    }

    .wrap_title.st02 h3 span {
        padding: 0 10px
    }
}

.idx01 {
    padding: 90px 0px 91px;
    background: url(../images/idx01_bg.jpg) no-repeat center/cover
}

.idx01 .block_news {
    background-color: #fff;
    box-shadow: -3px 0px 30px 0px rgba(0, 0, 0, 0.06);
    border-radius: 20px;
    padding: 64px 80px 60px
}

.idx01 .wrap_title {
    position: relative;
    padding-left: 3.1666666667em;
    margin-bottom: 39px;
    margin-top: 35px
}

.idx01 .wrap_title:before {
    content: "";
    position: absolute;
    top: -0.2222222222em;
    left: 0.4444444444em;
    background: url(../images/idx01_illus.svg) no-repeat center/contain;
    width: 2.1111111111em;
    height: 1.7777777778em
}

.idx01 .wrap_title h3 {
    font-size: 48px
}

.idx01 .wrap_title .en {
    letter-spacing: 0.05em;
    margin-bottom: 6px
}

.idx01 h4 {
    font-size: 26px;
    font-weight: 500;
    font-feature-settings: "palt";
    letter-spacing: 0.1em;
    position: relative;
    padding-left: 1.5em;
    margin-bottom: -42px
}

.idx01 h4:before {
    content: "";
    position: absolute;
    left: -0.0384615385em;
    top: 0.1538461538em;
    width: 1.3461538462em;
    height: 1.3461538462em;
    background: url(../images/ic_logo.svg) no-repeat center/contain
}

.idx01 .tab_news {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    margin-bottom: 32px
}

.idx01 .tab_news .tab_it {
    position: relative;
    margin-left: 5px;
    max-width: 110px;
    text-align: center;
    cursor: pointer;
    width: calc((100% - 15px) / 3)
}

.idx01 .tab_news .tab_it:first-child {
    --cl: var(--main-color)
}

.idx01 .tab_news .tab_it:nth-child(2) {
    --cl: var(--clr2)
}

.idx01 .tab_news .tab_it:nth-child(3) {
    --cl: var(--clr3)
}

.idx01 .tab_news .tab_it:before {
    content: "";
    position: absolute;
    bottom: -7px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 9px;
    height: 8px;
    background-color: var(--cl);
    opacity: 0;
    transition: 0.3s all;
    clip-path: polygon(100% 0, 0 0, 50% 100%)
}

.idx01 .tab_news .tab_it .tt {
    line-height: 1.3;
    font-feature-settings: "palt";
    letter-spacing: 0.1em;
    color: #fff;
    padding: 6px 10px 7px;
    background-color: var(--cl);
    border-radius: 50px
}

.idx01 .tab_news .tab_it.active:before {
    opacity: 1
}

.idx01 .tab_content {
    position: relative;
    z-index: 1;
    overflow: hidden
}

.idx01 .tab_content .content {
    transition: all 0.3s ease-in-out
}

.idx01 .tab_content .content>div {
    opacity: 0;
    z-index: -10;
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    transition: all 0.5s ease-in-out
}

.idx01 .tab_content .content>div.active {
    opacity: 1;
    z-index: 1;
    visibility: visible
}

.idx01 .list_post li {
    border-bottom: 1px solid #ececec;
    width: auto;
    line-height: 2
}

.idx01 .list_post a {
    display: flex;
    align-items: center;
    text-decoration: none;
    padding: 17.5px 40px 18px 14px;
    --w: 129px;
    transition: all 0.3s;
    letter-spacing: 0.1em;
    white-space: nowrap;
    max-width: 100%;
    color: var(--clr1);
    position: relative
}

.idx01 .list_post a:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    margin: auto;
    background-color: var(--cl-tl);
    mask-image: url(../images/ic_arr.svg);
    -webkit-mask-image: url(../images/ic_arr.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-size: 100% auto;
    -webkit-mask-size: 100% auto;
    mask-position: center;
    -webkit-mask-position: center;
    width: 15px;
    height: 13px
}

.idx01 .list_post a span {
    display: inline-block
}

.idx01 .list_post a:hover {
    opacity: 1
}

@media only screen and (min-width:769px) {
    .idx01 .list_post a:hover {
        background-color: rgba(55, 128, 198, 0.08)
    }
}

.idx01 .list_post a .date {
    width: var(--w);
    transition: all 0.3s;
    color: var(--clr1);
    font-weight: 500
}

.idx01 .list_post a .cate {
    color: #fff;
    border-radius: 50px;
    background-color: var(--clr2);
    padding: 9px 10px 9px;
    line-height: 1;
    font-size: 14px;
    text-align: center;
    width: 110px;
    position: relative;
    top: 1px
}

.idx01 .list_post a .cate.column {
    background-color: var(--clr3)
}

.idx01 .list_post a .title {
    width: calc(100% - var(--w) - 110px);
    position: relative;
    padding-left: 26px;
    text-overflow: ellipsis;
    font-weight: 500;
    overflow: hidden
}

.idx01 .btn-group .btn {
    max-width: 260px;
    margin-top: 10px;
    display: none
}

.idx01 .btn-group .btn.active {
    display: block
}

@media only screen and (min-width:769px) {
    .idx01 .b_grid {
        grid-template-columns: 27% 71%;
        justify-content: space-between
    }

    .idx01 .block_news {
        max-width: 900px;
        width: 100%;
        margin-left: auto
    }

    .idx01 .tab_news .tab_it:not(.active):hover {
        opacity: 0.8
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1300px) {
    .idx01 {
        padding: 70px 0px
    }

    .idx01 .block_news {
        padding: 40px 5% 40px
    }

    .idx01 .wrap_title {
        margin-bottom: 30px;
        margin-top: 24px
    }

    .idx01 .wrap_title h3 {
        font-size: 36px
    }

    .idx01 .wrap_title .en {
        margin-bottom: 0
    }

    .idx01 h4 {
        font-size: 24px
    }

    .idx01 .tab_news {
        margin-bottom: 10px
    }

    .idx01 .list_post a {
        --w: 110px
    }

    .idx01 .list_post a .cate {
        font-size: 12px;
        width: 95px
    }

    .idx01 .list_post a .title {
        padding-left: 10px;
        width: calc(100% - var(--w) - 95px)
    }
}

@media only screen and (min-width:769px) and (max-width:1000px) {
    .idx01 .wrap_title {
        padding-left: 2.1667em
    }

    .idx01 .wrap_title:before {
        left: -0.3em
    }

    .idx01 .wrap_title h3 {
        letter-spacing: 0.05em
    }

    .idx01 .b_grid {
        grid-template-columns: 27% 70%
    }

    .idx01 h4 {
        display: table;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 10px
    }

    .idx01 .tab_news {
        justify-content: center
    }
}

@keyframes marqueeImg {
    0% {
        background-position-x: 0
    }

    to {
        background-position-x: -310.5em
    }
}

.idx02 {
    padding: 88px 0px 90px;
    background: url(../images/idx02_bg.jpg) no-repeat center/cover;
    position: relative;
    z-index: 0
}

.idx02:before {
    content: "";
    position: absolute;
    top: 31px;
    left: 0;
    width: 310.5em;
    height: 14.4em;
    background: url(../images/idx02_scroll.svg) repeat-x center/auto 100%;
    z-index: -1;
    animation: marqueeImg 40s linear infinite;
    opacity: 0.08;
    font-size: 10px
}

.idx02 .wrap_title {
    margin-bottom: 50px
}

.idx02 .idx_logo {
    max-width: 496px;
    margin: 12px auto 7px
}

.idx02 .idx_logo a:hover {
    opacity: 1
}

.idx02 .b_tel {
    padding-left: 0
}

.idx02 .b_tel a {
    color: #ffffff
}

.idx02 .b_ct {
    display: table;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 28px;
    padding-left: 2px
}

.idx02 .col_info {
    color: #ffffff
}

.idx02 .col_img {
    color: #ffffff
}

.idx02 .col_img img {
    border-radius: 20px
}

.idx02 .col_img figure {
    font-size: 10px;
    position: relative
}

.idx02 .col_img figure:before {
    content: "";
    position: absolute;
    top: -4.1em;
    left: -6.8em;
    background: url(../images/idx02_illus.svg) no-repeat center/contain;
    width: 9.9em;
    height: 8.7em
}

.idx02 .box_payment {
    background-color: #ffffff;
    padding: 42px 44px 38px 46px;
    border-radius: 20px;
    margin-bottom: 20px
}

.idx02 .box_payment p {
    color: var(--clr1);
    font-size: 16px;
    line-height: 1.875;
    font-feature-settings: "palt";
    margin-bottom: 0px
}

.idx02 .box_payment p:last-child {
    margin-bottom: 0
}

.idx02 .box_payment .fw {
    font-weight: 600
}

.idx02 .list_payment {
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    margin: 30px -9px 0
}

.idx02 .list_payment .it {
    margin: 0 9px
}

.idx02 .list_payment .it img {
    max-height: 70px;
    width: auto;
    max-width: fit-content
}

.idx02 .time_sheet {
    max-width: 600px;
    width: 100%;
    margin-left: auto;
    margin-top: 48px
}

.idx02 .btn {
    max-width: 300px;
    margin: 54px auto 0
}

.idx_map {
    overflow: hidden;
    border-radius: 20px;
    height: 330px
}

.idx_bnr {
    padding: 60px 0 34px;
    background: url(../images/idx02_bnr_bg.jpg) no-repeat center/cover
}

.idx_bnr .bnr_it {
    max-width: 420px
}

@media only screen and (min-width:769px) {
    .idx02 .btn-group {
        padding-left: 81px
    }

    .idx02 .col_info {
        max-width: 600px;
        width: 48%;
        order: 2;
        margin-left: 1%
    }

    .idx02 .col_img {
        max-width: 680px;
        width: 49%;
        margin-right: 4.6%;
        margin-left: -1px;
        order: 1
    }

    .idx_bnr .bnr_it {
        max-width: 420px;
        width: calc((100% - 18px) / 3);
        margin-right: 10px
    }

    .idx_bnr .bnr_it:nth-child(2) {
        margin-right: 11px
    }

    .idx_bnr .bnr_it:last-child {
        margin-right: 0
    }
}

@media only screen and (min-width:769px) and (max-width:1600px) {
    .idx02 .col_img {
        padding-left: 2%
    }

    .idx02 .col_img figure:before {
        left: -3.8em
    }
}

@media only screen and (min-width:769px) and (max-width:1400px) {
    .idx02 {
        padding: 70px 0
    }

    .idx02:before {
        font-size: min(10px, 1vw);
        animation-duration: 55s
    }

    .idx02 .wrap_title {
        margin-bottom: 25px
    }

    .idx02 .col_info {
        margin-left: 0
    }

    .idx02 .col_img {
        margin-right: 2.6%
    }

    .idx02 .col_img figure {
        font-size: min(10px, 1vw)
    }

    .idx02 .col_img figure:before {
        left: -3em
    }

    .idx02 .box_payment {
        padding: 30px 5% 30px
    }

    .idx02 .box_payment p {
        font-size: 14px
    }

    .idx02 .list_payment {
        margin-top: 10px
    }

    .idx02 .list_payment .it img {
        max-height: 70px;
        height: 5vw
    }

    .idx02 .btn-group {
        padding-left: 0
    }

    .idx02 .btn {
        margin-top: 35px
    }

    .idx_map {
        max-height: 300px;
        height: 33vw
    }

    .idx_bnr {
        position: relative;
        z-index: 1;
        padding-bottom: 60px
    }

    .idx_bnr .bnr_it {
        width: calc((100% - 22px) / 3)
    }
}

.idx03 {
    margin-bottom: 53px;
    position: relative;
    z-index: 0
}

.idx03:after,
.idx03:before {
    content: "";
    position: absolute;
    background-repeat: no-repeat
}

.idx03:before {
    background-image: url(../images/idx03_bg01.jpg);
    background-size: 1280px auto;
    background-position: left bottom;
    width: 100%;
    max-width: 1920px;
    height: 100%;
    top: -26px;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: -1
}

.idx03:after {
    background-image: url(../images/idx03_bg.svg);
    background-size: 2493px auto;
    background-position: top -22px left -340px;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.idx03 .wrap_title {
    display: flex;
    align-items: flex-end;
    margin-bottom: 36px
}

.idx03 .wrap_title h3 {
    font-size: 60px
}

.idx03 .wrap_title .tl_en {
    margin-left: 25px
}

.idx03 .block_greeting {
    margin-left: auto
}

.idx03 .inner_full {
    position: relative;
    padding-top: 106px;
    padding-bottom: 119px
}

.idx03 .greeting_img {
    max-width: 80em;
    position: relative;
    z-index: 0;
    font-size: 10px
}

.idx03 .greeting_img:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    border: 1.6em solid rgba(255, 255, 255, 0.5);
    border-bottom: 0;
    border-radius: 60px 60px 0 0;
    width: 100%;
    height: calc(100% - 9.1em)
}

.idx03 .greeting_img .doctor_img {
    display: table;
    margin: 0 auto;
    position: relative
}

.idx03 .greeting_img .doctor_img img {
    max-width: 55.2em
}

.idx03 .greeting_cont {
    position: relative
}

.idx03 .greeting_cont>p {
    font-weight: 500
}

.idx03 .doctor_name {
    position: absolute;
    left: 8em;
    top: 3.5em;
    bottom: 0;
    margin: auto;
    width: 22em;
    height: 22em;
    border-radius: 50%;
    background-color: #2399d3;
    color: #ffffff;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-bottom: 0.4em
}

.idx03 .doctor_name p {
    font-feature-settings: "palt";
    line-height: 1
}

.idx03 .doctor_name .tt01 {
    font-size: 1.8em;
    letter-spacing: 0.4em;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    padding-bottom: 0.8888888889em;
    margin-bottom: 0.7777777778em;
    width: 100%;
    max-width: 8.8888888889em
}

.idx03 .doctor_name .tt02 {
    font-size: 3em;
    letter-spacing: 0.1em;
    margin-bottom: 0.533333333em
}

.idx03 .doctor_name .tt03 {
    font-size: 1.2em;
    text-transform: uppercase;
    letter-spacing: 0.1em
}

.idx03 .btn-group {
    margin-top: 41px;
    display: flex;
    flex-wrap: wrap
}

.idx03 .btn-group .btn {
    max-width: 300px;
    width: calc((100% - 40px) / 2);
    margin-right: 39px
}

.idx03 .btn-group .btn:last-child {
    margin-right: 0
}

@media only screen and (min-width:1921px) {
    .idx03:before {
        background-size: cover;
        width: 58.5%;
        max-width: 100%;
        right: unset;
        top: 23px;
        max-height: 900px
    }
}

@media only screen and (min-width:769px) {
    .idx03 .greeting_img {
        position: absolute;
        bottom: 26px;
        left: 50px;
        width: 48%
    }

    .idx03 .block_greeting {
        width: 49.95%;
        margin-left: auto
    }

    .idx03 .wrap_title {
        margin-left: -3px
    }

    .idx03 .greeting_cont,
    .idx03 .wrap_title {
        max-width: 640px;
        width: 100%
    }
}

@media only screen and (max-width:1750px) and (min-width:769px) {
    .idx03 .greeting_img {
        font-size: min(8px, 0.6vw);
        width: 44%;
        left: 20px
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1300px) {
    .idx03:before {
        background-size: 74% 100%
    }

    .idx03 .inner_full {
        padding-top: 85px;
        padding-bottom: 85px
    }

    .idx03 .block_greeting {
        padding-right: 4%
    }

    .idx03 .wrap_title {
        margin-bottom: 15px
    }

    .idx03 .wrap_title h3 {
        font-size: 40px
    }

    .idx03 .wrap_title .tl_en {
        margin-left: 15px
    }

    .idx03 .doctor_name {
        left: 3em
    }
}

@media only screen and (min-width:769px) and (max-width:1200px) {
    .idx03 .inner_full {
        padding: 45px 20px 60px
    }

    .idx03 .block_greeting {
        width: 53.95%
    }

    .idx03 .greeting_img {
        width: 40%
    }

    .idx03 .btn-group {
        margin-top: 30px
    }

    .idx03 .btn-group .btn {
        width: calc((100% - 20px) / 2);
        margin-right: 20px
    }

    .idx03 .doctor_name .tt01 {
        font-size: 2em
    }
}

@media only screen and (max-width:992px) {
    .idx03:before {
        background-size: cover
    }

    .idx03 .wrap_title {
        display: table;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 35px;
        width: auto
    }

    .idx03 .wrap_title .tl_en {
        margin-left: 0;
        margin-bottom: 0;
        margin-top: 3px
    }

    .idx03 .block_greeting {
        width: 100%;
        max-width: 640px;
        margin-left: auto;
        margin-right: auto;
        padding-right: 0
    }

    .idx03 .greeting_img {
        position: relative;
        left: 0;
        width: 100%;
        display: table;
        margin: 0 auto 0;
        font-size: min(8px, 0.9vw)
    }

    .idx03 .greeting_img:before {
        border-radius: 60px;
        border-bottom: 1.6em solid rgba(255, 255, 255, 0.5)
    }
}

.idx04 {
    max-width: 1920px;
    width: 100%;
    margin: 0 auto;
    background: url(../images/idx04_bg.jpg) no-repeat center right/cover;
    position: relative
}

.idx04 .block_endoscopy {
    padding: 95px 95px 103px 50px;
    position: relative;
    max-width: 1200px;
    width: 65%;
    z-index: 0
}

.idx04 .block_endoscopy:after,
.idx04 .block_endoscopy:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1
}

.idx04 .block_endoscopy:before {
    opacity: 0.57;
    background: #1173bc;
    top: 0;
    left: 0
}

.idx04 .block_endoscopy:after {
    top: 10px;
    left: 10px;
    border: 1px solid #fff
}

.idx04 .wrap_title {
    margin-bottom: 28px
}

.idx04 .wrap_title:before {
    content: "";
    position: absolute;
    top: 8.5em;
    right: -8.2em;
    width: 16em;
    height: 16em;
    background: url(../images/idx04_illus.png) no-repeat center/contain;
    font-size: 10px
}

.idx04 .inner_full {
    padding: 0
}

.idx04 .b_wrap {
    max-width: 615px;
    margin-left: auto;
    color: #ffffff
}

.idx04 .btn {
    max-width: 300px;
    margin: 44px auto 0
}

@media only screen and (min-width:769px) and (max-width:1700px) {
    .idx04 {
        background-image: url(../images/idx04_bg01.png), url(../images/idx04_bg.jpg);
        background-position: right -12% top, left top;
        background-size: auto 100%, cover
    }

    .idx04 .block_endoscopy {
        width: 56%
    }
}

@media only screen and (min-width:769px) and (max-width:1500px) {
    .idx04 .wrap_title {
        margin-bottom: 15px
    }

    .idx04 .block_endoscopy {
        padding: 80px 95px 80px 50px
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1400px) {
    .idx04 {
        background-position: right top, left top;
        background-size: auto 110%, cover
    }

    .idx04 .block_endoscopy {
        padding: 43px 3% 45px 4%
    }

    .idx04 .wrap_title {
        margin-bottom: 15px
    }

    .idx04 .wrap_title:before {
        font-size: min(8px, 0.6vw)
    }

    .idx04 .btn {
        margin-top: 25px
    }
}

@media only screen and (min-width:769px) and (max-width:1200px) {
    .idx04 {
        background-position: right -35% top, left top;
        background-size: auto 100%, cover
    }
}

@media only screen and (max-width:992px) {
    .idx04 {
        background-position: right 75% top, left top
    }

    .idx04 .wrap_title {
        position: relative;
        padding-top: 85px
    }

    .idx04 .wrap_title:before {
        top: 0;
        left: 0;
        right: 0;
        margin: auto
    }

    .idx04 .block_endoscopy {
        padding: 50px 5% 50px;
        width: 100%
    }

    .idx04 .block_endoscopy:after {
        width: calc(100% - 20px)
    }

    .idx04 .b_wrap {
        margin-right: auto
    }
}

.tab_treatment .TabPager {
    position: relative;
    z-index: 2
}

.tab_treatment .TabPager>div {
    border-radius: 20px 20px 0 0;
    width: calc(50% - 20px);
    max-width: 420px;
    margin: 0 10px;
    padding: 15px 20px 16px;
    background-color: var(--cl_tab)
}

.tab_treatment .TabPager>div:first-child {
    --cl_tab: var(--cl-tl)
}

.tab_treatment .TabPager>div:nth-child(2) {
    --cl_tab: var(--clr2)
}

.tab_treatment .TabPager>div:before {
    content: "";
    position: absolute;
    bottom: -1.55555556em;
    left: 0;
    right: 0;
    width: round(3.3333333333em, 1px);
    height: round(3.3333333333em, 1px);
    background: url(../images/tab_ic_active.svg) no-repeat center bottom 0.8333333333em/1.111111111em auto;
    background-color: var(--cl_tab);
    border-radius: 50%;
    margin: auto;
    opacity: 0;
    transition: all 0.3s ease;
    z-index: -1
}

.tab_treatment .TabPager>div .tt {
    font-size: 24px;
    font-weight: 500;
    color: #ffffff;
    border: 0;
    line-height: 1.4
}

.tab_treatment .TabPager>div .tt span {
    display: block;
    font-size: 14px;
    text-transform: uppercase;
    margin-top: 5px;
    letter-spacing: 0.1em
}

.tab_treatment .TabPager>div.active:before {
    opacity: 1
}

.tab_treatment .TabContent {
    z-index: 1;
    overflow: unset;
    margin-top: -1px
}

.tab_treatment .TabContent .content {
    background-color: transparent
}

.tab_treatment .TabContent .content>div {
    background-color: #ffffff;
    border-radius: 60px;
    border: 2px solid var(--cl_tab);
    box-shadow: -3px 0px 40px 0px rgba(0, 0, 0, 0.06);
    padding: 88px 86px 66px 88px
}

.tab_treatment .TabContent .content>div:first-child {
    --cl_tab: var(--cl-tl)
}

.tab_treatment .TabContent .content>div:nth-child(2) {
    --cl_tab: var(--clr2)
}

.tab_treatment .TabContent .content>div:nth-child(2) .b_treatment .treatment_it {
    border-color: #3fd577
}

.idx05 {
    padding: 77px 0 100px;
    background: url(../images/idx05_bg.jpg) no-repeat center/cover
}

.idx05 .wrap_title {
    margin-bottom: 51px
}

.idx05 h4 {
    font-size: 40px;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: 0.1em;
    font-feature-settings: "palt";
    margin-bottom: 25px;
    margin-top: 6px;
    color: var(--cl_tab)
}

.idx05 .bnr_senmon {
    max-width: 480px;
    margin-top: 40px
}

.idx05 .b_img img {
    border-radius: 20px
}

.idx05 .b_treatment {
    margin-top: 59px
}

.idx05 .b_treatment .treatment_it {
    position: relative;
    border: 1px solid #8bc8e6;
    border-radius: 4px;
    width: calc((100% - 4.4em) / 3);
    max-width: 35.2em;
    margin-right: 2.2em;
    margin-bottom: 2.2em;
    min-height: 14em;
    display: flex;
    align-items: center;
    padding: 1em 1em 1em 1.6em;
    box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.12);
    font-size: 10px;
    transition: all 0.3s ease
}

.idx05 .b_treatment .treatment_it:after {
    content: "";
    position: absolute;
    bottom: 0.8em;
    right: 0.8em;
    width: 0.8em;
    height: 0.8em;
    mask-image: url(../images/idx05_arr.svg);
    -webkit-mask-image: url(../images/idx05_arr.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-size: contain;
    -webkit-mask-size: contain;
    mask-position: center;
    -webkit-mask-position: center;
    background-color: var(--cl_tab);
    transition: all 0.3s ease
}

.idx05 .b_treatment .box_in {
    display: flex;
    align-items: center
}

.idx05 .b_treatment figure {
    max-width: 8.2em
}

.idx05 .b_treatment .treatment_tl {
    width: calc(100% - 8.2em);
    padding-left: 1.4em;
    padding-bottom: 0.8em
}

.idx05 .b_treatment .treatment_tl .ttl {
    font-size: 2.2em;
    font-weight: 500;
    letter-spacing: 0.05em;
    color: var(--clr1);
    line-height: 1.5;
    margin-bottom: 0
}

.idx05 .b_treatment .treatment_tl .en {
    color: var(--cl_tab);
    font-size: 1.2em;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 500;
    line-height: 1;
    margin-top: 0.6666666667em
}

.idx05 .b_content>p {
    font-weight: 500
}

@media only screen and (min-width:769px) {
    .tab_treatment .TabPager>div:not(.active):hover {
        opacity: 0.7
    }

    .tab_treatment .TabContent .content>div:nth-child(2) .b_treatment .treatment_it:hover {
        background-color: #f4fbf6
    }

    .idx05 .b_grid {
        grid-template-columns: 50% 43.75%;
        justify-content: space-between
    }

    .idx05 .b_treatment .treatment_it:last-child,
    .idx05 .b_treatment .treatment_it:nth-child(3n+3) {
        margin-right: 0
    }

    .idx05 .b_treatment .treatment_it:hover {
        background-color: #f3f9fc
    }

    .idx05 .b_treatment .treatment_it:hover:after {
        right: 0.5em
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1300px) {
    .tab_treatment .TabPager>div {
        width: calc(50% - 10px);
        margin: 0 5px
    }

    .tab_treatment .TabPager>div .tt {
        font-size: 20px
    }

    .tab_treatment .TabPager>div .tt span {
        font-size: 12px
    }

    .tab_treatment .TabContent .content>div {
        padding: 45px 4%
    }

    .idx05 {
        padding-bottom: 85px
    }

    .idx05 .wrap_title {
        margin-bottom: 25px
    }

    .idx05 h4 {
        font-size: 30px;
        margin-bottom: 10px
    }

    .idx05 .b_grid {
        grid-template-columns: 49% 46.75%
    }

    .idx05 .bnr_senmon {
        margin-top: 25px
    }

    .idx05 .b_treatment {
        margin-top: 50px
    }

    .idx05 .b_treatment .treatment_it {
        font-size: min(10px, 0.8vw)
    }

    .idx05 .b_treatment figure {
        max-width: 7.5em
    }

    .idx05 .b_treatment .treatment_tl {
        width: calc(100% - 7.5em);
        padding-left: 1em
    }
}

@media only screen and (min-width:769px) and (max-width:1000px) {
    .tab_treatment .TabContent .content>div {
        border-radius: 35px
    }

    .idx05 .b_treatment .treatment_tl .en {
        font-size: 1.4em
    }
}

.idx06 {
    padding: 81px 0 36px;
    background: url(../images/idx06_bg.jpg) no-repeat center/cover
}

.idx06 .wrap_title {
    margin-bottom: 34px
}

.idx06 .block_lifestyle {
    padding: 83px 0 166px;
    max-width: 1760px;
    width: calc(100% - 40px);
    border-radius: 60px;
    background: url(../images/idx06_box_bg.jpg) no-repeat center right/cover;
    margin: 0 auto
}

.idx06 .box_in {
    max-width: 510px;
    width: 100%;
    padding-left: 3px
}

.idx06 .box_in p:not(.en) {
    font-weight: 500
}

.idx06 .list_btn {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: -9.1em;
    font-size: 10px
}

.idx06 .list_btn .item {
    width: calc(20% - 2em);
    position: relative;
    overflow: hidden;
    max-width: 18.2em;
    height: 18.2em;
    border-radius: 50%;
    margin: 0 1.15em
}

.idx06 .list_btn .item:before {
    content: "";
    position: absolute;
    bottom: 4.4em;
    width: 132.2em;
    height: 40.6em;
    background: url(../images/idx06_bf.svg) no-repeat center/contain;
    z-index: 0;
    opacity: 0.1
}

.idx06 .list_btn .item.it01 {
    background-color: #55c2f0
}

.idx06 .list_btn .item.it01:before {
    left: -15.3em;
    opacity: 0.15
}

.idx06 .list_btn .item.it02 {
    background-color: #197fc3
}

.idx06 .list_btn .item.it02:before {
    left: -35.6em
}

.idx06 .list_btn .item.it03 {
    background-color: #8bc56c
}

.idx06 .list_btn .item.it03:before {
    left: -55.9em
}

.idx06 .list_btn .item.it04 {
    background-color: #f8c058
}

.idx06 .list_btn .item.it04:before {
    left: -76.2em
}

.idx06 .list_btn .item.it05 {
    background-color: #2fc07b
}

.idx06 .list_btn .item.it05:before {
    left: -96.5em
}

.idx06 .list_btn .item a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 100%;
    height: 100%;
    text-decoration: none;
    color: #ffffff
}

.idx06 .list_btn .item a:hover {
    opacity: 1
}

.idx06 .list_btn .item a:after,
.idx06 .list_btn .item a:before {
    content: "";
    position: absolute;
    transition: 0.3s all ease-in-out
}

.idx06 .list_btn .item a:before {
    inset: 5px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%
}

.idx06 .list_btn .item a:after {
    background: url(../images/ic_arr.svg) no-repeat center/contain;
    width: 1.5em;
    height: 1.5em;
    bottom: 2em;
    left: 0;
    right: 0;
    margin: auto
}

.idx06 .list_btn .item .tt02 {
    font-size: 2.2em;
    font-weight: 500
}

.idx06 .list_btn .item .tt01 {
    font-size: 1.4em;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 0.2857142857em
}

@media only screen and (min-width:769px) {
    .idx06 .list_btn .item a:hover:before {
        background-color: rgba(255, 255, 255, 0.2)
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1300px) {
    .idx06 .block_lifestyle {
        padding: 50px 2% 10vw;
        background-position: right 34% center
    }

    .idx06 .box_in {
        width: 62%
    }

    .idx06 .wrap_title {
        margin-bottom: 15px
    }

    .idx06 .list_btn {
        font-size: min(10px, 0.8vw)
    }
}

.idx07 {
    padding: 100px 0;
    background: #f7fafc url(../images/idx07_bg.jpg) no-repeat top right;
    position: relative;
    z-index: 0
}

.idx07:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../images/idx07_bg01.png) no-repeat bottom -33px left/100% auto;
    z-index: -1
}

.idx07 .wrap_title {
    margin-bottom: 26px
}

.idx07 .concerns_img img {
    border-radius: 20px
}

.idx07 .concerns_cont p {
    font-weight: 500
}

.idx07 .inner_big {
    max-width: 1640px
}

.idx07 .btn {
    margin-top: 47px;
    max-width: 360px
}

@media only screen and (min-width:769px) {
    .idx07 .b_grid {
        grid-template-columns: 50% 40%
    }

    .idx07 .wrap_title {
        margin-top: 15px
    }

    .idx07 .concerns_cont,
    .idx07 .wrap_title {
        max-width: 545px;
        margin-left: 14.8%
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1300px) {
    .idx07 {
        padding: 60px 0 75px;
        background-size: auto 110%
    }

    .idx07 .wrap_title {
        margin-bottom: 10px
    }

    .idx07 .b_grid {
        grid-template-columns: 50% 45%
    }

    .idx07 .concerns_cont,
    .idx07 .wrap_title {
        margin-left: 8%
    }

    .idx07 .btn {
        max-width: 300px;
        margin-top: 20px
    }
}

@media only screen and (min-width:769px) and (max-width:1000px) {
    .idx07 .b_grid {
        grid-template-columns: 45% 50%
    }

    .idx07 .concerns_cont,
    .idx07 .wrap_title {
        margin-left: 5%
    }
}

.idx08 {
    position: relative;
    z-index: 0
}

.idx08_bg {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 400px;
    background: url(../images/idx08_bg.jpg) no-repeat center/cover;
    z-index: -1
}

.idx08_bg:after,
.idx08_bg:before {
    content: "";
    position: absolute;
    width: 50%;
    height: 50%;
    opacity: 0.5
}

.idx08_bg:before {
    top: 0;
    left: 0;
    background-color: #fdf073
}

.idx08_bg:after {
    right: 0;
    bottom: 0;
    background-color: #89ffc7
}

.idx08 .wrap_title {
    max-width: 1280px;
    width: 100%;
    margin: 0 auto 50px
}

.idx08 .wrap_title .en {
    margin-bottom: 7px
}

.idx08 .block_result {
    padding-bottom: 85px;
    position: relative
}

.idx08 .block_result:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 52%;
    max-width: 750px;
    height: 100%;
    background-color: #ffffff
}

.idx08 .result_cont {
    max-width: 545px;
    width: 100%;
    margin: 0 auto;
    position: relative;
    padding-top: 58px;
    text-align: center
}

.idx08 .result_cont>p {
    font-weight: 500
}

.idx08 .result_img .img01 img,
.idx08 .result_img .img02 img {
    border-radius: 20px
}

.idx08 .result_img .img02:before {
    content: "";
    position: absolute;
    top: -7em;
    right: -3.9em;
    background: url(../images/idx08_illus.svg) no-repeat center/contain;
    width: 7.3em;
    height: 14em;
    font-size: 10px
}

.idx08 .btn {
    max-width: 360px;
    width: 100%;
    margin: 47px auto 0
}

@media only screen and (min-width:769px) {

    .idx08 .result_img .img01,
    .idx08 .result_img .img02 {
        position: absolute
    }

    .idx08 .result_img .img01 {
        left: 0;
        top: -9px
    }

    .idx08 .result_img .img02 {
        right: -65px;
        top: 17px
    }
}

@media only screen and (max-width:1600px) and (min-width:769px) {
    .idx08 .result_img .img02 {
        width: 27%;
        right: 0
    }

    .idx08 .block_result:before {
        width: 50%
    }

    .idx08 .result_cont {
        width: 42%
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1300px) {
    .idx08_bg {
        height: 310px
    }

    .idx08 .result_cont {
        padding-top: 30px
    }

    .idx08 .result_img .img01 {
        width: 27%
    }

    .idx08 .result_img .img02:before {
        font-size: min(7px, 0.7vw);
        right: -2em
    }

    .idx08 .btn {
        margin-top: 26px
    }
}

@media only screen and (min-width:769px) and (max-width:1000px) {
    .idx08 .wrap_title {
        margin-bottom: 25px
    }

    .idx08 .block_result {
        padding-bottom: 50px
    }

    .idx08 .result_cont {
        padding-top: 0
    }

    .idx08 .result_img .img01 {
        top: 70px
    }

    .idx08 .result_img .img02 {
        top: 80px
    }
}

.idx09 {
    padding: 90px 0 120px;
    position: relative;
    z-index: 0;
    max-width: 1920px;
    width: 100%;
    margin: 0 auto
}

.idx09:before {
    content: "";
    position: absolute;
    bottom: -4.8em;
    left: -8.7em;
    background: url(../images/idx09_logo.png) no-repeat center/contain;
    width: 53.1em;
    height: 56.9em;
    z-index: -1;
    font-size: 10px
}

.idx09 .wrap_title {
    margin-bottom: 26px
}

.idx09 .care_img {
    position: relative
}

.idx09 .care_img:before {
    content: "";
    position: absolute;
    background: url(../images/idx09_txt.png) no-repeat center/contain;
    bottom: -4.5em;
    right: -8.8em;
    width: 39em;
    height: 23.9em;
    font-size: 10px
}

.idx09 .care_img figure img {
    border-radius: 20px
}

.idx09 .label {
    position: absolute;
    width: 20em;
    height: 20em;
    top: 4.9em;
    right: -2.5em;
    color: #fff;
    z-index: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    text-transform: uppercase;
    padding-bottom: 0.7em;
    font-size: 10px
}

.idx09 .label:after,
.idx09 .label:before {
    content: "";
    position: absolute;
    z-index: -1
}

.idx09 .label:before {
    width: 21.4em;
    height: 20.8em;
    background: url(../images/idx09_illus.svg) no-repeat center/contain;
    top: -1em;
    left: -0.2em
}

.idx09 .label:after {
    top: 0;
    left: 0;
    background-color: #2fc07b;
    border-radius: 50%;
    width: 100%;
    height: 100%
}

.idx09 .label p {
    font-size: 2.4em;
    letter-spacing: 0.05em;
    line-height: 1.5
}

.idx09 .btn-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 560px;
    margin-top: 47px
}

.idx09 .btn-group .btn {
    max-width: 275px;
    width: calc((100% - 10px) / 2);
    margin-right: 10px;
    margin-bottom: 10px
}

.idx09 .btn-group .btn:last-child,
.idx09 .btn-group .btn:nth-child(2n+2) {
    margin-right: 0
}

.idx09 .btn-group .btn:nth-child(3) {
    max-width: 320px;
    width: 100%
}

@media only screen and (min-width:769px) {
    .idx09 .b_grid {
        grid-template-columns: 46% 51%;
        justify-content: space-between;
        align-items: flex-start
    }

    .idx09 .wrap_title {
        margin-top: 29px
    }

    .idx09 .wrap_title h3 {
        margin-bottom: 17px
    }

    .idx09 .wrap_title .en.tl_en {
        padding-left: 20px
    }

    .idx09 .wrap_title .en.tl_en:before {
        left: 0
    }

    .idx09 .care_img figure {
        max-width: 640px;
        width: 100%;
        margin-left: auto;
        margin-right: -1px
    }

    .idx09 .care_cont p {
        padding-right: 31px;
        font-weight: 500
    }
}

@media only screen and (max-width:1600px) and (min-width:769px) {
    .idx09 .label {
        font-size: min(10px, 0.7vw)
    }

    .idx09 .care_img:before {
        font-size: min(10px, 0.7vw)
    }
}

@media only screen and (max-width:1500px) and (min-width:769px) {
    .idx09 .b_grid {
        padding-right: 2%
    }

    .idx09 .care_img:before {
        right: -5.5vw
    }
}

@media only screen and (max-width:1400px) and (min-width:769px) {
    .idx09 .care_img:before {
        right: -2.5vw
    }
}

@media only screen and (max-width:1300px) and (min-width:769px) {
    .idx09:before {
        font-size: min(8px, 0.7vw)
    }

    .idx09 .wrap_title {
        margin-bottom: 25px;
        margin-top: 0
    }

    .idx09 .btn-group {
        margin-top: 25px
    }

    .idx09 .b_grid {
        grid-template-columns: 48% 50%
    }
}

@media only screen and (max-width:1300px) and (min-width:769px) {
    .idx09 {
        padding-bottom: 65px
    }

    .idx09 .care_img:before {
        right: -2.1vw
    }

    .idx09 .care_cont p {
        padding-right: 0
    }
}

@media only screen and (max-width:1000px) and (min-width:769px) {
    .idx09 .b_grid {
        padding-right: 1%
    }

    .idx09 .btn-group .btn:nth-child(3) {
        max-width: 100%
    }
}

.idx10 {
    background: url(../images/idx10_bg.jpg) no-repeat center/cover;
    padding: 57px 0 89px
}

.idx10 .wrap_title {
    text-align: center;
    display: table;
    position: relative;
    margin: 0 auto 39px
}

.idx10 .wrap_title:after {
    content: "";
    position: absolute;
    bottom: -38px;
    left: -19.3em;
    background: url(../images/idx10_illus.png) no-repeat center/contain;
    width: 16.8em;
    height: 16.8em;
    font-size: 10px
}

.idx10 .wrap_title h3 .tl_lg {
    font-size: 60px;
    line-height: 1
}

.idx10 .wrap_title h3 .tl_num {
    font-size: 90px;
    font-family: var(--f-en);
    font-weight: 400;
    color: var(--clr2);
    line-height: 1
}

.idx10 .wrap_title .en {
    display: table;
    margin-left: auto;
    margin-right: auto
}

.idx10 .inner_full {
    max-width: 1860px
}

.idx10 .btn_it {
    position: relative;
    z-index: 0;
    border-radius: 6px;
    background-color: #fff;
    overflow: hidden;
    display: flex;
    align-items: center;
    margin-bottom: 1em
}

.idx10 .btn_it .btn_num {
    font-size: 6em;
    font-weight: 400;
    font-family: var(--f-en);
    letter-spacing: 0;
    width: 1.5em;
    height: 100%;
    background-color: var(--main-color);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-bottom: 0;
    position: absolute;
    top: 0;
    left: 0;
    padding-left: 0.083333333em;
    padding-bottom: 0.1333333333em
}

.idx10 .btn_it .btn_tt {
    font-size: 2.4em;
    line-height: 1.4;
    font-feature-settings: "palt";
    letter-spacing: 0.1em;
    color: var(--main-color);
    padding: 1.083333333em 0.4166666667em 1.1666666667em 4.75em;
    border: 1px solid var(--main-color);
    width: 100%;
    border-radius: 0 6px 6px 0
}

.idx10 .btn_it.active {
    background-color: var(--cl-tl)
}

.idx10 .btn_it.active .btn_num {
    color: #ffffff
}

.idx10 .btn_it.active .btn_tt {
    color: #ffffff
}

.idx10 .btn {
    max-width: 30em;
    margin: 5em auto 0
}

.idx10 .btn a {
    font-size: 2em
}

.idx10 .block_feature {
    position: relative;
    font-size: 10px
}

.idx10 .feature_content {
    position: relative;
    overflow: hidden
}

.idx10 .feature_content .content {
    transition: all 0.3s ease-in-out
}

.idx10 .feature_content .content>div {
    opacity: 0;
    z-index: -10;
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    right: 0
}

.idx10 .feature_content .content>div.active {
    opacity: 1;
    z-index: 1;
    visibility: visible
}

.idx10 .feature_content .content>div.active .b_content,
.idx10 .feature_content .content>div.active .b_img {
    opacity: 1
}

.idx10 .feature_content h4 {
    font-size: 2.6em;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-bottom: 0.6923076923em;
    color: #227fc4
}

.idx10 .feature_content .b_wrap {
    min-height: 76.9em
}

.idx10 .feature_content .b_img {
    transition: opacity 0.3s ease
}

.idx10 .feature_content .b_img img {
    border-radius: 20px
}

.idx10 .feature_content .b_content {
    transition: opacity 0.3s ease;
    background-color: #fff;
    border-radius: 0 20px 20px 20px;
    padding: 5.8em 5.7em 6.5em;
    max-width: 75em;
    width: 90%;
    position: relative;
    margin-top: -16em;
    font-feature-settings: "palt";
    min-height: 37.9em
}

.idx10 .feature_content p {
    font-size: 1.8em;
    font-weight: 500
}

.idx10 .feature_content .txt_num {
    font-size: 14em;
    font-weight: 400;
    line-height: 1;
    font-family: var(--f-en);
    letter-spacing: 0;
    color: var(--main-color);
    position: absolute;
    top: -0.6857142857em;
    left: 0.3642857143em
}

@media only screen and (min-width:769px) {
    .idx10 .block_feature {
        display: flex
    }

    .idx10 .feature_btn {
        width: 45%;
        max-width: 70em;
        order: 2;
        margin-left: -6em;
        margin-top: 10.7em;
        position: relative;
        z-index: 1
    }

    .idx10 .btn_it:nth-child(2) .btn_tt,
    .idx10 .btn_it:nth-child(5) .btn_tt {
        padding-bottom: 1.2083333333em
    }

    .idx10 .feature_content {
        width: 55%;
        max-width: 91em;
        order: 1
    }
}

@media only screen and (max-width:1600px) and (min-width:769px) {
    .idx10 .block_feature {
        font-size: min(9px, 0.65vw)
    }
}

@media only screen and (max-width:1400px) and (min-width:769px) {
    .idx10 .wrap_title:after {
        font-size: min(10px, 0.7vw)
    }

    .idx10 .feature_btn {
        width: 50%;
        max-width: 73em;
        margin-top: 4.7em
    }
}

@media only screen and (max-width:1200px) and (min-width:769px) {
    .idx10 .feature_btn {
        margin-left: -3em;
        width: 47%
    }

    .idx10 .txt_num {
        font-size: 11em
    }

    .idx10 .btn a {
        font-size: 2.2em
    }

    .idx10 .feature_content .b_content {
        margin-top: -9em;
        font-size: 1.2em;
        padding: 5.8em 2.7em 6.5em
    }
}

.idx11 {
    padding: 118px 0px 120px
}

.idx11 .wrap_title {
    margin-top: 55px;
    margin-bottom: 25px
}

.idx11 .txt_recruit {
    position: absolute;
    top: -0.5em;
    left: -0.0714285714em;
    font-size: 140px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: transparent;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 1px var(--cl-tl);
    z-index: 1
}

.idx11 .recruit_img {
    position: relative;
    z-index: 0;
    font-size: 10px
}

.idx11 .recruit_img:after,
.idx11 .recruit_img:before {
    content: "";
    position: absolute;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    z-index: -1
}

.idx11 .recruit_img:before {
    background-image: url(../images/idx11_illus02.svg);
    width: 55.6em;
    height: 54.1em;
    top: -0.5em;
    left: 1.9em
}

.idx11 .recruit_img:after {
    background-image: url(../images/idx11_illus01.svg);
    width: 50.7em;
    height: 49.2em;
    bottom: 0.9em;
    right: 1.4em
}

.idx11 .recruit_img figure {
    width: 64.2em;
    height: 54.6em;
    mask-image: url(../images/idx11_img_mask.svg);
    -webkit-mask-image: url(../images/idx11_img_mask.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-size: contain;
    -webkit-mask-size: contain;
    mask-position: center;
    -webkit-mask-position: center
}

.idx11 .recruit_img figure img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.idx11 .recruit_cont {
    max-width: 560px;
    position: relative
}

.idx11 .recruit_cont:before {
    content: "";
    position: absolute;
    right: -11.3em;
    top: -19.6em;
    background: url(../images/idx11_ic_logo.svg) no-repeat center/contain;
    width: 53.1em;
    height: 56.9em;
    opacity: 0.06;
    font-size: 10px
}

.idx11 .btn {
    max-width: 300px;
    margin-top: 48px
}

@media only screen and (min-width:769px) {
    .idx11 .b_grid {
        grid-template-columns: 50% 46.3%;
        justify-content: space-between;
        align-items: flex-start
    }
}

@media only screen and (max-width:1300px) and (min-width:769px) {
    .idx11 .txt_recruit {
        font-size: min(140px, 10.5vw)
    }

    .idx11 .recruit_img {
        font-size: min(10px, 0.75vw)
    }

    .idx11 .recruit_cont:before {
        font-size: min(10px, 0.75vw)
    }
}

@media only screen and (min-width:769px) and (max-width:1000px) {
    .idx11 {
        padding: 100px 0px 95px
    }

    .idx11 .wrap_title {
        margin-top: 0
    }

    .idx11 .btn {
        margin-top: 25px
    }
}

/*# sourceMappingURL=index_pc.css.map */