﻿@charset "utf-8";
/*************************
*******pagestyle CSS******
**************************/
.edit strong {
  font-weight: bold;
}
.edit em{
    font-style: italic;
}
.edit hr {
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid #eee;
}
.edit h1, h2, h3, h4, h5, h6 
 { 
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1em;
  color: inherit;
}
.edit h1, h2, h3
{
  margin-top: 20px;
  margin-bottom: 10px;
}
.edit h4, h5, h6
 {
  margin-top: 10px;
  margin-bottom: 10px;
}
.edit h1 {
  font-size: 2.5em;
}
.edit h2 {
  font-size: 2em;
}
.edit h3 {
  font-size: 1.6em;
}
.edit h4 {
  font-size: 1.3em;
}
.edit h5{
  font-size: 1.1em;
}
.edit h6{
  font-size: 0.9em;
}
.edit p {
  margin: 5px 0 20px;
}
.edit ul, .edit ol {
  margin-top: 0;
  margin-bottom: 20px;
}
.edit ul{
    padding-left: 35px;
    list-style-type: disc;
}
.edit ol{
    padding-left: 35px;
    list-style-type: decimal;
}
.edit li{
    margin: 1px 0 3px;
}

.edit sub, sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}
.edit sup {
  top: -.5em;
}
.edit sub {
  bottom: -.25em;
}
.edit address {
    margin-bottom: 20px;
    font-style: italic;
    line-height: 1.42857;
}
#pcontent {
	float: left;
	width: 100%;
	display: inline-block;
	position: relative;
	padding: 25px 0 0;
}
.pageright {
	float: right;
	width: calc(100% - 250px);
	padding: 0 0 0 50px;
	margin: 10px 0 0;
}
.page-header {
	padding: 0 0 15px;
	border-style: none;
	width: 100%;
	margin: 0;
	font-size: 1.7em;
	line-height: 1.4em;
	color: #000;
	font-weight: bold;
	display: inline-block;
	border-bottom: 1px dashed #ccc;
}
.page-header  a.iqlist {
	float:right;
	font-size:14px;
	font-weight:normal;
	line-height:20px;
	padding: 6px 18px;
	margin: 5px 0 0 10px;
	background-color: #aaa;
	color: #FFF;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	text-decoration: none;
	font-style: normal;
}
.page-header a:hover.iqlist {
	background-color: #3a5c90;
	color: #FFF;
	text-decoration: none;
}
.pbox1 {
	float: left;
	width: 100%;
	display: inline-block;
	min-height: 250px;
	margin: 35px 0 40px;
	/*word-break: break-all;*/
}
.pbox1 img {
	display: inline-block;
	height: auto;
	max-width: 100%;
}
.pbox1 table {max-width: 100%;border-collapse: collapse;}
.pbox1 table td {padding: 5px 3px;}

.qlinks {
	display: inline-block;
	width: 100%;
	background: #f8f4ed;
	position: relative;
}
.breadcrumb{
	float: left;
	width: 100%;
	display: inline-block;
	list-style: none;
	border-radius: 0;
	font-size: 14px;
	text-align: right;
	margin: 0;
	padding: 2px 5px;
	background-color: transparent;
}
.breadcrumb>li{display:inline-block;color:rgba(0,0,0,0.5);text-align: center;margin: 0;padding: 0;}
.breadcrumb>li+li:before{padding:0 2px;color:rgba(0,0,0,0.3);content:">\00a0";}
.breadcrumb>.active{color:#183883;}
.breadcrumb>li a{color:rgba(0,0,0,0.5);}
.breadcrumb>li a:hover{color:#e01b0b;text-decoration:none;}
@media (min-width: 992px) and (max-width: 1299px) {

}
@media (max-width: 991px) {
.pageright {width: 100%;padding: 0;}
.page-header {font-size: 1.8em;}
.pbox1 {margin: 35px 0;}
}
@media (max-width: 767px) {
.pbox1 table {max-width: 100%;border-collapse: collapse;/*table-layout: fixed;*/}
.pbox1 table td {/*table-layout:fixed;*/}
}
@media (max-width: 600px) {

}

/*************************
******* about CSS ******
**************************/
#about {
	float: left;
	width: 100%;
	display: inline-block;
    position: relative;
	margin: 30px 0;
}
.about1 {
	float: left;
	width: 100%;
	display: inline-block;
	margin: 0 0 40px;
	padding: 0 15px;
	text-align: center;
}
.about1 h3.title, .about3 h3.title {
	font-size: 1.8em;
	line-height: 1.3em;
	color: #093171;
	font-weight: bold;
	text-align: center;
	padding-bottom: 25px;
	margin: 0 0 30px;
	background: url(../icon9.png) no-repeat center bottom ;
}
.about2 {
	float: left;
	width: 100%;
	display: inline-block;
	margin: 0;
	padding: 100px 0 80px;
}
.about2 h3.title {
	font-size: 1.8em;
	line-height: 1.3em;
	color: #093171;
	font-weight: bold;
	padding: 10px 5%;
	margin: 0;
}
.about2 ul {
	float: left;
	display: inline-block;
	width: 100%;
	padding: 20px 5%;
	margin: 0;
}
.about2 ul li {
	float: left;
	width: 100%;
	display: inline-block;
	list-style: none;
	margin: 5px 0;
	padding: 0;
	font-size: 18px;
	color: #333;
}
.about2 ul li .num {
	display: inline-block;
	width: 20px;
	height: 20px;
	margin: -2px 10px 0 0;
	padding: 0;
	font-size: 15px;
	line-height: 20px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	border-radius: 50%;
	background: #093171;
}
.about3 {
	float: left;
	width: 100%;
	display: inline-block;
	margin: 60px 0 40px;
}
.about1 .itemarea, .about3 .itemarea {
	display: flex;
	flex-flow: row wrap;
}
.pfbox {
	float: left;
	width: calc(100%/4 - 8px);
	display: inline-block;
	margin: 15px 10px 15px 0;
	padding: 0 0 20px;
	border: 3px solid transparent;
}
.pfbox:last-child {
	margin: 15px 0;
}
.pfbox-img{
    -moz-border-image: -moz-linear-gradient(top left, #123265 0%, #d8d8d8 100%);
	-webkit-border-image: -webkit-linear-gradient(top left, #123265 0%, #d8d8d8 100%);
	border-image: linear-gradient(to bottom right, #123265 0%, #d8d8d8 100%);
	border-image-slice: 1;
}
.pfbox h4.card-title {
	width: 100%;
	display: inline-block;
	margin: 0 0 15px;
	padding: 100px 0 15px;
	font-size: 1.5em;
	line-height: 1.4em;
	font-weight: bold;
	color: #e01b0b;
	text-align: center;
}
.pfbox h4.card-title.pficon1 {
	background: #ededed url(../profession1.svg) no-repeat center 25px;
	background-size: 70px;
}
.pfbox h4.card-title.pficon2 {
	background: #ededed url(../profession2.svg) no-repeat center 25px;
	background-size: 67px;
}
.pfbox h4.card-title.pficon3 {
	background: #ededed url(../profession3.svg) no-repeat center 27px;
	background-size: 70px;
}
.pfbox h4.card-title.pficon4 {
	background: #ededed url(../profession4.svg) no-repeat center 25px;
	background-size: 65px;
}
.pfbox ol {
	float: left;
	display: inline-block;
	width: 100%;
	padding: 0 12%;
	margin: 0;
	min-height: 90px;
}
.pfbox li {
	float: left;
	width: 100%;
	margin: 2px 0;
	padding: 0;
	line-height: 1.6em;
}
.pfbox2 {
	float: left;
	width: calc(100%/3 - 10px);
	min-height: 300px;
	display: inline-block;
	margin: 20px 15px 20px 0;
	padding: 1px 1px 20px;
	border: 2px solid transparent;
	background: #f4f3f3;
}
.pfbox2:last-child {
	margin: 20px 0;
}
.pfbox2.pfbox-img{
    -moz-border-image: -moz-linear-gradient(top left, #123265 0%, #d8d8d8 100%);
	-webkit-border-image: -webkit-linear-gradient(top left, #123265 0%, #d8d8d8 100%);
	border-image: linear-gradient(to bottom right, #123265 0%, #d8d8d8 100%);
	border-image-slice: 1;
}
.pfbox2 h4.card-title {
	width: 100%;
	display: inline-block;
	margin: 0 0 15px;
	padding: 15px 0 15px;
	font-size: 1.5em;
	line-height: 1.4em;
	font-weight: bold;
	color: #fff;
	text-align: center;
	background: #093171;
}
.pfbox2 .card-txt {
	width: 100%;
	padding: 0 10%;
	margin: 5px 0;
}
.pfbox2 ul {
	float: left;
	display: inline-block;
	width: 100%;
	padding: 0 12%;
	margin: 5px 0;
}
.pfbox2 li {
	float: left;
	width: 100%;
	margin: 2px 0;
	padding: 0;
	line-height: 1.6em;
	text-align: left;
}
@media (max-width: 991px) {
.pfbox {width: calc(100%/2 - 20px);margin: 15px 10px;}
.pfbox:last-child {margin: 15px 10px;}
}
@media (max-width: 768px) {
.about2 {padding: 50px 0 40px;}
.pfbox2 {width: 100%;min-height: inherit;margin: 15px 0;}
}
@media (max-width: 600px) {
.pfbox {width: 100%;margin: 15px 0;min-height: inherit;}
.pfbox:last-child {margin: 15px 0;}
.pfbox ol {	padding: 0 10%;min-height: inherit;}

}

/*************************
******* contact CSS ******
**************************/
#cform {
	float: left;
	width: 100%;
}
#contact {
	float: left;
	width: 100%;
}
#contact .contactform {
	float: left;
	width: 100%;
	padding: 45px 18%;
	background: #eff0f2;
	border-radius: 5px;
	margin: 30px 0 60px;
}
#contact .text {
	float: left;
	width: 100%;
	line-height: 24px;
	margin: 0 0 20px 0;
	color: #444;
	padding-bottom: 20px;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #ccc;
}
#inquire {
	float: left;
	width: 100%;
	padding: 45px 5%;
	background: #eff0f2;
	border-radius: 5px;
	margin: 40px 0;
}
#inquire .text {
	float: left;
	width: 100%;
	line-height: 24px;
	margin: 40px 0 20px 0;
	color: #444;
	padding-bottom: 20px;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #ccc;
}
#contact .control-label, #inquire .control-label {
	text-align: left;
	padding-bottom: 3px;
}
#contact label, #inquire label {
	padding-left: 10px;
	float: left;
	width: 100%;
	color: #666;
}
#contact .required, #inquire .required {
	color: #E85500;
	border: 0;
	margin-left:5px;
}
#contact .form-control, #inquire .form-control {
	min-height: 40px;
	border-radius: 0;
	border-color: #ddd;
}
#contact .form-control:focus, #inquire .form-control:focus {
	border-color: #0072bc;
}
.contact2 {
	float: left;
	width: 100%;
	margin: 3px 0 0 0;
}
.contact2 .cleft {
	width: 30%;
	float: left;
}
.contact2 .cright {
	width: 50%;
	float: left;
	margin: 0;
	padding-left: 5%;
}
.contact3 {
	padding-top: 35px;
	float: left;
	width: 100%;
	margin-top: 25px;
	border-top-width: 1px;
	border-top-style: dashed;
	border-top-color: #ccc;
	text-align: center;
}
.contact3 button {
	font-family: \5FAE\8EDF\6B63\9ED1\9AD4, \65B0\7D30\660E\9AD4, Arial, Helvetica, sans-serif;
	width: 220px;
	height: 50px;
	margin-left: 10px;
	text-align: center;
	line-height: 30px;
	font-size: 18px;
	border: none;
	cursor: pointer;
	border-radius: 30px;
	-moz-border-radius: 30px;
	-webkit-border-radius: 30px;
	color: #FFFFFF;
	margin-bottom: 10px;
	transition: background 0.3s;
}
.contact3 .send {
	background: #093171;
}
.contact3 .send:hover{
	background:#3774c9;
}
.contact3 .reset {
	background: #ccc;
}
.contact3 .reset:hover{
	background:#999;
}
.contact5 {
	float: left;
	width: 100%;
	padding: 0;
	margin: 0;
}
.contact5 .google-maps {
	position: relative;
    padding-bottom: 20%;
    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;
}
#contact .box-txt{border: 1px solid #ccc; outline: none; padding: 3px 10px;}
#contact .box-txt:focus{border-color: #2870c4; -webkit-box-shadow: 0 0 1px #2870c4; box-shadow: 0 0 1px #2870c4;}
#contact_form .pull-left{padding-right:10px}

@media (max-width: 1300px) {
#contact .contactform {padding: 35px 10%;}
}
@media (max-width: 991px) {
#contact .contactform {padding: 35px 5%;margin: 30px 0 60px;}
.contact2 .cleft {width: 50%;}
.contact2 .cright {	width: 45%;	float: left;margin: 0;padding-left: 5%;}
}
@media (max-width: 767px) {
.contact2 .cleft {width: 50%;float: left;}
.contact2 .cright {	width: 45%;	float: left;margin: 0; padding-left: 5%;}
.contact5 .google-maps { padding-bottom: 30%;}
}
@media (max-width: 480px) {
#contact .contactform {padding: 30px 5%;margin: 30px 0 60px;}
#contact .control-label {	padding-top: 7px; padding-bottom: 0;}
.contact3 button {width: 100%;margin-left: 0px;}
.contact5 .google-maps { padding-bottom: 60%;}
.contact6 {width: 100%;	padding: 1px 0;}
.contact6:first-child {	width: 100%;padding: 1px 0;}
}

/*************************
******* job CSS ******
**************************/
#job {
    float: left;
    width: 100%;
	margin: 25px 0 60px;
}
.jobbox { 
	float: left;
	width: 100%;
	display: inline-block; 
	padding: 20px 8%; 
	border: 10px solid #f1f0f0; 
}
.joblist { 
	float: left;
	width: 100%;
	display: inline-block; 
	padding: 25px 20px; 
	border-bottom: 1px solid #f1f0f0; 
}
.joblist:nth-child(even) { 
	background: #f1f0f0;
}
.joblist .jtitle { 
	float: left;
	width: 100%;
	display: block; 
	padding: 2px 0 2px 30px; 
	font-size: 24px;
	line-height: 1.2em;
	color: #0063dc;
	background: url(../user.svg) no-repeat 3px 6px;
	background-size: 20px;
}
.joblist .jtitle A:link {color:#0063dc;text-decoration:none}
.joblist .jtitle A:visited {color:#0063dc;text-decoration:none}
.joblist .jtitle A:hover {color:#e01b0b;text-decoration:none}
.joblist ul.jinfo { 
	float: left;
	width: 100%;
	display: block; 
	padding: 0 0 0 30px;
	margin: 10px 0 2px;
	font-size: 15px;
	line-height: 1.6em;
	color: #888;
}
.joblist ul.jinfo li { 
	float: left;
	display:inline-block;
	list-style:none;
	padding: 0 15px;
	margin: 1px 0;
	border-left: 1px solid #ddd;
}
.joblist .jtxt { 
	float: left;
	width: 100%;
	display: block; 
	padding: 0 0 0 30px;
	margin: 5px 0;
}
@media (max-width: 767px) {
.jobbox { padding: 20px 0; }
}
/*************************
******* news CSS ******
**************************/
#news {
    float: left;
    width: 100%;
}
.news-box {
    background: #eee;
    padding: 26px 23px 20px 30px;
    float: left;
    width: calc(100%/2 - 14px);
    margin: 0 7px 20px;
}
.news-day {
    font-size: 16px;
    font-family: Times, "Times New Roman", serif;
    font-style: italic;
    color: #d00000;
	font-weight: 600;
}
.news-day span {
	font-size: 32px;
	font-weight: 500;
}
.news-info {
	width: 98%;
	border-left:1px solid #7f7f7f;
	float: right;
	margin-top: 13px;
	margin-bottom: 3px;
	padding-left: 17px;
}
.news-info h3 {
	font-size: 20px;
	color: #000;
	font-weight: 500;
	padding: 0;
	margin: 0;
	line-height: 1.3em;
}
.news-info h3 a {
	color: #000;
}
.news-info h3 a:hover,.news-info h3 a:focus {
	color:#d00000;
	text-decoration: none;
}
.news-info p {
	font-size: 15px;
	line-height: 1.5em;
	color: #777;
	font-weight: 500;
	padding: 0;
	margin: 0;
	margin-top: 10px;
	width: 85%;
	overflow: hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}
.news-box a.btn-more {
	width: 82px;
	height: 27px;
	line-height: 22px;
	border: 1px solid #8d8d8d;
	float: right;
	text-align: center;
	font-size: 16px;
	font-weight: 500;
	font-family: Times, "Times New Roman", "serif";
	color: #000;
}
.news-box a.btn-more:hover {
	border: 1px solid #000;
	background-color: #000;
	color: #fff;
	text-decoration: none !important;
}
.newslist2 {
	float: left;
	width: 100%;
	display: block;
	margin: 0;
	padding: 0 10%;
	border: 10px solid #f1f0f0;
}
.newslist2 dl {
	float: left;
	width: 100%;
	margin: 0;
	padding: 16px 20px;
	border-bottom: 1px solid #dad9d4;
	position: relative;
}
.newslist2 dd {
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
	color: #111;
}
.newslist2 dd.title {
	padding: 7px 0 5px;
	font-size: 1.8em;
	line-height: 1.3em;
	font-weight: bold;
	color: #111;
}
.newslist2 dt {
	display: inline-block;
	margin: 0 0 0 5px;
	font-size: 1.3em;
    font-family: Times, "Times New Roman",  serif;
    font-style: italic;
    color: #d00000;
	font-weight: 600;
	padding: 0 15px;
	background: #fff;
	position: absolute;
	top: -20px;
	left: 0;
}
.newscontent {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding: 40px 0 30px;
}
.newslist4 {
	float: left;
	width: 100%;
	background: #eaf2f9;
	padding: 15px 10px;
	margin: 1px 0;
}
.newslist4 A:link {color:#009bd8;text-decoration:none}
.newslist4 A:visited {color:#009bd8;text-decoration:none}
.newslist4 A:hover {color:#eb6100;text-decoration:underline}
@media (max-width: 991px) {
.news-box {
    width: 100%;
    margin: 0 0 20px;
}
}
/*************************
*******Product CSS******
**************************/
#product-ov, #product-ov1 {
	width: 100%;
	display: inline-block;
}
#product-ov ul, #product-ov1 {
	width: 100%;
	float: left;
	margin: 0;
	padding: 0;
}
#product-ov li { 
	float: left;
	display:block;
	list-style:none;
	width: calc(100%/2 - 20px);
	padding: 0 0 10px;
	margin: 15px 10px 20px;
	border: 1px solid #e8e8e8;
	background: #efeeee;
	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-ov li:hover {border: 1px solid #123265;}
#product-ov li:after {content: "";position: absolute; display: block; border-color: #e01b0b transparent transparent #e01b0b; border-style: solid solid solid solid;border-width: 5px 5px;height: 0px; width: 0px;top: -1px;left: -1px; }
#product-ov li .pro-img { 
	width:100%;
	float: left;
	overflow: hidden;
	padding: 7px;
	background: #fff;
}
#product-ov ul li .pro-name {
	font-size: 20px;
	line-height: 1.5em;
	color: #000000;
	margin-top: 7px;
	padding: 5px 10px;
	-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: #123265;
}
#product-ov ul li .productimg {
	width: 100%;
	height: 320px;
	outline: none;
	display: inline-block;
	float: left;
}
#product-ov ul li .productimg {
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}
#product-ov ul li a:hover .productimg {
	opacity: 0.8;
}
#product-ov ul li:hover { 
	-webkit-box-shadow: 3px 3px 5px rgba( 0, 0, 0, .15 );
	box-shadow: 3px 3px 5px rgba( 0, 0, 0, .15 );
}
#product-ov1 .probox { 
	float: left;
	display:block;
	list-style:none;
	width: calc(100%/3 - 16px);
	padding: 5px;
	margin: 15px 8px;
	border: 1px solid #e8e8e8;
	-webkit-box-shadow: 0 0 5px rgba( 0, 0, 0, .1 );
	box-shadow: 0 0 5px rgba( 0, 0, 0, .1 );
}
#product-ov1 .probox .pro-img { 
	width:100%;
	float: left;
	overflow: hidden;
	padding: 0;
	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-ov1 .probox .pro-name {
	font-size: 18px;
	line-height: 1.5em;
	color: #000000;
	margin: 10px 0 7px;
	display: inline-block;
	width: 100%;
	text-align: center;
}
#product-ov1 .probox .productimg {
	width: 100%;
	height: 300px;
	outline: none;
	display: inline-block;
	float: left;
}
@media (min-width: 1300px) and (max-width: 1500px) {
#product-ov li { width: calc(100%/2 - 10px);margin: 15px 5px 20px;}
#product-ov ul li .productimg {height: 250px;}
#product-ov1 .probox .productimg {height: 250px;}
}
@media (min-width: 992px) and (max-width: 1299px) {
#product-ov ul li .productimg {height: 180px;}
#product-ov1 .probox { width: calc(100%/3 - 8px);padding: 3px;margin: 15px 4px;}
#product-ov1 .probox .productimg {height: 200px;}
}
@media (max-width: 991px) {
#product-ov ul li .productimg {height: 220px;}
#product-ov1 .probox { width: calc(100%/3 - 8px);padding: 3px;margin: 15px 4px;}
#product-ov1 .probox .productimg {height: 220px;}
}
@media (max-width: 767px) {
#product-ov1 ul {width: 100%;}
#product-ov ul li .productimg {	height: 200px;}
#product-ov1 .probox .productimg {height: 180px;}
}
@media (max-width: 600px) {
#product-ov li { width: 100%; margin: 10px 0 15px;}
#product-ov ul li .productimg {	height: 250px;}
#product-ov1 .probox { width: 100%;padding: 5px;margin: 12px 0;}
#product-ov1 .probox .productimg {height: 350px;}
}
@media (max-width: 480px) {
#product-ov ul li .productimg {	height: 200px;}
#product-ov1 .probox .productimg {height: 250px;}
}
/* 資訊 - 詳細頁 */
#product-ov2 {
	width: 100%;
	float: left;
	margin-top: 10px;
}
#product-ov2 .info {
	float: left;
	width: 100%;
	margin: 25px 0 0;
	padding: 0;
}
#product-ov2 .info h2 {
	display: inline-block;
	width: 100%;
	font-size: 30px;
	line-height: 1.4em;
	color: #123265;
	font-weight: 600;
	margin: 0;
	padding: 0 0 10px;
	border-bottom: 1px solid #183883;
}
#product-ov2 .info .group {
	width:100%;
    display: inline-block;
    margin: 0;
    padding: 20px 0;
    border-bottom: #ccc dashed 1px;
	font-size: 16px;
	line-height: 1.8em;
	color: #333;
}
#product-ov2 .info .group:last-child {
  border-bottom: none;
}
#product-ov2 .info .group p, #product-ov2 .info .spec p{
	margin: 0 0 5px;
}
#product-ov2 .info .group ul{
	margin: 0;
	padding: 0;
    padding-left: 24px;
    list-style-type: disc;
}
#product-ov2 .info .group ol{
	margin: 0;
	padding: 0;
    padding-left: 20px;
    list-style-type: disc;
}
#product-ov2 .info .group ul li{
	margin: 0;
	padding: 0;
    margin-bottom: 2px;
	border-bottom: none;
	list-style-type: disc;
}
#product-ov2 .info .group ol li{
	margin: 0;
	padding: 0 0 0 3px;
    margin-bottom: 2px;
	border-bottom: none;
	list-style-type: decimal;
}
#product-ov2 .info .goods-btn {
	float: left;
	width: 100%;
	margin: 12px 0 0;
	padding: 0px;
}
#product-ov2 .info .goods-btn button {
	font-family: \5FAE\8EDF\6B63\9ED1\9AD4, \65B0\7D30\660E\9AD4, Arial, Helvetica, sans-serif;
	float: left;
	width: calc(100%/2 - 2px);
	display: block;
	margin:5px 1px;
	text-align: center;
	border: none;
	-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;
}
#product-ov2 .info .goods-btn .btn-primary{
	font-size: 16px;
    line-height: 24px;
    padding: 10px;
    color: #fff;
    border: #3a5c90 solid 1px;
	border-radius: 3px;
	background: #3a5c90; 
	background-size: 22px;
}
#product-ov2 .info .goods-btn .btn-primary:hover{
	color: #fff;
    text-decoration: none;
    background-color: #183883;
}
#product-ov2 .info .goods-btn .btn-primary1{
	font-size: 16px;
    line-height: 24px;
    padding: 10px;
    color: #555;
    border: #bfbfbf solid 1px;
	border-radius: 3px;
	background: #bfbfbf; 
}
#product-ov2 .info .goods-btn .btn-primary1:hover{
	color: #fff;
	border: #183883 solid 1px;
    text-decoration: none;
	background: #183883;
}
#product-ov2 .info .goods-btn .btn-primary[disabled] {
    border: #ccc solid 1px;
    background-color: #ccc;
    -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: #ccc solid 1px;
    background-color: #ccc;
    -webkit-box-shadow: 0 0 5px rgba( 0, 0, 0, 0 );
	box-shadow: 0 0 5px rgba( 0, 0, 0, 0 );}
.productpicbig {
	float: left;
	padding: 10px;
	margin-bottom: 10px;
	width: 100%;
	border: 1px solid #efefef;
	position:relative;
	background: #fff;
	-webkit-box-shadow: 0 0 5px rgba( 0, 0, 0, 0.15 );
	box-shadow: 0 0 5px rgba( 0, 0, 0, 0.15 );
}
@media (min-width: 1500px) {
#product-ov2 .info {float: right;width: calc(100% - 760px);	margin: 0;}
.productpicbig {width: 720px;}
}
@media only screen and (max-width: 480px) {
#product-ov2 .info h2 {
	font-size: 1.8em;
	line-height: 1.3em;
}
#product-ov2 .info .group .txt {
	width: 100%;
	float: left;
}
#product-ov2 .info .goods-btn ul.style-ul li {
    float: none;
    width: 100%;
}
#product-ov2 .info .goods-btn .btn-primary{
	width: 100%;	
}
#product-ov2 .info .goods-btn .btn-primary1{
	width: 100%;	
}
}

/*選項卡*/
.tab{
	float: left;
	width: 100%;
	display: inline-block;
	position: relative;
	margin: 40px 0 0;
	padding: 0;
}
ul.nav-tabs, ul.nav-tabs li {
	margin: 0;
	padding: 0;
	list-style: none;
}
ul.nav-tabs {
	width: 100%;
	display: inline-block;
	background: #ececec;
	border: 0;
}
ul.nav-tabs li{
	float: left;
	display: inline-block;
	font-size: 18px;
	line-height: 1.4em;
	position: relative;
}
ul.nav-tabs li a{
	display: inline-block;
    padding: 10px 50px;
	margin-right: 1px;
    border:none;
    border-right: 1px solid #fff;
    background: transparent;
    color:#888;
    border-radius: 0px;
    transition: all 0.2s ease-in 0s;
}
ul.nav-tabs li a:hover{
    background: #014099;
    color: #fff;
}
ul.nav-tabs li.active a,
ul.nav-tabs li.active a:focus,
ul.nav-tabs li.active a:hover{
    color: #fff;
	background: #014099;
	border:none;
	text-decoration: none;
}
ul.nav-tabs li.active a:after{
	content: "";
	border-top: 8px solid #014099;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	position: absolute;
	bottom: -8px;
	left: calc(50% - 8px);
}
.tab .tab-content{
	float: left;
	width: 100%;
	display: inline-block;
    padding: 40px 0 35px;
}

.tab-content table{ width: 100%;border: 1px solid #333;border-collapse: collapse;margin-bottom: 15px;}
.tab-content table td { padding: 8px 10px; border: 1px solid #333;border-collapse: collapse;font-size: 1em;line-height: 1.4em;}
@media only screen and (max-width: 768px){
ul.nav-tabs li{
    width:100%;
    margin-bottom: 1px;
}
ul.nav-tabs li a{
	width: 100%;
    padding: 10px;
	border-right: 0px none;
	border-bottom: 1px solid #fff;
	text-align: center;
}
ul.nav-tabs li.active a:after{display: none;}
.tab iframe,
.tab object,
.tab embed {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
	height: auto;
	min-height: 350px;
}

}


/*產品放大*/
.imagecontainer {
	width: 100%;
	text-align: center;
	margin: 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: 60px; 
	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: 50px;
	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:480px;
	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:480px;
	max-width:100%;
}
@media (max-width: 767px){
div.container_img {height:400px;}
div.container_img img {max-height:400px;}
}
@media (max-width: 600px){
div.container_img {height:300px;}
div.container_img img {max-height:300px;}
}
@media (max-width: 480px){
div.container_img {height:250px;}
div.container_img img {max-height:250px;}
}
.tab-list {
	display: inline-block;
    width: 100%;
}
.tab-list .tempb1 {
	display: inline-block;
    width: 100%;
    background: #ec6867;
	font-size: 16px;
	font-weight: bold;
	color: #fff;
	padding: 8px 15px;
	border: 1px solid #fff;
	text-align: center;
}
.tab-list{
	display: inline-block;
	width: 100%;
	background-color: #ffffff;
	border-collapse: collapse;
}
.tab-list ul, .tab-list li {
	display: inline-block;
	list-style: none;
	padding: 0;
	margin: 0;
}
.tab-list .tr.addi {
  background: #fff6e9;
}
.tab-list .td{
	display: inline-block;
	color: #333;
	border-bottom: #e4e4e4 1px solid;
	padding: 10px 5px;
	font-size: 15px;
}
.tab-list .td .cart-meta{
	width: 100%;
	display: inline-block;
	color: #999;
	padding: 1px 0 0;
	margin: 0;
	font-size: 16px;
	line-height: 1.6em;
}
.tab-list .td .ptype{
	width: 100%;
	display: inline-block;
	color: #999;
	padding: 1px 0 0;
	margin: 0;
	font-size: 14px;
	line-height: 1.5em;
}
.tab-list .td .addi{
	display: inline-block;
	color:#fff;
    font-size: 13px;
	line-height: 1.5em;
	padding: 2px 7px 4px;
	margin: 0 0 2px ;
	background:#fbb856;
	border-radius: 3px;
}
.tab-list .td .pic {
	display: inline-block;
    width: 80px;
    margin: 0;
	padding: 3px;
	border: 1px solid #e7e7e7;
	background: #fff;
}
.tab-list .td .pic .productimg {
	width: 100%;
	height: 80px;
	outline: none;
	display: inline-block;
	float: left;
}
.tab-list .th{
	background-color: #555;
	color:#fff;
	border: #fff 1px solid;
	text-align: center;
	padding: 8px 5px;
	font-size: 16px;
	font-weight: bold;
}
.tab-list .tab-set{
	width: 100%;
	display: table;
}
.tab-list .tab-set .thead{
	display:table-header-group;
}
.tab-list .tab-set .tbody{
	display:table-row-group;
}
.tab-list .tab-set .tr{
	display:table-row;
	-webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
      -ms-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
          transition: all 0.3s ease-in-out;
}
.tab-list .tab-set .th, .tab-list .tab-set .td{
	display:table-cell;
	vertical-align:middle;
}
.tab-list .tab-set .td .numinput{ display: inline-block;margin: 0 auto;}
.tab-list .tab-set .th:nth-child(1),.tab-list .tab-set .td:nth-child(1){width: 10%; text-align: center;min-width: 100px;}
.tab-list .tab-set .th:nth-child(2),.tab-list .tab-set .td:nth-child(2){width: 25%; text-align: center;}
.tab-list .tab-set .th:nth-child(3){width: 40%; text-align: center;}
.tab-list .tab-set .td:nth-child(3){width: 40%; text-align: left;}
.tab-list .tab-set .th:nth-child(6),.tab-list .tab-set .td:nth-child(4){width: 15%; text-align: center;min-width: 150px;}
.tab-list .tab-set .th:nth-child(6),.tab-list .tab-set .td:nth-child(5){width: 10%; text-align: center;}
.tab-list .tab-set .td:nth-child(2){color: #333;font-size: 18px;text-align: left;padding-left: 20px;}
.tab-list .tab-set .td:nth-child(5){color: #df020a;font-family: Lucida Grande, Lucida Sans Unicode, Lucida Sans, DejaVu Sans, Verdana, \5FAE\8EDF\6B63\9ED1\9AD4, \65B0\7D30\660E\9AD4, serif;font-size: 16px;}

.tab-list a { color: #333;}
.tab-list a:hover { color: #ee1d24;}
.tab-list a.dele { font-size: 20px; color: #999;}
.tab-list a.dele:hover { color: #ed1c24;}
@media (max-width: 991px) {

.tab-list .tab-set .thead, .tab-list .tab-check .thead{ display: none;}
.tab-list .tab-set.td:nth-child(1), .tab-list .tab-set .td:nth-child(2), .tab-list .tab-set .td:nth-child(3), .tab-list .tab-set .td:nth-child(4), .tab-list .tab-set .td:nth-child(5), .tab-list .tab-set .td:nth-child(6), .tab-list .tab-check.td:nth-child(1), .tab-list .tab-check .td:nth-child(2), .tab-list .tab-check .td:nth-child(3), .tab-list .tab-check .td:nth-child(4), .tab-list .tab-check .td:nth-child(5){display: inline-block;width: 100%;text-align: left;padding: 5px 10px;border-bottom: none;}
.tab-list .tab-set .td:nth-child(1), .tab-list .tab-check .td:nth-child(1){display: inline-block;width: 100%;text-align: center;padding: 8px 10px;border-bottom: none;}
.tab-list .tab-set .td:nth-child(2){display: inline-block;width: 100%;text-align: center;padding: 5px 10px 8px; margin-bottom: 8px; border-bottom: 1px dashed #ddd;}
.tab-list .tab-set .tr, .tab-list .tab-check .tr { border-top: 3px solid #555;}
.tab-list .tab-set .td:nth-child(5){display: inline-block;width: 100%;text-align: center;padding: 10px 10px;margin-top: 5px; border-bottom: none; background: #e1f3fa;}
.tab-list .tab-set .tr, .tab-list .tab-check .tr { border-top: 3px solid #555;}
.tab-list .tab-set .tr li:before, .tab-list .tab-check .tr li:before{ content: attr(data-title); display: inline-block; width: 80px;color: #888;font-size: 14px;float: left;}
.tab-list .tab-set .tr li .input-group{ width: calc(100% - 100px);float: left;}
}
/*產品數量*/
input[type=number] {
  float: left;
  width: 70px;
  height: 31px;
  padding: 0;
  font-family: Lato;
  font-weight: 700;
  font-size: 1.2em;
  text-transform: uppercase;
  text-align: center;
  color: #333;
  border: 1px #999 solid;
  background: none;
  outline: none;
  /*pointer-events: none;*/
}

span.spinner {
  /*position: absolute;*/
  height: 36px;
  user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

span.spinner > .sub,
span.spinner > .add {
  float: left;
  display: block;
  width: 30px;
  height: 31px;
  text-align: center;
  font-family: Lato;
  font-weight: 700;
  font-size: 1.2em;
  line-height: 28px;
  color: #999;
  border: 1px #999 solid;
  border-right: 0;
  border-radius: 2px 0 0 2px;
  cursor: pointer;
  transition: 0.1s linear;
  -o-transition: 0.1s linear;
  -ms-transition: 0.1s linear;
  -moz-transition: 0.1s linear;
  -webkit-transition: 0.1s linear;
}

span.spinner > .add {
  top: 0;
  border: 1px #999 solid;
  border-left: 0;
  border-radius: 0 2px 2px 0;
}

span.spinner > .sub:hover,
span.spinner > .add:hover {
  background: #666;
  color: #fff;
}