@font-face {
  font-family: 'myfont'; 
  src: url(../fonts/Roboto-Regular.ttf) format('truetype'); 
   font-display: swap;
}

@font-face {
  font-family: 'bigfont'; 
  src: url(../fonts/Koulen-Regular.ttf) format('truetype'); 
   font-display: swap;
}
@font-face {
  font-family: 'Gloock'; 
  src: url(../fonts/Gloock-Regular.ttf) format('truetype'); 
   font-display: swap;
}
@font-face {
  font-family: 'Lora'; 
  src: url(../fonts/Lora-BoldItalic.ttf) format('truetype'); 
   font-display: swap;
}
@font-face {
  font-family: 'Play'; 
  src: url(../fonts/Playball-Regular.ttf) format('truetype'); 
   font-display: swap;
}


.myfont{
	font-family: 'myfont';
}
.Gloock,
.douying{
	font-family: 'Gloock';
}

.bigfont{
	 font-family: 'bigfont';
}
.Lora{
	 font-family: 'Lora';
}
.Play{
	 font-family: 'Play';
}

.price{
     font-size: 30px!important;
}
.honor{
	font-family: 'myfont';
}
.honorFw{ 
	font-family: 'Gloock';
}
.honor300{
	font-family: 'bigfont';
}

.en{
	font-family: 'en';
}


.border-radius15{
	 border-radius: 15px;
	 overflow: hidden;
}
.border-30{
     border-radius: 30px;
	 overflow: hidden;
}

:root{
	--colorblue:#1A2941;
	--colorred:#F19EB6;
	--colorjin:#CDB071;
}

html,body{
	color:#000;
	max-width: 100%;
	overflow-x: hidden;
	font-family: 'myfont',"Microsoft YaHei", "Arial", Helvetica, sans-serif;
	position: relative;  
}
html ::-webkit-scrollbar {
  width: 10px;
  height: 1px;
}
html ::-webkit-scrollbar-thumb {
  border-radius: 3px;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  background: #ff6218;
}
html ::-webkit-scrollbar-track { 
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  background: #ededed;
}

.tickets{
     height:16px;
     display: inline-block;
}
.tickets-w{ 
    
}

 

button {
  all: unset;
  background-color: transparent;
  border: none;
  padding: 0;
  margin: 0;
}

.line-24{
	 line-height: 24px!important;
}

.line-20{
	 line-height: 20px!important;
}

.fweight{
	 font-weight: bold;
}

/**********重置一些原样式**************/
.container, .container-lg, .container-md, .container-sm, .container-xl {
    max-width: 1340px;
}

.container-fluid-body{ 
    max-width: 1680px;
}

.fixed-top{
    z-index: 999;
    background: rgba(255,255,255,0.8);
}
.pages,.content{
    min-height: 60px; 
    line-height: 24px;
}
input:focus,
textarea:focus,
button:focus{
	outline: none; 
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{
	margin-bottom: 0;
}
.container {
    padding-right: 10px;
    padding-left: 10px;
}
.clear{
	clear:both;
}
 
.w-80{
    width:80%!important;
} 

.w-50{
    width:50%!important;
}

.col-20{
	-ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}

.mr-0{
	margin: 0
}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link,.nav-pills .nav-link{
	border:none;
}

.nav-link{
	padding:1rem 1rem;
}
.dropdown-menu{
	top:98%;
	border:none;
	padding:20px 0;
	box-shadow: 0px 15px 20px 0px rgba(0,0,0,0.1)
}
.dropdown-menu .dropdown-item{
	padding:10px 20px;
	font-size: 16px;
}
.dropdown-item:focus, .dropdown-item:hover{
	 background: #202A44;
	 color:#fff!important;
} 
.nav-tabs .nav-link{
	margin-right: 2px;
}

.content {
    color: #333;
    line-height: 24px;
}

/**********重置一些原结束**************/

/*********自定义一些基本设置**************/
pre{ position: relative; padding:40px 20px 20px; background:#222; color:#f8f8f8; padding-top:50px; border-radius:10px;}
pre::before {
    content: '';
    position: absolute;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: #fc625d;
    width: 12px;
    height: 12px;
    top:10px;
    left: 20px;
    -webkit-box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
    box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
    z-index: 2;
}

input:-webkit-autofill {
 box-shadow: 0 0 0 1000px #fff inset;
 -webkit-text-fill-color: #333;
}


.pt-mt-0{
	padding:0!important;
	margin:0!important;
}  

.d-flex-center{
   display: flex; /* 使用Flex布局 */
  flex-direction: column; /* 设置为垂直布局 */
  justify-content: center; /* 垂直居中 */
  align-items: center; /* 水平居中 */

}
.d-flex-y{
      display: flex; 
       flex-direction: column; /* 设置为垂直布局 */
      justify-content: center; /* 垂直居中 */ 
}
.text-center-dflex{
	justify-content:center;   
}
.fw300{
	font-weight: 300;
}
.coloron{
	color:#f19eb6!important;
}

.coloron2{
	color:#202A44!important;
}

.coloron3{
	color:#202A44!important;
}

.coloron4 {
    color: #FF0000!important;
}

.colora6{
	color:#A6A6A6!important;
}
.color000{
	color:#000!important;
}


.colorfff{
	color:#fff!important;
}

.color666{
	color:#6f6f6f!important;
}
.colorddd{
	color:#ddd!important;
}
.colorccc{
	color:#ccc!important;
}

.color888{
	color:#888!important;
}
.color333{
	color:#333!important;
}
.color39{
	color:#393939!important;
}

.color2a{
	color:#2a2a2a!important;
}
 .on2{
	color:#f19e86!important;
}


.colorred{
	 color:#202A44!important;
}


.bg05{
    background:rgba(0,0,0,0.3)!important;
    position: absolute;
    left:0;
    top:0;
    width:100%;
    height: 100%;
    z-index: 2;
}


.bg000 {
	background: #000!important;
}

.bgred{
	background: #f19eb6!important;
}
.bg15{
	background: #151515!important;
}
.bgf8{
	background: #f8f8f8!important;
}
.bgf7{
	background: #f7f7f7!important;
}
.bgf3{
	 background: #f3f5f9!important;
}

.bgblue{
	background: #202a44!important;
} 
.bgblue2{
	background: #F7F8FD!important;
}

.bg0{
	background: #000!important;
}

.bgddd{
	background: #ddd!important;
}

.bgfff{
	background: #fff!important;
}
.bgf5{
	background: #f5f5f5!important;
}

.bg39{
	background: #393939!important;
}
.bg44{
	background: #444444!important;
}
.bg16{
	background: #161616!important;
}

.bgyellow{
	background: #EEF2F4!important;
}

.bgblack{
	 background: #202a44!important;
}

.bgjin{
	 background:var(--colorjin)!important;
}
.border-radius50{
    border-radius: 50px;
    overflow: hidden;
}
.border-radius50 img{
    transition: all 0.6s;
}
.border-radius50:hover img{
    transform: scale(1.1);
}

.fa-square:before,
.fa-circle:before,
.fa-check-square:before{
	margin-right: 3px;
}

.title-bg{
	 background-image: url(../images/titilebg.jpg);
	 -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-repeat: no-repeat;
    background-size: center center;
    background-size: cover;
    color: #fff;
    display: inline-block; 
}

.leftmenus .onemenu .leftmenus-link{   
    display: block;
    }
.leftmenus .twomenu a{
      font-size: 13px;
      padding-left: 15px;
}


.navbar-light .navbar-toggler{
	border: none;
}

.lang img{
	 width:30px;
}
.lang{
	 color:var(--colorblue);
}
.lang:hover{
	color:var(--colorred)!important;
}
/**********自定义一些基本设置结束**************/

.top{
	background:#AF2848;
}
.top-head{
	color:#fff;
	height: 40px;
	line-height: 40px;
}
.top-head a{
	color:#fff;
	font-size: 15px;
}
.xiaohongshu{
	 background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMkAAABICAMAAABr9CFKAAAAP1BMVEUAAAD/I0L/JEL/JEH/JED/IED/JEH/JUL/JEL/I0H/IED/I0L/JEH/JUD/JEH/I0L/I0D/JEH/I0P/JEP/JEKyzp5HAAAAFHRSTlMA34BgQB+/n++gEJCwMHCfUM9Qz4ilXboAAAQzSURBVGje1ZrrtqMgDIW5S/HSm+//rLNmbFdNNybUg0zP/nd6DOaTkEBUbSr5lZIq1BRWGtROuXkt9UPZeaVQaqXXVt0vJiFGs/9Ckuu+KflCEl1mcyMeuF9MErYi8j5z6tUiP7O6B+MUle/jPOvO1yRBTyyJOk4dsWeljV/7GB+/3iqTnMHkxySoaDLBHMd6JDgllUhQ2uOooSpJTyxSPRJEQQ9dNRJMwZVJ8DEN659MLRKsikeSzANkyq4WCU7JoSSzeyfpK5HglBxMEt5JLpVIsCoeQkIfVRAdlEnkFHw4yURJbCUSrIqHkwyExNSr8R5cO5hEr0jCs5hczEo3nmTs1kr5KZnjZF/6N5hZFCjB2z3T0+RELjOLek1uoZRbLr74/FrtBBLIUMzTxMVvIJUW7+rxVxTmZSTJuzyChyhXhQRj1EslzfAkKe+KZuK5IUmE/MmseEi25FqUbUlCzC4Cic65GeQpaU/iPiEx4no3LUiYRYwkbHqYmE1FKxI08wLJKZOyT0zN+38k6hOSgR4WUb4VCbocGRL0JWRuDKTtSCZwmSGBq9nC6OqSRJYEnzKSyIA28ClYJjF6pUiHeert1xB6S3j6IhJx8+P/CapsKclp3qe73Rij40hwC5n4o8ABJCjtshXCSE55JjfBDuAQEpTZQQI7ArY0HUeCKPgcRRJuJZwhUA8kQT9gcJ4EwZnIa0USE0NikARfhRhuShqSzAYfpEgy5Dt/MJJrShJhlSaWBJM282ayKck8QqnjSLCQDkwKbksyba9sU/L7lWkMtyXp37aEV5EEyfNdCd0tmhqRdG9DBJnklj8EKLe7I4Htw4E6mdGgsa1GrAaZZNxYV+dDOxIoGykJHMxFEv9RF9IeRqIcSzLJJCrfwJiO7kjIb2wijJ0jEZPt/diOBApWOBRGkeSUC8fETEkjkjOkIolkIhaJI+lUQ5JI/pRI8DYXrqHqWpIYWPASSSL/8Ew5uaqWJB6GlkhUyMaP05iCW5IQv6IqIjEbS3q0hkq1JCFWQxmJK/1AsCkJCRYrkGBFGb+KxEGoSCTmZf5VJEpDqAgkI0ziZfwKkgkGFkhUwDfCMfSTpUoPt+xLAz0dwdUfkQxAkiJ4K3y+cSFTQq4FG68Lv3n4lMRnirpZ+eXtojPcB9a8TopzdsIz5n4SPI/1cD55TopmzhmwtO3W5xRYanRNErNpH15r5wYVnHs5dV1cZZztgLICSYpMR+Jh2cEo7PeSrvKUyCTYo8rvZLXPtbCZCtiXTkldEieZu5GNRa1Qt6IpCVVJcEAMGj4WbekHkPhWuDaJy1vLjUL5izvHhe25Bgnmmnz0o1IRcFFVnOuTTEwvCnQqAuGctUBZjQSDX49FARNNUpx6dkqqkmDwyw4OcXmhf+1sUry8DZsZot9LMuq1FFW6/vV/8XDonXroDwd3OfCOVCS+AAAAAElFTkSuQmCC); 
	 display: inline-block;
	 width:40px;
	 height: 15px;
	 background-size: 100% 100%;	
	 filter:brightness(1000%);

}


.top-logo{
	 text-align: center;
}

.logo-sm-height{
	 height: 80px
}

.navbar-expand-lg .navbar-nav .nav-link{
	 font-size: 16px;
	 color:#202a44;
	 padding-right:2.2rem;
	 padding-left: 2.2rem;
}

.navbar-expand-lg .navbar-nav .nav-link:hover{
	 color:#F19EB6;
}

 
.index_video{
    position: relative;
  }

.txt-top{
    position: absolute;
    width: 900px;
    height:auto;  
    left:18%;
    top:30%;
    z-index: 9;  
    cursor: pointer;
    transition: all .3s linear;
    color:#fff;
}
 
 .txt-top .desc{
 	 line-height: 30px;
 }

.top-menu-close-box{
	 position: absolute;
	 z-index: 999999999;
	 right:0;
	 top:0;
}
 .menu-box{
	 	 background: rgba(32,42,69,0.95);
	 	 z-index:99999;
	     left:0;
	     top:0;
	     width:100%;
	     height:100%;
	     position: fixed;
	     transition: all 1s;	
	     pointer-events:none;    
	     opacity: 0; 
	 }
 
.menu-box-on{
	left:0; 
	opacity: 1;
	 pointer-events:auto;
}

.menu-box-on a{
	pointer-events:auto;
}
  .menu-box-2menu{
        display: flex;
        flex-wrap: wrap;
        padding-left: 30px;
    }
   .menu-box-2menu a{
         width:auto;
         margin-right: 50px; 
         text-align: left;
         padding-top: 10px;
         font-size: 14px;
    }

.border-bottom-red{
     border-bottom:1px dashed #F19EB6;
}
.top-bar{
    display: none!important;
}

/*********首页Ad*************/

.left-right .list {
  width: 100%;    
  height: 50px; 
  position: relative;
  overflow: hidden;
}
 .left-right .list ul {
  position: absolute;
  top:0px;
  display: flex;
  left: 0;
}
 .left-right .list ul li {
  width: auto;
  display: inline-block;
   height: 50px;
  line-height: 50px;  
  transition: all 0.4s;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  flex-shrink: 0;
  margin: 0 30px;
  overflow: hidden;
}
 
.lh-50{
    line-height: 50px; 
}

/*******首页关于index_aboutbig**********/


.index_aboutbig{
	 overflow: hidden;
    position: relative;

}

.py-100{
	padding:100px 0;
}

.index_aboutbig2{
	padding:50px 0;
	 
}

.index_aboutbig .ab-desc{
	display: -webkit-flex; /* Safari */
	 display: flex;
	 align-items: center;
	 padding:50px;
	 padding-right: 150px;
	 height: 100%;
	 width:100%;  
	 overflow: hidden;
	  transition: all 0.6s;

}
.index_aboutbig .ab-desc .txt {
	 z-index: 2;
	  transition: all 0.6s;
}
.index_aboutbig .ab-desc .txt .title{
 
	 color:#202A44;
	 padding-bottom: 15px;
	 margin-bottom: 30px;
	 position: relative;
	  transition: all 0.6s;
}
.index_aboutbig .ab-desc .txt .title span{
	transition: all 0.6s;
}
 
.index_aboutbig .ab-desc .txt .content{	 
	 line-height:24px;
	 transition: all 0.6s;
}
 
.index_aboutbig .bg{
	 min-height: 720px;
	 height: 100%;
}

 
.imgborder{
	 border-radius: 6px 120px 6px 200px;
	 transition: all 1s;
	 overflow: hidden;
}

.imgborder:hover{
	 border-radius: 6px 6px 6px 6px;
}

.imgborder2{
	 border-radius:120px 6px 200px  6px ;
	 transition: all 1s;
}

.imgborder2:hover{
	 border-radius: 6px 120px 6px 200px;
}




 .books{
    color: #ffffff; 
    font-size: 14px;
    background: #202A44;
    padding: 14px 0;
    border-radius: 5px;
    cursor: pointer;
    width: 180px;
    text-align: center;
    box-sizing: border-box;
    border: none;
    display: inline-block;
    line-height: 21px;
    transition: all 0.6s;
}
 
 .books:hover{
 	 color:#fff;
 	 width:180px;
 }
 svg:not([fill]) {
    fill: currentColor;
}


.bg-color{	
	cursor: pointer;
}
.bg-color:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-radius: 50%;
    background-color: #F19EB6;
    transition: all 1s;
    z-index: 0;
}

.bg-color:hover::before {
  width: 15rem;
  height: 15rem;
  transform: scale(20);
  z-index: 0;
  color:#fff!important;
}
 
.bg-color:hover *{
	color:#fff!important;
}


.index_aboutbig3{
	 padding-top: 200px;
}
.index_aboutbig3:after{
	 background: url(../images/slant-right.svg) no-repeat;
    background-position: bottom;
    content: "";
    height: 100%;
    pointer-events: none;
    position: absolute;
    top: -1px;
    transform: rotateX(180deg);
    width: 100%;
}


/*******首页关于index_aboutbig********/







/*********首页关于剑桥大学一天游览公司*************/




/********首页服务列表************/
.index-server-box{
	 padding:0 50px;
}
.index-server-box-list{
	background: #EEF2F4;
	flex-direction: column;
    height: 100%;
}
.index-server-box-list .index-server{
	background: #f8f8f8;
	box-shadow: 5px 5px 5px #ddd;
	position: relative;
}

.index-server-box-list .index-server .bao{
    position: absolute;
    width:15%;
    z-index: 9;
    right:15px;
    top:15px;
}

.index-server-box-list .index-server .images{
	height: 250px;
	width:100%;
	overflow: hidden;
	position: relative;
}

.index-server-box-list .txt{
	 padding:8%;
}

.index-server-box-list .txt .pop i{
	color: #F19EB6;
}

.index-server-box-list .txt .desc{
	 line-height: 26px;
	 color:#333;
	 padding-bottom: 15px;
	 border-bottom: 1px solid #ddd;	  
}
.index-server-box-list .txt .btn-now{
	 display: inline-block;
	 padding:10px 30px;
	 background: #F19EB6;
	 color:#333;
	 font-size: 16px;

}

.index-server-box-list .txt .btn-now:hover{
	background:#CDB071
}
/********首页服务列表 end************/



/*********首页关于Punting撑船游览*************/

.index-Punting{
	display: -webkit-flex; /* Safari */
	 display: flex;
	 align-items: center;
	 padding:50px;
	 height: 100%;
	 width:100%;
}
.index-Punting .txt{
	 padding:100px 150px 100px 100px;
	 background: rgb(175,40,72,0.7);
	 transition: all  0.6s;
}
.index-Punting .txt:hover{
	 background: rgb(175,40,72,1);
}
.index-Punting .txt .title{
	 font-size:3rem;
	 color:#202A44;
	 padding-bottom: 15px;
	 margin-bottom: 30px;
	 position: relative;
}

.index-Punting .txt .content{
	 font-size: 16px;
	 line-height: 24px;
	 padding-right: 50px;
}
.index-Punting .txt .content p{
	margin-bottom: 10px;
}
.index-Punting-bg{
	 min-height: 600px;
	 height: 100%;
}

/*********首页关于Punting撑船游览end*************/

/*********首页两个服务按钮*************/

.ding-btn{
	 display: block;
	 text-align: center;
	 width:100%;
	 padding:10px 30px;
	 background: #F19EB6;
	 color:#fff;
	 font-size: 16px;

}

.ding-btn:hover{
	background:#CDB071
}

/********首页两个服务按钮end************/



/***********首页WHO WE ARE******************/

.index-who{
	background: #FFF;
	padding:0 0 100px 0;
}

.index-who .whoimg{
	 width:100%;
}

.index-who .whoimg img{
	 width:100%;
}


.shejiao{
	padding-top: 150px;
	overflow: hidden;
    position: relative;
    

}

.shejiao:before{	
	background: url(../images/slant-right2.svg) no-repeat;
    background-position: bottom;
    content: "";
    height: 100%;
    pointer-events: none;
    position: absolute;
    top: -1px;
    transform: rotateX(180deg) rotateY(180deg);
    width: 100%;
}

.bo-bottom{
	 height: 260px;
	 position: relative;
	 overflow:hidden;
} 
.bo-bottom:before{
	 background: url(../images/slant-right2.svg) no-repeat;
   background-position: bottom;
    bottom: 0;
    content: "";
    height: 100%;
    pointer-events: none;
    position: absolute;
    width: 100%;
}

.bo-bottom2{
	 height: 260px;
	 position: relative;
	 overflow:hidden;
} 
.bo-bottom2:before{
	 background: url(../images/slant-right2.svg) no-repeat;
   background-position: bottom;
    bottom: 0;
    content: "";
    height: 100%;
    pointer-events: none;
    position: absolute;
     transform: rotateX(0deg) rotateY(180deg);
    width: 100%;
}



#top-menu-close{
	 cursor: pointer;
}

/***********首页WHO WE ARE eND******************/

/*****内页BANNER1*******/

.page-num, .page-link{
	color:#202a44;
	padding:10px 20px;
}
.page-num-current{
	background-color: #202a44;
    border-color: #202a44;
    color:#fff;
}
a:hover{
	color:#202a44;
}

.top-head-sm-height{
	height: 0px;
}


.top-banner{
	height: 400px;
	position: relative
}

.top-product{
	height: 460px;
	position: relative;
	 
} 

.top-product-black{
	display: block;
	width:100%;
	height: 100%;
	background:rgba(0,0,0,0.3);
	display: -webkit-flex; /* Safari */
	display: flex;
	align-items: center;
	justify-content: center;
}
.top-product-txt{
	display: -webkit-flex; /* Safari */
	display: flex;
	align-items: center;
	justify-content: center;
	width:100%;
	height: 100%;
	color:#fff;
	 
}

/*****内页BANNER1*******/



/*****产品时间线*******/

.time-line{
	 display: -webkit-flex; /* Safari */
	 display: flex;
	 flex-direction: row;
	 flex-wrap: wrap;
     justify-content: space-around;
     padding:30px 0;
     font-family: "honor300";

     
}

.time-line .time-box{
	 text-align: center;
	  width:11%;
}
.time-line .time-box .img{
	 width:100px;
	 height: 100px;
	 border-radius: 50%;
	 background:#fff;
	 overflow: hidden;
	 margin:0 auto;
}
.time-line .time-box .img img{
 	width: 100%;
 	height: 100%;

}

.time-line .time-box .title{
	color:#fff;
	margin-top: 15px;
	font-size: 14px;  
}

 
.border-15{
	border-radius: 15px!important;
}
.border-50{
	border-radius: 50px!important;
}
.border-0{
    border-radius: 0!important;
}

/*****产品时间线*******/


/*****套餐内容*******/

.content-about{
	background: url(../images/shared2in13.jpg);
	    background-position: center center;
    background-size: cover;

}

.content-about-box{	
	background:rgba(255,255,255,0.8);
	padding:50px;
	border-radius: 30px;
	transition: all 0.6s;
}
.content-about-box:hover{
	 background:rgba(255,255,255,1);
}
.content-about-box .desc{
	 font-size: 16px;
	 line-height: 30px; 
	
}

.content-about-box .desc .num{
	 list-style-type:circle;
	 margin-left: 15px;
      
}
/*****套餐内容*******/

/*****关于Punting撑船游览*******/

.punting{
	 background: #fff;
	   background-position: center center;
    background-size: cover;
}

.punting .punting-box{
	 background:rgba(255,255,255,0.9);
	 padding:50px;
	 transition: all 0.6s;
	  border-radius: 30px;
	 overflow: hidden;
}

.punting .punting-box:hover{
	background:rgba(255,255,255,1);
	 cursor: pointer;
}

.p1-left{
	display: flex;
	align-items: center;
	height: 100%;
}

.p1-right{
	background: rgba(241,158,182,0.8);
	border-radius: 30px;
	padding:50px;
	transition: all 0.6s;
}
.p1-right:hover{
	background: rgba(241,158,182,1);
}
.about-app{
	background: rgba(255,255,255,0.7);
	border-radius: 30px; 
	transition: all 0.6s;
}

.about-app .app-box { 
    padding: 50px;
    transition: all 0.6s;
    border-radius: 30px;
    overflow: hidden;
}

.about-app:hover{
	 background: rgba(255,255,255,1);
}

.app-box{
    padding: 200px 0;
}

.app-store {
    display: flex;
    flex-flow: column;
    height: 100%;
    
    align-items: center;
}

.app-store .box-center {
    position: absolute;
    width: 100%;
    left: 0%;
    top: 0%;
}

.app-store .box-center a {
    display: inline-block;
    margin-right: 20px;
}

.app-store .box-center img {
    width: 120px;
}


/*****关于Punting撑船游览*******/

/*****关于导游的徒步学院游览*******/

.tourguide{
	 background: url(../images/sharedwalking4.jpg);
	   background-position: center center;
    background-size: cover;
}

.tourguide .tourguide-box{
	 background:rgba(255,255,255,0.9);
	 padding:50px;
	 transition: all 0.6s;
	  border-radius: 30px;
	 overflow: hidden;
}

.tourguide .tourguide-box:hover{
	 background:rgba(255,255,255,1);
	 cursor: pointer;

}

/*****关于导游的徒步学院游览*******/

/*****关于景点游览*******/

.Attractions{
	 background: url(../images/shared2in16.jpg);
	   background-position: center center;
    background-size: cover;
}

.Attractions .Attractions-box{
	 background:rgba(255,255,255,0.9);
	 padding:50px;
	 transition: all 0.6s;
	  border-radius: 30px;
	 overflow: hidden;
}

.Attractions .Attractions-box:hover{
	 background:rgba(255,255,255,1);
	 cursor: pointer;

}

/****关于景点游览*******/



.why-box{
	 display: block;
	 width: 100%;
	 height: auto; 
	 background: #eef2f4;
     text-align: center; 
     padding:30px 15px;
     border-radius: 15px;
     cursor: pointer;
     display: flex;
    flex-direction: column;
    height: 100%;
    transition: all 0.6s;
}
.why-box:hover{
	 background: #f19eb6;
}

.why-box .top-box{
	display: block;

}

.why-box .top-box .numbers{	 
	display: block;
	text-align: center; 
	font-size: 40px;
	font-weight: bold; 
	color:#fff; 
}
.why-box .top-box .numbers img{
	height: 50px;
}

.why-box .top-box .title{
	width:100%; 
	padding-top: 15px;
}

.why-box .desc{
	margin-top: 10px;
	line-height: 24px;
	font-size: 15px;
	color:#333; 
}


.share-foot{
	 background: #fff;
	   background-position: center center;
    background-size: cover;
}


.buy-btn{
	 display: inline-block;
	 padding:14px 0px;
	 width: 160px;
	 text-align: center;
	 color:#fff;
	 background-color:#202A44;
	 font-size: 16px;
	 font-weight: bold;
	 font-family: 'honor'; 
	 border-radius: 5px;
	 transition: all 0.6s;
}

.buy-btn:hover{ 
	color:#fff;
	width:180px;
}



.banner-btn{
	 display: inline-block;
	 padding:10px 30px;
	 text-align: center;
	 color:#FFF; 
	 font-size: 16px;
	 border-radius: 30px;
	 margin-right: 20px;
	 background: #202A44;
	 box-shadow: 1px 1px 1px #000;
	 font-family: "honor300";
}
.banner-btn:last-child{
	 margin-right: 0!important;
}

.banner-btn:hover{
	background-color:#f19eb6;
	color:#333;
	box-shadow: 1px 1px 1px #fff;
}


.btn-bgred{
    background-color:#f19eb6;
    box-shadow: 1px 1px 1px #fff;
    color:#FFF;
}


/*******景点列表**********/


.attractions-list{
	 

}

.attractions-list .divp0{
	  padding:0;
}


.attractions-list .attr-desc{
	display: -webkit-flex; /* Safari */
	 display: flex;
	 align-items: center;
	 padding:50px 50px 0px 0px;
	 height: 100%;
	 width:100%;

}
.attractions-list:nth-child(2n) .attr-desc{
     padding:50px 0 0 50px;
}

.attractions-list .attr-desc .txt .title{
	 font-size:2rem;
	 color:#202A44;
	 padding-bottom: 15px;
	 margin-bottom: 30px;
	 position: relative;
}

.attractions-list .attr-desc .txt .title:after{
	 content: '';
	 display: inline-block;
	 position: absolute;
	 left:0;
	 bottom:0;
	 width:100px;
	 height:4px;
	 background: #f19eb6;
}

.attractions-list .attr-desc .txt .content{
	 font-size: 16px;
	 line-height: 24px;
}
 
.attractions-list .bg{
	 min-height: 720px;
	 height: 100%;
}



.sort-imgbox{
	height: 340px;
}

.sort-imgbox img{
	 width:100%;
	 height: 100%;
}


.border-radius15{
	 border-radius: 15px;
	 overflow: hidden;
}

/*******景点列表END**********/


#icons{
	 padding-bottom:40px;
}

.swiper-pagination-icons{
	 bottom:0!important;
}


/******联系**********/

.contact .contact-list{
	height: 550px;
	width:50%;
	float: left;
}

.contact .contact-list .contact-box{
	 background: rgba(241,158,182,0.6);
	 height: 100%;
	 width:100%;
	 padding:10%;
	 color:#fff;
	 font-size: 16px;
	 line-height: 30px;
	 overflow: hidden;
    position: relative;
    cursor: pointer;
    z-index: 0;
}
.contact .contact-list .contact-box .txt{
	 z-index: 3;
	 position: relative;
}
.contact .contact-list .contact-box:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-radius: 50%;
    background-color: rgba(241,158,182,0.9);;
    transition: all 1s;
    z-index: 1;
}
.contact .contact-list .contact-box:hover::before {
  width: 15rem;
  height: 15rem;
  transform: scale(20);
  z-index: 1;
  color:#fff;
}
 
.contact .contact-list .contact-box:hover .txt{
	 color:#202A44;
}


.contact .contact-list:nth-child(2) .contact-box{
	  background-color: rgba(32,42,68,0.6);
}
.contact .contact-list:nth-child(2) .contact-box:before{	
	content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-radius: 50%;
    background-color: rgba(32,42,68,0.6);
    transition: all 1s;
    z-index: 1;
}

.contact .contact-list:nth-child(2) .contact-box:hover::before {
  width: 15rem;
  height: 15rem;
  transform: scale(20);
  z-index: 1;
  color:#fff;
}

.contact .contact-list:nth-child(2) .contact-box:hover .txt{
	color:#FFF;
}

.drive-car{
	
}


.drive-bg{
	width:100%;
	height: 100%;
	background: rgba(0,0,0,0.5); 
	padding:100px 0;
	padding-top: 400px;
}
.drive-bg2{
	 background: rgba(255,255,255,0.9); 
}


.drive-bglast{
 	border-radius: 20px;
 	overflow: hidden;
}


.bus-to{
	 padding:0  0px;
}
.bus-list{
	background:rgba(255,255,255,0.9);
	overflow: hidden;
	border-radius: 20px;
	height: 100%;
}

.bus-list .top-img{
 
	 transition: all 0.6s;
	 overflow: hidden;
}
.bus-list .top-img img{
 transition: all 0.6s;
}
.bus-list .top-img:hover img{
	  transform: scale(1.1); 
}
.bus-list .txt-box{
	padding:40px 20px;
}

.bus-list .txt-box .content{
	 font-size: 16px;
}

.bus-list .txt-box .content a{
	color:#F19EB6;
	font-weight: bold;
}






/********asklist**********/

.ask-desc{
	 padding: 20px;
    background: #FDFCFA;
    border-radius: 5px;
    border: 1px solid #F2EEE6;
    margin: 20px 0 0px;
    position: relative;
}

.accordion{
	 padding:30px 15px;
	 border: 1px solid #F2EEE6;
}

.card-header{
	background:#fff;
  border: none;
}

 .card{
  border:none;
  margin-bottom: 20px;
 }

.ask{
 	
	color:#202a44;
	cursor: pointer;
	display: block;
	width: 100%;
	height: 100%; 
}
.card-header:hover .ask{
	 color:#333;
	  font-weight: bold;
}
.ask-end{
      padding: 20px;
    background: #EEf2f4;
    border-radius: 5px;
    border: 1px solid #EEf2f4;
    margin: 20px 0 0px;
    position: relative;
    color:#333;
}
 
 
.ask-end:after, .ask-end:before {
  bottom: 100%;
  left: 6%;
  border: solid transparent;
  content: "";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.ask-end:after {
  border-color: rgba(136, 183, 213, 0);
  border-color: transparent;
  border-bottom-color: #EEf2f4;
  border-width: 15px;
  margin-left: -15px;
}

.ask-end:before {
  border-color: rgba(194, 225, 245, 0);
  border-color: transparent;
  border-bottom-color: #EEf2f4;
  border-width: 17px;
  margin-left: -17px;
}


/********asklist* end*********/


/********newslist**********/


.content-list-box .c-box {
	overflow:hidden;
	margin-bottom:30px;
	background: #eef2f4;
}
.content-list-box .row>[class*='col-'] {
	display:-webkit-box;
	display:flex;
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	flex-direction:column;
	}
.content-list-box .text-box {
		padding:20px;
}
.content-list-box .text-box .desc{
	height: 124px;
	overflow:hidden;
}
.content-list-box .c-box .imgbox {
	overflow:hidden;
	position:relative;
	height:280px;
	background: #f2f2f2;
}
.content-list-box .c-box .imgbox img {
	float:none;
	height:auto;
	width:100%;
	position:absolute;
	-webkit-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	transform:translateY(-50%);
	top:50%;
	left:0;
}
.content-list-box img {
	float:left;
	width:100%;
	-webkit-transition:all 0.5s;
	transition:all 0.5s;
}
.content-list-box .text-box {
	width:100%;
	float:left;
	text-align:left;
	padding:15px;
	background-color:#f8f8f8;
	position:relative;
	z-index:2;
	overflow:hidden;
}
.content-list-box .text-box h4 {
	font-size:18px;
	line-height:30px;
	height:30px;
	color:#333;
	margin:0;
	margin-bottom:10px;
	overflow:hidden;
	position:relative; 
	font-family: "honor";
}
.content-list-box .c-box:hover img {
	-webkit-transform:scale(1.05);
	-ms-transform:scale(1.05);
	transform:scale(1.05);
}
.content-list-box .c-box:hover .text-box {
	background:#f2f2f2;
	color:#202a44;
}


.newsbanner{
	width:100%;
	height: 100%;
	display: block;
	position: relative;
	overflow-y: hidden;
}

.news-content{
   
}
.news-content .title{
	font-size: 30px;
	font-weight: bold;
	display: block;
	width: 100%;
	color:#333;
}
.news-content .date{
	width: 100%;
	font-size: 16px;
	color:#adadad;
}
.news-content-content{
	min-height: 100px;
}
.news-content-content img,.news-content-content p img{
	max-width: 100%;
}
 
.news-line{
	width: 100%;
	height: 1px;
	background: #ddd;
	margin-top: 20px;
	position: relative;
	text-align: center;
}

.news-line .news-ico{
	position: absolute;
	z-index: 99;
	top:-20px;
	background: #fff;
	width: 240px;
	height: 40px;
	left:50%;
	margin-left: -120px;
}

.news-line .news-ico span{
	margin-right: 15px;
	margin-left: 15px;
	color:#666;
}

.news-line .news-ico span a{
	color:#666;
	position: relative;
}

.news-line .news-ico span #newsweixin{
	position: relative;
}
.news-line .news-ico span #newsweixin:hover .newsweixin{
	display: block;
}
.news-line .news-ico span #newsweixin .newsweixin{
	position:absolute;
	width: 200px;
	height: 220px;
	left:-75px;
	top:30px;
	z-index: 999;
	display: none;
	    border: 1px solid rgb(238, 238, 238);
    background-color: rgb(255, 255, 255);
    box-shadow: rgb(170 170 170) 0px 2px 10px;
}
.news-line .news-ico span #newsweixin .newsweixin img{
	width: 138px;
}


.more{
	padding: 0 30px;  
    text-align: center;
    border: 1px solid #595757;
    display: inline-block;
    color: #111;
    padding-left: 20px;
    padding-right: 20px;
    font-size: 16px;
	 min-width: 170px;
    height: 40px;
    line-height: 38px; 
}
.more:hover{
	background: #202a44;
	border-color:#202a44;
	color:#fff;
}



.content-list-box .c-box:hover .imgbox img {
		-webkit-transform:translateY(-50%);
		-ms-transform:translateY(-50%);
		transform:translateY(-50%);
		left:0;
		top:50%;
		width:105%;
	}
		.content-list-box .c-box:hover .imgbox img {
	-webkit-transform:translateY(-50%) scale(1.05);
	-ms-transform:translateY(-50%) scale(1.05);
	transform:translateY(-50%) scale(1.05);
	left:0;
	top:50%;
	width:100%;
	height:auto;
	}


/*******newslist end*************/






/********************/

.online{
	right:0;
	width:60px;
}
.online dl{
	background: #1d1d1d;
}
.online dl dd{
     font-size: 8px;
}
.online dl:hover{
	background: #1d1d1d;
}

.online dl dt{
    right:60px;
}



.navbar-brand{
	margin-right: 0;
}

.navbar-text{
	 padding-top: 0;
	 padding-bottom: 0;
}


.navbar-expand-lg .navbar-collapse{
	 display: none!important;
}


.navbar-expand-lg  .d-flex-menu{
	 display: flex!important;
}


.menu-leftbox{
	 padding-top: 3rem!important;
}

.c-switch-wrap{display:flex;align-items:center;line-height:26px;}
.c-switch-box{display:flex;align-items:center;cursor:pointer;line-height:26px;}
.c-switch-box p span:last-child{display:none;}
.c-switch-box p span{transition:0.5s;}
.c-switch-box:hover p span{color:#005f61;}
.c-switch-wrap .c-phone{border-left:1px solid #999;margin-left:30px;padding-left:30px;line-height:16px; font-size: 16px;}
.c-switch-box p span:last-child{display:none;}
.c-switch{position:relative;margin-right:10px;width:20px;height:14px;}
.c-switch i{position:absolute;display:block;height:2px;width:100%;background:#333;-webkit-transition:all 0.3s;transition:all 0.3s;}
.c-switch-box:hover .c-switch i{background:#005f61;}
.c-switch i:nth-child(1){top:0;}
.c-switch i:nth-child(3){bottom:0;}
.c-switch i:nth-child(2){top:50%;margin-top:-1px;}


#top-menu{
	 color:#202a44; 
}
 
 

.cart{
	color:#202a44!important; 
    font-size: 16px;
    background:rgba(255,255,255,0);
    padding: 14px 0;
    border-radius: 5px;
    cursor: pointer;
    width: 160px;
    text-align: center;
    box-sizing: border-box;
    border: none;
    display: inline-block;
    line-height: 21px;
    transition: all 0.6s;
}
.cart i{
	 position: absolute;
	 content: '';
	 top:1px;
	 right:20px;
	 z-index: 9;
}
.cart:hover{
	 background: #F19EB6; 
}

.form-group{
    position: relative;
    margin-bottom: 20px;
}

.form-group label{
    position: absolute;
    background: #fff;
    padding:0 10px;
    left:10px;
    top: -15px;
}

.form-control{
	 height: 48px;
	 line-height: 48px;
	 padding:.375rem 0rem;
}
.form-control:focus{
	outline: none;
	color: #495057;
    background-color: #fff;
    border-color:#AA2746;
    outline: 0;
    box-shadow: none;
}
.message-btn{
	width:100%;
	height: 48px;
	line-height: 40px;
	font-size: 16px;
	color:#fff;
	background:#202A44;
	text-align: center;
	outline: none;
	border: none;
}
.message-btn:hover{
	 background:  #333;
}






/*********footer*************/

.footer{
	background:#293556;
}

.foot-time{
	line-height: 26px;
}

.foot-time strong{
	 color:#AF2848;
	 margin-bottom: 15px;
	 display: inline-block;
}

.foot-icos{
   display: flex;
}

.foot-icos .icos{
	display: inline-block;
	width:40px;
	height:40px;
	overflow: hidden;
	background: #F19EB6;
	margin-right: 10px;
	text-align: center;
	position: relative;
	border-radius: 50%;
}

.foot-icos .icos img{
	width:100%;
}

.foot-icos .icos i{
	 font-size: 24px;
	 color:#FFF;
	 margin-top:8px;
	 display: inline-block;
}

.foot-icos .icos:hover i{
	color:#000;
}

.foot-icos .icos2{
	display: inline-block;
	width:40px;
	height:40px;
 	background: #f19eb6;
	margin-right: 10px;
	text-align: center;
	position: relative;
	border-radius: 50%;

}
.foot-icos .icos2 img{
	width:100%;
}

.foot-icos .icos2 i{
	 font-size: 30px;
	 color:#FFF;
	 margin-top: 5px;
	 display: inline-block;
}


.foot-icos .icos2 .ewm{
     position: absolute;
     left:0;
     bottom:40px;
     z-index: 99;
     width:150px;
     display: none;
}
.foot-icos .icos2 .ewm img{
     width:100%;
}

.foot-icos .icos2:hover .ewm{
     display: block;
}

.copyright{
	 background: #202A44;
	 color:#fff;
	 padding:15px 0;
}



.foot-nav-box .foot-nav{
	 color:#fff;
	 width: 50%;
	 float: left;
}

.foot-phone a{
	 color:#fff;
}



.footlogo{
     filter:grayscale(100%)brightness(200%)
}







/********弹出窗口************/

.top-yuding{      
     width: 100%;
    height: auto;
    min-height: 100%;
    background: #F19EB6;
    position: fixed;
    left: 0%;
    top: 0%;
    margin-left: 0px;
    margin-top: 0px;
    z-index: 999999999999999;
    text-align: left;
    display: none;
    overflow-y: scroll;
}
.yuding-box{
    width: 1000px;
    height: auto;    
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -500px;
    margin-top: -300px;
    background: #202a44;
    overflow-y: visible;
    padding:50px 20px;
    border-radius: 20px;
}
#yudingclose{
   position: absolute;
   right:5px;
   top:5px;
   z-index: 999;
   cursor: pointer;
}




.regiondo-form-hint {
    visibility:hidden;
}
.regiondo-form-hint:before {
    content:'我们的系统无法侦测某些中国电子邮件，如 qq/sina/163。请使用 gmail/outlook/yahoo 或大学信箱。Unfortunately our system cannot detect some chinese emails such as qq/sina/163. Please use gmail/outlook/yahoo or university email.';
    visibility:visible;
    display:block;
    position:relative;
    top:10px;
    font-weight:bold;
}
[aria-label="regiondo-icon"] {
    display:none;
}
.regiondo-catalog-list {
    justify-content:center;
}
.regiondo-note:before {
    content:' Groups with any number of students:Use code "STUDENT" for a 10 percent discount. Groups with children:Enter "CHILD" followed by the number (e.g.,"CHILD1" for 1 child). Group with both students and children,use "CHILD" followed by the number of children for the highest discount. 有学生的团体：使用代码“STUDENT”可享 10% 的折扣。有儿童的团体：输入“CHILD”，后面跟着数字（例如，“CHILD1”代表 1 个儿童）。包含学生和儿童的团体，请使用“CHILD”，后面跟着儿童人数以获得最高折扣。';
    visibility:visible;
    display:block;
    position:relative;
    top:10px;
    font-weight:bold;
    padding-bottom:20px;
}

 



/*******水波**********/




 .water-group {
                position: relative;
                height: 110px;
                width: 100%;
                overflow: hidden;
            }

            .water-group .water {
                position: absolute;
                width: 200%;
                height: 100%;
                background-size: 50% 100%;
            }

            .water-group .water1 {
                top: 20px;
                left: -100%;
                opacity: 0.2;
                animation: water-right 20s infinite linear;
            }

            .water-group .water2 {
                top: 30px;
                left: 0;
                opacity: 0.3;
                animation: water-left 30s infinite linear;
            }

            .water-group .water3 {
                top: 44px;
                left: -100%;
                animation: water-right 40s infinite linear;
            }
            

.water-group2 {
                position: relative;
                height: 70px;
                width: 100%;
                overflow: hidden;
   }

.water-group2 .water {
                position: absolute;
                width: 200%;
                height: 100%;
                background-size: 50% 100%;
            }

.water-group2 .water1 {
                top:10px;
                left: -100%;
                opacity: 0.2;
                animation: water-right 20s infinite linear;
            }


            

            @keyframes water-right {
                0% {
                    transform: translateX(0) translateZ(0) scaleY(1)
                }

                50% {
                    transform: translateX(25%) translateZ(0) scaleY(0.85)
                }

                100% {
                    transform: translateX(50%) translateZ(0) scaleY(1)
                }
            }

            @keyframes water-left {
                from {
                    transform: translate(0%, 0px);
                }

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


/*******水波**********/



/*******水波222**********/




 .water-group-top {
                position: relative;
                height: 110px;
                width: 100%;
                overflow: hidden;
                background: #EEF2F4;
            }

 .water-group-top .water {
                position: absolute;
                width: 200%;
                height: 100%;
                background-size: 50% 100%;
            }

 .water-group-top .water1 {
               bottom: 20px;
                left: -100%;
                opacity: 0.2;
                animation: water-right-top 20s infinite linear;
            }

 .water-group-top .water2 {
                bottom: 30px;
                left: 0;
                opacity: 0.3;
                animation: water-left-top 30s infinite linear;
            }

 .water-group-top  .water3 {
               bottom: 44px;
                left: -100%;
                animation: water-right-top 40s infinite linear;
            }
            
            

 .water-group-top2 {
                position: relative;
                height: 70px;
                width: 100%;
                overflow: hidden;
                background: #EEF2F4;
            }

 .water-group-top2 .water {
                position: absolute;
                width: 200%;
                height: 100%;
                background-size: 50% 100%;
            }

 .water-group-top2 .water1 {
               bottom: 10px;
                left: -100%;
                opacity: 0.2;
                animation: water-right-top 20s infinite linear;
            }            

            @keyframes water-right-top {
                0% {
                    transform: translateX(0) translateZ(0) scaleY(1)
                }

                50% {
                    transform: translateX(25%) translateZ(0) scaleY(0.85)
                }

                100% {
                    transform: translateX(50%) translateZ(0) scaleY(1)
                }
            }

            @keyframes water-left-top {
                from {
                    transform: translate(0%, 0px);
                }

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


/*******水波**********/


/*******首页视频*********/
.video-max{
	 max-width: 400px;
	 margin:0 auto;
	 width:400px;
}






 .popup {
            display: none;
            position: fixed;             
            z-index: 9999;
            width:100%;
            height: 100%;
            background: rgba(0,0,0,0.9);
            text-align: center;
            left:0;
            top:0;
        }

.popup .index-video{
	 position: absolute;
	 top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);  
     height:80vh;  

}
.popup .index-video video{
	 max-height: 80vh;
}
 

.close-button {
    position: absolute;
    top: 5px;
    right: 5px;
    cursor: pointer;
    padding: 5px;  
    font-size: 20px; 
    z-index: 99999;
    width: 30px;
    height: 30px;
    background: #f19eb6;
    color:#fff;
    border-radius: 50%;
    line-height: 22px;
}


.index-video-list .title{
	 height: 30px;
	 line-height: 30px;
}

.image-link{
	 display: inline-block;
	 width:100%;
	 height: calc(100% - 30px);
	 position: relative;
	 background: #FFF;
	 border-radius: 15px;
	 overflow: hidden;
}
.image-link img{
	 width:100%;
	 height: 100%;
	 transition: all 0.6s;
}
.image-link:hover{
	background: #000;
}
.image-link:hover img{
	opacity: 0.4;
}

.image-link .play-btn{
	 position: absolute;
	 top:50%;
	 left:50%;
	 transform: translate(-50%, -50%);  
	 z-index: 99;
	 color:#fff;
	 font-size: 50px;
	 opacity: 0;
}

.image-link:hover .play-btn{
	  opacity: 1;
}



#indexv1{ 
	 margin-top: 50px;
}



/*******首页视频*********/


/*******二级菜单 *********/

.menu2{
   font-size: 16px;
   line-height: 40px;
   display: inline-block;
   padding:10px 20px;
   color:#fff;
}

.menu2-on{
   background: #FFF;
   color:#333;
}
.menu2:hover{
    background: #FFF;
   color:#333;
}

.menu2top{
   width:100%;

} 
.fxied-menu2{
   position: fixed;
   top:100px;
   z-index: 99;
   border-top: 1px solid #ddd;
}

/*******二级菜单 *********/






.product-list-new{
	  width:100%; 
	  height:100vh;
	  position: relative;
}

.product-list-new .content-box{
	 position:absolute;
	 left:0;
	 top:0;
	 width:100%;
	 height: 100%;
	 z-index: 5;
	 display:flex;
}





.product-list-new .content-box{
	display: -webkit-flex; /* Safari */
	 display: flex;
	 align-items: center;	  
	 height: 100%;
	 width:100%;

}

.product-list-new .content-box .txt2{	 
	 width:1000px;
	 background:rgba(255,255,255,0.8);
     display: block;
     padding:50px;
     border-radius:100px 0 100px  0px;
     transition: all 0.6s;
     opacity: 1;
     cursor: pointer;

}
.product-list-new .content-box .txt2:hover {
	  background:rgba(255,255,255,1);
}

.product-list-new .content-box .txt2 .title{
	 font-size:2rem;
	 color:#202A44;
	 padding-bottom: 15px;
	 margin-bottom: 30px;
	 position: relative;
}


.product-list-new .content-box .txt2 .title:after{
	 content: '';
	 display: inline-block;
	 position: absolute;
	 left:0;
	 bottom:0;
	 width:100px;
	 height:4px;
	 background: #F19EB6;
}

.product-list-new .content-box .txt2 .title i{
	 cursor: pointer;
}

.product-list-new .content-box .txt2 .content{
	 font-size: 16px;
	 line-height: 30px;
}
.product-list-new .content-box .txt2 .content p{
	margin-bottom: 10px;
}
 






/********新闻列表*************/

 .news-list{
         display: block;
         width:100%;   
         margin-bottom: 100px;  
      }

      .news-list  .list{
           position:relative; 
           width:50%;
           height: 500px;

      }

      .news-list .list .picture{
          position: absolute;
          bottom: 100px;
          right:0;
          z-index:2;
          width:100%; 
          height: 400px;
          overflow-y: hidden;
      }

       .news-list .list .mydesc{
            position: absolute;
            top:100px;
            left:0;
            z-index:2;
            width:100%; 
            padding:70px 100px;
            font-size: 18px;
            background: #EEF2F4;
       }

       .news-list .list .mydesc i{
          transition: all 0.3s
       }

       .news-list .list .mydesc i:hover{
            margin-left: 5px;
       }







#Robust{
	 height: 300px;
}

#Robust .swiper-slide{
	 width:auto;
}

#Robust .swiper-slide  .robust-img{
    height: 100%;
    width:auto;
	}


.arrow-left {
  background:url(../images/banner_arrow8.png) no-repeat left top;
  position:absolute;
  left:-5px;
  top:50%;
  margin-top:-35px;
  width:70px;
  height:70px;
  z-index:999;
  cursor: pointer;
}
.arrow-right {
  background:url(../images/banner_arrow8.png) no-repeat left bottom;
  position:absolute;
  right:-5px;
  top:50%;
  margin-top:-35px;
  width:70px;
  height:70px;
  z-index:999;
  outline:none;
  cursor: pointer;
}













#custom{
   position: relative;  
   height: 700px;
   overflow: hidden;
   font-family: "honor300"
}
#custom .custom-txt{
    position:absolute;
    top:50px;
    left:0;
    width:100%;
    z-index: 99;
    text-align: center;
}
 

.container-txt{
   max-width: 1000px!important;
}



.more-white{
   color:#fff;
}

#custom .swiper-wrapper .swiper-slide{
   position: relative;
}
#custom .swiper-wrapper .swiper-slide .swiper-mask{
    position: absolute;
    width:100%;
    height: 100%;
    left:0;
    top:0;
    background: rgba(0,0,0,0.5);
    text-align: center;
}
#custom .swiper-wrapper .swiper-slide .swiper-mask  .mask-box{
    position: relative;
    width:100%;
    height: 100%
}
#custom .swiper-wrapper .swiper-slide .swiper-mask  .mask-box  .position-box{
    left:50%;
    top:50%;
    position: absolute;
    transform: translate(-50%,-50%);

}

.custom-txt .swiper-pagination-custom .swiper-pagination-bullet{
   width: auto;
   height: auto;
   display: inline-block;
   margin: 0 20px;
   background: rgba(0,0,0,0);
   border-radius: 0;
   color:#fff;
   font-size: 18px;
   opacity: 1;
   padding-bottom: 10px;
}

.custom-txt .swiper-pagination-custom .swiper-pagination-bullet-active{
   font-weight: bold;
   border-bottom: 2px solid #fff;
}










.product2-container{
	 margin-top:50px;
}
 

 .product2-list{
         display: block;
         width:100%;   
         margin-bottom:150px;  
      }

.product2-list  .list{
           position:relative; 
           width:100%;
           height:500px;

}

.product2-list .list .picture{
          position: absolute;
          top:0;       
          left:0;
          z-index:2;
          width:70%; 
          height:500px;
          border-radius: 15px;
          overflow: hidden;
}
.product2-list .list .picture img{
      	transition: all 0.6s;
 }

.product2-list .list .picture:hover img{
      	 transform:scale(1.1);
 }

 .product2-list .list .mydesc{
            position: absolute;
            bottom:-100px;
            left:60%;
            z-index:2;
            width:40%; 
            font-size: 18px;            
            min-height: 380px;
       }
        .product2-list .list .mydesc .txt-box{
        	 overflow: hidden;
	       position: relative;
	        z-index: 1;	    
            padding:70px 100px;
            background: rgba(238,242,243,0.95);
            border-radius: 20px;
            box-shadow: 4px 4px 4px #ddd;
        }
.product2-list .list .mydesc .txt-box i{
	color:#F29EB5;
}
        .product2-list .list .mydesc .txt-box::before {
    content: '';
    position: absolute;
    background:#F29EB5;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: -1;
    transform: scaleY(0);
    transform-origin: 50% 100%;
    transition: transform .4s ease-out;
}

.product2-list .list .mydesc .txt-box:hover::before {
    transform-origin: center top;
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
}

.product2-list .list .mydesc .txt-box:hover,.product2-list .list .mydesc .txt-box:hover .title a,.product2-list .list .mydesc .txt-box:hover .desc,.product2-list .list .mydesc .txt-box:hover i{
    color:#FFF;
    cursor: pointer;
}
 


.delighter.right { transform:translate(-100%); opacity:0; transition: all .75s ease-out; }
.delighter.right.started { transform:none; opacity:1; }

.delighter.left { transform:translate(100%); opacity:0; transition: all .75s ease-out; }
.delighter.left.started { transform:none; opacity:1; }





.productivity{
	margin-top: 30px;
	position: relative;
}
.swiper-slide-productivity{
	width:1140px;
}
.swiper-slide-productivity a{
	transition: 0.2s;
	position: relative;
	display: block;
	border-radius: 25px;
	overflow:hidden;
}	
 
.swiper-slide-productivity a .desc{
	 position: absolute;
	 left:0;
	 top:0px;
	 z-index: 99;
	 padding:0px 50px;
	 
}

.swiper-pagination-productivity{
	text-align:center;
	width:100%;
	margin-top:10px; 	
	margin-top: 50px;
	position: relative;
}

.swiper-pagination-productivity .swiper-pagination-bullet {
    width: auto;
    display: inline-block;
    margin:0 15px;
    padding-bottom: 10px;
    height: auto; 
	background: none;
	font-size: 18px;	
	opacity: 0.8;
	border-radius: 0;
	font-weight: bold;
}
.swiper-pagination-productivity   .swiper-pagination-bullet-active{
	 border-bottom: 3px solid #202A44;
	 font-weight: bold;
}
.swiper-button-prev-productivity{
	width:50%;
	height:520px;
	left:-520px;
	top:0;
	background: url(../images/ichimatsu.png) repeat 0 0;
    border-radius: 5px;
	margin-top:0;
	z-index:99;
	transition: 0.2s;
 }	
.swiper-button-prev-productivity:before{	
    content: '';
    position: absolute;
    width: 100px;
    height: 100%;
    background: url(../images/slide_prev.png) no-repeat 0 center;
    left: 84%;
    top: 50%;
    margin-top: -130px;
}
.swiper-button-next-productivity{
	width:50%;
	height:520px;
	right:-520px;
	top:0;
	background: url(../images/ichimatsu.png) repeat 0 0;
    border-radius: 5px;
	margin-top:0;
	z-index:99;
	transition: 0.2s;
	}
.swiper-button-next-productivity:after{	
    content: '';
    position: absolute;
    width: 100px;
    height: 100%;
    background: url(../images/slide_prev.png) no-repeat 0 center;
    right: 84%;
    top: 50%;
    margin-top: -130px;
	transform: rotate(180deg);
}
.swiper-button-prev-productivity:hover,.swiper-button-next-productivity:hover{
	opacity:0.6;
}

.swiper-slide-productivity a   .desc{
	display: none;
}
.swiper-slide-active a .desc{
	width:100%;
	height: 100%;
	background:rgb(0,0,0,0.7);
	display: flex;
	align-items: center;	
	color:#fff; 
	transition: all 0.6s;
}
.swiper-slide-active a .desc .content-box{
     padding:20px;
     border-radius: 15px;
}
.swiper-slide-productivity a .desc .txt{
	 width:100%;
	 display: block;
	 line-height: 24px;
	 font-size: 15px;
}

.swiper-slide-active:hover{
	 opacity: 1;
}
.swiper-slide-active:hover  a .desc{
   color:#fff;
}
.swiper-slide-active:hover a .desc .content-box{	 
	background:rgb(121,200,210,0.9);
	color:#fff;
	 
}
.swiper-slide-active:hover a .desc{
    	background:rgb(0,0,0,0.0);
}
.swiper-slide-active:hover a .desc .more-btn{
	 border-color:#333;
	 background: #333;
}

.swiper-pagination-productivity .swiper-pagination-bullet:nth-child(2){
     color:#f19eb6;
}
.swiper-pagination-productivity .swiper-pagination-bullet:nth-child(3){
     color:#C19B55;
}
.swiper-pagination-productivity .swiper-pagination-bullet:nth-child(4){
     color:#BD3C3D;
}










 .marry-box{
	 	 width:100%;
	 	 height: auto;
	 	 position: relative;
	 }
	 .marry-box .text-box{
	 	 position: absolute;
	 	 left:0%;
	 	 top:0%;
	 	 width:100%;
	 	 height: 100%;	 	 	 	 
		 z-index: 99;
		  display: flex;
		  align-items: center; 
		 
	 }
	 .marry-box .text-box .txt-center{
	 	background: rgba(255,255,255,0.8);
	 	padding:30px;
	 	border-radius: 20px;
	 	max-width: 700px;	 
	 	cursor: pointer;	
	 	margin-left: -1400px;
	 	transition: all 0.6s; 
	 }
	 .marry-box .text-box .txt-center .title{
	 	 color:#202a44; 
	 }
	 .marry-box .text-box .txt-center .title i{
	 	 color:#f19eb6;

	 }
	 .marry-box .text-box .txt-center .desc{	
	 	 height:auto;
	 	overflow-y: hidden;
	 	transition: all 0.6s;
	 }
	 .marry-box:hover .text-box .txt-center{
	 	margin-left: 0;
	 	cursor: pointer;
	 }
	 
	 .marry-box .text-box .txt-center:hover .desc{	 	
	 	 height:auto;
	 }



	.swiper-pagination-banner .swiper-pagination-bullet{
         width:15px;
         height: 15px;
	 }

	.swiper-pagination-banner .swiper-pagination-bullet-active{
	 	   background: #202a44;
	 }












.cooperate-list{
    padding:15px;
   border-radius: 20px;
    overflow: hidden;
    position: relative;
    z-index: 1;
       cursor: pointer; 
    
    }
.cooperate-list .ico img{
  max-width: 50px;
}    

.cooperate-list .desc{
    height: 60px;
    line-height: 30px;
}
.close-btn{
     padding-top:20px;
}


.close-btn .jian,
.close-btn-team .jian{
    display: none;
}


.mycontent{
      height: 120px;
     transition: all 0.6s;
     overflow: hidden;
     padding:5px 0; 
    transition: height 0.3s ease-out;
}

.h-content{
    height: auto;
}

 
	
.list-ul,
.list-ul2,
.list-ul3{
	display: flex;
	flex-wrap: wrap;
}

.list-ul li{
	width: calc(20% - 20px);
}

.list-ul2 li{
	 width: calc(50% - 20px);
}


.list-ul3 {
  list-style: none;
  padding-left: 0; 
}
.list-ul3 li{
	 width: calc(32% - 20px);
	 margin-left: 1.3%;
	 border:1px solid #fff;
	 padding:15px;
	 text-align: center;
	 margin-bottom: 20px;
    list-style: none;
    background: var(--colorjin);
    color:#fff;
}
.list-ul3 li:hover{
	  background: var(--colorblue);
}
 

.bg-color2{	
	cursor: pointer;
	 transition: all 1s ease-in-out;
}
.bg-color2:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-radius: 50%;
    background-color: #1A2941;
    transition: all 1s;
    z-index: 0;
}

.bg-color2:hover::before {
  width: 10rem;
  height: 10rem;
  transform: scale(20);
  z-index: 0;
  color:#fff!important;
}
 
.bg-color2:hover *{
	color:#fff!important;

}

#team{
	 padding-bottom: 50px;
}

.team-top{
	 position: relative;	 
}

.team-top .team-top-txt{
	position: relative;
	width: 100%;
	height: 400px;
	z-index: 1;
	left:0;
	
}
.team-top .team-top-txt .team-txt{
	 background: rgba(255,255,255,1);
	 padding:50px 30px;
	 border-radius: 50px;
}

.teamlist{
	 border:1px solid #ddd;
	 position: relative;
	 overflow: hidden;
	 background: #fff;
}

.teamlist .txt{
	 padding-right:15px;
}

.teamlist:hover{
	 background: 
}


.teamlist .team-ico{
	overflow: hidden;
}

.teamlist .team-ico img{
	 transition: all 0.6s ease-in-out;
}

.teamlist:hover .team-ico img{
	 transform: scale(1.2);
}




.team-prev{
	width:0;
	height:440px;
	left:0px;
	top:0;
	background: url(../images/ichimatsu.png) repeat 0 0;
    border-radius: 5px;
	margin-top:0;
	z-index:99;
	transition: 0.2s;
 }

.team-prev:before{	
    content: '';
    position: absolute;
    width: 100px;
    height: 100%;
    background: url(../images/slide_prev.png) no-repeat 0 center;
    left: 84%;
    top: 50%;
    margin-top: -130px;
}

.team-next{
	width:0%;
	height:440px;
	right:0px;
	top:0;
	background: url(../images/ichimatsu.png) repeat 0 0;
    border-radius: 5px;
	margin-top:0;
	z-index:99;
	transition: 0.2s;
	}

.team-next:after{	
    content: '';
    position: absolute;
    width: 100px;
    height: 100%;
    background: url(../images/slide_prev.png) no-repeat 0 center;
    right: 84%;
    top: 50%;
    margin-top: -130px;
	transform: rotate(180deg);
}

.team-prev:hover,.team-next:hover{
	opacity:0.6;
}




.title-line{
	position: relative;
	padding-bottom: 10px;
	cursor: pointer;
}

.title-line:after{
	 content: '';
	 width:70px;
	 height: 5px;
	 background:#CDB071;
	 position: absolute;
	 bottom:0;
	 left:0;
	 z-index: 9;
	 transition: all 0.6s ease-in-out;
}
.team-top-txt:hover .title-line{
	 color:#CDB071;
}

.title-line:hover:after{
	 width:100%;
}




    .swiper-slide-teamlst{
      text-align: center;
      font-size: 18px;
      background: #fff; 
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
    transition: 300ms;
    transform: scale(0.8);
    }
  #team .swiper-slide-active,
  #team .swiper-slide-duplicate-active{
      transform: scale(1.2);
  } 
  .team-prev,
  .team-next{
     top:calc(50% - 350px);
  }



 /********新手机端导航*************/
li{
	 list-style: none;
}
/* 公共居中类（如无使用可移除） */
.middle {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

/* 侧边菜单容器 */
.s-side {
  width: 100%;
  top: 70px;
  left: 0;
  bottom: 0;
  padding: 10px;
}

/* 一级菜单样式 */
.s-side .first {
  padding:10px 0;
  border-bottom: 1px dashed rgba(205,176,113,0.5);
}
.s-side .first a:hover{
	color:#CDB071!important; 
}
/* 一级菜单标题 */
.s-side .d-firstNav span {
  margin-left: 10px;
  color: #fff;
}

/* 一级菜单图标 */
.s-side .fr {
  float: right;
  color: #fff;
}

/* 二级菜单整体容器 */
.s-side .s-secondNav {
  margin:0px 0 0 10px;
  display: flex;
  flex-wrap: wrap;
}
.s-side .s-secondNav a:hover{
	 color:#CDB071!important;
}

/* 三级菜单容器 */
.s-side .d-secondDrop {
  margin-left: 30px;
  margin-top: 10px;
}

/* 折叠菜单通用隐藏类 */
.s-firstDrop,
.s-secondDrop {
  display: none;
  margin-top: 10px;
}

/* 一级下拉菜单显示为flex布局 */
.d-firstDrop {
  display: none;
  flex-wrap: wrap;
}

/* 一级下拉菜单子项 */
.d-firstDrop li {
  width: 95%;
  margin-left: 5%;
  list-style: none;
}

/* hover 手势 */
.s-secondNav:hover,
.d-firstNav:hover {
  cursor: pointer;
}

/* 图标旋转样式 */
.iconRotate {
  transform: rotate(90deg);
  transition: transform 0.5s;
}

/* 首页图标与文字 */
.s-side .s-firstItem i {
  font-size: 20px;
}
.s-side .s-firstItem span {
  margin-left: 10px;
  color: #fff;
}

/* 若用到三级内容列表 */
.s-thirdItem {
  border-top: 1px dashed rgba(205,176,113,0.5);
  padding: 10px 0;
}




 /********新手机端导航结束*************/



 .line-box{
    
   }
   .line-box .col-md-6{
      padding:0;
         }
   .line-after{
     position: relative;
     cursor: pointer;
   }
   .line-after .line-after-box{
      position: absolute;
      width: 100%;
      height: 100%;
      background: rgba(0,0,0,0);      
      transition: all 0.6s ease-in-out;
      z-index: 3;
      left: 0;
      top:0;
      padding:10%;
      color:#fff;
      line-height: 2;
   }
   .line-after .line-after-box .txt-box{ 
      padding:50px;
      background:rgba(0,0,0,0);
      transition: all 0.6s ease-in-out;
   }
   .line-after .line-after-box .txt-box .desc{
       overflow: hidden;
        transform: scaleY(0);
        transform-origin: top;
        transition: transform 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
   }
   .line-after:hover .line-after-box{
      background: rgba(0,0,0,0.5);
   }
   .line-after:hover  .line-after-box .txt-box{
      background:rgba(0,0,0,0.4);
      color:#fff;
    }
    .line-after:hover  .line-after-box .txt-box .desc{
             transform: scaleY(1);
    }












.lines{
	margin-top: 30px;
	position: relative;
}
.lines .swiper-slide-lines{
	width:1000px;
}
.lines .swiper-slide-lines a{
	transition: 0.2s;
	position: relative;
	display: block;
	border-radius: 25px;
	overflow:hidden;
}	
 
.lines .swiper-slide-lines a .desc{
	  position: relative;
	  padding:10px 0;
	  text-align: center;
	  background: #202A44;
	  color:#fff;
}

.lines .swiper-pagination-lines{
	text-align:center;
	width:100%;
	margin-top:10px; 	
	margin-top: 50px;
	position: relative;
}

.lines .swiper-pagination-lines .swiper-pagination-bullet {
    width: auto;
    display: inline-block;
    margin:0 15px;
    padding-bottom: 10px;
    height: auto; 
	background: none;
	font-size: 18px;	
	opacity: 0.8;
	border-radius: 0;
	font-weight: bold;
}
.lines .swiper-pagination-lines  .swiper-pagination-bullet-active{
	 border-bottom: 3px solid #202A44;
	 font-weight: bold;
}
.lines .swiper-button-prev-lines{
	width:50%;
	height:500px;
	left:-420px;
	top:0;
	background: url(../images/ichimatsu.png) repeat 0 0;
    border-radius: 5px;
	margin-top:0;
	z-index:99;
	transition: 0.2s;
 }	
.lines .swiper-button-prev-lines:before{	
    content: '';
    position: absolute;
    width: 100px;
    height: 100%;
    background: url(../images/slide_prev.png) no-repeat 0 center;
    left: 84%;
    top: 50%;
    margin-top: -130px;
}
.lines .swiper-button-next-lines{
	width:50%;
	height:500px;
	right:-420px;
	top:0;
	background: url(../images/ichimatsu.png) repeat 0 0;
    border-radius: 5px;
	margin-top:0;
	z-index:99;
	transition: 0.2s;
	}
.lines .swiper-button-next-lines:after{	
    content: '';
    position: absolute;
    width: 100px;
    height: 100%;
    background: url(../images/slide_prev.png) no-repeat 0 center;
    right: 84%;
    top: 50%;
    margin-top: -130px;
	transform: rotate(180deg);
}
.lines .swiper-button-prev-lines:hover,
.lines .swiper-button-next-lines:hover{
	opacity:0.6;
}
.lines  .swiper-slide-active:hover a .desc,
.lines  .swiper-slide-active a .desc{	
	  background:#CDB071;
	  text-align: center;
}







  .Highlights{
      padding: 50px 30px;
      background: rgba(255,255,255,0.8);
      border-radius: 20px;
      transform: scale(1);
      transition: all 0.3s ease-in-out;
      cursor: pointer;
      color: #1A2941;
   }
   .text-outline{ 
        text-shadow:1px 1px 5px #000,0 0 0px #1A2941
   }
   .Highlights:hover{
      transform: scale(1.1);
      background: #CDB071;
      color:#fff;
   } 
   .program{
      position: relative;
   }

   .canvasbox{
     position: absolute;
     width: 100%;
     height: 100%;
     z-index:0;
     left:0;
     top:0;
     background: transparent;
   }

   .yanlist{
   	 margin-top: 80px;
   }






   .wenwu{
   	  display: inline-block;
   	  margin-right: 15px;
   	  margin-bottom: 15px;
   	  padding:10px 20px;
   	  background: var(--colorjin);
   	  border-radius: 25px;
   	  color:#fff;
   	  transition: all 0.3s ease-in-out;
   }

   .wenwu:hover{
   	 background: var(--colorblue);
   	 cursor: pointer;
   	 transform: scale(1.1);
   }


   .title-bg2{
   	   position: relative;
   	   display: inline-block;
   	   width: 600px;
   	   height: 110px; 
   	  background: url(../images/bgtitle.png) no-repeat center center;
   	  background-size: 100% 100%;
   }

   .title-bg3{
   	 height: 80px;
   	 width: 450px
   }


.content-s{
	 line-height: 26px;
}
.content-s strong{
	 font-weight: 600;
}






.Vision-box{ 
	 padding:30px;
	 height: 100%;
	 color:#fff;
}

.Vision-box .title{
	 color:var(--colorblue);
}

.Vision-box .content{
     color:#fff;
}





  .xiadan{
                  width:600px;
                  height: auto;
                  background: #FAFBFD;
                  box-shadow: 1px 1px 10px #ddd;
                  margin:50px auto;
                  border-radius: 20px;
                  overflow: hidden;                  
              }
              
              #test-n2 div,
              #test-n2 table{
                 width:100%;
                 border:none;
              }
              #test-n2 .layui-laydate-footer{
                 padding-bottom: 50px;
              }

              .xiadanbox{
                 padding:0 15px;
              }

              /* 默认样式 */
              .linkSelect {   
                border-radius: 5px;
                background-color: #fff;
                outline: none;
                transition: border 0.3s;
                 border:none;
                  height: 60px;
                  line-height: 60px;
                  width:100%; 
                  border:1px solid #ddd;
                  color:#333;
              }

              /* 选中后（非空值）改变边框颜色 */
              .linkSelect:valid {
                border-color: #DDD; /* 蓝色边框 */
              }

              /* 鼠标点击时改变边框颜色 */
              .linkSelect:focus {
                border-color: #202A44; /* 绿色边框 */
              }
              .bookbtn{
                 cursor: pointer;
              }
              
              @media(max-width: 768px){
                  .xiadan{
                  width:100%; 
                   margin:30px auto;
                }