/*************************
*******pagestyle CSS******
**************************/
#pcontent {
	width: 100%;
	display: inline-block;
	background: no-repeat center top;
}
.itemarea {
	width: 100%;
	float: left;
}
.pageright {
	float: right;
	width: calc(100% - 250px);
	margin: 10px 0 50px;
}
.pageright2 {
	display: inline-block;
	width: 100%;
	padding: 0;
	margin: 0 0 40px;
}
.pbox1 {
	float: left;
	width: 100%;
	padding-top: 10px;
	line-height: 2em;
	min-height: 350px;
}
.pbox1 img {
	display:block;
	height:auto;
	max-width:100%;
}
.pbox1 iframe,
.pbox1 object,
.pbox1 embed {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
	height: 100%;
}
.page-header {
	padding: 0 0 15px;
	border-style: none;
	width: 100%;
	margin: 0;
	font-size: 2em;
	line-height: 1.4em;
	color: #000;
	font-weight: bold;
	display: inline-block;
	background: url(../line5.png) no-repeat left bottom;
}
.pbox1 .center-pic {
	float: left;
	width: 100%;
	padding: 20px 0 25px;
}
.pbox1 .center-pic img {
	margin: 0 auto;
}
@media (max-width: 991px) {
.pageright {
	float: left;
	width: 100%;
}
.page-header {
	font-size: 1.7em;
}
}

.breadcrumb{
	list-style: none;
	border-radius: 0px;
	font-size: 13px;
	line-height: 18px;
	margin: 0;
	text-align: right;
	padding: 11px 7px;
	background-color: transparent;
	/*background: rgba(255,255,255,0.6);*/
}
.breadcrumb>li{display:inline-block;color:#999;}
.breadcrumb>li+li:before{padding:0 5px;color:#999;content:"/\00a0";}
.breadcrumb>.active{color:#0735a1}
.breadcrumb>li a{color:#999;}
.breadcrumb>li a:hover{color:#00aeef;text-decoration:none;}

/*************************
*******內頁選單
**************************/
.pageleft {
	float: left;
	width: 210px;
	margin: 15px 0 0;
	padding: 5px 0 0;
	font-size: 16px;
	background: url(../line6.jpg) no-repeat left top;
}
ul.mtree {
  opacity: 0;
  margin-left: 0;
  padding: 0;
}
ul.mtree ul {
  padding-left: 0;
}
ul.mtree li {
	list-style: none;
	border-bottom: 1px solid #cecece;
	background-color: #002d96;
}
ul.mtree a {
  display: block;
	text-decoration:none;
}
ul.mtree a:hover {
	text-decoration:none;
}
ul.mtree li > a.current {
  font-weight: bold;
	background-color: #002d96 url(../icon7.png) no-repeat 6px 19px;
	color: #FFF;
}
ul.mtree li.mtree-node > a {
  /*font-weight: bold;*/
}
ul.mtree li.mtree-node > a.current {
  font-weight: bold;
	background: #002d96 url(../icon7.png) no-repeat 6px 19px;
	color: #FFF;
}
ul.mtree a {
  -webkit-transition: all 300ms ease-out;
  -moz-transition: all 300ms ease-out;
  -ms-transition: all 300ms ease-out;
  -o-transition: all 300ms ease-out;
  transition: all 300ms ease-out;
}

ul.mtree.transit {
  /*background: #111;*/
}
ul.mtree.transit ul {
  margin-left: 0;
}
ul.mtree.transit ul > li {
  font-size: 15px;
  background: #ececec;
  border-bottom: none;
}
ul.mtree.transit li.mtree-node {
  position: relative;
}
ul.mtree.transit li.mtree-node > a:before {
  color: #ccc;
  font-weight: normal;
  position: absolute;
  right: 10px;
}
ul.mtree.transit li.mtree-open > a:before {
  content: '-';
}
ul.mtree.transit li.mtree-closed > a:before {
  content: '+';
}
ul.mtree.transit ul > li:first-child {
  margin-top: 1px;
}
ul.mtree.transit li.mtree-open > a {
    background: #fff;
	background: #666 url(../icon7.png) no-repeat 9px 21px;
}
ul.mtree.transit li > a:hover, ul.mtree.transit li.mtree-active > a {
	background: #666 url(../icon7.png) no-repeat 9px 21px;
	color: #fff;
}
ul.mtree.transit li > a.current {
  font-weight: bold;
	background: #002d96 url(../icon7.png) no-repeat 9px 21px;
	color: #FFF;
}
ul.mtree.transit li.mtree-node > a.current:before {
	color: #FFF;
}
ul.mtree.transit li.mtree-node > ul > li:last-child {
  /*margin-bottom: .5em;
  padding-bottom: .5em;
  border-bottom: 1px solid #333;*/
}
ul.mtree.transit li.mtree-node:last-child > ul > li:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}
ul.mtree.transit a {
  padding: 10px 0px 10px 1.4em;
	color: #FFF;
}
ul.mtree.transit li > a {
	color: #fff;
	background-image: url(../icon6.png);
	background-repeat: no-repeat;
	background-position: 9px 21px;
}
ul.mtree.transit li li > a {
	line-height: 1.5em;
    padding: 8px 0px 8px 1.4em;
	background: none;
	color: #666;
	border-bottom: 1px dashed #d7d7d7;
}
ul.mtree.transit li li > a:hover, ul.mtree.transit li li.mtree-active > a {
    background: none;
	background: #999;
}
ul.mtree.transit li li > a:hover {
	background: #999;
	background: none;
}
ul.mtree.transit li li li > a {
  padding: 8px 0px 8px 1.8em;
	background: #f6f6f6;
	color: #666;
}
ul.mtree.transit li li li > a:hover {
  padding: 8px 0px 8px 1.9em;
	background: #ccc;
}
ul.mtree.transit li li li li > a {
  padding-left: 3.2em;
	background: none;
}
ul.mtree.transit li li li li li > a {
  padding-left: 4em;
}
ul.mtree.transit li li > a:hover, ul.mtree.transit li li li > a:hover {
  background-image: none;
}
ul.mtree.transit li.mtree-open > a,ul.mtree.transit li li.mtree-open > a, ul.mtree.transit li li li.mtree-open > a {
  color: #fff;
}
ul.mtree.transit li li > a.current, ul.mtree.transit li li li > a.current {
  background-image: none;
}
ul.mtree.transit li li.mtree-open > a {
	background-image: none;
	background: #999;
	color: #fff;
}
ul.mtree.transit li li > a:hover, ul.mtree.transit li li li.mtree-active > a {
  background-image: none;
	background: #999;
	color: #FFF;
	
}
@media (max-width: 991px) {
.pageleft {
	float: left;
	width: 100%;
	margin: 25px 0 0;
}
}
/*************************
******* about CSS ******
**************************/
.certif1 {
	display: block;
	width: 100%;
	float: left;
	text-decoration: none;
}
.certif1 ul {
	display: block;
	list-style: none;
	margin: 0;
	overflow: hidden;
	width: 33.3%;
	float: left;
	padding: 10px 1% 15px;
}
.certif1 ul li {
	display: block;
	list-style: none;
	overflow: hidden;
	float: left;
	width: 100%;
	margin: 0;
}
.certif1 ul li.certif-name {
	color: #333;
	margin-top: 10px;
	margin-bottom: 5px;
	text-align: center;
	line-height: 1.6em;
	font-weight: bold;
}
.certif1 ul li.certif-txt {
	color: #333;
	margin-top: 5px;
	margin-bottom: 5px;
	padding: 0 5px;
	line-height: 1.6em;
}
.certif1 ul li.gallery-overlay {
	display: block;
	height: 380px;
	position: relative;
	overflow: hidden;
	border: 1px solid #EEEEEE;
}
.certif1 ul li.gallery-overlay:after {
    padding-top: 56.25%;
    content:"";
    display: block;
}
.certif1 ul li.gallery-overlay img { 
	position:absolute;
    top:0;
    bottom:0;
    right:0;
    left:0;
    max-width:100%;
	max-height:380px;
    margin:auto;
}
.about-w1 {
	font-size: 2em;
	color: #00a1e9;
	line-height: 1.4em;
}
.about-ov {
	width: 100%;
	float: left;
	padding: 15px;
	margin: 25px 0 0;
	background: #f0efef;
	background-image: url(../line6.gif);
	background-repeat: repeat-y;
	background-position: 178px;
}
.about-ov dl {
	width: 100%;
	margin: 0;
	float: left;
	padding: 7px 0;
	background-image: url(../icon3.png);
	background-repeat: no-repeat;
	background-position: 155px 19px;
}
.about-ov dt{
	float: left;
	color: #555;
	font-family: "Crimson Text", serif;
	font-size: 30px;
	line-height: 32px;
	width: 200px;
	padding: 6px 40px 0 10px;
}
.about-ov dt span.month {
	font-size: 24px;
}
.about-ov dd {
	float: left;
	margin: 0;
	background-color: #FFF;
	padding: 5px;
	width: calc(100% - 200px);
	position: relative;
	border: 1px solid #e8dcb8;
	min-height: 40px;
}
.about-ov dd:after {
	content: '';
	display: block;
	position: absolute;
	z-index: 2;
	top: 9px;
	left: -20px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 10px;
}
.about-ov dd:after{
	border-color: transparent #e8dcb8 transparent transparent;
}
.about-ov dd p {
	float: left;
	margin: 0;
	font-weight: normal;
	color: #333;
	width: 100%;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 12px;
}
.about-pic {
	display: inline-block;
	width: 100%;
	margin: 10px 0 35px;
}
.about-pic .pic1 {
	width:50%;
	float:left;
	padding: 0 10px 0 0;
}
.about-pic .pic1:nth-child(2) {
	width:50%;
	float:left;
	padding: 0 0 0 10px;
}
.about1 {
	display: inline-block;
	width:100%;
	margin: 0 0 20px;
}
.about1 table {
	width:100%;
	max-width: 100%;
	border:none;
	border-collapse:collapse;
	background: #fff;
}
.about1 table tr {
	border-collapse:collapse;
}
.about1 table td {
	visibility: visible;
	padding: 2px;
	text-align: center;
}
.about1 table img {
	max-width: 100%;
}
.about2 {
	width: 100%;
	padding: 15px 10px;
	margin: 5px 0 15px;
	display: inline-block;
	background-color: #eee;
}
.about2 dl {
	width: 100%;
	float: left;
	margin: 10px 0;
	padding: 0 10px;
}
.about2 dt {
	float: left;
	width: 100%;
	color: #002d96;
	font-size: 20px;
	font-weight: bold;
	padding: 0 0 0 28px;
	background-image: url(../inside-circle.png);
	background-repeat: no-repeat;
	background-position: left 4px;
}
.about2 dd {
	float: left;
	width: 100%;
	padding: 7px 0 4px 28px;
	font-size: 18px;
	color: #333;
}

@media (min-width: 768px) and (max-width: 991px) {
.certif1 ul {
	width: 50%;
	padding: 5px 1% 20px;
}
}
@media (max-width: 991px) {
.about-ov {
	background-image: url(../line6.gif);
	background-repeat: repeat-y;
	background-position: 27px 0;
}
.about-ov dl {
	background-image: url(../icon3.png);
	background-repeat: no-repeat;
	background-position: 4px 19px;
}
.about-ov dt{
	width: 100%;
	padding: 4px 0 0 40px;
}
.about-ov dd {
	margin: 5px 0 0 40px;
	width: calc(100% - 40px);
}
}
@media (max-width: 767px) {
.certif1 ul {
	width: 50%;
	padding: 5px 1% 20px;
}
.about-pic .pic1 {
	width:100%;
	padding: 0;
}
.about-pic .pic1:nth-child(2) {
	width:100%;
	padding: 25px 0 0 0;
}
.video-info {
	width:100%;
	padding: 0;
}
.video-info:nth-child(2) {
	width:100%;
	padding: 25px 0 0 0;
}
}
@media (max-width: 480px) {
.certif1 ul {
	width: 100%;
	padding: 5px 0 20px;
}
}
.searchbox {
	display: inline-block;
	width: 100%;
	padding: 15px 2% 25px ;
	border: 6px solid #ffd1d1;
}
.searchbox ul{
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
}
.searchbox ul li{
	width: 100%;
	float: left;
	font-size: 16px;
	padding: 10px 8px 10px 23px;
	margin: 0;
	list-style-type: none;
	border-bottom: 1px dashed #ccc;
	background: url(../icon8.png) no-repeat 8px 22px;
}
.searchbox ul li:hover{
	background-color: #fbeaea;
}
.searchbox ul li a{
	color: #333;
}
.searchbox ul li a:hover{
	color: #d70000;
}

@media (max-width: 480px) {

}

.about-list, .about-list2 {
	width: 100%;
	float: left;
	background: #d3e9f2;
	padding: 13px 10px 20px;
	border-radius: 8px;
	margin: 15px 0;
}
.about-list .title, .about-list2 .title {
	width: 100%;
	display: inline-block;
	font-size: 22px;
	color: #ee010a;
	line-height: 1.5em;
	padding: 0 0 0 37px;
	background: url(../security-on.svg) no-repeat 11px 7px;
	background-size: 20px;
	margin: 5px 0 0;
}
.about-list ul, .about-list2 ul {
	width: 100%;
	float: left;
	margin: 0;
	padding: 0;
}
.about-list li { 
	display:block;
	list-style:none;
	width: calc(100%/4 - 14px);
	float: left;
	padding: 0;
	margin: 12px 7px;
}
.about-list2 li { 
	display:block;
	list-style:none;
	width: calc(100%/3);
	float: left;
	padding: 15px 5px;
	margin: 0;
}
.about-list li.pro-img, .about-list2 li .pro-img { 
	overflow: hidden;
	padding: 0;
	border: 5px solid #fff;
	border-radius: 5px;
	position: relative;
	background: #fff;
	-webkit-box-shadow: 0 0 2px rgba( 0, 0, 0, 0 );
	box-shadow: 0 0 2px rgba( 0, 0, 0, 0 );
	-webkit-transition: all 0.2s ease-in-out;
     -moz-transition: all 0.2s ease-in-out;
      -ms-transition: all 0.2s ease-in-out;
       -o-transition: all 0.2s ease-in-out;
          transition: all 0.2s ease-in-out;
}
.about-list li:hover .pro-img, .about-list2 li:hover .pro-img {
	-webkit-box-shadow: 0 0 6px rgba( 0, 0, 0, 0.2 );
	box-shadow: 0 0 6px rgba( 0, 0, 0, 0.2 );
}
.about-list ul li .productimg, .about-list2 ul li .productimg {
	width: 100%;
	height: 240px;
	outline: none;
	display: inline-block;
	float: left;
	-webkit-transform: scale(1);
    transform: scale(1);
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}
.about-list ul li:hover .productimg, .about-list2 ul li:hover .productimg {
	opacity: 0.8;
	-webkit-transform: scale(1.05);
    transform: scale(1.05);
}
.about-list ul li .pro-name, .about-list2 ul li .pro-name {
	font-size: 1em;
	line-height: 1.5em;
	color: #333;
	margin-top: 7px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-o-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	-webkit-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	-moz-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	display: inline-block;
	width: 100%;
	text-align: center;
}
.about-list li:hover .pro-name, .about-list2 li:hover .pro-name {
	color: #da2618;
}

@media (min-width: 992px) and (max-width: 1299px) {
.about-list li, .about-list2 li { width: calc(100%/2 - 14px);}
.about-list ul li .productimg, .about-list2 ul li .productimg {	height: 220px;}
}
@media (min-width: 768px) and (max-width: 991px) {
.about-list li, .about-list2 li { width: calc(100%/2 - 14px);}
.about-list ul li .productimg, .about-list2 ul li .productimg {	height: 220px;}
}
@media (max-width: 767px) {
.aboutb1 .aboutp1 {
	width: 100%;
	padding: 0 0 20px;
}
.aboutb1 .aboutp2 {
	width: 100%;
	padding: 0 0 20px;
}
.aboutb1 .abouttxt {
	width: 100%;
	margin: 0;
}
.aboutb3 ul li {
	width: 22%;
	margin: 10px 1.5%;
}
.about-list li, .about-list2 li { 
	width: calc(100%/2 - 14px);
}
.about-list ul li .productimg, .about-list2 ul li .productimg {
	height: 180px;
}
}
@media (max-width: 480px) {
.aboutb3 ul li {
	width: 31%;
	margin: 10px 1%;
}
.about-list li, .about-list2 li { width: 100%;margin: 10px 0;}
.about-list ul li .productimg, .about-list2 ul li .productimg {	height: 220px;}
}
/*************************
******* contact CSS ******
**************************/
#contact_form {
	float: left;
	width: 100%;
}
#contact {
	width: 100%;
	display: inline-block;
	padding: 0;
	margin: 0;
}
.contact1 {
	width: 60%;
	padding: 0;
	margin: 0;
	float: left;
}
.contact1 .contact-text {
	float: left;
	width: 100%;
	margin: 0 0 10px 0;
	color: #222;
	padding-bottom: 15px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #E4E4E4;
}
.contact1 .control-label {
	text-align: left;
}
.contact1 label {
	padding-left: 10px;
	float: left;
	width: 100%;
	color: #666;
}
.contact1 .required {
	color: #E85500;
	border: 0;
	margin-left:5px;
}
.contact2 {
	float: left;
	width: 100%;
	margin: 3px 0 0 0;
}
.contact2 .cleft {
	width: 30%;
	float: left;
}
.contact2 .cright {
	width: 25%;
	float: left;
	margin: 0;
	padding-left: 5%;
}
.contact3 {
	padding-top: 25px;
	float: left;
	width: 100%;
	margin-top: 5px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #E4E4E4;
	text-align: center;
}
.contact3 button {
	font-family: \5FAE\8EDF\6B63\9ED1\9AD4, \65B0\7D30\660E\9AD4, Arial, Helvetica, sans-serif;
	width: 200px;
	height: 40px;
	margin-left: 10px;
	text-align: center;
	line-height: 30px;
	font-size: 16px;
	border: none;
	cursor: pointer;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	color: #FFFFFF;
	font-weight: bold;
	margin-bottom: 10px;
	transition: background 0.3s;
}
.contact3 .send {
	background: #555;
}
.contact3 .send:hover{
	background:#002d96;
}
.contact3 .reset {
	background: #ccc;
}
.contact3 .reset:hover{
	background:#999;
}
.contact5 {
	float: right;
	width: 35%;
	padding: 10px;
	margin: 0;
	background-color: #EEE;
}
.contact5 .google-maps {
	position: relative;
    padding-bottom: 160%;
    height: 0;
    overflow: hidden;
}
.contact5 .google-maps iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}
.contact6 {
	float: left;
	width: 33%;
	padding: 0 0 0 2%;
}
.contact6:first-child {
	float: left;
	width: 34%;
	padding: 0;
}
.contact1 .box-txt{border: 1px solid #ccc; outline: none; padding: 3px 10px;}
.contact1 .box-txt:focus{border-color: #d70000; -webkit-box-shadow: 0 0 1px #d70000; box-shadow: 0 0 1px #d70000;}
#contact_form .pull-left{padding-right:10px}

@media (min-width: 768px) and (max-width: 991px) {
.contact1 {
	width: 100%;
}
.contact2 .cleft {
	width: 50%;
}
.contact2 .cright {
	width: 45%;
	float: left;
	margin: 0;
	padding-left: 5%;
}
.contact5 {
	float: left;
	width: 100%;
	margin: 40px 0 0;
}
.contact5 .google-maps {
    padding-bottom: 50%;
}
}
@media (max-width: 767px) {
.contact1 {
	width: 100%;
}
.contact2 .cleft {
	width: 50%;
	float: left;
}
.contact2 .cright {
	width: 45%;
	float: left;
	margin: 0;
	padding-left: 5%;
}
.contact4 .google-maps {
	position: relative;
    padding-bottom: 50%;
    height: 0;
    overflow: hidden;
}
.contact5 {
	float: left;
	width: 100%;
	margin: 40px 0 0;
}
.contact5 .google-maps {
    padding-bottom: 50%;
}
}
@media (max-width: 480px) {
.contact3 button {
	width: 100%;
	margin-left: 0px;
}
.contact5 .google-maps {
    padding-bottom: 100%;
}
.contact6 {
	width: 100%;
	padding: 1px 0;
}
.contact6:first-child {
	width: 100%;
	padding: 1px 0;
}
}
/*************************
*******news CSS******
**************************/
.newslist{
	float: left;
	width: 100%;
	visibility: visible;
	padding: 0;
	margin: 0;
}
.newslist ul{
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
	border-top: 3px solid #ddd;
}
.newslist ul li{
	width: 100%;
	float: left;
	padding: 13px 8px;
	margin: 0;
	list-style-type: none;
	border-bottom: 1px dashed #ddd;
	-webkit-transition: all 0.2s ease-in-out;
     -moz-transition: all 0.2s ease-in-out;
      -ms-transition: all 0.2s ease-in-out;
       -o-transition: all 0.2s ease-in-out;
          transition: all 0.2s ease-in-out;
}
.newslist ul li:hover{
	background-color: #f2f2f2;
}
.newslist ul li .date{
	float: left;
	padding: 1px 12px;
	color: #FFF;
	background: #ccc;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	transition: background 0.3s;
	font-size: 13px;
}
.newslist ul li:hover .date{
	background:#666;
}
.newslist ul li a{
	width: calc(100% - 110px);
	display: block;
	float: right;
	color: #333;
}
.newslist ul li a:hover{
	color: #0098df;
}
.newslist2 {
	padding: 0px;
	float: left;
	width: 100%;
	margin: 0px;
}
.newslist2 dl {
	width: 100%;
	margin: 0px;
	float: left;
	padding-right: 0px;
	padding-bottom: 15px;
	padding-left: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ccc;
	padding-top: 0px;
}
.newslist2 dt {
	float: left;
	background-color: #f7b52c;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding-top: 4px;
	padding-right: 15px;
	padding-bottom: 4px;
	padding-left: 15px;
	font-size: 15px;
	font-weight: normal;
	color: #fff;
}
.newslist2 dd {
	float: left;
	margin: 0px;
	padding-top: 7px;
	padding-right: 5px;
	padding-bottom: 0px;
	padding-left: 5px;
	font-size: 1.8em;
	line-height: 1.4em;
	font-weight: bold;
	color: #333333;
	width: 100%;
}
.newscontent {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding: 30px 0;
	border-bottom: 1px solid #e8e8e8;
}
.newslist4 {
	font-size: 1em;
	line-height: 1.6em;
	color: #333333;
	background-color: #e8e8e8;
	float: left;
	width: 100%;
	padding: 12px 10px;
}
.newslist4 A:link {color:#009bd8;text-decoration:none}
.newslist4 A:visited {color:#009bd8;text-decoration:none}
.newslist4 A:hover {color:#eb6100;text-decoration:underline}
.searchlist{
	float: left;
	width: 100%;
	visibility: visible;
	padding: 0;
	margin: 0;
}
.searchlist ul{
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
	border-top: 3px solid #ddd;
}
.searchlist ul li{
	width: 100%;
	float: left;
	padding: 13px 8px 13px 30px;
	margin: 0;
	list-style-type: none;
	border-bottom: 1px dashed #ddd;
	background: #fff url(../icon6.png) no-repeat 15px 26px;
	-webkit-transition: all 0.2s ease-in-out;
     -moz-transition: all 0.2s ease-in-out;
      -ms-transition: all 0.2s ease-in-out;
       -o-transition: all 0.2s ease-in-out;
          transition: all 0.2s ease-in-out;
}
.searchlist ul li:hover{
	background-color: #f2f2f2;
}
.searchlist ul li a{
	color: #333;
}
.searchlist ul li a:hover{
	color: #0098df;
}

@media (max-width: 767px) {
.newslist ul li a{
	width: 100% ;
	float: left;
}
}
/*************************
*******tech & career CSS******
**************************/
.tech { display: inline-block; width: 100%;margin: 12px 0 35px; }
.tech .list { float: left; display: inline-block; width: 100%;padding: 0;border: 1px solid #ddd;-webkit-border-top-right-radius: 20px;-webkit-border-bottom-right-radius: 20px;-moz-border-radius-topright: 20px;-moz-border-radius-bottomright: 20px;border-top-right-radius: 20px;border-bottom-right-radius: 20px;}
.tech .list .title { float: left;display: inline-block; position: relative;width: 300px; height: 100%; overflow: hidden; vertical-align: middle; }
.tech .list .title span.tt1 { display: block; position: relative; z-index: 1; width: 100%; color: #fff; text-align: center;font-size: 24px; font-weight: 500;padding-right: 20px; }
.tech .list .title.hig1 span.tt1 { line-height: 80px; }
.tech .list .title.hig2 span.tt1 { line-height: 135px; }
.tech .list .title.hig3 span.tt1 { line-height: 135px; }
.tech .list .title.hig4 span.tt1 { line-height: 105px; }
.tech .list .title.hig5 span.tt1 { line-height: 80px; }
.tech .list .title.hig1 { height: 85px; }
.tech .list .title.hig2 { height: 140px; }
.tech .list .title.hig3 { height: 140px; }
.tech .list .title.hig4 { height: 110px; }
.tech .list .title.hig5 { height: 85px; }
.tech .list .title:before { pointer-events: none; content: ""; position: absolute; z-index: 0; top: 0; left: -90px; width: calc(100% + 50px); height: 100%; }
.tech .list .title.color1:before { -moz-transform-origin: bottom; -webkit-transform-origin: bottom; -ms-transform-origin: bottom; transform-origin: bottom; -moz-transform: skewX(-20deg); -webkit-transform: skewX(-20deg); -ms-transform: skewX(-20deg); transform: skewX(-20deg); background-image: -moz-linear-gradient(140deg, rgb(0, 145, 158) 0%, rgb(0, 145, 158) 100%); background-image: -webkit-linear-gradient(140deg, rgb(0, 145, 158) 0%, rgb(0, 145, 158) 100%); background-image: -ms-linear-gradient(140deg, rgb(0, 145, 158) 0%, rgb(0, 145, 158) 100%); }
.tech .list .title.color2:before { -moz-transform-origin: bottom; -webkit-transform-origin: bottom; -ms-transform-origin: bottom; transform-origin: bottom; -moz-transform: skewX(-14deg); -webkit-transform: skewX(-14deg); -ms-transform: skewX(-14deg); transform: skewX(-14deg); background-image: -moz-linear-gradient(140deg, rgb(58, 68, 162) 0%, rgb(58, 68, 162) 100%); background-image: -webkit-linear-gradient(140deg, rgb(58, 68, 162) 0%, rgb(58, 68, 162) 100%); background-image: -ms-linear-gradient(140deg, rgb(58, 68, 162) 0%, rgb(58, 68, 162) 100%); }
.tech .list .title.color3:before { -moz-transform-origin: bottom; -webkit-transform-origin: bottom; -ms-transform-origin: bottom; transform-origin: bottom; -moz-transform: skewX(-14deg); -webkit-transform: skewX(-14deg); -ms-transform: skewX(-14deg); transform: skewX(-14deg); background-image: -moz-linear-gradient(140deg, rgb(7, 150, 185) 0%, rgb(7, 150, 185) 100%); background-image: -webkit-linear-gradient(140deg, rgb(7, 150, 185) 0%, rgb(7, 150, 185) 100%); background-image: -ms-linear-gradient(140deg, rgb(7, 150, 185) 0%, rgb(7, 150, 185) 100%); }
.tech .list .title.color4:before { -moz-transform-origin: bottom; -webkit-transform-origin: bottom; -ms-transform-origin: bottom; transform-origin: bottom; -moz-transform: skewX(-16deg); -webkit-transform: skewX(-16deg); -ms-transform: skewX(-16deg); transform: skewX(-16deg); background-image: -moz-linear-gradient(140deg, rgb(27, 192, 143) 0%, rgb(27, 192, 143) 100%); background-image: -webkit-linear-gradient(140deg, rgb(27, 192, 143) 0%, rgb(27, 192, 143) 100%); background-image: -ms-linear-gradient(140deg, rgb(27, 192, 143) 0%, rgb(27, 192, 143) 100%); }
.tech .list .title.color5:before { -moz-transform-origin: bottom; -webkit-transform-origin: bottom; -ms-transform-origin: bottom; transform-origin: bottom; -moz-transform: skewX(-20deg); -webkit-transform: skewX(-20deg); -ms-transform: skewX(-20deg); transform: skewX(-20deg); background-image: -moz-linear-gradient(140deg, rgb(100, 196, 10) 0%, rgb(100, 196, 10) 100%); background-image: -webkit-linear-gradient(140deg, rgb(100, 196, 10) 0%, rgb(100, 196, 10) 100%); background-image: -ms-linear-gradient(140deg, rgb(100, 196, 10) 0%, rgb(100, 196, 10) 100%); }
.tech .list ul.txt { float: left; display: inline-block; width: calc(100% - 300px);padding: 12px 0 8px 15px;margin: 0; }
.tech .list ul.txt li { width: calc(100% - 20px);margin: 0 0 0 20px;padding: 0;line-height: 1.8em;}
.tech .icontech { display: inline-block; width: 100%; height: 50px; margin: 0;padding: 0;background: url(../line8.png) no-repeat center center; }

.career1 { display: inline-block; width: 100%; }
.career1 dl { float: left; display: inline-block; width: calc(100%/3);padding: 0 20px 0 0;margin: 0 0 20px; }
.career1 dt { display: inline-block; width: auto;font-size: 18px;color: #fff;font-weight: normal;background: #002d96;border-radius: 50px;padding: 7px 25px; margin: 0 0 10px;}
.career1 dd { display: inline-block; width: 100%;font-size: 16px;padding: 3px 0 3px 20px;margin: 0;background: url(../line9.gif) no-repeat 7px 13px; }
.career2 { display: inline-block; width: 100%;margin: 20px 0 0;padding: 30px 0 0; border-top: 1px dashed #ddd;}
.career2 .t1 { display: inline-block; width: 100%;font-size: 30px;color: #333;padding: 0; margin: 10px 0 20px;text-align: center;}
.career2 .cleft { float: left; display: inline-block; width: 50%;margin: 5px 0;padding: 0;}
.career2 table {
	width:100%;
	max-width: 100%;
	border:none;
	border-collapse:collapse;
	background: #fff;
}
.career2 table tr {
	border-collapse:collapse;
}
.career2 table td {
	visibility: visible;
	padding: 2px;
	text-align: center;
}
.career2 table img {
	max-width: 100%;
}

@media (min-width: 1200px) {
.tech .list { width: calc(100%/5 - 24px);}
.tech .list .title { width: 100%;}
.tech .list .title.hig1 span.tt1, .tech .list .title.hig2 span.tt1, .tech .list .title.hig3 span.tt1, .tech .list .title.hig4 span.tt1, .tech .list .title.hig5 span.tt1 { line-height: 65px;font-size: 22px; }
.tech .list .title.hig1, .tech .list .title.hig2, .tech .list .title.hig3, .tech .list .title.hig4, .tech .list .title.hig5 { height: 65px; }
.tech .list ul.txt { width: 100%;padding: 12px 0 12px 30px;min-height: 150px; }
.career1 dl { width: 100%;padding: 0; }
.tech .icontech { float: left; display: inline-block; width: 30px; height: 50px; margin: 0;padding: 0;background: url(../line8-1.png) no-repeat center center; }
}

@media (max-width: 1199px) {
.tech .list { width: 100%;}
}

@media (max-width: 600px) {
.tech .list .title.hig1 span.tt1, .tech .list .title.hig2 span.tt1, .tech .list .title.hig3 span.tt1, .tech .list .title.hig4 span.tt1, .tech .list .title.hig5 span.tt1 { line-height: 45px; }
.tech .list .title.hig1, .tech .list .title.hig2, .tech .list .title.hig3, .tech .list .title.hig4, .tech .list .title.hig5 { height: 50px; }
.tech .list ul.txt { width: 100%;padding: 12px 0 12px 30px; }
.career1 dl { width: 100%;padding: 0; }
.career2 .cleft { width: 100%;}
}
/*************************
*******products CSS******
**************************/
.products-info {
	width: 100%;
	float: left;
	padding: 0px;
	margin: 0 0 20px;
	border: 6px solid #eee;
}
.products-title {
	width: 100%;
	display: inline-block;
	padding: 0;
	margin: 25px 0 15px;
	background: #dbecf3;
}
.products-title span {
	font-size: 26px;
	color: #fff;
	display: inline-block;
	float: left;
	padding: 5px 30px 5px 15px;
	margin: 0;
	background: #002d96 url(../line7.gif) no-repeat right top;
	/*transform:translate(0,0) skewX(-10deg);*/
}
#product-ov {
	width: 100%;
	float: left;
}
#product-ov ul {
	width: 50%;
	float: left;
	margin: 0;
	padding: 0;
}
#product-ov li { 
	display:block;
	list-style:none;
	margin: 0;
	padding: 0;
}
#product-ov li a { 
	display:block;
	width:50%;
	float: left;
	text-decoration: none;
	padding: 15px 1.5%;
	margin: 0;
}
#product-ov li .pro-img { 
	width:100%;
	float: left;
	overflow: hidden;
	padding: 3px;
	border: 3px solid #fff;
	background-color: #fff;
	position: relative;
	-webkit-box-shadow: 0 0 5px rgba( 0, 0, 0, .15 );
	box-shadow: 0 0 5px rgba( 0, 0, 0, .15 );
	-webkit-transition: all 0.2s ease-in-out;
     -moz-transition: all 0.2s ease-in-out;
      -ms-transition: all 0.2s ease-in-out;
       -o-transition: all 0.2s ease-in-out;
          transition: all 0.2s ease-in-out;
}
#product-ov li a:hover .pro-img {
	border: 3px solid #0072bc;
	-webkit-box-shadow: 0 0 0 rgba( 0, 0, 0, 0 );
	box-shadow: 0 0 0 rgba( 0, 0, 0, 0 );
}
#product-ov ul li .pro-name {
	font-size: 1em;
	line-height: 1.4em;
	color: #000000;
	margin-top: 10px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-o-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	-webkit-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	-moz-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	display: inline-block;
	width: 100%;
	text-align: center;
}
#product-ov li a:hover .pro-name {
	color: #00aeef;
}
#product-ov ul li .productimg {
	width: 100%;
	height: 180px;
	outline: none;
	display: inline-block;
	float: left;
}
#product-ov ul li a:hover .productimg {
	opacity: 0.7;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

#product-ov1 {
	width: 100%;
	float: left;
}
#product-ov1 ul {
	display: block;
	width: 100%;
	float: left;
	text-decoration: none;
	margin: 0;
	padding:0;
}
#product-ov1 ul li {
	display: block;
	width: 100%;
	float: left;
	text-decoration: none;
	list-style-type: none;
	padding: 8px;
	background-color: #FFF;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	margin: 10px 0;
	border: 1px solid #EBEBEB;
	-webkit-box-shadow: 0 0 5px rgba( 0, 0, 0, .1 );
	box-shadow: 0 0 5px rgba( 0, 0, 0, .1 );
}
#product-ov1 ul li:hover {
	text-decoration:none;
	/*background-color:#edf6fd;*/
	border: 1px solid #0072bc;
	-webkit-box-shadow: 0 0 5px rgba( 0, 0, 0, 0 );
	box-shadow: 0 0 5px rgba( 0, 0, 0, 0 );
}
#product-ov1 .products-det {
	float: left;
	display: inline-block;
	width: calc(100% - 250px);
	margin: 0;
	padding: 5px 5px 0 25px;
}
#product-ov1 .products-det h3 {
	font-size: 20px;
	line-height: 28px;
	color: #0067b4;
	-o-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	-webkit-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	-moz-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	margin: 7px 0;
	padding: 0 0 0 17px;
	background: url(../icon2.gif) no-repeat 5px 10px;
}
#product-ov1 li:hover .products-det h3 {
	color: #d9232e;
	text-decoration: none;
	background: url(../icon3.gif) no-repeat 5px 10px;
}
#product-ov1 .products-det p {
	font-size: 15px;
	line-height: 24px;
	color: #666;
	margin: 0;
	padding: 0;
}
#product-ov1 .products-img {
	float: left;
	width: 250px;
}
#product-ov1 .productsimg1 {
	width: 100%;
	height: 200px;
	outline: none;
	display: inline-block;
	float: left;
	opacity: 1;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}
#product-ov1 ul li a:hover .productsimg1 {
	opacity: 0.7;
}
@media (min-width: 992px) and (max-width: 1199px) {
#product-ov ul {
	width: 100%;
	float: left;
	margin: 0;
	padding: 0;
}
#product-ov1 .productsimg1 {
	height: 200px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
#product-ov ul {
	width: 50%;
	float: left;
	margin: 0;
	padding: 0;
}
#product-ov ul li .productimg {
	height: 150px;
}
#product-ov1 .productsimg1 {
	height: 200px;
}
}
.product-pv {
	width: 100%;
	float: left;
	margin: 0 0 15px;
}
.product-pv ul {
	width: 50%;
	float: left;
	margin: 0;
	padding: 0;
}
.product-pv li { 
	display:block;
	list-style:none;
	margin: 0;
	padding: 0;
}
.product-pv li a { 
	display:block;
	width:47%;
	float: left;
	text-decoration: none;
	padding: 0;
	margin: 15px 1.5%;
	overflow: hidden;
	-webkit-box-shadow: 0 0 5px rgba( 0, 0, 0, .2 );
	box-shadow: 0 0 5px rgba( 0, 0, 0, .2 );
}
.product-pv li a:hover { 
	-webkit-box-shadow: 0 2px 5px rgba( 0, 45, 150, .5 );
	box-shadow: 0 2px 5px rgba( 0, 45, 150, .5 );
}
.product-pv li .pro-img { 
	width:100%;
	float: left;
	padding: 5px;
	background-color: #fff;
	position: relative;
	-webkit-transition: all 0.2s ease-in-out;
     -moz-transition: all 0.2s ease-in-out;
      -ms-transition: all 0.2s ease-in-out;
       -o-transition: all 0.2s ease-in-out;
          transition: all 0.2s ease-in-out;
}
.product-pv ul li .pro-name {
	font-size: 1.1em;
	line-height: 1.4em;
	color: #000000;
	margin: 0;
	padding: 10px 5px;
	-o-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	-webkit-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	-moz-transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	transition: color .20s linear, background-color .20s linear, border-color .20s linear;
	display: inline-block;
	width: 100%;
	text-align: center;
	background: #eee;
}
.product-pv li a:hover .pro-name {
	color: #fff;
	background: #008bcd;
}
.product-pv ul li .productimg {
	width: 100%;
	height: 180px;
	outline: none;
	display: inline-block;
	float: left;
}
.product-pv ul li a:hover .productimg {
	opacity: 0.7;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}
@media (max-width: 767px) {
#product-ov ul, .product-pv ul {
	width: 100%;
	float: left;
	margin: 0;
	padding: 0;
}
#product-ov1 .products-det {
	width: calc(100% - 250px);
	padding: 5px 5px 0 20px;
}
#product-ov1 .products-img {
	width: 250px;
}
#product-ov1 .productsimg1 {
	height: 200px;
}
}
@media (max-width: 600px) {
#product-ov li a { 
	width:100%;
	padding: 12px 0;
}
.product-pv li a { 
	width:100%;
	margin: 15px 0;
}
#product-ov ul li .productimg, .product-pv ul li .productimg {
	height: 160px;
}
#product-ov1 .products-det {
	width: 100%;
	padding: 5px 5px 0 0;
}
#product-ov1 .products-img {
	width: 100%;
}
#product-ov1 .productsimg1 {
	height: 180px;
}
}
/* 資訊 - 詳細頁 */
#product-ov2 {
	width: 100%;
	float: left;
	margin-top: 10px;
}
#product-ov2 img {
  width:auto;
  max-width:100%;
}
#product-ov2 .info {
	float: left;
	width: 100%;
	margin: 25px 0 0;
	padding: 0;
}
#product-ov2 .info h2 {
	font-size: 2em;
	line-height: 1.3em;
	color: #0056cb;
	font-weight: 300;
	display: inline-block;
	width: 100%;
	margin: 0;
	padding: 0 0 0 30px;
	background: url(../info-button.svg) no-repeat left 8px;
	background-size: 24px auto;
}
#product-ov2 .info .group {
  margin: 0;
  padding: 20px 0;
  width:100%;
  float:left;
}
#product-ov2 .info .goods-btn {
	float: left;
	width: 100%;
	margin: 20px 0 30px;
	padding: 0px;
}
#product-ov2 .info .goods-btn .fbshare {
	float: left;
	display: block;
	width: 150px;
	height: 25px;
	margin: 18px 0 0 15px;
	padding: 0;
}
#product-ov2 .info .goods-btn button {
	font-family: \5FAE\8EDF\6B63\9ED1\9AD4, \65B0\7D30\660E\9AD4, Arial, Helvetica, sans-serif;
	float: left;
	width: auto;
	display: block;
	margin:5px 0;
	text-align: left;
	border: none;
	transition: background 0.3s;
	background: url(../shopping-icon.svg) no-repeat 25px 11px; 
	background-size: 20px;
}
#product-ov2 .info .goods-btn .btn-primary{
	font-size: 1.4em;
    line-height: 28px;
    padding: 7px 30px 9px 55px;
    color: #fff;
    border: #61c1bd solid 1px;
    background-color: #61c1bd;
    -webkit-box-shadow: 0 0 5px rgba( 0, 0, 0, .1 );
	box-shadow: 0 0 5px rgba( 0, 0, 0, .1 );
}
#product-ov2 .info .goods-btn .btn-primary:hover{
	color: #fff;
    text-decoration: none;
    border: #4faba7 solid 1px;
    background-color: #4faba7;
    -webkit-box-shadow: 0 0 5px rgba( 0, 0, 0, 0 );
	box-shadow: 0 0 5px rgba( 0, 0, 0, 0 );}
#product-ov2 .info .goods-btn .btn-primary[disabled] {
    border: #a3d9d7 solid 1px;
    background-color: #a3d9d7;
    -webkit-box-shadow: 0 0 5px rgba( 0, 0, 0, 0 );
	box-shadow: 0 0 5px rgba( 0, 0, 0, 0 );}
#product-ov2 .info .goods-btn .btn-primary:hover[disabled] {
    border: #a3d9d7 solid 1px;
    background-color: #a3d9d7;
    -webkit-box-shadow: 0 0 5px rgba( 0, 0, 0, 0 );
	box-shadow: 0 0 5px rgba( 0, 0, 0, 0 );}
#product-ov2 .brief {
	line-height: 26px;
	float: left;
	width: 100%;
	margin: 30px 0 0;
	padding: 30px 0;
	border-top-width: 3px;
	border-top-style: solid;
	border-top-color: #33006a;
}
.productpicbig {
	float: left;
	padding: 5px;
	width: 100%;
	border: 1px dotted #ccc;
	margin: 0;
}
@media (min-width: 1200px) {
/*#product-ov2 .info {
	float: right;
	width: calc(100% - 640px);
	margin: 0;
}
.productpicbig {
	width: 600px;
}*/
}
@media only screen and (max-width: 480px) {
#product-ov2 .info h2 {
	font-size: 1.8em;
	line-height: 1.3em;
}
#product-ov2 .info .goods-btn ul.style-ul li {
    float: none;
    width: 100%;
}
#product-ov2 .info .goods-btn .btn-primary{
	width: 100%;	
}
}

.download {
	width: 100%;
	float: left;
}
.download .title {
	width: 100%;
	float: left;
	font-size: 1.3em;
	color: #010080;
	padding: 7px 0 9px 30px;
	margin: 0;
	background-image: url(../icon7.png);
	background-repeat: no-repeat;
	background-position: 15px 19px;
	border-bottom: 3px solid #004a87;
}
.download ul {
	width: 100%;
	float: left;
	margin: 0;
	padding: 0;
}
.download li {
	display:block;
	width:100%;
	float: left;
	font-size: 16px;
	list-style:none;
	padding: 12px 10px 12px 30px;
	margin: 0;
	background-image: url(../icon9.gif);
	background-repeat: no-repeat;
	background-position: 15px 24px;
	border-bottom: 1px dashed #E3E3E3;
}
.download li:hover { 
	background-color: #f7f7f7;
}
.download li .download-w {
	display:inline-block;
	width: calc(100% - 125px);
	padding: 0;
	margin: 0;
}
.download li .download-d a {
	display:inline-block;
	width:115px;
	float: right;
	font-size: 13px;
	line-height: 22px;
	color: #333;
	padding: 3px 15px 3px 33px;
	margin: 0;
	background: #fff url(../icon-download.png) no-repeat 10px 9px;
	border: 1px solid #ccc;
	border-radius: 30px;
}
.download li .download-d a:hover {
	color: #fff;
	background: #d9232e url(../icon-download1.png) no-repeat 10px 9px;
	border: 1px solid #fff;
}
@media (max-width: 480px) {
.download li .download-w {
	width: 100%;
}
.download li .download-d a {
	width:100%;
	float: left;
	margin: 10px 0 0;
}
}
/*選項卡*/
.tab{
    margin-top: 40px;
	width: 100%;
	float: left;
}
.tab ul{
    padding: 0;
	margin: 0;
}
.tab .nav-tabs{
    border:none;
    /*border-bottom: 1px solid #e4e4e4;*/
	background: #b1dafa;
}
.nav-tabs li{
	padding: 0;
	margin: 0;
	list-style-type: none;
}
.nav-tabs li a{
	font-size: 16px;
	line-height: 21px;
    padding: 10px 30px;
    border:1px solid #b1dafa;
    background: #b1dafa;
    color:#666;
    border-radius: 0;
    margin-right: 0;
    transition: all 0.3s ease-in 0s;
}
.nav-tabs li a:hover{
    border:1px solid #b1dafa;
    background: #fff;
    color: #0072bc;
}
.nav-tabs li a i{
    display: inline-block;
    text-align: center;
    margin-right:10px;
}
.nav-tabs li:last-child{
    /*border-right:1px solid #ededed;*/
}
.nav-tabs li.active a,
.nav-tabs li.active a:focus,
.nav-tabs li.active a:hover{
    border: 1px solid #0072bc;
	font-size: 16px;
	background: #0072bc;
    color: #fff;
	font-weight: bold;
    padding: 12px 30px 13px;
	margin-top: -5px;
}
.tab .tab-content{
	width: 100%;
	float: left;
    padding: 35px 0;
    /*box-shadow:0px 1px 0px #808080;*/
}
@media only screen and (max-width: 767px){
    .tab{
         margin-top: 15px;
	}
	.nav-tabs li{
        width:100%;
        margin-bottom: 0;
    }
    .nav-tabs li a{
        padding: 12px;
    }
    .nav-tabs li.active a,
    .nav-tabs li.active a:focus,
    .nav-tabs li.active a:hover{
        padding: 12px;
        margin-top: 0;
    }
}

/*產品放大*/
.imagecontainer {
	width: 100%;
	text-align: center;
	margin: 5px 0 0;
	padding: 0;
	float: left;
	background-color: #F2F2F2;
}
.imagecontainer ul {
	width: 100%;
	float: left;
	padding: 0;
	margin: 8px 0 0;
}
.imagecontainer li {
	display: inline-block;
	margin: 2px; 
	border-color: #ccc;
	border: 0.2em solid rgba( 255, 255, 255, .5 ); /* 10 */

	-webkit-box-shadow: 0 0 0.313em rgba( 0, 0, 0, .1 ); /* 5 */
	box-shadow: 0 0 0.313em rgba( 0, 0, 0, .1 ); /* 5 */

	-webkit-transition: -webkit-box-shadow .3s ease, border-color .3s ease;
	transition: box-shadow .3s ease, border-color .3s ease;
	width: 70px; 
	background:#FFF;
    overflow:hidden;
	list-style: none;
}
.imagecontainer li:hover,
.imagecontainer li:focus {
	border-color: #fff;
	-webkit-box-shadow: 0 0 0.938em rgba( 0, 0, 0, .25 ); /* 15 */
	box-shadow: 0 0 0.938em rgba( 0, 0, 0, .25 ); /* 15 */
}
.imagecontainer li .productimg {
	width: 100%;
	height: 60px;
	outline: none;
	display: inline-block;
	float: left;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}
.imagecontainer li:hover .productimg {
	opacity: 0.7;
}

/*產品放大*/
div.container_img {
	width:100%;
	height:500px;
	overflow:hidden;
	position:relative;
	display:block;
	text-align:center;
	vertical-align:middle;
	margin: 0;
	padding: 0;
	float: left;
}
div.container_img:after {
    padding-top: 56.25%;
    content:"";
    display: block;
}
div.container_img img {
	position:absolute;
    top:0;
    bottom:0;
    right:0;
    left:0;
    margin:auto;
	max-height:500px;
	max-width:100%;
}
@media only screen and (max-width: 767px){
div.container_img {
	height:300px;
}
div.container_img img {
	max-height:300px;
}
}

.block-meet-family{margin:0 0 32px}.block-meet-family .heading-01{text-align:center;max-width:80%;margin:0 auto}.block-meet-family .meet-family-families{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding-top:24px}.block-meet-family .family-item{background-color:#2e6bb8;position:relative;width:100%;overflow:hidden;transition-duration:.5s;min-height:200px;height:62vw;max-height:400px;font-size:1.7rem;z-index:1}.block-meet-family .family-item picture{display:block;width:100%;height:auto;opacity:.7;transition-duration:.5s}.block-meet-family .family-item picture img,.block-meet-family .family-item picture source{width:100%;height:auto;min-width:100%;min-height:100%;position:absolute;left:50%;top:50%;-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);transition-duration:.5s}.block-meet-family .family-item:hover{box-shadow:0 4px 25px rgba(0,0,0,.3)}.block-meet-family .family-item:hover picture{opacity:1}.block-meet-family .family-item:hover picture img,.block-meet-family .family-item:hover picture source{-ms-transform:translate(-50%,-50%) scale(1.02);transform:translate(-50%,-50%) scale(1.02)}.block-meet-family .family-link{height:100%;width:100%;color:#fff;text-decoration:none;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-direction:column;flex-direction:column}.block-meet-family .family-item-content{top:24px;right:24px;bottom:24px;left:24px;position:absolute}.block-meet-family .family-logo{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.block-meet-family .family-logo img{max-width:40%;width:auto;height:auto}.block-meet-family .family-title{max-width:300px;margin:0 auto;line-height:1.4}@media (min-width:768px){.block-meet-family{margin:0 auto 128px}.block-meet-family .block-wrapper{text-align:center;margin-bottom:2em}.block-meet-family .meet-family-families{-ms-flex-direction:row;flex-direction:row;margin:0 auto;max-width:1472px}.block-meet-family .family-item{height:100vh;max-height:704px;width:100%}.block-meet-family .family-item picture{overflow:hidden;height:100%}.block-meet-family .family-item picture img,.block-meet-family .family-item picture source{width:auto}.block-meet-family .family-link{color:#fff;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100%;-ms-flex-pack:justify;justify-content:space-between;text-decoration:none;width:100%;text-align:center}.block-meet-family .family-item-content{top:24px;bottom:50px;left:50px;right:50px;position:absolute}.block-meet-family .family-logo{height:94px;-ms-flex-pack:center;justify-content:center}.block-meet-family .family-logo img{max-height:94px}}@media (min-width:1280px){.block-meet-family .heading-01{font-size:4.8rem}.block-meet-family .double{overflow:hidden}.block-meet-family .double .family-item{font-size:3.2rem}.block-meet-family .double .family-item .family-title{max-width:440px}.block-meet-family .double .family-item:first-child{margin-right:-35px}.block-meet-family .double .family-item:nth-child(2){margin-right:-35px;z-index:2;-ms-transform:skewX(-5deg);transform:skewX(-5deg)}.block-meet-family .double .family-item:nth-child(2)>*{-ms-transform:skewX(5deg);transform:skewX(5deg)}.block-meet-family .double .family-item:nth-child(2) picture{width:calc(100% + 70px);left:-35px;position:relative}.block-meet-family .double .family-item:hover:nth-child(2) picture source .block-meet-family .double .family-item:hover:nth-child(2) picture img{-ms-transform:translate(-50%,-50%) scale(1.02) skewX(-8deg);transform:translate(-50%,-50%) scale(1.02) skewX(-8deg)}.block-meet-family .triple .family-item{font-size:3.2rem}.block-meet-family .triple .family-item:first-child{margin-right:-35px}.block-meet-family .triple .family-item:nth-child(2){z-index:2;-ms-transform:skewX(-5deg);transform:skewX(-5deg)}.block-meet-family .triple .family-item:nth-child(2)>*{-ms-transform:skewX(5deg);transform:skewX(5deg)}.block-meet-family .triple .family-item:nth-child(2) picture{width:calc(100% + 70px);left:-35px;position:relative}.block-meet-family .triple .family-item:hover:nth-child(2) picture source .block-meet-family .triple .family-item:hover:nth-child(2) picture img{-ms-transform:translate(-50%,-50%) scale(1.02) skewX(-8deg);transform:translate(-50%,-50%) scale(1.02) skewX(-8deg)}.block-meet-family .triple .family-item:nth-child(3){margin-left:-35px}}