@media only screen and (min-width: 481px) and (max-width: 768px) {
	#wrapper {
		position: relative;
		width: 100%;
		height: auto;
		display: table;
	}
	@keyframes arrow-btn-hover {
		 0% {right: 17px;}
		 50%  {right: 12px;}
		 100% {right: 17px;}
	}
	@keyframes arrow-btn-hover-bor {
		 0% {right: 15px;}
		 50%  {right: 10px;}
		 100% {right: 15px;}
	}
	@keyframes search-btn-hover {
		 0% {transform: scale(1);}
		 50%  {transform: scale(1.1);}
		 100%  {transform: scale(1);}
	}
/*---------------------------------------------------------------------------------------------------------*/
/*-TOPBAR-----------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.topbar {
	height: auto;
    width: 100%;
    display: block;
    overflow: hidden;
    z-index: 100;
    background-color: #333333;
}
	.topbar .topbar-set {
		width: auto;
		
		margin: 8px auto;
		height: auto;
		display: flex;
		align-items: center;
		padding:  0 25px;
	}
	.topbar .topbar-set .left{
		width: 85%;
		height: auto;
		display:flex;
	}
	.topbar .topbar-set .right{
		width: 15%;
		height: auto;
		display: block;
		display:flex;
		justify-content:  flex-end;
	}
	.topbar .icon-link-btn {
		width: auto;
		height: auto;
		display:inline-flex; 
		align-items: center;
    	font-size: 0.55rem;
		color:#FFF;
		margin:  0 15px 0 0;
		border-right: 2px solid #999;
		padding: 0 15px 0 0;
		-webkit-transition: all 0.3s ease-in;
		-moz-transition: all 0.3s ease-in;
		-o-transition: all 0.3s ease-in;
		transition: all 0.3s ease-in;
	}
		.topbar .icon-link-btn span {
			width: 18px;
			height: 18px;
			border-radius: 50%;
			background-color: #FFF;
			padding:  0;
			display: flex;
			align-items: center;
			justify-content: center;
			text-align: center;
			margin-right: 5px;
			-webkit-transition: all 0.3s ease-in;
			-moz-transition: all 0.3s ease-in;
			-o-transition: all 0.3s ease-in;
			transition: all 0.3s ease-in;
		}
			.topbar .icon-link-btn span svg {
				width:auto;
				height: 10px;
				display: inline-block;
			}		
				.topbar .icon-link-btn span svg path{
					fill:#333;
				}	
	.topbar .icon-link-btn:last-of-type {
		border-right: none;
		margin:  0;
		padding: 0;
		
	}
	.topbar .icon-link-btn:hover {
		color: #6ED182;
	}
		.topbar .icon-link-btn:hover span {
			background-color: #6ED182;
		}
/*---------------------------------------------------------------*/
/*-MENU----------------------------------------------------------*/
/*----------------------------------------------------------------------------*/
.menu {
	height: auto;
	width: 100%;
	display: block;
	overflow: hidden;
	z-index: 100;
	background-color: #FFF;
	-webkit-transition: all 0.3s ease-in;
	-moz-transition: all 0.3s ease-in;
	-o-transition: all 0.3s ease-in;
	transition: all 0.3s ease-in;
}
.menu .menu-set {
	width: auto;	
	margin: 15px auto;
	height: auto; 
	display: block;
	padding: 0 25px;
}
	.mini-menu-bar {
		display: none;
	}
		.mini-menu-bar .mini-link-set {
			display: none;
		}
	.menu .menu-content {
		height: auto;
		width: 100%;
		display: flex;
		align-items: center;
		position: relative;
		padding: 0 0 15px 200px ;
		border-bottom: 1px solid #BBB;
	}

	.menu .left {
		width: 200px;
		height: auto;
		position: absolute;
		left: 0;
	}
		.menu .left a {
			font-family: Montserrat;
			width: auto;
			height: auto;
			display: inline-flex;
			align-items: center;
   			margin-top: 5px;
			font-size: 0.8rem;
			font-weight: bold;
			color: #085217;
			-webkit-transition: all 0.3s ease-in;
			-moz-transition: all 0.3s ease-in;
			-o-transition: all 0.3s ease-in;
			transition: all 0.3s ease-in;
		}
		.menu .left a span {
			width: auto;
			height:28px;
			display: inline-block;
			text-align: center;
			margin-right: 5px;
			-webkit-transition: all 0.3s ease-in;
			-moz-transition: all 0.3s ease-in;
			-o-transition: all 0.3s ease-in;
			transition: all 0.3s ease-in;

		}
			.menu .left a span svg {
				width:auto;
				height: 24px;
				display: inline-block;
			}		
				.menu .left a span svg path{
					fill:#085217;
				}	
	.menu .center {
		width: 70%;
		height: auto;
		text-align: center;		
	}
	.menu a.normal {
		width: auto;
		height: auto;
		display: inline-block;
		margin: 0 10px;
		font-size: 0.8rem;
		color: #333;
		text-transform: uppercase;
		-webkit-transition: all 0.3s ease-in;
		-moz-transition: all 0.3s ease-in;
		-o-transition: all 0.3s ease-in;
		transition: all 0.3s ease-in;
		position: relative;
	}
	.menu a.normal:hover {
		color: #111;
	}
	.menu a.normal.active{
		pointer-events: none;
		color: #085217;
	}
	.menu a.normal.active:before {
		width: 100%;
		background: #085217;
	}
	
	.menu .fanpage-text {
		display: none;
	}
	
	.menu a.fanpage {
		display: none;
	}
		
	.menu a.cart {
		width: auto;
		height: 24px;
		display: inline-flex;
		align-items: center;
		margin: 0 0 0 10px;
		position: relative;
		text-transform: uppercase;
		-webkit-transition: all 0.3s ease-in;
		-moz-transition: all 0.3s ease-in;
		-o-transition: all 0.3s ease-in;
		transition: all 0.3s ease-in;
	}
	.menu a.cart span {
		width: auto;
		height: 22px;
		display: block;
	}
	.menu a.cart span svg {
		width: auto;
		height: 22px;
		display: block;
	}
	.menu a.cart span svg path {
		fill: #333;
	}
	.menu a.cart .amount {
		width: auto;
		height: auto;
		display: inline-block;
		font-size: 0.6rem;
		margin: 0;
		position: absolute;
		top: -7px;
		left: 20px;
		background-color: #085217;
		color: #FFF;
		padding: 0px 5px;
		border-radius: 3px;
		z-index: 99;
	}
	.menu a.cart:hover path {
		fill: #085217;
	}
	
	.menu .right {
		width: 30%;
		height: auto;
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}
		.menu .search-menu-box {
			width: 100%;
			height: 36px;
			border-radius: 18px;
			display:inline-flex;
			background-color: #E3E3E3;
			align-items: center;
			position: relative;
			text-align: center;
			-webkit-transition: all 0.3s ease-in;
			-moz-transition: all 0.3s ease-in;
			-o-transition: all 0.3s ease-in;
			transition: all 0.3s ease-in;
		}
		.menu .search-menu-box input {
			width: 90%;
			height: 34px;
			border: none;
			font-size: 0.7rem;
			color: #333;
			background-color: transparent;
			display: block;
			margin-right: 15px;
			margin-left: 15px;
			outline: none;
		}
		.menu .search-menu-box .search-btn {
			position: absolute;
			line-height: 0;
			right: 10px;
			display: inline-block;
			-webkit-transition: all 0.3s ease-in;
			-moz-transition: all 0.3s ease-in;
			-o-transition: all 0.3s ease-in;
			transition: all 0.3s ease-in;
			cursor: pointer;
		}
		.menu .search-menu-box span {
			width: auto;
			height:22px;
			display: inline-block;
			text-align: center;
			margin-right: 5px;
		}
			.menu .search-menu-box span svg {
				width:auto;
				height: 22px;
				display: inline-block;
			}		
				.menu .search-menu-box span svg path {
					fill:#333;
					-webkit-transition: all 0.3s ease-in;
					-moz-transition: all 0.3s ease-in;
					-o-transition: all 0.3s ease-in;
					transition: all 0.3s ease-in;
				}	
				
		.menu .search-menu-box:hover span svg path {
			fill: #000;
		}
		
		
		
		
	.menu .menu-type-box {
		width: 100%;
		height: auto;
		display: table-cell;
		overflow: hidden;
		border-bottom: 1px #BBB solid;
	}
		
		.menu .menu-type-bar {
			height: auto;
			width: 50vw;
			display: block;
			padding:  0;
			white-space: nowrap;
			overflow: hidden;
			overflow-x: scroll;
		}

			.menu .menu-type-bar a {
				width: auto;
				height: auto;
				display: inline-block;
				font-size: 0.7rem;
				color: #333;
				padding: 10px 0;
				margin-right: 30px;		
			}
	
	
	.menu .menu-logo-box {
		width: 100%;
		height: auto;
		display: block;
		border-bottom: 1px #BBB solid;
	}
		.menu .menu-logo-bar {
			height: auto;
			width: 100%;
			display: block;
			padding:  0;
			white-space: nowrap;
			overflow: hidden;
			overflow-x: scroll;
		}
			.menu .menu-logo-bar a {
				width: auto;
				height: auto;
				display: inline-block;
				font-size: 0.7rem;
				padding: 10px 0;
				color: #333;
				margin-right: 20px;		
			}
			.menu .menu-logo-bar a img {
				height: 28px;
				width: auto;
			}
	
	

/*------------------------------------------------------------------------------------*/
/*-INDEX----------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------*/
.section-index {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
}
.section-index .index-set {
	width: 100%;
	min-height: 500px;
	margin: 0 auto;
	height: auto;
	display: flex;
	padding: 10px 20px;
	position: relative;
}
.section-index .index-set .side {
	display: none;
}
.section-index .index-set .content {
	width: 100%;
	height: auto;
	display: block;
}
	
/*------------------------------------------------------------------------------------*/
/*-QUICKLUNCH--------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------*/
.quicklunch {
	width: 100%;
	height: auto;
	display: block;
	position: relative;
	z-index: 99;
}
.quicklunch::-webkit-scrollbar {
	  width: 0;
}
.quicklunch.scroll {
	overflow: scroll;
    overflow-x: inherit;
}
.quicklunch.fixed {
	position: fixed;
	top: 10px;
}
.quicklunch.offfix {	
	position: absolute;
	bottom: 0;
}

	.quicklunch .title {
		width: 100%;
		height: auto;
		display: block;
		color: #333;
		font-size: 0.7rem;
		font-weight: bold;
		padding-top: 10px;
		border-top: 1px solid #999;
	}
	.quicklunch .list-body {
		width: 50vw;
		height: auto;
		display: flex;
		overflow: hidden;
		overflow-x: scroll;
	}
	.quicklunch .list-body a {
		width: auto;
		height: auto;
		display: inline-flex;
		align-items: center;
		white-space: nowrap;
		position: relative;
		color: #333;
		font-size: 0.7rem;
		margin: 0 25px 0 0;
		padding: 10px 0;
		-webkit-transition: all 0.3s ease-in;
		-moz-transition: all 0.3s ease-in;
		-o-transition: all 0.3s ease-in;
		transition: all 0.3s ease-in;
	}
		.quicklunch .list-body a span {
			display: none;
		}
		.quicklunch .list-body a .check {
			width: 16px;
			height: 16px;
			border-radius: 3px;
			display: flex;
			align-items: center;
			justify-content: center;
			border: 1px solid #085217;
			margin-right: 5px;
			opacity: 0.5;
			-webkit-transition: all 0.3s ease-in;
			-moz-transition: all 0.3s ease-in;
			-o-transition: all 0.3s ease-in;
			transition: all 0.3s ease-in;
		}
			.quicklunch .list-body a .check svg {
				width:auto;
				height: 8px;
				display: inline-block;
			}		
				.quicklunch .list-body a .check svg path {
					fill:rgba(255,255,255,0);
					-webkit-transition: all 0.3s ease-in;
					-moz-transition: all 0.3s ease-in;
					-o-transition: all 0.3s ease-in;
					transition: all 0.3s ease-in;
				}
		.quicklunch .list-body a:hover {
			color: #111;
		}
		.quicklunch .list-body a:hover .check {
			background-color: #085217;
		}
		.quicklunch .list-body a.active .check {
			background-color: #085217;
			opacity: 1;
		}
		.quicklunch .list-body a.active .check svg path {
			fill:#FFF;
		}
/*------------------------------------------------------------------------------------*/
/*-PRODUCTS-SHOW--------------------------------------------------------------*/
/*------------------------------------------------------------------------------------*/
.product-banner-box {
	width: 100%;
	height: auto;
	margin-top: 10px;
	display: block;
}
		.product-banner-box a {
		width: 100%;
		height: auto;
		margin-top: 10px;
		display: block;
	}
	.product-banner-box img {
		width: 100%;
		height: auto;
		display: block;
	}
	.product-banner-box img:first-child {
		margin-top: 0;
	}
.product-shelf-box {
	width: 100%;
	height: auto;
	margin-top: 10px;
	display: grid;
	grid-template-columns: repeat(auto-fill, 19%);
	justify-content: space-between;
}
.product-shelf-box.related {
	grid-template-columns: repeat(auto-fill, 16%);
}
	.product-shelf-box .product-shelf-grid {
		width:100%;
		height: auto;
		display: block;
		margin-bottom: 10px;
	}
		.product-shelf-box .product-shelf-body {
			width: 100%;
			height: auto;
			display: block;
			border: 1px solid #999;
			position: relative;
		}
		.product-shelf-box .logo {
			width: auto;
			height: 20px;
			display: inline-block;
			position: absolute;
			right: 5px;
			top: 5px;
		}
		.product-shelf-box .cover {
			width: 100%;
			height: auto;
			display: block;
			position: relative;
		}
			.product-shelf-box .cover .tag-box {
				width: 100%;
				height: auto;
				display: flex;
				position: absolute;
				bottom: 5px;
				left: 5px;
			}
				.product-shelf-box .cover .tag-box span {
					width: auto;
					height: auto;
					color: #FFF;
					border-radius: 3px;
					padding: 2px 5px 0px 5px;
					margin-right: 3px;
					font-size: 0.55rem;
				}
					.product-shelf-box .cover .tag-box span.new {
						background-color: #11AC00;
					}
					.product-shelf-box .cover .tag-box span.hot {
						background-color: #C70000;
					}
					.product-shelf-box .cover .tag-box span.dis {
						background-color: #EB8A00;
					}
		.product-shelf-box .detail {
			width: 100%;
			height: auto;
			display: block;
			padding: 10px;
		}
		.product-shelf-box .brand {
			width: 100%;
			height: auto;
			display: block;
			color: #333;
			font-size: 0.6rem;
			font-weight: bold;
		}
		.product-shelf-box .name {
			width: 100%;
			height: 42px;
			display: block;
			color: #333;
			font-size: 0.55rem;
		}
		.product-shelf-box .link {
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			justify-content: center;
			color: #FFF;
			background-color: #999;
			font-size: 0.55rem;
			-webkit-transition: all 0.3s ease-in;
			-moz-transition: all 0.3s ease-in;
			-o-transition: all 0.3s ease-in;
			transition: all 0.3s ease-in;
			padding: 5px;
		}
			.product-shelf-box .link span {
				width: auto;
				height:14px;
				display: inline-block;
				text-align: center;
				margin-right: 5px;
			}
				.product-shelf-box .link span svg {
					width:auto;
					height: 14px;
					display: inline-block;
				}		
					.product-shelf-box .link span svg path {
						fill:#FFF;
					}
		.product-shelf-box .link:hover {
			background-color: #333;
		}
		.product-shelf-box .price {
			width: 100%;
			height: 45px;
			display: block;
		}
			.product-shelf-box .price .normal {				
				color: #333;
				font-size: 0.75rem;
			}
				.product-shelf-box .price .normal span {				
					font-size: 0.6rem;
				}
			.product-shelf-box .price .old {				
				color: #333;
				font-size: 0.6rem;
				text-decoration: line-through;
			}
/*------------------------------------------------------------------------------------*/
/*-OBJECT --------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------*/
.main-title {
    font-size: 1rem;
	font-weight: bold;
    color: #333;
    margin: 20px 0;
	display: flex;
	align-items: center;
    position: relative;
    text-align: center;
    justify-content: center;
	text-transform: uppercase;
}
	.main-title span {
		height: 1px;
		width: 150px;
		display: block;
		background-color: #BBB; 
		margin: 0 50px;
		
	}
/*------------------------------------------------------------------------------------*/
/*-SILDER --------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------------*/
.slider-box-small {
	display: none;
}
.slider-box {
	width: 100%;
	height: auto;
	position: relative;
 	overflow: hidden;
}
.slider-box ul {
	position: relative;
	margin: 0;
  	padding: 0;
  	width: 100%;
	height: auto;
	display: block;
	list-style: none;
}
.slider-box ul li {
  position: relative;
  display: block;
  float: left;
  margin: 0;
  padding: 0;
}
.slider-box ul li img {
  display: block;
  float: left;
  width: 100%;
  height: auto;
}
	.slider-box a {
		position: absolute;
		z-index: 90;
		background-color: #333;
		padding: 3px 8px;
		color: #FFF;
		top: 5px;
		font-size: 0.7rem;
		font-family: "quark bold";
		opacity: 0.3;		
		-webkit-transition: all 0.3s ease-in;
		-moz-transition: all 0.3s ease-in;
		-o-transition: all 0.3s ease-in;
		transition: all 0.3s ease-in;
	}
	.slider-box a.slide_next {
		right: 5px;
	}
	.slider-box a.slide_prev {
		left: 5px;
	}
	.slider-box:hover a {
		opacity: 1;
		background-color: #333;
	}
/*-----------------------------------------------------------------------------------*/
/*-ARTICAL ------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
.section-artical {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
}	
	.section-artical .artical-set {
		width: auto;
		margin: 0 auto;
		height: auto;
		display: block;
		padding: 10px 25px 30px 25px;
		position: relative;
	}
		
	.section-artical .artical-box {
		width: 100%;
		height: auto;
		padding: 0;
		display: grid;
		grid-template-columns: repeat(auto-fill, 49%);
		justify-content: space-between;
	}
		.section-artical .artical-grid {
			width: 100%;
			height: auto;
			padding:10px 0;
			display: block;
			text-align: center;
		}
		.section-artical .artical-box .cover  {
			width: 100%;
			height: auto;
			display: block;
			border-radius: 5px;
			overflow: hidden;
		}
		.section-artical .artical-box .cover img  {
			width: 100%;
			height: auto;
			display: block;
			border-radius: 5px;
			overflow: hidden;
			-webkit-transition: all 0.1s ease-in;
			-moz-transition: all 0.1s ease-in;
			-o-transition: all 0.1s ease-in;
			transition: all 0.1s ease-in;
		}

		.section-artical .artical-box .cover:hover img {
			transform: scale(1.05); 
		}
		.section-artical .artical-box .title {
			font-size: 0.55rem;
			color: #333;
			margin:0;
			text-align: center;
			-webkit-transition: all 0.2s ease-in;
			-moz-transition: all 0.2s ease-in;
			-o-transition: all 0.2s ease-in;
			transition: all 0.2s ease-in;
		}
			.section-artical .artical-box .title:hover {
				color: #1B7A2D;
			}
		
		.section-artical .artical-read {
			width: 100%;
			height: auto;
			display: block;
				padding: 0 25px;
		}

			.artical-read .cover {
				width: 100%;
				height: auto;
				display: block;
				position: relative;
				text-align: center;
			}
			
				.artical-read .cover img {
					width: 1000px;
					height: auto;
					position: relative;
					z-index: 10;
				}
		.artical-read .artical-read-set {
			width: auto;
			max-width: 1000px;
			margin: 0 auto;
			height: auto;
			display: flex;
			align-items: center;
		}
			.artical-read .artical-read-set .artical-list {
				width: 100%;
				height: auto;
				display: block;
			}
			.artical-read .title {
				font-size: 1rem;
				color: #111;
				padding: 20px 0;				
    			border-bottom: 2px solid #333;
			}
			.article-option-box {
				width: 100%;
				height: auto;
				display: flex;
				align-items: center;
				padding: 10px 0;
    			border-bottom: 2px solid #333;
				margin-bottom: 20px;
			}
				.artical-read .article-option-box .date {
					width: 100%;
					height: auto;
					display: flex;
					align-items: center;
					 
					font-size: 0.7rem;
					color: #333;
				}
					.artical-read .article-option-box .date span {
						width: 14px;
						height: auto;
						display: block;
						margin-right: 5px;
						opacity: 0.7;
					}
				.artical-read .article-option-box .share-box {
					width: auto;
					height: auto;
					display: inline-flex;
					align-items: center;
				}
					.artical-read .article-option-box .share-box .text {
						font-size: 0.7rem;
						color: #333;
						font-weight: bold;
						margin-right: 5px;
					}
					.artical-read .article-option-box .share-box .share-btn {
						width: 30px;
						height: 30px;
						display: inline-flex;
						text-align: center;
						border-radius: 50%;
						margin-left: 10px;
						align-items: center;
						justify-content: center;
						transition: all 0.2s ease-in-out;
						-moz-transition: all 0.2s ease-in-out;
						-webkit-transition: all 0.2s ease-in-out;
						-o-transition: all 0.2s ease-in-out;
					}
						
						.artical-read .article-option-box .share-box span {
							width:auto;
							display: inline-flex;
							align-items: center;
						}
							.artical-read .article-option-box .share-box span svg {
								width:auto;
								height: 20px;
								display: inline-block;
							}		
								.artical-read .article-option-box .share-box span svg path{
									fill:#FFF;
								}	
					.artical-read .article-option-box .share-box .share-btn:hover {
						transform: scale(1.1);
					}
					.artical-read .article-option-box .share-box .share-btn.facebook {
						background-color: #355BA5;
					}
					.artical-read .article-option-box .share-box .share-btn.line {
						background-color: #00B900;
					}
					.artical-read .article-option-box .share-box .share-btn.twitter {
						background-color: #1DA1F2;
					}
					.artical-read .article-option-box .share-box .share-btn.copylink {
						background-color: #FF761B;
					}
					
				
			.artical-read .tagline {
				font-size: 0.7rem;
				color: #111;
				padding: 20px;
				background-color: #F4F4F4;
				border-radius: 5px;
				margin-bottom: 20px;
			}
			.artical-read .detail  {
				font-size: 0.7rem;
				color: #333;
				margin-bottom: 60px;
				line-height: 30px;
			}
			.artical-read .detail  p {
				min-height: 30px;
			}
			.artical-read .detail blockquote {
					padding: 0px 0 30px 60px;
					margin: 30px 0 0  0;
					background-image: url("../img/objects/blockquote-icon.png");
					background-repeat: no-repeat;
					background-size: 40px auto;
					background-position: top left;
					font-weight: bold;
				}
				.artical-read .detail h2 {
					font-size: 20px;
				}
				.artical-read .detail figure {
					text-align: center;
				}
				.artical-read .detail figcaption {
					font-size: 0.6rem;
					color: #666;
					text-align: center;
					padding: 10px;
				}
				.artical-read .detail a {
						color:  #085217;
						display: inline-block;
						text-decoration: underline;
						font-weight: bold;
					}
				.artical-read .detail a:hover {
    					color: #157428;
					}
.video-box {
	position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
}
.video-box iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/*--------------------------------------------------------------------------------------------*/
/*-SOCIAL-----------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------*/
.section-socail {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	background-color: #333333;
}
	.section-socail .socail-set {
		width: auto;
		margin: 0 auto;
		height: auto;
		display: block;
		padding: 25px 25px;
	}
		.section-socail .socail-set .left {
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			justify-content: center;
			padding-bottom: 15px;
		}
		.section-socail .socail-set .right {
			width: 100%;
			height: auto;
			display: block;
			display: flex;
			align-items: center;
			justify-content: center;
		}
		.section-socail .page-link {
			width: auto;
			height: auto;
			padding: 4px;
			margin-right: 10px;
			border-radius: 50%;
			display: flex;
			align-items: center;
			position: relative;
		}
			.section-socail .page-link svg {
				width: 50px;
				height: 50px;
				border-radius: 50%;
				border: 3px solid #FFF;
				background-color: #FFF;
				position: absolute;
				-webkit-transition: all 0.3s ease-in;
				-moz-transition: all 0.3s ease-in;
				-o-transition: all 0.3s ease-in;
				transition: all 0.3s ease-in;
			}
			.section-socail .page-link .text-box {
				width: auto;
				height: auto;
				display: inline-block;
				background-color: #FFF;
				border-radius: 10px;
				padding: 3px 8px 3px 23px;
				margin-left: 30px;
				-webkit-transition: all 0.3s ease-in;
				-moz-transition: all 0.3s ease-in;
				-o-transition: all 0.3s ease-in;
				transition: all 0.3s ease-in;
			}
				.section-socail .page-link .text-box .name {
					color: #333;
					font-size: 0.5rem;
					font-weight: bold;
				}
				.section-socail .page-link .text-box .type {
					color: #999;
					font-size: 0.4rem;
				}
			.section-socail .page-link:hover svg {
				border: 3px solid #6ED182;
			}
			
			.section-socail .contact-link {
				width: 40px;
				height: 40px;
				display: block;
				border: 3px solid #FFF;
				margin-left: 10px;
				border-radius: 50%;
				
				-webkit-transition: all 0.3s ease-in;
				-moz-transition: all 0.3s ease-in;
				-o-transition: all 0.3s ease-in;
				transition: all 0.3s ease-in;
			}
				.section-socail .contact-link span {
					width: 34px;
					height: 34px;
					display: flex;
					align-items: center;
					justify-content: center;
				}
					.section-socail .contact-link span svg {
						width:auto;
						height: 20px;
						display: block;
					}		
						.section-socail .contact-link span svg path{
							fill:#FFF;
							-webkit-transition: all 0.3s ease-in;
							-moz-transition: all 0.3s ease-in;
							-o-transition: all 0.3s ease-in;
							transition: all 0.3s ease-in;
						}	
				.section-socail .contact-link:hover {
					border: 3px solid #6ED182;
				}
				.section-socail .contact-link:hover span svg path {
					fill: #6ED182;
				}
/*-----------------------------------------------------------------------------------*/
/*-FOOTER-------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------*/
.section-footer {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	background-color: #FFF;
}
	.section-footer .location-btn {
		width: auto;
		height: auto;
		padding: 3px 15px 3px 10px;
		border-radius: 3px;
		background-color: #085217;
		color: #FFF;
		font-size: 0.7rem;
		display: inline-flex;
		align-items: center;
		margin-top: 10px;
	}
	.section-footer .location-btn:hover {
		background-color: #0C5E1C;
	}
		.section-footer .location-btn span {
			width: auto;
			height: 16px;
			display: inline-block;
			text-align: center;
			margin-right: 5px;
			-webkit-transition: all 0.3s ease-in;
			-moz-transition: all 0.3s ease-in;
			-o-transition: all 0.3s ease-in;
			transition: all 0.3s ease-in;
		}
			.section-footer .location-btn span svg {
				width:auto;
				height: 16px;
				display: inline-block;
			}		
				.section-footer .location-btn span svg path{
					fill:#FFF;
				}
	.section-footer .footer-set {
		width: auto;		
		margin: 0 auto;
		height: auto;
		display: flex;
		align-items: center;
		padding: 30px 25px 100px 25px;
	}
		.section-footer .footer-box {
			width: 80%;
			height: auto;
			display: block;
			padding-right: 50px;
		}
		.section-footer .footer-qr-code {
			width: 20%;
			height: auto;
			display: block;
		}
			.section-footer .web-name {
			    font-family: Montserrat;
				font-size: 1.1rem;
				color: #085217;
				font-weight: bold;
				display: block;
			}
			.section-footer .web-detail {
				font-size: 0.6rem;
				color: #333;
				display: block;
			}		
			.section-footer .text {
				font-size: 0.6rem;
				color: #333;
				display: block;
			}
			
				
/*---------------------------------------------------------------------------------------------------------*/
/*-INTRODUCE ------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.section-introduce {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
}
.section-introduce .introduce-set {
	width: auto;
	
	margin: 0 auto;
	height: auto;
	display: block;
	padding: 60px 15px;
}
.section-introduce .introduce-box {
	width: 100%;
	height: auto;
	display: flex;
	align-items: center;
	padding: 0 10px;
}
	.section-introduce .introduce-box .left {
		width: 30%;
		height: auto;
		display: block;
		text-align: center;
	}
	.section-introduce .introduce-box .right {
		width: 70%;
		height: auto;
		display: block;
		padding-left: 50px;
	}
	.section-introduce .introduce-box img {
		width: 100%;
		display: inline-block;
	}
	.section-introduce .introduce-box .title {
		font-family: "JSPrapakorn-Normal";
		font-size: 2rem;
		color: #111;
		margin: 0 0 30px 0;
		position: relative;
	}
		.section-introduce .introduce-box .title:before {
			content: "";
			height: 3px;
			width: 50px;
			background: #157428;
			bottom: 0;
			position: absolute;
			z-index: 10;
		}
	.section-introduce .introduce-box .detail {
		 
		font-size: 0.8rem;
		color: #666;
		margin: 0 0 20px 0;
		text-indent: 20px;
	}
.section-introduce .introduce-btn {
	 
	font-size: 0.8rem;
	padding: 7px 36px 7px 17px;
	display: inline-flex;
	align-items: center;	
	border-radius: 3px;
	text-align: center;
	background-color: #085217;
	color: #FFFFFF;
	position: relative;
	margin-top: 30px;	
    -webkit-transition: all 0.2s ease-in;
    -moz-transition: all 0.2s ease-in;
    -o-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in;
}
	.section-introduce .introduce-btn span {
		width:auto;
		height: 14px;
		display: block;
		position: absolute;
		right: 17px;		
	}
		.section-introduce .introduce-btn span svg {
			width:auto;
			height: 14px;
			display: block;
		}		
			.section-introduce .introduce-btn span svg path{
				fill:#FFF;
			}		
	.section-introduce .introduce-btn:hover {
		background-color: #1B7A2D;
		color: #FFFFFF;
	}
	.section-introduce .introduce-btn:hover span {		
		animation: arrow-btn-hover 0.6s infinite;
	}	
/*---------------------------------------------------------------------------------------------------------*/
/*-RECOMMEND BRAND--------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.section-recom {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	background-position: center ;
	background-size: 100% auto;
}
	.section-recom .recom-set {
		width: auto;
		
		margin: 0 auto;
		height: auto;
		display: block;
		padding: 60px 25px;
		text-align: center;
	}
		.section-recom .title {
			 font-family: "JSPrapakorn-Normal";
			font-size: 2rem;
			color: #111;
			margin: 0 0 30px 0;
			position: relative;
			text-align: center;
			justify-content: center;
		}
			.section-recom .title:before {
				content: "";
				height: 3px;
				width: 50px;				
				background: #157428;
				bottom: 0;
				position: absolute;
				z-index: 10;
				left: 0; 
				right: 0; 
				margin-left: auto; 
				margin-right: auto; 
			}
.section-recom .recom-set .recom-box {
	width: 100%;
	height: auto;
	display: flex;
}
	.section-recom .recom-set .recom-box .left {
		width: 50%;
		height: auto;
		display: block;
		text-align: right;
		padding-right: 30px;
		margin-top: 10px;
		border-right: 3px solid rgba(0,0,0,0.25);
	}
	.section-recom .recom-set .recom-box .right {
		width: 50%;
		height: auto;
		display: block;
		margin-top: 10px;
		padding-left: 30px;
	}		
.section-recom .recom-set  .recom-logo {
		height: 50px;
		width: auto;
		display: inline-block;
		margin: 0 0 30px 0;
}
.section-recom .recom-set  .detail {
	 
	font-size: 0.8rem;
	color: #666;
	margin: 0 0 20px 0;
	text-indent: 20px;
}
.section-recom .recom-text-list {
	width: 100%;
	height: auto;
	display: flex;
	margin-bottom: 10px;
	padding-left: 60px;
	position: relative;
}
	.section-recom .recom-text-list .recom-text-icon {
		width: 50px;
		height: auto;
		margin: 0;
		left: 0;
		position: absolute;
	}
	.section-recom .recom-text-list .recom-text-body {
		width: 100%;
		height: auto;
		display: block;
		text-align: left;
	}
		.section-recom .recom-text-list .recom-text-title {
			font-family: "JSPrapakorn-Normal";
			font-size: 1.5rem;
			color: #111;
			margin: 0;
			display: block;
		}
		.section-recom .recom-text-list .recom-text-detail {
			 
			font-size: 0.8rem;
			color: #666;
		}
.section-recom .recom-btn {
	 
	font-size: 0.8rem;
	padding: 7px 36px 7px 17px;
	display: inline-flex;
	align-items: center;
	border-radius: 3px;
	text-align: center;
	background-color: #085217;
	color: #FFFFFF;
	position: relative;
	margin-top: 40px;	
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}
	.section-recom .recom-btn span {
		width:auto;
		height: 14px;
		display: block;
		position: absolute;
		right: 17px;		
	}
		.section-recom .recom-btn span svg {
			width:auto;
			height: 14px;
			display: block;
		}		
			.section-recom .recom-btn span svg path{
				fill:#FFF;
			}	
	.section-recom .recom-btn:hover {
		background-color: #1B7A2D;
		color: #FFFFFF;
	}
	.section-recom .recom-btn:hover span {		
		animation: arrow-btn-hover 0.6s infinite;
	}
/*---------------------------------------------------------------------------------------------------------*/
/*-INTRODUCE ------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.section-other {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
}
	.section-other .other-set {
		width: auto;
		
		margin: 0 auto;
		height: auto;
		display: block;
		padding: 60px  25px;
		text-align: center;
	}		
	.section-other .title {
		font-family: "JSPrapakorn-Normal";
		font-size: 2rem;
		color: #111;
		margin: 0 0 30px 0;
		position: relative;
		text-align: center;
		justify-content: center;
	}
		.section-other .title:before {
			content: "";
			height: 3px;
			width: 50px;
			background: #157428;
			bottom: 0;
			position: absolute;
			z-index: 10;
			left: 0;
			right: 0;
			margin-left: auto;
			margin-right: auto;
		}
			.section-other .detail {
				font-size: 0.8rem;
				color: #666;
				margin: 0 0 30px 0;
			}
		.section-other .other-logo-bar {
			width: 100%;
			height: auto;
			padding: 0;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
			display: -webkit-box;
			display: -webkit-flex;
			display: -moz-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-flex: 0;
			-moz-box-flex: 0;
			-webkit-box-direction: normal;
			-moz-box-direction: normal;
			-webkit-flex: 0 1 auto;
			-ms-flex: 0 1 auto;
			flex: 0 1 auto;
			-webkit-box-orient: horizontal;
			-webkit-flex-direction: row;
			-moz-box-orient: horizontal;
			-ms-flex-direction: row;
			flex-direction: row;
			-webkit-flex-wrap: wrap;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			justify-content: center;
		}		
			.section-other .other-logo-bar .other-logo-grid {
				flex-basis:  auto;
				width: auto;
				height: auto;
				padding: 20px 40px;
				box-sizing: border-box;
				-webkit-box-flex: 0;
				-webkit-flex: 0 0 auto;
				-moz-box-flex: 0;
				-ms-flex: 0 0 auto;
				flex: 0 0 auto;			
			}
				.section-other .other-logo-bar .other-logo-btn {
					height: auto;
					width: auto;
					display: inline-flex;
					align-items: center;
					justify-content: center;
					
				}
					.section-other .other-logo-bar .other-logo-btn img {
						height: 35px;
						width: auto;
						display: inline-block;
						opacity: 1;
						transition: all 0.3s ease-in-out;
						-moz-transition: all 0.3s ease-in-out;
						-webkit-transition: all 0.3s ease-in-out;
						-o-transition: all 0.3s ease-in-out;
					}
					.section-other .other-logo-bar .other-logo-btn p {
						 
						font-size: 0.7rem;
						position: absolute;
						font-weight: bold;
						letter-spacing: 2px;
						color: #111;
						transition: all 0.3s ease-in-out;
						-moz-transition: all 0.3s ease-in-out;
						-webkit-transition: all 0.3s ease-in-out;
						-o-transition: all 0.3s ease-in-out;
						opacity: 0;
					}
				.section-other .other-logo-bar .other-logo-btn:hover img {
					filter: grayscale(100%);
					opacity: 0.1;	
				}
				.section-other .other-logo-bar .other-logo-btn:hover p {
					opacity:1;
				}
		.section-other .other-low-text {
			 
			font-size: 0.8rem;
			color: #666;
			margin: 30px 0;
		}
		.section-other .other-logoth-bar {
			width: 100%;
			height: auto;
			display: block;
			text-align: center;
		}
		.section-other .other-btn {
			 
			font-size: 0.8rem;
			padding: 7px 36px 7px 17px;
			display: inline-flex;
			align-items: center;
			border-radius: 3px;
			text-align: center;
			background-color: #085217;
			color: #FFFFFF;
			position: relative;
			-webkit-transition: all 0.2s ease-in;
			-moz-transition: all 0.2s ease-in;
			-o-transition: all 0.2s ease-in;
			transition: all 0.2s ease-in;
			}
			.section-other .other-btn span {
				width:auto;
				height: 14px;
				display: block;
				position: absolute;
				right: 17px;		
			}
				.section-other .other-btn span svg {
					width:auto;
					height: 14px;
					display: block;
				}		
					.section-other .other-btn span svg path{
						fill:#FFF;
					}	
			.section-other .other-btn:hover {
				background-color: #1B7A2D;
				color: #FFFFFF;
			}
			.section-other .other-btn:hover span {		
				animation: arrow-btn-hover 0.6s infinite;
			}
/*---------------------------------------------------------------------------------------------------------*/
/*-PRODUCT GRID---------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.product-show-box {
	width: 80%;
    height: auto;
    display: block;
	padding-right: 10px;
}
.product-shelf-bar {
	width: 100%;
	height: auto;
	padding: 0;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-flex: 0;
	-moz-box-flex: 0;
	-webkit-box-direction: normal;
	-moz-box-direction: normal;
	-webkit-flex: 0 1 auto;
	-ms-flex: 0 1 auto;
	flex: 0 1 auto;
	-webkit-box-orient: horizontal;
	-webkit-flex-direction: row;
	-moz-box-orient: horizontal;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}		
	
.product-shelf-bar .product-shelf-box:hover  {
	border: 1px solid rgba(51,51,51,1);
}
.product-shelf-bar .product-shelf-box:hover .product-name {
	text-overflow:inherit;
	white-space: inherit;
	overflow: inherit;			
}
.product-shelf-bar .product-shelf-box:hover .product-detail {
	bottom: 0;
}

.product-shelf-bar .product-shelf-box:hover .logo-tag {
	opacity: 1;
}



/*--------------------------------------------------------------------------------------------*/
/*-SEARCH----------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------*/
.section-catalog {
	position: relative;
	display: block;
	width: 100%;
	height: auto;		
}
	.section-catalog .catalog-set {
	    width: auto;
		min-height: 500px;		
		margin: 0 auto;
		height: auto;
		display:block;
		padding: 5px 25px 10px 25px;
	}
	.catalog-set .side {
		width: 100%;
		height: auto;
		display: block;
	}
	.catalog-set .content {
		width: 100%;
		height: auto;
		display: block;
		padding: 25px 0 0 0;
	}
	.product-count {
		font-size: 0.9rem;
    	font-weight: bold;
		color: #085217;
	}
	
	
/*---------------------------------------------------------------------------------------------------------*/
/*-PAGINATION -----------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.pagination-bar {
	position: relative;
    display: block;
    width: 100%;
    height: auto;
}
	.pagination-set {
		width: auto;
		
		margin: 0 auto;
		height: auto;
		display: flex;
		justify-content: center;
		padding: 30px 15px 60px 15px;
		text-align: center;
	}
	.pagination-bar a {
		 		
		display: block;
		font-size: 0.8rem;
		width: auto;
		height: auto;
		padding: 5px 15px;
		margin: 0 5px;
		text-align: center;
		border-radius: 3px;
		color: #333;
		font-weight: bold;
		 -webkit-transition: all 0.2s ease-in;
    	-moz-transition: all 0.2s ease-in;
    	-o-transition: all 0.2s ease-in;
    	transition: all 0.2s ease-in;
	}
	.pagination-bar a.arrow {
		display: flex;
		align-items: center;		
	}
	.pagination-bar a.arrow span {
		width: auto;
		height: 14px;
		display: block;
		right: 17px;
	}
	.pagination-bar a.arrow span svg {
		width: auto;
		height: 14px;
		display: block;
	}
	.pagination-bar a.arrow span svg path {
		fill: #333;
	}
	.pagination-bar a:hover {
		background-color: #DDF7E2;
		color: #3E6445;
	}
	.pagination-bar a.arrow:hover {
		background-color: #DDF7E2;
	}
	.pagination-bar a.arrow:hover span svg path {
		fill: #3E6445;
	}
	.pagination-bar a.active {
		background-color: #085217;
		color: #FFF;
		pointer-events: none;
	}
/*---------------------------------------------------------------------------------------------------------*/
/*-PROMOTION -----------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/


	.section-promotion-body {
	    position: relative;
		display: block;
		width: 100%;
		height: auto;
	}
		.section-promotion-body .promotion-body-set {
			width: auto;
			
			margin: 0 auto;
			height: auto;
			display: block;
			padding: 10px 25px 30px 25px;
		}
	.section-promotion-body .promotion-body-box {
		width: 100%;
		height: auto;
		display: flex;
		align-items: center;
		position: relative;
		border-bottom: 2px solid #333;
		margin-bottom: 20px;
		padding-bottom: 20px;
	}
		.promotion-body-box .cover {
			width: 25%;
			height: auto;
			display: block;
		}
			.promotion-body-box .cover img {
				width: 100%;
				height: auto;
				display: block;
				border-radius: 5px;
			}
		.promotion-body-box .detail {
			width: 65%;
			height: auto;
			display: block;
			padding-left: 20px;
		}
			.promotion-body-box .detail .name {
				font-size: 1rem;
				color: #111;
				margin: 0;
				position: relative;
			}
			.promotion-body-box .detail .time {
				font-size: 0.6rem;
				color: #777;
				margin: 0 ;
				display: flex;
				align-items: center;
			}
				.promotion-body-box .detail .time span {
					width: auto;
					height: 16px;
					display: block;
					margin-right: 5px;
				}
					.promotion-body-box .detail .time span svg {
						width: auto;
						height: 16px;
						display: block;
					}
						.promotion-body-box .detail .time span svg path {
							fill: #666;
						}
			.promotion-body-box .detail .text {
				font-size: 0.7rem;
				color: #333;
				margin: 20px 0;
			}
			.promotion-body-box .detail .alert {
				font-size: 0.7rem;
				color: #DF3D3F;
				display: flex;
				align-items: center;
			}
				.promotion-body-box .detail .alert span {
					width: auto;
					height: 16px;
					display: block;
					margin-right: 5px;
				}
					.promotion-body-box .detail .alert span svg {
						width: auto;
						height: 16px;
						display: block;
					}
						.promotion-body-box .detail .alert span svg path {
							fill: #DF3D3F;
						}
		.section-promotion-body .promotion-body-box:last-child {
			border-bottom: none;
			margin-bottom: 0;
			padding-bottom: 0;
		}
/*---------------------------------------------------------------------------------------------------------*/
/*-BACKLINK---------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.backlink-set {
	width: auto;
	
	margin: 0 auto;
	height: auto;
	display: flex;
	align-items: center;
	padding: 0 25px 10px 25px;
}
	.backlink-set  a {
		font-size: 0.55rem;
		color: #666;
		margin: 0 ;
		-webkit-transition: all 0.3s ease-in;
		-moz-transition: all 0.3s ease-in;
		-o-transition: all 0.3s ease-in;
		transition: all 0.3s ease-in;
	}
	.backlink-set  a:hover {
		color: #111;
		margin: 0 ;
	}
	.backlink-set  a.active {
		pointer-events: none;
		color: #085217;
		font-weight: bold;
	}
	.backlink-set span {
		width: auto;
		height: 10px;
		display: block;
		margin: 0 15px;
	}
	.backlink-set span svg {
		width: auto;
		height: 10px;
		display: block;
	}
	.backlink-set span svg path {
		fill: #999;
	}
/*---------------------------------------------------------------------------------------------------------*/
/*-PRODUCT---------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.section-product {
	position: relative;
    display: block;
    width: 100%;
    height: auto;
}
	.section-product .product-set {
		width: auto;
		min-height: 500px;
		
		margin: 0 auto;
		height: auto;
		display: block;
		padding: 10px 25px 10px 25px;
		position: relative;
	}
	
	
	
.product-infomation {
	width: 100%;
	height: auto;
	display: block;
	margin-bottom: 50px;
}

.product-infomation .top-infomation {
	width: 100%;
	height: auto;
	display: flex;
	position: relative;
	flex-wrap: wrap;
}
	.product-infomation .top-infomation .logo-bg {
		width: auto;
		height: 30px;
		display: inline-block;
		position: absolute;
		z-index: 0;
		opacity: 0.5;
		right: 20px;
		top: 5px;
		pointer-events: none;
	}
	.product-infomation .top-infomation .left {
		width: 40%;
		height: auto;
		display: block;
		padding: 0 20px 0 0;
		position: relative;
		z-index: 10;
	}
	.product-infomation .top-infomation .center {
		width: 60%;
		height: auto;
		display: block;
		padding: 0 0 0 0;
		position: relative;
		z-index: 10;
	}
	.product-infomation .top-infomation .right {
		width: 100%;
		height: auto;
		display: block;
		padding: 0;
		margin-top: 15px;
		background-repeat: no-repeat;
		background-position: top right;
		background-size: auto 50px;
		background-blend-mode: color-dodge;
		position: relative;
		z-index: 10;
		background-color: #F5F5F5;
		border-radius: 5px;
	}
	.product-infomation .cover {
		width: 100%;
		height: auto;
		display: block;
		padding: 0 5px 5px 0;
	}
	.product-infomation .subimg-thumbnail-box {
		width: 100%;
		height: auto;
		display: flex;
		flex-wrap: wrap;
	}
	.product-infomation .subimg-thumbnail-grid {
		flex-basis: auto;
		width: 15%;
		height: auto;
		padding: 5px 5px 5px 0;
		box-sizing: border-box;
		-webkit-box-flex: 0;
		-webkit-flex: 0 0 auto;
		-moz-box-flex: 0;
		-ms-flex: 0 0 auto;
		flex: 0 0 auto;
	}
		.product-infomation .subimg-thumbnail-box img {
			width: 100%;
			height: auto;
			display: block;
			cursor: pointer;
			border: 2px solid rgb(12,116,33,0);
		}
		.product-infomation .subimg-thumbnail-box img:hover {
			border: 2px solid #0C7421;
		}
		.product-infomation .subimg-thumbnail-box img.active {
			border: 2px solid #085217;
		}
	.product-infomation .name {
		font-size: 0.7rem;
    	font-weight: bold;
		color: #333;
		padding: 10px 0;
	}
	.product-infomation .right .name {
		font-size: 0.7rem;
    	font-weight: bold;
		color: #333;
		background-color: #DDD;
		padding: 15px;
	}
	.product-infomation .small-detail {
		font-size: 0.65rem;
		color: #333;			
		margin-top: 5px;
	}
		.product-infomation .small-detail span {
			color: #333;
			width: 100px;
			display: inline-block;
		}
		
	.product-infomation .option-box {
		width: 100%;
		height: auto;
		display: block;
		padding : 10px 15px;
	}
		.product-infomation .option-box .option-title {
			font-size: 0.7rem;
			color: #111;
			font-weight: bold;
		}
		.product-infomation .option-btn-set {
			width: 100%;
			height: auto;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
			display: -webkit-box;
			display: -webkit-flex;
			display: -moz-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-flex: 0;
			-moz-box-flex: 0;
			-webkit-box-direction: normal;
			-moz-box-direction: normal;
			-webkit-flex: 0 1 auto;
			-ms-flex: 0 1 auto;
			flex: 0 1 auto;
			-webkit-box-orient: horizontal;
			-webkit-flex-direction: row;
			-moz-box-orient: horizontal;
			-ms-flex-direction: row;
			flex-direction: row;
			-webkit-flex-wrap: wrap;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			padding: 0 0 0 0;
			margin: 5px 0 10px 0;
		}
			.product-infomation .option-btn-set .option-btn {
				flex-basis: auto;
				width: auto;
				height: auto;
				padding: 2px 15px;
				border: 2px solid #085217;
				border-radius: 3px;
				margin-right: 8px;
				margin-bottom: 5px;
				color: #085217;
				font-size: 0.8rem;
				box-sizing: border-box;
				-webkit-box-flex: 0;
				-webkit-flex: 0 0 auto;
				-moz-box-flex: 0;
				-ms-flex: 0 0 auto;
				flex: 0 0 auto;
			}
			.product-infomation .option-btn-set .option-btn:hover {					
				border: 2px solid #197C2C;
				color: #197C2C;
			}
			.product-infomation .option-btn-set .option-btn.active {			
				pointer-events: none;
				background-color:  #085217;
				color: #FFF;
			}
		.product-infomation .option-amount-set {
			width: auto;
			height: auto;
			display: inline-flex;
			align-items: center;
			border-radius: 3px;
			margin: 10px 0 30px 0;
		}
			.product-infomation .option-amount-box {
				width: auto;
				height: auto;
				display: inline-flex;
				align-items: center;
				border: 2px solid #085217;
				border-radius: 3px;
				background-color: #085217;
			}
			.product-infomation .option-amount-set .amount-left {
				width: 30px;
				height: 30px;
				display: block;
				text-align: center;
				color: #FFF;
				-webkit-touch-callout: none; 
				-webkit-user-select: none; 
				-khtml-user-select: none; 
				-moz-user-select: none; 
				-ms-user-select: none; 
				user-select: none;
			}
			.product-infomation .option-amount-set .amount-right {
				width: 30px;
				height: 30px;
				display: block;
				text-align: center;
				color: #FFF;
				-webkit-touch-callout: none; 
				-webkit-user-select: none; 
				-khtml-user-select: none; 
				-moz-user-select: none; 
				-ms-user-select: none; 
				user-select: none;
			}
			.product-infomation .option-amount-set .amount-left:hover, .product-infomation .option-amount-set .amount-right:hover {
				background-color: #0C5E1C;
			}
			.product-infomation .option-amount-set .amount-input {
				width: 60px;
				height: 30px;
				display: block;
				text-align: center;
				color: #085217;
				font-size: 0.8rem;
				outline: none;
				border: none;
				border-left: 2px solid #085217;
				border-right: 2px solid #085217;
			}
			.product-infomation .option-amount-set .amount-text {
				font-size: 0.7rem;
				color: #666;
				margin-left: 10px;
			}
			
		.product-infomation .option-price-set {
			width: auto;
			height: auto;
			display: inline-flex;
			align-items: baseline;
			position: relative;
			padding: 10px 0 0 0;
		}
			.product-infomation .option-price-set .option-old {
				font-size: 1rem;
				color: #999;
				margin: 0;
				text-align: center;
				display: inline-block;
				position: relative;
				padding: 0 5px;
				margin-right: 15px;
			}
				.product-infomation .option-price-set .option-old:before {
					position: absolute;
					content: "";
					left: 0;
					top: 50%;
					right: 0;
					border-top: 1px solid #999;
				}
			.product-infomation .option-price-set .option-normal {
				font-size: 1.6rem;
				color: #085217;
				margin: 0;
				display: inline-block;
			}
			.product-infomation .option-price-set .option-symbol {
				font-size: 1rem;
				color: #333;
				margin: 0;
				text-align: center;
				display: inline-block;
				line-height: 25px;
				position: relative;
				margin-left: 10px;
			}
			.product-infomation .option-price-set .option-dis-tag {
				width: auto;
				height: auto;
				display: inline-block;
				font-size: 0.6rem;
				padding: 2px 10px;
				background-color: #FF8E00;
				color: #FFF;
				position: absolute;
				white-space: nowrap;
				border-radius: 3px;
				left: 0;
				top:0;
				z-index: 10;
			}
		.product-infomation .option-order-box {
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			padding: 10px 15px;
			border-top: 1px solid #DDD;
		}
		.product-infomation .option-order-box .option-order-alert {
			width: auto;
			height: auto;
			font-size: 0.7rem;
			font-weight: bold;
			white-space: nowrap;
			color: #D8393C;
			display: none;
		}
		.product-infomation .option-order-box .option-order-btn {
			width: auto;
			height: auto;
			padding: 10px 25px;
			border-radius: 3px;
			margin-right: 20px;
			background-color: #085217;
			color: #FFF;
			font-size: 0.8rem;
			display: inline-block;
		}
		.product-infomation .option-order-box .option-order-btn:hover {
			color: #FFF;
			background-color: #0C5E1C;
		}
		.product-infomation .option-order-box .option-order-nostore {
			width: auto;
			height: auto;
			padding: 10px 30px;
			border-radius: 3px;
			margin-right: 50px;
			background-color: #575757;
			color: #FFF;
			font-size: 0.9rem;
			display: inline-block;
			cursor: default;
			opacity: 0.5;
		}
	.product-infomation .share-box {
		width: 100%;
		height: auto;
		display: inline-flex;
		align-items: center;
		padding: 10px 0;
		border-radius: 3px;
	}
		.product-infomation .share-box .text {
			font-size: 0.7rem;
			color: #333;
			margin-right: 5px;
		}
		.product-infomation .share-box .share-btn {
			width: 34px;
			height: 34px;
			display: inline-block;
			text-align: center;
			border-radius: 50%;
			font-weight: bold;
			text-transform: uppercase;
			margin-left: 10px;
			padding: 5px 5px;
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
		}
			.product-infomation .share-box .share-btn span {
				width:auto;
				display: inline-flex;
				align-items: center;
			}
				.product-infomation .share-box .share-btn span svg {
					width:auto;
					height: 20px;
					display: inline-block;
				}		
					.product-infomation .share-box .share-btn span svg path{
						fill:#FFF;
					}	
		.product-infomation .share-box .share-btn:hover {
			transform: scale(1.1);
		}
		.product-infomation .share-box .share-btn.facebook {
			background-color: #355BA5;
		}
		.product-infomation .share-box .share-btn.line {
			background-color: #00B900;
		}
		.product-infomation .share-box .share-btn.twitter {
			background-color: #1DA1F2;
		}
		.product-infomation .share-box .share-btn.copylink {
			background-color: #FF761B;
		}
	.product-infomation .market-box {
		width: 100%;
		height: auto;
		display: block;
		align-items: center;
		padding: 10px 0;
		border-radius: 3px;
	}
		.product-infomation .market-box .text {
			font-size: 0.7rem;
			color: #333;
			margin-right: 5px;
		}
		.product-infomation .market-box .shopping-box {
			width: 100%;
			height: auto;
			display: flex;
			padding-left: 35px;
		}
		.product-infomation .market-box .shopping-box a {
			height:auto;
			width: auto;
			display: flex;
			align-items: center;
			padding:4px 9px;
			border: 2px solid #666;
			background-color: #666;
			border-radius: 3px;
			margin-right: 10px;
			font-size: 0.6rem;
			color: #FFF;
			-webkit-transition: all 0.2s ease-in;
			-moz-transition: all 0.2s ease-in;
			-o-transition: all 0.2s ease-in;
			transition: all 0.2s ease-in;
		}
			.product-infomation .market-box .shopping-box a span {
				width:auto;
				height: auto;
				display: inline-block;
				margin-right: 5px;
			}
				.product-infomation .market-box .shopping-box a span svg {
					width:auto;
					height: 18px;
					display: block;
				}		
					.product-infomation .market-box .shopping-box a span svg path{
						fill:#FFF;
						-webkit-transition: all 0.2s ease-in;
						-moz-transition: all 0.2s ease-in;
						-o-transition: all 0.2s ease-in;
						transition: all 0.2s ease-in;
					}	
		.product-infomation .market-box .shopping-box a.lazada:hover {
			border: 2px solid #1955D0;
			background-color: #1955D0;
			color: #FFF;
		}	
		.product-infomation .market-box .shopping-box a.shopee:hover {
			border: 2px solid #F14930;
			background-color: #F14930;
			color: #FFF;
		}	

		.product-infomation .market-box .shopping-box a.lazada:hover span svg path {
			fill:#EA6B23;
		}	
		.product-infomation .market-box .shopping-box a.shopee:hover span svg path {
			fill:#FFF;
		}	
			
.other-detail {
	width: 100%;
	height: auto;
	display: block;
	margin: 20px 0 0 0;
	font-size: 0.7rem;
    color: #333;
}	
.other-products {
	width: 100%;
	height: auto;
	display: block;
}	
.stop {
	pointer-events: none !important;
	opacity: 0.2 !important;
}
/*---------------------------------------------------------------------------------------------------------*/
/*-CART--------------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.section-cart {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
}
	.section-cart .cart-set {
		width: auto;
		
		margin: 0 auto;
		height: auto;
		display:block;
		padding: 0 25px 60px 25px;
	}
	.section-cart .cart-set .none-cart {
		width: 100%;
		height: auto;
		display: block;
		background-color: #EEE;
		text-align: center;
		border-radius: 5px;
		color: #333;		
		padding: 50px 0;
		font-size: 1rem;
	}
		.section-cart .cart-set .none-cart a {
			width: auto;
			height: auto;
			padding: 10px 25px;
			border-radius: 3px;
			background-color: #085217;
			color: #FFF;
			font-size: 0.8rem;
			display: inline-block;
		}
		.section-cart .cart-set .none-cart a:hover {
			color: #FFF;
			background-color: #0C5E1C;
		}
	.cart-set .left {
		width: 100%;
		height: auto;
		display: block;
	}
	.cart-set .right {
		width: 100%;
		height: auto;
		display: block;
	}
	.cart-set .right .title {
		display: none;
	}
	.section-cart .cart-body-box {
		width: 100%;
		height: auto;
		display: block;
		background-color: #FFF;
		padding-right: 10px;
	}
		
	.cart-body-box .title {
		font-size: 0.7rem;
		font-weight: bold;
		color: #333;
	}
	.cart-body-box .cart-table-header {
		width: 100%;
		height: auto;
		display: flex;
		font-size: 0.6rem;
		color: #333;
		font-weight: bold;
		border-top: 2px solid #333;
		border-bottom: 2px solid #333;
		margin-top: 10px;
	}
		.cart-body-box .cart-table-header .body {
			height: auto;
			display: block;
			padding: 5px 0;
		}
		.cart-body-box .cart-table-header .column-1 {
			width: 35%;
		}
		.cart-body-box .cart-table-header .column-2 {
			width: 13%;
			text-align: center;
		}
		.cart-body-box .cart-table-header .column-3 {
			width: 13%;
			text-align: center;
		}
		.cart-body-box .cart-table-header .column-4 {
			width: 10%;
			text-align: center;
		}
		.cart-body-box .cart-table-header .column-5 {
			width: 20%;
			text-align: center;
		}
		.cart-body-box .cart-table-header .column-6 {
			width: 9%;
			text-align: center;
		}
	.cart-body-box .cart-table-list {
		width: 100%;
		height: auto;
		display: flex;
		align-items: center;
		font-size: 0.6rem;
		color: #333;
		border-bottom: 1px solid #333;
	}
	.cart-body-box .cart-table-list a {
		color: #333;
	}
	.cart-body-box .cart-table-list a:hover {
		color: #085217;
	}
		.cart-body-box .cart-table-list .body {
			height: auto;
			display: block;
			padding: 10px 0;
		}
		.cart-body-box .cart-table-list .column-1 {
			width: 10%;
			display: flex;
			align-items: center;
		}
			.cart-body-box .cart-table-list .column-1 img {
				width: 100%;
				height: auto;
				padding-right: 5px;
			}
		.cart-body-box .cart-table-list .column-2 {
			width: 25%;
			display: flex;
			align-items: center;
		}
		.cart-body-box .cart-table-list .column-3 {
			width: 13%;
			text-align: center;
		}
		.cart-body-box .cart-table-list .column-4 {
			width: 13%;
			font-weight: bold;
			text-align: center;
		}
		.cart-body-box .cart-table-list .column-5 {
			width: 10%;
			text-align: center;
		}
		.cart-body-box .cart-table-list .column-6 {
			width: 20%;
			font-weight: bold;
			text-align: center;
		}
		.cart-body-box .cart-table-list .column-7 {
			width: 9%;
			text-align: center;
		}
	.cart-body-box .option-amount-box {
		width: auto;
		height: auto;
		display: inline-flex;
		align-items: center;
		border: 2px solid #085217;
		border-radius: 3px;
		background-color: #085217;
	}
	.cart-body-box .option-amount-box .amount-left {
		width: 20px;
		height: 20px;
		display: block;
		text-align: center;
		color: #FFF;
		-webkit-touch-callout: none; 
		-webkit-user-select: none; 
		-khtml-user-select: none; 
		-moz-user-select: none; 
		-ms-user-select: none; 
		user-select: none;
	}
	.cart-body-box .option-amount-box .amount-right {
		width: 20px;
		height: 20px;
		display: block;
		text-align: center;
		color: #FFF;
		-webkit-touch-callout: none; 
		-webkit-user-select: none; 
		-khtml-user-select: none; 
		-moz-user-select: none; 
		-ms-user-select: none; 
		user-select: none;
	}
	.cart-body-box .option-amount-box .amount-left:hover, .cart-body-box .option-amount-box .amount-right:hover {
		background-color: #0C5E1C;
		color: #FFF;
	}
	.cart-body-box .option-amount-box .amount-input {
		width: 40px;
		height: 20px;
		display: block;
		text-align: center;
		color: #085217;
		font-size: 0.7rem;
		outline: none;
		border: none;
		border-left: 2px solid #085217;
		border-right: 2px solid #085217;
	}
	.cart-body-box .option-amount-box .amount-text {
		 
		font-size: 0.7rem;
		color: #666;
		margin-left: 10px;
	}
	.cart-body-box .stock-max {
		position: absolute;
		opacity: 0;
	}
	
	
	
	.cart-body-box .cart-del-btn {
		 
		font-size: 0.6rem;
		color: #FFF !important;
		background-color: #999;
		padding: 3px 8px;
		border-radius: 3px;
		display: inline-block;
	}
	.cart-body-box .cart-del-btn:hover {
		background-color: #DB2528;
	}
	.cart-result-box {
		width: 100%;
		height: auto;
		display: block;
		padding: 10px 0;
	}
	.cart-result-box .result-text {
		width: 100%;
		height: auto;
		display: flex;
		align-items: baseline;
		padding: 5px 0;
		font-size: 0.6rem;
	}
	.cart-result-box .result-text.promotion-box {
		padding: 5px 0 30px 0;
		position: relative;
	}
	
	.cart-result-box .promotion-box .promotion-tag {
		width: auto;
		height: auto;
		display: inline-flex;
		align-items: center;
		position: absolute;
		bottom: 5px;
		padding: 0 0 0 10px;
		font-size: 0.6rem;
		background-color: #999;
		border-radius: 3px;
		color: #FFF;
		overflow: hidden;
	}
	.cart-result-box .promotion-box .promotion-tag a {
		width:auto;
		height: 22px;
		display: flex;
		align-items: center;
		padding: 0 10px;
		background-color: #E54242;
		margin-left: 10px;
		border-left: 3px solid #FFF;
	}
		.cart-result-box .promotion-box .promotion-tag a svg {
			width:auto;
			height: 10px;
			display: block;
		}		
			.cart-result-box .promotion-box .promotion-tag a svg path{
				fill:#FFF;
			}	
			.cart-result-box .promotion-box .promotion-tag a:hover {				
				background-color: #D10003;		
			}
		.cart-result-box .result-text .text {
			width: 50%;
			color: #333;
		}
		.cart-result-box .result-text .cash{
			width: 50%;
			text-align: right;
			font-size: 0.7rem;
			color: #111;
		}
			.cart-result-box .result-text .cash span{
				display: block;
				text-align: right;
				font-size: 0.6rem;
				color: #666;
			}
		.cart-result-box .result-text .disrate {
			width: 50%;
			text-align: right;
			font-size: 0.9rem;
			color: #E54242;
		}
		.cart-result-box .result-text .all-cash {
			width: 50%;
			text-align: right;
			font-size: 1rem;
			font-weight: bold;
			color: #085217;
		}
	.cart-result-box .title {
		font-size: 0.9rem;
		font-weight: bold;
		color: #333;
	}
	.check-box {
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			padding-bottom: 5px;
		}
		.check-box:last-of-type {
			padding-bottom: 0;
		}
			.check-box input {
				width: 55px !important;
				height: 26px;
				margin-right: 5px !important;
			}
			.check-box .check-text {
				font-size: 0.7rem;
				color: #111;
			}
		.check-box .check-label {
			width: auto;
			height: auto;
			display: inline-flex;
			align-items: center;
			border-radius: 3px;
			margin-right: 5px;
			font-size: 0.6rem;
			padding: 0;
			color: #085217;
			cursor: pointer;
			
		}
		.check-box .check-label:hover {
			color: #085217;
		}
		.check-box .check-label input  {
			display: none;
		}
		.check-box .check-label .check-indicator {
			width: 20px;
			height: 20px;
			display: inline-block;
			border-radius: 3px;
			border: 2px solid #666;
			margin-right: 5px;
			font-family: "foundation icons";
			text-align: center;
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
			color: rgba(104,122,164,0);
		}
		.check-box .check-label:hover .check-indicator {
			color: #B1B1B1;
		}
		.check-box .check-label input:checked + .check-indicator {
			border: 2px solid #2DA445;
			color: #2DA445;
			pointer-events: none;	
		}
	.cart-btn-box {
		width: 100%;
		height: auto;
		display: flex;
		align-items: center;
		position: relative;
		padding: 10px 0;
    	border-top: 2px solid #333;
		transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
	}
	.cart-btn-box.promotion-active {
		padding: 10px 0 40px 0;
	}
		.cart-btn-box .left {
			width: 50%;
			height: auto;
			display: flex;
			align-items: center;
		}
		.cart-btn-box .right {
			width: 50%;
			height: auto;
			display: block;
			text-align: right;
		}
	.cart-btn-box .promotion-input {
		height: 30px;
		border: 1px solid #085217;
		border-radius: 3px;
		font-size: 0.7rem;
		outline: none;
		padding: 10px;
	}
	.cart-btn-box .promotion-btn {
		height: 30px;
		font-size: 0.7rem;
		display: inline-flex;
		border-radius: 3px;
		outline: none;
		align-items: center;
		justify-content: center;
		padding: 0 15px;
		background-color: #FF6E0C;
		color: #FFF;
		margin-left: 10px;
	}
	.cart-btn-box .promotion-btn:hover {
		background-color: #FF8431;
		color: #FFF;
	}
	.cart-btn-box .promotion-alert {
		font-size: 0.7rem;
		color: #FFF;
		position: absolute;
		background-color: #E54242;padding: 2px 10px;
		border-radius: 3px;
		opacity: 0;
		bottom: 10px;
		transition: all 0.5s ease-in-out;
			-moz-transition: all 0.5s ease-in-out;
			-webkit-transition: all 0.5s ease-in-out;
			-o-transition: all 0.5s ease-in-out;
	}
	.cart-btn-box .promotion-alert.active {
		opacity: 1;
	}
	.cart-btn-box .cart-done-btn {
		font-size: 0.8rem;
		padding: 7px 36px 7px 17px;
		display: inline-flex;
		align-items: center;
		border-radius: 3px;
		text-align: center;
		background-color: #085217;
		color: #FFFFFF;
		position: relative;
		-webkit-transition: all 0.2s ease-in;
		-moz-transition: all 0.2s ease-in;
		-o-transition: all 0.2s ease-in;
		transition: all 0.2s ease-in;
	}
		.cart-btn-box .cart-done-btn span {
			width:auto;
			height: 14px;
			display: block;
			position: absolute;
			right: 17px;		
		}
			.cart-btn-box .cart-done-btn span svg {
				width:auto;
				height: 14px;
				display: block;
			}		
				.cart-btn-box .cart-done-btn span svg path{
					fill:#FFF;
				}		
		.cart-btn-box .cart-done-btn:hover {
			background-color: #1B7A2D;
			color: #FFFFFF;
		}
		.cart-btn-box .cart-done-btn:hover span {		
			animation: arrow-btn-hover 0.6s infinite;
		}	

/*---------------------------------------------------------------------------------------------------------*/
/*-CHECK OUT-------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.section-checkout {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    background-color: #FFF;
}
	.section-checkout .checkout-set {
		width: auto;
		max-width: 1300px;
		margin: 0 auto;
		height: auto;
		display: block;
		padding: 15px 25px 60px 25px;
	}
	.section-checkout .checkout-bill-box {
		width: 100%;
		height: auto;
		display: block;
		background-color: #FFF;
		padding : 20px;
		border: 3px solid #085217;
		border-left: 20px solid #085217;
		border-radius: 5px;
	}
		.section-checkout .checkout-bill-box .title {
			font-size: 0.7rem;
			font-weight: bold;
			color: #333;
			padding-bottom: 10px;
    		border-bottom: 2px solid #333;
			margin-bottom: 10px;
		}
		.recom-login-box {
			width: 100%;
			height: auto;
			display: block;
			padding: 10px;
			text-align: center;
			background-color: #F5F5F5;
			border-radius: 3px;
			margin-bottom: 10px;
		}
			.recom-login-box .text {
				width: auto;
				height: auto;
				display: inline-block;
				font-size: 0.7rem;
				color: #333;
				margin-right: 10px;
			}
			.recom-login-box .recom-login-btn {
				font-size: 0.8rem;
				padding: 7px 36px 7px 17px;
				display: inline-flex;
				align-items: center;
				border-radius: 3px;
				margin-top: 10px;
				text-align: center;
				background-color: #085217;
				color: #FFFFFF;
				position: relative;
				-webkit-transition: all 0.2s ease-in;
				-moz-transition: all 0.2s ease-in;
				-o-transition: all 0.2s ease-in;
				transition: all 0.2s ease-in;
			}
				.recom-login-box .recom-login-btn span {
					width:auto;
					height: 14px;
					display: block;
					position: absolute;
					right: 17px;		
				}
					.recom-login-box .recom-login-btn span svg {
						width:auto;
						height: 14px;
						display: block;
					}		
						.recom-login-box .recom-login-btn span svg path{
							fill:#FFF;
						}		
				.recom-login-box .recom-login-btn:hover {
					background-color: #1B7A2D;
					color: #FFFFFF;
				}
				.recom-login-box .recom-login-btn:hover span {		
					animation: arrow-btn-hover 0.6s infinite;
				}
		.checkout-bill-box .checkout-bill-input {
			width: 100%;
			height: auto;
			display: block;
			padding: 5px 0;
		}
			.checkout-bill-box .checkout-bill-input .input-heading {
				font-size: 0.7rem;
				color: #333;
			}
			.checkout-bill-box .checkout-bill-input input {
				height: 38px;
				width: 100%;
				border: 1px solid #085217;
				font-size: 0.7rem;
				border-radius: 3px;
				outline: none;
				padding: 10px;
			}
			.checkout-bill-box .checkout-bill-input textarea {
				width: 100%;
				border: 1px solid #085217;
				font-size: 0.7rem;
				border-radius: 3px;
				outline: none;
				display: block;
				margin: 0;
				padding: 10px;
				resize: none;
			}
			.checkout-bill-box .checkout-bill-btn-box {
				width: 100%;
				height: auto;
				display: flex;
				align-items: center;
				padding-top: 10px;
				border-top: 2px solid #333;
				margin-top: 10px;
			}
				.checkout-bill-box .checkout-bill-btn-box .checkout-bill-btn {
					font-size: 0.8rem;
					padding: 7px 36px 7px 17px;
					display: inline-flex;
					align-items: center;
					border-radius: 3px;
					text-align: center;
					background-color: #FF7A14;
					color: #FFFFFF;
					position: relative;
					-webkit-transition: all 0.2s ease-in;
					-moz-transition: all 0.2s ease-in;
					-o-transition: all 0.2s ease-in;
					transition: all 0.2s ease-in;
				}
					.checkout-bill-box .checkout-bill-btn-box .checkout-bill-btn span {
						width:auto;
						height: 14px;
						display: block;
						position: absolute;
						right: 17px;		
					}
						.checkout-bill-box .checkout-bill-btn-box .checkout-bill-btn span svg {
							width:auto;
							height: 14px;
							display: block;
						}		
							.checkout-bill-box .checkout-bill-btn-box .checkout-bill-btn span svg path{
								fill:#FFF;
							}		
					.checkout-bill-box .checkout-bill-btn-box .checkout-bill-btn:hover {
						background-color: #FF923F;
						color: #FFFFFF;
					}
					.checkout-bill-box .checkout-bill-btn-box .checkout-bill-btn:hover span {		
						animation: arrow-btn-hover 0.6s infinite;
					}
			.checkout-bill-box .checkout-bill-btn-box .checkout-alert {		
				font-size: 0.7rem;
				color: #E54242;
				margin-left: 20px;
			}
	.section-checkout .checkout-list-box {
		width: 100%;
		height: auto;
		display: inline-table;
		background-color: #FFF;		
		padding-top: 30px;
	}
	.checkout-list-box .title {
		font-size: 0.9rem;
		font-weight: bold;
		color: #333;
	}
	.checkout-list-box .checkout-list-header {
		width: 100%;
		height: auto;
		display: flex;
		font-size: 0.6rem;
		color: #333;
		font-weight: bold;
		border-top: 2px solid #333;
		border-bottom: 2px solid #333;
		margin-top: 10px;
	}
		.checkout-list-box .checkout-list-header .body {
			height: auto;
			display: block;
			padding: 5px 0;
		}
		.checkout-list-box .checkout-list-header .column-1 {
			width: 50%;
			display: block;
		}
		.checkout-list-box .checkout-list-header .column-2 {
			width: 20%;
			display: block;
			text-align: center;
		}
		.checkout-list-box .checkout-list-header .column-3 {
			width: 10%;
			display: block;
			text-align: center;
		}
		.checkout-list-box .checkout-list-header .column-4 {
			width:20%;
			display: block;
			text-align: center;
		}
	.checkout-list-box .checkout-list-list {
		width: 100%;
		height: auto;
		display: flex;		
		align-items: center;
   	 	border-bottom: 1px solid #085217;
	}
		.checkout-list-box .checkout-list-list .body {
			height: auto;
			display: block;
			font-size: 0.7rem;
			color: #333;
			padding: 10px 0;
		}
		.checkout-list-box .checkout-list-list .column-1 {
			width: 50%;
			display: flex;
			align-items: center;
		}
			.checkout-list-box .checkout-list-list .column-1 img {
				width: 50px;
				height: auto;
				display: inline-block;
				margin-right: 5px;
			}
			.checkout-list-box .checkout-list-list .column-1 a {
				color: #333;
			}
			.checkout-list-box .checkout-list-list .column-1 a:hover {
				color: #085217;
			}
		.checkout-list-box .checkout-list-list .column-2 {
			width: 20%;
			display: block;
			text-align: center;
		}
		.checkout-list-box .checkout-list-list .column-3 {
			width:10%;
			display: block;
			text-align: center;
		}
		.checkout-list-box .checkout-list-list .column-4 {
			width:20%;
			display: block;
			text-align: center;
		}
	.checkout-list-box .checkout-list-result {
		width: 100%;
		height: auto;
		display: block;		
		padding: 10px 0 ;
    	border-bottom: 2px solid #333;
	}	
		.checkout-list-box .checkout-list-result .checkout-result-title {
			font-size: 0.7rem;
			color: #111;
		}
		.checkout-list-box .checkout-list-result .checkout-result-text {
			font-size: 0.7rem;
			color: #111;
			display: inline-block;
		}
		.checkout-list-box .checkout-list-result .result-text-list {
			width: 100%;
			height: auto;
			display: flex;
			padding: 5px 0;
			align-items: baseline;
			font-size: 0.7rem;
		}
			.checkout-list-box .checkout-list-result .result-text-list .text {
				width: 50%;
				color: #333;
			}
			.checkout-list-box .checkout-list-result .result-text-list .cash {
				width: 50%;
				text-align: right;
				font-size: 0.8rem;
    			color: #111;
			}
			.checkout-list-box .checkout-list-result .result-text-list .disrate {
				width: 50%;
				text-align: right;
				color: #E54242;
				font-size: 0.8rem;
			}
			.checkout-list-box .checkout-list-result .result-text-list .all-cash {
				width: 50%;
				text-align: right;
				font-size: 1.1rem;
				font-weight: bold;
				color: #085217;
			}
/*---------------------------------------------------------------------------------------------------------*/
/*-THANK-YOU------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.section-thank {
	position: relative;
    display: block;
    width: 100%;
    height: auto;
    background-color: #FFF;
    background-position: center;
}
	.section-thank .section-thank-set {
		width: auto;
		
		margin: 0 auto;
		height: auto;
		min-height: 360px;
		display: flex;
		align-content: center;
		padding: 60px 20px;
	}
		.section-thank .section-thank-content {
			width: 100%;
   			height: auto;
			display: block;
			text-align: center;
		}
		.section-thank .title {			 
			font-size: 2rem;
			color: #111;
			margin: 0 0 0 0;
			position: relative;
			letter-spacing: 10px;
			text-align: center;
			justify-content: center;
		}
		.section-thank .title.re {			 
			font-size: 1.5rem;			
			letter-spacing: normal;
		}
		.section-thank .title.ps {			 
			color: #085217;
			letter-spacing: normal;
		}
		.section-thank .title-mini {			 
			font-size: 0.8rem;
			color: #666;
			margin: 0;
			position: relative;
			letter-spacing: 1px;
			text-align: center;
			justify-content: center;
		}
		.section-thank .detail-box {			 
			font-size: 0.8rem;
			color: #666;
			margin: 0 auto;
			position: relative;
			width: 700px;
			border: 4px solid #085217;
			height: auto;
			display: inline-block;
			margin-top: 40px;
			align-items: center;
			padding : 0;
			border-radius: 5px;
		}
		.section-thank .detail-box .detail-title {
			width: 100%;
			height: auto;
			display: block;
			font-size: 1rem;
			color: #FFF;
			background-color: #085217;
			padding: 15px;
		}
		.section-thank .detail-box .detail-detail {
			width: 100%;
			height: auto;
			display: block;
			padding: 25px 15px 15px 15px;
			font-size: 0.8rem;
   			color: #333;
		}
		.section-thank .detail-box .payment-box {
			width: 100%;
			height: auto;
			display: flex;
			padding: 10px;
			justify-content:  space-between;
			
		}
			.section-thank .detail-box .payment-box a {
				width: 32%;
				height: auto;
				display: block;
				padding: 15px 10px 10px 10px;
				border: 3px solid #DDD;
				font-size: 0.8rem;
				border-radius: 5px;
				text-align: center;
				color: #666;
				-webkit-transition: all 0.1s ease-in;
				-moz-transition: all 0.1s ease-in;
				-o-transition: all 0.1s ease-in;
				transition: all 0.1s ease-in;
			}
				.section-thank .detail-box .payment-box a span {
					width: 100%;
					height: 50px;
					display: block;
					text-align: center;
					margin-bottom: 10px;
				}
				.section-thank .detail-box .payment-box a span svg {
					width: auto;
					height: 50px;
					display: inline-block
				}
				.section-thank .detail-box .payment-box a span svg g {
					fill: #666;
					-webkit-transition: all 0.1s ease-in;
					-moz-transition: all 0.1s ease-in;
					-o-transition: all 0.1s ease-in;
					transition: all 0.1s ease-in;
				}
			.section-thank .detail-box .payment-box a:hover {
				border: 3px solid #74A67E;
			}
			.section-thank .detail-box .payment-box a.active {
				border: 3px solid #085217;
				color: #085217;
				background-color: #E2F4E5;
			}
				.section-thank .detail-box .payment-box a.active span svg g {
					fill: #085217;
				}
			.section-thank .detail-box .payment-confirm-box {
				width: 100%;
				height: auto;
				display: block;
				text-align: center;
				padding: 10px 0 15px 0;
			}
				.section-thank .detail-box .payment-confirm-box a {
					width: auto;
					height: auto;
					display: inline-block;
					text-align: center;
					font-size: 1rem;
					background-color: #085217;
					padding: 10px 30px 10px 30px;
					color: #FFF;
					border-radius: 5px;
				}
				.section-thank .detail-box .payment-confirm-box a:hover {
					color: #FFF;
					background-color: #0C5E1C;
				}
		.section-thank .installment-bank {
			width: 100%;
			height: auto;
			display: none;
			padding: 0 10px 10px 10px;
		}
			.section-thank .installment-bank h4 {
				width: 100%;
				height: auto;
				display: block;
				color: #333;
				margin: 0 0 0 0;
				padding: 10px 0 10px 0;
				border-top: 3px solid #085217;
			}
			.section-thank .installment-bank .bank-order-box {
				width: 100%;
				height: auto;
				display: flex;
				justify-content: space-between;
			}
				.section-thank .installment-bank .bank-order-box .bank-list {
					width: 19%;
					height: auto;
					text-align: center;
					display: block;
					cursor: pointer;
				}
					.section-thank .installment-bank .bank-order-box .bank-list img {
						width: 100%;
						height: auto;
						display: block;
						border-radius: 10px;
						border: 5px solid rgba(0,0,0,0);
						-webkit-transition: all 0.1s ease-in;
						-moz-transition: all 0.1s ease-in;
						-o-transition: all 0.1s ease-in;
						transition: all 0.1s ease-in;
					}
					.section-thank .installment-bank .bank-order-box .bank-list p {
						font-size: 0.65rem;
						margin: 5px 0 0 0;
						color: #666;
						-webkit-transition: all 0.1s ease-in;
						-moz-transition: all 0.1s ease-in;
						-o-transition: all 0.1s ease-in;
						transition: all 0.1s ease-in;
					}
				.section-thank .installment-bank .bank-order-box .bank-list:hover img {					
						border: 5px solid rgba(0,0,0,0.2);
				}
				.section-thank .installment-bank .bank-order-box .bank-list.active img {					
						border: 5px solid #389B49;
				}
				.section-thank .installment-bank .bank-order-box .bank-list.active p {					
						color: #111;
				}
		.section-thank .payment-credit {
			padding: 20px 0 0 0;
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 0.7rem;
			font-weight: bold;
			color: #333;
		}
		.section-thank .payment-credit img {
			width: 160px;
			height: auto;
			display: block;
			margin-bottom: 2px;
			margin-left: 10px;
		}
/*---------------------------------------------------------------------------------------------------------*/
/*-ABOUT-US--------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.section-about-body {
	position: relative;
    display: block;
    width: 100%;
    height: auto;
}
	.section-about-body .about-header-box {
		position: relative;
		display: block;
		width: 100%;
		height: auto;
		background-image: url("../img/objects/about-header.jpg");
		background-position: center;
		background-size:  100% auto ;
		padding: 150px 0;
	}
	.section-about-body .section-about-set {
		width: auto;
		
		margin: 0 auto;
		height: auto;
		display: block;
		padding: 30px 20px 60px 20px;
	}
	.section-about-body .head-logo {
		display: inline-flex;
		width: auto;
		height: auto;
		align-items: center;
		margin: 0 auto;		
		position: relative;
	}
		.section-about-body .head-logo img {
			display: inline-block;
			width: 100px;
			height: auto;
			margin-right: 10px;
		}
		.section-about-body .head-logo p {
			font-family: Kanyanut;
			font-size: 2rem;
			color: #085217;
			font-weight: bold;
			display: block;
			line-height: 30px;
		}
		.section-about-body .head-logo span {
			font-family: Kanyanut;
			font-size: 1.4rem;
			color: #333;
			display: block;
			line-height: 30px;
			padding-left: 5px;
		}
	.section-about-body .about-detail-box {
		width: 100%;
		height: auto;
		display: flex;
	}
		.section-about-body .about-detail-box .left {
			width: 50%;
			height: auto;
			display: block;
			padding-right: 50px;
		}
		.section-about-body .about-detail-box .right {
			width: 50%;
			height: auto;
			display: block;
			padding-left: 50px;
		}
	.section-about-body .detail-text {
		 
		font-size: 0.8rem;
		color: #777;
		margin: 30px 0 30px  0;
		text-indent: 20px;
	}
	.section-about-body .detail-title {
		 
		font-size: 0.8rem;
		color: #111;
		margin: 0 0 10px  0;
	}
	.section-about-body .address-text {
		 
		font-size: 0.8rem;
		color: #777;
		margin: 0 0 5px  0;
	}
	.section-about-body .about-map {
		width: 100%;
		height: 400px;
	}
		.section-about-body .about-map iframe {		
			overflow: hidden;
			height: 400px;
			display: block;
		}
	.section-about-body .icon-link-btn {
		 
		font-size: 0.8rem;
		display: flex;
		margin: 5px 0 ;
		color: #777;
		align-items: center;
		position: relative;
		padding-left: 30px;
	}
		.section-about-body .icon-link-btn span {
			width:auto;
			height: 20px;
			display: block;
			position: absolute;
			left: 0;		
		}
			.section-about-body .icon-link-btn span svg {
				width:auto;
				height: 20px;
				display: block;
			}		
				.section-about-body .icon-link-btn span svg path{
					fill:#777;
				}	
		.section-about-body .icon-link-btn:hover {
			color: #111;
		}
		.section-about-body .icon-link-btn:hover span svg path {
			fill: #111;
		}
	.section-about-body .bank-info {
		width: 100%;
		height: auto;
		display: flex;
		position: relative;
		padding-left: 55px;
		align-items: center;
		margin-bottom: 15px;
	}
		.section-about-body .bank-info img {
			width: 50px;
			height: auto;
			display: inline-block;
			position: absolute;
			left: 0;
		}
		.section-about-body .bank-info p {
			font-size: 0.7rem;
			color: #777;
		}
		.section-about-body .bank-info p span {
			width: 100px;
			display: inline-block;
			text-align: right;
			padding-right: 10px;
		}
/*---------------------------------------------------------------------------------------------------------*/
/*-GALLERY----------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.section-gallery-body {
	position: relative;
    display: block;
    width: 100%;
    height: auto;
    background-color: #FFF;
}
	.section-gallery-body .section-gallery-set {
		width: auto;
		
		margin: 0 auto;
		height: auto;
		min-height: 330px;
		display: block;
		padding: 0 20px 60px 20px;
	}
	.section-gallery-body .gallery-board-bar {
		width: 100%;
		height: auto;
		padding: 0;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		display: -webkit-box;
		display: -webkit-flex;
		display: -moz-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-flex: 0;
		-moz-box-flex: 0;
		-webkit-box-direction: normal;
		-moz-box-direction: normal;
		-webkit-flex: 0 1 auto;
		-ms-flex: 0 1 auto;
		flex: 0 1 auto;
		-webkit-box-orient: horizontal;
		-webkit-flex-direction: row;
		-moz-box-orient: horizontal;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;		
	}
		.section-gallery-body .gallery-board-grid {
			width: 25%;
			height: auto;
			padding: 5px;
			box-sizing: border-box;
			-webkit-box-flex: 0;
			-webkit-flex: 0 0 auto;
			-moz-box-flex: 0;
			-ms-flex: 0 0 auto;
			flex: 0 0 auto;
		}
		.section-gallery-body .gallery-img-box {
			width: 100%;
			height: auto;
			display: block;
			position: relative;
			overflow: hidden;
			-webkit-transition: all 0.2s ease-in;
			-moz-transition: all 0.2s ease-in;
			-o-transition: all 0.2s ease-in;
			transition: all 0.2s ease-in;
			cursor: pointer;
		}
			.section-gallery-body .gallery-img-box img {
				width: 100%;
				height: auto;
				display: block;
				position: relative;
				overflow: hidden;
				-webkit-transition: all 0.2s ease-in;
				-moz-transition: all 0.2s ease-in;
				-o-transition: all 0.2s ease-in;
				transition: all 0.2s ease-in;
			}
		.section-gallery-body .gallery-detail {
			display: none;
		}
		.section-gallery-body .gallery-img-box:hover img  {
			transform: scale(1.05);
		}
/*---------------------------------------------------------------------------------------------------------*/
/*-PAYMENT---------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.section-payment-page {
	position: relative;
    display: block;
    width: 100%;
    height: auto;
    background-position: center;
}
	.section-payment-page .section-payment-set {
		width: auto;		
		margin: 0 auto;
		height: auto;
		min-height: 450px;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 45px 25px 10px 25px;
	}
	.section-payment-page .section-payment-bank-set {
		width: auto;
		margin: 0 auto;
		height: auto;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 5px 25px 45px 25px;
	}
		.section-payment-page .payment-bank-box {
			width: 90%;
			height: auto;
			display: inline-block;
			border-radius: 5px;
		}
			.section-payment-page .payment-bank-box .bank-box {
				width: 100%;
				height: auto;
				display: flex;
				padding: 10px 0;
				border-bottom: 1px solid #EEE;
			}
			.section-payment-page .payment-bank-box .bank-box:last-of-type {
				padding: 10px 0 0 0;
				border-bottom: none;
			}
				.section-payment-page .payment-bank-box .bank-box .cover {
					width: 30%;
					height: auto;
					display: block;
				}
				.section-payment-page .payment-bank-box .bank-box .detail {
					width: 70%;
					height: auto;
					display: flex;
					align-items: center;
					padding-left: 10px;
				}
				.section-payment-page .payment-bank-box .bank-box .bank {
					width: 100%;
					font-size: 0.8rem;
					font-weight: bold;
					color: #333;
					margin: 0;
				}
				.section-payment-page .payment-bank-box .bank-box .name {
					width: 100%;
					font-size: 0.7rem;
					color: #333;
					margin: 0;
				}
				.section-payment-page .payment-bank-box .bank-box .number{
					width: 100%;
					font-weight: bold;
					font-size: 1rem;
					color: #085217;
					margin: 0;
				}
	
	
	.section-payment-page .section-payment-box {
		width: 90%;
		height: auto;
		display: inline-block;
		background-color: #FFF;
		border-radius: 5px;
		padding: 30px 20px 20px 20px;
		border: 3px solid #085217;
		overflow: hidden;
	}
	.section-payment-box .title-box {
		width: 100%;
		height: auto;
		display: flex;
		align-items: center;
		padding-bottom: 20px;
		border-bottom: 2px solid #333;
		margin-bottom: 36px;
		position: relative;
	}
	.section-payment-box .member-login-btn {
		 
		font-size: 0.7rem;
		width: auto;
		height: auto;
		display: inline-block;
		position: absolute;
		color: #FFF;
		padding: 3px 10px;
		border-radius: 3px;
		background-color: #333;
		right: 0;
		top: -3px;
	}
		.section-payment-box .member-login-btn:hover {
			background-color: #1B7A2D;
		}
	.section-payment-box .title-box p {
		 
		font-size: 0.9rem;
   		font-weight: bold;
    	color: #333;
		margin: 0;
		line-height: 15px;
	}
	.section-payment-box .title-box span {
		 
		font-size: 0.7rem;
		color: #666;
	}
	.section-payment-box .section-payment-thankyou {
		width: 100%;
		height: auto;
		min-height: 300px;
		margin-bottom: 20px;
		display: none;
		align-items: center;
		justify-content: center;		
	}
	.section-payment-box .section-payment-thankyou .title-thankyou p {
		 
		font-size: 1.2rem;
		text-align: center;
		font-weight: bold;
		color: #111;
		margin: 0 0 20px 0;
	}
	.section-payment-box .section-payment-thankyou .title-thankyou span {
		 
		font-size: 0.8rem;
		color: #666;
	}
	.section-payment-box .section-payment-input {
		width: 100%;
		height: auto;
		display: flex;
	}
		.section-payment-box .section-payment-input .left {
			width: 50%;
			height: auto;
			display: block;
			padding-right: 10px;
		}
		.section-payment-box .section-payment-input .right {
			width: 50%;
			height: auto;
			display: block;
			padding-left: 10px;
		}
	.section-payment-box .login-input-box {
		width: 100%;
		height: auto;
		display: block;
		padding: 5px 0;
	}
		.section-payment-box .login-input-box .input-heading {
			 
			font-size: 0.7rem;
			color: #111;
		}
		.section-payment-box .login-input-box input {
			 
			height: 38px;
			width: 100%;
			border: 1px solid #085217;
			font-size: 0.7rem;
			border-radius: 3px;
			outline: none;
			padding: 10px;
		}
	.section-payment-box select {
		 
		height: 38px;
		width: 100%;
		border: 1px solid #085217;
		font-size: 0.7rem;
		border-radius: 3px;
		outline: none;
		padding: 5px;
	}
	.section-payment-box .upload-line {
		width: 100%;
		height: auto;
		display: flex;
		align-items: center;
	}
	.section-payment-box input[type=file] {
		display: none;
	}
	.section-payment-box .upload-btn {
		height: 38px;
		 
		font-size: 0.8rem;
		display: inline-flex;
		border-radius: 3px;
		outline: none;
		align-items: center;
		justify-content: center;
		padding: 0 15px;
		background-color: #FF6E0C;
		color: #FFF;
		margin-right: 10px;
	}
	.section-payment-box .upload-btn.disable {
		opacity: 0.5;
		pointer-events: none;
	}
	.section-payment-box .img-example {
		color: #1B7A2D;
		 
		font-size: 0.7rem;
		font-weight: bold;
	}
		.section-payment-box .upload-btn:hover {
			background-color: #FF8431;
   			color: #FFF;
		}

	.section-payment-box .section-payment-btn-box {
		width: 100%;
		height: auto;
		display: flex;
		align-items: center;
		position: relative;
		padding: 50px 0 0 0;
	}
	.section-payment-box .section-payment-btn-box .left {
		width: 50%;
		height: auto;
		display: block;
	}
	.section-payment-box .section-payment-btn-box .right {
		width: 50%;
		height: auto;
		display: block;
   		text-align: right;
	}
	.section-payment-box .section-payment-btn-box .payment-alert-text {
		width: 100%;
		height: auto;
		display: block;
		border-radius: 3px;
		 
		font-size: 0.7rem;
		color: #FFF;
		padding: 8px 15px;
		background-color: #E34245;
		text-align: center;
		position: absolute;
		top: 5px;
		transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		opacity: 0;
	}
	.section-payment-box .section-payment-btn-box .payment-sent-btn {
		 
		font-size: 0.8rem;
		padding: 7px 36px 7px 17px;
		display: inline-flex;
		align-items: center;
		border-radius: 3px;
		text-align: center;
		background-color: #085217;
		color: #FFFFFF;
		position: relative;
		-webkit-transition: all 0.2s ease-in;
		-moz-transition: all 0.2s ease-in;
		-o-transition: all 0.2s ease-in;
		transition: all 0.2s ease-in;
	}
		.section-payment-box .section-payment-btn-box .payment-sent-btn span {
			width:auto;
			height: 14px;
			display: block;
			position: absolute;
			right: 17px;		
		}
			.section-payment-box .section-payment-btn-box .payment-sent-btn span svg {
				width:auto;
				height: 14px;
				display: block;
			}		
				.section-payment-box .section-payment-btn-box .payment-sent-btn span svg path{
					fill:#FFF;
				}		
		.section-payment-box .section-payment-btn-box .payment-sent-btn:hover {
			background-color: #1B7A2D;
			color: #FFFFFF;
		}
		.section-payment-box .section-payment-btn-box .payment-sent-btn:hover span {		
			animation: arrow-btn-hover 0.6s infinite;
		}	
/*---------------------------------------------------------------------------------------------------------*/
/*-MEMBER AREA----------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
	.section-member-login {
		position: relative;
		display: block;
		width: 100%;
		height: auto;
	}
		.section-member-login .member-login-set {
			width: auto;
			
			margin: 0 auto;
			height: auto;
			min-height: 450px;
			display: flex;
			align-items: center;
			justify-content: center;
			padding: 45px 25px 60px 25px;
		}
		.section-member-login .member-login-box {
			width: 80%;
			height: auto;
			display: inline-block;
			background-color: #FFF;
			border-radius: 5px;
			padding: 30px 20px 20px 20px;
			overflow: hidden;
			border: 3px solid #085217;
		}
		.member-login-box .title-box {
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			padding-bottom: 20px;
			border-bottom: 2px solid #333;
			margin-bottom: 36px;
			position: relative;
		}
			.member-login-box .title-box img {
				width: 50px;
				height: auto;
				display: inline-block;
				margin-right: 10px;
			}
			.member-login-box .title-box p {
				font-size: 0.9rem;
				font-weight: bold;
				color: #333;
				margin: 0;
				line-height: 15px;
			}
			.member-login-box .title-box span {
				font-size: 0.7rem;
				color: #666;
			}
		.member-login-box .member-login-register {
			 
			font-size: 0.7rem;
			width: auto;
			height: auto;
			display: inline-block;
			position: absolute;
			color: #FFF;
			padding: 3px 10px;
			border-radius: 3px;
			background-color: #333;
			right: 0;
			top: -3px;
		}
			.member-login-box .member-login-register:hover {				
				background-color: #1B7A2D;
			}
		.member-login-box .login-input-box {
			width: 100%;
			height: auto;
			display: block;
			padding: 5px 0;
		}
			.member-login-box .login-input-box .input-heading {
				font-size: 0.7rem;
				color: #111;
			}
			.member-login-box .login-input-box input {
				height: 38px;
				width: 100%;
				border: 1px solid #085217;
				font-size: 0.7rem;
				border-radius: 3px;
				outline: none;
				padding: 10px;
			}
		.member-login-box .member-login-btn-box {
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			position: relative;
			padding: 50px 0 0 0;
		}
			.member-login-box .member-login-btn-box .member-alert-text {
				width: 100%;
				height: auto;
				display: block;
				border-radius: 3px;
				font-size: 0.7rem;
				color: #FFF;
				padding: 8px 15px;
				background-color: #E34245;
				text-align: center;
				position: absolute;
				top: 5px;
				transition: all 0.2s ease-in-out;
				-moz-transition: all 0.2s ease-in-out;
				-webkit-transition: all 0.2s ease-in-out;
				-o-transition: all 0.2s ease-in-out;
				opacity: 0;
			}
			.member-login-box .member-login-btn-box .left {
				width: 50%;
				height: auto;
				display: block;
			}
			.member-login-box .member-login-btn-box .right {
				width: 50%;
				height: auto;
				display: block;
				text-align: right;
			}
			
			.member-login-box .member-login-btn-box .member-login-btn {
				font-size: 0.8rem;
				padding: 7px 36px 7px 17px;
				display: inline-flex;
				align-items: center;
				border-radius: 3px;
				text-align: center;
				background-color: #085217;
				color: #FFFFFF;
				position: relative;
				-webkit-transition: all 0.2s ease-in;
				-moz-transition: all 0.2s ease-in;
				-o-transition: all 0.2s ease-in;
				transition: all 0.2s ease-in;
			}
				.member-login-box .member-login-btn-box .member-login-btn span {
					width:auto;
					height: 14px;
					display: block;
					position: absolute;
					right: 17px;		
				}
					.member-login-box .member-login-btn-box .member-login-btn span svg {
						width:auto;
						height: 14px;
						display: block;
					}		
						.member-login-box .member-login-btn-box .member-login-btn span svg path{
							fill:#FFF;
						}		
				.member-login-box .member-login-btn-box .member-login-btn:hover {
					background-color: #1B7A2D;
					color: #FFFFFF;
				}
				.member-login-box .member-login-btn-box .member-login-btn:hover span {		
					animation: arrow-btn-hover 0.6s infinite;
				}	
		.member-login-box .member-login-btn-box .right .member-forget-btn {
			 
			font-size: 0.7rem;
			color: #333;
			font-weight: bold;
		}
		.member-login-box .member-login-btn-box .right .member-forget-btn:hover {
			text-decoration: underline;
			color: #085217;
		}
	.section-member-page {
		position: relative;
		display: block;
		width: 100%;
		height: auto;
	}
		.section-member-page .section-member-set {
			width: auto;
			
			margin: 0 auto;
			height: auto;
			display: block;
			padding: 5px 25px 60px 25px;
		}
		.section-member-page .section-member-body {
			width: 100%;
			height: auto;
			display: block;
		}
		.section-member-page .section-member-header-box {
			width: 100%;
			height: auto;
			display: flex;
			padding-bottom: 13px;
			border-bottom: 2px solid #333;
			margin-bottom: 20px;
		}
			.section-member-page .section-member-header-box a {
				width: auto;
				height: auto;
				display: inline-block;
				margin: 0 15px 0 0;
				font-weight: bold;
				font-size: 0.7rem;
				color: #333;
				position: relative;
			}
				.section-member-page .section-member-header-box a:hover {
					color: #157428;
				}
			.section-member-page .section-member-header-box a.logout {
				color: #EF6903;
			}
				.section-member-page .section-member-header-box a.logout:hover {
					color: #FF923F;
				}
			.section-member-page .section-member-header-box a.active {
				color: #111;
				pointer-events: none;
				text-decoration: underline;
			}
		.section-member-page .member-set-center {
			width: 100%;
			height: auto;
			display: flex;
			justify-content: center;
		}
		.section-member-page .section-member-detail-box {
			width: 100%;
			height: auto;
			display: block;
		}

		.section-member-detail-box .member-title {
			 
			font-size: 0.7rem;
			color: #111;
			font-weight: bold;
		}
		.section-member-detail-box .member-order-list {
			width: 100%;
			height: auto;
			display: inline-table;
			background-color: #FFF;
			border: 1px solid #085217;
			border-radius: 3px;
			overflow: hidden;
			margin-top: 10px;
		}
			.member-order-list .member-order-title {
				font-size: 0.7rem;
				color: #FFF;
				padding: 5px 10px;
				background-color: #085217;
			}
			
			.member-order-list .member-order-header {
				width: 100%;
				height: auto;
				display: flex;		
				align-items: center;
				background-color: #F5F5F5;
				padding: 0 10px ;
			}
				.member-order-list .member-order-header .body {
					height: auto;
					display: block;
					 
					font-size: 0.6rem;
					color: #333;
					padding: 3px 0;
				}
				.member-order-list .member-order-header .column-1 {
					width: 50%;
					display: block;
				}
				.member-order-list .member-order-header .column-2 {
					width: 20%;
					display: block;
					text-align: center;
				}
				.member-order-list .member-order-header .column-3 {
					width: 10%;
					display: block;
					text-align: center;
				}
				.member-order-list .member-order-header .column-4 {
					width:20%;
					display: block;
					text-align: center;
				}
		.member-order-list .member-order-list-list {
			width: 100%;
			height: auto;
			display: flex;		
			align-items: center;
			padding: 0 10px ;
			border-bottom: 1px solid #085217;
		}
			.member-order-list .member-order-list-list .body {
				height: auto;
				display: block;
				font-size: 0.7rem;
				color: #333;
				padding: 10px 0;
			}
			.member-order-list .member-order-list-list .column-1 {
				width: 50%;
				display: block;
			}
				.member-order-list .member-order-list-list .column-1 img {
					width: 50px;
					height: auto;
					display: inline-block;
					margin-right: 5px;
				}
			.member-order-list .member-order-list-list .column-2 {
				width: 20%;
				display: block;
				text-align: center;
			}
			.member-order-list .member-order-list-list .column-3 {
				width:10%;
				display: block;
				text-align: center;
			}
			.member-order-list .member-order-list-list .column-4 {
				width:20%;
				display: block;
				text-align: center;
			}
	.member-order-list .member-order-list-result {
		width: 100%;
		height: auto;
		display: flex;		
		background-color: #F5F5F5;
		padding: 10px ;
	}	
		.member-order-list .member-order-list-result .left {
			width: 50%;
			height: auto;
			display: block;
		}
		.member-order-list .member-order-list-result .right {
			width: 50%;
			height: auto;
			display: block;
			padding-left: 20px;
		}
		.member-order-list .member-order-list-result .member-result-title {
			 
			font-size: 0.7rem;
			color: #444;
		}
			.member-order-list .member-order-list-result .member-result-title span {
				font-weight: bold;
				color: #111;
			}
			.member-order-list .member-order-list-result .member-result-title a {
				width: auto;
				height: auto;
				padding: 5px 15px;
				border-radius: 3px;
				margin-left: 10px;
				background-color: #085217;
				color: #FFF;
				display: inline-block;
			}
			.member-order-list .member-order-list-result .member-result-title a:hover {
				color: #FFF;
    			background-color: #0C5E1C;
			}
		.member-order-list .member-order-list-result .member-result-text {
			 
			font-size: 0.7rem;
			color: #FFF;
			display: inline-block;
			padding: 5px 13px;
			border-radius: 3px;
			background-color: #666;
		}
		.member-order-list .member-order-list-result .member-result-list {
			width: 100%;
			height: auto;
			display: flex;
			align-items: baseline;
			 
			font-size: 0.7rem;
		}
			.member-order-list .member-order-list-result .member-result-list .text {
				width: 50%;
				color: #333;
			}
			.member-order-list .member-order-list-result .member-result-list .cash {
				width: 50%;
				text-align: right;
				color: #111;
			}
			.member-order-list .member-order-list-result .member-result-list .disrate {
				width: 50%;
				text-align: right;
				color: #E54242;
			}
			.member-order-list .member-order-list-result .member-result-list .all-cash {
				width: 50%;
				text-align: right;
				font-size: 0.9rem;
				font-weight: bold;
				color: #085217;
			}
	.section-member-page .member-input {
			width: 100%;
			height: auto;
			display: block;
			padding: 5px 0;
		}
			.section-member-page .member-input .input-heading {
				font-size: 0.7rem;
				color: #333;
				display: block;
			}
			.section-member-page .member-input input {
				height: 38px;
				width: 530px;
				border: 1px solid #085217;
				font-size: 0.7rem;
				border-radius: 3px;
				outline: none;
				padding: 10px;
			}
			.section-member-page .member-input textarea {				
				width: 530px;
				border: 1px solid #085217;
				font-size: 0.7rem;
				border-radius: 3px;
				outline: none;
				display: block;
				margin: 0;
				padding: 10px;
				resize: none;
			}
			.section-member-page .member-input-btn-box {
				width: 100%;
				height: auto;
				display: flex;
				align-items: center;
				padding-top: 10px;
				border-top: 2px solid #333;
				margin-top: 10px;
			}
				.section-member-page .member-input-btn-box .member-input-btn {
					 
					font-size: 0.8rem;
					padding: 7px  17px;
					display: inline-flex;
					align-items: center;
					border-radius: 3px;
					text-align: center;
					background-color: #085217;
					color: #FFFFFF;
					position: relative;
					-webkit-transition: all 0.2s ease-in;
					-moz-transition: all 0.2s ease-in;
					-o-transition: all 0.2s ease-in;
					transition: all 0.2s ease-in;
				}
					
					.section-member-page .member-input-btn-box .member-input-btn:hover {
						background-color: #1B7A2D;
						color: #FFFFFF;
					}
				.section-member-page .member-input-btn-box .member-alert {
					 
					font-size: 0.8rem;
					margin-left: 10px;
					color: #E54242;
				}
/*---------------------------------------------------------------------------------------------------------*/
/*-CONTROL---------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.control-index {
	width: 100%;
	height: auto;
	background-color: #24262D;
}
.control-set {
	width: auto;
	
	margin: 0 auto;
	height: auto;
	display: block;
}
.control-page {
	width: 100%;
	height: auto;
	min-height: 100vh;
	display: block;
	padding: 0 0;
	position: relative;
}
.control-content {
	width: 100%;
	height: 100%;
	min-height: 780px;
	display: block;
	padding: 20px 25px;
	background-color: #2A2D35;
}
.control-content.mini-tab {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
}
	.control-content .control-title {
		width: 100%;
		height: auto;
		font-size: 0.8rem;
		margin-bottom: 10px;
		padding-bottom: 10px;
		color: #FFF;
		border-bottom: 2px solid #757D84;
	}
	.control-content .control-subtitle {
		width: 100%;
		height: auto;			
		font-size: 0.7rem;
		color: #757D84;
		margin-bottom: 10px;
	}
	.control-content .control-btn {
		width: auto;
		height: auto;
		display: inline-block;
		font-size: 0.6rem;
		text-transform: uppercase;
		transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		border-radius: 3px;
		padding: 7px 15px;
		background-color: #1B83FF;
		color: #FFF;
	}
		.control-content .control-btn:hover {
			background-color:  #1270E1;
			color: #FFF;
		}
	.control-content .control-red-btn {
		width: auto;
		height: auto;
		display: inline-block;
		font-size: 0.7rem;
		float: right;
		text-transform: uppercase;
		transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		border-radius: 3px;
		padding: 7px 15px;
		background-color: #B53744;
		color: #FFF;
	}
		.control-content .control-red-btn:hover {
			background-color:  #D44A58;
			color: #FFF;
		}		
/*-----------------------------------------------------------------------------*/
/*-SWITCH-------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------*/
.switch {
	width: auto;
	height: auto;
	display: inline-flex;
	align-items: center;
	padding: 5px 10px 5px 20px;
	border-radius: 3px;
	font-family: thsarabun, "Helvetica Neue", Helvetica, Roboto ,Arial, sans-serif;
	background-color: #333949;
	font-size: 0.55rem;
	font-weight: bold;
	color: #505973;
	position: relative;	
	 -webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
}
	.switch span {
		width: 6px;
		height: 6px;
		display: block;
		border-radius: 50%;
		position: absolute;
		left: 8px;
		background-color: #505973;		
		 -webkit-transition: all 0.2s ease-in;
		-moz-transition: all 0.2s ease-in;
		-o-transition: all 0.2s ease-in;
		transition: all 0.2s ease-in;
	}
.switch:hover {
	color: #D1D4DC;
}
	.switch:hover span {
		background-color: #D1D4DC;
	}
.switch.active {
	color: #FFF;
	background-color: #1B83FF;
}
	.switch.active span {
		background-color: #EBFF1C;
	}
.switch.active:hover {
	background-color: #0E74ED;
}
/*---------------------------------------------------------------------------------------------------------*/
/*-CONTROL-TABLE-------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.control-content .control-table {
		width: 100%;
		height: auto;
		display: block;
		font-size: 0.7rem;
		 
		background-color: #464A55;
		color: #FFF;
		margin-top: 10px;
		border-radius: 3px;
		transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		overflow: hidden;
}	
	.control-content .control-table .header-side {
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			padding: 0 10px;
	}		
		.control-content .control-table .header-side .body {
			height: auto;
			display: block;
			padding: 10px 0;
		}
	.control-content .control-table .title-side {
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			padding: 0 10px;
			background-color: #393C44;
			color: #545864;

	}
		.control-content .control-table .title-side .body {
			height: auto;
			display: block;
			padding: 5px 0;
			font-size: 0.4rem;
		}
	.control-content .control-table .body-side {
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			padding: 0 10px;
			font-size: 0.5rem;
			color: #DBDBDD;
			background-color:  #393C44;
	}
	.control-content .control-table .body-side:hover {
			background-color: #3E4149;
			color: #FFF;
	}
		.control-content .control-table .body-side .body {
			height: auto;
			display: block;
			padding: 10px 0;
		}
	.control-content .control-table .body-side.active {
			background-color: #4A4F5A;
			color: #FFF;
	}
	.control-content .control-table .order-body-side {
			width: 100%;
			height: auto;
			display: block;
	}	
	.control-content .control-table .order-body-detail {
			width: 100%;
			height: auto;
			display: none;
			padding: 20px;
			background-color: #4A4F5A;
	}	
	.control-content .control-table .order-body-detail.active {
			display: block;
	}	
		.control-content .control-table .order-body-detail .top {
			width: 100%;
			height: auto;
			display: block;
		}	
			.control-content .control-table .order-body-detail .top .left {
				width: 100%;
				height: auto;
				display: block;
			}	
			.control-content .control-table .order-body-detail .top .right {
				width: 100%;
				height: auto;
				display: block;
				padding-top: 10px;
			}	
		.control-content .control-table .order-body-detail .order-title {
			font-size: 0.7rem;
			margin-bottom: 10px;
		}	
		.control-content .control-table .order-body-detail .order-table-list {
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			padding: 0;
			border-top: 1px solid #5A5D63;
			border-left: 1px solid #5A5D63;
			border-right: 1px solid #5A5D63;
		}	
		.control-content .control-table .order-body-detail .order-table-list:last-of-type {
			border-bottom: 1px solid #5A5D63;
		}	
			.control-content .control-table .order-body-detail .order-table-list .left {
				width: 30%;
				height: auto;
				display: block;
				text-align: right;
				padding: 5px 10px;
				font-size: 0.65rem;
				color: #DBDBDD;
			}	
			.control-content .control-table .order-body-detail .order-table-list .right {
				width: 70%;
				height: auto;
				display: block;
				text-align: left;
				border-left: 1px solid  #5A5D63;
				padding: 5px 10px;
				font-size: 0.65rem;
				color: #DBDBDD;
			}	
			.control-content .control-table .order-body-detail .order-table-list .right span.red {
				color: #ff6969;
			}
			.control-content .control-table .order-body-detail .order-table-list .right span.green {
				color: #90ff69;
			}	
			.control-content .control-table .order-body-detail .order-table-list .right a {
				color: #FFD868;
				display: inline-block;
				margin-right: 5px;
			}	
			.control-content .control-table .order-body-detail .order-table-list .right a:hover {
				text-decoration: underline;
			}	
			.control-content .control-table .order-body-detail .order-table-list .head-column {
				height: auto;
				display: block;
				padding: 5px 10px;
				font-size: 0.6rem;
				color: #FFF;
			}	
			.control-content .control-table .order-body-detail .order-table-list .head-column.column-1 {
				width: 40%;
			}	
			.control-content .control-table .order-body-detail .order-table-list .head-column.column-2{
				width: 20%;
				text-align: center;
			}
			.control-content .control-table .order-body-detail .order-table-list .head-column.column-3 {
				width: 20%;
				text-align: center;
			}
			.control-content .control-table .order-body-detail .order-table-list .head-column.column-4 {
				width: 20%;
				text-align: center;
			}
			.control-content .control-table .order-body-detail .order-table-list .body-column {
				height: auto;
				display: block;
				padding: 10px;
				font-size: 0.65rem;
				color: #DBDBDD;
			}	
			.control-content .control-table .order-body-detail .order-table-list .body-column.column-1 {
				width: 40%;
				align-items: center;
				display: flex;
			}	
				.control-content .control-table .order-body-detail .order-table-list .body-column.column-1 a {
					width: 50px;
					height: auto;
					display: inline-block;
					margin-right: 10px;
				}	
				.control-content .control-table .order-body-detail .order-table-list .body-column.column-1 a:hover {
				opacity: 0.8;
				}	
			.control-content .control-table .order-body-detail .order-table-list .body-column.column-2 {
				width: 20%;
				text-align: center;
			}	
			.control-content .control-table .order-body-detail .order-table-list .body-column.column-3 {
				width: 20%;
				text-align: center;
			}	
			.control-content .control-table .order-body-detail .order-table-list .body-column.column-4 {
				width: 20%;
				text-align: center;
			}	
			.control-content .control-table .order-body-detail .order-table-list .result-column {
				height: auto;
				display: block;
				padding: 0 10px;
				font-size: 0.65rem;
				color: #DBDBDD;
			}	
			.control-content .control-table .order-body-detail .order-table-list .result-column.column-1 {
				width: 80%;
				text-align: right;
				padding: 5px 10px;
    			border-right: 1px solid  #5A5D63;
			}	
			.control-content .control-table .order-body-detail .order-table-list .result-column.column-2 {
				width: 20%;
				text-align: right;
				padding: 5px 10px;
			}	
		.control-content .control-table .order-body-detail .status-list {
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			padding: 10px;
			background-color:  #5A5D63;
			font-size: 0.6rem;
			margin-bottom: 5px;
		}	
		.control-content .control-table .order-body-detail .status-list select {
			width: auto;
			margin-right: 30px;
		}
		.control-content .control-table .order-body-detail .status-list .input-text-box {
			width: auto;
			display: inline-flex;
			margin-right: 30px;
		}
		.control-content .control-table .order-body-detail .status-list .between-text {
			color: #FFF;
		}
		.control-content .control-table .order-body-detail .status-list .body {
			width: 100%;
			height: auto;
			display: block;
		}
		.control-content .control-table .order-body-detail .status-list input[name=update_tacking] {
			padding: 6px 10px;
			border-radius: 3px;
			background-color: #2A2D35;
			outline: none;
			border: none;
			color: #6EA4E5;
			font-size: 0.7rem;
			font-family: "Helvetica Neue", Helvetica, Roboto ,Arial, sans-serif;
		}
		.control-content .control-table .order-body-detail .status-list textarea {
			width: 100%;
			height: 90px;
			display: block;
			margin-bottom: 10px;
		}
	.control-content .control-table .order-body-detail .low {
		width: 100%;
		height: auto;
		display: block;
		padding-top: 20px;
	}	
	.control-table .control-table-btn {
			width: auto;
			height: auto;
			display: inline-flex;
			align-items: center;
			font-size: 0.5rem;
			border-radius: 3px;
			padding: 0;
			background-color: rgba(0,0,0,0);
			color: #949BA2;
			margin-left: 5px;
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
	}
		.control-table .control-table-btn span {
			width: auto;
			height: 14px;
			display: block;
			margin-right: 5px;
		}
				.control-table .control-table-btn span svg {
					width: auto;
					height: 14px;
					display: block;
				}
				.control-table .control-table-btn span svg path {
					fill: #757D84;						
					transition: all 0.2s ease-in-out;
					-moz-transition: all 0.2s ease-in-out;
					-webkit-transition: all 0.2s ease-in-out;
					-o-transition: all 0.2s ease-in-out;
				}
		.control-table .control-focus-btn {
			width: auto;
			height: auto;
			display: inline-block;
		}
			.control-table .control-focus-btn svg {
				width: auto;
				height: 14px;
				display: block;
			}
			.control-table .control-focus-btn svg path {
				fill: #757D84;						
				transition: all 0.2s ease-in-out;
				-moz-transition: all 0.2s ease-in-out;
				-webkit-transition: all 0.2s ease-in-out;
				-o-transition: all 0.2s ease-in-out;
			}
		.control-table .control-focus-btn:hover svg path {
			fill: #95989B;
		}
		.control-table .control-focus-btn.active svg path {
			fill: #F7AF3E;
		}
		.control-table .control-focus-btn.active {
			pointer-events: none;
		}
		.control-table .control-soft-btn {
			font-family: "foundation icons";
			color: #757D84;		
			font-size: 0.9rem;		
		transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;		
		}
		.control-table .control-soft-btn:hover {
			color: #F7AF3E;		
		}
	.control-table .table-text-bar {
			width: auto;
			height: auto;
			display:block;
			text-align: left;
			padding: 5px 7px;
			border-radius: 3px;
			margin: 5px 0;
			background-color: #2A2D35;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
	}
	.control-table .control-table-switch {
			width: auto;
			height: auto;
			display: inline-flex;
			align-items: center;
			text-align: center;
			font-size: 0.5rem;
			border-radius: 3px;
			padding: 3px 10px;
			background-color: #2E3036;
			color: #949BA2;
			margin-left: 5px;
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
	}
		.control-table .control-table-switch:hover {
			background-color: #2D2F35;
			color: #FFF;
		}
		.control-table .control-table-switch.active {
			background-color: #1B83FF;
			color: #FFF;
		}
		.control-table .control-table-switch.active:hover {
			background-color: #3E96FF;
			color: #FFF;
		}
.table-split-column {
	width: auto;
	height: auto;
	display:flex;
	margin-bottom: 30px;
}
	.table-split-column .table-split-1 {
		width: 50%;
		height: auto;
		display: block;
		padding-right: 5px;
	}
	.table-split-column .table-split-2 {
		width: 50%;
		height: auto;
		display: block;
		padding-left: 5px;
	}
/*---------------------------------------------------------------------------------------------------------*/
/*-CONTROL-BTN-COLOR------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.control-table .control-table-btn.delete:hover , .control-table .control-table-btn.delete:hover span {
	color: #FF797C;
}
.control-table .control-table-btn.edit:hover , .control-table .control-table-btn.edit:hover span {
	color: #F7AF3E;
}
.control-table .control-table-btn.switch-show:hover , .control-table .control-table-btn.switch-show:hover span {
	color: #96AFF3;
}
.control-table .control-table-btn.save:hover , .control-table .control-table-btn.save:hover span  {	
	color: #79ED82;
}		
.control-table .control-table-btn.rev-detail:hover {	
	color:#F7AF3E;
}		
.control-table .control-table-btn.rev-detail:hover span svg path {	
	fill:#F7AF3E;
}
/*---------------------------------------------------------------------------------------------------------*/
/*-CONTROL-BRAND-TABLE----------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.brand-header-side .column-1 {
	width: 40%;
	text-align: left;
}
.brand-header-side .column-2 {
	width: 60%;
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.brand-title-side .column-1 {
	display: none !important;			
}
.brand-title-side .column-2 {
	width: 23%;			
	text-align: center;
}
.brand-title-side .column-3 {
	width: 30%;		
	text-align: center;
}
.brand-title-side .column-4 {
	width: 30%;		
	text-align: center;
}
/*---------------------------------------------------------------------------------------------------------*/
.brand-body-side .column-1 {
	display: none !important;
}
.brand-body-side .column-2 {
	width: 23%;			
	text-align: center;
}
.brand-body-side .column-3 {
	width: 30%;		
	text-align: center;
}
.brand-body-side .column-4 {
	width: 30%;		
	text-align: center;
}
.brand-body-side .column-5 {
	width: 17%;		
	text-align: right;
}			
/*---------------------------------------------------------------------------------------------------------*/
.type-header-side .column-1 {
	width: 40%;
	text-align: left;
}
.type-header-side .column-2 {
	width: 60%;
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.type-title-side .column-1 {
	
	display: none !important;		
}
.type-title-side .column-2 {
	width: 42%;			
	text-align: center;
}
.type-title-side .column-3 {
	width: 42%;		
	text-align: center;
}
/*---------------------------------------------------------------------------------------------------------*/
.type-body-side .column-1 {
	display: none !important;
}
.type-body-side .column-2 {
	width: 42%;			
	text-align: center;
}
.type-body-side .column-3 {
	width: 42%;		
	text-align: center;
}
.type-body-side .column-4 {
	width: 16%;		
	text-align: center;
}
/*---------------------------------------------------------------------------------------------------------*/
.article-header-side .column-1 {
	width: 40%;
	text-align: left;
}
.article-header-side .column-2 {
	width: 60%;
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.article-title-side .column-1 {
	width: 15%;
	text-align: center;		
}
.article-title-side .column-2 {
	width: 24%;			
	text-align: center;
}
.article-title-side .column-3 {
	width: 15%;		
	text-align: center;
}
.article-title-side .column-4 {
	width: 13%;		
	text-align: center;
}
.article-title-side .column-5 {
	width: 13%;		
	text-align: center;
}
.article-title-side .column-6 {
	width: 20%;		
	text-align: center;
}
/*---------------------------------------------------------------------------------------------------------*/
.article-body-side .column-1 {
	width: 15%;	
}
.article-body-side .column-2 {
	width: 24%;			
	text-align: center;
}
.article-body-side .column-3 {
	width: 15%;		
	text-align: center;
}
.article-body-side .column-4 {
	width: 13%;		
	text-align: center;
}
.article-body-side .column-5 {
	width: 13%;		
	text-align: center;
}
.article-body-side .column-6 {
	width: 10%;		
	text-align: center;
}
.article-body-side .column-7 {
	width: 10%;		
	text-align: center;
}
/*---------------------------------------------------------------------------------------------------------*/
.outdoor-header-side .column-1 {
	width: 40%;
	text-align: left;
}
.outdoor-header-side .column-2 {
	width: 60%;
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.outdoor-title-side .column-1 {
	width: 15%;
	text-align: center;		
}
.outdoor-title-side .column-2 {
	width: 35%;			
	text-align: center;
}
.outdoor-title-side .column-3 {
	width: 35%;		
	text-align: center;
}
/*---------------------------------------------------------------------------------------------------------*/
.outdoor-body-side .column-1 {
	width: 15%;	
}
.outdoor-body-side .column-2 {
	width: 35%;			
	text-align: center;
}
.outdoor-body-side .column-3 {
	width: 35%;		
	text-align: center;
}
.outdoor-body-side .column-4 {
	width: 15%;		
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.products-header-side .column-1 {
	width: 40%;
	text-align: left;
}
.products-header-side .column-2 {
	width: 60%;
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.products-title-side .column-1 {
	width: 5%;
	text-align: center;		
}
.products-title-side .column-2 {
	width: 8%;			
	text-align: center;
}
.products-title-side .column-3 {
	width: 23%;		
	text-align: center;
}
.products-title-side .column-4 {
	width: 13%;		
	text-align: center;
}
.products-title-side .column-5 {
	width: 7%;		
	text-align: center;
}
.products-title-side .column-6 {
	width: 7%;		
	text-align: center;
}
.products-title-side .column-7 {
	width: 7%;		
	text-align: center;
}
.products-title-side .column-8 {
	width: 7%;		
	text-align: center;
}
.products-title-side .column-9 {
	width: 7%;		
	text-align: center;
}
/*---------------------------------------------------------------------------------------------------------*/
.products-body-side .column-1 {
	width: 5%;	
	text-align: center;
}
.products-body-side .column-2 {
	width: 8%;			
	text-align: center;
}
.products-body-side .column-3 {
	width: 23%;		
	text-align: left;
	padding: 10px !important;
}
.products-body-side .column-4 {
	width: 13%;		
	text-align: center;
}
.products-body-side .column-5 {
	width: 7%;		
	text-align: center;
}
.products-body-side .column-6 {
	width: 7%;		
	text-align: center;
}
.products-body-side .column-7 {
	width: 7%;		
	text-align: center;
}
.products-body-side .column-8 {
	width: 7%;		
	text-align: center;
}
.products-body-side .column-9 {
	width: 7%;		
	text-align: center;
}
.products-body-side .column-10 {
	width: 8%;		
	text-align: right;
}
.products-body-side .column-11 {
	width: 8%;		
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.promotion-header-side .column-1 {
	width: 40%;
	text-align: left;
}
.promotion-header-side .column-2 {
	width: 60%;
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.promotion-title-side .column-1 {
	width: 13%;
	text-align: left;				
}
.promotion-title-side .column-2 {
	width: 30%;			
	text-align: center;
}
.promotion-title-side .column-3 {
	width: 19%;		
	text-align: center;
}
.promotion-title-side .column-4 {
	width: 19%;	
	text-align: center;
}
.promotion-title-side .column-5 {
	width: 10%;		
	text-align: center;
}
/*---------------------------------------------------------------------------------------------------------*/
.promotion-body-side .column-1 {
	width: 13%;
	text-align: left;				
}
.promotion-body-side .column-2 {
	width: 30%;	
	text-align: left;		
    padding: 10px 0 10px 10px !important;
}
.promotion-body-side .column-3 {
	width: 19%;	
	text-align: center;
}
.promotion-body-side .column-4 {
	width: 19%;	
	text-align: center;
}
.promotion-body-side .column-5 {
	width: 10%;	
	text-align: center;
}
.promotion-body-side .column-6 {
	width: 10%;	
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.banner-header-side .column-1 {
	width: 40%;
	text-align: left;
}
.banner-header-side .column-2 {
	width: 60%;
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.banner-title-side .column-0 {
	width: 3%;
	text-align: left;				
}
.banner-title-side .column-1 {
	width: 13%;
	text-align: left;				
}
.banner-title-side .column-2 {
	width: 27%;			
	text-align: center;
}
.banner-title-side .column-3 {
	width: 19%;		
	text-align: center;
}
.banner-title-side .column-4 {
	width: 19%;	
	text-align: center;
}
.banner-title-side .column-5 {
	width: 10%;		
	text-align: center;
}
/*---------------------------------------------------------------------------------------------------------*/
.banner-body-side .column-0 {
	width: 3%;
	text-align: center;
}
.banner-body-side .column-1 {
	width: 13%;
	text-align: left;				
}
.banner-body-side .column-2 {
	width: 27%;	
	text-align: left;		
    padding: 10px 0 10px 10px !important;
}
.banner-body-side .column-3 {
	width: 19%;	
	text-align: center;
}
.banner-body-side .column-4 {
	width: 19%;	
	text-align: center;
}
.banner-body-side .column-5 {
	width: 10%;	
	text-align: center;
}
.banner-body-side .column-6 {
	width: 10%;	
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.bill-header-side .column-1 {
	width: 40%;
	text-align: left;
}
.bill-header-side .column-2 {
	width: 60%;
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.bill-title-side .column-1 {
	width: 7%;
	text-align: center;			
}
.bill-title-side .column-2 {
	width: 30%;			
	text-align: center;
}
.bill-title-side .column-3 {
	width: 20%;		
	text-align: center;
}
.bill-title-side .column-4 {
	width: 15%;	
	text-align: center;
}
.bill-title-side .column-5 {
	width: 15%;		
	text-align: center;
}
/*---------------------------------------------------------------------------------------------------------*/
.bill-body-side .column-1 {
	width: 7%;
	text-align: center;
}
.bill-body-side .column-2 {
	width: 30%;	
	text-align: center;
}
.bill-body-side .column-3 {
	width: 20%;	
	text-align: center;
}
.bill-body-side .column-4 {
	width: 15%;	
	text-align: center;
}
.bill-body-side .column-5 {
	width: 15%;	
	text-align: center;
}
.bill-body-side .column-6 {
	width: 13%;	
	text-align: right;
}

/*---------------------------------------------------------------------------------------------------------*/
.payment-header-side .column-1 {
	width: 40%;
	text-align: left;
}
.payment-header-side .column-2 {
	width: 60%;
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.payment-title-side .column-1 {
	width: 5%;
	text-align: center;			
}
.payment-title-side .column-2 {
	width: 19%;			
	text-align: center;
}
.payment-title-side .column-3 {
	display: none !important;
}
.payment-title-side .column-4 {
	width: 12%;	
	text-align: center;
}
.payment-title-side .column-5 {
	width: 13%;		
	text-align: center;
}
.payment-title-side .column-6 {
	width: 11%;		
	text-align: center;
}
.payment-title-side .column-7 {
	width: 15%;		
	text-align: center;
}
.payment-title-side .column-8 {
	width: 15%;		
	text-align: center;
}
/*---------------------------------------------------------------------------------------------------------*/
.payment-body-side .column-1 {
	width: 5%;
	text-align: center;
}
.payment-body-side .column-2 {
	width: 19%;	
	text-align: center;
}
.payment-body-side .column-3 {
	display: none !important;
	
}
.payment-body-side .column-4 {
	width: 12%;	
	text-align: center;
}
.payment-body-side .column-5 {
	width: 13%;	
	text-align: center;
}
.payment-body-side .column-6 {
	width: 11%;	
	text-align: center;
}
.payment-body-side .column-7 {
	width: 15%;	
	text-align: center;
}
.payment-body-side .column-8 {
	width: 15%;	
	text-align: center;
}
.payment-body-side .column-9 {
	width: 10%;	
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.camping-header-side .column-1 {
	width: 40%;
	text-align: left;
}
.camping-header-side .column-2 {
	width: 60%;
	text-align: right;
}
/*---------------------------------------------------------------------------------------------------------*/
.camping-title-side .column-1 {
	width: 15%;
	text-align: center;		
}
.camping-title-side .column-2 {
	width: 22%;			
	text-align: center;
}
.camping-title-side .column-3 {
	width: 15%;		
	text-align: center;
}
.camping-title-side .column-4 {
	width: 15%;		
	text-align: center;
}
.camping-title-side .column-5 {
	width: 13%;		
	text-align: center;
}
.camping-title-side .column-6 {
	width: 20%;		
	text-align: center;
}
/*---------------------------------------------------------------------------------------------------------*/
.camping-body-side .column-1 {
	width: 15%;	
}
.camping-body-side .column-2 {
	width: 22%;			
	text-align: center;
}
.camping-body-side .column-3 {
	width: 15%;		
	text-align: center;
}
.camping-body-side .column-4 {
	width: 15%;		
	text-align: center;
}
.camping-body-side .column-5 {
	width: 13%;		
	text-align: center;
}
.camping-body-side .column-6 {
	width: 10%;		
	text-align: center;
}
.camping-body-side .column-7 {
	width: 10%;		
	text-align: center;
}
/*---------------------------------------------------------------------------------------------------------*/

	/*---------------------------------------------------------------------------------------------------------*/
	/*-CONTROL-COLUMN----------------------------------------------------------------------------------*/
	/*---------------------------------------------------------------------------------------------------------*/	
	.control-content .filter-box  {
		width: 100%;
		height: auto;
		display: flex;
		margin: 10px 0 20px 0;
		background-color: #3E434D;
		padding: 10px;
		border-radius: 3px;
	}
		.control-content .filter-box .filter-column {
			width: 50%;
			height: auto;
			display: block;
			padding: 10px;
		}
		.control-content .filter-box .filter-column.full-column {
			width: 100%;
		}
		.control-content .filter-box .filter-row {
			width: 100%;
			height: auto;
			display: block;
			padding: 5px 0;
			border-bottom: 1px dashed #8D97A0;
		}
		.control-content .filter-box .filter-row.end {
			border-bottom: none;
		}
		.control-content .filter-box .filter-border-row {
			width: 100%;
			height: auto;
			display: block;
			padding: 10px;
			background-color: #393C44;
			border-radius: 3px;
			margin-bottom: 5px;
		}
			.control-content .filter-box .filter-border-row .filter-row {
				border-bottom: 1px dashed #565B67;
			}
			.control-content .filter-box .filter-border-row .filter-row.end {
				border-bottom: none;
			}
		
		.control-content .filter-box .filter-list {
			width: 100%;
			height: auto;
			font-size: 0.6rem;
			color: #DBDBDD;
			padding-top: 3px;
			padding-bottom: 5px;
		}
		.control-content .filter-box  .filter-option {
			width: 100%;
			height: auto;
			padding: 0 0 0 0;
		}
		.control-content .filter-box  {
			width: 100%;
			height: auto;
			display: flex;
			margin: 10px 0 20px 0;
			background-color: #3E434D;
			padding: 10px;
			border-radius: 3px;
		}
		
		.control-content .input-table-box {
			width: 100%;
			height: auto;
			display: block;
			border-radius: 5px;
			overflow: hidden;
			font-size: 0.7rem;
			color: #d1d4dc;
			border: 2px solid #8D97A0;
		}

			.control-content .input-table-box .input-table-list {
				width: 100%;
				height: auto;
				display: flex;
				align-items: center;
				border-bottom: 2px solid #8D97A0;
			}
			.control-content .input-table-box .input-table-list:last-child {
				border-bottom: none;
			}
				.control-content .input-table-box .table-list-name {
					width: 30%;
					height: auto;
					display: block;
					padding: 5px 20px 5px 10px;
					text-align: center;
				}
				.control-content .input-table-box .table-option-box {
					width: 70%;
					height: auto;
					display: block;
					border-left: 1px solid #8D97A0;
				}

					.control-content .input-table-box .table-option-list {
						width: 100%;
						height: auto;
						display: flex;
						align-items: center;
						border-bottom: 1px dashed #8D97A0;
					}
					.control-content .input-table-box .table-option-list:last-child {
						border-bottom: none;
					}
						.control-content .input-table-box .table-option-name {
							width: 50%;
							height: auto;
							display: block;
							padding: 5px 10px;
							text-align: center;
						}
						.control-content .input-table-box .table-option-input {
							width: 50%;
							height: auto;
							display: block;
							padding: 5px 10px 5px 0;
						}
							.control-content .input-table-box .table-option-input input {
								text-align: center;
							}
					.control-content .input-table-box .table-option-list.three .table-option-name {
						width: 40%;
					}
					.control-content .input-table-box .table-option-list.three .table-option-input {
						width: 30%;
					}
				.input-table-box .input-table-list .image-anchor-img {
					width: 30%;
					height: auto;
					display: flex;
					justify-content: center;
					align-items: center;
					padding: 5px 10px;
				}
					.input-table-box .input-table-list .image-anchor-img img {
						width: auto;
						height: auto;
						max-height: 80px;
						display: inline-block;
					}
				.input-table-box .input-table-list .image-anchor-input {
					width: 50%;
					height: auto;
					display: flex;
					align-items: center;
					padding: 5px 10px;
				}

				.input-table-box .input-table-list .image-anchor-btn {
					width: 20%;
					height: auto;
					display: flex;
					align-items:center;
					justify-content: flex-end;
					padding: 5px 10px;
				}
				.input-table-box .image-anchor-btn a {
						width: auto;
						height: auto;
						display: inline-block;
						background-color: #B53744;
						padding: 2px 8px;
						margin-left: 5px;
						border-radius: 3px;
						 -webkit-transition: all 0.2s ease-in;
						-moz-transition: all 0.2s ease-in;
						-o-transition: all 0.2s ease-in;
						transition: all 0.2s ease-in;
					}
					.input-table-box .image-anchor-btn a span {
						width: auto;
						height: auto;
						display: inline-block;
					}
						.input-table-box .image-anchor-btn a span svg {
							width:auto;
							height: 10px;
							display: block;
						}		
							.input-table-box .image-anchor-btn a span svg path{
								fill: #FFF;
							}
					.input-table-box .image-anchor-btn a:hover {
						background-color: #D44A58;
					}
				.input-table-box .input-table-list .social-link-name {
					width: 20%;
					height: auto;
					display: flex;
					justify-content: center;
					align-items: center;
					padding: 5px 10px;
				}
				.input-table-box .input-table-list .social-link-switch {
					width: 20%;
					height: auto;
					display: flex;
					align-items: center;
					padding: 5px 10px;
				}				
				.input-table-box .input-table-list .social-link-input {
					width: 60%;
					height: auto;
					display: flex;
					align-items:center;	
					padding: 5px 10px;
				}
		.control-content .filter-box.orderlist-column {
			width: 100%;
			height: auto;
			display: flex;
			margin: 10px 0 20px 0;
			background-color: #3E434D;
			padding: 10px;
			border-radius: 3px;
		}
		.control-content .filter-box.orderlist-column .filter-column {
			width: 100%;
		}
		.control-content .filter-box.orderlist-column .filter-list {
			width: 10%;
		}
		.control-content .filter-box.orderlist-column .filter-option {
			width: 90%;
		}
		.control-content .filter-box.orderlist-column input[type=text] {
			width: 30%;
		}
/*---------------------------------------------------------------------------------------------------------*/
/*-CONTROL-CATE-OPTION----------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
	.control-content .cate-option-box {
		width: 100%;
		height: auto;
		display: flex;
		align-items: center;
	}
		.control-content .cate-option-box input[type=text] {
			width: 50%;
			height: auto;
		}
		.control-content .cate-option-box .submit-btn {
			width: auto;
			height: 26px;
			display: inline-flex;
			align-items: center;
			border-radius: 3px;
			background-color: #1B83FF;
			margin-left: 10px;
			font-size: 0.7rem;
			color: #FFF;
			padding: 4px 10px;
			cursor: pointer;
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
		}
			.control-content .cate-option-box .submit-btn:hover {
				background-color: #1270E1;
			}
		.control-content .cate-option-box .text-btn {
			color: #1B83FF;
			margin-left: 10px;
			font-size: 0.7rem;
		}
		.control-content .cate-option-box .text-btn:hover {
			color: #3B94FF;
			text-decoration: underline;
		}
	.control-content .cate-option-tag-box {
		width: 100%;
		height: auto;
		display: block;
	}
		.control-content .cate-option-tag-box .tag-btn {
			width: auto;
			height: 26px;
			display: inline-flex;
			align-items: center;
			border-radius: 3px;
			background-color: #595E6C;
			margin-right: 3px;
			margin-bottom: 3px;
			font-size: 0.6rem;
			color: #FFF;
			padding: 4px 10px;
			cursor: pointer;
			
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
		}
			.control-content .cate-option-tag-box .tag-btn:hover {
				background-color: #666F84;
			}
		.control-content .cate-option-tag-box .tag-btn.active {
			background-color: #1B83FF;
			color: #FFF;
			pointer-events: none;
		}
/*---------------------------------------------------------------------------------------------------------*/
/*-CONTROL-INPUT-------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
		.control-content .multi-input-box {
			width: 100%;
			height: auto;
			display: block;
			margin-bottom: 5px;
			padding-bottom: 5px;
			border-bottom: 1px dotted rgba(255,255,255,0.2);
		}	
		.control-content .multi-input-box.end {
			border-bottom: none;
		}	
		.control-content .multi-input-box:last-of-type {
			border-bottom: none;
		}
			.control-content .multi-input-box .multi-input-line-1 {
				width: 100%;
				height: auto;
				display: flex;
				align-items: center;
			}
			.control-content .multi-input-box .multi-input-line-2 {
				width: 100%;
				height: auto;
				display: flex;
				align-items: center;
				padding:  5px 66px 0 57px;
				
			}	
			.control-content .multi-input-box .sort-list {
				font-family: "foundation icons";
				width: 24px;
				display: block;
				font-size: 0.9rem;
				color: #8D97A0;
				line-height: 0;
				cursor: pointer;
			}
				.control-content .multi-input-box .sort-list:hover {
					color: #F7AF3E;
				}
			.control-content .multi-input-box .que {
				width: 18px;
				height: 18px;
				display: block;
				background-color: #8D97A0;
				color: #3E434D;
				border-radius: 3px;
				text-align: center;
				font-weight: bold;
				font-size: 0.7rem;
				margin-right: 15px;
			}
			.control-content .multi-input-box .img-example {
				width: 40px;
				min-height: 26px;
				height: auto;
				margin-right: 5px;
				display: block;
				background-image: url(../img/objects/img-upload-background.png);
				background-repeat: no-repeat;
				background-size: auto 100%;
				background-position: center;
				background-color: #545A66;
				border-radius: 3px;
				overflow: hidden;
			}
			.control-content .multi-input-box .img-example.medium {
				width: 80px;
			}
			.control-content .multi-input-box .img-example.big {
				width: 110px;
			}
			.control-content .multi-input-box .img-example.active {
				background-image: none;
    			margin-bottom: 0;
			}
			.control-content .multi-input-box input[type=file] {
				display: none;
			}
			.control-content .multi-input-box .upload-btn {
				width: 100px;
				height: 26px;
				display: inline-block;
				text-align: center;
				border-radius: 3px;
				background-color: #1B83FF;
				margin-right: 5px;
				font-size: 0.6rem;
				color: #FFF;				
    			padding: 4px 0;
				cursor: pointer;
				
				transition: all 0.2s ease-in-out;
				-moz-transition: all 0.2s ease-in-out;
				-webkit-transition: all 0.2s ease-in-out;
				-o-transition: all 0.2s ease-in-out;
			}
				.control-content .multi-input-box .upload-btn:hover {
					background-color: #1270E1;
				}
				.control-content .multi-input-box .upload-btn.disable {
					background-color: #44658C;
					color: #69819E;	
					pointer-events: none;
				}
			.control-content .multi-input-box input[type=text] {
				width: 180px !important;
				height: 26px;
				margin-right: 5px !important;
			}
			.control-content .multi-input-box input[type=number] {
				width: 70px !important;
				height: 26px;
				margin-right: 5px !important;
			}
			.control-content .multi-input-box .remov-btn {
				font-family: "foundation icons";
				width: auto;
				height: 26px;
				display: block;
				border-radius: 3px;
				background-color: #595E6C;
				margin: 0 5px 0 0;
				font-size: 0.7rem;
				padding: 5px 10px;
				color: #FFF;
				cursor: pointer;
				transition: all 0.2s ease-in-out;
				-moz-transition: all 0.2s ease-in-out;
				-webkit-transition: all 0.2s ease-in-out;
				-o-transition: all 0.2s ease-in-out;
			}
				.control-content .multi-input-box .remov-btn:hover {
					background-color: #DD585A;
				}
			.control-content .multi-input-box .done-btn {
				width: auto;
				height: 26px;
				display: block;
				border-radius: 3px;
				background-color: #595E6C;
				margin: 0 5px 0 0;
				font-size: 0.6rem;
				padding: 5px 10px;
				color: #FFF;
				cursor: pointer;
				transition: all 0.2s ease-in-out;
				-moz-transition: all 0.2s ease-in-out;
				-webkit-transition: all 0.2s ease-in-out;
				-o-transition: all 0.2s ease-in-out;
			}
				.control-content .multi-input-box .done-btn:hover {
					background-color: #1F9C4D;
				}
			
		.control-content .hint {
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			color: #8D97A0;
			font-size: 0.5rem;
			margin-bottom: 5px;
		}
			.control-content .hint span {
				font-family: "foundation icons";
				padding-right: 5px;
				font-size: 0.65rem;
				margin: 0;
			}
		.control-content .hint.red {
			color: #FFB600;
		}
		.control-content .add-btn {
			width: auto;
			height: 26px;
			display: inline-flex;
			align-items: center;
			border-radius: 3px;
			background-color: #1B83FF;
			margin-right: 5px;
			font-size: 0.6rem;
			color: #FFF;
			padding: 4px 10px;
			cursor: pointer;
			
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
		}
			.control-content .add-btn span {
				font-family: "foundation icons";
				padding-right: 5px;
				font-size: 0.7rem;
				margin: 0;
			}
			.control-content .add-btn:hover {
				background-color: #1270E1;
			}
		.control-content .delete-btn {
			width: auto;
			height: 26px;
			display: inline-flex;
			align-items: center;
			border-radius: 3px;
			background-color: #B53744;
			margin-right: 5px;
			font-size: 0.7rem;
			color: #FFF;
			padding: 4px 10px;
			cursor: pointer;
			
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
		}
			.control-content .delete-btn span {
				font-family: "foundation icons";
				padding-right: 5px;
				font-size: 0.7rem;
				margin: 0;
				line-height: 0.6rem;
			}
			.control-content .delete-btn:hover {
				background-color: #D44A58;
			}
		.control-content input[type=text] {
			width: 100%;
			border: none;
			display: block;
			padding: 6px 10px;
			border-radius: 3px;
			background-color: #2A2D35;
			margin: 0;
			box-sizing: border-box;
			caret-color: #F7AF3E;
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
			color: #6EA4E5;
			font-size: 0.7rem;
		}
			.control-content input[type=text]:focus {
				background-color: #2E333E;
				outline: none;
			}
		.control-content input[type=number] {
			width: 100%;
			border: none;
			display: block;
			padding: 6px 0 6px 10px;
			border-radius: 3px;
			background-color: #2A2D35;
			margin: 0;
			box-sizing: border-box;
			caret-color: #F7AF3E;
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
			color: #6EA4E5;
			font-size: 0.7rem;
		}
		.control-content  input[type=number]::-webkit-inner-spin-button {
			 	width: 30px;
			  	height: 30px;
			}
			.control-content input[type=number]:focus {
				background-color: #2E333E;
				outline: none;
			}
		.control-content input.disable {
			pointer-events: none;
			color: #F7AF3E;
		}
		.control-content textarea {
			width: 100%;
			border: none;
			display: block;
			padding: 6px 10px;
			border-radius: 3px;
			background-color: #2A2D35;
			margin: 0;
			box-sizing: border-box;
			caret-color: #F7AF3E;
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
			color: #6EA4E5;
			font-size: 0.7rem;
			resize: none;
		}
			.control-content textarea:focus {
				background-color: #2E333E;
				outline: none;
			}
			.control-content ::-webkit-input-placeholder, .control-content :-ms-input-placeholder, .control-content ::placeholder  {
			
			  color: #757D84;
			}
		.control-content select {
			width: 100%;
			border: none;
			display: block;
			padding: 6px 10px;
			border-radius: 3px;
			background-color: #2A2D35;
			margin: 0;
			box-sizing: border-box;
			caret-color: #FFF;
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
			color: #FFF;
			font-size: 0.7rem;
		}
			.control-content select:focus {
				background-color: #2E333E;
				outline: none;
			}
		.control-content input[readonly] {
			background-color: #2A2D35;
			pointer-events: none;
			color: #F7AF3E;
		}

		.control-content .input-text-box {
			width: 100%;
			height: auto;
			display: flex;
			align-items: center;
			padding-bottom: 5px;
		}
		.control-content .input-text-box.locked {
			pointer-events: none;
			opacity: 0.4;
			filter: grayscale(100%);
		}
		.control-content .input-text-box:last-of-type {
			padding-bottom: 0;
		}
			.control-content .input-text-box input {
				width: 55px !important;
				height: 26px;
				margin-right: 5px !important;
			}
			.control-content .input-text-box .between-text {
				color: #8D97A0;
    			font-size: 0.7rem;
			}
		.control-content .checkbox-input {
			width: auto;
			height: auto;
			display: inline-flex;
			align-items: center;
			border-radius: 3px;
			margin-right: 5px;
			font-size: 0.6rem;
			padding: 0;
			color: #2A2D35;
			cursor: pointer;
			
		}
		.control-content .checkbox-input:hover {
			color: #2A2D35;
		}
		.control-content .checkbox-input input  {
			display: none;
		}
		.control-content .checkbox-input .indicator {
			width: 20px;
			height: 20px;
			display: inline-block;
			border-radius: 3px;
			border: 2px solid #1B83FF;
			margin-right: 5px;
			font-family: "foundation icons";
			text-align: center;
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
			color: rgba(104,122,164,0);
		}
		.control-content .checkbox-input:hover .indicator {
			background-color: #2A2D35;	
			color: #545A66;
		}
		.control-content .checkbox-input input:checked + .indicator {
			color: #1B83FF;
		}
		.control-content .checkbox-input input:checked:hover + .indicator {
			color:#F7AF3E;
			border: 2px solid #F7AF3E;
		}
	.control-content .tab-btn-box {
		width: 100%;
		height: auto;
		display: flex;
		align-items: center;
	}
		.control-content .tab-btn-box .tab-btn {
			width: auto;
			height: 26px;
			display: inline-flex;
			align-items: center;
			border-radius: 3px;
			background-color: #595E6C;
			margin-right: 5px;
			font-size: 0.7rem;
			color: #FFF;
			padding: 4px 10px;
			cursor: pointer;
			
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
		}
		.control-content .tab-btn-box .tab-btn:hover {
			background-color: #666C7C;
			color: #FFF;
		}
		.control-content .tab-btn-box .tab-btn.active {
			background-color: #1B83FF;
			color: #FFF;
			pointer-events: none;			
		}
	.control-content .calendar-table-title {
		display: flex;
		align-items: center;
		width: auto;
		height: auto;
		border-radius: 3px 3px 0 0;
		overflow: hidden;
		border-top: 2px solid #494D57;
		border-left: 2px solid #494D57;
		border-right: 2px solid #494D57;
	}
		.control-content .calendar-table-title .body {
			width: 14.2%;
			height: auto;
			background-color: #333741;
			text-align: center;
			color: #8D97A0;
    		font-size: 0.7rem;
			padding: 5px 0;
			border-right: 2px solid #494D57;
		}
		.control-content .calendar-table-title .body:first-child {
			width: 14.5%;
		}
		.control-content .calendar-table-title .body:last-child {
			width: 14.5%;
			border-right: none;
		}
	.control-content .calendar-table-option {
		display: flex;
		align-items: center;
		width: 100%;
		height: auto;
		border-radius:  0 0 3px 3px;
		overflow: hidden;
		border: 2px solid #494D57;
	}
		.control-content .calendar-table-option .body {
			width: 14.2%;
			height: auto;
			border-right: 2px solid #494D57;
		}
		.control-content .calendar-table-option .body:first-child {
			width: 14.5%;
		}
		.control-content .calendar-table-option .body:last-child {
			width: 14.5%;
			border-right: none;
		}
		.control-content .calendar-table-option input {
			border-radius: 0;
		}
	
/*---------------------------------------------------------------------------------------------------------*/
/*-CONTROL-LOGIN------------------------------------------------------- -----------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.login-content {
	width: 100%;
	height: auto;
	min-height: 100vh;
	display: flex;
	align-items: center;
}
	.login-content  .login-set {
		width: 100%;
		height: auto;
		display: block;
		text-align: center;
	}
	.login-content .logo {
		width: 100%;
		height: auto;
		display: block;
		text-align: center;
	}
		.login-content .logo img {
			width: auto;
			max-width: 130px;
			height: auto;
			display: inline-block;
		}
	.login-content .login-title {
		width: 100%;
		height: auto;
		font-family: FCFridayRegular;
		font-size: 1.8rem;
		color: #445071;

	}
	.login-content .login-title-sub {
		width: 100%;
		height: auto;
		font-family: FCFridayRegular;
		font-size: 1.1rem;
		color: #445071;
		line-height: 0px;
	}
	.login-content .login-form {
		width: 100%;
		max-width: 300px;
		height: auto;
		display: inline-block;
		margin: 130px auto;
	}
	.login-content .login-form input {
		width: 100%;
		height: auto;
		display:block;
		border: none;
		border-bottom: 2px solid #445071;
		padding: 10px;
		font-family: supermarket;
		font-size: 1.2rem;
		letter-spacing: 2px;
		background-color: transparent !important; 
		margin-bottom: 20px;
		box-sizing: border-box;
		caret-color: #56658F;
		transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		color: #ADB8D7; 
	}
	.login-content .login-form input::-webkit-input-placeholder { /* Edge */
	  color: #56658F;
	}
	.login-content .login-form input:-ms-input-placeholder { /* Internet Explorer 10-11 */
	  color: #5658F;
	}
	.login-content .login-form input::placeholder {
	  color: #56658F;
	}
	.login-content .login-form input:focus {
		box-shadow: none !important;
		outline: none ;
	}
	.login-content .login-form input:-webkit-autofill,
	.login-content .login-form input:-webkit-autofill:hover, 
	.login-content .login-form input:-webkit-autofill:focus {
		font-family: supermarket;
		font-size: 1.2rem;
		letter-spacing: 2px;
		border: none;
		border-bottom: 2px solid #445071;			
		-webkit-text-fill-color: #ADB8D7; 
		-webkit-box-shadow: 0 0 0px 1000px  transparent inset !important; 
		transition: background-color 5000s ease-in-out 0s;
	}
	.login-content .login-form input:-internal-autofill-selected {
		background-color: transparent !important; 
		background-image: none !important;
		color: #ADB8D7 !important;
	}
	.login-btn-box {
		width: 100%;
		height: auto;
		display:block;
		position: relative;
		padding: 60px 0 0 0;
	}
	.login-btn-box .login-btn {
		width: auto;
		height: auto;
		display: inline-block;
		font-family: FCFridayRegular;
		font-size: 1rem;
		color: #445071;
		text-transform: uppercase;
		transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		border: 1px solid #445071;
		border-radius: 3px;
		padding: 3px 30px;
	}
	.login-btn-box .login-btn:hover {
		background-color: #5A6A96;
		border: 1px solid #5A6A96;
		color: #24262D;
	}
	.alert-text {
		width: 100%;
		height: auto;
		display: block;
		border-radius: 3px;
		font-family: FCFridayRegular;
		font-size: 1.1rem;
		color: #FFF;
		padding: 7px;
		background-color: #DD585A;
		position: absolute;
		top: 0;
		transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		opacity: 0;
	}
	.login-content  .forget-password {
		width: 100%;
		height: auto;
		text-align: center;
	}
		.login-content  .forget-password a {
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
			font-family: FCFridayRegular;
			font-size:1rem;
			color: #3D4862;
		}
		.login-content  .forget-password a:hover {
			color: #FFF;
		}
/*---------------------------------------------------------------------------------------------------------*/
/*-CONTROL-MENU-------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.control-menu {
	width: 100%;
	height: auto;
	display: flex;
	align-items: center;
	padding: 15px 25px;
	position: relative;
}
	.control-menu .left {
		width: 10%;
		height: auto;
		font-size: 0.7rem;
		color: #FFF;
	}
		.control-menu .left .home-btn {
			padding: 3px 7px;
			border-radius: 3px;
			background-color: #464A55;
			font-size: 0.7rem;
			color: #FFF;
		}
		.control-menu .left .home-btn:hover {
			background-color: #535660
		}
		.control-menu .left .show-hiden-btn {
			display: none;
		}
	.control-menu .right {
		width: 100%;
		height: auto;
		display: block;
		top: -100vh;
		padding: 25px 25px;
		position: absolute;
		background-color: #24262D;
		left: 0;
		opacity: 0;
		transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
	}
	.control-menu .right.active {
		opacity: 1;
		top: 51px;
	}
		.control-menu .right a {
			width: auto;
			height: auto;
			display: table-caption;
			white-space: nowrap;
			margin: 5px 10px;
			font-size: 0.8rem;
			color: #757D84;
			text-transform: uppercase;
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
		}
		.control-menu .right a:hover {
			color: #9DA4A9;
		}
		.control-menu .right a.active {
			color:#1B83FF;
			pointer-events: none;
		}
		
		.control-menu .right a.logout-btn {
			color: #F7AF3E;
		}
		.control-menu .right a.logout-btn:hover {
			color: #DD585A;
		}
.control-menu .switch-mini-menu {
		width: 25px;
		height: 18px;
		display: inline-block;
		position: absolute;
		right: 25px;
	}
.control-menu .switch-mini-menu span {
		width: 25px;
		height: 4px;
		display: block;
		border-radius: 3px;
		position: absolute;
		background-color: #464A55;
		top: 0;
		-webkit-transition: all 200ms cubic-bezier(0.615, 0.25, 0.505, 2.2);
		-moz-transition: all 200ms cubic-bezier(0.615, 0.25, 0.505, 2.2);
		transition: all 200ms cubic-bezier(0.615, 0.25, 0.505, 2.2);
	}
.control-menu .switch-mini-menu span:nth-child(2) {
		top : 7px;
	}
.control-menu .switch-mini-menu span:nth-child(3) {
		top : 14px;
	}
.control-menu .switch-mini-menu.active span {
		background-color: #FF6063;
	}
.control-menu .switch-mini-menu.active span:nth-child(1)  {
		opacity: 0;
	}
.control-menu .switch-mini-menu.active span:nth-child(2)  {
		top: 7px;
		width: 20px;
		left: 2px;
		-webkit-transform: rotate(45deg) scale(1.2);
		-moz-transform: rotate(45deg) scale(1.2);
		-ms-transform: rotate(45deg) scale(1.2);
		-o-transform: rotate(45deg) scale(1.2);
		transform: rotate(45deg) scale(1.2);
	}
.control-menu .switch-mini-menu.active span:nth-child(3)  {
		top: 7px;
		width: 20px;
		left: 2px;
		-webkit-transform: rotate(-45deg) scale(1.2);
		-moz-transform: rotate(-45deg) scale(1.2);
		-ms-transform: rotate(-45deg) scale(1.2);
		-o-transform: rotate(-45deg) scale(1.2);
		transform: rotate(-45deg) scale(1.2);
}
/*---------------------------------------------------------------------------------------------------------*/
/*-CONTROL-FOOTER-----------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.control-footer {
	width: 100%;
	height: auto;
	display: flex;
	align-items: center;
	padding: 15px 25px;
	font-size: 0.6rem;
	color: #757D84;
}
	.control-footer a {
		margin-left: 5px;
		 transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
	}
	.control-footer  a:hover {
		color: #1B83FF;
	}
/*---------------------------------------------------------------------------------------------------------*/
/*-ALERT-BOX-------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------*/
.backdrop {
	width: 100%;
	height: 100%;
	position: fixed;
	align-items: center;
	justify-content: center;
	display: flex;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(20,20,20,0.6);
	z-index: 101;
}
	.gallery-show-box {
		width: 95%;
		height: auto;
		padding: 10px 10px 10px 10px;
		background-color: #FFF;
		overflow: hidden;
		position: relative;		
	}
	.gallery-show-box p {		 
		font-size: 0.9rem;
		color: #111;
		width: 100%;
		height: auto;
		display: block;
		text-align: center;
		padding-top: 10px;
	}
	.gallery-show-box a {
		font-family: "foundation icons";
		font-size: 1.2rem;
		color: #111;
		width: auto;
		height: auto;
		display: inline-block;
		text-align: center;
		position: absolute;
		top:10px;
		right: 20px;
	}
		.gallery-show-box a:hover {
			color: #D8060A;
		}

	.alert-box {
		width: 360px;
		height: auto;
		padding: 0;
		background-color: #FFF;
		border-radius: 5px;
		overflow: hidden;
	}
		.alert-box .title {
			width: 100%;
			height: auto;
			padding: 20px;
			display: block;
			background-color: #D05153;
			text-align: center;
			font-size: 1.3rem;
			font-weight: bold;
			color: #7E0002;
		}
		.alert-box .title.gray {
			width: 100%;
			height: auto;
			padding: 20px;
			display: block;
			background-color: #D9D9D9;
			text-align: center;
			font-size: 1.3rem;
			font-weight: bold;
			color: #666;
		}
			.alert-box .title.gray span {
				width: 60px;
				height:60px;
				border-radius: 50%;
				display:inline-flex;
				align-items: center;
				justify-content: center;
				background-color: #62C767;
				text-align: center;
				font-family:"foundation icons";
				font-size: 1.6rem;
				color: #D9D9D9;
				margin-bottom: 10px;
			}
		.alert-box .title.green {
			width: 100%;
			height: auto;
			padding: 20px;
			display: block;
			background-color: #00AB08;
			text-align: center;
			font-size: 1.3rem;
			font-weight: bold;
			color: #1E6819;
		}
		.alert-box .title.green span {
			width: 60px;
			height:60px;
			border-radius: 50%;
			display:inline-flex;
			align-items: center;
			justify-content: center;
			background-color: #62C767;
			text-align: center;
			font-family:"foundation icons";
			font-size: 1.6rem;
			color: #1E6819;
			margin-bottom: 10px;
		}
		.alert-box .detail-picked {
			width: 100%;
			height: auto;
			padding: 20px;
			display: flex;
			justify-content: space-around;
			background-color: #EEE;
			text-align: center;
		}
		.alert-box .detail-picked a.back {
				width: auto;
				height: auto;
				padding: 8px 23px;
				border-radius: 3px;
				background-color: #EEE;
				border: 2px solid #085217;
				color: #085217;
				font-size: 0.8rem;
				display: inline-block;
			}
				.alert-box .detail-picked a.back:hover {
					color: #FFF;
    					background-color: #0C5E1C;
				}
			.alert-box .detail-picked a.done {
				width: auto;
				height: auto;
				padding: 8px 23px;
				border-radius: 3px;
				
				border: 2px solid #085217;
				background-color: #085217;
				color: #FFF;
				font-size: 0.8rem;
				display: inline-block;
			}
				.alert-box .detail-picked a.done:hover {
					color: #FFF;
    					background-color: #0C5E1C;
				}
		.alert-box .detail {
			width: 100%;
			height: auto;
			padding: 20px;
			display: block;
			background-color: #EEE;
			text-align: center;
		}
			.alert-box .detail span {
				width: 100%;
				height: auto;
				display: block;
				text-align: center;
				font-size: 0.8rem;
				color: #666;
			}
			.alert-box .detail a.phone {
				width: auto;
				height: auto;
				display: inline-block;
				text-align: center;
				font-size: 0.8rem;
				padding: 7px 18px;
				margin: 15px 0;
				border-radius: 3px;
				color: #FFF;
				background-color: #445071;
				transition: all 0.2s ease-in-out;
				-moz-transition: all 0.2s ease-in-out;
				-webkit-transition: all 0.2s ease-in-out;
				-o-transition: all 0.2s ease-in-out;
			}
			.alert-box .detail a.phone:hover {
				color: #FFF;
				background-color: #2E4FA8;
			}
			.alert-box .detail a.delete {
				width: auto;
				height: auto;
				display: inline-block;
				text-align: center;
				font-size: 0.8rem;
				padding: 7px 18px;
				margin: 15px 0;
				border-radius: 3px;
				color: #FFF;
				background-color: #B53744;
				transition: all 0.2s ease-in-out;
				-moz-transition: all 0.2s ease-in-out;
				-webkit-transition: all 0.2s ease-in-out;
				-o-transition: all 0.2s ease-in-out;
			}
			.alert-box .detail a.delete:hover {
				color: #FFF;
				background-color: #D44A58;
			}
			.alert-box .detail a.cancel {
				width: auto;
				height: auto;
				display: inline-block;
				text-align: center;
				font-size: 0.8rem;
				padding: 0;
				margin: 5px 0 0 0;
				color: #666;
				transition: all 0.2s ease-in-out;
				-moz-transition: all 0.2s ease-in-out;
				-webkit-transition: all 0.2s ease-in-out;
				-o-transition: all 0.2s ease-in-out;
			}
			.alert-box .detail a.cancel:hover {
				color: #111;
				text-decoration: underline;
			}
			.alert-box .detail a.confirm {
				width: auto;
				height: auto;
				display: inline-block;
				text-align: center;
				font-size: 0.8rem;
				padding: 7px 18px;
				margin: 15px 0;
				border-radius: 3px;
				color: #FFF;
				background-color: #085217;
				transition: all 0.2s ease-in-out;
				-moz-transition: all 0.2s ease-in-out;
				-webkit-transition: all 0.2s ease-in-out;
				-o-transition: all 0.2s ease-in-out;
			}
			.alert-box .detail a.confirm:hover {
				color: #FFF;
				background-color: #1B7A2D;
			}
		.alert-box .detail .error {
			color: #AF3A3C;
			font-size: 0.7rem;
			font-weight: bold;
			margin-top: 20px;
		}
			.alert-box .detail .error p {
				margin: 5px 0;
			}
		.control-pagination-bar {
			width: auto;
			margin: 0 auto;
			height: auto;
			display: flex;
			justify-content: center;
			padding: 30px 15px;
			text-align: center;
		}
			.control-pagination-bar a {		
				display: block;
				font-size: 0.7rem;
				width: auto;
				height: auto;
				padding: 5px 15px;
				margin: 0 5px;
				text-align: center;
				border-radius: 3px;
				color: #757D84;
				font-weight: bold;
				 -webkit-transition: all 0.2s ease-in;
				-moz-transition: all 0.2s ease-in;
				-o-transition: all 0.2s ease-in;
				transition: all 0.2s ease-in;
			}
			.control-pagination-bar a.arrow {
				display: flex;
				align-items: center;		
			}
			.control-pagination-bar a.arrow span {
				width: auto;
				padding: 5px 0;
				display: block;
				right: 17px;
			}
			.control-pagination-bar a.arrow span svg {
				width: auto;
				height: 14px;
				display: block;
			}
			.control-pagination-bar a.arrow span svg path {
				fill: #757D84;
			}
			.control-pagination-bar a:hover {
				background-color: #464A55;
				color: #FFF;
			}
			.control-pagination-bar a.arrow:hover {
				background-color: #464A55;
			}
			.control-pagination-bar a.arrow:hover span svg path {
				fill: #FFF;
			}
			.control-pagination-bar a.active {
				background-color: #1B83FF;
				color: #FFF;
				pointer-events: none;
			}
	.alert-box.qr-location {
		width: 360px;
		height: auto;
		padding: 0;
		background-color: #FFF;
		border-radius: 5px;
		overflow: hidden;
	}
		.alert-box.qr-location h2{
			color: #FFF;
			font-size: 1rem;
			background-color: #085217;margin: 0;
			padding: 13px 0;
		}
		.alert-box.qr-location h3{
			color: #333;
			font-size: 0.8rem;
			margin: 0;
			padding: 15px 0 10px 0;
		}
		.alert-box.qr-location button {
			width: auto;
			height: auto;
			display: inline-block;
			text-align: center;
			font-size: 0.7rem;
			background-color: #f44336;
			font-family: 'Prompt', thsarabun, "Helvetica Neue", Helvetica, Roboto ,Arial, sans-serif;
			padding: 5px 10px;
			color: #FFF;
			border-radius: 5px;
			border: none;
			margin-bottom: 15px;
		}
		.alert-box.qr-location button:hover {
			background-color: #D12B1F;
		}
	.control-bank-example {
		width: 100%;
		height: auto;
		padding: 0;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		display: -webkit-box;
		display: -webkit-flex;
		display: -moz-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-flex: 0;
		-moz-box-flex: 0;
		-webkit-box-direction: normal;
		-moz-box-direction: normal;
		-webkit-flex: 0 1 auto;
		-ms-flex: 0 1 auto;
		flex: 0 1 auto;
		-webkit-box-orient: horizontal;
		-webkit-flex-direction: row;
		-moz-box-orient: horizontal;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		justify-content: center;
	}
		.control-bank-example .bank-example-grid {
			flex-basis: auto;
			width: auto;
			height: auto;
			padding: 20px;
			margin: 10px 20px;
			box-sizing: border-box;
			-webkit-box-flex: 0;
			-webkit-flex: 0 0 auto;
			-moz-box-flex: 0;
			-ms-flex: 0 0 auto;
			flex: 0 0 auto;
			text-align: center;
			border-radius: 3px;
			transition: all 0.2s ease-in-out;
			-moz-transition: all 0.2s ease-in-out;
			-webkit-transition: all 0.2s ease-in-out;
			-o-transition: all 0.2s ease-in-out;
		}
			.control-bank-example .bank-example-grid img {
				width: 50px;
				height: 50px;
				display: inline-block;
				margin-bottom: 10px;
			}
			.control-bank-example .bank-example-grid .text {
				width: 100%;
				height: auto;
				font-size: 0.6rem;
				color: #DBDBDD;
				display: block;
				text-align: center;
			}
		.control-bank-example .bank-example-grid:hover {			
    		background-color: #393C44;
		}
		.keyword-lodcation {
    		border-radius: 3px;
			 width: 100%;
			height: auto;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
			display: -webkit-box;
			display: -webkit-flex;
			display: -moz-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-flex: 0;
			-moz-box-flex: 0;
			-webkit-box-direction: normal;
			-moz-box-direction: normal;
			-webkit-flex: 0 1 auto;
			-ms-flex: 0 1 auto;
			flex: 0 1 auto;
			-webkit-box-orient: horizontal;
			-webkit-flex-direction: row;
			-moz-box-orient: horizontal;
			-ms-flex-direction: row;
			flex-direction: row;
			-webkit-flex-wrap: wrap;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			
		}
			.keyword-lodcation .keyword-grid {
				flex-basis: auto;
				width: auto;
				height: auto;
				padding: 3px 3px 3px 5px;
				margin: 0 5px 5px 0;
				
				border-radius: 3px;
    			background-color: #2A2D35;
				display: inline-flex;
				align-items: center;
				 transition: all 0.2s ease-in-out;
				-moz-transition: all 0.2s ease-in-out;
				-webkit-transition: all 0.2s ease-in-out;
				-o-transition: all 0.2s ease-in-out;
			}
			.keyword-lodcation .keyword-grid:hover {
				
    			background-color: #23252A;
			}
				.keyword-lodcation .keyword-grid .text {
					font-size: 0.65rem;
					color: #DBDBDD;
					padding-left: 5px;
					cursor: pointer;
				}
				.keyword-lodcation .keyword-grid .keyword-delete {
					width: auto;
					height: auto;
					display: inline-flex;
					align-items: center;
					border-radius: 3px;
					background-color: #B53744;
					margin-left: 10px;
					font-size: 0.6rem;
					color: #FFF;
					padding: 2px 6px;
					cursor: pointer;
					transition: all 0.2s ease-in-out;
					-moz-transition: all 0.2s ease-in-out;
					-webkit-transition: all 0.2s ease-in-out;
					-o-transition: all 0.2s ease-in-out;
					font-family: "foundation icons";
				}
				.keyword-lodcation .keyword-grid .keyword-delete:hover {
					background-color: #D44A58;
				
				}
	.product-set-lodcation {
    		border-radius: 3px;
			 width: 100%;
			height: auto;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
			display: -webkit-box;
			display: -webkit-flex;
			display: -moz-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-flex: 0;
			-moz-box-flex: 0;
			-webkit-box-direction: normal;
			-moz-box-direction: normal;
			-webkit-flex: 0 1 auto;
			-ms-flex: 0 1 auto;
			flex: 0 1 auto;
			-webkit-box-orient: horizontal;
			-webkit-flex-direction: row;
			-moz-box-orient: horizontal;
			-ms-flex-direction: row;
			flex-direction: row;
			-webkit-flex-wrap: wrap;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			
    border-bottom: 1px dashed #8D97A0;
		}
			.product-set-lodcation .product-set-grid {
				flex-basis: auto;
				width: auto;
				height: auto;
				padding: 3px 3px 3px 5px;
				margin: 0 5px 5px 0;
				
				border-radius: 3px;
    			background-color: #2A2D35;
				display: inline-flex;
				align-items: center;
				 transition: all 0.2s ease-in-out;
				-moz-transition: all 0.2s ease-in-out;
				-webkit-transition: all 0.2s ease-in-out;
				-o-transition: all 0.2s ease-in-out;
			}
			.product-set-lodcation .product-set-grid:hover {
				
    			background-color: #23252A;
			}
				.product-set-lodcation .product-set-grid .text {
					font-size: 0.65rem;
					color: #DBDBDD;
					padding-left: 5px;
					cursor: pointer;
				}
				.product-set-lodcation .product-set-grid .product-set-delete {
					width: auto;
					height: auto;
					display: inline-flex;
					align-items: center;
					border-radius: 3px;
					background-color: #B53744;
					margin-left: 10px;
					font-size: 0.6rem;
					color: #FFF;
					padding: 2px 6px;
					cursor: pointer;
					transition: all 0.2s ease-in-out;
					-moz-transition: all 0.2s ease-in-out;
					-webkit-transition: all 0.2s ease-in-out;
					-o-transition: all 0.2s ease-in-out;
					font-family: "foundation icons";
				}
				.product-set-lodcation .product-set-grid .product-set-delete:hover {
					background-color: #D44A58;
				
				}
	.value-tag-lodcation {
			padding: 5px;
			background-color: #393C44;
    		border-radius: 3px;
			 width: 100%;
			height: auto;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
			display: -webkit-box;
			display: -webkit-flex;
			display: -moz-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-flex: 0;
			-moz-box-flex: 0;
			-webkit-box-direction: normal;
			-moz-box-direction: normal;
			-webkit-flex: 0 1 auto;
			-ms-flex: 0 1 auto;
			flex: 0 1 auto;
			-webkit-box-orient: horizontal;
			-webkit-flex-direction: row;
			-moz-box-orient: horizontal;
			-ms-flex-direction: row;
			flex-direction: row;
			-webkit-flex-wrap: wrap;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			
		}
			.value-tag-lodcation .value-tag-grid {
				flex-basis: auto;
				width: auto;
				height: auto;
				padding: 5px;
				margin: 5px;
				box-sizing: border-box;
				-webkit-box-flex: 0;
				-webkit-flex: 0 0 auto;
				-moz-box-flex: 0;
				-ms-flex: 0 0 auto;
				flex: 0 0 auto;
				border-radius: 3px;
    			background-color: #2A2D35;
				display: inline-flex;
				align-items: center;
				 transition: all 0.2s ease-in-out;
				-moz-transition: all 0.2s ease-in-out;
				-webkit-transition: all 0.2s ease-in-out;
				-o-transition: all 0.2s ease-in-out;
			}
			.value-tag-lodcation .value-tag-grid:hover {
				
    			background-color: #23252A;
			}
				.value-tag-lodcation .value-tag-grid .input-text {
					font-size: 0.7rem;
					color: #DBDBDD;
					background-color: transparent;
					padding-top: 3px;
					padding-left: 5px;
					cursor: pointer;
					pointer-events: none;
					outline: none;
					border: none;
					width: 90px;
				}
				.value-tag-lodcation .value-tag-grid span {
					font-size: 0.6rem;
					background-color: #595E6C;
					color: #FFF;
					padding: 2px 5px;
					border-radius: 3px;
					margin-left: 3px;
				}
				.value-tag-lodcation .value-tag-grid .value-tag-delete {
					width: auto;
					height: auto;
					display: inline-flex;
					align-items: center;
					border-radius: 3px;
					background-color: #B53744;
					margin-left: 5px;
					font-size: 0.6rem;
					color: #FFF;
					padding: 2px 7px;
					cursor: pointer;
					transition: all 0.2s ease-in-out;
					-moz-transition: all 0.2s ease-in-out;
					-webkit-transition: all 0.2s ease-in-out;
					-o-transition: all 0.2s ease-in-out;
					font-family: "foundation icons";
				}
				.value-tag-lodcation .value-tag-grid .value-tag-delete:hover {
					background-color: #D44A58;
				
				}
	.control-page .disable-box {
		pointer-events: none;
		opacity: 0.2;
	}
/*-OTHER------------------------------------------------------------------------------------------------*/
	.ck-content {
		height: 500px;
		background: #FFF;
		border-radius: 0 0 3px 3px !important;
		border-left: #C4C4C4 1px solid !important;
		border-right: #C4C4C4 1px solid !important;
		border-bottom: #C4C4C4 1px solid !important;
		border-top: none !important;
		font-size: 0.7rem;
		color: #333;
		line-height: 40px;
	}
	.ck-content blockquote {
		background-image: url("../img/objects/blockquote-icon.png");
		background-repeat: no-repeat;
		background-size: 40px auto;
		background-position: top left;
		font-weight: bold;		
		overflow: inherit !important;
		padding-right: 0 !important;
		padding-left: 60px !important;
		padding-top: 0;
		padding-bottom: 30px;
		margin-left: 0 !important;
		margin-top: 30px;
		font-style: normal !important;
		border-left: none !important;
	}
	.ck-content h2 {
		font-size: 20px;
	}
	.ck-content figcaption {
		font-size: 14px;
		color: #666;
		text-align: center;
		padding: 10px;
	}
	.ck-content a {
		color:  #085217;      
		display: inline-block;      
		text-decoration: underline;      
		font-weight: bold;     
	} 
	.ck-content a:hover {
		color: #157428; 
	}
	.ui-loader {
		display: none;
	}
}