@charset "UTF-8";

.webp .pageBanner {
    background-image: url("../img/service/banner-pc.webp");
}
.no-webp .pageBanner {
    background-image: url("../img/service/banner-pc.png");
}
.pageBannerTitle {
    padding-left: 80px;
}
.pageBannerTitle::before {
    width: 68px;
    height: 68px;
    margin-top: -34px;
    background-image: url("../img/service/icon_service_line_white.svg");
    background-size: 68px 68px;
}

.pageContents {
    padding: 60px 0 0;
}
.serviceSubContents {

}

.serviceInfo {

}
.serviceText01 {
    text-align: center;
}

.servicePageLink {
    padding-top: 40px;
}
.pageLinkList {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.pageLinkItem {
    width: 350px;
}
.pageLinkItemText {
    display: block;
    border-radius: 10px;
    padding: 20px;
    color: #fff;
    font-weight: 700;
    background-color: #0076AA;

    background-image: url("../img/circle_down_blue_white.svg");
    background-repeat: no-repeat;
    background-position: 300px center;
    background-size: 32px 32px;

    box-shadow: 0 0 10px 0 rgba(66, 128, 147, 0.16);
}

.serviceFlow {
    padding: 130px 0 50px;
}
.serviceStepList {
    margin-top: 35px;
}
.serviceStepItem {

}
.step {
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    color: #0076AA;
    vertical-align: bottom;
}
.stepNum {
    padding-left: 8px;
    font-size: 30px;
}
.stepBlockWrap {
    position: relative;
    margin-top: 5px;
}
.stepBlockWrap::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    border-top: 5px solid #0076AA;
}
.stepBlock {
    position: relative;
    min-height: 158px;
    border-radius: 10px;
    padding: 30px 40px 20px 160px;

    background-color: #fff;
}
.stepBlock::before {
    content: "";
    display: block;
    position: absolute;
    top: 30px;
    left: 40px;
    width: 86px;
    height: 86px;
    border-radius: 50%;

    background-color: #ECF5F8;

    background-repeat: no-repeat;
    background-position: center;

}
.serviceStepItem:nth-child(n+2) {
    position: relative;
    margin-top: 15px;
}
.serviceStepItem:nth-child(n+2)::before {
    content: "";
    display: block;
    position: absolute;
    top: -5px;
    left: 50%;
    margin-left: -16px;
    width: 32px;
    height: 32px;
    background-image: url("../img/circle_down_white_blue.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 32px;
}

.serviceStepItem:nth-child(1) .stepBlock::before {
    background-image: url("../img/service/icon_service_step01.svg");
    background-size: 53px auto;
}
.serviceStepItem:nth-child(2) .stepBlock::before {
    background-image: url("../img/service/icon_service_step02.svg");
    background-size: 44px auto;
}
.serviceStepItem:nth-child(3) .stepBlock::before {
    background-image: url("../img/service/icon_service_step03.svg");
    background-size: 54px auto;
}
.serviceStepItem:nth-child(4) .stepBlock::before {
    background-image: url("../img/service/icon_service_step04.svg");
    background-size: 60px auto;
}
.serviceStepItem:nth-child(5) .stepBlock::before {
    background-image: url("../img/service/icon_service_step05.svg");
    background-size: 40px auto;
}
.serviceStepItem:nth-child(6) .stepBlock::before {
    background-image: url("../img/service/icon_service_step06.svg");
    background-size: 50px auto;
}
.stepBlockTitle {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.35;
}
.stepBlockText {
    margin-top: 10px;
    line-height: 1.35;
}

.serviceAdvantage {
    padding: 70px 0 120px;
    background-color: #fff;
}
.serviceFeatureList {

}
.serviceFeatureItem {

}
.serviceFeatureItem:first-child {
    padding: 30px 0 50px;
}
.serviceFeatureItem:nth-child(n+2) {
    border-top: 1px solid rgba(0, 118, 170, 0.21);
    padding: 50px 0;
}
.featureBlockWrap {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	align-items: stretch;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.serviceFeatureItem:nth-child(even) .featureBlockWrap {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}
.featureImg {
    width: 456px;
    height: 298px;
    border-radius: 10px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.webp .featureImg__01 {
    background-image: url("../img/service/feature01.webp");
}
.no-webp .featureImg__01 {
    background-image: url("../img/service/feature01.png");
}
.webp .featureImg__02 {
    background-image: url("../img/service/feature02.webp");
}
.no-webp .featureImg__02 {
    background-image: url("../img/service/feature02.png");
}
.webp .featureImg__03 {
    background-image: url("../img/service/feature03.webp");
}
.no-webp .featureImg__03 {
    background-image: url("../img/service/feature03.png");
}
.featureBlock {
    width: 595px;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: flex-start;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.featureBlockInner {

}
.feature {
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    color: #0076AA;
    vertical-align: bottom;
}
.featureNum {
    padding-left: 8px;
    font-size: 26px;
}
.featureBlockTitle {
    margin-top: 8px;
    width: 100%;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.4;
}
.featureBlockText {
    margin-top: 10px;
    width: 100%;
}

.serviceFaq {

}
.serviceFaqInner {
    padding: 70px 0;
}
.serviceFaqList {
    margin: 30px auto 0;
    border-radius: 10px;
    padding: 35px 50px 50px;
    background-color: #fff;
}
.serviceFaqItem {

}
.serviceFaqItem:nth-child(n+2) {
    border-top: 1px solid rgba(0, 118, 170, 0.21);
}
.serviceFaqItem:last-child {
    border-bottom: 1px solid rgba(0, 118, 170, 0.21);
}


/*----------------------------------------
 _画面の横幅が750pxまで
----------------------------------------*/
@media screen and (max-width:750px) {
    
    .webp .pageBanner {
        background-image: url("../img/service/banner-sp.webp");
    }
    .no-webp .pageBanner {
        background-image: url("../img/service/banner-sp.png");
    }
    .pageBannerTitle {
        padding-left: 16vw;
    }
    .pageBannerTitle::before {
        width: 13.86vw;
        height: 13.86vw;
        margin-top: -6.93vw;
        background-size: 13.86vw 13.86vw;
    }

    .pageContents {
        padding: 8vw 0 0;
    }
    .serviceSubContents {
    
    }
    
    .serviceInfo {
    
    }
    .serviceText01 {
        text-align: left;
        letter-spacing: -0.01em;
    }
    
    .servicePageLink {
        padding-top: 22.66vw;
        padding-bottom: 6.66vw;
    }
    .servicePageLinkInner02 {

    }
    .pageLinkList {

    }
    .pageLinkItem {
        width: 100%;
    }
    .pageLinkItem:nth-child(n+2) {
        margin-top: 2.66vw;
    }
    .pageLinkItemText {
        border-radius: 2.66vw;
        padding: 4vw 2.66vw 4vw 5.33vw;
        background-position: 78.66vw center;
        background-size: 8vw 8vw;
        box-shadow: 0 0 1.33vw 0 rgba(66, 128, 147, 0.16);
    }
    
    .serviceFlow {
        margin: 0 5.33vw;
        border-top: 0.26vw solid rgba(0, 118, 170, 0.21);
        padding: 10.66vw 0;
    }
    .serviceStepList {
        margin-top: 8vw;
    }
    .serviceStepItem {
    
    }
    .step {
        font-size: 3.46vw;
    }
    .stepNum {
        padding-left: 2.13vw;
        font-size: 7.46vw;
    }
    .stepBlockWrap {
        margin-top: 1.33vw;
        z-index: 1;
    }
    .stepBlockWrap::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        border-top-left-radius: 1.2vw;
        border-top-right-radius: 1.2vw;
        border-top: 1.33vw solid #0076AA;
        z-index: 2;
    }
    .stepBlock {
        position: relative;
        min-height: auto;
        min-height: initial;
        border-radius: 2.66vw;
        padding: 5.33vw;
    }
    .stepBlock::before {
        top: 5.33vw;
        left: 5.33vw;
        width: 17.6vw;
        height: 17.6vw;
    }
    .serviceStepItem:nth-child(n+2) {
        margin-top: 8vw;
    }
    .serviceStepItem:nth-child(n+2)::before {
        top: -4.33vw;
        margin-left: -4.26vw;
        width: 8.53vw;
        height: 8.53vw;
        background-image: url("../img/circle_down_white_lightBlue.svg");
        background-size: 8.53vw;
    }
    
    .serviceStepItem:nth-child(1) .stepBlock::before {
        background-size: 10.93vw auto;
    }
    .serviceStepItem:nth-child(2) .stepBlock::before {
        background-size: 9.06vw auto;
    }
    .serviceStepItem:nth-child(3) .stepBlock::before {
        background-size: 10.66vw auto;
    }
    .serviceStepItem:nth-child(4) .stepBlock::before {
        background-size: 11.33vw auto;
    }
    .serviceStepItem:nth-child(5) .stepBlock::before {
        background-size: 8vw auto;
    }
    .serviceStepItem:nth-child(6) .stepBlock::before {
        background-size: 10vw auto;
    }
    .stepBlockTitle {
        width: 100%;
        padding-left: 21.33vw;
        font-size: 4.26vw;
        line-height: 1.5;
        min-height: 17.6vw;

        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    .stepBlockTitleText {

    }
    .stepBlockText {
        width: 100%;
        margin-top: 1.33vw;
        line-height: 1.65;
        letter-spacing: -0.05em;
    }
    
    .serviceAdvantage {
        padding: 10.66vw 0;
    }
    .serviceFeatureList {
    
    }
    .serviceFeatureItem {
    
    }
    .serviceFeatureItem:first-child {
        padding: 6.66vw 0;
    }
    .serviceFeatureItem:nth-child(n+2) {
        border-top: 0.26vw solid rgba(0, 118, 170, 0.21);
        padding: 6.66vw 0;
    }
    .featureBlockWrap {

    }
    .serviceFeatureItem:nth-child(even) .featureBlockWrap {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
    }
    .featureImg {
        width: 100%;
        height: 50.4vw;
        border-radius: 2.66vw;
    }
    .featureBlock {
        width: 100%;
        margin-top: 5.33vw;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
    .featureBlockInner {
    
    }
    .feature {
        font-size: 3.46vw;
    }
    .featureNum {
        padding-left: 2.13vw;
        font-size: 6.93vw;
    }
    .featureBlockTitle {
        margin-top: 2.13vw;
        font-size: 4.8vw;
        line-height: 1.5;
    }
    .featureBlockText {
        margin-top: 2.66vw;
        width: 100%;
        letter-spacing: -0.12em;
    }
    
    .serviceFaq {
    
    }
    .serviceFaqInner {
        padding: 10.66vw 0;
    }
    .serviceFaqList {
        margin: 6.66vw auto 0;
        border-radius: 2.66vw;
        padding: 2.66vw 4vw 5.33vw;
    }
    .serviceFaqItem {
    
    }
    .serviceFaqItem:nth-child(n+2) {
        border-top: 0.26vw solid rgba(0, 118, 170, 0.21);
    }
    .serviceFaqItem:last-child {
        border-bottom: 0.26vw solid rgba(0, 118, 170, 0.21);
    }
}