@charset "utf-8";
/* CSS Document */
/*--reset--*/

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset, img {
	border:0;
}
address, caption, cite, code, dfn, em, strong, th, var {
	font-style:normal;
	font-weight:normal;
}
ol, ul {
	list-style:none;
}
caption, th {
	text-align:left;
}
/*h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}*/
q:before, q:after {
	content:'';
}
abbr, acronym {
	border:0;
}

html {
	min-height: 100%;
	_height:100%;
	height: 100%;
}
body {
	margin: 0;
	padding: 0;
	min-height: 100%;
	_height:100%;
	height: 100%;
}
a{text-decoration:none;}
/*--reset_END--*/

/*--共用版型--*/
body{ font-family:"微軟正黑體";}
   
/*背景漸層色*/  
/* IE10 Consumer Preview */ 
background-image: -ms-linear-gradient(top, #FFFFFF 0%, #BDEAEF 100%);

/* Mozilla Firefox */ 
background-image: -moz-linear-gradient(top, #FFFFFF 0%, #BDEAEF 100%);

/* Opera */ 
background-image: -o-linear-gradient(top, #FFFFFF 0%, #BDEAEF 100%);

/* Webkit (Safari/Chrome 10) */ 
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF), color-stop(1, #BDEAEF));

/* Webkit (Chrome 11+) */ 
background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #BDEAEF 100%);

/* W3C Markup, IE10 Release Preview */ 
background-image: linear-gradient(to bottom, #FFFFFF 0%, #BDEAEF 100%);

/*背景漸層色*/ 
 
  }
#gotop {
    display: none;
    position: fixed;
    right: 20px;
    bottom: 20px;    
    padding: 10px 15px;    
    font-size: 20px;
    background: #777;
    color: white;
    cursor: pointer;
}
html,body{
	width:100%;
	height:100%;
	margin:0;
	padding:0;
}
#DIV_PARENT {
    position: relative;
    background:rgba(0,0,0,0);
	// 這個DIV是提供定位點的父區塊，一般設為 relative
    // 提供定位點的父區塊，因為只提供定位點，一般不設定寬度與高度
} 

.clear_b{
	clear:both;
}	

.bg { width:100%; height:100vh; position: relative; margin:0; padding:0; }
.rooms_introduction_box { width: 100%; padding:45px 0; position: relative; }
.rooms_introduction { max-width: 1280px; margin:0 auto; padding-bottom: 20px; background-color: #fff; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.rooms_title { font-size: 50px; font-weight: bold; padding:35px 0; }
.rooms { width: 44%; height: 60vh; display: inline-block; margin:0 1.5% 30px; position: relative; border:1px solid rgba(0,0,0,0.8); }
.rooms_data { width: 100%; height: 72px; overflow:hidden; line-height: 1.35; letter-spacing: 1.5px; position: absolute; bottom: 0; left:0; background-color: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.rooms_data p { padding:5px 15px; color:black; font-size: 25px; font-family: 細圓體,微軟正黑體; }
.mobroom { display: none; }

.contact_usbox { width: 100%;  display: table; position: relative; background-color: #fff; }
.contact_left { width: 50%; display: table-cell; vertical-align: middle; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.contact_left p { font-size: 50px; color:#fff; font-family: 細圓體,微軟正黑體; text-shadow:2px 2px 5px #000;}
.contact_right { width: 50%; padding:80px 0; display: table-cell; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.contact_right_inbox { width: 60%; margin:0 auto; text-align: left; }
.contact_right_inbox p { word-break: break-word; position: relative; padding:8px 0; margin-left: 30px;}
.contact_right_inbox i { position: absolute; left:-30px; top:10px; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; opacity: 0.7;}
.contact_form { width: 100%; margin-top: 35px; }
.contact_input { width: 100%; padding:10px; margin-bottom: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.contact_form textarea { width: 100%; padding:10px; margin-bottom: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.submit { width: 100px; height: 50px; font-size: 22px; font-weight: bold; font-family: 細圓體,微軟正黑體; background-color: #555; color:#fff; border:none; } 












@media screen and (max-width: 1400px){

}
@media screen and (max-width: 1150px){

}
@media screen and (max-width: 1000px){

}
@media screen and (max-width: 880px){
	.rooms_data p { font-size: 23px; }
	.rooms { width: 43%; }
	.contact_left { width: 100%; padding:50vh 0; display: block;}
	.contact_right { width: 100%; display: block; padding:50px 0;}
}
@media screen and (max-width: 720px){
	.rooms { width: 40%; height: 47vh; }
	.rooms_data p { font-size: 21px; }
	.rooms_data { height: 64px; }
	.contact_left { width: 100%; padding:50vh 0; display: block;}
	.contact_right_inbox { width: 80%; }
}
@media screen and (max-width: 550px){
	.rooms { width: 80%; height: 60vh; }
	.mobroom { display: block; width: 80%; height: 60vh; margin:0 auto; position: relative; border:1px solid rgba(0,0,0,0.8);}
}
@media screen and (max-width: 480px){
	.rooms { width: calc( 100% - 75px ); height: 47vh; }
	.mobroom { width: calc( 100% - 75px ); height: 47vh; }
	.rooms_data p { font-size: 20px; }
}