@font-face {
    font-family: 'PangMenZhengDao';
    src: url(./庞门正道标题体.ttf);
}

* {
    padding: 0;
    margin: 0;
}

ul {
    list-style: none;
}

body {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    background-image: url('./IMG/body.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.back {
    width: 100%;
    height: 100vh;
    background-image: url('./IMG/back.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    pointer-events: none;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}
.title-main{
    width: 100%;
    height: 7%;
    position: absolute;
    top: 0;
    background-image: url("./IMG/title.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
.title {
   
    /* width: 26vw; */
    height: 80%;
    /* border: 1px solid red; */
    z-index: 1;
    display: flex;
    align-items: center;
    /* justify-content: space-evenly; */
    /* left: 0;
    top: 0;
    right: 0; */
    /* margin-left: auto; */
    margin-bottom: auto;

}

.title p {
    font-size: 1.8vw;
    color: #fff;
    font-family: "PangMenZhengDao";
    color: rgb(255, 255, 255);
    letter-spacing: 2px;
}

#item {
    width: 13vw;
    position: absolute;
    right: 8vw;
    top: 3vh;
    z-index: 1;
    font-family: "PangMenZhengDao";
    color: rgb(255, 255, 255);
    /* font-size: 0.9vw; */
    font-size: 1.3rem;
    display: flex;
    align-items: center;
    z-index: 10;
}

.leftTop {
    width: 2.1vw;
    height: 4vh;
    position: absolute;
    left: 10vw;
    top: 3vh;
    z-index: 10;
    cursor: pointer;
}

.leftTop img {
    width: 100%;
    height: auto;
    opacity: 0.8;
}

.y {
    width: 2vw;
    height: 1vh;
    position: absolute;
    right: 0;
    left: 49.8vw;
    bottom: 20.1vh;
    z-index: 1;
}

.bottom {
    width: 65vw;
    height: 18vh;
    position: absolute;
    left: 0vw;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    bottom: 0vh;
    z-index: 1;
}

.bottom p {
    text-align: center;
    font-family: "PangMenZhengDao";
    color: rgb(255, 255, 255);
    font-size: 1vw;
}

.bottom p span {
    font-size: 0.5vw;
}

.list {
    width: 55vw;
    height: 3vh;
    margin: 0 auto;
    background-image: url(./IMG/jh.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position-y: bottom;
    list-style: none;
    display: flex;
    align-items: center;
}

.list li {
    font-size: 0.8vw;
    font-family: "Microsoft YaHei";
    color: rgb(255, 255, 255);
    text-align: center;
}

.list li:first-child {
    width: 8.3vw;
}

.list li:nth-child(2) {
    width: 7.4vw;
}

.list li:nth-child(3) {
    width: 8vw;
}

.list li:nth-child(4) {
    width: 11.8vw;
}

.list li:nth-child(5) {
    width: 11.2vw;
}

.list li:nth-child(6) {
    width: 8vw;
}

.div {
    width: 90%;
    margin: 0 auto;
    background-image: url(./IMG/hui.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position-y: bottom;
    margin-top: 0.5vh;
}

.div1 {
    width: 93%;
    margin: 0 auto;
    background-image: url(./IMG/lan.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position-y: bottom;
    margin-top: 0.5vh;
}

.div2 {
    width: 96%;
    margin: 0 auto;
    background-image: url(./IMG/hui.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position-y: bottom;
    margin-top: 0.5vh;
}

.div3 {
    width: 99%;
    margin: 0 auto;
    background-image: url(./IMG/lan.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position-y: bottom;
    margin-top: 0.5vh;
}



.list1 {
    width: 55vw;
    height: 2.5vh;
    margin: 0 auto;
    list-style: none;
    display: flex;
    align-items: center;
}

.list1 li {
    font-size: 0.7vw;
    font-family: "Microsoft YaHei";
    color: rgb(255, 255, 255);
    text-align: center;
}

.list1 li:first-child {
    width: 8.3vw;
}

.list1 li:nth-child(2) {
    width: 7.4vw;
}

.list1 li:nth-child(3) {
    width: 8vw;
}

.list1 li:nth-child(4) {
    width: 11.8vw;
}

.list1 li:nth-child(5) {
    width: 11.2vw;
}

.list1 li:nth-child(6) {
    width: 8vw;
}

.right-now {
    position: absolute;
    right: 0;
    top: 12vh;
    width: 15vw;
    height: 14vh;
    z-index: 1;
}

.right-tow {
    width: 100%;
    height: 4vh;
    display: flex;
    align-items: center;
    justify-content: right;
    background-image: url(./IMG/lsss.png);
    background-size: 60% auto;
    background-repeat: no-repeat;
    background-position-y: -1.1vh;
    background-position-x: 3vw;
}

.right-tow p {
    font-size: 0.8vw;
    font-family: "PangMenZhengDao";
    color: rgb(255, 255, 255);
}

.right-tow p span {
    font-size: 0.5vw;
}

.right-sui {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 1vh;
}

.right-sui img {
    width: auto;
    height: auto;
}

.right2-tow {
    width: 16.1vw;
    height: 14vh;
    position: absolute;
    right: 0;
    top: 26vh;
    z-index: 1;
}

.right2-now {
    width: 100%;
    height: 4vh;
    display: flex;
    align-items: center;
    background-image: url(./IMG/lsss.png);
    background-size: 60% auto;
    background-repeat: no-repeat;
    background-position-y: -1.8vh;
    background-position-x: 0vw;
}

.right2-now p {
    font-size: 0.8vw;
    font-family: "PangMenZhengDao";
    color: rgb(255, 255, 255);
}

.right2-now p span {
    font-size: 0.4vw;
}

.right2-sui {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 1vh;
    margin-left: 1.5vw;
}

.right-sui2 img {
    width: auto;
    height: auto;
}

.right3-now {
    width: 17.2vw;
    height: 25vh;
    position: absolute;
    right: 0;
    top: 40vh;
    z-index: 1;
}

.right3-tow {
    width: 100%;
    height: 4vh;
    display: flex;
    align-items: center;
    background-image: url(./IMG/lsss.png);
    background-size: 60% auto;
    background-repeat: no-repeat;
    background-position-y: -1.8vh;
    background-position-x: 0vw;
}

.right3-tow p {
    font-size: 0.8vw;
    font-family: "PangMenZhengDao";
    color: rgb(255, 255, 255);
}

.right3-tow p span {
    font-size: 0.4vw;
}

.right3-sui {
    margin-top: 1vh;
}

.right3-sui img {
    width: auto;
    height: auto;
}

.right4-now {
    width: 18.7vw;
    height: 21vh;
    position: absolute;
    right: 0;
    bottom: 14vh;
    z-index: 1;
}

.right4-tow {
    width: 100%;
    height: 4vh;
    display: flex;
    align-items: center;
    background-image: url(./IMG/lsss.png);
    background-size: 60% auto;
    background-repeat: no-repeat;
    background-position-y: -2.5vh;
    background-position-x: -1vw;
}

.right4-tow p {
    font-size: 0.8vw;
    font-family: "PangMenZhengDao";
    color: rgb(255, 255, 255);
}

.right4-tow p span {
    font-size: 0.4vw;
}

.right-a {
    width: 100%;
    height: 16.5vh;
}

.right-a div:first-child {
    width: 80%;
    margin: 0 auto;
    font-size: 0.8vw;
    display: flex;
    font-family: "Microsoft YaHei";
    margin-top: 1vh;
    color: rgb(255, 255, 255);
}

.right-a div:first-child span {
    width: 50%;
    display: block;
    text-align: center;
}

.list-airport {
    width: 15vw;
    margin: 0 auto;
    display: flex;
    height: 2.5vh;
    background-color: rgba(199, 225, 255, 0.169);
}

.list-airport span {
    font-size: 0.5vw;
    width: 50%;
    display: block;
    line-height: 2.5vh;
    text-align: center;
    color: #fff;

}

.list-airport1 {
    width: 15.3vw;
    height: 2.5vh;
    display: flex;
    margin-left: 1.5vw;
    margin-top: 1vh;
    background-color: rgba(28, 108, 216, 0.2);
}

.list-airport1 span {
    font-size: 0.5vw;
    display: block;
    line-height: 2.5vh;
    text-align: center;
    color: #fff;
}

.list-airport1 span:first-child {
    margin-left: 0.2vw;
}

.list-airport2 {
    width: 14.9vw;
    height: 2.5vh;
    display: flex;
    margin-left: 2vw;
    margin-top: 1vh;
    background-image: url('./IMG/rightlist.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.list-airport2 span {
    font-size: 0.5vw;
    display: block;
    line-height: 2.5vh;
    text-align: center;
    color: #fff;
}

.list-airport2 span:first-child {
    margin-left: 0.6vw;
}

.list-airport3 {
    width: 13.9vw;
    height: 2.5vh;
    display: flex;
    margin-left: 3vw;
    margin-top: 1vh;
    background-image: url('./IMG/list.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.list-airport3 span {
    font-size: 0.5vw;
    display: block;
    line-height: 2.5vh;
    text-align: center;
    color: #fff;
}

.list-airport3 span:first-child {
    margin-left: 0.6vw;
}

.left-now {
    position: absolute;
    left: 2%;
    top: 10vh;
    width: 14.5vw;
    height: 16vh;
    z-index: 1;
    /* border: 1px solid red; */
}

.left {
    width: 21.5%;
    height: 100%;
    background-image: url("./IMG/left.png");
    background-repeat: no-repeat;
    background-size:100% 100%;
    position: absolute;
    z-index: 1;
    left: 0;
    /* top: 1%; */
    transition: left 1s;

}

.right {
    width: 21.5%;
    height: 100%;
    background-image: url("./IMG/right.png");
    background-repeat: no-repeat;
    background-size:100% 100%;
    position: absolute;
    right: 0;
    z-index: 1;
    /* top: 1%; */
    transition: right 1s;
}
.left-tow {
    width: 100%;
    height: 4vh;
    display: flex;
    align-items: center;
    /* margin-left: 1vw; */
    background-image: url(./IMG/lsss.png);
    background-size: 60% auto;
    background-repeat: no-repeat;
    background-position-y: -1.1vh;
    background-position-x: -1.7vw;
}

.left-tow p {
    font-size: 0.8vw;
    font-family: "PangMenZhengDao";
    color: rgb(255, 255, 255);
}

.left-tow p span {
    font-size: 0.4vw;
}

.left-list {
    width: 78%;
    height: 2.5vh;
    background-image: url('./IMG/zui.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
}

.left-list span {
    color: #fff;
    font-size: 0.5vw;
}

.left-list span:last-child {
    margin-left: 4vw;
}

.left-list1 {
    width: 93%;
    height: 2.5vh;
    background-image: url('./IMG/zui.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    margin-top: 0.5vh;
}

.left-list1 span {
    color: #fff;
    font-size: 0.5vw;
}

.left-list1 span:last-child {
    margin-left: 4.5vw;
}

.left-list3 {
    width: 96%;
    height: 2.5vh;
    background-image: url('./IMG/leftlist.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    margin-top: 0.5vh;
}

.left-list3 span {
    color: #fff;
    font-size: 0.5vw;
}

.left-list3 span:last-child {
    margin-left: 7vw;
}

.left2-now {
    width: 15.5vw;
    height: 19vh;
    position: absolute;
    left: 2%;
    top: 26vh;
    z-index: 1;
}

.left2-tow {
    width: 100%;
    height: 4vh;
    display: flex;
    align-items: center;
    justify-content: right;
    background-image: url(./IMG/lsss.png);
    background-size: 60% auto;
    background-repeat: no-repeat;
    background-position-y: -1.8vh;
    background-position-x: 1vw;
}

.left2-tow p {
    font-size: 0.8vw;
    font-family: "PangMenZhengDao";
    color: rgb(255, 255, 255);
}

.left2-tow p span {
    font-size: 0.4vw;
}

.left2-img img {
    width: auto;
    height: auto;
}

.left3-now {
    width: 17.5vw;
    height: 21vh;
    position: absolute;
    left: 0;
    top: 45vh;
    z-index: 1;
}

.left3-tow {
    width: 100%;
    height: 4vh;
    display: flex;
    align-items: center;
    justify-content: right;
    background-image: url(./IMG/lsss.png);
    background-size: 60% auto;
    background-repeat: no-repeat;
    background-position-y: -2vh;
    background-position-x: 2vw;
}

.left3-tow p {
    font-size: 0.8vw;
    font-family: "PangMenZhengDao";
    color: rgb(255, 255, 255);
}

.left3-tow p span {
    font-size: 0.4vw;
}

.left3-sui {
    display: flex;
    justify-content: center;
    margin-top: 1vh;
}


.left4-now {
    width: 18.9vw;
    height: 21vh;
    position: absolute;
    left: 0;
    top: 66vh;
    z-index: 1;
}

.left4-tow {
    width: 100%;
    height: 4vh;
    display: flex;
    align-items: center;
    justify-content: right;
    background-image: url(./IMG/lsss.png);
    background-size: 60% auto;
    background-repeat: no-repeat;
    background-position-y: -2.5vh;
    background-position-x: 3vw;
}

.left4-tow p {
    font-size: 0.8vw;
    font-family: "PangMenZhengDao";
    color: rgb(255, 255, 255);
}

.left4-tow p span {
    font-size: 0.4vw;
}

.left4-sui {
    display: flex;
    /* justify-content: center; */
    /* margin-top: 1vh; */
}

.jk {
    width: 30.5vw;
    height: 37vh;
    position: absolute;
    left: 36%;
    top: 25%;
    z-index: 1;
    background-image: url('./IMG/jksp.png');
    background-size: auto auto;
    background-repeat: no-repeat;
    display: none;
}

.jk {
    text-align: right;
    font-size: 1vw;
}

.icon {
    width: 10vw;
    height: 10vh;
    position: absolute;
    left: 40%;
    top: 10%;
    z-index: 1;
}

.tc {
    width: 16vw;
    height: 19vh;
    position: absolute;
    left: 42%;
    top: 19%;
    z-index: 1;
    background-image: url(./IMG/tcc.png);
    background-size: auto auto;
    background-repeat: no-repeat;
    display: none;
}

.tc1 {
    width: 16vw;
    height: 19vh;
    position: absolute;
    left: 42%;
    top: 19%;
    z-index: 1;
    background-image: url(./IMG/cgqtc.png);
    background-size: auto auto;
    background-repeat: no-repeat;
    display: none;
}

.nr {
    width: 11vw;
    height: 11vh;
    margin: 0 auto;
    margin-top: 5vh;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

.nr-now {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nr-now span {
    display: flex;
    align-items: center;
    justify-content: space-around;
    font-size: 0.8vw;
    color: #fff;
}

.nr-now1 {
    display: flex;
    align-items: center;
}

.nr-now1 span {
    display: flex;
    align-items: center;
    justify-content: space-around;
    font-size: 0.8vw;
    color: #fff;
}

.cuo1 {
    position: absolute;
    right: 1.5vw;
    top: 2.5vh;
    cursor: pointer;
}

div,span,a{
    caret-color: transparent;
}

.bottom-main{
    width: 100%;
    height: 27%;
    position: absolute;
    bottom: 0;
    /* left:15.6%; */
    background-image: url("./IMG/bottom.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    z-index: 1;
    transition: bottom 1s;
}

