.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;
	color:#555;
  cursor:pointer;
}
a:hover{
    transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
	text-decoration:none !important;
	color:#555;
  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:'Kanit'; color:#555; font-size:18px; display:block; background:#FFF;}
h1, h2, h3, h4, h5 { margin:0 !important; padding:0; font-weight:normal; color:#525252;}
h1{font-size:50px !important;}
h2{font-size:40px !important;}
h3{font-size:36px !important;}
h4{font-size:32px !important;}
h5{font-size:30px !important;}
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{ 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;}
.text-left{ text-align:center !important;}
.desktop{display:block !important;}
.mobile{display:none !important;}
.relative{ position:relative;}
.absolute{ position:absolute !important;}
.kanit-t{font-weight:100 !important; font-family:'Kanit', sans-serif;}
.kanit-el{font-weight:200 !important; font-family:'Kanit', sans-serif;}
.kanit-l{font-weight:300 !important; font-family:'Kanit', sans-serif;}
.kanit-r{font-weight:400 !important; font-family:'Kanit', sans-serif;}
.kanit-m{font-weight:500 !important; font-family:'Kanit', sans-serif;}

.blue{color:#00AEEF;}
.black{color:#000;}
.white{color:#FFF;}

.warp{width:100%; margin:auto; display:block;}
.main{ width:1280px; margin:auto; display:block;}
.main14{ width:100%; margin:auto; display:block;}
.main12{ width:100%; margin:auto; display:block;}
.main11{ width:1122px; margin:auto; display:block;}

.container{width:100%; max-width:100% !important;}

.warp{width:100%; display:block; position:relative;}

header{width:100%; margin:15px 0 28px 0; border-bottom: 1px #DDD solid; display:inline-block !important;}
header .container{width:100%; margin:0; padding:0; text-align:center; display:inline-block; background:#FFF; position:relative;}
header .logo{width:auto; margin:0 0 18px 0; display:inline-block;}
header .logo a{width:246px; display:inline-block;}
header .logo a img{width:100%;}
header .bottom{width:100%; display:block;}
header nav{width:auto; margin:0; white-space:nowrap; text-align:center; display:inline-block;}
header nav li{margin:0; padding:0 10px; white-space:nowrap; display:inline-block; position:relative;}
header nav li a{width:auto; padding:14px 0; line-height:26px; color:#858585; font-size:15px; white-space:nowrap; position:relative; display:inline-block;}
header nav li:hover a, header nav li a.active{color:#00ADEE;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
header nav li a::after{content:""; width:100%; height:1px; background:#DDD;
display:inline-block; position:absolute; bottom:-1px; left:0;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
header nav li a:hover::after, header nav li a.active::after{background:#00ADEE;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
header .other-menu{width:auto; display:inline-block; position:absolute; top:0; left:0; }
header .other-menu a{width:auto; line-height:20px; margin:0 38px 0 0; padding:0; color:#858585; font-size:14px; display:block; float:left;}
header .other-menu a:hover{color:#00ADEE; }
header .search{width:173px; margin:10px 0 0 0; padding:0; text-align:left; display:block; float:left;}
header .search input[type="text"]{width:30px; padding:0 0 0 30px; line-height:30px; color:#858585; font-size:20px; background:transparent;
border:0; border-bottom:1px solid rgba(86,86,91,0); position:relative; display:inline-block; float:left;
background:url(../images/btu-search.png) no-repeat top 3px left 5px;
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
header .search input[type="text"]:hover, header .search input[type="text"]:focus{width:100%; border-bottom:1px solid rgba(86,86,91,1);
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
header .search em{ width:20px; line-height:300px; color:#00AEEF; font-size:16px; text-align:right;
position:absolute; right:0; top:0; display:inline-block;}
header .member-lang{width:auto; text-align:left; float:right; display:block; vertical-align:top;}
header .member-lang .r-member{width:auto; padding:0 30px 0 0; display:inline-block; position:relative; vertical-align:top; white-space:nowrap;}
header .member-lang .r-member em{width:1px; height:20px; margin:16px 10px 0px 10px; background:#A4B4BA; display:inline-block; vertical-align:top;}
header .member-lang .login, header .member-lang .regis{width:auto; line-height:26px; padding:14px 0 14px 25px; color:#858585; font-size:13px;
display:inline-block; position:relative; vertical-align:top; white-space:nowrap;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
header .member-lang .login:hover, header .member-lang .regis:hover{color:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
header .member-lang .login i, header .member-lang .regis i{width:25px; line-height:54px; color:#888; font-size:16px;
display:inline-block; position:absolute; left:0; top:0px; }
header .member-lang .user{width:auto; line-height:26px; padding:14px 0 14px 60px; color:#858585; font-size:18px;
display:inline-block; position:relative; vertical-align:top;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
header .member-lang .dropdown{width:auto; display:block; float:left; cursor:pointer;}
header .member-lang .dropdown .user {width:100%;
line-height: 26px;
margin: 0;
padding: 14px 0 14px 60px;
color: #858585;
font-size: 18px; font-weight:300 !important; font-family:'Kanit', sans-serif;
display: inline-block;
position: relative;
vertical-align: top;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}
header .member-lang .dropdown .user i{width:45px; line-height:54px; color:#00AEEF; font-size:18px; text-align:center;
display:inline-block; position:absolute; left:0; top:0;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
header .member-lang .dropdown-content{width:200px; position:absolute; z-index:999; border-radius:0; border:1px #DDD solid; margin:0; background:#FFF; display:none;}
header .member-lang .dropdown:hover .dropdown-content{display:block;}
header .member-lang .dropdown:hover .user i{background:#E2EDF3;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
header .member-lang .dropdown-content a{width:100%; line-height:26px; padding:12px 22px; color:#858585; font-size:18px; text-align:left; display:block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
header .member-lang .dropdown-content a:hover{background:#E2EDF3;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
header .member-lang .lang{width:auto; display:inline-block; position:relative; vertical-align:top;}
header .member-lang .lang nav li{margin:0; padding:0 5px; white-space:nowrap; display:inline-block; position:relative; white-space:nowrap;}
header .member-lang .member{margin-right:20px; }
header .cart-social{width:auto; display:inline-block; position:absolute; right:0px; top:-9px; vertical-align:top;}
header .cart-social .cart{width:40px; line-height:32px; padding:0; color:#888; font-size:20px;
position:relative; display:inline-block; vertical-align:top;}
header .cart-social .cart i{width:24px; height:24px; line-height:24px; color:#FFF; font-size:14px;
text-align:center; font-style:normal; font-weight:300; display:inline-block; font-weight:300 !important; font-family:'Kanit', sans-serif;
position:absolute; right:-11px; top:0; border-radius:50%; background:#00AEEF;}
header .cart-social .social{width:auto; text-align:center; display:inline-block; vertical-align:top;}
header .cart-social .social a{width:40px; float:left; display:block;}
header .cart-social .social a img{width:100%;}
header .cart-social .social a i{width:100%; height:40px; line-height:40px; text-align:center; color:#888; font-size:25px; display:block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
header .cart-social .social a:hover i{color:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
header .cart-social .lang{width:auto; position:relative; vertical-align:top; display:none;}
header .cart-social .lang a{width:auto; padding:5px 0; margin:0 10px; line-height:26px; color:#858585; font-size:20px; white-space:nowrap;
position:relative; display:inline-block;}
header .cart-social .lang a:hover, header .cart-social .lang a.active{color:#00ADEE;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
header .cart-social .lang a:last-child{margin-right:0; }


.menu-member .mm-menu{width:268px; padding:22px 19px 19px 19px; text-align:center; border:1px #447CEC solid; display:block; visibility:hidden; opacity:0;
position:absolute; left:-37px; top:-23px; background:#FFF; z-index:999;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.menu-member:hover .mm-menu{visibility:visible; opacity:1;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.mm-menu .topic{width:194px; padding:0 12px; margin-bottom:40px; border:0; position:relative; display:inline-block;}
.mm-menu .topic p{width:auto; padding-right:30px; line-height:40px; color:#000; font-size:20px; position:relative; display:inline-block; float:left;}
.mm-menu .topic p em{ width:auto; line-height:40px; color:#00AEEF; font-size:18px;
position:absolute; right:0; top:0; display:inline-block;}

.h-banner{width:100%; margin-bottom:32px; display:inline-block;}
.h-banner .bslide{width:100%; padding:0 0 33px 0; position:relative; display:inline-block;}
.h-banner .bslide img{width:100%;}
.h-banner .bslide .p-prev, .h-banner .bslide .p-next{width:60px; height:60px; line-height:60px; color:#FFF; text-align:center; cursor:pointer; display:inline-block;
position:absolute; top:50%;  margin-top:-45px; z-index:99; opacity:0.4;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.h-banner .bslide .p-prev:hover, .h-banner .bslide .p-next:hover{opacity:1; transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}
.h-banner .bslide .p-prev{left:20px;}
.h-banner .bslide .p-prev::before{content:""; width:60px; height:60px; background:url(../images/arrow-left.png) no-repeat; display:inline-block;}
.h-banner .bslide .p-next{right:20px;}
.h-banner .bslide .p-next::before{content:""; width:60px; height:60px; background:url(../images/arrow-right.png) no-repeat; display:inline-block;}
.h-banner .bslide .lSSlideOuter .lSPager { text-align:center; display:inline-block; position:absolute; left:0; bottom:0; z-index:51;}
.h-banner .bslide .lSSlideOuter .lSPager.lSpg{width:100%; margin:0; text-align:center; display:inline-block;}
.h-banner .bslide .lSSlideOuter .lSPager.lSpg > li a{width:10px; height:10px; background:#DDD; border:0; }
.h-banner .bslide .lSSlideOuter .lSPager.lSpg > li a{border:0; }
.h-banner .bslide .lSSlideOuter .lSPager.lSpg > li:hover a, .h-banner .bslide .lSSlideOuter .lSPager.lSpg > li.active a {
    background:#00AEEF;
    border:0;
}


main{width:100%; margin:0; display:inline-block !important;}

.headline{width:100%; line-height:48px; padding:0; color:#525252; text-align:center; position:relative; display:inline-block;}
.headline h3{width:auto; line-height:48px; padding:0 32px; background:#FFF; display:inline-block; position:relative; z-index:20;}
.headline::after{content:""; width:100%; height:1px; margin:0; background:#DDD; display:inline-block; position:absolute; left:0; top:50%; z-index:10; }

.mtopic{width:100%; padding:0; margin:32px   0 0 0; text-align:center; display:inline-block;}
.mtopic h1{width:auto; line-height:70px; text-align:center; vertical-align:middle;}

.h-story{width:100%; margin:32px 0; padding:0; display:inline-block;}
.h-story span{width:100%; padding:0 8%; display:inline-block; float:left;}
.h-story span h2{width:100%; line-height:40px; margin:38px 0 !important; text-align:center; font-style:italic; display:inline-block;
text-decoration: underline solid #DDD 1px;
}
.h-story span h5{width:100%; line-height:38px; margin:38px 0 !important; text-align:center; font-style:italic; display:inline-block;
text-decoration: underline solid #DDD 1px;
}
.h-story span h5 em{font-weight:300 !important;}

.story{width:100%; margin:30px 0; padding:0; display:inline-block;}
.story .top{width:100%; margin:32px 0; padding:0 30px; display:inline-block;}
.story .top h5{width:100%; line-height:35px; margin:0; text-align:center; display:inline-block;}
.story .top h5.line{width:100%; line-height:35px; margin:38px 0 !important; text-align:center; font-style:italic; display:inline-block;
text-decoration: underline solid #DDD 1px;
}
.story .top h5 em{font-weight:300 !important; font-style:normal;}
.story .top h5.line em{font-weight:300 !important; font-style:italic;}
.story .top h2{width:100%; line-height:40px; margin:38px 0 !important; text-align:center; font-style:italic; display:inline-block;
text-decoration: underline solid #DDD 1px;
}
.story .concept{width:100%; margin:30px 0; display:inline-block;}
.story .concept h5{width:100%; line-height:35px; margin:58px 0 26px 0 !important; text-align:center; display:inline-block;}
.story .concept .pic{width:100%; margin:26px 0 40px 0; text-align:center; display:inline-block;}
.story .concept .pic img{width:100%;}
.story .philosophy{width:100%; margin:30px 0; display:inline-block;}
.story .philosophy .pic{width:100%;margin:47px 0 10px 0; display:inline-block;}
.story .philosophy .pic img{width:100%;}
.story .technology{width:100%; margin:30px 0; display:inline-block;}
.story .technology .pic{width:100%;margin:55px 0 42px 0; display:inline-block;}
.story .technology .pic img{width:100%;}
.story .technology .bg{padding:0 30px; background:url(../images/bg-story-tec.jpg) no-repeat no-repeat center center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;}
.story .technology ul{width:100%;margin:55px 0 0 0; padding:10px 0; display:inline-block;}
.story .technology .g-grid {
  display: grid;
  grid-template-columns: calc(33.33333333% - 0px * 2/3) calc(33.33333333% - 0px * 2/3) calc(33.33333333% - 0px * 2/3);
  grid-column-gap: 0;
  grid-row-gap: 0;
}
.story .technology ul li{ margin:10px 0; padding:0; }
.story .technology ul li .content{width:100%; color:#FFF; display:block;}
.story .technology ul li em{width:37%; display:block; float:left;}
.story .technology ul li em img{width:100%;}
.story .technology ul li span{width:57%; margin:20px 0 0 6%; display:block; float:left;}
.story .technology ul li h6{width:80%; line-height:30px; padding:0 0 13px 0 !important; font-size:25px; display:block; position:relative;}
.story .technology ul li h6::after{content:""; width:100%; height:1px; background:#FFF; display:block; position:absolute; left:-14%; bottom:0;}
.story .technology ul li p{width:80%; line-height:25px; padding:0; margin:10px 0 0 0; font-size:18px; display:block; position:relative;}
.story .certificate{width:100%; margin:30px 0; display:inline-block;}
.story .certificate h5{width:100%; line-height:35px; margin:56px 0 !important; text-align:center; display:inline-block;}
.story .certificate em{font-weight:300 !important; font-style:normal;}
.story .certificate .container{width:100%; margin:26px 0 0 0; padding:0; border:1px #DDD solid; display:inline-block;}
.story .certificate .content{width:100%; display:inline-block;}
.story .certificate .content h5{width:100%; line-height:34px; margin:0 !important; padding:18px 0 !important; color:#535353;
text-align:center; background:#E2EDF3; display:inline-block;}
.story .certificate .content span{width:100%; padding:13px 13px 17px 13px; text-align:center; display:inline-block;}
.story .certificate .content span p{width:20%; padding:19px; display:inline-block;}
.story .certificate .content span p i{width:100%; line-height:22px; color:#888; font-size:18px; font-style:normal; text-align:left; display:inline-block;}
.story .certificate .content span p em{width:100%; margin:0 0 8px 0; border:1px #AAA solid; display:block;}
.story .certificate .content span p em img{width:100%;}

.h-menu{width:100%; margin:32px 0; display:inline-block;}
.h-menu ul{width:100%; margin:0; display:inline-block;}
.h-menu ul li{width:33.33333333%; padding:15px; margin:0; display:inline-block; float:left;}
.h-menu ul li a{width:100%; padding:44px 24px 44px 32px; border:1px #CCC solid; display:inline-block; position:relative;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.h-menu ul li a:hover{border-bottom:1px #00AEEF solid;
-webkit-box-shadow: 8px 10px 8px 3px rgba(0,0,0,0.1);
-moz-box-shadow: 8px 10px 8px 3px rgba(0,0,0,0.1);
box-shadow: 8px 10px 8px 3px rgba(0,0,0,0.1);
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.h-menu ul li a::after{content:""; width:100%; height:1px; background:#FFF; display:block; position:absolute; left:0; bottom:0;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.h-menu ul li a:hover::after{background:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.h-menu ul li a h4{width:100%; line-height:40px; padding:0 24px 0 60px !important; margin:0; color:#525252; font-size:28px !important; display:inline-block; position:relative;}
.h-menu ul li a h4::before{content:""; width:36px; height:40px; display:block; position:absolute; top:0; left:0;}
.h-menu ul li a h4.story::before{background:url(../images/icon-story.png) no-repeat top 2px left 0px; }
.h-menu ul li a h4.technology::before{background:url(../images/icon-technology.png) no-repeat top 2px left 0px; }
.h-menu ul li a h4.store::before{background:url(../images/icon-store.png) no-repeat top 2px left 0px; }
.h-menu ul li a h4 i{width:auto; line-height:40px; color:#00AEEF; font-size:14px; font-style:normal; display:block; position:absolute; top:0; right:0;}

.product{width:100%; margin:30px 0 32px 0; display:inline-block;}
.product .left-menu{width:24%; margin:0; padding:0 30px 0 0; display:block; float:left;}
.product .left-menu [data-accordion]{padding:4px 0; border-bottom:1px #DDD solid; }
.product .left-menu [data-accordion]:first-child{ border-top:1px #DDD solid;}
.product .left-menu .topic{width:auto; line-height:25px; margin:14px 0; color:#858585; font-size:18px; display:inline-block; cursor:pointer;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .left-menu .topic:hover, .product .left-menu .topic.active{color:#00ADEE;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .left-menu span{width:100%; margin:0; padding:0; display:inline-block;}
.product .left-menu span a{width:100%; line-height:22px; padding:0 10px 0 0; margin:14px 0; color:#858585; font-size:18px; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .left-menu span a.active, .product .left-menu span a:hover{color:#00ADEE; text-decoration:underline solid #00ADEE 1px !important;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .container{width:76%; margin:0; padding:0; display:block; float:left;}
.product .container.h-product{width:100%; margin:40px 0 0 0; padding:0; display:inline-block; float:none;}
.product .container .banner{width:100%; display:inline-block;}
.product .container .banner img{width:100%;}
.product .container h5{width:100%; line-height:34px; margin:57px 0 !important; padding:0; color:#525252; display:inline-block;}
.product .container h5.detail{margin:25px 0 57px 0 !important;}
.product .container .cate{width:100%; line-height:1; margin:70px 0 0 0!important; padding:0 !important; color:#00ADEE; text-align:center; display:inline-block;}
.product .container .frame{width:100%; position:relative; display:inline-block;}
.product .container .pslide{width:100%; position:relative; display:inline-block;}
.product .container .pslide.bortop{border-top:1px #CCC solid; }
.product .container .pslide h5{width:100%; margin:40px 0 25px 0 !important; padding:0 !important; line-height:40px; display:inline-block; }
.product .container .pslide .p-prev, .product .container .pslide .p-next{width:60px; height:60px; line-height:60px; color:#FFF; text-align:center; cursor:pointer; display:inline-block;
position:absolute; top:50%;  margin-top:-25px; z-index:99;}
.product .container .pslide .p-prev{left:-30px;}
.product .container .pslide .p-prev::before{content:""; width:60px; height:60px; background:url(../images/arrow-left.png) no-repeat; display:inline-block;}
.product .container .pslide .p-next{right:-30px;}
.product .container .pslide .p-next::before{content:""; width:60px; height:60px; background:url(../images/arrow-right.png) no-repeat; display:inline-block;}
.product .container .pslide .lSSlideOuter .lSPager.lSpg{text-align:center; margin:0; }

.product .container .pslide.noslide ul li{width:33.333333%; display:block; float:left;}
.product .container ul{width:100%; margin:0; display:inline-block;}
.product .container ul li{padding:15px; }
.product .container.h-product ul li{padding:10px; }
.product .container .content{width:100%; border:1px #DDD solid; background:#FFF; position:relative; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .container .content:hover{
  -webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.1);
  -moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.1);
  box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.1);
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .container .content .pic{width:100%; display:inline-block; position:relative;}
.product .container .content .pic img{width:100%; background:#E2EDF3; opacity:1;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .container .content .pic .cart{width:190px; height:50px; padding:12px 0 12px 0; text-align:center;
border:1px #00AEEF solid; display:block; position:absolute; left:50%; top:50%; margin:-25px 0 0 -95px; background:#FFF;
visibility:hidden; opacity:0; z-index:99;
}
.product .container .content .pic .cart p{width:auto; padding:0 33px 0 0; line-height:24px; color:#525252; font-size:18px; position:relative; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .container .content .pic .cart:hover p{color:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .container .content .pic .cart p i{width:auto; line-height:24px; color:#00AEEF; font-size:20px; font-style:normal; position:absolute; right:0; top:0;}
.product .container .content .topic{width:100%; border-bottom:1px #DDD solid; display:inline-block;}
.product .container .content .topic h6{width:100%; height:99px; line-height:25px; padding:12px 20px; color:#535353; font-size:20px; vertical-align:middle; display: table-cell;}
.product .container .content span{width:100%; padding:20px; border-bottom:2px #FFF solid; display:inline-block; position:relative;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .container .content span p{width:100%; height:69px; line-height:23px; overflow:hidden; margin:0 0 17px 0; color:#878787; font-size:18px; display:inline-block;}
.product .container .content span .price{width:100%; line-height:23px; margin:0 0 17px 0; color:#878787; font-size:18px; display:inline-block;}
.product .container .content span .price .cutoff{text-decoration:line-through; margin-right:15px; color:#878787; display:inline-block;}
.product .container .content span .price .discount{color:#D80000; display:inline-block;}
.product .container .content span .btu{width:auto; height:26px; line-height:26px; padding:0 26px 0 0; color:#535353; font-size:18px;
display:inline-block; position:relative;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.product .container .content span .btu:hover{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}
.product .container .content span .btu i{width:auto; height:26px; line-height:26px; color:#00AEEF; font-size:14px; font-style:normal;
display:block; position:absolute; right:0; top:0; }
.b-wishlist{width:26px; height:26px; line-height:26px; background:#FFF; display:inline-block; position:absolute; right:20px; bottom:20px; cursor:pointer;
  z-index:50;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.b-wishlist i{width:100%; line-height:26px; color:#DDD; font-size:20px; display:inline-block;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}
.b-wishlist.active i, .b-wishlist:hover i{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}

.product .container .content:hover .pic img{ opacity:0.3;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .container .content:hover .pic .cart{ background:#FFF;
visibility:visible; opacity:1;
}
.product .container .content:hover span{border-bottom:2px #00AEEF solid;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}

.product .container .frame{width:100%; padding:0 0 70px 0; border-bottom:1px #CCC solid; position:relative; display:inline-block;}
.product .container .frame .pic{width:48.75%; padding:0; margin:0 2.5% 0 0; display:block; float:left;}
.product .container .frame .pic img{width:100%; background:#E2EDF3; }
.product .container .frame .detail{width:48.75%; padding:0; display:block; float:left;}
.product .container .frame .detail h3{width:100%; line-height:46px; padding:5px 0 30px 0; border-bottom:1px #CCC solid; color:#525252; display:inline-block;}
.product .container .frame .detail .text{width:100%; line-height:25px; padding:30px 0 0 0; color:#858585; font-size:18px; display:inline-block;}
.product .container .frame form{width:48.75%; display:block; position:relative; float:right;}
.product .container .frame form span{width:100%; text-align:left; display:inline-block;}
.product .container .frame form span fieldset{width:100%; padding:0 5px; border-bottom:1px #DDD solid; display:inline-block;}
.product .container .frame form span p{width:auto; line-height:26px; padding:9px 0; margin:0; color:#858585; font-size:18px; display:inline-block;}
.product .container .frame form span label{width:160px; line-height:26px; margin:0; color:#858585; font-size:18px; background:transparent; display:inline-block;}
.product .container .frame form span .cutoff{ line-height:26px; text-decoration:line-through; margin-right:20px; font-size:18px; color:#878787; display:inline-block;}
.product .container .frame form span .discount{ line-height:26px; color:#D80000; font-size:18px; display:inline-block;}
.product .container .frame form span fieldset.amount{ padding:10px 5px; margin-top:30px; border-bottom:0; background:#F2F2F2; }
.product .container .frame form span fieldset.amount label{width:160px; padding:0 15px; line-height:40px; margin:0; display:inline-block;}
.product .container .frame form span fieldset.amount .form-control{border:1px #DDD solid;}
.product .container .frame form span fieldset.amount .input-group{width:120px;}
.product .container .frame form span fieldset.amount .input-group > .input-group-prepend > .btn{line-height:40px; padding:0 7px; border-radius:0; border:1px #DDD solid; background:#949494; }
.product .container .frame form span fieldset.amount .input-group > .input-group-prepend > .btn-outline-secondary{color:#FFF; }
.product .container .frame form span fieldset.amount .input-group > .input-group-prepend > .btn-outline-secondary:hover{background:#949494;}
.product .container .frame form span fieldset.amount .input-group > .input-group-append > .btn{line-height:40px; padding:0 7px; border-radius:0; border:1px #DDD solid; background:#00AEEF; }
.product .container .frame form span fieldset.amount .input-group > .input-group-append > .btn-outline-secondary{color:#FFF; }
.product .container .frame form span fieldset.amount .input-group > .input-group-append > .btn-outline-secondary:hover{background:#00AEEF;}
.product .container .frame form span fieldset.total{ padding:10px 5px;}
.product .container .frame form span fieldset.total label{width:160px; padding:0; line-height:40px; margin:0;}
.product .container .frame form span fieldset.total p{line-height:40px; color:#0CB2F0; font-size:30px; }
.product .container .frame form span fieldset.bottom{ padding:30px 0 0 0; border:0; }
.product .container .frame form span fieldset.bottom .order{width:125px; margin:0 10px 0 0; position:relative; display:block;}
.product .container .frame form span fieldset.bottom .order input[type="submit"]
{width:100%; height:50px; line-height:24px; padding:12px 25px 12px 0; color:#FFF; font-size:18px; text-align:center; cursor:pointer;
border:1px #00AEEF solid; display:block; background:#00AEEF; float:left;}
.product .container .frame form span fieldset.bottom .order i{width:auto; line-height:24px; color:#FFF; font-size:14px; font-style:normal;
position:absolute; right:27%; top:14px;}
.product .container .frame form span fieldset.bottom .cart{width:153px; height:50px; margin:0 10px; padding:12px 0 12px 0; text-align:center;
border:1px #00AEEF solid; display:block; background:#FFF; float:left;
}
.product .container .frame form span fieldset.bottom .cart p{width:auto; padding:0 33px 0 0; line-height:24px; color:#525252; font-size:18px;
  position:relative; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .container .frame form span fieldset.bottom .cart:hover p{color:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .container .frame form span fieldset.bottom .cart p i{width:auto; line-height:24px; color:#00AEEF; font-size:15px; font-style:normal; position:absolute; right:0; top:0;}

.product .container .frame form span fieldset.bottom .b-wishlist{width:153px; height:50px; margin:0; padding:12px 0 12px 0; text-align:center;
border:1px #CCC solid; display:block; background:#FFF; float:left; position:relative; right:0; bottom:0;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.product .container .frame form span fieldset.bottom .b-wishlist:hover{border:1px #00AEEF solid;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .container .frame form span fieldset.bottom .b-wishlist p{width:auto; padding:0 33px 0 0; line-height:24px; color:#525252; font-size:18px; position:relative; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .container .frame form span fieldset.bottom .b-wishlist:hover p{color:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.product .container .frame form span fieldset.bottom .b-wishlist p i{width:auto; line-height:24px; color:#888; font-size:15px;
font-style:normal; position:absolute; right:0; top:0;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}
.product .container .frame form span fieldset.bottom .b-wishlist.active i,
.product .container .frame form span fieldset.bottom .b-wishlist:hover i{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}

.product .container .description{width:100%; margin:26px 0 50px 0; display:inline-block;}
.product .container .description .content{border:0;}
.product .container .description .content:hover{
-webkit-box-shadow:none;
-moz-box-shadow:none;
box-shadow:none;}
.product .container .description .text{width:100%; line-height:25px; padding:0; margin:0; color:#858585; font-size:18px; display:inline-block;}
.product .container .description .menu{width:100%; text-align:left; display:block;}
.product .container .description ul.nav{ width:100%; margin:0 0 50px 0; padding:0; border:0; display:inline-block;}
.product .container .description ul.nav li{ width:auto; padding:0; margin:0 40px 0 0; border:0; display:inline-block; position:relative; float:none;}
.product .container .description ul.nav li a { width:auto; margin:0; padding:14px 0; line-height:25px; color:#858585; font-size:18px;
border:0; border-bottom:1px #FFF solid; border-radius:0; position:relative; background:none; }
.product .container .description ul.nav li a.focus,
.product .container .description ul.nav li a:focus{border:0; border-bottom:1px #FFF solid; box-shadow:none; border-radius:0; color:#858585;
 outline:none; background:none; display:block;}
.product .container .description ul.nav li a:hover,
.product .container .description ul.nav li a.active{border:0; border-bottom:1px #00AEEF solid; margin:0; color:#00AEEF;}

.product .container .online{width:100%; margin:0 0 35px 0; display:inline-block;}
.product .container .online .topic{width:100%; margin:0 0 25px 0; color:#00AEEF; font-size:18px; display:inline-block;}
.product .container .online span{width:100%; display:inline-block;}
.product .container .online span p{display: grid;
grid-template-columns: calc(20% - 0px * 4/5) calc(20% - 0px * 4/5) calc(20% - 0px * 4/5) calc(20% - 0px * 4/5) calc(20% - 0px * 4/5);
grid-column-gap: 0;
grid-row-gap: 0;}
.product .container .online span .logo{padding:10px 15px; display:block;}
.product .container .online span .logo img{width:100%;}
/* .product .container .online span .logo:first-child{padding-left:0;}
.product .container .online span .logo:last-child{padding-right:0; } */

.product .container .remark{width:100%; margin:0 0 50px 0; padding:18px 25px; background:#F2F2F2; display:inline-block;}
.product .container .remark p{width:100%; line-height:24px; margin:9px 0; padding:0 0 0 50px; color:#858585; font-size:18px;
display:inline-block; position:relative;}
.product .container .remark p i{width:50px; line-height:24px; color:#00AEEF; font-size:20px; text-align:center; display:block;
  position:absolute; left:0; top:0; }

.banner-ad{width:100%; margin:32px 0; display:inline-block;}
.banner-ad span{width:100%; border:2px #DDD solid; display:inline-block;}
.banner-ad a{width:50%; padding:0; display:block; float:left;}

.banner-ad a img{width:100%;}

.promotion{width:100%; margin:32px 0; text-align:center; display:inline-block;}
.promotion .content{width:100%; text-align:left; background:#FFF; position:relative; display:inline-block;}
.promotion h6{width:100%; line-height:24px; margin:0 !important; color:#545454; font-size:18px; display:none;}
.promotion .pic{width:100%; padding:0 15px; display:block;}
.promotion .pic img{width:100%;}
.promotion .row{display:inline-block;}
.promotion .content span{width:100%; padding:0 15px; display:block;}
.promotion .content .date{width:100%; line-height:20px; padding:14px 0; color:#999; font-size:15px; font-style:normal; display:inline-block;}
.promotion .content p{width:100%; height:69px; line-height:23px; overflow:hidden; margin:0 0 17px 0; color:#555; font-size:18px;
display:inline-block;}
.promotion .content .btu{width:auto; height:26px; line-height:26px; padding:0 26px 0 0; color:#535353; font-size:18px;
display:inline-block; position:relative;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.promotion .content .btu:hover{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}
.promotion .content .btu i{width:auto; height:26px; line-height:26px; color:#00AEEF; font-size:14px; font-style:normal;
display:block; position:absolute; right:0; top:0; }

.promotion .h-promotion{margin:40px 0 0 0; }
.promotion .h-promotion{width:100%; margin:30px 0 0 0; text-align:center; display:inline-block;}
.promotion .h-promotion li,
.promotion .h-promotion li:nth-child(1),
.promotion .h-promotion li:nth-child(2){width:25%; margin:15px 0; padding:0 15px; display:block; float:left;}
.promotion .h-promotion li:nth-child(1) .pic,
.promotion .h-promotion li:nth-child(2) .pic{width:100%; display:inline-block;}
.promotion .h-promotion li:nth-child(1) h6,
.promotion .h-promotion li:nth-child(2) h6{width:100%; display:none;}
.promotion .h-promotion li:nth-child(1) span,
.promotion .h-promotion li:nth-child(2) span
{width:100%;}

.promotion ul{width:100%; margin:0; text-align:center; display:inline-block;}
.promotion ul li{width:25%; margin:15px 0; padding:0 15px; display:block; float:left;}
.promotion ul li:nth-child(1),
.promotion ul li:nth-child(2){width:100%; margin:15px 0; padding:0 15px; display:block; float:left;}
.promotion ul li:nth-child(1){ margin-top:30px;}
.promotion ul li:nth-child(1) .pic{width:50%; padding:0 15px; float:left;}
.promotion ul li:nth-child(2) .pic{width:50%; padding:0 15px; float:right;}
.promotion ul li:nth-child(1) span{width:50%; padding:0 15px; float:left;}
.promotion ul li:nth-child(2) span{width:50%; padding:0 15px; float:left;}
.promotion ul li:nth-child(1) h6,
.promotion ul li:nth-child(2) h6{display:block;}

.promotion .more{width:auto; height:50px; padding:12px 45px 12px 50px; margin:44px 0 0 0; text-align:center;
border:1px #CCC solid; display:inline-block; background:#FFF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.promotion .more p{width:auto; margin:0; padding:0 28px 0 0; line-height:26px; color:#525252; font-size:18px; position:relative; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.promotion .more p i{width:auto; line-height:26px; color:#00AEEF; font-size:15px; font-style:normal; position:absolute; right:0; top:0;}
.promotion .more:hover{border:1px #00AEEF solid;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.promotion .more:hover p{color:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}

.promotion .detail{width:100%; display:inline-block;}
.promotion .detail h5{width:100%; margin:20px 0 60px 0!important; color:#545454; text-align:center; display:inline-block;}
.promotion .detail .text{width:100%; padding:0; line-height:22px; text-align:left; display:inline-block;
font-weight:300 !important; font-family:'Kanit', sans-serif;}
.promotion .detail .text img{max-width:100%;}
.promotion .detail .text p{margin:25px 0; padding:0; }
.promotion .detail em{width:100%; margin:15px 0; line-height:26px; color:#999; font-size:15px; text-align:left; font-style:normal;
font-weight:300 !important; font-family:'Kanit', sans-serif; display:inline-block;}
.promotion .detail .bottom{width:100%; margin:70px 0 0 0; padding-top:35px; text-align:left; border-top:1px #CCC solid; display:inline-block;}
.promotion .detail .share{width:auto; padding:5px; background:#F2F2F2; display:inline-block; vertical-align:top;}
.promotion .detail .share label{width:auto; line-height:40px; padding:0 16px; margin:0; color:#525252; font-size:18px; display:inline-block; white-space:nowrap;}
.promotion .detail .share .btu{width:auto; height:40px; overflow:hidden; display:inline-block; white-space:nowrap; vertical-align:top;}
.promotion .detail .share .btu a{margin:4px 0 0 0; }
.promotion .detail .back{width:160px; height:50px; padding:12px 0 12px 0; margin:0 25px 0 0; text-align:center;
border:1px #CCC solid; display:inline-block; background:#FFF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.promotion .detail .back p{width:auto; margin:0; padding:0 0 0 33px; line-height:26px; color:#525252; font-size:18px; position:relative; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.promotion .detail .back p i{width:auto; line-height:26px; color:#00AEEF; font-size:14px; font-style:normal; position:absolute; left:0; top:0;}
.promotion .detail .back:hover{border:1px #00AEEF solid;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.promotion .detail .back:hover p{color:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}

/* .c-youtube{width:100%; margin:32px 0; display:inline-block;}
.c-youtube ul{width:100%; margin:44px 0 0 0; padding:0 10px; background:#333; display:inline-block;}
.c-youtube ul li{width:16.66666667%; margin:20px 0; padding:0 10px; display:block; float:right;}
.c-youtube ul li .clip{width:100%; display:none;}
.c-youtube ul li .clip iframe{width:100%; height:430px; }
.c-youtube ul li .pic{width:100%; border-bottom:2px #333 solid; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.c-youtube ul li .pic img{width:100%;}
.c-youtube ul li .pic span{width:100%; height:44px; margin:7px 0; overflow:hidden; display:inline-block;}
.c-youtube ul li .pic span p{width:100%; height:44px; line-height:21px; padding:0; color:#878787; font-size:18px; vertical-align:middle; display: table-cell;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.c-youtube ul li .pic:hover{border-bottom:2px #00AEEF solid;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.c-youtube ul li .pic:hover span p{color:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.c-youtube ul li .other{width:100%; display:none;}
.c-youtube ul li .other h6{width:100%; line-height:30px; padding:0 0 23px 0 !important; margin-bottom:20%; color:#FFF; font-size:25px;
display:inline-block; position:relative;}
.c-youtube ul li .other h6::after{content:""; width:44px; height:1px; background:#00AEEF; display:block; position:absolute; bottom:0; left:0;}
.c-youtube ul li .other .btu{width:auto; height:26px; line-height:26px; padding:0 26px 0 0; color:#FFF; font-size:18px;
display:inline-block; position:relative;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.c-youtube ul li .other .btu:hover{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}
.c-youtube ul li .other .btu i{width:auto; height:26px; line-height:26px; color:#00AEEF; font-size:14px; font-style:normal;
display:block; position:absolute; right:0; top:0; }
.c-youtube ul li:first-child{width:101.5%; margin:0 -10px; padding:0; display:inline-block; float:none;}
.c-youtube ul li:first-child .pic{display:none;}
.c-youtube ul li:first-child .clip{display:inline-block;}
.c-youtube ul li:last-child .other{display:inline-block;}
.c-youtube ul li:last-child .pic{display:none;} */

.c-youtube{width:100%; margin:32px 0; display:inline-block;}
.c-youtube .headline{display:block;}
.c-youtube .main-clip{width:100%; margin:0; display:block;}
.c-youtube .main-clip iframe{width:100%; height:450px; display:block;}
.c-youtube .list{width:100%; background:#333; display:inline-block;}
.c-youtube ul{width:83.333333%; margin:0; padding:0 10px; background:#333; display:block; float:left;}
.c-youtube ul li{width:20%; margin:20px 0; padding:0 10px; display:block; float:left;}
.c-youtube ul li .clip{width:100%; display:none;}
.c-youtube ul li .clip iframe{width:100%; height:730px; }
.c-youtube ul li .pic{width:100%; border-bottom:2px #333 solid; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.c-youtube ul li .pic img{width:100%;}
.c-youtube ul li .pic span{width:100%; height:44px; margin:7px 0; overflow:hidden; display:inline-block;}
.c-youtube ul li .pic span p{width:100%; height:44px; line-height:21px; padding:0; color:#878787; font-size:18px; vertical-align:middle; display: table-cell;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.c-youtube ul li .pic:hover{border-bottom:2px #00AEEF solid;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.c-youtube ul li .pic:hover span p{color:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.c-youtube .other{width:16.666667%; margin:20px 0; padding:0 10px 0 20px; display:block; float:left;}
.c-youtube .other h6{width:100%; line-height:30px; padding:0 0 23px 0 !important; margin-bottom:20%; color:#FFF; font-size:25px;
display:inline-block; position:relative;}
.c-youtube .other h6::after{content:""; width:44px; height:1px; background:#00AEEF; display:block; position:absolute; bottom:0; left:0;}
.c-youtube .other .btu{width:auto; height:26px; line-height:26px; padding:0 26px 0 0; color:#FFF; font-size:18px;
display:inline-block; position:relative;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.c-youtube .other .btu:hover{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}
.c-youtube .other .btu i{width:auto; height:26px; line-height:26px; color:#00AEEF; font-size:14px; font-style:normal;
display:block; position:absolute; right:0; top:0; }

.tech{width:100%; margin:32px 0; padding:0; display:inline-block;}
.tech .container{width:100%; margin:0; padding:0; display:inline-block;}
.tech .container [data-accordion]{width:100%; margin:15px 0;}
.tech .container [data-accordion] [data-control]{width:100%;border:1px #DDD solid; display:inline-block;}
.tech .container [data-accordion] [data-control] h3{width:100%; line-height:44px; padding:27px 94px !important; color:#525252;
text-align:center; position:relative; display:inline-block; cursor:pointer;}
.tech .container [data-accordion] [data-control] h3 i{width:94px; line-height:50px; color:#00AEEF; font-size:20px; text-align:center;
position:absolute; right:0; top:24px; }
.tech .container [data-accordion] [data-control] h3 .fa-plus-circle{display:block;}
.tech .container [data-accordion] [data-control] h3 .fa-minus-circle{display:none;}
.tech .container [data-accordion].open [data-control] .fa-plus-circle{display:none;}
.tech .container [data-accordion].open [data-control] .fa-minus-circle{display:block;}
.tech .container [data-accordion] [data-content]{width:100%; margin:0; text-align:center; display:inline-block;}
.tech .container [data-accordion]:first-child.open [data-content]{border-bottom:1px #DDD solid; }
.tech .container [data-accordion]:first-child [data-content]{border-bottom:0; }
.tech .container [data-accordion] [data-content] .content{width:100%; margin:0; padding:6px 0 60px 0; border:1px #DDD solid; border-top:0; display:inline-block;}
.tech .container [data-accordion] [data-content] .text{width:100%; margin:45px 0; display:inline-block;}
.tech .container [data-accordion] [data-content] .half{width:50%; margin:0; padding:0 10px; display:inline-block; float:left;}
.tech .container [data-accordion] [data-content] .half img{max-width:100%;}
.tech .container [data-accordion] [data-content] h4{width:100%; margin-bottom:25px !important; color:#525252; display:inline-block;
font-weight:100 !important; font-family:'Kanit', sans-serif;
}
.tech .container [data-accordion] [data-content] h5{width:100%; margin-bottom:25px !important; color:#525252; display:inline-block;
font-weight:100 !important; font-family:'Kanit', sans-serif;
}
.tech .container [data-accordion] [data-content] p{width:100%; line-height:26px; color:#525252; font-size:20px; display:inline-block;
font-weight:300 !important; font-family:'Kanit', sans-serif;
}
.tech .container [data-accordion] [data-content] img{max-width:100%;}

.location{width:100%; margin:60px 0 30px 0; display:inline-block;}
.location .container{width:100%; margin:0; padding:0; border:1px #CCC solid; display:inline-block;}
.location .filter{width:100%; height:98px; margin:0; padding:24px 0; border-bottom:1px #CCC solid; display:block;}
.location .filter label{width:28%; line-height:50px; margin:0; padding:0 34px; color:#858585; font-size:18px; display:block; float:left;}
.location .filter .area{width:24%; margin:0 24px 0 0; color:#858585; font-size:18px; display:block; float:left;}
.location .filter .area .custom-select-sm{height:50px; padding-top:5px; padding-bottom:5px;}
.location .filter .area .custom-select{line-height:40px; padding-right:40px; border:1px #CCC solid; border-radius:0; color:#858585; font-size:18px;
background:url(../images/icon-arrow-down.jpg) no-repeat top 16px right 13px; }
.location .filter .search{width:140px; margin:0 15px 0 0; position:relative; display:block; float:left;}
.location .filter .search input[type="submit"]
{width:100%; height:50px; line-height:24px; padding:12px 25px 12px 0; color:#FFF; font-size:18px; text-align:center; cursor:pointer;
border:1px #00AEEF solid; display:block; background:#00AEEF; float:left;}
.location .filter .search i{width:auto; line-height:24px; color:#FFF; font-size:14px; font-style:normal;
position:absolute; right:27%; top:14px;}
.location .content{width:100%; margin:0; padding:0; display:block;}
.location .content .list{width:28%; height:730px; overflow-y:scroll; display:block; float:left;}
.location .content .list span{width:100%; padding:16px 34px; border-bottom:1px #CCC solid; display:inline-block;}
.location .content .list span h6{width:100%; line-height:34px; margin:0 0 8px 0 !important; color:#555; font-size:25px; display:inline-block;}
.location .content .list span p{width:100%; line-height:23px; margin:0 0 9px 0; color:#858585; font-size:18px; display:inline-block;}
.location .content .list span .tel{width:auto; line-height:25px; color:#858585; font-size:18px;
display:block; float:left;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.location .content .list span .tel:hover{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.location .content .list span .more{width:auto; padding:0 27px 0 0; line-height:25px; color:#525252; font-size:18px;
 position:relative; display:block; float:right;
 transition: all 0.3s ease 0s;
 -webkit-transition: all 0.3s ease 0s;
}
.location .content .list span .more:hover{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.location .content .list span .more i{width:auto; line-height:25px; color:#00AEEF; font-size:15px;
text-align:left; position:absolute; top:0; right:0px; display:block;}
.location .content iframe{width:72%; height:770px; border:0; display:block; float:left;}

.location .topic{width:100%; height:auto; margin:0; padding:13px 34px; border-bottom:1px #CCC solid; position:relative; display:block;}
.location .topic .navi{width:100%; line-height:23px; margin:0 0 9px 0; padding:0; display:block;}
.location .topic .navi i{width:auto; padding-right:16px; color:#858585; font-size:15px; font-style:normal; display:inline-block;}
.location .topic .navi i::after{content:">"; margin-left:10px; }
.location .topic .navi i:last-child::after{content:"";}
.location .topic h6{width:100%; line-height:40px; margin:0; color:#555; font-size:30px; display:inline-block;}
.location .results{width:28%; height:770px; position:relative; display:block; float:left;}
.location .results .pic{width:100%; display:block;}
.location .results .pic img{width:100%;}
.location .results span{width:100%; padding:28px 34px; display:block;}
.location .results span p{width:100%; line-height:23px; margin:0 0 12px 0; color:#858585; font-size:18px; display:inline-block;}
.location .results span .tel{width:auto; line-height:25px; margin-bottom:12px; color:#858585; font-size:18px;
display:block; float:left;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.location .results span .tel:hover{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.location .results iframe{width:72%; height:730px; border:0; display:block; float:left;}
.location .results .bottom{width:100%; padding:34px; position:absolute; bottom:0; display:inline-block;}
.location .results .bottom .back{width:100%; height:50px; padding:12px 0 12px 0; margin:0 0 12px 0; text-align:center;
border:1px #CCC solid; display:block; background:#FFF; float:left;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.location .results .bottom .back p{width:auto; margin:0; padding:0 0 0 30px; line-height:26px; color:#525252; font-size:18px; position:relative; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.location .results .bottom .back p i{width:auto; line-height:26px; color:#00AEEF; font-size:14px; font-style:normal; position:absolute; left:0; top:0;}
.location .results .bottom .back:hover{border:1px #00AEEF solid;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.location .results .bottom .back:hover p{color:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.location .results .bottom .print{width:100%; height:50px; padding:12px 0 12px 0; margin:0; text-align:center;
border:1px #CCC solid; display:block; background:#FFF; float:left;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.location .results .bottom .print p{width:auto; margin:0; padding:0 0 0 33px; line-height:26px; color:#525252; font-size:18px; position:relative; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.location .results .bottom .print p i{width:auto; line-height:26px; color:#00AEEF; font-size:16px; font-style:normal;
position:absolute; left:0; top:0;}
.location .results .bottom .print:hover{border:1px #00AEEF solid;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.location .results .bottom .print:hover p{color:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}

.search{width:100%; display:inline-block;}
.search .container{width:100%; margin:60px 0 30px 0; padding:0; display:inline-block;}
.search .container ul{width:100%; margin:0; padding:0; display:inline-block;}
.search .container ul li{width:100%; padding:25px 5px; display:block; border-bottom:1px #DDD solid; background:#FFF; float:left;}
.search .container ul li:first-child{border-top:1px #DDD solid;}
.search .container ul li .topic{width:100%; line-height:25px; color:#00AEEF; font-size:18px; text-decoration:underline; display:inline-block;}
.search .container ul li p{width:100%; line-height:24px; margin:25px 0; color:#858585; font-size:18px; display:inline-block;}
.search .container ul li .btu{width:auto; height:26px; line-height:26px; padding:0 26px 0 0; color:#535353; font-size:18px;
display:inline-block; position:relative;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.search .container ul li .btu:hover{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}
.search .container ul li .btu i{width:auto; height:26px; line-height:26px; color:#00AEEF; font-size:14px; font-style:normal;
display:block; position:absolute; right:0; top:0; }

.m-member{width:100%; display:inline-block;}
.m-member .container{width:100%; margin:60px 0 30px 0; padding:0; display:inline-block;}
.m-member .content{width:100%; padding:30px; display:block;}
.m-member .login{width:50%; padding-right:15px; display:block; float:left;}
.m-member .login .content{background:#E2EDF3;}
.m-member .f-regis{width:50%; padding-left:15px; display:block; float:left;}
.m-member .f-regis .content{background:#FFF; border:1px #CCC solid;}
.m-member .content span{width:100%; margin:15px 0; display:inline-block}
.m-member .content span:last-child{margin-bottom:0; }
.m-member .content h5{width:100%; line-height:40px; padding-left:50px !important; color:#858585; display:block; position:relative;}
.m-member .content h5 i{width:auto; padding:0 5px; line-height:40px; color:#888; font-size:22px; display:block; position:absolute; left:0; top:0;}
.m-member .content h6{width:100%; line-height:34px; margin:10px 0 !important; color:#545454; font-size:25px; display:block;}
.m-member .content p{width:100%; line-height:24px; margin:10px 0 0 0; color:#858585; font-size:18px; display:inline-block;}
.m-member .content input[type="submit"], .m-member .content input[type="button"]
{line-height:26px; padding:12px 0; margin:15px 0; color:#FFF; font-size:18px; text-align:center; border:0; cursor:pointer; display:block; float:left;}
.m-member .content input[type="text"],
.m-member .content input[type="email"],
.m-member .content input[type="password"]{width:100%; line-height:28px; margin:15px 0 !important; padding:6px 14px; margin:0; color:#858585; font-size:18px;
text-align:left; border:0; display:block; float:left; background:#FFF; }
.m-member .content input::-moz-placeholder{color:#858585; opacity:1}
.m-member .content input:-ms-input-placeholder{color:#858585;}
.m-member .content input::-webkit-input-placeholder{color:#858585;}
.m-member .content .gg-captcha{width:auto; margin:15px 0; text-align:center; display:inline-block;}
.m-member .content .btu-fb{width:100%; padding-left:58px !important; padding-right:58px !important; background:#4267B2 url(../images/icon-fb-login.png) no-repeat left top !important;}
.m-member .content .btu-login{width:58%; margin:12px 0 0 0 !important; background:#00AEEF;}
.m-member .content .btu-regis{width:100%; margin:0; background:#00AEEF;}
.m-member .content a.btu-regis{width:100%; line-height:26px; padding:12px 0; margin:0; color:#FFF; font-size:18px; text-align:center;
display:inline-block; background:#00AEEF;}
.m-member .content a.btu-regis:hover{color:#FFF; }
.m-member .content .forgot{width:auto; line-height:26px; margin:12px 0 0 0; padding:12px 0 12px 32px; color:#858585; font-size:18px;
position:relative; display:block; float:right;}
.m-member .content .forgot:hover{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}
.m-member .content .forgot i{width:auto; line-height:26px; color:#858585; font-size:16px; position:absolute; left:0; top:12px; }
.m-member .content .forgot:hover i{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}

.register{width:100%; display:inline-block;}
.register .frame{width:75%; margin:0 0 0 5.5%; display:block; float:left;}
.register .frame .gg-captcha{width:auto; margin:30px 0 0 0; text-align:center; display:inline-block;}
.register .container{width:100%; margin:60px 0 30px 0; padding:0; display:inline-block;}
.register .frame .container{margin:35px 0 30px 0;}
.register .frame .product{margin:0; }
.register .container input[type="submit"],
.register .container input[type="button"]
{width:300px; height:50px; line-height:26px; padding:12px 0; margin:40px auto 0 auto; color:#FFF; font-size:18px; text-align:center; border:0;
 background:#00AEEF; display:block; cursor:pointer;}
 .register .container input[type="submit"]:disabled,
 .register .container input[type="button"]:disabled{background:#CCC; cursor:auto;}
.register .content{width:100%; margin:25px 0; padding:35px 8%; background:#E2EDF3; display:block;}
.register .content:first-child{margin-top:25px;}
.register .content fieldset{width:100%; padding:14px 0; display:inline-block;}
.register .content fieldset i{width:auto; line-height:30px; color:#858585; font-size:15px; font-style:normal;
display:block; position:absolute; left:24%; bottom:-18px; }
.register .content fieldset label{width:24%; height:50px; line-height:26px; padding:12px 0 12px 16px; margin:0; color:#858585; font-size:18px;
text-align:left; border-left:1px #E2EDF3 solid; border-right:1px #E2EDF3 solid; background:#FFF; display:block; float:left;}
.register .content fieldset label:first-child{border-left:0;}
.register .content fieldset label.address{height:102px;}
.register .content fieldset input[type="submit"],
.register .content fieldset input[type="button"]
{width:30%; height:50px; line-height:26px; padding:12px 0; margin:0; color:#FFF; font-size:18px; text-align:center; border:0;
 background:#00AEEF; display:block; float:left;}
.register .content fieldset input[type="text"],.register .content fieldset input[type="number"],
.register .content fieldset input[type="email"],
.register .content fieldset input[type="password"]{line-height:26px; margin:0; padding:12px 16px; color:#858585; font-size:18px;
 text-align:left; border:0; display:block; float:left; background:#FFF; }
.register .content textarea{width:76%; height:102px; line-height:26px; padding:12px 16px; margin:0; color:#858585; font-size:18px;
 text-align:left; border:0; resize:none; display:inline-block;}
.register .content input::-moz-placeholder{color:#858585; opacity:1}
.register .content input:-ms-input-placeholder{color:#858585;}
.register .content input::-webkit-input-placeholder{color:#858585;}

.register .content .gender{width:31%; padding-left:15px; background:#FFF; display:block; float:left;}
.register .content .gender label{width:50%; border:0; display:block; float:left;}
.register .content .gender label span{padding-left:10px; }

.register .content fieldset .form-group{width:76%; height:50px; margin:0; border:0; background:transparent; float:left; vertical-align:top;}
.register .content fieldset .input-group{width:100%; height:50px; text-align:left; display:inline-block !important; position:relative; top:-27px;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}
@media screen and (-webkit-min-device-pixel-ratio:0) {
  .register .content fieldset .input-group{width:100%; height:50px; text-align:left; display:inline-block !important; position:relative; top:-30px;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;}
}
@-moz-document url-prefix() {
  .register .content fieldset input[type="text"],
  .register .content fieldset input[type="email"],
  .register .content fieldset input[type="password"]
  {padding:11.5px 16px 11.5px 16px;}
  .register .content fieldset .input-group{top:-28px; }
}
.register .content fieldset input[type="text"]#timepicker2{padding:12px 16px; }
.register .content fieldset .input-group.bot{top:0; }
.register .content fieldset .form-control{width:82%; }
.register .content fieldset .btn-choose{width:100%; line-height:50px; padding:0; color:#858585 !important; font-size:18px; text-align:center;
border:0;  background:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.register .content fieldset .input-group-btn{width:36%; float:left; color:#FFF; position:relative;}
.register .content fieldset .form-group .btn{line-height:50px; padding:0; border-radius:0; background:#00AEEF; color:#FFF !important; }
.register .content fieldset .input-group:hover .btn-choose{background:#00AEEF; color:#FFF !important;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.register .content fieldset .input-group:focus .btn-choose{background:#00AEEF; color:#FFF; }
.register .content fieldset .btn-choose:focus{background:#00AEEF; color:#FFF; }
.register .content fieldset .browse{width:64% !important; line-height:26px; margin:0 !important; padding:12px 0; color:#FFF; font-size:18px; }

.register .content fieldset .w1{width:76%;}
.register .content fieldset .w2{width:66%;}
.register .content fieldset .w3{width:46%;}
.register .content fieldset .w4{width:30%;}
.register .content fieldset .w5{width:25%;}
.register .content fieldset .w6{width:15%;}
.register .content h6{width:100%; line-height:34px; color:#555; font-size:25px; text-align:center; display:block;}
.register .content h5{width:100%; line-height:40px; margin-bottom:25px !important; color:#525252; text-align:center; display:block;}
.register .content figure{width:100%; margin:25px 0; padding:22px 19px; background:#FFF; display:block;}
.register .content figure.condition{ margin:25px 0 56px 0;}
.register .content figure p{width:100%; height:206px; margin:0; padding:0; color:#858585; font-size:18px; overflow-y:scroll; display:block;}
.register .content .bottom{width:100%; height:auto; margin:0; padding:0; display:inline-block;}
.register .content .bottom p{width:auto; line-height:26px; margin:0; padding:0; color:#858585; font-size:18px; display:block; float:left;}


.glyphicon{
  position: relative;
  top: 1px;
  display: inline-block;
  font-family: 'Font Awesome 5 Free' !important;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.glyphicon-chevron-down::before {
    content: "\f107" !important;
}
.glyphicon-chevron-up::before {
    content: "\f106" !important;
}

.accept {
  width:auto !important;
  display:block;
  position: relative;
  padding-left: 34px !important;
  padding-right:0;
  margin:0;
  cursor: pointer;
  line-height:26px;
  font-size:18px;
  color:#858585;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  float:right;
 }
 .accept input {
   position: absolute;
   opacity: 0;
   cursor: pointer;
   height: 0;
   width: 0;
 }
 .checkmark {
   position: absolute;
   top: 5px;
   left: 0;
   height: 16px;
   width: 16px;
   background-color: #FFF;
   border:1px #CCC solid;
 }
 .accept:hover input ~ .checkmark {
   border:1px #AAA solid;
 }
 .accept input:checked ~ .checkmark {
   background-color: #FFF;
 }
 .checkmark:after {
   content: "";
   position: absolute;
   display: none;
 }
 .accept input:checked ~ .checkmark:after {
   display: block;
 }
 .accept .checkmark:after {
   left: 4px;
   top: 1px;
   width: 6px;
   height: 10px;
   border: solid #AAA;
   border-width: 0 2px 2px 0;
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
 }

.register .content .icon-calendar{background:#FFF url(../images/icon-calendar.jpg) no-repeat top 16px right 10px !important;}
.register .content .icon-time{background:#FFF url(../images/icon-time.jpg) no-repeat top 16px right 10px !important;}

#stickyheader{ position:fixed; top:370px; left:0; display:none;}
span.slide-toggle{width:50px; height:50px; border-radius:50%; background:#00AEEF; display:block; position:relative; cursor:pointer;}
span.slide-toggle i{width:50px; line-height:50px; text-align:center; color:#FFF; font-size:25px; position:absolute; left:0; top:0; }
.nav-member{width:19.5%; display:block; margin:60px 0 0 0; padding:0; background:#FFF; float:left;}
.nav-member .pic{width:100%; height:auto; margin:0 0 35px 0; border-radius:50%; overflow:hidden; background:#00AEEF; display:block;}
.nav-member .pic img{width:100%; object-fit: contain;}
.nav-member p{width:100%; line-height:26px; margin:10px 0 0 0; color:#858585; font-size:18px; text-align:center; display:none;}
.nav-member nav{width:100%; margin:0; padding:0; display:block;}
.nav-member nav a{width:100%; line-height:24px; padding:16px 5px; margin:0;
color:#858585 !important; font-size:18px;
border-bottom:1px #DDD solid;
display:inline-block;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.nav-member nav a:first-child{border-top:1px #DDD solid;}
.nav-member nav a.active, .nav-member nav a:hover{color:#00ADEE !important;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}

.your-order{width:100%; margin:60px 0 30px 0; display:block;}
.your-order table{width:100%; font-weight:300 !important; font-family:'Kanit', sans-serif;}
.your-order table tr td{line-height:26px; padding:17px 0 17px 20px; color:#858585; font-size:18px; border-bottom:1px #DDD solid; vertical-align:top; }
.your-order table tr:first-child{background:#E2EDF3;}
.your-order table tr:first-child td{border-bottom:0; }
.your-order .more{width:auto; height:26px; line-height:26px; padding:0 26px 0 0; color:#535353; font-size:18px;
display:inline-block; position:relative;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.your-order .more:hover{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}
.your-order .more i{width:auto; height:26px; line-height:26px; color:#00AEEF; font-size:14px; font-style:normal;
display:block; position:absolute; right:0; top:0; }

.your-order2{width:100%; margin:60px 0 30px 0; display:block;}
.your-order2 table{width:100%; margin-bottom:50px; font-weight:300 !important; font-family:'Kanit', sans-serif;}
.your-order2 table tr td{line-height:26px; padding:17px 0 17px 20px; color:#858585; font-size:18px; vertical-align:top;}
.your-order2 table tr:first-child{background:#E2EDF3;}
.your-order2 table tr.total td{border-bottom:1px #DDD solid; border-top:1px #DDD solid;}
.your-order2 table tr:last-child td{border-bottom:1px #DDD solid;}
.your-order2 table tr td:nth-child(1){width:46%;}
.your-order2 table tr td:nth-child(2){width:14%;}
.your-order2 table tr td:nth-child(3){width:20%;}
.your-order2 table tr td:nth-child(4){width:20%;}
.your-order2 .back{width:250px; height:50px; padding:11px 35px 13px 30px; margin:0; text-align:center;
border:1px #CCC solid; display:inline-block; background:#FFF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.your-order2 .back p{width:auto; margin:0; padding:0 0 0 33px; line-height:26px; color:#525252; font-size:18px; position:relative; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.your-order2 .back p i{width:auto; line-height:26px; color:#00AEEF; font-size:14px; font-style:normal; position:absolute; left:0; top:0;}
.your-order2 .back:hover{border:1px #00AEEF solid;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.your-order2 .back:hover p{color:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.your-order2 .btu-order{width:250px !important;}

.wishlist {width:100%; margin:22px 0 0 0; display:block;}
.wishlist ul{width:100%; margin:0; display:inline-block;}
.wishlist ul li{width:33.333333%; padding:15px;  display:block; float:left;}
.wishlist .content{width:100%; padding:0; border:1px #DDD solid; background:#FFF; position:relative; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.wishlist .content:hover{
  -webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.1);
  -moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.1);
  box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.1);
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.wishlist .content .pic{width:100%; display:inline-block; position:relative;}
.wishlist .content .pic img{width:100%; background:#E2EDF3; opacity:1;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.wishlist .content .pic .cart{width:190px; height:50px; padding:12px 0 12px 0; text-align:center;
border:1px #00AEEF solid; display:block; position:absolute; left:50%; top:50%; margin:-25px 0 0 -95px; background:#FFF;
visibility:hidden; opacity:0; z-index:99;
}
.wishlist .content .pic .cart p{width:auto; padding:0 33px 0 0; line-height:24px; color:#525252; font-size:18px; position:relative; display:inline-block;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.wishlist .content .pic .cart:hover p{color:#00AEEF;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.wishlist .content .pic .cart p i{width:auto; line-height:24px; color:#00AEEF; font-size:20px; font-style:normal; position:absolute; right:0; top:0;}
.wishlist .content .topic{width:100%; border-bottom:1px #DDD solid; display:inline-block;}
.wishlist .content .topic h6{width:100%; height:99px; line-height:25px; padding:12px 20px; color:#535353; font-size:20px; text-align:left; vertical-align:middle; display: table-cell;}
.wishlist .content span{width:100%; padding:20px; border-bottom:2px #FFF solid; display:inline-block; position:relative;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.wishlist .content span p{width:100%; height:69px; line-height:23px; overflow:hidden; margin:0 0 17px 0; color:#878787; font-size:18px; display:inline-block;}
.wishlist .content span .price{width:100%; line-height:23px; margin:0 0 17px 0; color:#878787; font-size:18px; display:inline-block;}
.wishlist .content span .price .cutoff{text-decoration:line-through; margin-right:15px; color:#878787; display:inline-block;}
.wishlist .content span .price .discount{color:#D80000; display:inline-block;}
.wishlist .content span .btu{width:auto; height:26px; line-height:26px; padding:0 26px 0 0; color:#535353; font-size:18px;
display:inline-block; position:relative;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
.wishlist .content span .btu:hover{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;}
.wishlist .content span .btu i{width:auto; height:26px; line-height:26px; color:#00AEEF; font-size:14px; font-style:normal;
display:block; position:absolute; right:0; top:0; }

.wishlist .content:hover .pic img{ opacity:0.3;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.wishlist .content:hover .pic .cart{ background:#FFF;
visibility:visible; opacity:1;
}
.wishlist .content:hover span{border-bottom:2px #00AEEF solid;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}

.f-payment{width:74%; margin:0 0 0 6.5%; text-align:center; display:block; float:left;}
.f-payment .gg-captcha{width:auto; margin:30px 0 0 0; text-align:center; display:inline-block;}
.f-payment .container{margin:35px 0 30px 0;}
.f-payment .product{margin:0;}
.f-payment .container input[type="submit"],
.f-payment .container input[type="button"]{margin-top:30px; }
.f-payment h6{margin-bottom:20px;}
.f-payment .l-bank{height:150px !important; }
.f-payment .bank{padding:0; background:#FFF; display:block; float:left;}
.f-payment .bank label{width:100% !important; border:0 !important; padding:0 0 0 15px !important; border:0;
position:relative; display:block; float:left; cursor:pointer;}
.f-payment .bank label img{ margin-right:15px; display:block; float:left;}
.f-payment .bank label span{width:auto; height:auto; padding-left:15px; display:block; float:left;}
.f-payment .bank label p{width:auto; height:auto; line-height:50px; padding:0; margin:0; display:block; float:left;}
.f-payment .bank label p.scb{line-height:25px; padding:0;}
.f-payment .bank label p.blue{line-height:25px;}
.f-payment .bank label p.name{padding-right:10px;}
.f-payment .bank label input[type="radio"], .f-payment .bank label input[type="checkbox"]
{margin:19px 0 0 0; display:block; float:left;}

.shopping{width:100%; margin:60px 0 30px 0; display:block;}
.shopping table{width:100%; margin-bottom:50px; font-weight:300 !important; font-family:'Kanit', sans-serif;}
.shopping table tr td{line-height:26px; padding:17px 0 17px 20px; color:#858585; font-size:18px; text-align:left; vertical-align:top;}
.shopping table tr td:nth-child(1){width:42%;}
.shopping table tr td:nth-child(2){width:16%;}
.shopping table tr td:nth-child(3){width:16%;}
.shopping table tr td:nth-child(4){width:16%;}
.shopping table tr td:nth-child(5){width:10%;}
.shopping table tr:first-child{background:#E2EDF3;}
.shopping table tr.total td{border-bottom:1px #DDD solid; border-top:1px #DDD solid;}
.shopping table tr:last-child td{border-bottom:1px #DDD solid;}
.btu-shop{width:250px; height:50px; line-height:50px; margin:0; color:#FFF; font-size:18px; background:#535353; text-align:center;
display:block; float:left;}
.btu-shop:hover{color:#FFF; }
.btu-order{width:250px !important; height:50px; line-height:50px; margin:0 !important; color:#FFF; font-size:18px; background:#00AEEF; text-align:center;
border:0; display:block; float:right; cursor:pointer;}
.btu-del{width:26px; height:26px; line-height:26px; margin:0; text-align:center; background:url(../images/btu-del.jpg) no-repeat;
border:0; display:block; cursor:pointer;}
.shopping .amount{ padding:0; border-bottom:0;}
.shopping .amount label{width:160px; padding:0 15px; line-height:40px; margin:0; display:inline-block;}
.shopping .amount .form-control{border:1px #DDD solid;}
.shopping .amount .input-group{width:120px;}
.shopping .amount .input-group > .input-group-prepend > .btn{line-height:40px; padding:0 7px; border-radius:0; border:1px #DDD solid; background:#949494; }
.shopping .amount .input-group > .input-group-prepend > .btn-outline-secondary{color:#FFF; }
.shopping .amount .input-group > .input-group-prepend > .btn-outline-secondary:hover{background:#949494;}
.shopping .amount .input-group > .input-group-append > .btn{line-height:40px; padding:0 7px; border-radius:0; border:1px #DDD solid; background:#00AEEF; }
.shopping .amount .input-group > .input-group-append > .btn-outline-secondary{color:#FFF; }
.shopping .amount .input-group > .input-group-append > .btn-outline-secondary:hover{background:#00AEEF;}

.time-line{width:68%; margin:70px 16% 30px 16%; display:block;}
.time-line span{width:100%; height:2px; margin:0; position:relative; display:block;}
.time-line span em{width:100%; height:2px; background:#CCC; display:block;}
.time-line span i{width:25%; height:2px; background:#00AEEF; display:block; position:absolute; left:0; z-index:40; }
.time-line span i.tl2{width:75%}
.time-line span i.tl3{width:100%}
.time-line span p{width:180px; line-height:26px; padding:33px 0 0 0; color:#858585; font-size:18px; text-align:center; display:block;
position:absolute; top:-7px; z-index:50; }
.time-line span p::before{content:""; width:16px; width:16px; height:16px; border-radius:50%; background:#CCC; display:block;
position:absolute; top:0; left:50%; margin-left:-8px; }
.time-line span p.active{color:#00AEEF;}
.time-line span p.active::before{ background:#00AEEF;}
.time-line span p.tl1{left:-90px;}
.time-line span p.tl2{left:50%; margin-left:-90px;}
.time-line span p.tl3{right:-90px;}

.m-checkout{width:100%; margin:0 0 30px 0; display:block;}
.m-checkout h5{margin:20px 0 70px 0 !important;}
.m-checkout .content{margin-bottom:50px; }
.m-checkout{width:100%; margin:0 auto; text-align:center; display:block; float:none;}
.m-checkout .country{display:block; float:left;}
.m-checkout .country .custom-select-sm{height:50px; padding-top:5px; padding-bottom:5px;}
.m-checkout .country .custom-select{line-height:40px; border:0; border-radius:0; color:#858585; font-size:18px;
background:#FFF url(../images/icon-arrow-down.jpg) no-repeat top 16px right 13px; }
.m-checkout .info{width:100%; display:block; float:left; background:#FFF; }
.m-checkout .info label{width:auto !important; margin-right:30px !important; border:0 !important; }
.m-checkout .pre{width:31%; display:block; float:left; background:#FFF; }
.m-checkout .pre label{width:50% !important; border:0 !important; }
.m-checkout .pre2{width:40%; display:block; float:left; background:#FFF; }
.m-checkout .pre2 label{width:33% !important; border:0 !important; }
.m-checkout .f-w1{width:76%; display:block; float:left; background:#FFF; }
.m-checkout .f-w1 label{border:0 !important; }
.m-checkout .c-w2{width:45%; border-left: 1px #E2EDF3 solid !important; display:block; float:left;}
.m-checkout .c-w3{width:36%; border-left: 1px #E2EDF3 solid !important; display:block; float:left;}
.m-checkout .tex-id{line-height:23px !important; vertical-align:middle;}

.m-checkout table{width:100%; margin-bottom:50px; font-weight:300 !important; font-family:'Kanit', sans-serif;}
.m-checkout table tr td{line-height:26px; padding:17px 0 17px 20px; color:#858585; font-size:18px; text-align:left;}
.m-checkout table tr:first-child{background:#E2EDF3;}
.m-checkout table tr.total td{border-bottom:1px #DDD solid; border-top:1px #DDD solid;}
.m-checkout table tr:last-child td{border-bottom:1px #DDD solid;}
.m-checkout table tr td:nth-child(1){width:50%;}
.m-checkout table tr td:nth-child(2){width:14%;}
.m-checkout table tr td:nth-child(3){width:18%;}
.m-checkout table tr td:nth-child(4){width:18%;}

.m-checkout .f-info{width:100%; margin:0 0 40px 0; padding:0 0 40px 0; border-bottom:1px #DDD solid; display:inline-block;}
.m-checkout .f-info li{width:50%; text-align:left; display:block; float:left;}
.m-checkout .f-info h6{width:100%; margin:12px 0; line-height:26px; color:#858585; font-size:18px; display:inline-block;}
.m-checkout .f-info span{width:100%; height:240px; padding:0; margin:12px 0; display:inline-block;}
.m-checkout .f-info p{width:100%; padding:0 40px 0 0; margin:0; line-height:26px; color:#858585; font-size:18px; display:inline-block;}
.m-checkout .f-info textarea{width:100%; height:240px; line-height:26px; padding:12px 16px; margin:0; color:#858585; font-size:18px;
 text-align:left; border:1px #DDD solid; resize:none; display:inline-block;}

.popup{width:546px; height:440px; background:#E2EDF3; display:none;}
.popup .container{width:100%; padding:0; margin:0; display:inline-block;}
.popup .container .content{width:100%; padding:30px; margin:0; display:inline-block;}
.popup .container span{width:100%; margin:15px 0; display:inline-block}
.popup .container span:last-child{margin-bottom:0; }
.popup .container h5{width:100%; line-height:40px; margin-bottom:15px !important; padding-left:50px !important; color:#858585; display:block; position:relative;}
.popup .container h5 i{width:auto; padding:0 5px; line-height:40px; color:#888; font-size:22px; display:block; position:absolute; left:0; top:0;}
.popup .container h6{width:100%; line-height:34px; margin:10px 0 !important; color:#545454; font-size:25px; display:block;}
.popup .container p{width:100%; line-height:24px; margin:10px 0 15px 0; color:#858585; font-size:18px; display:inline-block;}
.popup .container input[type="submit"], .popup .container input[type="button"]
{width:100%; line-height:26px; padding:12px 0; margin:15px 0; color:#FFF; font-size:18px; text-align:center; border:0; cursor:pointer; display:block; float:left;}
.popup .container input[type="text"],
.popup .container input[type="email"],
.popup .container input[type="password"]{width:100%; line-height:28px; margin:15px 0 !important; padding:6px 14px; margin:0; color:#858585; font-size:18px;
text-align:left; border:0; display:block; float:left; background:#FFF; }
.popup .container input::-moz-placeholder{color:#858585; opacity:1}
.popup .container input:-ms-input-placeholder{color:#858585;}
.popup .container input::-webkit-input-placeholder{color:#858585;}
.popup .container .gg-captcha{width:auto; margin:15px 0; text-align:center; display:inline-block;}
.popup .container .btu{width:280px; margin:0; position:relative; display:block;}
.popup .container .btu input[type="submit"]
{width:100%; height:50px; line-height:24px; margin:15px 0 0 0; padding:12px 25px 12px 0; color:#FFF; font-size:18px; text-align:center; cursor:pointer;
border:1px #00AEEF solid; display:block; background:#00AEEF; float:left;}
.popup .container .btu i{width:auto; line-height:24px; color:#FFF; font-size:14px; font-style:normal;
position:absolute; right:30%; top:28px;}
.fancybox-close{width:100px !important; height:30px !important; line-height:30px; padding:0 15px; line-height:30px; color:#FFF; font-size:15px;
  text-align:center; background:#00AEEF; display:inline-block;
  position: absolute;
  top:-30px !important;
  right:0 !important;
  cursor: pointer;
  z-index: 9999;
}
.fancybox-close::before{content:"Close"; font-size:15px; font-weight:200 !important; font-family:'Kanit', sans-serif;}
.fancybox-close:hover{color:#FFF; }


.contact{width:100%; margin:32px 0; text-align:center; display:inline-block;}
.contact .map{width:100%; height:400px; margin:30px 0; display:inline-block;}
.contact .map iframe{width:100%; height:100%;}
.contact .container{width:100%; padding:0; margin:30px 0; text-align:center; display:inline-block;}
.contact .left-side{width:29%; margin:0; padding-right:30px; display:block; float:left;}
.contact .left-side span{width:100%; margin:0; padding:22px 15% 22px 0; border-bottom:1px #DDD solid; text-align:left; display:inline-block;}
.contact .left-side span h6{width:100%; margin:0 0 20px 0 !important; padding:0; color:#545454; font-size:25px; display:inline-block;}
.contact .left-side span p{width:100%; line-height:25px; margin:0; padding:0; color:#858585; font-size:18px; display:inline-block;}
.contact .left-side span p.follow{margin-bottom:15px; color:#858585; font-size:15px;}
.contact .left-side span .social{width:auto; text-align:center; display:inline-block; vertical-align:top;}
.contact .left-side span .social a{width:50px; float:left; display:block;}
.contact .left-side span .qr-code{width:auto; margin:20px 0 10px 0; border:1px #CCC solid; display:block; float:left;}
.contact .left-side span .qr-code img{width:auto;}
.contact .left-side{width:29%; margin:0; padding-right:30px; display:inline-block;}
.contact .g-grid {
  display: grid;
  grid-template-columns: calc(20% - 0px * 4/5) calc(20% - 0px * 4/5) calc(20% - 0px * 4/5) calc(20% - 0px * 4/5) calc(20% - 0px * 4/5);
  grid-column-gap: 0;
  grid-row-gap: 0;
}
.contact form{width:71%; padding:42px 8%; background:#E2EDF3; text-align:center; display:block; float:left;}
.contact form h5{width:100%; line-height:40px; margin-bottom:24px !important; color:#545454; display:inline-block;}
.contact form fieldset{width:100%; padding:0; margin:15px 0; text-align:left; border:0; display:inline-block;}
.contact form label{width:30%; line-height:28px; padding:10px 24px; margin:0; color:#858585; font-size:18px;
text-align:left; border-right:1px #E2EDF3 solid; background:#FFF; display:inline-block; float:left;}
.contact form label.message{height:132px;}
.contact form input[type="text"],
.contact form input[type="email"],
.contact form input[type="password"]{width:70%; line-height:28px; padding:10px 24px; margin:0; color:#858585; font-size:18px;
text-align:left; border:0; display:inline-block; float:left;}
.contact form textarea{width:70%; height:132px; line-height:28px; padding:10px 24px; margin:0; color:#858585; font-size:18px;
text-align:left; border:0; resize:none; display:inline-block;}
/* .contact form input[type="submit"],
.contact form input[type="button"]{width:300px; line-height:60px; margin:15px auto; border:0; color:#FFF; font-size:18px; text-align:center; display:block;} */

.contact form .btu{width:300px; margin:15px 0; position:relative; display:inline-block;}
.contact form .btu input[type="submit"], .contact form .btu input[type="button"]
{width:100%; height:50px; line-height:24px; padding:12px 25px 12px 0; color:#FFF; font-size:18px; text-align:center; cursor:pointer;
border:1px #00AEEF solid; display:block; background:#00AEEF; float:left;}
.contact form .btu i{width:auto; line-height:24px; color:#FFF; font-size:14px; font-style:normal;
position:absolute; right:32%; top:14px;}

.contact form .gg-captcha{width:auto; margin:15px 0; text-align:center; display:inline-block;}

.contact form input::-moz-placeholder{color:#333; opacity:1}
.contact form input:-ms-input-placeholder{color:#333;}
.contact form input::-webkit-input-placeholder{color:#333;}
.contact form textarea::-webkit-input-placeholder {color:#333 !important; opacity:1}
.contact form textarea:-moz-placeholder {color:#333 !important; opacity:1}
.contact form textarea::-moz-placeholder {color:#333 !important; opacity:1}
.contact form textarea:-ms-input-placeholder {color:#333 !important; opacity:1}

.payment{width:100%; margin:0 0 30px 0; display:inline-block;}
.payment .container{width:100%; margin:60px 0 30px 0; padding:0; display:inline-block;}
.payment .container ul{width:100%; margin:0; padding:0; display:inline-block;}
.payment .container ul.b-margin{margin-bottom:25px;}
.payment .container ul li{width:100%; padding:0 0 0 26px; display:block; border-bottom:1px #DDD solid; background:#FFF; float:left;}
.payment .container ul li label{width:100%; margin:0; display:inline-block;}
.payment .container ul li p{width:100%; margin:0; padding:18px 0 18px 40px; color:#858585; font-size:18px; display:block; position:relative; float:left;}
.payment .container ul li p::before{content:attr(data-num); width:24px; height:24px; line-height:24px; color:#858585; font-size:17px;
text-align:center; border-radius:50%; background:#E2EDF3; position:absolute; top:18px; left:0; }
.payment .container ul li label p{width:auto; margin:0; display:block; float:left;}
.payment .container ul li label input{width:auto; margin:24px 20px 0 0; display:block; float:left;}
.payment .container ul li table{margin-left:35px;}
.payment .container ul li table td{padding:5px 22px;}
.payment .container ul li table tr td:first-child{padding:5px 0; }
.payment .container ul li:first-child{background:#E2EDF3;}
.payment .container ul li:first-child p{padding-left:0;}
.payment .container ul li:first-child p::before{display:none;}
.payment .container ul li:last-child{padding-bottom:5px; }

.term{width:100%; display:inline-block;}
.term .container{width:100%; margin:45px 0 30px 0; padding:0; display:inline-block;}
.term .container h5{width:100%; line-height:36px; margin:13px 0 !important; color:#858585; display:inline-block;}
.term .container p{width:100%; line-height:24px; margin:15px 0 30px 0 ; color:#858585; display:inline-block;}

footer{ width:100%; margin:32px 0 0 0; padding:0; display:inline-block !important;}
footer .top{width:100%; height:100px; margin:0; padding:0; background:#E2EDF3; display:block;}
footer .container{width:100%; max-width:100%; margin:0; padding:32px 0; text-align:center; background:#535353; display:inline-block;}
footer .logo{width:213px; display:inline-block; float:left;}
footer .logo img{width:100%;}
footer .social{width:200px; display:inline-block; float:right;}
footer .social a{width:50px; display:block; float:left;}
footer .social a img{width:100%;}
footer .social .qr-code{width:100%; margin-top:27px; display:block; float:left;}
footer .social .qr-code img{width:90%; margin:0 5%;}
footer .menu{width:53%; display:inline-block;}
footer .menu nav{width:100%; margin:18px 0 0 0; display:inline-block;}
footer .menu nav a{width:33.33333333%; height:49px; line-height:25px; margin:0; padding:12px 0; color:#ECECEC; font-size:18px; text-align:left;
border-bottom:1px #777 solid; display:block; float:left;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
footer .menu nav a.last{width:66.66666667%;}
footer .menu nav a:hover{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
footer .menu .copyright{width:100%; margin-top:5%; text-align:left; display:inline-block;}
footer .menu .copyright p{width:auto; line-height:18px; color:#FFF; font-size:15px; display:inline-block;}
footer .menu .copyright span{width:auto; padding:0 0 0 28px; color:#FFF; font-size:15px; display:inline-block;}
footer .menu .copyright span a{width:auto; padding:0 12px; color:#FFF; font-size:15px; position:relative; display:inline-block;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
footer .menu .copyright span a:hover{color:#00AEEF;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
}
footer .menu .copyright span a::after{content:""; width:1px; height:18px;
background:#777; display:block; position:absolute; right:0; top:2px; }
footer .menu .copyright span a:last-child::after{content:""; display:none;}

@-webkit-keyframes hvr-icon-bob {
  0% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  50% {
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
  }
  100% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
}
@keyframes hvr-icon-bob {
  0% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  50% {
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
  }
  100% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
}
@-webkit-keyframes hvr-icon-bob-float {
  100% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
}
@keyframes hvr-icon-bob-float {
  100% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
}

.hvr-icon-bob {
width:auto; line-height:34px; padding:0 0 0 33px; text-align:center; color:#FFF; font-size:14px; display:inline-block; position:relative;
}
.hvr-icon-bob:before {
content:"\f106"; line-height:22px; color:#FFF; font-size:22px; font-family:"FontAwesome", "Font Awesome 5 Free", "Font Awesome 5 Brands"; position:absolute; top:0px; left:0;
}
.hvr-icon-bob:hover:before, .hvr-icon-bob:focus:before, .hvr-icon-bob:active:before {
  -webkit-animation-name: hvr-icon-bob-float, hvr-icon-bob;
  animation-name: hvr-icon-bob-float, hvr-icon-bob;
  -webkit-animation-duration: .2s, 1s;
  animation-duration: .2s, 1s;
  -webkit-animation-delay: 0s, .3s;
  animation-delay: 0s, .3s;
  -webkit-animation-timing-function: ease-out, ease-in-out;
  animation-timing-function: ease-out, ease-in-out;
  -webkit-animation-iteration-count: 1, infinite;
  animation-iteration-count: 1, infinite;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-direction: normal, alternate;
  animation-direction: normal, alternate;
}

@-webkit-keyframes hvr-icon-right {
  0% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }
  50% {
    -webkit-transform: translateX(2px);
    transform: translateX(2px);
  }
  100% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }
}
@keyframes hvr-icon-right {
  0% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }
  50% {
    -webkit-transform: translateX(2px);
    transform: translateX(2px);
  }
  100% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }
}
@-webkit-keyframes hvr-icon-right-float {
  100% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }
}
@keyframes hvr-icon-right-float {
  100% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }
}


.hvr-icon-right {
  letter-spacing:-1px;
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  padding-right: 2.2em;
  -webkit-transition-duration: 0.1s;
  transition-duration: 0.1s;
  font-family: 'kanitregular';
}
.hvr-icon-right:before {
  content: "\f105";
  position: absolute;
  right: 0;
  padding: 0 1px;
  font-family: FontAwesome;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.hvr-icon-right:hover:before, .hvr-icon-right:focus:before, .hvr-icon-right:active:before {
  -webkit-animation-name: hvr-icon-right-float, hvr-icon-right;
  animation-name: hvr-icon-right-float, hvr-icon-right;
  -webkit-animation-duration: .2s, 1s;
  animation-duration: .2s, 1s;
  -webkit-animation-delay: 0s, .3s;
  animation-delay: 0s, .3s;
  -webkit-animation-timing-function: ease-out, ease-in-out;
  animation-timing-function: ease-out, ease-in-out;
  -webkit-animation-iteration-count: 1, infinite;
  animation-iteration-count: 1, infinite;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-direction: normal, alternate;
  animation-direction: normal, alternate;
}


/************************ MENU MOBILE ****************************/

/************************ MENU MOBILE ****************************/

#nav-icon1, #nav-icon2, #nav-icon3, #nav-icon4 {
  display: none;
  position: fixed;
  height: 50px;
  top: 42px;
  width: 50px;
  z-index: 999;
  -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:37px;
  top: 50px;
  right:30px;
  width: 50px;
  padding:5px;
  background:transparent;
}

#nav-icon2.mopen {
  height:37px;
  top: 7px;
  right:5px;
  width: 50px;
  padding:5px;
  background:transparent;
}

#nav-icon2 span {
  display: block;
  position: absolute;
  height: 5px;
  width: 20px;
  background:#00AEEF;
  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:5px;
  border-radius:0;
}

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

#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: 26px;
}
#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: 9px;
  top: 9px;
}

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

#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: 9px;
  top: 20px;
}

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

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

#nav-icon2.mclose span:nth-child(odd) {
  left:5px;
  border-radius:0;
}
html.mm-opening #nav-icon2{right:46.5%;}
.m-warp{z-index:600; background:#FFF; }
.menu-mobile{width:60%; padding:0; height:100%; text-align:center; border-top:49px #00AEEF solid; display:inline-block; background:#FFF; opacity:0;
position:fixed; 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(5%,0,0)scale(.97);
-moz-transform: translate3d(5%,0,0)scale(.97);
transform: translate3d(5%,0,0)scale(.97);
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:901;
-webkit-transform: translate3d(0,0,0)scale(1);
-webkit-animation: slideIn .35s ease-in-out;

-moz-transform: translate3d(0,0,0)scale(1);
-moz-animation: slideIn .35s ease-in-out;

transform: translate3d(0,0,0)scale(1);
animation: slideIn .35s ease-in-out;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
visibility: visible;
}
@-webkit-keyframes slideIn {
	0%       {opacity: .3;
				-webkit-transform: translate3d(5%,0,0)scale(.97);}
	100%  {opacity: 1;
				-webkit-transform: translate3d(0,0,0)scale(1);}
}
@-moz-keyframes slideIn {
	0%      {opacity: .3;
				-moz-transform: translate3d(5%,0,0)scale(.97);}
	100%  {opacity: 1;
				-moz-transform: translate3d(0,0,0)scale(1);}
}
@keyframes slideIn {
	0%      {opacity: .3;
				transform: translate3d(5%,0,0)scale(.97);}
	100%  {opacity: 1;
				transform: translate3d(0,0,0)scale(1);}
}

/*Nav Shrinking Closed Effect*/
.menu-mobile.mclose {
	opacity:0;
  z-index:400;
	-webkit-transform: translate3d(5%,0,0)scale(.97);
	-webkit-animation: slideOut .3s ease-in-out;

	-moz-transform: translate3d(5%,0,0)scale(.97);
	-moz-animation: slideOut .3s ease-in-out;

	transform: translate3d(5%,0,0)scale(.97);
	animation: slideOut .3s ease-in-out;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
  visibility: hidden;
}
@-webkit-keyframes slideOut {
	0%      {opacity: 1;
				-webkit-transform: translate3d(0,0,0)scale(1);}
	100%  {opacity: .3;
				-webkit-transform: translate3d(5%,0,0)scale(.97);}
}
@-moz-keyframes slideOut {
	0%      {opacity: 1;
				-moz-transform: translate3d(0,0,0)scale(1);}
	100%  {opacity: .3;
				-moz-transform: translate3d(5%,0,0)scale(.97);}
}
@keyframes slideOut {
	0%      {opacity: 1;
				transform: translate3d(0,0,0)scale(1);}
	100%  {opacity: .3;
				transform: translate3d(5%,0,0)scale(.97);}
}
.m-warp.mopen{-webkit-transform: translate3d(-460px,0,0);
-webkit-animation: open .2s ease-in-out;
-moz-transform: translate3d(-460px,0,0);
-moz-animation: open .5s ease-in-out;
transform: translate3d(-460px,0,0);
animation: open .5s ease-in-out;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
pointer-events:none;
}
.m-warp.mclose{opacity:1 !important;
-webkit-transform: translate3d(0,0,0);
-webkit-animation: close .3s ease-in-out;
-moz-transform: translate3d(0,0,0);
-moz-animation: close .3s ease-in-out;
transform: translate3d(0,0,0);
animation: close .3s ease-in-out;
transition: all 0.1s ease 0s;
-webkit-transition: all 0.1s ease 0s;
z-index:600;
pointer-events:all;
}
.m-warp.mclose:hover{opacity:1; }
.mobile.mopen{pointer-events:none; z-index:700;
  -webkit-transform: translate3d(-460px,0,0);
  -webkit-animation: open .2s ease-in-out;
  -moz-transform: translate3d(-460px,0,0);
  -moz-animation: open .5s ease-in-out;
  transform: translate3d(-460px,0,0);
  animation: open .5s ease-in-out;
  transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.mobile.mclose{pointer-events:all; z-index:800;
  -webkit-transform: translate3d(0,0,0);
  -webkit-animation: close .3s ease-in-out;
  -moz-transform: translate3d(0,0,0);
  -moz-animation: close .3s ease-in-out;
  transform: translate3d(0,0,0);
  animation: close .3s ease-in-out;
  transition: all 0.1s ease 0s;
  -webkit-transition: all 0.1s ease 0s;
}
.menu-mobile a{width:100%; line-height:30px; padding:12px 17px; border-bottom:1px #CCC solid; color:#525252; font-size:18px;
text-align:left; display:inline-block; position:relative;}
.menu-mobile a:hover, .menu-mobile a:focus, .menu-mobile a.active{ color:#FFF;
background:#00AEEF;
}
.menu-mobile [data-content] a{ padding: 10px 0 10px 36px; font-size:17px; color:#999;}
.menu-mobile [data-content] a:hover{color:#FFF; }
.menu-mobile [data-content] a i{left:60px;}
.menu-mobile .lang{width:auto; height:39px; display:inline-block; position:absolute; left:5px; top:-44px;}
.menu-mobile .lang a{width:auto; line-height:39px; padding:0 15px; color:#FFF; font-size:18px; border:0; background:#00AEEF; display:inline-block;}
.menu-mobile .lang a.active{color:#333; background:#FFF;}
.menu-mobile .social{width:100%; margin:20px 0 0 0; text-align:center; display:inline-block;}
.menu-mobile .social a{width:auto; padding:7px 20px 7px 7px; border:1px #CCC solid; border-radius:28px; text-align:center; display:inline-block;}
.menu-mobile .social a i{width:120px; line-height:40px; color:#BBB; font-size:17px; font-style:normal; display:inline-block;}
.menu-mobile .social a em{width:40px; padding:0; border:0; display:inline-block;}
.menu-mobile .social a em img{width:100%; display:inline-block;}
.menu-mobile .social a:hover{background:transparent}
.menu-mobile .social a:hover i{color:#333; }

.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;
}

/*************************************PRELOAD**************************************/

#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  /* change if the mask should have another color then white */
  z-index: 999999;
  /* makes sure it stays on top */
}

#status {
  width:101px;
  height:100px;
  position: absolute;
  left: 50%;
  /* centers the loading animation horizontally one the screen */
  top: 50%;
  /* centers the loading animation vertically one the screen */
  /*background-image: url(https://raw.githubusercontent.com/niklausgerber/PreLoadMe/master/img/status.gif);*/
  /* path to your loading animation */
  background:url(../images/loading.png) no-repeat;
  background-repeat: no-repeat;
  background-position: center;
  margin: -50px 0 0 -50px;
/* is width and height divided by two */
}
.ball {
	background-color: rgba(0,0,0,0);

	opacity:.9;
	border-top:5px solid rgba(0,0,0,0);
	border-left:5px solid rgba(0,0,0,0);
	border-radius:206px;
	/*box-shadow: 0 0 35px #2187e7;*/
  width:151px;
  height:44px;
	margin:0 auto;
	-moz-animation:spin 3s infinite linear;
	-webkit-animation:spin 3s infinite linear;
}

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

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