﻿@charset "utf-8";
/*******************************************************************************
 * Version 1.0 Release 2016.01.15;
 * Copyright 2016, "lucre"<lucrecia@titan-tech.com.tw>. All rights reserved.
 ******************************************************************************/
/* Global Style & Reset Start */
/*Reset Start*/
html, body {
	margin:0;
	padding:0;
	height:100%;
	-webkit-text-size-adjust:none; /*在ios 旋轉手機畫面時，鎖定文字不縮放*/
}
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, 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, input, select, textarea, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	box-sizing: border-box;
	-mox-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	word-wrap: break-word;
	word-break: break-all;
}
form, fieldset, h1, h2, h3, h4, h5, h6, p {
	margin:0;
	padding:0;
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;/*預設16px*/
}
/*圖片*/
img {
	border: 0;
	margin: 0;
	vertical-align: middle;
	width: 100%;
	max-width: 100%;
	height: auto;

}
a:hover img, a:active img {}
/*項目清單-取消項目符號(注意:當真正在使用預設項目清單時，請之後覆寫)*/
ul, ul > li, ol,ol > li {
	margin:0;
	padding:0;
	list-style:none;
}
/*Icon-i元素目前專給icon使用*/
i {
	display: inline-block;
	vertical-align: middle;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
/*去除focus outline-chrome預設*/
a:focus, input:focus, select:focus, textarea:focus, button:focus {
	outline:0;
}
table {
	max-width: 100%;
	background-color: transparent;
	border-collapse: collapse;
	border-spacing: 0;
}
/*Reset End*/

/*Base style*/
body {
	font:100%/1.2 Helvetica,"蘋果儷中黑","微軟正黑體",Verdana,Arial,sans-serif,"新細明體";
	color:#455a64;
	background: #fff;
	line-height:1.875;/*30px/16px*/
}
/*文字連結*/
a {
	text-decoration: none;
}
/*文字連結-滑過*/
a:hover, a:active {
	text-decoration: underline;
}
/*強調重點*/
strong {
	font-weight: normal;
}
/*崁入影片 Start*/
.Film {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px; height: 0; overflow: hidden;
}
.Film iframe,
.Film object,
.Film embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
/*崁入影片 End*/
/*有序項目列表*/
.OlList {
	padding: 0 0 0 30px;
}
.OlList > li {}
/*數字(1,2,3)*/
.Decimal > li {
	list-style-type: decimal;
}
/*中文數字(一,二,三)*/
.Cjk > li {
	list-style-type: cjk-ideographic;
}
/*小寫英文字母*/
.LowerLatin > li {
	list-style-type: lower-latin;
}
/*無序項目列表*/
.UlList {
	padding: 0 0 0 30px;
}
.UlList > li {}
/*實心圓形*/
.Disc > li {
	list-style-type: disc;
}
/*空心圓點*/
.Circle > li {
	list-style-type:circle;
}
/*實心方形*/
.Square > li {
	list-style-type: square;
}
/*Button Start*/
/*Button original*/
a.Btn,
button,
input[type=button],
input[type=reset],
input[type=submit]{
	cursor:pointer;/*預設為手型*/
	border:none;/*去除button元素border*/
	display: inline-block;
	text-decoration: none;
	/*以下依設計調整*/
	font-family:"微軟正黑體",Verdana,Arial,Helvetica,sans-serif,"新細明體";
	width: 100%;
	line-height: 1.6;
	text-align:center;
	vertical-align: middle;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
}
button:disabled, button:hover:disabled, button:active:disabled {
	background: #ccc;
	color: #aaa;
	cursor: default;
}
/*Button size*/
.Btn.BtnS {
	font-size:0.875em;/*14px/16px*/
}
.Btn.BtnM {
	font-size:1.125em;/*18px/16px*/
}
.Btn.BtnL {
	font-size:1.25em;/*20px/16px*/
}
/*Button style-淺色按鈕-一般狀況都可使用*/
.Btn.Base {
	background: #aeaeae;
	color: #fff;
}
.Btn.Base:hover, .Btn.Base:active {
	background: #919191;
}
/*Button style-深色按鈕-誘導觸發*/
.Btn.Dark {
	background: #45c8ab;
	color:#fff;
}
.Btn.Dark:hover, .Btn.Dark:active {
	background: #cfd8dc;
	color: #869197;
}
/*Button style - 例外按鈕*/
.Btn.BtnGoTop {
	background: #fff;
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	border: 1px solid #fff;
	width: 55px;
	height: 55px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
}
.Btn.BtnGoTop:hover, .Btn.BtnGoTop:active {
	border-color: #d8e1e5;
}
/*Button End*/
/*form Start*/
form {
	width: 100%;
}
form > fieldset {
	border: none;
}
/*Input Start*/
/*單行輸入欄位(文字、密碼)、下拉選單、多行輸入欄位(留言)*/
textarea,
select,
input[type=search],
input[type=text],
input[type=password],
input[type=date],
input[type=month],
input[type=time],
input[type=number],
input[type=email],
input[type=tel],
input [type=url] {
	font-family:"微軟正黑體",Verdana,Arial,Helvetica,sans-serif,"新細明體";
	font-size: 1em;/*16px/16px*/
	width: 100%;
	padding: 10px;
	border: 1px solid #d8e1e5;
	-webkit-appearance:none;/*消除iphone/ipad預設內陰影*/
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
/*input focus*/
input[type=search]:focus {
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
}
textarea:focus,
select:focus,
input[type=text]:focus,
input[type=password]:focus,
input[type=date]:focus,
input[type=month]:focus,
input[type=time]:focus,
input[type=number]:focus,
input[type=email]:focus,
input[type=tel]:focus {}
/*清除X*/
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
	display: none;
}
/*input Error*/
input[type=text].Error,
input[type=password].Error,
select.Error,
textarea.Error {}
/*多擇一選項*/
input[type=radio] {
	vertical-align: middle;
}
/*checkbox核取方塊*/
input[type=checkbox] {
	vertical-align: middle;
}
/*radio、checkbox和下一個物件間距*/
input[type=radio] + label,
input[type=checkbox] + label {}
/*Input size*/
/*多行文本輸入欄位(留言)*/
textarea {}
/*下拉清單*/
select {}
/*select size*/
/*Panel*/
/*Panel-面板區塊(div、fieldset、table共用)*/
/*Panel-面板區塊(防止fieldset內legend超出範圍)*/
fieldset.Panel,
.Panel{
	width: 100%;
	overflow: hidden;
	font-size: 15px;
	padding-top: 12px;
}
.Panel{
	padding-top: 0;/*去除fieldset推移*/
}
/*Panel-標題列*/
.Panel > caption,
.Panel > h2,
fieldset.Panel > legend {
	font-size: 1em;
	text-align: left;
	overflow: hidden;
	font-weight: 100;
}
/*Panel-標題列(fieldset額外設定)*/
fieldset.Panel > legend,
.Panel > h2 {
	width: 100%;
	font-size: 36px;/*36/16*/
	color: #00bcbe;
	text-align: center;
	margin: 0;
	padding: 0;
	font-weight: 100;
	position: static;
}
/*Panel-標題列右方(文字、連結、功能)*/
.Panel > caption a,
.Panel > caption span,
.Panel > h3 a, .Panel > h3 span,
fieldset.Panel > legend a,
fieldset.Panel > legend span {
	float: right;
	margin: 0 5px 0 0;
	color: #dedbdb;
}
/*Panel-內容*/
.Panel .PanelBody {
	line-height: 1.6;
}
/*一般表單-表單內的橫列*/
fieldset.Panel > .PanelBody > .Field {
	display: block;
	margin: 0.6em 0 0.6em;/*8px/16px*/
	position: relative;
}
/*Only for 會員中心*/
fieldset.Panel > .PanelBody > .Field > div > #twzipcode input[type=text] {
	padding: 4px 5px 3px;
	height:28px;
}
/*一般表單-左側欄位(名稱)*/
fieldset.Panel > .PanelBody > .Field > label {
	/*font-size: 0.9375em;15px/16px*/
	margin: 0 0 0.4em;/*0 0 6px/15px*/
	color: #000000;
	display: inline-block;
}
/*一般表單-左側欄位(必填星號)*/
fieldset.Panel > .PanelBody > .Field.Must > label:after {
	/*content: "*";*/
	/*display: inline-block;*/
	/*color: #ff0000;*/
}
/*一般表單-必填欄位出現錯誤時反應*/
fieldset.Panel > .PanelBody > .Field > .ErrorBox {
	font-size: 0.875em;/*14px/16px*/
	color: #e50000;
	/*height: 20px;*/
	margin: 0.6em 0;
	display: none;
}
/*一般表單-必填欄位出現錯誤時反應-文字*/
fieldset.Panel > .PanelBody > .Field > div.ErrorBox > span,
fieldset.Panel > .PanelBody > .Field > div.ErrorBox > span > span {}
fieldset.Panel > .PanelBody > .Field > div.ErrorBox > span.Error:before {
	content: " ";
	background: url("../../images/blogclass/icon_global.svg?t=20151215v01") no-repeat -98px -28px;
	background-size: 140px 140px;
	display: inline-block;
	width: 14px;
	height: 14px;
	vertical-align: middle;
	margin: -1px 4px 0 0;
}
fieldset.Panel > .PanelBody > .Field > div.ErrorBox > span.ErrorNet > span:before {
	content: " ";
	background: url("../../images/blogclass/icon_global.svg?t=20151215v01") no-repeat -98px -28px;
	background-size: 140px 140px;
	display: inline-block;
	width: 14px;
	height: 14px;
	vertical-align: middle;
	margin: -1px 4px 0 0;
}
/*一般表單-必填欄位出現錯誤時反應-錯誤符號*/
fieldset.Panel > .PanelBody > .Field > .ErrorBox > span > .IError{
	margin: -2px 4px 0 0;
}
/*一般表單-填寫欄位區(多組label被div包起來，例如:radio、checkbox）*/
fieldset.Panel > .PanelBody > .Field > div {
	display: inline-block;
}
fieldset.Panel > .PanelBody > .Field > div > select,
fieldset.Panel > .PanelBody > .Field > div > input{
	margin-bottom: 0.6em;
}
fieldset.Panel > .PanelBody > .Field > div > .Address{
	display: block;
}
/*清除輸入按鈕*/
fieldset.Panel > .PanelBody > .Field > .Btn.ClearBtn{
	background: none;
	width: 23px;
	height: 23px;
	margin:-3px 0 0 -33px;
	display: none;
}
fieldset.Panel > .PanelBody > .Field > .Btn.ClearBtn > i{
	margin: -4px 0 0 0;
}
/*一般表單-填寫欄位區(多組label被div包起來，例如:radio、checkbox）*/
fieldset.Panel > .PanelBody > .Field > div > label {
	/*font-size: 0.9375em;*/
	/*cursor:pointer;預設為手型*/
	margin: 0 5px 0.4em 0;
	display: inline-block;
}
/*輸入其他資訊*/
fieldset.Panel > .PanelBody > .Field > div > span.Other {
	display:none;
}
/*一般表單-填寫欄位區(有動作icon時）*/
fieldset.Panel > .PanelBody > .Field > div > button > i {
	/*margin: 0 10px 0 0;*/
}
/*一般表單-填寫欄位區(註解）*/
fieldset.Panel > .PanelBody > .Field > .Comment {
	font-size: 14px;
	color: #f00;
	margin: 0.6em 0;
}
/*一般表單-展開區塊(當有動作時)*/
fieldset.Panel > .PanelBody > .Field > div.Expend {
	padding: 0.8125em 0;/*13px/16px 0*/
	margin: 0.5em 0 0;/*8px/16px 0 0*/
	display: none;
}
/*一般表單-展開區塊(註解）*/
fieldset.Panel > .PanelBody > .Field > .Expend .Comment {
	font-size: 0.875em;/*14px/16px*/
	padding: 0.7142857142857143em 0 0;/*10px/14px 0 0*/
	color: #838383;
}
fieldset.Panel > .PanelBody > .Field > div > a > i {
	margin: 0 10px 0 8px;
}
/*Media圖片集中區 Start*/
.IconNav, .IconClear, .IconTop, .IconHome, .IconWriting, .IconPhoto, .IconTraffic, .IconArticle {
	background: url("../../images/blogclass/icon_global.svg?t=20151230v01") no-repeat;
}
/*Media圖片集中區 End*/
/*Media圖片size Start*/
.IconNav, .IconTop, .IconHome, .IconWriting, .IconPhoto, .IconTraffic, .IconArticle {
	background-size: 220px 220px;
	width: 22px;
	height: 22px;
}
/*Media圖片size End*/
/*Media圖片位置 Start*/
.IconNav {
	background-position: 0 0;
}
a:hover .IconNav, a:active .IconNav, a.Active .IconNav {
	background-position: -22px 0px;
}
.IconTop {
	background-position: -88px 0;
}
a:hover .IconTop, a:active .IconTop {
	background-position: -110px 0;
}
.IconHome {
	background-position:-132px 0;
}
.IconWriting {
	background-position:-154px 0;
}
.IconPhoto {
	background-position:-176px 0;
}
.IconTraffic {
	background-position:-198px 0;
}
.IconArticle {
	background-position:0 -22px;
}
/*Media圖片位置 End*/
/*過場動畫*/

@media screen and (min-width: 768px) {
}
/*如果使用者之視窗寬度>=1024px，將會再載入這裡的 CSS。*/
@media screen and (min-width: 1024px) {
	/*圖片*/
	img {
		width: auto;
		/*max-width: none;*/
		height: auto;
	}
	/*麵包屑*/
	.Breadcrumb {
		font-size: 0.875em;/*14px/16px*/
		margin: 0 0 0.867em;/*13px/15px*/
	}
	.Breadcrumb > li {
		display: inline;
		color: #00bcbe;
	}
	.Breadcrumb > li:after {
		content: " > ";
		color: #ccc;
		display: inline-block;
		vertical-align: middle;
		margin: -6px 6px 0 10px;
	}
	.Breadcrumb > li:last-child:after {
		display: none;
	}
	.Breadcrumb > li > a {
		color: #444;
		text-decoration: none;
	}
	.Breadcrumb > li > a:hover span, .Breadcrumb > li > a:active span, .Breadcrumb > li.Current a span {
		color: #45c8ab;
		border-bottom: 1px solid #45c8ab;
	}
}