@charset "utf-8";
/* @import url("../css/reset.css");
@import url("../css/font-awesome.min.css");ICON API */
a{
	cursor: pointer;
}
input[type=submit]{
	cursor: pointer;
}
/*手機版首頁 start */
.rwd_show{
	display:none;
}

.dots_drop{
	text-align:left;
}
/*手機版首頁 end */

/*0.--- reset重置 start ---*/

*,*:before,*:after{
	margin: 0;
	padding: 0;
	font-weight: normal;
	box-sizing: border-box;
}
body{
	font-size: 16px;
	color: #302d2d;
  	-webkit-text-size-adjust: none;
  	font-family: "微軟正黑體",Arial,Helvetica,sans-serif;
	background-color: #fff;
}
ol,ul{list-style-type: none;}
a{text-decoration:none;color:#000;}
/*0.--- reset重置 end ---*/
/*€.--- Shared共用 start ---*/
.container{
	width: 1500px;
	margin: 0 auto;
}
.img_box{
	display: block;
	overflow: hidden;
  	position: relative;
  	top: 0;
  	left: 0;
}
.img_box img{
  	max-width:100%;
  	width: auto;
  	height: 100%;
  	object-fit: cover;
  	position: absolute;
  	top: 50%;
  	left: 50%;
  	transform: translate(-50%,-50%);
}
/*滾軸隱藏*/
.scrollbar_none{
	overflow: hidden;
    overflow-y: scroll;
}
/* body::-webkit-scrollbar,
.scrollbar_none::-webkit-scrollbar{width: 0.1;}
body::-webkit-scrollbar-track-piece,
.scrollbar_none::-webkit-scrollbar-track-piece{
  	background-color: transparent;
  	-webkit-border-radius:6px;
} */
.scrollbar_none::-webkit-scrollbar {
	width: .5em;
}
.scrollbar_none::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
.scrollbar_none::-webkit-scrollbar-thumb {
background-color: darkgrey;
outline: 1px solid slategrey;
}

.texthtml {
    overflow-y: hidden;
}

/*麵包穴*/
.crumbs{
	float: right;
    max-width: 100%;
    padding-top: 20px;
    padding-bottom: 4px;
    max-height: 97px;
    overflow: hidden;
    margin-right: 4%;
}
.crumbs .breadcrumb{
	font-size: 14px;
    line-height: 22px;
}
.crumbs .breadcrumb li{
	display: inline-block;
    vertical-align: top;
}
.crumbs .breadcrumb li a{}
.crumbs .breadcrumb li a span{margin-right: 5px;}
/*清除浮動*/
.clearbox:after{
	content: "";
	display: block;
	clear: both;
	font-size: 0;
	width: 0;
	height: 0;
	line-height: 0;
	overflow: hidden;
	visibility: hidden;
	opacity: 0;
	margin: 0;
	padding: 0;
	outline: 0;
	border: 0;
}
/*文字不換行加延續效果*/
.white_space{
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
/*頁碼*/
.page_counter{text-align: center;}
.page_counter a{
	display: inline-block;
    width: 40px;
    height: 40px;
    border: 1px solid #666;
    text-align: center;
    line-height: 40px;
    font-size: 15px;
    margin-right: 5px;
    margin-bottom: 5px;
    color: #666;
}
.page_counter a.current,
.page_counter a:hover{
	background-color: #939393;
    color: #fff;
}
.page_counter a.current{cursor: default;}
/*回到列表*/
.page_list{
    width: 100%;
    margin: 0 auto;
    margin-top: 40px;
    margin-bottom: 60px;
    text-align: center;
}
.page_list a{
	font-size: 16px;
    font-weight: bold;
    color: #333;
    display: inline-block;
    margin: 0 15px;
    letter-spacing: 2px;
    padding: 4px 0;
}
.page_list .prev{border-top:2px solid #c0c0c0;}
.page_list .back{}
.page_list .next{border-bottom:2px solid #c0c0c0;}


/*€€€---只有這個專案---*/
	/*左右陰影*/
	.sd_l{box-shadow:-15px 15px #e0d4a2;}
	.sd_r{box-shadow:15px 15px 1px #e0d4a2 ;}

	/*點滴*/
	.dots_drop:before/*,
	.dots_drop:after*/{
	    content:"";
	    display: inline-block;
	    vertical-align:middle;
	    width: 7px;
	    height: 27px;
	    background-image:url(../images/icon.png);
	    background-repeat:no-repeat;
	    background-position: -1px -508px;
	}
	/*底線*/
	.dotted{
		position: relative;
		top: 0;
		left: 0;
	}
	/* .dotted:before{
		content: "";
		display: block;
		width: 160%;
		height: 100%;
		border-bottom: 1px solid transparent;
		border-image: url(../images/icon_1.png) 0 1 1 3 repeat;
		border-image-width: 2px;
		position: absolute;
		top: 0;
		left: -25%;
	} */
	/*置頂按鈕*/
	.gotop{
		display: none;
		border-top: 2px solid #999;
		letter-spacing: 4px;
		padding: 5px 0;
		text-indent: 3px;
		position: fixed;
		right: 50px;
		bottom: 150px;
		cursor: pointer;
		z-index: 1;
	}
	/*標體*/
	h2{
		font-size: 35px;
		float: left;
		font-weight: bold;
		letter-spacing: 3px;
	}
	/*編號*/
	.num{letter-spacing: 2px;}
	.num span{
		width: 25%;
		display: inline-block;
		vertical-align: top;
	}
	/*瀏覽*/
	.view{
		background-color: #939393;
	    border: 1px solid #cdcdcd;
	    color: #fff;
	    width: 55px;
	    height: 24px;
	    line-height: 22px;
	    margin: 0 auto;
	    text-align: center;
	    letter-spacing: 2px;
	    font-size: 13px;
	}
	.view.active,
	a:hover .view{background-color: #333;}
/*€.--- Shared共用 end ---*/

/*0.--- desktop桌機 start ---*/
.wrapper{}
	/*1.--- header頁首 start ---*/
	header{}
	header .container{
		z-index: 2;
		margin-bottom: 6%;
	}
		
		/*2.--- LOGO start ---*/
		header .logo{
			float: left;
			padding-top: 13px;
			margin-right: 107px;
		}
		header .logo a{
			width: 173px;
    		height: 150px;
		}
		header .logo h1{
			font-size: 0;
			line-height: 0;
			width: 0;
			height: 0;
			overflow: hidden;
		}
		/*2.--- LOGO end ---*/
		/*2.--- nav導覽列 start ---*/
		nav{}
		
		nav > ul{
			padding-top: 80px;
		    letter-spacing: 1px;
		}
		nav > ul > li{
			float: left;
			position: relative;
			top: 0;
			left: 0;
			z-index: 99;
		}
		nav > ul > .dots_drop{}
		nav > ul > .dots_drop:before{display: none;}
		nav > ul > .dots_drop:after{clear: both;}
		nav > ul > .dots_drop:last-child:after{display: none;}
		nav > ul > .dots_drop:nth-child(even):after{transform: rotate(180deg);}
		nav > ul > li > a{
			margin: 0px 73px;
		    display: inline-block;
		    text-align: center;
		}
		nav > ul > li a{padding-bottom: 19px;}
		nav > ul > li .dotted:before{
			opacity:0;
			transition: opacity .3s ease-out;
		}
		nav > ul > li .dotted:hover:before{
			opacity:1;
			transition: opacity .2s ease-in;
		}
		nav > ul > li:first-child > a{margin-left:0;}
		nav > ul > li:last-child > a{margin-right:0;}
		nav > ul > li:hover ul.menu{display: block;z-index: 1;}
			/*3.--- Drop down menu下拉式選單 start ---*/
			nav > ul > li > ul{
				display: none;
				background-color: #f9feff;
				position: absolute;
			    top: 100%;
			    left: 25%;
			    width: 128px;
			    text-indent: 18%;
			    overflow: hidden;
			}
			nav > ul > li > ul > li{margin-bottom: 19px;}
			nav > ul > li > ul > li:hover{background-color: #fff;}
			nav > ul > li > ul > li > a{display: block;padding-top: 19px;}
			/*3.--- Drop down menu下拉式選單 end ---*/
		/*2.--- nav導覽列 end ---*/
	/*1.--- header頁首 end ---*/

	/*1.--- article內容 start ---*/
	article{background-image: url(../images/bg_1.jpg);}
	article > section{}
		/*2.--- index首頁內容 start ---*/
		.index{}
		.index .container{
			padding-top: 55px;
			overflow: hidden;
		}
		    /*3.--- 首頁 的 商品項目 start ---*/
		    .in_commodity{}
		    .in_commodity .img_box{
			    width: 1070px;
    			height: 676px;
			    float:left;
		    }
		    .in_commodity .img_box img{width: 100%;}
		        /*4.--- 首頁 的 商品項目 的 選單 start ---*/
		        .in_commodity_item{
			        width: 352px;
			        height: 605px;
			        float:left;
			        margin-left: 5%;
			        letter-spacing:2px;
		        }
		        .in_commodity_item > *{font-weight:bold;}
		        .in_commodity_item h5{
		        	font-size:26px;
		        }
		        .in_commodity_item span{
			        display: block;
			        margin-bottom:1%;
		        }
		        .in_commodity_item ul{
			        background-color: #fff;
			        padding-left:59px;
			        padding-top: 32px;
			        padding-bottom: 10px;
		        }
		        .in_commodity_item ul li{
		        	margin-bottom: 24px;
		        }
		        .in_commodity_item ul li a{
			        display: block;
			        color:#000;
			        position: relative;
		        }
		        .in_commodity_item ul li a:before{
			        content:"";
			        display: inline-block;
			        width: 85px;
			        height: 85px;
			        background-repeat:no-repeat;
			        background-image: url(../images/icon.png);
			        /* background-size:cover;
			        background-image: url(http://cdn2.ettoday.net/images/834/d834026.jpg); */
			        vertical-align:middle;
			        margin-right: 25%;
		        }
		        /*--- 雪碧 start ---*/
		        .in_commodity_item ul li:nth-of-type(1) a:before{background-image:url("/Public/Customer/images/project (11).png");}
		        .in_commodity_item ul li:nth-of-type(2) a:before{background-image:url("/Public/Customer/images/project (22).png");}
		        .in_commodity_item ul li:nth-of-type(3) a:before{background-image:url("/Public/Customer/images/project (33).png");}
		        .in_commodity_item ul li:nth-of-type(4) a:before{background-image:url("/Public/Customer/images/project (88).png");}
		        .in_commodity_item ul li:nth-of-type(5) a:before{background-image:url("/Public/Customer/images/project (55).png");}
		        /*.in_commodity_item ul li:nth-of-type(6) a:before{background-image:url("/Public/Customer/images/project (66).png");}*/
		        .in_commodity_item ul li:nth-of-type(6) a:before{background-image:url("/Public/Customer/images/project (77).png");}
		        /*--- 雪碧 end ---*/
		        .in_commodity_item ul li a.active:after{
			        content:"";
			        display: block;
			        border:25px solid #fff;
			        border-right-color:transparent;
			        border-bottom-color:transparent;
			        transform:rotate(-45deg);
			        position: absolute;
			        top: 20%;
			        left: -25%;
			        cursor:default;
		        }
				/*4.--- 首頁 的 商品項目 的 選單 end ---*/
		    /*3.--- 首頁 的 商品項目 end ---*/
		    /*3.--- 首頁 的 服務流程 start ---*/
			.in_service{
			  	width: 100%;
			  	margin: 5% 0;
			}
			.in_service h3{
			  	font-size:26px;
			  	font-weight:600;
			  	letter-spacing:3px;
			  	margin-bottom:12px;
			}
			.in_service h3 span{
			  	font-size:24px;
			  	letter-spacing:2px;
			  	font-weight: bold;
			}
			    /*4.--- 服務流程內容 start ---*/
			    .in_service_content{
			      	overflow: hidden;
			      	background-color: #fff;
			    }
			    .in_service_content .img_box{/*服務流程頁面變大要改*/
			      	width:275px;
			      	height: 365px;
			      	float: left;
			    }
			    .in_service_content .img_box img{width: 100%;}
			    /*4.--- 服務流程內容 end ---*/
			    /*4.--- 服務流程上方 start ---*/
			    .in_service_process{
			      	width: 100%;
			      	padding: 4% 1% 0 0%;
			      	letter-spacing:4px;
				}
				#in_ser_t_service{
					padding-top:0px;
					position:relative;
					top: 0;
					left: 0;
				}
			      	.in_service_process .in_ser_t{
				        padding-top:15px;
				        position:relative;
				        top: 0;
				        left: 0;
					  }
			      	.in_service_process .in_ser_t .ser_move{
				        border:15px solid #2e6b58;
				        border-left-color:transparent;
				        border-right-color:transparent;
				        border-bottom-color:transparent;
				        position:absolute;
				        top: -10px;
				        left:63px;
			      	}
			      	.in_service_process .in_ser_t > ul{
				        margin-bottom:50px;
				        color:#7f7f7f;
				        font-weight:bolder;
				        text-align: center;
						cursor: default;
						text-align: left;
						display: -webkit-inline-box;
						margin-left: 6%;
			      	}
			      	.in_service_process .in_ser_t > ul li{
			      		display: inline-block;
			      	}
			      	.in_service_process .in_ser_t > ul li a{
			        	color:#000;
			      	}
			    /*4.--- 服務流程上方 end ---*/
			    /*4.--- 服務流程下方 start ---*/
			    .in_service_process .in_ser_b{
			    	margin-left: 20%;
			      	height: 190px; /*服務流程頁面變大要改*/
			      	position: relative;
			    }
			    .in_service_process .in_ser_b > div{
			    	position: absolute;
			    	width: 100%;
			    }
			    .in_service_process .in_ser_b > div > ul > li.dots_drop:before{transform:rotate(180deg);margin:0 2% 0 1%;}
			    .in_service_process .in_ser_b > div > ul > li.dots_drop:after{display: none;}
			    .in_service_process .in_ser_b .advisory{}
			    .in_service_process .in_ser_b .measure{}
			    .in_service_process .in_ser_b .signed{}
			    .in_service_process .in_ser_b .making{}
			    .in_service_process .in_ser_b .construction{}
			    .in_service_process .in_ser_b .acceptance{}
			    .in_service_process .in_ser_b .aftermarket{}
			      	/*ul li們*/
			      	.in_service_process .in_ser_b ul{}
			      	.in_service_process .in_ser_b ul li{
			        	padding-left: 20px;
					    line-height: 30px;
					    margin-bottom: 20px;
			      	}
			    /*4.--- 服務流程下方 end ---*/
			/*3.--- 首頁 的 服務流程 end ---*/
		/*2.--- index首頁內容 end ---*/
		

		/*2.--- about關於展羽 start ---*/
		.about{}
		.about .container{padding-top: 90px;}
			/*3.--- 關於展羽 左邊 start ---*/
			.about_l{
				float: left;
				padding-top: 60px;
			}
			.about_l .img_box{
				width: 330px;
    			height: 504px;
			}
			.about_l .img_box img{}
			/*3.--- 關於展羽 左邊 end ---*/
			/*3.--- 關於展羽 右邊 start ---*/
			.about .about_r {padding-left: 22%;}
				/*4.--- 關於展羽 標體 start ---*/
				.about .about_r .subject{padding-bottom: 60px;}
				.about .about_r .subject h2{}
				.about .about_r .subject .crumbs{}
				.about .about_r .subject .crumbs ul{}
				.about .about_r .subject .crumbs ul li{}
				.about .about_r .subject .crumbs ul li a{}
				.about .about_r .subject .crumbs ul li a span{}
				/*4.--- 關於展羽 標體 end ---*/
				/*4.--- 關於展羽 內容 start ---*/
				.about_r .about_content{
				    width: 1130px;
				    height: 504px;
				    background-color: #fff;
				    padding: 5%;
					margin-bottom: 140px;
				}
				.about_r .about_content .texthtml{
					height: calc(504px - 20%);
				}
				/*4.--- 關於展羽 內容 end ---*/
			/*3.--- 關於展羽 右邊 end ---*/
		/*2.--- about關於展羽 end ---*/

		/*2.--- service服務流程 start ---*/
		.service_process .container{padding: 90px 0;}
		.service.in_service{width: 1460px;margin: 0;}
		.service.in_service h3{
			display: inline-block;
		  	font-size:35px;
		  	text-indent: 23%;
		}
		.service.in_service .crumbs{margin-right: 1%;}
		    /*3.--- 服務流程內容 start ---*/
		    .service .in_service_content{
		    	overflow:visible;
		    	background-color: transparent;
		    }
		    .service .in_service_content .img_box{
		      	width:330px;
		      	height: 503px;
		    }
		    /*3.--- 服務流程內容 end ---*/
		    /*3.--- 服務流程上方 start ---*/
		    .service .in_service_process{
			    margin-left: 22.55%;
			    padding: 4% 4% 0 2%;
			    height: 503px;
			    width: 77%;
			    background-color: #fff;
		    }
		      	.service .in_service_process .in_ser_t{}
		      	.service .in_service_process .in_ser_t .ser_move{}
		      	.service .in_service_process .in_ser_t > ul{}
		      	.service .in_service_process .in_ser_t > ul li{}
		      	.service .in_service_process .in_ser_t > ul li a{}
		    /*3.--- 服務流程上方 end ---*/
		    /*3.--- 服務流程下方 start ---*/
		    .service .in_service_process .in_ser_b{
		      	height: 210px; /*服務流程頁面變大要改*/
		      	position: relative;
		      	margin-left: 3.3%;
		    }
		    .service .in_service_process .in_ser_b > div{}
		    .service .in_service_process .in_ser_b .advisory{}
		    .service .in_service_process .in_ser_b .measure{}
		    .service .in_service_process .in_ser_b .signed{}
		    .service .in_service_process .in_ser_b .making{}
		    .service .in_service_process .in_ser_b .construction{}
		    .service .in_service_process .in_ser_b .acceptance{}
		    .service .in_service_process .in_ser_b .aftermarket{}
		      	/*ul li們*/
		      	.service .in_service_process .in_ser_b ul{}
		      	.service .in_service_process .in_ser_b ul li{
		        	margin-bottom:30px;
		      	}
		    /*3.--- 服務流程下方 end ---*/
		/*2.--- service服務流程 end ---*/
		
		/*2.--- commodity商品項目 && commodity商品內容 start ---*/
		.commodity{}
		.commodity .container{overflow: hidden;}
			/*3.--- 商品項目 標體 start ---*/
			.commodity .subject{
				padding-top: 55px;
			    padding-bottom: 15px;
			    padding-left: 18%;
			    width: 90%;
			    margin: 0 auto;
			}
			.commodity .subject h2{}
			.commodity .subject .crumbs{
				width: 75%;
    			text-align: right;
			}
			.commodity .subject .crumbs ul{}
			.commodity .subject .crumbs ul li{}
			.commodity .subject .crumbs ul li a{}
			.commodity .subject .crumbs ul li a span{}
			.commodity .subject .crumbs.com_tent{
				text-align: left;
    			width: 96%;
			}
			/*3.--- 商品項目 標體 end ---*/
				/*4.--- 商品 start ---*/
				.goods{}
					/*5.--- 主菜單 start ---*/
					.goods .goods_menu{
						width: 260px;
						margin-left: 1%;
					}
					.goods .goods_menu ul {
						background-image: url(../images/commodity_icon_6.png);
    					background-repeat: no-repeat;
    					padding-left: 10px;
					}
					.goods .goods_menu ul li{}
					.goods .goods_menu ul li a{opacity: .6;}
					.goods .goods_menu ul li a:before{
						margin-right: 8%;
    					margin-left: 15%;
					}
					.goods .goods_menu ul li a.active,
					.goods .goods_menu ul li a:hover{opacity: 1;}
					/*--- 雪碧 start ---*/
					.goods .goods_menu ul li:nth-of-type(1) a:before{background-image:url("/Public/Customer/images/project_r (11).png")}
					.goods .goods_menu ul li:nth-of-type(2) a:before{background-image:url("/Public/Customer/images/project_r (22).png")}
					.goods .goods_menu ul li:nth-of-type(3) a:before{background-image:url("/Public/Customer/images/project_r (33).png")}
					.goods .goods_menu ul li:nth-of-type(4) a:before{background-image:url("/Public/Customer/images/project_r (88).png")}
					.goods .goods_menu ul li:nth-of-type(5) a:before{background-image:url("/Public/Customer/images/project_r (55).png")}
					/*.goods .goods_menu ul li:nth-of-type(6) a:before{background-image:url("/Public/Customer/images/project_r (66).png")}*/
					.goods .goods_menu ul li:nth-of-type(6) a:before{background-image:url("/Public/Customer/images/project_r (77).png")}
					.goods .goods_menu ul li a:after{
						transform: rotate(135deg);
					    left: auto;
					    right: -4%;
					}
					/*--- 雪碧 end ---*/
					/*5.--- 主菜單 end ---*/
					/*5.--- 商品右側版面 start ---*/
					.goods_right{
						width: 92%;
    					padding-left: 22%;
					}
					.goods_right > div{margin-bottom: 3%;}
						/*6.--- 手機版主菜單 start ---*/
						.rwd_goods_menu{display: none;}
						.rwd_goods_control{
						  	width: 90%;
						  	height: 50px;
						  	margin: 2.5% auto;
						  	border:1px solid #999;
						  	cursor:pointer;
							font-size: 20px;
						  	box-shadow:0px 0px 0px transparent;
						  	transition:box-shadow .3s ease-in-out;
						  	position: relative;
						  	top: 0;
						  	left: 0;
						}
						.rwd_goods_control:hover{
						  	transition:box-shadow .3s ease-in-out;
						  	box-shadow: 10px 10px 0 #fff;
						}
						.rwd_goods_control h2{
							font-size: 20px;
						  	text-indent:50px;
						  	line-height:50px;
						  	float: none;
						}
						.rwd_goods_control h2:before{
						  	content:"";
						  	display: block;
						  	width: 15px;
						  	height: 15px;
						  	transform:rotate(45deg);
						  	border:5px solid #000;
						  	border-left-color:transparent;
						  	border-top-color:transparent;
						  	position: absolute;
						  	top: 25%;
						  	right: 5%;
						}
						.rwd_goods_menu_nav{display: none;}
						.rwd_goods_menu_nav ul{
						  	width: 90%;
						  	margin: 0 auto;
						  	text-align:center;
						  	position: relative;
						}
						.rwd_goods_menu_nav ul li{
						  	border:1px solid #999;
						}
						.rwd_goods_menu_nav ul li:hover{
						  	background-color: #fff;
						}
						.rwd_goods_menu_nav ul li a{
						  	display: block;
						  	width: 100%;
						  	height: 100%;
						  	padding:15px 0;
						}
						/*6.--- 手機版主菜單 end ---*/
						/*6.--- 次菜單 start ---*/
						.big_type_menu{}
						.big_type_menu ul{
							background-color: #fff;
						    /*padding-right: 16%;*/
						    padding-top: 4%;
						    padding-left: 5%;
						    overflow: hidden;
						    letter-spacing: 2px;
						    display: flex;
    						flex-wrap: wrap;
						}
						.big_type_menu ul li{
							float: left;
						    margin-right: 4%;
						    margin-bottom: 4%;
						    width: 150px;
						    text-align: center;
						}
						.big_type_menu ul li a{display: block;}
						/*.big_type_menu ul li a:before{content: " - ";}*/
						.big_type_menu ul li a.active,
						.big_type_menu ul li a:hover{
						    background-image: url(../images/bottom_line.png);
						    background-position: 0 99%;
						    background-repeat: no-repeat;
						}
						/*6.--- 次菜單 end ---*/
						/*6.--- 系列菜單 start ---*/
						.small_type_menu{}
						.small_type_menu ul{
							overflow: hidden;
    						letter-spacing: 2px;
						}
						.small_type_menu ul li{
							float: left;
							width: 20%;
						    min-width: 175px;
						    margin: 0 auto;
						    text-align: center;
						    border: 1px solid transparent;
						}
						.small_type_menu ul li a{
							display: block;
						    padding: 10px;
						    background-color: #939393;
						    color: #fff;
						}
						
						.small_type_menu ul li a.active,
						.small_type_menu ul li a.active:before,
						.small_type_menu ul li a.active:after{
							content: " - ";
							background-color: #333333;
						}
						/*6.--- 系列菜單 end ---*/
						/*6.--- 商品菜單 start ---*/
						.any_type_menu{background-color: #fff;}
						.any_type_menu ul{
							overflow: hidden;
    						padding-top: 2%;
						}
						.any_type_menu ul li{
							width: 25%;
						    float: left;
						    text-align: center;
						    letter-spacing: 2px;
						    margin: 5% 0;
						}
						.any_type_menu ul li a{display: block;}
						.any_type_menu ul li a .img_box{
							width: 100%;
    						height: 227px;
    						margin: 0 auto;
						}
						.any_type_menu ul li a .img_box img{}
						.any_type_menu ul li a p{
							border-bottom: 1px solid transparent;
						    width: 60%;
						    margin: 2% auto;
						}
						.any_type_menu ul li a p:nth-of-type(2){width: 70%;}
						.any_type_menu ul li a:hover p{border-bottom-color:#cdcdcd;}
						.any_type_menu ul li a .num{}
						.any_type_menu ul li a .num span{}
						.any_type_menu .page_counter{padding: 4% 0px 10% 0px;}
						.any_type_menu >:last-child{margin-bottom:6%;}
						/*6.--- 商品菜單 end ---*/
						/*6.--- 商品內容 start ---*/
						.goods_right .goods_content{margin-bottom: 12%;}
						.goods_content{
							background-color: #fff;
    						padding: 5%;
						}
						.goods_content {}
						.goods_content h3{
							font-size: 18px;
							letter-spacing: 4px;
							margin-bottom: 15px;
						}
							/*7.--- 商品內容 資訊 start ---*/
							.goods_content_item{margin-bottom: 50px;}
								/*8.--- 商品內容圖片 start ---*/
								.goods_content_item_img{
									float: left;
    								width: 45%;
								}
									/*--- BIG ---*/
									.goods_content_item_img .goods_content_item_b_img{
										width: 96%;
									    height: 460px;
									    padding-top: 10%;
									    border: 1px solid #999;
									    margin-bottom: 20px;
									}
									.goods_content_item_img .goods_content_item_b_img .img_box{
										width: 100%;
									    height: 360px;
									    margin: 0 auto;
									}
									.goods_content_item_img .goods_content_item_b_img .img_box img{}
									/*--- SMALL ---*/
									.goods_content_item_img .goods_content_item_s_img{}
									.goods_content_item_img .goods_content_item_s_img .img_box{
										width: 23%;
									    height: 110px;
									    border: 1px solid #999;
									    float: left;
									    margin-right: 7px;
									    margin-bottom: 7px;
									    cursor: pointer;
									}
									.goods_content_item_img .goods_content_item_s_img .img_box img{height: 85%;}
								/*8.--- 商品內容圖片 end ---*/
								/*8.--- 商品內容簡介 start ---*/
								.goods_content_item_ex{
									width: 50%;
    								margin-left: 48%;
								}
									.goods_content_item_ex h4{
										font-size: 18px;
									    font-weight: bold;
									    margin-bottom: 10px;
									    line-height: 25px;
									}
									.goods_content_item_ex h4 p{font-weight: bold;}
									.goods_content_item_ex .num{margin-bottom: 35px;}
									.goods_content_item_ex .num span{}
									.goods_content_item_ex > .texthtml{
									    height: 340px;
									    max-height: 340px;
									    margin-bottom: 20px;
									}
									.goods_content_item_ex .inquiry{padding-left: 45%;}
									.goods_content_item_ex .inquiry a{
										display: block;
									    width: 240px;
									    height: 60px;
									    font-size: 18px;
									    font-weight: bold;
									    line-height: 60px;
									    letter-spacing: 6px;
									    position: relative;
									    top: 0;
									    left: 0;
									}
									.goods_content_item_ex .inquiry a:before{
										content: "";
										display: block;
									    width: 36px;
									    height: 36px;
									    position: absolute;
									    top: 10px;
									    background-image: url(../images/icon.png);
									    background-repeat: no-repeat;
									}
									.goods_content_item_ex .inquiry a:first-child{
										background-color: #d6c47b;
									    border-radius: 12px;
									    text-indent: 100px;
									}
									.goods_content_item_ex .inquiry a:first-child:before{
										background-position: 0 -560px;
    									left: 25px;
									}
									.goods_content_item_ex .inquiry a:last-child{
										border-bottom: 1px dashed #d6c47b;
									    text-indent: 55px;
									    letter-spacing: 5px;
									}
									.goods_content_item_ex .inquiry a:last-child:before{
										background-position: 0 -594px;
    									left: 10px;
									}
								/*8.--- 商品內容簡介 end ---*/
							/*7.--- 商品內容 資訊 end ---*/
							/*7.--- 商品內容 詳細內容 start ---*/
							.goods_content_detailed{padding: 5%;}
							.goods_content_detailed h3{}
							.goods_content_detailed .texthtml{margin-bottom: 90px;}
							/*7.--- 商品內容 詳細內容 end ---*/
							/*7.--- 商品內容 感興趣 start  ---*/
							.goods_content_interest{margin-bottom: 80px;}
							.goods_content_interest h3{}
							.goods_content_interest ul{}
							.goods_content_interest ul li{
								float: left;
								width: 20%;
							}
							.goods_content_interest ul li a{
								display: block;
							    width: 100%;
							    height: 290px;
							    text-align: center;
							    font-size: 14px;
							    margin: 20px 0;
							}
							.goods_content_interest ul li a .img_box{
								width: 100%;
							    height: 140px;
							    margin: 15px auto;
							}
							.goods_content_interest ul li a .img_box img{}
							.goods_content_interest ul li a p:first-child{}
							.goods_content_interest ul li a p:last-child{}
							.goods_content_interest ul li a .num{margin: 17px 0 30px 0;}
							.goods_content_interest ul li a .num span{width: 30%;}
							.goods_content_interest ul li a .view{margin-top:10px}
							.goods_content_interest ul li a .view.active,
							.goods_content_interest ul li a .view:hover{}
							/*7.--- 商品內容 感興趣 end  ---*/
							/*7.--- 商品內容 最近瀏覽 start ---*/
							.looking{margin-bottom: 100px;}
							.looking h3{}
							.looking ul{}
							.looking ul li{
								width: 10%;
							    float: left;
							    margin-right: 4%;
							    margin-left: 2%;
							}
							.looking ul li a{}
							.looking ul li a .img_box{
							    width: 100%;
								height: 110px;
							    margin: 25px 0;
							}
							.looking ul li a .img_box img{}
							.looking ul li a .view{}
							.looking ul li a .view.active,
							.looking ul li a .view:hover{}
							/*7.--- 商品內容 最近瀏覽 end ---*/
							/*7.--- 商品內容 回到列表 start ---*/
							.goods_content .page_list{}
							.goods_content .page_list a{}
							.goods_content .page_list .prev{}
							.goods_content .page_list .back{}
							.goods_content .page_list .next{}
							/*7.--- 商品內容 回到列表 end ---*/
						/*6.--- 商品內容 end ---*/
					/*5.--- 商品右側版面 end ---*/
				/*4.--- 商品 end ---*/
		/*2.--- commodity商品項目 && commodity商品內容 end ---*/
		
		/*2.--- case_performance 工程實績 start ---*/
		.case_performance{}
		.case_performance .container{overflow: hidden;}
			/*3.--- 工程實績 標體 start ---*/
			.case_performance .subject{
				padding-top: 55px;
			    padding-bottom: 15px;
			    padding-left: 17%;
			    width: 91%;
			    margin: 0 auto;
			}
			.case_performance .subject ul {}
			.case_performance .subject ul li{}
			.case_performance .subject ul li a{}
			.case_performance .subject ul li a span{}
			/*3.--- 工程實績 標體 end ---*/
			/*3.--- 工程實績 內容 start ---*/
			.case_performance_content{}
				/*4.--- 工程實績 主菜單 start ---*/
				.case_performance_content_menu{
					width: 16%;
    				margin-left: 2%;
				}
				.case_performance_content_menu ul{
					background-repeat: no-repeat;
				    background-image: url(../images/commodity_icon_6.png);
				    padding-top: 10px;
				    padding-left: 65px;
				}
				.case_performance_content_menu ul li{
					margin-bottom: 90px;
    				margin-top: 40px;
				}
				.case_performance_content_menu ul li:last-child{
					margin-top: 0;
    				margin-bottom: 40px;
				}
				.case_performance_content_menu ul li a{}
				.case_performance_content_menu ul li a.active{font-weight:bold;}
				.case_performance_content_menu ul li:nth-of-type(1) a:before,
				.case_performance_content_menu ul li:nth-of-type(2) a:before{
					background-position: 0px -630px;
				    width: 15px;
				    height: 15px;
				    margin-right: 10%;
				    margin-top: -5px;
				    opacity: 0;
				}
				.case_performance_content_menu ul li a.active:before{opacity:1;}
				.case_performance_content_menu ul li a.active:after{
					left: auto;
				    right: -5%;
				    top: -50%;
				    transform: rotate(135deg);
				}
				/*4.--- 工程實績 主菜單 end ---*/
				/*4.--- 工程實績 右側內容 start ---*/
				.case_performance_content_right{
					width: 93%;
    				padding-left: 21%;
				}
				.case_performance_content_right h3{
					font-size: 26px;
				    font-weight: bold;
				    letter-spacing: 5px;
				    margin-bottom: 5%;
				}
					/*5.--- 系列菜單 start ---*/
					.case_performance_content_right .small_type_menu{}
					.case_performance_content_right .small_type_menu ul{}
					.case_performance_content_right .small_type_menu ul li{
						
					}
					.case_performance_content_right .small_type_menu ul li a{}
					.case_performance_content_right .small_type_menu ul li a:before,
					.case_performance_content_right .small_type_menu ul li a:after{content:"";}
					/*5.--- 系列菜單 end ---*/
					/*5.--- 工程實績 圖片 start ---*/
					.case_performance_content_right .case_performance_img{
						padding: 5%;
    					background-color: #fff;
    					margin: 1% 0 5% 0;
					}
					.case_performance_content_right .case_performance_img .img_box{
						width: 49%;
					    height: 350px;
					    float: left;
					    margin-right: 1%;
					    margin-bottom: 1%;
					}
					.case_performance_content_right .case_performance_img .img_box img{}
						/*6.--- 頁碼 start ---*/
						.case_performance_content_right .page_counter{
							clear: both;
    						padding-top: 3%;
						}
						.case_performance_content_right .page_counter a{}
						/*6.--- 頁碼 end ---*/
					/*5.--- 工程實績 圖片 end ---*/
				/*4.--- 工程實績 右側內容 end ---*/
			/*3.--- 工程實績 內容 end ---*/
		/*2.--- case_performance 工程實績 end ---*/

		/*2.--- case 案例分享 (使用case_performance CSS) start ---*/
		.case{}
		.case .container{}
			/*3.--- 案例分享 內容 start ---*/
			.case_content{}
				/*4.--- 主菜單 start ---*/
				.case_content_menu{}
				.case_content_menu ul{}
				.case_content_menu ul li{}
				.case_content_menu ul li a{}
				/*4.--- 主菜單 end ---*/
				/*4.--- 案例分享 右側內容 start ---*/
				.case_content_right{}
					/*5.--- 案列分享 列表 start ---*/
					.case_content_right ul{
						background-color: #fff;
    					padding: 3%;
    					margin-bottom: 12%;
					}
					.case_content_right ul li{
						overflow: hidden;
					    padding: 2%;
					    letter-spacing: 5px;
					}
					.case_content_right ul li:hover{background-color: #eaeaea;}
					.case_content_right ul li .img_box{
						width: 276px;
					    height: 207px;
					    float: left;
					}
					.case_content_right ul li .img_box img{}
					.case_content_right ul li h4{
						margin-left: 30%;
					    margin-bottom: 4%;
					    font-size: 18px;
					    font-weight: bold;
					}
					.case_content_right ul li h4 p{font-weight: bold;}
					.case_content_right ul li h4 span{
						font-size: 14px;
					    margin-left: 38%;
					    letter-spacing: 3px;
					}
					.case_content_right ul li .texthtml{
						margin-left: 30%;
					    line-height: 23px;
					    text-align: justify;
					    width: 70%;
    					/*height: 90px;*/
					}
					/*5.--- 案列分享 列表 end ---*/
				/*4.--- 案例分享 右側內容 end ---*/
			/*3.--- 案例分享 內容 end ---*/
		/*2.--- case 案例分享 end ---*/

		/*2.--- case_inset 案例分享內頁面內頁面 (使用case_performance CSS) start ---*/
		.case_inset{}
		.case_inset .container{}
			/*3.--- 案例分享內頁面 內容 start ---*/
			.case_inset_content{}
				/*4.--- 主菜單 start ---*/
				.case_inset_content_menu{}
				.case_inset_content_menu ul{}
				.case_inset_content_menu ul li{}
				.case_inset_content_menu ul li a{}
				/*4.--- 主菜單 end ---*/
				/*4.--- 案例分享內頁面 右側內容 start ---*/
				.case_inset_content_right{}
					/*5.--- 案列分享 列表 start ---*/
					.case_info{
						background-color: #fff;
					    padding: 4%;
					    margin-bottom: 10%;
					    letter-spacing: 2px;
					}
					.case_info h4{
						font-size: 26px;
    					font-weight: bold;
					}
					.case_info > p{
						font-size: 14px;
						margin: 3% 0;
					}
					.case_info .case_info_img{}
					.case_info .case_info_img .img_box{
						width: 100%;
					    height: 350px;
					    margin: 0 auto 10px 0;
					}
					.case_info_img_before{margin-right: 2%;}
					.case_info_img_before,
					.case_info_img_after{
						width: 47%;
    					float: left;
    					margin-bottom: 5%;
    					text-align: center;
					}
					.case_info .case_info_img .img_box img{}
					.case_info .texthtml{
						width: 100%;
					    height: auto;
					    text-align: justify;
					    font-size: 18px;
					}
					/*5.--- 案列分享 列表 end ---*/
				/*4.--- 案例分享內頁面 右側內容 end ---*/
			/*3.--- 案例分享內頁面 內容 end ---*/
		/*2.--- case_inset 案例分享內頁面 end ---*/
		
		/*2.--- qa常見問題 start ---*/
		.qa{}
		.qa .container{padding-top: 90px;}
			/*3.--- 常見問題 左邊 start ---*/
			.qa_l{
				float: left;
				padding-top: 60px;
			}
			.qa_l .img_box{
				width: 330px;
    			height: 504px;
			}
			.qa_l .img_box img{}
			/*3.--- 常見問題 左邊 end ---*/
			/*3.--- 常見問題 右邊 start ---*/
			.qa .qa_r {padding-left: 22%;}
				/*4.--- 常見問題 標體 start ---*/
				.qa .qa_r .subject{padding-bottom: 60px;}
				.qa .qa_r .subject h2{}
				.qa .qa_r .subject .crumbs{}
				.qa .qa_r .subject .crumbs ul{}
				.qa .qa_r .subject .crumbs ul li{}
				.qa .qa_r .subject .crumbs ul li a{}
				.qa .qa_r .subject .crumbs ul li a span{}
				/*4.--- 常見問題 標體 end ---*/
				/*4.--- 常見問題 內容 start ---*/
				.qa_r .qa_content{
				    width: 1130px;
				    background-color: #fff;
				    padding: 5%;
					margin-bottom: 140px;
				}
					/*5.--- 常見問題 問答 start ---*/
					.qa_list{
						font-size: 18px;
					    line-height: 36px;
					    width: 98%;
					    margin-bottom: 8%;
					    letter-spacing: 5px;
    					text-align: justify;
					}
					.qa_list li{margin-bottom: 2%;}
					.qa_list li h4{font-size:20px;}
					.qa_list li .texthtml{max-width: 100%;}
					/*5.--- 常見問題 問答 end ---*/
				/*4.--- 常見問題 內容 end ---*/
			/*3.--- 常見問題 右邊 end ---*/
		/*2.--- contact常見問題 end ---*/

		/*2.--- contact聯絡我們 start ---*/
		.contact{}
		.contact .container{padding-top: 90px;}
			/*3.--- 聯絡我們 左邊 start ---*/
			.contact_l{
				float: left;
				padding-top: 60px;
			}
			.contact_l .img_box{
				width: 330px;
    			height: 504px;
			}
			.contact_l .img_box img{}
			/*3.--- 聯絡我們 左邊 end ---*/
			/*3.--- 聯絡我們 右邊 start ---*/
			.contact .contact_r {padding-left: 22%;}
				/*4.--- 聯絡我們 標體 start ---*/
				.contact .contact_r .subject{padding-bottom: 60px;}
				.contact .contact_r .subject h2{}
				.contact .contact_r .subject .crumbs{}
				.contact .contact_r .subject .crumbs ul{}
				.contact .contact_r .subject .crumbs ul li{}
				.contact .contact_r .subject .crumbs ul li a{}
				.contact .contact_r .subject .crumbs ul li a span{}
				/*4.--- 聯絡我們 標體 end ---*/
				/*4.--- 聯絡我們 內容 start ---*/
				.contact_r .contact_content{
				    width: 1130px;
				    background-color: #fff;
				    padding: 5%;
					margin-bottom: 140px;
				}
					/*5.--- 表單 start ---*/
					.contact_content_info{}
					.contact_content_info fieldest{
						display: block;
					    margin-bottom: 2%;
					    letter-spacing: 5px;
					}
					.contact_content_info fieldest > span{
						margin-right: 2%;
    					vertical-align: top;
					}
					.contact_content_info legend{}
					.contact_content_info label{
						font-size: 18px;
					    margin-right: 2%;
					    vertical-align: top;
					}
					.contact_content_info input:not(.noin){
						width: 295px;
					    height: 40px;
					    border: none;
					    border: 1px solid #e6e6e6;
					    font-size: 18px;
					}
						/*6.--- 姓名 start ---*/
						.contact_content_info .name{}
						.contact_content_info .name legend{}
						.contact_content_info .name label{}
						.contact_content_info .name input{}
						/*6.--- 姓名 end ---*/
						/*6.--- 電話 start ---*/
						.contact_content_info .tel{}
						.contact_content_info .tel legend{}
						.contact_content_info .tel label{}
						.contact_content_info .tel input{}
						/*6.--- 電話 end ---*/
						/*6.--- 傳真 start ---*/
						.contact_content_info .fax{}
						.contact_content_info .fax legend{}
						.contact_content_info .fax label{}
						.contact_content_info .fax input{}
						/*6.--- 傳真 end ---*/
						/*6.--- 地址 start ---*/
						.contact_content_info .add{}
						.contact_content_info .add legend{}
						.contact_content_info .add label{}
						.contact_content_info .add input{}
						/*6.--- 地址 end ---*/
						/*6.--- 信箱 start ---*/
						.contact_content_info .e_mail{}
						.contact_content_info .e_mail legend{}
						.contact_content_info .e_mail label{}
						.contact_content_info .e_mail input{}
						/*6.--- 信箱 end ---*/
						/*6.--- 信件主旨 start ---*/
						.contact_content_info .why{}
						.contact_content_info .why legend{}
						.contact_content_info .why label{margin-right: 1%;}
						.contact_content_info .why select{
							width: 235px;
						    height: 40px;
						    text-align: center;
						    font-size: 18px;
						    letter-spacing: 4px;
						    padding-left: 5px;
						}
						.contact_content_info .why option{}
						.contact_content_info .why option:checked{background-color: #dadada;}
						.contact_content_info .why option:not(:checked){background-color: #fff;}
						/*6.--- 信件主旨 end ---*/
						/*6.--- 內容 start ---*/
						.contact_content_info .talk{}
						.contact_content_info .talk legend{}
						.contact_content_info .talk label{margin-right: 0;}
						.contact_content_info .talk > span{margin-right: 77px;}
						.contact_content_info .talk textarea{
							min-width: 60%;
						    height: 210px;
						    max-width: 80%;
						    font-size: 18px;
						}
						/*6.--- 內容 end ---*/
						/*6.--- 內容 start ---*/
						.contact_content_info .button{
							width: 70%;
    						margin: 0 auto;
						}
						.contact_content_info .button legend{}
						.contact_content_info .button .ver_code{}
						.contact_content_info .button .ver_code input{
							width: 115px;
						    height: 25px;
						    vertical-align: top;
						}
						.contact_content_info .button .ver_code .img_box{
							width: 50px;
						    height: 22px;
							display: inline-block;
							cursor: pointer;
						}
						.contact_content_info .button .ver_code .img_box img{}
						.contact_content_info .button .butt{text-align: right;}
						.contact_content_info .button .butt label{}
						.contact_content_info .button .butt input{
							font-size: 18px;
						    font-weight: bold;
						    background: none;
						    letter-spacing: 3px;
						    width: 70px;
						    height: 70px;
						    border-radius: 50%;
						    outline: 0;
						}
						/*6.--- 內容 end ---*/
					/*5.--- 表單 end ---*/
				/*4.--- 聯絡我們 內容 end ---*/
			/*3.--- 聯絡我們 右邊 end ---*/
		/*2.--- contact聯絡我們 end ---*/
		

	/*1.--- article內容 end ---*/

	/*1.--- footer頁尾 start ---*/
	footer{}
	footer .container{
		padding-top: 25px;
	    font-size: 14px;
	    font-family: "微軟正黑體";
	    letter-spacing: 3px;
	    padding-left: 5%;
	    margin-bottom: 3%;
	}
		/*2.--- 版權 start ---*/
		footer .logo{float: left;}
		footer .logo .img_box{
			width: 265px;
    		height: 53px;
    		margin-bottom: 13px;
		}
		footer .logo .img_box img{}
	
		/*2.--- 版權 end ---*/
		/*2.--- 店家資訊 start ---*/
		footer address{
			font-style: normal;
    		padding-top: 1%;
		}
		footer address .dotted:before{
			border-image: url(../images/icon_2.png) 0 0 1 0 repeat;
    		width: 100%;
    		left: 5%;
		}
		footer address .add{
			float: left;
    		margin-right: 3%;
		}
		footer address .add a{padding-bottom: 2%;}
		footer address .phone{
			float: left;
    		margin-right: 4%;
		}
		footer address .phone a{
			display: block;
		    width: 100%;
		    padding-bottom: 4%;
		    margin-bottom: 4%;
		}
		footer address .add span,
		footer address .phone span{
		    display: inline-block;
		    width: 11px;
		    height: 16px;
		    background-image: url(../images/icon.png);
		    background-repeat: no-repeat;
		    background-position: 0px -476px;
		    vertical-align: sub;
		}
		footer address .phone span{background-position: 0px -493px;}
		/*2.--- 店家資訊 end ---*/
		/*2.--- ICON start ---*/
		footer .icon{}
		footer .icon a{
			display: block;
		    width: 46px;
		    height: 46px;
		    float: left;
		    background-image: url(../images/icon.png);
		    background-position: 0 -430px;
		}
	
		/*2.--- ICON end ---*/
		/*2.--- 遜 start ---*/
		.photonic{
			/* width: 18%; */
		    height: 50px;
		    text-align: right;
		    display: inline-block;
		    vertical-align: top;
		    line-height: 50px;
		    font-size: 0.7em;
		    letter-spacing: 1px;
    		/* margin-left: 4%; */
		}
		.photonic a{
			color: #666666;
    		text-decoration: none;
		}
		/*2.--- 遜 end ---*/
	/*1.--- footer頁尾 end ---*/
/*0.--- desktop桌機 end ---*/

/*€.--- animate動畫區 start ---*/
/*1.--- 載入動畫loading start ---*/
		/*重複start*/
		.logogif,
		.gif_content{
			top: 0;
	        left: 0;
	        right: 0;
	        bottom: 0;
	        margin: auto;
		}
		.gif_content img{
			max-width: 100%;
			position: absolute;
		}
		.gif_content img:first-child,
		.gif_content img:nth-of-type(5),
		.gif_content img:nth-of-type(6),
		.gif_content img:nth-of-type(8){ /*由下往上*/
			width: 100%;
		    height: 0;
		    left: 0;
		    right: 0;
		    bottom: 0;
		}
		.gif_content img:nth-of-type(4), /*由右至左*/
		.gif_content img:nth-of-type(7){
			width: 0%;
		    height: 100%;
		    right: 0;
		    bottom: 0;
		}
		.gif_content img:nth-of-type(2), /*由左至右 預設值*/
		.gif_content img:nth-of-type(9){
			width: 0%;
		    height: 100%;
		}
		/*重複end*/
	    .logogif {
	        width: 100%;
	        height: 100%;
	        background-image: url(../images/bg_1.jpg);
	        position: fixed;
	        z-index: 9999;
	        animation: ZOut .5s 4s linear forwards;
	    }
		.logogif.nogif{
			opacity: 0;
			z-index: -99;
		}
		    .gif_content {
		        width: 88px;
		        height: 82px;
		        position: absolute;
		    	animation: shine .5s 3s linear forwards;
		    }

		    .gif_content img {
		    	transform: none;
		    	top: auto;
		    	left: auto;
		        margin: auto;
		        opacity:0;
		    }
		    .gif_content img:first-child{animation: height_Op .5s linear forwards;}
		    .gif_content img:nth-of-type(2){animation: width_Op .5s .3s linear forwards;}
		    .gif_content img:nth-of-type(3){
		    	width: 100%;
		        height: 0;
		    	animation: height_Op .5s .4s linear forwards;
		    }
		    .gif_content img:nth-of-type(4){
		    	animation: width_Op .5s .75s linear forwards,
		    			   rolling .5s .75s linear forwards;
		    }
		    .gif_content img:nth-of-type(5){
		    	animation: height_Op .5s 1.25s linear forwards,
		    			   rolling .5s 1.25s linear forwards;
		    }
		    .gif_content img:nth-of-type(6){
		    	animation: height_Op .5s 1.35s linear forwards,
		    			   rolling .5s 1.35s linear forwards;
		    }
		    .gif_content img:nth-of-type(7){
		    	animation: width_Op .5s 1.75s linear forwards,
		    			   rolling .5s 1.75s linear forwards;
		    }
		    .gif_content img:nth-of-type(8){animation: height_Op .5s 2s linear forwards;}
		    .gif_content img:nth-of-type(9){
		    	animation: width_Op .5s 2.2s linear forwards,
		    			   rolling .5s 2.3s linear forwards,
		    			   rolling .5s 2.5s linear forwards;
		    }
    @keyframes height_Op {
        0% {height: 0%;opacity:0;}
        100% {height: 100%;opacity:1;}
    }
	@keyframes width_Op{
		0%{width: 0%;opacity:0;}
		100%{width:100%;opacity:1;}
	}
	@keyframes rolling{
		0%{transform:rotate(0deg);}
		100%{transform:rotate(360deg);}
	}
	@keyframes shine{
		0%{opacity:1;}
		50%{opacity:0;}
		100%{opacity:1;}
	}
	@keyframes ZOut{
		0%{opacity:1;z-index:99;}
		100%{opacity:0;z-index:-99;}
	}
	/*1.--- 載入動畫loading end ---*/
/*€.--- animate動畫區 end ---*/

.copy{display: flex;flex-wrap: wrap;justify-content: center;}
.line-ID a{position: relative;padding-left: 50px;line-height: 46px;text-align: left;}
.line-ID a::before {
	content: '';
	background-image: url(../images/icon.png);
	background-position: 0px -430px;
	width: 46px;height: 46px;
	position: absolute;
	left: 0;
	top: -13px;}
.copy .logo {
	flex: 0 0 350px;margin-bottom: 1.5rem;
}
.copy .photonic {
	flex: 0 0 252px;
}
.copy .copy-content {
	justify-content: center;
	flex:0 0 100%;
	text-align: center;
	margin-bottom: 2rem;
}
.copy .copy-content .item {
	margin-bottom: 8px;
}
.copy .copy-content .item svg {
	width: 18px;
	height: 18px;
	fill: #a78500;
}
@media screen and (min-width:1280px) {
	.copy {
		justify-content: space-between;
	}

	
	.copy .copy-content{
		flex:0 0 calc(100% - 350px - 252px);
		display: flex;flex-wrap: wrap;
		justify-content: flex-start;
		text-align: left;
	}
	.copy .copy-content .item{margin: 5px;flex:0 0 48%;}

	
}