@import url("https://cdn-font.hyperos.mi.com/font/css?family=MiSans_VF:VF:Chinese_Simplify,Latin&display=swap");
 
 
@font-face {
  font-family: 'en';   
  src: url(../fonts/Playball-Regular.ttf) format('truetype');
   font-display: swap;
}
@font-face {
  font-family: 'douying';
  src: url(../fonts/DouyinSansBold.otf) format('truetype');
   font-display: swap;
}


.honor{
	font-family: 'MiSans VF';
}
.honorFw{ 
	font-weight:600;
}
.honor300{
	font-weight:300;
}

.fweight{
     font-weight: 600;
}
.en{
	font-family: 'en';
}


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


 .price {
     font-size: 30px !important;
 }
 

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

:root {
     --colorblue: #1A2941;
     --colorred: #F19EB6;
     --colorjin: #CDB071;
         --debug: 0;
        --supported: 0;
        --not-supported: 0;
        --card-color: hsl(260deg 100% 3%);
        --text-color: hsl(260deg 10% 55%);
        --card-radius: 3.6vw;
        --card-width: 35vw;
        --border-width: 3px;
        --bg-size: 1;
        --hue: 0;
        --hue-speed: 1;
        --rotate: 0;
        --animation-speed: 4s;
        --interaction-speed: 0.55s;
        --glow-scale: 1.5;
        --scale-factor: 1;
        --glow-blur: 6;
        --glow-opacity: 1;
        --glow-radius: 100;
        --glow-rotate-unit: 1deg;
 }

 html,
 body {
     color: #000;
     max-width: 100%;
     overflow-x: hidden;
      font-family: "MiSans VF","Microsoft YaHei", "Arial", -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
     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;
 }

 

 /**********重置一些原样式**************/
 .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: 24px;
     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;
 }
 .content strong{
 	 display: inline-block;
 }

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

 /*********自定义一些基本设置**************/
 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;
 }
.colorjin{
     color:var(--colorjin)!important;
}
.colorblue{
    color:var(--colorblue)!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: 650px;
     height: auto;
     left: 18%;
        top: 50%;
            transform: translateY(-50%);
     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: 100vh;
     overflow: scroll;
     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;
     background: var(--colorjin);
 }
 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_aboutbig4{
     padding-top: 150px;
}


.team-border{
     border:10px solid var(--colorjin);
     
}

 /*******首页关于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: 14px;
     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: 160px;
 }



 .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";
             color: var(--colorjin);
        border: 2px solid var(--colorjin);
        font-weight: bold;
 }
 .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: 14px;
     line-height: 24px;
 }

 .attractions-list .bg {
     min-height: 850px;
     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 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: 24px;
     font-weight: bold;
     display: block;
     width: 100%;
     color: #333;
     line-height: 30px;
 }
 .news-content .date {
     width: 100%;
     font-size: 16px;
     color: #adadad;
 }
 .news-content-content {
     min-height: 100px;
 }

 .news-content-content h1{
 	 font-size: 20px;
 	 font-weight: bold;
 	 display:block;
 	 margin-bottom: 15px;
 }
 .news-content-content h2{
 	 font-size: 18px;
 	 font-weight: bold;
 	 display:block;
 	 margin-bottom: 15px;
 }
 .news-content-content h3{
 	 font-size: 20px;
 	 font-weight: bold;
 	 display:block;
 	 margin-bottom: 15px;
 }
 
.news-content-content li{
         list-style-type: disc;  
          list-style-position: inside;  
          padding-left:5px;
}
.news-content-content li p {
  display: inline; /* 或 inline-block */
  margin: 0;       /* 去掉默认的段落间距 */
}
.news-content-content a,
.news-content-content a strong{
     color:#1945BD!important;
}
 .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;
 }



 .newlist-box{
    display: block;
    width:100%;
}


.newlist-box .imgbox{
     height: 300px;
     width:100%;
     overflow: hidden;
}
.newlist-box .imgbox img{
     width:100%;
     height: 100%;
     object-fit:cover;
     border:8px solid var(--colorjin);
}

.newlist-box .js-text-dot-cn{
     height: 58px;
     overflow: hidden;
}


 /*******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;
     flex-wrap: wrap;
 }
 
 .foot-icos .icos {
     display: inline-block;
     width: 40px;
     height: 40px;
     overflow: hidden;
     background: #F19EB6;
     text-align: center;
     position: relative;
     border-radius: 50%;
     margin-bottom: 10px;
 }

 .foot-icos .icos img {
     width: 100%;
     height: 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;
 }



 .swiper-slide-productivity-Related-Tours{
     width:400px;
 }





 .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 p {
     width: calc(25% - 20px);
     padding-left: 20px;
     position: relative;
     margin-bottom: 10px;
 }
 .list-ul p:before {
     content: "\F519";
     /* bi-plus-circle-fill 的 Unicode */
     font-family: "bootstrap-icons";
     /* 使用 Bootstrap Icons 字体 */
     position: absolute;
     left: 0;
     top: 5px;
     font-size: 12px;
     color: #333;
     /* 图标颜色，可自定义 */
     z-index: 2;
     line-height: 1;
 }

 .list-ul2 p {
     width: calc(50% - 20px);
     padding-left: 20px;
     position: relative;
     margin-bottom: 10px;
 }

 .list-ul2 p:before {
     content: "\F519";
     /* bi-plus-circle-fill 的 Unicode */
     font-family: "bootstrap-icons";
     /* 使用 Bootstrap Icons 字体 */
     position: absolute;
     left: 0;
     top: 5px;
     font-size: 12px;
     color: #333;
     /* 图标颜色，可自定义 */
     z-index: 2;
     line-height: 1;
 }


 .list-ul3 {
     list-style: none;
     padding-left: 0;
 }
 .list-ul3 p {
     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 p:hover {
     background: var(--colorblue);
 }






.list-ul-txt{
      column-count: 2;      /* 两列 */
  column-gap: 1.25rem;  /* 列间距，可按需调整 */
  /* 可选：控制宽度与行高，让阅读更舒服 */
  max-width: 800px;
  line-height: 1.6
}






 .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;
 }
 .team2 {
     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; 
     padding-bottom: 1rem;
 }

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

 

 .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);
 }
  .team2 .swiper-slide-active,
 .team2 .swiper-slide-duplicate-active {
     transform: scale(1.2);
 }
 .team-prev,
 .team-next {
     top: calc(50% - 350px);
 }

.swiper-slide-teamlst:nth-child(even),
.team-list-wap:nth-child(even){
     background:var(--colorblue);
}

.swiper-slide-teamlst:nth-child(odd),
.team-list-wap:nth-child(odd){
     background:var(--colorred);
}



.team-grid .team2-list-box{
  transition: margin-top 0.3s ease;
  margin-bottom: 50px;
}

/* 偶数项下移 */
.team-grid .team2-list-box:nth-child(even) {
  margin-top: 100px;
}

/* 奇数项保持原位 */
.team-grid .team2-list-box:nth-child(odd) {
  margin-top: 0;
}

.team-grid .team2-list-box{
     padding:0 30px;
}
.team-grid .team2-list-box .team2-list .ico{
     border-radius: 20px;
     height:400px;
     overflow: hidden;
     position: relative;
}

.team-grid .team2-list-box .team2-list .ico img{
     width:100%;
     height: 100%;
     object-fit: cover;
}

.team-grid .team2-list-box .team2-list .ico .desc-box{
    position: absolute;
    top:100%;
    left:0;
    width:100%;
    height:100%;
    z-index: 2;
    background: rgba(0,0,0,0.5);
    transition: all 0.6s;
    padding:20px;
    color:#fff;
    text-align: left;
    display: flex;
    align-items: center;
    cursor: pointer;
    line-height:24px;
    font-size: 14px;
}
.team-grid .team2-list-box .team2-list .ico .desc-box p{
     line-height:24px;
    font-size: 14px;
}
.team-grid .team2-list-box .team2-list:hover .ico .desc-box{
     top:0;
}

.bg-team:nth-child(even){
     background:var(--colorjin)!important;
}











 /********新手机端导航*************/
 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 p{
     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 p:hover {
     background: var(--colorblue);
     cursor: pointer;
     transform: scale(1.1);
 }



 .title-bg2 {
     position: relative;
     display: inline-block;
     width: 500px;
     height: 120px;
     background: url(../images/bgtitle.png) no-repeat center center;
     background-size: 100% 100%;
 }
 .title-bg2 strong{
      font-weight: normal;
      position: absolute;
      top:50px;
      width:100%;
      height: auto;
      left:0;
      text-align: center;
      z-index: 5;
 }

 .title-bg3 {
     height: 80px;
     width: 450px
 }
 
 
 .title-bg-reviews{
     height: 100px;
     width: 400px;
     position: relative;
 }
 .title-bg-reviews strong{
      font-weight: normal;
      position: absolute;
      top:30px;
      width:100%;
      height: auto;
      left:0;
      text-align: center;
      z-index: 5;
 }
 .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;
     }

}











 /* 首页远程调用数据样式 */

.index_banner2{ 
   height:100vh;
   min-height:800px;
}

 .bg-banner {
    background: rgba(0, 0, 0, 0.3) !important; 
    width: 100%;
    height: 100%; 
}
.txt-banner{  
  padding-top: 20%;
  max-width: 1000px;

}
.txt-banner .title {
  color:#fff;
  font-size:48px;  
}
.xiadan-index {
  padding:20px;
  background:#fff;
  border-radius:12px;
  margin-top:50px;
  width:100%;
    color:#888;
}
.xiadan-index .txt {
  font-size:16px;
  color:#333;
  margin-bottom:5px;
}
.xiadan-index .txt img {
  height:13px;
  width:auto!important;
  margin-right:10px;
  vertical-align:middle;
}



/* 按钮美化 */
.bookbtn-index {
  display:inline-block;
  padding:16px 25px;
  background-color:#202A44!important;
  color:#fff;
  border-radius:8px;
  font-weight:600;
  cursor:pointer;
  transition:all 0.2s ease;
  margin-top:28px;
}
.bookbtn-index:hover {
  background-color:#0056b3;
}



/* 自定义下拉菜单样式 */
.index-select {
  position: relative;
  width: 100%;
  user-select: none;
  margin-top: 5px;
}

.index-select .selected {
  padding: 15px 12px;
  border: 1px solid #ccc;
  border-radius: 8px;
  background-color: #fff;
  font-size: 14px;
  color: #333;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolygon points='70,100 30,40 110,40' fill='%23666'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 12px;
}

.index-select.open .selected {
  border-color: #202A44;
  box-shadow: 0 0 5px rgba(0,123,255,0.3);
}

/* 下拉选项框 */
.index-select .options {
  display: none;
  position: absolute;
  width: 100%;
  max-height: 220px;
  overflow-y: auto;
  border: 1px solid #ccc;
  border-top: none;
  background-color: #fff;
  border-radius: 0 0 8px 8px;
  z-index: 10; 
}

.index-select.open .options {
  display: block;
}

/* 单个选项样式 */
.index-select .options li {
  padding: 12px;
  cursor: pointer;
  color: #666;
  font-size: 14px;
}

.index-select .options li:hover {
  background-color: #f2f2f2; /* 悬停淡灰色 */
  color:#000!important;
}

.index-select .options li.active {
  background-color: #e0e0e0; /* 选中淡灰色 */
}

@media(max-width: 1920px){
   .txt-banner{
     margin-left:13%;
     padding-top:270px;
     max-width: 900px;
   }
}
@media(max-width:1200px) {
  .txt-banner {
    width:94%;
     margin-left:2%;
  }
}

@media(max-width:992px) {
  .xiadan-index .bookbtn {
    margin-top:20px;
  }
  .line {
    width:50%;
  }

  .txt-banner{
     top:100px;
  }
  .txt-banner  .title{
     font-size: 30px;
  }
  .txt-banner .desc{
     line-height: 28px;
  }
  .xiadan-index{
     margin-top: 30px;
  }
}

@media(max-width: 768px){
  .index_banner2{ 
   height: auto; 
  
  } 
  .txt-banner{  
     padding:100px 0;
  }
  .index-select{
     margin-bottom:20px
  }

}









/*********


.swiper-button-prev{
   background:url(../images/banner_arrow2.png) no-repeat left top;
  position:absolute;
  left:20px;
  top:45%;
  margin-top:-35px;
  width:70px;
  height:70px;
  z-index:999;
  cursor: pointer;
}

.swiper-button-next{
     background:url(../images/banner_arrow2.png) no-repeat left bottom;
  position:absolute;
  right:20px;
  top:45%;
  left:auto;
  margin-top:-35px;
  width:70px;
  height:70px;
  z-index:999;
  outline:none;
    cursor: pointer;
}
**************/

.news-pagination .swiper-pagination-bullet{
      width:10px;
      height: 10px;
}
.news-pagination .swiper-pagination-bullet-active{
      background: var(--colorred)
}
.getintouch{
      background: #F2F4FC;
      width: 100%;
      border-radius: 15px;
      padding:20px; 
}

.getintouch i{
      color:var(--colorred);
}

blockquote{
      background-color: #f2f4fc;
    border-bottom-left-radius: 4px;
    border-left: 15px solid #F19EB6;
    border-radius:15px;
    padding: 10px 40px 10px 20px;
    color:#333;
}


.tags{
        background: #F2F4FC;
      width: 100%;
      border-radius: 15px;
      padding:20px 20px 10px 20px;  
}

.tags-list{ 
     padding:5px 15px;
     display: inline-block;
     border-radius: 25px;
     background: var(--colorred);
     color:#fff;
}


.IndexSubTitle{ 
     padding:8px 35px;
     display: inline-block;
     border-radius: 25px; 
         background: var(--colorjin);
         color:#fff;
}










.contact-map{
   height: 596px;
   position: relative;
}
.map-btn{
    width: 80px;
    height: 80px;
    margin-left: 50px;
    margin-top: -400px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.map-btn2 {
    width: 80px;
    height: 80px;
    margin-left: -300px;
    margin-top: 380px;
    display: flex;
    justify-content: center;
    align-items: center;
}


 .up-down1{
    -webkit-animation: chuxian 3s linear infinite;
    animation: chuxian 3s linear infinite;
    color:var(--colorred);
 }


@-webkit-keyframes chuxian {
    0% {
        transform: translateY(0);
    }   
    
    50% {
        transform: translateY(-20px); 
    }

    100% {
        transform: translateY(0);
    }
}










   .More-Reviews{
         width:auto;
         height:auto;
         overflow: hidden;
         margin:0px auto 30px auto; 
         position: relative;
         border: 4px solid var(--colorjin);
         border-radius: 15px;
         display: inline-block;
    }
    
 
 .splide__slide .tb_rc_post_wrap_in .tb_rc_post_in{
     background-color: var(--colorred);
 }
 
   .splide__slide .tb_rc_post_wrap_in .tb_rc_post_in .tb_rating_ico__{
      color: #FFF!important;
 }
 

 .splide__slide:nth-child(2n) .tb_rc_post_wrap_in .tb_rc_post_in{
       background-color: var(--colorblue);
       color:#fff!important;
 }
 
  .splide__slide:nth-child(2n) .tb_rc_post_wrap_in  .tb_rating_ico__{
            color: var(--colorjin)!important;
 }
 
 

 .splide__slide:nth-child(2n) .tb_rc_post_wrap_in .tb_rc_post_in .tb_rc_authorname,
  .splide__slide:nth-child(2n) .tb_rc_post_wrap_in .tb_rc_post_in .tb_rc_post_info,
 .splide__slide:nth-child(2n) .tb_rc_post_wrap_in .tb_rc_post_in  .tb_content_text{
       color:#fff;
 }
 .splide__slide:nth-child(2n) .tb_rc_post_wrap_in .tb_rc_post_in .tb_rc_time,
  .splide__slide:nth-child(2n) .tb_rc_post_wrap_in .tb_rc_post_in .tb_rc_username{
     color:#fff;
}

 .splide__slide:nth-child(2n) .tb_rc_post_wrap_in .tb_rc_post_in .tb_rc_seprator{
       background-color:#fff;
 }
 
 .tb_read_more_{
      color:#fff;
 }
 

/*********jion***************/

 


 .askimg{
    height: 500px;
    width:auto;
 }

.ask-index{
    width:100%; 
    
 }
.ask-list-index .ico{
    height: 300px;
    overflow: hidden;
}
.ask-list-index .ico img{
     width:100%;
     height: 100%;
     object-fit: cover;
}

.ask-list-index-title{
  cursor:pointer; 
  color:#333;
  line-height:24px;
  padding-left:10px;
  padding:15px 20px;
 padding-right: 50px; 
   background: var(--colorjin);
   border-radius:0px;
    background:#f3f5f9 url(../images/right-w.png)  no-repeat;background-position:99% 50%;

 }

.ask-list-index-title:hover{    
  background:#f3f5f9 url(../images/right-w.png)  no-repeat;background-position:99% 50%;
 
}

.ask-list-ADD{color:#333}

.ask-list-ICO{
  background:#f3f5f9 url(../images/down.png)  no-repeat;background-position:99% 50%; 
  

}
.ask-list-ICO:hover{
  background:#f3f5f9 url(../images/down.png)  no-repeat;background-position:99% 50%; 
}
.ask-index-content{ 
  display: none;  
  padding:20px;   
  background: var(--colorblue);
    border-radius:0 0 15px 15px;
    color:#fff;

}
.ask-index-content strong{
     color: var(--colorjin)!important;
}
.ask-index-content blockquote{
     background: #475A78;
     border-left: 15px solid var(--colorjin)!important;
}
.ask-index-content li { 
    list-style-type: disc; /* 保留圆点 */ 
    list-style-position: inside; /* 圆点在内容内侧 */
    padding-left: 10px;
} /* 让浏览器恢复列表项语义 */ 
 .ask-index-content li p,
 .ask-index-content li strong,
 .ask-index-content li span{
      display: inline;
 }
 
ol{
      padding:0;
 }


.ask-list-wap{
     display: block;
     width:100%;
     height: auto;
    background: var(--colorblue);
     margin-bottom: 20px;
     color:#fff;
     border-radius: 15px;
     overflow: hidden;
}

.ask-list-wap:nth-child(2n){
     background: var(--colorblue);
}

.ask-list-wap .title{
     font-size: 16px;  
     display: flex;
     color:#fff;
     background: var(--colorjin);
     padding:20px;
}
 


.ask-list-wap .desc{
     display: flex;
     font-size: 14px;
     line-height: 24px;
      padding:20px;
}

.ask-list-wap .desc .mycontent{
     height: 58px;
}
.ask-list-wap .desc .h-content {
    height: auto;
}


/**********jion***end*****************/


.title-big{
     text-shadow: 1px 1px 2px #333;
}

     @property --hue {
        syntax: '<number>';
        inherits: true;
        initial-value: 0;
      }
      @property --rotate {
        syntax: '<number>';
        inherits: true;
        initial-value: 0;
      }
      @property --bg-y {
        syntax: '<number>';
        inherits: true;
        initial-value: 0;
      }
      @property --bg-x {
        syntax: '<number>';
        inherits: true;
        initial-value: 0;
      }
      @property --glow-translate-y {
        syntax: '<number>';
        inherits: true;
        initial-value: 0;
      }
      @property --bg-size {
        syntax: '<number>';
        inherits: true;
        initial-value: 0;
      }
      @property --glow-opacity {
        syntax: '<number>';
        inherits: true;
        initial-value: 0;
      }
      @property --glow-blur {
        syntax: '<number>';
        inherits: true;
        initial-value: 0;
      }
      @property --glow-scale {
        syntax: '<number>';
        inherits: true;
        initial-value: 2;
      }
      @property --glow-radius {
        syntax: '<number>';
        inherits: true;
        initial-value: 2;
      }
      @property --white-shadow {
        syntax: '<number>';
        inherits: true;
        initial-value: 0;
      }
    
      .guang::before,
      .guang::after {
        content: 'CSS.registerProperty is supported ✅';
        position: absolute;
        display: block;
        top: 8px;
        left: 0;
        right: 0;
        margin: auto;
        width: calc(100% - 160px);
        max-width: 380px;
        height: auto;
        padding: 8px;
        border-radius: 8px;
        background: #48b93c;
        color: white;
        text-align: center;
        font-family: sans-serif;
        z-index: var(--supported, 0);
        opacity: var(--supported, 0);
      }

      .guang::after {
        content: 'CSS.registerProperty is NOT supported ❌';
        background: #b93c3c;
        z-index: var(--not-supported, 0);
        opacity: var(--not-supported, 0);
      }

      .guang::before,
      .guang::after {
        display: none !important;
      }

      
  
      
      .guang2{
           width:170px;
          height: 60px; 
          color: white;
        margin: auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        position: relative;
        z-index: 2; 
        cursor: pointer;
        margin:0 auto;
        border-radius: 5px;
        overflow: hidden;
        background: rgba(255,255,255,0);
        
      }
      
       
      .guang:before,
      .guang:after {
        content: '';
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        border-radius:var(--colorjin);
      }
      .guang .guang-box{
        position: absolute;
        width: 100%;
        height: 100%; 
        display: flex;
        align-items: center;
        justify-content: center;  
    
      }
      .guang .guang-box span {
        display: inline-block;
        padding: 0.25em;
        border-radius: 4px;
        background: var(--text-color);
        color: black;
        margin-right: 8px;
        font-weight: 900;
      }
      .guang .guang-box:before {
        content: '';
        display: block;
        position: absolute;
        box-shadow: 0 0 20px #ddd;
        mix-blend-mode: color-burn;
        z-index: -1;
        background: var(--colorjin)
          radial-gradient(
            30% 30% at calc(var(--bg-x) * 1%) calc(var(--bg-y) * 1%),
            hsl(calc(calc(var(--hue) * var(--hue-speed)) * 1deg), 100%, 90%)
              calc(0% * var(--bg-size)),
            hsl(calc(calc(var(--hue) * var(--hue-speed)) * 1deg), 100%, 80%)
              calc(20% * var(--bg-size)),
            hsl(calc(calc(var(--hue) * var(--hue-speed)) * 1deg), 100%, 60%)
              calc(40% * var(--bg-size)),
            transparent 100%
          );
        width: calc(100% + 10px);
        height: calc(100% + 10px);
        animation: hue-animation var(--animation-speed) linear infinite,
          rotate-bg var(--animation-speed) linear infinite;
        transition: --bg-size var(--interaction-speed) ease;
      }
      

      @keyframes shadow-pulse {
        0%,
        24%,
        46%,
        73%,
        96% {
          --white-shadow: 0.5;
        }
        12%,
        28%,
        41%,
        63%,
        75%,
        82%,
        98% {
          --white-shadow: 2.5;
        }
        6%,
        32%,
        57% {
          --white-shadow: 1.3;
        }
        18%,
        52%,
        88% {
          --white-shadow: 3.5;
        }
      }
      @keyframes rotate-bg {
        0% {
          --bg-x: 0;
          --bg-y: 0;
        }
        25% {
          --bg-x: 100;
          --bg-y: 0;
        }
        50% {
          --bg-x: 100;
          --bg-y: 100;
        }
        75% {
          --bg-x: 0;
          --bg-y: 100;
        }
        100% {
          --bg-x: 0;
          --bg-y: 0;
        }
      }
      @keyframes rotate {
        from {
          --rotate: -70;
          --glow-translate-y: -65;
        }
        25% {
          --glow-translate-y: -65;
        }
        50% {
          --glow-translate-y: -65;
        }
        60%,
        75% {
          --glow-translate-y: -65;
        }
        85% {
          --glow-translate-y: -65;
        }
        to {
          --rotate: calc(360 - 70);
          --glow-translate-y: -65;
        }
      }
      @keyframes hue-animation {
        0% {
          --hue: 0;
        }
        100% {
          --hue: 360;
        }
      }
  
  
  
  
  
  .tk{
       width:600px;
       margin:15px auto;
       display: flex;
       align-items: center;
       justify-content: center;
       position: relative;
  }
  
  .tk img{
       width:100%;
       height: 100%;
  }
  
  .tk .title{
       position: absolute;
       width:100%;
       height: 100%;
       left:0;
       top:0;
       z-index: 2;
       display: flex;
       justify-content: center;
       align-items: center;
  }
 .tk .title .subtitle{
     font-size: 12px;
     width:60%;
     margin:0 auto;
 } 
  
  


.Process{
        width: 100%;
        height: 360px;
        margin: 20px auto;
    }
.Process .swiper-slide {
        text-align: center;
        width: 420px;
        display: block;
        position: relative;
    }
.Process .swiper-slide .ico{
   width: 100%;
   height:300px;
   position: relative;
   overflow: hidden;
    border-radius: 15px;
}
 

.Process .swiper-slide .ico img{
    width: 100%;
    height: 100%;
    object-fit: cover;
   
}
.Process .swiper-slide .title{
   height: 50px;
   padding-top:10px;
   font-size: 14px;
}
.Process .swiper-scrollbar-drag{
    background: var(--colorred);
}



    .swiper-slide-productivity .books {
        padding: 10px 0 !important;
        background: var(--colorjin) !important;
        margin:0 auto;
    }
  
  
  
  
  
  .ask-menu2{
       display: inline-block;
       padding:10px 20px;
       border-radius: 20px;
       background: var(--colorblue);
       color:var(--colorjin);
       font-size: 14px;
       margin:5px 10px;
  }
  .ask-menu2:hover{
       color:#fff;
  }
  .ask-menu2-on{
       background: var(--colorjin);
       color:#fff;
  }
  
  .ask-sort-menu-wap{
       width:100%;
       background: var(--colorblue);
       padding:10px 15px;
       border-radius: 15px;
  }
  
 .ask-sort-menu-wap2{
        width:100%;
       background: var(--colorred);
       padding:10px 15px; 
 }
 
 
 
  .pifa-list{
     -ms-flex: 0 0 20%;
     flex: 0 0 20%;
     max-width: 20%; 
    padding:5px 15px;
 }
 
 .wholes-list{
      background: var(--colorjin);
         padding: 15px;
    text-align: center;
    height: 100%;
    color:#fff;
 }
 
  .wholes-list span{
      display: none;
  }
 
 .wholes-list:hover{
      background: var(--colorblue);
 }
 
 .price-table table{ border-collapse: collapse; width: 100%; margin-bottom: 30px; margin-top:15px;} 
.price-table th,.price-table td { border: 1px solid var(--colorjin); padding: 8px; text-align: center; font-size:14px;} 
.price-table th{ background-color: #FBBFC4; } 

.price-table table tr td:nth-child(1),
.price-table table tr td:nth-child(4){
    background: #FFD599;
}
.price-table strong{
    font-size: 20px;
    font-weight: bold; 
}

.price-table2 table{ border-collapse: collapse; width: 100%; margin-bottom: 30px; margin-top:15px;} 
.price-table2 th,.price-table2 td { border: 1px solid var(--colorjin); padding: 8px; text-align: center; font-size:14px;} 
.price-table2 th{ background-color: #FBBFC4; } 

.price-table2 table tr td:nth-child(1){
    background: #FFD599;
}
.price-table2 strong{
    font-size: 20px;
    font-weight: bold; 
}
 
 
.price-table3 strong{
    font-size: 14px; 
}
 
 
 
 
.audio-box-main{
     display: flex;
     align-content: center;
} 
.audio-box-main .name{
     width:80px;
     height: 30px;
     line-height: 30px;
}
 .audio-box {
  background: var(--colorjin);
  padding:2px;
  border-radius:50px;
  display: inline-block;
  line-height: 0;
  overflow: hidden;
}
audio { 
    width: 250px; 
    height: 30px; 
    max-height: 30px;
    border-radius: 50px;
    
}

audio::-webkit-media-controls-panel {
  background-color: #fff !important;
}

audio::-webkit-media-controls {
  background-color: #fff !important;
}

 
.bg-red-top-blue{
     background: var(--colorred);
}
.bg-red-top-blue:nth-child(2n){
     background: var(--colorblue);
}
 
 
.quick-links{
    display: inline-block;
    padding:5px 20px;
    background: var(--colorjin);
    border-radius: 25px;
    color:#fff;
    margin:0px 10px 10px 10px;
}