/* CSS Document */
/************************************************************************************
RESET
*************************************************************************************/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
body {line-height: 1; -webkit-text-size-adjust: none;}
ol, ul { list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: ''; content: none;}
/* remember to define focus styles! */
:focus {outline: 0;}
/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}
/* tables still need 'cellspacing="0"' in the markup */
table {
   /* border-collapse: collapse;*/
    border-spacing: 0;
}
a img {border: none;}
.clean { clear:both;}
a {color: #292929; text-decoration: none; blr:expression(this.onFocus=this.blur()); outline: none; /* for Firefox */hlbr:expression(this.onFocus=this.blur()); /* for IE */}
a:hover {text-decoration:none;}
a:focus{ -moz-outline-style: none;}

/*.adwrap {
    width: 900px;
    margin: 0 auto;
    margin-bottom: 20px;
	
}*/
.adbox{position: relative; padding: 4px;}
.adbox a{display:block;}
.adbox a:hover{opacity: 0.8;}

.b-box{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.col-1{width:100%;}
.col-2{width:50%;}
.col-3{width:33.33%;}
.col-4{width:25%;}
.col-5{width:20%;}

body {
	margin: 0;
	padding: 0;
	font-size:13px;
	color:#000;	
}
h1,h2,h3 { display: none;}
.left{ float:left;display:inline-block;width: 100%;}
.right{ float:right;}

/*------------------------------- pc ----------------------------------*/
.container {
    width: 100%;
    height: 100%;
	font-family:Arial,微軟正黑體;
	background: url(images/con_bg.jpg) center 0 no-repeat;
	overflow: hidden;
}
.header {
    width: 100%;
}
.top_content {
    width: 100%;
	margin:0 auto;	
	position:relative;	
	height: 690px;	
}
.top_content .mobile {
	display: none;
}
.top_content .main-title {display: block;margin:0 auto;margin-top:100px;width: 350px;height: 364px;background: url(images/header.png) 0 0 no-repeat;}

h1,h2,h3 { display: none;}

/***按鈕列***/
#nav {
	width: 100%;
	height:60px;
    position: absolute;    
    left: 0;    
    z-index: 999;
	background: #fff;
}
#menu {
	width: 700px;
	height:60px;	
	margin:0 auto; 
	overflow:hidden;
	font:18px "微軟正黑體";
}
#menu li { display: block; float: left;margin-left: 30px;}
#menu li a {
    width: 100%;
    height: 100%;
    display: block;
    cursor: pointer;
		
}
#menu li a.nav01 {
    height: 30px;
	line-height: 30px;
	text-align: center;
	margin: 15px 0px;
	color: #959595;
}
#menu li a:hover.nav01,#menu li.on a.nav01{color: #eb6100;border-bottom: 2px solid #eb6100;}

#menu li a.nav02 {	
    height: 30px;
	line-height: 30px;
	text-align: center;
	margin: 15px 0px;
	color: #959595;
}
#menu li a:hover.nav02,#menu li.on a.nav02{color: #0070e2;border-bottom: 2px solid #0070e2;}

#menu li a.nav03 {	
    height: 30px;
	line-height: 30px;
	text-align: center;
	margin: 15px 0px;
	color: #959595;
}
#menu li a:hover.nav03,#menu li.on a.nav03{color: #a40000;border-bottom: 2px solid #a40000;}

#menu li a.nav04 {	
    height: 30px;
	line-height: 30px;
	text-align: center;
	margin: 15px 0px;
	color: #959595;
}
#menu li a:hover.nav04,#menu li.on a.nav04{color: #876117;border-bottom: 2px solid #876117;}

#menu li a.nav05 {	
    height: 30px;
	line-height: 30px;
	text-align: center;
	margin: 15px 0px;
	color: #959595;
}
#menu li a:hover.nav05,#menu li.on a.nav05{color: #793f98;border-bottom: 2px solid #793f98;}

#menu li a.nav06 {	
    height: 30px;
	line-height: 30px;
	text-align: center;
	margin: 15px 0px;
	color: #959595;
}
#menu li a:hover.nav06,#menu li.on a.nav06{color: #c62e06;border-bottom: 2px solid #c62e06;}

#menu li a.nav07 {
	width: 110px;
    height: 30px;
	margin: 10px 0px;
	font:20px "微軟正黑體";
	text-align: center;
	color: #fff;
	border-radius: 10px;
	background:#01823f;
}
#menu li a.nav07 em{
	font:18px "微軟正黑體";
	text-align: center;
	color: #01823f;	
	display:block;
	margin-top: -5px;
}
#menu li a:hover.nav07,#menu li.on a.nav07{color: #fff100;}


#togglenav {
    display: none;
    z-index: 9999;
    position: fixed;
    right: 0;
    overflow: hidden;
    line-height: 35px;
    width: 100%;
    cursor: pointer;
}
.main { 
	width: 100%; 
	margin: 0 auto;
	margin-top: 60px;
}


/***tour行程推薦***/
.box-tour{width: 100%;background: url(images/tour_bg.jpg)repeat;}
.wrap-tour {
    width: 700px;	
	padding-top: 100px;	
	padding-bottom: 50px;
    margin: 0 auto;
    overflow: hidden;	
}
.wrap-tour h4{ height: 50px; background: url(images/title1.png) center top  no-repeat; text-indent: -3000px;}



.small-title{
	display: block;
	width: 110px;
	font-size:18px;
	color: #fff100;
	background: #000;
	padding: 5px;
	text-align: center;
	margin: 10px 0;
}
.product_box {
	width: 100%;
	margin: auto;
	margin-top: 10px;
	margin-bottom: 12px;
	background:#ffffff;
	border-radius: 12px;
	overflow: hidden;
}
.product_box:hover {
	-webkit-transform: translateY(3%);
    -moz-transform: translateY(3%);
    -ms-transform: translateY(3%);
    transform: translateY(3%);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}
.product_infor {
	width: 100%;
	background:#ffffff;
	display: table;
	color:#333333;
}
.product_text {	
	width: 680px;
	font:18px "微軟正黑體";
	padding: 5px 10px 5px 10px;
	line-height: 30px;
}
.product_text em{	
	font:16px "微軟正黑體";
	padding: 0px 0px 0px 5px;
	color: #0C8CF5;
}
/***blog***/
.wrap-blog {
    width: 960px;	
	padding-top: 30px;
	padding-bottom: 50px;
    margin: 0 auto;
    overflow: hidden;	
}
.blog-title{
	display: block;
	width: 100%;
	font-size:18px;
	color: #626262;	
	margin-bottom: 10px;
}
.wrap-blog .pic{
    width:32%;	
	float: left;
	margin-right: 10px;
	position:relative;overflow:hidden;
}
.wrap-blog .pic .txt{width:100%;background:rgba(0,0,0,0.5); color: #fff;font-size: 12px; padding:5px 0;position:absolute;bottom:0px;}
.wrap-blog .pic strong {font-size: 15px; margin: 0px; color: #ffc000;}
.wrap-blog .pic a:hover img{opacity: 0.8; margin: 0;padding: 0;}
.wrap-blog .pic a:hover {text-decoration:none !important;}

.other{text-align: right;font-size: 15px;}
.other a{color: #fff;}
.other a:hover {text-decoration:none;color: #ffd800;}

/***介紹***/
.box-01{ background: url(images/bg_1.jpg) no-repeat;}
.box-02{ background: url(images/bg_2.jpg) no-repeat;}
.box-03{ background: url(images/bg_3.jpg) no-repeat;}
.box-04{ background: url(images/bg_4.jpg) no-repeat;}
.box-05{ background: url(images/bg_5.jpg) no-repeat;}
.box-06{ background: url(images/bg_6.jpg) no-repeat;}
.wrap-box {width: 800px;height:750px;margin: 0 auto;overflow: hidden;}
.wrap-box .mobile {	display: none;}
.wrap-box .intro1{width: 380px;margin: 0 auto;margin-right: 10px;margin-top: 200px; padding-top: 20px; background: rgba(255, 255, 255, 0.8);border-top: 8px solid #eb6100;}
.wrap-box .intro1 .txt{padding: 15px 20px 20px 30px;color: #000;font-size: 16px;line-height: 24px;letter-spacing: 2px;}
.wrap-box .intro2{width: 380px;margin: 0 auto;margin-left: 10px;margin-top: 200px; padding-top: 20px; background: rgba(255, 255, 255, 0.8);border-top: 8px solid #0070e2;}
.wrap-box .intro2 .txt{padding: 15px 20px 20px 30px;color: #000;font-size: 16px;line-height: 24px;letter-spacing: 2px;}
.wrap-box .intro3{width: 380px;margin: 0 auto;margin-right: 10px;margin-top: 200px; padding-top: 20px; background: rgba(255, 255, 255, 0.8);border-top: 8px solid #a40000;}
.wrap-box .intro3 .txt{padding: 15px 20px 20px 30px;color: #000;font-size: 16px;line-height: 24px;letter-spacing: 2px;}
.wrap-box .intro4{width: 380px;margin: 0 auto;margin-left: 10px;margin-top: 200px; padding-top: 20px; background: rgba(255, 255, 255, 0.8);border-top: 8px solid #876117;}
.wrap-box .intro4 .txt{padding: 15px 20px 20px 30px;color: #000;font-size: 16px;line-height: 24px;letter-spacing: 2px;}
.wrap-box .intro5{width: 380px;margin: 0 auto;margin-right: 10px;margin-top: 200px; padding-top: 20px; background: rgba(255, 255, 255, 0.8);border-top: 8px solid #793f98;}
.wrap-box .intro5 .txt{padding: 15px 20px 20px 30px;color: #000;font-size: 16px;line-height: 24px;letter-spacing: 2px;}
.wrap-box .intro6{width: 380px;margin: 0 auto;margin-left: 10px;margin-top: 200px; padding-top: 20px; background: rgba(255, 255, 255, 0.8);border-top: 8px solid #c62e06;}
.wrap-box .intro6 .txt{padding: 15px 20px 20px 30px;color: #000;font-size: 16px;line-height: 24px;letter-spacing: 2px;}
.intro1-title {background:url(images/title.png) center top 0px no-repeat;height:60px;text-indent:-3000px;}
.intro1 .txt em{color: #fff;background: #eb6100;padding: 3px;font-style: normal;margin-right: 3px;}
.intro2 .txt em{color: #fff;background: #0070e2;padding: 3px;font-style: normal;margin-right: 3px;}
.intro3 .txt em{color: #fff;background: #a40000;padding: 3px;font-style: normal;margin-right: 3px;}
.intro4 .txt em{color: #fff;background: #876117;padding: 3px;font-style: normal;margin-right: 3px;}
.intro5 .txt em{color: #fff;background: #793f98;padding: 3px;font-style: normal;margin-right: 3px;}
.intro6 .txt em{color: #fff;background: #c62e06;padding: 3px;font-style: normal;margin-right: 3px;}
.intro2-title {background:url(images/title.png) center top -60px no-repeat;height:60px;text-indent:-3000px;}
.intro3-title {background:url(images/title.png) center top -120px no-repeat;height:60px;text-indent:-3000px;}
.intro4-title {background:url(images/title.png) center top -180px no-repeat;height:60px;text-indent:-3000px;}
.intro5-title {background:url(images/title.png) center top -240px no-repeat;height:60px;text-indent:-3000px;}
.intro6-title {background:url(images/title.png) center top -300px no-repeat;height:60px;text-indent:-3000px;}


:first-child.wow{ *visibility:visible ! important; visibility:visible\9 ! important;}


@media only screen and (min-width: 960px) and (max-width:1095px){
	* { box-sizing: border-box; }
    html,body { width: 100%; min-height: 100%; }	
	.top_content {width: 100%;}
	.top_content .main-title {right:10%;}
	.wrap-box {width: 100%;}
	.wrap-blog {width: 100%;margin: 0 0 0 10px;}
	.wrap-blog .pic{width: 32%;margin: 0 10px 0 0;}	
	
}
@media only screen and (min-width: 769px) and (max-width:960px){
	* { box-sizing: border-box; }
    html,body { width: 100%; min-height: 100%; }	
	.top_content {width: 100%;}
	.top_content .main-title {right:1%;}	
    .wrap-box {width: 100%;}
	.wrap-blog {width: 100%;margin: 0 0 0 10px;}
	.wrap-blog .pic{width: 32%;margin: 0 5px 0 0;}	
    .wrap-blog .pic .txt{padding:5px 10px 5px 10px;}
}

/*------------------------------- 平板 ----------------------------------*/

@media screen and (max-width: 768px) {
    * { box-sizing: border-box; }
    html,body { width: 100%; min-height: 100%; }	
	.container {background: inherit;}
    .top_content {  width: 100%;  height: auto; padding: 0}
    .top_content .mobile {display: block;width: 100%;height: auto;position: inherit;margin: 0 auto;}	
	.top_content .main-title{display: none;}	
    /***按鈕列***/
    #nav {display: none; }
	.menu{display: none; }
    #togglenav {display: block;z-index: 9999;position: fixed;right: 0;overflow: hidden;line-height: 35px;width: 100%;cursor: pointer;}
	.main {width: 100%;margin: 0 auto;}
	.wrap-tour {width: 90%;margin-top: 20px;padding-bottom: 20px;padding-top: 30px;}    
    .product_text span {clear: both;display: inline-block;}	
	.product_box {width:100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin: auto;float: none;margin-bottom: 15px;margin-top: 15px;}	
	.product_text {width: 100%; font:16px "微軟正黑體";padding: 5px 10px 5px 10px;line-height: 20px;}
	.wrap-box {width: 90%;height:auto;}
	.box-01,.box-02,.box-03,.box-04,.box-05,.box-06{ background: inherit}    
	.wrap-box .mobile {	display: block;width: 100%;}
	.wrap-box .intro1{width: 100%;margin-right: 0px;margin-top: 20px; padding-top: 20px;}
	.wrap-box .intro2{width: 100%;margin-left: 0px;margin-top: 20px; padding-top: 20px;}
	.wrap-box .intro3{width: 100%;margin-right: 0px;margin-top: 20px; padding-top: 20px;}
	.wrap-box .intro4{width: 100%;margin-left: 0px;margin-top: 20px; padding-top: 20px;}
	.wrap-box .intro5{width: 100%;margin-right: 0px;margin-top: 20px; padding-top: 20px;}
	.wrap-box .intro6{width: 100%;margin-left: 0px;margin-top: 20px; padding-top: 20px;}
    .wrap-box .intro1 .txt{padding: 15px 0px 10px 0px;}
	.wrap-box .intro2 .txt{padding: 15px 0px 10px 0px;}
	.wrap-box .intro3 .txt{padding: 15px 0px 10px 0px;}
	.wrap-box .intro4 .txt{padding: 15px 0px 10px 0px;}
	.wrap-box .intro5 .txt{padding: 15px 0px 10px 0px;}
	.wrap-box .intro6 .txt{padding: 15px 0px 10px 0px;}
	.intro1-title {background:url(images/title.png) left top 0px no-repeat;}
	.intro2-title {background:url(images/title.png) left top -60px no-repeat;}
	.intro3-title {background:url(images/title.png) left top -120px no-repeat;}
	.intro4-title {background:url(images/title.png) left top -180px no-repeat;}
	.intro5-title {background:url(images/title.png) left top -240px no-repeat;}
	.intro6-title {background:url(images/title.png) left top -300px no-repeat;}
	.wrap-blog {width: 100%;margin: 0 0 0 10px;padding-bottom: 30px;}
	.wrap-blog .pic{width: 32%;margin: 0 5px 0 0;}	
    .wrap-blog .pic .txt{padding:5px 10px 5px 10px;line-height: 15px;}
	

}


/*------------------------------- 手機 ----------------------------------*/

@media (max-width: 680px) {
    * { box-sizing: border-box; }
    html, body {width: 100%; min-height: 100%; }
	.left,.right{ float:none;}	
	.wrap-box {width: 95%;}
	.wrap-tour {width: 90%;} 
	.product_box {width:100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin: auto;float: none;margin-bottom: 10px;margin-top: 10px;}
	.product_text {font:16px "微軟正黑體";padding: 3px 10px 3px 10px;line-height: 22px;}
	.product_text em{padding: 0px 0px 0px 0px;}
    .wrap-blog {width: 100%;padding: 20px 10px 10px 10px;margin: 0px;}
	.wrap-blog .pic{width: 100%;margin-bottom: 10px;padding: 0px;}		
    
	
}