/* goToTop */
.goToTop { position: relative; bottom: 0;}

/* 車輛收藏 */
.buyCar_addLike{ padding: 5px; cursor: pointer; z-index: 9;
  position: absolute; right: 5px; top: 5px;
  background-color: #fff; border: solid 1px #e5e5e5; border-radius: 3px;
}
.buyCar_addLike a{ width: 100%; height: 100%; display: block;
  color: #ccc; font-size: 20px; line-height: 100%;}
.buyCar_addLikeActive { background-color: #f66; border: #f66;}
.buyCar_addLikeActive a{ color: #fff;}

/* 車輛比較 */
.buyCar_compare{ position: absolute; right: 5px; top: -5px;
  background-color: orange;
  /*chrome*/
  -webkit-mask-image: url(../images/icon/carCompare.svg);
  -webkit-mask-repeat: no-repeat; -webkit-mask-position: center;
  /*firefox*/
  mask-image: url(../images/icon/carCompare.svg);
  mask-repeat: no-repeat; mask-position: center;
  /*漸變效果*/
  -webkit-transition:all 200ms ease-out; -mozilla-transition:all 200ms ease-out;
  -ms-transition:all 200ms ease-out; -o-transition:all 200ms ease-out;
  transition:all 200ms ease-out;
}
.buyCar_compareActive{ background-color: #73b000;}
.buyCar_compare:active{ background-color: #2c6f01;}
.buyCar_compare a{
  width: 50px; height: 50px; display: block;
  text-align: center; font-size: 20px; line-height: 40px;
  text-decoration: none; color: #fff;
}
@media screen and (max-width: 768px) {
  .buyCar_compare{ right: 0;}
}
/* 車輛比較面板 */
.carComparePanel{ width: 100%; position: fixed; bottom: 0; left: 0; z-index: 50;}
.carComparePanel .content{ width: 1200px; max-width: calc(100% - 20px); margin: 0 auto;}
.carComparePanel .btn_compare{ height: 40px; padding: 0 25px; display: inline-block;
  line-height: 40px; background: rgba(0,0,0,0.85);
  font-size: 18px; font-weight: 600; text-decoration: none; color: #fff;}
.carComparePanel .btn_compare i{
  margin-right: 8px; display: inline-block; vertical-align: middle;
  -webkit-transition:all 200ms ease-out; -mozilla-transition:all 200ms ease-out;
  -ms-transition:all 200ms ease-out; -o-transition:all 200ms ease-out;
  transition:all 200ms ease-out;
}
.carComparePanel .collapsed i{
  -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg);}
.carComparePanel .thePanel{ background: rgba(0,0,0,0.85); overflow: hidden;}
.carComparePanel .well{ margin: 20px 0; padding-bottom: 10px; overflow: hidden;
  position: relative; font-size: 15px;}
.carComparePanel .well > p{ margin-bottom: 20px;}
.carComparePanel .theBtn{ width: 200px; position: absolute; top: 0; right: 10px;
  text-align: center;}
.carComparePanel .theBtn a{ width: 49%; padding: 5px 0; margin: 15px 0;
  display: inline-block; border: solid 1px #c90b0b; border-radius: 5px;
  text-align: center; text-decoration: none;
  font-size: 16px; font-weight: bold; color: #c90b0b;}
.carComparePanel .theBtn a.solid{ background: #c90b0b; color: #fff;}
@media screen and (max-width: 768px) {
  .carComparePanel .theBtn{ width: 100%; position: relative; right: 0;}
}
.carComparePanel .compareCar{ margin-top: 10px;}
.carComparePanel .compareCar .carInfo{ position: relative; overflow: hidden;}
.carComparePanel .compareCar .carInfo .close{ width: 24px; height: 24px;
  position: absolute; top: 5px; right: 5px; z-index: 10; text-align: center;
  background-color: #fff; border-radius: 50%; opacity: 0.5;}
.carComparePanel .compareCar .carInfo .close img{ vertical-align: baseline;}
.carComparePanel .compareCar .carInfo .close:hover{ opacity: 1;}
.carComparePanel .compareCar .carInfo .mask{ width: 100%; height: 100%; padding: 0;
  position: absolute; top: 0; left: 0; z-index: 5; box-sizing: border-box;
  box-sizing: border-box; background: rgba(0, 0, 0, 0.75); border: solid 4px rgba(0, 0, 0, 0);
  color: #fff; opacity: 0; display: flex; align-items: center;
  -webkit-transition:all 200ms ease-out; -mozilla-transition:all 200ms ease-out;
  -ms-transition:all 200ms ease-out; -o-transition:all 200ms ease-out;
  transition:all 200ms ease-out;
}
.carComparePanel .compareCar .carInfo:hover .mask{ opacity: 1;}
.carComparePanel .compareCar .carInfo .maskActive{ border: solid 4px #c90b0b; opacity: 1;}
.carComparePanel .compareCar .carInfo .mask div{ width: 100%; text-align: center;}
.carComparePanel .compareCar .carInfo .mask h3{ font-size: 15px; margin-top: 10px;}
.carComparePanel .compareCar .carInfo .mask h4{ font-size: 24px; color: #ffc72a; font-weight: bold;}
@media screen and (max-width: 1024px) {
  .carComparePanel .compareCar .carInfo .mask h3{ font-size: 12px; margin: 3px 0;}
  .carComparePanel .compareCar .carInfo .mask h4{ font-size: 16px; margin: 3px 0;}
}
.carComparePanel .compareCar .carInfo > img{ width: 100%;}

/* 車輛比較頁面 */
.compareResult { margin: 80px 10px 30px 10px;}
.compareResult .carCondition{ border: none;}
.compareResult thead th{ color: #fff; font-size: 20px;
  background-image: url(../images/bgNavSubmenu_1.png);
  background-repeat: no-repeat; background-position: 5px top; background-color: #777;
}
.compareResult td,
.compareResult th { padding: 8px 10px; border: none; vertical-align: top;}
.compareResult th { border-right: solid 1px #ccc;
  text-align: center; font-size: 16px; font-weight: bold;}
.compareResult td { overflow: hidden; word-break: break-word; border-right: dotted 1px #ccc;}
.compareResult thead img { width: 100%;}
.compareResult td dl{ margin-bottom: 0;}
.compareResult td dl dt{ margin-top: 8px; color: #ce0d0c;}
.compareResult td dl dt:first-child{ margin-top: 0;}
.compareResult td .dealerName{ font-size: 15px;}
.compareResult td dl.dealerInfo dt,.compareResult td dl.dealerInfo dd{
  display: inline-block; vertical-align: top;}
.compareResult td dl.dealerInfo dt:first-child{ margin-top: 8px;}
.compareResult td dl.dealerInfo dd{ width: calc(100% - 50px); margin-top: 8px;}

@media only screen and (max-width: 767px) {
  .compareResult { margin-top: 70px}
  .compareResult tr { position: relative; display: flex; flex-flow: row wrap;}
  .compareResult td,
  .compareResult th { display: block; flex-grow: 1;}
  .compareResult td { width: 30.25404%;}
  .compareResult th { width: 100%;}
  .compareResult th:empty { display: none;}
  .compareResult tbody th { padding: 8px 12px;
    background-color: #fff; border-top: 1px solid #d7ccc8; border-right: none;}
  .compareResult thead td:empty { min-height: 75px}
  .compareResult td dl.dealerInfo dt,.compareResult td dl.dealerInfo dd{ width: 100%;}
  .compareResult td dl.dealerInfo dd{ margin-top: 0;}
}

@media only screen and (min-width: 768px) and (max-width: 1200px) {
  .compareResult td { width: 29%;}
  .compareResult th { width: 13%;}
}

@media only screen and (min-width: 1200px) {
  .compareResult { width: 1200px; margin: 30px auto;}
  .compareResult td { width: 30%}
  .compareResult th { width: 10%;}
}

@media only screen and (min-width: 768px) {
  .compareResult thead th{ background-position: 110% bottom; background-size: 50%;}
  .compareResult thead td{ padding: 0 5px;}
  .compareResult tbody tr:nth-child(even) { background-color: #fff;}
  .compareResult thead td:empty { min-height: 100px}
}

/* 車輛輪播放大圖 */
.carDetailPic > div{ display: flex; height: 100%; align-items: center;}
.carDetailPic > div img{ width: 96%; max-width: 1024px; margin: 0 auto;}

/* 銷售功能 */
.salesFunction{ margin: -5px -5px 0 -5px;}
.salesFunction li{ padding: 5px 4px;}
.salesFunction a{ padding: 8px 0; display: block;
  border-radius: 5px; background: #e00e0d;
  text-align: center; color: #fff;}

.btn-ghost{ width: 100%; margin: 5px 0 10px 0; padding: 8px; text-align: center;
  border: solid 1px #e00e0d; border-radius: 5px; color: #e00e0d;}

/* SUM服務 */
.table-responsive .table-bordered thead tr th{ background: #fff;
  text-align: center; font-size: 15px; color: #333;}
.table-responsive .table-bordered tr{ background-color: #f9f9f9; color: #666;}
.table-responsive .table-bordered tr.gray{ background-color: #f2f2f2;}

/* 車商介紹 */
.btnDealerTitle1 a.forPc{ display: inline-block;}
.btnDealerTitle1 a.forM{ display: none;}
@media screen and (max-width: 768px){
    .btnDealerTitle1 a.forPc{ display: none;}
    .btnDealerTitle1 a.forM{ display: inline-block;}
}