/*------------------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;
	font-family: Calibri, Arial, Helvetica, sans-serif, Microsoft JhengHei,"微軟正黑體","黑體";
}
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;
}
/*------------------reset------------------*/


/*------------------桌機版型區------------------*/
*{
	font-family: Calibri, Arial, Helvetica, sans-serif, Microsoft JhengHei,"微軟正黑體","黑體";
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;	
}
/*頭*/
.turn{
	width: 1600px;
	height: 550px;
	margin: 0px auto;
	overflow: hidden;
}
.turn li{
	width: 100%;
	height: auto;
}
/*選單*/
#nav{
	width: 100%;
	height: 70px;
	background: url(../images/nav_bg.jpg) repeat-x top left;
	overflow: hidden;
}
#nav ul{
	width: 960px;
	height: 100%;
	margin: 0px auto;
}
#nav li{
	width: 137px;
	height: 100%;
	float: left;

	background-color: rgba(5,66,148,0);
	-webkit-transition: all 0.3s linear;
	-moz-transition: all 0.3s linear
	-ms-transform: all 0.3s linear;
	transform: all 0.3s linear;
}
#nav a{
	display: block;
	width: 100%;
	height: 100%;
	line-height: 70px;
	text-align: center;
	text-decoration:none;
	font-size: 21px;
	font-weight: bold;
	color: white;
	font-family: Microsoft JhengHei,PMingLiU;
}
#nav li:hover{
	background-color: rgba(47,107,181,0.1);
}
#nav li.act a{
	font-weight: normal;
	background-color: rgba(47,107,181,0.5);
}


#service{
 display: block;
 position: fixed;
 bottom: 130px;
 text-decoration: none;
 z-index: 1001;
 margin-left: 999px;
 background-image: url(../images/line/service_logo_60x80.png);
 background-repeat: no-repeat;
 text-indent: -9999px;
 cursor: pointer;
 background-position: center center;
 background-size: cover;
 height: 80px;
 width: 60px;
 opacity: .9;

}
#service:hover{
 opacity: 1;
}

#line{
 display: block;
 position: fixed;
 bottom: 140px;
 text-decoration: none;
 z-index: 1001;
 margin-left: 999px;
 background-image: url(../images/line/line_50x50_service.jpg);
 background-repeat: no-repeat;
 text-indent: -9999px;
 cursor: pointer;
 background-position: center center;
 background-size: cover;
 height: 71px;
 width: 60px;
 opacity: .9;

}
#line:hover{
 opacity: 1;
}

/*gotop*/
#gotop{
	display: none;
	position: fixed;
	bottom: 50px;
	text-decoration: none;
	height: 80px;
	width: 80px;
	z-index: 1001;
	display: block;
	margin-left: 990px;
	background-image: url(../images/top.png);
	background-repeat: no-repeat;
	text-indent: -9999px;
	cursor: pointer;
}
#gotop:hover{
    background-position: -80px 0;
}
/*內容*/
/*內容_圖文擺放*/
.block1{
	width: 100%;
	height: auto;
}
.block1>li{
	width: 100%;
	height: auto;
	overflow: hidden;
}
.block1 .box_pic,.box_explain{
	width: 50%;
	height: auto;
	float: left;
}
.block1 .box_explain{
	padding-left: 20px;
	padding: 30px 0px 20px 20px;
}
.block1>li:nth-child(even) .box_explain{
	padding: 30px 20px 20px 0px;
}
.block1>li:nth-child(even) .box_pic{
	float: right;
}
.block1 .box_pic img{
	width: 100%;
	height: auto;
	display: block;
}
.block1 .box_pic p{
	position: relative;
	top: 390px;
	left: 10px;
	font-size: 12px;
	color: black;
}
.block1 .box_explain h4,.block2 h4,.block4 h4{
	display: block;
	border-left: 10px solid #054294;
	color: #054294;
	font-size: 30px;
	font-weight: bold;
	padding-left: 10px;
	margin: 0px 0px 10px 0px;
}
.block4 h4{margin-top: 40px;}
.block1 .box_explain h4 span,.block2 h4 span{
	font-size: 14px;
	font-weight: normal;
}
.block4 h4 span{
	font-size: 18px;
	font-weight: normal;
}
.block1 .box_explain h5{
	display: block;
	color: #0f79bf;
	font-size: 19px;
	font-weight: bold;
	line-height: 20px;
	border-left: 4px solid #0f79bf;
	padding: 0px 0px 0px 6px;
	margin-bottom: 3px;
}
.block1 .box_explain h5 span{
	font-size: 15px;
	font-weight: normal;
}
.block1 .box_explain h5 span i{
	color: #f43704;
	/*border-bottom: 1px solid #0f79bf;*/
}
.block1 .box_explain h5.sp1{
	color: #f43704;
	border-left: 4px solid #f43704;
	margin-bottom: 10px;
}
.block1 .box_explain p{
	font-size: 17px;
	line-height: 24px;
	margin-bottom: 15px;
}
.box_explain p.sp1{
	font-size: 15px;
	line-height: 20px;
	color: #0f79bf;
}
.block1 .box_explain ul{
	width: 100%;
	height: auto;
	/*margin-top: 10px;*/
	-moz-column-count: 2;
	-webkit-column-count: 2;
	column-count: 2;
}
.block1 .box_explain ul.long{
	-moz-column-count: 1;
	-webkit-column-count: 1;
	column-count: 1;
}
.block1 .box_explain ul.long1{
	float: left;
	width: 50%;
	-moz-column-count: 1;
	-webkit-column-count: 1;
	column-count: 1;
}.block1 .box_explain li{
	list-style: square outside;
	font-size: 15px;
	line-height: 19px;
	color: #747272;
	margin-left: 20px;
}
.block1 .box_explain li.sp01{
	color: #f43704;
}
.block1 .box_explain .picr{
	float: right;
	width: 48%;
}
.block1 .box_explain img{
	display: inline-block;
	width: 200px;
	height: auto;
	margin-right: 10px;
}
.block1 .box_explain p.note{
	font-family: "新細明體";
	font-size: 8px;
	color: #747272;
}
/*內容_甲板導航點按鈕看圖*/
.block2{
	width: 100%;
	height: auto;
}
.block2>img{
	width: 100%;
	height: auto;
}
.block2 .deck_bt{
	width: 100%;
	height: auto;
	overflow: hidden;
	margin-bottom: 15px;
}
.block2 .deck_bt li{
	float: left;
}
.block2 .deck_bt li a{
	display: block;
	width: 70px;
	height: auto;
	line-height: 30px;
	text-align: center;
	text-decoration: none;
	font-size: 15px;
	color: black;
	background-color: #cbdaed;
	border-radius: 4px;
	margin-right: 18px;
}
.block2 .deck_bt li:last-child a{
	margin-right: 0px;
}
.block2 .deck_bt a:hover{
	background-color: #ffc000;
}
.block2 .deck_bt a.active{
	background-color: #054294;
	color: white;
}
.deck_note,.deck_pic{
	float: left;
}
.deck_note{
	width: 350px;
	height: 400px;
	overflow: scroll;
	overflow-x: hidden;
}
.deck_note li p{
	font-size: 18px;
	line-height: 1.3em;
	margin-bottom: 10px;
}
.deck_note li p span.title{font-weight: bold; display: block; color: #0f79bf;}
.deck_note span[class^="room_"]{
	display: inline-block;
	width: 30px;
	height: auto;
	text-align: center;
	margin-right: 5px;
}
.deck_note span.room_de{background-color: #f0e900;}
.deck_note span.room_cg{background-color: #88abda;}
.deck_note span.room_dd{background-color: #edf1b0;}
.deck_note span.room_cf{background-color: #7ecef4;}
.deck_note span.room_cd{background-color: #e8deed;}
.deck_note span.room_dc{background-color: #dae24a;}
.deck_note span.room_cb{background-color: #b194c4;}
.deck_note span.room_ac{background-color: #ffe100;}
.deck_note span.room_cc{background-color: #d9aacd;}
.deck_note span.room_db{background-color: #6eba44;}
.deck_note span.room_ch{background-color: #d3edfb;}
.deck_note span.room_ba{background-color: #ea5532; color: white;}
.deck_note span.room_as{background-color: #c0a354;}
.deck_note span.room_at{background-color: #f3e7d9;}
.deck_note span.room_da{background-color: #00a161; color: white;}
.deck_note span.room_ca{background-color: #b05aa5; color: white;}
.deck_note span.room_ab{background-color: #f9c158;}
.deck_note span.room_aa{background-color: #f39700;}
.deck_key{
	width: auto;
	height: auto;
}
.deck_key li{
	font-size: 14px;
	line-height: 19px;
	color: #626262;
}
.deck_key li.title{
	color: #054294;
}
.deck_key img{
	width: auto;
	height: 19px;
}
.deck_pic{
	width: 415px;
	height: 400px;
	overflow: scroll;
	overflow-x: hidden;
}
.deck_pic img{
	width: 400px;
	height: auto;
}
/*內容_收合紐*/
.block3{
	width: 100%;
	height: auto;
	margin: 20px auto;
	border-radius: 5px;
	overflow: hidden;
}
.block3 h5{
	display: block;
	width: 100%;
	height: auto;
	padding: 0 0 0 10px;
	font-size: 18px;
	color: black;
	line-height: 40px;
	background-color: #cbdaed;
	cursor: pointer;
}
.block3 .answer{
	width: 100%;
	height: auto;
	padding: 15px;
	background-color: #e9e9e9;
}
.block3 .answer p{
	font-size: 15px;
	color: #4c4c4c;
	line-height: 17px;
	margin-bottom: 20px;
}
.block3 .answer p:last-child{
	margin-bottom: 0px;
}
.block3 .answer p a{color: #0f79bf;}
.block3 .answer p a:hover{text-decoration: none;}
/*行程價格頁*/
.block4{
	width: 100%;
	height: auto;
	margin: 0px auto;
	overflow: hidden;
}
.block4 table{
	text-align: center;
	margin: 0px;
}
.block4 th{
	font-weight: bold;
}
.block4 thead th{
	text-align: center;
}
.block4 th,td{
	border-collapse: collapse;
	line-height: 20px;
	padding: 10px 0px;
}
/*行程圖，選寬度和靠邊.col...*/
.block4 .pic{
	height: auto;
	border: 1px solid #c8c8c8;
	padding: 5px 5px 5px 5px;
	overflow: hidden;
}
.block4 .pic img{width: 100%; height: auto;}
/*時程表，選寬度和靠邊.col...*/
.block4 .list_time{height: auto;}
.block4 .list_time caption{
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	color: #0f79bf;
}
.block4 .list_time caption span.big{font-size: 30px;}
.block4 .list_time caption span.small{
	font-size: 18px;
	font-weight: normal;
}
.block4 .list_time thead tr{
	border-bottom: 3px solid #0f79bf;
	color: #0f79bf;
}
.block4 .list_time tbody tr{
	border-bottom: 1px solid #c8c8c8;
	color: black;
}
.block4 .list_time tbody tr:last-child{border-bottom: 0px;}
.block4 .list_time tbody tr:nth-child(odd){background-color: #f3f3f3;}
/*優惠區，選寬度和靠邊.col...*/
.block4 .offer{
	height: auto;
	background-color: #fdf8bf;
	border-radius: 10px;
	padding: 20px 20px 5px 20px;
	margin-bottom: 10px;
}
.block4 .offer p{
	font-size: 16px;
	margin-bottom: 20px;
}
.block4 .offer h5{
	font-size: 22px;
	line-height: 30px;
	color: #f43704;
	border-left: 4px solid #f43704;
	margin-bottom: 5px;
}
.col1{width: 100%;}/*分1區*/
.col2_l{float: left; width: 49%;}/*分2區_左邊*/
.col2_r{float: right; width: 49%; margin-left: 2%;}/*分2區_右邊*/
.col3_l{float: left; width: 32%;}/*分3區_左邊*/
.col3_r{float: right; width: 32%; margin-left: 2%;}/*分3區_右邊*/
.block4 .list_price{
	width: 100%;
	height: auto;
	clear: both;
}
.block4 .list_price th,.list_price td{
	border: 1px solid #CCCCCC;
}
.block4 .list_price thead{
	background-color: #3085d1 !important;
	color: white;
	-webkit-print-color-adjust: exact;

}
.block4 .list_price tbody{
	background-color: white !important;
	-webkit-print-color-adjust: exact;
}
.block4 .list_price tbody th{
	background-color: #F2F2F2 !important;
	text-align: left;
	padding: 0px 0px 0px 25px;
	-webkit-print-color-adjust: exact;
}
.block4 .list_price tbody th.add1{
	background-color: #D9EEFF !important;
	-webkit-print-color-adjust: exact;
}
.block4 .list_price tbody td.add1{
	background-color: #EBF6FF !important;
	-webkit-print-color-adjust: exact;
}
.block4 .list_price tbody th.add2{
	background-color: #FFE3C2 !important;
	-webkit-print-color-adjust: exact;
}
.block4 .list_price tbody td.add2{
	background-color: #FFF1E3 !important;
	-webkit-print-color-adjust: exact;
}
.block4 .list_price th.sp1{background-color: #f9770a;}
.block4 .list_price td.sp1{background-color: #fff8e6;}
.block4 .list_price .frameh{ border-top: 2px solid red; border-left: 2px solid red; border-right: 2px solid red;}
.block4 .list_price .frameb{ border-left: 2px solid red; border-right: 2px solid red;}
.block4 .list_price .framef{ border-left: 2px solid red; border-right: 2px solid red; border-bottom: 2px solid red;}
.block4 .list_price .frame{border: 2px solid red;}
.block4 .list_price .frameh1{ border-top: 2px solid red; border-left: 2px solid red;}
.block4 .list_price .frameh2{ border-top: 2px solid red;}
.block4 .list_price .frameh3{ border-top: 2px solid red; border-right: 2px solid red;}
.block4 .list_price .frameb1{ border-left: 2px solid red;}
.block4 .list_price .frameb2{ border-right: 2px solid red;}
.block4 .list_price .framef1{ border-left: 2px solid red; border-bottom: 2px solid red;}
.block4 .list_price .framef2{ border-bottom: 2px solid red;}
.block4 .list_price .framef3{ border-right: 2px solid red; border-bottom: 2px solid red;}
.block4 h5{
	display: block;
	font-size: 20px;
	font-weight: bold;
	color: #0f79bf;
	line-height: 24px;
	border-left: 5px solid #0f79bf;
	padding-left: 5px;
	margin: 0px 0px 10px 0px;
}
.block4 h5 span.sp1{
	font-weight: normal;
	color: #f43704;
}
.block4 h6{
	font-size: 18px;
	font-weight: bold;
	margin: 0px 0px 5px 0px;
	clear: both;
}
.block4 p{
	font-size: 15px;
	line-height: 21px;
	margin: 0px 0px 20px 0px;
}
.block4 p span.p_h6{
	font-size: 18px;
	font-weight: bold;
}
.block4 p.notice{
	text-align: right;
	color: #f43704;
	margin: 7px 0px 0px 0px;
}
ul.list{
	font-size: 15px;
	line-height: 21px;
	list-style: disc inside;
	text-indent: -20px;
	padding-left: 20px;
}
ul.list li{margin: 0px 0px 7px 0px;}
ul.list > ul{
	list-style: circle inside;
	text-indent: -20px;
	padding-left: 20px;
}
ol.num{
	font-size: 15px;
	line-height: 21px;
	list-style: decimal inside;
	text-indent: -15px;
	padding-left: 15px;
}
ol.num li{margin: 0px 0px 7px 0px;}
ol.num > ol{
	list-style: lower-latin inside;
	text-indent: -15px;
	padding-left: 15px;
}
.block4 .join{
	width: 255px;
	height: 140px;
	margin: 0px auto;
}
.block4 .join a{
	display: inline-block;
	width: 120px;
	height: auto;
	text-align: center;
	text-decoration: none;
	text-shadow:1px 1px rgba(0, 0, 0, 0.3);
	font-size: 18px;
	font-weight: bold;
	color: white;
	line-height: 40px;
	border-radius: 4px;
	overflow: hidden;
	box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
	margin: 0px 10px 0px 0px;
}
.block4 .join a:hover{
	box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
	/*按鈕下移*/
	position: relative;
	top: 2px;
}
.block4 .join a:last-child{
	margin: 0px 0px 0px 0px;
}
.block4 .join a:nth-child(1){
	background-color: #8f82bc;
}
.block4 .join a:nth-child(2){
	background-color: #f19149;
}
/*船去機回*/
.block4 .group{
	float: left;
	width: 53%;
	height: auto;
}
.block4 .group a{
	display: block;
	width: 100%;
	height: auto;
	text-decoration: none;
	font-size: 18px;
	font-weight: bold;
	line-height: 40px;
	color: #054294;
	border-bottom: 1px dashed #c8c8c8;
}
.block4 .group a:hover{
	background-color: #fdf7a6;
}
/*左圖右文版型*/
h3{
	display: block;
	width: 100%;
	height: auto;
	text-align: center;
	background: url(../images/h3_bg.png) repeat-x center center;
}
h3 span{
	line-height: 100px;
	font-size: 45px;
	font-weight: bold;
	letter-spacing: 2px;
	color: #054294;
	background-color: white;
	padding: 0px 10px;
}
.description{
	width: 100%;
	height: auto;
}
.description p{
	font-size: 17px;
	line-height: 24px;
	letter-spacing: 1px;
	color: black;
	margin-bottom: 20px;
}
.booktour{
	width: 100%;
	height: auto;
	background-color: #f3f3f3;
	padding: 30px 180px;
	margin: 20px 0px;
}
.booktour > p{
	font-size: 18px;
	line-height: 26px;
	letter-spacing: 1px;
	color: #535353;
	margin: 0px auto 15px auto;
}
.booktour > a{
	display: block;
	font-size: 21px;
	line-height: 36px;
	text-decoration: none;
	text-align: center;
	color: white;
	/*漸層背景*/
	background-color: #2672b8;
	background: -webkit-gradient(linear, left top, right top, color-stop(0, #2672b8), color-stop(1, #37b4e1));
	background: -moz-linear-gradient(left, #2672b8 0%, #37b4e1 100%);
	background: -webkit-linear-gradient(left,  #2672b8 0%, #37b4e1 100%);
	background: -o-linear-gradient(left,  #2672b8 0%, #37b4e1 100%);
	background: -ms-linear-gradient(left,  #2672b8 0%, #37b4e1 100%);
	background: linear-gradient(left,  #2672b8 0%, #37b4e1 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2672b8', endColorstr='#37b4e1', gradientType=1);

	border-radius: 7px;
	box-shadow: 0px 2px 0px 2px rgba(0, 0, 0, 0.1);
}
.booktour > a:hover{
	box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
	/*按鈕下移*/
	position: relative;
	top: 2px;
}
.booktour > a img{margin-right: 7px;}
.block5{
	width: 100%;
	height: auto;
	margin-bottom: 20px;
	overflow: hidden;
}
.block5 .pics{
	float: right;
	width: 280px;
	height: auto;
}
.block5 .pics img{
	display: block;
	width: 100%;
	height: auto;
	margin-bottom: 4px;
}
.block5 .word{
	float: left;
	width: 630px;
}
.block5 .box{
	width: 100%;
	height: auto;
	padding-left: 10px;
	border-left: 4px solid #054294;
	margin-bottom: 20px;
}
.block5 .box h4{
	font-size: 24px;
	font-weight: bold;
	line-height: 36px;
	color: #054294;
}
.block5 .box h4 span{font-size: 14px; font-weight: normal;}
.block5 .box p{
	font-size: 16px;
	line-height: 21px;
	color: black;
	margin-bottom: 10px;
}
/*分隔線*/
.line{
	width: 100%;
	height: 50px;
	background: url(../images/spacer_line.png) no-repeat top center;
	margin: 35px 0px 0px 0px;
	text-indent: -9999px;
	clear: both;
}
.clearp{clear: both;}
.sp01{color: #f43704;}
.sp02{
	color: #f43704;
	font-weight: bold;
}
.sp04{color: #0021ab;}
.sp05{background-color: #fff799; padding: 0px 10px;}
/*程式新寫*/
.content{
	font-family: Calibri, Arial, Helvetica, sans-serif, Microsoft JhengHei,"微軟正黑體","黑體";
	position:relative;
	z-index:1;
	width:960px;
	margin:0 auto;
	background-color:#fff;
	padding:0px;
}

#tabs{
  position: relative;
  z-index: 1;
}
#tabs li{
  display: inline-block;
}
#container{
  width: 960px;
  position: relative;
  overflow: hidden;
}
#contents{
  position: absolute;
  left: 0;
  width: 8640px; /* 內容寬度 * 頁籤數 */
}
#contents > div{
  text-align: justify;
  float: left;
  width: 960px; /* 內容寬度 - 左右padding */
}
#today4,#today6,#today7 {
	position:relative;
	top:-90px;
}
#gotop{
	display: none;
	position: fixed;
	bottom: 50px;
	text-decoration: none;
	height: 80px;
	width: 80px;
	z-index: 1001;
	display: block;
	margin-left: 990px;
	background-image: url(../images/top.png);
	background-repeat: no-repeat;
	text-indent: -9999px;
	cursor: pointer;
}
.clear {zoom:1; clear:both;} 
.clear:after,#tabs:after,.tabsM:after {content:''; display:block; clear:both; visibility:hidden; height:0;}
/*------tab index-------*/

.tab_container {
	min-height:500px;
}
.tabArea {
}
.tabsM {
	height: 40px;
	overflow: hidden;
}
.tabsM li {
	display: block;
	width: calc(94% / 13);
	height: auto;
	line-height: 30px;
	overflow: hidden;
	text-align: center;
	text-decoration: none;
	background-color: #cbdaed;
	border-radius: 4px;
	margin: 0px 0.5% 0px 0px;
	float: left;
}
.tabsM li:last-child {
	margin-right: 0px;
}
.tabsM li a {
	display: block;
	width: 100%;
	height: 100%;
	font-size: 15px;
	color: black;
	text-decoration: none;
	font-weight:bold;
}
.tabsM li a:hover{
	background-color: #8acbed;
	color: black;
}
.tabsM .active {
	background-color: #3981d2;
	color: white;
}
li.active a {
	color:#fff;
}
.tab_content {
	padding: 0px 10px 20px 0px;
	position:relative;
}
.olOrder {
	width: 105px;
	display: inline-block;
}

.mbox{
	padding:30px 80px;
}
.asbox{
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #a8a8a8;
	padding-top: 25px;
	padding-bottom: 25px;
	overflow: hidden;
}
.asbox img {
	float: left;
}
.asbox div.asmap {
	background-color: #FFF;
	margin: 4px;
	border: 1px solid #a8a8a8;
	float: right;
	width: 610px;
}
.online.scroll-to-fixed-fixed {
margin-top: 86px
}
.online {
	position: relative;
}
.order {
    text-decoration: none;
    height: 111px;
    width: 80px;
    z-index: 1001;
    display: block;
    margin-left: 975px;
    background-image: url(../images/mouse.jpg);
    background-repeat: no-repeat;
    text-indent: -9999px;
    cursor: pointer;
    position: absolute;
    top: 36px;
}
.order:hover {
	background-image: url(../images/mouseover.jpg);
}

@media print 
{
	body {
		background-color:white;
		width: 950px;
		height: auto;
	}
	.block4 .join { display: none; }
	.block4 .CTBC{ display: none; }
    /* .line { display: none; } */
	.block4 table {
    margin: 0px 0px 20px 0px;
}
}

/*------------------桌機版型區------------------*/

/*------------------手機版型區------------------*/
/*@media screen and (max-width: 767；px) {}*/
/*------------------手機版型區------------------*/


/*------------------平板版型區------------------*/
/*@media screen and (min-width: 768px) and (max-width: 1024px) {}*/
/*------------------平板版型區------------------