a {
    color: inherit;
    text-decoration: none;
}

a:hover{
  color: inherit;
  text-decoration: none;
}

#joy .header-list li.css-joy > a,
#stories .header-list li.css-stories > a {
  color: #0170BF;
}

#joy .header-list li.css-joy a:after,
#stories .header-list li.css-stories a:after {
  color: #0170BF;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}

body nav:last-child {
  margin-bottom: 30px;
}

#joy .ttl-page ,
#stories .ttl-page {
  margin-top: 50px;
}

.latest-stories .stories-item {
  cursor: pointer;
}

.stories-bar {
  list-style: none;
  padding: 0;
}

.stories-bar>li {
  display: inline-block;
  padding: 5px 10px;
}

.stories-bar>li:first-child {
  padding-left: 0;
}

.stories-bar>li>a {
  color: #000;
  text-decoration: none;
  transition: color 0.25s linear;
  -o-transition: color 0.25s linear;
  -moz-transition: color 0.25s linear;
  -webkit-transition: color 0.25s linear;
}

.stories-bar>li>a.active {
  color: #0170BF;
}

.stories-bar>li>a:hover,
.stories-bar>li>a:focus {
  color: #0170BF;
  text-decoration: none;
}

#heighlight-slider {
  margin: 30px 0;
}

#heighlight-slider .heighlight-slide {
  padding: 0 13px;
  position: relative;
}

#heighlight-slider .heighlight-slide .desc {
  position: absolute;
  top: 10%;
  left: 6%;
  width: 45%;
}

#heighlight-slider a {
  color: inherit;
  text-decoration: none;
}

#heighlight-slider a:hover,
#heighlight-slider a:focus {
  color: inherit;
  text-decoration: none;
}

#heighlight-slider .heighlight-slide .desc>span {
  border-bottom: 1px solid #CCC !important;
  color: #CCC !important;
}

#heighlight-slider .desc>a,
#heighlight-slider .heighlight-slide .desc>a {
  color: #FFF;
  /*padding: 5px 30px 2px 30px;*/
  padding: 1.8% 10% 1.5%;
  font-size: 12px;
}
.desc .btn{
      padding: 2% 10% 1.5%;
}
.pagination a.btn-bmw-dark {
    padding: 7px 12px;
    margin-top: 0px;
}
.pagination .glyphicon {
    top: 4px;
}

/*#heighlight-slider .heighlight-slide .desc>h6 {
  font-size: 40px;
}*/

#heighlight-slider .heighlight-slide .slide-img {
  width: 100%;
  padding-bottom: 50%;
  background-size: 100% !important;
}

#heighlight-slider ul.bmw-pagging {
  position: relative;
  bottom: 0;
  margin-top: 20px;
}

#heighlight-slider ul.bmw-pagging>li {
  background-color: #666;
}

#heighlight-slider ul.bmw-pagging>li.slick-active {
  opacity: 1;
  background: #0170BF;
}
.latest-stories a{
  /*color: #000;
  text-decoration: none;*/
}
.latest-stories .img {
  padding-bottom: 64%;
  background-size: 100% !important;
  margin-bottom: 10px;
}

#heighlight-slider .slick-slide>.desc {
  color: #FFF;
}

#heighlight-slider .slick-slide>.desc>span,
.first-box .desc > span,
.first-stories .desc > span,
.secound-stories .desc > span,
.latest-stories span {
  font-size: 12px;
  line-height: 1.9;
  display: inline-block;
  border-bottom: 1px solid #666;
  line-height: 1.2;
  color: #666;
}
/*#heighlight-slider .slick-slide>.desc>span > a,
.first-box span> a,
.first-stories span> a,
.secound-stories span> a,
.latest-stories span> a,
.first-box span> a {
 color: #666;
}*/

#heighlight-slider .slick-slide>.desc>p,
.first-stories p,
.secound-stories p,
.latest-stories p {
  font-size: 14px;
  line-height: 2.3;
  margin-bottom: 7px;
  display: -webkit-box;
  white-space: pre-line;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.latest-stories p {
  margin-bottom: 40px;
}

.secound-stories .img,
.first-stories .img {
  padding-bottom: 64%;
  background-size: 100% !important;
}

.secound-stories {
  margin-bottom: 40px;
}

#bmwstories .bmw-pagging {
  bottom: 0;
}
.index-bmwstories .story-slide div {
  padding-bottom: 63.695%;
  margin-bottom: 10px;
  transition: background 0.23s ease-in-out;
  -moz-transition: background 0.23s ease-in-out;
  -webkit-transition: background 0.23s ease-in-out;
  transition: background 0.23s ease-in-out;
  cursor: pointer;
  background-size: 100% !important;
}
.index-bmwstories .story-slide:hover div{
  background-size: 103% !important;
}
.index-bmwstories {
  background: #000 url(/dist/asset/images/bg-index-stories.jpg) top right no-repeat;
  background-size: 60%;
  padding-top: 30px;
}
/*.index-bmwstories .story-slide h6 > a,
.index-bmwstories .story-slide span > a,
.index-bmwstories .story-slide p > a{
  font-family: 'bmw_thailandregular' !important;
 color: inherit;
 text-decoration: none;
}*/
.index-bmwstories .story-slide {
  text-decoration: none;
  cursor: pointer;
  padding: 0 5px;
  outline: none;
}

.index-bmwstories .story-slide div {
  padding-bottom: 63.695%;
  margin-bottom: 10px;
}

.index-bmwstories .story-slide span {
  font-size: 12px;
  line-height: 1.9;
  display: inline-block;
  border-bottom: 1px solid #666;
  line-height: 1.2;
  color: #666;
}
.index-bmwstories .story-slide:hover h6,
.index-bmwstories .story-slide:hover span{
  color: #159CFF;
}
.index-bmwstories .story-slide:hover span{
  border-color: #159CFF;
}

.index-bmwstories .story-slide h6,
.index-bmwstories .story-slide span{
   transition: color 0.23s ease-in-out, border-color 0.23s ease-in-out;
  -moz-transition: color 0.23s ease-in-out, border-color 0.23s ease-in-out;
  -webkit-transition: color 0.23s ease-in-out, border-color 0.23s ease-in-out;
  transition: color 0.23s ease-in-out, border-color 0.23s ease-in-out;
}
/*.index-bmwstories .story-slide div {
  padding-bottom: 63.695%;
  margin-bottom: 10px;
  transition: background 0.23s ease-in-out;
  -moz-transition: background 0.23s ease-in-out;
  -webkit-transition: background 0.23s ease-in-out;
  transition: background 0.23s ease-in-out;
  cursor: pointer;
  background-size: 100% !important;
}
.index-bmwstories .story-slide:hover div{
  background-size: 103% !important;
}*/
.index-bmwstories .story-slide p {
  font-size: 12px;
  /*line-height: 1.9;*/
  line-height: 2.3;
  margin-bottom: 12px;
  margin-bottom: 70px;
  display: -webkit-box;
  white-space: pre-line;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.story-pager div {
  padding: 0;
}

.privilege-slide-container .thumbnail-img,
.stories-item .img{
  transition: background 0.23s ease-in-out;
  -moz-transition: background 0.23s ease-in-out;
  -webkit-transition: background 0.23s ease-in-out;
  cursor: pointer;
}
.privilege-slide-container:hover .thumbnail-img,
.stories-item:hover .img{
 background-size: 103% !important;
}

.story-pager .img {
  position: relative;
  padding-bottom: 22%;
  background-size: 100% !important;
   transition: background 0.23s ease-in-out;
  -moz-transition: background 0.23s ease-in-out;
  -webkit-transition: background 0.23s ease-in-out;
  transition: background 0.23s ease-in-out;
  cursor: pointer;
}
.story-pager .img:hover {
  background-size: 103% !important;
}
.story-pager .img::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
}

.story-pager .img a,
.story-pager .img a span {
  position: absolute;
  top: 50%;
  -moz-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 1;
  text-decoration: none;
}

.story-pager div:first-child .img a {
  padding-left: 70px;
  padding-right: 10px;
}

.story-pager div:first-child .img a span {
  left: 30px;
  font-size: 30px;
  top: 54%;
}

.story-pager div:first-child .img a h3 {
  font-size: 22px;
}

.story-pager div:nth-child(2) .img a {
  padding-right: 70px;
  padding-left: 10px;
  right: 0;
  text-align: right;
}

.story-pager div:nth-child(2) .img a span {
  right: 30px;
  font-size: 30px;
  top: 54%;
}

.story-pager div:nth-child(2) .img a h3 {
  font-size: 22px;
}

.join-now{
  padding: 3% 0;
  background: url(/dist/asset/images/share/join-bg.jpg) center center no-repeat;
  background-size: cover!important;
}
.join-now div {
  /*text-align: center;*/
  /*padding: 40px 0;*/
  /*background: url(/dist/asset/images/share/join-bg.jpg) center center no-repeat;
  background-size: cover;*/
}
.join-now a{
      padding: 6px 40px 5px;
}
.join-now p:first-child {
  font-size: 45px;
  display: inline-block;
  margin-bottom: 0px
}

.join-now p:nth-child(2) {
  font-size: 18px;
  margin-bottom: 5px;
}
/*
.join-now p:first-child:after {
  content: '';
  display: block;
  position: relative;
  width: 25%;
  height: 4px;
  background: #000;
  margin: 0 auto;
}*/

.join-now button {
  padding: 5px 55px;
}

.social-list {
  list-style: none;
  padding: 0;
  text-align: right;
  padding-right: 10px;
}

.social-list li {
  display: inline-block;
}

.social-list li:not(:last-child) {
  margin-right: 8px;
}

.story-thumnail {
  margin-bottom: 20px;
  /*margin-top: 100px;*/
  position: relative;
}
.story-thumnail .first-box {
  position: absolute;
  top: 7%;
  z-index: 3;
  text-align: center;
}

.story-thumnail .first-box > h2{
  margin-top: 10px;
}

.joy-dtl .story-thumnail .first-box {
  position: absolute;
  top: 20px;
  z-index: 3;
  text-align: center;
}

.story-thumnail .secound-box .img {
  background-size: 100% !important;
  padding-bottom: 47%;
}
.heighlight-slide .slide-img{
  position: relative;
}
.heighlight-slide .slide-img::before,
.story-thumnail .secound-box .img::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 65%);
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 65%);
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 65%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str(rgba(0, 0, 0, 0.9))}', endColorstr='#{ie-hex-str(rgba(0, 0, 0, 0))}', GradientType=0);
}

.story-thumnail .secound-box .img::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0.9) 100%);
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0.9) 100%);
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0.9) 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str(rgba(0, 0, 0, 0))}', endColorstr='#{ie-hex-str(rgba(0, 0, 0, 0.9))}', GradientType=0);
}

.story-detail .col-xs-12 {
  margin-top: -7%;
  background: white;
  padding: 3% 3% 0 4%;
}

.story-detail .col-xs-12 a:visited,
.story-detail .col-xs-12 a:hover,
.story-detail .col-xs-12 a:link{
  text-decoration: underline;
}

.story-ttl {
  margin-top: 0;
}

.secound-stories,
.first-stories {
  position: relative;
}

.secound-stories {
  /*position: relative;*/
  margin-top: -5%;
}

.first-stories .img-box,
.secound-stories .img-box {
  position: absolute;
}

.first-stories .desc {
  text-align: left;
  position: absolute;
  right: 0;
  top: 0;
  padding-left: 3%;
}

.secound-stories .desc {
  text-align: right;
  position: absolute;
  left: 0;
  bottom: 0;
  padding-right: 3%;
}

/*.first-stories .desc > a,
.secound-stories .desc > a {
  font-family: 'bmw_thailandregular' !important;
  color: #000;
  padding: 5px 30px 2px 30px;
  font-size: 12px;
}
.secound-stories .desc > h6 > a,
.secound-stories .desc > p > a,
.first-stories .desc > h6 > a,
.first-stories .desc > p > a{
  font-family: 'bmw_thailandregular' !important;
  color: #000 !important;
}
.secound-stories .desc > h6 > a:hover,
.secound-stories .desc > p > a:hover
.first-stories .desc > h6 > a:hover,
.first-stories .desc > p > a:hover{
  color: #000 !important;
}*/
#heighlight-slider .slick-slide>.desc>a:hover,
#heighlight-slider .slick-slide>.desc>a:focus,
.first-stories .desc a:focus,
.secound-stories .desc a:focus,
.first-stories .desc a:hover,
.secound-stories .desc a:hover {
  text-decoration: none;
}


/*.secound-stories:hover .desc h6,
.secound-stories:hover .desc p,
.first-stories:hover .desc h6,
.first-stories:hover .desc span,*/
.latest-stories .stories-item > h6,
.latest-stories .stories-item > span,
.stories-item .desc > h6,
.stories-item .desc > span{
  transition: color 0.3s ease-in-out;
  -webkit-transition: color 0.3s ease-in-out;
  -moz-transition: color 0.3s ease-in-out;
  -ms-transition: color 0.3s ease-in-out;
  -o-transition: color 0.3s ease-in-out;
}
.latest-stories .stories-item:hover > h6,
.latest-stories .stories-item:hover > span,
.stories-item:hover .desc > h6,
.stories-item:hover .desc > span{
  color: #159CFF;
}
.latest-stories .stories-item:hover > span,
.stories-item:hover .desc > span{
  border-color: #159CFF;
}


h6,
.h6 {
  /*font-size: 30px;*/
  line-height: 1.7;
}

.privilege-slide-container .thumbnail-img {
  padding-bottom: 62%;
}

.privilege-slide-wrapper .slick-slide {
  padding: 4px;
}

.privilege-slide-container .desc {
  /*padding-bottom: 31.5%;*/
  padding-top: 20px;
  padding-left: 50px;
}

.privilege-slide-container .desc h5 {
  font-size: 35px;
}

.privilege-slide-container .desc p {
  font-size: 14px;
}

.privilege-slide-container .desc hr {
  border-top: 3px solid #000;
  width: 30%;
  margin-left: 0;
}

.privilege-btn-prev {
  display: table;
  text-align: left;
}

.privilege-btn-next {
  display: table;
  text-align: right;
}

.privilege-btn-next>div,
.privilege-btn-prev>div {
  display: table-cell;
  vertical-align: middle;
}

.index-bmwprivilege {
  margin-top: 5%;
  margin-bottom: 5%;
}

.pvlcat-link{
   transition: opacity 0.25s linear;
  -o-transition: opacity 0.25s linear;
  -moz-transition: opacity 0.25s linear;
  -webkit-transition: opacity 0.25s linear;
}

.pvlcat-link:hover{
  opacity: 0.6;
}

.pvlcat-link img{
  margin-bottom: 5px;
}

#joy .story-desc{
  margin-bottom: 20px;
}

#joy .claim-box .col-xs-12{
  margin-top: 0;
  margin-bottom: 20px;
}

#joy .claim-box .col-xs-12 button{
      padding-left: 3%;
    padding-right: 3%;
    margin-bottom: 20px;
}
#joy .claim-box .col-xs-12 p:not(.cb-ttl){
    font-size: 14px;
}
#pvlackbox .modal-body,
#pvlcodebox .modal-body{
  padding-top: 30px;
  padding-bottom: 50px;
}
#pvlackbox .modal-body button.close,
#pvlcodebox .modal-body button.close{
      top: 15px;
    font-size: 40px;
}

#pvlcodebox .modal-body .code{
    padding: 20px 0;
    font-size: 20px;
    background: #EEE;
}
#pvlcodebox .modal-body .ack,
#pvlcodebox .modal-body .date{
    font-size: 12px;
}

#pvlcodebox .modal-body .dtl-re > a{
  text-decoration: underline;
    transition: color 0.25s linear;
  -o-transition: color 0.25s linear;
  -moz-transition: color 0.25s linear;
  -webkit-transition: color 0.25s linear;
}

#pvlcodebox .modal-body .dtl-re > a:hover{
  color: #1966D2;
}

#pvlcodebox .modal-body .dtl{
    width: 80%;
    margin: 0 auto;
    text-align: center;
}

#pvlcodebox .modal-body .ack{
  color: #1966D2;
  margin-top: 20px;
}
.gall-row{
  position: relative;
}
.gall-row:last-child{
  margin-bottom: 30px;
}
.gall-row .galldtl-item,
.gall-row .gall-item{
  position: absolute;
  padding: 0 3px;
  cursor: pointer;
}

.gall-row .galldtl-item.relative{
    position: relative;
}
.gall-row .galldtl-item .gall-img,
.gall-row .gall-item .gall-img{
  margin: 3px 0;
  background-size: cover !important;
}

.gall-row .galldtl-item.col6 .gall-img,
.gall-row .galldtl-item.col3 .gall-img,
.gall-row .galldtl-item.col4 .gall-img{
    padding-bottom: 66.416%;
}

.gall-row .gall-item.col4 .gall-img{
  /*padding-bottom: 33.332%;*/
  padding-bottom: 100%;
}

.gall-row .gall-item.col3 .gall-img{
  /*padding-bottom: 25%;*/
  padding-bottom: 100%;
}

.gall-row .gall-item.col2 .gall-img{
  /*padding-bottom: 16.668%;*/
  padding-bottom: 100%;
}

.gall-row .gall-item.pos1{
  top: 0;
  left: 0;
}
.gall-row .gall-item.pos2{
  top: 0;
  left: 25%;
}
.gall-row .gall-item.pos3{
  top: 0;
  left: 50%;
}
.gall-row .gall-item.pos4{
  /*top: 16.668%;*/
  
  top: 0;
  left: 66.66667%;
}
.gall-row .gall-item.pos5{
  left: 50%;
}

.gall-row .gall-item.pos6{
  bottom: 0;
  left: 0;
}

.gall-row .gall-item.pos7{
  left: 33.33333%;
}
.gall-row .gall-item.pos8{
  bottom: 0;
  left: 33.33333%;
}

.gall-row .gall-item.pos9{
  bottom: 0;
  right: 25%;
}

.gall-row .gall-item.pos10{
  bottom: 0;
  right: 0;
}

.gall-row .galldtl-item.pos2{
  top: 0;
  left: 50%;
}

.gall-row .galldtl-item.pos3{
  top: 0;
  right: 0%;
}

.gall-row .galldtl-item.pos4{
  left: 0%;
}

.gall-row .galldtl-item.pos5{
  left: 25%;
}

.gall-row .galldtl-item.pos6{
  right: 0%;
}

body.gallery nav:last-child {
    margin-top: 30px;
}

.gallery .glrdtl {
   margin-bottom: 3%;
}

.gallery .glrdtl .text-date{
   margin-bottom: 0%;
   font-size: 15px;
}
.gallery .glrdtl .title{
   margin-top: 5px; 
   margin-bottom: 5px;
   font-size: 45px;
}
.gallery .glrdtl .desc{
    width: 55%;
    margin-left: auto;
    margin-right: auto;
    font-size: 14px;
}
.gallery .glrdtl .total-item{
    color: #999;
    font-size: 15px;
}

.gallery .glrdtl a.btn{
    padding: 5px 40px 4px;
    /*padding-left: 40px;
    padding-right: 40px;*/
    font-size: 15px;
}

#gallery-modal .modal-content {
    padding-top: 35px; 
}

#gallery-modal .modal-content button.close{
    top: -26px;
    right: 15px;  
}

#slide-gallery-modal button.left{
  position: absolute;
  left: -2px;
  z-index: 10;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}
#slide-gallery-modal button{
  position: absolute;
  right: -2px;
  z-index: 10;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}
#slide-gallery-modal button i{
 top: 2px;
}

.album{
    margin-bottom: 5%;
    cursor: pointer;
}
.album-cover{
  padding-bottom: 100%;
  background-size: 100% !important;
}
.album-ttl{
  font-size: 22px;
  font-size: 2.2rem;
}
.album-dec{
    font-size: 12px;
  font-size: 1.2rem;
  margin: 0px 0 5px;
}
.album-ttl_img{
    font-size: 13px;
  font-size: 1.3rem;
  color: #999;
}

.gal-non{
    margin: 10% auto 30%;
}

@media (max-width: 1599px) {
  /*h6,
  .h6 {
    font-size: 20px;
  }
  #heighlight-slider .slick-slide>.desc>span,
  .first-box span,
  .first-stories span,
  .secound-stories span,
  .latest-stories span,
  #heighlight-slider .slick-slide>.desc>p,
  .first-stories p,
  .secound-stories p,
  .latest-stories p {
    font-size: 13px;
  }*/
}

@media (max-width: 991px) {
  .story-thumnail .first-box {
    position: relative;
    padding: 0 10px;
    top: 0;
  }
  .story-thumnail .first-box span {
    color: #666;
    border-color: #666;
  }
  .story-thumnail .first-box h2 {
    margin-top: 8px;
    color: #000;
  }
  .first-stories .img-box,
  .secound-stories .img-box {
    position: relative;
  }
  .secound-stories,
  .first-stories {
    margin-bottom: 20px;
    margin-top: 20px;
  }

  .first-box span,
  .first-stories span,
  .secound-stories span,
  .latest-stories span {
    font-size: 14px;
  }
  .secound-stories .img,
  .first-stories .img {
    /*margin-bottom: 10px;*/
  }
    #heighlight-slider .slick-slide>.desc {
    text-align: center;
    color: #000;
    margin-bottom: 20px;
    padding: 0 10px;
        position: relative;
    width: 100%;
    top: 0;
    left: 0;
  }
  #heighlight-slider .desc>a {
    color: #000;
  }
  #heighlight-slider {
    margin-bottom: 15px;
    margin-top: 5px;
  }
  #heighlight-slider ul.bmw-pagging {
    margin-top: 7px;
  }
  #joy .ttl-page {
    margin-top: 50px;
  }
   #stories .ttl-page {
    margin-top: 50px;
  }
  select {
    color: #1966D2 !important;
    font-family: 'bmwtypewebbo_all';
  }
  #joy .header-list li.css-stories a:after ,
  #stories .header-list li.css-stories a:after {
    content: none;
  }
  .story-thumnail {
    margin-top: 50px;
  }
}

@media (max-width: 767px) {
    .album-ttl {
    font-size: 18px;
    font-size: 1.8rem;
}
  #heighlight-slider .desc>a, #heighlight-slider .heighlight-slide .desc>a{
    padding: 2.4% 10% 1.5%;
  }
  .desc .btn {
    padding: 1% 10% 1.5%;
}
  .stories-item > h6{
    margin-top: 5px;
    margin-bottom: 0px;
  }
  #heighlight-slider .slick-slide>.desc>p,
  .first-stories p,
  .secound-stories p,
  .latest-stories p {
    font-size: 3.2vw;
    margin-bottom: 20px;
  }
  #heighlight-slider .slick-slide>.desc>p,
  .first-stories p,
  .secound-stories p {
    margin-bottom: 10px;
  }
  .index-bmwstories .story-slide span,
  #heighlight-slider .slick-slide>.desc>span,
  .first-stories span,
  .secound-stories span,
  .latest-stories span {
    font-size: 3vw;
  }
  .index-bmwstories .story-slide p {
    font-size: 3.2vw;
  }

   .index-bmwstories .story-slide h6,
  .index-bmwstories .story-slide .h6,
  h6,
  .h6 {
    font-size: 4vw;
  }
  h4,
  .h4 {
    font-size: 8vw;
  }
  .sub-ttl {
    font-size: 4vw;
  }
  .img-box {
    margin-bottom: 10px;
  }
  index-bmwstories {
    padding-top: 5%;
  }
  
  .join-now {
    background: url(/dist/asset/images/share/join-bg-m.jpg) center center no-repeat;
    background-size: 100% !important;
    padding-bottom: 99%;
    position: relative;
  }
  .join-now p:first-child {
    font-size: 9vw;
    margin-bottom: 0;
  }
  .join-now p:first-child::after {
    content: none;
  }
  .join-now p:nth-child(2) {
    font-size: 3.5vw;
    margin-bottom: 3px;
  }
   .join-now p:nth-child(3) {
    font-size: 3.2vw;
  }
  .join-now button {
    padding: 4px 35px;
    font-size: 3vw;
  }
   .join-now a{
        padding: 8px 40px 5px;
      margin-top: 3px;
      font-size: 3.2vw;
  }
  .join-now div{
    /*padding: 6% 0;*/
    position: absolute;
    bottom: 15px;
    text-align: center;
  }
  .story-pager div:first-child .img a {
    padding-left: 13%;
  }
  .story-pager div:first-child .img a span {
    left: 5%;
    font-size: 6vw;
    top: 49%;
  }
  .story-pager div:first-child .img a h3 {
    margin: 0;
    font-size: 4vw;
    display: -webkit-box;
    white-space: pre-line;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-height: 1.6;
  }
  .story-pager div:nth-child(2) .img a {
    padding-right: 13%;
  }
  .story-pager div:nth-child(2) .img a span {
    right: 5%;
    font-size: 6vw;
    top: 49%;
  }
  .story-pager div:nth-child(2) .img a h3 {
    margin: 0;
    font-size: 4vw;
    display: -webkit-box;
    white-space: pre-line;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-height: 1.6;
  }
  .index-ttl {
    padding-left: 5px;
    font-size: 8vw;
  }
  .story-date,
  .story-ttl,
  .story-desc {
    padding: 0 10px;
  }
  .story-date {
    font-size: 5vw;
    /*margin: 0;*/
  }
  .story-ttl {
    font-size: 6vw;
    margin-top: 11px;
  }
  .story-thumnail.prv .first-box {
    position: relative;
    padding: 0 10px;
    top: 0;
    top: 0;
    transform: none;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    left: 0;
  }
  .story-thumnail .first-box {
    position: relative;
    padding: 0 10px;
    top: 0;
  }
  .story-thumnail .first-box span {
    color: #666;
    border-color: #666;
  }
  .story-thumnail .first-box h2 {
    font-size: 8.5vw;
    margin-top: 8px;
    color: #000;
  }
  .story-thumnail .secound-box .img {
    margin-bottom: 30px;
  }
  .first-stories .img-box,
  .secound-stories .img-box {
    position: relative;
  }
  .index-bmwstories .story-slide h6 > a,
  .index-bmwstories .story-slide span > a,
  .index-bmwstories .story-slide p > a{
    color: inherit;
    text-decoration: none;
  }
  #bmwstories ul.bmw-pagging>li {
    width: 20%;
  }
  #bmwstories ul.bmw-pagging>li:nth-child(4n) {
    margin-right: 0;
  }
  .privilege-slide-container .thumbnail-img {
    padding-bottom: 62.5%;
  }
  .privilege-btn-prev {
    position: absolute;
    left: 0;
    top: 39%;
    height: auto !important;
    z-index: 20;
    width: auto;
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .privilege-btn-next {
    position: absolute;
    right: 0;
    top: 39%;
    height: auto !important;
    z-index: 20;
    width: auto;
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .privilege-btn-prev button,
  .privilege-btn-next button {
    background: rgba(255, 255, 255, 0.5);
  }
  .index-bmwprivilege {
    margin-top: 2.5%;
    margin-bottom: 2.5%;
  }
  .secound-stories .desc,
  .first-stories .desc {
    position: relative;
    text-align: center;
    padding: 0 10px;
  }
  .gall-row .gall-item.pos1{
    top: 0;
    left: 0;
  }
  .gall-row .gall-item.pos2{
    top: 0;
    left: auto;
    right: 0;
  }
  .gall-row .gall-item.pos3{
    top: auto;
    left: 0;
  }
  .gall-row .gall-item.pos4{
    top: auto;
    left: auto;
    right: 0;
  }
  .gall-row .gall-item.pos5{
    
    top: auto;
    left: 0;
  }

  .gall-row .gall-item.pos6{
    bottom: auto;
    left: 0;
  }

  .gall-row .gall-item.pos7{
    left: auto;
    right: 0px;
  }
  .gall-row .gall-item.pos8{
    bottom: auto;
    left: auto;
    right: 0px;
  }

  .gall-row .gall-item.pos9{
    bottom: 0;
    right: auto;
    left: 0;
  }

  .gall-row .gall-item.pos10{
    bottom: 0;
    right: 0;
  }

  .gall-row .galldtl-item.pos2{
    top: auto;
    left: 0%;
  }

  .gall-row .galldtl-item.pos3{
    top: auto;
    right: 0%;
  }

  .gall-row .galldtl-item.pos4{
    left: 0%;
  }

  .gall-row .galldtl-item.pos5{
    right: 0%;
    left: auto;
  }

  .gall-row .galldtl-item.pos6{
    right: 0%;
    bottom: 0;
  }

  .gallery .glrdtl a.btn,
  .gallery .glrdtl .total-item,
  .gallery .glrdtl .text-date{
    font-size: 3vw;
  }
  .gallery .glrdtl .title{
    font-size: 6vw;
  }
  .gallery .glrdtl .desc{
      font-size: 2.5vw;
  }
  #gallery-modal.in .modal-dialog {
    -webkit-transform: translate(0,50%);
    -ms-transform: translate(0,50%);
    -o-transform: translate(0,50%);
    transform: translate(0,50%);
}
}