@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; }
.room_bg { width: 100%; margin:0; padding:30px 0; background-color: white; }
.room_box {max-width: 1280px;margin: 0 auto;position: relative;background-color: white;text-align: center;font-family: 華康粗圓體,微軟正黑體;}
.room_tit { font-size: 25px; letter-spacing: 2px; font-weight: bold; }
.room_table { width: 900px; margin:50px auto 0; vertical-align: top;}
.room_tr { width: 100%; height: 70px; display: table; color:white;}
.room_td { width: 300px; display: table-cell; vertical-align: middle; background-color: #050505; letter-spacing: 2px;}
.room_tr_price { width: 100%; height: 90px; display: table; color:black; background-color: white; }
.room_td_price { width: 300px; display: table-cell; font-size: 33px; vertical-align: middle; color:black; background-color: white; letter-spacing: 2px; }
.other_box { width:	900px; margin:50px auto 0; vertical-align: top; }
#tabs { width: 100%; box-sizing:border-box; border:1px solid #a7a7a7; }
#tabs ul { display: table; height: 50px; }
#tabs ul li { width: 225px; box-sizing:border-box; display: table-cell; vertical-align: middle; border-right: 1px solid #a7a7a7; letter-spacing: 2px; font-size: 20px;}
#tabs ul li:focus { outline: none; }
#tabs ul li a { color:#a7a7a7; }
#tabs ul li a:focus { color:#000; outline: none; }
#tabs-1,#tabs-2,#tabs-3,#tabs-4 { border-top:1px solid #a7a7a7; box-sizing:border-box; padding:30px; }
.roompic_box { margin-top: 50px; }
.roompic { width: 30%; overflow: hidden; vertical-align: top; margin:10px 1%; display: inline-block; border-radius: 5px; box-shadow: 3px 3px 8px gray;}
#tabs-1,#tabs-2,#tabs-3,#tabs-4{text-align:left;}

















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

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

}
@media screen and (max-width: 1000px){
	.room_table { width: 96%; }
	.other_box { width: 96%; }
	#tabs ul li { width: 25%; }
	#tabs ul { width: 100%; }
	.room_td,.room_td_price { width: 33.33333%; }
}
@media screen and (max-width: 880px){
	.bg { height: 60vh; }
}
@media screen and (max-width: 720px){
	.room_tr { height: 60px; }
	.room_tr_price { height: 75px; }
	.room_td_price { font-size: 25px; }
	#tabs ul li { font-size: 17px; }
	.roompic { width: 47%; }
}
@media screen and (max-width: 550px){
	.bg { height: 45vh; }
	.room_tr { font-family: 微軟正黑體; line-height: 1.3; font-size: 18px; }
	.room_tr_price { height: 55px; }
	.room_td_price { font-size: 16px; } 
	#tabs ul li { font-size: 16px; }
}
@media screen and (max-width: 480px){
	#tabs-1,#tabs-2,#tabs-3,#tabs-4 { padding:20px; }
	.roompic { width: 97%; }
}
