* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
*:before,
*:after {
  -webkit-box-sizing: border-bourteamox;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.clearfix:before, .clearfix:after {
    content: " ";
    display:  block;
    clear:  both;

}

a{
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
	text-decoration:none !important;
  cursor:pointer;
}
a:hover{
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
	text-decoration:none !important;
  cursor:pointer;
}
a:focus{
outline:none !important;
}
.nopad{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}
html,body {margin: 0; padding: 0; max-width: 100%; height:100%; font-family: "Noto Serif Thai", serif; color:#000; font-size:18px; display:block; background:#000;}
h1, h2, h3, h4, h5, h6 { margin:0; padding:0; font-weight:normal;}
h1{font-size:60px;}
h2{font-size:50px;}
h3{font-size:45px;}
h4{font-size:30px;}
h5{font-size:20px;}
h6{font-size:18px;}
ul{ list-style:none; padding:0; margin:0;}
li{ list-style:none; padding:0; margin:0;}
.fr{ float: right !important;}
.fl{ float: left !important;}
p, span{ padding:0; margin:0;}
.img-100{width:100%;}
.img-auto{width:auto;}
.no-pad{ padding:0 !important;}
.no-mar{margin:0 !important; }
.no-border{border:0 !important;}
.m-auto{ margin:auto !important;}
.space{ display:block;}
.text-center{ text-align:center !important;}
.relative{ position:relative !important;}
.absolute{ position:absolute !important;}
.frame{width:100%; display:block; float:left;}

.noto-r{font-weight:100 !important; font-family: "Noto Serif Thai", serif;}
.noto-el{font-weight:200 !important; font-family: "Noto Serif Thai", serif;}
.noto-l{font-weight:300 !important; font-family: "Noto Serif Thai", serif;}
.noto-r{font-weight:400 !important; font-family: "Noto Serif Thai", serif;}
.noto-m{font-weight:500 !important; font-family: "Noto Serif Thai", serif;}
.noto-sb{font-weight:600 !important; font-family: "Noto Serif Thai", serif;}
.noto-b{font-weight:700 !important; font-family: "Noto Serif Thai", serif;}
.noto-eb{font-weight:800 !important; font-family: "Noto Serif Thai", serif;}
.noto-bl{font-weight:900 !important; font-family: "Noto Serif Thai", serif;}

.t-black{color:#000;}
.t-white{color:#FFF;}
.t-yellow{color:#e3ae29;}
.t-green{color:#0db224;}

.mm-desktop{ display:block !important;}
.mm-mobile{display:none !important;}

.warp{width:100%; margin:auto; display:block;}
.main{ width:1140px; margin-inline:auto; display:block;}


header{width:100%; padding:55px 0 20px 0; display:block; float:left; }
header .frame{width:100%; padding-left:175px; display:block; float:left; position:relative;}
header .logo{width:163px; display:block; position:absolute; left:0; top:-50px; z-index:99;}
header .logo img{width:100%;}

header h3{width:auto; display:none;}
header nav{width:auto; display:inline-block; position:relative;}
header nav a{width:auto; line-height:50px; margin:0 18px; font-size:22px; color:#e3ae29; display:block; float:left; position:relative;}
header nav a::after{content:""; width:1px; height:2px; position:absolute; left:0; bottom:10px; background:rgba(227,174,41,0); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
header nav a:hover::after{width:100%; background:rgba(227,174,41,1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
header nav a.active::after{width:100%; background:rgba(227,174,41,1);}

header .social{width:auto; display:block; float:right;}
header .social a{width:50px; margin:0 5px; display:inline-block;}
header .social a img{width:100%; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
header .social a:hover img{transform: scale(1.1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}

#mtopic{width:100%; height:340px; position:relative; display:block; float:left;}
#mtopic .bg{width:100%; height:100%; display:block; float:left; opacity:0.5;
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
#mtopic .bg.news{background-image: url("../images/h-banner1.jpg");}
#mtopic h2{width:auto; color:#FFF; display:block; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); z-index:50;}

#h-product, #mproduct{width:100%; text-align:center; display:block; float:left; position:relative;}
#h-product::after{content:"";width:100%; height:35%; position:absolute; left:0; bottom:0; z-index:-1; background:url(../images/bg_product.jpg) repeat; opacity:.3; mask: linear-gradient(180deg, transparent, white 80%);
  -webkit-mask: linear-gradient(180deg, transparent, white 80%);}
#h-product .row{margin:0 -10px;}
#h-product .frame{width:100%; margin:60px 0; display:block; float:left;}
#h-product h4{width:100%; margin:15px 0; line-height:1.3; text-align:left; display:block;}
#h-product .btn-all{width:auto; line-height:48px; padding:0 30px; margin:30px 0 0 0; font-size:20px; color:#e3ae29; line-height:1.3; border-radius:8px; border:1px solid rgba(255,174,41,1); background:transparent; display:inline-block; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#h-product .btn-all i{line-height:48px; color:#e3ae29; font-size:14px; margin-left:15px; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#h-product .btn-all:hover{background:#e3ae29; color:#FFF; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#h-product .btn-all:hover i{color:#FFF; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#b-product{width:100%; display:block;}
#b-product .row{margin:0 -10px;}
.mdetail{width:20%; padding:10px; text-align:left; display:block; float:left; position:relative; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.mdetail em{width:55px; display:block; position:absolute; top:-3px; right:-2px; z-index:120; display:none;}
.mdetail em img{width:100%;}
.mdetail.reward em{display:block;}
.mdetail figure{width:100%; margin:0; padding:10px; overflow:hidden; display:block; border-radius:10px; border:1px solid rgba(255,255,255,1); position:relative; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.mdetail figure::after{content:""; width:100%; height:100%; display:block; position:absolute; left:0; top:0; z-index:-1; background:rgba(0,0,0,0.5); filter: blur(8px); -webkit-filter: blur(8px);}
.mdetail .pic-p{width:100%; border-radius:10px; overflow:hidden; display:block;
  -webkit-border-top-left-radius: 10px;
  -webkit-border-top-right-radius: 10px;
  -moz-border-radius-topleft: 10px;
  -moz-border-radius-topright: 10px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.mdetail figure:hover{border:1px solid rgba(255,174,41,1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.mdetail .pic-p img{width:100%; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.mdetail span{width:100%; padding:0; display:block;}
.mdetail .topic{width:100%; margin-bottom:10px; height:54px; line-height:28px; color:#FFF; overflow:hidden; display:block; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.mdetail .price{width:100%; line-height:22px; color:#0db224; font-size:16px; display:block;}
.mdetail .price::after{content:" บาท"; font-size:13px;}
.mdetail .price.sold{color:#ff0000;}
.mdetail .price.sold::after{content:"";}
.mdetail .bottom{width:100%; margin:10px 0; display:block; float:left;}
.mdetail .visitors{width:auto; line-height:20px; font-size:14px; color:#FFF; display:block; float:left; font-style:normal; font-weight:400; font-family: "Noto Serif Thai", serif;}
.mdetail .visitors::before{content:"ผู้เข้าชม "; font-size:13px; color:#FFF; font-weight:600; font-family: "Noto Serif Thai", serif;}
.mdetail .share{width:auto; display:block; float:right;}
.mdetail .share .fb_iframe_widget span{display:block;}
.mdetail .more{width:100%; line-height:34px; text-align:center; color:#FFF; font-size:14px; border-radius:6px; overflow:hidden; background:#e3ae29; display:block; float:right;}
.mdetail .more i{color:#FFF; margin-left:10px; font-size:10px; line-height:1.2;}

.mdetail:hover{transform:scale(1.04); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.mdetail:hover figure{border:1px solid rgba(255,174,41,1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.mdetail:hover .topic{color:#e3ae29; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.mdetail .more:hover i{-webkit-animation: rightmove 1s infinite; animation: rightmove 1s infinite;}
#b-product .btn-all:hover{color:#FFF; background:rgba(255,174,41,1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#b-product .btn-all:hover i{color:#FFF; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}

#h-banner{width:100%; height:700px; position:relative; display:block; overflow: hidden;}
#h-banner .swiper-container {width:100%; height:100%;}
#h-banner .swiper-slide {
  text-align: center;
  background: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
	position: relative;
}
#h-banner .pic{width:100%; display:block;
  position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
  mask: linear-gradient(180deg, transparent, white 0, white 70%, transparent);
  -webkit-mask: linear-gradient(180deg, transparent, white 0, white 70%, transparent);
}
#h-banner .pic .img{
  width:100%;
  opacity:0.5;
  position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
   background-size: cover;
   background-position: center  center;
   background-repeat: no-repeat;
	transition: 3s all;
	transform: scale(1.2);
}
#h-banner .swiper-slide-active .pic .img {animation: bannerscale 10s ease forwards;}
@keyframes bannerscale {
  0% {
      transform: scale(1);
  }

  100% {
       transform: scale(1.2);
  }
}

#h-banner .content{width:1140px; display:block; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); z-index:110;}
#h-banner .frame{width:100%; display:block;}
#h-banner .content span{width:46%; padding-right:30px; display:block; float:left;}
#h-banner .content h1{width:100%; line-height:1; margin-bottom:25px; display:block;}
#h-banner .content p{width:100%; line-height:1.5; font-size:20px; display:block;}
#h-banner #b-product{width:54%; display:block; float:right;}
#h-banner .mdetail{width:50%; padding:0 10px; display:block; float:left; position:relative;}
#h-banner .mdetail em{width:70px; display:block; position:absolute; top:-10px; right:-5px; z-index:120; display:none;}
#h-banner .mdetail em img{width:100%;}
#h-banner .mdetail.reward em{display:block;}
#h-banner .mdetail figure{width:100%; margin:0; padding:10px; overflow:hidden; display:block; border-radius:10px; border:1px solid rgba(227,174,41,1); position:relative;}
#h-banner .mdetail figure::after{content:""; width:100%; height:100%; display:block; position:absolute; left:0; top:0; z-index:-1; background:rgba(0,0,0,0.6); filter: blur(15px); -webkit-filter: blur(15px);}
#h-banner .mdetail .pic-p{width:100%; border-radius:10px; overflow:hidden; display:block;
  -webkit-border-top-left-radius: 10px;
  -webkit-border-top-right-radius: 10px;
  -moz-border-radius-topleft: 10px;
  -moz-border-radius-topright: 10px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
#h-banner .mdetail .pic-p img{width:100%; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#h-banner .mdetail span{width:100%; padding:0; display:block;}
#h-banner .mdetail .topic{width:100%; height:54px; line-height:28px; color:#FFF; display:block; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; display:block; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#h-banner .mdetail:hover .topic{color:#e3ae29; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#h-banner .mdetail .price{width:100%; line-height:22px; font-size:16px; display:block;}
#h-banner .mdetail .price::after{content:" บาท"; font-size:13px; color:#0db224;}
#h-banner .mdetail .bottom{width:100%; margin:10px 0; display:block; float:left;}
#h-banner .mdetail .visitors{width:auto; line-height:20px; font-size:14px; color:#FFF; display:block; float:left; font-style:normal; font-weight:400; font-family: "Noto Serif Thai", serif;}
#h-banner .mdetail .visitors::before{content:"ผู้เข้าชม "; font-size:13px; color:#FFF; font-weight:600; font-family: "Noto Serif Thai", serif;}
#h-banner .mdetail .share{width:auto; display:block; float:right;}
#h-banner .mdetail .more{width:100%; line-height:40px; text-align:center; color:#FFF; font-size:18px; border-radius:10px; overflow:hidden; background:#e3ae29; display:block; float:right;}
#h-banner .mdetail .more i{color:#FFF; margin-left:10px; font-size:12px; line-height:1.2;}
#h-banner .mdetail .more:hover i{-webkit-animation: rightmove 1s infinite; animation: rightmove 1s infinite;}

@-moz-keyframes rightmove {
  0%,
  20%,
  50%,
  80%,
  100% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  40% {
    -ms-transform: translateX(7px);
    transform: translateX(7px);
  }
  60% {
    -ms-transform: translateX(10px);
    transform: translateX(10px);
  }
}
@-webkit-keyframes rightmove {
  0%,
  20%,
  50%,
  80%,
  100% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  40% {
    -ms-transform: translateX(7px);
    transform: translateX(7px);
  }
  60% {
    -ms-transform: translateX(10px);
    transform: translateX(10px);
  }
}
@keyframes rightmove {
  0%,
  20%,
  50%,
  80%,
  100% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  40% {
    -ms-transform: translateX(7px);
    transform: translateX(7px);
  }
  60% {
    -ms-transform: translateX(10px);
    transform: translateX(10px);
  }
}

@-moz-keyframes leftmove {
  0%,
  20%,
  50%,
  80%,
  100% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  40% {
    -ms-transform: translateX(-5px);
    transform: translateX(-5px);
  }
  60% {
    -ms-transform: translateX(-7px);
    transform: translateX(-7px);
  }
}
@-webkit-keyframes leftmove {
  0%,
  20%,
  50%,
  80%,
  100% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  40% {
    -ms-transform: translateX(-5px);
    transform: translateX(-5px);
  }
  60% {
    -ms-transform: translateX(-7px);
    transform: translateX(-7px);
  }
}
@keyframes leftmove {
  0%,
  20%,
  50%,
  80%,
  100% {
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  40% {
    -ms-transform: translateX(-5px);
    transform: translateX(-5px);
  }
  60% {
    -ms-transform: translateX(-7px);
    transform: translateX(-7px);
  }
}
:root{
  --marquee-padding :0px;
  --marquee-padding-negative: calc(var(--marquee-padding) * -1);
}
.slogan-marquee{width:100%; display:block; float:left; border-bottom:1px solid #0db224;}
.slogan-marquee .marquee {
  white-space: nowrap;
  overflow: hidden;
  margin: 0 auto;
  padding: 20px 0;
  color:#FFF;
}

.slogan-marquee .marquee .marquee_text {
  display: inline-block;
  /* padding-left: 100%; */
  animation: marquee 30s linear infinite;
  /* animation: marquee_flip 26s linear infinite;  For left to right */
}
.slogan-marquee .marquee .marquee_text ul {
  display: inline-flex;
  font-size: 23px;
  text-transform: uppercase;
  list-style-position: inside;
  
}
.slogan-marquee .marquee .marquee_text ul.marquee-content-primary {
  padding-left: 0px;
}
.slogan-marquee .marquee .marquee_text ul > li {
  padding-inline: 7px; line-height:40px;
}
.slogan-marquee .marquee .marquee_text ul > li.sp {
  width:250px;
}
.slogan-marquee .marquee .marquee-content-secondary {
  position:absolute;
  left:0;
  top:0;
  padding-left:var(--marquee-padding);
}
 
@keyframes marquee {
     0% {
        -webkit-transform: translate3d(0,0,0);
        transform: translateZ(0)
    }

    to {
        -webkit-transform: translate3d(var(--marquee-padding-negative),0,0);
        transform: translate3d(var(--marquee-padding-negative),0,0)
    }
}

.slide-cata{width:1140px; height:44px; padding:0; display:block; position:absolute; bottom:20px; left:50%; transform: translateX(-50%); z-index:130;}
.slide-cata .swiper-container{mask: linear-gradient(90deg, transparent, white 15%, white 90%, transparent);
  -webkit-mask: linear-gradient(90deg, transparent, white 15%, white 90%, transparent);  }
.slide-cata a{color:#FFF; font-size:25px; line-height:44px; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.slide-cata a:hover{ color:#e3ae29; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}

.slide-cata .owl-carousel{padding:0 80px;}
.slide-cata .owl-stage-outer{mask: linear-gradient(90deg, transparent, white 15%, white 90%, transparent);
  -webkit-mask: linear-gradient(90deg, transparent, white 15%, white 90%, transparent);}
.slide-cata .owl-carousel .owl-nav {overflow:hidden; height:0px;}
.slide-cata .owl-carousel .nav-btn{width:44px; height:44px; position:absolute; cursor:pointer; top:0px; background:#e3ae29; border-radius:50%; border:1px solid rgba(227,174,41,0);}
.slide-cata .owl-carousel .prev-slide{left:0px;}
.slide-cata .owl-carousel .next-slide{right:0px;}
.slide-cata .owl-carousel .prev-slide i, .slide-cata .owl-carousel .next-slide i{width:100%; line-height:44px; text-align:center; font-size:16px; color:#FFF; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.slide-cata .owl-carousel .prev-slide:hover, .slide-cata .owl-carousel .next-slide:hover{transform: scale(1.1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}

.text-move{
  width:100%; overflow:hidden; display:block; float:left;
  mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
  -webkit-mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
}
.text-move_inner{width:max-content; padding-block:1rem; display:flex; flex-wrap:nowrap; gap:1rem; animation:text-scroll 20s linear infinite;}
.text-move[data-animated="true"]{
  overflow: hidden;
}
@keyframes text-scroll{
  to{
     transform: translate(calc(-50% - 0.5rem));
  }
}
.tag-list{margin:0; padding-inline:0; list-style:none;}
.tag-list li{padding:0; line-height:30px; font-size:20px; color:#FFF; background:transparent; border-radius:0; box-shadow:none; margin:0;}

.a-section {width:100%; padding:15px 15%; display:block; float:left;}
.a-section.sub {border-bottom:1px solid #0db224;}
.a-section-marquee-box {
  height: 40px;
  display: flex;
  align-items: center;
  overflow: hidden;
  mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
  -webkit-mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
}
.a-section-marquee-box p {
  white-space: nowrap;
  text-transform: uppercase;
  font-size: 23px;
  color:#FFF;
  flex-shrink: 0;
  padding: 0 10px;
  width: max-content;
  display: flex;
  align-items: center;
  transform: translateX(0);
  animation: a-text-scroll 10s linear infinite;
}
@keyframes a-text-scroll {
  0% { transform: translate3d(100%, 0, 0); }
  100% { transform: translate3d(0%, 0, 0); }
}


main{width:100%; display:block; float:left;}

#q-search{width:100%; display:block; float:left; position:relative;}
#q-search::after{content:""; width:100%; height:100%; display:block; position:absolute; left:0; top:0; z-index:10; background:url(../images/bg-search.jpg) top; mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
  -webkit-mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);}
#q-search figure{width:100%; margin:0; text-align:center; padding:30px 0 20px 0; display:block; float:left;}
#q-search figure img{width:100%;}
#q-search figure .content{width:100%; display:block; float:left; position:relative; z-index:20;}
#q-search figure .icon{width:56px; margin-right:20px; display:inline-block; vertical-align:bottom;}
#q-search figure fieldset{width:auto; margin:0; padding:0 105px 0 0; border:0; display:inline-block; position:relative;}
#q-search figure fieldset .logo{width:82px; display:block; position:absolute; right:0; top:-11px;}
#q-search figure fieldset p{width:100%; line-height:40px; font-size:25px; color:#FFF; text-align:left; display:block;}
#q-search figure fieldset input[type="text"]{width:420px; height:44px; padding:0 18px; line-height:44px; font-size:20px; color:#000; background:#FFF; display:block; float:left; font-family: "Noto Serif Thai", serif; font-weight:400; border:0;
  border-radius: 10px 0px 0px 10px;
  -webkit-border-radius: 10px 0px 0px 10px;
  -moz-border-radius: 10px 0px 0px 10px;
}
#q-search figure fieldset input[type="text"]:focus{outline:none;}
#q-search figure fieldset input::-moz-placeholder{color:#666; opacity:1}
#q-search figure fieldset input:-ms-input-placeholder{color:#666;}
#q-search figure fieldset input::-webkit-input-placeholder{color:#666;}
#q-search figure fieldset input[type="submit"]{width:115px; height:44px; line-height:44px; color:#FFF; font-size:20px; text-align:center; display:block; float:left; background:#4d463c; font-family: "Noto Serif Thai", serif; font-weight:600; border:0; cursor:pointer;
  border-radius: 0px 10px 10px 0px;
  -webkit-border-radius: 0px 10px 10px 0px;
  -moz-border-radius: 0px 10px 10px 0px;
}

#h-contact{width:100%; display:block; float:left; background:#555;}
#h-contact figure{width:100%; margin:0; padding:32px 0; display:block; float:left;}
#h-contact span{width:50%; padding:0 0 0 164px; display:block; float:left; position:relative;}
#h-contact span:nth-child(2){width:40%; padding:0; float:right;}
#h-contact .logo{width:138px; display:block; position:absolute; left:0; top:-10px;}
#h-contact img{width:100%;}
#h-contact h4{width:100%; line-height:1.4; margin:10px 0; display:block; float:left;}
#h-contact h5{width:100%; line-height:1.4; margin:10px 0 5px 0; display:block; float:left;}
#h-contact p{width:100%; line-height:24px; font-size:16px; display:block; float:left;}
#h-contact .icon{width:100%; line-height:24px; margin:5px 0; padding-left:34px; color:#FFF; font-size:16px; display:block; position:relative; float:left;}
#h-contact .icon a{line-height:24px; color:#FFF; font-size:16px; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#h-contact .icon a:hover{color:#e3ae29; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#h-contact .icon em{width:24px; display:block; position:absolute; left:0; top:0;}

#reacoment{width:100%; padding:60px 0; display:block; float:left;}
#reacoment section{width:100%; display:block; float:left; position:relative;}
#reacoment .swiper-container{width:100%; padding:20px 0; display:block; float:left; mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent); -webkit-mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);}
#reacoment h4{width:100%; margin:15px 0; line-height:1.3; text-align:left; display:block;}
#reacoment .mdetail{width:100%; padding:0; opacity:0.33; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#reacoment .swiper-slide-active .mdetail{opacity:1; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#reacoment .swiper-slide-prev .mdetail, 
#reacoment .swiper-slide-next .mdetail{opacity:0.65; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
/* #reacoment .swiper-slide-active .mdetail figure{border:1px solid #e3ae29; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;} */
#reacoment .mdetail:hover{ opacity:1; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#reacoment .mdetail em{top:-8px; right:-6px;}
/* ปุ่ม next prev */
#reacoment .swiper-button-prev, #reacoment .swiper-button-next{width:45px; height:45px; top:calc(50% + 22px); border-radius:50%; background:#e3ae29; z-index:90; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#reacoment .swiper-button-prev i, #reacoment .swiper-button-next i{width:45px; color:#FFF; line-height:45px; font-size:14px; text-align:center;}
#reacoment .swiper-button-prev{left:0;}
#reacoment .swiper-button-next{right:0;}
#reacoment .swiper-button-prev:hover, #reacoment .swiper-button-next:hover{transform: scale(1.15); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
/* ปุ่ม next prev */

.ctrl-pagination{width:100%; padding:0; margin-top:40px !important; text-align:center; display:block; float:left;}
.ctrl-pagination.ctrl-result{margin:10px 0; text-align:right;}
.ctrl-pagination li{width:auto !important; margin:0 1px; padding:0 !important; text-align:center; display:inline-block !important; word-spacing:normal; letter-spacing:normal; vertical-align:top; float:none !important;}
.ctrl-pagination .first, 
.ctrl-pagination .last, 
.ctrl-pagination .next, 
.ctrl-pagination .prev
{padding:0 1px; float:none;}
.ctrl-pagination li a{line-height:30px; padding: 4px 13px 0 13px; color:#e3ae29; font-size:18px; display:inline-block; border-radius:4px; text-decoration: none;}
.ctrl-pagination li a i{line-height:30px; font-size:14px;}
.ctrl-pagination li a:hover, .ctrl-pagination li a.active{background: rgb(227,174,41); color:#FFF;}
.ctrl-pagination li a.active{pointer-events:none;}
.ctrl-pagination li a.disable{color:#a68635; background:transparent; pointer-events:none;}
.ctrl-pagination .first a, 
.ctrl-pagination .last a, 
.ctrl-pagination .next a, 
.ctrl-pagination .prev a
{background:transparent;}
.ctrl-pagination .first a:hover, 
.ctrl-pagination .last a:hover, 
.ctrl-pagination .next a:hover, 
.ctrl-pagination .prev a:hover
{background:transparent; color:#FFF;}
.ctrl-pagination.ctrl-result .last a{padding-right:0;}


#news{width:100%; padding:60px 0; text-align:center; display:block; float:left; position:relative;}
#news::after{content:"";width:100%; height:500px; position:absolute; left:0; bottom:0; z-index:10; background:url(../images/bg_product.jpg) repeat; opacity:.3; mask: linear-gradient(180deg, transparent, white 80%);
  -webkit-mask: linear-gradient(180deg, transparent, white 80%);}
#news figure{width:100%; margin:0; display:block; float:left; position:relative; z-index:20;}
#news ul{width:100%; padding:30px; margin:0; border-radius:10px; overflow:hidden; text-align:center; display:block; float:left; position:relative; z-index:10;}
#news ul::after{content:""; width:100%; height:100%; position:absolute; left:0; top:0; z-index:-1; background:url(../images/bg-white.jpg) repeat; opacity:.15; mask: linear-gradient(180deg, transparent, white 90%); -webkit-mask: linear-gradient(180deg, transparent, white 80%);}
#news ul.ctrl-pagination{background:transparent;}
#news ul.ctrl-pagination::after{display:none;}
#news .row{margin:0 -10px;}
#news li{width:20%; padding:10px; text-align:left; display:block; float:left; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; position:relative; z-index:10;}
#news li img{width:100%; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#news li .pic{width:100%; height:auto; display:block; float:left; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#news li:hover .pic img{transform:scale(1.05); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#news li span{width:100%; padding-bottom:15px; border-bottom:1px solid rgba(255,255,255,.5); display:block; float:left;}
#news li .topic{width:100%; height:48px; margin:7px 0; color:#FFF; line-height:25px; overflow:hidden; display:block; float:left; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
#news li p{width:100%; height:66px; margin:7px 0; line-height:22px; color:#FFF; font-size:14px; overflow:hidden; display:block; float: left; display: -webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical;}
#news li .btn-more{width:auto; margin:7px 0; padding:0 15px; line-height:34px; font-size:14px; color:#e3ae29; border-radius:8px; border:1px solid #e3ae29; display:block; float:left; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#news li .btn-more i{color:#e3ae29; margin-left:10px; font-size:10px; line-height:1.2; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#news li .btn-more:hover{color:#FFF; background:#e3ae29; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#news li .btn-more:hover i{color:#FFF; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#news li:first-child{width:100%;}
#news li:first-child .pic{width:calc(50% - 10px); margin-right:10px;}
#news li:first-child span{width:calc(50% - 10px); margin-left:10px; border-bottom:0;}
#news li:first-child .topic{margin-bottom:20px; height:66px; line-height:33px; font-size:25px;}
#news li:first-child p{margin-bottom:20px; font-size:16px; height:120px; line-height:24px; display: -webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical;}
#news li:first-child .btn-more{line-height:40px; font-size:20px; background:#e3ae29; color:#FFF;}
#news li:first-child .btn-more i{font-size:14px; color:#FFF;}

#news-detail{width:100%; padding:60px 0; text-align:center; display:block; float:left; position:relative;}
#news-detail::after{content:"";width:100%; height:35%; position:absolute; left:0; bottom:0; z-index:-1; background:url(../images/bg_product.jpg) repeat; opacity:.3; mask: linear-gradient(180deg, transparent, white 80%);
  -webkit-mask: linear-gradient(180deg, transparent, white 80%);}
#news-detail figure{width:100%; margin:0; text-align:left; display:block; float:left;}
#news-detail .topic{width:100%; line-height:1.4; margin:0 0 20px 0; font-size:25px; color:#FFF; display:block; float:left;}
#news-detail .content{width:100%; padding:30px; margin-bottom:30px; font-size:18px; color:#FFF; line-height:1.4; text-align:left; display:block; float:left; font-weight:400; font-family: "Noto Serif Thai", serif; position:relative; z-index:10; overflow:hidden; border-radius:10px; }
#news-detail .content::after{content:""; width:100%; height:100%; position:absolute; left:0; top:0; z-index:5; background:rgba(255, 255, 255, 0.15); mask: linear-gradient(180deg, transparent, white 90%); -webkit-mask: linear-gradient(180deg, transparent, white 90%);}
#news-detail .content p{width:100%; margin-bottom:25px; display:block; float:left; position:relative; z-index:10;}
#news-detail .content img{max-width:100%;}
#news-detail .prev{width:auto; line-height:40px; padding:5px 25px 0 25px; text-align:center; color:#FFF; font-size:18px; border-radius:10px; overflow:hidden; background:#e3ae29; display:block; float:left;}
#news-detail .prev i{color:#FFF; margin-right:10px; font-size:14px; line-height:1;}
#news-detail .prev:hover i{-webkit-animation: leftmove 1s infinite; animation: leftmove 1s infinite;}

#menu-cat{width:calc(20% - 10px); margin:10px 10px 0 0; padding:12px 12px 10px 12px; border:1px solid #FFF; border-radius:10px; overflow:hidden; display:block; float:left;}
#menu-cat h5{width:100%; line-height:1.4; color:#e3ae29; padding:10px 0 15px 0;display:block; float:left;}
#menu-cat a{width:100%; line-height:1.4; padding:12px 0; color:#FFF; font-size:16px; border-top:1px solid rgba(255,255,255,.5); display:block; float:left; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#menu-cat a:hover{color:#e3ae29; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}

#our-product{width:100%; padding:20px 0 60px 0; display:block; float:left; position:relative;}
#our-product::after{content:"";width:100%; height:500px; position:absolute; left:0; bottom:0; z-index:-1; background:url(../images/bg_product.jpg) repeat; opacity:.3; mask: linear-gradient(180deg, transparent, white 80%);
  -webkit-mask: linear-gradient(180deg, transparent, white 80%);}
#our-product h4{width:calc(80% - 10px); margin-left:calc(20% - 10px); padding:20px 0; line-height:1.4; text-align:center; display:block; float:left;}
#our-product .row{margin:0 -10px;}
#our-product .container{width:calc(80% - 10px); margin-left:10px; display:block; float:left;}
#our-product .container li{width:25%; padding:10px; display:block; float:left;}
#our-product .mdetail{width:100%; padding:0;}
#our-product .mdetail em{top:-10px; right:-12px;}
#our-product .ctrl-pagination{width:80%; margin-left:calc(20% + 10px); background:transparent;}

#produuct-detail{width:100%; padding:20px 0 60px 0; display:block; float:left; position:relative;}
#produuct-detail::after{content:"";width:100%; height:500px; position:absolute; left:0; bottom:0; z-index:-1; background:url(../images/bg_product.jpg) repeat; opacity:.3; mask: linear-gradient(180deg, transparent, white 80%);
  -webkit-mask: linear-gradient(180deg, transparent, white 80%);}
#produuct-detail h4{width:calc(80% - 10px); margin-left:calc(20% - 10px); padding:20px 0; line-height:1.4; text-align:center; display:block; float:left;}
#produuct-detail .row{margin:0 -10px;}
#produuct-detail .container{width:calc(80% - 10px); margin:10px 0 0 10px; display:block; float:left;}
#produuct-detail .pic-slide{width:100%; border:1px solid #FFF; border-radius:10px; overflow:hidden; display:block; float:left; position:relative;}
#produuct-detail .swiper-slide{ cursor:zoom-in; cursor:-webkit-zoom-in;}
#produuct-detail .swiper-slide.swiper-slide-zoomed{cursor:zoom-out; cursor:-webkit-zoom-out;}
#produuct-detail .pic-slide img{width:100%;}
#produuct-detail figure{width:100%; min-height:640px; margin:34px 0; padding:36px 30px 25px 30px; border-radius:10px; overflow:hidden; background:#FFF; display:block; float:left;}
#produuct-detail figure h4{width:100%; padding:0 0 20px 0; margin:0 0 20px 0; line-height:1.4; font-size:25px; text-align:left; display:block; float:left; position:relative;}
#produuct-detail figure h4 i{width:auto; line-height:1.2; font-size:14px; font-style:normal; display:block; position:absolute; left:0; bottom:0px;}
#produuct-detail figure .content{width:100%; padding-right:52%; display:block; float:left; position:relative;}
#produuct-detail figure h6{width:100%; margin-bottom:15px; line-height:28px; display:block; float:left;}
#produuct-detail figure p.desc{width:100%; min-height:150px; line-height:1.4; margin-bottom:20px; padding-bottom:15px; font-size:18px; border-bottom:1px solid #acacac; display:block; float:left;}
#produuct-detail figure span{width:50%; padding-left:10px; display:block; float:left; position:absolute; top:0; right:0;}
#produuct-detail form{width:100%; display:block; float:left;}
#produuct-detail fieldset{width:100%; margin:10px 0; padding:0; border:0; display:block; float:left;}
#produuct-detail font{width:auto; line-height:1.4; font-size:18px; display:block; float:right;}
#produuct-detail fieldset.card{height:36px; margin:0;}
#produuct-detail fieldset.line{padding-bottom:20px; margin-bottom:20px; border-bottom:1px solid #acacac;}
#produuct-detail label{width:auto; line-height:1.4; font-size:18px; display:block; float:left;}
#produuct-detail form p.price{width:auto; line-height:1.4; font-size:18px; display:block; float:right;}
#produuct-detail form p.price::after{content:" บาท"; color:#000; font-size:14px;}
#produuct-detail form p.left{width:auto; margin-left:5px; line-height:1.4; font-size:18px; display:block; float:left;}
#produuct-detail fieldset.card label{line-height:36px; margin:0;}
#produuct-detail fieldset.card p{width:auto; margin-left:5px; line-height:36px; font-size:18px; display:block; float:left;}
#produuct-detail fieldset.delivery{width:100%;}
#produuct-detail fieldset.delivery label{width:100%; margin-bottom:0;}
#produuct-detail fieldset.delivery p{width:100%; line-height:1.4; padding:0 0 20px 60px; margin-top:20px; font-size:16px; display:block; float:right; position:relative; border-bottom:1px solid #acacac;}
#produuct-detail fieldset.delivery p.no-line{border-bottom:0;}
#produuct-detail fieldset.delivery p em{width:45px; height:100%; display:block; position:absolute; left:0; top:0;}
#produuct-detail fieldset.delivery p em img{width:100%;}
#produuct-detail fieldset.delivery p b{width:100%; margin-bottom:5px; display:block; font-weight:800; float:left;}
#produuct-detail .addfriend{width:100%; display:block; float:left;}
#produuct-detail .addfriend a{width:auto; display:block; float:left;}

#produuct-detail figure .visitors{width:auto; padding:0 20px; margin:10px 0; line-height:30px; font-size:14px; border-radius:5px; background:#e3ae29; display:block; float:left;}
#produuct-detail figure .fb{width:100%; margin:10px 0; display:block; float:left;}
/* #produuct-detail figure .like, #produuct-detail figure .share{width:auto; margin-right:15px; display:block; float:left;} */
#produuct-detail figure .like, #produuct-detail figure .share{width:auto; height:20px; margin-right:15px; display:block;}
#produuct-detail figure .share .fb_iframe_widget{width:70px; display:block;}
#produuct-detail figure .share .fb_iframe_widget span{display:block; padding:0; position:relative; left:auto; top:auto;}
#produuct-detail figure .social{width:100%; margin:10px 0; display:block; float:left;}
#produuct-detail figure .social a{width:40px; margin-right:10px; display:block; float:left;}
#produuct-detail figure .social a:last-child{margin-right:0;}
#produuct-detail figure .social a img{width:100%;}
#produuct-detail figure .tel{width:100%; margin:5px 0 0 0; font-size:20px; line-height:30px; display:block; float:left;}
#produuct-detail figure .tel a{color:#000;}
#produuct-detail figure .tel a:hover{color:#e3ae29;}

/* ปุ่ม next prev ตัวสไลด์ */
#produuct-detail .swiper-button-prev, #produuct-detail .swiper-button-next{width:45px; height:45px; top:calc(50% + 22px); border-radius:50%; background:#e3ae29; z-index:90;
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
}
#produuct-detail .swiper-button-prev i, #produuct-detail .swiper-button-next i{width:45px; color:#FFF; line-height:45px; font-size:14px; text-align:center;}
#produuct-detail .swiper-button-prev{left:20px;}
#produuct-detail .swiper-button-next{right:20px;}
/* ปุ่ม next prev ตัวสไลด์ */
#produuct-detail .prev{width:auto; line-height:40px; padding:5px 35px 0 35px; text-align:center; color:#FFF; font-size:18px; border-radius:10px; overflow:hidden; background:#e3ae29; display:block; float:left;}
#produuct-detail .prev i{color:#FFF; margin-right:10px; font-size:14px; line-height:1;}
#produuct-detail .prev:hover i{-webkit-animation: leftmove 1s infinite; animation: leftmove 1s infinite;}

#produuct-detail .prev2{width:auto; line-height:40px; padding:5px 35px 0 35px; text-align:center; color:#FFF; font-size:18px; border-radius:10px; overflow:hidden; background:#0db224; display:block; float:left;}
#produuct-detail .prev2 i{color:#FFF; margin-right:10px; font-size:14px; line-height:1;}
#produuct-detail .prev2:hover i{-webkit-animation: leftmove 1s infinite; animation: leftmove 1s infinite;}

#f-cat{width:100%; margin-bottom:20px; text-align:left; display:none; float:left;}
#f-cat .custom-select {position:relative;}
#f-cat .custom-select select {display: none; /*hide original SELECT element: */}
#f-cat .select-selected {background-color:transparent;}
/* Style the arrow inside the select element: */
#f-cat .select-selected:after {position:absolute; content:""; top:20px; right:15px; width:0; height:0; border:6px solid transparent; border-color:#fff transparent transparent transparent;}
/* Point the arrow upwards when the select box is open (active): */
#f-cat .select-selected.select-arrow-active{
  -webkit-border-top-left-radius: 10px;
  -webkit-border-top-right-radius: 10px;
  -webkit-border-bottom-left-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  -moz-border-radius-topleft: 10px;
  -moz-border-radius-topright: 10px;
  -moz-border-radius-bottomleft: 0;
  -moz-border-radius-bottomright: 0;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
#f-cat .select-selected.select-arrow-active:after {border-color:transparent transparent #fff transparent; top:7px;}
/* style the items (options), including the selected item: */
#f-cat .select-selected { color:#ffffff; padding:8px 16px; border-radius:10px; border:1px solid #FFF;  cursor:pointer;}
#f-cat .select-items div{ color:#ffffff; padding:8px 16px; background:#000;}
/* Style items (options): */
#f-cat .select-items {position:absolute; overflow:hidden; background-color:#000; border:1px solid #FFF; top:100%; left:0;  right:0; z-index:999;
  cursor: pointer;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
}
/* Hide the items when the select box is closed: */
#f-cat .select-hide {display: none;}
#f-cat .same-as-selected {background-color: rgba(0, 0, 0, 0.1);}
#f-cat .select-items div:hover{background-color: rgba(255, 255, 255, 1); color:#000;}


#appcover{width:115px; display:block; float:right;}
#appcover .row {display: table-row;}
#appcover .toggle-button-cover {width:calc(100% - 130px); display:block; position:relative; box-sizing:border-box; float:left;}
#appcover p{width: auto; height:40px; line-height:40px; display:block; float:left;}
#appcover .button-cover {height:40px; margin:0; background-color:#fff;  }
#appcover .button-cover:before {counter-increment:button-counter; content:counter(button-counter); position:absolute; right:0; bottom:0; color:#d7e3e3; font-size:12px; line-height:1; padding:5px;}
#appcover .button-cover,
#appcover .knobs,
#appcover .layer {position:absolute; top:0; right:0; bottom:0; left:0; display:block;}
#appcover .button {position:relative; width:120px; height:36px; margin:0; overflow:hidden; display:inline-block;}
#appcover .button.r,
#appcover .button.r .layer {border-radius:100px;}
#appcover .button.b2 {border-radius:5px;}
#appcover .checkbox {position:relative; width:100%; height:100%; padding:0; margin:0; opacity:0; cursor:pointer; z-index:3;}
#appcover .knobs {z-index: 2;}
#appcover .layer {width: 100%; transition: 0.3s ease all; z-index: 1;}

/* Button 10 */
#button-10 .knobs:before,
#button-10 .knobs:after,
#button-10 .knobs span {position: absolute; top: 4px; width: 56px; height: 30px; font-size: 14px; font-weight: bold; text-align: center; line-height: 1; padding: 9px 4px; border-radius:5px; transition: 0.3s ease all;}
#button-10 .knobs:before { content: ""; left: 4px; background-color: #0db224;}
#button-10 .knobs:after {content: "ไม่ออก"; right: 4px; color: #4e4e4e;}
#button-10 .knobs span {display: inline-block !important; left: 4px; color: #fff; z-index: 1; border:0 !important; float: none !important; padding:10px !important; padding-left:15px !important;}
#button-10 .checkbox:checked + .knobs span {color:#4e4e4e;}
#button-10 .checkbox:checked + .knobs:before {left:60px; background-color: #ff0000;}
#button-10 .checkbox:checked + .knobs:after {color:#fff;}



#gmap{width:100%; display:block; float:left;}
#gmap iframe{width:100%; height:500px;}
#contact{width:100%; padding:50px 0; text-align:center; display:block; float:left;}
#contact figure{width:100%; margin:0; display:block; float:left;}
#contact h3{width:100%; margin:0; text-align:center; display:block;}
#contact .slogan{width:100%; text-align:center; display:block; float:left;}
#contact .slogan img{max-width:100%;}
#contact h4{width:auto; margin:15px 0; line-height:55px; text-align:center; display:block;}
#contact h4 b{width:auto; height:55px; font-size:80px; color:#e3ae29; font-weight:600; text-align:center; position: relative; top:20px;}
/* #contact h4::before{content:"“ "; font-size:80px; color:#e3ae29; top:20px; position:relative;}
#contact h4::after{content:" ”"; font-size:80px; color:#e3ae29; top:40px; position:relative;} */
#contact h5{width:100%; margin:15px 0; font-size:25ppx; text-align:center; display:block;}
#contact .content{width:100%; margin:30px 0; padding:30px; text-align:left; border-radius:10px; border:1px solid #FFF; overflow:hidden; display:block; float:left;}
#contact h6{width:100%; line-height:38px; margin:10px 0; font-size:20px; display:block; float:left;}
#contact .info{width:100%; padding-right:23%; text-align:left; display:block; float:left; position:relative;}
#contact .info p{width:100%; line-height:38px; margin:7px 0; color:#FFF; font-size:20px; text-align:left; display:block; float:left; position:relative;}
#contact .info a{color:#FFF; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#contact .info a:hover{color:#e3ae29; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
#contact .info .icon{padding-left:42px;}
#contact .info .icon em{width:28px; position:absolute; left:0; top:0; z-index:50;}
#contact .info .icon em img{width:100%;}
#contact .info .qr-code{width:23%; display:block; position:absolute; top:0; right:0;}
#contact .info .qr-code img{width:100%;}


footer{width:100%; padding:70px 0; text-align:center; display:block; float:left; background:url(../images/bg-footer.jpg) repeat;}
footer nav{width:100%; display:block;}
footer nav a{width:auto; margin:0 12px; color:#FFF; font-size:22px; display:inline-block; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; }
footer nav a:hover{color:#e3ae29; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; }
footer .social, footer .visitors{width:auto; margin:40px 0; display:block;}
footer .social a{width:53px; margin:0 6px; display:inline-block; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
footer .social a:hover{transform: scale(1.1); transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
footer .social a img{width:100%;}
footer .visitors p{width:100%; font-size:20px; color:#FFF; display:inline-block;}
footer .visitors p b{color:#e3ae29; font-style:normal; font-weight:600;}
footer .copyright{width:100%; font-size:20px; color:#FFF; display:block;}

.cookies-submit{width:100%; left:0; bottom:0; display:block; position:fixed; background:#333; z-index:999;
opacity:0;
animation:cookies-alert cubic-bezier(0,1,1,1);
animation-fill-mode:forwards;
animation-duration:0.6s;
animation-delay: 1s
}
@keyframes cookies-alert {
  from {
    opacity:1;
    -ms-transform: translateX(0) translateY(100px);
    -webkit-transform: translateX(0) translateY(100px);
    transform: translateX(0) translateY(100px);
  }
  to {
    opacity:1;
    -ms-transform: translateX(0) translateY(0);
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}
.cookies-submit span{width:100%; padding:20px 25% 20px 0; display:block; float:left; position:relative;}
.cookies-submit b{width:auto; line-height:28px; color:#FFF; font-size:18px; font-style:normal; text-decoration:underline; display:block; float:left;}
.cookies-submit p{width:auto; line-height:24px; color:#FFF; font-size:14px; display:block; float:left;}
.cookies-submit p a{color:#FFF; font-size:14px; font-style:normal; text-decoration:underline;}
.cookies-submit p a:hover{color:#e3ae29; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s;}
.cookies-submit .accept{width:210px; height:44px; line-height:44px; color:#FFF; font-size:16px; text-align:center; font-style:normal; border-radius:22px; display:block;
 position:absolute; right:0; top:50%; transform: translate(0, -50%); background:#B7303A; }
.cookies-submit .close-cookies{width:24px; height:24px; display:block; position:absolute; top:10px; right:10px;}
.cookies-submit .close-cookies::before{content:""; width:24px; height:24px; display:block; position:absolute; background:url(../images/btu-close-circle.png);}

.h-nav{width:100%; padding:46px 0 0 0; display:block; float:left; position:relative;}
.h-nav::before{content:""; width:100%; height:46px; background:url(../images/bg_product.jpg); display:block; position:absolute; left:0; top:0; opacity:0.8;}
.h-nav a{width:100%; margin:0 0 10px 0; padding:5px 0; font-size:20px; border-bottom:1px solid rgba(255, 255, 255, 0.3); color:#FFF; display:block; float:left;}
.h-nav a:first-child{padding-top:15px;}
.h-nav a.active{color:#e3ae29;}


#nav-icon1, #nav-icon2, #nav-icon3, #nav-icon4 {
  display: none;
  position: fixed;
  height: 53px;
  top: 10px;
  width: 49px;
  z-index: 3000;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

/* Icon 2 */

#nav-icon2 {
  height:36px;
  top: 30px;
  right:20px;
  width: 48px;
  padding:5px;
  border-radius:3px;
  background:#e3ae29;
  -webkit-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.43);
  -moz-box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.43);
  box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.43);
}

#nav-icon2 span {
  display: block;
  position: absolute;
  height: 4px;
  width: 18px;
  background:#FFF;
  opacity: 1;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-icon2.mopen span{background:#FFF;}

#nav-icon2 span:nth-child(even) {
  left: 50%;
  border-radius:0;
}

#nav-icon2 span:nth-child(odd) {
  left:6px;
  border-radius:0;
}

#nav-icon2 span:nth-child(1), #nav-icon2 span:nth-child(2) {
  top: 7px;
}

#nav-icon2 span:nth-child(3), #nav-icon2 span:nth-child(4) {
  top: 16px;
}

#nav-icon2 span:nth-child(5), #nav-icon2 span:nth-child(6) {
  top: 25px;
}
#nav-icon2.mopen span:nth-child(1), #nav-icon2.mopen span:nth-child(6) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon2.mopen span:nth-child(2), #nav-icon2.mopen span:nth-child(5) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#nav-icon2.mopen span:nth-child(1) {
  left: 10px;
  top: 11px;
}

#nav-icon2.mopen span:nth-child(2) {
  left: calc(50% - 4px);
  top: 11px;
}

#nav-icon2.mopen span:nth-child(3) {
  left: -50%;
  opacity: 0;
}

#nav-icon2.mopen span:nth-child(4) {
  left: 100%;
  opacity: 0;
}

#nav-icon2.mopen span:nth-child(5) {
  left: 10px;
  top: 21px;
}

#nav-icon2.mopen span:nth-child(6) {
  left: calc(50% - 4px);
  top: 21px;
}

#nav-icon2.mclose span:nth-child(even) {
  left: 50%;
  border-radius:0;
}

#nav-icon2.mclose span:nth-child(odd) {
  left:6px;
  border-radius:0;
}
.m-warp{z-index:600; background:#FFF; }
.menu-mobile{width:100%; padding:0; height:100%; text-align:center; display:block; background:transparent; opacity:0;
position:absolute; right:0; top:0; z-index:0;
-webkit-box-shadow: -7px 0px 6px 0px rgba(0,0,0,0.25);
-moz-box-shadow: -17px 0px 6px 0px rgba(0,0,0,0.25);
box-shadow: -7px 0px 6px 0px rgba(0,0,0,0.25);
-webkit-transform: translate3d(0,0,0)scale(1);
-moz-transform: translate3d(0,0,0)scale(1);
transform: translate3d(0,0,0)scale(1);
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
visibility: hidden;
z-index:400;

}

.menu-mobile.mopen {
opacity: 1;
z-index:999;
-webkit-animation: fadeIn .35s ease-in-out;
-moz-animation: fadeIn .35s ease-in-out;
animation: fadeIn .35s ease-in-out;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
visibility: visible;
background:#000;
position:fixed;
overflow-y:scroll;
}
@-webkit-keyframes fadeIn {
	0%    {opacity:0;}
	100%  {opacity:1;}
}
@-moz-keyframes fadeIn {
	0%    {opacity:0;}
	100%  {opacity:1;}
}
@keyframes fadeIn {
	0%    {opacity:0;}
	100%  {opacity:1;}
}

/*Nav Shrinking Closed Effect*/
.menu-mobile.mclose {
  opacity:0;
  z-index:400;
	-webkit-animation: fadeOut 1s ease-in-out;;
	-moz-animation: fadeOut 1s ease-in-out;
	animation: fadeOut 1s ease-in-out;
  transition: all 1s ease 0s;
  -webkit-transition: all 1s ease 0s;
  visibility: hidden;
  position:absolute;
  overflow-y:hidden;
}
@-webkit-keyframes fadeOut {
	0%    {opacity:1;}
	100%  {opacity:0;}
}
@-moz-keyframes fadeOut {
	0%    {opacity:1;}
	100%  {opacity:0;}
}
@keyframes fadeOut {
	0%    {opacity:1;}
	100%  {opacity:0;}
}

.followMeBar {
  padding:0;
  position: relative;
  z-index: 1;
}
.followMeBar.fixed {
  position: fixed;
  top: 228px;
  width: 100%;
  box-sizing: border-box;
  z-index: 0;
}
.followMeBar.fixed.absolute {
  position: absolute;
}

/*************************** CAPTCHA *******************************/

#rc-imageselect {transform:scale(0.77) !important; -webkit-transform:scale(0.77) !important; transform-origin:0 0 !important; -webkit-transform-origin:0 0;}