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

.home_page:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2120px;
    background-image: linear-gradient(0deg, rgb(0, 108, 156) 0%, rgb(9, 90, 128) 100%);
    z-index: -1
}

.home_page .key {
    --height: 75vw;
    --min-height: 550px;
    --max-height: 1286px;
    height: var(--height);
    min-height: var(--min-height);
    max-height: var(--max-height);
    margin-top: -9.8em;
    font-size: 10px;
    z-index: 1
}

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

.home_page .key .mv_slider {
    padding-left: 12em
}

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

.home_page .key .key_text {
    position: relative;
    overflow: hidden;
    width: calc(100% - 8em);
    clip-path: polygon(0 23%, 100% 0, 100% 77%, 0 100%);
    background: url(../images/idx_mv01.jpg) no-repeat center/cover
}

.home_page .key .key_text .item {
    display: flex;
    flex-wrap: wrap;
    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
}

.home_page .key .catch {
    padding-left: 0;
    padding-bottom: 7.2em
}

.home_page .key .catch h2 {
    margin-bottom: 0;
    margin-left: 0.6666666667em;
    font-size: 4.2em;
    font-weight: 500;
    letter-spacing: 0.3em;
    line-height: 1.6667;
    color: var(--main-color)
}

.home_page .key .catch p {
    font-size: 2.4em;
    font-weight: 500;
    color: #334750;
    letter-spacing: 0.2em;
    line-height: 2;
    margin-top: 3.0416666667em
}

.home_page .key_circle {
    max-width: 1522px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: flex-end;
    position: absolute;
    bottom: 31.1em;
    left: 0;
    right: 0
}

.home_page .key_circle .link a {
    width: 100%;
    height: 100%;
    border-radius: 50%
}

.home_page .key_circle .cir_it {
    width: round(23em, 1px);
    height: round(23em, 1px);
    border-radius: 50%;
    border: 1px solid rgb(255, 255, 255);
    background-color: rgba(225, 244, 255, 0.22);
    padding: 1.4em;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 -0.5em 0 -0.6em;
    transition: all 0.3s;
    position: relative
}

.home_page .key_circle .cir_it:first-child .b_in {
    padding-top: 1.4em
}

.home_page .key_circle .cir_it:first-child .b_tl:after {
    background-image: url(../images/ic_arr.svg);
    margin-top: 10px
}

.home_page .key_circle .b_in {
    border-radius: 50%;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(0deg, rgba(9, 90, 128, 0.95) 0%, rgba(12, 107, 151, 0.95) 31%, rgba(14, 124, 173, 0.95) 100%);
    box-shadow: 0px 2em 4em 0px rgba(9, 90, 128, 0.2);
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 1.7em;
    transition: all 0.3s
}

.home_page .key_circle .b_tl {
    text-align: center;
    color: #ffffff;
    font-size: 2em;
    font-weight: 400;
    line-height: 1.6
}

.home_page .key_circle .b_tl:after {
    content: "";
    position: relative;
    display: block;
    width: round(1.666666667em, 1px);
    height: round(1.666666667em, 1px);
    border-radius: 50%;
    background: url(../images/ic_arr_down.svg) no-repeat center/contain;
    background-color: #e1f4ff;
    margin: 0.33333333em auto 0;
    transition: all 0.3s
}

.home_page .key_circle .b_tl span {
    line-height: 1;
    font-size: 1.3333333333em;
    font-weight: 600
}

.home_page .key_scroll {
    position: absolute;
    right: 3.3em;
    bottom: 24.8em;
    z-index: 2;
    --h_bf: 20em
}

@keyframes moveDown {
    0% {
        transform: translateY(calc(-1 * var(--h_bf)))
    }

    to {
        transform: translateY(0em)
    }
}

.home_page .key_scroll a {
    font-size: 1em;
    font-weight: 300;
    font-family: var(--f-en);
    letter-spacing: 0.2em;
    color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    padding-bottom: 20.8em
}

.home_page .key_scroll a:after,
.home_page .key_scroll a:before {
    content: "";
    position: absolute;
    left: 1px;
    right: 0;
    margin: auto
}

.home_page .key_scroll a:before {
    bottom: 0;
    width: 1px;
    height: var(--h_bf);
    background-color: rgba(255, 255, 255, 0.2)
}

.home_page .key_scroll a:after {
    width: round(1.5em, 1px);
    height: round(1.5em, 1px);
    border-radius: 50%;
    border: 1px solid #ffffff;
    bottom: 0;
    background-color: #2d6f93;
    animation: moveDown 5s infinite cubic-bezier(0.16, 1, 0.3, 1)
}

.home_page .topic_path {
    display: none
}

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

@media screen and (max-width:1920px) and (min-width:1800px) {
    .home_page .key .key_text {
        background-size: 1840px auto;
        image-rendering: pixelated
    }
}

@media only screen and (min-width:769px) {
    .home_page .key_circle .cir_it:first-child:hover .b_tl:after {
        transform: translateY(0) translateX(5px)
    }

    .home_page .key_circle .cir_it:hover {
        background-color: rgba(225, 244, 255, 0.41)
    }

    .home_page .key_circle .cir_it:hover .b_in {
        box-shadow: 0px 20px 40px 0px rgba(9, 90, 128, 0.42);
        background-image: linear-gradient(0deg, rgba(9, 90, 128, 0.95) 0%, rgba(12, 107, 151, 0.75) 31%, rgba(14, 124, 173, 0.75) 100%)
    }

    .home_page .key_circle .cir_it:hover .b_tl:after {
        transform: translateY(5px)
    }
}

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

@media only screen and (max-width:1600px) and (min-width:769px) {
    .home_page .key {
        --height: 68vw;
        margin-top: min(-4em, -5vw)
    }

    .home_page .key .inner_big {
        width: 85%
    }

    .home_page .key .catch {
        padding-bottom: 0;
        padding-top: 10em;
        padding-left: 0
    }

    .home_page .key .key_text {
        width: calc(100% - 60px);
        font-size: min(10px, 0.6vw);
        background-position: top center
    }

    .home_page .key_circle {
        width: 90%;
        bottom: 24em
    }

    .home_page .key_scroll {
        font-size: min(8px, 0.5vw)
    }
}

@media only screen and (max-width:1200px) and (min-width:769px) {
    .home_page .key {
        --height: 78vw;
        margin-top: -5vw
    }

    .home_page .key .key_text {
        clip-path: polygon(0 21%, 100% 0, 100% 82%, 0 100%)
    }

    .home_page .key_circle .cir_it {
        padding: 1.2em
    }

    .home_page .key_scroll {
        right: 3.3em;
        bottom: 17.8em;
        font-size: min(8px, 0.8vw)
    }
}

@media only screen and (max-width:1000px) and (min-width:769px) {
    .home_page .key_scroll {
        bottom: 9.8em;
        font-size: min(8px, 1vw);
        --h_bf: 11em
    }

    .home_page .key_scroll a {
        padding-bottom: 11.8em
    }
}

.wrap_title {
    text-align: center
}

.wrap_title .en {
    font-size: 18px;
    font-weight: 300;
    line-height: 1;
    text-transform: uppercase;
    position: relative;
    color: var(--main-color);
    letter-spacing: 0.11em
}

.wrap_title .en.ic_en {
    padding-left: 30px;
    margin-bottom: 9px
}

.wrap_title .en.ic_en:before {
    content: "";
    position: absolute;
    top: 1px;
    left: 0;
    width: 20px;
    height: 12px;
    background: url(../images/h3_ic.png) no-repeat center/contain
}

.wrap_title .en.ic02:before {
    background-image: url(../images/h3_ic02.png)
}

.wrap_title h3 {
    font-size: 34px;
    font-weight: 500;
    letter-spacing: 0.14em;
    line-height: 1.47058;
    position: relative
}

.wrap_title h3.ic_h3:after {
    content: "";
    position: relative;
    display: block;
    background: url(../images/h3_ic.svg) no-repeat center/contain;
    width: 24px;
    height: 12px;
    margin: 13px auto 0
}

.wrap_title h3.ic02:after {
    background-image: url(../images/h3_ic02.png)
}

.wrap_title h3 .lg {
    font-size: 48px;
    font-weight: bold;
    line-height: 1;
    letter-spacing: 0.14em
}

.wrap_title h3 .sm {
    font-size: 24px;
    line-height: 1.5;
    display: inline-block;
    letter-spacing: 0.15em;
    margin-bottom: 5px
}

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

.wrap_title.tl_white h3.ic_h3:after {
    background-image: url(../images/h3_ic_white.png)
}

.txt_en {
    position: absolute;
    font-size: 120px;
    font-weight: 300;
    letter-spacing: 0.05em
}

@media only screen and (min-width:769px) {
    .wrap_title.tl_left {
        text-align: left
    }

    .wrap_title.tl_left h3.ic_h3:after {
        margin-left: 0;
        margin-top: 14px
    }

    .b_grid {
        display: grid;
        justify-content: space-between
    }

    .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;
        letter-spacing: 0.1em
    }

    .wrap_title h3 .sm {
        font-size: 20px
    }

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

    .wrap_title h3.ic_h3:after {
        width: 16px;
        height: 10px
    }

    .wrap_title .en {
        font-size: 16px;
        margin-bottom: 5px
    }

    .txt_en {
        font-size: min(120px, 8vw)
    }
}

.fz18 p {
    font-size: 18px;
    line-height: 2;
    letter-spacing: 0.14em
}

.idx01 {
    padding: 0 0px 102px;
    position: relative;
    z-index: 0;
    margin-top: -26px
}

.idx01:after,
.idx01:before {
    content: "";
    position: absolute;
    z-index: -1;
    font-size: 10px
}

.idx01:before {
    bottom: 0;
    left: 0;
    width: 100%;
    height: calc(100% + 108.5em);
    background-image: linear-gradient(8deg, rgb(0, 108, 156) 0%, rgb(9, 90, 128) 100%)
}

.idx01:after {
    top: -115.7em;
    right: 0;
    background: url(../images/idx01_bg.jpg) no-repeat center/cover;
    width: 61.5em;
    height: 220em
}

.idx01 .wrap_title {
    margin-bottom: 49px
}

.idx01 .box_text {
    color: #ffffff;
    position: relative;
    padding-right: 415px
}

.idx01 .box_text:before {
    content: "";
    position: absolute;
    bottom: -3em;
    right: -10.4em;
    background: url(../images/idx01_illus.png) no-repeat center/contain;
    width: 45.2em;
    height: 40.3em;
    font-size: 10px
}

.idx01 .box_text>p:not(:last-child) {
    margin-bottom: 5px
}

.idx01 .concern_btns {
    margin-top: 52px;
    font-size: 10px
}

.idx01 .concern_btns .btn_it {
    max-width: 617px;
    margin-bottom: 1.8em
}

.idx01 .concern_btns .btn_it a {
    border-left: 7px solid #e1f4ff;
    background-color: #ffffff;
    font-size: 2em;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0.16em;
    color: var(--main-color);
    padding: 0.06em 3.05em 0.06em 2.05em;
    border-radius: 5px;
    text-decoration: none;
    min-height: 4em;
    display: flex;
    align-items: center;
    width: 100%;
    position: relative;
    z-index: 0;
    overflow: hidden
}

.idx01 .concern_btns .btn_it a:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 1.2em;
    width: round(1.5em, 1px);
    height: round(1.5em, 1px);
    border-radius: 50%;
    background: #e1f4ff url(../images/ic_arr.svg) no-repeat center/contain;
    margin: auto;
    transition: all 0.3s
}

.idx01 .concern_btns .btn_it a:hover {
    opacity: 1
}

@media only screen and (min-width:769px) {
    .idx01 .concern_btns .btn_it {
        width: calc(50% - 23px)
    }

    .idx01 .concern_btns .btn_it a:after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 0;
        height: 100%;
        z-index: -1;
        background-color: #e1f4ff;
        transition: width 0.3s ease-in-out
    }

    .idx01 .concern_btns .btn_it a:hover:before {
        background-color: var(--main-color);
        background-image: url(../images/ic_arr_white.svg)
    }

    .idx01 .concern_btns .btn_it a:hover:after {
        width: 100%
    }
}

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

    .idx01:after,
    .idx01:before {
        font-size: min(7px, 0.5vw)
    }

    .idx01 .box_text:before {
        right: -2vw;
        font-size: min(9px, 0.65vw)
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1400px) {
    .idx01 .wrap_title {
        margin-bottom: 25px
    }

    .idx01 .box_text {
        padding-right: 30vw
    }

    .idx01 .concern_btns {
        margin-top: 4em;
        font-size: min(10px, 0.85vw)
    }

    .idx01 .concern_btns .btn_it {
        width: calc(50% - 1em)
    }

    .idx01 .concern_btns .btn_it a {
        padding: 0.06em 3.05em 0.06em 1.05em
    }
}

@media only screen and (max-width:1300px) and (min-width:769px) {
    .idx01 {
        margin-top: 20px;
        padding-bottom: 70px
    }

    .idx01:after {
        top: -178.7em;
        background-image: url(../images/idx01_bg_1024.png);
        background-position: left bottom;
        background-size: contain
    }

    .idx01 .box_text:before {
        right: 0
    }
}

.idx02 {
    position: relative;
    z-index: 1
}

.idx02 .TabContainer .TabPager>div {
    padding: 33px 10px 28px;
    background-color: #d7e9f4;
    width: 50%;
    margin: 0;
    display: block
}

.idx02 .TabContainer .TabPager>div .tt {
    font-size: 24px;
    line-height: 1.4;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-align: center;
    color: var(--clr1);
    border-bottom: 2px solid transparent;
    display: table;
    padding-bottom: 3px
}

.idx02 .TabContainer .TabPager>div .b_in {
    max-width: 640px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.idx02 .TabContainer .TabPager>div:first-child .b_in {
    margin-left: auto
}

.idx02 .TabContainer .TabPager>div:last-child .b_in {
    margin-right: auto
}

.idx02 .TabContainer .TabPager>div.active {
    background-color: #ffffff
}

.idx02 .TabContainer .TabPager>div.active .tt {
    color: var(--main-color);
    border-color: var(--main-color)
}

.idx02 .TabContainer .TabContent .content {
    padding: 103px 0 113px;
    background: #fff url(../images/idx02_bg.png) no-repeat bottom right/auto
}

.idx02 .gr_btn {
    margin-top: 47px
}

.idx02 .gr_btn .btn {
    margin-top: 18px
}

.idx02 .b_grid figure img {
    border-radius: 5px
}

.idx02 .block_flow {
    line-height: 1.875;
    font-size: 10px
}

.idx02 .block_flow .item {
    --bd-radius: 2em;
    --bx-w: 26em;
    --m-r: 8em;
    max-width: var(--bx-w);
    position: relative
}

.idx02 .block_flow .item:not(:last-child) {
    margin-right: var(--m-r)
}

.idx02 .block_flow .item:not(:last-child):after {
    content: "";
    position: absolute;
    top: calc(var(--bx-w) / 2 - 1.9em);
    right: calc(-1 * (var(--m-r) - 3.2em));
    background: url(../images/idx02_it_bf.svg) no-repeat center/contain;
    width: 1.6em;
    height: 4em
}

.idx02 .block_flow h4 {
    font-size: 2em;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0.14em;
    color: #006c9c;
    margin-bottom: 0.55em
}

.idx02 .block_flow p {
    font-size: 1.6em;
    line-height: 1.875;
    letter-spacing: 0.1em
}

.idx02 .block_flow .flow_num {
    position: absolute;
    top: 0.375em;
    left: 0.6em;
    font-size: 4em;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0.05em;
    color: #fff
}

.idx02 .block_flow .flow_img {
    border-radius: var(--bd-radius);
    overflow: hidden;
    position: relative;
    padding: 1em;
    background-color: #9bc2d4;
    margin: 0 auto 1.7em
}

.idx02 .block_flow .flow_img figure {
    mask-image: url(../images/idx02_img_mask.svg);
    -webkit-mask-image: url(../images/idx02_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
}
.idx02 .block_flow + .btn{
    margin: 40px auto 0;
    width: calc(100% - 40px);
}

@media only screen and (min-width:769px) {
    .idx02 .wrap_title {
        margin-top: 67px;
        margin-bottom: 42px
    }

    .idx02 .b_grid {
        grid-template-columns: 48% 46.9%
    }

    .idx02 .block_flow .item {
        width: calc((100% - var(--m-r) * 3) / 4)
    }

    .idx02 .block_flow .item:not(:last-child):after {
        right: calc(-1 * (var(--m-r) - 2em))
    }

    .idx02 .TabContainer .TabPager>div:hover:not(.active) {
        background-color: #b5e2ff
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1400px) {
    .idx02 .wrap_title {
        margin-bottom: 15px
    }

    .idx02 .gr_btn {
        margin-top: 25px
    }

    .idx02 .block_flow {
        font-size: min(10px, 0.75vw)
    }

    .idx02 .block_flow .item {
        --m-r: 6em
    }

    .idx02 .block_flow h4 {
        letter-spacing: 0.1em
    }

    .idx02 .TabContainer .TabPager>div {
        padding: 22px 10px 18px
    }

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

    .idx02 .TabContainer .TabContent .content {
        padding: 80px 4% 80px
    }
}

@media only screen and (min-width:769px) and (max-width:1200px) {
    .idx02 .wrap_title {
        margin-top: 0
    }

    .idx02 .block_flow {
        font-size: min(8.75px, 0.8vw);
        padding: 0
    }

    .idx02 .block_flow p {
        font-size: 1.8em
    }

    .idx02 .block_flow .flow_num {
        left: 0.4em
    }

    .idx02 .block_flow h4 {
        font-size: 2.3em;
        letter-spacing: 0.1em
    }
}

.idx03 {
    padding: 127px 0 100px;
    position: relative
}

.idx03:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% - 100px);
    background: url(../images/idx03_bg.jpg) no-repeat center/cover
}

.idx03 .txt_line {
    color: var(--main-color);
    font-weight: bold;
    border-bottom: 1px solid var(--main-color);
    padding-bottom: 5px
}

.idx03 .idx_title .wrap_title .en {
    margin-bottom: 13px
}

.idx03 .idx_title .wrap_title h3.ic_h3:after {
    margin-left: -2px;
    margin-top: 15px
}

.idx03 .inner_big {
    position: relative
}

.idx03 .block_consultation {
    font-size: 10px
}

.idx03 .block_consultation .item {
    background-color: #ffffff;
    border-radius: 5px;
    padding: 5.3em 6.1em 8.2em
}

.idx03 .block_consultation figure {
    max-width: 220px;
    width: 100%;
    margin: 0 auto 3.1em
}

.idx03 .block_consultation h4 {
    text-align: center;
    color: var(--main-color);
    font-size: 2.4em;
    font-weight: 500;
    line-height: 1.5833;
    margin-bottom: 0.8333333333em
}

.idx03 .block_consultation p {
    font-size: 1.8em
}

.idx03 .btn {
    margin: 60px auto 0;
    max-width: 300px
}

.idx03 .box_text>p {
    letter-spacing: 0.1em
}

.idx03 .block_contact {
    background-color: #ffffff;
    border-radius: 5px;
    padding: 4em 4em 5.5em;
    position: relative;
    z-index: 0;
    margin-top: 6em;
    font-size: 10px
}

.idx03 .block_contact:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    width: 2px;
    height: 12.1em;
    background-color: #d8eaf5
}

.idx03 .block_contact .fblock {
    max-width: 106.1em;
    width: 100%;
    margin: 0 auto;
    align-items: center
}

.idx03 .block_contact .btn_it a {
    text-decoration: none;
    display: table;
    position: relative
}

.idx03 .block_contact .btn_it.btn_tel {
    padding-left: 4.6em;
    padding-top: 1.6em
}

.idx03 .block_contact .btn_it.btn_tel:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background-color: rgba(225, 244, 255, 0.2);
    z-index: -1
}

.idx03 .block_contact .btn_it.btn_tel a {
    color: var(--main-color);
    padding-left: 9.5em
}

.idx03 .block_contact .btn_it.btn_tel a:before {
    content: "";
    position: absolute;
    top: 0;
    left: -0.2em;
    width: 7.2em;
    height: 5em;
    background: url(../images/ic_tel02.svg) no-repeat center left/4.4em auto;
    border-right: 1px solid var(--main-color)
}

.idx03 .block_contact .btn_it.btn_tel span {
    display: table;
    line-height: 1;
    letter-spacing: 0.05em
}

.idx03 .block_contact .btn_it.btn_tel .txt_tel {
    font-family: var(--f-en);
    font-weight: 400;
    font-size: 3em;
    margin-bottom: 0.13333333em
}

.idx03 .block_contact .btn_it.btn_tel .txt_time {
    font-size: 1.6em;
    font-weight: 500;
    margin-left: 0.0625em
}

.idx03 .block_contact .btn_it.btn_mail {
    max-width: 42.1em;
    width: 50%;
    padding-top: 1.5em
}

.idx03 .block_contact .btn_it.btn_mail a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 9em;
    background-color: var(--main-color);
    color: #fff;
    border-radius: 60px;
    padding-bottom: 0.3em
}

.idx03 .block_contact .btn_it.btn_mail .txt_mail {
    position: relative;
    padding-left: 5.5em;
    font-size: 2.4em;
    font-weight: 500;
    letter-spacing: 0.2em;
    line-height: 1
}

.idx03 .block_contact .btn_it.btn_mail .txt_mail:after,
.idx03 .block_contact .btn_it.btn_mail .txt_mail:before {
    content: "";
    position: absolute
}

.idx03 .block_contact .btn_it.btn_mail .txt_mail:before {
    top: -0.25em;
    left: 1.2916666667em;
    width: 2em;
    height: 1.6666666667em;
    background: url(../images/ic_mail02.svg) no-repeat center/contain
}

.idx03 .block_contact .btn_it.btn_mail .txt_mail:after {
    left: 4.4166666667em;
    top: -0.08333333em;
    width: 1px;
    height: 1.25em;
    background-color: rgba(255, 255, 255, 0.2)
}

.idx03 .block_network {
    max-width: 1680px;
    width: calc(100% - 60px);
    margin: 80px auto 0;
    position: relative;
    z-index: 1
}

.idx03 .block_network:before {
    content: "";
    position: absolute;
    bottom: -120px;
    right: -120px;
    max-width: 1490px;
    width: 100%;
    height: 573px;
    border-radius: 5px;
    background-image: linear-gradient(0deg, rgb(188, 212, 226) 0%, rgb(101, 168, 200) 31%, rgb(14, 124, 173) 100%);
    z-index: -1
}

.idx03 .block_network .box_inner {
    border-radius: 5px;
    background: url(../images/idx03_network_bg.jpg) no-repeat center/cover;
    padding: 187px 5% 165px 15.3%;
    color: #fff
}

.idx03 .block_network .wrap_title {
    margin-bottom: 22px
}

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

.idx03 .block_network .txt_en {
    bottom: -1.65em;
    right: -0.1916666667em;
    line-height: 1.1;
    text-align: right;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.8)
}

.idx03 .block_network .box_content {
    max-width: 1110px;
    width: 100%;
    padding-right: 360px;
    position: relative;
    margin: 0 auto
}

@media only screen and (min-width:769px) {
    .idx03 .idx_title {
        margin-bottom: 60px
    }

    .idx03 .idx_title .wrap_title {
        width: 53%
    }

    .idx03 .idx_title .box_text {
        width: 45%;
        max-width: 540px;
        margin-top: -10px;
        margin-right: -10px
    }

    .idx03 .block_consultation .item {
        width: calc((100% - 4.4em) / 3);
        margin-right: 2.2em
    }

    .idx03 .block_consultation .item:last-child,
    .idx03 .block_consultation .item:nth-child(3n+3) {
        margin-right: 0
    }

    .idx03 .block_network .btn {
        position: absolute;
        right: 2px;
        bottom: 1px;
        max-width: 260px;
        width: 35%
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1400px) {
    .idx03 .idx_title {
        margin-bottom: 40px
    }

    .idx03 .idx_title .wrap_title {
        width: 48%
    }

    .idx03 .idx_title .box_text {
        width: 52%;
        max-width: 650px;
        padding-right: 3%;
        margin-right: 0
    }

    .idx03 .block_consultation {
        font-size: min(10px, 0.9vw)
    }

    .idx03 .block_consultation .item {
        padding: 4.3em 3.1em 5.2em
    }

    .idx03 .block_consultation h4 {
        margin-bottom: 0.5em
    }

    .idx03 .block_contact {
        font-size: min(10px, 0.9vw)
    }

    .idx03 .btn {
        margin-top: 45px
    }

    .idx03 .block_network:before {
        bottom: -8vw
    }

    .idx03 .block_network .box_inner {
        padding: 124px 3% 100px 3%
    }
}

@media only screen and (min-width:769px) and (max-width:1200px) {
    .idx03 .idx_title .box_text {
        width: 47%
    }

    .idx03 .block_network .box_inner {
        padding: 124px 3% 138px 3%
    }

    .idx03 .block_network .box_content {
        padding-right: 27vw
    }
}

@media only screen and (max-width:1000px) {
    .idx03 .block_network .box_content {
        padding-right: 0
    }

    .idx03 .block_network .box_inner {
        padding: 80px 3% 107px 3%
    }

    .idx03 .block_network .btn {
        width: 100%;
        position: relative;
        margin: 20px auto 0
    }
}

.TabContainer.tab_lv1>.TabPager {
    height: 9em;
    align-items: flex-end;
    width: 90%;
    max-width: 1160px;
    font-size: 10px
}

.TabContainer.tab_lv1>.TabPager>div {
    padding: 3.3em 1em 2.8em;
    background-color: var(--main-color);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 8em;
    border-radius: 5px 5px 0 0
}

.TabContainer.tab_lv1>.TabPager>div .tt {
    font-size: 2em;
    line-height: 1.4;
    font-weight: 400;
    letter-spacing: 0.14em;
    text-align: center;
    color: white;
    border-bottom: 2px solid transparent;
    display: table;
    padding-bottom: 0.15em
}

.TabContainer.tab_lv1>.TabPager>div:first-child .b_in {
    margin-left: auto
}

.TabContainer.tab_lv1>.TabPager>div:last-child .b_in {
    margin-right: auto
}

.TabContainer.tab_lv1>.TabPager>div.active {
    background-color: #ffffff;
    height: 9em
}

.TabContainer.tab_lv1>.TabPager>div.active .tt {
    color: var(--main-color);
    font-weight: 500;
    border-color: var(--main-color)
}

.TabContainer.tab_lv1>.TabContent .content {
    background-color: white;
    border-radius: 5px
}

.TabContainer.tab_lv1>.TabContent .content .content>div {
    transition: unset
}

.TabContainer.tab_lv1 .tab_lv2 .tab_btn {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    font-size: 10px
}

.TabContainer.tab_lv1 .tab_lv2 .tab_btn>div {
    max-width: 260px;
    width: calc(25% - 1.6em);
    margin: 0 0.8em;
    min-height: 6em;
    border-radius: 60px;
    border: 1px solid var(--main-color);
    background-color: white;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

.TabContainer.tab_lv1 .tab_lv2 .tab_btn>div .tt {
    font-size: 1.6em;
    font-weight: 400;
    letter-spacing: 0.1em;
    text-align: center;
    color: var(--main-color);
    transition: all 0.3s
}

.TabContainer.tab_lv1 .tab_lv2 .tab_btn>div.active {
    background-color: var(--main-color)
}

.TabContainer.tab_lv1 .tab_lv2 .tab_btn>div.active .tt {
    color: #ffffff
}

.TabContainer.tab_lv1 .tab_lv2 .tab_content {
    background-color: white
}

.TabContainer.tab_lv1 .tab_lv2 .tab_content .content>div {
    opacity: 0;
    visibility: hidden
}

.TabContainer.tab_lv1 .tab_lv2 .tab_content .content>div.active {
    opacity: 1;
    visibility: visible
}

.idx04 {
    position: relative;
    padding: 205px 0 120px
}

.idx04:after,
.idx04:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: calc(100% + 283px);
    background-repeat: no-repeat
}

.idx04:before {
    background-image: url(../images/idx04_bg01.jpg);
    background-position: center;
    background-size: cover
}

.idx04:after {
    background-image: url(../images/idx04_bg02.png);
    background-position: top -197px left;
    background-size: auto;
    max-width: 1920px;
    right: 0;
    margin: auto
}

.idx04 .inner_big {
    z-index: 1;
    position: relative
}

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

.idx04 .wrap_title .en {
    color: #1b5090;
    margin-bottom: 7px
}

.idx04 .wrap_title h3.ic_h3:after {
    margin-top: 15px
}

.idx04 .TabContainer.tab_lv1>.TabPager>div {
    width: calc(33.3333333333% - 1.4em);
    max-width: 364em;
    margin: 0 0.7em;
    padding-top: 3.3em
}

.idx04 .TabContainer.tab_lv1>.TabPager>div .tt {
    padding-bottom: 0.25em
}

.idx04 .TabContainer.tab_lv1>.TabContent>.content {
    padding: 50px 59px 80px 60px
}

.idx04 .TabContainer.tab_lv1 .tab_lv2 .tab_btn div {
    position: relative;
    padding: 1.1em 1em 1em
}

.idx04 .TabContainer.tab_lv1 .tab_lv2 .tab_btn div:before {
    content: "";
    position: absolute;
    bottom: -0.8em;
    left: 0;
    right: 0;
    margin: auto;
    width: 1px;
    height: 1.6em;
    background-image: linear-gradient(180deg, rgb(255, 255, 255) 50%, rgb(14, 124, 173) 50%);
    opacity: 0
}

.idx04 .TabContainer.tab_lv1 .tab_lv2 .tab_btn div.active:before {
    opacity: 1
}

.idx04 .TabContainer.tab_lv1 .tab_lv2 .tab_content {
    padding: 50px 0 0
}

.idx04 .b_consultation {
    font-size: 10px
}

.idx04 .b_consultation .item {
    max-width: 27.1em;
    position: relative;
    overflow: hidden;
    border-radius: 5px;
    padding: 3em 3em 5.7em;
    min-height: 27.1em;
    display: flex;
    align-items: center;
    justify-content: center
}

.idx04 .b_consultation .consultation_cont {
    position: relative
}

.idx04 .b_consultation .consultation_cont h4 {
    font-size: 1.8em;
    font-weight: 500;
    text-align: center;
    line-height: 1.4;
    color: var(--main-color);
    letter-spacing: 0.1em;
    margin-bottom: 0.944444444em
}

.idx04 .b_consultation .consultation_cont p {
    font-size: 1.4em
}

.idx04 .b_consultation .consultation_bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.idx04 .b_consultation .consultation_bg:before {
    content: "";
    position: absolute;
    inset: 1em;
    background: url(../images/idx04_it_bf.png) no-repeat center/cover;
    background-color: rgba(255, 255, 255, 0);
    border: 2px solid #ffffff;
    transition: 0.3s all
}

.idx04 .b_consultation .consultation_bg img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    transition: 0.3s all;
    position: relative;
    z-index: -1
}

.idx04 .gr_btn {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 38px;
    max-width: 610px
}

.idx04 .gr_btn .btn {
    width: calc(50% - 5px);
    margin-top: 10px
}

@media only screen and (min-width:769px) {
    .TabContainer.tab_lv1>.TabPager>div:not(.active):hover {
        background-color: #1f5a81
    }

    .TabContainer.tab_lv1 .tab_lv2 .tab_btn>div:not(.active):hover {
        background-color: var(--main-color)
    }

    .TabContainer.tab_lv1 .tab_lv2 .tab_btn>div:not(.active):hover .tt {
        color: #fff
    }

    .idx04 .b_grid {
        grid-template-columns: 56% 39.8%;
        justify-content: space-between
    }

    .idx04 .b_consultation .item {
        width: calc(25% - 1.2em);
        margin: 0.6em
    }

    .idx04 .b_consultation .item:hover .consultation_bg img {
        transform: scale(1.1)
    }

    .idx04 .b_consultation .item:hover .consultation_bg:before {
        inset: 0.5em;
        background-color: rgba(255, 255, 255, 0.7)
    }

    .idx04 .tab_ct01 .wrap_title {
        margin-top: 46px;
        margin-bottom: 42px
    }

    .idx04 .tab_ct01 .wrap_title .en {
        margin-bottom: 10px
    }

    .idx04 .tab_ct01 .wrap_title .en:before {
        top: 2px;
        left: 1px
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1400px) {
    .TabContainer.tab_lv1>.TabPager {
        font-size: min(8.75px, 1vw)
    }

    .TabContainer.tab_lv1 .tab_lv2 .tab_btn {
        font-size: min(10px, 1vw)
    }

    .idx04 {
        padding-top: 10vw;
        padding-bottom: 80px
    }

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

    .idx04 .tab_ct01 .wrap_title {
        margin-bottom: 30px
    }

    .idx04 .gr_btn {
        margin-top: 30px
    }

    .idx04 .TabContainer.tab_lv1>.TabContent>.content {
        padding: 50px 4%
    }
}

@media only screen and (min-width:769px) and (max-width:1200px) {
    .idx04 .b_grid {
        padding: 0
    }

    .idx04 .b_consultation {
        font-size: min(8.75px, 0.9vw)
    }

    .idx04 .b_consultation .item {
        padding: 3em 2em 5.7em
    }

    .idx04 .b_consultation .consultation_bg:before {
        inset: 0.8em
    }

    .idx04 .tab_ct01 .wrap_title {
        margin-top: 0;
        margin-bottom: 15px
    }

    .idx04 .tab_ct01 .gr_btn {
        margin-top: 20px;
        font-size: min(16px, 1.6vw)
    }
}

.idx05 {
    padding-bottom: 120px;
    position: relative;
    z-index: 0
}

.idx05:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 568px;
    background: url(../images/idx05_bg.jpg) no-repeat center/cover;
    z-index: -1
}

.idx05:after {
    content: "";
    position: absolute;
    bottom: -25.4em;
    right: -12.7em;
    width: 74.1em;
    height: 72.4em;
    background: url(../images/dot.png);
    font-size: 10px;
    z-index: -1
}

.idx05 .idx_title {
    padding-top: 137px
}

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

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

.idx05 .wrap_title h3.ic_h3:after {
    margin-top: 15px
}

.idx05 .case_text {
    background: linear-gradient(180deg, rgb(214, 231, 241) 0%, rgba(14, 124, 173, 0) 75%);
    text-align: center;
    padding: 73px 20px 53px;
    border: 1px solid #ccdde7
}

.idx05 .case_text p {
    font-weight: 500
}

.idx05 .block_case {
    padding: 25px 10% 25px;
    background-color: #e1f4ff;
    margin-top: 30px
}

.idx05 .block_case .case_img {
    width: 22em;
    height: 22em;
    padding: 1em;
    border-radius: 50%;
    overflow: hidden;
    background-color: #dceef9;
    position: relative;
    text-align: center;
    font-size: 10px;
}

.idx05 .block_case .case_img .b_in {
    border-radius: 50%;
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative
}

.idx05 .block_case .case_img .lawyer_name {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 5.91666667em;
    background-image: linear-gradient(0deg, rgba(214, 231, 241, 0.85) -20%, rgba(114, 178, 207, 0.85) 27%, rgba(14, 125, 173, 0.85) 100%);
    font-size: 1.2em;
    color: white;
    line-height: 1.75;
    padding-top: 0.75em;
    
}

.idx05 .block_case .case_img .lawyer_name span {
    font-size: 1.33333333em;
    font-weight: 500;
    display: block
}

.idx05 .block_case .case_ct {
    max-width: 690px
}

.idx05 .block_case .case_ct p {
    font-weight: 500
}

.idx05 .block_case h4 {
    margin-top: 38px;
    margin-bottom: 21px
}

.idx05 h4 {
    font-size: 24px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 1.5
}

.idx05 h4:after {
    content: "";
    position: relative;
    display: block;
    height: 1px;
    background-color: var(--main-color);
    margin-top: 0.5em;
    width: 6.6666666667em
}

.idx05 h4.t_center {
    margin-bottom: 1.3333333333em
}

.idx05 h4.t_center:after {
    margin-left: auto;
    margin-right: auto;
    width: 5.4166666667em;
    margin-top: 0.4583333333em
}

.idx05 .TabContainer.tab_lv1>.TabPager>div {
    width: calc(25% - 1.2em);
    margin: 0 0.6em;
    max-width: 271px;
    padding: 1em 1em 1.8em
}

.idx05 .TabContainer.tab_lv1>.TabPager>div .tt .num {
    font-size: 1.5em
}

.idx05 .TabContainer.tab_lv1>.TabContent {
    overflow: visible
}

.idx05 .TabContainer.tab_lv1>.TabContent>.content {
    box-shadow: 0px 20px 30px 0px rgba(14, 124, 173, 0.14);
    padding: 50px 80px 80px
}

.idx05 .TabContainer.tab_lv1>.TabContent>.content>div {
    transition: unset
}

.idx05 .TabContainer.tab_lv1 .tab_lv2 .tab_btn {
    margin-bottom: -30px;
    position: relative;
    z-index: 2
}

.idx05 .TabContainer.tab_lv1 .tab_lv2 .tab_btn>div {
    max-width: 400px;
    width: calc(50% - 1.8em);
    margin: 0 0.9em
}

.idx05 .TabContainer.tab_lv1 .tab_lv2 .tab_btn>div .tt span {
    font-size: 0.6875em;
    letter-spacing: 0.05em;
    line-height: 1;
    margin-left: 1.272727273em;
    padding-left: 1.454545455em;
    position: relative;
    top: -0.18181818em
}

.idx05 .TabContainer.tab_lv1 .tab_lv2 .tab_btn>div .tt span:before {
    content: "";
    position: absolute;
    top: -0.4545454545em;
    left: 0;
    width: 1px;
    height: 1.818181818em;
    background-color: var(--main-color)
}

.idx05 .TabContainer.tab_lv1 .tab_lv2 .tab_btn>div.active {
    box-shadow: 0px 20px 30px 0px rgba(14, 124, 173, 0.14)
}

.idx05 .TabContainer.tab_lv1 .tab_lv2 .tab_btn>div.active .tt span:before {
    background-color: #fbfeff
}

@media only screen and (min-width:769px) {
    .idx05 .b_grid {
        grid-template-columns: calc(100% - 266px) 200px;
        justify-content: space-between
    }

    .idx05 .TabContainer.tab_lv1 .tab_lv2 .tab_btn>div:not(.active):hover .tt span:before {
        background-color: #fff
    }

    .idx05 .TabContainer.tab_lv1:not(.tab-initialized) .TabContent .content {
        height: 32.7222222222em
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1400px) {
    .idx05 .wrap_title {
        margin-bottom: 30px
    }

    .idx05 h4 {
        font-size: 20px
    }

    .idx05 .TabContainer.tab_lv1>.TabContent>.content {
        padding: 50px 5%
    }

    .idx05 .TabContainer.tab_lv1 .tab_lv2 .tab_btn {
        width: 95%;
        margin-left: auto;
        margin-right: auto
    }
}

@media only screen and (min-width:769px) and (max-width:1200px) {
    .idx05 {
        padding-bottom: 90px
    }

    .idx05:after {
        font-size: min(7px, 0.5vw)
    }

    .idx05 .idx_title {
        padding-top: 80px
    }

    .idx05 .block_case {
        grid-template-columns: calc(100% - 210px) 190px;
        padding: 25px 4% 25px
    }

    .idx05 .block_case .case_img {
        width: 190px;
        height: 190px
    }

    .idx05 .block_case h4 {
        margin-top: 25px;
        margin-bottom: 12px
    }
}

.idx06 {
    position: relative;
    background-color: #e1f4ff
}

.idx06 .idx_wrap {
    max-width: 1920px;
    width: 100%;
    margin: 0 auto;
    position: relative;
    padding: 183px 0 110px
}

.idx06 .wrap_title {
    width: 55%;
    margin-left: auto;
    position: relative;
    padding-left: 9.22222222em;
    margin-bottom: 5.833333333em;
    max-width: 31.333333333em
}

.idx06 .wrap_title:before {
    content: "";
    position: absolute;
    top: -0.3888888889em;
    left: 0.5em;
    width: 7.3333333333em;
    height: 10.33333333em;
    background: url(../images/idx06_num.png) no-repeat center/contain
}

.idx06 .wrap_title .en {
    margin-bottom: 1.7777777778em;
    font-size: 1em
}

.idx06 .wrap_title h3 {
    font-size: 1.8888888889em;
    margin-left: -0.1176470588em
}

.idx06 .wrap_title h3 .sm {
    font-size: 0.7058823529em
}

.idx06 .txt_en {
    font-weight: 300;
    line-height: 1.0833333;
    color: rgba(255, 255, 255, 0.8);
    text-align: right;
    text-transform: uppercase;
    position: absolute;
    bottom: -0.1916666667em;
    right: -0.1333333333em
}

.idx06 .btn {
    margin-top: 59px
}

.idx06 .block_feature {
    font-size: 10px
}

.idx06 .feature_tabs:not(.slick-slider) {
    display: flex;
    opacity: 0
}

.idx06 .feature_tabs .slick-track {
    width: 100% !important;
    transform: none !important;
    display: block !important
}

.idx06 .feature_tabs .slick-slide {
    width: 100% !important
}

.idx06 .feature_tabs .item {
    background-color: #fcfcfc;
    border-bottom: 1px solid #ccdde7;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5.2em 3em 4em 5.1em;
    cursor: pointer;
    transition: 0.3s all
}

.idx06 .feature_tabs .item:last-child {
    border-bottom: none
}

.idx06 .feature_tabs .ttl {
    font-size: 2.4em;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0.16em
}

.idx06 .feature_tabs .num {
    font-family: var(--f-en);
    font-weight: 300;
    font-size: 6em;
    color: var(--main-color);
    letter-spacing: 0.06em;
    line-height: 1;
    flex: 0 0 auto;
    margin-top: -0.0833333333em
}

.idx06 .feature_tabs .num:first-letter {
    color: #bcd4e2
}

.idx06 .feature_silder {
    z-index: 0;
    position: relative
}

.idx06 .feature_silder:not(.slick-slider) {
    display: flex;
    opacity: 0
}

.idx06 .feature_silder:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 120em;
    height: 100%;
    background-color: #fff;
    z-index: -1
}

.idx06 .feature_silder:after {
    content: "";
    position: absolute;
    bottom: -10.7em;
    left: -25.6em;
    width: 16em;
    height: 25.7em;
    background: url(../images/idx06_dot.png)
}

.idx06 .feature_silder .slick-list {
    overflow: visible
}

.idx06 .feature_silder .s_item {
    position: relative;
    padding-top: 28.6em
}

.idx06 .feature_silder .feature_img {
    position: absolute;
    right: 1.9em;
    top: -20.5em;
    width: 100em;
    height: 71.7em
}

.idx06 .feature_silder h4 {
    font-size: 3em;
    font-weight: 500;
    line-height: 2.33333;
    letter-spacing: 0.16em;
    text-decoration: underline;
    text-underline-offset: 0.5666666667em;
    text-decoration-thickness: 2px;
    text-decoration-color: var(--main-color);
    margin-bottom: 1.0666666667em
}

.idx06 .feature_silder .feature_cont {
    background-color: #fff;
    padding: 6.6em 5.6em 3.4em 10.2em;
    position: relative
}

.idx06 .feature_silder .feature_cont p {
    letter-spacing: 0.16em;
    font-size: 2em
}

@media only screen and (min-width:769px) {
    .idx06 .feature_tabs {
        max-width: 501px;
        width: 39.1%;
        order: 2
    }

    .idx06 .feature_tabs .item.active {
        background-color: #d7e9f4
    }

    .idx06 .feature_tabs .item:hover {
        background-color: #d7e9f4
    }

    .idx06 .feature_silder {
        width: 60.9%;
        max-width: 780px;
        border-right: 1px solid #ccdde7;
        order: 1;
        padding-right: 8em
    }
}

@media only screen and (min-width:769px) and (max-width:1600px) {
    .idx06 .feature_silder .feature_img {
        width: calc(100% + 8vw)
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1400px) {
    .idx06 .inner_big {
        padding: 0 60px
    }

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

    .idx06 .feature_silder {
        width: 60.5%;
        padding-right: 6em
    }

    .idx06 .feature_silder .feature_cont {
        padding: 6.6em 1.6em 3.4em 7.2em;
        margin-top: -6em
    }

    .idx06 .feature_silder .feature_img {
        width: 114%;
        right: 0
    }

    .idx06 .feature_tabs {
        width: 39.5%
    }

    .idx06 .feature_tabs .item {
        padding: 5.2em 2em 4em 3.1em
    }

    .idx06 .feature_tabs .ttl {
        letter-spacing: 0.1em
    }

    .idx06 .txt_en {
        font-size: min(100px, 9.5vw)
    }
}

@media only screen and (min-width:769px) and (max-width:1200px) {
    .idx06 .idx_wrap {
        padding-top: 100px
    }

    .idx06 .wrap_title {
        margin-bottom: 3.833333em;
        max-width: 30.333333em;
        font-size: min(16px, 1.2vw)
    }

    .idx06 .btn {
        margin-top: 35px;
        max-width: 300px
    }

    .idx06 .feature_tabs .item {
        padding: 5.2em 2em 4em 2em
    }

    .idx06 .feature_silder {
        padding-right: 4em
    }

    .idx06 .feature_silder .feature_img {
        width: calc(100% + 60px);
        top: -10.5em
    }
}

@media only screen and (max-width:1000px) {
    .idx06 .wrap_title {
        width: 100%;
        max-width: fit-content;
        margin: 0 auto 90px;
        font-size: 16px;
        padding-left: 7.222222em
    }

    .idx06 .wrap_title:before {
        font-size: 0.8em
    }

    .idx06 .wrap_title .en {
        margin-bottom: 0.777778em
    }
}

.idx07 {
    padding: 138px 0 80px;
    position: relative;
    z-index: 0;
    max-width: 1920px;
    width: 100%;
    margin: 0 auto
}

.idx07:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    max-width: 520px;
    width: 39%;
    height: 100%;
    background: url(../images/idx07_bg.jpg) no-repeat center/cover;
    z-index: -1
}

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

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

.idx07 .wrap_title h3.ic_h3:after {
    margin-left: -2px;
    margin-top: 15px
}

.idx07 .block_faq {
    max-width: 760px;
    width: 100%
}

.idx07 .block_faq .item {
    border: 1px solid #d8eaf5;
    background-color: #fff;
    border-radius: 5px;
    margin-bottom: 15px;
    overflow: hidden
}

.idx07 .block_faq .item:last-child {
    margin-bottom: 0
}

.idx07 .block_faq .b_question {
    padding: 1.5em 2.11111111em 1.5em;
    position: relative;
    cursor: pointer
}

.idx07 .block_faq .b_question:after,
.idx07 .block_faq .b_question:before {
    content: "";
    position: absolute;
    top: 0.1111111111em;
    bottom: 0;
    margin: auto;
    background-color: var(--main-color);
    transition: 0.3s all
}

.idx07 .block_faq .b_question:before {
    width: 1em;
    height: 2px;
    right: 1.4444444444em
}

.idx07 .block_faq .b_question:after {
    width: 2px;
    height: 1em;
    right: 1.888888889em
}

.idx07 .block_faq .b_question.rotate {
    background-color: #006c9c
}

.idx07 .block_faq .b_question.rotate:after,
.idx07 .block_faq .b_question.rotate:before {
    background-color: white
}

.idx07 .block_faq .b_question.rotate:after {
    opacity: 0;
    transform: rotate(45deg)
}

.idx07 .block_faq .b_question.rotate .ttl {
    color: white
}

.idx07 .block_faq .b_question.rotate .ttl:before {
    color: #e1f4ff
}

.idx07 .block_faq .b_question .ttl {
    position: relative;
    font-weight: 500;
    line-height: 1.4;
    padding-left: 2.2222222222em
}

.idx07 .block_faq .b_question .ttl:before {
    content: "Q";
    position: absolute;
    top: -0.0833333333em;
    bottom: 0;
    left: -0.5em;
    font-size: 1.3333333333em;
    font-weight: 500;
    font-family: var(--f-en);
    color: var(--main-color)
}

.idx07 .block_faq .b_answer {
    padding-left: 1.6666666667em;
    padding-right: 0.83333333em;
    padding-top: 1.555555556em;
    padding-bottom: 2em
}

.idx07 .block_faq .b_answer p {
    font-size: 16px;
    line-height: 2.25;
    max-width: 615px;
    margin: 0 auto 5px;
    width: 100%
}

.idx07 .block_faq .b_answer p:last-child {
    margin-bottom: 0
}

.idx07 .btn {
    margin: 50px auto 0;
    max-width: 440px
}

@media only screen and (min-width:769px) {
    .idx07 .block_faq .b_question:hover {
        background-color: #006c9c
    }

    .idx07 .block_faq .b_question:hover:after,
    .idx07 .block_faq .b_question:hover:before {
        background-color: white
    }

    .idx07 .block_faq .b_question:hover .ttl {
        color: white
    }

    .idx07 .block_faq .b_question:hover .ttl:before {
        color: #e1f4ff
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1400px) {
    .idx07 {
        padding-top: 95px
    }

    .idx07:before {
        width: 27%
    }

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

    .idx07 .block_faq {
        width: 70%
    }

    .idx07 .block_faq .b_question .ttl {
        padding-left: 1.222222em
    }

    .idx07 .block_faq .b_answer p {
        font-size: 14px;
        line-height: 2
    }
}

.idx08 {
    padding: 182px 0 141px;
    background: #f9fcfd url(../images/idx08_bg.jpg) repeat-x center top
}

.idx08 .idx_wrap {
    max-width: 1920px;
    width: 100%;
    margin: 0 auto;
    position: relative;
    z-index: 0
}

.idx08 .idx_wrap:before {
    content: "";
    position: absolute;
    bottom: -21.2em;
    right: -33em;
    width: 43em;
    height: 38.6em;
    background: url(../images/idx08_bf.png);
    font-size: 10px
}

.idx08 .greeting_img {
    position: relative;
    max-width: 613px
}

.idx08 .greeting_img img {
    border-radius: 5px;
    box-shadow: 0px 20px 30px 0px rgba(14, 124, 173, 0.14)
}

.idx08 .gr_btn {
    margin-top: 51px
}

.idx08 .gr_btn .btn {
    max-width: 300px
}

.idx08 .gr_btn .btn:not(:last-child) {
    margin-bottom: 16px
}

.idx08 .box_name {
    position: absolute;
    left: 0;
    bottom: -5.2em;
    max-width: 38em;
    width: 100%;
    background: url(../images/idx08_box_bg.jpg) no-repeat center/cover;
    padding: 3.4em 3.9em 3.3em;
    font-size: 10px
}

.idx08 .box_name p {
    line-height: 1;
    font-size: 1.8em;
    font-weight: 400;
    letter-spacing: 0.2em;
    color: var(--main-color)
}

.idx08 .box_name .name_tt01 {
    padding-bottom: 1.277777778em;
    margin-bottom: 0.666666667em;
    border-bottom: 1px solid #ccdde7
}

.idx08 .box_name .name_tt02 {
    display: flex;
    align-items: center
}

.idx08 .box_name .name_tt02 span {
    color: var(--clr1);
    font-size: 1.6666666667em;
    font-weight: 600;
    letter-spacing: 0.2em;
    padding-left: 0.7666666667em;
    line-height: 1
}

.idx08 .txt_en {
    top: 0.025em;
    right: 0.1416666667em;
    color: rgba(255, 255, 255, 0.4);
    text-transform: uppercase;
    line-height: 1.25;
    z-index: -1;
    text-align: right
}

@media only screen and (min-width:769px) {
    .idx08 .wrap_title {
        margin-top: 81px;
        margin-bottom: 50px
    }

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

    .idx08 .b_grid {
        grid-template-columns: 49% 45%;
        justify-content: space-between;
        align-items: flex-start
    }
}

@media only screen and (min-width:769px) and (max-width:1600px) {
    .idx08 .idx_wrap:before {
        font-size: 5px
    }

    .idx08 .txt_en {
        font-size: min(100px, 7vw)
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1400px) {
    .idx08 {
        padding-top: 90px
    }

    .idx08 .wrap_title {
        margin-bottom: 30px
    }

    .idx08 .b_grid {
        padding-right: 30px;
        grid-template-columns: 45% 50%
    }

    .idx08 .box_name {
        font-size: min(10px, 0.8vw)
    }

    .idx08 .gr_btn {
        margin-top: 35px
    }
}

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

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

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

.idx09:after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 522px;
    height: 781px;
    background-color: #e1f4ff;
    z-index: -2;
    border-bottom-left-radius: 5px
}

.idx09 .inner_max {
    position: relative
}

.idx09 .inner_max:before {
    content: "";
    position: absolute;
    top: -14.6em;
    right: 0;
    background: url(../images/idx09_bf.png) no-repeat center/contain;
    width: 9.1em;
    height: 8.9em;
    font-size: 10px
}

.idx09 .idx_logo {
    margin-bottom: 40px;
    max-width: 378px
}

.idx09 .idx_logo a {
    display: table
}

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

.idx09 .box_tel {
    margin-bottom: 28px
}

.idx09 .box_tel a {
    letter-spacing: 0.05em;
    font-size: 24px;
    padding: 1.125em 0.625em 0.9583333333em 0.8333333333em
}

.idx09 .box_tel .ic:before {
    top: 0;
    left: -0.125em;
    width: 0.8333333333em;
    height: 0.8333333333em
}

.idx09 .box_info {
    margin-bottom: 25px
}

.idx09 .box_info dd,
.idx09 .box_info dt {
    padding-bottom: 1.3888888889em
}

.idx09 .box_info dt {
    color: var(--main-color)
}

.idx09 .box_info dt:before {
    border-color: #e7f2f8
}

.idx09 .block_intro {
    max-width: 1280px;
    width: calc(100% - 60px);
    margin-left: auto;
    box-shadow: 0px 20px 30px 0px rgba(14, 124, 173, 0.14);
    background-color: #fff;
    border-radius: 5px;
    padding: 80px 80px
}

.idx09 .block_intro:before {
    content: "";
    position: absolute;
    top: -141px;
    left: -220px;
    width: 1240px;
    height: 937px;
    background: url(../images/idx09_img.jpg) no-repeat center/cover;
    z-index: -1
}

.idx09 .txt_sroll {
    display: flex;
    position: absolute;
    font-size: 10px;
    bottom: -7em;
    left: 0;
    z-index: -1;
    animation: marqueeImg 60s linear infinite;
    background: url(../images/idx09_txt_scroll.svg) repeat-x center;
    width: 844.8em;
    height: 21.5em
}

.idx09 .b_traffic {
    background-color: #f9f9f9
}

.idx09 .b_traffic .item {
    display: flex;
    align-items: center;
    margin-bottom: -9px;
    background-color: #f9f9f9;
    padding: 31px 15px 0 29px
}

.idx09 .b_traffic .item:last-child {
    margin-bottom: 0;
    padding-bottom: 34px
}

.idx09 .b_traffic .traffic_img {
    width: 60px;
    height: 60px;
    margin-top: -20px
}

.idx09 .b_traffic .traffic_cont {
    width: calc(100% - 60px);
    padding-left: 21px
}

.idx09 .b_traffic .traffic_tl {
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.1em;
    color: var(--main-color);
    line-height: 1.5;
    margin-bottom: 3px
}

.idx09 .b_traffic .traffic_txt {
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.05em
}

.idx09 .btn {
    margin-top: 45px;
    max-width: 300px
}

.idx09 .col_info {
    max-width: 460px
}

.idx09 .col_map {
    max-width: 600px
}

.idx_map {
    height: 350px
}

.idx_map iframe {
    height: 100%
}

@media only screen and (min-width:769px) {
    .idx09 .wrap_title {
        text-align: right;
        margin-right: -3px;
        margin-bottom: 62px
    }

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

    .idx09 .wrap_title h3.ic_h3:after {
        margin-right: 0
    }

    .idx09 .block_intro .col_info {
        width: 45%
    }

    .idx09 .block_intro .col_map {
        width: 54%
    }
}

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

    .idx09 .inner_max:before {
        right: 80px;
        top: -17.6em;
        font-size: min(7px, 0.8vw)
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1400px) {
    .idx09 {
        padding-top: 100px;
        padding-bottom: 14vw
    }

    .idx09:after {
        max-height: 600px;
        height: 50vw;
        max-width: 500px;
        width: 40%
    }

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

    .idx09 .block_intro {
        padding: 60px 5%
    }

    .idx09 .block_intro:before {
        max-width: 1240px;
        width: 57%;
        max-height: 800px;
        height: 53vw;
        left: 0
    }

    .idx09 .block_intro .col_info {
        width: 42%
    }

    .idx09 .b_traffic .traffic_img {
        width: 50px;
        height: 50px
    }

    .idx09 .b_traffic .traffic_cont {
        width: calc(100% - 50px)
    }

    .idx09 .b_traffic .traffic_tl {
        font-size: 16px
    }

    .idx09 .b_traffic .traffic_txt {
        font-size: 13px
    }

    .idx09 .txt_sroll {
        font-size: min(10px, 0.8vw)
    }
}

@media only screen and (min-width:769px) and (max-width:1200px) {
    .idx09 .box_info .sm {
        letter-spacing: 0.05em
    }

    .idx09 .box_info dd {
        padding-left: 0.8em
    }

    .idx09 .box_tel a {
        font-size: 20px
    }
}

.idx10 {
    padding: 80px 0 79px
}

.idx10 .tab_cate {
    display: flex;
    margin: 0 -5px
}

.idx10 .tab_cate .tab_it {
    max-width: 120px;
    width: calc(33.3333333333% - 10px);
    margin: 0 5px;
    padding-bottom: 21px;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease-in-out;
    cursor: pointer
}

.idx10 .tab_cate .tab_it .tt {
    font-size: 18px;
    line-height: 1.4;
    text-align: center
}

.idx10 .tab_cate .tab_it.active {
    border-color: var(--main-color)
}

.idx10 .tab_list {
    position: relative;
    z-index: 1
}

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

.idx10 .tab_list .content>div {
    opacity: 0;
    z-index: -10;
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    transition: all 0.5s ease-in-out;
    padding: 45px 0 21px
}

.idx10 .tab_list .content>div:first-child {
    opacity: 1;
    z-index: 1;
    visibility: visible;
    position: relative
}

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

.idx10 .block_news {
    background-color: #f4fafd;
    padding: 56px 84px;
    border-radius: 5px
}

.idx10 .block_news.tab-initialized .tab_list .content>div:first-child:not(.active) {
    opacity: 0;
    z-index: -10;
    visibility: hidden;
    position: absolute
}

.idx10 .list_post li {
    margin-bottom: 38px
}

.idx10 .list_post li:last-child {
    margin-bottom: 0
}

.idx10 .list_post a {
    display: flex;
    text-decoration: none;
    --w: 117px;
    transition: all 0.3s;
    letter-spacing: 0.1em;
    white-space: nowrap;
    max-width: 100%;
    color: var(--clr1);
    font-size: 16px;
    position: relative
}

.idx10 .list_post a:after {
    content: "";
    position: absolute;
    top: 4px;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 7px;
    height: 10px;
    background: url(../images/arr_news.png) no-repeat center/contain;
    transition: 0.3s all
}

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

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

@media only screen and (min-width:769px) {
    .idx10 .list_post a:hover {
        color: var(--main-color)
    }

    .idx10 .list_post a:hover:after {
        right: 5px
    }
}

.idx10 .list_post a .date {
    width: var(--w);
    transition: all 0.3s;
    letter-spacing: 0.04em
}

.idx10 .list_post a .cate {
    width: 100px;
    color: var(--main-color)
}

.idx10 .list_post a .title {
    width: calc(100% - var(--w) - 100px);
    position: relative;
    padding-right: 1.5em;
    padding-left: 30px;
    text-overflow: ellipsis;
    overflow: hidden
}

.idx10 .gr_btn {
    margin-top: 127px
}

.idx10 .gr_btn .btn {
    display: none;
    max-width: 300px
}

.idx10 .gr_btn .btn.active {
    display: block
}

@media only screen and (min-width:769px) {
    .idx10 .wrap_title {
        margin-top: 29px
    }

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

    .idx10 .b_grid {
        grid-template-columns: 24% 75%;
        justify-content: space-between
    }

    .idx10 .block_news {
        max-width: 860px;
        width: 100%;
        margin-left: auto
    }

    .idx10 .tab_cate .tab_it:not(.active):hover {
        border-color: var(--main-color)
    }
}

@media (min-width:769px) and (max-height:650px),
only screen and (min-width:769px) and (max-width:1400px) {
    .idx10 .block_news {
        padding: 45px 7% 25px
    }

    .idx10 .b_grid {
        grid-template-columns: 24% 73%
    }

    .idx10 .tab_cate .tab_it {
        padding-bottom: 10px
    }

    .idx10 .tab_cate .tab_it .tt {
        font-size: 16px
    }

    .idx10 .tab_list .content>div {
        padding: 30px 0 25px
    }

    .idx10 .list_post li {
        margin-bottom: 20px
    }

    .idx10 .list_post a {
        font-size: 14px;
        --w: 100px
    }

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

    .idx10 .gr_btn {
        margin-top: 80px
    }

    .idx10 .gr_btn .btn.style01 a {
        min-height: 3.3em
    }
}

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