@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;
}*/

/*小間距
.little .row {
    margin-right: -5px!important;
    margin-left: -5px!important;
}
.little .col-1,.little .col-2,.little .col-3,.little .col-4,.little .col-5,.little .col-6,.little .col-7,.little .col-8,.little .col-9,.little .col-10,.little .col-11,.little .col-12,.little .col,.little .col-auto,.little .col-sm-1,.little .col-sm-2,.little .col-sm-3,.little .col-sm-4,.little .col-sm-5,.little .col-sm-6,.little .col-sm-7,.little .col-sm-8,.little .col-sm-9,.little .col-sm-10,.little .col-sm-11,.little .col-sm-12,.little .col-sm{
    padding-right: 5px!important;
    padding-left: 5px!important;
}
.tour .new_row {
    margin-right: -5px !important;
    margin-left: -5px !important;
}
.tour .little_p {
    padding-right: 5px !important;
    padding-left: 5px !important;
}*/
/*tour*/
.tour{
	width: 100%;
	max-width:1150px;
	padding-left: 0%;
	padding-right: 0%;
	margin: auto;
	box-sizing: border-box;		
	display: table!important;
}
.tour img{
	margin: 0 auto;
	max-width: 100%;
}
.tour h1{
    font-size: 28px!important;
    line-height: 1.5!important;
    margin-top: 2%!important;
    margin-bottom: 0%!important;
    color: #232323;
    font-weight: 100;
    display: block;
}
.tour h1 span{
    font-weight: 600;
}

.tour h2{
    font-size: 18px!important;
    line-height: 1.5!important;
    margin-bottom: 2%!important;
    margin-top: 0px!important;
}
.tour h3{
    font-size: 18px;
    color: #343434;
    font-family: 'Noto Serif TC', serif!important;
    line-height: 1.5 !important;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
    display: inline-block;
}

.tour h4{
    color: #e5d06e;
    font-size: 50px!important;
    font-family: 'Noto Serif TC', serif!important;
    display: inline-block;
    margin-left: -2%;
    margin-top: -2%;
    margin-right: 1%;    
    margin-bottom: 0 !important;
}
.tour h5{
	font-size: 30px;
    line-height: 1.5!important;
        font-family: 'Noto Serif TC', serif!important;
    margin-top: 3%!important;
	margin-bottom: 0px!important;
}
.tour h6 {
    font-size: 18px !important;
    line-height: 1.5 !important;
    font-family: 'Noto Serif TC', serif!important;
    color: #343434;
    margin-top: 0px !important;
    margin-bottom: 0% !important;
}

.tour h7{
    font-size: 18px;
    color: #343434;
    font-family: 'Noto Serif TC', serif!important;
    line-height: 1.5 !important;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
    display: inline-block;   
}
.tour h7:before{
    content: "“";
    font-size: 50px;
    color: #e5d06e;
    margin-left: -3%;
}
.tour p{
	font-size: 16px;
    line-height: 1.5!important;
	color: #343434;
	text-align: justify;
    margin-bottom: 1px;
}
.tour p span {
    font-weight: 600;
}
.tour .text18 {
    font-size: 18px;
    line-height: 1.5;
    font-weight: 600;
}
.tour .text12{
    font-size: 12px;
    line-height: 1.5;
}
.tour .introBox{
	width: 100%;
	float: left;
	padding: 4%;
}
.tour .introBox2 {
    width: 100%;
    float: left;
    padding: 4% 3%;
	color: #343434;
	font-size: 16px;
    line-height: 1.5;
	text-align: justify;
}
.tour .photo{
    width: 100%;
    text-align: center;
}
.tour .Serif{
	font-family: 'Noto Serif TC', serif!important;
    line-height: 1.5;
}
.tour .text14{
    font-size: 14px;
}
.tour .carousel_Box{
	float: left;
}
.tour .up{
    margin-top: -12%;
}
.tour .line{
    width: 6%;
    margin:0 47%; 
    border-bottom: 5px solid #efdf59;
    margin-bottom: 2%;
}
.tour .line2{
    width: 6%;
    margin-right:94%; 
    border-bottom: 5px solid #efdf59;
    margin-bottom: 2%;
}
/*介紹*/

.tour .hotelBG{
    width: 100%;
    float: left;
    padding: 6%;
    background: url("https://www.pktravel.com.tw/material-alias/theme/vietnam/sapa/tours/HAN052508VNJ/images/SilkPathBG.jpg");
}
.tour .flag{
    margin: 0 0.6%;
    padding-bottom: 0.5%;
}
.tour .title{
    width: 100%;
    height: 1px;
    background-color: #9b9b9b;
    text-align: center;
    margin: 30px auto; 
    float: left;
}
.tour .title span {
    font-size: 28px;
    padding: 0 20px;
    background-color: #fff;
    line-height: 0px;
}
.tour .title01{
    font-family: 'SaolText,Georgia,Times,Songti TC,Noto Serif TC',Serif!important;
    font-size: 34px;
    line-height: 1;
    color: #343434;
    text-align: center;
}
.tour .tag1{
    font-size: 21px;
    color: #343434;
    padding: 4px 15px;
    float: left;
    font-family: 'Noto Serif TC', serif!important;
    margin-bottom: 2%;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 20px;
    margin-top: 1.5%;
}
.tour .tag2{
    font-size: 24px;
    color: #323232;
    padding: 1% 2%;
    float: left;
    font-family: 'Noto Serif TC', serif!important;
    margin-bottom: 5%;
    text-align: center;
    background-color: #bbae9e;
}
.tour .titlebox2{
	padding-top: 4%;
    padding-bottom: 1%;
}
.tour .starBox{
	width: 100%;
	float: left;
	text-align: center;
    color: #ffc107;
	margin-bottom: 1%;
}
.tour .starBox2{
	width: 100%;
	float: left;
	text-align: center;
    color: #eb9849;
	margin-bottom: 1%;
}
.tour .starBox2 span{
	font-size: 38px!important;
}
.tour .bottom_line{
	width: 100%;
	float: left;
	border-bottom: 1px solid #6c757d;
	margin-bottom: 2%;
}
.tour .bottom_line2{
	width: 100%;
	float: left;
	border-bottom: 1px dotted #b1b4b7;
	margin-bottom: 4%;
	margin-top: 3%;
}
.tour .foodtitle{
    width: 100%;
    float: left;
    font-size: 16px;
    color: #293243;
    line-height: 1.5;
    font-weight: 400;
    margin-bottom: 0.5%;
}
.tour .foodtitle{
    font-size: 16px;
    color: #293243;
    line-height: 1.5;
    font-weight: 400;
    margin-bottom: 1%;
}
.tour .foodtitle span {
    font-weight: 800;
}

.tour .foodtitle li{
    margin-bottom: 1%;
}
.tour .foodText{
    font-size: 16px;
    color: #293243;
    line-height: 1.5;
    font-weight: 400;
    margin-bottom: 0.5%;
    text-align: justify;
}
.tour .foodText span {
    font-weight: 800;
}
.tour .food-link {
    margin-left: 1%;
    font-size: 14px;
    padding: 3px 8px;
    margin-top: -3px;
}
.tour .foodintro {
    width: 100%;
    float: left;
    font-size: 16px;
    color: #5c5a5a;
    line-height: 1.5;
    font-weight: 400;
    text-align: justify;
    padding-left: 1.3%;
    padding-bottom: 1%;
}
.tour .note{
    padding: 2%;
    background-color: #d5d4d4;
    color: #cc192a;
    font-size: 15px;
    line-height: 1.5;
    text-align: justify;
    margin-top: 1%;
    float: left;
    margin-bottom: 1%;
    width: 100%;
}
/***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*/
.e99c15{
    color: #e99c15!important;
}
.c6b36f{
    color: #c6b36f!important;
}
.color_8a572c{
    color: #8a572c!important;
}
.color_006f66 {
    color: #006f66 !important;
}
.StarluxColor{
	color: #83744d;
}
.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;
}
.GBceb8a3{
    background-color: #ceb8a3;
}
.BG948572{
    background-color: #948572;
}
.BGece9e2{
    background-color: #ece9e2;
}
.BGe1d4c3{
    background-color: #e1d4c3;
}
.BG8a572c{
    background-color: #8a572c;
}
.BGmilktea{
    background-color: #bbae9e;
}
.BGorange{
	background-color: #f60;
}
.BGdeepgray{
    background-color: #323232;
}
.BGgray{
	background-color: #7c848b;
}
.BGblue{
	background-color: #80ceff;
}
.BGbrown{
    background-color: #4e4242;
}
.BGbrown2{
    background-color: #703f3a;
}
.BGblue_3d90e9{
	background-color: #3d90e9!important;
}
.BGyellow{
	background-color: #fff343434;
}
.BGgreen{
	background-color: #156044;
}
.BGgreen_656565{
	background-color: #656565!important;
}
.BGgreen_97a58c{
	background-color: #97a58c!important;
}
/***vieeo****/
.hotel_video{
	padding-left: 4.4%;
    padding-right: 4.4%;
    padding-top: 1%;
}


@media only screen and (max-width: 640px){
.tour{
	padding-left: 15px!important;
	padding-right: 15px!important;
}
.tour h1 {
    font-size: 24px !important;
}
.tour h7:before {
    display: none;
}   
.tour .title span {
    font-size: 22px;
    padding: 0px 9px;}
    
.tour .flag{
    margin: 0 1%;
}
 .tour .flag img{
     width: 10%;
     margin-top: -2%;
 }
.tour .tag1 {
    font-size: 16px;
    margin-bottom: 5%;
    margin-top: 2%;
}
.tour .tag2 {
    font-size: 21px;
    float: unset;
}

.tour .introBox {
    padding: 7%;
}
.tour .introBox2 {
    padding: 6% 2%;
}
.tour .title01 {
    font-size: 21px;
}
.tour .bottom_line {
    padding-bottom: 7%;
    margin-bottom: 5%;
}
.tour .foodtitle {
    margin-bottom: 2%;
}
.tour .food-link {
    font-size: 12px;
    padding: 2px 5px;
}
.tour .foodintro {
    padding-left: 0;
}

.tour .titlebox2 {
    padding-top: 10%;
}
.tour .up{
    margin-top: 0%;
}
}