@charset "utf-8";
/* CSS Document */
/*google font icon*/
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200');
@font-face {
  font-family: 'Material Symbols Outlined';
  font-style: normal;
  src: url(https://example.com/material-symbols.woff) format('woff');
}
.tour .material-symbols-outlined {
  font-family: 'Material Symbols Outlined'!important;
  font-weight: normal;
  font-style: normal;
  font-size: 26px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
}
.tour .material-icons {
  font-size: 18px!important; 
  margin-right: 2px;
	padding-top: 5px;
}

.tour .material-symbols-outlined {
  font-variation-settings:
  'FILL' 1,
  'wght' 400,
  'GRAD' 0,
  'opsz' 40
}
/*google font icon*/
.tour ul{
    list-style-type: decimal!important;
}
.tour li{
		
        margin-bottom: 0.6%;
}
.tour ol {
    margin: 0;
    padding-left: 3%;
    font-size: 16px;
    line-height: 1.5;
}
/*bootstrap
.tour .row {
    margin-right: -5px!important;
    margin-left: -5px!important;
}
.tour .col-1,.tour .col-2,.tour .col-3,.tour .col-4,.tour .col-5,.tour .col-6,.tour .col-7,.tour .col-8,.tour .col-9,.tour .col-10,.tour .col-11,.tour .col-12,.tour .col,.tour .col-auto,.tour .col-sm-1,.tour .col-sm-2,.tour .col-sm-3,.tour .col-sm-4,.tour .col-sm-5,.tour .col-sm-6,.tour .col-sm-7,.tour .col-sm-8,.tour .col-sm-9,.tour .col-sm-10,.tour .col-sm-11,.tour .col-sm-12,.tour .col-sm{
    padding-right: 5px!important;
    padding-left: 5px!important;
}*/


/*tour*/
.tour{
	width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
}
.tour img{
	margin: 0 auto;
	max-width: 100%;
}



/* ==========================================================
   WIDTH
========================================================== */

.tour .travel-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 30px;
    padding-right: 30px;
    box-sizing: border-box;
}


/* ==========================================================
   SECTION
========================================================== */

.tour .travel-section {
    padding: 4em;
    margin-top: 0!important;
}

.tour .intro-section {
    background: #F8F5EF;
}

.tour .warm-section {
    background: #F3F1ED;
}

.tour .food-section {
    background:#F5EEE3;
}

.tour .hotel-section {
    background: #EEF1F2;
}

.tour .section-dark {
    background: #17263A;
}


/* ==========================================================
   TYPOGRAPHY
========================================================== */

/* 英文 + 編號 */
.tour .section-kicker {
    display: flex;
    align-items: center;
    gap: 10px;

    margin: 0 0 18px;

    font-size: 16px;
    line-height: 1.4;
    font-weight: 600;
    letter-spacing: .08em;

    color: #A47C3C;
}

.tour .intro-section .section-kicker {
    justify-content: center;
}
/* 圓形編號 */
.tour .kicker-number {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 24px;
    height: 24px;
    flex: 0 0 24px;

    border-radius: 50%;
    background: #A47C3C;
    color: #FFFFFF;

    font-size: 12px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0;
}




/* 大標 */
.tour .section-title {
    margin: 0 0 30px!important;

    color: #243447!important;

    font-size: 32px!important;
    line-height: 1.35!important;
    font-weight: 700!important;

    letter-spacing: .02em!important;
}


/* 副標 */
.tour .section-subtitle {
    margin: 0 0 14px;

    color: #A47C3C;

    font-size: 20px;
    line-height: 1.6;
    font-weight: 600;

    letter-spacing: .02em;
}


/* 副標紅色標籤 */
.tour .subtitle-label {
    display: inline-block;

    padding: 4px 9px;

    margin-right: 8px;

    background: #B53A26;

    color: #fff;

    font-size: 15px;
    font-weight: 600;
}


/* 正文 */
.tour .section-text,
.tour .intro-text {
    color: #555555;

    font-size: 17px;
    line-height: 1.9;

    letter-spacing: .015em;
}


/* 正文段落 */
.tour .section-text p,
.tour .intro-text p {
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 16px;
    line-height: 1.5;
    text-align: justify;
}


/* 最後金句 */
.tour .section-highlight {
    margin-top: 22px;

    color: #A47C3C;

    font-size: 18px;
    line-height: 1.7;
    font-weight: 600;
}


/* 深底 */
.tour .section-dark .section-title {
    color: #F7F3EA;
}

.tour .section-dark .section-kicker,
.tour .section-dark .section-subtitle,
.tour .section-dark .section-highlight {
    color: #D3AD68;
}

.tour .section-dark .kicker-number {
    background: #D3AD68;
    color: #17263A;
}

.tour .section-dark .section-text {
    color: #D8DCE1;
}


/* ==========================================================
   HERO
========================================================== */

.tour .hero-banner {
    width: 100%;
    overflow: hidden;
}

.tour .hero-banner img {
    width: 100%;
    height: auto;
    display: block;
}


/* ==========================================================
   INTRO
========================================================== */

.tour .intro-section .section-title {
    margin-bottom: 18px;
}

.tour .intro-text {
    max-width: 760px;
}

.tour .intro-gallery {
    max-width: 720px;
    margin-top: 42px;
    margin-left: auto;
    margin-right: auto;
}


/* ==========================================================
   IMAGE
========================================================== */

.tour .image-box {
    position: relative;
    overflow: hidden;
}

.tour .image-box img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition: transform .5s ease;
}

.tour .image-box:hover img {
    transform: scale(1.025);
}


/* Intro square */
.tour .image-square {
    aspect-ratio: 1 / 1;
}


/* 景點大圖 */
.tour .scenic-main {
    height: 480px;
}


/* 婺女洲大圖 */
.tour .wide-feature {
    height: 450px;
}


/* 婺女洲小圖 */
.tour .small-feature {
    height: 220px;
}


/* 三景點 */
.tour .spot-image {
    height: 300px;
}


/* 美食 */
.tour .food-image {
    height: 280px;
}


/* ==========================================================
   SECTION HEADING
========================================================== */

.tour .section-heading {
    max-width: 820px;
}

.tour .mb-grid {
    margin-bottom: 42px;
}

.tour .heading-description {
    margin-top: 9px;
    margin-bottom: 0;
}


/* ==========================================================
   SPOT CARDS
========================================================== */

.tour .spot-card {
    height: 100%;
}

.tour .spot-content {
    padding-top: 20px;
}

.tour .spot-number {
    margin-bottom: 8px;

    color: #A47C3C;

    font-size: 14px;
    font-weight: 600;
}

.tour .spot-title {
    margin: 0 0 12px;

    color: #243447;

    font-size: 20px;
    line-height: 1.45;
    font-weight: 700;
}

.tour .spot-text {
    margin: 0;

    color: #666666;

    font-size: 16px;
    line-height: 1.85;
    text-align: justify
}


/* ==========================================================
   FOOD
========================================================== */

.tour .food-card {
    height: 100%;
}

.tour .food-card .card-title {
    margin-top: 18px;
    margin-bottom: 5px;

    color: #243447;

    font-size: 22px;
    line-height: 1.4;
    font-weight: 700;
}

.tour .food-card .card-subtitle {
    margin-bottom: 10px;

    color: #A47C3C;

    font-size: 15px;
    font-weight: 600;
}

.tour .food-card .card-text {
    margin: 0;

    color: #666666;

    font-size: 15px;
    line-height: 1.8;
}


/* ==========================================================
   HOTEL
========================================================== */

.tour .hotel-feature,
.tour .hotel-card {
    background: rgba(255,255,255,.55);
}

.tour .hotel-large-image {
    height: 430px;
}

.tour .hotel-image {
    height: 300px;
}

.tour .hotel-info {
    padding: 20px 22px 24px;
}

.tour .hotel-city {
    margin-bottom: 5px;

    color: #A47C3C;

    font-size: 14px;
    font-weight: 600;

    letter-spacing: .08em;
}

.tour .hotel-title {
    margin: 0 0 10px;

    color: #243447;

    font-size: 21px;
    line-height: 1.45;
    font-weight: 700;
}

.tour .hotel-text {
    margin: 0;

    color: #666666;

    font-size: 15px;
    line-height: 1.8;
}


/* 小飯店卡 */
.tour .hotel-small-card {
    height: 100%;

    background: rgba(255,255,255,.6);
}

.tour .hotel-small-card img {
    width: 100%;
    height: 170px;

    object-fit: cover;
    display: block;
}

.tour .hotel-small-body {
    padding: 15px 16px 18px;
}

.tour .hotel-small-body span {
    display: block;

    margin-bottom: 5px;

    color: #A47C3C;

    font-size: 13px;
    font-weight: 600;
}

.tour .hotel-small-body strong {
    display: block;

    color: #243447;

    font-size: 16px;
    line-height: 1.5;
}

/*交通安排*/
/* 整區 */
.tour .transport-section {
    background: #FFFFFF;
}


/* ===== 標題區 ===== */

.tour .transport-heading {
    max-width: 850px;
    margin: 0 auto 48px;
}

.tour .transport-heading .section-kicker {
    justify-content: center;
    margin-bottom: 16px;
}

.tour .transport-heading .section-title {
    margin-bottom: 12px;
    text-align: center;
}

.tour .transport-heading .section-subtitle {
    margin-bottom: 0;
    text-align: center;
}


/* ===== 圖文區 ===== */

.tour .transport-content-row {
    margin-left: -12px;
    margin-right: -12px;
}

.tour .transport-content-row > div {
    padding-left: 12px;
    padding-right: 12px;
}


/* 圖片 */
.tour .transport-image {
    width: 100%;
    height: 245px;
    overflow: hidden;
}

.tour .transport-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}


/* 右側文字 */
.tour .transport-copy {
    padding-left: 10px;
}

.tour .transport-label {
    display: inline-block;

    margin-bottom: 10px;
    padding: 4px 9px;

    background: #F5EEE3;
    color: #A47C3C;

    font-size: 14px;
    line-height: 1.5;
    font-weight: 600;
}

.tour .transport-title {
    margin: 0 0 14px;

    color: #243447;

    font-size: 23px;
    line-height: 1.45;
    font-weight: 600;
}

.tour .transport-copy p {
    margin: 0 0 14px;

    color: #555555;

    font-size: 16px;
    line-height: 1.85;
}


/* 備註 */
.tour .transport-note {
    margin-top: 22px;
    padding: 13px 20px;

    background: #F8F5EF;

    color: #777777;

    font-size: 14px;
    line-height: 1.6;
}
/*貼心好禮*/
.tour .service-section {
    background: #F8F5EF;
}

.tour .service-block {
    height: 100%;
    padding: 34px 36px;

    background: #FFFFFF;
}

.tour .service-label {
    margin-bottom: 12px;

    color: #A47C3C;

    font-size: 15px;
    font-weight: 600;

    letter-spacing: .08em;
}

.tour .service-title {
    margin: 0 0 24px;

    color: #243447;

    font-size: 26px;
    line-height: 1.5;
    font-weight: 700;
}

.tour .service-list {
    margin-top: 10px;
}

.tour .service-item {
    display: flex;
    align-items: flex-start;

    margin-bottom: 24px;
}

.tour .service-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;
    flex: 0 0 38px;

    margin-right: 16px;

    border-radius: 50%;

    background: #A47C3C;
    color: #FFFFFF;

    font-size: 12px;
    font-weight: 700;
}

.tour .service-item h4 {
    margin: 0 0 5px;

    color: #243447;

    font-size: 18px;
    line-height: 1.5;
    font-weight: 700;
}

.tour .service-item p {
    margin: 0;

    color: #666666;

    font-size: 15px;
    line-height: 1.8;
}

.tour .service-text {
    margin-bottom: 14px;

    color: #555555;

    font-size: 16px;
    line-height: 1.9;
}

.tour .shopping-highlight {
    margin-top: 24px;
    padding-top: 20px;

    border-top: 1px solid #D8D1C5;

    color: #A47C3C;

    font-size: 17px;
    line-height: 1.7;
    font-weight: 600;
}
/* ==========================================================
   RESPONSIVE
========================================================== */

@media (max-width: 991.98px) {

    .tour .travel-section {
        padding: 70px 0;
    }

    .tour .section-kicker {
        font-size: 15px;
        margin-bottom: 14px;
    }

    .tour .section-title {
        font-size: 32px;
        margin-bottom: 24px;
    }

    .tour .section-subtitle {
        font-size: 18px;
    }

    .tour .section-text,
    .tour .intro-text {
        font-size: 16px;
    }

    .tour .scenic-main,
    .tour .wide-feature {
        height: 400px;
    }

    .tour .content-block {
        padding-top: 10px;
    }
/*交通*/
    .tour .transport-heading {
        margin-bottom: 36px;
    }

    .tour .transport-copy {
        padding-left: 0;
        padding-top: 8px;
    }
}


@media (max-width: 767.98px) {

    .tour .travel-container {
        padding:2em;
    }

    .tour .travel-section {
        padding: 0.2em 0;
    }

    .tour .section-kicker {
        font-size: 13px;
        margin-bottom: 14px;
    }

    .tour .kicker-number {
        width: 21px;
        height: 21px;
        font-size: 10px;
    }

    .tour .section-title {
        font-size: 26px;
        line-height: 1.4;

        margin-bottom: 22px;
    }

    .tour .section-subtitle {
        font-size: 17px;
        line-height: 1.6;

        margin-bottom: 12px;
    }

    .tour .section-text,
    .tour .intro-text {
        font-size: 15px;
        line-height: 1.85;
    }

    .tour .section-highlight {
        margin-top: 18px;

        font-size: 16px;
    }

    .tour .intro-gallery {
        margin-top: 32px;
    }

    .tour .scenic-main {
        height: 360px;
    }

    .tour .wide-feature {
        height: 320px;
    }

    .tour .small-feature {
        height: 180px;
    }

    .tour .spot-image {
        height: 280px;
    }

    .tour .food-image {
        height: 250px;
    }

    .tour .hotel-large-image,
    .tour .hotel-image {
        height: 300px;
    }

    .tour .mb-grid {
        margin-bottom: 32px;
    }
/*交通安排*/
    
.tour .transport-image {
        height: 260px;
    }

    .tour .transport-title {
        font-size: 21px;
    }

    .tour .transport-copy p {
        font-size: 15px;
    }


}


@media (max-width: 575.98px) {

    .tour .travel-container {
        padding:2em;
    }

    .tour .intro-section {
        text-align: left !important;
    }

    .tour .intro-gallery > div {
        padding-left: 4px;
        padding-right: 4px;
    }

    .tour .scenic-main {
        height: 300px;
    }

    .tour .wide-feature {
        height: 260px;
    }

    .tour .small-feature {
        height: 145px;
    }

    .tour .spot-image {
        height: 250px;
    }

    .tour .food-image {
        height: 230px;
    }

    .tour .hotel-small-card img {
        height: 130px;
    }

}
/***vieeo****/
.tour .video-container{
    position:relative;
    padding-bottom:56.25%;
    padding-top:30px;height:0;overflow:hidden;
    
    margin-top: 2%;
}
.tour .video-container iframe,
.tour .video-container object,
.tour .video-container embed{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
/*color*/

.white{
	color:#fff!important;
}
.black{
	color:#343434!important;
}
.pink{
	color:#E00E56!important;
}
.yellow{
	color: #fff000!important;
}
.red{
	color:red!important;
}
.gray{
	color:#666!important;
}
.lightgray{
    color:#5c5a5a!important;
}
.blue{
	color: #015ebc!important;
}
.deepBlue{
	color:#152242!important;
}
.blue_green {
    color: #3593a5!important;
}
.brown{
	color: #703f3a!important;
}
.deepBlue_213651{
	color:#213651!important;
}
.green_97a58c{
	color:#97a58c!important;
}
.green_656565{
	color:#656565!important;
}
.color_965556{
	color:#965556!important;
}
.orange{
	color:#F30!important;
}
.BGmilktea{
    background-color: #bbae9e;
}
.BGorange{
	background-color: #f60;
}
.BGdeepgray{
    background-color: #323232;
}
.BGgray{
	background-color: #7c848b;
}
.BGblue{
	background-color: #80ceff;
}
.BGbrown{
    background-color: #4e4242;
}

/***vieeo****/
.hotel_video{
	padding-left: 4.4%;
    padding-right: 4.4%;
    padding-top: 1%;
}

