/* 通用*/
* {
	margin: 0;
	font-family: 'HelveticaNeue-Light', 'Roboto', '微軟正黑體', 'Microsoft JhengHei';
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
/* set image max width to 100% */
img {
	max-width: 100%;
	height: auto;
	width: auto; /* ie8 */
}

/*中間內容*/
.center1400 {
	width: 1400px;
	margin: 0 auto;
	padding: 0 50px;
	display: flex;
}
.center1200 {
	width: 1200px;
	margin: 0 auto;
	padding: 0 50px;
	display: flex;
}
@media screen and (max-width: 1440px){
.center1400 {
	width: 100%;
	max-width:1400px;
	padding: 0 5%;
}		

.center1200 {
	width: 100%;
	max-width:1200px;
	padding: 0 5%;
}
}
/*空間*/
.flex-container {
	display: flex;
	flex-direction: row; /*column 垂直*/
	justify-content: center;

}
.flex-container ul, .flex-container li{
	list-style-type: none;
}
.flex-item-1{
	flex: 1 1 100%;
	padding: 1%;
	justify-content: center;
	
}
.flex-item-2{
	flex: 1 1 50%;
	padding: 1%;
	justify-content: center;
}
.flex-item-3{
	flex: 1 1 33.333%;
	padding: 1%;
	justify-content: center;
}
.flex-item-4{
	flex: 1 1 25%;
	padding: 1%;
	justify-content: center;
}
.flex-item-5{
	flex: 1 1 20%;
	padding: 1%;
	justify-content: center;
}

/*斷行*/
.flex-wrap{
	flex-wrap: wrap;/*多行*/
}
.flex-wrap-reverse{
	flex-wrap: wrap-reverse;/*多行逆向*/
}
/*指向*/
.flex-direction-row-reverse {
	flex-direction: row-reverse;/*逆向*/
}
.flex-direction-column {
	flex-direction: column;/*垂直排列*/
}
.flex-direction-column-reverse {
	flex-direction: column-reverse;/*垂直排列逆向*/
}


@media screen and (max-width: 834px) {
.flex-container {
	flex-wrap:wrap;/*多行*/
}	
.flex-item-1,.flex-item-2,.flex-item-4,.flex-item-5{
	flex: 1 1 25%;
}	
}
@media screen and (max-width: 512px) {
.flex-item-1,.flex-item-2,.flex-item-3,.flex-item-4,.flex-item-5{
	flex: 1 1 50%;
}

}
/* justify-content 左右*/
.flex-j-start
{justify-content: flex-start}
.flex-j-end
{justify-content: flex-end}
.flex-j-center
{justify-content: center}
.flex-j-space-around
{justify-content: space-around}
.flex-j-space-between
{justify-content: space-between}
	
/* align-items 垂直*/
.flex-a-start
{align-items: flex-start}
.flex-a-end
{align-items: flex-end}
.flex-a-center 
{align-items: center}
.flex-a-stretch 
{align-items: stretch}
.flex-a-baseline
{align-items: baseline}	

/* align-content */
.flex-ac-start
{align-content: flex-start}
.flex-ac-end
{align-content: flex-end}
.flex-ac-center 
{align-content: center}
.flex-ac-space-between
{align-content: space-between}
.flex-ac-space-around
{align-content: space-around}
.flex-ac-stretch
{align-content: stretch}

/*空間*/
.space1 {
    max-width: 100%;
    padding: 0 5px;
    float: left;
}
.space2 {
    max-width: 50%;
    padding: 0 5px;
    float: left;
}
.space3 {
    max-width: 33.3333%;
    padding: 0 5px;
    float: left;
}
.space4 {
    max-width: 25%;
    padding: 0 5px;
    float: left;
}
.space5 {
    max-width: 20%;
    padding: 0 5px;
    float: left;
}
/* 螢幕等高 */
.vh100 {
	height: 100vh;
}
/*置中*/
.center {
	margin: 0 auto;
}
/* 浮動float*/
.left {
	float: left;
}
.right {
	float: right;
}
.clear {
	clear: both;
}
/* 定位 */
.rel {
	position: relative;
}
.abs {
	position: absolute;
}
.fix {
	position: fixed;
}
.z1 {
	z-index: 1;
}
.z2 {
	z-index: 2;
}
.z3 {
	z-index: 3;
}
.z4 {
	z-index: 4;
}
.z5 {
	z-index: 5;
}
.z6 {
	z-index: 6;
}
.z7 {
	z-index: 7;
}
.z8 {
	z-index: 8;
}
.z-1 {
	z-index: -1;
}
.z99 {
	z-index: 99;
}
.z999 {
	z-index: 999;
}
.z9999 {
	z-index: 9999;
}
/* 背景色 */
.bgwhite {
	background-color: #fff;
}
.bggray {
	background-color: #ececec;
}
.bggrayd {
	background-color: #aaaaaa;
}
.bgblack {
	background-color: #313131;
}
.bgblack10 {
	background-color: rgba(0,0,0,0.30);
}
.bgblack30 {
	background-color: rgba(0,0,0,0.30);
}
.bgblack50 {
	background-color: rgba(0,0,0,0.30);
}
.bggold {
	background-color: #bda999;
}
.bggoldd {
	background-color: #998376;
}
.bgred {
	background-color: #ba282a;
}
.bgyred {
	background-color: #d82c2c;
}
.bgcomplexion {
	background-color: #faf5f0;
}
.bgbrown {
	background-color: #a28265;
}
.bgorange {
	background-color: #f7965b;
}
.bgpurple {
	background-color: #7e308e;
}
.bgyellow {
	background-color: #f8c733;
}
/* 螢光 */
.bgshockgren {
	background-color: #c7eb1e;
}
.bgshockyel {
	background-color: #f6ff3b;
}
.bgshockpnk {
	background-color: #db337a;
}


/* 分隔線 */
.line {
	border-top: 1px inset #bda999;
	margin: 3% 0 1% 0;
	padding: 1% 0;
	clear: both;
}
.linew {
	border-top: 1px solid #fff;
	margin: 1% 0;
	padding: 1% 0;
	clear: both;
}
.linewb {
	border-top: 5px solid #fff;
	margin: 3% 0 1% 0;
	padding: 1% 0;
	clear: both;
}
.lineg {
	border-top: 1px solid #bda999;
	margin: 3% 0 1% 0;
	padding: 1% 0;
	clear: both;
}
/* 垂直分隔線 */
.vline {
	border-right: 1px inset #bda999;
	margin: 0 6%;
	padding: 8% 0;
	float:left;
}
.vlinew {
	border-right: 1px solid #fff;
	margin: 0 6%;
	padding: 8% 0;
	float:left;
}
.vlinews {
	border-right: 1px solid #fff;
	margin: 0 4%;
	padding: 5% 0;
	float:left;
}

/* 外框 */
.framew {
	border: 1px inset #fff;
}
.frameg {
	border: 1px inset #bda999;
}
.framesg {
	border: 1px solid;
}

/* 字色 */
.tred {
	color: #ba282a;
}
.tgold {
	color: #bda999;
}
.tgoldd {
	color: #998376;
}
.tgold2 {
	color: #dccea7;
}
.tgray35 {
	color: #bfbfbf;
}
.tbgray35 {
	color: #6f96ab;
}
.tgray50 {
	color: #a0a0a0;
}
.tgray70 {
	color: #707070;
}
.twhite {
	color: #fff;
}
.tbrown {
	color: #b48e6c;
}
.tblack {
	color: #000000;
}
.tbluek{
	color: #95a2ac;
}

.torange {
	color: #f7965b;
}
.tblue {
	color: #57a2eb;
}
.tindigo {
	color: #96b8f6;
}
.tbluepurple {
	color: #a57ded;
}
.tgreen {
	color: #caf648;
}
.tpurple {
	color: #9332a7;
}
/* 螢光 */
.tshockgren {
	color: #c7eb1e;
}
.tshockyel {
	color: #f6ff3b;
}
.tshockpnk {
	color: #db337a;
}
.tshockblue {
	color: #45beff;
}

/*文字陰影*/
.tshadow {
	text-shadow:2px 1px 7px #000000;
}
.twshadow {
	text-shadow:2px 1px 7px #fff;
}

/*文字對齊*/
.tcter {
	text-align: center;
}
.tlef {
	text-align: left;
}
.trht {
	text-align: right;
}
.tjustify{
	text-align: justify;
}

.thcter{
	vertical-align: middle;
	}
/* 字級&行距 */
.hb10 {
	font-size: 10em!important;
}
.hb8 {
	font-size: 8em!important;
}
.hb6 {
	font-size: 6em!important;
}
.hb5 {
	font-size: 5em!important;
}
.hb4 {
	font-size: 4em!important;
}
.hb3 {
	font-size: 3em!important;
}
.hb2-5 {
	font-size: 2.5em!important;
}
.hb2 {
	font-size: 2em!important;
}
.hb1-5 {
	font-size: 1.5em!important;
}
.hb1 {
	font-size: 1.4em!important;
}
.hb0-5 {font-size: 1.2em!important;}

/* p {font-size: 1.1em!important;
	margin: 0}*/

.lh0 {
	line-height: 1.2em;
}
.lh1 {
	line-height: 1.5em;
}
.lh2 {
	line-height: 2em;
}


/* 字級間距 */
.ls1 {
	letter-spacing: 0.1em!important;
}
.ls2 {
	letter-spacing: 0.2em!important;
}
.ls3 {
	letter-spacing: 0.3em!important;
}
.ls5 {
	letter-spacing: 0.5em!important;
}
.ls7 {
	letter-spacing: 0.7em!important;
}
/* 字粗細 */
.fw3 {font-weight: 300!important;}
.fw5 {font-weight: 500!important;}
.fw6 {font-weight: 600!important;}

/*垂直間隔*/
.ht1{ padding-bottom:1vh!important;}
.ht2{ padding-bottom:2vh!important;}
.ht3{ padding-bottom:3vh!important;}
.ht4{ padding-bottom:4vh!important;}
.ht5{ padding-bottom:5vh!important;}
.ht7{ padding-bottom:7vh!important;}
.ht9{ padding-bottom:9vh!important;}
.ht11{ padding-bottom:11vh!important;}
.ht21{ padding-bottom:21vh!important;}
.ht25{ padding-bottom:25vh!important;}
.ht30{ padding-bottom:30vh!important;}
.ht35{ padding-bottom:35vh!important;}
.ht40{ padding-bottom:40vh!important;}
.ht45{ padding-bottom:45vh!important;}
.ht50{ padding-bottom:50vh!important;}

/*文字陰影*/
.tshad {
	text-shadow: 1px 1px 8px rgba(0,0,0,0.5);
}

/*文字刪除線*/
.tline-through {
	text-decoration: line-through;
}
.tline-under {
	text-decoration: underline;
}

/*按鈕*/
/* Highlight outline */
.MainBBStyleHO {
    color: #0076DE!important;
    border: solid 1px #0076DE!important;
}
.MainBBStyleHO:hover {
    color: #fff!important;
	  background-color: #005eb2;
    border: solid 1px #005eb2;
}

/*框粗*/
.border-bold{
	border-width: 3px;	
}
.border-bold:hover {
	border-width: 3px;	
}
/*框圓角*/
.border-radius{
	border-radius: 5px;	
}


/*通用end*/

/*CMS修改bug*/
ol, ul {
    padding-left: 0!important;
}
.ArticleTitleGroup, .BreadcrumbsGroup
{display: none!important}
.QGrid .Title {
    display: none!important;
}
.FontH1 {
        padding-bottom: 1%!important;
    }
.FontH3 {
        padding-bottom: 1%!important;
    }
/*左圖右文框架 */
.muchcontent {
	height:auto!important;
  min-height:600px!important;	
}
.midcontent{height:auto;min-height:auto}

/*RWD */
@media (min-width: 768px) {
  .lesscontent{height:auto!important;}
  .midcontent {height: auto;min-height: auto;}

}
@media (min-width: 1300px) {
  .lesscontent{height:600px!important;}
  .midcontent{height:600px;min-height:400px}	
}

