﻿@import url(http://fonts.googleapis.com/css?family=Raleway:100);
@import 'https://fonts.googleapis.com/css?family=Julius+Sans+One|Quicksand';
/*'Raleway'*/
/*
主色#996600 #C1A264
次色*/





/* http://www.minwt.com*/
/*v1.0 plus+ | 20090501 | by minwt*/
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;

	font-weight:normal;
	
}
div{ width:100%;}
ol, ul {list-style: none;}
a{text-decoration:none;}
hr,.br{clear:both;}

blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {	outline: 0;}

/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}

/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: collapse; border-spacing: 0;}



*{font-family:'Quicksand', Arial , '微軟正黑體';
max-width:100%;
-webkit-text-size-adjust: none;
-webkit-transition: all 0.3s;
-o-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;


-webkit-box-sizing: border-box;
-moz-box-sizing: border-box; 
box-sizing: border-box;
}

html,body { height:100%; margin:0px ; padding:0px; text-align:left;word-break: break-all}

input.onfocus{} 
input, select{ padding:3px}
header,footer,aside,article,section{ display:block}

table { width:auto; border-collapse: collapse;border-spacing: 0; }

div{-webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}

h1, h2, h3, h4, h5, h6{ font-weight: normal; margin:0px; padding:0px }

.title{ margin-top:5px; line-height:150%; }
h2.title{font-size:30pt;}
h3.title{font-size:24pt;}
h4.title{font-size:18pt;}
h5.title{font-size:12pt;}

.white{ color:#FFFFFF;}
.center{ text-align:center}
img { border: 0px; max-width: 100%; }

a{color: #000000; text-decoration:none;-webkit-transition: all 0.3s;-o-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;}
a:link {color: #000000;}
a:visited {color: #000000;}
a:hover {color: #996600;text-decoration:none}
a:active {color: #000000;}
.btn{ padding:5px 10px;}


/*selection*/
::selection {
background: #C1A264;
color: #fff; 
text-shadow:none;
}
::-moz-selection {
background: #C1A264;
color: #fff; 
text-shadow:none;
}
img::selection {
background: rgba(0,0,0,0.1);
}
img::-moz-selection {
background: rgba(0,0,0,0.1);
}

/* 設定提示字的文字顏色 */
::-webkit-input-placeholder {color: #AAAAAA;}
:-moz-placeholder  {color: #AAAAAA;}
.placeholder {color: #AAAAAA;}

/*clearfix*/
.clearfix:before,
.clearfix:after {
  content: "";
  display: table;
}
.clearfix:after {
  clear: both;
}
.clearfix {
  *zoom: 1; /*For IE 6&7 only*/
}


strong{  font-size:16pt;}

/*page-num*/

.page-num{   position:relative; text-align:center; width:780px;float:left}
.page-num ul{ margin:20px; }
.page-num ul li{ display:inline-table; font-size:10pt; text-align:center}
.page-num ul li.page-num-none{padding:10px;  color:#666666 }

.page-num ul li a{ padding:10px; display:block;box-sizing: border-box; border-radius:5px;width:36px; height:36px;}
.page-num ul li a{  background:#f1f1f1;  }
.page-num ul li a:hover{color:#FFFFFF; background:#82C300  }
.page-num ul li.page-num-select a{background:#82C300; color:#FFFFFF }
.page-num ul li.page-num-select a:hover{ background:#72AB00}


/*home*/
.center-box{ width:100%; height:100%; text-align:center}
.center-box:before {  content: "";  height: 100%;  display: inline-block; vertical-align: middle}
.center-box-content{ display: inline-block;vertical-align:middle; text-align:left}

.data-small-label{display:inline-block; padding:5px;}
.data-small{ background:#C39573; color:#FFFFFF; display:inline-block; padding:5px 10px; font-size:10pt; border-radius:5px }
.w100{width:100% ;max-width:100px!important; }
.w120{width:100% ; max-width:120px!important; }
.w150{ width:100% ;max-width:150px!important; }
.w200{ width:100% ;max-width:200px!important;}
.w300{width:100% ; max-width:300px!important; }
.w400{ width:100% ;max-width:400px!important; }
.w500{ width:100% ;max-width:500px!important;}

.p10{width:10%!important; }
.p20{width:20%!important; }
.p30{width:30%!important; }
.p40{width:40%!important; }
.p50{width:50%!important; }
.p60{width:60%!important; }
.p70{width:70%!important; }
.p80{width:80%!important; }
.p90{width:90%!important; }
.p100{width:100%!important; }

.f9{ font-size:9pt!important}
.f10{font-size:10pt!important}
.f11{font-size:10.5pt!important}
.f12{font-size:12pt!important}
.f14{font-size:14pt!important}
.f16{font-size:16pt!important}
.f18{font-size:18pt!important}

.red{ color:#CC0000!important}
.green{ color:#82C300!important}


/*ad*/
ul.ad-list-horizontal{ padding:0px; margin:0px;}
ul.ad-list-horizontal li{ list-style:none;padding:0px; margin:0px; display:inline-block; vertical-align:top}
ul.ad-list-horizontal li a{display:block;padding:0px; margin:0px; }
ul.ad-list-horizontal li img{ display:block;padding:0px; margin:0px;}
ul.ad-list-horizontal li span{ display:none}

ul.ad-list-vertical{ padding:0px; margin:0px; margin:0 auto;}
ul.ad-list-vertical li{ list-style:none;}
ul.ad-list-vertical li a{display:block;padding:0px; margin:0px; }
ul.ad-list-vertical li img{ display:block;padding:0px; margin:0px;}
ul.ad-list-vertical li span{ display:none}


/*message-box*/

.message-box{width:100%; height:100%; display:none;position:fixed; top:0px; left:0px; background:rgba(0,0,0,0.8); text-align: center ;  z-index:10 ; overflow:hidden}
.message-box:before {  content: "";  height: 100%;  display: inline-block;  vertical-align: middle;}

.message-box-close{position:fixed; width:100%; height:100%;top:0px; left:0px; z-index:11 }
.message-box-content{ display: inline-block;vertical-align:middle;width:80%; height:80%; ;box-shadow:0px 0px 5px rgba(0,0,0,0.5); background:#FFFFFF; ; z-index:12; margin-top:5px ; max-height:100% ; max-width:100% ; position:relative}


.message-box-content-close{ width:50px; height:50px; position:absolute; right:-25px;top:-25px; border-radius:50px; display:block; background:#CC0000 url(/image/icon-nav-x.png) center center no-repeat;   z-index:5 ; cursor:pointer}
.message-box-content-close:hover{ background-color:#990000}
.message-box-content iframe{ width:100%; height:100%;margin:0px; border:0px; overflow:scroll;;}
#message-box-iframe{ overflow:scroll}

.message-box-content a{ display:block; cursor:pointer; background:#CC0000; color:#FFFFFF; margin-right:-25px; margin-top:10px; float:right;  text-align:center; width:25px; padding:10px 0px;;}
.message-box-content a:hover{ background:#990000}


.message-box-content-html{ display:block; width:100%; height:100%;margin:0px; border:0px; overflow:auto;}

@media screen and (max-width:600px) {
.message-box-content{ width:80%!important; height:80%;}

.title{ margin-top:5px; line-height:150%; }
h2.title{font-size:24pt;}
h3.title{font-size:18pt;}
h4.title{font-size:16pt;}
h5.title{font-size:12pt;}
}

@media screen and (max-width:480px) {
.message-box-content{ width:90%!important; height:90%;}
}