/* *************************************************css responsive ****************************************** */
/*จะทำการ warp table ทั้งหมดที่อยู่ในโหมด responsive*/
.respTable {
  width: 100%;
  overflow: scroll;
}

/* other */
.img-responsive img,
.img-responsive {
  display: block;
  max-width: 100% !important;
  height: auto !important;
  margin: auto;
}

/* box */
.container-tbl {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
  zoom: 1;
  box-sizing: border-box;
  clear: both;
  display: table;
  content: " ";
}

.container-tbl:before,
.container-tbl:after {
  content: "";
  display: table;
}

.container-tbl:after {
  clear: both;
}

/* choose col  */
.col-tbl-lg-1,
.col-tbl-lg-2,
.col-tbl-lg-3,
.col-tbl-lg-4,
.col-tbl-lg-5,
.col-tbl-lg-6,
.col-tbl-lg-7,
.col-tbl-lg-8,
.col-tbl-lg-9,
.col-tbl-lg-10,
.col-tbl-lg-11,
.col-tbl-lg-12 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
  float: left;
}

.col-tbl-lg-12 {
  width: 100% !important;
}

.col-tbl-lg-11 {
  width: 91.66666667% !important;
}

.col-tbl-lg-10 {
  width: 83.33333333% !important;
}

.col-tbl-lg-9 {
  width: 75% !important;
}

.col-tbl-lg-8 {
  width: 66.66666667% !important;
}

.col-tbl-lg-7 {
  width: 58.33333333% !important;
}

.col-tbl-lg-6 {
  width: 50% !important;
}

.col-tbl-lg-5 {
  width: 41.66666667% !important;
}

.col-tbl-lg-4 {
  width: 33.33333333% !important;
}

.col-tbl-lg-3 {
  width: 25% !important;
}

.col-tbl-lg-2 {
  width: 16.66666667% !important;
}

.col-tbl-lg-1 {
  width: 8.33333333% !important;
}

/*iphone 4 */
@media (max-width: 320px) {
  .swiper-container, .swiper-container .swiper-slide, .swiper-container .swiper-slide:nth-child(2n) {
    display: none;
  }

  #responsive-menu {
    display: block;
  }

  .page-header, .box-menu {
    display: none;
  }
}

/* iphone 5, 5s*/
@media (max-width: 480px) {
  .swiper-container, .swiper-container .swiper-slide, .swiper-container .swiper-slide:nth-child(2n) {
    display: none;
  }

  #responsive-menu {
    display: block;
  }

  .page-header, .box-menu {
    display: none;
  }

  .col-tbl-lg-1,
  .col-tbl-lg-2,
  .col-tbl-lg-3,
  .col-tbl-lg-4,
  .col-tbl-lg-5,
  .col-tbl-lg-6,
  .col-tbl-lg-7,
  .col-tbl-lg-8,
  .col-tbl-lg-9,
  .col-tbl-lg-10,
  .col-tbl-lg-11,
  .col-tbl-lg-12,
  .col-tbl-sm-1,
  .col-tbl-sm-2,
  .col-tbl-sm-3,
  .col-tbl-sm-4,
  .col-tbl-sm-5,
  .col-tbl-sm-6,
  .col-tbl-sm-7,
  .col-tbl-sm-8,
  .col-tbl-sm-9,
  .col-tbl-sm-10,
  .col-tbl-sm-11,
  .col-tbl-sm-12 {
    padding: 0px !important;
  }
}

/* iphone */
@media (max-width: 768px) {
  .swiper-container, .swiper-container .swiper-slide, .swiper-container .swiper-slide:nth-child(2n) {
    display: none;
  }

  #responsive-menu {
    display: block;
  }

  .page-header, .box-menu {
    display: none;
  }

  .col-tbl-lg-1,
  .col-tbl-lg-2,
  .col-tbl-lg-3,
  .col-tbl-lg-4,
  .col-tbl-lg-5,
  .col-tbl-lg-6,
  .col-tbl-lg-7,
  .col-tbl-lg-8,
  .col-tbl-lg-9,
  .col-tbl-lg-10,
  .col-tbl-lg-11,
  .col-tbl-lg-12,
  .col-tbl-sm-1,
  .col-tbl-sm-2,
  .col-tbl-sm-3,
  .col-tbl-sm-4,
  .col-tbl-sm-5,
  .col-tbl-sm-6,
  .col-tbl-sm-7,
  .col-tbl-sm-8,
  .col-tbl-sm-9,
  .col-tbl-sm-10,
  .col-tbl-sm-11,
  .col-tbl-sm-12 {
    float: left;
    /*	width: 100% !important;*/
  }
}

/* ipad */
@media (max-width: 992px) {
  .swiper-container, .swiper-container .swiper-slide, .swiper-container .swiper-slide:nth-child(2n) {
    display: none;
  }

  #responsive-menu {
    display: block;
  }

  .page-header, .box-menu {
    display: none;
  }

  .col-tbl-sm-1,
  .col-tbl-sm-2,
  .col-tbl-sm-3,
  .col-tbl-sm-4,
  .col-tbl-sm-5,
  .col-tbl-sm-6,
  .col-tbl-sm-7,
  .col-tbl-sm-8,
  .col-tbl-sm-9,
  .col-tbl-sm-10,
  .col-tbl-sm-11,
  .col-tbl-sm-12 {
    float: left;
  }

  /* choose col  */
  .col-tbl-sm-1,
  .col-tbl-sm-2,
  .col-tbl-sm-3,
  .col-tbl-sm-4,
  .col-tbl-sm-5,
  .col-tbl-sm-6,
  .col-tbl-sm-7,
  .col-tbl-sm-8,
  .col-tbl-sm-9,
  .col-tbl-sm-10,
  .col-tbl-sm-11,
  .col-tbl-sm-12 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    float: left;
  }

  .col-tbl-sm-12 {
    width: 100% !important;
  }

  .col-tbl-sm-11 {
    width: 91.66666667% !important;
  }

  .col-tbl-sm-10 {
    width: 83.33333333% !important;
  }

  .col-tbl-sm-9 {
    width: 75% !important;
  }

  .col-tbl-sm-8 {
    width: 66.66666667% !important;
  }

  .col-tbl-sm-7 {
    width: 58.33333333% !important;
  }

  .col-tbl-sm-6 {
    width: 50% !important;
  }

  .col-tbl-sm-5 {
    width: 41.66666667% !important;
  }

  .col-tbl-sm-4 {
    width: 33.33333333% !important;
  }

  .col-tbl-sm-3 {
    width: 25% !important;
  }

  .col-tbl-sm-2 {
    width: 16.66666667% !important;
  }

  .col-tbl-sm-1 {
    width: 8.33333333% !important;
  }

  .page-header {
    display: none;
  }
}

/* desktop */
@media (max-width: 1040px) {
  .swiper-container, .swiper-container .swiper-slide, .swiper-container .swiper-slide:nth-child(2n) {
    display: none;
  }

  #responsive-menu {
    display: block;
  }

  .page-header, .box-menu {
    display: none;
  }

  .col-tbl-lg-1,
  .col-tbl-lg-2,
  .col-tbl-lg-3,
  .col-tbl-lg-4,
  .col-tbl-lg-5,
  .col-tbl-lg-6,
  .col-tbl-lg-7,
  .col-tbl-lg-8,
  .col-tbl-lg-9,
  .col-tbl-lg-10,
  .col-tbl-lg-11,
  .col-tbl-lg-12 {
    float: left;
  }
}

/*----- payment step responsive ----*/
form.not-member-order {
  text-align: center;
}

ul.order-title-step>li {
  background-position: center;
  border-bottom: 2px solid #ccc;
  height: 50px !important;
}

/*---- ใช้เวลาจะปิดบางฟิลล์ ----
form#form-order > div:nth-of-type(2) > div:nth-child(1) {
   display: none;
}
form#form-order > div:nth-of-type(1) > div:nth-child(4), form#form-order > div:nth-of-type(1) > div:nth-child(5) {
   display: none;
}
---- ใช้เวลาจะปิดบางฟิลล์ ----*/
.order-title-step {
  border-bottom: none !important;
}

/* .order-title-step .step1 {
  background: url(/user_template/7059/images/order-step1-n.png) center top no-repeat !important;
}

.order-title-step .step2 {
  background: url(/user_template/7059/images/order-step2-n.png) center top no-repeat !important;
}

.order-title-step .step3 {
  background: url(/user_template/7059/images/order-step3-n.png) center top no-repeat !important;
} */

form#form-cart {
  position: relative;
}

form#form-cart input {
  font-size: 12px;
}

.content-center.content-center-ID-product .box-content2-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 20px;
}

.content-center.content-center-ID-product .box-content2-body-t {
  width: 100%;
}

form[name="form-order"] span a {
  width: 4%;
}

@media(max-width:767px) {
  .content-center.content-center-ID-product .box-content2-body-t>form {
    width: 100%;
  }

  .member-link {
    display: block;
    text-align: center;
  }

  .loginform2-submit {
    text-align: center;
  }

  .jqEasyCounterMsg {
    width: 100% !important;
  }
}

@media(max-width:640px) {
  ul.order-title-step>li {
    width: 100%;
  }

  .order-title-step {
    height: 150px !important;
  }

  .content-center.content-center-ID-product input#Submit1 {
    max-width: 100% !important;
    font-size: 11px !important;
    text-align: center;
    padding-left: 5%;
    padding-right: 5%;
  }
}

/*----- payment step responsive ----*/
/*custom slide responsive*/
/*
@media (max-width: 640px) {
   .swiper-container,
   .swiper-container .swiper-slide,
   .swiper-container .swiper-slide:nth-child(2n) {
      height: 200px !important;
   }
      table {
      background-color:blue;
   }
}

@media (max-width: 980px) {
   .swiper-container,
   .swiper-container .swiper-slide,
   .swiper-container .swiper-slide:nth-child(2n) {
      height: 300px !important;
   }
      table {
      background-color:yellow;
   }
}
*/
/*
@media (max-width: 800px) {
   .swiper-container,
   .swiper-container .swiper-slide,
   .swiper-container .swiper-slide:nth-child(2n) {
      height: 300px !important;
   }
}
*/