/*
==============================================
   框架
==============================================
*/
body.bodyfixed { position: fixed; }

.header {
	width:100%;
	position:relative;
	left:0;
	top:0;
	z-index:501;
	text-align:left;
	-webkit-transition:all .6s ease-in-out;
            transition:all .6s ease-in-out;
}
.header::after {
    clear: both;
    content: '';
    display: block;
    height: 0;
    visibility: hidden;
	overflow: hidden;
}
.header .row.top {
	padding: 0px;
	background-position:left center;
	border-bottom: 1px solid #dedede;
	z-index: 1;
}
.header .row + .row {
	padding:0;
}
.header-top { text-align: right; }

.headerBg {
	position: absolute;
	width: 100%; height: 100%; top: 0; left: 0;
	background-position: center top;
	background-repeat: no-repeat;
	/*background-size: cover;*/
	z-index: -1;
}

/* wrapper 1180*/
.row.top .wrapper { width: 1180px; display: block; }


/*
==============================================
   header logo
==============================================
*/
.header .logo {
	position:relative;
	margin: 0;
	padding: 0;
	line-height: 1;
	z-index: 10;
	float: left;
	-webkit-transition:all 0.6s ease-in-out;
			transition:all 0.6s ease-in-out;
}
.header .logo > a {
	padding-top: 10px;
	margin: 0 auto;
	display: block;
	-webkit-transition:all 0.6s ease-in-out;
			transition:all 0.6s ease-in-out;
}
/* logo size */
.header .header-normal .logo > a {/* small */
	width: 200px;
}
.header .header-normal .logo img {
	max-height:100px;
}
.header .header-normal.logo-middle .logo > a {/* middle */
	width: 350px;
}
.header .header-normal.logo-middle .logo img {
	max-height:150px;
}
.header .header-normal.logo-large .logo > a {/* large */
	width: 450px;
}
.header .header-normal.logo-large .logo img {
	max-height:200px;
}


/*
==============================================
   header slogan
==============================================
*/
.header-slogan {
	color: #333333;
	font-size: 13px;
	line-height: 16px;
	text-align: right;
	width: 100%;
	margin-top: 10px;
}
.header-slogan.slogan-mobile { display: none; }

/*
==============================================
   header content
==============================================
*/
.header .header-normal .header-content {
	float: right;
	width:700px;
	position: relative;
	min-height: 50px;
}
.header .header-normal.logo-middle .header-content {
	width:600px;
}
.header .header-normal.logo-large .header-content {
	width:500px;
}

.header-right-top { margin-bottom: 10px; }
.header-right-bottom {text-align: right; }
.header-right-bottom > div {text-align: left;}

/*
==============================================
   cartBox
==============================================
*/
.cartBox {
	display: inline-block;
	vertical-align: middle;
  width: 86px;
  margin-left: 40px;
  color: #d0343a;
  cursor: pointer;
}
.cartBox > i { float: left; font-size: 2.8rem; font-size: 28px; }
.cartTxt { font-size: 12px;font-size:1.2rem; line-height: 1.2; padding-left: 28px; }

/*
==============================================
   memberBox
==============================================
*/
.memberBox { 
	margin-left: 20px; 
	line-height: 1;
	display: inline-block;
	vertical-align: middle;
}
.memberBox i {
		float: left;
    font-size: 2.8rem;
    font-size: 28px;
    color: #d0343a;
}
.memberBox .memberLogin { 
	padding-left: 28px; 
	font-size: 12px;
	font-size: 1.2rem;
	width: 120px;
}
.memberBox .memberLogin > div { line-height: 1.2; float: left; width: 100%; }
.memberBtn {}
.welcome { font-size: 13px; font-size: 1.3rem; }
.memberBtn > a { border-right:1px solid #cccccc; padding-right: 3px; color: #000000; }
.memberBtn > a:hover { color: #d0343a; }
.memberBtn > a:last-child { border-right:none; }
.user-account { padding-left: 5px; }

.member-menu { margin:0; font-size: 14px; font-size: 1.4rem;}
.member-menu > li {
	list-style: none;
	border-right: 1px solid #cccccc;
	padding-right: 9px;

	display:inline-block;
	vertical-align: middle;
	*display:inline;
	*zoom:1;
	margin-left:6px;
	-webkit-transition:all 0.3s ease-in-out;
            transition:all 0.3s ease-in-out;
}
.member-menu > li:last-child { border-right: none; padding-right: 0;}
.member-menu > li:first-child { margin-left: 0; }

.member-menu > li a { padding-bottom: 2px; }
.member-menu > li a:link { color:#5a5858; }
.member-menu > li a:visited { color:#5a5858; }
.member-menu > li a:hover { color:#b41d22; }
.member-menu > li a:active { color:#b41d22; }

/*
==============================================
   header-search
==============================================
*/
.header-search {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	z-index: 601;
	margin-left: 5px;
} 
.header-search .btn-black {
	position: absolute;
	right: 2px;
	top:3px;
	font-size: 18px;
	font-size: 1.8rem;
	background-color: transparent;
	border: none;
	line-height: 20px;
    width: 20px;
    height: 20px;
    color: #5a5858;
}
.header-search .btn-black > i {
    line-height: 20px;
}
.header-search .btn-black:link { color: #5a5858; }
.header-search .btn-black:visited { color: #5a5858; }
.header-search .btn-black:hover { opacity: 1; color:#b41d22; background-color: transparent; border: none; }
.header-search .btn-black:active { color:#b41d22; box-shadow: none; }
.header-search .btn-black::after,  .header-search .btn-black:active::after {
	display: none;
}

.header-search input[type="text"] { 
	padding:3px 5px; 
	outline: none; 
	border-radius: 0;
	-webkit-border-radius:0;
	border:1px solid #999999;
} 

.header-search input[type="text"]:focus, 
.header-search input[type="text"]:active {
   outline: none;
   box-shadow: none;
   color: #b41d22;
   border-color: #999999;
 }
.header-search input[type="text"]:focus ~ .btn-black , 
.header-search input[type="text"]:active ~ .btn-black { color: #b41d22; }


.header-search.search-mobile { display: none; }

/*
==============================================
   menu
==============================================
*/
.header .menu {
	/*position: relative;*/
	width: 100%;
	text-align: left;
	z-index: 600;
	background-color: #d0343a;
	margin-top: 10px;
}
.header .menu::after {
    clear: both;
    content: '';
    display: block;
    height: 0;
    visibility: hidden;
	overflow: hidden;
}

.header .menu > div.menu-content {
	width: 1180px;
	margin: 0 auto;
	/*position: relative;*/
}

/*
==============================================
   main menu
==============================================
*/
.header .main-menu {
	margin:0;
	padding:0;
	vertical-align:middle;
	font-size:16px;
	font-size:1.6rem;
	width: 100%;
	position: static;
	left: 0;
	background-color: #d0343a;

	/*font-family: 'Montserrat', 'Noto Sans TC', "微軟正黑體", "Microsoft JhengHei", sans-serif;*/
}

.header .main-menu > li > a { 
	position: relative; 
	z-index: 1; 
	color: #ffffff;
		-webkit-transition:all 0.3s ease-in-out;
            transition:all 0.3s ease-in-out;
}
.header .main-menu > li > a.direct { padding: 12px 12px 12px 12px; float: left; }
.header .main-menu > li.parent > a.direct { padding: 12px 0 12px 12px; float: left; }
.header .main-menu > li.parent > a.extend { padding: 12px 12px 12px 12px; float: right; }
.header .main-menu > li:first-child > a.direct { padding:12px 0 12px 0; }

.header .main-menu ul, 
.header .main-menu li { list-style:none; margin:0; padding:0; }
.header .main-menu a { display:block; white-space:nowrap; }
.header .main-menu li { position:relative; line-height:1; }
.header .main-menu > li.adlink-product { position: static; }
.header .main-menu > li.adlink-product ul.sub-menu { background-color: transparent; }

/* level 1 */
.header .main-menu > li:hover { background-color: rgba(255,255,255,0.2); }
.header .main-menu > li > a:link { color:#ffffff; }
.header .main-menu > li > a:visited { color:#ffffff; }
.header .main-menu > li > a:hover { color:#ffffff;}
.header .main-menu > li > a:active { color:#ffffff;}

.header .main-menu > li:first-child:hover > a.direct { padding-left: 12px; }

.header .main-menu > li {
	/*display:inline-block;
	*display:inline;
	*zoom:1;*/
	float: left;
	-webkit-transition:all 0.3s ease-in-out;
            transition:all 0.3s ease-in-out;
}


.header .main-menu > li.sub-menu-active {
	background-color:#1f1f1f;
}



/* MENU > DROPDOWN */
.header .menu ul.sub-menu a:link { color:#000000; }
.header .menu ul.sub-menu a:visited { color:#000000; }
.header .menu ul.sub-menu a:hover { color:#b41d22; }
.header .menu ul.sub-menu a:active { color:#b41d22; }

.header ul.sub-menu { 
	display:none;
	min-width: 100%;
	left:0px;
	top: 100%;
	position:absolute;
	z-index:200;
	text-align:left;

	box-shadow: 0 2px 6px #cccccc;
	background-color: #ffffff;
	clear: both;
}

.header li.adlink-product ul.sub-menu { box-shadow: none;  }

.header ul.sub-menu > li > a { padding: 12px 12px 12px 12px; }
.header ul.sub-menu > li > a.direct { float: left; margin-right: 35px; }
.header ul.sub-menu > li > a.extend { position: absolute; right: 0; }


/* level 3+ */
.header ul.sub-menu ul.sub-menu {
	left: 100%;
	top: 20%;
}
.header ul.sub-menu li.parent ul.sub-menu a::before { display: none; }


/* 當前選項 */
.header .main-menu > li.current-menu-item { background-color: rgba(255,255,255,0.2); }
.header .main-menu > li.current-menu-item::after { left: 0; opacity: 1; }
.header .main-menu > li.current-menu-item > a:link { color:#ffffff; }
.header .main-menu > li.current-menu-item > a:visited { color:#ffffff; }
.header .main-menu > li.current-menu-item > a:hover { color:#ffffff; }
.header .main-menu > li.current-menu-item > a:active { color:#ffffff; }

.header ul.sub-menu > li.current-menu-item > a { background:#ffffff; }
.header ul.sub-menu > li.current-menu-item > a:link { color:#b41d22; }
.header ul.sub-menu > li.current-menu-item > a:visited { color:#b41d22; }
.header ul.sub-menu > li.current-menu-item > a:hover { color:#000000; }
.header ul.sub-menu > li.current-menu-item > a:active { color:#000000; }
/*.header ul.sub-menu li.current-menu-item > a::before {
	color: #ffffff;
	font-weight: 600;
}*/

/* open */
.header .main-menu > li.open > a { background: #ffffff; color:#d0343a;}
.header .main-menu > li.open > a:link { color:#d0343a; }
.header .main-menu > li.open > a:visited { color:#d0343a; }
.header .main-menu > li.open > a:hover { color:#d0343a; }
.header .main-menu > li.open > a:active { color:#d0343a; }

.header .main-menu > li.open.parent > a.direct { padding: 12px 0 12px 12px; }
.header .main-menu > li.open.parent > a.extend { padding: 12px 12px 12px 12px; }

/* 滑過 */
.header .menu ul.sub-menu > li.open > a:link { color:#b41d22; }
.header .menu ul.sub-menu > li.open > a:visited { color:#b41d22; }
.header .menu ul.sub-menu > li.open > a:hover { color:#000000; }
.header .menu ul.sub-menu > li.open > a:active { color:#000000; }

/* current-menu-item & parent */
.header .main-menu > li.current-menu-item.parent { color: #ffffff; }
.header .main-menu > li.current-menu-item.parent > a:link { color:#ffffff; }
.header .main-menu > li.current-menu-item.parent > a:visited { color:#ffffff; }
.header .main-menu > li.current-menu-item.parent > a:hover { color:#ffffff; }
.header .main-menu > li.current-menu-item.parent > a:active { color:#ffffff; }

/* current-menu-item & parent & open */
.header .main-menu > li.current-menu-item.parent.open { color: #d0343a; }
.header .main-menu > li.current-menu-item.parent.open > a:link { color:#d0343a; }
.header .main-menu > li.current-menu-item.parent.open > a:visited { color:#d0343a; }
.header .main-menu > li.current-menu-item.parent.open > a:hover { color:#d0343a; }
.header .main-menu > li.current-menu-item.parent.open > a:active { color:#d0343a; }

/*
==============================================
   menu-toggle
==============================================
*/
.header .menu-toggle {
	display: inline-block;
	z-index: 1005;
	cursor: pointer;
	padding: 20px 0px;
	margin-left: 10px;
}
body.admin .header .menu-toggle {
	top: -18px;
}
.header .menu-toggle.menu-toggle-active {
}
.header .menu-toggle-hamburger {
	display: block;
	width: 24px;
	height: 3px;
	background: #5a5858;
	position: relative;
}
.header .menu-toggle.menu-toggle-active .menu-toggle-hamburger {
	background: #5a5858;
	height: 3px;
}
.header .menu-toggle-hamburger::before, 
.header .menu-toggle-hamburger::after {
	display: block;
	width: inherit;
	height: 3px;
	position: absolute;
	background: inherit;
	left: 0;
	content: '';
	overflow: visible;
	visibility: visible;
	-webkit-transition:all 0.3s linear;
			transition:all 0.3s linear;
}
.header .menu-toggle-hamburger::before {
	bottom: 280%;
}
.header .menu-toggle-hamburger::after {
	top: 280%;
}
/* menu-toggle-active */
/*.header .menu-toggle-active .menu-toggle-hamburger::before {
	bottom: 520%;
	height: 2px;
}
.header .menu-toggle-active .menu-toggle-hamburger::after {
	top: 520%;
	height: 2px;
}*/

.toggle-txt { font-size: 12px; margin-top: 13px;}


/*
==============================================
   header lang
==============================================
*/
.se-dropdown.dropdown-lang {
		font-size: 14px;
    font-size: 1.4rem;
    vertical-align: top;
		line-height: inherit;
		margin-top: 2px;
		margin-left: 9px;
		float: right;
}
.se-dropdown.dropdown-lang .dropdown-menu { z-index: 602; margin-top: 5px; }
.se-dropdown.dropdown-lang > .dropdown-text,
.se-dropdown.dropdown-lang > .default.dropdown-text, 
.default.se-dropdown.dropdown-lang > .dropdown-text,
.se-dropdown.dropdown-lang .dropdown-menu > .dropdown-item,
.se-dropdown.dropdown-lang .dropdown-menu .selected.dropdown-item { color: #5a5858;}


.LanguageBox { 
	/*display: inline-block; 
	vertical-align: top;*/ 
	margin-top: 7px;
	font-size: 14px; 
	font-size: 1.4rem;
	float: right; 
	line-height: 1; 
}
.Language { 
	display: inline-block; 
	vertical-align: top; 
	border-right: 1px solid #cccccc; 
	padding-right: 9px; 
	margin-right: 3px;
	color: #5a5858; 
}
.Lang-mb { display: none; }

/*
==============================================
   header share
==============================================
*/
.header .header-share {
	position: relative;
	/*z-index: 601; 20161011 Gabby*/ 
	/*z-index: 602; 20161014 Gabby 改成手機板在加z-index*/
	font-size: 16px;
	font-size: 1.6rem;

	display: inline-block;
	vertical-align: middle;
	line-height: 1;
	margin-left: 20px;
}

.header .header-share .se-dropdown {
	font-size: 16px;
	font-size: 1.6rem;
	vertical-align: inherit;
	margin-left: 7px;
}
.header .header-share .se-dropdown.dropdown-channel .dropdown-menu > .dropdown-item { text-align: center; }
.header .header-share .se-dropdown > .icon {
	margin: 0;
}
.header .header-share .se-dropdown .dropdown-menu > .dropdown-item {
	font-size: 13px;
	font-size: 1.3rem;
	padding: 8px 12px !important;
}

/*
==============================================
   socialIcon
==============================================
*/
.header .socialIcon {
	/*width: 22px;
	height: 22px;*/
	display: inline-block;
	margin: 0px 5px;
	text-align: center;
}
.header .dropdown-share .socialIcon {
	margin: 0px 3px 0px 0px;
}
.header .dropdown-channel .socialIcon {
	margin: 0px 3px 0px 0px;
}
.header .socialIcon i {
	margin: 0;
	/*line-height: 22px;*/
}
.header .socialIcon img {
	max-width: 100%;
	max-height: 100%;
}
/*各種尺寸*/
.header .socialIcon.s-18 { /*width: 18px; height: 18px;*/ }
.header .socialIcon.s-20 { /*width: 20px; height: 20px;*/ }
.header .socialIcon.s-24 { /*width: 24px; height: 24px;*/ }
.header .socialIcon.s-26 { /*width: 26px; height: 26px;*/ }
.header .socialIcon.s-28 { /*width: 28px; height: 28px;*/ }
.header .socialIcon.s-30 { /*width: 30px; height: 30px;*/ }
.header .socialIcon.s-32 { /*width: 32px; height: 32px;*/}
.header .socialIcon.s-34 { /*width: 34px; height: 34px;*/ }
.header .socialIcon.s-36 { /*width: 36px; height: 36px;*/ }
.header .socialIcon.s-38 { /*width: 38px; height: 38px;*/ }
.header .socialIcon.s-40 { /*width: 40px; height: 40px;*/ }
.header .socialIcon.s-42 { /*width: 42px; height: 42px;*/ }
.header .socialIcon.s-44 { /*width: 44px; height: 44px;*/ }
.header .socialIcon.s-46 { /*width: 46px; height: 46px;*/ }
.header .socialIcon.s-48 { /*width: 48px; height: 48px;*/ }
.header .socialIcon.s-50 { /*width: 50px; height: 50px;*/ }
.header .socialIcon.s-52 { /*width: 52px; height: 52px;*/ }
.header .socialIcon.s-54 { /*width: 54px; height: 54px;*/ }
.header .socialIcon.s-56 { /*width: 56px; height: 56px;*/ }
.header .socialIcon.s-58 { /*width: 58px; height: 58px;*/; }
.header .socialIcon.s-60 { /*width: 60px; height: 60px;*/ }
.header .socialIcon.s-62 { /*width: 65px; height: 65px;*/ }
.header .socialIcon.s-64 { /*width: 64px; height: 64px;*/ }

.header .socialIcon.s-18 i { line-height: 18px; font-size: 16px; font-size: 1.6rem; }
.header .socialIcon.s-20 i { line-height: 20px; font-size: 18px; font-size: 1.8rem; }
.header .socialIcon.s-24 i { line-height: 24px; font-size: 22px; font-size: 2.2rem; }
.header .socialIcon.s-26 i { line-height: 26px; font-size: 24px; font-size: 2.4rem; }
.header .socialIcon.s-28 i { line-height: 28px; font-size: 26px; font-size: 2.6rem; }
.header .socialIcon.s-30 i { line-height: 30px; font-size: 28px; font-size: 2.8rem; }
.header .socialIcon.s-32 i { line-height: 32px; font-size: 30px; font-size: 3rem; }
.header .socialIcon.s-34 i { line-height: 34px; font-size: 32px; font-size: 3.2rem; }
.header .socialIcon.s-36 i { line-height: 36px; font-size: 34px; font-size: 3.4rem; }
.header .socialIcon.s-38 i { line-height: 38px; font-size: 36px; font-size: 3.6rem; }
.header .socialIcon.s-40 i { line-height: 40px; font-size: 38px; font-size: 3.8rem; }
.header .socialIcon.s-42 i { line-height: 42px; font-size: 40px; font-size: 4rem; }
.header .socialIcon.s-44 i { line-height: 44px; font-size: 42px; font-size: 4.2rem; }
.header .socialIcon.s-46 i { line-height: 46px; font-size: 44px; font-size: 4.4rem; }
.header .socialIcon.s-48 i { line-height: 48px; font-size: 46px; font-size: 4.6rem; }
.header .socialIcon.s-50 i { line-height: 50px; font-size: 48px; font-size: 4.8rem; }
.header .socialIcon.s-52 i { line-height: 52px; font-size: 50px; font-size: 5rem; }
.header .socialIcon.s-54 i { line-height: 54px; font-size: 52px; font-size: 5.2rem; }
.header .socialIcon.s-56 i { line-height: 56px; font-size: 54px; font-size: 5.4rem; }
.header .socialIcon.s-58 i { line-height: 58px; font-size: 56px; font-size: 5.6rem }
.header .socialIcon.s-60 i { line-height: 60px; font-size: 58px; font-size: 5.8rem; }
.header .socialIcon.s-62 i { line-height: 62px; font-size: 60px; font-size: 6rem; }
.header .socialIcon.s-64 i { line-height: 64px; font-size: 62px; font-size: 6.2rem; }

.header .socialIcon.s-18 span { width: 19px; height: 19px; line-height: 19px; font-size: 18px; font-size: 1.8rem; }
.header .socialIcon.s-20 span { width: 21px; height: 21px; line-height: 21px; font-size: 20px; font-size: 2rem; }
.header .socialIcon.s-24 span { width: 25px; height: 25px; line-height: 25px; font-size: 24px; font-size: 2.4rem; }
.header .socialIcon.s-26 span { width: 27px; height: 27px; line-height: 27px; font-size: 26px; font-size: 2.6rem; }
.header .socialIcon.s-28 span { width: 29px; height: 29px; line-height: 29px; font-size: 28px; font-size: 2.8rem; }
.header .socialIcon.s-30 span { width: 31px; height: 31px; line-height: 31px; font-size: 30px; font-size: 3rem; }
.header .socialIcon.s-32 span { width: 33px; height: 33px; line-height: 33px; font-size: 32px; font-size: 3.2rem; }
.header .socialIcon.s-34 span { width: 35px; height: 35px; line-height: 35px; font-size: 34px; font-size: 3.4rem; }
.header .socialIcon.s-36 span { width: 37px; height: 37px; line-height: 37px; font-size: 36px; font-size: 3.6rem; }
.header .socialIcon.s-38 span { width: 39px; height: 39px; line-height: 39px; font-size: 38px; font-size: 3.8rem; }
.header .socialIcon.s-40 span { width: 41px; height: 41px; line-height: 41px; font-size: 40px; font-size: 4rem; }
.header .socialIcon.s-42 span { width: 43px; height: 43px; line-height: 43px; font-size: 42px; font-size: 4.2rem; }
.header .socialIcon.s-44 span { width: 45px; height: 45px; line-height: 45px; font-size: 44px; font-size: 4.4rem; }
.header .socialIcon.s-46 span { width: 47px; height: 47px; line-height: 47px; font-size: 46px; font-size: 4.6rem; }
.header .socialIcon.s-48 span { width: 49px; height: 49px; line-height: 49px; font-size: 48px; font-size: 4.8rem; }
.header .socialIcon.s-50 span { width: 51px; height: 51px; line-height: 51px; font-size: 50px; font-size: 5rem; }
.header .socialIcon.s-52 span { width: 53px; height: 53px; line-height: 53px; font-size: 52px; font-size: 5.2rem; }
.header .socialIcon.s-54 span { width: 55px; height: 55px; line-height: 55px; font-size: 54px; font-size: 5.4rem; }
.header .socialIcon.s-56 span { width: 57px; height: 57px; line-height: 57px; font-size: 56px; font-size: 5.6rem; }
.header .socialIcon.s-58 span { width: 59px; height: 59px; line-height: 59px; font-size: 58px; font-size: 5.8rem }
.header .socialIcon.s-60 span { width: 61px; height: 61px; line-height: 61px; font-size: 60px; font-size: 6rem; }
.header .socialIcon.s-62 span { width: 63px; height: 63px; line-height: 63px; font-size: 62px; font-size: 6.2rem; }
.header .socialIcon.s-64 span { width: 65px; height: 65px; line-height: 65px; font-size: 64px; font-size: 6.4rem; }

.header .socialIcon.s-18 span i.fa-stack-2x { line-height: 18px; font-size: 21px; font-size: 2.1rem; }
.header .socialIcon.s-20 span i.fa-stack-2x { line-height: 20px; font-size: 23px; font-size: 2.3rem; }
.header .socialIcon.s-24 span i.fa-stack-2x { line-height: 24px; font-size: 27px; font-size: 2.7rem; }
.header .socialIcon.s-26 span i.fa-stack-2x { line-height: 26px; font-size: 29px; font-size: 2.9rem; }
.header .socialIcon.s-28 span i.fa-stack-2x { line-height: 28px; font-size: 31px; font-size: 3.1rem; }
.header .socialIcon.s-30 span i.fa-stack-2x { line-height: 30px; font-size: 33px; font-size: 3.3rem; }
.header .socialIcon.s-32 span i.fa-stack-2x { line-height: 32px; font-size: 35px; font-size: 3.5rem; }
.header .socialIcon.s-34 span i.fa-stack-2x { line-height: 34px; font-size: 37px; font-size: 3.7rem; }
.header .socialIcon.s-36 span i.fa-stack-2x { line-height: 36px; font-size: 39px; font-size: 3.9rem; }
.header .socialIcon.s-38 span i.fa-stack-2x { line-height: 38px; font-size: 41px; font-size: 4.1rem; }
.header .socialIcon.s-40 span i.fa-stack-2x { line-height: 40px; font-size: 43px; font-size: 4.3rem; }
.header .socialIcon.s-42 span i.fa-stack-2x { line-height: 42px; font-size: 45px; font-size: 4.5rem; }
.header .socialIcon.s-44 span i.fa-stack-2x { line-height: 44px; font-size: 47px; font-size: 4.7rem; }
.header .socialIcon.s-46 span i.fa-stack-2x { line-height: 46px; font-size: 49px; font-size: 4.9rem; }
.header .socialIcon.s-48 span i.fa-stack-2x { line-height: 48px; font-size: 51px; font-size: 5.1rem; }
.header .socialIcon.s-50 span i.fa-stack-2x { line-height: 50px; font-size: 53px; font-size: 5.3rem; }
.header .socialIcon.s-52 span i.fa-stack-2x { line-height: 52px; font-size: 55px; font-size: 5.5rem; }
.header .socialIcon.s-54 span i.fa-stack-2x { line-height: 54px; font-size: 57px; font-size: 5.7rem; }
.header .socialIcon.s-56 span i.fa-stack-2x { line-height: 56px; font-size: 59px; font-size: 5.9rem; }
.header .socialIcon.s-58 span i.fa-stack-2x { line-height: 58px; font-size: 61px; font-size: 6.1rem }
.header .socialIcon.s-60 span i.fa-stack-2x { line-height: 60px; font-size: 63px; font-size: 6.3rem; }
.header .socialIcon.s-62 span i.fa-stack-2x { line-height: 62px; font-size: 65px; font-size: 6.5rem; }
.header .socialIcon.s-64 span i.fa-stack-2x { line-height: 64px; font-size: 67px; font-size: 6.7rem; }

.header .socialIcon.s-18 span i { line-height: 19px; font-size: 12px; font-size: 1.2rem; }
.header .socialIcon.s-20 span i { line-height: 21px; font-size: 14px; font-size: 1.4rem; }
.header .socialIcon.s-24 span i { line-height: 25px; font-size: 18px; font-size: 1.8rem; }
.header .socialIcon.s-26 span i { line-height: 27px; font-size: 20px; font-size: 2rem; }
.header .socialIcon.s-28 span i { line-height: 29px; font-size: 22px; font-size: 2.2rem; }
.header .socialIcon.s-30 span i { line-height: 31px; font-size: 24px; font-size: 2.4rem; }
.header .socialIcon.s-32 span i { line-height: 33px; font-size: 26px; font-size: 2.6rem; }
.header .socialIcon.s-34 span i { line-height: 35px; font-size: 28px; font-size: 2.8rem; }
.header .socialIcon.s-36 span i { line-height: 37px; font-size: 30px; font-size: 3rem; }
.header .socialIcon.s-38 span i { line-height: 39px; font-size: 32px; font-size: 3.2rem; }
.header .socialIcon.s-40 span i { line-height: 41px; font-size: 34px; font-size: 3.4rem; }
.header .socialIcon.s-42 span i { line-height: 43px; font-size: 36px; font-size: 3.6rem; }
.header .socialIcon.s-44 span i { line-height: 45px; font-size: 38px; font-size: 3.8rem; }
.header .socialIcon.s-46 span i { line-height: 47px; font-size: 40px; font-size: 4rem; }
.header .socialIcon.s-48 span i { line-height: 49px; font-size: 42px; font-size: 4.2rem; }
.header .socialIcon.s-50 span i { line-height: 51px; font-size: 44px; font-size: 4.4rem; }
.header .socialIcon.s-52 span i { line-height: 53px; font-size: 46px; font-size: 4.6rem; }
.header .socialIcon.s-54 span i { line-height: 55px; font-size: 48px; font-size: 4.8rem; }
.header .socialIcon.s-56 span i { line-height: 57px; font-size: 50px; font-size: 5rem; }
.header .socialIcon.s-58 span i { line-height: 59px; font-size: 52px; font-size: 5.2rem }
.header .socialIcon.s-60 span i { line-height: 61px; font-size: 54px; font-size: 5.4rem; }
.header .socialIcon.s-62 span i { line-height: 63px; font-size: 56px; font-size: 5.6rem; }
.header .socialIcon.s-64 span i { line-height: 65px; font-size: 58px; font-size: 5.8rem; }

.header .socialIcon.s-18 img { max-width: 18px; max-height: 18px; }
.header .socialIcon.s-20 img { max-width: 20px; max-height: 20px; }
.header .socialIcon.s-24 img { max-width: 24px; max-height: 24px; }
.header .socialIcon.s-26 img { max-width: 26px; max-height: 26px; }
.header .socialIcon.s-28 img { max-width: 28px; max-height: 28px; }
.header .socialIcon.s-30 img { max-width: 30px; max-height: 30px; }
.header .socialIcon.s-32 img { max-width: 32px; max-height: 32px; }
.header .socialIcon.s-34 img { max-width: 34px; max-height: 34px; }
.header .socialIcon.s-36 img { max-width: 36px; max-height: 36px; }
.header .socialIcon.s-38 img { max-width: 38px; max-height: 38px; }
.header .socialIcon.s-40 img { max-width: 40px; max-height: 40px; }
.header .socialIcon.s-42 img { max-width: 42px; max-height: 42px; }
.header .socialIcon.s-44 img { max-width: 44px; max-height: 44px; }
.header .socialIcon.s-46 img { max-width: 46px; max-height: 46px; }
.header .socialIcon.s-48 img { max-width: 48px; max-height: 48px; }
.header .socialIcon.s-50 img { max-width: 50px; max-height: 50px; }
.header .socialIcon.s-52 img { max-width: 52px; max-height: 52px; }
.header .socialIcon.s-54 img { max-width: 54px; max-height: 54px; }
.header .socialIcon.s-56 img { max-width: 56px; max-height: 56px; }
.header .socialIcon.s-58 img { max-width: 58px; max-height: 58px; }
.header .socialIcon.s-60 img { max-width: 60px; max-height: 60px; }
.header .socialIcon.s-62 img { max-width: 65px; max-height: 65px; }
.header .socialIcon.s-64 img { max-width: 64px; max-height: 64px; }


/*
==============================================
   menu-info
==============================================
*/
.header .menu-info {
	position: relative;
}
.header .menu-info {
	padding: 25px 20px 0;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

.header .jspTrack, .header .jspVerticalBar:hover .jspTrack, .header .jspVerticalBar:focus .jspTrack  {
	background: #111111;
}
.header .jspDrag { background-color: #333333; border: 1px solid #333333; }
.header .jspDrag.jspHover, .header .jspDrag.jspActive {
	background: #454545;
	border:1px solid #454545;
}

.header .menu-info-full {
	width: 100%;
	float: left;
}
.header .menu-info-half {
	width: 50%;
	float: left;
	display: -webkit-flex;
	display: flex;
}
.header .menu-info-three {
	width: 33.33333%;
	float: left;
	display: -webkit-flex;
	display: flex;
}
.header .menu-info-content {
	-webkit-flex: 1;
    flex: 1;
    -webkit-flex-grow: 1;
    flex-grow: 1;
    padding-bottom: 30px;
}
.header .menu-info-full .menu-info-content, 
.header .menu-info-half .menu-info-content, 
.header .menu-info-three .menu-info-content {
	padding-bottom: 15px;
}
.header .menu-info-full.tag-none .menu-info-content, 
.header .menu-info-half.tag-none .menu-info-content, 
.header .menu-info-three.tag-none .menu-info-content {
	padding-bottom: 24px;
}

.header .menu-info .tag {}

.header .menu-info-content h6 {
	color: #B2B2B2;
	font-size: 17px;
	font-size: 1.7rem;
	margin-bottom: 10px;
	position: relative;
	padding-top: 10px;
}
.header .menu-info-full .menu-info-content h6, 
.header .menu-info-half .menu-info-content h6, 
.header .menu-info-three .menu-info-content h6 {
	margin-bottom: 0px;
	line-height: 19px;
}
.header .menu-info-content h6::before {
	content: '';
	display: block;
	width: 14px;
	height: 1px;
	position: absolute;
	top: 0;
	left: 1px;
	background-color: #B2B2B2;
}
.header .menu-info-content p {
	color: #898989;
	font-size: 13px;
	font-size: 1.3rem;
	margin-bottom: 6px;
	line-height: 1.5;
}
.header .menu-info-full .menu-info-content p, 
.header .menu-info-half .menu-info-content p, 
.header .menu-info-three .menu-info-content p {
	display: inline-block;
	margin-right: 8px;
}
.header .menu-info-content h6 a:link { color:#B2B2B2; }
.header .menu-info-content h6 a:visited { color:#B2B2B2; }
.header .menu-info-content h6 a:hover { color:#FFAD01; }
.header .menu-info-content h6 a:active { color:#FFAD01; }

.header .menu-info-content a:link { color:#898989; }
.header .menu-info-content a:visited { color:#898989; }
.header .menu-info-content a:hover { color:#FFAD01; }
.header .menu-info-content a:active { color:#FFAD01; }


/*
==============================================
   header shrink
==============================================
*/
.header-shrink {
	position: fixed;
	width: 100%;
	top: -100%;
	left: 0;
	z-index: 601;
	/*background: rgba(255,255,255,.8);*/
	-webkit-transition:all .6s ease-in-out;
            transition:all .6s ease-in-out;
}
.header-shrink.slideInDown { top: 0%; }
.header-shrink.slideInUp { top: -100%; }
.header-shrink.slideInDown.headroom--top { top: -100%; }

.header-shrink.scrollDown.slideInUp.headroom--not-top { top: 0%; }

.header-shrink .row.top {
	padding:10px 0 0;
	border-bottom: none;
	background: #ffffff;
}
/* logo */
.header .header-shrink .logo {
	float: left;
	padding:0 0 10px;
}
.header .header-shrink .logo > a {
	margin-left: 0;
	text-align: left;
	width: 180px;
	padding-top: 0;
}
.header .header-shrink .logo img {
	max-height:50px;
}
.header .header-shrink.logo-middle .logo > a {
	width: 250px;
}
.header .header-shrink.logo-middle .logo img {
	max-height:80px;
}
.header .header-shrink.logo-large .logo > a {
	width: 300px;
}
.header .header-shrink.logo-large .logo img {
	max-height:100px;
}

.header .header-shrink .menu {
	/*background-color: transparent;*/
	margin-top: 0;
}

/*
==============================================
   header shrink menu
==============================================
*/


/*
==============================================
   header shrink slogan
==============================================
*/
.header-shrink .header-slogan {
	margin-top: 0;
	margin-bottom: 10px;
}

/*
==============================================
   header shrink LanguageBox
==============================================
*/

.header-shrink .LanguageBox { margin-top: 0; }

/*
==============================================
   header shrink content
==============================================
*/
.header .header-shrink .header-content {
	float: right;
	width:700px;
	/*position: relative;*/
	min-height:30px;
}
.header .header-shrink.logo-middle .header-content {
	width:700px;
}
.header .header-shrink.logo-large .header-content {
	width:600px;
}



.header .header-shrink .header-right-top { float: right; margin-top: 5px; margin-top: 8px; }
.header .header-shrink .header-right-bottom { margin-top: 3px;}

.header .header-shrink .Language { border-right:none; padding-right: 0; }
.header .header-shrink .memberAccount { position: relative; }
.header .header-shrink .memberBox i { cursor: pointer; font-size: 24px; font-size: 2.4rem; }
.header .header-shrink .memberLogin {
		display: none;
    position: absolute;
    width: 80px;
    box-shadow: 0 0 3px #999999;
    padding: 6px;
    top: 27px;
    background-color: #ffffff;
}
.header .header-shrink .memberBox .memberLogin > div { float: none; }
.header .header-shrink .memberBtn > a { 
	display: block; 
	border-right: none;
	padding-right: 0;
}

.header .header-shrink .header-share { margin-left: 0; }

/*
==============================================
   fullMenuBox
==============================================
*/
.fullMenuBox {
	background-color: rgba(255,255,255,0.9);
	text-align: left;
}
.fullMenuBox > div {
	width: 1156px;
    margin: 0 auto;
    padding: 20px 12px;
}
.fullMenuBox .r-tabs .r-tabs-panel.alternateContent { padding: 0; }

.header .main-menu ul .alternateTab { margin:0;}
.header .main-menu ul .alternateTab li { 
	display: inline-block; 
	vertical-align: middle; 
	list-style: none;
	padding-bottom: 5px;
    margin-right: 40px;
    margin-bottom: 20px;
}
.header .main-menu ul .alternateTab li > a { border-bottom: 5px solid transparent ; padding-bottom: 10px; font-size: 20px; font-size: 2rem;}
.header .main-menu ul .alternateTab li > a:hover { border-bottom: 5px solid #d0343a; }


/*sub-menu*/
/*.header ul.sub-menu .fullMenuBox li:hover > a { background:#ffffff;}*/

.header .menu ul.sub-menu .fullMenuBox a:link { color:#000000; }
.header .menu ul.sub-menu .fullMenuBox a:visited { color:#000000; }
.header .menu ul.sub-menu .fullMenuBox a:hover { color:#d0343a; }
.header .menu ul.sub-menu .fullMenuBox a:active { color:#d0343a; }


/*headacheMenu*/
.headacheMenu { 
	width: 23.5%; 
	float: left; 
	position: relative;
}

.headacheMenu li > a { float: left; }
.headacheMenu li > a.extend { position: absolute;left: 0; }
.headacheMenu li > a.extend > i { color:#d0343a; }
.headacheMenu li > a.direct {}

.headacheMenu li.parent.open > a.extend > i::before { content:"\f2f4"; }

.header .main-menu ul.headacheMenu { margin: 0 2% 0 0;}
.header .main-menu ul.headacheMenu:nth-child(4n) { margin-right: 0; }

.header .main-menu .headacheMenu a { white-space: normal; line-height: 1.2; }

.header .main-menu .headacheMenu li { list-style: none;}
.header .main-menu .headacheMenu > li { 
	padding-left: 15px;
	padding-bottom: 5px; 
	font-size: 16px; 
	font-size:1.6rem; 
	position: relative; 
}
.header .main-menu .headacheMenu > li.parent {} 
.header .main-menu .headacheMenu > li.firstItem { padding-left: 0; padding-bottom: 5px;}
.header .main-menu .headacheMenu > li.firstItem > a { font-weight: 600; }

.header .main-menu .headacheMenu li.parent.open { color: #d0343a; }
.header .main-menu .headacheMenu > li > a { padding-bottom: 10px }

/*headacheSub*/
.header ul.sub-menu ul.sub-menu.headacheSub {
	position: relative;
	box-shadow: none;
	left: inherit;
	top: inherit;
	margin:0 0 0 10px; 
}
.header ul.sub-menu.headacheSub > li > a { padding: 0 0 5px 0; font-size: 14px; font-size: 1.4rem; }
.header ul.sub-menu.headacheSub > li > a.extend { right: inherit; left: -12px; }

.header ul.sub-menu.headacheSub > li.current-menu-item > a { background:transparent; }

.header ul.sub-menu.headacheSub ul.sub-menu.headacheSub { margin: 0 0 0 10px;}


/*fullTab*/
.fullTab { position: relative; }
.fullMenuBox .r-tabs .r-tabs-nav .r-tabs-anchor { font-weight: normal; padding:0 0 5px 0; }
.fullTabBtn {
	position: absolute;
	right: 0;
    -webkit-transition:all .3s ease-in-out;
            transition:all .3s ease-in-out;
}


.fullTabBtn > a {
		font-size: 1.4rem;
   	font-size: 14px;
    padding: 5px 13px;
    line-height: 20px;
}
.fullTabBtn > a:link {
		border:1px solid #d0343a;
    background-color: #ffffff;
    color: #d0343a !important;
}
.fullTabBtn > a:hover { 
	background-color:#d0343a; 
	color: #ffffff !important; 
	border:1px solid #ffffff; 
}

.fullTabBtn > a:visited {
	border:1px solid #d0343a;
  background-color: #ffffff;
  color: #d0343a !important;
}
.fullTabBtn > a:active {
	background-color:#d0343a; 
	color: #ffffff !important; 
	border:1px solid #ffffff; 
}


/* 手機版改樣式 carrie 20161128 ******************************************************
==============================================
   header mobile
==============================================
************************************************************************************/
.header .header-mobile { display: none; }
.header-mobile .row.top .wrapper { width: 100% !important; }
.header .header-mobile .logo { left: 4%; text-align: left; width: 130px; padding: 4px 0; }
.header .header-mobile .logo > a { width: 100%; margin: 0; }
.header .header-mobile.logo-middle .logo > a { width: 100%; }
.header .header-mobile.logo-middle .logo img { max-height: initial; }
.header .header-mobile.logo-large .logo > a { width: 100%; }
.header .header-mobile.logo-large .logo img { max-height: initial; }

.header-mobile .header-content { width: 92%; margin: 0 auto; text-align: right; }
.header-mobile .header-content > div { display: inline-block; vertical-align: middle; margin-top: 8px; }

.header-mobile .header-search {
	margin-left: 0;
	position: static;
}
.header-mobile .header-search * {
	-webkit-transition: all 1s ease;
	transition: all 1s ease;
}
.header-mobile .header-search input[type="text"] {
	position: absolute;
    padding: 0;
    border: none;
    width: 0;
    right: 0;
    top: 0;
    z-index: 10;
    height: 100%;
    font-size: 18px;
}
.header-mobile .header-search.active input[type="text"] {
    width: 92%;
    padding: 0 4%;
    border-bottom: 1px solid #dedede;
}
.header-mobile .header-search .btn-black.searchClose {
	display: none;
}
.header-mobile .header-search.active .btn-black.searchClose {
	display: block;
}
.header-mobile .header-search .btn-black {
    position: relative;
    right: 0;
    top: auto;
    font-size: 30px;
    border: none;
    line-height: 1;
    width: initial;
    height: initial;
    z-index: 11;
}
.header-mobile .header-search .btn-black > i { line-height: 1; }
.header-mobile .header-search.active .searchEnter, 
.header-mobile .header-search.active .searchClose {
	position: absolute;
	top: 15px;
}
.header-mobile .header-search.active .searchEnter {
	right: 4%;
} 
.header-mobile .header-search.active .searchClose {
	right: 55px;
}

.header-mobile .cartBox {
    width: initial;
    margin-left: 5px;
    color: #5a5858;
}
.header-mobile .cartBox > i { font-size: 29px; }
.header-mobile .LanguageBox {
	padding: 8px 0;
	margin-top: 0;
}
.header-mobile .se-dropdown.dropdown-lang {
	margin-left: 0;
	border-left: 1px solid #cecece;
	padding-left: 15px;
}
.header-mobile .se-dropdown.dropdown-lang .dropdown-menu {
	left: auto;
	right: 0;
	z-index: 604;
}
.header .header-mobile .menu {
	top: 0;
	background-color: #383838;
	text-transform:capitalize
}
.header .header-mobile .menu.menu-open {
	padding: 0;
}
.header .header-mobile .menu > div.menu-content {
	width: 100%;
}
.header .header-mobile .main-menu li a { background-color: #5a5858; margin-bottom: 1px; }
.header .header-mobile .main-menu > li {
	border: none;
	/* padding: 0 4%;
	width: 92%; */
}
.header .header-mobile .main-menu > li.current-menu-item {
    background-color: transparent;
}
.header .header-mobile .main-menu > li > a {
	padding: 14px 4% 12px;
	width: 92%;
}
.header .header-mobile ul.sub-menu > li > a {
	padding: 12px 4%;
	width: 92%;
}
.header .header-mobile ul.sub-menu ul.sub-menu > li > a {
    padding: 12px 4%;
    width: 92%;
    padding-left: 40px;
}
.header .header-mobile .main-menu li .sub-menu li a {
    background-color: #d03d39;
    padding-left: 28px;
}
.header .header-mobile .main-menu > li.open > a { background-color: #5a5858; }
.header .header-mobile .main-menu li > a::before, 
.header .header-mobile .main-menu ul.sub-menu ul.sub-menu li > a::before  {
	font-family: MaterialDesignIcons;
	content: "\F35C";
	display: inline-block;
	color: #ffffff;
    margin-right: 10px;
    width: 20px;
    text-align: center;
    font-size: 20px;
    vertical-align: middle;
}
.header .header-mobile .main-menu li > a.extend::before, .header .header-mobile .main-menu ul.sub-menu ul.sub-menu li > a.extend::before {
	display: none;
}
.header .header-mobile .main-menu li.home > a::before {
	content: "\F2DC";
}
.header .header-mobile .main-menu li.products > a::before {
	font-family: FontAwesome;
	content: "\f129";
}
.header .header-mobile .main-menu li.guest > a.login::before {
	content: "\F5FC";
}
.header .header-mobile .main-menu li.guest > a.register::before {
	display: none;
}
.header .header-mobile .main-menu li.member > a::before {
	content: "\F006";
}
.header .header-mobile .main-menu li.contact > a::before {
	font-family: FontAwesome;
	content: "\f0e0";
	font-size: 17px;
}
.header .header-mobile .main-menu li.parent > a::after {
	font-family: MaterialDesignIcons;
	content: "\F140";
	display: inline-block;
	color: #ffffff;
    vertical-align: middle;
    overflow: visible;
    visibility: visible;
    position: absolute;
    right: 4%;
}
.header .header-mobile .main-menu li.parent > a.direct::after, 
.header .header-mobile .main-menu li.parent > a.extend::after {
	display: none;
}
.header .header-mobile .main-menu li.parent.open > a::after {
	content: "\F143";
}

.header .header-mobile .main-menu li.guest span, 
.header .header-mobile .main-menu li.member span {
	margin: 0 10px;
	color: #cccccc;
}

.header .header-mobile .main-menu li.guest {
	background-color: #5a5858;
	margin-bottom: 1px;
}
.header .header-mobile .main-menu li.guest > a {
	display: inline-block;
	width: initial;
	background-color: transparent;
}
.header .header-mobile .main-menu li.guest > a.login {
	padding-right: 0;
}
.header .header-mobile .main-menu li.guest > a.register {
	padding-left: 0;
}

.header .header-mobile .main-menu > li.parent > a.direct {
    padding: 14px 4% 12px;
    float: none;
}
.header .header-mobile .main-menu li.parent > a.extend {
    padding: 14px 4% 12px;
    float: none;
    width: initial;
    position: absolute;
    margin: 0;
    top: 0;
    right: 0;
    z-index: 2;
}
.header .header-mobile .main-menu li.parent > a.extend .ion-android-arrow-dropdown {
	font-family: MaterialDesignIcons;
	margin: 0;
}
.header .header-mobile .main-menu li.parent > a.extend .ion-android-arrow-dropdown::before {
	content: "\F140";
}
.header .header-mobile .main-menu li.parent.open > a.extend .ion-android-arrow-dropdown::before {
	content: "\F143";
}


/*
==============================================
   responsive
==============================================
*/
@media screen and (max-width : 1179px) {
	.row.top .wrapper { width: 95%; }
	.header .menu > div.menu-content { width: 95% ; padding-left: 0; padding-right: 0; }
	.fullMenuBox > div { width: 95% ; padding-left: 0; padding-right: 0; }
}
@media screen and (min-width : 1136px) {
}
@media screen and (max-width : 1023px) {
	.header .header-normal .header-content { width: 70%; display: none; }
	.header .header-normal.logo-middle .header-content { width: 70%; display: none; }
	.header .header-normal.logo-large .header-content { width: 70%; display: none; }

}
@media screen and (max-width : 979px) {
	.header ~ .container { margin-top: 93px; }/*暫時給一個間距 請程式算*/

	.row.top .wrapper { width: 92%; }
	.header .menu > div.menu-content { width: 92% ;}
	.fullMenuBox { background-color: transparent; }
	.fullMenuBox > div { width: 92% ;}


	.header { 
		z-index: 507;
		position: fixed;
		background-color: #ffffff; 
		box-shadow: 0 3px 9px #999999;
	}
	
	.header .header-normal .header-content { width: 100%; }

	.header .logo { padding-bottom: 10px; text-align: center; padding-top: 10px; }
	.header .logo > a { padding-left: 0; padding-top: 0; }
	.header .header-normal .logo > a { width: 100%; }
	.header .header-normal .logo img { max-height:40px; }
	.header .header-normal.logo-middle .logo > a { width: 100%; }
	.header .header-normal.logo-middle .logo img { max-height:40px; }
	.header .header-normal.logo-large .logo > a { width: 100%; }
	.header .header-normal.logo-large .logo img { max-height:40px; }

	.header .logo ~ .header-slogan { margin-top: 10px; }


	.header .header-normal, .header-shrink { display: none !important; }

	.header .menu {
		position: absolute;
		text-align: center;
		background-color: rgba(204,51,51,0.9);
		padding: 0px;
		margin: 0px;
		top: 60px;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;

	}
	.header .menu.menu-open {
    opacity: 1;
    padding: 30px 0px 60px;
    left: 0;
    height: 100vh;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
		overflow-scrolling: touch;
	}
	.header .menu.menu-open .main-menu { display: block; }
	
	.header .menu.menu-open .menu-toggle { top: -125px; } 

	body.admin .header .menu.menu-open {
		/*height: calc(100% - 130px);*/
		z-index: 603;
		
	}
	
	.header .menu-toggle { display: block; }
	.header .main-menu { display: none; position: relative; bottom: 0; width: 100%; text-align: left; font-size: 15px; background-color: transparent; }
	.header .main-menu a { white-space:normal; }
	.header .main-menu > li {
		display: block;
		margin-left: 0;
		padding: 0px;
		margin: 0px;
		border-bottom: 1px solid #ffffff;
		width: 100%;
	}
	.header .main-menu > li:hover { background-color:transparent; }
	.header .main-menu > li.adlink-product.open { border-bottom: none; }

	.header .main-menu > li:first-child { margin-left: 0px; }
	
	/*Product選單回復左邊間距 ↓*/
	.header .main-menu > li:first-child > a.direct { padding:12px 0 12px 12px; }
	/*Product選單回復左邊間距 ↑*/

	.header .main-menu > li > a.extend { padding:12px 12px 12px 12px; }
	.header .main-menu > li > a:link { color:#ffffff; }
	.header .main-menu > li > a:visited { color:#ffffff; }
	.header .main-menu > li > a:hover { color:#ffffff; }
	.header .main-menu > li > a:active { color:#ffffff; }

	/* open */
	.header .main-menu > li.open > a { background: transparent; color:#ffffff; }
	.header .main-menu > li.open > a:link { color:#ffffff; }
	.header .main-menu > li.open > a:visited { color:#ffffff; }
	.header .main-menu > li.open > a:hover { color:#ffffff; }
	.header .main-menu > li.open > a:active { color:#ffffff; }

	/* current-menu-item & parent & open */
	.header .main-menu > li.current-menu-item.parent.open { color: #ffffff; }
	.header .main-menu > li.current-menu-item.parent.open > a:link { color:#ffffff; }
	.header .main-menu > li.current-menu-item.parent.open > a:visited { color:#ffffff; }
	.header .main-menu > li.current-menu-item.parent.open > a:hover { color:#ffffff; }
	.header .main-menu > li.current-menu-item.parent.open > a:active { color:#ffffff; }

	.header ul.sub-menu {
		position: relative;
		box-shadow: none;
		background-color: transparent;
	}
	.header ul.sub-menu ul.sub-menu { left: 0; }
	.header ul.sub-menu > li > a { padding:12px 12px 12px 20px; width:calc( 100% - 33px); }

	/*.header ul.sub-menu > li.current-menu-item > a { background: transparent; }*/

	.header ul.sub-menu > li.open > a { background:transparent; }
	.header ul.sub-menu > li.open > a:link { color:#ffffff; }
	.header ul.sub-menu > li.open > a:visited { color:#ffffff; }
	.header ul.sub-menu > li.open > a:hover { color:#ffffff; }
	.header ul.sub-menu > li.open > a:active { color:#ffffff; }

	.header ul.sub-menu > li.current-menu-item > a {}
	.header ul.sub-menu > li.current-menu-item > a:link { color:#ffffff; }
	.header ul.sub-menu > li.current-menu-item > a:visited { color:#ffffff; }
	.header ul.sub-menu > li.current-menu-item > a:hover { color:#ffffff; }
	.header ul.sub-menu > li.current-menu-item > a:active { color:#ffffff; }

	/* 滑過 */
	.header .menu ul.sub-menu > li.open > a:link { color:#ffffff; }
	.header .menu ul.sub-menu > li.open > a:visited { color:#ffffff; }
	.header .menu ul.sub-menu > li.open > a:hover { color:#ffffff; }
	.header .menu ul.sub-menu > li.open > a:active { color:#ffffff; }



	.header-right-bottom > div { text-align: right; }

	

	

	/*header-slogan*/
	.header-slogan { display: none; }
	.menu.menu-open .header-slogan { display: block; margin-bottom: 10px; text-align: center; color: #ffffff; }
	


	.header-right-top { margin-bottom: 20px; float: left; }

	.Language { display: none; }
	.Lang-mb { display: inline-block; }

	/* MENU > DROPDOWN */
	.header .menu ul.sub-menu a:link { color:#ffffff; }
	.header .menu ul.sub-menu a:visited { color:#ffffff; }
	.header .menu ul.sub-menu a:hover { color:#ffffff; }
	.header .menu ul.sub-menu a:active { color:#ffffff; }

	.header .menu ul.sub-menu a > i { float: right; }

	/* 當前選項 */
	/*.header .main-menu > li.current-menu-item > a:link { color:#ffffff; }
	.header .main-menu > li.current-menu-item > a:visited { color:#ffffff; }
	.header .main-menu > li.current-menu-item > a:hover { color:#ffffff; }
	.header .main-menu > li.current-menu-item > a:active { color:#ffffff; }

	.header ul.sub-menu > li.current-menu-item > a { background: transparent; }
	.header ul.sub-menu > li.current-menu-item > a:link { color:#ffffff; }
	.header ul.sub-menu > li.current-menu-item > a:visited { color:#ffffff; }
	.header ul.sub-menu > li.current-menu-item > a:hover { color:#ffffff; }
	.header ul.sub-menu > li.current-menu-item > a:active { color:#ffffff; }*/

	/* level 3+ */
	.header ul.sub-menu ul.sub-menu > li > a { float: none;clear: both; padding: 12px 12px 12px 30px;}

	/*
	==============================================
	   fullMenuBox
	==============================================
	*/
	.header .menu ul.sub-menu .fullMenuBox a:link { color:#ffffff; }
	.header .menu ul.sub-menu .fullMenuBox a:visited { color:#ffffff; }
	.header .menu ul.sub-menu .fullMenuBox a:hover { color:#000000; }
	.header .menu ul.sub-menu .fullMenuBox a:active { color:#000000; }
	
	.headacheMenu li > a.extend > i { color: #ffffff; }
	
	/*current-menu-item*/
	.header .menu ul.sub-menu .fullMenuBox li.current-menu-item > a { color:#d0343a;  }
	.header .menu ul.sub-menu .fullMenuBox li.current-menu-item > a:link { color:#d0343a; }
	.header .menu ul.sub-menu .fullMenuBox li.current-menu-item > a:visited { color:#d0343a; }
	.header .menu ul.sub-menu .fullMenuBox li.current-menu-item > a:hover { color:#d0343a; }
	.header .menu ul.sub-menu .fullMenuBox li.current-menu-item > a:active { color:#d0343a; }
	
	/*open*/
	.header .main-menu .headacheMenu li.parent.open {color: #ffffff;}


	.header .main-menu > li.parent::before { padding: 20px 0; }

	.header .main-menu .headacheMenu > li.firstItem > a { font-weight: normal; color: #ffffff; }
	.header .main-menu .headacheMenu > li.firstItem ~ li { padding-left: 30px; }
	.header .main-menu .headacheMenu > li.firstItem ~ li > a.extend {left:15px;}

	/*fullTab*/
	.fullMenuBox .r-tabs .r-tabs-panel.alternateContent { padding:20px 0 0 0; }
	.fullMenuBox .r-tabs .r-tabs-nav { display: none;}
  	.fullMenuBox .r-tabs .r-tabs-accordion-title { margin-top:0; }
  	.fullMenuBox .r-tabs .r-tabs-accordion-title .r-tabs-anchor { border-bottom: 1px solid #ffffff; display: inline-block; padding: 10px 0; background-color: transparent; }
  	.fullMenuBox .r-tabs .r-tabs-accordion-title.r-tabs-state-active .r-tabs-anchor { border-bottom: 1px solid #ffffff; background-color: transparent;}
  	.fullMenuBox .r-tabs .r-tabs-panel {
        padding: 20px;
        border: none;
    }

	.header .main-menu ul.headacheMenu { width: 100%; margin-right: 0; }
	
	.header ul.sub-menu ul.sub-menu.headacheSub { margin:0; }
	.header ul.sub-menu ul.sub-menu.headacheSub > li > a { padding: 12px 0 12px 10px; }

	.fullTabBtn { position: relative; margin-bottom: 10px; }




}
@media screen and (max-width : 800px) {
	/* 20160606 Gabby 增加會員登錄上方的xxx你好 */
	.header .btnMemberLogin { padding-left: 0; margin-left: 0; border-left: none; }


}
@media screen and (max-width : 680px) {
	/*.header .header-normal .logo img { max-height:40px; }
	.header .header-normal.logo-middle .logo img { max-height:40px; }
	.header .header-normal.logo-large .logo img { max-height:40px; }*/

	/*.header .header-normal .header-content { width:100%; padding-bottom: 10px; }
	.header .header-normal.logo-middle .header-content { width:100%; }
	.header .header-normal.logo-large .header-content { width:100%; }*/

}
@media screen and (max-width : 320px) {
	/* btnMemberLogin樣式調整 20160606 Gabby */
	.header .btnMemberLogin { 
		float: none; 
		position: absolute; 
		right: 30px; 
		top: 50px; 
	}


}