@charset "utf-8";
/* CSS Document */

/* ----------------------------------------------------- */
/* #search_car  */
/* ----------------------------------------------------- */

@media screen and (max-width: 880px) {
#search_car article dl dt span{
    width:40%;

}
}

@media screen and (max-width: 630px) {
#search_car article dl dt span{
    width:60%;

}
}


@media screen and (max-width: 480px) {
#search_car article dl dt span{
    width:75%;

}
}

@media screen and (max-width: 442px) {
#search_car article dl dt img{
    display:none;
}
#search_car article dl dt span{
    width:100%;
    margin-bottom:2px;

}
}





/* -------------------------------- */

@media screen and (max-width: 1590px) {

#search_car article{
    width:80%;
}
}

@media screen and (max-width: 1245px) {

#search_car article{
    width:90%;
}
}

@media screen and (max-width: 1018px) {

#search_car article{
    width:95%;
}
}


/* --------------------------------------*/

@media screen and (max-width: 990px) {

#search_car article dl dd ul {
    width: 100%;
}
}


@media screen and (max-width: 871px) {

#search_car article dl dd ul.bodytype{
    width:80%;   
}
}

@media screen and (max-width: 941px) {
#search_car article dl dd ul.bodytype li img {
    height: 45px;
}

}
@media screen and (max-width: 868px) {

#search_car article dl dd ul.bodytype{
    width:90%;   
}

#search_car article dl dd ul.bodytype li img {
    height: 55px;
}
#search_car article dl dd ul.bodytype li{
    margin-right:25px;
    margin-bottom:15px;
}
}

@media screen and (max-width: 602px) {
#search_car article dl dd ul.bodytype{
    width:100%;   
}

}

@media screen and (max-width: 543px) {
#search_car article dl dd ul.bodytype li img {
    height: 45px;
}

}

@media screen and (max-width: 506px) {

#search_car article dl dd ul.bodytype li:last-child{
   display:block;
   margin:0 auto;
   height:auto;
   font-size:14px;
}


#search_car article dl dd ul.bodytype li:last-child a{
   padding:25px 0;

}

}

@media screen and (max-width: 480px) {

#search_car article dl dd ul.bodytype{
   display: flex;
   flex-wrap: wrap; /* 溢れたら勝手に次の行へ */
   justify-content: flex-start; /* 左詰め */
}

   
#search_car article dl dd ul.bodytype li{
   width:45%;
   border:1px solid #999;
   border-radius:4px;
   margin-right:20px;
   display:block;
   justify-content: space-between;
}

#search_car article dl dd ul.bodytype li:nth-child(even){
   margin-right:0px;
}



#search_car article dl dd ul.bodytype li:last-child{
   width:100%;
   border:1px solid #CCC;
}
}


/* ------------------------------------------ */

@media screen and (max-width: 916px) {

#search_car article dl dd ul.bland,#search_car article dl dd ul.bland2{
    width:90%;
    padding:0 35px;

}

#search_car article dl dd ul.bland li img,#search_car article dl dd ul.bland2 li img{
   height:65px;

}

#search_car article dl dd ul.bland li,#search_car article dl dd ul.bland2 li{

   margin:0 30px 15px 0;
}
}

@media screen and (max-width: 638px) {

#search_car article dl dd ul.bland li img,#search_car article dl dd ul.bland2 li img{
   height:60px;

}
#search_car article dl dd ul.bland li,#search_car article dl dd ul.bland2 li{

   margin:0 25px 15px 0;
}
}

@media screen and (max-width: 588px) {

#search_car article dl dd ul.bland li img,#search_car article dl dd ul.bland2 li img{
   height:55px;

}
#search_car article dl dd ul.bland li,#search_car article dl dd ul.bland2 li{

   margin-right:20px;
}
}
@media screen and (max-width: 533px) {

#search_car article dl dd ul.bland li img,#search_car article dl dd ul.bland2 li img{
   height:50px;

}
#search_car article dl dd ul.bland li,#search_car article dl dd ul.bland2 li{

   margin-right:15px;
}
}
@media screen and (max-width: 506px) {

#search_car article dl dd ul.bland,#search_car article dl dd ul.bland2{
    width:100%;
    padding:0;
    border:0;
}


#search_car article dl dd ul.bland li:last-child,#search_car article dl dd ul.bland2 li:last-child{
   display:block;
   margin:0 auto 15px auto;
   height:auto;
   width:100%;
   font-size:14px;
}


#search_car article dl dd ul.bland li:last-child a,#search_car article dl dd ul.bland2 li:last-child a{
   padding:25px 0;

}

#search_car article dl dd ul.bland li:last-child br,#search_car article dl dd ul.bland2 li:last-child br{
    display:none;

}
}

@media screen and (max-width: 480px) {

#search_car article dl dd ul.bland,#search_car article dl dd ul.bland2{
   display: flex;
   flex-wrap: wrap; /* 溢れたら勝手に次の行へ */
   justify-content: flex-start; /* 左詰め */

}

   
#search_car article dl dd ul.bland li,#search_car article dl dd ul.bland2 li{
   width:29%;
   border:1px solid #999;
   border-radius:4px;
   margin-right:15px;
   display:block;
   justify-content: space-between;
}


#search_car article dl dd ul.bland li:nth-child(3),
#search_car article dl dd ul.bland2 li:last-child(3),
#search_car article dl dd ul.bland li:nth-child(6),
#search_car article dl dd ul.bland2 li:last-child(6),
#search_car article dl dd ul.bland li:nth-child(9),
#search_car article dl dd ul.bland2 li:last-child(9){
   margin-right:0px;

}



#search_car article dl dd ul.bland li:last-child,#search_car article dl dd ul.bland2 li:last-child {
   width:100%;
   border:1px solid #CCC;
}
}

@media screen and (max-width: 427px) {

#search_car article dl dd ul.bland li,#search_car article dl dd ul.bland2 li{
   margin-right:10px;
}


}

/* ------------------------------------------ */

@media screen and (max-width: 898px) {


#search_car article dl dd ul.bodycolor{
   width:80%;

}

#search_car article dl dd ul.bodycolor li{
   margin-right:25px;
   line-height:2.8em;
   margin-bottom:15px;
}


#search_car article dl dd ul.bodycolor li span{
   font-size:65px;

}
#search_car article dl dd ul.bodycolor li:last-child{
   margin-top:-40px;

}
#search_car article dl dd ul.bodycolor li:last-child a{
   padding-top:15px;
}
}

@media screen and (max-width: 781px) {

#search_car article dl dd ul.bodycolor li{
   margin-right:20px;

}
}

@media screen and (max-width: 742px) {

#search_car article dl dd ul.bodycolor{
   width:90%;
}

#search_car article dl dd ul.bodycolor li{
   margin-right:15px;
}

}

@media screen and (max-width: 626px) {
#search_car article dl dd ul.bodycolor{
   width:80%;
}


#search_car article dl dd ul.bodycolor li:last-child a{
   margin-right:20px;
}

}


@media screen and (max-width: 507px) {

#search_car article dl dd ul.bodycolor{ 
   width:100%;
}

#search_car article dl dd ul.bodycolor li{
   margin-right:25px;
}

#search_car article dl dd ul.bodycolor li:last-child{
   display:block;
   margin:0 auto;
   height:auto;
   font-size:14px;
}


#search_car article dl dd ul.bodycolor li:last-child a{
   padding:10px 0 !important;

}
}

@media screen and (max-width: 480px) {

#search_car article dl dd ul.bodycolor{
   display: flex;
   flex-wrap: wrap; /* 溢れたら勝手に次の行へ */
   justify-content: flex-start; /* 左詰め */

}

   
#search_car article dl dd ul.bodycolor li{
   width:20%;
   border:1px solid #999;
   border-radius:4px;
   margin-right:15px;
   display:block;
   justify-content: space-between;
}


#search_car article dl dd ul.bodycolor li:nth-child(4),
#search_car article dl dd ul.bodycolor li:nth-child(8){

   margin-right:0px;

}
#search_car article dl dd ul.bodycolor li span{
   padding-top:15px;
}


#search_car article dl dd ul.bodycolor li:last-child {
   width:100%;
   border:1px solid #CCC;
}
#search_car article dl dd ul.bodycolor li:last-child a{
   padding-top:0;
   margin-top:0;
}
}

@media screen and (max-width: 349px) {
#search_car article dl dd ul.bodycolor li span{
   font-size:50px;

}


}

/* ------------------------------------*/

@media screen and (max-width: 912px) {

#search_car article dl dd ul.monthly_fee li{
   margin-right:25px;
   margin-bottom:15px;

}
#search_car article dl dd ul.monthly_fee li a{
   padding:20px 40px 40px 40px;
}

#search_car article dl dd ul.monthly_fee li:last-child{
   margin-top:30px;
}
}
@media screen and (max-width: 634px) {

#search_car article dl dd ul.monthly_fee li a{
   padding: 20px 20px 40px 20px;
}


}

@media screen and (max-width: 508px) {

#search_car article dl dd ul.monthly_fee{
   width:100%;

}
#search_car article dl dd ul.monthly_fee li {
   margin-right: 20px;
}

}

@media screen and (max-width: 506px) {

#search_car article dl dd ul.monthly_fee li:last-child{
   display:block;
   margin:0 auto;
   height:auto;
   font-size:14px;
}


#search_car article dl dd ul.monthly_fee li:last-child a{
   padding:25px 0;

}
}

@media screen and (max-width: 480px) {


#search_car article dl dd ul.monthly_fee{
   width:100%;
   display: flex;
   flex-wrap: wrap; /* 溢れたら勝手に次の行へ */
   justify-content: flex-start; /* 左詰め */

}
#search_car article dl dd ul.monthly_fee li:last-child{
   margin-top:0px;
   width:100%;
}

#search_car article dl dd ul.monthly_fee li:last-child a{
   padding:25px 0;
}
   
#search_car article dl dd ul.monthly_fee li{
   width:45%;
   border:1px solid #999;
   border-radius:4px;
   margin-right:20px;
   display:block;
   justify-content: space-between;
}

#search_car article dl dd ul.monthly_fee li:nth-child(even){
   margin-right:0px;
}
}

@media screen and (max-width: 315px) {
#search_car article dl dd ul.monthly_fee li span{
   display:block;
   border:0;
   padding-bottom: 0;
}
#search_car article dl dd ul.monthly_fee li a {
        padding: 20px 20px 20px 20px;
}

}


/* ------------------------------------*/
/*
@media screen and (max-width: 630px) {

#search_car article dl.keyword dt{
   display:block !important;
   margin:0 auto 10px auto;
   width:100%;

}
#search_car article dl.keyword dd{
   display:block !important;
   margin:0 auto 10px auto;
   width:100%;

}

}*/

@media screen and (max-width: 630px) {
    /* 1. 親要素の並ぶ向きを「横」から「縦」に変更 */
    #search_car article dl.keyword {
        flex-direction: column; 
        align-items: flex-start; /* 左寄せにする */
        padding-top: 20px;
        border:0;
    }

    /* 2. ラベル（dt）を横いっぱいに広げる */
    #search_car article dl.keyword dt {
        flex: 0 0 100%; /* flexの幅指定を100%に */
        width: 100%;
        margin: 0 0 15px 0; /* 下に隙間を作る */
    }

    /* 3. 入力エリア（dd）を横いっぱいに広げる */
    #search_car article dl.keyword dd {
        width: 100%;
        flex: 0 0 100%;
    }

    /* 4. フォームの中身（検索ボックスとボタン）の調整 */
    #search_car article dl.keyword dd form {
        flex-direction: row; /* ボックスとボタンは横並びをキープ */
        width: 100%;
    }

    #search_car article dl.keyword dd input.txt_box {
        width: 70%; /* 検索窓の幅 */
        margin-right: 5px; /* ボタンとの隙間を詰める */
    }

    #search_car article dl.keyword dd input.search_btn {
        width: 30%; /* ボタンの幅 */
        font-size: 16px; /* スマホ用に少し小さく */
    }
}

/* さらに狭い時（480px以下など）の微調整 */
@media screen and (max-width: 480px) {
    #search_car article dl.keyword dd form {
        flex-direction: column; /* 480px以下なら検索窓とボタンも縦に並べる */
    }
    #search_car article dl.keyword dd input.txt_box {
        width: 100%;
        margin-bottom: 10px;
        margin-right: 0;
    }
    #search_car article dl.keyword dd input.search_btn {
        width: 100%;
    }

    #search_car article dl.keyword dt span{
        width:100%;
        border-bottom:2px solid #FFF;
        padding:0 0 2px 0;
        
    }

}







/* ------------------------------------*/

/*


@media screen and (max-width: 915px) {
#search_car article dl dd ul.bland li {
    margin-right: 20px;
}
#search_car article dl dd ul.bland2 li {
    margin-right: 15px;
}
}

@media screen and (max-width: 900px) {
#search_car article dl dd ul.bodycolor li {
    margin-right: 10px;
}
#search_car article dl dd ul.monthly_fee li {
    margin-right: 15px;
}

#search_car article dl dd ul.monthly_fee li a {
    padding: 20px 15px 40px 15px;
}
#search_car article dl dd ul.monthly_fee li:last-child{
    padding: 10px 8px 0 0;
}
}
*/








/* ----------------------------------------------------- */
/*  #stockcars    */
/* ----------------------------------------------------- */


@media screen and (max-width: 1405px) {

#stockcars ol#clist li {
    width: 30% !important;
}


}

@media screen and (max-width: 1058px) {

#stockcars ol#clist li {
    width: 28% !important;
}


}


/* --- 1024px以下（タブレット・小さめのPC）：2列にする --- */
@media screen and (max-width: 1024px) {
    #stockcars ol#clist {
        margin-right: -4% !important; /* 隙間をパーセントで制御 */
        padding-left: 20px !important;
    }
    #stockcars ol#clist li {
        width: 45% !important; /* 2列 */
        margin-right: 4% !important;
        margin-bottom: 20px !important;
    }
}




/* --- 600px以下（スマホ）：1列にする --- */
@media screen and (max-width: 685px) {
    #stockcars ol#clist {
        margin-right: 0 !important; /* マイナスマージン解除 */
        padding: 0 !important;
        text-align: center !important;
    }
    #stockcars ol#clist li {
        width: 100% !important; /* 1列 */
        margin-right: 0 !important;
        display: block !important; /* blockに戻して計算を放棄 */
        margin: 0 auto 20px auto !important;
    }
    
    /* スマホでは Anton のフォントサイズを少し落とす（はみ出し防止） */
    #stockcars ol#clist li p.price strong {
        font-size: 28px !important;
    }
}


/* ------------------------------- */
/* #stockcars btn_carlist */

@media screen and (max-width: 1527px) {

#stockcars p.btn_carlist{
    width:45%;

}
}

@media screen and (max-width: 890px) {

#stockcars p.btn_carlist{
    width:65%;

}
}


@media screen and (max-width: 660px) {

#stockcars p.btn_carlist{
    width:100%;

}
}

@media screen and (max-width: 470px) {
#stockcars p.btn_carlist{
     font-size: 25px;
}
}

@media screen and (max-width: 374px) {
#stockcars h2{
    font-size: 24px !important;
}
#stockcars h2 span{
      padding-top:25px;
      font-size: 17px;
}
}


@media screen and (max-width: 326px) {
#stockcars p.btn_carlist a {
     padding: 15px 0;
}
}

/* ----------------------------------------------------- */
/*  #banners    */
/* ----------------------------------------------------- */

@media screen and (max-width: 573px) {
#banners p{
   margin-right:20px;
}
#banners p img{
   width:auto;
   height:80px;

}
}

@media screen and (max-width: 470px) {
#banners{
   padding: 30px 0;
}
#banners p img{
   width:auto;
   height:60px;

}

}

@media screen and (max-width: 352px) {

#banners{
   padding: 20px 0;
}

#banners p img{
   width:auto;
   height:50px;

}
}


/* ----------------------------------------------------- */
/* #news */
/* ----------------------------------------------------- */

@media screen and (max-width: 1200px) {
#news article {
    width: 95%;
}
}

@media screen and (max-width: 1095px) {

#news article .left_ico {
  width: 20%

}
#news article p {
  width: 90%;
}
}

@media only screen and (max-width: 990px) {
#news article .left_ico {

    padding-top: 20px;
}
}

@media only screen and (max-width: 950px) {

#news article .left_ico {
    display: none;

}
#news article ul {
    width: 98%;
    float:none;
    margin:0 auto 10px auto;


}
}

@media only screen and (max-width: 729px) {

#news {
    position: relative;
    top: 50px;
}
}

@media only screen and (max-width: 620px) {

#news article ul li h3.title{
   display:block;
    margin: 0 auto 0 10px;
}
}




@media screen and (max-width: 590px) {
#news{
   padding-top:0;
}

#news h3{
   font-size:30px;

}
}


@media screen and (max-width: 480px) {

#news article ul{
 width:95%;

}
#news article ul li{
  width:100%;
}
#news article ul li time{
   margin-left:0;
}
#news article ul li h3.title{
   margin-left:0;
}
}

@media screen and (max-width: 320px) {
#news article ul li time{
  padding: 4px 15px;
}

#news article ul li h3.title{
  margin:0;
}
}


/* --------------------------- */

@media only screen and (max-width: 1576px) {

#news article.expectation{
    width: 80%;
}
}

@media only screen and (max-width: 1186px) {
#news article.expectation ul li{
    width: 45%;
}
}
@media only screen and (max-width: 986px) {
#news article.expectation {
    width: 90%;
}
}

@media only screen and (max-width: 798px) {
#news article.expectation {
    width: 95%;
}
}
#news article.expectation ul li:before{
   content:"●";

}
}


@media only screen and (max-width: 710px) {
#news article.expectation li {
    width: 98%;
    margin-bottom:10px;
}
}

@media only screen and (max-width: 680px) {
#news article.expectation ul li{
    width:98%;
    margin:0 auto 10px 0;
    padding:0;
}
}


@media only screen and (max-width: 520px) {

#news article.expectation li{
    width:98%;
}
}

/* ----------------------------------------------------- */
/*  #mother    */
/* ----------------------------------------------------- */

@media only screen and (max-width: 1200px) {
#mother img{
   width:75%;

}
}

@media only screen and (max-width: 980px) {
#mother img{
   width:85%;

}
}


@media only screen and (max-width: 860px) {
#mother img{
   width:90%;

}
}

@media only screen and (max-width: 700px) {
#mother img{
   width:95%;

}
}

/* ----------------------------------------------------- */
/*  #cm    */
/* ----------------------------------------------------- */

@media only screen and (max-width: 1300px) {

#cm ul.cm_wrapper{
   width:80%;
}
}
@media only screen and (max-width: 1200px) {
#cm p{
    width:45%;
}
}

@media only screen and (max-width: 900px) {
#cm ul.cm_wrapper{
   flex-direction: column;

}
#cm p{
    width:65%;
}
}


@media only screen and (max-width: 640px) {

#cm p{
    width:80%;
}
#cm p a{
   padding:15px 0;

}
}

@media only screen and (max-width: 480px) {

#cm ul.cm_wrapper{
   width:85%;
}
#cm p{
    width:85%;
}

}

@media only screen and (max-width: 350px) {

#cm p br{
   display:block;
}

#cm p span{
   display:none;
}
#cm p a {
   padding:5px 0;
}
}