@font-face {
    font-family: 'Palatino';
    src: url('../fonts/Palatino.eot');
    src: url('../fonts/Palatino.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Palatino.woff2') format('woff2'),
        url('../fonts/Palatino.woff') format('woff'),
        url('../fonts/Palatino.ttf') format('truetype'),
        url('../fonts/Palatino.svg#Palatino') format('svg');
    font-weight: 100;
    font-style: italic;
}


@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,700,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@500;700;900&display=swap');
.font-bold { font-weight: 700;}
.font-medium { font-weight: 500;}
.font-poppins { font-family: 'Poppins', sans-serif;}
.font-notosans { font-family: 'Noto Sans JP', sans-serif; font-weight: bold;}
.font-palatino { font-family: 'Noto Sans JP', sans-serif; font-weight: bold;}

.text-center { text-align: center;}

.font-13 {font-size: 17px;line-height: 1.8;}
.font-14 {/* font-size: 14px; */}
.font-15 { font-size: 15px;}
.font-20 { font-size: 20px;}
.font-22 { font-size: 22px;}
.font-38 { font-size: 38px;}

.pt-2 { padding-top: 0.5rem;}
.pt-3 { padding-top: 1rem;}
.pb-2 { padding-bottom: 0.5rem;}
.pt-4 { padding-top: 1.5rem;}
.pt-5 { padding-top: 3rem;}
.p-2 { padding: 0.5rem;}

.m-auto { margin: auto;}

.show-pc { display: block;}
.show-sp { display: none;}

.position-relative { position: relative;}
.z-2 { z-index: 2;}

.bg-gray { background: #f9f9f9;}

.color-red { color: #ff6900;}
.color-white { color: #fff;}

.img-fluid { max-width: 100%;}

.d-inline-block { display: inline-block;}

.wrapper-service {max-width: 1250px;width: 100%;margin: 0 auto;padding: 0 3rem;}



.sub-title {/* font-size: 2.1vw; text-transform: uppercase;*/font-weight: 700 !important;font-family: 'Poppins', sans-serif !important;}
.sub-title span { display: inline-block; position: relative; color: #ffffff; transition: all 0.8s cubic-bezier(0.860, 0.000, 0.070, 1.000); font-weight: 700 !important;font-family: 'Noto Sans JP', sans-serif; font-weight: bold !important; }
.sub-title span.active { color: #000; }
.sub-title span::before { content: ''; background: #f9f9f9; width: 100%; height: 100%; position: absolute; top: 0; right: 0; transition: all 0.8s cubic-bezier(0.860, 0.000, 0.070, 1.000); }
.sub-title span.active::before { width: 0; background: #000000; }




/* TITLE HEADER */
.title-header { background-image: url(../images/banner-title-pc.jpg); margin: 0 0 15px;}

/* TOPIC SERVICE */
.topic-service { display: block; padding: 8rem 0; font-size: 20px; line-height: 1.95;}
@media(max-width:576px) {
    .topic-service { line-height: 1.7;}
}
/* CAR STATION */
.car-station { position: relative; padding: 0 0 11rem; margin-bottom: 13rem;}
.content-car-station { padding: 10rem 0 20rem;}
.img-network { position: absolute; top: -11rem; right: 0; z-index: 1;}
/* PURCHACE */
.purchace { margin: 17rem 0;}
.purchace::after { content: ''; width: 531px; height: 535px; display: block; position: absolute; bottom: -7.5rem; right: 0; z-index: 1;
    background: -webkit-gradient(linear, left top, right top, color-stop(0, #b52323), color-stop(100, #f3827d));
    background: -moz-linear-gradient(Left, #b52323 0%, #f3827d 100%);
    background: -ms-linear-gradient(Left, #b52323 0%, #f3827d 100%);
    background: -o-linear-gradient(Left, #b52323 0%, #f3827d 100%);
    background: linear-gradient(to right, #b52323 0%, #f3827d 100%);}
.selectable-purchace { width: 100%; position: relative; z-index: 2; text-align: right; 
    background: -webkit-gradient(linear, left top, right top, color-stop(97, rgba(249, 249, 249, 1)), color-stop(97, rgba(255, 255, 255, 0)));
    background: -moz-linear-gradient(Left, rgba(249, 249, 249, 1) 97%, rgba(255, 255, 255, 0) 97%);
    background: -ms-linear-gradient(Left, rgba(249, 249, 249, 1) 97%, rgba(255, 255, 255, 0) 97%);
    background: -o-linear-gradient(Left, rgba(249, 249, 249, 1) 97%, rgba(255, 255, 255, 0) 97%);
    background: linear-gradient(to right, rgba(249, 249, 249, 1) 97%, rgba(255, 255, 255, 0) 97%);}
.img-purchace { position: absolute; top: -10rem; left: 0;}
.content-purchace {max-width: 823px;min-height: 450px;width: 100%;display: inline-block;position: relative;text-align: left;padding: 10rem 0;}
/* .content-purchace::after { content: url(../images/img-graph-pc.png); position: absolute; bottom: 0; right: -5rem; z-index: -1;}
 */
 .content-purchace{background: url(../images/img-graph-pc.png) no-repeat;background-position: right 30px bottom 20px;}

/* CAR PLATFORM */
.car-platform { background: url(../images/img-service-pc3.jpg) no-repeat top center #f9f9f9; background-size: 100%; padding: 12rem 0 10rem;}
.platform { padding: 7rem 3rem; margin-top: 10rem; background: #fff; box-shadow: 0px 0px 13px 0px rgba(110, 59, 59, 0.23); overflow: hidden;}
.circle { padding: 10rem 0; position: relative; width: 1130px; margin: 0 auto;}
.circle .items-platform { position: absolute; font-size: 13px;}
.circle .carshop { top: 83px; right: 30px;}
.circle .rental-car { top: 300px; right: -14px;}
.circle .maintenance { bottom: -12px; right: 60px;}
.circle .export { bottom: 30px; left: 70px;}
.circle .lease { top: 345px; left: 0;}
.circle .auction { top: 115px; left: 0;}
.circle .sub-title-platform { display: none;}

@media screen and (min-width:992px) {
    .img-network{overflow:hidden;}
    .img-network img{right: -20%;position: relative;}


 }


  @media(min-width: 1850px) {
    .img-purchace{
        left: calc((100% - 1850px)/2);
     }
/*      .img-network{right: calc((100% - 1850px)/2);}
 */
}
@media screen and (min-width: 1250px) and (min-width: 768px) {
    .purchace .wrapper-service{
        max-width: 1500px;
        width: 100%;
     }
}
@media screen and (min-width: 992px) and (max-width:1490px) {
    .content-purchace .font-13 br{
        display:none;
    }
    .content-purchace {
        max-width: 58%;
        padding: 6rem 30px 6rem 0;
    }
    .img-purchace{
        width:40%;
    }

    
}
@media(max-width:1460px) {
    /* PURCHACE */
    .content-purchace::after { right: 0;}

    .img-network {width: 52%;}



}

@media(max-width:1240px) {
    /* CAR PLATFORM */
    .circle { width: 900px;}
    .circle br { display: none;}
    .circle .font-13 { font-size: 12px;}
    .circle .font-22 { font-size: 18px;}    
    .circle .carshop {width: 253px;top: 83px;right: -6px;}
    .circle .rental-car { width: 200px; top: 256px; right: 0;}
    .circle .maintenance { width: 300px; bottom: -9px; right: 25px;}
    .circle .export { width: 280px; bottom: 30px; left: 50px;}
    .circle .lease { width: 200px; top: 292px; left: 0;}
    .circle .auction { width: 240px; top: 108px; left: 0;}
}

@media(max-width:1200px) {
    /* CAR STATION */
    .content-car-station {padding-right: 40%;}

}
@media(max-width:1150px) {
    .content-car-station br{ display:none;}

}
@media(max-width:1000px) {
    main {padding-top: 61px;}
}

@media(max-width:991px) {
    [data-aos-delay] { transition-delay: 0s !important; }

    .show-pc { display: none;}
    .show-sp { display: block;}    

    /* CAR STATION */
    .content-car-station { padding: 10rem 0 20rem;}
    .img-network { top: 0;}

    /* TITLE HEADER */
    .title-header { background-image: url(../images/banner-title-sp.jpg);} 

    /* CAR PLATFORM */
    .circle { text-align: center;}
    .platform {padding: 2rem 1rem;margin-top: 2rem;overflow: hidden;}
    .car-platform { padding: 6rem 0 10rem;}
    

    /* PURCHACE */
    .purchace { margin: 8rem auto;}
    .purchace::after { display: none;}
    .selectable-purchace { text-align: center; background: #f9f9f9;}
    .content-purchace {padding: 0 0 10rem;max-width: auto;display: inline-block;background-size: 50%;}
    .content-purchace::after { bottom: 25px;}    
    .img-purchace { position: relative; left: auto; top: -6rem;}

    /* CAR PLATFORM */
    .platform { text-align: center;}
    .title-platform { max-width: 615px; display: inline-block; padding: 0.5rem;}
    .circle { width: 100%;}
    .circle .font-22 { font-size: 41px;}
    .circle .items-platform { width: 100%; padding: 2.5rem 2rem; position: relative; top: auto!important; right: auto!important; left: auto!important; bottom: auto!important; font-size: 20px;}
    .circle .text-platform { text-align: left;}
    .circle .sub-title-platform { font-size: 18px; color: #a0a0a0; display: block;}
    .circle .items-platform::before { content: ''; display: block; width: 50px; height: 6px; background: #ccc; margin: 2rem auto;}
    .circle .items-platform.carshop::before { background: #f9872a;}
    .circle .items-platform.rental-car::before { background: #52a66c;}
    .circle .items-platform.maintenance::before { background: #3abfdc;}
    .circle .items-platform.export::before { background: #374ea3;}
    .circle .items-platform.lease::before { background: #e73e6e;}
    .circle .items-platform.auction::before { background: #e8420f;}
}
@media(max-width:630px) {

.topic-service br{ display:none;}
.content-purchace .font-13 br {
    display: none;
}

}
@media(max-width:576px) {
    .wrapper-service {padding: 0 1rem;}

    .font-38 {font-size: 30px;}

    /* TOPIC SERVICE */
    .topic-service {font-size: 18px;padding: 3rem 0rem;}

    /* CAR STATION */
    .car-station { padding: 0;}
    .content-car-station {padding: 5rem 0 5rem;}

    /* CAR PLATFORM */
    .car-platform { padding: 2rem 0 2rem; background-size: auto;}
    .car-platform .font-14.pt-5 { padding-top: 1rem;}
    .circle { padding: 4rem 0;}
    .circle .items-platform { padding: 2rem 0; font-size: 14px;}
    .circle .font-22 { font-size: 24px;}
    .title-platform { padding: 0.5rem 1rem;}

    
}