@charset "UTF-8";

*,body,a,div,span,p,td,li,input,textarea {
	font-family: chaparral-pro,Lucida Grande,Verdana,Tahoma,Georgia, "MHei","微軟正黑體","Microsoft JhengHei","Heiti TC" ;/*serif,*/
     -webkit-font-smoothing: antialiased;
	 -webkit-backface-visibility: hidden;/*chrome fix*/
     image-rendering:auto;
}/* Arial, Helvetica, sans-serif, */



body,html {
font-size:12pt;
color:#333333; 
}


.nodrag {
user-drag: none; 
user-select: none;
-moz-user-select: none;
-webkit-user-drag: none;
-webkit-user-select: none;
-ms-user-select: none;	
}


.none,.hide {
 display:none!important;
 opacity:0;
 width:0px;
 height:0px;
 overflow:hidden;
 position:absolute;
 left:-1000px;
 top:-1000px;
}
.block {
display:block;
}

.alpha0 {
 opacity:0;	
}

.ani {
transition:all .3s;	
-webkit-transition:all .3s;	
}

.relbox {
width:100%;
height:100%;
position:relative;	
display:block;
}

.absbox {
width:100%;
height:100%;
position:absolute;	
display:block;
}


/*position*/
.abs {
position:absolute;	
}
.abs[class~=fixed] {
position:fixed;	
}
.abs[class~=left] {
left:0px;	
}
.abs[class~=top] {
top:0px;	
}
.abs[class~=right] {
right:0px;	
}
.abs[class~=bottom] {
bottom:0px;	
}
.abs[class~=center] {
left:50%;	
}
.abs[class~=middle] {
top:50%;	
}


/*table*/
.tb {
display:table;
box-sizing:border-box;	
}
.tb[class~=full] {
width:100%;	
} 
.tb .tr{
display:table-row;
box-sizing:border-box;	
}
.tb .tr .td{
display:table-cell;
box-sizing:border-box;
padding:5px;
vertical-align:top;
}

/*form*/
input[type~=text],input[type~=email],textarea {
border:1px solid #666666;
color:#666666;
padding:5px;
}

/*button*/
button[class~=btn] {
 padding:10px;
 border-radius:5px;
 border:0px solid #ffffff;
 text-align:center;
}

button[class~=ok] {
 background-color:#0C9;
}
button[class~=link] {
 background-color:#ff9966;
}
button[class~=err] {
 background-color:#ff0000;
}
button[class~=full] {
width:100%;	
}


.hover {
transition:all .3s;
-webkit-transition:all .3s;	
cursor:pointer;
}
.hover:hover {
transform:scale(1.1,1.1);
-webkit-transform:scale(1.1,1.1);	
}
.mobile .hover:hover {
transform:scale(1,1);
-webkit-transform:scale(1,1);	
}

.unibtn[class~=scale],.unibtn[class~=down],.unibtn[class~=up] {
 transition:all .2s;
 -webkit-transition:all .2s;
 cursor:pointer;	
}
.unibtn[class~=scale]:hover,.unibtn[class~=down]:hover,.unibtn[class~=up]:hover {
 transition:all .3s ease-in-out;
 -webkit-transition:all .3s ease-in-out;	
}

.unibtn[class~=scale]:hover {
transform:scale(1.1,1.1);
-webkit-transform:scale(1.1,1.1);
}

.unibtn[class~=down]:hover {
transform:translateY(8px);
-webkit-transform:translateY(8px);
}
.unibtn[class~=up]:hover {
transform:translateY(-8px);
-webkit-transform:translateY(-8px);
}

.mobile .unibtn[class~=scale]:hover {
transform:scale(1,1);
-webkit-transform:scale(1,1);
}

.mobile .unibtn[class~=down]:hover {
transform:translateY(0px,0px);
-webkit-transform:translateY(0px,0px);
}
.mobile .unibtn[class~=up]:hover {
transform:translateY(0px,0px);
-webkit-transform:translateY(0px,0px);
}



/*lazyload*/
.lazy {
opacity:0;
transition:all .3s;
-webkit-transition:all .3s
}
.lazy[class~=lzon] {
opacity:1;
}



/*hislide close*/
.hslideclose {
position:fixed;
right:10px;
top:50px;
z-index:9999;
background:rgba(0,0,0,.6);
width:50px;
height:50px;
color:#ffffff;	
line-height:50px;
text-align:center;
border-radius:30px;
}

/*text-align*/
.t-l{
text-align:justify;	
}
.t-c{
text-align:center;	
}
.t-r{
text-align:right;	
}


/*deco*/
.shadow {
box-shadow:2px 2px 4px rgba(0,0,0,.5);	
}

.show640,.show800,.show960 {display:none}
.show-640,.show-800,.show-960 {display:none}

@media screen  and (max-width: 1600px) {


} /*end w1600*/
@media screen  and (max-width: 1350px) {


} /*end w1200*/
@media screen  and (max-width: 1200px) {


} /*end w1200*/
@media screen  and (max-width: 1080px) {


} /*end w1080*/

@media screen  and (max-width: 960px) {
.hide-960 {display:none!important}
.show-960 {display:block}

} /*end w960*/

@media screen  and (max-width: 800px) {
.hide-800 {display:none!important}
.show-800 {display:block}
} /*end w800*/
@media screen  and (max-width: 640px) {
.show640 {display:block}
.hide640 {display:none!important}
.show-640 {display:block}
.hide-640 {display:none!important}

/*
input,
textarea,
*/
button,
select,
a:active,a:focus,a:hover{
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  tap-highlight-color: transparent;
  outline: none!important;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}


} /*end w640*/
@media screen  and (max-width: 480px) {


} /*end w480*/
@media screen  and (max-width: 320px) {


} /*end w320*/