@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, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, 
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;/*防止allpe的safari瀏覽器字體變大*/body{ margin: 0; padding: 0; }
}

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;
}
a{text-decoration: none;}
.clean { clear:both;}

.clearfix {
  overflow: auto;
  zoom: 1;
}

.wrapper h1,h2,h3{display: none;}
.container1{background:url("img/bg1.png") center top no-repeat;font-family: arial,微軟正黑體;overflow: hidden; }
.cloud1{position: absolute;left: 10%;top: 30px;z-index: 1;}
.cloud2{position: absolute;left: 15%;top: 200px;z-index: 1;}
.cloud3{position: absolute;right: 20%;top: 350px;z-index: 1;}
.cloud4{position: absolute;right: 10%;top: 400px;z-index: 1;}
.header{max-width: 960px;margin: 0 auto;position: relative;min-height: 504px;}

.dialog1{position: absolute;width: 161px; right: 248px;top: 100px;z-index: 1;}
.dialog2{position: absolute;width: 171px;left: 289px;top: 81px;z-index: 1;}
.main-title{position: absolute;left: 299px;top: 241px;z-index: 1;}
.block-first{padding-top: 130px;margin-top: -130px;}

/*以下選單*/
.block_menu{width: 100%;padding-top: 10px;overflow: hidden;z-index: 3000;}
.block_menu ul{background:url("img/menu.png");display: block; width: 712px;height:69px;margin: 0 auto;}
.block_menu li{display: block;width: 50%;float: left;height:69px;font-size: 0px;}
.block_menu li a{display: block;height:69px;}
.block_menu li.m1 a:hover{background:url("img/menu-on.png");}
.block_menu li.m2 a:hover{background:url("img/menu-on.png");background-position: -356px;}

.main{max-width: 960px;margin: 0 auto;padding-top:70px;}
.inner1{margin: 0 auto;max-width: 513px;padding-top: 50px;}
.inner2{margin: 0 auto;max-width: 477px;}
#part2{width: 100%;background:url("img/bg2.png") center top no-repeat;overflow: auto; padding-top: 99px;padding-bottom: 100px;}
.info{width: 90%;margin-top: 70px;float: left; clear: both;margin-bottom: 40px;margin-right: 5%;margin-left: 5%;}
.pic{width: 45%;float: left;position: relative;z-index: 100;}
.pic::after{content: "";position: absolute;width: 260px;height: 15px;left: -10px;top: -10px;background: #bddaff;z-index: 99; }
.pic::before{content: "";position: absolute;width: 15px;height: 270px;left:-10px;top: -10px;background: #bddaff;z-index: 99; }
.city{position: absolute;width: 65px;height: 84px; background:url("img/city-icon1.png");top: -30px;left: 15px;z-index: 100;}
.city p{text-align: center;padding-top: 25px;color:#fff7e0; }
.tour{width: 55%;float: right; background: #FFFFFF;padding: 20px;box-sizing: border-box;margin-top: 25px;}
.name{color: #9291E1; border-bottom: dotted  2px #979797;font-size: 18px;line-height: 28px;font-weight: bold;letter-spacing: 1px; padding-bottom: 5px;}
.note{font-size: 15px;padding-top: 20px;letter-spacing: 1px;line-height: 24px;}
.note ul{padding-left:10px;}
.note li{display: block;margin-bottom: 10px;list-style-image: url("img/list-icon.png"); list-style-position:inside;padding-left: 5px;position: relative;color: #000000;}
.note li::after{content: "";position: absolute;width: 8px;height: 6px;left: -10px;top:10px;z-index: 99;background:url("img/list-icon.png"); }
.price{text-align: right;color: #ff5ca0;font-size: 16px;font-weight: bold;margin-top: 15px;}
.price strong{font-size: 38px;margin-right: 3px;margin-left: 5px;}

.s2 .pic{float: right;}
.s2 .tour{float: left;}
.s2 .pic::after{background: #efb6bc;}
.s2 .pic::before{background: #efb6bc;}
.s2 .city{position: absolute;width: 65px;height: 84px; background:url("img/city-icon2.png");top: -30px;left: 15px;z-index: 100;}

/*3欄行程*/
.box{width: 32.33333%;margin-left: 0.5%;margin-right: 0.5%;float: left;position: relative;border-radius: 15px;padding:10px;box-sizing: border-box;margin-bottom: 50px;background: #FFFFFF;}
.city-3col{position: absolute;width: 50px;height:30px; background: #BABAFF; top: -20px;left: 15px;z-index: 100;text-align: center;line-height: 30px;border-radius: 10px 10px 0 0;color: #FFFFFF;}
.name-3col{font-size: 15px;text-align: center;color: #000000; font-weight: bold;border-bottom: dotted #B0B0B0 1px;padding-bottom: 3px;padding-top: 5px;margin-bottom: 10px;}
.note.n2{padding-top:5px;}
.price-3col{text-align: center;color: #ff5ca0;}
.price-3col strong{font-size: 20px;margin-right: 3px;margin-left: 3px;}

#main-nav {
    z-index: 990;
    overflow: hidden;
 }
 
 .block_menu {
     z-index: 990;
     text-align:center;
     font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;
     z-index: 990;
 }
 
 .sticky { top: 10px; }
/*------media query----------*/


@media screen and (min-width:961px){
	.header-s{display:none;}
}


/*---平板-----*/
@media only screen and (min-width: 769px) and (max-width:960px) {
.header-s{display:none;}
}
/*---平板-----*/
@media only screen and (min-width: 769px) and (max-width:910px) {
.dialog1{width: 161px; right: 198px;top: 100px;z-index: 1;}
.dialog2{width: 171px;left: 239px;top: 81px;z-index: 1;}
}
/*---平板-----*/
@media only screen and (max-width:768px) {
.container1{background-image: none;}
.header{display:none;}
#nav{display:none;}
.wrapper{background: #FFF7E0;}
.tour,.pic,.s2 .pic,.s2 .tour{float: none;width: 90%;margin: 0 auto;}
.pic{float: none;width: 90%;margin: 0 auto;}
.all-cloud{display:none;}
.title{width: 95%;margin: 0 auto;}
#part1{padding-bottom: 150px;}
#part2{padding-bottom: 30px;}
.info{float: none;}
.box{width: 99%;}
.main{padding-top:10px;}
}