@charset "utf-8";
@media (min-width: 992px) and (max-width: 1199px ){
	.mid-section .col-sm-6{
		height:auto;
	}
	.mid-section .row:nth-of-type(1){
		margin-top: 75px;
	}
	.mid-section .mid-f{
		margin-top: 35px;
	}
	.mid-section .mid-f ul li{
		width: 19.4%;
	}
	.mid-section .col-sm-6 span{
		top:25%;
	}
	.foot .col-sm-5 img:nth-of-type(1){
		width: 200px;
	}
	.foot .col-sm-5 img:nth-of-type(2){
		width: 100px;
	}
	.foot .row{
		height: 100px;
	}
	footer.container ul li{
		margin:0 5px;
	}
}
@media (min-width: 768px) and (max-width: 991px){
	#wrap .container{
		width: 750px;
	}
	.navbar-nav > li{
		margin:0 6px;
	}
	.mid-section .row:nth-of-type(1){
		margin-top: 35px;
	}
	.mid-section .col-sm-6{
		height:auto;
	}
	.mid-section .col-sm-6 h5{
		bottom:0;
	}
	.mid-section .col-sm-6 span h4{
		font-size: 18px;
		margin:0;
	}
	.mid-section .mid-f{
		margin-top: 35px;
	}
	.mid-section .mid-f ul li{
		width: 19.4%;
	}
	.foot .col-sm-5 img:nth-of-type(1){
		width: 160px;
	}
	.foot .col-sm-5 img:nth-of-type(2){
		width: 80px;
	}
	.foot .row{
		height: 80px;
	}
	.container .footer{
		text-align:center;
	}
	.container .footer li{
		line-height:25px;
	}
	#pagebody .addauto .container-fluid .container{
		width: 750px;
	}
	.title-maintitle{
		margin-top: 0;
	}
	#pagebody .addauto .container-fluid.product-3D >.col-xs-12:nth-of-type(1){
		height: 300px;
	}
	#pagebody .addauto .container-fluid.product-3D >.col-xs-12:nth-of-type(1) img{
		margin-top: -100px;
	}
	.news .row .col-sm-6,
	.media .row .col-sm-6{
		width: 47%;
	}
}
@media screen and (min-width: 768px) {
	.sample .container.info .row .col-xs-12 {
	display: flex;
	 align-items:stretch;
}
}
@media screen and (max-width: 768px) {
	footer, .product-btn, .product-colors, .title, .contact{
		text-align: left
	}
	.brand{
		width: 150px;
		display:inline-block;
		margin-left: 15px;
	}
	.navbar-default .navbar-collapse{
		width: 100%;
		background:#303b4a;
		z-index:9999;
		padding:0;
		overflow:visible;
		margin:0;
		top:80px;
		bottom:inherit;
		height:auto;
	}
	.navbar-header{
		width: 100%;
	}
	.navbar .container{
		padding:0;
		width: 100%;
	}
	.navbar-default .navbar-toggle{
		margin-top: 15px;
	}
	.nav.navbar-nav.pull-right{
		display:block;
		float:right!important;
		width: 100%;
		padding-bottom: 15px;
		margin: 0;
	}
	.navbar-default{
		height: 80px;
	}
	#wrap{
		padding-top: 0;
	}
	/*自動展開選單*/
	.dropdown:hover >.dropdown-menu{
		position:inherit;
		width: 100%;
	}
	.dropdown-submenu>.dropdown-menu{
		position:relative;
		left:0;
		margin:0;
		box-shadow:none;
	}
	.navbar-default .navbar-nav .open .dropdown-menu>li>a{
		padding-left: 15px;
	}
	.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus{
		background:none;
	}
	.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:hover, .navbar-default .navbar-nav>.open>a:focus{
		background: transparent;
		color:#fff;
	}
	.dropdown:hover >.dropdown-menu,.nav .open>a, .nav .open>a:hover, .nav .open>a:focus,
	.nav .open>a, .nav .open>a:hover, .nav .open>a:focus{
		background: rgba(255,255,255,.1);
	}
	.navbar-default .navbar-nav .open .dropdown-menu>li>a,
	.navbar-default .navbar-nav .open .dropdown-menu>li>a:hover, .navbar-default .navbar-nav .open .dropdown-menu>li>a:focus{
		color:#fff;
	}
	.dropdown-submenu>.dropdown-menu{
		left:0;
	}
	.mid-section .row:nth-of-type(1){
		margin-top: 35px;
	}
	.mid-section .col-sm-6{
		height:auto;
	}
	.mid-section .col-sm-6 span h4{
		font-size: 22px;
	}
	.mid-section .col-sm-6{
		width: 100%;
		margin:0;
		margin-bottom: 35px;
	}	
	.mid-section a.col-sm-6 img:nth-of-type(1){
		opacity: .6;
		transition:all .4s ease-in-out;		
	}
	.mid-section a.col-sm-6 span{	
		transform:translate(0, 0px);
		transition:all .4s ease-in-out;
		opacity: 1;
	}
	.mid-section{
		background-size: 1280px 1280px;
		background-position:center;
	}
	.mid-section .mid-f{
		margin-top: -35px;
		margin-bottom: 15px;
	}
	.mid-section .mid-f ul li{
		width: 17%;
		margin:0 5px;
	}
	.foot .col-sm-5 img:nth-of-type(1){
		width: 65%;
	}
	.foot .col-sm-5 img:nth-of-type(2){
		width: 30%;
	}
	.foot .row .list-inline{
		width: 150px;
		margin:15px auto;
		display:block;
		position:relative;
	}
	.foot .row .col-sm-7{
		height: 50px;
		width: 100%;
	}
	.foot .row{
		height:auto;
		width: 100%;
		margin:0;
	}
	#wrap .container{
		width: 100%;
	}
	#pagebody .addauto .container-fluid .container{
		width: 100%;
	}
	.aboutus .container >.col-xs-12:nth-of-type(1){
		height: 200px;
	}
	.title-maintitle{
		margin-top: 15px;
	}
	.product .col-sm-7 h4.title,
	.product .col-sm-7 h5.title,
	.product .container:nth-of-type(2) .col-xs-12 h5.title{
		text-align: left
	}
	#pagebody .addauto .container-fluid.product-3D >.col-xs-12:nth-of-type(1) img{
		margin-top: -100px;
	}
	#pagebody .addauto .container-fluid.product-3D >.col-xs-12:nth-of-type(1){
		height: 40vw;
	}
	#pagebody .addauto .container-fluid.product-3D >.col-xs-12:nth-of-type(1) h4{
		font-size: 28px;
		width: 100%;
		text-align: center;
		right: 0;
	}
	.product-3D .container .col-xs-12{
		margin-bottom: 35px;
	}
	.product-3D .container .col-xs-12 .col-sm-6 span{
		margin: 0;
	}
	.product-3D .container .col-xs-12,
	.cadna-a.product .container:nth-of-type(2) >.col-xs-12 >span.col-xs-12{
		margin: 15px 0;
	}
	.news .row .col-sm-6, .media .row .col-sm-6{
		width: 100%;
		margin-bottom: 15px;
	}
	.news .row, .media .row{
		margin-bottom: 15px;
	}
	#pagebody .addauto .container-fluid{
		padding-top: 15px;
	}
	.sample .container:nth-of-type(1) .row:nth-of-type(1) .col-sm-4{
		height: auto;
		margin-bottom: 15px;
	}
	.sample .container:nth-of-type(2) .row .col-xs-12:nth-of-type(1){
		display: none;
	}
	.sample .container:nth-of-type(2) .row .col-xs-12 .col-sm-1, .sample .container:nth-of-type(2) .row .col-xs-12 .col-sm-3, .sample .container:nth-of-type(2) .row .col-xs-12 .col-sm-4{
		height: auto
	}
	.sample .container:nth-of-type(2) .row .col-xs-12 .col-sm-1:nth-of-type(1):before{
		content: "No.";
		display: inline-block;
		width: 30px;
	}
	.sample .container:nth-of-type(2) .row .col-xs-12 .col-sm-1 h6{
		display: inline-block;
	}
	.sample .container:nth-of-type(2) .row .col-xs-12 .col-sm-1:nth-of-type(5):before{
		content: "數量";
		display: inline-block;
		width: 30px;
	}
	.sample .container:nth-of-type(2) .row .col-xs-12 .col-sm-1:nth-of-type(5) h6{
		display: inline-block;
	}
	.sample .container:nth-of-type(2) .row .col-xs-12 h6{
		margin: 3.5px 0;
	}
	.sample .container:nth-of-type(2) .row .col-xs-12 .col-sm-1:nth-of-type(1),.sample .container:nth-of-type(2) .row .col-xs-12 .col-sm-1, .sample .container:nth-of-type(2) .row .col-xs-12 .col-sm-3, .sample .container:nth-of-type(2) .row .col-xs-12 .col-sm-4{
		border-right: none;
	}

}

@media screen and (max-width: 480px) {
#pagebody .addauto .container-fluid.product-3D >.col-xs-12:nth-of-type(1) h4{
		font-size: 22px;
		top: 25%;
	}
#pagebody .addauto .container-fluid.product-3D >.col-xs-12:nth-of-type(1) {
    height: auto;
}
#pagebody .addauto .container-fluid.product-3D >.col-xs-12:nth-of-type(1) img {
    margin-top: 0;
}
.aboutus .container >.col-xs-12:nth-of-type(1) img{
	position: relative;
	margin-top: 0px;
}
	}