/* ==========================================================================
	public
 ========================================================================== */

body {
	font-family:  Arial ,"微軟正黑體", "新細明體",Verdana ; 
 	line-height: 1.9em; 
	text-align: justify; 
	text-justify:inter-ideograph; 
	color: #222222;
	letter-spacing:0px;
	font-size: 16px;
}

ul, li {
		list-style: none;
}

.en{ font-family:Verdana,arial;}

@media (min-width: 300px) {
	body{
		overflow-x: hidden;
	}
}

/* iphone4 width:300px; */

body{
		overflow-x: auto;
	}

@media (max-width: 768px) {
	body div[class^="col-"],body  div[class*=" col-"] {
		text-align:center !important;
	}
}
.container {
  margin-right: auto;
  margin-left: auto; 
  position:relative;
  width:985px;
  height: auto;
}

@media (max-width: 1015px) {
  .container {
     width:100%;
	 min-width:300px;
  }
}

a, a:focus , a:active { 
	color:#222222; 
	text-decoration: none;
 	hlbr:expression(this.onFocus=this.blur()); /* for IE */
 	 outline: none ;
	-moz-outline: none;
	-webkit-outline: none;
	-ms-outline: none;
	 outline: 0;
	 behavior:expression(this.onFocus=this.blur());
 }

a:hover{
	text-decoration:none;
}

.html p{
	line-height:1.8em;
	margin-bottom:20px;
	letter-spacing:0px;
	transition: all 0s ease-out;
}


/*.html p{
	line-height:25px;
	margin-bottom:20px;
	letter-spacing:0px;
}*/


.padding{
	padding:15px 25px;
}

.iframe{
	width: 100%;
	height: 258px;
	border: none;
	overflow: hidden;
}
a ,button { 
	color:#222222; 
 	hlbr:expression(this.onFocus=this.blur()); /* for IE */
 	outline: none;
	-moz-outline: none;
	-webkit-outline: none;
	-ms-outline: none;
 }

 a:hover{
 	text-decoration: none;
 }

 *:focus,
 *:active
  { 
 	-moz-outline: none;
	-webkit-outline: none;
	-ms-outline: none; 
	text-decoration: none;
	hlbr:expression(this.onFocus=this.blur()); /* for IE */
	}
/* ==========================================================================
	清除樣式
 ========================================================================== */
button, input, select, textarea { font-family: inherit; font-size: 100%; /* 1 */ margin: 0; /* 2 */ ; /* 3 */ }
button, input {line-height: normal}
button, select {text-transform: none}
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; /* 2 */ ; /* 3 */ }
button[disabled], html input[disabled] {cursor: default}
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; /* 1 */ ; /* 2 */ }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; /* 1 */ nowhitespace: afterproperty; -webkit-box-sizing: content-box; box-sizing: content-box; /* 2 */ ; }
	input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {-webkit-appearance: none}
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
button { border: none; background: none; padding: 0; margin: 0; display: inline-block; }

/* ==========================================================================
	標籤
========================================================================== */
/* ==========================================================================
   Rows
   ========================================================================== */

  ul.rows,    
  ol.rows,    
  dl.rows                         {margin: 0; padding: 0; list-style: none}

  ul.rows > li, 
  ol.rows > li,
  dl.rows > dt, 
  dl.rows > dd                    {margin: 0; padding: 0; display: block; clear: both}
/* ==========================================================================
   Columns [float]
   ========================================================================== */

  ul.columns, 
  ol.columns, 
  dl.columns                      {margin: 0; padding: 0; list-style: none;}

  ul.columns:after,
  ol.columns:after,
  dl.columns:after                {content: ""; clear: both; width: 0; height: 0; display: block; overflow: hidden; visibility: hidden;}

  ul.columns > li, 
  ol.columns > li,
  dl.columns > dt, 
  dl.columns > dd                 {margin: 0; padding: 0; float: left;}

/* ==========================================================================
   Columns [inline]
   ========================================================================== */

  ul.columns.inline, 
  ol.columns.inline, 
  dl.columns.inline               {letter-spacing: -0.31em;}

  opera-hack:-o-prefocus, 
  ul.columns.inline, 
  ol.columns.inline, 
  dl.columns.inline               {word-spacing: -0.43em;}

  ul.columns.inline > li, 
  ol.columns.inline > li,
  dl.columns.inline > dt, 
  dl.columns.inline > dd          {float: none; display: inline-block; vertical-align: top; letter-spacing: normal}

  opera-hack:-o-prefocus, 
  ul.columns.inline > li, 
  ol.columns.inline > li, 
  dl.columns.inline > dt
  dl.columns.inline > dd          {word-spacing: normal}

hr { border-top-style: none; border-bottom-width: 0px; border-bottom-style: none; clear: both; border-right-style: none; border-left-style: none; border-top-width: 0px; border-right-width: 0px; border-left-width: 0px; padding-top: 20px; display: block; margin-bottom: 25px; }
	/*實線*/
hr.line { border-top-width: 0px; border-right-width: 0px; border-bottom-width: 1px; border-left-width: 0px; border-top-style: none; border-right-style: none; border-bottom-style: solid; border-left-style: none; border-bottom-color: #CCC; margin-top: 10px; margin-right: 0px; margin-bottom: 10px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; }
	/*虛線*/
hr.dashed { border-top-width: 0px; border-right-width: 0px; border-bottom-width: 1px; border-left-width: 0px; border-top-style: none; border-right-style: none; border-bottom-style: dashed; border-left-style: none; border-bottom-color: #CCC; margin-top: 10px; margin-right: 0px; margin-bottom: 10px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; }
 /* ==========================================================================
	文字
========================================================================== */
h1 { font-size: 2em; margin: 0.67em 0; }
h2 { font-size: 1.5em; margin: 0.2em 0; }
h3 { font-size: 1.17em; margin: 1em 0; }
h4 { font-size: 1em; margin:  0; }
h5 { font-size: 0.83em; margin: 1.67em 0; }
h6 { font-size: 0.67em; margin: 2.33em 0; }
/*時間*/
time { font-family: Verdana, Geneva, sans-serif; font-size: 10px; color: #999; }
address { font-style: normal; font-weight: normal; }
/*顏色*/

/*備註文字*/
.notes {color: #999;}

/* 避免無空格的長文拉寬畫面 */
td.code , td.quote { display: block !important; overflow: auto !important; }

/*強制google小字體*/
.fsize {-webkit-text-size-adjust: none;}
.en,.morelink{
	font-family:Verdana, sans-serif!important;
}
.tsmall{
	font-size:11px;
}
.letter-spacing{
	letter-spacing:3px;
}
/* ==========================================================================
		圖片
========================================================================== */

.img-circle {
  border-radius: 50%;
}
.pic{ 
	position:relative;
	overflow:hidden;
}
/* ==========================================================================
		編排
========================================================================== */
/*靠左右*/
.fr {float: right !important;}
.fl {float: left !important;}
/*自動100%撐開*/
.auto { overflow: hidden; zoom: 1; }
.auto .left {float: left;}
.auto .right { overflow: hidden; zoom: 1; }
/*寬度*/
.w10 {width: 9%;}
.w20 {width: 19%;}
.w30 {width: 29%;}
.w40 {width: 39%;}
.w50 {width: 50%;}
.w60 {width: 59%;}
.w70 {width: 69%;}
.w80 {width: 79%;}
.w90 {width: 89%;}
.w100 {width: 99%;}
.w15 {width: 14%;}
.w25 {width: 24%;}
.w35 {width: 34%;}
.w45 {width: 44%;}
.w55 {width: 54%;}
.w65 {width: 64%;}
.w75 {width: 74%;}
.w85 {width: 84%;}
.w95 {width: 94%;}

.w33{ width: 33%;}

/* ==========================================================================
	常用
========================================================================== */
/*圓角*/
.radius {border-radius: 5px;}
/*文字陰影*/
.text-shadow {text-shadow: 1px 1px 2px #777;}
/*區塊陰影*/
.box-shadow {box-shadow: 3px 3px 5px #777;}
/*選取*/
li:nth-child(1) {}
li:first-child {}
li:last-child {}
li:nth-child(even){}/*偶數*/
li:nth-child(odd){}/*單數*/
/*手指效果*/
.cursor {cursor: pointer;}
/*Hack*/
.hack {margin-right: 14px; /* IE 8+ */}
:root .hack {margin-right: 18px9; /* IE 9+ */}
*+html .hack {margin-right: 14px; /* IE 7+ */}

/*3角型*/
[class^="caret-"]:after, [class*="caret-"]:after{
	display: inline-block;
	margin-left:10px;
	content:'';
	border-width: 4px; 
	border-color: transparent; 
	border-style: solid;
}
/*left*/
.caret-t:after{ 
	border-left-width:0; 
	border-right-color:#000000; 
}
/*down*/
.caret-b:after{ 
	border-bottom-width:0; 
	border-top-color:#000000; 
}
/*right*/
.caret-r:after{ 
	border-right-width:0; 
	border-left-color:#000000; 
}

/*正等腰三角型*/
.caret-triangle{ 
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 6px 10px 6px;
	border-color: transparent transparent #4d4d4d transparent;
}

.whiteBG{
	background-color: #fff !important;
}

/*去除div無物件的區塊不影響階層*/
.pointer-events { pointer-events: none; /*外圍物件*/ pointer-events: auto; /*外圍物件*/ }
/*ie9以上支援*/
:root .root {}
/*正方形圖片*/
 .square{
	 position:relative;
}
a{transition: background-color 1s,color 0.5s;}
/*正中央*/
.center{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	margin:auto;
}
.middle {
  display: table;
}

.middle > span {
  display: table-cell;
  vertical-align: middle;
}
.middle-inline {
	height:300px;
	background-color:rgba(244,146,148,1.00);
	vertical-align :middle;
	text-align: center
}

.middle-inline:before{
	height: 100%;
	display: inline-block;
	vertical-align: middle;
	content:'';
}

.middle-inline > div {
	display: inline-block;
	vertical-align: middle;
}



/*div 的 table */
.css-table {
    display: table;
 }
 .css-table .thead {
    display:table-header-group;
 }
 .css-table .tbody {
    display:table-row-group;
 }
.css-table .tr {
    display:table-row;
 }/* 
 .css-table .th,
 .css-table .td {
   display:table-cell;
 }
*/



.clear{ clear:both;}

#Loading{ 
	background: url(../images/common/loading_01.gif) no-repeat; 
	width:32px; height:32px; 
	display:block;
	position:absolute; 
	top:50%; left:50%;
	margin-top:-16px; margin-left:-16px;
	z-index:0;
}


.imgCenter{
	text-align: center;
}
.imgCenter img{
	margin-left:auto;
	margin-right:auto;
	
}

.imgCenterImg{
	margin-left:auto;
	margin-right:auto;
	
}


.paddingRL0 {
	padding-left: 0;
	padding-right: 0;
}


.img-responsiveH {
	display: block;
	height: 100%;
	max-height: 100% \9;
	width: auto;
	display: block;
}

.img-responsiveH img{
	display: block;
	height: 100%;
	max-height: 100% \9;
	width: auto;
	display: block;
}

.img-responsive img{
	display: block;
	width: 100% \9;
	max-width: 100%;
	height: auto;
}


/*文字斷行*/
@media (max-width: 767px){
	.clear-xs {
		clear: both;
		display: block;
	}
}

.testBox {
	width:100%;
	height: 700px;
	display: block;
	border:2px solid #1ff;
	clear: both;
	overflow: auto;
}


/*文字斷行*/
@media (max-width: 767px){
	.clear-xs {
	clear: both;
	display: block;
	}
}

/* 用在影片伸縮自如的愛~ */
.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}