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

.pc_only{display:block!important;}
.sp_only{display:none!important;}

.car_list  {
    margin: 10px auto 0;
}
.car_list li {
    padding: 20px 15px;
    box-sizing: border-box;
    border-top: 1px dashed #c6c6c6;
    display: flex;
}
.car_list li:hover {
    background-color: #eaf9fe;
}
.car_img {
    float: left;
    border: 1px solid #c6c6c6;
    width: 230px;
    background-color: #fff;
    box-sizing: border-box;
    overflow: hidden;
    text-align: center;
}

.car_img img {
    width: 100%;
    height: auto;
}

.car_data {
    width: calc(100% - 220px);
    float: right;
    box-sizing: border-box;
    padding: 0 0 0 20px;
}
.car_data h3 {
    margin: 10px 0 10px;
    font-size: 20px ;
    font-weight: 700;
}
.car_data h3 span {
    font-size: 14px;
}
.car_data  table {
    width: 38%;
    float: left;
}
.car_data  table th {
    padding: 5px 0 10px ;
    width: 20%;
}
.car_data  table td {
    padding: 0px 10px 10px 0;
    width: 30%;
}
.car_data  table th span {
    background-color: #e2e2e2;
    padding: 5px 10px;
    font-weight: normal;
}
.price_disp {
    border-top: 3px solid #ffc600;
    width: 20%;
    float: left;
    margin: 0px 0 0 0%;
    padding: 5px 0 0;
    text-align: center;
}
.price_disp span {
    font-size: 18px;
    font-weight: bold;
    color: #ca0300;
}
.car_btn {
    width: 42%;
    float: right;
    margin: 0 0% 0 0%;
}
.car_btn li {
    padding: 0 !important;
    border: none;
    width: auto;
    margin: 20px 0 0;
    display: inline-block
}
.car_btn li:first-child {
    margin: 0 5px 0 0;
}
.car_btn li  button {
    box-sizing: border-box;
    padding: 0 8px;
    background-color: #fff;
}
@media (max-width:768px) {

    .sp_only{display:block!important;}
    .pc_only{display:none!important;}

    .car_list li {
        display: block;
    }
    .sp_h3 {
        margin: 0px 0 5px;
        margin: 10px 0 10px;
        font-size: 16px;
        font-weight: 700;
        border-bottom: 3px solid #ffc600;
    }
    .car_img {
        width: 240px;
    }
    .car_img img {
        width: 100%;
        height: auto;
    }
    .car_data {
        width: calc(100% - 240px);
        float: right;
        box-sizing: border-box;
        padding: 0 0 0 10px;
    }
    .car_data  table {
        width: 100%;
    }
    .price_disp {
        width: 100%;
        margin: 0px 0 0 0%;
        border-top:none;
    }
    .car_btn {
        width: 100%;
        float: left;
        margin: 0 0% 0 0%;
    }
    .car_btn li {
        padding: 0 !important;
        border: none;
        width: auto;
        margin: 0px 0 0;
        display: inline-block
    }
    .car_btn li:first-child {
        margin: 0 5px 0 0;
    }
    .car_btn li  button {
        box-sizing: border-box;
        padding: 0 8px;
        background-color: #fff;
    }
}

@media (max-width:480px) {
    .car_list li {
        display: block;
        padding: 15px 10px;
        padding: 10px 0px 10px;
    }
    .car_data h3 {
        margin: 0px 0 5px;
        font-size: 15px ;
        font-weight: 700;
    }
    .car_img {
        width: 35%;;
    }
    .car_img img {
        width: 100%;
        height: auto;
    }
    .car_data {
        width: calc(100% - 35%);
        float: right;
        box-sizing: border-box;
        padding: 0 0 0 5px;
    }
    .car_data  table {
      font-size: 11px;
    }
    .price_disp {
        width: 100%;
        float: left;
    }
    .car_data  table th {
      padding: 5px 0 10px ;
      width: 22%;
  }
  .car_data  table td {
      padding: 0px 5px 10px 0;
      width: 30%;
  }
    .price_disp span {
        font-size: 20px;
        font-weight: bold;
        color: #ca0300;
    }
    .car_btn {
        width: 100%;
        float: none;
        margin: 0px 0% 0 0%;
        padding: 7px 0 0 0;
        clear: both;
        text-align: center;
    }
    .car_btn li {
        padding: 0 !important;
        border: none;
        width: auto;
        margin: 0px 0 0;
        display: inline-block
    }
    .car_btn li:first-child {
    }
    .car_btn li:last-child {
    }
    .car_btn li  button {
        box-sizing: border-box;
        padding: 0 10px;
        background-color: #fff;
        font-size: 15px;
        height: 35px;
        margin: 0;
    }
}