* { margin: 0; padding: 0; } li { list-style: none; } a { text-decoration: none; color: unset; } body { width: 100%; } .pages-turn{width:100%;height:auto;padding-top:30px;text-align:center;position:relative;overflow:hidden; }/*分页*/ .pages-turn span{ display:inline-block;width:44px;height:44px;line-height:31px;text-align:center;font-family:'Arial';background-color:#0015ff;line-height: 44px; margin: 10px;color: #ffffff;border-radius: 50%; } .pages-turn a{display:inline-block;width:44px;height:44px;line-height:31px;color:#000000; text-align:center;font-family:'Arial';background-color:#FFFFFF;line-height: 44px; margin: 10px; border:1px solid #0015ff; border-radius: 50%;} .pages-turn a.on, .pages-turn a:hover{color:#fff;background-color:#0015ff;} .aioio { color: #0435be; font-weight: 600; letter-spacing: 2px; } .yuyu { font-weight: 800; color: #414e64; } .header { width: 96%; padding: 0 2%; height: 80px; position: fixed; top: 0; transition: all 0.5s; display: flex; align-items: center; justify-content: space-between; z-index: 9999999; } .headerLeft { display: flex; align-items: center; color: white; font-size: 12px; } .headerLeft>span { margin-left: 18px; padding-left: 15px; display: flex; border-left: 1px solid white; } .headeRight { display: flex; align-items: center; } .search { height: 80px; display: flex; align-items: center; justify-content: center; padding: 0 20px; } .searchInput { width: 150px; height: 30px; padding-left: 10px; background: none; border: 0; border-bottom: 1px solid white; outline: none; color: white; display: none; } .active { display: block !important; } .activef { display: flex !important; z-index: 9999999; } .searchInput::-webkit-input-placeholder { color: rgb(255, 255, 255) !important; } .earth { width: 100px; height: 60px; color: white; display: flex; align-items: center; justify-content: center; } .earth>span { margin-left: 16px; } .nav { width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; border-radius: 100px; background: #0015ff54; } .nav>div { width: 40px; height: 40px; border-radius: 100px; background: #0015ff; display: flex; align-items: center; justify-content: center; } .nav>div>img { width: 16px; } .openPc { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.322); background: url(../images/back/nav.png) no-repeat right top; background-size: 55% 100%; display: none; flex-direction: column; justify-content: center; align-items: flex-end; } .openCont { width: 40%; display: flex; flex-wrap: wrap; position: relative; } .openCont>ul { width: 22%; margin-right: 3%; display: flex; flex-direction: column; margin-bottom: 10%; border-top: 2px solid #f1f1f1; padding-top: 20px; } .openCont>ul>p { margin-bottom: 10px; } .openCont>ul>li>a { height: 40px; display: flex; align-items: center; color: #666666; font-size: 13px; } .openCont>ul>li>a:hover { color: #0015ff; } .xianba { width: 100%; height: 2px; background: #0015ff; } .weibude { padding-top: 3%; color: #999999; font-size: 14px; } .weibude>p { height: 30px; display: flex; align-items: center; } .close { position: absolute; top: 30px; right: 20px; z-index: 999999999999999999999999; } /* 大图 */ .datu { width: 100%; height: 700px; overflow: hidden; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; } .datu>img { object-fit: cover; } .datWen { position: absolute; /* top: 0; */ display: flex; flex-direction: column; align-items: center; justify-content: center; } .datWen>div>div { width: 50px; height: 5px; background: #f97111; margin-top: 15px; border-radius: 5px; } .datCon { display: flex; flex-direction: column; align-items: center; justify-content: center; color: white; } /* 导航 */ .navigation { width: 80%; padding: 0 10%; display: flex; align-items: center; height: 80px; background: #414e64; color: white; position: relative; } .navigation>li { padding: 0 3%; cursor: pointer; height: 100%; display: flex; align-items: center; justify-content: center; } .navigation>li>a{ width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } .nalihover { background: #0015ff; } .navdao { position: absolute; right: 10%; height: 80px; display: flex; align-items: center; font-size: 13px; } .navdao>img { width: 6px; margin: 0 10px; } .footer { width: 80%; padding: 70px 10% 0 10%; background: #38455b; color: white; } .footerTop { display: flex; width: 100%; padding-bottom: 20px; justify-content: space-between; border-bottom: 1px solid rgba(197, 197, 197, 0.198); } .footerleft>ul>li { padding: 10px 0; color: #aaaaaa; } .footerUl { display: flex; margin-bottom: 20px; color: white !important; } .footerUl img { margin-right: 15px; } .footercent { width: 100%; display: flex; } .footercent>ul>p { padding-bottom: 20px; font-size: 18px; } .footercent>ul>li { color: #aaaaaa; height: 40px; display: flex; align-items: center; font-size: 14px; } .footercent>ul>li:hover { color: white; } .footercent>ul { width: 25%; } .footeright { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; } .footeright>p { display: flex; align-items: center; justify-content: center; text-align: center; font-size: 14px; margin-top: 10px; } .footerBott { width: 100%; padding: 11px 0; display: flex; justify-content: space-between; font-size: 14px; color: #aaaaaa; align-items: center; } .foright{ display: flex; flex-direction: column; align-items: flex-end; } .footerBott p{ margin-top: 10px; } @media (max-width: 1400px) { .openCont>ul>p{ font-size: 22px; white-space: nowrap; text-overflow:ellipsis; overflow: hidden; } } @media (max-width: 1000px) { .footerTop { flex-wrap: wrap; } .footerleft { width: 100% !important; } .footercent { width: 100% !important; } .footeright { width: 100% !important; } .footercent { flex-direction: column; } .footercent>ul { width: 100%; } .footercent>ul>p { display: flex; justify-content: space-between; } .footercent>ul>p>img { width: 20px !important; height: 19px !important; } .footercent>ul>li { width: 90%; margin-left: 2.5%; display: none; } .datu>img{ height: 100% !important; } } @media (max-width: 800px) { .navigation{ height: 60px !important; } .navdao { top: -100px; } .footerBott{ flex-wrap: wrap; } .footerBott>div{ width: 100%; } .foright{ align-items: flex-start !important; } .openPc{ background: url(../images/back/nav.png) no-repeat right top; background-size: 150% 100%; } .openCont{ width: 95%; } .openCont>ul>p{ font-size: 14px !important; text-align: left !important; } .openCont>ul>li>a{ font-size: 12px !important; } .datu { height: 400px !important; } .headerLeft>span{ display: none; } } .footercent>ul>p>img { width: 0px; height: 0px; }