@charset "UTF-8";
/* CSS Document */
/*--------------------------------基本---------------------------------*/
body { font-family: 微軟正黑體, Arial; padding: 0; margin: 0; z-index: 99; }

img { border: 0; vertical-align: bottom; }

DIV { WORD-WRAP: break-word; TABLE-LAYOUT: fixed; word-break: break-all; }

table { WORD-WRAP: break-word; TABLE-LAYOUT: fixed; word-break: break-all; }

span { WORD-WRAP: break-word; TABLE-LAYOUT: fixed; word-break: break-all; }

/*--------------------------------選單menu---------------------------------*/
#logom { position: absolute; display: none; }

#mu-on { position: absolute; right: 20px; top: 10px; display: none; }

#mu-up0 { position: fixed; width: 320px; height: 100%; opacity: 0.9; background-color: #000000; z-index: 100; left: -330px; transition: all 1s; -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; }

#mu-up1 { position: absolute; width: 320px; height: 100%; z-index: 101; left: -330px; -webkit-transition: all 1.5s; -o-transition: all 1.5s; transition: all 1.5s; -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; }

.mu-fo { border-bottom: 1px solid #767676; z-index: 102; width: 80%; position: relative; left: 10%; text-align: right; padding-bottom: 20px; padding-top: 20px; }

#menu0 { width: 100%; background-image: -webkit-linear-gradient(0deg, #fff500 0%, #fff500 47.67%, #00338e 61.14%, #00338e 100%); background-image: -moz-linear-gradient(0deg, #fff500 0%, #fff500 47.67%, #00338e 61.14%, #00338e 100%); background-image: -o-linear-gradient(0deg, #fff500 0%, #fff500 47.67%, #00338e 61.14%, #00338e 100%); background-image: -webkit-gradient(linear, left top, right top, from(#fff500), color-stop(47.67%, #fff500), color-stop(61.14%, #00338e), to(#00338e)); background-image: -webkit-linear-gradient(left, #fff500 0%, #fff500 47.67%, #00338e 61.14%, #00338e 100%); background-image: -o-linear-gradient(left, #fff500 0%, #fff500 47.67%, #00338e 61.14%, #00338e 100%); background-image: linear-gradient(90deg, #fff500 0%, #fff500 47.67%, #00338e 61.14%, #00338e 100%); }

#menu1 { width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto; background-color: #00338E; min-height: 60px; }

.logo { width: auto; height: 100%; max-width: 500px; margin-right: 10px; max-height: 75px; min-height: 50px; }

.mub { max-width: 103px; width: 100%; height: auto; margin-bottom: 20px; margin-left: 2px; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; margin-top: 15px; }

.mub:hover { margin-bottom: 25px; -webkit-filter: invert(1); }

/*--------------------------------搜尋sear---------------------------------*/
#sear0 { width: 100%; height: 40px; background-color: #373534; position: relative; float: left; }

#sear1 { margin-right: auto; width: 100%; max-width: 1200px; margin-left: auto; padding-top: 8px; text-align: right; }

.se-ty { width: 100px; height: 15px; border-radius: 3px; }

/*--------------------------------輪播看板kban---------------------------------*/
#kban0 { width: 100%; background-color: #2A2A2A; height: auto; position: relative; float: left; -webkit-box-shadow: 0px 0px 10px; box-shadow: 0px 0px 10px; margin-bottom: 15px; }

#kban1 { width: 100%; margin-left: auto; margin-right: auto; overflow-y: hidden; position: relative; overflow-x: hidden; height: auto; max-width: 1200px; max-height: 600px; }

#kban2 { width: 300%; height: auto; position: relative; z-index: 10; transition: all 1s; -webkit-transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; }

.kbl { position: absolute; z-index: 11; top: 50%; margin-top: -45px; }

.kbr { position: absolute; z-index: 11; right: 0px; top: 50%; margin-top: -45px; }

#kbgo1 { position: absolute; width: 10px; height: 10px; z-index: 11; background-color: #C9282D; border-radius: 10px; bottom: 10px; left: 47%; cursor: pointer; }

#kbgo2 { position: absolute; width: 10px; height: 10px; z-index: 11; background-color: #00338e; border-radius: 10px; bottom: 10px; left: 47%; margin-left: 30px; cursor: pointer; }

#kbgo3 { position: absolute; width: 10px; height: 10px; z-index: 11; background-color: #00338e; border-radius: 10px; bottom: 10px; left: 47%; margin-left: 60px; cursor: pointer; }

.kbro { position: relative; width: 33.333%; height: auto; float: left; }

.kbimga { width: 100%; height: auto; }

.kbimgb { display: none; }

/*--------------------------------網站地圖smap---------------------------------*/
#smap1 { width: 100%; background-color: #ececec; text-align: center; min-height: 30px; padding-top: 20px; padding-bottom: 10px; position: relative; float: left; }

#smap2 { width: 100%; background-color: #ececec; text-align: center; min-height: 30px; padding-top: 20px; padding-bottom: 10px; position: relative; float: left; }

.sp-fo { max-width: 800px; }

.sp-ic { width: auto; margin-right: 5px; margin-top: 5px; margin-bottom: 5px; margin-left: 5px; }

/*--------------------------------版權data---------------------------------*/
#data0 { width: 100%; background-color: #373534; text-align: center; min-height: 30px; padding-top: 15px; padding-bottom: 15px; position: relative; float: left; }

/*--------------------------------按鈕top---------------------------------*/
#top { position: absolute; width: 42px; height: 42px; z-index: 99; margin-left: +160px; position: fixed; bottom: 80px; right: 20px; opacity: 0.7; }

/*--------------------------------主題框topic---------------------------------*/
.topic0 { width: 100%; max-width: 1200px; margin-right: auto; margin-left: auto; position: relative; height: auto; margin-top: 15px; margin-bottom: 10px; float: left; }

.topic1 { width: 17%; border-left: 7px solid #E33935; position: relative; float: left; margin-top: 5px; margin-bottom: 5px; }

.topic2 { width: 13%; position: relative; float: right; background-image: -webkit-linear-gradient(333deg, #fff501 0%, #fff501 83.42%, #00338e 83.42%, #00338e 100%); background-image: -moz-linear-gradient(333deg, #fff501 0%, #fff501 20.73%, #00338e 20.73%, #00338e 100%); background-image: -o-linear-gradient(333deg, #fff501 0%, #fff501 20.73%, #00338e 20.73%, #00338e 100%); background-image: -o-linear-gradient(333deg, #fff501 0%, #fff501 83.42%, #00338e 83.42%, #00338e 100%); background-image: linear-gradient(117deg, #fff501 0%, #fff501 83.42%, #00338e 83.42%, #00338e 100%); height: auto; min-height: 50px; }

.topic3 { width: 69%; position: relative; float: right; background-color: #00338E; height: auto; min-height: 50px; }

.form10 { width: 10%; position: relative; float: left; margin-bottom: 10px; padding-top: 10px; min-width: 155px; padding-left: 10px; }

/*--------------------------------標題框topicm---------------------------------*/
.topicm1-1 { width: 100%; position: relative; float: left; height: auto; border-bottom: 4px solid #98abb1; color: #FFFFFF; font-family: "微軟正黑體"; font-size: 23px; text-align: left; font-weight: bold; line-height: 51px; text-indent: 21px; background-color: #C9282D; min-height: 50px; }

.topicm1-2 { width: 100%; position: relative; float: left; border-bottom: 4px solid #98abb1; color: #FFFFFF; font-family: "微軟正黑體"; font-size: 23px; text-align: left; font-weight: bold; line-height: 51px; text-indent: 21px; background-color: #00338E; min-height: 50px; height: auto; }

.topicm1-3 { width: 100%; position: relative; float: left; height: auto; border-bottom: 4px solid #98abb1; color: #FFFFFF; font-family: "微軟正黑體"; font-size: 23px; text-align: left; font-weight: bold; line-height: 51px; text-indent: 21px; background-color: #5d5d5d; min-height: 50px; }

.topicm1-4 { width: 100%; position: relative; float: left; height: auto; border-bottom: 4px solid #98abb1; color: #FFFFFF; font-family: "微軟正黑體"; font-size: 23px; text-align: left; font-weight: bold; line-height: 51px; text-indent: 21px; background-color: #1D7ECF; min-height: 50px; }

.topicm2-1 { width: 100%; position: relative; float: left; margin-top: 5px; margin-bottom: 5px; color: #4D4A49; font-family: "微軟正黑體"; font-weight: bold; font-size: 21px; text-align: left; }

.topicm2-2 { width: 100%; position: relative; float: left; margin-top: 5px; margin-bottom: 5px; color: #00338E; font-family: "微軟正黑體"; font-weight: bold; font-size: 21px; text-align: left; }

.topicm2-3 { width: 100%; position: relative; float: left; margin-top: 5px; margin-bottom: 5px; color: #C9282D; font-family: "微軟正黑體"; font-weight: bold; font-size: 21px; text-align: left; }

/*--------------------------------表單form---------------------------------*/
.form7 { width: 7%; position: relative; float: left; padding-left: 10px; height: 40px; }

.form1 { width: 10%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }

.form15 { width: 15%; position: relative; float: left; height: 40px; }

.form20 { width: 20%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }

.form25 { width: 25%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }

.form30 { width: 30%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }

.form40 { width: 40%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }

.form50 { width: 50%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }

.form100 { width: 100%; position: relative; float: left; padding-top: 15px; padding-left: 10px; height: 40px; }

.fobt0 { height: 25px; width: auto; margin-bottom: 5px; }

.fobt1 { height: 25px; width: 200px; margin-bottom: 5px; }

.fobt2 { height: 25px; width: 550px; margin-bottom: 5px; }

.fobt3 { border-style: solid; border-width: 1px; border-color: #a7a7a7; border-radius: 5px; background-image: -moz-linear-gradient(90deg, #cccccc 0%, white 100%); background-image: -webkit-linear-gradient(90deg, #cccccc 0%, white 100%); background-image: -ms-linear-gradient(90deg, #cccccc 0%, white 100%); width: auto; height: 25px; z-index: 67; color: #626262; font-family: "微軟正黑體"; font-size: 15px; font-weight: bold; padding-left: 20px; padding-right: 20px; margin-right: 20px; margin-bottom: 5px; }

.fobt4 { width: 80%; }

/*--------------------------------表格for---------------------------------*/
.for1 { width: 100%; position: relative; height: auto; border: 1px solid #D7D7D6; float: left; margin-bottom: 15px; margin-bottom: 4px; max-width: 1200px; background-color: #FFFFFF; }

.for2 { background-color: #ECECEC; border-bottom: 4px solid #98ABB1; width: 100%; position: relative; float: left; margin-bottom: 20px; height: auto; }

.fornext { background-color: #308AD5; border-radius: 15px; color: #FFFFFF; width: 30%; margin-bottom: 10px; margin-top: 10px; float: left; margin-right: 20px; min-width: 270px; }

/*--------------------------------按鈕but---------------------------------*/
.img { width: 100%; height: auto; }

.but1 { cursor: pointer; width: 100%; height: auto; max-width: 200px; max-height: 45px; color: #FFFFFF; font-size: 16px; text-decoration: none; text-align: center; font-weight: bold; position: relative; min-height: 45px; border-width: 0px; margin-right: 10px; margin-bottom: 10px; font-family: "微軟正黑體"; background-image: -webkit-linear-gradient(270deg, #d94945 0%, #c0171c 100%); background-image: -webkit-gradient(linear, left top, left bottom, from(#d94945), to(#c0171c)); background-image: -webkit-linear-gradient(top, #d94945 0%, #c0171c 100%); background-image: -o-linear-gradient(top, #d94945 0%, #c0171c 100%); background-image: linear-gradient(180deg, #d94945 0%, #c0171c 100%); }

.but1:hover { background-image: -webkit-linear-gradient(270deg, #12387b 0%, #3769c3 100%); background-image: -webkit-gradient(linear, left top, left bottom, from(#12387b), to(#3769c3)); background-image: -webkit-linear-gradient(top, #12387b 0%, #3769c3 100%); background-image: -o-linear-gradient(top, #12387b 0%, #3769c3 100%); background-image: linear-gradient(180deg, #12387b 0%, #3769c3 100%); }

.but2 { width: 75px; color: #FFFFFF; cursor: pointer; font-size: 13px; text-decoration: none; text-align: center; position: relative; border-width: 0px; margin-right: 10px; margin-bottom: 10px; height: 25px; font-family: "微軟正黑體"; background-image: -webkit-linear-gradient(270deg, #d94945 0%, #c0171c 100%); background-image: -webkit-gradient(linear, left top, left bottom, from(#d94945), to(#c0171c)); background-image: -webkit-linear-gradient(top, #d94945 0%, #c0171c 100%); background-image: -o-linear-gradient(top, #d94945 0%, #c0171c 100%); background-image: linear-gradient(180deg, #d94945 0%, #c0171c 100%); border-radius: 174px; }

.but2:hover { background-image: -webkit-linear-gradient(270deg, #12387b 0%, #3769c3 100%); background-image: -webkit-gradient(linear, left top, left bottom, from(#12387b), to(#3769c3)); background-image: -webkit-linear-gradient(top, #12387b 0%, #3769c3 100%); background-image: -o-linear-gradient(top, #12387b 0%, #3769c3 100%); background-image: linear-gradient(180deg, #12387b 0%, #3769c3 100%); }

.but3 { width: 100%; height: auto; max-width: 120px; color: #FFFFFF; font-size: 16px; text-decoration: none; text-align: center; font-weight: bold; position: relative; border-width: 0px; margin-right: 10px; margin-bottom: 10px; font-family: "微軟正黑體"; background-image: -webkit-linear-gradient(270deg, #12387b 0%, #3769c3 100%); background-image: -webkit-gradient(linear, left top, left bottom, from(#12387b), to(#3769c3)); background-image: -webkit-linear-gradient(top, #12387b 0%, #3769c3 100%); background-image: -o-linear-gradient(top, #12387b 0%, #3769c3 100%); background-image: linear-gradient(180deg, #12387b 0%, #3769c3 100%); min-height: 40px; line-height: 23px; border-radius: 6px; margin-top: 20px; }

.but3:hover { background-image: -webkit-linear-gradient(270deg, #d94945 0%, #c0171c 100%); background-image: -webkit-gradient(linear, left top, left bottom, from(#d94945), to(#c0171c)); background-image: -webkit-linear-gradient(top, #d94945 0%, #c0171c 100%); background-image: -o-linear-gradient(top, #d94945 0%, #c0171c 100%); background-image: linear-gradient(180deg, #d94945 0%, #c0171c 100%); }

.apgo1 { position: relative; width: 10px; height: 10px; z-index: 11; background-color: #C9282D; border-radius: 10px; bottom: 10px; left: 45%; float: left; margin-right: 20px; margin-top: 15px; cursor: pointer; }

.apgo2 { position: relative; width: 10px; height: 10px; z-index: 11; background-color: #00338e; border-radius: 10px; bottom: 10px; left: 45%; float: left; margin-right: 20px; margin-top: 15px; cursor: pointer; }

/*--------------------------------車廠列表carlist---------------------------*/
.carlistimg { width: 100%; height: auto; max-width: 80%; margin-bottom: 5px; }

.carlist0 { width: 100%; height: auto; min-height: 75px; border-bottom: 1px solid #ECECEC; position: relative; float: left; }

.carlist1 { width: 15%; position: relative; float: left; padding-left: 10px; height: 130px; }

.clform15 { width: 15%; position: relative; float: left; padding-left: 10px; height: 130px; border-left: 1px solid #ECECEC; }

.clform40 { width: 40%; position: relative; float: left; padding-left: 10px; height: 130px; border-left: 1px solid #ECECEC; }

.cplist0 { width: 50%; height: auto; min-height: 75px; border-bottom: 1px solid #ECECEC; position: relative; float: left; }

.cplist1 { width: 35%; position: relative; float: left; padding-left: 10px; height: 130px; }

.cplform15 { width: 15%; position: relative; float: left; padding-left: 10px; height: 130px; border-left: 1px solid #ECECEC; }

.cplform50 { width: 50%; position: relative; float: left; padding-left: 10px; height: 130px; }

/*--------------------------------版面ap---------------------------------*/
.back0 { width: 100%; height: auto; position: relative; float: left; }

.back1 { width: 100%; margin-right: auto; margin-left: auto; height: auto; max-width: 1200px; position: relative; }

/* aptxt1版面主文 */
.aptxt1 { position: relative; font-size: 19px; color: #5D5D5D; line-height: 39px; text-align: left; }

/* ap0-1版面 */
.iccar { height: auto; width: 98px; padding-bottom: 2px; }

#ap0-1-1 { width: 100%; height: auto; position: relative; float: left; }

#ap0-1-2 { width: 100%; height: auto; position: relative; float: left; display: none; }

#ap0-1-3 { width: 100%; height: auto; position: relative; float: left; display: none; }

.carlogo { width: 13%; position: relative; float: left; margin-bottom: 10px; padding-top: 10px; min-width: 98px; padding-left: 10px; margin-right: 10px; padding-right: 10px; }

/* ap0-2版面 */
#ap0-2-1 { width: 100%; height: auto; }

#ap0-2-2 { width: 100%; height: auto; display: none; }

#ap0-2-3 { width: 100%; height: auto; display: none; }

#ap0-2-4 { width: 100%; height: auto; display: none; }

.ap0-2-12 { width: 23%; height: auto; position: relative; float: left; margin-top: 10px; margin-right: 10px; margin-bottom: 10px; margin-left: 10px; }

.phofo { width: 100%; position: relative; float: left; padding-bottom: 75%; height: 0; overflow: hidden; }

.photo { width: 100%; height: auto; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.photxt1 { -webkit-box-sizing: border-box; box-sizing: border-box; height: auto; color: #000000; font-family: "微軟正黑體"; font-size: 15px; text-align: left; width: 70%; float: left; position: relative; padding-left: 5px; padding-top: 8px; overflow-y: hidden; font-weight: bold; }

.photxt2 { -webkit-box-sizing: border-box; box-sizing: border-box; height: auto; color: #e33935; font-family: "微軟正黑體"; font-size: 18px; text-align: right; font-weight: bold; width: 30%; position: relative; float: right; padding-right: 5px; padding-top: 5px; overflow-y: hidden; }

/* ap0-3版面 */
.img01 { height: auto; width: 100%; }

#ap0-3-1 { width: 100%; height: auto; }

.ap0-3-11 { background-color: #ECECEC; border-bottom: 4px solid #98ABB1; width: 100%; position: relative; float: left; margin-bottom: 20px; }

.ap0-3-12 { position: relative; width: 65%; float: left; padding-right: 20px; padding-bottom: 20px; padding-top: 20px; padding-left: 20px; }

.ap0-3-13 { position: relative; width: auto; float: left; min-width: 210px; padding-right: 20px; padding-bottom: 20px; padding-top: 20px; padding-left: 20px; }

#ap0-3-2 { width: 100%; height: auto; display: none; }

#ap0-3-3 { width: 100%; height: auto; display: none; }

#ap0-3-4 { width: 100%; height: auto; display: none; }

#ap0-3-5 { width: 100%; height: auto; display: none; }

/* ap0-4版面 */
.ap0-4-1 { background-color: #005BAA; border-bottom: 4px solid #98ABB1; width: 91%; position: relative; float: left; margin-left: 4%; margin-bottom: 20px; }

.img02 { height: auto; width: 100%; }

.img03 { display: none; }

.ap0-4-2 { width: 91%; position: relative; float: left; margin-left: 4%; }

.ap0-4-21 { position: relative; width: 49%; float: left; height: 290px; background-color: #ECECEC; border-bottom: 4px solid #98ABB1; margin-right: 20px; margin-bottom: 20px; }

.ap0-4-31 { position: relative; width: 480px; float: left; height: 290px; margin-right: 20px; margin-bottom: 20px; }

.ap0-4-32 { position: relative; width: 300px; float: left; height: 500px; margin-right: 20px; margin-bottom: 20px; display: none; }

/* ap1-1版面 */
#ap1-1-1 { width: 100%; height: auto; position: relative; float: left; }

#ap1-2-1 { width: 100%; height: auto; }

#ap1-2-2 { width: 100%; height: auto; display: none; }

.ap1-form15 { width: 15%; position: relative; float: left; height: 40px; text-align: left; text-indent: 4px; }

.ap1-form25 { width: 25%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }

.ap1-form30 { width: 30%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }

.ap1-form40 { width: 40%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }

/* ap12-1版面 */
#ap12-1-1 { width: 100%; height: auto; position: relative; float: left; }

#ap12-2-1 { width: 100%; height: auto; }

#ap12-b0 { width: 30%; height: auto; position: relative; float: left; }

.ap12-b1 { width: 50%; position: relative; float: left; padding-left: 10px; height: 130px; max-width: 170px; }

.ap12-form15 { width: 15%; position: relative; float: left; height: 40px; }

/* ap12-1輪播 */
.ap12-photo { width: 100%; height: 100%; position: absolute; }

.ap12-photo2 { width: 100%; height: 100%; position: absolute; opacity: 0.5; }

#ap12-a0 { width: 70%; height: auto; position: relative; float: left; }

.ap12-a11 { width: 100%; height: auto; position: relative; float: left; }

.ap12-a12 { width: 100%; height: 0; padding-bottom: 70%; }

.ap12-a21 { width: 16.666%; height: auto; position: relative; float: left; }

.ap12-a22 { width: 100%; height: 0; padding-bottom: 75%; }

.ap12-al { position: absolute; left: 2%; top: 45%; z-index: 10; }

.ap12-ar { position: absolute; right: 2%; top: 45%; z-index: 10; }

/* ap2-1版面 */
#ap2-1-1 { width: 100%; height: auto; }

#ap2-2-1 { width: 100%; height: auto; }

/* ap3-1版面 */
#ap3-1-1 { width: 100%; height: auto; position: relative; float: left; }

#ap3-2-1 { width: 100%; height: auto; }

#ap3-2-2 { width: 100%; height: auto; display: none; }

.cptxt1 { -webkit-box-sizing: border-box; box-sizing: border-box; height: auto; color: #000000; font-family: "微軟正黑體"; font-size: 18px; text-align: left; width: 70%; float: left; position: relative; padding-left: 5px; padding-top: 8px; overflow-y: hidden; font-weight: bold; }

.cptxt1 .tel { color: #4D4A49; font-size: 15px; }

.cptxt2 { -webkit-box-sizing: border-box; box-sizing: border-box; height: auto; color: #000000; font-family: "微軟正黑體"; color: #4D4A49; font-size: 16px; text-align: right; width: 30%; float: right; position: relative; padding-right: 5px; padding-top: 8px; overflow-y: hidden; font-weight: bold; }

/* ap32-1版面 */
#ap32-1-1 { width: 100%; height: auto; position: relative; float: left; }

#ap32-2-1 { width: 100%; height: auto; }

/* ap4-1版面 */
#ap4-1-1 { width: 100%; height: auto; }

#ap4-2-1 { width: 100%; height: auto; }

/* ap5-1版面 */
#ap5-1-1 { width: 100%; height: auto; }

#ap5-2-1 { width: 100%; height: auto; }

#ap5-3-1 { width: 100%; height: auto; }

#ap5-4-1 { width: 100%; height: auto; }

#ap5-5-1 { width: 100%; height: auto; }

/* ap6-1版面 */
#ap6-1-1 { width: 100%; height: auto; }

.ap6-form10 { width: 10%; height: auto; float: left; position: relative; }

.ap6-form22 { width: 22.5%; height: auto; float: left; position: relative; }

/*--------------------------------1366---------------------------------*/
/*--------------------------------1280---------------------------------*/
/*--------------------------------1200---------------------------------*/
@media (max-width: 1200px) { /* 選單menu */
  .logo { height: 65px; }
  .mub { max-width: 88px; margin-bottom: 15px; }
  .mub:hover { margin-bottom: 20px; }
  /* ap0-3版面 */
  .ap0-3-12 { width: 60%; }
  /* ap0-4版面 */
  .ap0-4-21 { width: 42%; } }

/*--------------------------------1024---------------------------------*/
@media (max-width: 1024px) { /* 選單menu */
  .logo { margin-right: 5px; height: 60px; }
  .mub { max-width: 80px; }
  /*主題框topic*/
  .topic1 { width: 90%; }
  .topic2 { width: 100%; float: left; min-height: 10px; }
  .topic3 { width: 100%; position: relative; background-color: #00338E; height: auto; min-height: 50px; float: left; text-align: center; }
  /* ap0-2版面 */
  .ap0-2-12 { width: 23%; height: auto; position: relative; float: left; margin-top: 6px; margin-right: 6px; margin-bottom: 6px; margin-left: 6px; }
  .photxt1 { width: 100%; font-size: 12px; padding-left: 0; }
  .photxt2 { width: 100%; float: left; text-align: left; font-size: 15px; padding-right: 0; }
  /* ap0-3版面 */
  .ap0-3-12 { width: 50%; }
  /* ap3-2版面 */
  .cptxt1 { font-size: 14px; padding-left: 0; }
  .cptxt1 .tel { font-size: 13px; }
  .cptxt2 { float: left; font-size: 12px; padding-right: 0; } }

/*--------------------------------960---------------------------------*/
@media (max-width: 960px) { /* 選單menu */
  #mu-on { display: inherit; }
  .mub { display: none; }
  /* 輪播看板kban */
  /* ap0-3版面 */
  .ap0-4-21 { width: 86%; height: 400px; }
  /* ap1-1版面 */
  .ap1-form15 { width: 15%; position: relative; float: left; height: 40px; text-align: left; text-indent: 4px; }
  .ap1-form25 { width: 50%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }
  .ap1-form30 { width: 100%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }
  .ap1-form40 { width: 50%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; } }

/*--------------------------------768---------------------------------*/
@media (max-width: 768px) { /* aptxt1版面主文 */
  .aptxt1 { line-height: 30px; }
  /* ap0-3版面 */
  .ap0-3-12 { width: 90%; }
  .img01 { height: 265px; width: auto; }
  /* ap0-4版面 */
  .ap0-4-1 { margin-left: 0%; width: 96%; }
  .ap0-4-2 { margin-left: 0%; width: 96%; } }

/*--------------------------------640---------------------------------*/
@media (max-width: 640px) { /* 輪播看板kban */
  .kbimga { display: none; }
  .kbimgb { width: 100%; height: auto; display: inherit; }
  /* 網站地圖smap */
  #smap1 { display: none; }
  /* 按鈕 */
  .form10 { min-width: 145px; }
  .form20 { width: 100%; }
  .form25 { width: 100%; }
  .form30 { width: 100%; }
  .form40 { width: 100%; }
  .form50 { width: 100%; }
  .fobt0 { height: 25px; width: auto; margin-bottom: 5px; border: 2px solid #D7D7D6; }
  .fobt1 { width: 90%; border: 2px solid #D7D7D6; }
  .fobt2 { width: 90%; border: 2px solid #D7D7D6; }
  .fobt3 { border-style: solid; border-width: 1px; border-color: #a7a7a7; border-radius: 5px; background-image: -moz-linear-gradient(90deg, #cccccc 0%, white 100%); background-image: -webkit-linear-gradient(90deg, #cccccc 0%, white 100%); background-image: -ms-linear-gradient(90deg, #cccccc 0%, white 100%); width: auto; height: 30px; z-index: 67; color: #626262; font-family: "微軟正黑體"; font-size: 15px; font-weight: bold; padding-left: 20px; padding-right: 20px; margin-right: 20px; margin-bottom: 10px; }
  .apgo1 { left: 40%; }
  .apgo2 { left: 40%; }
  /* 車廠列表carlist*/
  .carlistimg { display: inline-block; width: 100%; height: auto; max-width: 80%; margin-bottom: 5px; }
  .carlist1 { width: 99%; position: relative; float: left; padding-left: 10px; height: 130px; }
  .clform15 { width: 33%; position: relative; float: left; padding-left: 10px; height: 85px; border-left: 1px solid #ECECEC; }
  .clform40 { width: 99%; position: relative; float: left; padding-left: 10px; height: 130px; border-left: 1px solid #ECECEC; }
  .cplist0 { width: 100%; height: auto; min-height: 75px; border-bottom: 1px solid #ECECEC; position: relative; float: left; }
  /* ap0-1版面 */
  .iccar { height: auto; width: 75px; }
  .img02 { display: none; }
  .img03 { display: inherit; width: 100%; height: auto; }
  .ap0-3-32 { width: 96%; height: 286px; }
  .carlogo { width: 30%; position: relative; float: left; margin-bottom: 10px; padding-top: 0px; padding-left: 0px; margin-right: 7px; padding-right: 0px; min-width: 0px; }
  /* ap0-2版面 */
  .ap0-2-12 { width: 23%; height: auto; position: relative; float: left; margin-top: 4px; margin-right: 4px; margin-bottom: 4px; margin-left: 4px; }
  /* ap1-1版面 */
  .ap1-form15 { width: 20%; position: relative; float: left; height: 40px; text-align: left; text-indent: 4px; }
  .ap1-form25 { width: 100%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }
  .ap1-form30 { width: 100%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }
  .ap1-form40 { width: 100%; position: relative; float: left; min-width: 155px; padding-left: 10px; height: 40px; }
  /* ap12-1版面 */
  #ap12-a0 { width: 100%; height: auto; position: relative; float: left; }
  #ap12-b0 { width: 100%; height: auto; position: relative; float: left; }
  .ap12-form15 { width: 33%; position: relative; float: left; height: 40px; } }

/*--------------------------------480---------------------------------*/
@media (max-width: 480px) { /* 選單menu */
  #logom { display: inherit; }
  .logo { display: none; }
  /* 車廠列表carlist*/
  .cplist1 { width: 99%; position: relative; float: left; padding-left: 10px; height: 130px; }
  .cplform15 { width: 30%; position: relative; float: left; padding-left: 10px; height: 130px; border-left: 1px solid #ECECEC; }
  .cplform50 { width: 70%; position: relative; float: left; padding-left: 10px; height: 130px; }
  /* aptxt1版面主文 */
  .aptxt1 { line-height: 25px; }
  /* ap0-2版面 */
  .ap0-2-12 { width: 47%; height: auto; position: relative; float: left; margin-top: 4px; margin-right: 4px; margin-bottom: 4px; margin-left: 4px; }
  /* ap0-3版面 */
  .ap0-3-12 { padding-right: 0px; }
  /* ap0-4版面 */
  .ap0-4-1 { width: 99%; }
  .ap0-4-2 { width: 99%; }
  .ap0-4-21 { width: 100%; height: 260px; }
  .ap0-4-31 { display: none; }
  .ap0-4-32 { display: inherit; margin-left: 17%; } }

/*--------------------------------415---------------------------------*/
@media (max-width: 415px) { /* 輪播看板kban */
  .kblrimg { height: 70px; width: auto; }
  /* 按鈕 */
  .apgo1 { left: 35%; }
  .apgo2 { left: 35%; }
  /* ap0-4版面 */
  .ap0-4-32 { margin-left: 10%; }
  /* 文字txt */
  .aptxt1 { font-size: 16px; line-height: 22px; }
  .txt0-18 { font-size: 16px; line-height: 20px; }
  .txt1-18 { font-size: 16px; line-height: 20px; }
  .txt2-18 { font-size: 16px; line-height: 20px; }
  .txt3-18 { font-size: 16px; line-height: 20px; } }

/*--------------------------------376---------------------------------*/
@media (max-width: 376px) { /* ap0-4版面 */
  .ap0-4-32 { margin-left: 5%; } }

/*--------------------------------320---------------------------------*/
@media (max-width: 320px) { /* 按鈕 */
  .apgo1 { left: 30%; }
  .apgo2 { left: 30%; }
  /* ap0-4版面 */
  .ap0-4-32 { margin-left: 0%; } }

/*--------------------------------文字---------------------------------*/
.txt0-18 { font-size: 18px; color: #FFF501; line-height: 28px; text-decoration: none; cursor: pointer; }

.txt1-12 { font-size: 12px; color: #FFFFFF; line-height: 22px; text-decoration: none; }

.txt1-13 { font-size: 13px; color: #FFFFFF; line-height: 23px; text-decoration: none; }

.txt1-15 { font-size: 15px; color: #FFFFFF; line-height: 25px; text-decoration: none; }

.txt1-16 { font-size: 16px; color: #FFFFFF; line-height: 26px; text-decoration: none; }

.txt1-18 { font-size: 18px; color: #FFFFFF; line-height: 28px; text-decoration: none; font-weight: bold; }

.txt1-21 { font-size: 21px; color: #FFFFFF; line-height: 31px; text-decoration: none; }

.txt1-28 { font-size: 28px; color: #FFFFFF; line-height: 38px; text-decoration: none; }

.txt2-12 { font-size: 12px; color: #000000; line-height: 22px; text-decoration: none; }

.txt2-13 { font-size: 13px; color: #000000; line-height: 23px; text-decoration: none; font-weight: bold; }

.txt2-15 { font-size: 15px; color: #000000; line-height: 25px; text-decoration: none; font-weight: bold; }

.txt2-16 { font-size: 16px; color: #000000; line-height: 26px; text-decoration: none; font-weight: bold; }

.txt2-18 { font-size: 18px; color: #000000; line-height: 28px; text-decoration: none; font-weight: bold; }

.txt2-21 { font-size: 21px; color: #000000; line-height: 31px; text-decoration: none; }

.txt2-28 { font-size: 28px; color: #000000; line-height: 38px; text-decoration: none; }

.txt3-12 { font-size: 12px; color: #787878; line-height: 22px; text-decoration: none; }

.txt3-13 { font-size: 13px; color: #787878; line-height: 23px; text-decoration: none; }

.txt3-15 { font-size: 15px; color: #787878; line-height: 25px; text-decoration: none; }

.txt3-16 { font-size: 16px; color: #787878; line-height: 26px; text-decoration: none; }

.txt3-18 { font-size: 18px; color: #787878; line-height: 28px; text-decoration: none; }

.txt3-21 { font-size: 21px; color: #787878; line-height: 31px; text-decoration: none; }

.txt3-28 { font-size: 28px; color: #787878; line-height: 38px; text-decoration: none; }

.txt4-12 { font-size: 12px; color: #5d5d5d; line-height: 22px; text-decoration: none; }

.txt4-13 { font-size: 13px; color: #5d5d5d; line-height: 23px; text-decoration: none; }

.txt4-15 { font-size: 15px; color: #5d5d5d; line-height: 25px; text-decoration: none; }

.txt4-16 { font-size: 16px; color: #5d5d5d; line-height: 26px; text-decoration: none; font-family: "微軟正黑體", Arial; }

.txt4-16b { font-size: 16px; color: #5d5d5d; line-height: 26px; text-decoration: none; font-family: "微軟正黑體", Arial; font-weight: bold; }

.txt4-18 { font-size: 18px; color: #5d5d5d; line-height: 38px; text-decoration: none; }

.txt4-21 { font-size: 21px; color: #5d5d5d; line-height: 31px; text-decoration: none; }

.txt4-28 { font-size: 28px; color: #5d5d5d; line-height: 38px; text-decoration: none; }

.txt5-12 { font-size: 12px; color: #e33935; line-height: 22px; text-decoration: none; }

.txt5-13 { font-size: 13px; color: #e33935; line-height: 23px; text-decoration: none; }

.txt5-15 { font-size: 15px; color: #e33935; line-height: 25px; text-decoration: none; }

.txt5-16 { font-size: 16px; color: #e33935; line-height: 26px; text-decoration: none; }

.txt5-18 { font-size: 18px; color: #e33935; line-height: 28px; text-decoration: none; font-weight: bold; }

.txt5-21 { font-size: 21px; color: #e33935; line-height: 31px; text-decoration: none; }

.txt5-28 { font-size: 28px; color: #e33935; line-height: 38px; text-decoration: none; }

.txt6-12 { font-size: 12px; color: #00338e; line-height: 22px; text-decoration: none; }

.txt6-13 { font-size: 13px; color: #00338e; line-height: 23px; text-decoration: none; }

.txt6-15 { font-size: 15px; color: #00338e; line-height: 25px; text-decoration: none; }

.txt6-16 { font-size: 16px; color: #00338e; line-height: 26px; text-decoration: none; }

.txt6-16b { font-size: 16px; color: #00338e; line-height: 26px; text-decoration: none; font-weight: bold; }

.txt6-16- { font-size: 16px; color: #00338e; line-height: 26px; text-decoration: underline; font-family: "微軟正黑體"; font-weight: bold; }

.txt6-18 { font-size: 18px; color: #00338e; line-height: 28px; text-decoration: none; }

.txt6-21 { font-size: 21px; color: #00338e; line-height: 31px; text-decoration: none; font-weight: bold; }

.txt6-28 { font-size: 28px; color: #00338e; line-height: 38px; text-decoration: none; }

/*--------------------------------連結文字---------------------------------*/
/* ---------------------  old vision revisied ----------------------- */
.but2.current, .but2[aria-pressed="true"] { background-image: -webkit-linear-gradient(270deg, #12387b 0%, #3769c3 100%); background-image: -webkit-gradient(linear, left top, left bottom, from(#12387b), to(#3769c3)); background-image: -webkit-linear-gradient(top, #12387b 0%, #3769c3 100%); background-image: -o-linear-gradient(top, #12387b 0%, #3769c3 100%); background-image: linear-gradient(180deg, #12387b 0%, #3769c3 100%); }

/* ---------------------  pagination ----------------------- */
.nav-page { color: #fff; margin: 8px 0; }

.nav-page a, .nav-page span { display: inline-block; text-align: center; padding: .25em .625em; margin-right: -3px; }

.nav-page a { text-decoration: none; }

.nav-page a, .nav-page a:hover, .nav-page a:focus, .nav-page a[aria-pressed="true"] { color: #fff; }

.nav-page a:hover { text-decoration: underline; }

.nav-page a.current, .nav-page span.current { background: #fdf400; color: #000; }

/* ---------------------  for nicescroll ----------------------- */
body { overflow-y: hidden; }

.figure { margin: 0; }

/* ------------------------ Items Gallery ----------------------- */
.items-gallery { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }

.items-gallery .ap0-2-12 { -webkit-box-sizing: border-box; box-sizing: border-box; float: none; margin: 0; min-width: 25%; padding: 10px 10px 20px; width: 25%; }

@media (max-width: 479px) { .items-gallery .ap0-2-12 { min-width: 50%; width: 50%; } }

/* ------------------------ Swiper ------------------------------ */
.swiper-container { height: 100%; max-width: 1200px; margin: 0 auto; width: 100%; }

.swiper-slide a { display: block; }

.swiper-slide img { display: block; height: auto; width: 100%; }

.swiper-container-horizontal > .swiper-pagination-bullets { bottom: 4px; }

.swiper-pagination-bullet { background: #00338e; opacity: 1; }

.swiper-pagination-bullet-active { background: #C9282D; }

.swiper-pagination.has-number { font-size: 12px; }

.swiper-pagination.has-number .swiper-pagination-bullet { border-radius: 0; color: #fff; height: 22px; line-height: 22px; margin-bottom: 6px; text-align: center; width: 22px; }

.swiper-button-prev { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30px' height='44px' viewBox='0 0 30 44'%3E%3Cpath fill='%23ffffff' d='M18.9,12l-10,10l10,10l2.2-2.1L13.2,22l7.9-7.9L18.9,12z'/%3E%3C/svg%3E"); left: 0; }

.swiper-button-next { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30px' height='44px' viewBox='0 0 30 44'%3E%3Cpath fill='%23ffffff' d='M9.9,14.1l7.8,7.9l-7.8,7.9L12,32l10.1-10l-10-10L9.9,14.1z'/%3E%3C/svg%3E"); right: 0; }

[class*='swiper-button-'] { background-color: rgba(0, 0, 0, 0.8); background-size: contain; opacity: .75; width: 30px; }

[class*='swiper-button-'].swiper-button-disabled { display: none; }

/* ------------------------ Top Swiper ------------------------------ */
.top-swiper { background-color: #2A2A2A; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); clear: both; margin-bottom: 15px; }

.top-swiper .img-lg { display: block; }

.top-swiper .img-sm { display: none; }

@media (max-width: 639px) { .top-swiper .img-lg { display: none; }
  .top-swiper .img-sm { display: block; } }

/* ------------------------ Gallery Swiper -------------------------- */
.gallery-swiper { -webkit-box-sizing: border-box; box-sizing: border-box; float: left; padding-right: 20px; width: 70%; }

.gallery-swiper .swiper-container { background-color: #fff; }

.gallery-swiper .figure { padding-top: 66.66667%; position: relative; margin: 0; overflow: hidden; }

.gallery-swiper .figure img { height: auto; max-height: 100%; width: 100%; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.gallery-top { -webkit-box-sizing: border-box; box-sizing: border-box; border-top: 1px solid #D7D7D6; }

.gallery-top [class*='swiper-button-'] { background-color: rgba(0, 0, 0, 0.25); }

.gallery-thumbs { border: 1px solid #D7D7D6; border-top-width: 0; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 11px 10px 10px; }

.gallery-thumbs .swiper-slide:not(.swiper-slide-thumb-active) { cursor: pointer; opacity: .5; }

.gallery-thumbs [class*='swiper-button-'] { background-color: rgba(0, 0, 0, 0.5); height: 24px; margin-top: -12px; opacity: 1; width: 16px; }

@media (max-width: 639px) { .gallery-swiper { float: none; width: 100%; padding-right: 0; }
  .gallery-top [class*='swiper-button-'] { background-color: rgba(0, 0, 0, 0.25); height: 32px; margin-top: -12px; width: 20px; }
  .gallery-thumbs { padding: 2px; border-bottom-width: 0; } }

/* ------------------------ Items Swiper ---------------------- */
.items-swiper { padding: 20px; }

.items-swiper .swiper-slide .ap0-2-12 { margin: 0; width: 100%; }

.items-swiper .swiper-pagination { margin: 20px 0 0; position: relative; }

/* ------------------------ Car picked ---------------------- */
.car-picked { -webkit-box-sizing: border-box; box-sizing: border-box; }

.car-picked .img-car { display: block; }

.car-picked .img-car img { display: block; width: 100%; height: auto; }

.car-picked .cell-img { margin-bottom: 8px; }

.car-picked .cell-info .in-top { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; -webkit-box-pack: justify; justify-content: space-between; -ms-flex-pack: space-between; }

.car-picked .col-info { width: 100%; }

.car-picked .col-price { color: #e33935; font-size: 32px; height: 64px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.car-picked .col-price small { display: inline-block; font-size: .625em; margin: .5em 0 0 0; }

.car-picked .col-badge { margin-left: 20px; width: 80px; }

.car-picked .info-title { font-size: 16px; font-weight: bold; height: 1.75em; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; width: 100%; }

.car-picked .info-desc, .car-picked .info-store { color: #5d5d5d; font-size: 14px; }

.car-picked .info-desc span, .car-picked .info-store span { display: inline-block; padding-right: 2px; margin-top: 2px; margin-bottom: 2px; }

.car-picked .info-desc span::after, .car-picked .info-store span::after { background-color: #e2e2e2; content: ''; display: inline-block; height: 1em; margin: -.125em 0 0 6px; vertical-align: middle; width: 1px; }

.car-picked .info-desc span:last-child::after, .car-picked .info-store span:last-child::after { display: none; }

/* ------------------------ Dealer info ----------------------- */
.ico-map { display: inline-block; vertical-align: middle; margin: -6px 0 0 15px; }

.ico-map img { width: 28px; height: auto; }

.dealer-info:after { content: ''; display: table; clear: both; }

.dealer-info .info { float: left; width: 65%; border-collapse: separate; border-spacing: 5px; margin-left: -5px; margin-top: -5px; }

.dealer-info .info td { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 10px; }

.dealer-info .info .txt1-18 { background-color: #515151; width: 20%; }

.dealer-info .info .txt3-18 { color: #333; }

.dealer-info .img { float: right; width: 35%; height: auto; }

@media (max-width: 639px) { .dealer-info .info, .dealer-info .img { float: none; width: 100%; }
  .dealer-info .info .txt1-18 { width: 40%; } }

/* ------------------------ Car list ----------------------- */
.badge-good { background: url(../imgs/icon-06.png) no-repeat center center; background-size: contain; overflow: hidden; padding-top: 53.33333%; text-indent: -100em; width: 100%; }

.ct-tag { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14px' height='14px' viewBox='0 0 14 14'%3E%3Cpath fill='%2300338e' d='M11.9,3.5L11.9,3.5C12.4,3.9,12.4,4.6,12,5l-5.6,5.6c-0.4,0.4-1,0.4-1.4,0L2,7.5C1.6,7.1,1.6,6.4,2,6L2.1,6c0.4-0.4,1-0.4,1.4,0l2.3,2.3l4.8-4.8C10.9,3.1,11.6,3.1,11.9,3.5z'/%3E%3C/svg%3E"); background-size: 14px 14px; background-repeat: no-repeat; background-position: 5px center; border: solid 1px rgba(0, 51, 142, 0.65); -webkit-box-sizing: border-box; box-sizing: border-box; color: #00338e; display: inline-block; font-size: 14px; line-height: 1; margin-top: 5px; padding: 5px 5px 5px 24px; }

.ct-tag.disable { background-color: #f9f9f9; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14px' height='14px' viewBox='0 0 14 14'%3E%3Cpath fill='%23c6c6c6' d='M10.3,3.7c-0.4-0.4-1-0.4-1.4,0L7,5.6L5.1,3.7c-0.4-0.4-1-0.4-1.4,0s-0.4,1,0,1.4L5.6,7L3.7,8.9c-0.4,0.4-0.4,1,0,1.4	s1,0.4,1.4,0L7,8.4l1.9,1.9c0.4,0.4,1,0.4,1.4,0s0.4-1,0-1.4L8.4,7l1.9-1.9C10.7,4.7,10.7,4.1,10.3,3.7z'/%3E%3C/svg%3E"); border-color: #d7d7d7; color: #b3b3b3; }

.car-list { list-style: none; margin: 0; padding: 0; }

.car-list .img-car { display: block; }

.car-list .img-car img { display: block; width: 100%; height: auto; }

.car-list .cell-info .in-top { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }

.car-list .col-price { color: #e33935; }

.car-list .col-price small { display: inline-block; font-size: .625em; margin: .5em 0 0 0; }

.car-list .info-title { font-weight: bold; }

.car-list .info-desc, .car-list .info-store { color: #5d5d5d; }

.car-list .info-desc span, .car-list .info-store span { display: inline-block; padding-right: 6px; margin-top: 4px; margin-bottom: 4px; }

.car-list .info-desc span::after, .car-list .info-store span::after { background-color: #e2e2e2; content: ''; display: inline-block; height: 1em; margin: -.125em 0 0 9px; vertical-align: middle; width: 1px; }

.car-list .info-desc span:last-child::after, .car-list .info-store span:last-child::after { display: none; }

.car-list.list-view { display: block; padding-left: 30px; padding-right: 30px; }

.car-list.list-view li { padding: 20px 0; }

.car-list.list-view li + li { border-top: solid 1px #ececec; }

@media (min-width: 640px) { .car-list.list-view li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; }
  .car-list.list-view .cell-img { padding-right: 10px; }
  .car-list.list-view .cell-img .img-car { width: 240px; }
  .car-list.list-view .cell-info { padding-left: 10px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-flex-grow: 1; -moz-flex-grow: 1; -ms-flex-grow: 1; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }
  .car-list.list-view .cell-info .in-top { -webkit-flex-grow: 1; -moz-flex-grow: 1; -ms-flex-grow: 1; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }
  .car-list.list-view .cell-info .in-bottom { padding-top: 8px; }
  .car-list.list-view .col-info { -webkit-flex-grow: 1; -moz-flex-grow: 1; -ms-flex-grow: 1; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }
  .car-list.list-view .col-price, .car-list.list-view .col-badge { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -webkit-box-pack: center; justify-content: center; -ms-flex-pack: center; }
  .car-list.list-view .col-price { font-size: 40px; min-width: 180px; padding: 10px 10px; text-align: center; }
  .car-list.list-view .col-badge { padding: 10px 10px; width: 16%; min-width: 80px; }
  .car-list.list-view .info-title { font-size: 20px; min-height: 2.5em; margin: .125em 0 0; } }

@media (max-width: 639px) { .car-list.list-view { padding-top: 10px; }
  .car-list.list-view .cell-img { margin-bottom: 10px; }
  .car-list.list-view .cell-info .in-top { -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; -webkit-box-pack: justify; justify-content: space-between; -ms-flex-pack: space-between; }
  .car-list.list-view .col-info { width: 100%; }
  .car-list.list-view .col-price { font-size: 40px; }
  .car-list.list-view .col-badge { margin-left: 20px; width: 80px; }
  .car-list.list-view .info-title { font-size: 18px; margin-bottom: 8px; }
  .car-list.list-view .info-desc, .car-list.list-view .info-store { font-size: 14px; } }

@media (max-width: 575px) { .car-list.list-view { padding-right: 24px; padding-left: 24px; } }

.car-list.gallery-view { -webkit-box-sizing: border-box; box-sizing: border-box; padding-left: 20px; padding-right: 20px; padding-top: 10px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }

.car-list.gallery-view li { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 20px 10px; width: 25%; }

.car-list.gallery-view .cell-img { margin-bottom: 8px; }

.car-list.gallery-view .cell-info .in-top { -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; -webkit-box-pack: justify; justify-content: space-between; -ms-flex-pack: space-between; }

.car-list.gallery-view .col-info { width: 100%; }

.car-list.gallery-view .col-price { font-size: 32px; height: 64px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.car-list.gallery-view .col-badge { margin-left: 20px; width: 80px; }

.car-list.gallery-view .info-title { font-size: 16px; height: 3em; overflow: hidden; }

.car-list.gallery-view .info-desc, .car-list.gallery-view .info-store { font-size: 14px; }

.car-list.gallery-view .info-desc span, .car-list.gallery-view .info-store span { padding-right: 2px; margin-top: 2px; margin-bottom: 2px; }

.car-list.gallery-view .info-desc span::after, .car-list.gallery-view .info-store span::after { margin-top: -.25em; margin-left: 6px; }

@media (max-width: 919px) { .car-list.gallery-view { padding-left: 10px; padding-right: 10px; padding-top: 0; }
  .car-list.gallery-view li { width: 50%; } }

@media (max-width: 575px) { .car-list.gallery-view .col-price { font-size: 24px; height: 56px; }
  .car-list.gallery-view .col-badge { width: 64px; }
  .car-list.gallery-view .info-title { font-size: 15px; }
  .car-list.gallery-view .info-desc, .car-list.gallery-view .info-store { font-size: 13px; }
  .car-list.gallery-view .info-desc span, .car-list.gallery-view .info-store span { padding-right: 2px; margin-top: 2px; margin-bottom: 2px; }
  .car-list.gallery-view .info-desc span::after, .car-list.gallery-view .info-store span::after { margin-left: 6px; }
  .car-list.gallery-view .ct-tag { font-size: 12px; padding: 4px 2px 4px 24px; } }

@media (max-width: 374px) { .car-list.gallery-view .cell-img { margin-bottom: 4px; }
  .car-list.gallery-view .ct-tag { background-size: 12px 12px; background-position: 4px center; padding: 4px 2px 4px 18px; } }

@media (max-width: 359px) { .car-list.gallery-view .ct-tag { background-position: 3px center; background-size: 10px 10px; font-size: 11px; padding: 4px 2px 4px 14px; }
  .car-list.gallery-view .col-badge { width: 48px; } }

/* ----------------------- warranty flow ----------------------- */
.process-flow { -webkit-box-sizing: border-box; box-sizing: border-box; list-style: none; margin: 15px 0; padding: 0; }

.process-flow li { background-color: #308AD5; background-clip: padding-box; -webkit-box-sizing: border-box; box-sizing: border-box; color: #fff; min-height: 76px; padding: 10px 15px; position: relative; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.process-flow li::before, .process-flow li::after { content: ''; display: block; position: absolute; }

.process-flow li::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='102px' height='76px' viewBox='0 0 102 76'%3E%3Cpath fill='%232250a7' d='M67.3,76H0V0h102L67.3,76z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right top; background-size: cover; left: 0; top: 0; height: 100%; width: 90px; z-index: 1; }

.process-flow li::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28px' height='16px' viewBox='0 0 28 16'%3E%3Cpath fill='%232c51a9' d='M20,1v6H2v2h18v6l7-7L20,1z'/%3E%3C/svg%3E"); background-position: center center; background-repeat: no-repeat; background-size: contain; height: 28px; width: 28px; }

.process-flow li:last-child::after { display: none; }

.process-flow .flow-order { color: #fff; left: 3px; line-height: 1; position: absolute; text-align: center; top: 12px; width: 64px; z-index: 2; }

.process-flow .flow-order .order-text { display: block; font-size: 15px; letter-spacing: .25em; margin-bottom: 4px; padding-left: .25em; }

.process-flow .flow-order .order-num { display: block; font-size: 32px; font-weight: bold; }

.process-flow .flow-text { position: relative; z-index: 2; }

@media (min-width: 992px) { .process-flow { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; -webkit-box-pack: justify; justify-content: space-between; -ms-flex-pack: space-between; }
  .process-flow li { padding-left: 92px; width: calc(100% - 80px); }
  .process-flow li:first-child { margin-right: 40px; }
  .process-flow li:last-child { margin-left: 40px; }
  .process-flow li::after { right: -34px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } }

@media (max-width: 991px) { .process-flow li { padding-left: 92px; margin-bottom: 40px; min-height: 88px; }
  .process-flow li::after { bottom: -34px; left: 50%; -webkit-transform: translateX(-50%) rotate(90deg); -ms-transform: translateX(-50%) rotate(90deg); transform: translateX(-50%) rotate(90deg); }
  .process-flow li:last-child { margin-bottom: 0; }
  .process-flow .flow-order { top: 17px; } }