/* --- Layout Colors --- */
:root {
    --primary-blue: #01408C;
    --accent-red: #843B5C;
    --white: #fff;
}

/* --- Reset CSS --- */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

@keyframes bgSlide {
    from {
        background-position: 0 0;
    }
    
    to {
        background-position: -10000px 0;
    }
}

@property --gradient-color {
    syntax: '<color>';
    initial-value: var(--accent-red);
    inherits: false;
}
body {    
    /* グラデーション背景 */
    /* background: linear-gradient(270deg, #ff9a9e, #fad0c4, #a1c4fd, #c2e9fb); */
    background: linear-gradient(135deg, var(--primary-blue) , var(--accent-red));
    background-size: 800% 800%;

    /* アニメーションの設定（30秒でループ） */
    animation: sliding-gradient 15s ease infinite;
}
@keyframes sliding-gradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

#recruit_page{
    padding-top: 14vw;
    @media (max-width: 896px) {
        padding-top: 24vw;
    }

    main{
        .highlight_txt{
            background: linear-gradient(90deg, #003F8C, #D71918);
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            color: transparent;
            font-weight: 700;
        }

        .recruit_head{
            position: relative;
            z-index: 10;
            .jp{
                display: block;
                width: fit-content;
                margin: -48px auto 0;
                font-size: 48px;
                @media (max-width: 896px) {
                    margin: -12px auto 0;
                    font-size: 24px;
                }
            }
        }
    }


    .mv{
        padding: 0 calc(95/1440*100%);
        h2{
            position: relative;
            z-index: 2;
        }
        .mv_img{
            margin-top: -64px;
            @media (max-width: 896px) {
                margin-top: -16px;
            }
        }
        .txt{
            margin-top: -64px;
            font-size: 24px;
            font-weight: 700;
            line-height: 2;
            letter-spacing: .04em;
            @media (max-width: 896px) {
                margin-top: 20px;
                font-size: 15px;
            }
        }
    }

    .comfortable{
        margin-top: 240px;
        @media (max-width: 896px) {
            margin-top: 80px;
        }

        .comfortable_content{
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            width: calc(1082/1440*100%);
            margin: auto;
            @media (max-width: 896px) {
                display: block;
                width: calc(337/393*100%);
            }
            .item{
                width: calc(486/1082*100%);
                @media (max-width: 896px) {
                    width: 100%;
                    + .item{
                        margin-top: 40px;
                    }
                }
                &:nth-child(2){
                    @media (min-width: 897px) {
                        margin-top: 180px;
                    }
                }
                &:nth-child(3){
                    @media (min-width: 897px) {
                        margin-top: -120px;
                        margin-left: 128px;
                    }
                }
                .copyarea{
                    @media (min-width: 897px) {
                        margin-top: -24px;
                        margin-left: 64px;
                        font-size: 30px;
                    }
                    @media (max-width: 896px) {
                        margin-top: -12px;
                        margin-left: 24px;
                        font-size: 25px;
                    }
                    .text-wrapper{
                        padding: 1px 8px;
                    }
                }
                .txt{
                    margin-top: 8px;
                    font-weight: 600;
                    line-height: 2;
                    @media (min-width: 897px) {
                        margin-left: 64px;
                        font-size: 20px;
                    }
                    @media (max-width: 896px) {
                        margin-left: 24px;
                        font-size: 15px;
                    }
                }
            }
        }
    }

    .job_description{
        margin-top: 240px;
        @media (max-width: 896px) {
            margin-top: 80px;
        }

        .job_description_content{
            margin-top: 64px;
            @media (max-width: 896px) {
                margin-top: 32px;
            }
            .item{
                position: relative;
                transition: filter .5s ease-out;
                @media (min-width: 897px) {
                    &.is-active{
                        filter: brightness(1);
                    }
                    &.is-non{
                        filter: brightness(.7);
                    }
                }
                &:not(&:first-child){
                    margin-top: -80px;
                    @media (max-width: 896px) {
                        margin-top: calc(-38/393*100vw);
                    }
                }
                .textarea{
                    position: absolute;
                    top: 0;
                    left: calc(96/1440*100%);
                    @media (max-width: 896px) {
                        top: calc(6/393*100vw);
                    }
                    .num{
                        font-size: 150px;
                        font-weight: 700;
                        letter-spacing: -.1em;
                        @media (max-width: 896px) {
                            font-size: 72px;
                            line-height: 1;
                        }
                    }
                    .copyarea{
                        font-size: 57px;
                        font-weight: 700;
                        @media (max-width: 896px) {
                            margin-top: 72px;
                            font-size: 25px;
                        }
                        .text-wrapper{
                            .copy{
                                position: relative;
                                padding: 2px 64px 2px 10px;
                                @media (max-width: 896px) {
                                    padding: 2px 46px 2px 8px;
                                }
                                &:before{
                                    content: "";
                                    position: absolute;
                                    top: 50%;
                                    right: 6px;
                                    translate: 0 -50%;
                                    width: 46px;
                                    height: 46px;
                                    border-radius: 50%;
                                    background: linear-gradient(90deg, #003F8C, #D71918);
                                    @media (max-width: 896px) {
                                        width: 32px;
                                        height: 32px;
                                    }
                                }
                                &:after{
                                    content: "";
                                    position: absolute;
                                    top: 50%;
                                    right: 24px;
                                    translate: 0 -50%;
                                    width: 8px;
                                    height: 14px;
                                    border-radius: 50%;
                                    background-image: url(../../img/common/icon_arrow_link.svg);
                                    background-size: cover;
                                    @media (max-width: 896px) {
                                        right: 18px;
                                        width: 6px;
                                        height: 12px;
                                    }
                                }
                            }
                        }
                    }
                    .txt{
                        margin-top: 16px;
                        font-size: 28px;
                        font-weight: 700;
                        line-height: 2;
                        letter-spacing: .04em;
                        @media (max-width: 896px) {
                            margin-top: 8px;
                            font-size: 13px;
                        }
                    }
                }
            }
        }
    }

    .benefits{
        margin-top: 190px;
        @media (max-width: 896px) {
            margin-top: 80px;
        }
        .benefits_content{
            display: flex;
            flex-wrap: wrap;
            gap: 115px;
            justify-content: center;
            max-width: 900px;
            margin: 64px auto 0;
            @media (max-width: 896px) {
                display: block;
                width: calc(337/393*100%);
                margin: 32px auto 0;
            }
            .item{
                position: relative;
                @media (min-width: 897px) {
                    width: calc(213/900*100%);
                }
                @media (max-width: 896px) {
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    + .item{
                        margin-top: 24px;
                    }
                }
                .icon{
                    @media (max-width: 896px) {
                        width: calc(80/337*100%);
                    }
                }
                .txt{
                    @media (min-width: 897px) {
                        position: absolute;
                        top: calc(100% + 16px);
                        left: 50%;
                        translate: -50% 0;
                        font-size: 24px;
                        font-weight: 700;
                        text-align: center;
                        white-space: nowrap;
                    }
                    @media (max-width: 896px) {
                        width: calc(246/337*100%);
                        font-size: 18px;
                    }
                    .note{
                        display: block;
                        font-size: 16px;
                        @media (max-width: 896px) {
                            font-size: 12px;
                        }
                    }
                }
            }
        }
    }


    .faq{
        margin-top: 240px;
        @media (max-width: 896px) {
            margin-top: 80px;
        }
        .faq_anchor{
            display: flex;
            flex-wrap: wrap;
            gap: 24px;
            width: calc(930/1440*100%);
            margin-top: 32px;
            margin-left: calc(414/1440*100%);
            @media (max-width: 896px) {
                justify-content: space-between;
                gap: 0;
                width: 92%;
                margin: 40px auto 0;
            }
            li{
                width: 42%;
                @media (max-width: 896px) {
                    width: 49%;
                }
            }
            a{
                position: relative;
                display: block;
                padding: 12px 64px 12px 24px;
                border: 1px solid #fff;
                border-radius: 60px;
                font-size: 18px;
                transition: .35s ease-out;
                @media (min-width: 897px) {
                    &:hover{
                        background-color: #fff;
                        .txt{
                            background: linear-gradient(90deg, #003F8C, #D71918);
                            -webkit-background-clip: text;
                            background-clip: text;
                            -webkit-text-fill-color: transparent;
                            color: transparent;
                        }
                    }
                }
                @media (max-width: 896px) {
                    padding: 10px 24px 10px 10px;
                    font-size: 14px;
                }
                &:before{
                    content: "";
                    position: absolute;
                    top: 50%;
                    right: 8px;
                    translate: 0 -50%;
                    width: 40px;
                    height: 40px;
                    border-radius: 50%;
                    background: linear-gradient(90deg, var(--primary-blue) , var(--accent-red));
                    @media (max-width: 896px) {
                        right: 6px;
                        width: 20px;
                        height: 20px;
                    }
                }
                &:after{
                    content: "";
                    position: absolute;
                    top: 50%;
                    right: 21px;
                    width: 12px;
                    height: 8px;
                    translate: 0 -45%;
                    background-image: url(../../img/common/icon_arrow_bottom.svg);
                    background-size: cover;
                    @media (max-width: 896px) {
                        right: 13px;
                        width: 6px;
                        height: 3px;
                    }
                }
            }
        }
        .heading{
            margin-left: calc(72/1440*100%);
            @media (max-width: 896px) {
                margin-left: 0;
                img{
                    max-width: inherit;
                    width: 104%;
                    margin-left: -2%;
                }
            }
            .jp_txt{
                display: block;
                width: fit-content;
                margin: -48px 0 0;
                font-size: 48px;
                @media (max-width: 896px) {
                    margin: -24px auto 0;
                    font-size: 26px;
                }
            }
        }

        .faq__content{
            width: calc(930/1440*100%);
            margin-top: 72px;
            margin-left: calc(414/1440*100%);
            @media (max-width: 896px) {
                width: calc(337/393*100%);
                margin: 40px auto 0;
            }
            .head{
                margin-bottom: 32px;
                font-size: 48px;
                font-weight: 700;
                @media (max-width: 896px) {
                    margin-bottom: 20px;
                    font-size: 20px;
                }
            }
            .item{
                border: 1px solid #fff;
                background-color: #fff;
                border-radius: 20px;
                + .item{
                    margin-top: 12px;
                }
            }
            .question{
                position: relative;
                padding: 24px 32px 24px 72px;
                font-size: 24px;
                @media (max-width: 896px) {
                    padding: 18px 32px 18px 40px;
                    font-size: 16px;
                }
                &:before{
                    content: 'Q';
                    position: absolute;
                    top: 50%;
                    left: 20px;
                    translate: 0 -50%;
                    font-size: 32px;
                    font-family: "Google Sans Flex", sans-serif;
                    font-optical-sizing: auto;
                    font-weight: 700;
                    font-style: normal;
                    background: linear-gradient(90deg, #003F8C, #D71918);
                    -webkit-background-clip: text;
                    background-clip: text;
                    -webkit-text-fill-color: transparent;
                    color: transparent;
                    @media (max-width: 896px) {
                        top: 18px;
                        left: 12px;
                        translate: 0 0;
                        font-size: 20px;
                        line-height: 1;
                    }
                }
                .highlight_txt{
                    display: block;
                    position: relative;
                    &:before,
                    &:after{
                        content: '';
                        position: absolute;
                        top: 50%;
                        right: 0;
                        translate: 0 -50%;
                        width: 18px;
                        height: 4px;
                        border-radius: 20px;
                        background: linear-gradient(90deg, #003F8C, #D71918);
                        @media (max-width: 896px) {
                            translate: 24px -50%;
                        }
                    }
                    &:after{
                        rotate: 90deg;
                    }
                }
            }
            .answer{
                display: none;
                position: relative;
                padding: 24px 32px 24px 72px;
                background-color: #D9D9D9;
                border-radius: 0 0 20px 20px;
                font-size: 24px;
                font-weight: 400;
                @media (max-width: 896px) {
                    padding: 20px 32px 20px 56px;
                    font-size: 16px;
                }
                &.is-open {
                    display: block;
                }
                &:before{
                    content: 'A';
                    position: absolute;
                    top: 0;
                    left: 20px;
                    translate: 0 18px;
                    font-size: 32px;
                    font-family: "Google Sans Flex", sans-serif;
                    font-optical-sizing: auto;
                    font-weight: 700;
                    font-style: normal;
                    background: linear-gradient(90deg, #003F8C, #D71918);
                    -webkit-background-clip: text;
                    background-clip: text;
                    -webkit-text-fill-color: transparent;
                    color: transparent;
                    @media (max-width: 896px) {
                        font-size: 28px;
                    }
                }
            }
        }
    }

    .closeBtn{
        position: fixed;
        top: 20px;
        right: 20px;
        z-index: 100002;
        translate: calc(102% + 20px) 0;
        width: 50px;
        height: 50px;
        &.is-active{
            translate: 0 0;
        }
        &:before,
        &:after{
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            translate: -50% -50%;
            width: 100%;
            height: 2px;
            background-color: #fff;
        }
        &:before{
            rotate: 45deg;
        }
        &:after{
            rotate: -45deg;
        }
    }

    .overlay{
        position: fixed;
        top: 0;
        left: 0;
        opacity: 0;
        z-index: -1;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, .7);
        transition: .42s ease-out;
        &.is-active{
            opacity: 1;
            z-index: 100000;
        }
    }

    .recruit_popup{
        overflow-y: scroll;
        -ms-overflow-style: none;
        scrollbar-width: none;
        position: fixed;
        top: 0;
        right: 0;
        translate: 105% 0;
        z-index: 100001;
        max-width: 836px;
        width: calc(836/1440*100%);
        height: 100dvh;
        transition: .45s ease-out;
        @media (max-width: 896px) {
            width: calc(365/393*100%);
        }
        &.is-active{
            translate: 0 0;
            transition: .45s ease-out .42s;
        }
        .inner{
            .popup_head{
                padding: 0 104px 24px;
                border-bottom: 1px solid #fff;
                font-size: 24px;
                @media (max-width: 896px) {
                    padding: 0 24px 16px;
                    font-size: 16px;
                }
            }

            .highlight_txt{
                background: linear-gradient(90deg, #003F8C, #D71918);
                -webkit-background-clip: text;
                background-clip: text;
                -webkit-text-fill-color: transparent;
                color: transparent;
                font-weight: 700;
            }
        }

        .color_bg{
            padding: 75px 0;
            background-image: linear-gradient(90deg, rgba(42, 161, 198, 1) 19%, rgba(204, 201, 31, 1) 90%);
            @media (max-width: 896px) {
                padding: 56px 0;
            }
        }
        .opacity_bg{
            padding: 75px 0;
            background-color: rgba(189, 189, 189, 0.95);
            @media (max-width: 896px) {
                padding: 56px 0;
            }
        }

        .recruit_popup-mv{
            padding-top: 102px;
            @media (max-width: 896px) {
                padding-top: 60px;
            }
            .bg-filler{
                transform: scaleX(1);
            }
            .mv_img{
                margin-top: 32px;
            }
            .textarea{
                padding: 0 104px;
                margin-top: -80px;
                @media (max-width: 896px) {
                    padding: 0 24px;
                    margin-top: -36px;
                }
            }
            .text-content{
                padding: 2px 8px;
                clip-path: inset(0% 0px 0px);
                font-size: 40px;
                @media (max-width: 896px) {
                    font-size: 22px;
                }
            }
            .txt{
                margin-top: 24px;
                font-size: 18px;
                line-height: 2;
                @media (max-width: 896px) {
                    margin-top: 16px;
                    font-size: 15px;
                }
            }
            .recruit_slide{
                width: 100%;
                height: 258px;
                margin-top: 48px;
                background-position: 0 0;
                background-size: auto 100%;
                background-repeat: repeat-x;
                animation: bgSlide 420s linear;
                @media (max-width: 896px) {
                    height: 168px;
                    margin-top: 32px;
                }
                &.slide01{
                    background-image: url(../../img/recruit/recruit_pop_slide01.webp);
                }
                &.slide02{
                    background-image: url(../../img/recruit/recruit_pop_slide02.webp);
                }
                &.slide03{
                    background-image: url(../../img/recruit/recruit_pop_slide03.webp);
                }
            }
        }

        .recruit_work{
            .textarea{
                padding: 20px 104px;
                @media (max-width: 896px) {
                    padding: 16px 24px;
                }
            }
            .bg-filler{
                transform: scaleX(1);
            }
            .text-content{
                clip-path: inset(0% 0px 0px);
                padding: 2px 6px;
                font-size: 30px;
                @media (max-width: 896px) {
                    font-size: 17px;
                }
            }
            .txt{
                margin-top: 24px;
                font-size: 18px;
                line-height: 2;
                @media (max-width: 896px) {
                    margin-top: 16px;
                    font-size: 15px;
                }
            }
        }

        .recruit_person{
            .recruit_person-img{
                margin-top: 32px;
            }
            .recruit_person-content{
                padding: 0 104px;
                margin-top: 24px;
                @media (max-width: 896px) {
                    padding: 16px 24px;
                }
            }
            .bg-filler{
                transform: scaleX(1);
            }
            .head-area{
                display: flex;
                align-items: center;
                .num{
                    margin-right: 18px;
                    font-size: 80px;
                    letter-spacing: -0.075em;
                    line-height: 1.2;
                    @media (max-width: 896px) {
                        font-size: 32px;
                    }
                }
            }
            .text-content{
                padding: 2px 8px;
                clip-path: inset(0% 0px 0px);
                font-size: 30px;
                @media (max-width: 896px) {
                    font-size: 17px;
                }
            }
            .txt{
                font-size: 18px;
                line-height: 2;
                @media (max-width: 896px) {
                    font-size: 15px;
                }
            }
        }

        .recruit_voice{
            padding-bottom: 0;
            .img{
                margin-top: 24px;
            }
            .recruit_voice-textarea{
                padding: 20px 104px;
                margin-top: -80px;
                @media (max-width: 896px) {
                    padding: 16px 24px;
                    margin-top: -40px;
                }
            }
            .bg-filler{
                transform: scaleX(1);
            }
            .head-area{
                display: flex;
                align-items: center;
                .num{
                    margin-right: 12px;
                    font-size: 80px;
                    letter-spacing: -0.075em;
                }
            }
            .personal-info{
                margin-top: 16px;
                @media (max-width: 896px) {
                    text-align: right;
                }
                .name{
                    font-size: 22px;
                    @media (max-width: 896px) {
                        font-size: 14px;
                    }
                }
                .post{
                    margin-top: 8px;
                    font-size: 16px;
                    @media (max-width: 896px) {
                        font-size: 12px;
                    }
                }
            }
            .text-content{
                padding: 2px 6px;
                clip-path: inset(0% 0px 0px);
                font-size: 30px;
                @media (max-width: 896px) {
                    font-size: 17px;
                }
            }
            .txt{
                margin-top: 24px;
                font-size: 18px;
                line-height: 2;
                letter-spacing: .04em;
                @media (max-width: 896px) {
                    font-size: 15px;
                }
            }
        }

        .recruit_schedule{
            .recruit_schedule-content{
                padding: 0 104px;
                margin-top: 36px;
                @media (max-width: 896px) {
                    padding: 16px 24px;
                    margin-top: 24px;
                }
                .item{
                    position: relative;
                    display: flex;
                    align-items: start;
                    padding-bottom: 48px;
                    &:last-child{
                        padding-bottom: 0;
                        &:before{
                            display: none;
                        }
                    }
                    &:before{
                        content: '';
                        position: absolute;
                        top: 40px;
                        left: 14px;
                        width: 1px;
                        height: calc(100% - 48px);
                        background-color: #fff;
                    }
                }
                .data{
                    position: relative;
                    padding: 6px 16px 6px 24px;
                    border: 1px solid #fff;
                    border-radius: 48px;
                    font-size: 18px;
                    line-height: 1;
                    @media (max-width: 896px) {
                        font-size: 12px;
                    }
                    &:before{
                        content: "";
                        position: absolute;
                        top: 50%;
                        left: 8px;
                        translate: 0 -50%;
                        width: 12px;
                        height: 12px;
                        border-radius: 50%;
                        background: linear-gradient(135deg, var(--primary-blue) , var(--accent-red), var(--primary-blue) , var(--accent-red));
                    }
                }
                .textarea{
                    margin-left: 16px;
                    .subhead{
                        font-size: 22px;
                        @media (max-width: 896px) {
                            font-size: 15px;
                        }
                    }
                    .list{
                        margin-top: 16px;
                        li{
                            position: relative;
                            padding-left: 12px;
                            font-size: 18px;
                            @media (max-width: 896px) {
                                font-size: 12px;
                            }
                            + li{
                                margin-top: 8px;
                            }
                            &:before{
                                content: "";
                                position: absolute;
                                top: 50%;
                                left: 0;
                                translate: 0 -50%;
                                width: 8px;
                                height: 8px;
                                border-radius: 50%;
                                background: linear-gradient(135deg, var(--primary-blue) , var(--accent-red));
                                @media (max-width: 896px) {
                                    top: 5px;
                                    translate: 0 0;
                                }
                            }
                        }
                    }
                }
            }
        }

        .recruit_oubo{
            .recruit_oubo-anchor{
                display: flex;
                justify-content: center;
                gap: 0 24px;
                margin: 48px 0 72px;
                @media (max-width: 896px) {
                    flex-direction: column;
                    align-items: center;
                    gap: 10px 0;
                    margin: 32px 0 36px;
                }
                li{
                    width: 42%;
                    @media (max-width: 896px) {
                        width: 80%;
                    }
                }
                a{
                    position: relative;
                    display: block;
                    padding: 12px 64px 12px 24px;
                    border: 1px solid #fff;
                    border-radius: 60px;
                    font-size: 18px;
                    transition: .35s ease-out;
                    @media (min-width: 897px) {
                        &:hover{
                            background-color: #fff;
                            .txt{
                                background: linear-gradient(90deg, #003F8C, #D71918);
                                -webkit-background-clip: text;
                                background-clip: text;
                                -webkit-text-fill-color: transparent;
                                color: transparent;
                            }
                        }
                    }
                    @media (max-width: 896px) {
                        width: fit-content;
                        padding: 10px 64px 10px 16px;
                        font-size: 14px;
                    }
                    &:before{
                        content: "";
                        position: absolute;
                        top: 50%;
                        right: 8px;
                        translate: 0 -50%;
                        width: 40px;
                        height: 40px;
                        border-radius: 50%;
                        background: linear-gradient(90deg, var(--primary-blue) , var(--accent-red));
                        @media (max-width: 896px) {
                            width: 32px;
                            height: 32px;
                        }
                    }
                    &:after{
                        content: "";
                        position: absolute;
                        top: 50%;
                        right: 21px;
                        width: 12px;
                        height: 8px;
                        translate: 0 -45%;
                        background-image: url(../../img/common/icon_arrow_bottom.svg);
                        background-size: cover;
                        @media (max-width: 896px) {
                            right: 18px;
                            width: 10px;
                            height: 6px;
                        }
                    }
                }
            }

            .recruit_oubo-content{
                width: calc(671/836*100%);
                margin: 0 auto;
                @media (max-width: 896px) {
                    width: calc(309/365*100%);
                }
                + .recruit_oubo-content{
                    padding-top: 80px;
                    margin-top: 80px;
                    border-top: 1px solid #fff;
                    @media (max-width: 896px) {
                        padding-top: 40px;
                        margin-top: 40px;
                    }
                }
                .bg-filler{
                    transform: scaleX(1);
                }
                .text-content{
                    padding: 2px 6px;
                    clip-path: inset(0% 0px 0px);
                    font-size: 40px;
                    @media (max-width: 896px) {
                        font-size: 17px;
                    }
                }
                table{
                    margin-top: 48px;
                    border-spacing: 0;
                    @media (max-width: 896px) {
                        margin-top: 24px;
                    }
                    th,td{
                        border-spacing: 0;
                        font-size: 18px;
                        line-height: 1.8;
                        text-align: left;
                        vertical-align: text-top;
                        @media (max-width: 896px) {
                            display: block;
                            font-size: 14px;
                        }
                    }
                    th{
                        white-space: nowrap;
                        @media (min-width: 897px) {
                            padding-right: 48px;
                            border-right: 1px solid #fff;
                        }
                    }
                    td{
                        @media (min-width: 897px) {
                            padding-left: 40px;
                            padding-bottom: 42px;
                        }
                        @media (max-width: 896px) {
                            padding-top: 4px;
                            padding-bottom: 24px;
                        }
                        &.pb0{
                            padding-bottom: 0;
                        }
                        .fz16{
                            margin-top: 8px;
                            font-size: 16px;
                            line-height: 1.8;
                            letter-spacing: .04em;
                            @media (max-width: 896px) {
                                margin-top: 2px;
                                font-size: 14px;
                                line-height: 1.6;
                                + .fz16{
                                    margin-top: 8px;
                                }
                            }
                        }
                        .fz14{
                            display: block;
                            font-size: 14px;
                            @media (max-width: 896px) {
                                font-size: 12px;
                            }
                        }
                        .mt-space{
                            margin-top: 8px;
                        }
                    }
                    ul{
                        li{
                            position: relative;
                            padding-left: 16px;
                            + li{
                                margin-top: 8px;
                            }
                            &:before{
                                content: "";
                                position: absolute;
                                top: 10px;
                                left: 0;
                                width: 8px;
                                height: 8px;
                                border-radius: 50%;
                                background: linear-gradient(135deg, #003F8C, #D71918);
                                @media (max-width: 896px) {
                                    top: 9px;
                                    translate: 0 0;
                                    width: 4px;
                                    height: 4px;
                                }
                            }
                        }
                    }
                }

                .btn-contact {
                    position: relative;
                    display: block;
                    width: 284px;
                    padding: 24px 28px;
                    margin: 40px auto 0;
                    border-radius: 50px;
                    background: linear-gradient(90deg, #003F8C 0%, #D71918 100%);
                    text-decoration: none;
                    font-size: 18px;
                    font-weight: bold;
                    color: #fff;
                    transition: .25s ease;
                    @media (max-width: 896px) {
                        width: 254px;
                        padding: 18px 24px;
                    }
                    &:before{
                        content: "";
                        position: absolute;
                        top: 50%;
                        right: 10px;
                        transform: translate(0,-50%);
                        width: 50px;
                        height: 50px;
                        border-radius: 50%;
                        background-color: #fff;
                        background-image: url(../../img/common/icon_arrow_link_grad.svg);
                        background-size: 8px;
                        background-position: 55% center;
                        background-repeat: no-repeat;
                    }
                    &:after{
                        content: "";
                        position: absolute;
                        top: 50%;
                        right: 10px;
                        z-index: 2;
                        transform: translate(-5px,-50%);
                        opacity: 0;
                        width: 50px;
                        height: 50px;
                        border-radius: 50%;
                        background-image: url(../../img/common/icon_arrow_link.svg);
                        background-size: 8px;
                        background-position: 55% center;
                        background-repeat: no-repeat;
                        transition: .5s ease;
                    }
                    &:hover{
                        background: #fff;
                        &:before{
                        background: linear-gradient(90deg, #003F8C 0%, #D71918 100%);
                        transition: .5s ease;
                        }
                        &:after{
                        opacity: 1;
                        transform: translate(0,-50%);
                        }
                        .link{
                        background: linear-gradient(90deg, #003F8C, #D71918);
                        -webkit-background-clip: text;
                        background-clip: text;
                        -webkit-text-fill-color: transparent;
                        color: transparent;
                        }
                    }
                }
            }
        }
    }
}