@import url('https://fonts.googleapis.com/css?family=Pacifico');

/**
	隱藏連結虛線
 */
a{hidefocus:expression(this.onFocus=this.blur());outline:none;}
div, p , span, input, select, ul, section { font-family: 微軟正黑體 }

section:after {
	content:"";
	display:block;
	clear:both
}
/**
 *	共用佈局
 */
.clear{
	clear:both;
}

.hide{
	display:none;
}

.float_left {
	float:left;
}
.fontsize0{
	font-size:0px;
}

br.CLEAR {
	clear: both;
	height:0;
	font-size:1px;
	line-height:0;
}
img {
	width:100%; height:auto
}

/**
 *	Top效果
 */
#top-link{ 
	width:55px;
	height:55px;
	display:none;
	background:url(../images/layout/gotoTop.png) no-repeat left top;
	position:fixed;
	right:5px; 
	bottom:85px;
	text-indent:-9999px;
	text-decoration:none;
	z-index:10000;
	border:0px;
}

/**
 *	滑鼠移入/移出效果
 */
.mouseover {
	cursor : pointer ;
	/*background-color:#d5f8fb;
	color:#21959e;*/
}
.mouseout {
	cursor : auto ;
}


/**
	主架構設定
	
 */
body{
	background:#fff;
	}
.layout{
	width:100%;
	overflow-x:hidden;
	min-height:600px;
}

header {
	/*background:url(../images/layout/top_bg.png) repeat-x 50% top;*/
	background:#FFF;
	width:100%;
	behavior: url(PIE.htc);
	z-index:102;
	position: relative;
}

#hamburger{ display:none}

/*頁首 smaller*/
header.smaller{ box-shadow: 0 3px 10px rgba(0,0,0,.15); height:60px; position:fixed; background:#FFF; z-index:102; top:0}
header.smaller .top1 {float: left;}
header.smaller .logo{ height: 43px; width: 216px; float: left; padding-top: 9px; margin: 0 0 0 100px; }
header.smaller .logo a h1{ width: 216px; height: 43px;; background:url(../images/layout/logo_s.png)}
header.smaller nav ul.menu { margin: 10px 0 0 100px; float: left;}
header.smaller #hamburger{ top:15px}
header.smaller .R-nav { top: 13px; width: 150px;}
header.smaller .R-nav .input { display: none}
header.smaller .mem span { display:none}
header.smaller .R-nav li:nth-child(2) { width: 26px;}
header.smaller a.mem { background: none; height: auto; line-height: 31px;}
header.smaller a.mem b { background: url(../images/layout/man-icon02.png) no-repeat 0 0;}
header.smaller .login-zone li:nth-child(2) { width:60px}

.s-input { display:none}	
   


header.smaller .online_shop{ top:25px }
.Gr {
	display: -ms-grid;
	display: grid
}

.R-nav {
    position: absolute;
    top: 25px;
    right: 25px;
}
.R-nav a {
    text-decoration: none;
}
.NumBox {
    display: inline-block;
    padding: 0 20px 0 0;
}
.R-nav li {
    float: left;
}
.Num-pic {
    position: relative;
    display: inline-block;
}
.Num-pic span {
    background: #EB5B3E;
    border-radius: 50%;
    color: #fff;
    display: inline-block;
    font-size: 15px;
    line-height: 24px;
    position: absolute;
    right: -18px;
    bottom: -13px;
    text-align: center;
    width: 24px;
}
.mem {
    background: #68B560;
    border-radius: 18px;
    color: #fff;
	cursor: pointer;
    display: block;
    font-size: 15px;
    height: 36px;
    line-height: 36px;
	position: relative;
    text-align: center;
    width: 100%;
}
.mem b {
	background: url(../images/layout/man-icon01.png) no-repeat 0 0; display:inline-block; height:31px; margin: 0 5px 0 0; vertical-align: middle; width:26px; 
   
	}
.login-zone {
    background: #f8f8f8;
    border-radius: 3px;
    border: 1px solid #ccc;
	box-shadow: 0 0 30px rgba(0,0,0,.1);
    color: #555;
    display: none;
	padding: 10px 15px;
	position: absolute;
    right: 0;
	width: 130px;
}
.R-nav li:nth-child(2) {
    width: calc(100% - 124px);
}
.login-zone a { color: #555}
.login-zone a:hover { color: #68b560;}
.mem:hover .login-zone { display:block}
.login-zone li,.R-nav .login-zone li:nth-child(2) { 
	border: 1px solid #ccc;
	border-radius: 3px;
    float: left;
	font-size: 13px;
	line-height: 180%;
    margin: 0 5px 0 0;
	padding: 5px 0 0;
    text-align: center;
	width: 60px
}
.R-nav .login-zone li:nth-child(2) { margin: 0}
.login-zone i { font-size: 16px; display: block;}
.login-zone li:hover,.R-nav .login-zone li:nth-child(2):hover {
	background: #fff;
	border: 1px solid #68b560;
    color: #68b560; 
}
.login-zone .louisa {
	box-sizing: border-box;
	margin:5px 0 0;
	padding: 10px 0;
    width: 100%;
}
.louisa a i {
	background: url(../images/layout/mem-01.png);
	display:inline-block;
	height:16px;
	margin:0 5px 0 0;
	vertical-align:middle;
	width:19px;
}
.louisa:hover a i {
	background: url(../images/layout/mem-01.png) 19px 0;
}
.wellcome {
	color: #000;
    font-size: 12px;
    font-weight: 600;
    line-height: initial;
	padding: 0 0 10px;
}
.cartText {
    color: #555;
    font-size: 15px;
    padding: 0 0 0 25px;
}

.online_shop{ position: absolute; top: 15px; right: 20px}
.online_shop a{ background:#a79173; color:#fff; text-decoration:none; font-size: 17px; padding: 4px 10px; border-radius: 13px}
.R-nav .input {
    border: 2px solid #68b560;
	margin: 0 0 10px;
}
.R-nav input[type="text"] {
    border: 0;
    width: 160px;
    height: 30px;
    line-height: 30px;
    padding: 0 5px 0 35px;
    margin: 0;
	outline:0;
    background: url(../images/layout/search.png) no-repeat 0 0;
}
.R-nav select {
	border: 0;
    border-left: 2px solid #68b560;
    font-size: 15px;
    height: 30px;
	outline: 0;
    padding: 0 3px;
	text-align-last: center;
	}

.headerTop .menu.topnav{}
/*header:after {
    background:url(../images/layout/top_Shadow.png) no-repeat 50% 0;
    bottom: 0;
    content: "";
    height: 7px;
    left: 0;
    position: absolute;
    width: 100%;
}*/

footer{
	background: #eee;
	color: #333
}
footer:after{ content:""; display:block; clear:both}	
	
.footer_info{
	max-width:1160px;
	margin:0 auto;
	padding:0 20px
	}
.footer_left{
	padding: 30px 0;
	text-align:center
}
.footer_logo{
    display: inline-block;
    margin: 0 0 0 50px;
    vertical-align: top;
	width: 130px
	}
.footer-c {
    font-size: 13px;
    text-align: left;
}
footer h1 {
    font-size: 21px;
    padding: 15px 0 8px
}
.footer-c h3 {
    border-bottom: 1px solid rgba(255,255,255,.4);
    font-size: 16px;
    letter-spacing: 7.5px;
    padding: 0 0 15px;
}
.footer-c div {
    padding: 15px 0 0;
}
.footer-c p {
    line-height: 150%;
	text-align: left
}
.footer_logo img {
    padding: 5px 0 0
}
.footer_font{
	font:Arial, Helvetica, sans-serif,"微軟正黑體" 12px;
	letter-spacing:2px;
	line-height:20px;
	display:inline-block; vertical-align:top;
	 }
.footer_font a:link,.footer_font a:visited,.footer_font a:active{
	color:#f98268;
	text-decoration:none;
	}	
.footer_font a:hover{
	color:#f98268;
	text-decoration:underline;
	} 
.footer_font span{ display:inline-block; padding:0 20px; border-left:1px solid #999; text-align:left}
.footer_font span:nth-child(3){ border-right:1px solid #999}
.footer_font p.design{ display:block; position:absolute; bottom:20px; right:25px}
.footer_font span a:link,.footer_font span a:visited,.footer_font span a:active{
	color:#777777;
	text-decoration:underline;
	}	
.footer_font span a:hover{
	text-decoration:underline;
	} 
.qr_code{
	width:94px;
	height:94px;
	margin:33px auto 10px;
	}
.qr_text{
	margin-top:10px;
	background: url(../images/layout/Mobile_icon.png) no-repeat scroll 0 0;
	color:#777777;
	font:Arial, Helvetica, sans-serif,"微軟正黑體" 12px;
	letter-spacing:1px;
	line-height:18px;
	padding-left:28px;
	}
.qr_text span{
	color:#f98268;
	}
 
.CpR {
    text-align: center;
    padding: 10px;
    background: #ccc;
    color: #000;
}

div, p, s
	 
	  
/**
 *	Box
 */
div.headerTop,
div.pageCt{
	margin:0 auto;
	position:relative;
	text-align: center;
}

.navDiv{ display: inline-block;
    vertical-align: middle}

div.content,
div.footerCt{
	width:950px;
	margin:0 auto;
	position:relative;
}

/**
 *	HeaderTop
 */
.top1{
	display:inline-block;}
div.logo{
	display: inline-block;
    float: none;
    margin: 20px 50px 20px 0;
    vertical-align: middle
}
div.logo h1{
	width: 280px;
    height: 47px;
	display:block;
	background:url(../images/layout/logo.png) no-repeat left top;
	text-indent:-9999px;
	
}
.counter{
	width:194px;
	height:42px;
	background:url(../images/layout/visitors_03.png) no-repeat 0 0;
	margin-top:26px;
	float:right;
}
.counter_font{
	padding-left: 35px;
    padding-top: 14px;
    text-align: center;
	letter-spacing: 2px;
	color:#FFFFFF;
}
.fb{
	width:28px;
	height:28px;
	float:right;
	margin-right: 3px;
    margin-top: 31px;
	}	
8/*
header nav {
	width:700px;
}*/
.navDiv{
	
	}
header nav ul.menu {
	 display: inline-block;
	 margin:20px 0 0
}

header nav ul.menu li.btn,
header nav ul.menu li.hr {
	float: left;
	padding: 0 2px;
	position: relative;
}

header nav ul.menu li.hr{
	padding: 0 3px;
	width:10px;
}
header nav ul.menu li.hr img {
	padding: 18px 0;
}

header nav ul.menu li a.link,header nav ul.menu li a.visited,header nav ul.menu li a.active {
	border-top: 3px solid #fff;
	font-family: "微軟正黑體",Arial;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    position: relative;
    text-decoration: none;
    color: #000;
    display: block;
    padding: 11px 18px;
    letter-spacing: 1px
}

header nav ul.menu li:hover a{
	border-top: 3px solid #0068ad
	}
header nav ul.menu li:hover li a {
    background: #0068ad;
    border: 1px solid #3f9ddb;
    border-width: 0 0 1px
}	
header nav ul.menu li .nav2 li:hover a{ background: #EB5B3E; color:#fff }

/*header nav ul.menu li ul .menu .btn ul{
	position: absolute;
	left: -37px;
	top: 24px;
	z-index: 9999;
	width: 179px;
	display: none;
}*/

div.advertising{
	width:980px;
	height:51px;
	display:block;
	margin:0 auto;
	behavior: url(PIE.htc);
	overflow:hidden;
}

div#marquee {
	width: 946px;
	height: 51px;
	line-height: 51px;
	margin-left: 18px;
	overflow: hidden;
}

div#marquee ul {
	overflow: hidden;	
	
}

div#marquee ul li{
	float: left;
	padding-right: 30px;
	padding-left: 30px;
}

div#marquee ul li a , div#marquee ul li a:visited {
	color: #CC2E68;
	font-family: "微軟正黑體";
	font-size: 13px;
	line-height: 35px;
	text-decoration:none;
}

div#marquee ul li a:hover {
	color: #FF4400;
	text-decoration:underline;
}

header nav ul.menu li.btn ul .top_ {
	background: url(../images/layout/pulldown_11.png) no-repeat scroll 0 0;
	height: 17px;	
}

header nav ul.menu li.btn ul .bottom_ {
	background: url(../images/layout/pulldown_15.png) no-repeat scroll 0 0;	
	height: 11px;

}

header nav ul.menu li.btn ul li{
	background: url(../images/layout/pulldown_13.png) repeat-y scroll 0 0;	
	display: block;
	text-align: left;
}

header nav ul.menu li.btn ul li a ,
header nav ul.menu li.btn ul li a:visited  {
	line-height: 24px;
	color: #fff;
	display: block;
	text-decoration:none;
	font-size:16px;
	padding: 10px 18px;
}

/*nav3*/
.nav3{ background:#fcfcfc; display:none; position:absolute; left:40%; width:170px; padding:10px 0; border:1px solid #ce9d62}
header nav ul.menu li.btn ul li ul li{ background:#fcfcfc}
.sub_btn:hover .nav3{ display:block}
.btn6.btn.shop{ display:none}

/**
 *	footerCt
 */
 
div.logo2{
	width:143px;
	height:23px;
	display:block;
	padding:15px 0px 0px 16px;
}
 
div.footerCt h2{
	width:143px;
	height:23px;
	display:block;
	background:url(../images/logo2.png) no-repeat left top;
	text-indent:-9999px;
}

div.footerCt address{
	width:375px;
	position:absolute;
	right:0;
	top:12px;
	font-style: normal;
}

div.footerCt address p{
	color:#fff;
}

div.footerCt address p.body{
	width:74px;
	float:right;
	background:url(../images/arrow1.png) no-repeat left 8px;
	padding:5px 0 0 10px;
}

div.footerCt address p a.bodyBtn{
	width:71px;
	height:14px;
	display:block;
	background:url(../images/bodyBtn.png) no-repeat left top;
	text-indent:-9999px;
}

div.footerCt address span.count{
	color:#882f30;
	padding-right:10px;
}

/**
 *	Pagebanner
 */
.index_about{
    max-width: 1200px;
    margin: 0 auto;
    padding: 25px 0;
}
.index_about li {
    float: left;
    margin: 0 15px 0 0;
	position: relative;
	width: calc((100% - 30px)/3);
}.index_about li:last-child {
	margin: 0;
}
.index_about .en {
	font-family: 'Pacifico', cursive;
	font-size: 25px;
    padding: 10px 0 0;
}
.index_about div {
    background: rgba(0,0,0,.6);
    border: 1px solid rgba(255,255,255,.7);
    border-width: 1px 0;
    color: #fff;
	font-size: 21px;
    padding: 15px 30px;
    position: absolute;
    left: 0;
    right: 20%;
    bottom: 20px;
}

section.PagebannerBox{
	width:100%;
	z-index:1;
	position:relative;
	overflow:hidden;
	height:0;
	padding-bottom:28.6%
}

section.PagebannerBox:before {
    background: url("../images/layout/top_Shadow.png") no-repeat scroll 50% 0 ;
    content: "";
    height: 5px;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 60;
	background-size:cover
}

div.slideshow {
	width:100%;
	overflow:hidden;
	margin: 0 auto;
	height:0;
	padding-bottom:28.6%
}
.slideshow a{ position:absolute;top:0; left:0; width:100%; height:0; padding-bottom:28.6%; text-decoration:none }
.slideshow a img{ width:100%; height:auto}

/**
 *	PageBox
 */
section.PageBox{
	width:100%;
	min-height:300px;
	
	/*box-shadow:0px -3px 3px #dddddd;
	-webkit-box-shadow:0px -3px 3px #dddddd;
	-moz-box-shadow:0px -3px 3px #dddddd;
	-o-box-shadow:0px -3px 3px #dddddd;
	-ms-box-shadow:0px -3px 3px #dddddd;*/
	behavior: url(PIE.htc);
	z-index:100;
	position: relative
}

aside#pageLeft{
	width:251px;
	padding-top:18px;
	float:left;
	display:none
}

section.asideMain{
	
    
    margin-bottom: 12px;
    width: 251px;
}


div.asideTop{
	width:171px;
	height:53px;
	background: url(../images/layout/pro_list_btn_bg_TOP.png) no-repeat scroll 0 0;
	color: rgb(255, 0, 96);
    float: left;
    font-family: Arial,"微軟正黑體";
    font-size: 18px;
    font-weight: 500;
    padding-left: 80px;
    padding-top: 10px;
	display: inline-block;
}
div.asideCenter{
	width:251px;
	background: url(../images/layout/pro_list_btn_bg_center.png) repeat-y scroll 0 0;
	display: inline-block;
	}

div.pdTitle{
	width:251px;


}

div.pdTitle h5{

	padding:0px 10px 10px 10px;

	text-align:center;
	/*background:url(../images/pdTitleRepeat.png) repeat left top;*/
	/*background-color:#f1a9a5;*/
	/*border:1px solid #ee9590;*/
	color:#35544F;
	margin:0 auto;
	font-size:15px;
	font-family:'微軟正黑體', Arail;
	word-break: break-all;
	
}

div.asideBottom{
	width:251px;
	height:37px;
	background: url(../images/layout/pro_list_btn_bg_bottom.png) repeat-y scroll 0 0;

}

section.index-P {
	background:#EBEAE2;
	padding: 50px 0;
	position: relative;
}
.grid-box {
	max-width:1200px;
	margin:0 auto
}
.index-P .tit {
    margin: 0 auto;
    text-align: center;
    width: 50%;
}
.tit h1 {
    font-size: 21px;
	letter-spacing: 2px;
	padding: 0 0 10px;
}
.tit h2 {
	font-family: 'Pacifico', cursive;
    font-size: 21px;
    font-weight: 400;
	position:relative
}
.tit h2:before , .tit h2:after {
	border-top: 3px dotted #777;
    content: "";
    display: block;
    position: absolute;
    top: 50%;
	transform: translateY(-50%);
}
.tit h2:before {
    left: 0;
    right: calc(50% + 100px);
}.tit h2:after {
    left: calc(50% + 100px);
    right: 0;
}
section.index-info {
    max-width: 1200px;
    margin: 0 auto;
	padding: 70px 0;
}
section.index-info {
    max-width: 1200px;
    margin: 0 auto;
}
section.index-info.sec {
    border-top: 1px solid #ddd;
    padding: 45px 0 70px;
}
section.index-info .i-i-box {
    float: left;
    width: calc((100% - 110px)/2);
}
section.index-info .i-i-box:nth-child(1) {
	margin: 0 110px 0 0
}
.index-info .tit {
    text-align: center;
    width: 100%;
}
.tit-2 {
	display: table;
    padding: 30px 0 20px;
}
.tit-2tit {
    color: #9D795E;
	display: table-cell;
    font-size: 25px;
    font-weight: 600;
}
.tit-2date {
    color: #555;
	display: table-cell;
    font-size: 15px;
    font-weight: 600;
	width: 90px;
}
.brief_txt {
	font-size:16px;
	line-height:180%;
	padding:40px 0
}

section.asideMain nav{
	display: inline-block;
    width: 251px;
}

section.asideMain nav ul{
	width:245px;
	margin:0 auto;
}

section.asideMain nav ul li{
	border-bottom: 1px dotted rgb(249, 130, 104);
    display: block;
    width: 245px;
	
}

section.asideMain nav ul li a{
	color: rgb(53, 84, 79);
    display: block;
    font-family: "微軟正黑體";
    font-size: 16px;
    /*height: 34px;*/
    line-height: 34px;
    text-align: center;
    text-decoration: none;
    width: 245px;
}

section.asideMain nav ul li a:hover{
	background: url("../images/layout/pro_list_btn_hover_07.jpg") repeat-y scroll 0 0 rgba(0, 0, 0, 0);
    display: block;
}

.PageCt{
	max-width: 1160px;
    margin: 0 auto;
}
.In960 {
	margin: 0 auto;
	max-width: 960px
}
.In960 div,.In960 p,.In960 span {
	text-align:left
}
.NewsRunBox {
    //background: url("../images/index/news_bg_x.gif") repeat-x scroll 0 0 ;
    height: 51px;
    width: 100%;
}

/*麵包削*/

.location{
	height:30px;
	line-height: 30px
}
.location.Chp {
    margin: 0 0 50px;
    line-height: 1.5;
    text-align: left
}
.location ul li{
	float:left;
	margin-right:10px;
	padding-right:10px;
	background:url(../images/layout/breadCrumbs_icon.png) no-repeat right center;
	_display:inline;
	font-size:12px;
	font-family:'微軟正黑體';
	font-weight:bold;
}

.location ul li.last{
	background:0;
}

.location ul li a{
	color:#666666;
	text-decoration:none;
	-webkit-transition:all .3s;
	-moz-transition:all .3s;
	-o-transition:all .3s;
	-ms-transition:all .3s;
}

.location ul li a:hover{
	color:#000000;
	text-decoration:underline;
}
.location ul li a img {
    display: none;
}
.PageInfo{
	clear:both;
	padding-top:15px;
}


/*div.asideTop {
    color: rgb(255, 0, 96);
    float: left;
    font-family: Arial,"微軟正黑體";
    font-size: 18px;
    font-weight: 500;
    padding-left: 80px;
    padding-top: 10px;
    width: 171px;
}*/

.first_text {
    color: rgb(255, 0, 96);
    font-family: Arial,"微軟正黑體";
    font-size: 22px;
}

/*頂部選單*/
.top_button{
	float:left;}
.top li{
	float:left;}
header nav.top ul {
    position: absolute;
    right: 0;
    top: 64px;
}

header nav.top ul li{
	float:left;
	margin-right:10px;
	color:#cccccc;
}

header nav.top ul li a{
	text-decoration:none;
}

header nav.top ul li a:hover{
	text-decoration:underline;
}

header nav.top ul li.li1{
	height:20px;
	display:block;
	padding-left: 23px;
	background:url(../images/layout/level_dap.png) no-repeat 0 0;
	line-height: 21px;
}
header nav.top ul li.li2{
	height:20px;
	display:block;
	padding-left: 23px;
	background:url(../images/layout/level_vip.png) no-repeat 0 0;
	line-height: 21px;
}

header nav.top ul li.li1 a ,header nav.top ul li.li2 a{
	color:#8b8b8b;
}

.inBn img {
    height: 14.4795vw
}
.version{
	padding: 1em;
	position: absolute;
	left: 116px;
}

.version a:link,.version a:active,.version a:visited{
	color: #F9F9F9;
	text-decoration: none;
	padding: 2px 5px;
	background: #D7B696;
	border: 1px solid #E1B58F;
	margin-left: 3px;
}

#company_greeting,#company_greeting p,#company_greeting p span{
	font-family:Arial, "微軟正黑體";
	font-size:13pt;
	color:#000000;
	line-height:30px;
	}
#peivacy_area,#peivacy_area p,#peivacy_area p span{
	font-family:Arial, "微軟正黑體";
	font-size:13pt;
	color:#000000;
	line-height:30px;
	}
.PageInfo,.PageInfo p,.PageInfo p span{
	font-family:Arial, "微軟正黑體";
	font-size:13pt;
	color:#000000;
	line-height:30px;
	}
.newsPage,.newsPage p,.newsPage p span{
	font-family:Arial, "微軟正黑體";
	font-size:18px;
	color:#333;
	line-height:180%;
	}
.newsPage img{ max-width:100%; height:auto}
div#post_fh{ padding:2% }

/*.menu.btn ul{display:none}*/
.nav2{ position: absolute; top: 40px; z-index: 9999; width: 150px;	display: none}
.btn:hover .nav2{ display:block}
.s_tri{ display:none}
/*內頁選單*/
.in_nav{ 
	border: 1px solid #999;
    box-sizing: border-box;
    font-size: 0;
    float: left;
    position: relative;
    margin: 10px 0;
    padding: 10px;
	width: 250px;
}
.in_nav li{ 
    cursor: pointer;
    vertical-align: top;
    position: relative;
    z-index: 2;}
.in_nav li:hover{ background: #eee}
.in_nav li .sec_nav,.in_nav li .sec_nav a { background: #fff;border: none; line-height: 1.25; padding:0}
  
.in_nav li a{
	background: #eee;
    border-right: 5px solid #666;
    color: #000;
    display: block;
    font-size: 17px;
    font-weight: 600;
    text-decoration: none;
    padding: 5px 0 5px 10px;
    text-align: left;
}
.in_nav li:hover a{ color: #0068ad}
#nav ul li {
	border-bottom: 0;
}
#nav ul a {
    background: #fff;
    color: #555;
    font-size: 15px;
	padding: 5px 10px 5px 30px;
    text-align: left;
}

#nav ul a:hover {
	background: #f8f8f8
}
/*tinynav*/
/* styles for desktop */
.tinynav { display: none }
.in_side{ display: inline-block;
	min-height: 600px;
    width: calc(100% - 320px);
    vertical-align: top;
    padding: 0 0 0 70px;
	text-align:left
	}
.in_side h1 {
    margin: 0;
    padding: 10px 0;
    text-align: left;
    font-size: 40px;
    line-height: 48px;
    color: #368939;
    font-family: 'Microsoft JhengHei', 微軟正黑體, Tahoma, Verdana, Geneva, sans-serif;
}
.in_side h3 {
    font-size: 26px;
    line-height: 130%;
    color: #e22578;
    padding: 5px 0;
    margin-top: 20px;
}	

/*shop*/
section.contentBox {
	margin: 0 auto;
    max-width: 1100px;
    padding: 25px 0 50px;
    position: relative;
    z-index: 100;
}
section.contentBox aside {
    float: left;
    padding: 10px 0 0;
    width: 250px;
}
section.contentRight {
    float: right;
    width: calc(100% - 320px);
}
/*step*/
.step ul {
    display: table;
    width: 100%;
}
.step li {
    display: table-cell;
	position: relative;
    width: 25%;
}
.step .num {
    background: #847068;
    border-radius: 50%;
    color: #fff;
    display: inherit;
    font: 600 21px/40px arial;
    height: 40px;
    text-align: center;
    width: 40px;
}
.step .num:after {
    background: #847068;
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 40px;
    transform: translateY(-50%);
    width: calc(100% - 40px);
    height: 3px;
}
.step .tit {
    font-size: 17px;
    margin: 0 0 0 40px;
    position: absolute;
    bottom: -10px;
    text-align: center;
    width: calc(100% - 40px);
}
.num.gray,.step .num.gray:after {
    background: #ccc;
}
.step .tit.gray {
    color: #ccc;
}
.num.done,.step .num.done:after{
	background: #c5aba0;
}
.step .tit.done {
    color: #c5aba0;
}
input:invalid, textarea:invalid {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.CRL.Gr {
    grid-template-columns: 200px 1fr;
    grid-gap: 100px
}
.CRL.Gr .R, .CRL.Gr .L {
    display: block;
    text-align: left;
    width: 100%
}
.CRL.Gr .L {
	word-break: break-all
}
.CRL.Gr .L div {
    text-align: left
}
.CRL .R .title {
    font-size: 30px;
    font-weight: 500
}
.intxt {
	margin:0 0 30px;
	text-align:justify
}

@media screen and (max-width: 1340px) {
	/*header { height: 130px;}
	
	.navDiv{ display:none}
	div.logo{ padding-left:50px}
	#hamburger{ display:block; width:30px; height:30px; background:url(../images/layout/s_nav_op_B.png); cursor:pointer; position:absolute; top:40px; right:20px }
	#hamburger.open{ background:url(../images/layout/s_nav_cl_B.png)}
	.navDiv.responsive{display:block; position:absolute; top:130px; width:100%; background:#eee; border-top:1px solid #999}
	.navDiv.responsive nav ul.menu{ display:block; margin:0 ; width: 100%}
	.navDiv.responsive nav ul.menu li a.link{ background:none; color:#fff; height:auto; font-size:19px; padding:10px 0; margin:0 10%; text-align:left}
	.navDiv.responsive nav ul.menu li a.link:hover { background:#544943}
	.navDiv.responsive nav ul.menu li.btn{ background: #735f53; float:none;}
	.navDiv.responsive nav ul.menu li.btn:hover{ background:#544943}
	.navDiv.responsive nav ul.menu li{ border-bottom:1px solid #999}
	.navDiv.responsive nav ul.menu li .nav2 li{ border-top:1px solid #bbb;border-bottom:none}
	
	header.smaller .top1 { float: none}
	header.smaller .logo{ margin: 0; padding: 9px 0 0 0; }*/
	
	
	
	.R-nav { right: 70px;}
	.mem { height: 32px; }
	a.mem { background: none; height: auto; line-height: 31px;}
	a.mem b { background: url(../images/layout/man-icon02.png) no-repeat 0 0;}
    .mem span,.cartText { display: none;}
	.R-nav li:nth-child(2) { padding: 0 0 0 10px; width: 26px;}
	.R-nav input[type="text"] {  padding: 0 0 0 35px; transition:all .5s; width: 0;}
	.R-nav input[type="text"]:focus {  width: 100px;}
    .s-icon { float:right}
   
	
	/*ul.menu li.hr{ display:none}
	.nav2{ position: relative; top:0; left:0; width:100%; text-align:center}
	.nav3{ position:relative; left:0;  width:100%; padding:0 ; border:0 }
	.navDiv.responsive nav ul.menu li.btn ul li .nav3 li{ background: #ccc3b6; paddin
	g:0 0 0 30px}
	
	.navDiv.responsive nav ul.menu li.btn ul li .nav3 li:hover{ background:#e8d4b8}
	header nav ul.menu li.btn ul li a, header nav ul.menu li.btn ul li a:visited{ background:none; color:#fff; font-size:15px; margin:0 10%; padding:3px 0 3px 30px; text-align:left}
	.navDiv.responsive nav ul.menu li.btn ul .top_ { display:none}
    .navDiv.responsive nav ul.menu li.btn ul .bottom_ { display:none}
    .navDiv.responsive nav ul.menu li.btn ul li{ background:#908373}
	.navDiv.responsive nav ul.menu li.btn ul li:hover{ background:#eb5b3e}
	.navDiv.responsive .s_tri{ display:inline-block; margin:0 0 0 5px; width:10px; height:9px; background:url(../images/layout/s_nav_tri.png)}
	.online_shop { top: 45px; right: 90px}
	header.smaller .online_shop{ top:20px }
	header.smaller .navDiv.responsive{ top:60px}*/
	/*
	.navDiv.responsive nav ul.menu li ul.nav2{ display:none}*/
}

@media screen and (max-width: 1200px) {
	.index_about {
		padding: 15px;
	}
	section.index-info {
		padding: 30px 15px;
	}
	section.index-info .i-i-box:nth-child(1) {
		margin: 0 30px 0 0;
	}
	section.index-info .i-i-box {
		width: calc((100% - 30px)/2);
	}
	.grid-box { padding: 15px;}
	section.index-P { padding: 50px 0 100px;}
	div.PageInfo { padding: 15px;}
	.contentRight div.PageInfo { padding: 15px 0;}
}
@media screen and (max-width: 1200px) {
	.navDiv{ display:none}
	.headerTop {
		text-align: left
	}
	div.logo{ padding-left:30px}
	#hamburger{ display:block; width:30px; height:30px; background:url(../images/layout/s_nav_op_B.png); cursor:pointer; position:absolute; top:30px; right:20px }
	#hamburger.open{ background:url(../images/layout/s_nav_cl_B.png)}
	.navDiv.responsive{display:block; position:absolute; width:100%; background:#eee; border-top:1px solid #999}
	.navDiv.responsive nav ul.menu{ display:block; margin:0 ; width: 100%}
	.navDiv.responsive nav ul.menu li a.link{ background:none; border: none; color:#fff; height:auto; font-size:19px; padding:10px 0; margin:0 10%; text-align:left}
	.navDiv.responsive nav ul.menu li a.link:hover { background:}
	.navDiv.responsive nav ul.menu li.btn{ background: #0068ad; float:none;}
	.navDiv.responsive nav ul.menu li.btn:hover{ background:#008742}
	.navDiv.responsive nav ul.menu li{ border-bottom:1px solid #0996f3}
	.navDiv.responsive nav ul.menu li .nav2 li{ border-top:1px solid #217cb9;border-bottom:none}
	
	ul.menu li.hr{ display:none}
	.nav2{ position: relative; top:0; left:0; width:100%; text-align:center}
	.nav3{ position:relative; left:0;  width:100%; padding:0 ; border:0 }
	.navDiv.responsive nav ul.menu li.btn ul li .nav3 li{ background: #ccc3b6; paddin
	g:0 0 0 30px}
	
	.navDiv.responsive nav ul.menu li.btn ul li .nav3 li:hover{ background:#e8d4b8}
	header nav ul.menu li.btn ul li a, header nav ul.menu li.btn ul li a:visited{ background:none; border: none;color:#fff; font-size:15px; margin:0 10%; padding:3px 0 3px 30px; text-align:left}
	.navDiv.responsive nav ul.menu li.btn ul .top_ { display:none}
    .navDiv.responsive nav ul.menu li.btn ul .bottom_ { display:none}
    .navDiv.responsive nav ul.menu li.btn ul li{ background:#0b5485}
	.navDiv.responsive nav ul.menu li.btn ul li:hover{ background:#eb5b3e}
	.navDiv.responsive .s_tri{ display:inline-block; margin:0 0 0 5px; width:10px; height:9px; background:url(../images/layout/s_nav_tri.png)}
	header.smaller .top1 { display: inline-block}
	
	
	header.smaller .top1 { display:none; float: none}
	header.smaller nav ul.menu { margin: 10px 0 0 150px;}
	header.smaller .logo{ margin: 0; padding: 9px 0 0 0; }
	header.smaller .online_shop{ top:20px }
	header.smaller .navDiv.responsive{ top:60px;}
}
@media screen and (max-width: 1160px) {
	//.in_side{ width:75%}
	.index_about div {
   	    right: 0;
	}
	.index_about .en {
    	font-size: 17px;
	}
	.wrapper {
		margin: 0 auto;
	}
	.inBn {
		display: flex;
		height: 278px;
		overflow: hidden;
		justify-content: center
	}
	.inBn img {
		height: 278px;
		width: 1920px
	}
}
@media screen and (max-width: 1100px) {
	section.contentBox {
		padding: 25px 15px 50px;
	}
	section.contentRight {
		width: calc(100% - 280px);
	}
	
}
@media screen and (max-width: 1000px) {
	
	
}
@media screen and (max-width: 1000px) {
	.footer_font { padding: 10px 0 0 50px;}
}	
@media screen and (max-width: 960px) {
    .In960 {
		margin: 16px	
	}
	.CRL.Gr {
		grid-gap: 30px
	}
}
@media screen and (max-width: 900px) {
	div.logo h1 { background-size: 100%; width: 300px;}
	.footer_font span{display:block; border-right:1px solid #999}
}
@media screen and (max-width: 768px) {
	div.logo h1 { width: 260px;}
	
	/* styles for mobile */
    .tinynav { display: block }
    #nav{ display: none }
    select#tinynav1{ color:#555; margin:10px auto; width:98%; padding:5px; outline:0}
    .in_side{ margin:10px 0 0; padding: 0; width:98%}
	section.PagebannerBox,#fade_pic{ padding-bottom:75%}
	.index_about div {
    	padding: 10px 15px; bottom: 10px;
	}
	section.index-info .i-i-box:nth-child(1) {
		margin: 0 0 30px;
	}
	section.index-info .i-i-box {
		margin: 0 0 30px; width: 100%;
	}
	/*.tit h1 { font-size: 35px;}*/
	.tit-2tit { font-size: 19px;}
	.index-P .tit { width: 100%;}
	
	
	section.contentBox aside {
		width: 100%;
	}
	section.asideMain2 nav ul {
		display: none;
	}	
	section.contentRight { width: 100%;}
	.inBn {
		height: 111px}	
	.inBn img {
		height: 111px;
		width: 768px
	}
	.In960 {
		margin: 0
	}
	.CRL.Gr {
    	grid-template-columns: 1fr
	}
}
@media screen and (max-width: 640px) {
	header{ height:60px}
	div.headerTop { text-align: left; padding: 0 0 0 30px;}
	div.logo{ margin: 15px 0;padding:0}
	div.logo h1{ height: 36px;width: 200px}
	#hamburger{ top:15px; right:15px }
	.navDiv.responsive{top:60px; left: 0;}
	header.smaller .logo a h1 { background-size: 100%; background-repeat: no-repeat ; height: 43px; margin: 4px 0 0; width: 180px;}
	header.smaller .R-nav { top: 8px;}
    
	
	.R-nav { top: 10px;}
	.input { display:none}
	.s-input {  background: #4e423b; display:block; padding: 10px 0; text-align: center;}
	.s-input input[type="text"] {
		border: 0;
		width: 160px;
		height: 30px;
		line-height: 30px;
		padding: 0 5px 0 35px;
		margin: 0;
		outline:0;
		background: url(../images/layout/search.png) no-repeat 0 0,#fff;
	}
	.s-input select {
		border: 0;
		font-size: 15px;
		height: 30px;
		outline: 0;
		padding: 0 3px;
		text-align-last: center;
	}
	
	
	.index_about li {
		height: 70px; overflow: hidden; text-align: center; width: 100%;
	}
	.index_about .en {
		display: inline-block; padding: 0 0 0 20px;
	}
	.footer_info { padding: 0 15px;}
    .footer_logo { margin: 0 0 0 30px}
	.footer_font { padding: 10px 0 0 0}
	.footer-c { font-size: 13px;}
	footer h1 { font-size: 18px;}
	.footer-c h3 { font-size: 12px; letter-spacing: 6px;}
	
	
	.step ul { display: block; width: 100%;}
	.step li { display: inline-block; margin: 0 0 10px; position: relative; width: 49%;}
	.step .num { height: 30px; line-height: 30px; width: 30px;}
    .step .num:after { left: 30px; width: calc(100% - 120px);}
    .step .tit { margin: 0; bottom: initial; top: 50%; right: 10px; transform: translateY(-50%); width: auto;}
}

@media screen and (max-width: 480px) {
	div.headerTop { padding: 0 0 0 20px;}
	.R-nav { right: 60px;}
	.R-nav li:nth-child(2) { padding: 0 0 0 5px;}
    
	.footer_logo {
		display: block;
		margin: 15px auto 0
	}
	.footer_font { padding: 0}
}