﻿.bg_color1 {
    background-color: #4797bd;
}
.bg_color3 {
    background-color: #4797bd;
}
.border_color4 {
    border-color: #4797bd;
}
#top_cms .bg_color1 {
    background-color: #f57f40;
}
#top_cms .box_txt1{
    background-color: #4797bd;
}
.txt_color1 {
    color: #4797bd;
}
#contents2 .cate_box{
    background-color: #4797bd;
} 
#contents2 .box_txt1{
    color: white;
    font-size: 18px;
}
.border_color1 {
    border-color: #4797bd;
}
.truck_illust1{
    width: 200px;
    transform: translate(743px, 114px);
}
.truck_illust2{
    width: 200px;
    transform: translate(21px, 101px);
}
#f_contact .hover_box{
    background-color: #f57f40;
}
#top_info .after{
    background-color: #f57f40;
}
#header .grid_3 {
    width: 8%!important;
}
#footer .width_300-max {
    width: 100%;
    max-width: 150px;
}
#top_cms_3 .square_img img{
    position: absolute;
    top: 50%;
    left: 75%;
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
#intro .letter_1 {
    letter-spacing: -1px;
}
#cms_2-d img{
    width: 50%;
}
#header .grid_9 {
    width: 75%;
    transform: translateX(-105px);
}
#logo{
    transform: translateX(70px);
}
#page3 .cate{
    margin-top: -150px;
    padding-top: 150px;
}
#page4 .cate{
    margin-top: -150px;
    padding-top: 150px;
}
#page6 .cate{
    margin-top: -150px;
    padding-top: 150px;
}

/*タブレット*/
@media screen and (max-width: 768px){
        #main_img .txt {
        left: 14vw
    }
        #main_img .txt {
        z-index: 10;
        top: 13%;
        left: 10vw;
    }
    #main_img h2 {
        font-weight: 700;
        line-height: 1.15;
        letter-spacing: 8.02em;
        font-size: 6.472222vw;
    }
    #header .grid_3 {
        width: 33%!important;
        transform: translateX(40px);
    }
    #footer .width_300-max {
        width: 100%;
        max-width: 100px;
    }
    #f_contact .bg_color3 {
    background-color: #f57f40;
}
    #footer .txt_center{
        letter-spacing: 0.19em;
    }
    .truck_illust1{
        width: 150px;
        transform: translate(255px, 108px);
}
    #logo {
    transform: translateX(-5px);
}
    .more_bt a:hover {
        color: #fff;
    }
    #page3 .cate{
    margin-top: -150px;
    padding-top: 150px;
}
#page4 .cate{
    margin-top: -150px;
    padding-top: 150px;
}
#page6 .cate{
    margin-top: -150px;
    padding-top: 150px;
}
}





/*スマホ*/
@media screen and (max-width: 667px){
        .truck_illust1{
        width: 85px;
        transform: translate(137px, 1030px);
}
    .truck_illust2{
        width: 90px;
        transform: translate(9px, 101px);
}
    #main_img .txt {
        left: 45px;
}
    #main_img .txt {
        z-index: 10;
        top: 13%;
        left: 10vw;
}
    #main_img h2 {
        font-weight: 700;
        line-height: 1.15;
        letter-spacing: 5.02em;
        font-size: 8.472222vw;
}
    #logo {
    transform: translateX(-30px);
}
    .letter_3_sp {
        letter-spacing: 2px;
    }
        #intro .letter_1 {
    letter-spacing: 0px;
}
    #footer .txt_center{
            letter-spacing: 0.19em;
        }
    #footer .width_300-max {
    width: 100%;
    max-width: 70px;
}
    #contents1 .font_30{
        margin-top: -100px;
    }
    .load_logo {
    width: 35%;
}
    .more_bt a:hover {
    color: #fff;
}
#page3 .cate{
    margin-top: -50px;
    padding-top: 50px;
}
#page4 .cate{
    margin-top: -50px;
    padding-top: 50px;
}
#page6 .cate{
    margin-top: -50px;
    padding-top: 50px;
}
}





/*スマホ*/
@media screen and (max-width: 375px){
    .truck_illust1{
    width: 85px;
    transform: translate(130px, 1005px);
}
    .truck_illust2{
        width: 90px;
        transform: translate(9px, 101px);
}
    #intro .letter_1 {
    letter-spacing: -1px;
}
    #f_contact .con_txt{
            letter-spacing: 0.03em;
        }
      #page3 .cate{
    margin-top: -80px;
    padding-top: 80px;
}
#page4 .cate{
    margin-top: -80px;
    padding-top: 80px;
}
#page6 .cate{
    margin-top: -80px;
    padding-top: 80px;
}  
}


