@charset "utf-8";
.service .page_bnr{
    background-image: url(../img/service/main_bg_pc.jpg);
    background-image: -webkit-image-set(url(../img/service/main_bg_pc.jpg) 1x, url(../img/service/main_bg_pc@2x.jpg) 2x);
    background-image: image-set(url(../img/service/main_bg_pc.jpg) 1x, url(../img/service/main_bg_pc@2x.jpg) 2x);
}
@media only screen and (min-width: 0) and (max-width: 767px) { /*SP*/
    .service .page_bnr{
        background-image: url(../img/service/main_bg_sp.jpg);
        background-image: -webkit-image-set(url(../img/service/main_bg_sp.jpg) 1x, url(../img/service/main_bg_sp@2x.jpg) 2x);
        background-image: image-set(url(../img/service/main_bg_sp.jpg) 1x, url(../img/service/main_bg_sp@2x.jpg) 2x);
    }
}
.service_lead {
    line-height: 2.2;
}
@media only screen and (min-width: 0) and (max-width: 767px) { /*SP*/
    .service_lead {
       max-width: 98%;
       margin: auto;
       line-height: 1.8;
    }
}
.service h2.big {
    font-size: 2.5rem;
    color: var(--bland-color);
    line-height: 1.4;
    margin-bottom: 0.7em;
}
.service h2.mid {
    font-size: 1.875rem;
    color: var(--bland-color);
}
@media only screen and (min-width: 0) and (max-width: 767px) { /*SP*/
    .service h2.big {
        font-size: 1.437rem;
    }
}
.service h2 {
    font-size: 2.25rem;
    color: var(--bland-color);
    margin-bottom: 0.5em;
}
.service h3.small {
    font-size: 1rem;
    margin-bottom: 1em;
}
.service_lead {
    font-size: 1rem;
    line-height: 2;
}

@media only screen and (min-width: 0) and (max-width: 767px) { /*SP*/
    .service h2.big {
        font-size: 1.437rem;
        margin-bottom: 0.5em;
    }
    .service h2 {
        font-size: 1.437rem
    }
    .service h2.mid {
        font-size: 1.437rem;
    }
    .service h3.small {
        font-size: 0.937rem;
        line-height: 1.4;
    }
    .service_lead {
        font-size: 0.875rem;
        line-height: 1.7;
    }
    .service_img {
        width: 71%;
        max-width: 500px;
        margin: 0 auto 30px;
    }
    .redio .service_img{
        order: 1;
    }
    .redio .service_text{
        order: 2;
    }
    .service_text {
        padding: 0 15px;
    }
    .pc_service_box {
        display: block;
        margin-bottom: 70px
    }
    .sp_service_box img {
        max-width: 100%;
        width: auto;
    }
    .sp_service_box h3 {
        font-size: 1.437rem;
        margin-bottom: 20px;
    }
    .sp_service_box:nth-of-type(1) h3 {
        color: #58c2f1;
    }
    .sp_service_box:nth-of-type(1) img {
        max-width: 84.26vw;
    }
    .sp_service_box:nth-of-type(2) h3 {
        color: #a289d3;
    }
    .sp_service_box:nth-of-type(2) img {
        max-width: 26.53vw;
    }
    .sp_service_box:nth-of-type(3) h3 {
        color: #4fcfe0;
    }
    .sp_service_box:nth-of-type(3) img {
        max-width: 84.26vw;
    }
    .sp_service_box:nth-of-type(4) h3 {
        color: #e27994;
    }
    .sp_service_box:nth-of-type(4) p {
        font-size: 1.125rem;
        color: #e27994;
        font-weight: bold;
    }
}
.achievement .ui_dfpc{
    margin:10px auto 60px;
}
.achievement .bnr_achievement {
    margin: 215px auto 0px;
}
.achievement .ui_dfpc .service_text{
    padding: 0 20px;
}
.achievement .ui_dfpc:nth-child(odd) .service_img{
    order: 1;
}
.achievement .ui_dfpc:nth-child(odd) .service_text{
    order: 2;
}
.achievement .ui_btn_linear {
    margin: 30px auto 0 0;
}
@media only screen and (min-width: 0) and (max-width: 767px) { /*SP*/
    .achievement .ui_btn_linear {
        height: 54px;
    }
    .achievement .ui_dfpc:nth-child(even) .service_img{
        order: 1;
    }
    .achievement .ui_dfpc:nth-child(even) .service_text{
        order: 2;
    }
    .achievement .bnr_achievement {
        margin: 60px auto;
    }
}
.relative {
    position: relative;
    background: transparent;
}
.round {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(94deg , rgba(102,198,245,0.85) 0% , rgba(61,164,251,0.85) 100%);
}
.cur01{
	margin-left: 10.75%;
}
.cur01 .round{
	width: 626px;
	height: 626px;
	border-radius: 313px;
}
.cur02{
	display: flex;
	justify-content: flex-end;
	margin-top: -123px;
	margin-right: 10px;
}
.cur02 .round{
	width: 500px;
	height: 500px;
	border-radius: 250px;
}
.cur03{
	margin-left: 5.83%;
	margin-top: -316px;
}
.cur03 .round{
	width: 500px;
	height: 500px;
	border-radius: 250px;
}
.cur04{
	display: flex;
	justify-content: flex-end;
	margin-top: -100px;
	margin-right: 7%;
}
.cur04 .round{
	width: 570px;
	height: 570px;
	border-radius: 285px;
}
.cirs01{
    position: absolute;
    left: calc(50% + 412px);
    top: 85px;
    width: 320px;
    height: 320px;
    border-radius: 160px;
    background:rgba(217,243,255,.8);
}
.cirs02 {
	position: absolute;
    left: calc(50% + 300px);
	top: 405px;
	width: 58px;
	height: 58px;
	border-radius: 29px;
	background: rgba(178,238,255,.7);
}
.cirs03{
    position: absolute;
    left: calc(50% - 562px);
    top: 405px;
    width: 213px;
    height: 213px;
    border-radius: 110px;
	background: rgba(178,231,255,.7);
}
.cirs04 {
    position: absolute;
    left: calc(50% + 402px);
    top: 1145px;
    width: 98.72px;
    height: 98.72px;
    border-radius: 84px;
	background: rgba(119,211,255,.7);
}
.cirs05 {
    position: absolute;
    left: calc(50% + 474px);
    bottom: 1106px;
    width: 55px;
    height: 55px;
    border-radius: 28px;
	background: rgba(119,211,255,.7);
}
.cirs06 {
    position: absolute;
    left: calc(50% - 809px);
    bottom: 909px;
    width: 264.53px;
    height: 264.53px;
    border-radius: 133px;
	background: rgba(177,218,252,.5);
}
.cirs07 {
    position: absolute;
    left: calc(50% + 525px);
    bottom: 220px;
    width: 351.14px;
    height: 351.14px;
    border-radius: 175.57px;
	background: rgba(229,247,255,.8);
}
@media only screen and (min-width: 0) and (max-width: 767px) { /*SP*/
    .cirs01 {
        /* left: auto;
        right: -20%;
        top: 264px;
        width: 42.4vw;
        height: 42.4vw;
        border-radius: 50%;
        z-index: 1; */
        display: none;
    }
    .cirs02 {
        /* left: auto;
        right: 15%;
        top: 271px;
        width: 7.784vw;
        height: 7.784vw;
        border-radius: 50%;
        z-index: 2; */
        display: none;
    }
    .cirs03 {
        /* background: #ccf0ff;
        left: -12%;
        top: 411px;
        width: 20vw;
        height: 20vw;
        border-radius: 50%;
        z-index: 1; */
        display: none;
    }
    .cirs04 {
        /* background: #b2e7ff;
        left: auto;
        right: -7.4%;
        top: 678px;
        width: 28.47vw;
        height: 28.47vw;
        border-radius: 84px;
        z-index: 1; */
        display: none;
    }
    .cirs05 {
        /* left: -10.9%;
        bottom: auto;
        top: 1077px;
        width: 35.27vw;
        height: 35.27vw;
        border-radius: 50%;
        background: #b1dafc; */
        display: none;
    }
    .cirs06 {
        /* left: auto;
        right: 0;
        top: 1397px;
        bottom: auto;
        width: 21.1vw;
        height: 21.1vw;
        border-radius: 50%;
        background: #e5f7ff; */
        display: none;
    }
    .cirs07 {
        /* position: absolute;
        left: 0.2%;
        bottom: auto;
        top: 1893px;
        width: 13vw;
        height: 13vw;
        border-radius: 50%;
        background: #ccf0ff; */
        display: none;
    }
}