/*****************************************
commmon
*****************************************/
section{
    margin-top: 140px;
}
h2{
    font-size: 44px;
    font-weight: 900;
}


@media (max-width: 750px) {
    body{
        font-size: 14px;
    }
    section{
        margin-top: 80px;
    }
    h2{
        font-size: 1.9em;
        margin-bottom: 30px;
    }
}
@media (min-width: 751px) {
    h1,h2,h3{
    letter-spacing: 0.1rem;
    }
    body{
    font-size: 18px;
    }
}

/*****************************************
#header
*****************************************/
#header {
	background-color: #FFF;
}
#header .headWrap .shopname h2 {
	font-weight: bold;
    margin-bottom: 10px;
}
@media (max-width: 750px) {
	#header .headWrap .shopname {
        display: flex;
        justify-content: space-around;
        /* text-align: left; */
        padding: 10px 10px 0 10px;
	}
    #header .headWrap .shopname .logo{
        display: inline-block;
        width: 150px;
    }
	#header .headWrap .shopname h2 {
		font-size: 1.1rem;
        padding-top: 10px;
	}
    #header .headWrap .hidden_sp{
        display: none;
    }
    
}
@media (min-width: 751px) {
	#header {
		min-width: 1118px;
	}
    #header .headWrap{
        display: flex;
        justify-content: space-around;
        width: 90%;
        margin: 0 auto;
    }
	#header .headWrap .shopname {
		/* float: left; */
		display: table;
		text-align: left;
		padding: 10px 0 0;
        padding-top: 20px;
        padding-bottom: 10px;
	}
	#header .headWrap .shopname h1.logo {
        display: inline-block;
        width: 210px;
		display: table-cell;
		padding-right: 20px;
	}
	#header .headWrap .shopname h2 {
		display: table-cell;
		font-size: 1.4rem;
		vertical-align: middle;
	}
    #header .headWrap {
        text-align: right;
    }
	#header .headWrap .head_tel img{
        width: 70%;
        margin-right: 0;
		padding: 30px 0 0;
	}
}
/*****************************************
main
*****************************************/
@media (max-width: 750px) {
    .main_PC{
        display: none;
    }
    .main_SP img{
        width: 100%;
    }
}
@media (min-width: 751px) {
    .main_SP{
        display: none;
    }
    .main_PC img{
        width: 100%;
    }
}
/*****************************************
kaitorijisseki 
*****************************************/
.jisseki .slick_slider{
    display: flex;
    justify-content: space-between;
}
.jisseki .slick_slider .text{
    text-align: left;
}
.jisseki .slick_slider li .more{
    border:solid #a3a3a3 1px;
    border-radius: 50px;
    width: 100px;
    margin: 0 auto;
    margin-top: 10px;
}
.jisseki .slick_slider li .more a{
    color: #000;
    font-size: smaller;
}

@media (max-width: 750px) {
    .jisseki{
        width: 92%;
        margin: 0 auto;
        margin-top: 50px;
    }

    .jisseki .slick_slider .sp_hidden{
        display: none;
    }
    .jisseki .slick_slider .img img{
        width: 90%;
        border-radius: 5%;
    }
    .jisseki .slick_slider .text span{
        font-size: smaller;
    }
    .jisseki .slick_slider .text .carname{
        font-weight: bolder;
    }
    .jisseki .slick_slider .text .kakaku{
        color: #ff0000;
        font-size: 1.4em;
        font-weight: bold;
    }

}

@media (min-width: 751px) {
    .jisseki{
        width: 70%;
        margin: 0 auto;
        margin-top: 50px;
    }
    .jisseki h2{
        font-size: 40px;
        margin-bottom: 30px;
    }
    .jisseki .slick_slider{
        flex-wrap: wrap;
    }
    .jisseki .slick_slider li{
        width: 18.5%;
    }
    .jisseki .slick_slider .img img{
        width: 100%;
        border-radius: 5%;
    }
    .jisseki .slick_slider .text span{
        font-size: smaller;
    }
    .jisseki .slick_slider .text .carname{
        font-weight: bolder;
    }
    .jisseki .slick_slider .text .kakaku{
        color: #ff0000;
        font-size: 1.4em;
        font-weight: bold;
    }
}
/*****************************************
shinrai
*****************************************/
.shinrai .bk_red{
    background: linear-gradient(-40deg, #900000, #e50012);
}
.shinrai .bk_red .yakusoku .container {
    background-color: #FFF;
    border-radius: 20px;
}

@media (max-width: 750px) {
    .shinrai .bk_red{
        padding-top: 30px;
        padding-bottom: 60px;
    }
    .shinrai .yakusoku_ttl{
        position: relative;
        top: 20px;
    }
    .shinrai .yakusoku_ttl img{
        width: 80%;
    }
    .shinrai .bk_red .yakusoku span img{
        width: 140px;
        position: relative;
        top: 20px;
        right: 100px;
    }
    .shinrai .bk_red .yakusoku .container{
        width: 92%;
        margin: 0 auto;
    }
    .shinrai .bk_red .yakusoku .container h3{
        font-size: 1.3em;
        font-weight:900;
        padding: 30px 14px 10px 14px;
    }
    .shinrai .bk_red .yakusoku .container p{
        font-weight: 500;
        padding: 0 16px;
    }
    .shinrai .bk_red .yakusoku .container .pict img{
        height: 70px;
        width: 70px;
        margin: 10px 0;
    }
}

@media (min-width: 751px) {
    .shinrai .bk_red{
        padding-top: 60px;
        padding-bottom: 100px;
    }

    .shinrai .yakusoku_ttl{
        position: relative;
        top: 50px;
    }
    .shinrai .yakusoku_ttl img{
        width: 30%;
    }
    .shinrai .bk_red .yakusoku li span{
        display: block;
        width: 60%;
        margin: 0 auto;
        text-align: left;
    }
    .shinrai .bk_red .yakusoku span img{
        width: 200px;
        position: relative;
        top: 40px;
    }
    .shinrai .bk_red .yakusoku .container{
        width: 60%;
        margin: 0 auto;
    }
    .shinrai .bk_red .yakusoku .container h3{
        font-size: 1.6em;
        font-weight:900;
        padding: 40px 14px 10px 14px;
    }
    .shinrai .bk_red .yakusoku .container h3 br{
        display: none;
    }
    .shinrai .bk_red .yakusoku .container p{
        font-weight: 500;
        padding: 0 16px;
        font-size: 18px;
    }
    .shinrai .bk_red .yakusoku .container .pict img{
        height: 90px;
        width: 90px;
        margin: 10px 0;
    }
}
/*****************************************
about
*****************************************/
@media (max-width: 750px) {
.about .about_ttl{
    display: block;
    padding-top: 5px;
    padding-bottom: 4px;
    background: url(../img/about_ttl_img.png) no-repeat center right;
    background-size: auto 100%;
    background-position: 110%;
    margin-bottom: 30px;
}
.about .about_ttl h2{
    margin-top: 30px;
}
.about .about_ttl h2 span{
    display: inline-block;
    background: linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(221,238,255) 10%, rgba(0,0,0,0) 80%);
    font-size: 18px;
    font-weight: 900;  
}

.about .about_list li .wrapper{
    display: flex;
    border-bottom: solid 1px #666666;
    border-top: solid 1px #666666;
    margin-bottom: 50px;
}
.about .about_list li .reverse{
    flex-direction: row-reverse;
}

.about .about_list li .wrapper .img img{
    width: 160px;
    height: 100%;
    object-fit: cover;
    object-position: right;
}
.about .about_list li .reverse .img img{
    object-position: left;
}
.about .about_list li .wrapper .container{
    padding-right: 10px;
    padding-bottom: 10px;
}
.about .about_list li .reverse .container{
    padding-right: 0px;
    padding-left: 10px;

}
.about .about_list li .wrapper h3{
    font-size: 1.3em;
    font-weight:900;
    padding: 10px 0px 10px 0px;    
}
.about .about_list li .wrapper h3 span{
    color: #004fb9;
    font-weight:900;
}
}


@media (min-width: 751px) {
.about .about_ttl{
    display: block;
    padding-top: 50px;
    padding-bottom: 50px;
    background: url(../img/about_ttl_img.png) no-repeat center right;
    background-size: auto 100%;
    background-position: 80%;
    margin-bottom: 100px;
}
.about .about_ttl h2{
    margin-top: 30px;
}
.about .about_ttl h2 span{
    display: inline-block;
    background: linear-gradient(to right,rgba(0,0,0,0) 0%,rgba(221,238,255) 10%, rgba(0,0,0,0) 90%);
    font-size: 24px;
    font-weight: 900;  
}

.about .about_list li .wrapper{
    width: 60%;
    margin: 0 auto;
    display: flex;
    border: solid 1px #666666;
    border-radius: 20px;
    margin-bottom: 50px;
}
.about .about_list li .reverse{
    flex-direction: row-reverse;
}

.about .about_list li .wrapper .img img{
    width: 300px;
    height: 100%;
    object-fit: cover;
    object-position: right;
    border-radius: 20px 0 0 20px;
}
.about .about_list li .reverse .img img{
    object-position: left;
    border-radius: 0 10px 10px 0;
}
.about .about_list li .wrapper .container{
    padding-right: 10px;
    padding-bottom: 10px;
}
.about .about_list li .reverse .container{
    padding-right: 0px;
    padding-left: 10px;

}
.about .about_list li .wrapper h3{
    font-size: 1.8em;
    font-weight:900;
    padding: 50px 0px 30px 0px;    
}
.about .about_list li .wrapper h3 br{
    display: none;
}

.about .about_list li .wrapper h3 span{
    color: #004fb9;
    font-weight:900;
}
}
/*****************************************
point
*****************************************/
.point{
    background: linear-gradient(to bottom,rgba(255, 255, 255, 0) 0%,rgba(221,238,255) 10%); 
    padding-bottom: 100px;   
}
@media (max-width: 750px) {
.point{
    padding-bottom: 50px;
}    
.point .point_ttl{
    display: block;
    height: 100px;
    background: url(../img/point_ttl_img.png)no-repeat center right;
    background-size: auto 100%;
    background-position: 80%;
}
.point .point_li{
    width: 90%;
    margin: 0 auto;
}
.point .point_li li h3{
        display: inline-block;
        border-bottom: dotted 3px #1c89e2;
        font-size: 1.3em;
        font-weight:900;
        /* padding: 40px 0px 3px 0px; */
        margin-bottom: 20px;
}
.point .point_li li .txt{
    text-align: left;
    margin-bottom: 40px;
}
.point .point_li li .txt .item{
    display: flex;
    justify-content: space-around;
}
.point .point_li li .txt .item li .cercle{
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: #004fb9;
    color: #FFF;
    margin-top: 20px;
}
.point .point_li li .txt .item li .cercle p{
        font-size: 1.2em;
        font-weight:900;
        text-align: center;
        padding-top: 28px;
}
.point .point_li li .sp_hidden{
    display: none;
}
}

@media (min-width: 751px) {
.point .point_ttl{
    display: block;
    height: 150px;
    background: url(../img/point_ttl_img.png)no-repeat center right;
    background-size: auto 100%;
    background-position: 80%;
}
.point .point_li{
    width: 60%;
    margin: 0 auto;
}
.point .point_li li h3{
        display: inline-block;
        border-bottom: dotted 3px #1c89e2;
        font-size: 1.8em;
        font-weight:900;
        /* padding: 40px 0px 3px 0px; */
        margin-bottom: 20px;
}
.point .point_li li .txt{
    text-align: center;
    margin-bottom: 100px;
}
.point .point_li li .txt .item{
    width: 70%;
    margin: 0 auto;
    display: flex;
    justify-content: space-around;
}
.point .point_li li .txt .item li .cercle{
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background-color: #004fb9;
    color: #FFF;
    margin-top: 50px;
}
.point .point_li li .txt .item li .cercle p{
        font-size: 1.6em;
        font-weight:600;
        text-align: center;
        padding-top: 52px;
}
.point .point_li li .sp_hidden{
    display: flex;
    justify-content: space-between;
    margin-top: 50px;

}
.point .point_li li .sp_hidden img{
    width: 28vw;
    box-shadow: 10px 10px 15px -10px;
}
}

/*****************************************
footer
*****************************************/
@media (max-width: 750px) {
footer .info_wrapper{
    height: 120px;
        /* background: linear-gradient(to right,rgba(0,45,185,) 0%,rgba(255, 255, 255, 0) 90%);  */
    background:linear-gradient(to right, rgba(1, 64, 136, 0.8), rgba(255, 255, 255, 0)30%), url(../img/footer_bk.jpg)no-repeat right;
    background-size: 200%;
    margin-bottom: 180px;
}
footer .info_wrapper .white{
    width: 100%;
    position: relative;
    top: 120px;
    background-color: rgba(255, 255, 255, 0.8);
    height: 180px;
}
footer .info_wrapper .white .info{
    text-align: left;
    width: 80%;
    margin: 0 auto;
    padding: 20px 0;
}
footer .info_wrapper .info h2{
    margin-bottom: 10px;
}
footer .info_wrapper .info p{
    font-size: 0.9em;
}
footer .info_wrapper .info h2 img{
    width: 60vw;
}
footer .bottom{
    background: linear-gradient(to right,#002db9, #004fb9 30%,#002c77 70%);
    color: white;
}
footer .bottom .privacy{
    display: flex;
    justify-content: space-around;
    padding: 10px 50px 2px 50px;
}
footer .bottom .privacy a p{
    color: #FFF;
    font-size: 0.9em;
}
footer .bottom .copyright{
    font-size: 0.8em;
    padding-bottom: 40px;
    margin-bottom: 45px;
}
footer .pc_hidden {
    display: flex;
    position: fixed;
    bottom: 0;
    z-index: 1;
}
footer .pc_hidden img{
    width: 100%;
    height: auto;
}
}




@media (min-width: 751px) {
footer .info_wrapper{
    height: 300px;
        /* background: linear-gradient(to right,rgba(0,45,185,) 0%,rgba(255, 255, 255, 0) 90%);  */
    background:linear-gradient(to right, rgba(1, 64, 136, 0.8), rgba(255, 255, 255, 0)50%), url(../img/footer_bk.jpg)no-repeat right;
    background-size: cover;
}
footer .info_wrapper .white{
    width: 480px;
    position: relative;
    top: 40px;
    margin-left: 200px;
    background-color: rgba(255, 255, 255, 0.8);
    height: 210px;
}
footer .info_wrapper .white .info{
    text-align: left;
    width: 80%;
    margin: 0 auto;
    padding: 20px 0;
}
footer .info_wrapper .info h2{
    margin-bottom: 10px;
}
footer .info_wrapper .info p{
    font-size: 0.9em;
}
footer .info_wrapper .info h2 img{
    width: 60%;
}
footer .bottom{
    background: linear-gradient(to right,#002db9, #004fb9 30%,#002c77 70%);
    color:#FFF;
    display: flex;
    justify-content: space-around;
    padding: 6px 0;
}
footer .bottom .privacy{
    display: flex;
    justify-content: space-around;
    gap: 50px;
}
footer .bottom .privacy a p{
    color: #FFF;
    font-size: 0.9em;
}
footer .bottom .copyright{
    font-size: 0.8em;
    padding-bottom: 5px;
}
footer .pc_hidden{
    display: none;
}
}