div#panel_box {
    background: #d6d6d6;
    padding: 25px;
}
#panel_box_in{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-around;
    align-items:center;
}
#searchBt{
    background-color: #0071ad;
    color: #FFF;
    display: block;
    padding: 5px 14px;
    border-radius: 2px;
    text-align: center;
}
div#panel_box select {margin:3px 0;border: 1px solid #bcbcbc;border-radius: 3px;font-size: 16px;line-height: 1.8;padding: 7px;}

h2#page_TT { font-size:24px; }
h2#page_TT span{
    color: #e7151b;
    font-size: 27px;
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: bold;
}
.page_area.clearfix {
    position: relative;
    display: flex;
    align-items: center;
    margin: 10px 0 0;
}
.page_area .page_number {
    text-align:center;
    margin: 0 0 0 auto;
}

a.page {
    width: 30px;
    height: 30px;
    display: inline-block;
    background: #d6d6d6;
    color: #000;
    text-align: center;
    line-height: 30px;
}

a.page.page_sel {
    background: #000;
    color: #FFF;
}

p {}

.page_area p {
    right: 0;
    font-size: 14px;
    bottom: 0;
    text-align:right;
    top: -7px;
    position: relative;
}
.sort_bt{
    text-align: right;
}
.sort_bt a{ color: #000;}
/*  text result */

.result {display: block;float: left;font-size: 13px;font-weight: bold;}
.result strong {margin-right: 8px;margin-right: 5px;font-size: 22px;}

/* item car */
.item-car{
    margin: 10px 0 22px 0;
}
.item-car ul {display: flex;flex-wrap: wrap;width: 100%;}
.item-car ul li {display: block;width: 100%;position: relative;padding: 10px;display: flex;border: 1px solid #bcbcbc;margin: 0 0 15px;cursor: pointer;}

.tag{position:absolute;top: 0px;left: 0;z-index: 9;}
.item-car .images-item {position: relative;width: 245px;}
.item-car .images-item .tag {width: 50px; position: absolute; top: 8px; left: -12px;  }
.item-car .images-item .tag-red { background: url(../images/usedcar-list/ribbon-red.png) no-repeat top left; width: 50px; height: 23px; background-size: contain; color: #fff; font-weight: 300; font-size: 12px; text-align: center; display: inline-block; padding: 2px 8px 2px 4px; margin: 0 0 5px;}
.item-car .images-item .tag-pink { background: url(../images/usedcar-list/ribbon-pink.png) no-repeat top left; width: 59px; height: 23px; background-size: contain; color: #fff; font-weight: 300; font-size: 12px; text-align: center; display: inline-block; padding: 2px 8px 2px 4px; }
.item-car .name-item {/* text-align: center; */padding: 4px 10px;display: block;font-size: 15px;font-weight: 900;background: #d6d6d6;margin-bottom: 10px;}
.item-car .name-item strong {font-size: 19px;}

.item-car .detail-car {display: flex;flex-wrap: wrap;width: 100%;}
.item-car .detail-car > div {display: block;width: 14.5%;padding: 0 0 0.3rem;border: solid #bcbcbc;border-width: 1px 1px 1px 0;text-align: center;font-size: 12px;/* color: #878686; */line-height: 1.2;}
.item-car .detail-car > div:first-child {width: 27.5%;}
.item-car .detail-car > div span{ font-size:10px;}
.item-car .detail-car > div > p {background: #a0a0a0;padding: 5px 0;margin: 0 0 0.3rem;}
.item-car .detail-car div:first-child {border-left: 1px solid #b7b7b7;}
.item-car .detail-car strong {display: block;color: #000;font-size: 14px;/* font-weight: bold; */margin: 15px 0 0;}
.item-car .detail-car strong small { display: inline-block; font-size: 12px;}
.item-car .detail-car > span {display: block;color: #000;font-size: 12px;}


.detail-car-btm {
    display: flex;
    justify-content: space-between;
    margin: 10px 0 0 0;
}
.item-car .data-item-box{/* display: flex; */padding: 0 0px 0px 15px;width: calc( 100% - 245px );}
.item-car .data-item {/* background: url(../images/bg-patten-blue.jpg); */padding: 8px;text-align: left;font-size: 12px;width: 50%;/* justify-content: space-around; */background-size: auto auto;background-color: rgba(255, 255, 255, 1);background-image: repeating-linear-gradient(90deg, transparent, transparent 2px, rgba(240, 247, 252, 1) 2px, rgba(240, 247, 252, 1) 4px );}
.item-car .data-item span {display: block;/* text-align: center; */}

.item-car .price-item {display: flex;text-align: right;font-size: 17px;font-weight: 900;color: #ff0024;padding: 9px 11px 0;letter-spacing: 0px;margin: auto;align-items: center;flex-wrap: wrap;/* width: 178px; */border: none !important;}
.item-car .price-item small {font-size: 15px;font-weight: 500;color: #e7151b;/* background: #e5e5e5; */padding: 3px;display: block;text-align: left;width: 100%;font-weight: bold;}
.item-car .price-item p{color:#e7151b;font-size: 35px;text-align: right;width: 100%;font-family: 'Roboto Condensed', sans-serif;}
.item-car .price-item p .en_tani{color: #000000;font-size:18px;margin-left:3px;}


.store_info{color: #4d2b17;display:flex;flex-wrap:wrap;align-items: baseline;font-size: 14px;line-height: 1.2;font-weight: bold;margin: 13px 0 0;}
.store_info p:first-child{font-size: 28px;font-family: 'Roboto Condensed', sans-serif;}
.store_info p{margin: 0 13px 0 0;}


/*---------------sort---------------*/
.sort-search{/* font-size: 12px; *//* color:#919191; *//* padding: 18px 0 10px; */position: relative;text-align: center;/* border-bottom: 1px dashed #666; */margin-bottom: 14px;/* float: left; */background: #f1f1f1;}
.sort-search span{display: inline-block;/* border-right: 1px solid #e2e2e2; */padding: 0 10px;/* height: 17px; *//* line-height: 33px; */visibility: z;vertical-align: middle;display: inline-block;}
.sort-search span:first-child{border-right: 1px solid #e2e2e2;}
.sort-search span strong{}
.sort-search button{background: #000000;color: #FFF;font-weight: bold;border-radius: 5px;border: none;width: 24px;height: 24px;line-height: 25px;position: relative;/* top: -1px; *//* color: #000000; */padding: 0 3px;margin: 0 3px;cursor: pointer;font-size: 9px;line-height: 12pt;/* background: #FFF; */}
.sort-search button:hover{background: #000 !important;color: #FFF !important;}
.sort-active{/* border: 2px solid #FBF162 !important; */background: #000 !important;color: #FFF !important;}

.sort-Bt{ display: none;}

/* filter search */
.search {width: 100%;bottom: 0;left: 0;right: 0;/*z-index: 201;*/background: #f1f1f1;}
.search_top{
    /* background-image: url('/usedcar/images/search_top_bck.gif'); */
    padding: 15px 0 0;
}
.search .input-filter { max-height: 400px; overflow-y: auto; padding: 0 !important;}
.filter-search {/* padding: 18px 10px; *//* display: flex; *//* flex-wrap: wrap; */}
.search .filter { width: 30%; border-right: 1px solid #c0ced2; padding: 5px; }
.filter-btn {/* width: 10%; */padding: 8px;line-height: 0;text-align: center;display: flex;justify-content: center;}
.btn-search {background: #000000;background-image: url('/usedcar/images/bg_black.gif');color: #fff;width: 90%;max-width: 420px;margin: 0 15px;border: none;border-radius: 6px;border-bottom: 3px solid #000000;box-shadow: 4px 4px 0 #ff0;height: 63px;font-size: 20px;/* font-weight: bold; */line-height: 55px;font-family: 'M PLUS Rounded 1c', sans-serif;font-weight: 600;}
.btn-search i{font-size: 25px;margin: 0 11px 0 0;top: 2px;position: relative;}
.btn-clear {/* padding: 8px 12px; */line-height: 0;background: #c0c0c0;border: none;margin-top: 8px;border-bottom: 1px solid #949494;border-radius: 5px;font-size: 13px;/* color: #ffffff; */height: 38px;width: 200px;float: right;}

.filter-top ul{display: flex;}
.filter-top ul li{display:flex;width: 40%;}
.filter-top ul li:nth-child(2){margin-left:20px;}
.filter-bottom{display: flex;-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;}
.filter-bottom ul{width: 55%;}
.filter-bottom ul li{display:flex;width: 100%;}

.search .title {display: block;padding: 6px;width: 18%;text-align: left;font-weight: 600;/* color: #1e2c67; */}
.filter-top .title{width: 25%;}
.search .data {display: block;padding: 5px 3px;width: 76%;text-align: left;}

.reservation .data span { display: inline-block; padding: 4px 0; }
.filter-search select{min-width: 105px;-webkit-appearance:none;-moz-appearance:none;}
.filter-search select::-ms-expand{ display: none; }
.filter-search input[type="text"]:focus,
.filter-search select:focus {
    outline:none;
    border-color:#c6e3f7;

  }

.style-select{ position: relative;}

.search .data ul{ display: flex; width: 100%;}
.search .data ul li:nth-child(1),
.search .data ul li:nth-child(3),
.w-kudou{
    width: calc(50% - 16px);
    /* height: 40px; */
}
.search .data ul li:nth-child(2){
    width: 32px;
    text-align: center;
    line-height: 40px;
    display: inline-block;
}

.style-select:before {
    content: "";
    background: #000000;
    height: 40px;
    width: 40px;
    position: absolute;
    right: 0px;
    border-radius: 0 5px 5px 0;
    pointer-events: none;
    z-index: 2;
}
.style-select::after {
    content: "";
    width: 10px;
    height: 10px;
    display: block;
    border-bottom: 3px solid #ffffff;
    border-right: 3px solid #ffffff;
    position: absolute;
    top: 45%;
    right: 14px;
    transform: translateY(-50%) rotate(45deg);
    pointer-events: none;
    z-index: 3;
}
.input-default {padding: 6px;border: 1px solid #272727;background-color: #fff;display: inline-block;font-size: 15px;border-radius: 3px;/* color: #1e2c67; */height: 40px;}

.filter-bottom-right{width: 45%;}
/* filter color */
.color-box{background-color: #FFF;border-radius: 5px;padding: 9px;border: 1px solid #000;}
.color-box{display: flex;margin: 10px;justify-content: center;align-items: center;}
.color-box p{ font-weight: normal; width: 100px;}
.color-box .fillter-color{width: 30px;height: 30px;border: 1px solid #FFF;display: inline-block;margin: 1px;}
.color-box .fillter-color.color1{background: #fff;border: 1px solid #bfc6e5;}
.color-box .fillter-color.color2{ background: #000;}
.color-box .fillter-color.color3{ background: #ff1800;}
.color-box .fillter-color.color4{ background: #0036ff;}
.color-box .fillter-color.color5{ background: #fcff00;}
.color-box .fillter-color.color6{ background: #15e000;}
.color-box .fillter-color.color7{ background: #ac7500;}
.color-box .fillter-color.color8{ 
background: rgb(185,133,0);
background: linear-gradient(90deg, rgba(185,133,0,1) 0%, rgba(255,255,255,1) 50%, rgba(185,133,0,1) 100%);
}
.color-box .fillter-color.color9{
background: rgb(179,179,179);
background: linear-gradient(90deg, rgba(179,179,179,1) 0%, rgba(255,255,255,1) 50%, rgba(179,179,179,1) 100%);    
}
.color-box .fillter-color.color10{ background: #dcdcdc;}
.color-box .fillter-color.color11{ background: #ff9c00;}
.color-box .fillter-color.color12{ background: #ba00ff;}
.color-box .fillter-color.color13{ background: #ffa4dc;}
.color-box .fillter-color.color14{ background: #ffebb0;}
.color-box .fillter-color.color15{
    background: rgb(255,240,209);
background: linear-gradient(90deg, rgba(255,240,209,1) 0%, rgba(255,255,255,1) 50%, rgba(255,240,209,1) 100%);
}
.color-box .fillter-color.color16{ background: #6e6e6e;}
.color-box .fillter-color.color17{ background: #002aa3;}
.color-box .fillter-color.color18{
  background-color: #000000;
  background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #e2e2e2), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #e2e2e2),color-stop(.75, #e2e2e2), color-stop(.75, transparent),to(transparent));
  -webkit-background-size: 6px 6px;
    
}
.color-box input[type=checkbox]{ display:none }
.color-box input[type=checkbox]:checked + .fillter-color{ border: 2px solid #00bbff;}
.pc-color{ display: block;}
.sp-color{display: none;}


/* modal link */
.select-link { box-shadow: 0px 0px 0px 6px rgba(204, 204, 204, 0.75); border: 0; }
.modal-link {display: block;text-align: center;padding: 11px 12px;}
.border-top { height: 4px; width: 100%; margin-bottom: 18px; }
.btn-link-car { margin: 8px 1%; width: 45%; display: inline-block; color: #fff!important; font-size: 18px; font-weight: 500; padding: 20px 6px; text-align: center; }
.modal-body .title-default {
    display: block;
    padding: 10px 0
}

.only-pc.bt_box{ display:block;}
.only-sp.bt_box{ display:none;}
.only-sp{display: none !important;}

@media(max-width:1200px) {
    .filter-search { padding: 0; }
    .filter select {min-width: 73px;}

}

@media(max-width:1200px) {
    .filter-search { padding: 12px; }
    .filter-search .filter { width: 50%; border: 0; }
    .filter-search .filter-btn { width: 50%; display: flex; justify-content: center; align-items: center; }
    .filter-search .btn-clear {margin-top: 0;margin-left: 18px;padding: 29px 12px;float: none;display: block;margin: auto;}

    .item-car .images-item {width: 180px;}
    .item-car .data-item-box {
        padding: 0 0 0 10px;
        width: calc( 100% - 180px );
    }
    .item-car .name-item {padding: 0 0 5px;font-size: 13px;font-weight: 900;}
    .item-car .name-item strong {font-size: 18px;}
    .item-car .detail-car div {font-size: 13px;}
    .item-car .detail-car strong {
        font-size: 13px;
    }
    .item-car .detail-car span {
        font-size: 11px;
    }
    

    .item-car .price-item {width: 45%;margin: 0 5px;}
    .item-car .detail-car div .price-item {
        width: 100%;
    }
    a.orange_bt,
    a.green_bt {
        width: 100%;
        padding:0 0 0 20px
    }
    .price_box { width:65%}
    .bt_box{ width: calc(100% - 65% - 5px);}
    .item-car .price-item p{font-size: 30px;}
    .item-car .price-item p .tani {
    font-size: 24px;}
    .item-car .price-item p .en_tani{font-size: 16px;}
    .item-car .price-item.noridasi p {
        font-size: 28px;
        height: auto;
        padding: 5px 0 0;
    }
    .item-car .price-item.noridasi p .tani {
    font-size: 24px;}

}
@media(max-width:900px) {
    .filter-top ul li {
        width: 50%;
    }
    .filter-top ul li:nth-child(2) {
        margin-left: 0px;
    }
    .filter-bottom {
        flex-wrap:wrap;
    }
    .filter-search {
        padding: 0px;
    }
    .filter-bottom ul {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
    }
    .filter-bottom ul li {
        display: flex;
        width: 50%;
    }    
    .filter-bottom-right {
        width: 100%;
    }
    .search .title {
        display: block;
        padding: 6px;
        width: 80px;
        font-weight: normal;
        font-size: 15px;
     }
     .filter-search select {
         min-width:auto;
     }
    .input-default {
        padding: 6px;
        font-size: 14px;
    }
    .style-select:before {
        height: 40px;
        width: 30px;
    }
    .style-select::after {
        right: 10px;
    }    



}
@media(max-width:767px) {
    .item-car ul li {/* width: 48%; */flex-wrap: wrap;}
    .filter .title{ width: 25%; }
    .filter .data { width: 75%; }

    .filter-search { padding: 0px; }
    .filter-search .filter {padding: 0 0px;}
    .filter-search .filter-btn { width: 50%; display: flex; justify-content: center; align-items: center; }
    .pc-color{ display: none;}
    .sp-color{display: block;}

    .title-search {
        width: 200px;
        padding: 8px 5px;
    }
    .title-search  img{ width:130px;}
    .search .input-filter { max-height: 900px; }


    .blink{ font-size:10px;}
    .page-number {
        /* width: 100%; */
    }
    .sort-Bt{
        display: block;
        background: #f3f3f3;
        float: left;
        border-radius: 5px;
        height: 30px;
        line-height: 30px;
        padding: 0px 28px 0 12px;
        margin: 0 0 0 10px;
        position: relative;
        font-size: 13px;
    }
    .sort-Bt:after{
        content: '+';
        color: #fff;
        font-size: 22px;
        font-weight: bold;
        position: absolute;
        background: #8cd6e2;
        width: 20px;
        height: 20px;
        line-height: 20px;
        text-align: center;
        border-radius: 25px;
        top: 5px;
        right: 2px;
    }
    .sort-Bt.active:after{
        content: '-' !important;
        line-height: 15px;
        font-size: 25px;
    }
    
    
    .sort-search{display: none;width: 100%;}
    .sort-search span{
    display:block;
    border-right: none;
    padding: 0 10px;
    margin: 5px;
    height:auto;
    background:#f3f3f3;
    padding:5px;
    }
    .sort-search span strong{
        width:55px;
        display:inline-block;
        text-align:left;
    }
    
    .search .filter-btn {width: 100%;text-align: center;}
    .search .btn-search {/* width: 44%; *//* height: 50px; */padding: 0px;}
    .search .btn-clear {width: 44%;height: 50px;padding: 0px;float: none;margin: auto;display: block;/* width: 68%; */}
    .color-list{ padding: 0 0 0 10px;}
    .color-list-title{padding: 0px 0 0 0px !important;font-weight: normal !important;width: 127px !important;}
    
}


@media(max-width:768px) {
    #panel_box_in div{
        width:49%;
    }
    #maker_list, #model_list{width: 99%;}
    #searchBt{width:150px;margin: 0 0 0  auto;}

    .item-car .detail-car {align-items: baseline;flex-wrap: wrap;padding: 0 0 0 0px;}
    .item-car .detail-car div {display: inline-block;width: auto;padding: 0 0 0.3rem;border: none;border-width: 0;text-align: center;font-size: 10px;margin:0 5px 0 0;/* color: #878686; */line-height: 1;}
    .item-car .detail-car div p {background: #FFF;padding: 5px 0;margin: 0 0 0.3rem;display: inline-block;width: auto;}
    .item-car .detail-car div:first-child {border-left:none;}
    .item-car .detail-car strong {display: inline-block;color: #000;font-size: 14px;font-weight: bold;margin: 3px 0 0;}
    .item-car .detail-car strong small { display: inline-block; font-size: 12px;}
    .item-car .detail-car span {display: inline-block;color: #000;font-size: 12px;}
    .detail-car > div:after {
        content: '/';
    }

    .price_box {
        width: 100%;
    }
    .detail-car-btm {
        margin: 5px 0 0 0;
    }
    .item-car .detail-car div {
        padding: 0 0px;
    }
    .item-car .detail-car > div:first-child{
        display:none;
    }
    .item-car .price-item small {
        font-size: 12px;
        width: auto;
        display: inline-block;
    }
    .item-car .price-item p{font-size: 27px;padding: 0 !important;margin: 0 !important;line-height: 18px;}
        .item-car .price-item p .tani {
        font-size: 20px;}
        .item-car .price-item p .en_tani{font-size: 13px;}
        .item-car .price-item.noridasi p {
            font-size: 22px;
            height: auto;
            padding: 5px 0 0;
        }
        .item-car .price-item.noridasi p .tani {
        font-size: 18px;}
    
    .only-pc.bt_box{ display:none;}
    .bt_box.only-sp{ display:flex; width:100%; justify-content:center;}
    .bt_box.only-sp a{width:45%;margin:0 1%;font-size: 16px;}

     .search .container{padding-right: 0px;padding-left: 0px;}

    .filter-top ul {
        flex-wrap:wrap;
    }
     .filter-top ul li {
            width: 100%;
    }
    .filter-top ul li:nth-child(2) {
        margin-left: 0px;
    }
    .filter-bottom {
        flex-wrap:wrap;
    }
    .filter-search {
        padding: 0px;
    }
    .filter-bottom ul {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
    }
    .filter-bottom ul li {
        display: flex;
        width: 100%;
    }      
    .filter-bottom-right {
        width: 100%;
    }
    .search .title {
        display: block;
        padding: 6px;
        width: 80px;
        font-weight: normal;
        font-size: 15px;
     }
    .input-default {
        padding: 6px;
        font-size: 14px;
    }
    .style-select:before {
        height: 40px;
        width: 30px;
    }
    .style-select::after {
        right: 10px;
    }     
    .only-sp{display: inline-block !important;}
    .price-item{/* display: flex !important; */flex-wrap: wrap;width: auto !important;}

    .store_info p:first-child {
        font-size: 21px;
    }
    .store_info {
        font-size: 14px;
        line-height: 1.2;
        font-weight: bold;
        margin: 4px 0 0;
    }
    

}
@media(max-width:520px) {
    .item-car a.btn-highlight { width: 100%; }
}

@media(max-width:460px) {

     .item-car .images-item {width: 120px;}
    .item-car .data-item-box {
        padding: 0 0 0 10px;
        width: calc( 100% - 120px );
    }
    .bt_box.only-sp a {
        width: 45%;
        margin: 0 1%;
        font-size: 14px;
    }

    .item-car ul li {
        padding: 16px 0;
    }    
}

@media(max-width:767px) {
    #panel_box_in div{
        width:100%;
    }
    #maker_list, #model_list{width: 99%;}
    #searchBt{width:80%;margin: 10px auto;}

    .page_area{
        flex-wrap:wrap;
    }
    .page_number{
        width:100%
    }

    .sort_bt{ text-align:center;}
    .filter-search .filter { width: 100%; }
    .filter-search .filter-btn { width: 100%; }
    .filter select {width: 45%;}
    .modal-link { padding: 12px;}
    .btn-link-car { width: 80%; margin: 8px auto; }

    div#panel_box {
        background: #d6d6d6;
        padding: 15px 10px;
    }
    
    .filter select { width: 45%; }

    .pc-only { display: none;}
    
     .item-car .images-item {width: calc(100% - 10px);margin:auto;}
    .item-car .data-item-box {
        padding: 5px 8px 0 8px;
        width: 100%;
    }
    .bt_box.only-sp a {
        width: 45%;
        margin: 0 1%;
        font-size: 14px;
    }
     .item-car ul{
         flex-wrap:wrap;
         padding-inline-start: 0px;
     }

    .item-car ul li {
        padding: 5px 0;
        width: 48%;
        margin:0 1% 15px 1%;
    }
    .item-car ul li:nth-child(2n){
        margin:0 0 15px;
    }
    .sm-none{ display: none !important;}

    .item-car .detail-car > div > p { margin:0;}

    .item-car .name-item {font-size: 12px;margin-bottom: 5px; padding:5px;}
    .item-car .name-item strong {font-size: 16px;}
    
    .item-car .price-item small {
        font-size: 10px;
    }
    .item-car .detail-car strong {
        font-size: 12px;
        font-weight: bold;
        margin: 2px 0 0;
    }
    .detail-car > div:last-child:after {
        display: none;
    }
    .price_box{
        display: inline-block;
        width: 100% !important;
        margin: 6px 0px 0 0 !important;
        text-align:right !important;
    }

    .store_info p:first-child {
        font-size: 18px;
        margin:5px 0 ;
        width: 100%;
        text-align: center;
    }
    .store_info p:nth-child(2),.store_info p:nth-child(3){
        display:none;

    }

    .img-fluid{width:100%;}



}



 