.loading{
	position: fixed;
	top:0;
	width: 100%;
	height: 100%;
	color: #999;
	z-index: 9999;
	text-align: center;
	background-color: #fff;
}

.loading1{
	position: absolute;
	display: inline-block;
	top: 50%;
	left: 50%;
	width: 60px;
	height: 30px;
	margin: -15px 0 0 -30px;
	background-image: url(../img/logo.svg);
	background-repeat: no-repeat;
	background-size: auto 100%;
}

.loading2{
	position: absolute;
	top: 50%;
	left: 50%;
	width: 40px;
	height: 40px;
	margin: -60px 0 0 -20px;
	background-image: url(../img/loading2.svg);
	background-repeat: no-repeat;
	-webkit-animation: loading 2s linear infinite;
	-moz-animation: loading 2s linear infinite;
	-ms-animation: loading 2s linear infinite;
	-o-animation: loading 2s linear infinite;
	animation: loading 2s linear infinite;
}

@-webkit-keyframes loading {
	from {-webkit-transform: rotate(0deg);}
	to {-webkit-transform: rotate(360deg);}
}
@-moz-keyframes loading {
	from {-moz-transform: rotate(0deg);}
	to {-moz-transform: rotate(360deg);}
}
@-ms-keyframes loading {
	from {-moz-transform: rotate(0deg);}
	to {-moz-transform: rotate(360deg);}
}
@-o-keyframes loading {
	from {-o-transform: rotate(0deg);}
	to {-o-transform: rotate(360deg);}
}
@keyframes loading {
	from {transform: rotate(0deg);}
	to {transform: rotate(360deg);}
}

.loading_t{
	position: absolute;
	display: inline-block;
	top: 42px;
	left: -12px;
}

html{
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}

html, body{
	padding: 0;
	margin: 0;
}

body{
	position: relative;
	font-family: 'Noto Sans TC', 'Microsoft JhengHei', 'Arial', 'Helvetica', sans-serif;
	color: #333;
	font-size: 14px;
	line-height: 21px;
	font-weight: 500;
	overflow-x: hidden;
}

body:after{
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: -1;
	background: url(../img/bg2.jpg) no-repeat center / cover;
}

 /* IE10+ css hack */

/*防止IE開啟頁面跑動畫效果，再用JS拿掉*/
_:-ms-lang(x), body.h_t *,
	body.h_t *:before,
	body.h_t *:after {
		-ms-transition: none !important;
		transition: none !important;
}

_:-ms-lang(x), body{
	background: url(../img/bg2.jpg) no-repeat center / cover;
	background-attachment: fixed;
}

_:-ms-lang(x), body:after{
	display: none;
}


*, *:before, *:after{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6{
	line-height: 1;
	padding: 0;
	margin: 0;
}

h1{
	float: left;
	width: 100%;
	color: #4267b2;
	font-size: 28px;
	letter-spacing: 2px;
	margin-bottom: 20px;
}

.h1_c{
	display: block;
	font-size: 16px;
	padding: 10px 0 0 0;
}

h2{
	position: relative;
	float: left;
	width: 100%;
	max-width: 100%;
	height: 50px;
	color: #000;
	font-size: 24px;
	text-align: center;
	padding: 0;
	margin-bottom: 13px;
	letter-spacing: 1px;
}

.h2t{
	position: absolute;
	top: 0;
	left: 50%;
	padding: 10px 20px;
	z-index: 10;
	transform: translateX(-50%);
}

.h2t:after{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	background-color: #fff;
	transform: skewX(-40deg);
}

.hb{
	position: absolute;
	top: 20px;
	left: 0;
	width: 100%;
	z-index: 6;
	transform: skewX(-40deg);
	background-color: transparent !important;
}

.hb span{
	float: left;
	display: block;
	height: 6px;
	margin-right: 0.4%;
}

.hb1{
	width: 90%;
	background-color: #bbbbbb;
}

.hb2{
	width: 5%;
	background-color: #d40012;
}

.hb3{
	width: 2%;
	background-color: #d40012;
}

.hb4{
	width: 1%;
	background-color: #d40012;
}

.row_box h2{
	font-family: 'Noto Sans TC';
	position: relative;
	float: left;
	width: 100%;
	height: auto;
	color: #fff;
	font-size: 16px;
	font-weight: 700;
	text-align: left;
	line-height: 1;
	padding: 10px 16px 12px 16px;
	margin-bottom: 0;
	background-color: #4267b2;
}

h3{
	float: left;
	width: 100%;
	color: #333;
	font-size: 15px;
	font-weight: bold;
	padding: 0 0 10px 6px;
	margin: 0;
}

p{
	float: left;
	width: 100%;
	margin: 0 0 15px 0;
}

a{
	color: #333;
	text-decoration: none;
	outline: none; /* for Firefox Google Chrome  */
	behavior: expression(this.onFocus=this.blur()); /* for IE */
}

a:focus{
	text-decoration: none;
	outline: none; /* for Firefox Google Chrome  */
	behavior: expression(this.onFocus=this.blur()); /* for IE */
}

a, a:link, a:active, a:visited, a:hover{
	text-decoration: none;
}

button{
	padding: 0;
	margin: 0;
	border: none;
	background-color: transparent;
	text-decoration: none;
	outline: none; /* for Firefox Google Chrome  */
	behavior: expression(this.onFocus=this.blur()); /* for IE */
}

ul, li{
	list-style: none;
	margin: 0;
	padding: 0;
}

area{
	outline: none; /* for Firefox Google Chrome  */
	behavior: expression(this.onFocus=this.blur()); /* for IE */
}

header{
	position: fixed;
	top:0;
	width: 100%;
	color: #000;
	z-index: 2000;
	-webkit-box-shadow: 0px 1px 5px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 1px 5px rgba(0,0,0,0.2);
	box-shadow: 0px 1px 5px rgba(0,0,0,0.2);
	background-color: rgba(255,255,255,0.9);
}

.header_s{
	height: 80px;
}

.navigation{
	width: 1200px;
	margin: 0 auto;
}

.header_s .navigation{
	width: 100%;
	margin: 0 auto;
}

.nav_top_box{
	position: relative;
	display: inline-block;
	vertical-align: top;
	width: 1180px;
	height: 80px;
	text-align: center;
	transition: all 0.3s;
}

.header_s .nav_top_box{
	height: 56px;
}

.logo{
	float: left;
	width: 80px;
	height: 50px;
	margin: 5px 0 0 0;
	background: url(../img/logo.svg) no-repeat center / auto 100%;
}

.nav_box_r{
	float: left;
	color: #fff;
	padding: 8px 12px;
	margin-top: 6px;
	border-radius: 16px;
}

.nav_box_r a:hover{
	opacity: 0.7;
}

.n_r_i{
	position: relative;
	float: left;
	height: 30px;
}

.s_i_cart{
	position: relative;
	float: left;
	margin: 0 3px;
	transition: opacity 0.15s;
}

.s_i_cart:hover{
}

.s_i_cart .quantity{
	position: absolute;
	top: -3px;
	right: -9px;
	width: 17px;
	height: 17px;
	color: #fff;
	font-size: 12px;
	line-height: 17px;
	text-align: center;
	border-radius: 18px;
	background-color: #b90012;
}

.s_i_cart .shopping_cart{
	float: left;
	width: 32px;
	height: 32px;
	background: url(../img/shopping_cart_blue.svg) no-repeat center;
}

.s_i_member{
	float: left;
	color: #4267b2;
	font-size: 14px;
	margin: 2px 0 0 12px;
}

.s_i_member a{
	color: #4267b2;
	padding: 0 3px
}

.i_member{
	float: left;
	width: 30px;
	height: 30px;
	cursor: default;
	background: url(../img/i_member_blue.svg) no-repeat center;
}

a.i_member:hover{
	opacity: 1;
}

.i_member_signin{
	background: url(../img/i_member_signin.svg) no-repeat center;
}

.s_i_member_link{
	float: left;
	margin-top: 5px;
}

.s_i_member_link a{
	transition: opacity 0.15s;
}

.s_i_member_link a:hover{
}

.n_r_i.s_i_message{
	padding: 0 5px;
}

.n_r_i.s_i_member_login:before{
	color: rgba(0,0,0,0.7);
}

.dropdown{
	font-family: "Microsoft JhengHei", Arial, Helvetica, sans-serif;
	position: absolute;
	top: 36px;
	right: 0;
	width: 450px;
	text-align: left;
	font-weight: normal;
	border: 1px solid #ccc;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1);
	background-color: rgba(255,255,255,1);
	z-index: 100;
	opacity: 0;
	visibility: hidden;
	cursor: default;
	transition: all 0.1s;
}

.header_s .dropdown{
	top: 38px;
}

.dropdown:before{
	content: " ";
	position: absolute;
	top: -11px;
	right: 17px;
	width: 15px;
	height: 11px;
	background-image: url(../img/a_u.svg);
}

.n_r_i.s_i_message .dropdown{
	width: 400px;
}

.n_r_i.s_i_search .d_trigger{
	position: absolute;
	top: 0;
	right: 0;
	width: 27px;
	height: 27px;
	background-color: rgba(255,255,255,0);
	/*ie10 bug d_trigger按鈕會被s_i_search:before檔住 加上背景色才會在前面*/
}

.n_r_i.s_i_search .dropdown{
	top: -2px;
	right: -2px;
	width: 200px;
	padding: 0;
	border: none;
	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
}

.n_r_i.s_i_search .dropdown:before{
	display: none;
}

.n_r_i.s_i_search .d_active{
	visibility: visible;
	opacity: 1;
}

.n_r_i.s_i_cart .dropdown{
	width: 480px;
}

.n_r_i.s_i_cart:hover .dropdown{
	visibility: visible;
	opacity: 1;
}

/*.n_r_i.s_i_cart .dropdown.added{
	width: 200px;
	text-align: center;
	padding: 10px;
	transition: all 0.1s;
}

.n_r_i.s_i_cart:hover .dropdown.shopping_cart{
	visibility: visible;
	opacity: 1;
}

.show_added{
	visibility: visible;
	opacity: 1;
}*/

.n_r_i.s_i_message .dropdown{
	right: -8px;
}

.n_r_i.s_i_message:hover .dropdown{
	visibility: visible;
	opacity: 1;
}

input{
	display: inline-block;
	float: left;
	width: 100%;
	height: 30px;
	padding: 5px;
	font-size: 14px;
	line-height: 1;
	font-weight: normal;
	color: #000;
	border: 1px solid #aaa;
	border-radius: 0 !important;
	outline: none;
	-webkit-appearance: none;
	-webkit-transition: border-color ease-in-out .15s;
	-o-transition: border-color ease-in-out .15s;
	transition: border-color ease-in-out .15s;
}

::-webkit-input-placeholder { /* WebKit browsers */
    color:    #bbb;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #bbb;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #bbb;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #bbb;
}

.placeholderColor { color : #bbb; }

.s_date .placeholderColor { color : #000; font-weight: bold;}

input[type=radio]{
	display: none;
}

input[type=checkbox]{
	display: none;
}

label{
	display:inline-block;
	vertical-align: top;
	width: 16px;
	height: 16px;
	margin: 5px 4px 0 0;
	border: 1px solid #aaa;
	cursor: pointer;
}

label.l_r{
	display:inline-block;
	vertical-align: top;
	width: 16px;
	height: 16px;
	margin: 5px 2px 0 8px;
	/*border-radius: 16px;*/
}

.c_box label{
	vertical-align: middle;
	margin: -2px 6px 0 6px;
}

.c_box .login label{
	margin: -2px 4px 0 0;
}

input[type=radio]:not(old) + label{
	border-radius: 50%;
}

input[type=radio]:not(old):checked + label{
	background: url(../img/c_o.svg) no-repeat center;
	background-size: auto 100%;
}

input[type=checkbox]:not(old) + label{

}

input[type=checkbox]:not(old):checked + label{
	background: url(../img/c_v.svg) no-repeat center;
	background-size: auto 100%;
}

select{
	position: relative;
	cursor: pointer;
	padding: 0 8px !important;
	border-radius: 0 !important;
	-webkit-border-radius: 0 !important;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.select_box{
	position: relative;
	float: left;
	width: 120px;
	height: 30px;
	overflow: hidden;
	border: 1px solid #bbb;
	background-color: #fff;
}

.select_box:after{
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 30px;
	height: 30px;
	background: url(../img/a_d.svg) no-repeat center;
	background-size: 70%;
	pointer-events: none;
}

.bc_box .select_box{
	float: right;
}

.s_box .bc_box .select_box{
	margin-left: 10px;
}

.form_control{
	display: inline-block;
	float: left;
	width: 100%;
	height: 28px;
	padding: 5px;
	line-height: 1;
	font-size: 14px;
	border: 1px solid #aaa;
	border-radius: 0 !important;
	background-color: #fff;
	-webkit-appearance: none;
	-webkit-transition: border-color ease-in-out .15s;
	-o-transition: border-color ease-in-out .15s;
	transition: border-color ease-in-out .15s;
}

.form_control:focus{
	border-color: #8e8e8e;
	outline: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
}

.select_box .form_control{
	width: 128%;
	border: none;
	background-color: transparent;
}

.select_box.row_i_s .form_control{
	width: 140%;
}

.row .form_c_textarea{
	height: 160px !important;
	line-height: 1.3;
}

.n_r_i.s_i_search .dropdown .s_i_search{
	position: absolute;
	top: 0;
	right: 0;
	width: 30px;
	height: 30px;
	border-left: 1px solid #ccc;
}

.n_r_i.s_i_search .dropdown .s_i_search:before{
	margin: 2px 0 0 0;
}

.d_c_box{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 92px;
	z-index: 100;
	transition: height 0.3s;
}

.header_s .d_c_box{
	height: 50px;
}

.d_con_box{
	float: left;
	width: 100%;
	line-height: 1.3;
}

.d_c_b_h{
	max-height: calc(100vh - 130px);
}

.header_s .d_c_b_h{
	max-height: calc(100vh - 70px);
}

.scroll-wrapper > .scroll-content{
	width: 100% !important;
}

.cart_box{
	float: left;
	width: 100%;
	text-align: center;
	padding: 4px 10px;
}

.cart_row{
	position: relative;
	float: left;
	width: 100%;
	font-size: 13px;
	padding: 7px 0;
	border-bottom: 1px solid #e0e0e0;
}

.cart_row a{
	transition: opacity 0.15s;
}

.cart_row a:hover{
	opacity: 0.7;
}

.c_f{
	display: inline-block;
	vertical-align: middle;
	text-align: center;
	padding: 0 3px;
}

.cf1{width: 20%;}
.cf2{width: 40%;}
.cf3{width: 12%;}
.cf4{width: 12%;}
.cf5{width: 12%;}
/*.cf6{width: 8%;}
.cf7{width: 15%;}
.cf8{width: 40%;}*/

.c_f img{
	display: inline-block;
	vertical-align: middle;
	width: 100%;
}

.recipients .c_f{
	padding: 6px;
}

.recipients .cf2{
	width: 23%;
}

.recipients .c_f input{
	width: 100% !important;
}

.recipients .c_f .select_box{
	margin-bottom: 6px;
}

.total_box{
	float: right;
	width: 70%;
	text-align: right;
	line-height: 1;
	padding: 0 2%;
}

.total_row{
	float: left;
	width: 100%;
	padding: 0 0 5px 0;
}

.total_row:last-child{
	padding: 0;
}

.c_box .total_box .total_row{
	padding: 8px 0;
}

.c_box .total_box .total_row .cb_box{
	float: none;
	display: inline-block;
	margin: 0;
}

.mt6{
	margin-top: 6px;
}

.total_row_l{
	float: left;
	width: 74%;
}

.total_row_r{
	float: right;
	width: 26%;
	font-weight: bold;
}

.t_b{
	font-size: 20px;
}

.t_bold{
	font-weight: bold !important;
}

a.t_bold{
	border-bottom: 1px solid transparent;
	transition: border 0.12s;
}

a.t_bold:hover{
	border-bottom: 1px solid #333;
}

.t_black{
	color: #000 !important;
}

.t_red{
	color: #e50012 !important;
}

a.t_red{
	border-bottom: 1px solid transparent;
	transition: border 0.12s;
}

a.t_red:hover{
	border-bottom: 1px solid #e50012;
}

.t_none{
	float: left;
	width: 100%;
	font-size: 15px;
	text-align: center;
	padding: 50px 30px;
}
	
.c_box .t_none{
	padding: 80px 30px;
}

.b1{
	font-family: 'Noto Sans TC', 'Microsoft JhengHei', 'Arial', 'Helvetica', sans-serif;
	display: inline-block;
	color: #fff;
	font-size: 16px;
	font-weight: 500;
	text-align: center;
	line-height: 1.3;
	letter-spacing: 1px;
	padding: 8px 15px;
	border: 1px solid #d91820;
	background-color: #d91820;
	transition: all 0.15s;
}

.b1:hover{
	opacity: 0.8;
}

.b1_w{
	color: #000;
	border: 1px solid #c1c1c1;
	background-color: rgba(255,255,255,1);
}

.b1_w:hover{
	border: 1px solid #c1c1c1;
	background-color: #f7f7f7;
}

.b1_g{
	border: 1px solid #ababab;
	background-color: #ababab;
}

.b1_g:hover{
	border: 1px solid #a1a1a1;
	background-color: #a1a1a1;
}

.b1_l{
	width: 250px;
	padding: 9px 0;
}

.b1_s{
	width: auto;
	padding: 5px 10px;
}

.dropdown .b1{
	float: right;
	font-size: 13px;
}

.b1_o{
	border: 1px solid #e78b00;
	background-color: #e78b00;
}

.fb_login{
	width: 100% !important;
	border: none;
	background-color: #4267b2;
}

.j_f:before{
	content: "";
	display: inline-block;
	vertical-align: top;
	width: 28px;
	height: 28px;
	margin: -4px 2px 0 -4px;
	background: url(../img/star.svg) no-repeat center;
}

.s_r:before{
	content: "";
	display: inline-block;
	vertical-align: top;
	width: 28px;
	height: 28px;
	margin: -4px 2px 0 -4px;
	background: url(../img/shopping_cart.svg) no-repeat center;
}

.b2{
	font-family: 'Noto Sans TC', 'Microsoft JhengHei', 'Arial', 'Helvetica', sans-serif;
	display: inline-block;
	width: 120px;
	font-size: 14px;
	font-weight: 500;
	text-align: center;
	line-height: 1;
	letter-spacing: 1px;
	padding: 10px 0;
	margin: 10px 0;
	border: 1px solid #c1c1c1;
	background-color: #f1f1f1;
	transition: all 0.15s;
}

.b2:hover{
	opacity: 0.8;
}

.m_n{
	font-family: Helvetica, Arial, sans-serif;
	position: absolute;
	top: -4px;
	right: -1px;
	width: 16px;
	height: 16px;
	color: #fff;
	font-size: 11px;
	line-height: 1;
	text-align: center;
	font-weight: normal;
	padding: 2px 0 0 0;
	border-radius: 18px;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	background-color: #e50012;
}

.message_box{
	float: left;
	width: 100%;
	font-size: 14px;
	padding: 6px 12px 0 12px;
}

.message_row{
	float: left;
	width: 100%;
	font-size: 13px;
	padding: 8px;
	border-bottom: 1px solid #e0e0e0;
}

.h_r{
	background-color: #f6f6f6;
}

.m_date{
	float: left;
	width: 24%;
	padding-right: 10px;
}

.m_con{
	float: left;
	width: 76%;
}

.r_bn{
	border-bottom: none;
}

.s_member_box{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	visibility: hidden;
	opacity: 0;
	z-index: 2500;
	transition: all 0.2s;
}

.active{
	visibility: visible !important;
	opacity: 1 !important;
}

.s_member_con{
	position: relative;
	height: 100%;
	overflow-y: scroll;
}

.s_member{
	position: absolute;
	top: 50%;
	left: 50%;
	width: 700px;
	height: 280px;
	padding: 30px 0;
	margin: -140px 0 0 -350px;
	background-color: #fff;
	z-index: 200;
}

.s_member_x{
	position: absolute;
	top: -30px;
	right: -30px;
	width: 25px;
	height: 25px;
	z-index: 160;
	background-image: url(../img/x.svg);
	background-size: 100% auto;
	background-repeat: no-repeat;
}

.s_member_bg{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	z-index: 100;
	background-color: rgba(0,0,0,0.8);
}

.login{
	text-align: center;
	padding: 26px !important;
	margin-bottom: -20px;
}

.login_box{
	float: right;
	width: 50%;
	height: 100%;
	text-align: center;
	padding: 0 30px;
	border-right: 1px solid #ccc;
}

.login .login_box{
	float: none;
	display: inline-block;
	vertical-align: middle;
	width: 360px;
	padding: 0;
	margin-left: -65px;
}

.login .login_box .login_row_r .b1{
	float: left;
	width: 48%;
}

.login .login_box .login_row_r .b1.b1_w{
	margin-right: 4%;
}

.login .login_box .login_row_r .or_box{
	margin: 10px 0;
}

.login .login_box .login_row_r .b1_l{
	width: 100%;
	margin: 0;
}

.login_box_first{
	padding: 0 50px;
}

.login_box:first-child{
	border-right: none;
}

.login_tit{
	font-size: 20px;
}

.login_row{
	position: relative;
	float: left;
	width: 100%;
	padding-bottom: 20px;
}

.login_row_l{
	float: left;
	width: 20%;
	text-align: right;
	padding-right: 10px;
	min-height: 10px;
}

.login_row_r{
	float: left;
	width: 77%;
	text-align: left;
}

.t_a_c{
	text-align: center;
}

.row_note{
	float: left;
	width: 100%;
	font-size: 13px;
	padding-top: 10px;
}

.row_note a{
	float: right;
	transition: all 0.15s;
}

.row_note a:hover{
	opacity: 0.6;
}

.login .row_note.t_red{
	font-size: 12px;
	line-height: 1;
	margin: 0 0 -20px 0;
}

.login_row_b .b1{
	margin: 0 5px;
}



.success{
	float: left;
	width: 100%;
	color: #1bb700;
	text-align: left;
	line-height: 1;
	padding: 0 0 16px 0;
}

.or_box{
	position: relative;
	float: left;
	width: 100%;
	margin-top: -10px;
}

.or{
	position: relative;
	font-size: 14px;
	text-align: center;
}

.or_box:before{
	content: " ";
	border-bottom: 1px solid #ccc;
	position: absolute;
	top: 50%;
	left: 0;
	right: 56%;
}

.or_box:after{
	content: " ";
	border-bottom: 1px solid #ccc;
	position: absolute;
	top: 50%;
	left: 56%;
	right: 0;
}

.b_o_h{
	overflow: hidden;
}

.nav_box{
	float: left;
	margin-left: 16px;
}

.nav_box nav{
	float: left;
}

.nav_box ul.menu{
	float: left;
	margin: 0;
	border-top: 0;
}

.nav_box ul.menu li{
	position: relative;
	float: left;
}

.nav_box ul.menu li a{
	font-family: 'Noto Sans TC', sans-serif;
	position: relative;
	float: left;
	width: 100%;
	height: 60px;
	color: #333;
	font-size: 14px;
	font-weight: 400;
	text-align: center;
	line-height: 60px;
	padding: 0 15px;
	border-bottom: 0;
	z-index: 10;
	transition: color 0.15s;
}

.nav_box ul.menu li a:hover{
	color: #4267b2;
}

.nav_box ul.menu li a.news{
	color: #f09152;
	padding: 0 5px;
	transition: opacity 0.15s;
}

.nav_box ul.menu li a.news:hover{
	opacity: 0.8;
}

.nav_box ul.menu li a.news:before{
	content: "";
	display: inline-block;
	vertical-align: middle;
	width: 30px;
	height: 30px;
	margin: -2px 3px 0 0;
	background: url(../img/news.svg) no-repeat center;
}

.more{
	float: right;
	color: #fff;
	padding: 3px 13px;
	margin-right: 17px;
	letter-spacing: 1px;
	transform: skewX(-15deg);
	background-color: #dc1c24;
	transition: background-color 0.15s;
}

.nav_b{background-color: transparent;}

.nav_box ul.menu li a span.n_b_e{
	transition: all 0.1s;
}

.nav_box ul.menu li a span.n_b_c{
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	line-height: 1;
	padding: 10px;
	visibility: hidden;
	opacity: 0;
	transition: all 0.1s;
}

.nav_box ul.menu li:hover a span.n_b_e{
	visibility: hidden;
	opacity: 0;
}

.nav_box ul.menu li:hover a span.n_b_c{
	visibility: visible;
	opacity: 1;
}

.nav_box ul.menu li a .s_i_ad_a:after{
	float: none;
	margin-left: 2px;
}

.nav_box ul.menu.i9 li{width: 10.211%; margin-right: 0.9%;}
.nav_box ul.menu.i10 li{width: 10%;}
.nav_box ul.menu.i11 li{width: 9.09%;}
.nav_box ul.menu.i12 li{width: 8.333%;}
.nav_box ul.menu.i13 li{width: 7.692%;}
.nav_box ul.menu.i14 li{width: 7.142%;}

.nav_box ul.menu .n_a{
	display: none;
}

.nav_box ul.menu ul.submenu{
	position: absolute;
	visibility: hidden;
	opacity: 0;
	top: 60px;
	left: 50%;
	width: 200px;
	text-align: left;
	transform: translateX(-50%);
	border: 2px solid #4267b2;
	background-color: #f3f7fc;
	/*-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.1);
	box-shadow: 0px 3px 3px rgba(0,0,0,0.1);*/
	transition: all 0.15s;
}

.nav_box ul.menu ul.submenu.c_m_l{
	left: -30px;
	width: 200px;
}

.nav_box ul.menu li:hover ul{
	visibility: visible;
	opacity: 1;
}

.nav_box ul.menu ul.submenu li{
	float: left;
	width: 100%;
}

.nav_box ul.menu ul.submenu li a{
	font-family: 'Microsoft JhengHei';
	width: 100%;
	height: auto;
	color: #333;
	font-size: 13px;
	line-height: 1.4;
	font-weight: bold;
	padding: 8px;
	/*border-bottom: 1px solid #ccc;*/
}

.nav_box ul.menu ul.submenu li:last-child a{
	/*border-bottom: none;*/
}

.nav_box ul.menu ul.submenu li a.c_m_a2{
	width: 80%;
	color: rgba(0,0,0,0.6);
	padding: 8px;
	margin: 0 10%;
}

.nav_box ul.menu ul.submenu li a.c_m_a2:first-child{
	border-top: 1px solid #e0e0e0;
}

.nav_box ul.menu ul.submenu li a.c_m_a2:last-child{
	border-bottom: 1px solid #e0e0e0;
}

.nav_box ul.menu ul.submenu li a:hover{
	background-color: #dbe6f4;
	transition: all 0.15s ease;
}

.nav_box ul.menu ul.submenu ul{
	visibility: hidden;
	opacity: 0;
	top: 0;
	left: 100%;
	width: 140px;
}

.nav_box ul.menu ul.submenu li:hover ul{
	visibility: visible;
	opacity: 1;
}

.m_menu_b{
	display: none;
}
.kv_boxBg{
    background: url(../img/kv.jpg) 0 0 / 100% auto;
}    
.kv_box{
	position: relative;
	width: 100%;
	text-align: center;
	margin-top: -60px;
	padding-top: 90px;
	
}

.kv_box_mask{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	background-color: rgba(0,0,0,0.5);
}

.kv_box_bg{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

.countdown_box{
	position: relative;
	display: inline-block;
	width: 100%;
	text-align: center;
	padding-bottom: 20px;
	z-index: 100;
}

.countdown{
	display: inline-block;
	width: 570px;
	height: 100%;
	text-align: center;
	padding: 20px 10px 0 0;
	background-color: #4267b2;
}

.countdown img{
	display: inline-block;
	width: 200px;
}

.countdown_t1{
	display: inline-block;
	width: 100%;
	color: #ffffba;
	font-size: 21px;
	line-height: 1;
	font-weight: 700;
	padding: 16px 0;
	margin-bottom: 10px;
}

.ct_o{
	color: #ffbb81;
	padding-left: 20px;
}

.ct_o:after{
	content: "";
	display: inline-block;
	vertical-align: middle;
	width: 18px;
	height: 18px;
	margin: -2px 0 0 3px;
	background: url(../img/ct_o.svg) no-repeat center;
}

.countdown_t2{
	display: inline-block;
	width: 100%;
	color: #fff;
	font-size: 16px;
	line-height: 1;
	font-weight: 700;
	padding: 20px 0 40px 0;
}

.kv_clock{
	display: inline-block;
	margin-left: 7px;
	overflow: hidden; /*flipclock 父元素須加上overflow: hidden 不然safari會有bug*/
}

/* Get the bourbon mixin from http://bourbon.io */
/* Reset */

.flip-clock-wrapper {
  font-family: 'Helvetica', sans-serif;
  display: inline-block;
  text-align: center;
  position: relative;
  /*width: 900px;*/
  -webkit-user-select: none;
}

.flip-clock-wrapper * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
}

/* Skeleton */
.flip-clock-wrapper ul {
  position: relative;
  float: left;
  width: 48px;
  height: 62px;
  font-size: 52px;
  font-weight: bold;
  line-height: 58px;
  margin: 1px;
  border: 1px solid #000;
  border-radius: 6px;
  background: #000;
}

.flip-clock-wrapper ul:after{
	content: "";
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 100%;
	height: 100%;
	border-bottom: 1px solid #6e90d5;
 	border-radius: 6px;
}

.flip-clock-wrapper ul li {
  z-index: 1;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  text-decoration: none !important;
}

.flip-clock-wrapper ul li a {
  display: block;
  height: 100%;
  /*-webkit-perspective: 400px;
  -moz-perspective: 400px;
  perspective: 400px;*/
  margin: 0 !important;
  overflow: visible !important;
  cursor: default !important;}

.flip-clock-wrapper ul li a div {
  z-index: 1;
  position: absolute;
  left: 0;
  width: 100%;
  height: 50%;
  overflow: hidden; 
  outline: 1px solid transparent; }

.flip-clock-wrapper ul li a div .shadow {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 2; }

.flip-clock-wrapper ul li a div.up {
  -webkit-transform-origin: 50% 100%;
  -moz-transform-origin: 50% 100%;
  -ms-transform-origin: 50% 100%;
  -o-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  top: 0;
  border-top: 1px solid #666;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;}

.flip-clock-wrapper ul li a div.up:after {
  content: "";
  position: absolute;
  top: calc(100% - 2px);
  left: 0;
  z-index: 5;
  width: 100%;
  height: 2px;
  background-color: #000;
  background-color: rgba(0, 0, 0, 1);}

.flip-clock-wrapper ul li a div.down {
  -webkit-transform-origin: 50% 0;
  -moz-transform-origin: 50% 0;
  -ms-transform-origin: 50% 0;
  -o-transform-origin: 50% 0;
  transform-origin: 50% 0;
  bottom: 0;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;}

.flip-clock-wrapper ul li a div div.inn {
  position: absolute;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 200%;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  background-image: url(../img/c_bg.png);
  background-position: 0 0;
  background-size: 100% 100%;
  background-color: #222;}

.flip-clock-wrapper ul li a div.up div.inn {
  top: 0; }

.flip-clock-wrapper ul li a div.down div.inn {
  bottom: 0; }

/* PLAY */
.flip-clock-wrapper ul.play li.flip-clock-before {
  z-index: 3; }

.flip-clock-wrapper ul li.flip-clock-active {
  z-index: 2; }

@-webkit-keyframes asd {
  0% {
    z-index: 2; }

  100% {
    z-index: 4; } }

@-moz-keyframes asd {
  0% {
    z-index: 2; }

  100% {
    z-index: 4; } }

@-o-keyframes asd {
  0% {
    z-index: 2; }

  100% {
    z-index: 4; } }

@keyframes asd {
  0% {
    z-index: 2; }

  100% {
    z-index: 4; } }

.flip-clock-wrapper ul.play li.flip-clock-active {
  -webkit-animation: asd 0.01s linear 0.29s both;
  -moz-animation: asd 0.01s linear 0.29s both;
  animation: asd 0.01s linear 0.29s both;
 }

.flip-clock-divider {
  float: left;}

.flip-clock-divider.seconds{
	display: none;
}

.flip-clock-label {
  font-family: 'Noto Sans TC';
  float: left;
  color: #fff;
  font-size: 16px;
  line-height: 1;
  font-weight: 900;
  margin: 42px 5px 0 5px;}

.flip-clock-dot.top {
  top: 30px; }

.flip-clock-dot.bottom {
  bottom: 30px; }


@-webkit-keyframes turn {
  0% {
    -webkit-transform: rotateX(90deg); }

  100% {
    -webkit-transform: rotateX(0deg); } }

@-moz-keyframes turn {
  0% {
    -moz-transform: rotateX(90deg); }

  100% {
    -moz-transform: rotateX(0deg); } }

@-o-keyframes turn {
  0% {
    -o-transform: rotateX(90deg); }

  100% {
    -o-transform: rotateX(0deg); } }

@keyframes turn {
  0% {
    transform: rotateX(90deg); }

  100% {
    transform: rotateX(0deg); } }

.flip-clock-wrapper ul.play li.flip-clock-active .down {
  z-index: 2;
  -webkit-animation: turn 0.3s ease-out 0.3s both;
  -moz-animation: turn 0.3s ease-out 0.3s both;
  animation: turn 0.3s ease-out 0.3s both; }


@-webkit-keyframes turn2 {
  0% {
    -webkit-transform: rotateX(0deg); }

  100% {
    -webkit-transform: rotateX(-90deg); } }

@-moz-keyframes turn2 {
  0% {
    -moz-transform: rotateX(0deg); }

  100% {
    -moz-transform: rotateX(-90deg); } }

@-o-keyframes turn2 {
  0% {
    -o-transform: rotateX(0deg); }

  100% {
    -o-transform: rotateX(-90deg); } }

@keyframes turn2 {
  0% {
    transform: rotateX(0deg); }

  100% {
    transform: rotateX(-90deg); } }

.flip-clock-wrapper ul.play li.flip-clock-before .up {
  z-index: 2;
  -webkit-animation: turn2 0.3s ease-in both;
  -moz-animation: turn2 0.3s ease-in both;
  animation: turn2 0.3s ease-in both; }


@-webkit-keyframes show {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-moz-keyframes show {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-o-keyframes show {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@keyframes show {
  0% {
    opacity: 0; }

  100% {
    opacity: 1; } }

@-webkit-keyframes hide {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

@-moz-keyframes hide {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

@-o-keyframes hide {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }

@keyframes hide {
  0% {
    opacity: 1; }

  100% {
    opacity: 0; } }


/* SHADOW */
.flip-clock-wrapper ul.play li.flip-clock-before .up .shadow {
  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.5) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, rgba(0, 0, 0, 0.5)));
  background: linear, top, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.5) 100%;
  background: -o-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.5) 100%);
  background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.5) 100%);
  background: linear, to bottom, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.5) 100%;
  -webkit-animation: show 0.15s ease-in;
  -moz-animation: show 0.15s ease-in;
  animation: show 0.15s ease-in; }

/*.flip-clock-wrapper ul.play li.flip-clock-active .up .shadow {
  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.5) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.1)), color-stop(100%, rgba(0, 0, 0, 0.5)));
  background: linear, top, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.5) 100%;
  background: -o-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.5) 100%);
  background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.5) 100%);
  background: linear, to bottom, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.5) 100%;
  -webkit-animation: hide 0.3s 0.3s ease-in both;
  -moz-animation: hide 0.3s 0.3s ease-in both;
  animation: hide 0.3s 0.3s ease-in both; }*/

/*DOWN*/
.flip-clock-wrapper ul.play li.flip-clock-before .down .shadow {
  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.5)), color-stop(100%, rgba(0, 0, 0, 0.1)));
  background: linear, top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 100%;
  background: -o-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 100%);
  background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 100%);
  background: linear, to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 100%;
  -webkit-animation: show 0.3s ease-out both;
  -moz-animation: show 0.3s ease-out both;
  animation: show 0.3s ease-out both; }

.flip-clock-wrapper ul.play li.flip-clock-active .down .shadow {
  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.5)), color-stop(100%, rgba(0, 0, 0, 0.1)));
  background: linear, top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 100%;
  background: -o-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 100%);
  background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 100%);
  background: linear, to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 100%;
  -webkit-animation: hide 0.3s ease-out 0.3s both;
  -moz-animation: hide 0.3s ease-out 0.3s both;
  animation: hide 0.3s ease-out 0.3s both; }

.flip-clock-wrapper ul li.flip-clock-before .down:before, .flip-clock-wrapper ul li.flip-clock-active .down:before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
    width: 100%;
    height: 40%;
    z-index: 5;
  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.16) 0%, rgba(0, 0, 0, 0) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.16)), color-stop(100%, rgba(0, 0, 0, 0)));
  background: linear, top, rgba(0, 0, 0, 0.16) 0%, rgba(0, 0, 0, 0) 100%;
  background: -o-linear-gradient(top, rgba(0, 0, 0, 0.16) 0%, rgba(0, 0, 0, 0) 100%);
  background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.16) 0%, rgba(0, 0, 0, 0) 100%);
  background: linear, to bottom, rgba(0, 0, 0, 0.16) 0%, rgba(0, 0, 0, 0) 100%;}

@-webkit-keyframes com_t_a{
		0%{height: 100%;}
		100%{height: 0%;}
}
@-moz-keyframes com_t_a{
	0%{height: 100%;}
	100%{height: 0%;}
}
@-ms-keyframes com_t_a{
	0%{height: 100%;}
	100%{height: 0%;}
}
@keyframes com_t_a{
	0%{height: 100%;}
	100%{height: 0%;}
}

@-webkit-keyframes com_b_a{
	0%{height: 0%;}
	100%{height: 100%;}
}
@-moz-keyframes com_b_a{
	0%{height: 0%;}
	100%{height: 100%;}
}
@-ms-keyframes com_b_a{
	0%{height: 0%;}
	100%{height: 100%;}
}
@keyframes com_b_a{
	0%{height: 0%;}
	100%{height: 100%;}
}

.flip-clock-wrapper ul li a div.com_t_box, .flip-clock-wrapper ul li a div.com_b_box{
	position: absolute;
	width: 100%;
	height: 6px;
	z-index: 60;
}
.flip-clock-wrapper ul li a div.com_t_box{
	bottom: 0;
}
.flip-clock-wrapper ul li a div.com_t, .flip-clock-wrapper ul li a div.com_b{
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.flip-clock-wrapper ul li a div.com_t{
	bottom: 0;
}
.flip-clock-wrapper ul li a div.com_b{
	top: 0;
}
.flip-clock-wrapper ul li a div.com_t_l, .flip-clock-wrapper ul li a div.com_t_r, .flip-clock-wrapper ul li a div.com_b_l, .flip-clock-wrapper ul li a div.com_b_r{
	position: absolute;
	width: 7px;
	height: 6px;
	background-size: 100% 100%;
	background-repeat: no-repeat;
}
.flip-clock-wrapper ul li a div.com_t_l{
	bottom: 0;
	left: -2px;
	background-image: url(../img/com_t.png);
}
.flip-clock-wrapper ul li a div.com_t_r{
	bottom: 0;
	left: auto;
	right: -2px;
	background-image: url(../img/com_t.png);
}
.flip-clock-wrapper ul li a div.com_b_wrap div{
	padding: 0 !important;
}
.flip-clock-wrapper ul li a div.com_b_l{
	top: 0;
	left: -2px;
	background-image: url(../img/com_b.png);
}
.flip-clock-wrapper ul li a div.com_b_r{
	top: 0;
	left: auto;
	right: -2px;
	background-image: url(../img/com_b.png);
}
.flip-clock-wrapper ul.play li.flip-clock-before .com_t{
	-webkit-animation: com_t_a 0.3s ease-in;
	-moz-animation: com_t_a 0.3s ease-in;
	-ms-animation: com_t_a 0.3s ease-in;
	animation: com_t_a 0.3s ease-in;
}
.flip-clock-wrapper ul.play li.flip-clock-active .com_b{
	-webkit-animation: com_b_a 0.3s ease-out 0.3s;
	-moz-animation: com_b_a 0.3s ease-out 0.3s;
	-ms-animation: com_b_a 0.3s ease-out 0.3s;
	animation: com_b_a 0.3s ease-out 0.3s;
}

@media all and (-ms-high-contrast:none){
	.flip-clock-wrapper ul.play li.flip-clock-active .down {
		z-index: 2;
		-webkit-animation: turn 0.3s linear 0.3s both;
		-moz-animation: turn 0.3s linear 0.3s both;
		animation: turn 0.3s linear 0.3s both;
	}
	.flip-clock-wrapper ul.play li.flip-clock-before .up {
		z-index: 2;
		-webkit-animation: turn2 0.3s linear both;
		-moz-animation: turn2 0.3s linear both;
		animation: turn2 0.3s linear both; 
	}
	.flip-clock-wrapper ul.play li.flip-clock-before .up .shadow {
		-webkit-animation: show 0.15s linear;
		-moz-animation: show 0.15s linear;
		animation: show 0.15s linear;
	}

	.flip-clock-wrapper ul.play li.flip-clock-before .down .shadow {
		-webkit-animation: show 0.3s linear both;
		-moz-animation: show 0.3s linear both;
		animation: show 0.3s linear both;
	}

	.flip-clock-wrapper ul.play li.flip-clock-active .down .shadow {
		-webkit-animation: hide 0.3s linear 0.3s both;
		-moz-animation: hide 0.3s linear 0.3s both;
		animation: hide 0.3s linear 0.3s both;
	}
	.flip-clock-wrapper ul.play li.flip-clock-before .com_t{
		-webkit-animation: none;
		-moz-animation: none;
		-ms-animation: none;
		animation: none;
	}
	.flip-clock-wrapper ul.play li.flip-clock-active .com_b{
		-webkit-animation: none;
		-moz-animation: none;
		-ms-animation: none;
		animation: none;
	}
}


.bulletin_box{
	position: relative;
	display: inline-block;
	width: 100%;
	max-width: 1200px;
	text-align: center;
	padding: 0 0 20px 0;
	z-index: 120;
}

.bulletin{
	float: left;
	width: 33.333333%;
	padding: 20px;
}

.bulletin_title{
	float: left;
	width: 100%;
	color: #fff;
	font-size: 17px;
	text-overflow : ellipsis;
	overflow: hidden;
	white-space : nowrap;
	margin-bottom: 16px;
}

.bulletin img{
	width: 100%;
    /* min-height: 480px; */
}

.content{
	width: 1200px;
	min-height: 600px;
	padding: 25px 0;
	margin: 0 auto;
}

.content.home{
	position: relative;
	padding-top: 10px;
	z-index: 150;
}

.content.home h1{
	color: #fff;
}

.content_s{
	padding: 84px 0 0 0;
}

#top{
	height: 60px;
}

.kanban{
	position: relative;
	width: 100%;
	padding-top: 34px;
	background-color: #000;
}

.kanban .slide_con{
	position: relative;
	display: inline-block;
	width: 100%;
}

.kanban .slide_con .slide_con_img{
	width: 100%;
}

.swiper-slide-active .slide_con{
	-webkit-animation: zoomin 1s;
	-moz-animation: zoomin 1s;
	-ms-animation: zoomin 1s;
	-o-animation: zoomin 1s;
	animation: zoomin 1s;
}

@-webkit-keyframes zoomin {
	from {transform: scale(1.03);}
	to {transform: scale(1.0);}
}
@-moz-keyframes zoomin {
	from {transform: scale(1.03);}
	to {transform: scale(1.0);}
}
@-ms-keyframes zoomin {
	from {transform: scale(1.03);}
	to {transform: scale(1.0);}
}
@-o-keyframes zoomin {
	from {transform: scale(1.03);}
	to {transform: scale(1.0);}
}
@keyframes zoomin {
	from {transform: scale(1.03);}
	to {transform: scale(1.0);}
}

.ss_text{
	font-family: "Noto Sans TC";
	position: absolute;
	right: 8vw;
	top: 15.5vw;
	color: #fff;
	font-size: 2.2vw;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: 1px;
	opacity: 0;
	transform: translateY(-50%);
	transition: all 0.8s ease 0.3s;
}

.ss_text2{
	font-family: "Noto Sans TC";
	position: absolute;
	right: 8vw;
	top: 19.5vw;
	color: #fff;
	font-size: 1.4vw;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: 1px;
	opacity: 0;
	transform: translateY(50%);
	transition: all 0.8s ease 0.3s;
}

.ss_tb{
	color: #000;
}

.ss_link{
	font-family: "Noto Sans TC";
	position: absolute;
	display: inline-block;
	right: 8vw;
	top: 23.2vw;
	color: #fff;
	font-size: 1.2vw;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: 1px;
	opacity: 0;
	padding: 0.5vw 1.4vw;
	border: 1px solid #fff;
	transition: opacity 0.8s ease 0.5s, background-color 0.15s ease 0s;
}

.ss_link:hover{
	background-color: rgba(255,255,255,0.4);
}

.ss_link2{
	color: #245cb3;
	border: 1px solid #245cb3;
}

.swiper-slide-active .ss_text{
	opacity: 1;
	transform: translateY(0);
}

.swiper-slide-active .ss_text2{
	opacity: 1;
	transform: translateY(0);
}

.swiper-slide-active .ss_link{
	opacity: 1;
}

.swiper-container{
	width: 100%;
	height: 0;
	padding-bottom: 36.4%;
}

.swiper-container *:focus, .pd_img *:focus{
	text-decoration: none;
	outline: none; /* for Firefox Google Chrome  */
	behavior: expression(this.onFocus=this.blur()); /* for IE */
}

.swiper-container img{
	width: 100%;
}

.swiper-button-next, .swiper-button-prev{
	width: 30px;
	height: 58px;
	margin-top: -29px;
	opacity: 0.7;
	background-size: 100% auto;
	transition: opacity 0.15s;
}

.swiper-button-next:hover, .swiper-button-prev:hover{
	opacity: 0.7;
}

.swiper-button-prev{
	background-image: url(../img/a_p_w.svg);
}

.swiper-button-next{
	background-image: url(../img/a_n_w.svg);
}

.swiper-pagination{
	width: 100%;
	left: 0;
	bottom: 15px;
}

.swiper-pagination-bullet{
	width: 10px;
	height: 10px;
	margin: 0 6px;
	opacity: 0.4;
	background: #fff;
}

.swiper-pagination-bullet-active{
	opacity: 1;
	background: #fff;
}

.r_box .kanban{
	width: 99.4%;
	padding: 0;
	margin-bottom: 20px;
}

.r_box .kanban .swiper-slide-active .slide_con{
	-webkit-animation: none;
	-moz-animation: none;
	-ms-animation: none;
	-o-animation: none;
	animation: none;
}

.bc_box{
	float: left;
	width: 100%;
	max-width: 1214px;
	line-height: 24px;
	margin: -10px 0 10px 0;
}

.s_box .bc_box{
	margin: 0 0 10px 0;
}

.breadcrumb{
	float: left;
}

.breadcrumb a{
	opacity: 0.6;
	transition: opacity 0.2s;
}

.breadcrumb a:hover{
	opacity: 0.8;
}

.b_home{
	display: inline-block;
	vertical-align: top;
	width: 24px;
	height: 24px;
	opacity: 0.6;
	background-image: url(../img/b_home.svg);
}

.l_box{
	float: left;
	width: 200px;
	padding-top: 7px;
}

.search_box{
	float: left;
	width: 200px;
	margin-bottom: 26px;
}

.sb_m{
	display: none;
}

.search_trigger{
	display: none;
}

.search{
	float: left;
	width: 100%;
}

.search input{
	float: left;
	width: calc(100% - 36px);
}

.search_b{
	float: left;
	width: 36px;
	height: 30px;
	background: url(../img/search_b.svg) no-repeat right;
}

.search_b:hover{
	opacity: 0.7;
}

.s_t{
	float: left;
	padding-bottom: 20px;
}

.sidebar_box{
	float: left;
	width: 100%;
}

.sidebar_trigger{
	display: none;
}

.sidebar{
	float: left;
	width: 100%;
	border: 1px solid #d5d5d5;
	background-color: #fff;
}

.sidebar ul{
	float: left;
	width: 100%;
	transition: height 0.2s;
}

.sidebar ul li, .sidebar ul li a{
	float: left;
	width: 100%;
}

.sidebar ul li{
	position: relative;
}

.sidebar ul > li > a{
	float: left;
	width: 100%;
	height: 46px;
	color: #fff;
	font-size: 17px;
	line-height: 1;
	padding: 13px 50px;
	transition: all 0.15s;
}

.sidebar ul > li > a:before{
	content: "";
	position: absolute;
	top: 8px;
	left: 10px;
	width: 30px;
	height: 30px;
}

.sidebar ul > li > a.c1:before{background: url(../img/i1.svg) no-repeat center;}
.sidebar ul > li > a.c2:before{background: url(../img/i2.svg) no-repeat center;}
.sidebar ul > li > a.c3:before{background: url(../img/i3.svg) no-repeat center;}
.sidebar ul > li > a.c4:before{background: url(../img/i4.svg) no-repeat center;}
.sidebar ul > li > a.c5:before{background: url(../img/i5.svg) no-repeat center;}
.sidebar ul > li > a.c6:before{background: url(../img/i6.svg) no-repeat center;}

.sidebar .a_d_w{
	position: absolute;
	top: 0px;
	right: 0px;
	display: block;
	width: 46px;
	height: 46px;
	cursor: pointer;
	background: url(../img/a_d_w.svg) no-repeat center;
	background-size: 50%;
	transition: background-color 0.15s;
}

.sidebar .a_d_w.active{
	background: url(../img/a_u_w.svg) no-repeat center;
	background-size: 50%;
}

.sidebar .a_d_w:hover{
	background-color: rgba(255,255,255,0.2);
}

.sidebar ul li ul li{
	position: relative;
}

.sidebar ul > li > ul > li:first-child{
	margin-top: 6px;
}

.sidebar ul > li > ul > li:last-child{
	margin-bottom: 6px;
}

.sidebar ul > li > ul{
	height: 0;
	overflow: hidden;
}

.sidebar ul > li > ul > li > ul{
	height: 0;
	overflow: hidden;
}

.sidebar ul > li > ul > li > ul > li:first-child{
	margin: 0;
}

.sidebar ul > li > ul > li > ul > li:last-child{
	margin: 0;
}

.sidebar ul > li > ul > li > a{
	float: left;
	width: 100%;
	height: 40px;
	color: #111;
	font-size: 15px;
	line-height: 20px;
	padding: 8px 0 8px 30px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	transition: opacity 0.15s;
}

.sidebar ul li ul li a:hover{
	opacity: 0.7;
}

.sidebar .a_d{
	position: absolute;
	top: 0px;
	right: 0px;
	display: block;
	width: 40px;
	height: 40px;
	cursor: pointer;
	background: url(../img/a_d.svg) no-repeat;
	background-size: 50%;
	background-position: 8px center;
	transition: opacity 0.15s;
}

.sidebar .a_d.active{
	background: url(../img/a_u.svg) no-repeat;
	background-size: 50%;
	background-position: 8px center;
}

.sidebar .a_d:hover{
	opacity: 0.7;
}

.sidebar ul > li > ul > li > ul > li > a{
	float: left;
	width: 100%;
	height: 34px;
	color: #333;
	font-size: 14px;
	line-height: 1;
	padding: 5px 0 0 47px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	transition: all 0.15s;
}

.sidebar .current:before{
	content: "";
	display: inline-block;
	vertical-align: top;
	width: 0;
	height: 0;
	margin: 6px 0 0 3px;
	border-style: solid;
	border-width: 5px 0 5px 8px;
	border-color: transparent transparent transparent #333;
}

.sidebar ul > li > ul > li > ul > li > a.current:before{
	margin: -1px 0 0 22px;
}

.r_box{
	float: left;
	width: 1040px;
	max-width: 100%;
	padding: 0 20px 0 40px;
}

.p_list{
	float: left;
	width: 100%;
}

.p_box{
	position: relative;
	font-family: "Noto Sans TC";
	float: left;
	width: 25%;
	line-height: 21px;
	padding: 18px;
	z-index: 1;
	border: 1px solid #fff;
	background-color: rgba(255,255,255,0.9);
	transition: all 0.15s;
}

.special_member .p_box{
	width: 100%;
	margin: 0 2% -1px 0 !important;
}

.p_box:nth-child(4n){
	
}

.p_box:hover{
	z-index: 10;
	-webkit-box-shadow: 0px 2px 6px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 2px 6px rgba(0,0,0,0.3);
	box-shadow: 0px 2px 6px rgba(0,0,0,0.3);
	background-color: rgba(255,255,255,0.96);
}

.special_member .p_box:hover{
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	border: 1px solid #d5d5d5;
}

.p_box_img{
	float: left;
	width: 100%;
	padding-bottom: 124%;
	margin-bottom: 10px;
}

.special_member .p_box .p_box_img{
	float: none;
	display: inline-block;
	vertical-align: middle;
	width: 100px;
	padding-bottom: 100px;
	margin: 0 20px 0 0;
}

.iL img{
	display: none;
}

.p_box_img img{
	width: 100%;
}

.p_box_tit{
	display: -webkit-box;
	float: left;
	width: 100%;
	height: 42px;
	font-size: 15px;
	text-align: center;
	letter-spacing: 1px;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.special_member .p_box .p_box_tit{
	float: none;
	display: inline-block;
	vertical-align: middle;
	width: 600px;
	max-width: 100%;
	height: auto;
	padding-left: 30px;
	margin: 0;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.p_box_price, .p_box_price_s{
	float: left;
	width: 100%;
	color: #dc1c24;
	font-size: 23px;
	font-weight: 700;
	text-align: center;
	letter-spacing: 1px;
	margin-bottom: 2px;
	transform: skewX(-10deg);
}

.special_member .p_box .p_price{
	float: right;
	margin-top: 10px;
}

.special_member .p_box .p_box_price, .special_member .p_box .p_box_price_s{
	width: auto;
	width: 100px;
	margin: 0 0 0 10px;
	transform: skewX(0);
}

.special_member .p_box .p_box_price .pbp_l{
	font-family: 'Microsoft JhengHei';
	float: left;
	width: 98px;
	color: #333;
	font-size: 13px;
	text-align: center;
	font-weight: bold;
	line-height: 40px;
	margin-bottom: 6px;
	background: url(../img/id_bg1.svg) no-repeat center;
}

.special_member .p_box .p_box_price .pbp_n{
	float: left;
	width: 100%;
	color: #333;
	font-size: 20px;
	transform: skewX(-10deg);
}

.special_member .p_box .p_box_price_s .pbp_l{
	font-family: 'Microsoft JhengHei';
	float: left;
	width: 98px;
	color: #333;
	font-size: 13px;
	text-align: center;
	font-weight: bold;
	line-height: 40px;
	margin-bottom: 6px;
	background: url(../img/id_bg2.svg) no-repeat center;
}

.special_member .p_box .p_box_price_s .pbp_n{
	float: left;
	width: 100%;
	font-size: 23px;
	transform: skewX(-10deg);
}

.p_row_box{
	float: left;
	width: 100%;
	margin-bottom: 20px;
}

.pt_box{
	width: 100%;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #000;
}

.pt01{background-image: url(../img/pt01.jpg);}
.pt02{background-image: url(../img/pt02.jpg);}
.pt03{background-image: url(../img/pt03.jpg);}
.pt04{background-image: url(../img/pt04.jpg);}
.pt05{background-image: url(../img/pt05.jpg);}
.pt06{background-image: url(../img/pt06.jpg);}

.pt_box_c{
	width: 90%;
	padding: 7% 0 6% 0;
	margin: 0 auto;
}

.s_box{
	float: left;
	width: 100%;
	padding: 50px 30px !important;
}

.store_box{
	float: left;
	width: 100%;
	padding: 20px 0;
}

.store_row{
	float: left;
	width: 100%;
	margin-bottom: 20px;
}

.store{
	float: left;
	width: 50%;
	font-size: 15px;
	padding-right: 10px;
	margin-bottom: 36px;
}

.store_l{
	float: left;
	width: 46%;
	padding-right: 20px;
}

.store_img{
	float: left;
	width: 100%;
	padding-bottom: 67%;
}

.store_r{
	float: left;
	width: 54%;
}

.store_info{
	float: left;
	width: 100%;
}

.desktop_show{
	display: block;
}

.mobile_show{
	display: none;
}

.si_tit{
	float: left;
	width: 100%;
	font-size: 20px;
	padding-bottom: 14px;
}

.si_con{
	font-family: 'Microsoft JhengHei', 'Arial', 'Helvetica', sans-serif;
	float: left;
	width: 100%;
	max-height: 130px;
	font-weight: bold;
	overflow: hidden;
}

.si_row{
	float: left;
	width: 100%;
	padding-bottom: 5px;
}

.si_l{
	float: left;
	width: 76px;
}

.si_r{
	float: left;
	width: calc( 100% - 100px );
}

.si_map{
	display: inline-block;
	vertical-align: middle;
	width: 30px;
	height: 30px;
	background: url(../img/si_map.svg) no-repeat center;
}

.i_banner_box{
	float: left;
	width: 100%;
	padding: 0 20px;
	margin-bottom: 30px;
}

.i_banner_box a{
	float: left;
	width: 33.333333%;
	padding: 10px;
	transition: opacity 0.15s;
}

.i_banner_box a:hover{
	opacity: 0.8;
}

.i_banner_box a img{
	float: left;
	width: 100%;
}

.best_box{
	float: left;
	width: 100%;
}

.best_box_tit{
	float: left;
	width: 100%;
	text-align: center;
}

.tab_box{
	float: left;
	width: 100%;
	text-align: center;
}

.tab_box ul{
	display: inline-block;
	border: 1px solid #ccc;
}

.tabs li{
	float: left;
}

.tabs li a{
	float: left;
	display: block;
	width: 175px;
	line-height: 1;
	font-size: 13px;
	text-align: center;
	padding: 8px;
	border-right: 1px solid #ccc;
	background-color: #F6F6F6;
	transition: all 0.12s;
}

.tabs li.ui-state-active a{
	background-color: #ffffff;
}

.tabs li:last-child a{
	border-right: none;
}

.tab_container{
	float: left;
	width: 100%;
	padding: 10px 20px;
	min-height: 700px;
}

.tab_content{
	float: left;
	width: 100%;
}

.item{
	float: left;
	width: calc( 25% - 20px);
	text-align: left;
	line-height: 1.2;
	margin: 20px 10px 15px 10px;
	overflow: hidden;
	transition: width 0.3s;
}

.p_i1{width: calc( 100% - 20px);}
.p_i2{width: calc( 50% - 20px);}
.p_i3{width: calc( 33.333333% - 20px);}
.p_i4{width: calc( 25% - 20px);}

.item_img{
	position: relative;
    right: -50%;
    display: inline-block;
    vertical-align: top;
    height: 420px;
    margin-bottom: 5px;
    transition: all 0.15s;
}

.item_img:hover{
	opacity: 0.85;
}

.item_img img{
	position: relative;
	top: 0;
	left: -50%;
	width: auto;
	height: 100%;
	display: block;
}

.i_img2{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	pointer-events: none;
	-webkit-animation: i_img2 8s infinite;
	-moz-animation: i_img2 8s infinite;
	-ms-animation: i_img2 8s infinite;
	-o-animation: i_img2 8s infinite;
	animation: i_img2 8s infinite;
}

.item_img img.i_img2{
	position: absolute;
}

@-webkit-keyframes i_img2{
	0%{opacity: 0;}
	45%{opacity: 0;}
	50%{opacity: 1;}
	95%{opacity: 1;}
	100%{opacity: 0;}
}

@-moz-keyframes i_img2{
	0%{opacity: 0;}
	45%{opacity: 0;}
	50%{opacity: 1;}
	95%{opacity: 1;}
	100%{opacity: 0;}
}

@-ms-keyframes i_img2{
	0%{opacity: 0;}
	45%{opacity: 0;}
	50%{opacity: 1;}
	95%{opacity: 1;}
	100%{opacity: 0;}
}

@-o-keyframes i_img2{
	0%{opacity: 0;}
	45%{opacity: 0;}
	50%{opacity: 1;}
	95%{opacity: 1;}
	100%{opacity: 0;}
}

@keyframes i_img2{
	0%{opacity: 0;}
	45%{opacity: 0;}
	50%{opacity: 1;}
	95%{opacity: 1;}
	100%{opacity: 0;}
}

.item_info{
	float: left;
	width: 100%;
	height: 90px;
}

.item_tit{
	float: left;
	display: block;
	width: 100%;
	max-height: 33px;
	line-height: 1.3;
	overflow: hidden;
	margin: 0 0 6px 0;
	transition: all 0.15s;
}

.item_tit:hover{
	opacity: 0.85;
}

.item_price{
	float: left;
	width: 100%;
	margin: 0 0 11px 0;
}

.o_price{
	font-family: "Verdana", "Microsoft JhengHei", Arial, Helvetica, sans-serif;
	float: left;
	color: #aaa;
	padding: 0 6px 0 0;
	text-decoration:line-through;
}

.price{
	font-family: "Verdana", "Microsoft JhengHei", Arial, Helvetica, sans-serif;
	float: left;
}

.i_l{
	float: left;
	min-width: 43px;
	font-size: 12px;
	line-height: 1;
	text-align: center;
	padding: 1px 2px;
	margin: 0 5px 5px 0;
}

/*.l_best{color: #de1124; border: 1px solid #e4aab0;}
.l_new{color: #F05A28; border: 1px solid #f3b09b;}
.l_pick{color: #c33cc1; border: 1px solid #e2b4e1;}
.l_spot{color: #74B320; border: 1px solid #b2dc79;}*/

.l_best{color: #de1124; border: 1px solid rgba(222,17,36,0.4);}
.l_new{color: #F05A28; border: 1px solid rgba(240,90,40,0.5);}
.l_pick{color: #c33cc1; border: 1px solid rgba(195,60,193,0.4);}
.l_spot{color: #74B320; border: 1px solid rgba(116,179,32,0.6);}

.product_box{
	float: left;
	width: 100%;
	padding: 30px 20px;
}

.product_top_box{
	position: relative;
	float: left;
	width: 100%;
	text-align: center;
	padding: 0 0 10px 0;
}

.product_top_box h1{
	margin: 0;
}

.product_nav{
	position: absolute;
	top: 30px;
	left: 20px;
}

.p_nav{
	float: left;
	margin-right: 25px;
	transition: all 0.15s;
}

.p_nav:hover{
	opacity: 0.6;
}

.p_nav_a{
	border-bottom: 1px solid #ccc;
}

.p_nav.s_i_al_b:before{
	font-size: 20px;
	margin: 3px 0 0 0;
}

.product_display{
	position: absolute;
	top: 30px;
	right: 20px;
}

.p_d_box{
	display: none;
	float: left;
	margin-right: 10px;
}

.p_d_box button{
	float: left;
	margin-right: 3px;
}

.p_d_box button:before{
	color: rgba(0,0,0,0.1);
	transition: all 0.15s;
}

.p_d_box button:hover:before{
	color: rgba(0,0,0,0.25);
}

.p_d_box button.b_active:before{
	color: rgba(0,0,0,0.25);
}

.product_kv{
	float: left;
	width: 100%;
	height: 0;
	overflow: hidden;
	padding: 20px 10px 40% 10px;
	margin: 0 0 15px 0;
}

.product_kv img{
	width: 100%;
}

.product{
	float: left;
	width: 100%;
}

.pagination_box{
	float: left;
	width: 100%;
	text-align: center;
	margin-top: 30px;
}

.c_box .pagination_box{
	margin: 10px 0 20px 0;
}

.pagination{
	display: inline-block;
}

.pagination ul{
	float: left;
}

.pagination ul li{
	float: left;
	margin: 0 0 5px -1px;
}

.pagination ul li{
	float: left;
	cursor: pointer;
	border: 1px solid #ccc;
	background-color: #fff;
}

.pagination ul li:hover{
	background-color: #f3f3f3;
}

.pagination ul li.active{
	background-color: #f3f3f3;
}

.pagination ul li a, .pagination ul li span{
	float: left;
	height: 30px;
	padding: 7px 11px;
	line-height: 1;
}

.s_product{
	font-family: 'Microsoft JhengHei', 'Arial', 'Helvetica', sans-serif;
	float: left;
	width: 100%;
	font-size: 15px;
	line-height: 1.4;
	padding: 60px;
	background-color: rgba(255,255,255,0.93);
}

.s_product .select_box{
	width: 100%;
	height: 36px;
	border: 1px solid #4267b2;
}

.s_product .select_box:after{
	width: 36px;
	height: 36px;
}

.s_product .select_box .form_control{
	font-size: 15px;
	height: 36px;
}

.s_p_nav{
	float: left;
	width: 100%;
	padding: 0 0 15px 0;
}

.s_p_box{
	float: left;
	width: 100%;
}

.s_p_main{
	float: left;
	width: 100%;
	padding: 0 0 20px 0;
}

.pd_img_box{
	position: relative;
	float: left;
	width: 50%;
	margin-left: 2%;
	overflow: hidden;
}

.pd_img{
	float: left;
	width: 88%;
	height: 530px;
	margin: 0 6%;
}

.pd_img .swiper-slide{
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

.pd_img .swiper-slide:before{
	content: "";
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}

.pd_img .swiper-slide img{
	display: inline-block;
	vertical-align: middle;
	max-width: 90%;
	max-height: 90%;
}

.pd_img .swiper-button-next{
	top: auto;
	bottom: 21px;
	right: -3px;
	opacity: 0.6;
	background-image: url(../img/a_n.svg);
	background-size: 56% auto;
}

.pd_img .swiper-button-prev{
	top: auto;
	bottom: 21px;
	left: -3px;
	opacity: 0.6;
	background-image: url(../img/a_p.svg);
	background-size: 56% auto;
}

.pd_img .swiper-button-disabled{
	opacity: 0.2;
}

.pd_img .swiper-pagination-bullet{
	opacity: 0.2;
	background-color: #4267b2;
}

.pd_img .swiper-pagination-bullet-active{
	opacity: 1;
}

.gallery-top{
	height: 80%;
	width: 100%;
	text-align: center;
	overflow: hidden;
}

.gallery-top.one_img{
	height: 100%;
}

.gallery-top .swiper-slide a{
	float: left;
	width: 100%;
	height: 100%;
}

.gallery-top .swiper-slide a img{
	display: none;
}

.gallery-top .swiper-pagination, .gallery-top .swiper-button-next, .gallery-top .swiper-button-prev{
	display: none;
}

.gallery-thumbs{
	height: 20%;
	padding: 16px 0;
	overflow: hidden;
}

.gallery-thumbs .swiper-slide{
	width: 25%;
	height: 100%;
	text-align: center;
	opacity: 0.6;
	border: 1px solid #ccc;
	cursor: pointer;
	transition: opacity 0.15s;
}

.gallery-thumbs .swiper-slide:hover{
	opacity: 1;
}

.gallery-thumbs .swiper-slide-thumb-active{
	opacity: 1;
}

.fancybox-bg{
	background: #000;
}

.fancybox-is-open .fancybox-bg{
	opacity: 1;
}

.fancybox-slide--image .fancybox-content{
	margin-bottom: 0;
}

.fancybox-toolbar{
	margin-right: 0 !important;
}

.fancybox-button{
	background: transparent;
}

.fancybox-button svg path{
	fill: transparent;
	stroke: currentColor;
	stroke-linejoin: round;
	stroke-width: 3;
}

.fancybox-navigation .fancybox-button{
	opacity: 0.6 !important;
	margin-top: -19px;
}

.fancybox-navigation .fancybox-button:hover{
	opacity: 1 !important;
}

.fancybox-navigation .fancybox-button--arrow_left{
	background: url(../img/a_p_w.svg) no-repeat center;
}

.fancybox-navigation .fancybox-button--arrow_right{
	background: url(../img/a_n_w.svg) no-repeat center;
}

.fancybox-navigation .fancybox-button--arrow_left svg, .fancybox-navigation .fancybox-button--arrow_right svg{
	display: none;
}

.fancybox-slide--image{
	padding: 44px 0;
}

.s_p_img{
	position: relative;
	float: left;
	width: 370px;
	text-align: center;
}

.s_p_img a{
	float: left;
	width: 100%;
}

.s_p_img img{
	float: left;
	width: 100%;
}

.s_p_img_t{
	float: right;
	font-size: 12px;
	color: #555;
}

.s_p_img_t:before{
	font-size: 22px;
	margin: 1px 0 0 0;
}

.s_p_info{
	position: relative;
	float: left;
	width: 46%;
	padding: 0 0 0 40px;
}

.s_p_tit{
	font-family: 'Noto Sans TC';
	float: left;
	width: 100%;
	color: #4267b2;
	font-size: 26px;
	font-weight: 500;
	line-height: 1.4;
	margin-bottom: 10px;
	padding: 0 0 10px 0;
	margin-bottom: 10px;
	border-bottom: 1px solid #ccc;
}

.s_p_row{
	float: left;
	width: 100%;
	padding: 0 0 16px 0;
}

.s_p_row_tit{
	float: left;
	width: 100%;
	color: #4267b2;
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 10px;
}

.s_p_r_l{
	float: left;
	width: 12%;
	padding: 0 10px 0 0;
}

.s_p_r_r{
	float: left;
	width: 88%;
}

.s_product .o_price{
	padding: 0 10px 0 0;
}

.s_product .price{
	color: #e50012;
	font-size: 13px;
	font-weight: bold;
}

.s_p_color .b1_s{
	position: relative;
	padding: 5px 12px;
	margin-right: 6px;
	margin-bottom: 4px;
	border: 1px solid #e6e6e6;
	background-color: #F6F6F6;
}

.s_p_color .b1_s:hover{
	border: 1px solid #ccc;
}

.s_p_color .s_c_a{
	color: #000;
	border: 1px solid #e50012;
	background-color: #fff;
}

.s_p_color .s_c_a:hover{
	color: #000;
	border: 1px solid #e50012;
}

.s_p_color .s_c_a:before{
	font-family: 'styleo', 'Microsoft JhengHei', Arial, Helvetica, sans-serif;
	content: "\e90e";
	position: absolute;
	bottom: -3px;
	right: -3px;
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	border-radius: 100%;
	background-color: #e50012;
}

.q_box{
	float: left;
}

.s_p_r_t{
	display: inline-block;
	vertical-align: middle;
	padding-right: 8px;
}

.quantity_box{
	display: inline-block;
	vertical-align: middle;
	border: 1px solid #4267b2;
}

.quantity_box .quantity{
	float: left;
}

.quantity_box input{
	float: left;
	width: 30px;
	height: 30px;
	font-size: 15px;
	font-weight: bold;
	text-align: center;
	padding: 0;
	border: none;
}

.quantity_box .b1_s{
	float: left;
	width: 30px;
	height: 30px;
	padding: 0;
	border: none;
}

.quantity_box .b1_s.s_i_minus{
	border-right: 1px solid #ccc;
	background: url(../img/minus.svg) no-repeat center #fff;
}

.quantity_box .b1_s.s_i_plus{
	border-left: 1px solid #ccc;
	background: url(../img/plus.svg) no-repeat center #fff;
}

.quantity_box .b1_s:hover{
	background-color: #f3f7fc;
}

.s_p_price_box{
	display: inline-block;
	vertical-align: middle;
	margin-right: 20px;
}

.s_p_price{
	font-family: 'Noto Sans TC', 'Microsoft JhengHei', 'Arial', 'Helvetica', sans-serif;
	display: inline-block;
	vertical-align: middle;
	color: #dc1c24;
	font-size: 20px;
	font-weight: 700;
	text-align: center;
	letter-spacing: 1px;
	transform: skewX(-10deg);
}

.p_b{
	font-size: 27px;
}

.s_p_row_b{
	position: absolute;
	bottom: 12px;
	right: 0;
}

.s_p_row_b .b1{
	margin-right: 10px;
}

.s_p_r_b{
	float: left;
	width: 100%;
	padding: 0 0 0 12%;
}

.s_p_r_b .b1{
	float: right;
	margin: 0 0 0 10px;
}

.s_p_con{
	float: left;
	width: 100%;
	padding: 10px 0;
}

.sp_tit{
	font-family: "Noto Sans TC";
	width: 100%;
	color: #4267b2;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 1px;
	padding-bottom: 10px;
	margin-bottom: 16px;
	border-bottom: 1px solid #ccc;
}

.s_p_detailed{
	width: 100%;
	max-width: 700px;
	line-height: 1.8;
	margin: 0 auto;
}

.video_box{
	position: relative;
	float: left;
	width: 100%;
	padding-bottom: 56.24%;
	margin: 10px 0;
	background-color: #f1f1f1;
}

.video_box iframe, .video_box video{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.s_p_detailed img{
	display: block;
	float: left;
	width: 100%;
	margin: 10px 0;
}

.recommend_box{
	float: left;
	width: 100%;
	margin-bottom: 20px;
}

.recommend{
	float: left;
	width: 100%;
}

.recommend .item{
	width: calc( 100% - 20px);
}

.owl-prev{
	position: absolute;
	top: 38%;
	left: -50px;
	width: 30px;
	height: 58px;
	background-image: url(../img/a_p.svg);
	background-size: auto 100%;
	transition: opacity 0.15s;
}

.owl-next{
	position: absolute;
	top: 38%;
	right: -50px;
	width: 30px;
	height: 58px;
	background-image: url(../img/a_n.svg);
	background-size: auto 100%;
	transition: opacity 0.15s;
}

.c_box{
	float: left;
	width: 100%;
	padding: 10px 60px;
}

.c_con{
	float: left;
	width: 100%;
}

.c_nav{
	float: left;
	width: 100%;
	margin-bottom: -3px;
}

.c_nav ul{
	float: left;
	border: 3px solid #4267b2;
	border-bottom: none;
}

.c_nav li{
	float: left;
}

.c_nav li a, .c_nav li button{
	position: relative;
	float: left;
	display: block;
	color: #fff;
	width: 130px;
	line-height: 1;
	font-size: 15px;
	text-align: center;
	padding: 11px;
	background-color: #4267b2;
	transition: all 0.12s;
}

.c_nav li a:hover, .c_nav li button:hover{
	background-color: #5179ca;
}

.c_nav li:last-child a, .c_nav li:last-child button{
	border-right: none;
}

.c_nav li a .m_n, .c_nav li button .m_n{
	position: static;
	display: inline-block;
	vertical-align: top;
	width: 14px;
	height: 14px;
	margin: 0 0 0 2px;
}

.c_nav li a.c_nav_active, .c_nav li button.c_nav_active{
	color: #4267b2;
	background-color: #fff;
}

.c_nav li a.logout, .c_nav li button.logout{
	
}

.c_nav li a.logout:hover, .c_nav li button.logout:hover{
	background-color: #ebebeb;
}

.logout{
	display: none !important;
}

.c_nav_r{
	float: right;
}

.balance{
	float: left;
	margin: 12px 20px 0 0;
}

.c_s_cart{
	float: left;
	font-size: 16px;
	margin-top: 3px;
	transition: opacity 0.15s;
}

.c_s_cart:before{
	content: "";
	display: inline-block;
	vertical-align: middle;
	width: 30px;
	height: 30px;
	margin: -4px 4px 0 0;
	background: url(../img/shopping_cart_blue.svg) no-repeat left;
}

.c_s_cart:after{
	content: "";
	display: inline-block;
	vertical-align: middle;
	width: 18px;
	height: 18px;
	margin: -2px 0 0 6px;
	background: url(../img/a_n.svg) no-repeat left;
}

.c_s_cart:hover{
	opacity: 0.7;
}

.c_nav_cb{
	float: right;
	margin-top: 2px;
	transition: all 0.12s;
}

.c_nav_cb:hover{
	opacity: 0.8;
}

.c_nav_cb:before, .c_nav_cb:after{
	font-size: 24px;
}

.c_nav_cb:after{
	font-size: 20px;
	margin: 3px 0 0 -1px;
}

.row_box{
	font-family: 'Microsoft JhengHei', 'Arial', 'Helvetica', sans-serif;
	float: left;
	width: 100%;
	font-size: 15px;
	font-weight: bold;
	margin-bottom: 15px;
	border: 3px solid #4267b2;
	background-color: rgba(255,255,255,0.96);
}

.row_box_login{
	border: none;
	background-color: transparent;
}

.row_box_con.login{
	width: 400px;
	padding: 30px 20px 10px 20px !important;
	margin: 0 0 0 290px;
	border: 3px solid #4267b2;
	background-color: rgba(255,255,255,0.96);
}

.row_box_con.login .login_box{
	margin-left: -26px;
	border: none;
}

.row_box_con.login h2{
	color: #4267b2;
	font-size: 22px;
	text-align: center;
	padding: 0;
	margin-bottom: 20px;
	background-color: transparent;
}

.row_box_con.login h2:before{
	display: none;
}

.row_box2{
	width: 50%;
}

.row_box2:first-child{
	border-right: none;
}

.row_box_con{
	float: left;
	width: 100%;
	padding: 10px 20px 20px 20px;
}

.mh{
	min-height: 500px;
}

.common{
	padding: 30px 120px;
}

.common img{
	max-width: 100%;
	padding: 6px 0;
}

.common_tit{
	font-size: 20px;
	line-height: 1.4;
	margin-bottom: 10px;
}

.common_t{
	float: left;
	width: 100%;
	padding: 4px 0;
}

.row{
	float: left;
	width: 100%;
	line-height: 28px;
	padding: 10px;
}

#home_delivery, #pay_atm, #pay_convenience_store{
	display: none;
}

.row_l{
	float: left;
	width: 20%;
	min-height: 10px;
	text-align: right;
	padding: 0 10px 0 0;
}

.row_r{
	position: relative;
	float: left;
	width: 80%;
}

.m_id{
	float: left;
	width: 110px;
	height: 46px;
	font-weight: bold;
	text-align: center;
	line-height: 46px;
	margin-top: -8px;
	background: url(../img/id_bg1.svg) no-repeat center;
}

.m_id_s{
	float: left;
	width: 110px;
	height: 46px;
	font-weight: bold;
	text-align: center;
	line-height: 46px;
	margin-top: -8px;
	background: url(../img/id_bg2.svg) no-repeat center;
}

.row input{
	width: 250px;
	max-width: 400px;
	height: 30px;
}

.row img{
	float: left;
}

.row_i_l{
	width: 100% !important;
	margin: 5px 0;
}

.row_i_s{
	width: 70px !important;
	margin-right: 10px;
}

.row .select_box{
	width: 250px;
	height: 30px;
	margin-right: 10px;
}

.row .select_box_s{
	width: 100px;
}

.row .select_box_m{
	width: 180px;
}

.row .select_box_l{
	width: 500px;
}

.row .form_control{
	height: 30px;
	font-size: 14px;
}

.row textarea.form_control{
	height: 140px;
}

.row_r_t{
	float: left;
	width: 100%;
}

.row .row_note{
	float: left;
	color: #999;
	font-size: 12px;
	line-height: 1.3;
	margin: 2px 0 -8px 0;
}

.new{
	float: left;
	width: 100%;
	line-height: 1.4;
	margin-bottom: 12px;
	overflow:hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.new_date{
	color: #A5A4A4;
	padding-right: 6px;
}

.new_l{
	float: left;
	width: 10%;
	color: #A5A4A4;
}

.new_r{
	float: left;
	width: 90%;
}

.new:hover .new_r{
	color: #4267b2;
	text-decoration: underline;
}

.new:hover .new_tit{
	color: #4267b2;
	text-decoration: underline;
}

.bg_g{
	background-color: #f5f5f5;
}

.t_ul{
	text-decoration: underline !important;
}

.cb_box_l{
	float: left;
	margin: 0 3px 6px 0;
}

.cb_box{
	float: left;
	margin: 8px 8px 8px 0;
}

.cb_box .select_box{
	width: 80px;
}

.cb_box_t{
	float: left;
	margin: 6px 6px 0 0;
}

.row_b{
	float: left;
	width: 100%;
	padding: 0 0 0 20%;
}

.row_b .b1{
	margin-right: 5px;
}

.row_b .b1:last-child{
	margin-right: 0;
}

.row_r_b{
	float: left;
	width: 100%;
	padding: 0 0 5px 0;
}

.row_i{
	float: left;
	width: 100%;
}

.r_t_r{
	float: left;
	width: 100%;
	text-align: right;
	padding: 0 0 10px 0;
}

.r_t_r .b1{
	margin-left: 10px;
}

.row_box .r_t_r .b1{
	margin-right: 10px;
	margin-left: 0;
}

.c_box .message_box{
	padding: 0;
}

.c_box .message_row{
	font-size: 14px;
	padding: 6px 10px;
}

.c_box .message_row .m_date{
	width: 10%;
}

.c_box .message_row .m_con{
	width: 90%;
}

.c_box .cart_box{
	padding: 0;
}

.c_box .cart_row{
	font-size: 15px;
}

.c_box .cart_header{
	color: #666;
	font-size: 14px;
	padding: 6px 0;
}

.c_box .cf1 img{
	max-width: 100px;
}

.c_box .c_f .s_i_p_cart:before{
	opacity: 1;
	transition: opacity 0.15s;
}

.c_box .c_f .s_i_p_cart:hover:before{
	opacity: 0.6;
}

.c_box .c_f .s_i_cross{
	display: inline-block;
	vertical-align: middle;
	width: 30px;
	height: 30px;
	opacity: 0.8;
	background: url(../img/x.svg) no-repeat center;
	transition: opacity 0.15s;
}

.c_box .s_i_cross:hover{
	opacity: 0.5;
}

.c_box .c_f .add_sc{
	display: inline-block;
	vertical-align: middle;
	width: 40px;
	height: 40px;
	background: url(../img/add_sc.svg) no-repeat center;
}

.c_box .total_box{
	width: 42%;
	font-size: 15px;
}

.c_box .total_box .total_row_l{
	width: 76%;
}

.c_box .total_box .total_row_r{
	width: 24%;
}

.h_order{
	float: left;
	width: 100%;
	text-align: center;
}

.h_order_s{
	float: left;
	width: 100%;
}

.order{
	float: left;
	width: 100%;
}

.h_order_row{
	float: left;
	width: 100%;
	border-bottom: 1px solid #ccc;
}

table{
	width: 100%;
	font-size: 14px;
	text-align: center;
}

table thead th{
	padding: 0 0 5px 0;
}

table tr{
	border-bottom: 1px solid #ccc;
}

table tr td{
	line-height: 1.3;
	padding: 10px 0;
}

table td img{
	max-width: 60px;
	margin: 5px 0;
	vertical-align: middle;
}

.o_s1{color: #dc1c24;}
.o_s2{color: #16ba1c;}
.o_s3{color: #000;}

.h_order_top{
	float: left;
	width: 100%;
	padding: 6px 15px;
	border-bottom: 1px solid #e0e0e0;
	background-color: #fffbe0;
}

.h_o_t{
	float: left;
	padding: 0 20px 0 0;
}

.h_order_top button.b1{
	float: right;
	font-size: 14px;
	font-weight: normal;
	padding: 3px 10px 3px 5px;
}

.h_order_top button.b1:before{
	content: "";
	display: inline-block;
	vertical-align: middle;
	width: 17px;
	height: 17px;
	opacity: 0.8;
	background: url(../img/x.svg) no-repeat center;
}

.h_order_top button.b1:hover{
	color: #dc1c24;
	opacity: 1;
	border: 1px solid #dc1c24;
	background-color: #fff;
}

.h_order_top button.b1:hover:before{
	background: url(../img/x_h.svg) no-repeat center;
}

.c_box .h_order .cf1{width: 10%;}
.c_box .h_order .cf2{width: 12%;}
.c_box .h_order .cf3{width: 18%;}
.c_box .h_order .cf4{width: 12%;}
.c_box .h_order .cf5{width: 12%;}
.c_box .h_order .cf6{width: 10%;}
.c_box .h_order .cf7{width: 10%;}
.c_box .h_order .cf8{width: 10%;}

.discount_coupon{
	float: left;
	width: 100%;
	text-align: center;
}

.c_box .discount_coupon .cf1{width: 22%;}
.c_box .discount_coupon .cf2{width: 27%;}
.c_box .discount_coupon .cf3{width: 16%;}
.c_box .discount_coupon .cf4{width: 12%;}
.c_box .discount_coupon .cf5{width: 19%;}

.c_f a{
	font-size: 14px;
	font-weight: 500;
}

.i_box{
	float: left;
	width: 100%;
	padding: 6px 20px;
}

.i_box_con{
	float: left;
	width: 100%;
	font-size: 14px;
	margin: 0 0 20px 0;
}

.i_row{
	float: left;
    width: 100%;
    line-height: 1.3;
    padding: 6px;
    border-bottom: 2px solid #ffffff;
    background-color: #f5f5f5;
}

.i_row:last-child{
	border-bottom: none;
}

.i_row_l{
	float: left;
	width: 8%;
	padding: 0 10px;
}

.i_row_r{
	float: left;
	width: 92%;
}

.i_row_r ul.payment{
	float: left;
	width: 100%;
}

.i_row_r ul li{
	display: inline-block;
	vertical-align: middle;
	font-size: 15px;
	margin: 5px 8px 5px 0;
}

.i_row_r input{
	width: 220px;
	max-width: 100%;
}

.e_box{
	width: 80%;
}

.e_box2{
	width: 100%;
	min-height: 212px;
}

.s_cart{
	float: left;
	width: 100%;
}

.s_cart .cf1{
	/*width: 12%;*/
	width: 20%;
}

.s_cart .cf2{
	width: 27%;
}

.s_cart .cf8{
	width: 3%;
}

h1.s_cart_h1{
	width: auto;
}

.checkout{
	float: left;
	color: #4267b2;
	font-size: 28px;
	font-weight: 700;
	line-height: 1;
	margin-bottom: 20px;
}

.step{
	float: left;
	font-size: 17px;
	padding: 6px 0 0 20px;
}

.step span{
	color: #aaa;
}

.step span:after{
	content: "";
	display: inline-block;
	vertical-align: middle;
	width: 12px;
	height: 18px;
	opacity: 0.4;
	margin: -2px 0 0 6px;
	background: url(../img/a_n.svg) no-repeat left;
}

.step span:last-child:after{
	display: none;
}

.step span.step_a{
	color: #333;
}

.step span.step_a:after{
	opacity: 1;
}

.order_completed{
	float: left;
	width: 100%;
	text-align: center;
	padding: 40px 0;
}

.order_tick{
	display: inline-block;
	width: 70px;
	height: 70px;
	border: 1px solid #4267b2;
	border-radius: 70px;
	background: url(../img/c_v_b.svg) no-repeat center;
}

.order_tick:before{
	position: relative;
	float: none;
	top: 10px;
	left: 1px;
	font-size: 50px;
}

.order_c_tit{
	display: inline-block;
	width: 100%;
	font-size: 20px;
	padding: 10px;
}

.order_c_con{
	display: inline-block;
	width: 100%;
	padding: 0 0 10px 0;
}

.search_t_box{
	padding-left: 20px;
}

.search_t_box h1{
	margin: 0;
}

.search_t{
	display: inline-block;
	font-size: 15px;
	padding-left: 20px;
}

.sweet-alert{
	font-family: "Lato", "Microsoft JhengHei", Arial, Helvetica, sans-serif;
	border-radius: 0;
}

.sweet-alert h2{
	font-size: 26px;
	margin: 15px 0;
}



.clearfix{
	clear: both;
}

.a_d_b{
	display: block !important;
}

.a_d_i_b{
	display: inline-block !important;
}

.a_d_n{
	display: none !important;
}

.br_m{
	display: none;
}

.d_n{
	display: none;
}

.h_d{
	display: none;
}

.h_d_i{
	display: none;
}

.hide{
	display: none;
}

#gotop{
	position: fixed;
	right: 20px;
	bottom: 20px;
	width: 40px;
	height: 40px;
	z-index: 1000;
	opacity: 0;
	visibility: hidden;
	background: url(../img/top.svg) no-repeat center;
	transition: all 0.3s;
}

#gotop:hover{
	opacity: 0.8 !important;
}

footer{
	font-size: 14px;
	width: 100%;
	padding: 20px;
	background-color: rgba(0,0,0,0.7);
}

.footer_box{
	width: 1200px;
	margin: 0 auto;
}

.add_line{
	display: none;
}

.footer_l{
	float: left;
}

.footer_l img{
	float: left;
	max-width: 220px;
	padding: 10px;
}

.footer_r{
	float: left;
	width: calc(100% - 440px);
	color: #fff;
	padding: 10px 0 0 30px;
}

.footer_r_top{
	float: left;
	width: 100%;
	margin-bottom: 20px;
}

.footer_r_top a{
	float: left;
	color: #fff;
	padding-right: 20px;
	margin-right: 20px;
	border-right: 1px solid #ccc;
	transition: color 0.15s;
}

.footer_r_top a:hover{
	color: #eee;
}

.footer_r_top a:last-child{
	border-right: none;
}

.fb_i{
	color: #6f9eff !important;
	font-size: 16px;
	transition: color 0.15s;
}

.fb_i:hover{
	color: #7ca7ff;
}

.fb_i:before{
	content: "";
	display: inline-block;
	vertical-align: middle;
	width: 36px;
	height: 36px;
	margin: -6px 0 0 -10px;
	background: url(../img/fb_i.svg) no-repeat center;
}

.f_row{
	float: left;
	width: 100%;
	padding-bottom: 10px;
}

.copyright{
	float: left;
	width: 100%;
	padding-top: 5px;
}

.f_box{
	display: inline-block;
	vertical-align: top;
	text-align: left;
	line-height: 30px;
}

.f_box_f{
	font-size: 14px;
	width: 30%;
}

.f_box_middle{
	display: inline-block;
	width: 35%;
}

.f_box_s{
	width: 49%;
}

.f_box_l{
	width: 42%;
}

.f_box a{
	float: left;
	width: 100%;
	transition: all 0.15s;
}

.f_box.f_box_l a{
	width: 33.333%;
}

.f_box a:hover{
	opacity: 0.7;
}

.f_box a:before{
	font-size: 20px;
	margin: 6px 3px 0 0;
}

.f_box a.s_i_fb:before{
	color: #4267b2;
}

.f_box a.s_i_line:before{
	color: #01b901;
}

.f_box a.s_i_mail:before{
	color: #dd4f43;
	font-size: 17px;
	margin: 8px 3px 0 0;
}

.f_box_tit{
	float: left;
	width: 100%;
	font-size: 18px;
	line-height: 1;
	padding: 3px 0 12px 0;
}

.f_box_tit_s{
	font-size: 15px;
}

.footer_copy{
	font-size: 14px;
	text-align: center;
	padding: 10px 0 13px 0;
}

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

h1{
	font-size: 24px;
	margin-bottom: 16px;
}

.content{
	width: 1100px;
}

.footer_box{
	width: 1100px;
}

}

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

body:after{
	opacity: 0.8;
}

h2{
	font-size: 20px;
	height: 40px;
}

.h2t{
	padding: 10px 15px;
}

.hb span{
	height: 5px;
}

header{
	height: 50px !important;
	-webkit-box-shadow: 0px 1px 5px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 1px 5px rgba(0,0,0,0.2);
	box-shadow: 0px 1px 5px rgba(0,0,0,0.2);
	background-color: #fff;
}

.navigation{
	position: relative;
	width: 100%;
	height: 50px;
	margin: 0 auto;
}

.header_s .navigation{
	margin: 0 auto;
}

.nav_top_box{
	width: 100%;
	height: 50px !important;
}

.logo{
	position: absolute;
	top: 8px !important;
	left: 50%;
	width: 100px !important;
	height: 36px !important;
	margin: 0 0 0 -50px !important;
}

.header_s .logo{
	height: 50px;
	margin-top: 7px;
}

.nav_top_box_r{
	width: 100%;
	height: 0;
	top: 10px !important;
}

.nav_top_box_m{
	float: right;
	padding-right: 10px;
}

.n_r_i{
	height: 37px !important;
	padding: 0 0 0 9px !important;
}

.n_r_i.s_i_cart:hover .dropdown{
	visibility: hidden;
	opacity: 0;
}

.n_r_i.s_i_message{
	padding: 0 1px 0 9px !important;
}

.n_r_i.s_i_message:hover .dropdown{
	visibility: hidden;
	opacity: 0;
}

.m_n{
	right: -5px;
}

.d_active{
	visibility: visible !important;
	opacity: 1 !important;
}

.n_r_i.s_i_search{
	margin-left: 40px;
}

.d_trigger{
	position: absolute;
	top: -12px !important;
	right: -5px !important;
	width: 100% !important;
	height: 50px !important;
}

.n_r_i.s_i_member .l_trigger{
	position: absolute;
	top: -12px;
	right: -10px;
	width: 39px;
	height: 50px;
}

.n_r_i.s_i_message .d_trigger{
	right: -7px !important;
}

.dropdown{
	top: 37px;
	transition: all 0s;
}

.header_s .dropdown{
	top: 37px;
}

.dropdown:before{
	right: 11px;
}

.d_c_b_h{
	max-height: calc(100vh - 110px);
}

.header_s .d_c_b_h{
	max-height: calc(100vh - 110px);
}

.n_r_i.s_i_search .dropdown{
	position: absolute;
	top: 37px;
	left: 0;
	width: 360px;
	text-align: left;
	padding: 10px 20px;
	border: 1px solid #ccc;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1);
	background-color: rgba(255,255,255,1);
	z-index: 100;
	opacity: 0;
	visibility: hidden;
	cursor: default;
}

.n_r_i.s_i_search .dropdown:before{
	display: block;
	right: auto;
	left: 15px;
}

.n_r_i.s_i_search .dropdown .s_i_search{
	top: 10px;
	right: 20px;
	border: none;
	background-color: #000;
}

.n_r_i.s_i_search .dropdown .s_i_search:before{
	color: #fff;
	font-size: 30px;
	margin: 0;
}

.scrollbar-macosx > .scroll-element .scroll-bar{
	color: #bbb;
	opacity: 1;
}

.s_i_cart{
	margin: 0;
}

.s_i_cart .shopping_cart{
	width: 50px;
	height: 50px;
	background-size: 60%;
}

.s_i_cart .quantity{
	top: 8px;
	right: 0;
	font-size: 11px;
}

.s_i_member{
	margin: 0;
}

.i_member{
	width: 50px;
	height: 50px;
	background-size: 60%;
}

.s_i_member_link{
	display: none;
}

.m_menu_b{
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	width: 50px;
	height: 50px;
	z-index: 600;
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-image: url(../img/m_menu_b.svg);
}

.m_menu_b_a{
	background-image: url(../img/m_menu_b_x.svg);
}

.m_menu_bg{
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	visibility: hidden;
	opacity: 0;
	z-index: 100;
	background-color: rgba(0,0,0,0.7);
	transition: all 0.35s ease;
}

.search_box{
	position: fixed;
	top: 0;
	left: 50px;
	width: 50px;
	margin-bottom: 0;
	z-index: 2600;
}

.sb_m{
	display: block;
}

.search_trigger{
	display: block;
	float: left;
	width: 50px;
	height: 50px;
	background: url(../img/search_b.svg) no-repeat left;
	background-size: 58%;
}

.search{
	position: fixed;
	top: 50px;
	left: 0;
	padding: 10px;
	opacity: 0;
	visibility: hidden;
	z-index: 2600;
	background-color: #000;
	transition: all 0.15s;
}

.search.show{
	opacity: 1;
	visibility: visible;
}

.search_b{
	opacity: 1 !important;
	background: url(../img/search_b_w.svg) no-repeat center;
	background-color: rgba(255,255,255,0.3);
}

.nav_box{
	position: absolute;
	top: 50px;
	left: 0;
	width: 100%;
	border: none;
	visibility: hidden;
	opacity: 0;
	-webkit-box-shadow: 0px 1px 5px rgba(0,0,0,0);
	-moz-box-shadow: 0px 1px 5px rgba(0,0,0,0);
	box-shadow: 0px 1px 5px rgba(0,0,0,0);
	background-color: #fff;
	pointer-events: none;
	transition: all 0s;
}

.nav_box:after{
	content: " ";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	border-bottom: 1px solid #ccc;
}

.nav_box_a{
	visibility: visible;
	opacity: 1;
	pointer-events: auto;
	margin: 0;
}

.nav_box nav{
	width: 100%;
}

.nav_box ul.menu{
	width: 100%;
	padding: 10px 0;
}

.nav_box ul.menu li{
	width: 33.333333% !important;
	margin: 0 !important;
}

.nav_box ul.menu li a{
	float: left;
	width: 100%;
	height: auto;
	font-size: 15px;
	line-height: 1.4;
	padding: 10px 0;
}

.nav_box ul.menu li a:after{
	transform: skewX(0);
}

.nav_box ul.menu li a span.n_b_e{
	display: none;
}

.nav_box ul.menu li a span.n_b_c{
	visibility: visible;
	opacity: 1;
	top: 9px;
	height: 20px;
	font-size: 13px;
	padding: 3px 0 0 0;
	border-right: 1px solid #ccc;
}

.nav_box ul.menu li:nth-child(4n) a span.n_b_c{
	border-right: none;
}

.nav_box ul.menu ul.submenu{
	position: static;
	display: none;
	visibility: visible;
	opacity: 1;
	float: left;
	width: 100% !important;
	border: none;
	border-bottom: 1px solid #ddd;
}

.nav_box ul.menu ul.submenu li{
	float: left;
	width: 100%;
	border-bottom: 1px solid #eee;
}

.nav_box ul.menu ul.submenu li:last-child{
	border-bottom: 0;
}

.nav_box ul.menu ul.submenu li a{
	float: left;
	width: 100%;
	padding: 0;
	border-bottom: none;
}

.nav_box ul.menu ul.submenu ul{
	position: static;
	display: none;
	visibility: visible;
	opacity: 1;
	top: 0;
	left: 0;
	float: left;
	width: 100%;
	border-top: 1px solid #eee;
	border-bottom: none;
}

.nav_box ul.menu li .n_a{
	position: absolute;
	display: none;
	top: 0;
	right: 0;
	width: 46px !important;
	height: 46px;
	padding: 0 !important;
	z-index: 300;
	border-left: 1px solid #ddd;
	background-image: url(../img/n_a_d.svg);
	transition: all 0s;
}

.nav_box ul.menu li ul li .n_a{
	border-left: 1px solid #eee;
}

.nav_box ul.menu li .n_a_u{
	background-image: url(../img/n_a_u.svg);
}

.nav_box ul.menu li a.news{
	padding: 10px 0;
}

.nav_box ul.menu li a.news:before{
	display: none;
}

.nav_box_r{
	float: right;
	padding: 0;
	margin: 0;
}

.s_i_member a{
	padding: 0;
}

.d_c_box{
	height: 100%;
}

.s_member_x{
	right: -22px;
	width: 22px;
	height: 22px;
}

.arrow-bottom{
	display: none;
}

.arrow-right{
	display: none;
}

.swipe_area{
	position: fixed;
	width: 26px;
	height: 100vh;
}

.desktop_show{
	display: none;
}

.mobile_show{
	display: block;
}

.countdown_box{
	padding: 0 26px 20px 26px;
}

.countdown{
	width: 100%;
	padding: 10px 0;
}

.countdown img{
	width: 150px;
}

.countdown_t1{
	font-size: 16px;
	line-height: 1.4;
	margin: 0;
}

.ct_o{
	padding-left: 10px;
}

.countdown_t2{
	font-size: 14px;
	line-height: 1.4;
	padding: 10px 0;
}

.flip-clock-wrapper{
	
}

.flip-clock-wrapper ul{
	width: 7.5vw;
	height: 10vw;
	font-size: 8vw;
	line-height: 9.5vw;
	margin: 1px;
	border: 1px solid #000;
	border-radius: 4px;
}

.flip-clock-wrapper ul:before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px;
	border-top: 1px solid #666;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	z-index: 10;
}

.flip-clock-wrapper ul:after{
	bottom: -2px;
	border-radius: 4px;
}

.flip-clock-wrapper ul li a div div.inn {
	border-radius: 4px;
	background-image: none;
	background-color: #2a2a2a;
}

.flip-clock-wrapper ul li a div.up {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	border: none;
}

.flip-clock-wrapper ul li a div.up:after{
	top: calc(100% - 1px);
	height: 1px;
}

.flip-clock-wrapper ul li a div.down {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
}

.flip-clock-wrapper ul li a div.com_t_box, .flip-clock-wrapper ul li a div.com_b_box{
	height: 5px;
}

.flip-clock-wrapper ul li a div.com_t_l, .flip-clock-wrapper ul li a div.com_t_r, .flip-clock-wrapper ul li a div.com_b_l, .flip-clock-wrapper ul li a div.com_b_r{
	width: 4px;
	height: 5px;
}

.flip-clock-label{
	font-size: 3.2vw;
	margin: 7vw 2px 0 2px;
}

/*Safari 9+*/

@supports (-webkit-marquee-repetition:infinite) and (object-fit:fill) {

@-webkit-keyframes asd {
  0% {
    z-index: 2; }

  99% {
    z-index: 2; }

  100% {
    z-index: 4; } }

@-moz-keyframes asd {
  0% {
    z-index: 2; }

  99% {
    z-index: 2; }

  100% {
    z-index: 4; } }

@-o-keyframes asd {
  0% {
    z-index: 2; }

  99% {
    z-index: 2; }

  100% {
    z-index: 4; } }

@keyframes asd {
  0% {
    z-index: 2; }

  99% {
    z-index: 2; }

  100% {
    z-index: 4; } }

.flip-clock-wrapper ul.play li.flip-clock-active {
  -webkit-animation: asd 0.0001s 0.4999s linear both;
  -moz-animation: asd 0.0001s 0.4999s linear both;
  animation: asd 0.0001s 0.4999s linear both;}

.flip-clock-wrapper ul.play li.flip-clock-active .down {
  z-index: 2;
  -webkit-animation: turn 0.5s 0.5s linear both;
  -moz-animation: turn 0.5s 0.5s linear both;
  animation: turn 0.5s 0.5s linear both; }

.flip-clock-wrapper ul.play li.flip-clock-before .up {
  z-index: 2;
  -webkit-animation: turn2 0.5s linear both;
  -moz-animation: turn2 0.5s linear both;
  animation: turn2 0.5s linear both; }

.flip-clock-wrapper ul.play li.flip-clock-before .up .shadow {
  -webkit-animation: show 0.5s linear both;
  -moz-animation: show 0.5s linear both;
  animation: show 0.5s linear both; }

/*.flip-clock-wrapper ul.play li.flip-clock-active .up .shadow {
  -webkit-animation: hide 0.5s 0.3s linear both;
  -moz-animation: hide 0.5s 0.3s linear both;
  animation: hide 0.5s 0.3s linear both; }*/

.flip-clock-wrapper ul.play li.flip-clock-before .down .shadow {
  -webkit-animation: show 0.5s linear both;
  -moz-animation: show 0.5s linear both;
  animation: show 0.5s linear both; }

.flip-clock-wrapper ul.play li.flip-clock-active .down .shadow {
  -webkit-animation: hide 0.5s 0.3s linear both;
  -moz-animation: hide 0.5s 0.3s linear both;
  animation: hide 0.5s 0.3s linear both; }

.flip-clock-wrapper ul.play li.flip-clock-before .com_t{
	-webkit-animation: none;
	-moz-animation: none;
	-ms-animation: none;
	animation: none;
}
.flip-clock-wrapper ul.play li.flip-clock-active .com_b{
	-webkit-animation: none;
	-moz-animation: none;
	-ms-animation: none;
	animation: none;
}

}

.kv_box{
	padding-top: 80px;
}

.bulletin{
	width: 100%;
	padding: 20px 26px;
}

.content{
	position: relative;
	width: 100%;
	padding: 5%;
}

.content.home{
	padding-top: 0;
}

.content.home .p_row_box{
	margin-bottom: 10px;
}

.content_i{
	width: 100%;
}

#top{
	height: 60px;
}

.kanban{
	padding-top: 0;
	margin-bottom: 0;
}

.kanban a{
	top: 0;
}

.swiper-container{

}

.swiper-button-next:hover, .swiper-button-prev:hover{
	opacity: 0.5;
}

.swiper-button-prev{
	left: 0px;
	background-image: url(../img/a_p_m.svg);
}

.swiper-button-next{
	right: 0px;
	background-image: url(../img/a_n_m.svg);
}

.swiper-pagination{
	bottom: 3px !important;
}

.swiper-pagination-bullet{
	opacity: 0.6;
	background: #fff;
}

.swiper-pagination-bullet-active{
	opacity: 1;
	background: #000;
}

.r_box .kanban{
	width: 100%;
	margin-bottom: 10px;
}

.bc_box{
	padding: 0 5%;
	margin: 70px 0 -60px 0;
}

.breadcrumb{
	width: calc( 100% - 96px);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.bc_box .select_box{
	width: 94px;
}

.bc_box .select_box:after{
	width: 22px;
}

.bc_box .select_box .form_control{
	font-size: 13px;
	padding: 0 6px !important;
}

.l_box{
	width: 100%;
	padding: 0;
}

.sidebar_box{
	position: absolute;
	top: 16px;
	left: 50%;
	width: 260px;
	z-index: 200;
	transform: translateX(-50%);
}

.sidebar_trigger{
	position: relative;
	display: block;
	width: 100%;
	height: 40px;
	font-size: 16px;
	text-align: center;
	padding-top: 8px;
	border: 1px solid #e50012;
	background-color: #fff;
}

.sidebar_trigger span{
	position: absolute;
	top: 0px;
	right: 0px;
	display: block;
	width: 40px;
	height: 40px;
	cursor: pointer;
	background: url(../img/a_d.svg) no-repeat center;
	background-size: 56%;
}

.sidebar_trigger span.active{
	background: url(../img/a_u.svg) no-repeat center;
	background-size: 56%;
}

.sidebar{
	position: absolute;
	top: 39px;
	left: 0;
	border: none;
	opacity: 0;
	visibility: hidden;
	z-index: 200;
	transition: all 0.15s;
}

.sidebar.show{
	opacity: 1;
	visibility: visible;
}

.sidebar ul > li > a{
	height: 40px;
	font-size: 16px;
	line-height: 1.3;
	padding: 10px 60px;
}

.sidebar ul > li > a:before{
	top: 7px;
	width: 26px;
	height: 26px;
}

.sidebar .a_d_w{
	width: 40px;
	height: 40px;
}

.sidebar .a_d_w{
	background-color: rgba(255,255,255,0.15) !important;
}

.r_box{
	padding: 70px 5% 20px 5%;
}

.p_list{
	padding: 6px;
	background-color: #fff;
}

.p_box{
	/*width: 48.5%;*/
	width: 50%;
	padding: 6px;
	/*margin: 0 3% 10px 0 !important;*/
	margin: 0 !important;
	transition: all 0s;
}

.p_box:nth-child(2n){
	margin: 0 !important;
	/*margin: 0 0 10px 0 !important;*/
}

.p_box:hover{
	box-shadow: 0px 2px 5px rgba(0,0,0,0);
}

.p_box_tit{
	height: 36px;
	font-size: 14px;
	line-height: 18px;
	letter-spacing: 0;
	margin-bottom: 6px;
	-webkit-line-clamp: 2;
}

.special_member .p_box{
	margin: 0 2% 2% 0 !important;
}

.special_member .p_box .p_box_img{
	float: left;
	width: 80px;
	padding-bottom: 80px;
	margin: 0;
}

.special_member .p_box .p_box_tit{
	float: left;
	display: -webkit-box;
	width: calc( 100% - 80px );
	height: 36px;
	padding: 0 0 0 6px;
	white-space: normal;
	text-overflow: clip;
	-webkit-line-clamp: 2;
}

.special_member .p_box .p_price{
	margin-top: 5px;
}

.special_member .p_box .p_box_price, .special_member .p_box .p_box_price_s{
	width: 86px;
	margin: 0;
}

.special_member .p_box .p_box_price .pbp_l, .special_member .p_box .p_box_price_s .pbp_l{
	width: 86px;
	height: 34px;
	font-size: 12px;
	line-height: 34px;
	margin-bottom: 0;
}

.special_member .p_box .p_box_price .pbp_n{
	font-size: 16px;
}

.special_member .p_box .p_box_price_s .pbp_n{
	font-size: 20px;
}

.p_box_price{
	font-size: 21px;
}

.i_banner_box{
	width: 100%;
	padding: 8px 4px;
}

.i_banner_box a{
	width: 33.333333%;
	padding: 0 4px;
}

.i_banner_box a img{
	width: 100%;
}

.tab_container{
	padding: 1%;
}

.item{
	width: calc( 25% - 10px);
	margin: 0 5px;
}

.recommend .item{
	width: calc( 100% - 10px);
}

.item_img{
	height: 34.8vw;
}

.item_img:hover{
	opacity: 1;
}

.p_i1{width: calc( 100% - 10px);}
.p_i2{width: calc( 50% - 10px);}
.p_i3{width: calc( 33.333333% - 10px);}
.p_i4{width: calc( 25% - 10px);}

.p_i1 .item_img{
	height: 90vw;
}

.p_i2 .item_img{
	height: 71.5vw;
}

.p_i3 .item_img{
	height: 47vw;
}

.p_i4 .item_img{
	height: 34.8vw;
}

.item_info{
	height: 88px;
}

.item_tit{
	max-height: 33px;
	font-size: 13px;
	line-height: 1.3;
	margin: 0 0 4px 0;
}

.item_tit:hover{
	opacity: 1;
}

.item_price{
	margin: 0 0 7px 0;
}

.i_l{
	min-width: 35px;
	font-size: 11px;
	margin: 0 4px 4px 0;
}

.product_box{
	padding: 0;
}

.product_top_box{
	padding: 25px 5px 10px 5px;
}

.product_nav{
	position: static;
	float: left;
	width: 100%;
	padding: 3px 0 6px 0;
	margin: 15px 0 0 0;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

.p_nav{
	display: inline-block;
	float: none;
	line-height: 1.3;
	margin: 0 15px;
}

.product_display{
	position: static;
	float: left;
	width: 100%;
	padding: 15px 0 0 0;
}

.p_d_box{
	float: left;
}

.product_display .select_box{
	float: right;
}

.product_kv{
	padding: 0 5px 51% 5px;
	margin: 0 0 15px 0;
}

.s_p_nav .p_nav{
	margin: 0 25px 0 0;
}

.p_nav.s_i_al_b:before{
	font-size: 16px;
	margin: 1px 0 0 0;
}

.s_p_main{
	padding: 0;
}

.pd_img_box{
	width: 100%;
	margin: 0 0 20px 0;
}

.pd_img{
	height: 260px;
	width: 84%;
	margin: 0 8%;
}

.pd_img.one_img{
	margin-bottom: -12%;
}

.gallery-top{
	height: 90%;
}

.gallery-top .swiper-pagination{
	display: block;
	bottom: -3px !important;
}

.gallery-top .swiper-button-next, .gallery-top .swiper-button-prev{
	display: block;
	bottom: 120px;
}

.gallery-thumbs{
	height: 10%;
	opacity: 0;
	visibility: hidden;
	padding: 0;
}

.swiper-pagination-lock, .swiper-button-lock{
	display: none !important;
}

.fancybox-navigation{
	display: none;
}

.fancybox-navigation .fancybox-button{
	top: 50%;
}

.fancybox-navigation .fancybox-button--arrow_left{
	left: 0;
}

.fancybox-navigation .fancybox-button--arrow_right{
	right: 0;
}

.s_p_img{
	width: 100%;
	text-align: center;
	margin-bottom: 18px;
}

.s_p_img img{
	float: none;
	width: 50.2%;
}

.s_p_img img.i_img2{
	left: 25%;
}

.s_p_img_t{
	position: absolute;
	float: none;
	right: 25.4%;
	bottom: -15px;
	font-size: 11px;
	z-index: 150;
}

.s_p_img_t:before{
	font-size: 18px;
	margin: 4px -2px 0 0;
}

.s_p_info{
	width: 100%;
	padding: 0 60px;
}

.s_p_tit h1{
	font-size: 20px;
}

.s_p_row{
	font-size: 14px;
	padding: 0 0 18px 0;
}

.s_p_r_b .b1:last-child{
	margin: 0;
}

.s_p_con .tab_box ul{
	float: left;
	width: 100%;
	margin: 0 0 10px 0;
}

.s_p_con .tabs li{
	width: 25%;
}

.s_p_con .tabs li a{
	width: 100%;
}

.s_p_con .tab_container{
	padding: 0;
}

.s_p_con img{
	width: 100%;
}

.s_p_detailed{
	font-size: 14px;
	line-height: 1.6;
}

.s_product .select_box .form_control{
	font-size: 13px;
}

.select_box:after{
	background-color: #fff;
}

.s_p_row_b{
	position: static;
	margin-bottom: 20px;
}

.s_p_row_b .b1{
	padding: 8px 10px;
	margin-right: 8px;
}

.p_con_tl{
	width: 100%;
	padding: 10px;
}

.recommend_box{
	padding: 0;
}

.recommend_box h2{
	font-size: 18px;
	padding: 10px 10px 15px 10px;
}

.owl-prev{
	top: 30%;
	left: 10px;
	background-image: url(../img/a_p_m.svg);
}

.owl-next{
	top: 30%;
	right: 10px;
	background-image: url(../img/a_n_m.svg);
}

.fancybox-arrow{
	display: none;
	width: 44px;
}

.c_box{
	padding: 20px 10px;
}

.c_nav{
	margin-bottom: 20px;
}

.c_nav ul{
	width: 100%;
	border: none;
}

.c_nav li{
	width: 20%;
	margin: 0 0 -1px -1px;
}

.c_nav li a, .c_nav li button{
	width: 100%;
	border: 1px solid #4267b2 !important;
}

.logout{
	display: block !important;
}

.c_nav_r{
	position: absolute;
	top: 20px;
	right: 3%;
	margin: 0;
}

/*.c_s_cart{
	color: #fff;
}

.c_s_cart:before{
	background: url(../img/shopping_cart.svg) no-repeat left;
}

.c_s_cart:after{
	background: url(../img/a_n_w.svg) no-repeat left;
}*/

.m_id, .m_id_s{
	margin: 0;
}

.e_box{
	width: 100%;
}

.row_l{
	width: 34%;
}

.row_r{
	width: 66%;
}

.row_b{
	padding: 5px 0 0 0;
	text-align: center;
}

.c_box .message_row .m_date{
	width: 18%;
}

.c_box .message_row .m_con{
	width: 82%;
}

.cart_row a:hover{
	opacity: 1;
}

.c_box .cart_row{
	line-height: 1.3;
	padding: 10px;
}

.c_box .collect .cart_row .cf6{
	width: 15%;
}

.c_box .collect .cart_row .cf7{
	width: 8%;
}

.c_box .total_box{
	width: 100%;
}

.c_box .total_box .total_row_l{
	width: 84%;
}

.c_box .total_box .total_row_r{
	width: 16%;
}

.i_row_l{
	width: 15%;
}

.i_row_r{
	width: 85%;
}

.i_row_r ul li{
	width: 100%;
}

.search_t_box{
	line-height: 1.3;
	padding: 15px 10px 10px 10px;
}

.cf8{
	width: 50%;
}

.br_m{
	display: inline;
}

.d_b{
	display: block !important;
}

.d_v{
	visibility: visible;
	opacity: 1;
}

.v_d{
	display: none;
}

.footer_box{
	width: 100%;
	text-align: center;
	padding: 0;
}

.add_line{
	display: inline-block;
	width: 160px;
	height: 48px;
	color: #fff;
	font-size: 20px;
	line-height: 48px;
	text-align: left;
	padding: 0 0 0 56px;
	margin: 6px 0 18px 0;
	border-radius: 6px;
	background: url(../img/add_line.svg) no-repeat;
	background-position: 18px center;
	background-size: 30px 30px;
	background-color: #00bb00;
}

.footer_l{
	width: 100%;
}

.footer_l img{
	width: 50%;
	padding: 6px;
}

.footer_r{
	width: 100%;
	padding: 6px;
}

.footer_r_top a{
	width: 100%;
	padding: 10px;
	margin: 0;
	border-right: none;
	border-bottom: 1px solid #ccc;
}

.f_row{
	width: 100%;
	padding: 0 0 5px 0;
}

.f_row a{
	color: #fff;
}

.fb_i{
	display: inline-block;
	margin-bottom: 10px;
}

.copyright{
	padding-top: 10px;
}

h1{
	color: #214286;
	font-size: 22px;
	/*-webkit-text-shadow: 0px 0px 6px rgba(0,0,0,0.68);
	-moz-text-shadow: 0px 0px 6px rgba(0,0,0,0.68);
	text-shadow: 0px 0px 6px rgba(0,0,0,0.68);*/
}

.h1_c{
	font-size: 15px;
}

.d_trigger_a:after{
	content: " ";
	position: absolute;
	bottom: 0;
	right: 12px;
	width: 15px;
	height: 8px;
	background-image: url(../img/a_u.svg);
}

.n_r_i.s_i_search .d_trigger_a:after{
	right: 13px;
}

.dropdown{
	position: fixed;
	top: 50px;
	left: 0;
	width: 100% !important;
	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	border: none;
	border-bottom: 1px solid #ccc;
}

.n_r_i.s_i_search .dropdown{
	position: fixed;
	top: 50px;
	left: 0;
	width: 100% !important;
	padding: 15px 20px;
	box-shadow: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	border: none;
	border-bottom: 1px solid #ccc;
}

.dropdown:before{
	display: none !important;
}

label{
	width: 20px;
	height: 20px;
}

.n_r_i.s_i_search .dropdown .s_i_search{
	top: 15px;
}

.cart_row{
	padding: 6px 8px;
	border-bottom: 1px solid #e6e6e6;
}

.cart_header{
	display: none;
}

.r_bn{
	border-bottom: none;
}

.c_f{
	float: left;
	vertical-align: top;
	font-size: 14px;
	text-align: left;
	padding: 5px;
}

.cf1{
	width: 16%;
	text-align: center;
	padding: 0;
}

.cf2{
	width: 84%;
	padding: 0 0 0 6px;
	margin-bottom: 5px;
}

.cf3, .cf4, .cf5, .cf6, .cf7{
	width: auto;
}

.cf4{
	min-width: 12%;
}

.cf6{
	font-weight: bold;
}

.cf7{
	float: right;
	font-weight: bold;
}

.recipients .cart_row{
	padding: 16px 0;
}

.recipients .c_f{
	width: 100%;
	text-align: left;
	padding: 6px 0;
}

.recipients .rec_t{
	display: inline !important;
}

.recipients label.l_r{
	margin: -2px 6px 0 0;
}

.r_bg_g{
	background-color: #f8f8f8;
}

.total_box{
	width: 100%;
	padding: 0 5px;
}

.total_row_l{
	width: 76%;
}

.total_row_r{
	width: 24%;
	font-size: 14px;
}

.message_box{
	padding: 4px 10px 0 10px;
}

.message_tit{
	font-size: 15px;
}

.s_member{
	top: 45px;
	width: 300px;
	height: auto;
	padding: 10px 0;
	margin: 0 0 0 -150px;
}

.checkout{
	color: #214286;
	margin-bottom: 0;
	/*-webkit-text-shadow: 0px 0px 6px rgba(0,0,0,0.68);
	-moz-text-shadow: 0px 0px 6px rgba(0,0,0,0.68);
	text-shadow: 0px 0px 6px rgba(0,0,0,0.68);*/
}

.login{
	padding: 20px !important;
	margin-bottom: 0;
}

.login_box{
	width: 95%;
	padding: 15px 20px;
	margin: 0 2.5%;
	border-right: none;
	border-top: 1px solid #ccc;
}

.login .login_box{
	width: 100%;
	margin: 0;
}

.login_box:first-child{
	border: none;
}

.login_box .b1_l{
	width: 100%;
}

.login_row{
	padding-bottom: 10px;
}

.login .login_row{
	padding-bottom: 20px;
}

.or_box{
	margin: -12px 0 -6px 0;
}

.swiper-button-next, .swiper-button-prev{
	width: 23px;
	height: 40px;
	margin-top: -20px;
}

.swiper-pagination{
	bottom: 4px;
}

.swiper-pagination-bullet{
	width: 8px;
	height: 8px;
	margin: 0 4px;
}

.pt02{
	background-size: auto 100%;
	background-position: 24% 0;
}

.pt_box_c{
	padding: 12% 0;
}

.i_banner_box{
	padding: 8px 0;
}

.i_banner_box a{
	width: 50%;
	padding: 0 0 5px 0;
}

.i_banner_box a.i_b100{
	width: 100%;
	height: 0;
	padding: 0 0 50% 0;
	overflow: hidden;
}

.best_box{
	padding: 0 1%;
}

.tab_container{
	padding: 10px 0;
}

.tab_box ul{
	width: 97%;
}

.tabs li{
	width: 33.333%;
}

.tabs li a{
	width: 100%;
}

.item{
	width: calc( 50% - 8px);
	margin: 0 4px;
}

.recommend .item{
	width: calc( 100% - 8px);
}

.item_img{
	height: 70.2vw;
}

.p_i1{width: calc( 100% - 8px);}
.p_i2{width: calc( 50% - 8px);}
.p_i3{width: calc( 33.333333% - 8px);}
.p_i4{width: calc( 25% - 8px);}

.p_i1 .item_img{
	height: 144.2vw;
}

.p_i2 .item_img{
	height: 70.2vw;
}

.p_i3 .item_img{
	height: 45.8vw;
}

.p_i4 .item_img{
	height: 33.55vw;
}

.p_i3 .item_tit{
	margin: 0 0 2px 0;
}

.p_i3 .item_price{
	margin: 0 0 4px 0;
}

.p_i3 .i_l{
	font-size: 2.5vw;
	padding: 0 2px;
	margin: 0 3px 3px 0;
}

.p_i4{
	font-size: 12px;
}

.p_i4 .item_img{
	margin: 0 0 1px 0;
}

.p_i4 .item_tit{
	max-height: 30px;
	font-size: 12px;
	margin: 0;
}

.p_i4 .item_info{
	height: 93px;
	font-size: 12px;
}

.p_i4 .item_price{
	margin: 0 0 4px 0;
}

.p_i4 .i_l{
	font-size: 2.5vw;
	padding: 0 2px;
	margin: 0 2px 2px 0;
}

.product_top_box{
	padding: 15px 4px;
}

.p_d_box{
	display: block;
}

.product_kv{
	padding: 0 4px 50% 4px;
	margin: 0 0 12px 0;
}

.s_product{
	font-family: sans-serif;
	padding: 20px;
}

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

.s_p_nav .p_nav{
	margin: 0 20px 0 0;
}

.s_p_img img{
	width: 70.2%;
}

.s_p_img img.i_img2{
	left: 15%;
}

.s_p_img_t{
	right: 15.4%;
}

.s_p_info{
	padding: 0;
}

.s_p_tit{
	font-size: 18px;
	line-height: 1.3;
	padding: 0 0 8px 0;
	margin: 0 0 8px 0;
}

.s_p_tit h1{
	font-size: 17px;
	margin-bottom: 6px;
}

.s_p_row_tit{
	font-size: 15px;
	margin-bottom: 6px;
}

.s_p_r_b{
	text-align: center;
	padding: 0;
}

.s_p_r_b .b1{
	float: none;
}

.sp_tit{
	font-size: 16px;
	padding-bottom: 6px;
	margin-bottom: 6px;
}

.s_p_con .tab_box ul{
	width: 95%;
	margin: 0 2.5% 10px 2.5%;
}

.s_p_con .tabs li a{
	padding: 8px 0;
}

.s_p_con .tab_container{
	min-height: 200px;
}

.owl-prev{
	left: 7px;
}

.owl-next{
	right: 7px;
}

.c_box{
	padding: 0 !important;
}

.c_box h1{
	font-size: 24px;
	margin-bottom: 20px;
}

.c_box h1 span:before, .c_box h1 span:after{
	height: 4px;
}

.c_nav li{
	width: 33.333333%;
}

.c_nav li a, .c_nav li button{
	color: #4267b2 !important;
	font-size: 13px;
	height: 36px;
	padding: 10px 0;
	background-color: #f3f7fc !important;
}

.c_nav li a.c_nav_active, .c_nav li button.c_nav_active{
	background-color: #fff !important;
}

.c_nav li a.logout, .c_nav li button.logout{
	background-color: #e8e8e8 !important;
}

.c_nav_cb{
	top: -35px;
}

.c_con{
	padding: 10px 0;
}

.login .login_box .login_row_r .b1{
	
}

.row_box{
	font-size: 14px;
	font-weight: normal;
}

.common{
	padding: 20px;
}

.common_tit{
	font-size: 17px;
	margin-bottom: 8px;
}

.row_box h2{
	
}

.row_box h2:before{
	left: 12px;
}

.row_box_con{
	padding: 0;
}

.row_box_con.login{
	width: 100%;
	margin: 0;
}

.e_box{
	padding: 10px 0;
}

.row{
	line-height: 21px;
	padding: 0 25px 15px 25px;
}

.row_l{
	width: 100%;
	text-align: left;
	padding: 0 0 2px 0;
}

.row_l.mb{
	margin-bottom: 10px;
}

.row_r{
	width: 100%;
}

.row input{
	width: 100%;
}

.row_i_s{
	width: 66px !important;
	margin: 0 5px 5px 0;
}

.row_i_s:last-child{
	margin: 0;
}

.row .select_box{
	width: 100%;
	margin-bottom: 5px;
}

.row .select_box_s{
	width: 31%;
	margin: 0 2.333333% 5px 0;
}

.row .row_note{
	left: auto;
	right: 0;
	width: auto;
}

.row_r_b{
	text-align: center;
}

.c_box .message_box{
	line-height: 1.3;
}

.c_box .message_row .m_date{
	width: 30%;
}

.c_box .message_row .m_con{
	width: 70%;
}

.c_box .cart_box .cf2{
	display: -webkit-box;
	width: calc(79% - 30px);
	max-height: 55px;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}

.c_box .cart_box .cfp{
	position: absolute;
	top: 0;
	right: 0;
	width: auto !important;
	padding: 0;
}

.c_box .cart_box .cfp button.s_i_cross{
	border: 1px solid #ccc;
	background-color: #fff;
}

.c_box .c_f .s_i_cross:before{
	font-size: 22px;
	margin: 2px 2px 0 2px;
}

table{
	border: none;
	width: 92%;
	margin: 4%;
}

table thead{
	display: none;
}

table tr{
	margin: 0 0 10px 0;
	overflow: hidden;
	display: block;
	vertical-align: middle;
	border-top: 1px solid #e0e0e0;
	border-right: 1px solid #e0e0e0;
	border-left: 1px solid #e0e0e0;
	border-bottom: none;
}

table td{
	width: 100%;
	display: table;
	vertical-align: middle;
	border-bottom: 1px solid #e0e0e0;
}

table td:before{
	content: attr(data-label);
	padding-right: 5px;
	font-size: 13px;
	text-align: right;
	text-transform: none;
	color: #888;
	width: 40%;
	background: #f1f1f1;
	display: table-cell;
	vertical-align: middle;
	float: none;
	border-right: 1px solid #e0e0e0;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

table td>*:not(before){
	padding: 2px;
	word-wrap: break-word;
	word-break: break-all;
	display: table-cell;
	vertical-align: middle;
	float: none;
}

.c_box .h_order .cart_row .c_f{
	width: auto;
}

.c_box .h_order .cart_row .cf1{
	width: 30px;
	height: 92px;
	padding: 5px 10px;
	border-right: 1px solid #ccc;
}

.c_box .h_order .cart_row .cf2,
.c_box .h_order .cart_row .cf3,
.c_box .h_order .cart_row .cf4,
.c_box .h_order .cart_row .cf5{
	width: calc( 100% - 30px );
	padding: 2px 10px;
	margin: 0;
}

.c_box .h_order .cart_row .cfp2{
	position: absolute;
	top: 38px;
	right: 17px;
	width: auto;
	font-size: 13px;
	padding: 0;
}

.c_box .h_order .cart_row .cfp3{
	position: absolute;
	top: 65px;
	right: 10px;
	width: auto;
	padding: 0;
}

.c_box .discount_coupon .c_f{
	width: 100%;
	text-align: left;
	padding: 5px;
}

.c_box .pagination_box{
	padding: 10px 10px 0 10px;
}

.h_order_top{
	line-height: 1.3;
	padding: 6px 10px;
}

.h_order_top button.b1{
	margin-top: -38px;
}

.h_o_t{
	width: 100%;
	padding: 0 0 2px 0;
}

.c_box .total_box{
	padding: 0;
}

.c_box .total_box .total_row_l{
	width: 76%;
	font-size: 13px;
}

.c_box .total_box .total_row_r{
	width: 24%;
}

.store_box{
	padding: 10px 0;
}

.store{
	width: 100%;
	font-size: 14px;
	padding: 0 4%;
	margin-bottom: 40px;
}

.store_l{
	width: 100%;
	padding: 0 0 11px 0;
}

.store_r{
	width: 100%;
}

.si_row{
	padding-bottom: 3px;
}

.si_tit{
	padding-bottom: 11px;
}

.si_con{
	font-weight: normal;
}

.i_box{
	padding: 5px 10px;
}

.i_row_l{
	width: 30%;
}

.i_row_r{
	width: 70%;
}

.step{
	font-size: 15px;
	width: 100%;
	padding: 16px 0 0 0;
}

.s_cart{
	padding: 0;
}

.s_cart .c_f{
	width: auto;
}

.s_cart .cf1{
	width: 21% !important;
	margin-bottom: 0;
}

.s_cart .cfp2{
	position: absolute;
	bottom: 22px;
	right: 9px;
	width: auto;
	padding: 0;
}

.s_cart .cf3{
	margin-top: 6px;
}

.search_t{
	width: 100%;
	padding: 10px 0 0 0;
}

.b1{
	opacity: 1 !important;
}

.quantity_box input{
	font-size: 16px;
	font-weight: normal;
}

.quantity_box .b1_s{
	opacity: 1 !important;
	background-color: #fff !important;
}

.h_m{
	display: none;
}

.h_d{
	display: block;
}

.h_d_i{
	display: inline;
}

.f_box{
	width: 100%;
	text-align: center;
}

.f_box a:hover{
	opacity: 1;
}

.f_box a:before{
	float: none;
}

.f_box_middle{
	float: left;
	width: 100%;
	padding: 6px 0;
	margin: 10px 0 0 0;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	background-color: #FAFAFA;
}

.f_box.f_box_s a{
	position: relative;
	width: 25%;
}

.f_box.f_box_s a:after{
	content: " ";
	position: absolute;
	top: 7px;
	right: 0;
	height: 18px;
	border-right: 1px solid #ccc;
}

.f_box.f_box_s a:last-child:after{
	border-right: none;
}

.f_box.f_box_l{
	display: none;
	border-top: 1px solid #ddd;
	margin-bottom: -1px;
}

.f_box.f_box_l a{
	width: 25%;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}

.f_box.f_box_l a:nth-child(4n+1){
	border-right: none;
}

.footer_copy{
	font-size: 13px;
}

}

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

/*.cf4{
	padding: 5px 5px 5px 0px;
}*/

.p_i2 .item_img{
	min-height: 69.6vw;
}

.p_i3 .item_img{
	min-height: 45.1vw;
}

.p_i4 .item_img{
	min-height: 32.9vw;
}

.s_p_r_l{
	width: 14%;
}

.s_p_r_r{
	width: 86%;
}

.s_p_con .tabs li a{
	font-size: 13px;
}

.c_box .total_box .total_row_l{
	font-size: 13px;
}

.c_box .total_box .total_row_r{
	font-size: 13px;
}

.i_row_l{
	width: 33%;
}

.i_row_r{
	width: 67%;
}

}