@charset "utf-8";
/* 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, 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,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*---------------------------------------------------------------------*/

body {	
    line-height: 1;	
	-webkit-text-size-adjust: none;/*防止allpe的safari瀏覽器字體變大*/
}
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;}

.clearfix {
  overflow: hidden;
  zoom: 1;
}

img { width:100%;}



#web-outer{	
	clear: both;
	overflow: hidden;	
}

.header{clear:both;overflow: hidden;}

header h1 {
    text-indent: 101%;
    overflow: hidden;
    white-space: nowrap;
    position: absolute;
    width: 100%;
}

.header-bg {
    background: url("../img/nagasaki_bg.jpg") center top no-repeat;
    height: 770px; 
    margin:0 auto;
	z-index: 50;		
}

.mainpic {     
    margin:0 auto;	
	padding-top: 100px;
	max-width: 438px;	
}

.main-title {	
    z-index: 900;    
	padding-top: 0;
	max-width: 438px;	
}

.main-title02 {	
    z-index: 900; 
	max-width: 396px;	
}

.header_md{display: none;}


/*-------------------------------------選單---------------------------------------------*/
#main-nav {
    z-index: 990;
    overflow: hidden;
 }
 
.block_menu {
     z-index: 990;
     width: 100%;
     text-align:center;
     font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;
     height: 65px;	
	 padding-top: 15px;
     background-color:#fff;	 	 
     z-index: 990;	
 }
 
.sticky { top: 40px; }
#nav ul{background-color: antiquewhite;} 
#nav li { display:inline-block; }
#nav li a { display: inline-block;margin-right: 3px;}

.menu {}
.menu01 a { width: 185px;height: 45px;text-indent:-5000px;background: url("../img/nav.png") 0 0 no-repeat;}
.menu01 a:hover, .menu01 a.active{ background: url("../img/nav.png")0 -45px;}
.menu02 a { width: 185px;height: 45px;text-indent:-5000px;background: url("../img/nav.png") -185px 0 no-repeat;}
.menu02 a:hover, .menu02 a.active{ background: url("../img/nav.png") -185px -45px;}
.menu03 a { width: 185px;height: 45px;text-indent:-5000px;background: url("../img/nav.png") -370px 0 no-repeat;}
.menu03 a:hover, .menu03 a.active{ background: url("../img/nav.png") -370px -45px;}
.menu04 a { width: 185px;height: 45px;text-indent:-5000px;background: url("../img/nav.png") -555px 0 no-repeat;}
.menu04 a:hover, .menu04 a.active{ background: url("../img/nav.png") -555px -45px;}
 .active {
     -webkit-transform: translate3d(0, 0, 0);
     -moz-transform: translate3d(0, 0, 0);
     -o-transform: translate3d(0, 0, 0);
     -ms-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
 }
/*錨點*/
.block-first{overflow: hidden;padding-top: 90px;margin-top: -90px;}
.block-first02{overflow: hidden;padding-top: 40px;margin-top: -40px;}

.main02{max-width: 960px;margin: 0 auto;padding: 80px 0;} 

/*推薦行程*/
.tour_bg{background: url("../img/tour_bg.jpg") top repeat;}

.tour_list_box ul {
	width: 90%;
	min-height: 300px;
	margin: 0 auto;
	padding: 10px;
	font-family:"微軟正黑體", Arial, Helvetica, sans-serif;
}

.tour-title{max-width: 273px;width: 100%;height: 147px; background: url("../img/title_01.png") top center no-repeat;margin: 0 auto 50px auto;text-indent: -5000px;}

	
.tour_list_box li{
	font-size: 16px;	
	line-height: 1.2em;	
	border-bottom:1px solid #97a7b5;
	padding: 10px 0;
}
.tour_list_box p.txt{
	margin-top: 10px;	
	display: inline-block;
	font-size: 15px;
	color: #fff;
	background-color: #d3a874;
	border-radius: 10px;
	font-weight: bold;
	padding:8px 10px;
	font-family:"微軟正黑體", Arial, Helvetica, sans-serif;
}

.tour_list_box li em  { color:#d3a874; font-style:normal; padding-left:6px;font-size:13px;   }

.tour_list_box .price{	
	font-size:15px;
	line-height:1.2em;
	color:#d12c00;		
	font-weight: bold;
	float: right;
}

.tour_list_box .price strong {	
	font-size:18px;
	line-height:1.2em;
		
}

.tour_list_box li a{	
	color:#505050;
	text-decoration:none;
	display:block;
	overflow:hidden;
	padding: 3px 5px;
	font-weight: bold;
	border-left: #d3a874 3px solid;
}
.tour_list_box li a:hover{}

.tour-wrap{max-width: 1000px;width: 95%; margin:0 auto;padding: 80px 0;}

/*綜合行程*/
.min-tour-title{min-width:100px;display: inline-block;text-align: center;font-size: 20px;color: #fff;border-radius: 25px;padding: 10px;background-color: #d3a874;font-family:"微軟正黑體", Arial, Helvetica, sans-serif;}
.tour-list {width: 100%;margin: 0 auto;padding: 10px 0 50px 0;}
.tour-list a {display:flex;padding: 10px;overflow: hidden;border-bottom: dashed 1px #b2b2b2;text-decoration: none;justify-content:space-between;align-items:center;}
.name-l{flex:0 0 85%;font-family:"微軟正黑體", Arial, Helvetica, sans-serif;font-size: 18px;color:#272727;line-height: 1.5em;font-weight: 500;}
.name-l em{font-style:normal;color: #d3a874;font-size: 15px;padding: 3px;margin-right: 5px;}
.name-l strong{font-size: 15px;color: #045080;border-radius: 3px;border: 1px #045080 solid;background-color: #fff; margin-right: 5px;padding: 2px 3px 3px 3px;}
.price-r{flex:0 0 15%;font-family:"微軟正黑體", Arial, Helvetica, sans-serif;text-align:right;font-weight: 600; font-size: 15px;line-height: 1.2em;color: #272727;}
.price-r strong{font: 600 25px "Anton", sans-serif;margin: 0 2px;letter-spacing:1px;color: #d12c00;}
.price-r span{display: block;font-size: 15px;color: #d12c00;font-weight: 600; text-align: right;margin-bottom: 5px;}




.bg-01{background: url("../img/bg_01.png") top no-repeat;height: 60px;}
.bg-02{background: url("../img/bg_02.png") bottom no-repeat;}
.bg-03{background: url("../img/bg_03.png") top no-repeat;}
.bg-04{background: url("../img/bg_04.png") top no-repeat;}
.bg-05{background: #f2f9ff url("../img/bg_05.png") top no-repeat;}
.main{max-width: 1200px;margin: 0 auto;padding: 80px 0;position: relative;}
.girl{width: 293px;position: absolute;bottom:10px;right: -350px;}
.top-title{max-width: 273px;margin: 0 auto 20px auto;}
.top-title{max-width: 273px;width: 100%;height: 150px; margin: 0 auto 20px auto;text-indent: -5000px;}
.t01{background: url("../img/title_02.png")top center no-repeat;}
.t02{background: url("../img/title_03.png")top center no-repeat;}
.t03{background: url("../img/title_04.png")top center no-repeat;}

/*打卡熱點*/
.check-box{width: 100%;position: relative;margin: 50px 0 40px 0;clear: both;min-height: 485px;font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;font-size: 15px;line-height: 2em;color: #373737;clear: both;}
.check-box .check-txt{width: 50%; position: absolute;top:25%;right: -2px;z-index: 90;}
.check-box .check-txt img{max-width: 75px;margin-right: 10px;}
.check-txt .note{background-color: #f3f3f3;border-left: #c5d9e8 8px solid;padding: 20px;}
.check-txt .toptxt{font-size: 30px;font-weight: bold;color: #3b382f;padding-left: 50px; padding-bottom: 10px;display:block;}
.more{display: block;font-size: 15px;line-height: 2em;text-align: right;}
.more a{text-decoration: none;border-bottom: 1px #333 solid;text-align: right;color: #333;margin-right: 10px;}
.more a:hover{border-bottom: none;}
.check-box .check-ph{width: 55%;max-width: 620px; position: absolute;top:10px;left: 0px;padding: 20px;z-index: 50;}
.check-box .check-ph img{}
.check-bg01{max-width: 18px;position: absolute;top:80px;left:-10px;}
.check-bg02{max-width: 18px;position: absolute;bottom:50px;right: -10px;}


/*玩樂攻略*/
.spot-video {position: relative;max-width: 1200px; margin: 0 auto;overflow: hidden;padding-top: 35px;text-align: center;}
.v-box{width: 30%;display: inline-block; overflow: hidden;position: relative;margin: 10px 10px;border-radius: 30px;}
.v-box .txt{width: 100%;bottom: 0;position: absolute;background-color: #cfbb84;padding: 6px 0;color: #fff;text-align: center;font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;font-size: 18px;line-height: 2em;font-weight: bold;}

.v-box a p.play {
	display:inline-block;
    width: 90px;
    height: 90px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -45px;
    margin-top: -45px;
	background: url("../img/play.png")  0 0 no-repeat;
	text-indent:-9999px;
 	transition: all 0.4s ease;
}
.v-box a:hover p.play {
	background: url("../img/play.png")  0 -90px no-repeat;
}

/*玩樂攻略*/
.spot-must {position: relative;max-width: 1200px; margin: 0 auto;overflow: hidden;padding-top: 35px;text-align: center;}

.box{width: 30%;display: inline-block; overflow: hidden;position: relative;margin: 10px 10px;}
.box .txt{width: 100%;bottom: 0;position: absolute;background-color: #000;padding: 6px 0;color: #fff;text-align: center;font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;font-size: 25px;line-height: 2em;font-weight: bold;}
		.box:before{
		    content: "";
			background: rgba(0,0,0,0.6);		   		   
		    position: absolute;
		    top: 0;
		    left: 50%;
		    bottom: 3px;
		    right: 50%;
		    z-index: 1;
		    transition: all 0.3s ease-out 0.3s;			
		}
		.box:hover:before{
		    left: 0;
		    right: 0;		   
		    transition-delay: 0s;
		}
		.box img{
		    width: 100%;
		    height: auto;
		    transition: all 0.8s ease-out 0s;
			
		}
		/*.box:hover img{ opacity: 0.2; }*/
		.box .box-content{
		    width: 100%;
		    height: 100%;
		    position: absolute;
		    top: 0;
		    left: 0;
		    z-index: 2;
		}
		.box .title{
		    padding: 20px 15px;
			text-align: justify;
		    margin: 0;
		    font-size: 15px;
			line-height: 2em;
		    color: #fff;
			font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;
		    opacity: 0;
		    transition: all 0.35s ease-out 0s;
		}		
		.box:hover .title{opacity: 1;transition-delay: 0.3s;}

/*美食*/
.food-box {margin:0 auto; clear:both; overflow: hidden;text-align: center;padding: 30px 0 20px 0;}
.ct30 {width:31%; display: inline-block; vertical-align: top;border-radius: 50%;margin: 0 5px 20px 5px; position: relative;}
.ct30 p {width:100%;font: 600 15px "微軟正黑體";color: #fff;;position: absolute;bottom:30px;}
.ct30 p span{display: inline-block;padding: 5px; background-color:#496f8c; font-size: 18px;margin-bottom: 5px;}
.ct30 a p.play {
	display:inline-block;
    width: 90px;
    height: 90px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -45px;
    margin-top: -45px;
	background: url("../img/play.png")  0 0 no-repeat;
	text-indent:-9999px;
 	transition: all 0.4s ease;
}
.ct30 a:hover p.play {
	background: url("../img/play.png")  0 -90px no-repeat;
}
.ct30 img{border-radius: 50%;}




@media screen and (max-width: 959px) {	
.header-bg	{display: none;}
.header_md{display: block;margin-top: 40px;}	
.check-box .check-txt{top:5%;}		
.box{width: 45%;}
	
.tour_list_box li a{	
	border-left: inherit;
}	
	
.tour_list_box .price{		
	float: inherit;
	display: block;
	text-align: center;
	margin-top: 5px;
	}	
	
}
@media screen and (max-width: 850px) {
.name-l{flex:0 0 75%;}
.price-r{flex:0 0 25%;}	
}

@media screen and (max-width: 800px) {
	.v-box{width: 80%;}
	.ct30 {width:90%;}
	.ct30 p {bottom:10%;}
}	

/*平版*/
@media screen and (max-width: 768px) {
	#main-nav{display: none;}		
	/*錨點*/
	.block-first{overflow: hidden;padding-top: 0;margin-top: 0;}
	.block-first02{overflow: hidden;padding-top: 0;margin-top: 0;}
	
	.main{padding: 50px 0;}
	.check-box{min-height: inherit;margin: 10px 0;}	
	.check-box .check-txt{width: 90%; position: inherit;margin: 0 auto;}
	.check-txt .toptxt{padding-left: inherit;}
	.check-box .check-ph{width: 90%;position: inherit;margin: 0 auto;}
	
}

@media screen and (max-width: 600px) {
	.v-box{width: 95%;}
	.spot-must {padding-left: 0;padding-bottom: 0;}
	
	.check-txt .toptxt{font-size: 25px;}
	
	.box{width: 95%;margin: 10px 0 10px 0;}	
	.tour-wrap a {width: 100%;}	
	.tour-list a{display:inherit;}	
	.name-l{flex:initial;width: 100%; display: block;}
	.price-r{flex:initial;width: 100%;display: block;margin-top: 5px;}		
}

/*手機*/
@media screen and (max-width: 480px) {
.box{margin: 10px 0 10px 10px;}	
.ct30 p {bottom:8%;}	
}	
	

@media screen and (max-width: 320px) {}
















