@charset "utf-8";
@import url("reset.css");

body {font-size:62.5%; background: url(../images/bg.jpg);}
.pc{ display:block;}
.m{ display:none !important;}

/*主視覺*/
.visual {
    margin: 0 auto; 
    padding: 0; 
    position: relative; 
    overflow:hidden;
}
.visual img{width:100%;}

/*內容區塊*/
.content { margin: 0 auto; padding: 0; width:100%; max-width:1400px;}
/*.menu-1st.stuck{position:fixed; z-index:995; top:0px; background-color:#680527;}*/

.tag.stuck {
    position: fixed;
    z-index: 997;
    background-color: #fffdd0;
    display: block;
    top: 40px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.3)
}

a[name^="a"] {position: relative; top: -150px; clear:both;}
a[name^="p"] {position: relative; top: -150px; clear:both;}

/*3塊廣告*/
.adBox{ width:98%; margin:auto; padding-top:3%;}
.adBox div a { width:95%; margin:auto; display:block;}
.adBox div a img{width:100%; display:block;}


/*回頂部*/
.scroll2top:link, .scroll2top:visited {background: url(../images/top.png) no-repeat 0 0; height:60px; width:60px; background-size:contain; position:fixed; bottom:50px; right:0;}
.scroll2top:hover { background: url(../images/top1.png); background-size:contain;}

/* c23模組專用 */
q:before, q:after {content: "";}
*+html .carrier li {min-height: 1%;}
.carrier li:after {
    content: "."; 
    display: block; 
    clear: both; 
    visibility: hidden; 
    line-height: 0; 
    height: 0;
}
.intro-anchors {display: none;}
.carrier { width:97%; margin:40px auto;}
.carrier h4{
	width:100%;
	height:48px;
    clear: both;
    letter-spacing: 2px;
    margin-top: 6px; 
	display:block;
    overflow:hidden;
    color:#eac61c;
	background:url(../images/titleLG.jpg) no-repeat left top;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    font: bold 26px/1.4 Verdana, Geneva, sans-serif,"微軟正黑體";
    padding-left: 2%;
    padding-top:5px;
} 

.carrier h4 em{
	color:#eac61c;
	font: bold 26px Verdana, Geneva, sans-serif,"微軟正黑體";
	padding:0 20px;
	width:100%;
	text-align:left;
	display:block;
    overflow:hidden;
    margin-top:8px;
}

.carrier h4 em:before{
    content:"\f0da";
    font-family:FontAwesome;
    padding-right:10px;
}     

.carrier ul { padding: 0; margin: 0 auto; width:100%;}
.carrier li {
    list-style-type: none; 
    padding: 15px 40px;
    margin:0px 0 15px 0;
    line-height: 1em;  
    -webkit-box-shadow: 0px 5px 3px 0 #121442; 
    box-shadow: 0px 5px 3px 0 #121442;
    background:rgba(255,255,255,0.9);
    transition: all 1s ease;
}
.carrier li:hover {
    background-color:rgba(255, 255, 255, 1); 
    box-shadow:none;
    margin:0px 10px 15px 10px; 
    transform: all 1s;
    border-bottom: solid 4px #eaba08;
}

.carrier li:last-child{border:none; box-shadow:none}
.carrier li a strong {
    display: block;
    font: bold 22px Verdana, Geneva, sans-serif,"微軟正黑體";
    color: #0d2d6f;
    margin: 4px 0;
}
.carrier li a:link, .carrier li a:visited {
    text-decoration: none;
    font:16px Verdana, Geneva, sans-serif,"微軟正黑體";
    color:#000;
}
.carrier li em.price {
    font:21px Verdana, Geneva, sans-serif,"微軟正黑體"; 
    color: #d98016;
    float: right; 
    *margin-top: -1.2em; 
    font-weight: bold;
}
.carrier li em.price span, .carrier li em.price var {font-size: 21px; font-weight: bold;}
.carrier ul li.box-head{ display:block;}

.boxhide .carrier ul li.box-head{ display:none;}

.carrier .box-head{
    /*border-top:2px solid #8C43C3;*/
    margin-top:-5px;
}
.carrier .box-head:hover{background:#fff;}
.carrier .box-head a:link, .carrier .box-head a:visited{
    cursor:default; 
    margin:-20px 0 -20px -1px; 
    outline: none; /* for Firefox */
}
.carrier .box-head a strong, .carrier .box-head a img, .carrier .box-head p span{
    display:none;
}
.carrier .box-head q{
    display: block;
    font: bold 18px Verdana, Geneva, sans-serif,"微軟正黑體";
    padding: 10px 0 10px 9px;
    color: #b9641c;
    background: #ece8c6;
    height: auto;
    margin: -20px 0 -20px -8px;
    border-radius: 5px;
}
/* 線框典雅版
.carrier .box-head q{
    display: block;
    font: 500 18px Verdana, Geneva, sans-serif,"微軟正黑體";
    padding: 10px 0 10px 9px;
    color: #054fce;
    height: auto;
    margin: -20px 0 -20px -8px;
    border: solid 1px #2065de;
    border-left: solid 8px #2065de;
    border-radius: 5px;
}*/

/*介紹區塊*/
.introHKbox{
    margin:0 auto;  
}
.introHK, .introHK1 {
    width: 48%;
    margin:0 1% 50px 1%;
    float: left;
}
.introHK h4 ,.introHK1 h4{
    display: block;
    width: 100%;
    font-size: 25px;
    font-weight: bold;
    line-height: 43px;
    margin:0 auto;
    padding:8% 5% 0 5%;
	/*padding:49px 0 0 15px;*/
	color:#eac61c;
	box-sizing:border-box;
}

.introHK h4{
    background: url(../images/title.png) no-repeat;
	background-size:100% auto;
}
.introHK1 h4{
    background: url(../images/title.png) no-repeat;
	background-size:100% auto;
}
/*attractions transport */
.Attractions .Transport{
    margin:0 auto;
    padding:0;
}
.introTopicBox{
    position:relative;
    display:block;
    margin:0 auto;
    width:100%;
}
.introTopic{
    z-index:2;
    display:block;
    width:100%;
    box-sizing: border-box;
    padding:15px 30px;
    background:rgba(0,0,0,0.8);    
    color:#fff;
    font-size: 12px;
}
.introTopic > h3{   
    font:normal 160%/1.4 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    margin:0 auto 5px;
    text-align: left;
}
.introTopic p{
    font:normal 120%/1.5 Arial,"微軟正黑體", "Microsoft JhengHei",sans-serif;
    text-align: left;
}
.introTopicBox img{
    width: 100%;
}

/*information旅遊錦囊*/
.inforHK{
   margin:0 auto; 
   background-color: #c292d9; 
}
.information{
    max-width: 1400px;
    width: 100%;
    margin:0 auto;
    padding:40px 5px;
    overflow: hidden; 
}
.information h4{
    max-width: 312px;
    width: 100%;
    height: 52px;
    font-size: 0px;
    margin:40px auto;
    background-image: url(../images/MCinfo.png);
}

.lineline{
    border-bottom:double;
    border-color:#fff;
    clear: both;
}
a.linkto{display:inline-block; width:100%; font-size:24px; font-weight: bold; color:#fff; line-height:60px; vertical-align:middle; text-align:center; background: #2065de; margin:30px auto; padding:1px 50px; border-radius: 5px; box-shadow: 0 4px 0px 0 #0441ab; text-decoration:none;}
.linkto:hover{color:#fff; text-decoration:none; background:#4782ea;}
/*rwd*/
@media screen and (max-width:1270px) {
    .introHK, .introHK1 {width: 48%;}
    .content { margin: 0 auto; padding: 0; width:100%;}
}

@media screen and (max-width:800px) {
    .pc{ display:none !important;}
    .m{ display:block !important;}
    .content { margin: 0 auto; padding: 0; width:90%;}
    .introHK, .introHK1 {
        width: 100%;
        float:none;
        margin: 0 auto 50px auto;
    }
    .introHK h4,.introHK1 h4{
        padding:8% 5% 0 5%;
        font-size:18px;
        line-height: 30px;
    }
    .carrier h4{
        font: bold 2em/1.4 Verdana, Geneva, sans-serif,"微軟正黑體";
        padding: 2% 0 0 3%;
    }
}
@media screen and (max-width:640px) {
    .content { margin: 0 auto; padding: 0; width:90%;}
}

@media screen and (max-width:450px) {
    .introHK h4{
        background: url(../images/title_s.png) no-repeat;
        background-size:100% auto;
    }
    .introHK1 h4{
        background: url(../images/title_s.png) no-repeat;
        background-size:100% auto;
    }
}

/*title_fix*/
@media screen and (min-width:987px) and (max-width:1160px) {
    .introHK h4,.introHK1 h4{
        line-height: 37px;
    }
}
@media screen and (min-width:801px) and (max-width:988px) {
    .introHK h4,.introHK1 h4{
        line-height: 30px;
    }
}
@media screen and (min-width:640px) and (max-width:799px) {
    .introHK h4,.introHK1 h4{
        padding:8% 5% 0 5%;
        font-size:18px;
        line-height: 43px;
    }
}