@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, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td, figure, mark {
    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瀏覽器字體變大*/
}
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%;}

/************************************************************************************
STRUCTURE 主要區塊
*************************************************************************************/

body {
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
    background-color: #fff;
}

header h1 {
    text-indent: 101%;
    overflow: hidden;
    white-space: nowrap;
    position: absolute;
}

#web-outer {
    width: 100%;
    clear: both;
    overflow: hidden;
}

.header {
    clear: both;
}

.container2 {
    width: 100%;
    position: relative;
    margin-top: 0px;
}

.logo {
    display: block;
    max-width: 465px;
    position: absolute;
    left: 36%;
    right: 33%;
    top: 150px;
    z-index: 200;
}

.block-center {
    width: 100%;
    max-width: 960px;
    margin: auto;
    clear: both;
    position: relative;
    z-index: 150;
}

.balloon01 {
    position: absolute;
    max-width: 125px;
    top: 700px;
    right: -120px;
    z-index: 200;
}

.balloon02 {
    position: absolute;
    max-width: 125px;
    top: 700px;
    left: -200px;
    z-index: 200;
}

.bg-bottom {
    width: 100%;
    height: 423px;
    position: absolute;
    top: 427px;
    z-index: 100;
    background: url("../img/bg_bottom.png") bottom center no-repeat;
}

.slide {
    margin: 0 auto;
    z-index: 50;
    background: #e6f7ff url("../img/bg01.png") top repeat;
}

.slide ul li p.ps {
    position: absolute;
    right: 10px;
    top: 50px;
    color: #666;
    padding: 5px;
    background-color: #fff;
    opacity: 0.8;
    font-size: 13px;
    border-radius: 10px;
}


/*動畫*/
.floating {
    animation: Floatingx 5s infinite ease-in-out;
    -moz-animation: Floatingx 5s infinite ease-in-out;
    -webkit-animation: Floatingx 5s infinite ease-in-out
}

@keyframes Floatingx {
    from {
        transform: translate(0, 0)
    }

    65% {
        transform: translate(0, 20px)
    }

    to {
        transform: translate(0, 0)
    }
}

@-webkit-keyframes Floatingx {
    from {
        -webkit-transform: translate(0, 0)
    }

    65% {
        -webkit-transform: translate(0, 20px)
    }

    to {
        -webkit-transform: translate(0, 0)
    }
}

.cloud01 {
    animation: cloud-1 5s infinite;
}

@keyframes cloud-1 {
    0% {
        transform: translate(0px, 0px);
    }

    50% {
        transform: translate(-20px, 0px);
    }

    100% {
        transform: translate(0px, 0px);
    }
}

.cloud02 {
    animation: cloud-2 3s infinite;
}

@keyframes cloud-2 {
    0% {
        transform: translate(0px, 0px);
    }

    50% {
        transform: translate(-20px, 0px);
    }

    100% {
        transform: translate(0px, 0px);
    }
}


/*-------------------------------------選單---------------------------------------------*/
#main-nav {
    z-index: 990;
    clear: both;
    overflow: hidden;
}

.block_menu {
    z-index: 990;
    width: 100%;
    text-align: center;
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
    height: 60px;
    /*background: url("../img/nav_bg.png") top no-repeat;*/
    background-color: #fff;
    z-index: 990;
}

.sticky {
    top: 40px;
}

#nav ul {}

#nav li {
    display: inline-block;
    margin-right: 8px;
}

#nav li a {
    display: inline-block;
}

.menu {}

.menu01 a {
    width: 140px;
    height: 52px;
    text-indent: -5000px;
    background: url("../img/nav.png") 0 0 no-repeat;
}

.menu01 a:hover,
.menu01 a.active {
    background: url("../img/nav.png") 0 -52px;
}

.menu02 a {
    width: 140px;
    height: 52px;
    text-indent: -5000px;
    background: url("../img/nav.png") -140px 0 no-repeat;
}

.menu02 a:hover,
.menu02 a.active {
    background: url("../img/nav.png") -140px -52px;
}

.menu03 a {
    width: 140px;
    height: 52px;
    text-indent: -5000px;
    background: url("../img/nav.png") -280px 0 no-repeat;
}

.menu03 a:hover,
.menu03 a.active {
    background: url("../img/nav.png") -280px -52px;
}

.menu04 a {
    width: 140px;
    height: 52px;
    text-indent: -5000px;
    background: url("../img/nav.png") -420px 0 no-repeat;
}

.menu04 a:hover,
.menu04 a.active {
    background: url("../img/nav.png") -420px -52px;
}

.menu05 a {
    width: 140px;
    height: 52px;
    text-indent: -5000px;
    background: url("../img/nav.png") -560px 0 no-repeat;
}

.menu05 a:hover,
.menu05 a.active {
    background: url("../img/nav.png") -560px -52px;
}


.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 {
    padding-top: 80px;
    margin-top: -80px;
}


h2.big-title {
    min-width: 318px;
    height: 130px;
    text-align: center;
    font: 600 30px "Zen Maru Gothic";
    padding-top: 70px;
    color: #174aa0;
    background: url("../img/big_title.png") top center no-repeat;
}

h2.big-title span {
    display: block;
}

h2.big-title02 {
    min-width: 322px;
    height: 161px;
    text-align: center;
    font: 600 30px "Zen Maru Gothic";
    color: #87f2ff;
    background: url("../img/big_title02.png") top center no-repeat;
}

h2.big-title02 span {
    display: block;
}


.top-box {
    width: 100%;
    padding: 80px 0 30px 0;
}

h2.big-title03 {
    min-width: 301px;
    height: 127px;
    text-align: center;
    font: 600 45px "Zen Maru Gothic";
    line-height: 127px;
    color: #086ec4;
    background: url("../img/min_title01.png") top center no-repeat;
}

h2.big-title04 {
    min-width: 301px;
    height: 127px;
    text-align: center;
    font: 600 45px "Zen Maru Gothic";
    line-height: 127px;
    color: #856de1;
    background: url("../img/min_title02.png") top center no-repeat;
}

h2.big-title05 {
    min-width: 301px;
    height: 127px;
    text-align: center;
    font: 600 45px "Zen Maru Gothic";
    line-height: 127px;
    color: #0f990f;
    background: url("../img/min_title03.png") top center no-repeat;
}

h2.big-title06 {
    min-width: 301px;
    height: 127px;
    text-align: center;
    font: 600 45px "Zen Maru Gothic";
    line-height: 127px;
    color: #ff9000;
    background: url("../img/min_title04.png") top center no-repeat;
}


h2.min-title {
    min-width: 257px;
    height: 100px;
    text-align: center;
    font: 600 30px "微軟正黑體";
    line-height: 100px;
    color: #3073a7;
    background: url("../img/min_title.png") top center no-repeat;
    margin: 80px auto 50px auto;
}

.min-bg01 {
    background: url("../img/big_title01.png") top no-repeat;
}

.min-bg02 {
    background: url("../img/big_title02.png") top no-repeat;
}

.min-bg03 {
    background: url("../img/big_title03.png") top no-repeat;
}



#about {
    background: url("../img/about_bg.png") center repeat;
}

.about-main {
    max-width: 960px;
    margin: 0 auto;
    position: relative;
}

.title-about {
    max-width: 470px;
    margin: 0 auto;
    padding: 50px 0 0 0;
}

.balloon03 {
    position: absolute;
    max-width: 121px;
    top: 120px;
    left: -400px;
    z-index: 100;
}

.balloon04 {
    position: absolute;
    max-width: 133px;
    top: 250px;
    left: -100px;
    z-index: 100;
}

.balloon05 {
    position: absolute;
    max-width: 127px;
    top: 50px;
    right: -100px;
    z-index: 100;
}

.balloon06 {
    position: absolute;
    max-width: 158px;
    top: 250px;
    right: -350px;
    z-index: 100;
}

.about-box {
    width: 70%;
    margin: 0 auto;
    padding: 10px;
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
    padding-bottom: 50px;
}

.about-box p {
    font-size: 18px;
    line-height: 2em;
    color: #666;
    text-align: center;
}

.about-box p.title {
    font-size: 25px;
    font-weight: 600;
    color: #174aa0;
}


/*小圖輪播*/
.scroll1 {
    display: none;
}

/*精選行程*/
#tour {}

.bg01 {
    background: url("../img/top_bg01.png") top no-repeat;
    height: 44px;
}

.tour-bg {
    background: #e6f7ff url("../img/bg01.png") top repeat;
    padding-bottom: 50px;
}

.tour-bg02 {
    background: url("../img/bg_icon.png") top no-repeat;
}

.title-box {
    max-width: 301px;
    margin: 0 auto;
    padding: 80px 0 0 0;
}

.title-box img {}

.tour-main {
    max-width: 960px;
    padding: 10px;
    margin: 0 auto;
}

.tour-main a {
    text-decoration: none;
}

.tour-box {
    width: 100%;
    margin: 0 auto;
    border-radius: 15px;
    background-color: #fff;
    border: 1px #a3a3a3 solid;
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
    clear: both;
    overflow: hidden;
}

.tour-box .photo-box {
    width: 55%;
    max-width: 780px;
    float: left;
}

.tour-box .photo-box img {
    margin-bottom: -2px;
    border-radius: 15px 0 0 15px;
}

.tour-box .txt-box {
    width: 45%;
    float: left;
}

.tour-box .txt-box h3.title {
    display: block;
    padding: 10px 0;
    font-size: 18px;
    line-height: 1.5em;
    color: #086ec4;
    text-align: center;
    font-weight: bold;
    padding: 10px 15px;
    border-bottom: #ffdb13 2px solid;
}

.txt-box ul.note {
    width: 85%;
    margin: 0 auto;
    padding: 10px 0;
    min-height: 80px;
}

.txt-box ul.note li {
    list-style-image: url("../img/icon.png");
    font-size: 15px;
    line-height: 2em;
    color: #666;
    margin-left: 20px;
}

.txt-box p.price {
    display: block;
    font-size: 15px;
    color: #666;
    text-align: center;
    margin: 0 auto;
}

.txt-box p.price strong {
    color: #fd071e;
    padding: 0 2px;
    font: 600 40px "微軟正黑體";
    font-family: 'Barlow', sans-serif;
}

.left {
    float: left;
}

.right {
    float: right;
}

/*行程列表*/
.product {
    max-width: 960px;
    margin: 0 auto;
    padding: 20px 0;
    clear: both;
    overflow: hidden;
}

.tour-list {
    width: 98%;
    margin: 0 auto;
    clear: both;
    overflow: hidden;
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
}

.tour-list ul {}

.tour-list li {
    display: block;
    border-bottom: 1px dashed #b6b6b6;
    overflow: hidden;
    padding: 10px 5px;
}

.tour-list li .tour-txt {
    clear: both;
    overflow: hidden;
}

.tour-list li .tour-txt .txt_l {
    font: 600 18px "微軟正黑體";
    line-height: 1.8em;
    color: #666;
}

.tour-list li .tour-txt .txt_l .area {
    display: inline-block;
    padding: 3px 5px;
    background-color: #086ec4;
    color: #fff;
    margin-right: 5px;
    border-radius: 10px;
}

.tour-list li .tour-txt em {
    font-style: normal;
    display: block;
    color: #086ec4;
    font-size: 15px;
    line-height: 1.5em;
}

.tour-list li .tour-txt em span {
    color: #fd071e;
}

.txt-price {
    width: auto;
    text-align: right;
    margin-top: 5px;
}

.txt-price span {
    font-size: 13px;
    color: #666;
}

.txt-price span strong {
    color: #fd071e;
    padding: 0 2px;
    font: 600 28px "微軟正黑體";
    font-family: 'Barlow', sans-serif;
}

.tour-list li:hover {
    background-color: #fff;
}

.tour-setbox {
    width: 100%;
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
    display: block;
    text-align: right;
    float: right;
    margin-top: 10px;
}

.tour-setbox .set a {
    display: inline-block;
    text-decoration: none;
    font-size: 15px;
    line-height: 1.5em;
    color: #fff;
    background-color: #2db1fc;
    color: #fff;
    border-radius: 5px;
    padding: 3px 5px;
    margin-top: 5px;
    margin-left: 5px;
    border: #2db1fc 1px solid;
}

.tour-setbox .set a:hover {
    color: #2db1fc;
    background-color: #fff;
}

.product-list {
    width: 100%;
    margin: 0 auto;
    border-bottom: dashed 1px #696969;
    padding: 10px 0px;
    clear: both;
    overflow: hidden;
}

.product-line {
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    overflow: hidden;
}

.product-line h3 {
    font: 600 18px "微軟正黑體";
    line-height: 1.2em;
    flex: 0 0 80%;
    color: #666;
}

.product-line h3 em {
    color: #086ec4;
    font: 600 15px "微軟正黑體";
    display: block;
    margin-top: 5px;
}

.product-line .price-r {
    flex: 0 0 15%;
    font: 600 15px "微軟正黑體";
    color: #666;
    line-height: 1.2em;
    text-align: right;
}

.product-line .price-r strong {
    font: 600 25px "Anton", sans-serif;
    padding-left: 2px;
    color: #e60012;
}

.product-list p.link {
    display: block;
    padding: 5px 0px;
    font: 600 15px "微軟正黑體";
    text-align: right;
}

.product-list p.link a {
    display: inline-block;
    text-decoration: none;
    font-size: 15px;
    line-height: 1.5em;
    background-color: #2db1fc;
    color: #fff;
    border-radius: 5px;
    padding: 3px 5px;
    margin-top: 5px;
    margin-left: 5px;
    border: #2db1fc 1px solid;
}

.product-list p.link a:hover {
    color: #2db1fc;
    background-color: #fff
}



/*自由行列表*/
.pkg-bg {
    background: #eee9ff url("../img/bg03.png") top repeat;
    padding-bottom: 50px;
}

/*---行程---*/
.product {
    width: 90%;
    margin: 30px auto;
    display: block;
    overflow: hidden;
}

.product a {
    display: flex;
    padding: 10px;
    overflow: hidden;
    border-bottom: dashed 1px #696969;
    text-decoration: none;
    justify-content: space-between;
    align-items: center;
}

.product a:hover {
    background-color: #fff;
}

.name-l {
    flex: 0 0 80%;
    font: 600 18px "微軟正黑體";
    color: #666;
    line-height: 1.2em;
}

.name-l em {
    color: #70c707;
    font: 600 15px "微軟正黑體";
    display: block;
    margin-top: 5px;
}

.name-l span {
    display: inline-block;
}

.name-l02 {
    flex: 0 0 80%;
    font: 600 18px "微軟正黑體";
    color: #666;
    line-height: 1.2em;
}

.name-l02 em {
    color: #6f5cb9;
    font: 600 15px "微軟正黑體";
    display: block;
    margin-top: 5px;
}

.name-l02 span {
    display: inline-block;
}

.name-l03 {
    flex: 0 0 80%;
    font: 600 18px "微軟正黑體";
    color: #666;
    line-height: 1.2em;
}

.name-l03 em {
    color: #ff9000;
    font: 600 15px "微軟正黑體";
    display: block;
    margin-top: 5px;
}

.name-l03 span {
    display: inline-block;
}


.price-r {
    flex: 0 0 20%;
    text-align: right;
    font: 600 15px "微軟正黑體";
    line-height: 1.2em;
    color: #666;
}

.price-r strong {
    font: 600 25px "Anton", sans-serif;
    padding-left: 2px;
    color: #e60012;
}

.price-t {
    flex: 0 0 20%;
    text-align: right;
    font: 600 20px "微軟正黑體";
}

.product a .price-t strong {
    display: inline-block;
    padding: 5px 10px;
    background-color: #0068b7;
    border: 2px #0068b7 solid;
    color: #fff;
    border-radius: 25px;
}

.product a:hover .price-t strong {
    background-color: #fff;
    color: #0068b7;
}


/*票券列表*/
.ticket-bg {
    background: #fffce5 url("../img/bg05.png") top repeat;
    padding-bottom: 50px;
}

.ticket-list {
    width: 98%;
    margin: 0 auto;
    clear: both;
    overflow: hidden;
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
}

.ticket-list ul {}

.ticket-list li {
    display: block;
    border-bottom: 1px dashed #b6b6b6;
    overflow: hidden;
    padding: 10px 5px;
}

.ticket-list li .ticket-txt {
    clear: both;
    overflow: hidden;
}

.ticket-list li .ticket-txt .txt_l {
    font: 600 18px "微軟正黑體";
    line-height: 1.8em;
    color: #666;
}

.ticket-list li .ticket-txt .txt_l .area {
    display: inline-block;
    padding: 3px 5px;
    background-color: #f98115;
    color: #fff;
    margin-right: 5px;
    border-radius: 10px;
}

.ticket-list li .ticket-txt em {
    font-style: normal;
    display: block;
    color: #ff9000;
    font-size: 15px;
    line-height: 1.5em;
}

.ticket-list li .ticket-txt em span {
    color: #fd071e;
}

.ticket-price {
    width: auto;
    text-align: right;
    margin-top: 5px;
}

.ticket-price span {
    font-size: 13px;
    color: #666;
}

.ticket-price span strong {
    color: #fd071e;
    padding: 0 2px;
    font: 600 28px "微軟正黑體";
    font-family: 'Barlow', sans-serif;
}

.ticket-list li:hover {
    background-color: #fff;
}

.ticket-setbox {
    width: 100%;
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
    display: block;
    text-align: right;
    float: right;
    margin-top: 10px;
}

.ticket-setbox .set a {
    display: inline-block;
    text-decoration: none;
    font-size: 15px;
    line-height: 1.5em;
    color: #fff;
    background-color: #ff9000;
    color: #fff;
    border-radius: 5px;
    padding: 3px 5px;
    margin-top: 5px;
    margin-left: 5px;
    border: #ff9000 1px solid;
}

.ticket-setbox .set a:hover {
    color: #ff9000;
    background-color: #fff;
}




.ticket-more {
    text-align: center;
    font-size: 18px;
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
}

.ticket-more a {
    color: #ff6c00;
    border-radius: 0 50px 50px 0;
    padding: 10px;
    border: 1px #ff6c00 solid;
    text-align: center;
    text-decoration: none;
}

.tour-more {
    text-align: center;
    font-size: 18px;
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
}

.tour-more a {
    color: #086ec4;
    border-radius: 0 50px 50px 0;
    padding: 10px;
    border: 1px #086ec4 solid;
    text-align: center;
    text-decoration: none;
}

.pkg-more {
    text-align: center;
    font-size: 18px;
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
}

.pkg-more a {
    color: #6f5cb9;
    border-radius: 0 50px 50px 0;
    padding: 10px;
    border: 1px #6f5cb9 solid;
    text-align: center;
    text-decoration: none;
}



.ct-box2 {
    max-width: 1500px;
    margin: 30px auto 0 auto;
    text-align: center;
    clear: both;
    overflow: hidden;
}

.ct30 {
    width: 30%;
    display: inline-block;
    vertical-align: top;
    margin: 1% 1%;
}

.ct30 a {
    text-decoration: none;
    display: block;
}

.ct30 a:hover {
    text-decoration: none;
}

.tkt-box {
    width: 100%;
    margin: 0 auto;
    border-radius: 15px;
    background-color: #fff;
    border: 1px #a3a3a3 solid;
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
    clear: both;
    overflow: hidden;
}

.tkt-box .photo-box {
    width: 100%;
    max-width: 780px;
}

.tkt-box .photo-box img {
    margin-bottom: -2px;
    border-radius: 15px 15px 0 0;
}

.tkt-box .txt-box {
    width: 100%;
    min-height: 250px;
}

.tkt-box .txt-box p.title {
    display: block;
    padding: 10px 0;
    font-size: 18px;
    line-height: 1.5em;
    color: #086ec4;
    text-align: center;
    font-weight: bold;
    padding: 10px 15px;
    border-bottom: #ffdb13 2px solid;
}

.txt-box ul.note2 {
    width: 85%;
    margin: 0 auto;
    padding: 10px 0;
    min-height: 100px;
}

.txt-box ul.note2 li {
    list-style-image: url("../img/icon.png");
    font-size: 15px;
    line-height: 2em;
    color: #666;
    margin-left: 20px;
    text-align: left;
}


/*飯店*/
#hotel {}

.bg02 {
    background: url("../img/top_bg02.png") top no-repeat;
    height: 44px;
}

.hotel-bg {
    background: #f4ffd9 url("../img/bg02.png") top repeat;
}

.hotel-bg02 {
    background: url("../img/bg_icon02.png") top repeat;
    padding-bottom: 50px;
}

.title-box02 {
    max-width: 301px;
    margin: 0 auto;
    padding: 80px 0 0 0;
}

.title-box02 img {}

/*飯店列表*/
.ct-box {
    max-width: 960px;
    margin: 0 auto;
    padding: 20px 0;
    clear: both;
    overflow: hidden;
    text-align: center;
}

.ct33 {
    width: 33%;
    display: inline-block;
    vertical-align: top;
    margin-top: 15px;
    float: left;
}

.ct33 a {
    background: #fff;
    text-decoration: none;
    display: block;
    margin: 0 6px;
    border-radius: 10px 50px 10px 50px;
}

.ct33 a:hover {}

.ct33 a .main-hotel-box {
    min-height: 400px;
    position: relative;
}

.hotel-pic {
    position: relative;
    width: 100%;
    margin: 0 auto;
}

.hotel-pic img {
    border-radius: 10px 50px 0 0;
}

.hotel-name {
    color: #0e990e;
    font: 600 18px "微軟正黑體";
    line-height: 1.5em;
    padding: 5px;
    text-align: center;
    margin: 5px;
    padding: 5px;
    border-bottom: #ffdb13 2px solid;
}

.hotel-name span {
    font-family: 'Noto Sans TC', sans-serif;
    font-weight: 500;
}

.hotel-info-list {
    margin: 10px 20px;
    min-height: 60px;
    padding-bottom: 20px;
}

.hotel-info-list li {
    font: 15px "微軟正黑體";
    color: #666;
    line-height: 1.8em;
    text-align: left;
    list-style-image: url("../img/icon.png");
    margin-left: 15px;
    margin-top: 5px;
}

.hotel-info-list li span {
    color: #fd071e;
}

/*.hotel-info-list li::before {
    content: "◆";
    font-size:13px;
    padding-right: 6px;
}*/
.hotel-price {
    color: #666;
    font: 15px "微軟正黑體";
    position: absolute;
    bottom: 10px;
    left: 0;
    right: 0;
}

.hotel-price span {
    color: #fd071e;
    font: 600 28px "微軟正黑體";
    font-family: 'Barlow', sans-serif;
    padding: 0 2px;
}

.more {
    max-width: 410px;
    margin: 0 auto;
    clear: both;
    overflow: hidden;
}

.hotel-more {
    /*margin: 10px;*/
    text-align: center;
    font-size: 18px;
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
    /*float: left;*/
    margin: 0 auto;
}

.hotel-more a {
    color: #0e990e;
    border-radius: 0 50px 50px 0;
    padding: 10px;
    border: 1px #0e990e solid;
    text-align: center;
    text-decoration: none;
}

#music {}

.bg03 {
    background: url("../img/top_bg03.png") top no-repeat;
    height: 44px;
}

.music-bg {
    background: #000 url("../img/bg04.jpg") center bottom no-repeat;
    padding-bottom: 290px;
}

.title-box03 {
    max-width: 326px;
    margin: 0 auto;
    padding: 80px 0 0 0;
}

/*音樂會表*/
/*.ct30 {width:28%;display: inline-block; vertical-align: top;position: relative; margin-right: 15px;}*/

.music-box {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
    clear: both;
    overflow: hidden;
    padding: 0 20px 20px 20px;
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex-wrap: wrap;
}

.ct25 {
    width: 30%;
    display: inline-block;
    vertical-align: top;
    position: relative;
    margin: 10px 10px;
    font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
    border-left: 3px #fff solid;
}

.ct25 a:hover {}

.ct25 .main-music-box {
    min-height: 170px;
    position: relative;
}

.music-date {
    color: #fff;
    font: 15px "微軟正黑體";
    text-align: left;
    padding: 5px;
    line-height: 1.2em;
}

.music-date span {
    font-size: 25px;
    font-weight: bold;
    font-family: 'Barlow'
}

.music-date strong {
    font: 18px "微軟正黑體";
}

.music-date em {
    font-style: normal;
    border-radius: 60%;
    border: 1px #fff solid;
    margin-left: 5px;
    margin-right: 5px;
    padding: 3px 5px;
}

.music-title {
    font-size: 15px;
    line-height: 1.5em;
    color: #fff;
    font-weight: 600;
    text-align: left;
    padding: 5px;
    min-height: 65px;
}

.music-title span {
    display: block;
}

.music-label {
    background-color: #87f2ff;
    display: inline-block;
    color: #000;
    font-size: 15px;
    line-height: 1.5em;
    text-align: left;
    padding: 3px 5px;
    border-radius: 5px;
    float: left;
    margin-left: 5px;
}

.color1 {
    background-color: #f4f63a;
}

.color2 {
    background-color: #f8baff;
}

.color3 {
    background-color: #78e112;
}

.music-ps {
    font-size: 13px;
    line-height: 1.5em;
    color: #fff;
    text-align: center;
}


@media screen and (min-width: 1201px) and (max-width: 1600px) {
    .logo {
        max-width: inherit;
        width: 35%;
        left: 35%;
        right: 35%;
        top: 100px;
    }
}

@media screen and (min-width: 960px) and (max-width: 1200px) {
    .logo {
        max-width: inherit;
        width: 38%;
        left: 35%;
        right: 35%;
    }
}

@media screen and (max-width:959px) {
    .logo {
        left: 40%;
        right: 30%;
        top: 40px;
        width: 40%;
    }

    .bg-bottom {
        display: none;
    }

    .product-line h3 {
        flex: 0 0 70%;
    }

    .name-l,
    .name-l02,
    .name-l03 {
        flex: 0 0 70%;
    }

    .price-r,
    .price-t {
        flex: 0 0 30%;
    }

    .product-line .price-r {
        flex: 0 0 30%;
    }

}

@media screen and (min-width: 769px) and (max-width: 959px) {
    .logo {
        left: 30%;
        right: 30%;
        top: 40px;
        -index: 200;
        width: 40%;
    }

    .balloon07 {
        display: none;
    }
}

@media screen and (min-width: 769px) and (max-width: 820px) {
    .about-box .txt-box {
        width: 100%;
        float: none;
        padding: 0;
    }

    .about-box .photo-box {
        width: 100%;
        float: none;
    }

}

/*---平板-----*/
@media screen and (max-width:768px) {
    html {
        scroll-behavior: smooth;
    }

    .logo {
        left: 25%;
        right: 25%;
        top: 40px;
        width: 40%;
    }

    .slide ul li p.ps {
        top: 10px;
    }

    .balloon01,
    .balloon02,
    .balloon03,
    .balloon04,
    .balloon05,
    .balloon06,
    .balloon07 {
        display: none;
    }

    .top-box {
        padding: 50px 0 30px 0;
    }

    .title-about {
        padding: 0;
    }


    /*錨點*/
    .block-first {
        padding-top: 0;
        margin-top: 0;
    }

    .ct33 {
        width: 95%;
        float: inherit;
        margin: 10px auto;
    }

    #main-nav {
        display: none;
    }

    .about-box .txt-box {
        width: 100%;
        float: none;
        padding: 0;
    }

    .about-box .photo-box {
        width: 100%;
        float: none;
    }

    .tour-main {
        max-width: inherit;
        width: 90%;
        margin: 0 auto;
    }

    .tour-box {
        width: 100%;
    }

    .tour-box .photo-box {
        width: 100%;
        float: inherit;
    }

    .tour-box .photo-box img {
        margin-bottom: inherit;
        margin-right: -2px;
        border-radius: 15px 15px 0 0;
    }

    .tour-box .txt-box {
        width: 100%;
        padding-bottom: 10px;
        float: inherit;
    }

    .txt-box ul.note {}

    .txt-price {
        display: block;
        width: 100%;
    }

    .tour-list li:hover {
        background-color: inherit;
    }

    .pkg-price {
        display: block;
        width: 100%;
    }

    .ticket-list li:hover {
        background-color: inherit;
    }

    .ticket-price {
        display: block;
        width: 100%;
    }

    .htl-price {
        display: block;
        position: inherit;
        width: 100%;
    }

    .more {
        max-width: 190px;
    }

    .hotel-more {
        margin: 10px 0;
        font-size: 18px;
        font-family: "微軟正黑體", "黑體", Arial, Helvetica, sans-serif;
        float: inherit;
    }

    .ct30 {
        width: 90%;
        margin: 1% 0;
    }

    .tkt-box .txt-box {
        min-height: inherit;
    }

    .txt-box ul.note2 {
        min-height: inherit;
    }
}

@media screen and (min-width: 480px) and (max-width: 667px) {
    .more {
        max-width: 220px;
    }
}

@media only screen and (max-width:600px) {
    .product-line {
        display: inherit;
    }

    .product-line h3 {
        flex: initial;
        width: 100%;
        display: block;
    }

    .product a {
        display: inherit;
    }

    .name-l,
    .name-l02,
    .name-l03 {
        flex: initial;
        width: 100%;
        display: block;
    }

    .price-r,
    .price-t {
        flex: initial;
        width: 100%;
        display: block;
        margin-top: 5px;
    }

    .product-line .price-r {
        flex: initial;
        width: 100%;
        display: block;
        margin-top: 5px;
    }
}

/*---手機版-----*/
@media screen and (max-width:479px) {
    .logo {
        left: 30%;
        right: 25%;
        top: 80px;
        width: 45%;
    }

    .txt-price {
        text-align: center;
    }

    .pkg-price {
        text-align: center;
    }

    .ticket-price {
        text-align: center;
    }

    .tour-setbox .set a {
        width: 80%;
        display: block;
        margin: 10px auto 0 auto;
        text-align: center;
    }

    .ticket-setbox .set a {
        width: 80%;
        display: block;
        margin: 10px auto 0 auto;
        text-align: center;
    }

    .htl-price {
        text-align: center;
    }

    .ct25 {
        width: 43%;
    }

    .more {}
}

/*---手機版-----*/
@media screen and (max-width:380px) {
    .ct25 {
        width: 40%;
    }
}