@import url(http://fonts.googleapis.com/earlyaccess/cwtexfangsong.css);
/*-------------------------------------------
     基本版面設定區
-------------------------------------------*/		
body {
	margin: 0px;
	padding: 0px;
	font-family: 'Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	background-color: #FFF;
}
img, object, embed, video {max-width: 100%;vertical-align: bottom;border: 0px;}
/* IE 6 不支援最大寬度，因此寬度預設為 100% */
.ie6 img {width:100%;border: 0px;}
a,a:link,a:hover,a:active,a:visited{transition: 1s;text-decoration: none;}

/*-----------------------------------------------------
                   其他設定區
-----------------------------------------------------*/
.all-img{width:100%;vertical-align: bottom;}

.row{
	padding-right: 10px;
	padding-left: 10px;
}
.row-a{
	padding-right: 15px;
	padding-left: 15px;
}

.rows{
	padding-right: 20px;
	padding-left: 20px;
}

h1{
	font-size: 2em;
	line-height: 0.9em;
	color: #333;
	font-family: 'Crimson Text', serif;
}

h2{
	font-size: 136%;
	line-height: 0.9em;
	color: #333;
}

h3{
	font-size: 136%;
	line-height: 0.9em;
	color: #060;
}

p{
	line-height: 1.55em;
	color: #333;
	font-size: 118%;
}

.text-left{
	text-align: left;
}

.text-lefts{
	text-align: left;
	font-size: 180%;
	line-height: 1.75em;
	color: #333;
}

.text-center{
	text-align: center;
}

.text-right{
	text-align: right;
}

.text-rights{
	text-align: right;
	font-size: 180%;
	line-height: 1.75em;
	color: #333;
}

.center-line{
	ececec
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ececec;
	border-bottom-width: 1px;
}

 .video-container {

position: relative;
padding-top: 30px;

padding-bottom: 56.25%;

padding-top: 0px;

height: 0;

overflow: hidden;

}
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video { display: block; }

.vdiv{position: absolute;
top: 50%;
left: 50%;}

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

.video-area{
	width: 100%;
	background-color: #000;
	float: left;
}

.mp3-area{
	width: 100%;
	float: left;
	margin-top: 10px;
	margin-bottom: 30px;
}
.mp3-areas{
	width: 100%;
	float: left;
}

.video{
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	max-width:1170px;
}


.video-container{
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 0px;
	height: 100%;
	overflow: hidden;
	text-align: left;

/*width:-moz-calc(100% - 20px); width:-webkit-calc(100% - 20px); width:calc(100% - 20px);*/

}


 

.video-container iframe,

.video-container object,

.video-container embed{

position:absolute;

top:0;

left:0;

width:100%;

height:100%;

}

/*-----------------------------------------------------
                   按鈕設定區
-----------------------------------------------------*/
.send-area{
	width: 100%;
	margin-top: 0px;
	margin-bottom: 0px;
	border-top-width: 0px;
	border-bottom-width: 0px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #ececec;
	border-bottom-color: #ececec;
	float: left;
	padding-top: 0px;
	padding-bottom: 0px;
	text-align: center;
}

.huyuu{
	font-size: 108%;
	font-family: 'Noto Sans TC', 'cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	color: #333;
	border: 0;
	border-radius: 10px;
	letter-spacing: 1px;
	margin-top: 5px;
	margin-right: 0;
	margin-bottom: 5px;
	margin-left: 0;
	line-height: 1.75em;
	float: left;
	padding: 0px;
}
.huyuu:hover{
	color: #333;
}


.send{
	font-size: 100%;
	font-family: 'Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	color: #fff;
	border: 0;
	border-radius: 10px;
	letter-spacing: 1px;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
	line-height: 1.75em;
	float: left;
	padding: 0px;
}
.send:hover{
	color: #9C0;
}

.fb{
	font-size: 100%;
	font-family: 'Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	color: #fff;
	border: 0;
	border-radius: 10px;
	letter-spacing: 1px;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
	line-height: 1.75em;
	float: left;
	padding: 0px;
}
.fb:hover{
	color: #9C0;
}

.phone{
	font-size: 100%;
	font-family: 'Noto Sans TC', 'cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	color: #fff;
	border: 0;
	border-radius: 10px;
	letter-spacing: 1px;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
	line-height: 1.75em;
	float: left;
	padding: 0px;
}
.phone:hover{
	color: #9C0;
}

.map{
	font-size: 100%;
	font-family: 'Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	color: #fff;
	border: 0;
	border-radius: 10px;
	letter-spacing: 1px;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
	line-height: 1.75em;
	float: left;
	padding: 0px;
}
.map:hover{
	color: #9C0;
}


.btn-center{
	width: 100%;
	max-width: 180px;
	margin-right: auto;
	margin-left: auto;
}

.more{
	font-size: 100%;
	font-family: 'Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	color: #fff;
	border: 0;
	border-radius: 10px;
	letter-spacing: 1px;
	background-color: #003399;
	margin-top: 10px;
	margin-right: 0;
	margin-bottom: 10px;
	margin-left: 0;
	line-height: 1.75em;
	float: left;
	transition: 1s;
	text-decoration: none;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
}
.more a,a:link{
	transition: 1s;
	text-decoration: none;
}

.more:hover{
	background-color: #9C0;
	transition: 1s;text-decoration: none;
}


/*-----------------------------------------------------
                   頁面滑動固定
-----------------------------------------------------*/




/*-----------------------------------------------------
                   欄目設定區
-----------------------------------------------------*/

.col-em{
	float: left;
	padding: 5px;
}

.col-emsa{
	float: left;
	padding: 5px;
	display: block;
}
	
.col-ems{
	float: left;
	padding: 5px;
	display: none;
	text-align: center;
}

.col-em2{
	float: left;
	width: 20%;
}

.col-em3{
	float: left;
	width: 30%;
}

.col-em4{
	float: left;
	width: 40%;
}

.col-em5{
	float: left;
	width: 50%;
}

.col-em6{
	float: left;
	width:60%;
}

.col-em7{
	float: left;
	width:70%;
}		

.col-em8{
	float: left;
	width:80%;
}
	

/*-----------------------------------------------------
                   首頁版面設定區
-----------------------------------------------------*/
#wrapper{
	float: left;
	width: 100%;
	position: relative;
	min-height: 100%;
	border-top-width: 0px;
	border-top-style: solid;
	border-top-color: #060;
}

.wrapper-flot{
	float: left;
	width: 100%;
	background-color: #060;
	position: fixed;
	bottom: 0;
	z-index: 3;
}

.container{
	width: 100%;
	max-width: 1170px;
	margin-right: auto;
	margin-left: auto;
}

.containers{
	float: left;
	width: 100%;
}


.content{
	padding-right: 15px;
	padding-left: 15px;
}

.contents-footer{
	width: 100%;
	max-width: 440px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 0px;
	padding-bottom: 0px;
}

.contents{
	width: 100%;
	max-width: 700px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 0px;
	padding-bottom: 0px;
}

/*-----------------------------------------------------
                   格線設定區
-----------------------------------------------------*/

.line-area{
	float: left;
	width: 100%;
	padding-top: 20px;
	padding-bottom: 20px;
}
.line-area .d-line{
	width: 40px;
	background-color: #123654;
	height: 3px;
	margin-right: auto;
	margin-left: auto;
}

/*-----------------------------------------------------
                   區塊設定區
-----------------------------------------------------*/

/*----------------- 前導短片(萬花筒→浮島版→預告版，每週更新) --------------------*/

#header{
	float: left;
	width: 100%;
	margin-top: 0px;

}

.header{
	float: left;
	width: 100%;
	background-color: #FFF;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ededed;
	
}

.header-h1{
	float: left;
	width: 100%;
	font-size: 160%;
	line-height: 1.75em;
	text-align: center;
}

/*----------------- 選單 --------------------*/


.header-menu{
	float: left;
	width: 100%;
	z-index: 10;
	position: static;
	top: 0;
	left: 0;
	margin-top: 0;
	min-width: 100%;
	opacity: 0.94;
	transition: opacity .5s ease-out;
}


/*----------------- 精神 --------------------*/

#spirit-area{
	float: left;
	width: 100%;
	margin-top: 10px;
	margin-bottom: 0px;
	padding-top: 10px;
	padding-bottom: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ededed;
}

.spirit-area{
	float: left;
	width: 100%;
}

.spirit-area .h1{
	float: left;
	width: 100%;
	font-size: 160%;
	line-height: 1.75em;
	color: #333;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
	font-family: 'Noto Sans TC', 'cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	display: block;
}

.spirit-area .h1s{
	float: left;
	width: 100%;
	font-size: 160%;
	line-height: 1.75em;
	color: #FFF;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
	font-family: 'Noto Sans TC', 'cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	display: none;
	position: absolute;
	z-index: 888;
	right: 0px;
	bottom: 0px;
}

.spirit-area .bird{
	width: 100px;
	position: absolute;
	right: 30px;
	top: 135px;
}



.spirit-area .dline{
	float: left;
	width: 100%;
	text-align: center;
	color: #039;
	padding-top: 0px;
	padding-bottom: 10px;
	font-size: 136%;
}

.spirit-area .box{
	float: left;
	width: 100%;
	position: relative;
	padding-bottom: 20px;
	z-index: 888;
}
.spirit-area .boxs{
	float: left;
	width: 100%;
	position: relative;
	padding-bottom: 20px;
	z-index: 888;
	display: none;
	padding-top: 10px;
	color: #FFF;
}

.spirit-area .box-a1{
	float: left;
	position: absolute;
	background-color: rgba(0%,0%,0%,0.6);
	z-index: 777;
	right: 0px;
	top: 400px;
	width: 25%;
	padding-top: 40px;
	padding-right: 0px;
	padding-bottom: 50px;
	padding-left: 60px;
}

.spirit-area .box-h1{
	font-size: 220%;
	line-height: 1.75em;
	color: #9C0;
	font-family: 'Jost', 'Noto Sans TC', 'cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
}

.spirit-area .box-text{
	font-size: 136%;
	line-height: 1.55em;
	color: #FFF;
}

.spirit-area .box-a2{
	float: left;
	position: absolute;
	background-color: rgba(0%,0%,0%,0.6);
	z-index: 777;
	left: 0px;
	top: 400px;
	width: 25%;
	padding-top: 40px;
	padding-right: 0px;
	padding-bottom: 50px;
	padding-left: 60px;
}

.spirit-area .box-a3{
	float: left;
	position: absolute;
	background-color: rgba(0%,0%,0%,0.6);
	z-index: 777;
	right: 0px;
	top: 400px;
	width: 25%;
	padding-top: 40px;
	padding-right: 0px;
	padding-bottom: 50px;
	padding-left: 60px;
}

.spirit-area .box-a4{
	float: left;
	position: absolute;
	background-color: rgba(0%,0%,0%,0.6);
	z-index: 777;
	left: 0px;
	top: 400px;
	width: 25%;
	padding-top: 40px;
	padding-right: 0px;
	padding-bottom: 50px;
	padding-left: 60px;
}


/*------------ 標題 --------------*/
.spirit-area #title-area{
	float: left;
	width: 100%;
}

.spirit-area .title-area{
	width: 100%;
	max-width: 120px;
	margin-right: auto;
	margin-left: auto;
}

.spirit-area .title-areas{
	float: left;
	width: 100%;
	border: 1px solid #ececec;
	background-color: #FFFFFF;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f6f8f9+0,e5ebee+50,d7dee3+51,f5f7f9+100;White+Gloss */
background: rgb(246,248,249); /* Old browsers */
background: -moz-linear-gradient(-45deg,  rgba(246,248,249,1) 0%, rgba(229,235,238,1) 50%, rgba(215,222,227,1) 51%, rgba(245,247,249,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	padding-top: 15px;
	padding-bottom: 15px;
}

.spirit-area .title-h1{
	float: left;
	width: 100%;
	font-size: 200%;
	line-height: 1.2em;
	color: #333;
	text-align: center;
}
.spirit-area .title-eng{
	float: left;
	width: 100%;
	font-size: 118%;
	line-height: 0.9em;
	color: #9C0;
	text-align: center;
	font-family: 'Jost','Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
}

.spirit-area .main-area{
	float: left;
	width: 100%;
}

/*----------------- 地段 --------------------*/
.location-area{
	float: left;
	width: 100%;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ededed;
}

.location-area .h1{
	float: left;
	width: 100%;
	font-size: 160%;
	line-height: 1.55em;
	color: #333;
	text-align: center;
	padding-top: 20px;
	padding-bottom: 0px;
}

.location-area .dline{
	float: left;
	width: 100%;
	text-align: center;
	color: #039;
	padding-top: 0px;
	padding-bottom: 10px;
	font-size: 136%;
}

/*------------ 標題 --------------*/
.location-area #title-area{
	float: left;
	width: 100%;
}
.location-area .title-area{
	width: 100%;
	max-width:120px;
	margin-right: auto;
	margin-left: auto;
}

.location-area .title-areas{
	float: left;
	width: 100%;
	border: 1px solid #ececec;
	background-color: #FFFFFF;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f6f8f9+0,e5ebee+50,d7dee3+51,f5f7f9+100;White+Gloss */
background: rgb(246,248,249); /* Old browsers */
background: -moz-linear-gradient(-45deg,  rgba(246,248,249,1) 0%, rgba(229,235,238,1) 50%, rgba(215,222,227,1) 51%, rgba(245,247,249,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	padding-top: 15px;
	padding-bottom: 15px;
}

.location-area .title-h1{
	float: left;
	width: 100%;
	font-size: 200%;
	line-height: 1.2em;
	color: #333;
	text-align: center;
}
.location-area .title-eng{
	float: left;
	width: 100%;
	font-size: 118%;
	line-height: 0.9em;
	color: #9C0;
	text-align: center;
	font-family: 'Jost','Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
}

.location-area .main-area{
	float: left;
	width: 100%;
}


/*----------------- 建築 --------------------*/

.flot-img{
	width: 80%;
	position: absolute;
	z-index: 888;
	right: 0px;
	bottom: 0px;
}

.building-area{
	float: left;
	width: 100%;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-top: 10px;
	padding-bottom: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ededed;
}

.building-area .h1{
	float: left;
	width: 100%;
	font-size: 260%;
	line-height: 1.75em;
	color: #063;
	text-align: left;
}

.building-area .p-text{
	float: left;
	width: 100%;
	font-size: 136%;
	line-height: 1.75em;
	color: #333;
	padding-top: 20px;
	padding-bottom: 10px;
}


.building-area .title-areas{
	float: left;
	width: 100%;
	border: 1px solid #ececec;
	background-color: #FFFFFF;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f6f8f9+0,e5ebee+50,d7dee3+51,f5f7f9+100;White+Gloss */
background: rgb(246,248,249); /* Old browsers */
background: -moz-linear-gradient(-45deg,  rgba(246,248,249,1) 0%, rgba(229,235,238,1) 50%, rgba(215,222,227,1) 51%, rgba(245,247,249,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	padding-top: 15px;
	padding-bottom: 15px;
}


.building-area .dline{
	float: left;
	width: 100%;
	text-align: center;
	color: #039;
	padding-top: 0px;
	padding-bottom: 10px;
	font-size: 136%;
}


.building-area .con{
	float: left;
	padding-top: 22%;
	padding-bottom: 25%;
	padding-left: 10%;
	background-image: url(../images/flot-img.png);
	background-repeat: no-repeat;
	background-position: right bottom;
}

/*------------ 標題 --------------*/
.building-area #title-area{
	float: left;
	width: 100%;
}
.building-area .title-area{
	width: 100%;
	max-width:120px;
	margin-right: auto;
	margin-left: auto;
}

.building-area .title-h1{
	float: left;
	width: 100%;
	font-size: 200%;
	line-height: 1.2em;
	color: #333;
	text-align: center;
}
.building-area .title-eng{
	float: left;
	width: 100%;
	font-size: 118%;
	line-height: 0.9em;
	color: #9C0;
	text-align: center;
	font-family: 'Jost','Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
}

.building-area .main-area{
	float: left;
	width: 100%;
	padding-top: 20px;
}


/*----------------- 惠宇 --------------------*/

.huyuu-area{
	float: left;
	width: 100%;
	margin-top: 10px;
	margin-bottom: 0px;
	padding-top: 10px;
	padding-bottom: 10px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ededed;
}

.huyuu-area .h1{
	float: left;
	width: 100%;
	font-size: 160%;
	line-height: 1.75em;
	color: #333;
	text-align: center;
	padding-top: 20px;
	padding-bottom: 10px;
}

.huyuu-area .title-areas{
	float: left;
	width: 100%;
	border: 1px solid #ececec;
	background-color: #FFFFFF;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f6f8f9+0,e5ebee+50,d7dee3+51,f5f7f9+100;White+Gloss */
background: rgb(246,248,249); /* Old browsers */
background: -moz-linear-gradient(-45deg,  rgba(246,248,249,1) 0%, rgba(229,235,238,1) 50%, rgba(215,222,227,1) 51%, rgba(245,247,249,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	padding-top: 15px;
	padding-bottom: 15px;
}


.huyuu-area .dline{
	float: left;
	width: 100%;
	text-align: center;
	color: #099;
	padding-top: 0px;
	padding-bottom: 10px;
	font-size: 136%;
}

/*------------ 標題 --------------*/
.huyuu-area #title-area{
	float: left;
	width: 100%;
}
.huyuu-area .title-area{
	width: 100%;
	max-width:120px;
	margin-right: auto;
	margin-left: auto;
}

.huyuu-area .title-h1{
	float: left;
	width: 100%;
	font-size: 200%;
	line-height: 1.2em;
	color: #333;
	text-align: center;
}
.huyuu-area .title-eng{
	float: left;
	width: 100%;
	font-size: 118%;
	line-height: 0.9em;
	color: #9C0;
	text-align: center;
	font-family: 'Jost','Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
}

.huyuu-area .main-area{
	float: left;
	width: 100%;
}

/*----------------- 左右輪播 --------------------*/
#mixedSlider {
  position: relative;
}
#mixedSlider .MS-content {
  white-space: nowrap;
  overflow: hidden;
  margin: 0 5%;
}
#mixedSlider .MS-content .item {
  display: inline-block;
  width: 33.3333%;
  position: relative;
  vertical-align: top;
  overflow: hidden;
  height: 100%;
  white-space: normal;
  padding: 0 10px;
}
@media (max-width: 991px) {
  #mixedSlider .MS-content .item {
    width: 50%;
  }
}
@media (max-width: 767px) {
  #mixedSlider .MS-content .item {
    width: 100%;
  }
}
#mixedSlider .MS-content .item .imgTitle {
  position: relative;
}
#mixedSlider .MS-content .item .imgTitle .blogTitle {
	text-align: center;
	color: #252525;
	background-color: rgba(255, 255, 255, 0.5);
	width: 100%;
	padding-top: 15px;
	line-height: 1.75em;
	margin-top: 15px;
}

.blogTitle{
	text-align: center;
	color: #252525;
	background-color: rgba(255, 255, 255, 0.5);
	width: 100%;
	line-height: 1.75em;
}

#mixedSlider .MS-content .item .imgTitle img {
  height: auto;
  width: 100%;
}
#mixedSlider .MS-content .item p {
  font-size: 16px;
  margin: 2px 10px 0 5px;
  text-indent: 15px;
}
#mixedSlider .MS-content .item a {
  float: right;
  margin: 0 20px 0 0;
  font-size: 16px;
  font-style: italic;
  color: rgba(173, 0, 0, 0.82);
  font-weight: bold;
  letter-spacing: 1px;
  transition: linear 0.1s;
}
#mixedSlider .MS-content .item a:hover {
  text-shadow: 0 0 1px grey;
}
#mixedSlider .MS-controls button {
  position: absolute;
  border: none;
  background-color: transparent;
  outline: 0;
  font-size: 50px;
  top: 95px;
  color: rgba(0, 0, 0, 0.4);
  transition: 0.15s linear;
}
#mixedSlider .MS-controls button:hover {
  color: rgba(0, 0, 0, 0.8);
}
@media (max-width: 992px) {
  #mixedSlider .MS-controls button {
    font-size: 30px;
  }
}
@media (max-width: 767px) {
  #mixedSlider .MS-controls button {
    font-size: 20px;
  }
}
#mixedSlider .MS-controls .MS-left {
  left: 0px;
}
@media (max-width: 767px) {
  #mixedSlider .MS-controls .MS-left {
    left: -10px;
  }
}
#mixedSlider .MS-controls .MS-right {
  right: 0px;
}
@media (max-width: 767px) {
  #mixedSlider .MS-controls .MS-right {
    right: -10px;
  }
}
#basicSlider { position: relative; }

#basicSlider .MS-content {
  white-space: nowrap;
  overflow: hidden;
  margin: 0 2%;
  height: 50px;
}

#basicSlider .MS-content .item {
  display: inline-block;
  width: 20%;
  position: relative;
  vertical-align: top;
  overflow: hidden;
  height: 100%;
  white-space: normal;
  line-height: 50px;
  vertical-align: middle;
}
@media (max-width: 991px) {

#basicSlider .MS-content .item { width: 25%; }
}
@media (max-width: 767px) {

#basicSlider .MS-content .item { width: 35%; }
}
@media (max-width: 500px) {

#basicSlider .MS-content .item { width: 50%; }
}

#basicSlider .MS-content .item a {
  line-height: 50px;
  vertical-align: middle;
}

#basicSlider .MS-controls button { position: absolute; }

#basicSlider .MS-controls .MS-left {
  top: 35px;
  left: 10px;
}

#basicSlider .MS-controls .MS-right {
  top: 35px;
  right: 10px;
}

/*----------------- 背景區塊設定 --------------------*/


/*----------------- 底部資訊 --------------------*/

.footer-area{
	float: left;
	width: 100%;
	text-align: center;
	padding-top: 0px;
	padding-bottom: 0px;
	background-color: #499e3b;
}

.footer-area .p-texth1{
	float: left;
	width: 100%;
	line-height: 48px;
	font-size: 148%;
	text-align: center;
}

.footer-area .p-text{
	float: left;
	width: 100%;
	line-height: 32px;
	font-size: 126%;
	text-align: center;
}

.footer-area .p-text-red{
	line-height: 28px;
	font-size: 136%;
	color: #F00;
}

.rec{
	background-color: #9C0;
	margin-right: 5px;
	border: 0px solid #999;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
	color: #FFF;
	margin-left: 10px;
	font-size: 85%;
}

.tel{
	background-color: #09C;
	margin-right: 5px;
	border: 0px solid #999;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
	color: #FFF;
	margin-left: 10px;
	font-size: 85%;
}


/*-----------------------------------------------------
                   自適應版面設定區
-----------------------------------------------------*/
@media screen and (max-width: 768px) {	

.text-lefts{
	text-align: left;
	font-size: 128%;
	line-height: 1.75em;
	color: #333;
}
.text-rights{
	text-align: right;
	font-size: 128%;
	line-height: 1.75em;
	color: #333;
}

/*-----------------------------------------------------
                   首頁版面設定區
-----------------------------------------------------*/
.contents{
	width: 100%;
	max-width: 1170px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 0px;
	padding-bottom: 0px;
}



/*-----------------------------------------------------
                   欄目設定區
-----------------------------------------------------*/
.col-em{
	float: left;
	margin-top: 0px;
	margin-bottom: 0px;
	padding-top: 0px;
	padding-right: 4px;
	padding-bottom: 0px;
	padding-left: 4px;
	font-size:108%;
}

.col-emsa{
	float: left;
	text-align: center;
	padding: 0px;
	display: none;
	width: 100%;
}

.col-ems{
	float: left;
	text-align: center;
	padding: 0px;
	display: block;
	width: 100%;
	
}

.col-em2{
	float: left;
	width: 100%;
}


.col-em3{
	float: left;
	width: 100%;
}

.col-em4{
	float: left;
	width: 100%;
}

.col-em5{
	float: left;
	width: 100%;
}

.col-em6{
	float: left;
	width:100%;
}

.col-em7{
	float: left;
	width:100%;
}	

.col-em8{
	float: left;
	width:100%;
}

/*----------------- 精神 --------------------*/


.spirit-area .box{
	float: left;
	width: 100%;
	position: relative;
	padding-bottom: 10px;
}

.spirit-area .boxs{
	float: left;
	width: 100%;
	position: relative;
	padding-bottom: 0px;
	z-index: 888;
	display: block;
}

.spirit-area .box-a1{
	float: left;
	position: static;
	background-color: #FFF;
	left: 0px;
	top: 0px;
	width: 100%;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 15px;
	padding-left: 10px;
}


.spirit-area .h1{
	float: left;
	width: 100%;
	font-size: 160%;
	line-height: 1.75em;
	color: #333;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
	font-family: 'Noto Sans TC', 'cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	display: none;
}

.spirit-area .h1s{
	float: left;
	width: 100%;
	font-size: 136%;
	line-height: 1.75em;
	color: #fff;
	text-align: right;
	padding-top: 10px;
	padding-bottom: 10px;
	font-family: 'Noto Sans TC', 'cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	display: block;
	position: absolute;
	z-index: 888;
	right: 20px;
	top: 35px;
}


.spirit-area .box-h1{
	font-size: 220%;
	line-height: 1.55em;
	color: #9C0;
	font-family: 'Jost', 'Noto Sans TC', 'cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
}

.spirit-area .box-text{
	font-size: 118%;
	line-height: 1.55em;
	color: #333;
}

.spirit-area .box-a2{
	float: left;
	position: static;
	background-color: #FFF;
	left: 0px;
	width: 100%;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 15px;
	padding-left: 10px;
}

.spirit-area .box-a3{
	float: left;
	position: static;
	background-color: #FFF;
	right: 0px;
	width: 100%;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 15px;
	padding-left: 10px;
}

.spirit-area .box-a4{
	float: left;
	position: static;
	background-color: #FFF;
	left: 0px;
	width:100%;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 15px;
	padding-left: 10px;
}

.text-right{
	font-size: 108%;
	line-height: 1.75em;
	color: #666;
	text-align: right;
	float: left;
	width: 100%;
}

/*----------------- 地段 --------------------*/

.location-area .h1{
	float: left;
	width: 100%;
	font-size: 160%;
	line-height: 1.55em;
	color: #333;
	text-align: center;
	padding-top: 0px;
	padding-bottom: 0px;
}




/*----------------- 建築 --------------------*/

.flot-img{
	width: 45%;
	position: absolute;
	z-index: 888;
	right: 0px;
	top: 25%;
}

.building-area .h1{
	float: left;
	width: 100%;
	font-size: 160%;
	line-height: 1.75em;
	color: #063;
	text-align: left;
}

.building-area .p-text{
	float: left;
	width: 100%;
	font-size: 126%;
	line-height: 1.75em;
	color: #333;
	padding-top: 20px;
	padding-bottom: 10px;
}

.building-area .con{
	float: left;
	padding-top: 0%;
	padding-right: 0%;
	padding-bottom: 0%;
	padding-left: 0%;
	background-image: url(../images/flot-imgs.png);
	background-repeat: no-repeat;
	background-position: right 40px;
}


/*----------------- 惠宇 --------------------*/

.huyuu-area .h1{
	float: left;
	width: 100%;
	font-size: 160%;
	line-height: 1.75em;
	color: #333;
	text-align: center;
	padding-top: 0px;
	padding-bottom: 10px;
}


/*----------------- 底部資訊 --------------------*/
.huyuu{
	font-size: 80%;
	font-family: 'Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	color: #fff;
	border: 0;
	border-radius: 10px;
	letter-spacing: 1px;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
	line-height: 1.75em;
	padding: 5px;
	float: left;
}
.huyuu:hover{
}


.send{
	font-size: 80%;
	font-family: 'Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	color: #fff;
	border: 0;
	border-radius: 10px;
	letter-spacing: 1px;
	margin-top: 5px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
	line-height: 1.75em;
	padding: 0px;
	float: left;
}
.send:hover{
	color: #9C0;
}

.fb{
	font-size: 80%;
	font-family: 'Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	color: #fff;
	border: 0;
	border-radius: 10px;
	letter-spacing: 1px;
	margin-top: 5px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
	line-height: 1.75em;
	padding: 0px;
	float: left;
}
.fb:hover{
	color: #9C0;
}

.phone{
	font-size: 80%;
	font-family: 'Noto Sans TC', 'cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	color: #fff;
	border: 0;
	border-radius: 10px;
	letter-spacing: 1px;
	margin-top: 5px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
	line-height: 1.75em;
	padding: 0px;
	float: left;
}
.phone:hover{
	color: #9C0;
}

.map{
	font-size: 80%;
	font-family: 'Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	color: #fff;
	border: 0;
	border-radius: 10px;
	letter-spacing: 1px;
	margin-top: 5px;
	margin-right: 0;
	margin-bottom: 10px;
	margin-left: 0;
	line-height: 1.75em;
	padding: 0px;
	float: left;
}
.map:hover{
	color: #9C0;
}


.btn-center{
	width: 100%;
	max-width: 180px;
	margin-right: auto;
	margin-left: auto;
}

.more{
	font-size: 80%;
	font-family: 'Noto Sans TC','cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
	color: #fff;
	border: 0;
	border-radius: 10px;
	letter-spacing: 1px;
	margin-top: 0px;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
	line-height: 1.75em;
	float: left;
	transition: 1s;
	text-decoration: none;
padding: 0px;
}
.more a,a:link{
	transition: 1s;
	text-decoration: none;
	color: #FFF;
}

.more:hover{
	font-color:#9C0;
	transition: 1s;text-decoration: none;
}


.footer-area .p-texth1{
	float: left;
	width: 100%;
	line-height: 36px;
	font-size: 138%;
	text-align: left;
}

.footer-area .p-text{
	float: left;
	width: 100%;
	line-height: 32px;
	font-size: 100%;
	text-align: left;
}


.footer-area .p-text-red{
	line-height: 32px;
	font-size: 138%;
	color: #900;
}


.rec{
	background-color: #9C0;
	margin-right: 5px;
	border: 0px solid #999;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
	color: #FFF;
	margin-left: 0px;
	font-size: 75%;
}

.tel{
	background-color: #09C;
	margin-right: 5px;
	border: 0px solid #999;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
	color: #FFF;
	margin-left: 10px;
	font-size: 70%;
}

}