body, html {
    font-size: 100%;
    padding: 0;
    margin: 0;
}
/* Reset */
*, *:after, *:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
body {
    color: #D5D6E2;
    font-weight: 500;
    font-size: 1.05em;
    font-family: "Helvetica Neue", Helvetica, Arial, "PingFang TC", "Heiti TC", "微軟正黑體", "Microsoft JhengHei", "Noto Sans T Chinese", "Droid Sans Fallback", sans-serif;
}
a {
    color: rgba(255, 255, 255, 0.6);
    outline: none;
    text-decoration: none;
    -webkit-transition: 0.2s;
    transition: 0.2s;
}
a:hover, a:focus {
    color: #74777b;
    text-decoration: none;
}
.demo {
    padding: 1rem;
    margin: 0;
	padding-top: 0;

}
/*外框*/
.pricingTable {
    background: #fff;
    -webkit-border-bottom-left-radius: 15px;
    -moz-border-radius-bottomleft: 15px;
    border-bottom-left-radius: 15px;
    margin-left: 5px;
    display: block;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: 5px 10px 15px 5px rgba(147,135,119,0.15);
    position: relative;
    transition: all 0.5s;
    border: 1px solid #15a73b;
    margin-bottom: 3rem;
    min-height: 560px;
	
}
/*標題*/
.pricingTable .tit {
    text-transform: uppercase;
    margin-top: 0;
    background: url("../images/tit.jpg") no-repeat center bottom;
    padding-bottom: 10px;
}
.pricingTable .heading {
    font-size: 1.2rem;
    color: #4f4543;
    background: url(../images/heading.png) no-repeat left top;
    padding-left: 30px;
    font-weight: 600;
    margin: 0;
}
.pricingTable .pricingTable-header {
    padding: 52px 15px 0 15px;
    background: #fff;
    position: relative;
    transition: all 0.3s ease 0s;
}
.pricingTable:hover .pricingTable-header {
}
/*序號*/
.pricingTable .digital {
    background: #15a73b;
    position: absolute;
    left: -5px;
    top: 0;
    color: #ffffff;
    line-height: 32px;
    width: 59px;
    text-align: center;
}
.pricingTable .digital:after {
    content: '';
    display: block;
    width: 5px;
    height: 4px;
    background: url("../images/list_box_bottom_green.png")no-repeat;
    position: absolute;
    left: 0;
    top: 31px;
}
.pricingTable .price-value {
    display: inline-block;
    position: relative;
    font-weight: bold;
    color: #fff;
    transition: all 0.3s ease 0s;
}
.pricingTable:hover .price-value {
    color: #fff;
}
.pricingTable .pricing-content {
    padding: 15px;
    position: relative;
}
.pricingTable .pricing-content ul {
    padding: 0;
    margin: 0;
    list-style: none;
}
.pricingTable .pricing-content ul li {
    font-weight: 400;
    color: #333333;
    padding: 8px 0 5px 0;
    border-bottom: thin dashed #d5d5d5;
    width: 100%;
    overflow: hidden;
    font-size: 0.98rem;
}



.pricingTable .pricing-content ul li:nth-child(6){

height:100px;

}


.pricingTable .pricing-content ul li:nth-child(5),.pricingTable .pricing-content ul li:nth-child(4),.pricingTable .pricing-content ul li:nth-child(1){

height:60px;

}






.pricingTable .pricing-content ul li span {
    float: left;
    display: inline-table;
}
.pricingTable .pricing-content ul li .category {
    width: 35%;
}
.pricingTable .pricing-content ul li .data {
    width: 65%;
}
/*連結*/

.pricingTable .link {
    width: 100%;
    overflow: hidden;
    padding: 0.5rem 0 ;
    text-align: center;
}
.pricingTable .link ol {
    width: 152px;
    margin: 0 auto;
    list-style: none;
    overflow: hidden;
    padding: 0;
}
.pricingTable .link ol li {
    float: left;
    margin: 0 7px
}
/*搜尋*/



img {
    border: 0;
}
button {
    outline: 0;
}
mark {
    color: #000;
    background: #ff0;
}
small {
    font-size: 80%;
}
img {
    border: 0;
}
button, input, optgroup, select, textarea {
    margin: 0;
    font: inherit;
    color: inherit;
    outline: none;
}
em {
    font-style: normal;
}
.pc-kk-form {
    padding-bottom: 2rem;
    padding-top:1rem;
}

.pc-kk-form form{

}
.pc-kk-form-list {
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 5px;
    height: 44px;
    line-height: 44px;
    margin: 0;
}
.pc-kk-form-list input {
    border: none;
    background: none;
    color: #333333;
    font-size: 1.25rem;
    font-weight: 600;
    text-align: center;
}
.pc-kk-form-list textarea {
    background: none;
    border: none;
    height: 60px;
    padding: 10px;
    resize: none;
    width: 94%;
    line-height: 22px;
    color: #9fa3a7;

}
.nice-select {
    position: relative;
    background: #fff url(../images/a2.png) no-repeat right center;
    float: left;
    border: 1px solid #cccccc;
    height: 40px;
    line-height: 38px;
	margin-right: 5px;
	cursor: pointer;
}


.nice-select:nth-of-type(3){
	background-image: none;
}


.nice-select ul {
    width: 100%;
    display: none;
    position: absolute;
    left: -1px;
    top: 44px;
    overflow: hidden;
    background-color: #fff;
    max-height: 150px;
    overflow-y: auto;
    border: 1px solid #ccc;
    z-index: 9999;
	    padding-left: 10px
}
.nice-select ul li {
    padding-left: 5px;
    list-style: none;
    color: #333;
	font-size: 0.95em;
}
.nice-select ul li:hover {
    background: #f8f4f4;
}
.pc-kk-form-list-clear {
    background: none;
    border: none;
}
.pc-kk-form-btn{
	float: left;
}
.pc-kk-form-btn button {

    color: #fff;
    border: none;
    height: 40px;
    line-height:40px;
	background: url("../images/search.png") no-repeat  10px center  #ff7800;
	padding-left: 40px;
	font-size: 1.25rem;
	padding: 0 15px 0 45px;
	font-weight: 600;
}

.pc-kk-form-btn button:hover{
	background-color: #e13021;

	
}


.alert-danger{
color: #a94442;
background-color: #f2dede;
border-color: #ebccd1;
	padding: 1rem;
	
}

.web_paging {
    padding-top: 20px;
    padding-bottom: 15px;

	
}

.web_paging td {
    text-align: center;
    font-size: 1.1em;
    letter-spacing: 0.1em;
		 color: #333;

}
.web_paging  a{
	 color: #333;
}

.web_paging  a:hover{
	color: #ef6000;
}

.web_paging  input{
	text-align: center;
	margin: 0 5px;
}

.web_paging  .button{
    background: #8d8d8d;
    color: #fff;
    border-radius: 2px;
    border: none;
    padding: 3px 10px;
	
}
.web_paging  .button:hover{
	background: #ef6000;
}


/*公司產品頁/judo*/




.all{
width: 100%;
margin: 0 auto;}

.all h3{   
margin: 0;
    font-size: 3.15rem;
    font-family: '微軟正黑體';
    font-weight: bolder;
    color: #505050;
    line-height: 58px;
    padding-bottom: 1rem;
    text-align: left;
    letter-spacing: -1px;
	}

.company{
    width: 1142px;
    background: #FFC3C4 url(../images/0001.png)no-repeat bottom -438px right -4px;
    background-size: auto;
    background-size: 83%;
    padding: 28px;
    margin: 0 auto;
min-height: 450px;
}

.right{float: right;}

.left{float: left;}

.inline{display: inline-block;}

.basic{width:1140px;margin:0 auto;}


.detail1{width:60%;margin:0 0.2rem; }


.detail2::before{
    content: '';
    height: 95px;
    display: inline-block;
    background: aquamarine;
}



.detail2{
width: 38%;
    margin: 0px 0.2rem;
    height: 0px;

}

.detail3{margin:0;}


.detail1 span,.detail2 p{
font-size: 1em !important;
line-height: 30px;
font-family: '微軟正黑體', Arial, Helvetica, sans-serif;
margin: 0;
color:#505050;
font-weight: bold;
    text-align: justify;
}


.detail2 p {
color:#FFFFFF;
letter-spacing: 1px;
    text-indent: 90px
}





.line {
    border-right: 10px solid #8ef1da;
    width:0px;
padding-bottom: 32px;
    vertical-align:top;
}




.tog{display: table;}

.tog .row{display: table-row;} 

.tog .row .cell{display: table-cell;

padding: 0 12px 0 0;}

.product img{
max-width:100%; 
}


.mediaicon{
    width: 48px;
    float: right;

}




.mediaicon img {
    padding: 0.2rem;
}

.down {
    padding-top: 234px;
}

/*flexbox*/

.menu{
width:100%;
margin: 0 auto;
}

.center1{ 
    display: flex;
    height: auto;
    padding: 1rem 0rem;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: center;
  }


.menu .center1 .item{
width: 17%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 1rem 0;
}

  /*視障A OVER*/
  
  
.all .pic{text-align:center;
margin:0 auto;}

/*
p.no {
    font-size: 1.45rem;
    padding-top: 86px;
    text-align: center;
}





.on{
    position: absolute;
    top: 0px;
    margin-top: 14%;
    left: 17px;
    margin-left: 12%;


}


*/




/*zoom*/


img[data-action="zoom"] {
  cursor: pointer;
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
}
.zoom-img,
.zoom-img-wrap {
  position: relative;
  z-index: 666;
  -webkit-transition: all 300ms;
       -o-transition: all 300ms;
          transition: all 300ms;
}
img.zoom-img {
  cursor: pointer;
  cursor: -webkit-zoom-out;
  cursor: -moz-zoom-out;
}
.zoom-overlay {
  z-index: 420;
  background: #e5e5e5;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
  filter: "alpha(opacity=0)";
  opacity: 0;
  -webkit-transition:      opacity 300ms;
       -o-transition:      opacity 300ms;
          transition:      opacity 300ms;
}
.zoom-overlay-open .zoom-overlay {
  filter: "alpha(opacity=100)";
  opacity: 1;
}
.zoom-overlay-open,
.zoom-overlay-transitioning {
  cursor: default;
}

/*zoom*/




.tit {
height: 75px;
}



.tit h5 {
	
	padding: 0;
    margin: 0;
    text-align: left;
    font-size: 1rem;
    font-family: '微軟正黑體';
	    color: #444444;
    font-weight: bolder;
    line-height: 30px;
	
white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 200px;
	
	

	
}















@media only screen and (max-width:1024px) {

.basic {
    width: 1024px;
    margin: 0 auto;
}

.all {
    width: 100%;
margin: 0 auto;
}


.company {
    width: 98%;
    background: #FFC3C4 url(../images/0001.png)no-repeat bottom -450px right -70px;
    background-size: auto;
    background-size: 99%;
    padding: 28px;

	}

.product {
   width: 98%;
    margin: 0 auto;
}



.down {
    padding-top: 214px;
}


.detail2 p {
    text-indent: 16px;
}

.menu .center1 .item {
    width: 33%;
}

.pricingTable{

}


}


 @media screen and (max-width: 992px) {
 
 
.basic {
    width: 992px;
    margin: 0 auto;
}



 
 
 
 
}




@media screen and (max-width: 768px) {
    .pricingTable {
    margin-bottom: 25px;
    min-height: inherit;
}
    .pricingTable .pricing-content ul li:nth-child(6) {
    height: inherit;
}


.basic {
    width: 768px;
    margin: 0 auto;
}






.company {
background:
#FFC3C4 url(../images/0001.png)no-repeat bottom -550px right -80px;
background-size: auto;
background-size: 149%;
padding: 28px;
    height: 540px;
	}
	

.detail1 {
    width: 100%;
    margin: 0 0.2rem;
}


.detail1.inline,.detail2.inline {
    display: block;
}

.detail2{
    width: 100%;
    margin: 0 0.2rem;
}



.mediaicon {

    width: 147px;


}
	
.down {
    padding-top: 0;
    margin-top: -16px;
	}
	


.detail2 p {
   text-indent: 15px;
}

 
 .detail2::before {

    content: '';
    height: 5px;
	}
 
img.right {
    margin-top: 48px;
    width: 5%;
    margin-right: -146px;
} 
 
 .detail3 {

    margin: 0 0px 0 7px;

}
 
 .menu .center1 .item {
    width: 33%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 1rem 0;
}
 
 .tit h5 {

    width: 241px;
}
 


}



@media screen and (max-width: 680px) {
}
@media screen and (max-width: 480px) {
}

@media only screen and (max-width:414px) {


.basic {
     width: 414px;
    margin: 0 auto;
}


.all h3 {

margin: 0;
    font-size: 3.6rem;
    font-family: '微軟正黑體';
    font-weight: bolder;
    color: #505050;
    padding-bottom: 1rem;
    text-align: left;
    letter-spacing: 1px;
    line-height: 74px;
}

.company {

    width: 100%;
background: #FFC3C4 url(../images/0001.png)no-repeat bottom 160% right -323px;
    background-size: auto;
    background-size: 373%;
    padding: 24px 51px 24px 24px;
    height: auto;

}

.detail2 {
    height: 158px;

}


img.right {
    margin-top: -28px;
    width: 12%;
    margin-right: 291px;

}


.detail2 p {

letter-spacing: 0px;
}



.down {
  padding-top: 23px;
  margin-top: 0;
	}


.product {
    width: 90%;
}

.product img {
  max-width:100%;
}

.menu .center1 .item {

    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 1rem 0px;

}




.all .pic {

    text-align: center;
    margin: 0 auto;
    width: 92%;
    overflow: hidden;

}



.pic img {

    width: 225%;

}

.tit h5 {
    width: 379px;
}


}


@media only screen and (max-width:375px) {



.basic {

    width: 375px;
  

}




.detail2 {
    height: 158px;

}


img.right {

    margin-top: -26px;
    width: 12%;
    margin-right: 265px;

}


.detail2 p {

    text-indent: 6px;
	    font-size: 0.9em !important;

}




.down {
  padding-top: 23px;
  margin-top: 0;
	}




.menu .center1 .item {
    width: 105%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 1rem 0px;

}

.product img {
    max-width: 95%;
}


.all .pic {

    text-align: center;
    margin: 0 auto;
    width: 96%;
    overflow: hidden;

}




.pic img {

    width: 225%;

}

.tit h5 {
    width: 370px;
}






}








/*公司產品頁/judo*/








@media screen and (max-width: 990px) {

}

@media screen and (max-width: 900px) {
.nice-select {
	width: 28%;
    float: left;
}
}

@media screen and (max-width: 480px) {
.pc-kk-form{
	overflow: hidden;
	}	
.nice-select {
	width: 100%;
    float: left;
	margin-bottom: 0.5rem;
}
	
	.pc-kk-form-list input{
		text-align: left;
		    padding-left: 15px;
	}	
	
	.pc-kk-form-btn, .pc-kk-form-btn button{
		width: 100%;
	}	
	
	
}

