@charset "utf-8";
/* 設計師用 RWD版CSS檔 style_rwd.css */
/* 說明：
    可提供設計師在此檔，針對RWD版面進行設計；非RWD版面則不需載此CSS檔。*/
@media (min-width: 1270px){
body.home .news > .container {
    width: 1270px;
    padding-left: 100px;
    padding-right: 100px;
}
}

@media (max-width: 1199px) {
	.side {
    	padding-right: 30px;
	}
	body.product .content {
   	 	padding-left: 15px;
   	 	padding-right: 15px;
	}

    .header .banner .bxslider li {
        height: auto;
    }

    .header .banner .bxslider li img {
        display: block;
    }
	.banner .bxslider li img.img_big {
    display: none;
	}
	.banner .bxslider li img.img_small {
		display: block;
	}

    .header .navbar .navbar-nav {
    	clear: both;
    	float: none;
    	text-align: center;
    }
    .header .navbar .navbar-nav > li {
        float: none;
        display: inline-block;
    }
	.header .navbar .navbar-nav > li > a{
		padding: 0 22px;
		padding: 0 10px\0;
		*padding: 0 10px;
		padding: 0 10px\8\9\0;
		padding: 0 10px\9\0;
	}
    .header .navbar .navbar-header {
        float: none;
    }

    .header .navbar .navbar-brand {
        float: none;
    }
	.header .navbar .lang {
		right: 52%;
	}

	body.product .header .navbar .lang {
    	right: 57%;
	}
	body.product.p03 .product-list {
   		padding-left: 30px;
    	padding-right: 30px;
	}
    #floating {
        margin-top: -90px;
    }
	body.home .contact {
    	padding-top: 50px;
    	padding-bottom: 40px;
	}
	body .contact .contact-info .logo{
		float:none;
		margin-right:0;
		margin-top:0;
		margin-bottom:40px;
	}
	body .contact .contact-info .logo img{
		margin:auto;
	}
	body .contact .contact-info .a-link{
		width:25%;
	}
	body .contact .contact-info .cookie{
		width:25%;
	}
	body.contact .contact-box{
		width:100%;
	}
	body.contact .contact-box .form-border{
    	padding: 25px 20px 40px;
	}
	body.member .form-border{
		padding:25px 20px 40px;
	}
	body.order.cancel .form-border,
	body.order.return .form-border {
		padding-left:20px;
		padding-right:20px;
	}
	body.member .step i {
    	font-size: 55px;
	}
	body.member .step .st {
    	width: 58%;
	}
	body.member.login .content > h1{
		width:100%;
	}
	body.member.login .form-border{
		width:100%;
	}
}

@media (max-width: 991px) {
	.header {
		padding-top: 0px;
	}
	body.product .header {
    	padding-top: 0px;
	}
	
	.header .navbar .lang {
		top: -257px;
		right: 12%;
	}
	.header .navbar .sub-nav {
    	left: auto;
    	top: -262px;
    	right: 0;
	}
	body.is_scroll .header .navbar .lang {
		top: -149px;
		right: 12%;
	}
	body.is_scroll .header .navbar .sub-nav {
    	left: auto;
    	top: -154px;
    	right: 0;
	}
	body.product .header .navbar .sub-nav {
    	top: -74px;
	}
	body.product .header .navbar .lang {
		top: -71px;
		right: 12%;
	}
	body.product .header .navbar .pro-gohome {
		position: absolute;
		top: 44px;
		right: 24%;
		display: block;
	}
	
    .header .navbar .navbar-nav {
    	padding: 0;
    	margin: 10px -20px 15px;
    }
	.header .navbar .navbar-nav > li > a {
		padding: 0 0px;
	}
	.header .nav-top {
		padding-top: 40px;
    	padding-bottom: 10px;
    	float: none;
    	position: static;
	}

    .content .btn-more {
        top: 12px;
    }

    .side {
        padding-bottom: 20px;
    	padding-right: 15px;
    }

    .side .nav {
        max-width: none;
        margin: 0;
        display: none;
    }

    .side.menu-open .nav {
        display: block;
    }

    .side .nav > li {
        float: none;
        display: inline-block;
        border: 0;
        margin: 0 5px;
        vertical-align: top;
    }

    .side .nav > li + li {
        border: 0;
    }
	body.product.show .sec_pic {
    	
	}
	
	body .contact .contact-info .a-link{
		width:41%;
	}
	body .contact .contact-info .cookie{
		width:41%;
	}
	body .contact .contact-info .con .subscription{
		float:left;
		margin-right:70px;
	}
	body .contact .contact-info .con .con-txt{
		float:left;
	}
	body.product.p03 .product-list {
    	padding-left: 0;
    	padding-right: 0;
	}
}

@media (max-width: 767px) {
	.olbox {
		border-bottom:none;
	}

	
	.container-fluid > .navbar-header {
		margin-right: 12px;
		margin-left: 12px;
	}
	body.product.show .banner{
		display:none;
	}
	body.product.show .side{
		margin-top:75px;
	}
	body.product.show .sec_pic{
		padding-right:15px;
	}
	body.product.show .des-slickBox .slick-slide img{
		width:100%;
	}
	body.product .header .navbar .pro-gohome {
		position: static;
		float: left;
		margin-left: 19px;
		margin-top: 4px;
	}
	body.product .header .navbar .member-go{
		margin-right:0;
	}
	.gotop a {
   		right: 30px;
	}
    #floating,
    #floating.fixed {
        top: 40px;
        margin-top: 0;
    }

    #floating .btn-floating {
        display: block;
    }

    #floating ul {
        width: 0;
        overflow: hidden;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }

    #floating.open ul {
        width: 60px;
    }
	.header .nav-top {
    	padding-top: 15px;
    	padding-bottom: 8px;
	}
	body.is_scroll .header .navbar {
		-moz-box-shadow: 0 0 10px 0 #919191;
    	-webkit-box-shadow: 0 0 10px 0 #919191;
    	box-shadow: 0 0 10px 0 #919191;
	}
	.header .navbar .navbar-brand{
		width: 130px;
		height: 50px;
		float: none;
		margin: 10px auto 10px;
		background-size: 100%;
		background-position: center;
	}
	
    .header .navbar .navbar-header {
        text-align: center;
    }
/*
    .header .navbar .navbar-toggle {
		letter-spacing: 2px;
		border: none;
		margin: 0px 15px 0px 0px;
		padding-left: 14px;
		background: #817977;
		border-radius: 0;
		position: absolute;
		top: -47px;
		right: 0;
    }*/
	/*body.product .header .navbar .navbar-toggle{

	}*/
	.header .navbar .navbar-header .logo2 {
		font-size: 19px;
    	line-height: 20px;
		left: 10px;
	}
	.header .navbar .navbar-header .logo2 b.t1{
		font-size: 18px;
	}
	.header .navbar .navbar-header .logo2 b.t1 span{
		margin-left: 13px;
	}

	body.product .header .navbar .lang {
    	position: static;
	}
	/*.navbar-toggle .icon-bar {
    	width: 23px;
    	background-color: #ffff;
	}
    .header .navbar .navbar-toggle:hover {

    }
	.header .navbar .navbar-collapse{
		background: #f8f3f0;
	}
   .header .navbar .navbar-nav {
        background: none;
        border-top: 1px solid #ffffff;
        margin: 0 -15px;
    }*/

    .header .navbar .navbar-nav > li {
		display: block;
		text-align: left;
    }

    .header .navbar .navbar-nav > li + li:before {
        display: none;
    }

    .header .navbar .navbar-nav > li > a {
        width: auto;
        text-align:left;
        padding: 8px 8px;
		color: #544e4c;
    }
	.header .navbar .navbar-nav li a:hover,
	.header .navbar .navbar-nav li a:focus {
    	color: #333;

	}
	.header .navbar .navbar-nav > li ul li a:hover,
	.header .navbar .navbar-nav > li ul li a:focus{
    	color: #fff;
    	background: #544e4c;
	}
    .header .navbar .sub-nav {
        text-align: center;
        margin: 10px 0 10px;
        position: static;
    }

    .header .navbar .btn-default {
        color: #333;
    }
	.header .navbar .lang {
		position: static;
    	width: 100%;
    	text-align: center;
		margin-bottom:20px;
	}
	.header .navbar .lang ul li a {
    	padding: 0 8px;
		font-size:16px;
	}
	.header .navbar .member-go{
		margin-top:2px;
	}
	.header .navbar .member-go ul li a{
		font-size:16px;
		padding-bottom: 3px;
	}
	.header .navbar .member-go ul li.login a{
		margin-right:10px;
		height: 25px;
    	width: 25px;
	}
	.header .navbar .member-go ul li.login a.login-member.pagemember{
		margin-right: 10px;
	}
	.header .navbar .member-go ul li.login a.sign-out{
		background: url(../images/all/signOut_icon.png) no-repeat right 0;
		height: 25px;
		padding-top: 8px;
		margin-right: 17px;
	}
	.header .navbar .member-go ul li.cart a{
		margin-right:0;
		height: 25px;
    	width: 25px;
	}
	.header .navbar .search_box{
		position:static;
	}
	.header .navbar .search_box input.text {
    	width: 100%;
    	margin-top: 12px;
	}
	.header .navbar .search_box a{
		top:20px;
	}
	/*下拉選單*/
	.header .navbar .open>.dropdown-menu li {
    	display: block;
    	text-align: center;
    	
	}
	.header .navbar .open>.dropdown-menu li a {
    	border-bottom: 0px solid transparent;
    	padding: 13px 10px;
	} 
	.header .navbar .open>.dropdown-menu li a:first-child{
		border-top: 0px solid transparent;
	}
	
    .footer {
        padding: 0;
    }

    .footer .sitemap {
        display: none;
    }

    .footer .copyright,
    .footer .siteinfo,
    .footer .siteinfo ul {
        display: block;
    }

    .footer .siteinfo ul > li {
        display: block;
    }

    .footer .siteinfo ul > li + li:before {
        display: none;
    }
	body .contact .contact-info .logo{
		display:none;
	}
    .main {
        z-index: auto;
    }

    .side .nav {
        margin-bottom: 20px;
    }

    .side .nav > li {
        float: none;
        display: block;
        margin: 0;
    }

    .side .nav > li + li {
        border-top: 1px solid #dadada;
    }

    .content .list-box .txt-list li.list-header {
        display: none;
    }

    .content .list-box .txt-list li span {
        float: none;
        display: block;
        padding: 0;
    }

    .content .btn-box {
        text-align: center;
    }

    .content .btn-box .page-info select {
        width: 100px;
        display: inline-block;
    }

    .content .btn-box .pager,
    .content .btn-box .page-info {
        float: none;
    }

    .content .btn-box .pager {
        display: block;
    }

    .content .btn-box .pager li {
        margin: 0;
    }

    .content .btn-box .pager li > a {
        width: 100%;
        text-align: center;
        margin: 5px 0 0;
        padding-left: 0;
        padding-right: 0;
    }
	
	.content .table.table-stack > thead,
    .content .table.table-stack > tbody > tr > td.num {
        display: none;
    }

    .content .table.table-stack > tbody > tr,
    .content .table.table-stack > tbody > tr > td {
        display: block;
        clear: both;
    }

    .content .table.table-stack > tbody > tr {
        border-bottom: 1px dotted #ccc;
        position: relative;
        padding: 10px 5px;
    }

    .content .table.table-stack > tbody > tr:last-child {
        border: none;
    }

    .content .table.table-stack > tbody > tr > td {
        border: none;
        text-align: left;
        padding: 0;
        line-height: 1.6;
    }

    .content .table.table-stack > tbody > tr > td .tn {
        display: inline-block;
        color: #aaa;
    }

    .content .table.table-stack > tbody > tr > td .input-group {
        margin: 0;
    }

    .content .table.table-stack > tbody > tr > td.pic {
        margin-bottom: 10px;
    }
	.content .table.table-stack > tbody > tr > td.pic img {
    	max-width: 100%;
    	width: 100%;
	}

    .content .table.table-stack > tbody > tr > td.del {
        display: block;
        position: absolute;
        right: 0;
        bottom: 10px;
    }
	.content .table.table-stack.no-border th {
        text-align: left;
        width: 100%;
        padding: 0;
    }
	    body.cart .content .btn-box {
        padding: 10px 0;
    }

    body.cart .content .btn-box .btn {
        width: 100%;
        float: none;
        margin-bottom: 5px;
    }
	body.home .news .wid-home-news .box-list{
		margin-left:45px;
		margin-right:45px;
	}
	body.home .news .wid-home-news .slick-prev{
	    left: -15px;
	}
	body.home .news .wid-home-news .slick-next{
		right: -15px;
	}
	body.home .news .wid-home-product .box-list{
		margin-left:45px;
		margin-right:45px;
	}
	body.home .news .wid-home-product .slick-prev{
	    left: -15px;
	}
	body.home .news .wid-home-product .slick-next{
		right: -15px;
	}
	body .contact .contact-info .a-link{
		float:none;
		width:80%;
		margin:auto;
	}
	body .contact .contact-info .cookie{
		float:none;
		width:80%;
		margin:35px auto;
	}
	body .contact .contact-info .con{
		float:none;
		width:80%;
		margin:auto;
	}
	body .contact .contact-info .con .subscription{
		float:none;
		margin-right: 0px;
	}
	body .contact .contact-info .con .subscription .search input {
    	width: 250px;
	}
	body .contact .contact-info .con .con-txt{
		float:none;
	}	

	
	body.news .list-box .item .pic img{
		width:100%;
	}
	body.product .side .pro_nav h3{
		display:none;
	}
	body.product .side .pro_nav .search_box{
		display:none;
	}

	body.product.p01 .box01 .info h4{
    	padding: 10px;
    	font-size: 20px;
	}
	body.product.show .content .product-pic .zoomPad {
    float: none;
	}
	body.product.show .content .product-pic a .img-zoom {
    	width: 100%;
	}
	body.home .product .wid-home-product .slick-prev{
	    left: -15px;
	}
	body.home .product .wid-home-product .slick-next{
		right: -15px;
	}
	body.home .product .wid-home-product .box-list {
    	margin-left: 15px;
    	margin-right: 15px;
	}
	.content .con-list{
		text-align:left;
	}
	.content .con-list .cost{
		display:inline-block;
		margin-left: 5px;
	}
	.content .con-list li span {
    	display: inline-block;
    	width: inherit;
	}
	body.order.p01 .table.table-stack > tbody > tr > td:first-child{
		width:100%;
	}
	body.member .step .step-box{
		text-align:center;
		margin-bottom: 20px;
	}
	body.member .step i {
    	font-size: 55px;
    	float: none;
	}
	body.member .step .st {
    	width: 100%;
    	margin-left: 0;
	}
	.content .btn-box.st02 .pager {
		display:inline-block;
	}
	.content .btn-box.st02 .pager li > a {
		width:auto;
	}

	body.cart.p01 .cart-sec2 .distribution {
        margin-bottom: 15px;
        margin-left: 50px;
    }	
}
@media (max-width: 550px){
	body.product.p01 .box01 .info h4 {
		padding: 10px;
		font-size: 18px;
	}
	body.member .form-border {
    	padding: 25px 15px 40px;
	}
	
	body.member.p01 ul.mem-nav li a {
		width: 130px;
		padding: 20px 0;
	}

}
@media (max-width: 430px){

	body.product.p01 .box01 .info h4 {
    	padding: 10px;
    	font-size: 16px;
	}
	body .contact .contact-info .contact .a-link{
		width:100%;
	}
	body .contact .contact-info .contact .cookie{
		width:100%;
	}
	body .contact .contact-info .contact .con{
		width:100%;
	}
	body .contact .contact-info .con .subscription .search input {
    	width: 200px;
	}
	body.member .step .step-box{
		padding:10px;
	}
	body.member .step i {
    	font-size: 40px;
	}
	body.member .step .st p{
		font-size:18px;
	}
	body.member .step .step-box.st_this::after {
    	content: "";
    	width: 12px;
    	height: 12px;
   		margin-left: -6px;
	}

	
}

@media (max-width: 400px){

	body.member a.btn.btn-primary{
		margin-top:5px;
	}
	body.cart.p01 .cart-sec2 .bonus .txt-red{
		display:block;
}
	
}

@media (max-width: 360px){

	body .contact .contact-info .con .subscription .search input {
    	width: 160px;
	}
	body.lang_en .contact .contact-info .con .subscription a{
		padding: 0 6px 1px 5px;
	}
	body.lang_en .contact .contact-info .con .subscription .search input {
    	width: 150px;
	}
	
}