You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1428 lines
49 KiB
CSS

4 years ago
@charset "utf-8";
/* public style */
body {
3 years ago
margin: 0;
4 years ago
font-family: Calibri;
4 years ago
color: #000;
background: #fff;
3 years ago
font-size: 19px;
4 years ago
}
4 years ago
a, a:hover {
4 years ago
color: #000;
3 years ago
text-decoration: underline;
cursor: pointer;
4 years ago
}
h1 {
3 years ago
font-size: 40px;
line-height: 40px;
4 years ago
font-family: 'Goudy Old Style';
4 years ago
}
h2 {
3 years ago
font-size: 30px;
3 years ago
margin-top: 90px;
3 years ago
line-height: 32px;
4 years ago
font-family: 'Goudy Old Style';
3 years ago
clear: both;
4 years ago
}
h3 {
3 years ago
font-size: 26px;
4 years ago
margin-top: 40px;
3 years ago
line-height: 28px;
4 years ago
font-family: 'Goudy Old Style';
4 years ago
}
p {
4 years ago
line-height: 24px;
4 years ago
margin-top: 0;
3 years ago
margin-bottom: 25px;}
3 years ago
.img-responsive, video, .table-responsive {
4 years ago
display: block;
max-width: 100%;
height: auto;
overflow-x: auto;
}
4 years ago
.adsbygoogle { margin-bottom: 50px;}
3 years ago
.updated_news { top: 65px;
display: block;
width: 100%;
background: #871010;
position: relative;
padding: 7px 0;
color: #fff;
font-size: 17px;
3 years ago
text-align: center;}
3 years ago
.updated_news a {color: #fff;}
3 years ago
.img-responsive {max-width: 100%;}
4 years ago
.headerbar {
z-index: 999;
3 years ago
background: #fff;
position: fixed;
width: 100%;
4 years ago
box-shadow: 1px 1px 6px 2px #e5e5e5;
}
.siteSearch {
position: relative;
}
.siteSearch .strkeys {
width: 87%;
height: 40px;
padding: 0 15px;
font-size: 16px;
}
.siteSearch .submits {
padding-top: 11px;
padding-right: 10px;
width: 20px;
position: absolute;
right: 20px;
}
.bottommedia {
width: 55%;
float: left;
padding-left: 15px;
}
.followtitle {
text-transform: uppercase;
4 years ago
margin-bottom: 20px;
display: block;
4 years ago
}
/* -------- */
3 years ago
.infocategory {position: absolute;
font-size: 18px;
text-shadow: 1px 1px 1px #000;
bottom: 150px;}
4 years ago
.infocategory a { color: #fff; margin-right: 25px;}
4 years ago
.infocategory a:after {content: "";
position: absolute;
width: 5px;
height: 5px;
transition: transform 0.5s;
-webkit-transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
border-top: 2px solid;
border-right: 2px solid;
transform: rotate(
45deg
);
margin-top: 9px;
margin-left: 3px;}
4 years ago
.infoimage,.infovideo {
4 years ago
margin-bottom: 30px;
position: relative;
}
4 years ago
.infoimage img {--tw-shadow: 0px 4px 15px 2px rgba(70,70,70,0.3);
box-shadow: 0 0 transparent,0 0 transparent,var(--tw-shadow);
border-radius: 6px; margin: 0 auto;}
.right_image {position: relative;
float: right;
width: 350px;
margin: 10px 0 30px 30px;}
4 years ago
.right_image img { width: 100%;}
4 years ago
.infoimagetitle {font-size: 18px;
margin-top: 10px;
3 years ago
color: #999;}
.photoTxt {
4 years ago
position: absolute;
4 years ago
bottom: 0;
3 years ago
padding: 5px 10px;
4 years ago
color: #fff;
4 years ago
font-size: 18px;
3 years ago
background: rgb(57 57 57 / 80%);
line-height: 19px;
4 years ago
}
4 years ago
table.InfoTable {
4 years ago
border-left: 1px solid #d1d1d1;
4 years ago
border-spacing: 0;
3 years ago
margin: 20px 0 0 0;
4 years ago
width: 100%;
}
4 years ago
table.InfoTable th {
3 years ago
background: #e5e5e5;
4 years ago
padding: 15px 10px;
border-right: 1px solid #d1d1d1;
3 years ago
font-family: 'Goudy Old Style';
4 years ago
}
4 years ago
table.InfoTable td {
3 years ago
padding: 10px 15px;
4 years ago
border-right: 1px solid #d1d1d1;
border-bottom: 1px solid #d1d1d1;
4 years ago
}
4 years ago
table.InfoTable tr:nth-child(odd) {
4 years ago
background: #f6f6f6;
4 years ago
}
4 years ago
ul.InfoList li {
3 years ago
list-style: square;
4 years ago
margin-bottom: 10px;
4 years ago
}
4 years ago
ul.InfoList {
3 years ago
padding: 0 15px 0 20px;
4 years ago
}
3 years ago
ol {padding: 0 15px; margin: 10px 0; display: table;}
ol li { margin-bottom: 5px; padding-left: 10px;}
4 years ago
.right_brand_info {width: 330px;
4 years ago
float: right;
background: #f6f6f6;
3 years ago
margin-bottom: 20px;
4 years ago
border-top: 7px solid #ad1818;}
3 years ago
.right_brand_info h2 { padding: 15px 0;
4 years ago
text-align: center;
3 years ago
font-size: 25px;
4 years ago
margin-top: 15px;
3 years ago
line-height: 27px;}
4 years ago
.right_brand_info ul {padding: 0 20px;
margin-bottom: 50px;}
3 years ago
.right_brand_info ul li{
4 years ago
list-style: none;
margin-bottom: 20px;
4 years ago
font-size: 18px;}
3 years ago
.right_brand_info ul li strong {
display: block; font-size: 20px;
margin-bottom: 5px;
3 years ago
}
3 years ago
.info_reco_tours { font-size: 20px;
4 years ago
font-family: 'Goudy Old Style';
4 years ago
border-left: 8px solid #ad1818;
font-weight: 600;
background: #f7f7f7;
3 years ago
padding: 7px 20px;}
4 years ago
.info_reco_tours em {color: #ad1818;
margin-right: 10px;
text-transform: uppercase;
3 years ago
font-size: 22px;}
3 years ago
.skipAhead ul {
width: 750px;
3 years ago
padding-left: 20px;
4 years ago
}
4 years ago
.skipAhead li {
float: left;
3 years ago
list-style: square;
width: 46%;
3 years ago
margin-bottom: 10px;
3 years ago
padding: 0 15px;
4 years ago
}
4 years ago
.headerText {
background-color: #FFF;
text-align: center;
4 years ago
font-weight: 600;
3 years ago
font-size: 18px;
4 years ago
font-family: 'Goudy Old Style', sans-serif;
3 years ago
width: 220px;
left: calc(50% - 115px);
4 years ago
position: absolute;
3 years ago
top: -10px;
text-transform: uppercase;
4 years ago
}
.skipBox {
3 years ago
border-top: 1px solid #d2d2d2;
4 years ago
background-size: 100%;
position: relative;
border-bottom: 1px solid #d2d2d2;
4 years ago
margin: 0 0 60px 0;
4 years ago
padding: 20px 0;
4 years ago
}
4 years ago
.nextcontext { clear: both;
padding: 30px 0;
4 years ago
width: 1140px;}
3 years ago
h2.nexttitle { text-align: center;}
4 years ago
p.nextinfo {text-align: center;}
.nextbg { position: absolute;
height: 100%;
3 years ago
width: 100%;
background: rgba(0, 0, 0, 0.40) none repeat scroll 0 0;
4 years ago
top: 0;}
3 years ago
.nextbg a { text-decoration: none;}
3 years ago
.tournextname {
4 years ago
text-shadow: 1px 1px 1px #000;
4 years ago
font-size: 23px;
4 years ago
text-align: center;
margin-top: 80px;
4 years ago
margin-bottom: 100px;
4 years ago
padding: 0 15px;
4 years ago
height: 90px;
4 years ago
line-height: 25px;
4 years ago
font-family: 'Goudy Old Style';
font-weight: 600;}
4 years ago
.tournextname a {color: #fff;}
.tournextbutton { text-align: center;
background: #fff;
margin: 0 auto;
width: 140px;
font-weight: 400; border-radius: 2px;
3 years ago
text-transform: uppercase;}
4 years ago
.tournextbutton a { display: block;
3 years ago
padding: 6px 20px; }
4 years ago
.tournextbutton a:hover {color: #ad1818; font-weight: 600;}
3 years ago
.nextarticle { float: left; position: relative; }
4 years ago
.infotailor {
margin: 100px 0 0 0;
4 years ago
background: #ececec;
height: 470px;
4 years ago
position: relative;
clear: both;
}
4 years ago
.infotailor:after {
content: ' ';
position: absolute;
3 years ago
left: calc(100% - 53%);
4 years ago
right: auto;
top: 0px;
bottom: auto;
border: 40px solid;
border-color: #fff transparent transparent transparent;
}
4 years ago
.infotailorword {
position: absolute;
4 years ago
top: calc(100% - 370px);
4 years ago
font-size: 30px;
text-align: center;
4 years ago
padding: 0 30px;
3 years ago
line-height: 35px;
4 years ago
font-family: 'Goudy Old Style';
font-weight: 600;
4 years ago
}
.infotailormade {
4 years ago
font-size: 20px;
4 years ago
width: 250px;
4 years ago
margin: 30px auto 0 auto;
4 years ago
display: block;
background: #fff;
4 years ago
border: 2px solid #ad1818;
4 years ago
}
.infotailormade a {
4 years ago
color: #ad1818;
4 years ago
text-decoration: none;
display: block;
text-transform: uppercase;
}
.listtour {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: left;
clear: both;
}
4 years ago
.goHome {
text-align: center;
}
.goHome a {
color: #999;
}
3 years ago
/*首页反馈*/
.whyus {
border-right: 1px solid #d1d1d1;
padding: 0 40px 55px 0;
4 years ago
width: 43%;
float: left;
}
4 years ago
.whyus ul { padding-left: 0;}
.whyus li {
3 years ago
font-size: 19px;
4 years ago
list-style: none;
3 years ago
margin-bottom: 40px;
}
.whyus li strong {
3 years ago
font-size: 23px;
display: block;
margin-bottom: 10px;
4 years ago
color: #ad1818;
3 years ago
font-family: 'Goudy Old Style';
}
.customerReview {
4 years ago
padding-left: 70px;
width: 47%;
display: inline-block;
}
.reviewList {
overflow: hidden;
3 years ago
margin-bottom: 30px;
}
.reviewList img {
border: 1px solid #d1d1d1;
padding: 5px;
float: left;
4 years ago
width: 25%;
}
.reviewList .reviewContent {
3 years ago
line-height: 18px;
float: right;
3 years ago
width: 67%;
}
.reviewList .reviewContent .quoteEnd {
4 years ago
font-size: 18px;
3 years ago
line-height: 23px;
}
4 years ago
.reviewList .floatLeft {float: left;
margin-right: 30px;
width: 60%;}
.reviewList .byWho {
display: block;
3 years ago
font-size: 16px;
color: #999;
margin-top: 5px;
}
.trustPilotIcon {
4 years ago
margin: 20px 0 20px;
4 years ago
font-size: 20px;
}
4 years ago
.trustPilotIcon img { display: block;
3 years ago
margin-top: 10px;}
4 years ago
/*文中广告*/
4 years ago
.info_ad { position: relative;}
.info_ad_button {
4 years ago
background: #ad1818;
border-radius: 50%;
text-align: center;
4 years ago
height: 45px;
padding-top: 8px;
4 years ago
width: 53px;
position: absolute;
4 years ago
right: 15px;
bottom: 15px;}
4 years ago
.info_ad_button a {
4 years ago
display: block;
4 years ago
height: 60px;
4 years ago
margin-top: -10px;}
4 years ago
.info_ad_button a:after {
content: "";
4 years ago
position: absolute;
4 years ago
width: 15px;
height: 15px;
4 years ago
transition: transform 0.5s;
-webkit-transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
border-top: 5px solid #fff;
border-right: 5px solid #fff;
transform: rotate(
45deg
);
margin-top: 18px;
4 years ago
margin-left: -13px;
4 years ago
}
4 years ago
/*tour detail*/
.tournavi {
position: sticky;
z-index: 11;
margin: 0 auto;
4 years ago
margin-top: -50px;
4 years ago
background: #fff;
3 years ago
top: 50px;
width: 100%;
display: flex;
4 years ago
padding: 5px 0;
4 years ago
box-shadow: 0px 2px 6px #d2d2d2;
}
.TopNavi {
4 years ago
font-size: 17px;
border-right: 1px solid #d2d2d2;
padding-top: 5px;
text-align: center;
width: 25%;
}
.TopNaviLast {
4 years ago
font-size: 17px;
height: 25px;
padding-top: 5px;
text-align: center;
width: 24%;
}
.TopNavi a, .TopNaviLast a {
text-decoration: none;
}
.ah_tour_subtitle {text-align: center;
4 years ago
font-size: 25px;
margin: 60px 0 30px 0;
font-family: 'Goudy Old Style';
3 years ago
font-weight: 600;}
ul.tourhighlights { padding: 0 15px 0 20px;}
ul.tourhighlights li {list-style: square;
margin-bottom: 10px;
font-size: 19px;}
4 years ago
.feedback_content {
4 years ago
font-size: 22px;
text-align: center;
font-style: italic;
4 years ago
padding: 40px 40px 0 40px;
background: url(https://data.chinahighlights.com/image/tour-detail/china-tour/china-tours-2020-feedback-bg-left.png) no-repeat 0px 20px;
4 years ago
background-size: 65px;}
3 years ago
.customer_name {
4 years ago
text-align: center;
margin: 30px 0 15px 0;}
3 years ago
.tourDays { float: left;
padding: 5px 15px;
font-size: 17px;
4 years ago
font-family: 'Goudy Old Style';
margin-top: 10px;
text-transform: uppercase;
background: #000;
color: #fff;
margin-right: 10px;}
.tourDays:after {
border-left: solid 15px #000;
3 years ago
border-bottom: solid 14px transparent;
4 years ago
border-top: solid 17px transparent;
3 years ago
margin-left: 15px;
4 years ago
margin-top: -5px;
content: ' ';
position: absolute;
}
.tourDays strong {
3 years ago
font-size: 18px;
4 years ago
margin-left: 5px;
}
.tour_city {display: table-cell;
font-weight: 600;
height: 30px;
4 years ago
padding: 15px 15px 0px 20px;
4 years ago
font-size: 20px;
4 years ago
font-family: 'Goudy Old Style';}
3 years ago
.ItineraryContent {
border-bottom: 2px dashed #d1d1d1;
margin-bottom: 40px;
padding-top: 15px;}
.tour_hotel, .tour_dinner, .tour_place {
4 years ago
font-size: 18px;
4 years ago
display: block;
4 years ago
color: #7d7d7d;
4 years ago
margin: 0 15px 10px 0;}
.service_include { background: #efefef;
3 years ago
margin-top: 80px;
padding: 1px 25px 50px 25px;}
.tour_price { border-bottom: 1px solid #c5c5c5;
padding: 0 0 40px 0;
margin-bottom: 40px;}
4 years ago
.tour_price strong {
3 years ago
font-size: 30px;
color: #ad1818;
margin-right: 20px;
float: left;}
3 years ago
.price_person {margin-top: 10px; font-size: 17px;}
3 years ago
.ah_hotel {
4 years ago
display: inline-block;
4 years ago
width: 372px; }
4 years ago
.ah_hotel img {float: left; width: 186px; height: 125px; }
4 years ago
.hotelbg {
padding: 15px;
4 years ago
background: #efefef;
4 years ago
display: table;
4 years ago
height:95px;
4 years ago
min-width: 156px;
}
3 years ago
.hotel_city { color: #7d7d7d;
4 years ago
font-size: 16px; margin-bottom: 5px; display: block;
4 years ago
}
3 years ago
.hotel_name {font-size: 18px; line-height: 19px;}
.inquirybutton {
font-size: 20px;
position: fixed;
bottom: 0;
padding: 5px 0;
4 years ago
width: 750px;
}
.inquirybutton a {
color: #fff;
display: block;
height: 30px;
4 years ago
padding-top: 3px;
background: #ad1818;
width: 70%;
margin: 0 auto;
border-radius: 25px;
text-align: center;
3 years ago
text-decoration: none;
}
.tmbottom {background: #efefef;
4 years ago
padding: 5px 30px 30px 30px; position: relative; margin-top: 80px;}
.tmbottom:after {
content: ' ';
position: absolute;
3 years ago
left: calc(100% - 60%);
4 years ago
right: auto;
top: 0px;
bottom: auto;
border: 35px solid;
border-color: #fff transparent transparent transparent;
}
4 years ago
.tmbottom h2 {text-align: center;}
3 years ago
.tmbottom input {
border: 1px solid #dcdcdc;
border-radius: 6px;
font-size: 17px;
3 years ago
padding: 12px 15px;
3 years ago
margin-bottom: 15px;}
.tmbottom textarea { width: 100%;
border: 1px solid #dcdcdc;
padding: 15px;
font-size: 18px;
font-family: 'Hind Madurai';
line-height: 20px;
border-radius: 7px;}
3 years ago
.tmbottom button { background: #ad1818;
border: medium none;
border-radius: 25px;
color: #fff;
font-size: 22px;
padding: 10px;
width: 100%;
margin: 30px auto;
4 years ago
}
3 years ago
/* 集合页 */
4 years ago
.content_bg_grey {background: #fff; width: auto;
max-width: 100%;
margin-right: auto;
margin-left: auto;
4 years ago
}
3 years ago
table.info_reco_table, table.tour_table { width: max-content;}
4 years ago
table.info_reco_table td { width: 270px;}
3 years ago
table.tour_table td.tour_td_image {position:relative; width: 280px;}
4 years ago
.experience_info {position: absolute; bottom: 0; color: #fff; background: rgb(0 0 0 / 45%); height: 100%;}
3 years ago
.experience_info p {
4 years ago
padding: 0 15px 15px 15px;
text-shadow: 1px 1px 1px #000;}
3 years ago
.experience_name {font-size: 25px;
line-height: 27px;
4 years ago
display: block;
text-shadow: 1px 1px 1px #000;
font-family: 'Goudy Old Style';
font-weight: 600;
padding: 15px;}
4 years ago
.more_tours { text-align: center;
font-size: 25px;
4 years ago
font-weight: 600;
4 years ago
text-transform: uppercase;
4 years ago
margin-top: 30px;}
3 years ago
.area_guide {width: 200px; float:left; margin: 15px 20px 20px 0;}
4 years ago
.area_name {display: block;
border: 1px solid #e5e5e5;
border-top: none;
3 years ago
padding: 5px 10px;
3 years ago
background: #fff;
4 years ago
border-bottom: 3px solid #ad1818;
font-weight: 600;}
3 years ago
.area_name a { text-decoration: none;}
4 years ago
.country_name {position: absolute;
4 years ago
top: 0;
3 years ago
width: 280px;
text-align: center;
3 years ago
font-size: 25px;
4 years ago
text-shadow: 1px 1px 1px #000;
4 years ago
font-weight: 600;
3 years ago
height: 204px;
4 years ago
}
4 years ago
.country_name strong { font-size: 27px;}
4 years ago
.country_name a {background: rgb(0 0 0 / 45%);
height: 100%;
padding-top: 170px;
display: block;
3 years ago
text-decoration: none;
3 years ago
font-family: 'Goudy Old Style';
4 years ago
color: #fff;}
.trip_plan_left { width: 585px;
float: left;}
.plan_left {margin-right: 15px; width: 275px;
float: left; position: relative;}
.plan_title_bg {position: absolute;
top: 0;
bottom: 0;
height: 100%;
width: 100%;
background: rgb(0 0 0 / 45%);}
4 years ago
.plan_left_title {width: 100%;
4 years ago
position: absolute;
text-align: center;
3 years ago
font-size: 22px;}
.plan_left_title a, .plan_right_title a { color: #fff;}
3 years ago
.plan_left_title a {
4 years ago
height: 236px;
4 years ago
display: inline-block;
4 years ago
padding: 130px 15px 0 15px;}
.plan_left_right { width: 275px;
float: left; position: relative;}
.trip_plan_right {width: 555px;
display: inline-block;}
3 years ago
.trip_plan_left a, .trip_plan_right a {text-decoration: none;}
.plan_right_top {position: relative; margin-bottom: 20px;}
.plan_right {position: relative;}
4 years ago
.plan_right_title {position: absolute;
bottom: 0;
background: rgb(0 0 0 / 55%);
width: calc(100% - 20px);
3 years ago
padding: 5px 10px;}
4 years ago
.country_city_guide {
4 years ago
width: 62%;
4 years ago
float: left; }
4 years ago
img.country_map {margin-top: 15px;
4 years ago
display: inline-block;}
3 years ago
.ah_index_tour { margin: 0 2px; height: 100%; border: 1px solid #d1d1d1;padding: 5px; width: 269px; margin-bottom: 5px;}
3 years ago
.ah_index_tour_bg {padding: 20px 0;text-align: center;}
4 years ago
.ah_index_tour_bg h3 {height: 75px;
line-height: 20px;
margin-top: 0;
font-size: 20px;
margin-bottom: 10px;
font-family: 'Goudy Old Style';}
3 years ago
.ah_index_tour_bg a { text-decoration: none;}
3 years ago
.ah_index_tour_city {height: 60px;color: #848484;line-height: 20px;}
.ah_index_tour_button {text-transform: uppercase;font-weight: 600;}
.ah_index_tour_button a {color: #ad1818;}
4 years ago
/* Menu styles */
.menu {
position: fixed;
top: 120px;
left: 0;
width: 300px;
height: calc(100vh - 120px);
background: #fff;
}
.menu__wrap {
position: absolute;
3 years ago
top: 7em;
4 years ago
bottom: 0;
width: 100%;
}
3 years ago
.menu__wrap a {text-decoration: none;}
4 years ago
.menu__level {
position: absolute;
left: 0;
visibility: hidden;
overflow: hidden;
overflow-y: scroll;
width: calc(100% + 50px);
height: 100%;
margin: 0;
padding: 0;
list-style-type: none;
}
.menu__level:focus {
outline: none;
}
.menu__level--current {
visibility: visible;
}
.menu__item {
width: calc(100% - 50px);
}
.menu__link {
3 years ago
font-weight: 600;
4 years ago
position: relative;
display: block;
3 years ago
padding: 7px 15px;
font-size: 22px;
font-family: 'Goudy Old Style';
4 years ago
}
.menu__link[data-submenu]::after {
position: absolute;
4 years ago
content: "";
width: 10px;
height: 10px;
transition: transform 0.5s;
-webkit-transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
border-top: 3px solid #000;
border-right: 3px solid #000;
float: right;
top: 20px;
right: 20px;
transform: rotate(
45deg
);
4 years ago
}
.menu__link:hover,
.menu__link:focus,
.menu__link[data-submenu]:hover::after,
.menu__link[data-submenu]:focus::after {
color: #000;
}
3 years ago
4 years ago
[class^='animate-'],
[class*=' animate-'] {
visibility: visible;
}
.animate-outToRight .menu__item {
-webkit-animation: outToRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
animation: outToRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
}
@-webkit-keyframes outToRight {
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes outToRight {
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
.animate-outToLeft .menu__item {
-webkit-animation: outToLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
animation: outToLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
}
@-webkit-keyframes outToLeft {
to {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes outToLeft {
to {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
.animate-inFromLeft .menu__item {
-webkit-animation: inFromLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
animation: inFromLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
}
@-webkit-keyframes inFromLeft {
from {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes inFromLeft {
from {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.animate-inFromRight .menu__item {
-webkit-animation: inFromRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
animation: inFromRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1);
}
@-webkit-keyframes inFromRight {
from {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes inFromRight {
from {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
3 years ago
4 years ago
.menu__back {
position: absolute;
border: none;
}
.menu__back--hidden {
pointer-events: none;
opacity: 0;
}
.menu__back:hover,
.menu__back:focus {
color: #fff;
outline: none;
}
/* Open and close buttons */
.action {
position: absolute;
border: none;
background: none;
}
.action:focus {
outline: none;
}
.action--close {
3 years ago
top: 1em;
right: 0.5em;
4 years ago
}
/*@media screen and (max-width: 40em) {}
.action--open,*/
.action--close {
display: block;
}
.menu {
z-index: 1000;
top: 0;
width: 100%;
height: 100vh;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
-webkit-transition: -webkit-transform 0.3s;
transition: transform 0.3s;
}
.menu--open {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
3 years ago
.menu__breadcrumbs {
font-size: 16px;
line-height: 1;
position: relative;
padding: 25px 20px;
}
.menu__breadcrumbs a {
font-weight: bold;
text-transform: uppercase;
}
.menu__breadcrumbs a:last-child {
pointer-events: none;
}
.menu__breadcrumbs a:not(:last-child)::after {
content: '←';
display: inline-block;
padding: 0 0.5em;
color: #999;
}
.menu__breadcrumbs a:not(:last-child):hover::after,
.menu__breadcrumbs a:not(:last-child):focus::after {
color: #33353e;
}
4 years ago
/* menu end */
/*pc style begin */
.followtitle a {
color: #fff;
3 years ago
text-decoration: none;
4 years ago
}
.aboutusleft {
width: 50%;
float: left;
display: inline-block;
}
.bottompctitle {
text-transform: uppercase;
color: #797979;
font-weight: bold;
width: 23%;
height: 115px;
float: left;
}
.aboutusinfo {
4 years ago
font-size: 17px;
4 years ago
padding-right: 50px;
}
.trustPilotIconBig { width: 75%;
float: right;}
.aboutusinfo a {
color: #fff;
}
.aboutusright {
width: 50%;
display: inline-block;
}
.bottomaboutuslinks {
border-top: 1px solid #797979;
margin-top: 50px;
}
.bottomlinksleft {
width: 45%;
float: left;
display: inline-block;
}
ul.socialmedias { float: right; margin-top: 15px;}
3 years ago
ul.socialmedias li { float: left; margin-right: 20px; font-size: 18px; list-style: none;}
ul.socialmedias li a {color: #fff; text-decoration: none;}
4 years ago
ul.withBorder {
padding: 10px 0;
margin-top: 0;
}
ul.withBorder li {
display: inline;
3 years ago
margin-right: 30px;
4 years ago
}
ul.withBorder li a {
color: #fff;
3 years ago
text-decoration: none;}
4 years ago
.infobottom {
background: #3a3a32;
color: #fff;
padding-top: 100px;
padding-bottom: 110px;
position: relative;
4 years ago
}
img.bottomlogopc {
float: left;
margin-right: 30px;
}
.bottomcopyright {
font-size: 16px;
display: inline-block;
padding-top: 30px;
}
.bottomprivacy {
display: inline-block;
float: right;
padding-top: 30px;
font-size: 16px;
}
.bottomprivacy a {
color: #fff;
}
.main_content {
width: 1140px;
max-width: 100%;
margin-right: auto;
margin-left: auto;
display: table;
}
.dropdown-content {
width: 100%;
left: 0;
display: block;
position: absolute;
box-shadow: 0px 2px 4px 0px #d1d1d1;
transition: 0.5s;
height: 0;
overflow: hidden;
}
.dropdown:hover .dropdown-content {
4 years ago
height: 300px;
4 years ago
background: #fff;
}
ul.inspiration {
padding-left: 0;
4 years ago
width: 155px;
4 years ago
}
ul.inspiration li {
3 years ago
line-height: 30px;
4 years ago
width: 300px;
4 years ago
}
ul.inspiration li a {
padding: 0;
text-transform: capitalize;
}
ul.inspiration li a:hover {
border-bottom: none;
padding: 0;
}
.inspirationlist {
float: left;
}
.inspirationtitle {
font-weight: 600;
4 years ago
font-size: 20px;
4 years ago
color: #ad1818;
border-bottom: 1px solid #d2d2d2;
4 years ago
padding-bottom: 10px;
margin-bottom: 10px;
4 years ago
display: inline-block;
4 years ago
font-family: 'Goudy Old Style';
4 years ago
}
.inspirationinfo {
width: 1140px;
margin: 0 auto;
4 years ago
padding-top: 30px;
4 years ago
}
.besttime, .topthings {
4 years ago
width: 28%;
4 years ago
}
3 years ago
.vacationtype,
.festival {
4 years ago
width: 21%;
}
4 years ago
.infotoptitle h1 {
4 years ago
color: #fff;
position: absolute;
3 years ago
bottom: 35px;
4 years ago
width: 1140px;
4 years ago
text-shadow: 1px 1px 1px #000;
4 years ago
}
.topbannerbg {
position: absolute;
4 years ago
background: rgba(0, 0, 0, 0.33) none repeat scroll 0 0;
4 years ago
width: 100%;
top: 0;
height: 100%;
}
4 years ago
.authorupdate {color: #fff;
position: absolute;
bottom: 0;
display: block;
margin-bottom: 30px;
font-size: 16px;
4 years ago
text-shadow: 1px 1px 1px #000; width: max-content;}
3 years ago
.authorupdate strong {
3 years ago
border-right: 2px solid #f1f1f1; padding-right: 10px;
3 years ago
margin-right: 10px; font-weight: 400;}
4 years ago
.requiredArea {color: #ad1818;
font-size: 18px;
display: block;
margin-top: -10px;
margin-bottom: 20px;
font-weight: 400;
font-style: italic;
border-bottom: 1px dashed;
padding: 0 5px;}
4 years ago
/*pc style end */
@media (min-width: 1200px) {
.topnavigation {
width: 1140px;
margin: 0 auto;
}
4 years ago
.skipBox {min-height: 150px;}
4 years ago
p {
padding: 0;
}
.infotailor {
4 years ago
height: auto;
4 years ago
}
.infotailorword {
3 years ago
padding: 100px 0 80px 0;
position: relative;
display: block;
4 years ago
}
#main_content_pc {
float: left;
}
3 years ago
.pc_content {width: 750px;float: left;}
.right_tour { position: sticky;
float: right;
3 years ago
top: calc(100% - 570px);
4 years ago
width: 330px;}
3 years ago
.topcontent { margin-bottom: 80px; margin-top: 65px;}
4 years ago
.bottomlogo {
3 years ago
height: 67px;
4 years ago
background-color: #1e1e1e;
color: #fff;
position: relative;
4 years ago
}
.visible-xs {
display: none !important;
}
3 years ago
.siteSearch {margin-top: 13px;}
4 years ago
.contactbutton {
4 years ago
color: #fff !important;
background: #ad1818;
3 years ago
padding: 5px 15px !important;
border-radius: 25px;
4 years ago
}
4 years ago
a.p_topnavilink.contactbutton:hover {
border-bottom: none;
}
4 years ago
.footerbox {
width: 1140px;
margin-right: auto;
margin-left: auto;
}
.siteSearch .strkeys {
border: 0;
font-size: 16px;
padding: 0 10px;
}
4 years ago
.siteSearch .strkeys:focus-visible {outline: none;}
4 years ago
.siteSearch .submits {
float: right;
right: 0px;
}
img.asiahighlightslogo {
3 years ago
width: 133px;
4 years ago
}
ul.pctopnavi {
display: flex;
3 years ago
padding-left: 215px;
4 years ago
margin-bottom: 0;
margin-top: 0;
}
3 years ago
ul.pctopnavi a {text-decoration: none;}
4 years ago
ul.pctopnavi li {
list-style: none;
float: left;
3 years ago
margin-right: 35px;
4 years ago
}
.pcnavibutton {
float: right;
display: inline-block;
}
li.dropdown {
text-transform: uppercase;
}
li.dropdown a {
display: table-cell;
4 years ago
padding: 24px 0 19px 0;
4 years ago
}
li.dropdown a:hover {
border-bottom: 5px solid #ad1818;
4 years ago
padding: 24px 0 14px 0;
4 years ago
}
a.p_toplogo {
float: left;
}
a.p_topnavilink {
font-weight: 600;
4 years ago
font-size: 18px;
4 years ago
}
.infotoptitle {
width: 1140px;
margin: 0 auto;
}
.infotopimage {
position: relative;
}
4 years ago
.infotopimage img { margin: 0 auto;}
.tmbottom input, .tmbottom textarea { width: 95%;}
4 years ago
.tour_feedback {
4 years ago
padding-bottom: 50px;
border-top: 1px solid #d1d1d1;
margin: 80px 0;
border-bottom: 1px solid #d1d1d1;}
3 years ago
.tournavi { margin-top: -80px; top: 65px;
4 years ago
width: 750px; box-shadow: 0px 2px 6px #d2d2d2; }
3 years ago
.info_ad_name {
4 years ago
padding: 15px 15px 10px 5px;
4 years ago
bottom: 0;
position: absolute;}
}
4 years ago
.info_ad_name a {
4 years ago
display: inline-block;
color: #fff;
4 years ago
padding: 10px;
3 years ago
text-decoration: none;
4 years ago
text-shadow: 1px 1px 1px #000;}
3 years ago
.info_ad_name strong {line-height: 33px;
font-size: 33px;
4 years ago
font-family: 'Goudy Old Style';
3 years ago
display: block;}
4 years ago
.content_article_title, .info_ad_title {
4 years ago
margin-top: 50px;
4 years ago
border-left: 5px solid #ad1818;
4 years ago
padding-left: 15px;
4 years ago
margin-bottom: 15px;
font-family: 'Goudy Old Style';
font-weight: 600;
4 years ago
text-transform: uppercase;
4 years ago
}
4 years ago
table.content_article {width: max-content; border-spacing: inherit;}
table.content_article td { background: #f6f6f6; border-right: 5px solid #fff; width: 355px;}
3 years ago
table.content_article td img { width: 37%;
float: left;}
.content_article_name {width: 55%;
height: 115px;
font-size: 19px;
line-height: 20px;
margin-bottom: 10px;
4 years ago
padding-top: 10px;
4 years ago
-webkit-line-clamp: 4;
4 years ago
display: -webkit-box;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
3 years ago
overflow: hidden;
padding-left: 15px;}
3 years ago
.content_article_name a {text-decoration: none;}
.content_article_button {
display: inherit;
4 years ago
font-size: 22px;
background: #ad1818;
border-radius: 50%;
3 years ago
float: right;
margin-right: 15px;
3 years ago
}
.content_article_button a {
4 years ago
width: 33px;
height: 27px;
4 years ago
display: inline-block;}
4 years ago
.content_article_button a:after {
color: #fff;
content: "";
width: 10px;
height: 10px;
transition: transform 0.5s;
-webkit-transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
border-top: 3px solid #fff;
border-right: 3px solid #fff;
float: right;
4 years ago
margin-right: 12px;
margin-top: 10px;
4 years ago
transform: rotate(
45deg
);
}
4 years ago
@media (max-width: 750px) {
3 years ago
.updated_news { top: 51px;}
3 years ago
p { padding: 0 15px;}
3 years ago
ul.InfoList {padding: 0 15px 0 35px;}
3 years ago
.infoimage img, .right_image img { border-radius: 0;}
4 years ago
/*头部导航*/
4 years ago
.topnavitailor { text-transform: uppercase;
margin-top: 13px;
display: flex;
position: absolute;
right: 10px;
top: 0;}
4 years ago
a.infocustomize {
3 years ago
font-size: 17px;
4 years ago
color: #fff;
3 years ago
padding: 3px 10px;
4 years ago
background: #ad1818;
margin-right: 10px;
3 years ago
text-decoration: none;
4 years ago
}
3 years ago
img.chinahighlightslogo {margin-left: 10px; width: 200px;}
4 years ago
4 years ago
/*底部logo*/
.bottomlogoinfo {
color: #fff;
text-align: center;
margin-bottom: 50px;
padding: 0 30px;
font-size: 18px;
font-weight: 300;
}
4 years ago
.bottomlogoinfo a { color: #fff; text-decoration: underline;}
4 years ago
.bottommedia ul {
padding-left: 15px;
}
3 years ago
.bottomlinks ul {
display: inline-block;
padding-left: 0;
margin-top: 0;
}
3 years ago
.bottommedia ul li, .bottomlinks ul li { list-style: none; margin-bottom: 10px;}
3 years ago
.bottommedia ul li a, .bottomlinks ul li a { text-decoration: none; color: #fff;}
.bottommedia ul li svg {margin-right: 15px;}
img.bottomlogocenter { margin: 30px auto 10px auto;}
4 years ago
.featureon {padding:0 20px;}
3 years ago
.infobottom {padding: 90px 0;}
3 years ago
#main_content_mobile {padding-top: 50px; max-width: 100%;}
3 years ago
.main_content {max-width: 100%;}
4 years ago
.img-responsive,
video,
.table-responsive {
overflow-x: auto;
}
h1,
h2,
h3,
h4 {
padding: 0 15px;
}
.infotopimage {
4 years ago
position: relative;
3 years ago
margin-top: 51px;
4 years ago
}
3 years ago
ul.tourhighlights { padding: 0 15px 0 35px;}
.right_image {float: none;
width: 100%;
margin: 30px 0;}
4 years ago
.headerbar {
3 years ago
height: 50px;
4 years ago
}
.bottomlogo {
4 years ago
font-size: 16px;
3 years ago
height: 53px;
background: url(https://data.chinahighlights.com/image/asia/asia-highlights-bottom-logo.png) no-repeat 10px 0px #1e1e1e;
padding-left: 150px;
4 years ago
padding-top: 18px;
4 years ago
color: #fff;
position: relative;
4 years ago
}
.hidden-xs {
display: none !important
}
.visible-xs {
display: block !important
}
4 years ago
.infocategory {width: auto;
top: 10px;
padding: 0 25px;}
4 years ago
/*信息页面*/
4 years ago
.nextcontext { width: 100%;}
4 years ago
.info_ad_name strong {
3 years ago
line-height: 22px;
4 years ago
font-size: 22px;
3 years ago
margin-bottom: 10px;
4 years ago
}
.right_brand_info, .right_tour {display: none;}
4 years ago
.infotoptitle {
4 years ago
position: absolute;
width: 100%;
4 years ago
bottom: 0;
4 years ago
}
4 years ago
.infotoptitle h1 { width: auto;
4 years ago
text-shadow: 1px 1px 1px #000;
3 years ago
line-height: 30px;
3 years ago
font-size: 30px;}
4 years ago
.authorupdate { padding: 0 15px;}
3 years ago
.skipAhead ul { display: inline-block;
padding-left: 35px;
width: calc(100% - 35px);}
.skipAhead li { width: calc(100% - 30px);}
3 years ago
4 years ago
/*tour page*/
3 years ago
.tour_price {padding: 0 15px 40px 15px;}
4 years ago
.tmbottom textarea, .tmbottom input { width: 90%;}
3 years ago
.tmbottom {padding: 5px 15px;}
4 years ago
/*集合页*/
4 years ago
.country_experience, .other_country { display: inline-block;}
4 years ago
.unique_experience, .country_pic { width: 100%; padding: 0; margin-bottom: 15px;}
.experience_info {margin-right: 0;}
4 years ago
.listtour {display: block;}
3 years ago
.travel_guide_city, .trip_plan_right, .country_city_guide, .travel_guide_city, .ah_hotel, .inquirybutton, .whyus ul { width: 100%;}
3 years ago
.area_guide {margin: 15px 5px;}
4 years ago
.trip_plan_left { width: 100%; display: flex;}
.plan_left, .plan_left_right { width: 100%; margin-bottom: 20px;}
3 years ago
.content_bg_grey { padding: 0 0 80px 0; background: #ececec; margin: 80px 0; display: inline-block;}
3 years ago
.plan_left_title a { padding-top: calc(100% - 100px);height: calc(100% - 200px);padding-bottom: calc(100% - 100px);}
.more_tours { font-size: 25px; clear: both;}
.travel_guide_city { display: flex; }
4 years ago
.ah_index_tour {width: auto; display: flex; margin: 0 0 20px 0; background: #fff;}
3 years ago
.ah_index_tour_bg h3 { height: auto; padding-left: 0; }
3 years ago
.ah_index_tour_bg { padding: 15px; width: 100%;}
3 years ago
.ah_index_tour_city { height: auto;}
4 years ago
table.tour_table .ah_index_tour {width: 340px;
height: 265px;}
3 years ago
.info_ad_content {background: #f6f6f6;}
4 years ago
.info_ad_name a { color: #000;
text-shadow: none;
4 years ago
width: 75%;
4 years ago
font-size: 18px;}
4 years ago
/*首页反馈*/
4 years ago
.whyus, .customerReview { width: auto;border-right: none; padding: 0 20px;}
4 years ago
.reviewList .floatLeft {margin-right: 25px;width: 55%;}
4 years ago
}
/* flatpickr calendar begin */
.flatpickr-calendar{background:transparent;opacity:0;display:none;text-align:center;visibility:hidden;padding:0;-webkit-animation:none;animation:none;direction:ltr;border:0;font-size:14px;line-height:24px;border-radius:5px;position:absolute;width:307.875px;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-touch-action:manipulation;touch-action:manipulation;background:#fff;-webkit-box-shadow:1px 0 0 #e6e6e6,-1px 0 0 #e6e6e6,0 1px 0 #e6e6e6,0 -1px 0 #e6e6e6,0 3px 13px rgba(0,0,0,0.08);box-shadow:1px 0 0 #e6e6e6,-1px 0 0 #e6e6e6,0 1px 0 #e6e6e6,0 -1px 0 #e6e6e6,0 3px 13px rgba(0,0,0,0.08)}.flatpickr-calendar.open,.flatpickr-calendar.inline{opacity:1;max-height:640px;visibility:visible}.flatpickr-calendar.open{display:inline-block;z-index:99999}.flatpickr-calendar.animate.open{-webkit-animation:fpFadeInDown 300ms cubic-bezier(.23,1,.32,1);animation:fpFadeInDown 300ms cubic-bezier(.23,1,.32,1)}.flatpickr-calendar.inline{display:block;position:relative;top:2px}.flatpickr-calendar.static{position:absolute;top:calc(100% + 2px)}.flatpickr-calendar.static.open{z-index:999;display:block}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7){-webkit-box-shadow:none !important;box-shadow:none !important}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1){-webkit-box-shadow:-2px 0 0 #e6e6e6,5px 0 0 #e6e6e6;box-shadow:-2px 0 0 #e6e6e6,5px 0 0 #e6e6e6}.flatpickr-calendar .hasWeeks .dayContainer,.flatpickr-calendar .hasTime .dayContainer{border-bottom:0;border-bottom-right-radius:0;border-bottom-left-radius:0}.flatpickr-calendar .hasWeeks .dayContainer{border-left:0}.flatpickr-calendar.hasTime .flatpickr-time{height:40px;border-top:1px solid #e6e6e6}.flatpickr-calendar.noCalendar.hasTime .flatpickr-time{height:auto}.flatpickr-calendar:before,.flatpickr-calendar:after{position:absolute;display:block;pointer-events:none;border:solid transparent;content:'';height:0;width:0;left:22px}.flatpickr-calendar.rightMost:before,.flatpickr-calendar.arrowRight:before,.flatpickr-calendar.rightMost:after,.flatpickr-calendar.arrowRight:after{left:auto;right:22px}.flatpickr-calendar.arrowCenter:before,.flatpickr-calendar.arrowCenter:after{left:50%;right:50%}.flatpickr-calendar:before{border-width:5px;margin:0 -5px}.flatpickr-calendar:after{border-width:4px;margin:0 -4px}.flatpickr-calendar.arrowTop:before,.flatpickr-calendar.arrowTop:after{bottom:100%}.flatpickr-calendar.arrowTop:before{border-bottom-color:#e6e6e6}.flatpickr-calendar.arrowTop:after{border-bottom-color:#fff}.flatpickr-calendar.arrowBottom:before,.flatpickr-calendar.arrowBottom:after{top:100%}.flatpickr-calendar.arrowBottom:before{border-top-color:#e6e6e6}.flatpickr-calendar.arrowBottom:after{border-top-color:#fff}.flatpickr-calendar:focus{outline:0}.flatpickr-wrapper{position:relative;display:inline-block}.flatpickr-months{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.flatpickr-months .flatpickr-month{background:transparent;color:rgba(0,0,0,0.9);fill:rgba(0,0,0,0.9);height:34px;line-height:1;text-align:center;position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overflow:hidden;-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1}.flatpickr-months .flatpickr-prev-month,.flatpickr-months .flatpickr-next-month{text-decoration:none;cursor:pointer;position:absolute;top:0;height:34px;padding:10px;z-index:3;color:rgba(0,0,0,0.9);fill:rgba(0,0,0,0.9)}.flatpickr-months .flatpickr-prev-month.flatpickr-disabled,.flatpickr-months .flatpickr-next-month.flatpickr-disabled{display:none}.flatpickr-months .flatpickr-prev-month i,.flatpickr-months .flatpickr-next-month i{position:relative}.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,.flatpickr-months .flatpickr-next-month.flatpickr-prev-month{left:0}.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,.flatpickr-months .flatpickr-next-month.flatpickr-next-month{right:0}.flatpickr-months .flatpickr-prev-month:hover,.flatpickr-mont
/* flatpickr calendar end */