@charset "utf-8";

body , .wrapper{ color:#333; background:#fff;}


/*a 鏈結字*/
a { color:#333;}
a:hover, a:focus { color:#e27b2a; text-decoration:none; }


/*圖片*/
.pic img{ width:100%; height:auto;}
.maxpic img{ max-width:100%; height:auto;}


/*方形圖設定*/
.item-thumb-frame { position: relative; display: block; width: 100%; overflow: hidden; }
.item-thumb { display: block; max-width: 100%; padding-bottom: 100%; }

.flex-container{ display: flex; flex-wrap:wrap; align-items:center; }


/*====================================================================*/

 
/*page 分頁*/
.page{
	margin:45px 0;
	font-size:0.75rem;
	text-align:center;
	color:#666;
}
.page a , .page span{
	display:inline-block;
	border: 1px solid #173173;
	padding: 6px 6px;
	margin:0 3px;
	font-size:0.8rem;
	line-height:1.1;
	min-width:30px;
	
	-ms-border-radius:2px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	-o-bborder-radius:2px;
	border-radius:2px;
}
.page span{ 
	background:#e27b2a;
	color:#fff; 
	border-color:#e27b2a;
}

.page a{ color:#173173; }
.page a:hover{ background:#173173; color:#fff; border-color:#173173; }


/*====================================================================*/

/*輪播-左右按鈕*/
.owl-nav-style .owl-next , .owl-nav-style .owl-prev{
	position: absolute;
	top:50%;
	width: 35px;
	height: 35px;
	margin-top:-20px;
	opacity:0;
	transition: all 0.2s ease-in-out;
}
.owl-nav-style .owl-prev { left: 0px; }
.owl-nav-style .owl-next{ right: 0px; }
.owl-nav-style .owl-prev:before , .owl-nav-style .owl-prev:after , .owl-nav-style .owl-next:before , .owl-nav-style .owl-next:after{
	position:absolute;
	z-index:5;
	left:50%;
	margin-top:-6px;
	width:4px;
	height:16px;
	content:"";
	background:#fff;
	
	-ms-border-radius:2px;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	-o-bborder-radius:2px;
	border-radius:2px;
}
.owl-nav-style .owl-prev:before , .owl-nav-style .owl-next:after{ bottom:50%; margin-bottom:-12px; }
.owl-nav-style .owl-prev:after , .owl-nav-style .owl-next:before{ top:50%; margin-top:-12px; }
.owl-nav-style .owl-prev:before , .owl-nav-style .owl-next:before{
	transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
}
.owl-nav-style .owl-prev:after , .owl-nav-style .owl-next:after{
	transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-o-transform:rotate(45deg);
}
.owl-nav-style:hover .owl-prev , .owl-nav-style:hover .owl-next{ opacity:0.8; }
.owl-nav-style .owl-prev:hover , .owl-nav-style .owl-next:hover{ opacity:1; }


/*輪播-底下圓圈*/
.owl-dots-style .owl-dots{ position:absolute; bottom:10px; left:1%; width:98%; z-index:3; text-align:right; padding:0 10px;}
.owl-dots-style .owl-dots .owl-dot { display:inline-block; zoom:1 }
.owl-dots-style .owl-dots .owl-dot span {
	width:15px;
	height:15px;
	margin:0px 7px;
	background:#fff;
	border:3px solid #fff;
	display:block;
	-webkit-backface-visibility:visible;
	transition:opacity .2s ease;
	
	-ms-border-radius:50%;
	-moz-border-radius:50%;
	-webkit-border-radius:50%;
	-o-bborder-radius:50%;
	border-radius:50%;
}
.owl-dots-style .owl-dots .owl-dot.active span, .owl-dots-style .owl-dots .owl-dot:hover span { background:#EB6A26; border:3px solid transparent;}
@media (max-width:960px) { 
	.owl-nav-style .owl-prev { left: 0px; }
	.owl-nav-style .owl-next{ right: 0px; }
	
	.owl-dots-style .owl-dots{ bottom:5px; padding:0; line-height:1; }
	.owl-dots-style .owl-dots .owl-dot span { width:12px; height:12px; margin:0px 12px; border-width:2px; } 
}
 


/*====================================================================*/


/*回頂端按紐*/
.scrolltop{
	position: fixed;
	z-index: 999;
    right: 15px;
    bottom: 75px;
    display: block;
    cursor: pointer;
	background:#173173;
    border: 2px solid rgba(255,255,255,0.5);
    border-radius: 33px;
    padding: 10px 5px;
	opacity:0;
}
.scrolltop img {
    animation: scroll-act1 2.5s infinite;
}
.scrolltop.show{ opacity:1; }

@keyframes scroll-act1{
	0% {
		opacity: 0;
		-webkit-transform: translateY(12px);
		-ms-transform: translateY(12px);
		transform: translateY(12px);
	}
	50% {
		opacity: 1;
		-webkit-transform: translateY(0px) scale(1);
		-ms-transform: translateY(0px) scale(1);
		transform: translateY(0px) scale(1);
	}
	
	100% {
		opacity: 0;
		-webkit-transform: translateY(-10px) scale(1);
		-ms-transform: translateY(-10px) scale(1);
		transform: translateY(-10px) scale(1);
	}
}


/*====================================================================*/



/*回首頁與語系按鈕*/
.quickly-links-wrap{text-align:right; padding:10px 0; }
.quickly-links-item{ 
	display:inline-block; 
	border:1px solid #000;
	line-height:1;
	padding:3px 10px;
	background:#fff;
	margin:0 8px;
	
	-ms-border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-o-bborder-radius:5px;
	border-radius:5px;
}
.quickly-links-item a , .quickly-links-item span{ line-height:1; font-size:12px; color:#173173; }
.quickly-links-item a{}
.quickly-links-item a:hover{ color:#e27b2a; }


/*logo和選單列*/
.header-top-flex{ display: flex; flex-wrap:wrap; align-items:flex-end; margin:5px 0 25px 0; }
.header-top-left{ width:35%; margin-right:5%; }
.header-top-right{ position:relative; width:60%; }

.logo{ max-width:400px; }
.logo img{ display:block; max-width:100%; height:auto;}


.menu-list{ text-align:right; }
.menu-list li{ display:inline-block; width:30%; min-width:185px;  padding-left:5%; }
.menu-list li a{ 
	position:relative;
	z-index:2;
	display:block; 
	text-align:left; 
	height:62px; 
	line-height:60px; 
	padding-left:35px;
	font-size:20px;
	font-weight:600;
	color:#173173;
	letter-spacing:0;
}
.menu-list li a:before{
	position:absolute;
	z-index:-1;
	top:0;
	left:0;
	width:185px;
	height:62px;
	content:"";
	background:url(../images/web-02.png) no-repeat center;
	background-size:cover;
	
	transition:All 0.5s ease;
	-webkit-transition:All 0.5s ease;
	-moz-transition:All 0.5s ease;
	-o-transition:All 0.5s ease;
}

.menu-list li a:hover{ color:#e27b2a; }
.menu-list li a:hover:before{background:url(../images/web-12.png) no-repeat center; background-size:cover; }




/*小螢幕時選單鈕*/
.menu-trigger{ display:none; position:relative; z-index:99; }
.menu-trigger-icon , .menu-trigger-txt{ display:inline-block; vertical-align:middle; line-height:1; }
.menu-trigger-icon{
	position:relative;
	width:44px;
	height:44px;
	background:#173173;

	-ms-border-radius:3px;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	-o-bborder-radius:3px;
	border-radius:3px;
}
.menu-trigger-icon:before , .menu-trigger-icon:after{
	position:absolute;
	left:15%;
	width:70%;
	height:3px;
	margin-top:-2px;
	content:"";
	background:#fff; 
	
	transition:transform 0.5s ease;
	-webkit-transition:transform 0.5s ease;
	-moz-transition:transform 0.5s ease;
	-o-transition:transform 0.5s ease;
}
.menu-trigger-icon:before{ top:25%; }
.menu-trigger-icon:after{ top:75%; }

.menu-trigger-icon .iocn-line{
	position:absolute;
	top:50%;
	left:15%;
	width:70%;
	height:3px;
	margin-top:-2px;
	background:#fff;
}
.menu-trigger.opened .menu-trigger-icon { background:#FF9C43; }
.menu-trigger.opened .menu-trigger-icon:before{
	background:#fff;
	-webkit-transform: rotate(-45deg) translate(-8px, 8px) ;
    transform: rotate(-45deg) translate(-8px, 8px) ;
}
.menu-trigger.opened .menu-trigger-icon:after{
	background:#fff;
	-webkit-transform: rotate(45deg) translate(-7px, -7px) ;
    transform: rotate(45deg) translate(-7px, -7px) ;
}
.menu-trigger.opened .menu-trigger-icon .iocn-line{ opacity:0; }

.menu-trigger-txt{ color:#fff; font-weight:bolder; font-size:1.2em; }





/*mobile選單*/
.menu-toggle-content{ display:none; margin-top:10px; padding:5px 0; background:#fff; }
.menu-mobile-list{ }
.menu-mobile-list li{ position:relative; display:block; }
.menu-mobile-list li a{ 
	color:#173173;
	display:block;
	font-size:1rem;
	padding:10px 20px 10px 10px;
	border-bottom:1px solid rgba(23,49,115, 0.2);
}
.menu-mobile-list > li:last-child > a{ border-bottom-width:0px; }

.menu-mobile-list li ul{ /*background:#fff;*/ }


/*第一層*/
.menu-mobile-list > li{  font-size:1rem; }
.menu-mobile-list > li > a{ font-weight: 600; border-bottom:1px solid rgba(23,49,115, 0.5); }

/*第二層*/
.menu-mobile-list > li > ul{
	display:none;
	position:relative;
	top:0;
	left:0;
	width:100%;
	padding-left:16px;
}
/*下一層之按鈕*/
.submenu-button{
	position:absolute;
	z-index:3;
	top:20px;
	right:20px;
	width:11px;
	height:10px;
	cursor:pointer;
}
.submenu-button:before{
	position:absolute;
	z-index:4;
	top:0;
	right:0;
	width:6px;
	height:6px;
	border-right:2px solid #173173; 
	border-bottom:2px solid #173173;
	content:"";
	transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-o-transform:rotate(45deg);
}

.menu-mobile-list li.current{ background:transparent; color:#e27b2a; }
.menu-mobile-list li.current > a{ color:#e27b2a; }
.menu-mobile-list li.current > a .submenu-button:before{ border-right-color:#e27b2a; border-bottom-color:#e27b2a; }




/*頁尾*/
.footer-top-flex{ display: flex; flex-wrap:wrap; align-items:center; margin:35px auto 30px auto; }
.footer-top-left{ width:200px; margin-right:20px; }
.footer-top-center{ width:calc(100% - 440px); }
.footer-top-right{ width:200px; margin-left:20px; }

.footer-logo img{ display:block; max-width:100%; height:auto; }

.footer-info-list{ border-left:2px solid #666; padding-left:20px; }
.footer-info-list li{ font-size:14px; }
.footer-info-list li span{ margin-right:9px; }
.footer-info-list li , .footer-info-list li a{ color:#333; }
.footer-info-list li a:hover{ color:#e27b2a; }

.social-list{ display:block; text-align:center; }
.social-list li{ display:inline-block; width:35px;  margin:3px 3px; }
.social-list li img{ display:block; max-width:100%; height:auto; }
.social-list li:hover{ opacity:0.8; }

.footer-bottom-wrap{ background:#173173; text-align:center; padding:5px 0; border-top:5px solid #fff;}
.web-copyright{ font-size:0.9em; color:#fff; }
.web-copyright span{ display:inline-block; }
.web-designer{ position:absolute; bottom:0; right:0; font-size:0.75em; }
.web-designer , .web-designer a{ color:rgba(255,255,255,0.5); }
.web-designer a:hover{ color:#e27b2a; }


/*內頁-頁尾*/
.page-footer{ position:relative; margin-top:10px; }
.page-footer:before{
	position:absolute;
	top:-10px;
	left:0;
	width:100%;
	height:10px;
	content:"";
	background:linear-gradient(left,#288ABA , #fff , #288ABA );
	background:-moz-linear-gradient(left,#288ABA , #fff , #288ABA );
	background:-webkit-linear-gradient(left,#288ABA , #fff , #288ABA );
	background:-o-linear-gradient(left,#288ABA , #fff , #288ABA );
	background:-ms-linear-gradient(left,#288ABA , #fff , #288ABA );
}


/*banner上方裝飾線*/
.banner-top-dec-line{ position:relative; height:10px; background:#fff; height:15px; overflow:hidden; }
.banner-top-dec-line:before{
	position:absolute;
	top:0;
	left:0;
	width:38%;
	height:100%;
	content:"";
	background:#173173;
}
.banner-top-dec-line:after{
	position:absolute;
	top:0;
	left:38%;
	width:0;
	height:0;
	content:"";
	border-top: 15px solid #173173;
	border-right: 15px solid transparent;   
}


/*banner下方裝飾線*/
/*.banner-bottom-dec-line{ height:9px; background:#173173; }*/


/*導覽路徑*/
.breadcrumbs-wrap{ position:relative; text-align:right; margin-bottom:15px; }
.breadcrumbs-wrap:before{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:9px;
	content:"";
	background:#173173;
}
.breadcrumbs{
	position:relative;
	display:inline-block;
	line-height:1.5;
	letter-spacing:0;
	background:#173173;
	padding:8px 0 4px 40px;
}
.breadcrumbs:before{
	position:absolute;
	top:0;
	left:-36px;
	width:0;
	height:0;
	content:"";
	border-top:36px solid #173173;
	border-left:36px solid transparent;   
}
.breadcrumbs:after{
	position:absolute;
	top:0;
	right:-1000px;
	width:1000px;
	height:100%;
	content:"";
	background:#173173;
}
.breadcrumbs , .breadcrumbs a{ color:#fff; }
.breadcrumbs a:hover{ color:#e27b2a; }
.breadcrumbs span{margin-right:0px; font-size:0.8em;}
.breadcrumbs span:after{ content:"/"; margin-left:5px; font-size:0.7em; }
.breadcrumbs span:last-child:after{display:none;}
.breadcrumbs span:last-child{ }


/*大標與分類*/
.headline-wrap{ position:relative; padding-left:350px; margin-bottom:45px; min-height:100px; }
.headline-wrap .page-headline{ position:absolute; top:0; left:0; margin-bottom:0; }



/*大標*/
.page-headline{ margin-bottom:30px; }
.page-headline .title{ 
	position:relative;
	z-index:2; 
	display:block; 
	width:300px;
	height:105px;
	font-weight:600;
	color:#173173;
	font-size:32px;
	line-height:110px;
	padding-left:30px;
}
.page-headline .title:before{
	position:absolute;
	z-index:-1;
	top:0;
	left:0;
	width:100%;
	height:100%;
	content:"";
	background:url(../images/web-07.png) no-repeat center;
	background-size:cover;
}

.page-headline.small{ margin-bottom:30px; }
.page-headline.small .title{ width:300px; height:105px; line-height:110px; }



/*分類*/
.category-area{ padding-top:30px; text-align:right; }
.category-list li{ display:inline-block; margin:10px 0 15px 25px; }
.category-list li a{
	position:relative;
	display:block;
	padding:2px 0;
	color:#173173;
	font-size:18px;
}
.category-list li a:before{
	position:absolute;
	bottom:0;
	left:0;
	width:0;
	height:3px;
	content:"";
	background:#ed7e26;
	
	transition:width 0.5s ease;
	-webkit-transition:width 0.5s ease;
	-moz-transition:width 0.5s ease;
	-o-transition:width 0.5s ease;
}
.category-list li a:after{
	position:absolute;
	top:-18px;
	left:50%;
	width:20px;
	height:20px;
	margin-left:-10px;
	content:"";
	background:url(../images/web-08.png) no-repeat center;
	background-size:cover;
	opacity:0;
}
.category-list li a:hover , .category-list li.active a{ color:#ed7e26; }
.category-list li a:hover:before , .category-list li.active a:before{ width:100%;}
.category-list li.active a:after{ opacity:1; }

.category-list li.active a{ cursor:default; }





/*編輯區*/
.editor-area{ margin:10px 0; }
.editor-area img{ max-width:100%; height:auto; }



/*返回按鈕列*/
.pageback-line{margin:30px 0; text-align:center; }
.pageback-btn span{ 
	position:relative; 
	display:inline-block; 
	vertical-align:bottom; 
	padding-left:17px; 
	color:#173173;
	font-weight:600; 
	font-size:0.95em; 
	line-height:1; 
}
.pageback-btn span:before{
	position:absolute;
	top:50%;
	left:0;
	width:14px;
	height:14px;
	margin-top:-7px;
	content:"";
	background:#173173 url(../images/icon-arrow-left.png) no-repeat center;
	background-size:70% 70%;
}
.pageback-btn:hover span{ color:#ed7e26; }
.pageback-btn:hover span:before{ background-color:#ed7e26; }






/*=======================================================================================================================================
=======================================================================================================================================*/



/*首頁-輪播區塊*/
.banner-wrap{ position:relative; z-index:2; padding:0 500px 0 30px; margin:35px 0 75px 0; }
.banner-wrap:before{
	position:absolute;
	top:50%;
	right:0;
	width:500px;
	height:428px;
	margin-top:-214px;
	content:"";
	background:url(../images/web-03.png) no-repeat center;
	background-size:cover;
}

.owl-banner .item{
	overflow:hidden;
	
	-ms-border-radius:25px;
	-moz-border-radius:25px;
	-webkit-border-radius:25px;
	-o-bborder-radius:25px;
	border-radius:25px;
}

/*首頁-頁尾*/
.idx-footer .footer-top-flex{ margin-top:0; }




/*關於我們*/
.banner img{ display:block; max-width:100%; height:auto; }

.about-main-wrap{ position:relative; z-index:2; min-height:900px; }
.about-main-wrap:before{
	position:absolute;
	z-index:0;
	bottom:0;
	right:0;
	/*width:900px;
	height:1500px;*/
	width:600px;
	height:1000px;
	content:"";
	background:url(../images/web-10.png) no-repeat bottom right;
	background-size:cover;
	opacity:0.8;
}



/*商品介紹*/
.product-main-wrap{ position:relative; z-index:2; min-height:1200px; }
.product-main-wrap:before{
	position:absolute;
	z-index:0;
	bottom:0;
	left:0;
	/*width:1000px;
	height:1400px;*/
	width:800px;
	height:1120px;
	content:"";
	background:url(../images/web-14.png) no-repeat bottom right;
	background-size:cover;
	opacity:0.8;
}


.product-editor-area{ color:#173173; border-bottom:1px solid #173173; margin-bottom:30px; }

.product-cols-gp{ display: flex; flex-wrap:wrap; margin:30px 0; }
.product-left-side{ width:20%; margin-right:5%; }
.product-right-side{ width:75%; }


/*左側分類*/
.side-nav{ margin-bottom:60px; }
.side-nav li{ border-bottom:1px solid rgba(23,49,115, 0.5); }
.side-nav li a{ position:relative; display:block; color:#173173; font-weight:600; padding:10px 3px; }
.side-nav li a:before{
	position:absolute;
	top:50%;
	left:-23px;
	width:18px;
	height:18px;
	margin-top:-9px;
	content:"";
	background:url(../images/web-08.png) no-repeat center;
	background-size:cover;
	opacity:0;
}
.side-nav li.active a{ color:#ed7e26;}
.side-nav li.active a:before{ opacity:1; }

.side-nav li a:hover{ color:#ed7e26; }



/*商品分類大標*/
.product-cate-name{
	color:#173173;
	font-weight:600; 
	font-size:1.4em;
	text-align:center;
	padding:6px 9px;
	background:url(../images/web-30.png) no-repeat bottom center; background-size:cover;
	margin-bottom:15px;
}


/*商品列表*/
.product-list{ display: flex; flex-wrap:wrap; }
.product-list li{  position:relative; width:31%; margin-right:3.5%; margin-bottom:45px; }
.product-list li:nth-child(3n){ margin-right:0; }

.product-item{ 
	border:1px solid #164c9b; 
	background:#fff;
	padding:20px 15px 35px 15px;
}
.product-item:before{
	position:absolute;
	bottom:0px;
	left:0;
	width:100%;
	height:8px;
	content:"";
	background:rgba(184,211,255, 0.7);
	opacity:0;
}
.product-item-photo{ position:relative; margin-bottom:20px; }
.product-item-photo a:before{
	position:absolute;
	z-index:1;
	bottom:10px;
	left:0;
	width:100%;
	height:3px;
	content:"";
	background:#173173;
	
	-ms-border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-o-bborder-radius:5px;
	border-radius:5px;
}
.product-item-photo a{ display:block; }
.product-item-title a{
	display:block;
	background:rgba(184,211,255, 0.5);
	color:#173173;
	text-align:center;
	padding:6px 5px;
}
.product-item.bigset:hover{
	border-width:3px;
	
	-moz-transform:scale(1.1);
	-webkit-transform:scale(1.1);
	-o-transform:scale(1.1);
	-ms-transform:scale(1.1);
	transform:scale(1.1);
}

.product-item.bigset{
	transition:All 0.5s ease;
	-webkit-transition:All 0.5s ease;
	-moz-transition:All 0.5s ease;
	-o-transition:All 0.5s ease;
}
.product-item.bigset:hover:before{ opacity:1; }
.product-item.bigset:hover .product-item-photo a:before{ background:rgba(184,211,255, 0.9); }
.product-item.bigset:hover .product-item-title a{ background:rgba(22,76,155, 0.9); color:#fff; }


.product-item.normalset:hover{ border:2px solid #E27B2B;  }
.product-item.normalset:hover .product-item-photo a:before{ background:rgba(226,123,43,0.9); }
.product-item.normalset:hover .product-item-title a{ background:#E27B2B; color:#fff; }








/*商品詳細頁*/
.product-view-gp{ display: flex; flex-wrap:wrap; margin-bottom:45px; }
.product-view-gp-left{ width:60%; margin-right:5%; }
.product-view-gp-right{ width:35%; }

.pro-view-photos{ position:relative; border:2px solid #164c9b; background:#fff; }
.pro-view-photos:before{
	position:absolute;
	z-index:1;
	bottom:0px;
	left:0;
	width:100%;
	height:20px;
	content:"";
	background:rgba(184,211,255, 0.7);164c9b
}
.pro-view-photos:after{
	position:absolute;
	z-index:1;
	bottom:0px;
	left:0;
	width:100%;
	height:10px;
	content:"";
	background:#164c9b;
}
.pro-view-photos .item-thumb-frame .item-thumb{ padding-bottom:75%; }


.product-view-name{ margin-bottom:5px; }
.product-view-name .title{ color:#0a265e; font-weight:600; font-size:22px; }
.product-view-inquiry{ position:absolute; top:0; right:0; }
.product-view-inquiry a{ background:#FF8004; color:#fff; padding:5px 15px; font-weight:600; }

.product-view-intro{ position:relative; border-top:3px solid #173173; border-bottom:3px solid #173173; padding:30px 0; color:#173173; }
.product-view-intro .title{
	position:absolute;
	top:0;
	right:0;
	display:inline-block;
	background:#173173;
	color:#fff;
	padding:5px 15px 5px 15px;
	letter-spacing:3px;
	line-height:1;
}
.product-view-intro .title:before{
	position:absolute;
	top:0;
	left:-26px;
	width:0;
	height:0;
	content:"";
	border-top:26px solid #173173;
	border-left:26px solid transparent;   
}
.product-view-desc-headline{ font-size:1.1em; font-weight:600; color:#0D2171; margin-bottom:5px; }

.product-view-description{ 
	position:relative; 
	border-top:3px solid #173173; 
	border-bottom:14px solid #fff; 
	padding:30px;
	margin-bottom:10px;
	
	background:linear-gradient(top,#fff , rgba(23,49,115, 0.3) );
	background:-moz-linear-gradient(top,#fff , rgba(23,49,115, 0.3) );
	background:-webkit-linear-gradient(top,#fff , rgba(23,49,115, 0.3) );
	background:-o-linear-gradient(top,#fff , rgba(23,49,115, 0.3) );
	background:-ms-linear-gradient(top,#fff ,rgba(23,49,115, 0.3) );
	
	-webkit-box-shadow:2px 2px 4px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
	-o-box-shadow:2px 2px 4px rgba(0, 0, 0, 0.3);
	box-shadow:2px 2px 4px rgba(0, 0, 0, 0.3);
}
.product-view-description:before{
	position:absolute;
	bottom:-14px;
	right:0;
	width:38%;
	height:14px;
	content:"";
	background:#173173;
}
.product-view-description:after{
	position:absolute;
	bottom:-14px;
	right:38%;
	width:0;
	height:0;
	content:"";
	border-top: 14px solid #173173;
	border-left: 14px solid transparent;   
}
.product-view-description .title{
	position:absolute;
	top:0;
	right:0;
	display:inline-block;
	background:#173173;
	color:#fff;
	width:100%;
	max-width:200px;
	padding:5px 15px 5px 15px;
	letter-spacing:3px;
	line-height:1;
	text-align:center;
}
.product-view-description .title:before{
	position:absolute;
	top:0;
	left:-26px;
	width:0;
	height:0;
	content:"";
	border-top:26px solid #173173;
	border-left:26px solid transparent;   
}






/*聯絡我們*/
.contact-main-content{ max-width:1000px; margin:0 auto; }

.map-wrap{ position:relative; border-top:10px solid #173173; }
.map-wrap .title{
	position:absolute;
	top:0;
	right:0;
	display:inline-block;
	background:#173173;
	color:#fff;
	width:100%;
	max-width:200px;
	padding:3px 15px 7px 15px;
	letter-spacing:10px;
	line-height:1;
	text-align:center;
}
.map-wrap .title:before{
	position:absolute;
	top:0;
	left:-26px;
	width:0;
	height:0;
	content:"";
	border-top:26px solid #173173;
	border-left:26px solid transparent;   
}
.map iframe{ display:block; }


.contact-info-area{
	position:relative;
	border-top:14px solid #fff; 
	padding:30px 30px 60px 30px;
	min-height:200px;
	margin-bottom:90px;
	
	background:linear-gradient(top,#fff , rgba(23,49,115, 0.2) );
	background:-moz-linear-gradient(top,#fff , rgba(23,49,115, 0.2) );
	background:-webkit-linear-gradient(top,#fff , rgba(23,49,115, 0.2) );
	background:-o-linear-gradient(top,#fff , rgba(23,49,115, 0.2) );
	background:-ms-linear-gradient(top,#fff ,rgba(23,49,115, 0.2) );
	
	-webkit-box-shadow:2px -2px 4px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 2px -2px 4px rgba(0, 0, 0, 0.3);
	-o-box-shadow:2px -2px 4px rgba(0, 0, 0, 0.3);
	box-shadow:2px -2px 4px rgba(0, 0, 0, 0.3);
}
.contact-info-area:before{
	position:absolute;
	top:-14px;
	right:0;
	width:38%;
	height:14px;
	content:"";
	background:#173173;
}
.contact-info-area:after{
	position:absolute;
	top:-14px;
	right:38%;
	width:0;
	height:0;
	content:"";
	border-top: 14px solid #173173;
	border-left: 14px solid transparent;   
}

.contact-info-list{ display: flex; flex-wrap:wrap; }
.contact-info-list li{ position:relative; width:48%; margin:0 1% 20px 1%; font-size:1em; padding-left:25px; }
/*.contact-info-list li span{ display:inline-block;}*/
.contact-info-list li .title{ position:relative; display:inline-block; }
.contact-info-list li .title:before{
	position:absolute;
	top:3px;
	left:-25px;
	width:20px;
	height:20px;
	content:"";
	background:url(../images/web-17.png) no-repeat center;
	background-size:cover;
}
.contact-info-list li a { color:#424241; }
.contact-info-list li a:hover { color:#000; }

.contact-info-dec01{
	position:absolute;
	bottom:-30px;
	left:-20px;
	width:100px;
	height:70px;
	content:"";
	background:url(../images/web-18.png) no-repeat center;
	background-size:cover;
	opacity:0.8;
}
.contact-info-dec02{
	position:absolute;
	bottom:-35px;
	right:-25px;
	width:300px;
	height:105px;
	content:"";
	background:url(../images/web-07.png) no-repeat center;
	background-size:cover;
	opacity:0.8;
}