/*-------------------------------------------------------*/
/* 蜈ｱ騾� */
/*-------------------------------------------------------*/

body {
    font-family: 'Noto Sans JP', sans-serif;
}

.l-main {
    overflow: hidden;
}

.en {
    font-family: "Figtree", sans-serif;
    font-weight: 700;
    letter-spacing: 0.06em;
}

h2, h3 {
    color: #0D2742;
    font-weight: 700;
    text-align: center;
}

.ttl-lv2 {
    color: #0D2742;
    font-size: 250%;
    letter-spacing: 0.04em;
    margin-top: 20px;
    margin-bottom: 40px;

    .en {
        display: block;
        color: #0D2742;
        background-color: #FFFF00;
        padding: 4px 11px;
        font-size: 50%;
        width: fit-content;
        margin-inline: auto;
    }

    em {
        color: #005CBC;
        font-size: 120%;
        border-bottom: 5px dotted rgba(13, 39, 66, 0.2);
    }

    strong {
        color: #005CBC;
    }

    @media only screen and
    (max-width : 757px) {
        font-size: 162.5%;
        margin-bottom: 24px;

        .en {
            padding: 4px 11px;
            font-size: 42.30%;
        }

        em {
            font-size: 107.69%;
        }
    }
}

.line-maker {
    background: linear-gradient(transparent 90%, #FFFF00 90%);
}

p.txt-intro {
    color: #0D2742;
    font-size: 106.25%;
    font-weight: 700;
    line-height: 1.8;
    text-align: center;
}

p.txt-intro,
p.indent {
    margin-top: 0;
}

.indent > li {
    margin-left: 1em;
    text-indent: -1em;
}

.indent_num > li {
    font-size: 87.5%;
    margin-left: 1.8em;
    text-indent: -1.8em;

    @media only screen and
    (max-width : 757px) {
        font-size: 68.75%;
    }

}

._shadow {
    img {
        filter: drop-shadow(0px 8px 20px rgba(22, 59, 77, 0.2));
    }
}

.blueBox {
    width: 100%;
    max-width: 1280px;
    padding: 54px;
    background: #0091FA url('/service/maintenance/itconcierge/adlp/img/bg_blueBox.jpg') no-repeat center;
    background-size: cover;
    border-radius: 8px;

    &.free {
        padding: 40px;
        margin-bottom: 24px;

        dl {
            max-width: 896px;
            margin-inline: auto;

            dt {
                color: #FFFF00;
                text-align: center;
                font-size: 300%;
                font-weight: 700;
                letter-spacing: 0.04em;
                display: flex;
                justify-content: center;
                align-items: center;
                gap: 20px;
                margin-bottom: 24px;

                @media only screen and
                (max-width: 1079px) {
                    flex-direction: column;
                    gap: 6px;
                    margin-bottom: 15px;
                }

                span {
                    font-size: 39.58%;
                    border: 3px solid #FFFF00;
                    padding: 7px 11px;
                    margin-top: 4px;
                }
            }

            dd {
                color: #fff;
                font-size: 87.5%;
            }
        }
    }

    @media only screen and
    (max-width : 757px) {
        padding: 24px;
        background: #0091FA url('/service/maintenance/itconcierge/adlp/img/bg_blueBox_sp.jpg') no-repeat center;
        background-size: cover;

        &.free {
            padding: 24px;

            dl {

                dt {
                    font-size: 187.5%;

                    span {
                        font-size: 43.33%;
                        padding: 4px 8px;
                        margin-top: 0;
                    }
                }

                dd {
                    color: #fff;
                    font-size: 68.75%;
                }
            }
        }
    }

    p {
        margin-top: 0;
    }
}

.phoneArea {
    margin-inline: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    .phone-ttl {
        color: #0D2742;
        font-size: 87.5%;
        font-weight: 700;
        background-color: #E8E8E8;
        padding: 5px 12px;
    }

    .phone-no {
        a {
            color: #0D2742;
            font-size: 162.5%;
            pointer-events: none;
            cursor: default;
            text-decoration: none;
            
            @media only screen and
            (max-width : 757px) {
                pointer-events: initial;
                cursor: initial;
            }
        }

        &:before {
            content: "";
            background: url('/service/maintenance/itconcierge/adlp/img/ic_dial.svg') no-repeat center;
            width: 22px;
            height: 22px;
            background-size: contain;
            display: inline-block;
            margin-right: 6px;
        }
    }

    .phone-hr {
        font-size: 81.25%;
    }
}

.flex_box {
    display: flex;

    &._col {
        flex-direction: column;
    }

    &._rev {
        flex-direction: row-reverse;
    }

    @media only screen and
    (max-width : 757px) {
        &.sp_col {
            flex-direction: column;
        }

        &.sp_rev {
            flex-direction: column-reverse;
        }
    }
}

.grid_box {
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px 28px
}
.grid_box.col3 {
    grid-template-columns: 1fr 1fr 1fr;
}

.pcOnly {
    display: block;
}

.spOnly {
    display: none;
}

@media only screen and
(max-width : 757px) {
    .pcOnly {
        display: none;
    }

    .spOnly {
        display: block;
    }
}

/*-------------------------------------------------------*/
/* cms-inner */
/*-------------------------------------------------------*/
.l-sec__inner {
    padding: 60px 0;

    @media only screen and
    (max-width : 757px) {
        padding: 30px 0;
    }
}

.l-sec--blue {
    background-color: #E5F5FF;
}

.l-sec:has(.l-sec__cms-inner),
.l-sec--blue:has(.l-sec__cms-inner) {
    padding: 0;
}

.l-sec__inner:has(.l-sec__cms-inner) {
    padding: 0;
    max-width: revert;
}

/*-------------------------------------------------------*/
/* button */
/*-------------------------------------------------------*/
.btnStyle {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    text-decoration: none!important;
    appearance: none;
    cursor: pointer;
    text-align: center;
    font-size: 112.5%;
    font-weight: 700;
    line-height: 1.4;
    padding: 14px 36px 15px 36px;
    background: #fff url(/service/maintenance/itconcierge/adlp/img/ic_arrow_right.svg) no-repeat center right 15px;
    background-size: 9px 15px;
    color: #0091FA!important;
    border: none;
    width: 100%;
    max-width: 408px;
    height: 69px;
    border-radius: 80px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    margin-inline: auto;

    @media only screen and
    (max-width : 757px) {
        max-width: 265px;
        height: 60px;
    }

    &._border {
        border: 2px solid #0091FA;
    }

    &._orange {
        background-color: #FF7700!important;
    }

    &:hover {
        opacity: .7;
        transition: .5s;
    }
}

/*-------------------------------------------------------*/
/* fvWrap */
/*-------------------------------------------------------*/
.fvWrap {
    background: url('/service/maintenance/itconcierge/adlp/img/fv-background.jpg') no-repeat center;
    background-size: cover;

    @media only screen and
    (max-width : 757px) {
        background: none;
    }
}

.fvArea {
    .inner {
        max-width: 1280px;
        margin: 0 auto;
        padding: 0 30px;
        box-sizing: content-box;
    }

    &.__wrap {
        position: relative;
        z-index: 1;

        .img-fv {
            position: absolute;
            bottom: 0;
            right: -26px;
            margin-top: 0;
            z-index: -1;
            max-width: 58.43%;
        }
    }

    .fvData {
        max-width: 715px;
        padding-top: 40px;
        padding-bottom: 40px;

        h2 {
            max-width: 43.98vw;
            text-align: left;
            padding-left: 36px;
        }

        .btnArea {
            margin-top: 45px;
            margin-bottom: 20px;
            gap: 14px;
        }
    }

    .btnStyle {
        padding: 14px 36px 15px 60px;
        background: #0091FA url('/service/maintenance/itconcierge/adlp/img/ic_arrow_right_white.svg') no-repeat center right 15px;
        color: #fff!important;
        max-width: 255px;
        height: 77px;
        font-size: 1.06rem;

        &::after {
            content: "";
            position: absolute;
            left: 5px;
            top: 0;
            width: 51px;
            height: 67px;
            background: url('/service/maintenance/itconcierge/adlp/img/ic_btn-pamph.png') no-repeat center;
            background-size: contain;
            filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.2));
        }
    }

    .btn-cStudy a::after {
        background: url('/service/maintenance/itconcierge/adlp/img/ic_btn-cStudy.png') no-repeat center;
        background-size: contain;
    }

    .btn-contact a::after {
        top: 0;
        bottom: 0;
        margin: auto 0;
        left: 26px;
        width: 35px;
        height: 24px;
        background: url('/service/maintenance/itconcierge/adlp/img/ic_btn-contact.png') no-repeat center;
        background-size: contain;
        filter: none;
    }

    .phoneArea .phone-no {
        font-size: 1.62rem;
    }

    .phoneArea .phone-no:before {
        vertical-align: baseline;
    }

    /* tb view
    ------------------------------------------*/
    @media (max-width: 1079px) and (min-width: 758px) {

        &.__wrap {
            .img-fv {
                display: none;
            }
        }

        .fvData {
            margin: auto;

            h2 {
                max-width: 100%;
                text-align: center;
                padding-left: 0;
            }
        }
    }

    @media only screen and
    (max-width : 757px) {
        .inner {
            padding: 0;
        }

        &.__wrap {
            background: url('/service/maintenance/itconcierge/adlp/img/fv-background_sp.jpg') no-repeat center;
            background-size: cover;

            .img-fv {
                position: static;
                max-width: 100%;
                img {
                    margin-inline: auto;
                }
            }
        }

        .fvData {
            padding-top: 30px;
            padding-bottom: 0;

            h2 {
                text-align: center;
                padding: 0 15px;
                max-width: 100%;
            }

            .btnArea,
            .phoneArea {
                display: none;
            }
        }

        .btnArea {
            background-color: #D6EDFF;
            padding: 15px;
            display: flex;
            flex-wrap: wrap;
            gap: 7px 11px;

            .btn-pamph,
            .btn-cStudy {
                width: calc(( 100% - 11px) / 2);

                a::after {
                    top: 0;
                    bottom: 0;
                    margin: auto 0;
                    background-size: 46px auto;
                }
            }

            .btn-contact {
                width: 100%;

                a {
                    height: 64px;
                    padding-right: 58px;

                    &::after {
                        left: 15px;
                        background-size: 31px auto;
                    }
                }
            }

            .btn-phone {
                width: 100%;

                a {
                    height: 64px;
                    color: #0D2742!important;
                    background: #fff;
                    border: 1px solid #0D2742;
                    flex-direction: column;

                    &:after {
                        content: "";
                        position: absolute;
                        left: 15px;
                        top: 0;
                        bottom: 0;
                        margin: auto 0;
                        width: 28px;
                        height: 28px;
                        background: url('/service/maintenance/itconcierge/adlp/img/ic_dial.svg') no-repeat center;
                        background-size: contain;
                    }

                    .en {
                        font-size: 150%;
                        font-weight: 700;
                    }

                    .phone-hr {
                        font-size: 78.57%;
                        font-weight: 500;
                    }
                }
            }

            .btnStyle {
                border-radius: 8px;
                max-width: 100%;
                padding: 8px 20px 10px 58px;
                background-position: center right 6px;
                font-size: 87.5%;
            }

        }
    }
}

/*-------------------------------------------------------*/
/* about */
/*-------------------------------------------------------*/
#about {

    .ttl-about {
        color: #0091FA;
        font-size: 193.75%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 10px;
        margin-top: 20px;
        margin-bottom: 30px;

        .en {
            display: inline-block;
            color: #0D2742;
            background-color: #FFFF00;
            padding: 4px 11px;
            font-size: 64.51%;
        }

        em {
            color: #0D2742;
            font-size: 167.74%;
            letter-spacing: 0.04em;
            line-height: 1.25;
            padding: 0 40px;
            position: relative;
            text-align: center;

            &::before,
            &::after {
                content: "";
                position: absolute;
                width: 14px;
                height: 100%;
                border-style: solid;
                border-color: #0D2742;
            }
            &::before {
                border-width: 3px 0 3px 3px;
                left: 0;
            }
            &::after {
                border-width: 3px 3px 3px 0;
                right: 0;
            }
        }

        @media only screen and
        (max-width : 757px) {
            font-size: 93.75%;
            gap: 6px;
            margin-top: 0;

            .en {
                font-size: 73.33%;
            }

            em {
                font-size: 213.33%;
                padding: 0 25px;
                line-height: 1;

                &::before,
                &::after {
                    width: 7px;
                }
            }
        }
    }

    .txt-intro {
        position: relative;

        &::after {
            content: "";
            position: absolute;
            right: 0;
            bottom: 0;
            width: 266px;
            height: 181px;
            background: url('/service/maintenance/itconcierge/adlp/img/ic_about1.png') no-repeat center;
            background-size: contain;
        }

        @media only screen and
        (max-width: 1079px) {
            max-width: 100%;
            display: flex;
            justify-content: center;
            text-align: left;
            gap: 10px;

            &::after {
                position: static;
            }
        }

        @media only screen and
        (max-width : 757px) {
            &::after {
                width: 132px;
                height: 105px;
                background: url('/service/maintenance/itconcierge/adlp/img/ic_about1_sp.png') no-repeat center;
                background-size: contain;
                flex-shrink: 0;
            }
        }
    }

    .flex_box {
        align-items: center;
        justify-content: space-between;
        gap: 3.36%;
        margin-top: 60px;
        margin-bottom: 60px;

        @media only screen and
        (max-width: 1079px) {
            flex-direction: column;
            gap: 27px;
        }

        @media only screen and
        (max-width : 757px) {
            margin-top: 25px;
            margin-bottom: 32px;
        }

        .point-list {
            max-width: 474px;
            width: 100%;

            .point-item {
                display: table;
                position: relative;
                width: 100%;

                &:not(:last-of-type) {
                    border-bottom: 2px solid #D6D6D6;
                    padding-bottom: 15px;
                    margin-bottom: 15px;
                }

                .point-item__number {
                    color: #fff;
                    background: #0091FA;
                    border-radius: 8px;
                    display: table-cell;
                    font-size: 87.5%;
                    font-weight: 700;
                    text-align: center;
                    padding: 39px 17px;
                    white-space: nowrap;
                    vertical-align: middle;
                    width: 84px;
                    margin-top: 0;

                    span {
                        display: block;
                        font-size: 171.42%;
                        line-height: 1;
                    }

                    @media only screen and
                    (max-width : 757px) {
                        font-size: 50%;
                        padding: 17px;
                        width: 75px;
                        height: 75px;

                        span {
                            font-size: 175%;
                        }
                    }
                }

                .point-item__detail {
                    display: table-cell;
                    vertical-align: middle;
                    text-align: left;
                    width: calc(100% - 84px);
                    padding: 20px 15px;

                   @media only screen and
                    (max-width : 757px) {
                        padding: 15px 24px;
                    }

                    .point-item__desc {
                        display: flex;
                        align-items: center;
                        font-weight: 700;
                        text-align: center;

                        dt {
                            width: 90px;
                        }

                        dd {
                            flex-grow: 1;

                            small {
                                display: block;
                                color: #0D2742;
                                font-size: 125%;
                            }

                            .line-maker {
                                color: #005CBC;
                                font-size: 193.75%;
                            }
                        }

                        @media only screen and
                        (max-width : 757px) {
                            dt {
                                width: 44px;
                            }

                            dd {
                                small {
                                    font-size: 75%;
                                }

                                .line-maker {
                                    font-size: 112.5%;
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

/*-------------------------------------------------------*/
/* problems */
/*-------------------------------------------------------*/
#problems {

    .case {
        margin: 100px calc(50% - 50vw) 129px;
        padding: 0 calc(50vw - 50%);
        box-sizing: border-box;

        .case-inner {
            position: relative;
            padding: 52px 0 84px;
        }

        .ttl-case {
            color: #ABDFFF;
            font-size: 400%;
            font-weight: 500;
            line-height: 1;
            position: absolute;
            top: -54px;
        }

        .flex_box {
            justify-content: space-between;
            gap: 40px;

            &._col {
                gap: 28px;
                max-width: 596px;
            }

            .problem {
                width: 100%;
                display: flex;
                gap: 28px;
                align-items: flex-start;
                justify-content: space-between;

                dt {
                    flex-shrink: 0;
                }

                dd {
                    color: #fff;
                    font-size: 106.25%;
                    font-weight: 700;
                    background-color: #1F9CFF;
                    border-radius: 8px;
                    padding: 12px 33px;
                    position: relative;
                    width: 100%;

                    &::after {
                        content: "";
                        position: absolute;
                        top: 30px;
                        left: 0;
                        border-style: solid;
                        border-width: 0 18px 18px 0;
                        border-color: transparent #1f9cff transparent transparent;
                        translate: -100% calc(-50% - 0.4px);
                    }
                }
            }

            .solution {
                max-width: 762px;
                width: 100%;
                margin-top: 18px;
                position: relative;

                dt {
                    position: absolute;
                    top: -23px;
                    left: 0;
                }

                dd {
                    color: #0D2742;
                    font-size: 125%;
                    font-weight: 700;
                    letter-spacing: 0.04em;
                    line-height: 1.9;
                    background-color: #fff;
                    border-radius: 8px;
                    padding: 32px 27px 25px 30px;

                    span {
                        color: #FF7700;
                    }
                }
            }
        }

        dl.image {
            width: 100%;
            max-width: 1280px;
            padding: 44px 44px 61px;
            background: url('/service/maintenance/itconcierge/adlp/img/bg_case1.png') no-repeat center bottom;
            background-size: cover;
            border-radius: 8px;
            text-align: center;
            margin-top: 30px;

            dt {
                color: #0D2742;
                font-size: 175%;
                font-weight: 700;
                letter-spacing: 0.04em;
                margin-bottom: 23px;
            }

            dd > img {
                margin: auto;
            }
        }

        figure {
            margin-top: -113px;
        }

        @media only screen and
        (max-width : 757px) {
            margin-top: 65px;
            margin-bottom: 90px;

            .case-inner {
                position: relative;
                padding: 36px 0;
            }

            .ttl-case {
                font-size: 331.25%;
                top: -45px;
                right: 0;
                left: 0;
                margin: 0 auto;
            }

            .flex_box {
                gap: 32px;

                &._col {
                    gap: 20px;
                }

                .problem {
                    gap: 16px;

                    dt {
                        max-width: 64px;
                    }

                    dd {
                        font-size: 87.5%;
                        padding: 20px;

                        &::after {
                            content: "";
                            position: absolute;
                            border-width: 0 13px 13px 0;
                        }
                    }
                }

               .solution {
                    dd {
                        font-size: 100%;
                        line-height: 1.6;
                        padding: 30px 24px;
                    }
                }
            }

            dl.image {
                padding: 30px 24px 40px;
                background: url('/service/maintenance/itconcierge/adlp/img/bg_case1_sp.png') no-repeat center bottom;
                background-size: cover;
                text-align: center;
                margin-top: 20px;

                dt {
                    font-size: 112.5%;
                }
            }

            figure {
                margin-top: 0;
            }
        }
    }

    #case01 {
        position: relative;
        padding-bottom: 0;

        &::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: calc( 100% - 260px);
            background-color: #E5F5FF;

            @media only screen and
            (max-width : 757px) {
                height: calc( 100% - 207px);
            }
        }

        .case-inner {
            padding-bottom: 0;

            > .flex_box {
                gap: 20px;
            }

            .problem {
                max-width: 478px;

                dd {
                    font-size: 118.75%;
                    padding: 49px 33px;

                    @media only screen and
                    (max-width : 757px) {
                        font-size: 87.5%;
                        padding: 20px;
                    }
                }
            }
        }
    }

    #case02 {
        background-color: #E6F5E6;
        position: relative;
        margin-right: calc(50% - 50vw);
        padding-right: calc(50vw - 50%);
        margin-left: 218px;
        padding-left: 0;
        border-radius: 0 0 0 60px;

        .case-inner {
            margin-left: -218px;

            .ttl-case {
                color: #BBF2BB;
                right: 0;
            }

           .problem {
                dt img {
                    margin-top: -10px;
                }

                dd {
                    background-color: #44C243;

                    &::after {
                        border-color: transparent #44C243 transparent transparent;
                    }
                }
            }
        }
    }

    #case03 {
        background-color: #FFEEDE;
        position: relative;
        margin-right: calc(50% - 50vw);
        padding-right: calc(50vw - 50%);
        margin-right: 218px;
        padding-right: 0;
        border-radius: 0 0 60px 0;

        .case-inner {
            margin-right: -218px;

            .ttl-case {
                color: #F8CFA9;
            }

            .problem {
                dt img {
                    margin-top: -10px;
                }

                dd {
                    background-color: #FF8A22;

                    &::after {
                        border-color: transparent #FF8A22 transparent transparent;
                    }
                }
            }
        }
    }

    #case04 {
        background-color: #FFEFEF;
        position: relative;
        margin-right: calc(50% - 50vw);
        padding-right: calc(50vw - 50%);
        margin-left: 218px;
        padding-left: 0;
        border-radius: 0 0 0 60px;
        margin-bottom: 80px;

        .case-inner {
            margin-left: -218px;

            .ttl-case {
                color: #FFC6C6;
                right: 0;
            }

           .problem {
                dt img {
                    margin-top: -10px;
                }

                dd {
                    background-color: #F65555;

                    &::after {
                        border-color: transparent #F65555 transparent transparent;
                    }
                }
            }
        }
    }

    @media only screen and
    (max-width : 757px) {
        #case02, #case04 {
            margin-left: calc(50% - 50vw);
            padding-left: calc(50vw - 50%);
            border-radius: 0;

            &::before {
                content: '';
                position: absolute;
                bottom: 0;
                left: 0;
                width: 100%;
                height: 102px;
                background-color: #fff;
            }

            .case-inner {
                margin-left: 0;
                padding-bottom: 0;
            }
        }

        #case03 {
            margin-right: calc(50% - 50vw);
            padding-right: calc(50vw - 50%);
            border-radius: 0;

            &::before {
                content: '';
                position: absolute;
                bottom: 0;
                left: 0;
                width: 100%;
                height: 102px;
                background-color: #fff;
            }

            .case-inner {
                margin-right: 0;
                padding-bottom: 0;
            }
        }

         #case04 {
            margin-bottom: 50px;
        }
    }

    #support {
        margin: 0 calc(50% - 50vw) 70px;
        padding: 0 calc(50vw - 50%);
        position: relative;

        @media only screen and
        (max-width : 757px) {
            margin-bottom: 30px;
        }

        &::before {
            content: "";
            position: absolute;
            background: url('/service/maintenance/itconcierge/adlp/img/ic_support2.png') no-repeat 0 50%;
            top: 10px;
            right: 0;
            width: 275px;
            height: 355px;
            background-size: cover;
            display: inline-block;
            z-index: -1;
            overflow: hidden;

            @media (max-width: 1079px) and (min-width: 758px) {
                right: -100px;
                width: 226px;
                height: 178px;
            }

            @media only screen and
            (max-width : 757px) {
                top: 55px;
                right: 0;
                width: 124px;
                height: 99px;
            }
        }

        &::after {
            content: "";
            position: absolute;
            background: url('/service/maintenance/itconcierge/adlp/img/ic_support4.png') no-repeat center;
            bottom: 0;
            left: -25px;
            width: 223px;
            height: 297px;
            background-size: contain;
            display: inline-block;
            z-index: -1;

            @media (max-width: 1079px) and (min-width: 758px) {
                left: 0;
                width: 112px;
                height: 149px;
            }

            @media only screen and
            (max-width : 757px) {
                bottom: 17px;
                left: -28px;
                width: 76px;
                height: 101px;
            }
        }

        .support-inner {
            max-width: 844px;
            margin-inline: auto;
            position: relative;

            &::before {
                content: "";
                position: absolute;
                background: url('/service/maintenance/itconcierge/adlp/img/ic_support1.png') no-repeat center;
                top: 0;
                left: -218px;
                width: 197px;
                height: 157px;
                background-size: contain;
                display: inline-block;
                z-index: -1;

                @media (max-width: 1079px) and (min-width: 758px) {
                    left: -15px;
                    width: 99px;
                    height: 79px;
                }

                @media only screen and
                (max-width : 757px) {
                    top: 80px;
                    left: -8px;
                    width: 66px;
                    height: 53px;
                }
            }

            &::after {
                content: "";
                position: absolute;
                background: url('/service/maintenance/itconcierge/adlp/img/ic_support3.png') no-repeat center;
                bottom: 0;
                right: -238px;
                width: 178px;
                height: 188px;
                background-size: contain;
                display: inline-block;
                z-index: -1;

                @media (max-width: 1079px) and (min-width: 758px) {
                    right: 0;
                    width: 89px;
                    height: 94px;
                }

                @media only screen and
                (max-width : 757px) {
                    bottom: 6px;
                    right: -51px;
                    width: 84px;
                    height: 89px;
                }
            }

            .ttl-support {
                font-size: 175%;
                line-height: 1.65;
                margin-bottom: 40px;

                 @media only screen and
                (max-width : 757px) {
                    font-size: 125%;
                    margin-bottom: 48px;
                }

                .line-maker {
                    background: linear-gradient(transparent 80%, #FFFF00 80%);
                }
            }

            .btnArea {
                margin-top: 40px;
            }
        }
    }
}

/*-------------------------------------------------------*/
/* contact */
/*-------------------------------------------------------*/
#contact {
    background: url('/service/maintenance/itconcierge/adlp/img/bg_contact.jpg') no-repeat center bottom;
    background-size: cover;

    @media only screen and
    (max-width : 757px) {
        background: url('/service/maintenance/itconcierge/adlp/img/bg_contact_sp.jpg') no-repeat center top;
        background-size: cover;
        position: relative;

        &::before {
            content: "";
            position: absolute;
            bottom: 0px;
            left: 0px;
            width: 100%;
            height: 220px;
            background-color: #fff;
        }
    }

    .l-sec__inner {
        padding-top: 0;
        padding-bottom: 0;

        @media only screen and
        (max-width : 757px) {
            padding-top: 30px;
        }
    }

    .flex_box {
        align-items: center;
        justify-content: center;
        gap: 22px;
        max-width: 1118px;
        margin-inline: auto;

        @media only screen and
        (max-width : 757px) {
            gap: 10px;
        }

        figure {
            margin-top: -57px;

            @media only screen and
            (max-width : 757px) {
                margin-top: 0;
                max-width: 264px;
            }
        }

        h2 {
            text-align: left;
            margin-bottom: 20px;

            span {
                display: block;
                color: #0D2742;
                background-color: #FFFF00;
                padding: 6px 16px;
                font-size: 225%;
                font-weight: 700;
                letter-spacing: 0.04em;
                width: fit-content;
                margin-bottom: 8px;
                white-space: nowrap;

                @media (max-width: 1200px) and (min-width: 1080px) {
                    padding: 2px 10px;
                    font-size: 200%;
                }

                @media only screen and
                (max-width: 1079px) {
                    padding: 2px 10px;
                    font-size: 150%;
                    margin-inline: auto;
                }

                @media only screen and
                (max-width : 757px) {
                    font-size: 125%;
                }
            }
        }

        .txt-intro {
            font-size: 125%;
            text-align: left;

            @media only screen and
            (max-width : 757px) {
                font-size: 93.75%;
                text-align: center;
            }
        }
    }

    .phoneBox {
        position: relative;

        @media only screen and
        (max-width : 757px) {
            max-width: 345px;
        }

        &::after {
            content: "";
            position: absolute;
            background: url('/service/maintenance/itconcierge/adlp/img/ic_arrow.svg') no-repeat center;
            bottom: -75px;
            right: 0;
            left: 0;
            margin: 0 auto;
            width: 27px;
            height: 106px;
            background-size: contain;
            display: inline-block;
            z-index: 2;
        }

        h3 {
            color: #fff;
            font-size: 150%;
            letter-spacing: 0.04em;
            text-align: center;
            margin-bottom: 38px;
        }

        @media (max-width: 1113px) and (min-width: 1080px) {
            & .flex_box {
                & .phoneArea {
                    flex-direction: column;
                    text-align: left;
                }
            }
        }

        @media only screen and
        (max-width : 757px) {
            &::after {
                bottom: -38px;
                width: 14px;
                height: 54px;
            }

            h3 {
                font-size: 112.5%;
                margin-bottom: 13px;
            }
        }
    }
}

.phoneBox {
    max-width: 1118px;
    margin-inline: auto;
    color: #fff !important;
    margin-bottom: 40px;

    @media only screen and
    (max-width : 757px) {
        max-width: 297px;
    }

    .flex_box {
        align-items: center;
        justify-content: center;
        gap: 22px;
        max-width: 1118px;
        margin-inline: auto;

        @media only screen and
        (max-width: 1079px) {
            flex-direction: column;
        }

        @media only screen and
        (max-width : 757px) {
            .btn-contact {
                max-width: 100%;
            }
        }

        .btnStyle {
            font-size: 131.25%;
            color: #fff!important;
            background-image: none;
            padding: 14px 36px 15px 60px;
            width: 355px;
            height: 74px;

            @media only screen and
            (max-width : 757px) {
                font-size: 100%;
                max-width: 100%;
                height: 64px;
                border-radius: 8px;
                background: url(/service/maintenance/itconcierge/adlp/img/ic_arrow_right_white.svg) no-repeat center right 15px;
            }

            &::after {
                content: "";
                position: absolute;
                top: 0;
                bottom: 0;
                margin: auto 0;
                left: 26px;
                width: 35px;
                height: 24px;
                background: url('/service/maintenance/itconcierge/adlp/img/ic_btn-contact.png') no-repeat center;
                background-size: contain;
            }
        }

        .phoneArea {
            @media only screen and
            (max-width : 757px) {
                flex-direction: column;
                gap: 0;
                margin-bottom: 8px;
            }

            .phone-no {
                a {
                    color: #fff;
                    font-size: 225%;
                    white-space: nowrap;

                    @media only screen and
                    (max-width : 757px) {
                        font-size: 181.25%;
                    }
                }

                &:before {
                    background: url(/service/maintenance/itconcierge/adlp/img/ic_dial_white.svg) no-repeat center;
                    background-size: contain;
                    width: 33px;
                    height: 33px;

                    @media only screen and
                    (max-width : 757px) {
                        width: 26px;
                        height: 26px;
                    }
                }
            }

            .phone-hr {
                font-size: 87.5%;

                @media only screen and
                (max-width : 757px) {
                    font-size: 81.25%;
                    text-align: center;
                }
            }
        }

        p {
            margin-top: 0;
        }

        p.indent {
            font-size: 81.25%;

            @media only screen and
            (max-width : 757px) {
                font-size: 68.75%;
            }
        }
    }
}

/*-------------------------------------------------------*/
/* price */
/*-------------------------------------------------------*/
#price {

    .flex_box {
        justify-content: space-between;
        gap: 32px;
        max-width: 998px;
        margin-inline: auto;

        @media (max-width: 1113px) and (min-width: 758px) {
            align-items: flex-end;
        }

        .txtArea {
            max-width: 517px;
            margin-bottom: 20px;

            .txt-intro {
                font-size: 137.5%;
                margin-bottom: 24px;
                text-align: left;
            }

            dl {
                display: flex;
                align-items: center;
                gap: 20px;
                color: #0091FA;
                margin-bottom: 23px;

                dt {
                    font-size: 137.5%;
                    font-weight: 700;
                    color: #fff;
                    padding: 10px 30px;
                    border-radius: 30px;
                    background-color: #0091FA;
                    flex-shrink: 0;
                }

                dd {
                    font-size: 162.5%;
                    font-weight: 700;

                    .en {
                        font-size: 215.38%;
                        font-weight: 600;
                        letter-spacing: 0.04em;
                        line-height: 1;
                    }
                }

                &._monthly {
                    color: #005CBC;
                    margin-bottom: 40px;

                    dt {
                        background-color: #005CBC;
                    }
                }
            }
        }

        @media only screen and
        (max-width : 757px) {
            gap: 0;

            .txtArea {
                .txt-intro {
                    font-size: 93.75%;
                    margin-bottom: 16px;
                }

                dl {
                    gap: 8px;
                    margin-bottom: 16px;

                    dt {
                        font-size: 81.25%;
                        padding: 6px 12px;
                    }

                    dd {
                        font-size: 106.25%;

                        .en {
                            font-size: 235.29%;
                        }
                    }

                    &._monthly {
                        margin-bottom: 16px;
                    }
                }
            }
        }

        figure {
            margin-top: -135px;
            align-self: flex-end;

            @media only screen and
            (max-width : 757px) {
                max-width: 266px;
                margin: auto;
            }
        }
    }

    .blueBox {
        max-width: 1118px;
        margin-inline: auto;
    }
}

/*-------------------------------------------------------*/
/* others */
/*-------------------------------------------------------*/
#others {
    background-color: #0E63C4;

    .ttl-others {
        color: #fff;
        font-size: 200%;
        margin-bottom: 34px;

        @media only screen and
        (max-width : 757px) {
            font-size: 112.5%;
            margin-bottom: 27px;
        }
    }

    .linkBox {
        max-width: 1062px;
        margin: 0 auto 24px;
        padding: 40px 0;
        border-top: 1px solid rgba(255, 255, 255, 0.2);
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);

        @media only screen and
        (max-width : 757px) {
            padding: 32px 0;
        }

        .flex_box {
            gap: 28px;

            li {
                display: flex;
                justify-content: space-between;
                gap: 32px;

                figure {
                    flex-shrink: 0;

                    @media only screen and
                    (max-width : 757px) {
                        max-width: 88px;
                    }
                }

                dl {
                    color: #fff;

                    dt {
                        font-size: 125%;
                        font-weight: 700;
                        letter-spacing: 0.04em;
                        margin-bottom: 12px;
                    }

                    dd:not(.btnArea) {
                        font-size: 93.75%;
                        margin-bottom: 24px;
                    }
                    
                    .btnStyle {
                        background: #fff url(/service/maintenance/itconcierge/adlp/img/ic_arrow_right_blue.svg) no-repeat center right 15px;
                        background-size: 9px 15px;
                        color: #0E63C4!important;
                        max-width: 271px;
                        height: 62px;
                        margin: 0;
                    }

                    @media only screen and
                    (max-width : 757px) {
                        dt {
                            font-size: 93.75%;
                            margin-bottom: 6px;
                        }

                        dd:not(.btnArea) {
                            font-size: 75%;
                            margin-bottom: 13px;
                        }

                        .btnStyle {
                            font-size: 81.25%;
                            max-width: 181px;
                            height: 42px;
                        }
                    }
                }
            }
        }
    }
}


/*-------------------------------------------------------*/
/* footer */
/*-------------------------------------------------------*/
.l-footer {
    margin-top: 0 !important;
}

.l-pagetop > a {
   bottom: 28px;
}

/*===========================================
   縲侵EW縲代し繧､繝芽ｿｽ蠕�
============================================= */
.side-cv {
    position: fixed;
    box-sizing: border-box;
    top: 70%;
    right: -330px;
    margin-top: -135px;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    transition: right 0.5s, opacity 0.3s, visibility 0.3s;
    z-index: 100;
  line-height: 1;
}

@media only screen and (min-width: 768px) and (max-width: 812px) {
.side-cv {
    display: none !important;
}
}

@media screen and (min-width: 768px) {
.side-cv.is-open {
    right: 0;
}
.side-cv.is-open .side-cv__trigger img {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
.side-cv__main {
    width: 330px;
    box-sizing: border-box;
    background: #fff;
    border: 4px solid #FF7700;
    padding: 10px!important;
}
.side-cv__trigger {
    margin: 0;
    background: url(/service/maintenance/itconcierge/adlp/img/side-cv-title_minus.png) no-repeat center top;
    background-size: cover;
    cursor: pointer;
    margin-top: 0!important;
}
.side-cv__title {
    margin: 0;
    font-size: 18px;
    line-height: 1.3;
    font-feature-settings: "palt";
    font-weight: bold;
    text-align: center;
    color: #0D2742;
    margin-top: 12px!important;
}
.side-cv__tel {
    padding-top: 10px;
    text-align: center;
    margin-top: 0!important;
}
.side-cv__time {
    margin: 10px 0 0!important;
    font-size: 13px;
    font-weight: bold;
    font-feature-settings: "palt";
    letter-spacing: -0.05em;
    text-align: center;
}
.side-cv__note {
    margin-top: 5px!important;
    font-size: 12px;
    font-feature-settings: "palt";
    line-height: 1.5;
    margin-left: 1.7em;
    text-indent: -1.3em;
}
.side-cv__btn {
    width: 100%;
    box-sizing: border-box;
    margin-top: 12px!important;
}
.side-cv__btn a {
    width: 100%;
    display: block;
    box-sizing: border-box;
    background: #005CBC;
    border: 1px solid #005CBC;
    box-shadow: 0 4px #004478;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 16px;
    text-align: center;
    padding: 12px 35px;
    border-radius: 6px;
    font-weight: bold;
    position: relative;
    z-index: 10;
    font-feature-settings: "palt";
    transition: transform 0.05s, box-shadow 0.05s;
    border-radius: 24px;
}
.side-cv__btn a:hover {
    box-shadow: none;
    transform: translateY(4px);
}
.side-cv__btn span {
    position: relative;
    display: inline-block;
    padding-left: 30px;
}
.side-cv__btn span:after {
    content: "";
    position: absolute;
    background: url(/service/maintenance/itconcierge/adlp/img/ic_side-contact.svg) no-repeat center top;
    background-size: cover;
    top: 0;
    bottom: 0;
    left: 0;
    width: 23px;
    height: 17px;
    margin: auto 0;
    z-index: 10;
}
}
@media screen and (max-width: 767px) {
.side-cv {
    display: none !important;
}
}