@charset "utf-8";
@import url(main.css);
/*  global  */
	body{ font-family: "Microsoft JhengHei", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, "メイリオ", "맑은 고딕", sans-serif; font-size:12pt; background-color: #F7F8F8; overflow-x: hidden; }
	.wrap{ width: 100%; }
	.container{ max-width: 1200px; }
	.img-rwd { width:100%;}
	.imgbox { overflow:hidden;}
	a{ color:#32312f; text-decoration:none;}
	a:focus, a:hover { text-decoration:none; }
	h1,h2,h3,h4,h5,h6 { margin:0; padding:0; font-weight:normal; font-size: initial;}
	ul, section, div, h3 { position: relative;}
	* {
	  -webkit-box-sizing: border-box;
	     -moz-box-sizing: border-box;
	          box-sizing: border-box;
		}
	ul:after, section:after, div:after, li:after { content: ""; display: block; clear: both;}
	ul{ list-style:none; margin:0; padding:0; }
	body,div,p { margin: 0;padding: 0;}

	:root {
		/*--green: #33B282;*/
		--blue: #67C1E9;
		--gray: #e4e6e5;
		--orange :#ea5415;
	}

	.text-green,.text-green a,a.text-green { color:var(--green); }
	.text-white,.text-white a,a.text-white { color:var(--white); }
	.text-blue,.text-blue a,a.text-blue { color:var(--blue); }
	.text-gray,.text-gray a,a.text-gray { color:var(--gray); }
	.text-dark,.text-dark a,a.text-dark { color:var(--dark); }
	.text-secondary,.text-secondary a,a.text-secondary { color:var(--secondary); }
	.text-red,.text-red a,a.text-red { color:var(--red); }
	.text-dkblue,.text-dkblue a,a.text-dkblue { color:var(--primary); }
	.text-orange,.text-orange a,a.text-orange { color:var(--orange); }



	.font-10 {font-size: 10pt;}
	.font-12 {font-size: 12pt;}
	.font-14 {font-size: 14pt;}
	.font-16 {font-size: 16pt;}

	.text-decoration-underline { text-decoration: underline; }

	.custom-control-label::before ,.custom-control-label::after{width:20px; height:20px}

/*	* { touch-action: none; }*/
/*	==========================================	*/
	/*  icon  */
/*	.footericon { padding-left:25px; }*/

/*	.icon-date { background:url(/assets/img/index/icon_03.png) no-repeat left; min-height: 23px; line-height: 23px; padding-left: 28px; }
	.icon-datedark { background:url(/assets/img/index/icon_03_dark.png) no-repeat left; min-height: 23px; line-height: 23px; padding-left: 28px; }
	.icon-loc { background:url(/assets/img/index/icon_04.png) no-repeat left; min-height: 19px; line-height: 19px; }
	.icon-tel { background:url(/assets/img/index/icon_05.png) no-repeat left; min-height: 19px; line-height: 19px; }
	.icon-fax { background:url(/assets/img/index/icon_06.png) no-repeat left; min-height: 19px; line-height: 19px; }
	.icon-mail { background:url(/assets/img/index/icon_07.png) no-repeat left; min-height: 19px; line-height: 19px; }
	.icon-link { background:url(/assets/img/index/icon_08.png) no-repeat left; min-height: 19px; line-height: 19px; }
	.icon-wechat { background:url(/assets/img/index/wechat_02.png) no-repeat left; min-height: 19px; line-height: 19px; background-size: contain; }
*/


/*  onscrolling  */
	/*.wrap.onscrolling header.headerbox { background-color:rgba(0,0,0,0.8); padding-top:0;  }*/

	/*  header  */
	.haderbox { padding:15px 0 10px 0;  }

	.headtop { padding-bottom: 15px; }
	.logobox { width: 205px; }
	.headinfo { text-align: right; }
	.headinfo li { position: relative; display: inline-block; margin-right: 15px; }
	.headinfo li:last-child { margin-right: 0; }
	.headinfo li:before { content: "|"; position: absolute; left:-11px; bottom:0; color: var(--dark); }
	.headinfo li:first-child:before { content: ""; display: none;  }
	.headinfo a { color: var(--blue); font-size:10pt;  }

	.headsearchbox  {  text-align: right; margin-top: 15px; }

	.headadbox { padding:0 0 15px 0; }

	.showcartitem {background-color: var(--blue); color: var(--white); font-size: 8pt; overflow-x: hidden; vertical-align: middle; display: inline-block; width: 40px; word-break: break-all; text-align: center; border-radius: 12px; }

	.menu { text-align: left; border-top:2px solid var(--gray); border-bottom:2px solid var(--gray); padding: 8px 0;  }
	.menu li { display: inline-block; margin-right: 15px;}
	.menu li:last-child { margin-right: 0; }
	.menu a { position: relative; color:var(--blue); font-weight: bolder; }
	.menu a.download { color:var(--white); font-weight: bold; padding: 5px; background: url('/assets/img/index/btn.png') no-repeat center; background-size: 100%; }

	header .haderbox .introductionmenu { top: 8px !important; padding: 5px; }
	.introductionmenu .li { border-bottom: 1px solid var(--gray) }
	.introductionmenu .li:last-child { border-bottom: 0; }
	.introductionmenu .li .sub { line-height: 18px; height: 36px; width: 200px;
		overflow: hidden;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2 /* 顯示行數 Chrome&Safari */
	}
	.introductionmenu .li a { font-weight: normal; padding: 4px 0; display: block; }

	.pd-menu { text-align: left; padding: 10px 0; }
	.pd-menu > li { position: relative; display: inline-block; margin-right: 20px;}
	.pd-menu > li:last-child { margin-right: 0; }
	.pd-menu > li > a { position: relative; color:var(--dark); font-weight: bold;}
	.pd-menu2 { display: none; position: absolute; left:0; top:23px; width: 90px; z-index: 1; background-color:var(--white); border:1px dashed var(--gray); border-bottom: 0;
	    -webkit-box-shadow: 0 3px 1px rgba(0,0,0,0.3);
	    -moz-box-shadow: 0 3px 1px rgba(0,0,0,0.3);
	    box-shadow: 0 3px 1px rgba(0,0,0,0.3);
	}
	.pd-menu2 li a { padding: 10px 0; display: block; }
	.pd-menu2 a:hover { background-color: var(--gray); color: var(--green); }
	.pd-menu > li:hover > a ~ .pd-menu2 {  display: block; }

	/*  rwd menu  */
	.navbar-toggle { border:0; background-color: transparent; position: absolute; right: 0; top: calc((100% - 16px)/2); }
	.navbar-toggle .icon-bar { background-color: var(--blue); display: block; width: 22px; height: 2px; border-radius: 1px; transition: all 500ms ease-in-out; }
	.navbar-toggle .icon-bar+.icon-bar {margin-top: 4px;}

	.rwdmenu-main { position: absolute; top: 44px; left:0; right: 0; bottom:0;}
	.rwdmenu li {padding-bottom: 1px;}
	.rwdmenu li a { background-color:var(--blue); color: var(--white); display: block; font-weight: bolder; padding: 10px; }
	.rwddropmenumenu .li a { font-weight: normal; display: block; padding: 10px; padding-left: 26px; background-color: var(--white); color: var(--dark); }
	.rwddropmenumenu .li { border-bottom: 1px solid var(--gray) }
	.rwddropmenumenu .li:last-child {border-bottom: 0;}

	.rwdmenu li a.rwddropmenubtn { padding-right: 25px; }
	.rwddropmenubtn { position: relative; }
	.rwddropmenubtn.collapsed:before {content: ""; position: absolute; right: 15px; top:15px;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 5px 10px 5px 0;
		border-color: transparent #ffffff transparent transparent;
		-webkit-transition: all 0.52s ease;
		 	 -moz-transition: all 0.52s ease;
						transition: all 0.52s ease;
	}
	.rwddropmenubtn:not(.collapsed):before {content: ""; position: absolute; right: 15px; top:15px;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 5px 10px 5px 0;
		border-color: transparent #ffffff transparent transparent;
		-moz-transform:rotate(-90deg);
		-webkit-transform:rotate(-90deg);
		-o-transform:rotate(-90deg);
		-ms-transform:rotate(-90deg);
		transform:rotate(-90deg);
		-webkit-transition: all 0.52s ease;
		 	 -moz-transition: all 0.52s ease;
						transition: all 0.52s ease;
	}

	.rwdmenubox { position:fixed; top:0; left:0; width:250px; height:100%; z-index:999; opacity:0; background-color: var(--white); border-right: 1px solid var(--gray);
		-moz-transform:translateX(-100%);
		-webkit-transform:translateX(-100%);
		-o-transform:translateX(-100%);
		-ms-transform:translateX(-100%);
		transform:translateX(-100%);
		-webkit-transition: all 0.52s ease;
		 	 -moz-transition: all 0.52s ease;
						transition: all 0.52s ease;
	}
	.rwdmenubox.active { opacity:1;
		-moz-transform:translateX(0);
		-webkit-transform:translateX(0);
		-o-transform:translateX(0);
		-ms-transform:translateX(0);
		transform:translateX(0);
		-webkit-transition: all 0.52s ease;
		 	 -moz-transition: all 0.52s ease;
						transition: all 0.52s ease;
	}
	.rwdmenumask { display:none; position:fixed; top:0; left:0; height:100%; width:100%; background-color:rgba(0,0,0,0.6); z-index:9;
									-webkit-transition: all 0.52s ease;
									 	 -moz-transition: all 0.52s ease;
													transition: all 0.52s ease;
	}
	.rwdmenumask.active { display:block; }


	/*	footer	*/
	.footerbox { border-top:2px solid var(--gray); margin-top: 15px; padding: 15px 0; }

	.fbiframe { text-align: right; }

	.footinfo li { position: relative; display: inline-block; margin-right: 15px; }
	.footinfo li:last-child { margin-right: 0; }
	.footinfo li:before { content: "|"; position: absolute; left:-11px; bottom:0; color: var(--dark); }
	.footinfo li:first-child:before { content: ""; display: none;  }
	.footinfo a { color: var(--blue); font-size:10pt;  }

	.copyright { font-size: 10pt; margin-top: 106px; }
	.gotop { position: fixed; right:calc((100% - 1200px - 170px)/2); bottom: 177px; opacity: 0; z-index: 1;
								-webkit-transition: all 0.52s ease;
									 	 -moz-transition: all 0.52s ease;
													transition: all 0.52s ease;
	}
	.gotop.active {  opacity: 1; }
	.foot-right { position: fixed; right:calc((100% - 1200px - 200px)/2); bottom: 48px; z-index: 9; width: 74px; text-align: center; }

	/*  index  */
	.search-sub { display: inline-block; font-size: 10pt;color: var(--blue); }
	.search-input { display: inline-block;  }
	.search-input .form-control { display: inline-block; width: calc(100% - 35px); height: 30px; vertical-align: middle; border-color: var(--blue); border-radius:0; color: var(--dark); }
	.search-input .form-control:focus { color: var(--dark); }
	.search-input .btn { background-color: var(--blue); width:30px; height: 30px; padding: 0; line-height: 16px; vertical-align: middle; margin-left: -4px;border-radius:0;  }

	.web-title { padding: 15px 0; }
	.web-title h2 { font-size: 16pt; color: var(--gray-dark); }
	.web-title.cont { border-top: 2px solid var(--gray); border-bottom: 2px solid var(--gray); }
	.web-title.cont  h2 {  font-size: 12pt; }
	.web-title.cont .title { width: 140px; display: inline-block; vertical-align:middle;  }
	.web-title.cont .desc { width: calc(100% - 144px); padding-left: 15px; display: inline-block; vertical-align:middle; }


	.index-banner .owl-nav { top:calc((100% - 108px)/2); }

	.index-hotbox { border-top:2px solid var(--gray); margin-top: 15px; }
	.index-hot .owl-stage {counter-reset: rank; }
	.index-hot .owl-item { position: relative; margin-bottom: 15px; }
	.index-hot .owl-item:before{ counter-increment: rank; content: counter(rank)'\ATOP'; position: absolute; top:5px; left:5px; z-index: 1; font-size: 14pt; font-weight: bolder; white-space: pre; text-align: center; width: 55px; display: inline-block; color: var(--white); }
	.index-hot .rankbg { position: relative; }
	.index-hot .rankbg:after{ content: ""; position: absolute; top:0; left:0; width: 100%; height: 100%;  background: url('/assets/img/index/mask.png') no-repeat top left;}
	.index-hot .owl-nav { top:calc((100% - 76px)/2); }
	.index-hot .owl-btn.l { left:-57px; }
	.index-hot .owl-btn.r { right:-57px; }

	.index-discount .owl-item { position: relative; margin-bottom: 15px; }
	.index-discount .owl-nav { top:calc((100% - 76px)/2); }
	.index-discount .owl-btn.l { left:-57px; }
	.index-discount .owl-btn.r { right:-57px; }

	.index-newbox { border-top:2px solid var(--gray); margin-top: 15px;   }

	/* content */
	.content {}
	.contclassbox {  border-bottom: 1px solid var(--gray); margin-top: 15px; }
	.contclass { text-align: center; padding:0 20px 0 20px; overflow: hidden; }
	.contclass .classli { display: inline-block; }
	.contclass a { border-radius:5px 5px 0 0; padding:5px 15px; display: block; color: var(--cxcolor); }
	.contclass a.active { background-color: #c79f64; color: var(--dark);  }

	.cookiebox { padding:5px 0; border-bottom: 2px solid var(--gray); }
	.cookie li { display: inline-block; line-height: 22px; }
	.cookie a,.cookie { color:var(--blue); font-size:10pt; word-break: break-all; }
	.cookie li:after { content:">"; padding:0 3px; display:inline-block; }
	.cookie li:last-child:after  { content:"";}
	.cookie li.active a,.cookie li:hover a { color:var(--blue);}

	.pager { display: flex; justify-content: center; padding:20px 0; font-size: 10pt; }
	.pager li a { display: block; margin:10px; color:var(--white);  }
	.pager li a.active { color: var(--cxcolor); }

	.pdsub { height: 46px; overflow: hidden; margin: 10px 0; word-break: break-all; }

	.likeimg { background: url('/assets/img/index/like_02.png') no-repeat center; width:34px; height: 34px; background-size: contain; border:0; }
	.likeimg.active { background: url('/assets/img/index/like_01.png') no-repeat center; background-size: contain; }

	.btn.addcart { background-color: var(--blue); border-radius: 5px; }
	.btn.buycart { background-color: var(--green); border-radius: 5px; }
	.btn.keepcart { background-color: var(--blue); border-radius: 5px; }

	.newssub { overflow:hidden; height: 38px; margin: 15px 0;  }
	.newslist .li { border-top: 1px solid var(--gray); padding-bottom: 15px;  }
	.newslist .li:nth-child(3),.newslist .li:nth-child(4) { padding-top: 15px; }
	.newslist .li:nth-child(1),.newslist .li:nth-child(2)  { border-top: 0; }
	.newslist .li:nth-child(odd) { border-right: 1px solid var(--gray);}

	.both-l { float: left; width: 140px; }
	.both-r { float: left; width: calc(100% - 140px); padding: 15px 0 0 15px; }
	.both-menu li { border-bottom: 2px solid var(--gray); }
	.both-menu a { display: block; padding: 8px 0; font-weight: bolder; color: var(--gray-dark); }
	.both-rankbox {counter-reset: rank; }
	.both-rank:before { counter-increment: rank; content: counter(rank)'\ATOP'; position: absolute; bottom:15px; left:5px; z-index: 1; font-size: 14pt; font-weight: bolder; white-space: pre; text-align: center; width: 55px; display: inline-block; color: var(--white); }
	.both-rank .sub { position: absolute; left:0; bottom: 0; width: 100%; background-color: rgba(103,193,233,0.6); color: var(--white); font-size: 14pt; font-weight: bolder; overflow: hidden; height: 76px; padding: 15px 10px; padding-left: 66px; }

		/* product */
		.pdlistbox {border-top:2px solid var(--gray); margin-top: 15px; padding-top:10px;}

		.pdsort { text-align: right; }
		.pdsort li {display: inline-block; font-size: 10pt; position: relative; margin-right: 8px;}
		.pdsort li:last-child {margin-right: 0;}
		.pdsort li:before { content: "|"; position: absolute; left:-7px; bottom:0; color: var(--dark); }
		.pdsort li:nth-child(2):before { content: ""; display: none;  }
		.pdsort li:first-child:before { content: ""; display: none;  }
		.pdsort a { font-size: 10pt; color: var(--green); }
		.pdlist { margin:0 -10px; }
		.pdlist li { float: left; width: calc(100%/4 - 20px); margin: 10px; margin-bottom: 30px; margin-top: 0; }
		.pdminimg { margin: 0 -5px; }
		.pdminimg li { float: left; width: calc(100%/4 - 10px); margin:5px; margin-top: 10px; }

		.pdcontsub { padding: 15px 0; }
		.pdcontsub h2 { font-size: 24pt; }
		.preordertime{ font-size: 16pt; }
		.pdcontdesc { padding: 15px 0; min-height: 136px; word-break: break-word; }
		.pdcontstock { font-size: 16pt; }
		.pdcontprice { background-color: #efefef; padding: 10px; margin: 15px 0; }

		.pdcontbuy { width: calc(100% - 166px); }
		.pdcontbuy form { width:calc((100%)/2 - 20px); display: inline-block;}
		.pdcontbuy .buycart { margin-right: 15px; width:100%;}
		.pdcontbuy .addcart { width:100%;}

		.pdcontinfo { border-top:2px solid var(--gray); padding: 15px 0; margin:15px 0;  }
		.pdcontinfosub { font-size: 16pt; }

		.pdcontfeatures { border-top:2px solid var(--gray); padding: 15px 0; margin:15px 0;  }

		/* news */
		.activitylist { margin:0 -10px; }
		.activitylist li { float: left; width: calc(100%/4 - 20px); margin:15px 10px; margin-bottom: 30px; }
		.actsub { overflow:hidden; height: 44px; margin: 10px 0;  }
		.actdesc { overflow:hidden; height: 72px; margin: 5px 0; color: var(--secondary); }
		.actdate { color: var(--secondary); }

		/*cart */
		.cartbox { border-top:2px solid var(--gray); padding: 15px 0; }
		.orderprocess {  text-align: center; margin:50px auto; }
		.orderprocess li { display: inline-block; width: 24%; position: relative;}
		.orderprocess li:before { content: counter(step); counter-increment: step; width: 80px;  line-height: 80px; display: block;
		    font-size: 10px;
		    color:  var(--gray);
		    background: var(--gray);
		    border-radius: 100px;
		    margin: 0px auto 5px auto;
		}
		.orderprocess li:after { content: ''; width: 100%; height: 2px; background: var(--blue); position: absolute; left: -182px; top: 40px; z-index: -1; }
		.orderprocess li.active:before { background: var(--blue); color:var(--blue);}
		.orderprocess li.active:after { background: var(--blue);}
		.orderprocess li:first-child:after { display: none; }
		.orderprocess li.two:after { content: '';  background: #b41b1e; }

		.cartdel { background-color: var(--blue); border-radius: 50%; width: 25px; height: 25px; line-height: 25px; display: block; }

		.qtgroup {  }
		.qtgroup .qt_mius { width: 25px; height: 25px; line-height: 20px; border-radius:50%; background-color: var(--gray); border:0; }
		.qtgroup .quantitybox { width: 80px; height: 25px; border:0; border-bottom: 1px solid var(--gray); text-align: center; outline: none; background-color: transparent; }
		.qtgroup .qt_plus { width: 25px; height: 25px; line-height: 20px; border-radius:50%; background-color: var(--gray);  border:0; }

		.cart-table { width: 100%; }
		.cart-table thead th {padding: 10px 1.5%; }
		.cart-table tbody td { border-top:1px solid var(--gray); border-bottom:1px solid var(--gray); padding: 10px 1.5%; }

		.cart-totalbox { display: flex; margin-top: 20px; }
		.cart-total { background-color:#efefef; padding: 15px; border-radius: 15px; width: calc(100%/3 - 47px); margin-right: 70px; }
		.cart-totalbox .plus { position: absolute; left:31%; top: 38%; font-size: 30pt; color: var(--dark-gray); }
		.cart-totalbox .equal { position: absolute; left:66%; top: 38%; font-size: 30pt; color: var(--dark-gray); }
		.cart-total:last-child {margin-right: 0; }
		.cart-totalbox .sub { border-bottom: 1px solid var(--gray); padding: 5px 0; margin-bottom: 10px; font-size: 13pt; font-weight: bolder; }
		.cartcontbtn {margin:30px 0; text-align: right;}
		.cartcontbtn .btn { width: 172px; }
		.cart-tf-table { display: none; background-color: var(--white); }

		.cartinvoice { background-color: var(--blue); color:var(--white); padding: 15px;  }
		.cartinvoice-code { display: inline-block; width: 30%; height: 22px; }

		.form-control.bg-gray { background-color:#efefef; }

		.transportlist li { text-align: center; }
		.transportlist li a {border:2px solid var(--gray); background-color: var(--white); display: block;  border-radius: 3px; padding: 15px 0; outline: none; font-weight: bolder; }
		.transportlist li a.active { border:2px solid var(--blue); }

		/* member */
		.loginch { margin-top: 15px; }
		.loginch li { float: left; text-align: center; width:calc(100%/2); border:1px solid var(--gray); }
		.loginch a { display: block; padding: 5px 0; color: var(--dark); }
		.loginch a.active { background-color: var(--blue); color: var(--white); }

		.addressbox {border:1px solid var(--gray); padding: 15px; margin-bottom: 15px;}
		.addresslist .li { border:1px solid var(--gray); padding: 15px; margin-bottom: 15px;  }


		/* order */
		.orderlist { border-top: 2px solid var(--gray); padding: 15px 0; }

		/* hack  */
		.owl-nav { position: absolute; width: 100%; }
		.owl-btn.l {left:0;}
		.owl-btn.r {right:0;}
		.owl-theme .owl-nav [class*=owl-].owl-btn { cursor: pointer; background: transparent; }
		.owl-theme .owl-nav [class*=owl-]:hover { background: transparent; }

		.contclass .owl-nav { position: absolute; top:-30%; width: 100%; padding:0 15px; }
		.contclass .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot { color: var(--cxcolor); }
		.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot { color: var(--cxcolor); }
		.owl-theme .owl-nav .disabled {display: none; }
		.owl-theme .owl-nav [class*=owl-]:hover { background: transparent; color: var(--cxcolor); }
		.contclass .owl-prev { position: absolute; left:-23px; font-size: 14pt; font-weight: bolder; }
		.contclass .owl-next { position: absolute; right:20px; font-size: 14pt; font-weight: bolder;  }
		.contclass .owl-stage { margin: 0 auto; }

		.articlebox { word-break: break-word; }
		.articlebox iframe { max-width: 100%;}
		.articlebox img { max-width:100%; }

		.mCSB_inside>.mCSB_container { margin-right: 0; }

		.modal-backdrop { background-color: rgba(255,255,255,0.6);}
		.modal-backdrop.fade.in { opacity: 1; }

		.custom-control-label::before { background-color: var(--gray); border:1px solid var(--gary); }
		.custom-control-input:checked~.custom-control-label::before { background-color: var(--blue); border:1px solid var(--blue); }
		.custom-radio .custom-control-input:checked~.custom-control-label::after { background-image: none; }

		.modal-body { overflow: auto; }


		/* contact */
		.contactform { padding: 30px 0; }

		/* ANIMATED X */
		.navbar-toggle .icon-bar:nth-of-type(1) {
			-webkit-transform: rotate(45deg);
			-ms-transform: rotate(45deg);
			transform: rotate(45deg);
			-webkit-transform-origin: 10% 10%;
			-ms-transform-origin: 10% 10%;
			transform-origin: 10% 10%;
		}

		.navbar-toggle .icon-bar:nth-of-type(2) {
			opacity: 0;
			filter: alpha(opacity=0);
		}

		.navbar-toggle .icon-bar:nth-of-type(3) {
			-webkit-transform: rotate(-45deg);
			-ms-transform: rotate(-45deg);
			transform: rotate(-45deg);
			-webkit-transform-origin: 10% 90%;
			-ms-transform-origin: 10% 90%;
			transform-origin: 10% 90%;
		}

		/* ANIMATED X COLLAPSED */
		.navbar-toggle.closed .icon-bar:nth-of-type(1) {
			-webkit-transform: rotate(0);
			-ms-transform: rotate(0);
			transform: rotate(0);
		}

		.navbar-toggle.closed .icon-bar:nth-of-type(2) {
			opacity: 1;
			filter: alpha(opacity=100);
		}

		.navbar-toggle.closed .icon-bar:nth-of-type(3) {
			-webkit-transform: rotate(0);
			-ms-transform: rotate(0);
			transform: rotate(0);
		}
		/* END ANIMATED X */


@media screen and (max-width: 1200px){

	/* footer*/
	.footerbox .col-12.col-lg-8 { -ms-flex: 0 0 100%;  flex: 0 0 100%; max-width: 100%; order: 2;}
	.footerbox .col-12.col-lg-4 { -ms-flex: 0 0 100%;  flex: 0 0 100%; max-width: 100%; order: 1; margin-bottom: 15px;}
	.fbiframe { text-align: left; }
	.fbiframe iframe { width: 100%; }
	.copyright { text-align: center; margin-top: 0; }
	.footinfo li { display: block; }
	.footinfo li:before { content: ""; display: none; }
	.gotop { right: 15px; bottom: 177px; width: 34px; }

	/* header */
	.haderbox { position: fixed; left:0; top:0; width: 100%; z-index: 999; background-color: var(--white); padding: 5px 0; border-bottom: 1px solid var(--gray); }
	.headmid,.headbot,.headsearchbox,.headinfobox { display: none !important; }
	.headtop { padding-bottom:  0;}
	.headnavbox { display: block !important; }
	.logobox { width: 80px; }
	.rwdcart { position: absolute; right: 50px; top:4px; }

	.headadbox {padding: 10px 0 10px 0; }

	.wrap { padding-top: 46px; }
	.index-hot .owl-nav {  top: calc((100% - 60px)/2); }
	.index-hot .owl-btn.l {  left: -15px; width: 60px; }
	.index-hot .owl-btn.r {  right: -15px; width: 60px; }
	.index-discount .owl-nav{  top: calc((100% - 60px)/2); }
	.index-discount  .owl-btn.l {  left: -15px; width: 60px; }
	.index-discount  .owl-btn.r {  right: -15px; width: 60px; }

	.both-l { width: 100%; float: none; }
	.both-r { width: 100%; float: none; padding-left: 0; }

	.content.pdcont { padding-bottom: 59px; }
	.pdcontbuy { position: fixed; bottom: 0; left:0; width: 100%; z-index: 10; padding: 10px; text-align: center; background-color: var(--white); border-top: 1px solid var(--gray); }

	.qtgroup .quantitybox { width: 35px; }

	.orderprocess { font-size: 9pt; margin: 15px auto; }
	.orderprocess li { border-bottom: 2px solid var(--gray); margin: 10px 0; width:calc(100%/3); float: left; padding: 10px 0; }
	.orderprocess li.active { border-bottom: 2px solid var(--blue); }
	.orderprocess li:before { content:""; display: none; }
	.orderprocess li:after { content:""; display: none; }

	.cart-totalbox { display: block; }
	.cart-total { width: 100%; margin-right: 0; margin-bottom: 15px; font-size: 9pt; display: inline-block; }
	.cart-totalbox .plus,.cart-totalbox .equal { display: none; }
	.cart-tf-table { font-size: 10pt;}
	.content.cartcont { padding-bottom: 59px; }
	.cartcontbtn { text-align: center; margin: 0; position: fixed; bottom: 0; left:0; width: 100%; z-index: 10; padding: 10px; background-color: var(--white); border-top: 1px solid var(--gray); }
	.cartcontbtn .keepcart { width:46%; }
	.cartcontbtn .buycart {  width:46%; }
}

@media screen and (max-width: 992px){

	.container { max-width: 100%; }
	.newslist .li:nth-child(odd) { border-right: 0; }
	.newslist .li:nth-child(2) {border-top: 1px solid var(--gray); padding-top: 15px; }

}

@media screen and (max-width: 768px){

	/*hack */
	.animated {
		animation: none !important;
	}
}

@media screen and (max-width: 576px){

	.index-banner .owl-nav {  top: calc((100% - 70px)/2); }
	.index-banner .owl-btn.l { width: 40px; }
	.index-banner .owl-btn.r {  width: 40px; }

	.both-rank .sub { font-size: 12pt; height: 66px; }
	.both-rank:before { bottom: 4px; }
	.web-title.cont .title { width: 100%;}
	.web-title.cont .desc { width: 100%; padding-left: 0; margin-top: 15px; }
	.pdlist li { width: calc(100%/2 - 20px); }
	.w-75 { width: 72%!important;}
	.btn.addcart { font-size: 10pt; }
	.btn.buycart { font-size: 10pt; }
	.btn.keepcart { font-size: 10pt; }
	.likeimg { width: 25px; height: 25px; }

	.announcementlist li .col-3 {flex: 0 0 100%; max-width: 100%;}
	.announcementlist li .col-9 {flex: 0 0 100%; max-width: 100%; margin: 15px 0; }

	.activitylist li { width: calc(100%/2 - 20px); }


}

@media screen and (max-width: 414px){


}

@media screen and (max-width: 375px){


}

@media screen and (max-width: 320px){

}