.header{background-image:none}.header .background{position:relative;overflow:hidden;width:100%;height:300px;background-image:url("../image/background-header-02.png")}.header .background::after{content:"";position:absolute;top:0;z-index:-1;display:block;width:100%;height:100%;background-image:linear-gradient(#559cee, #b7d7fb)}.header .link{display:flex;align-items:center;justify-content:space-between;padding:24px 0;color:#fff}.header .link>div a{color:#fff}.header .link>div a:hover{opacity:.6}.header .link>div span{color:#fff;padding:0 6px}.header .link>div>div{margin-left:12px;padding:4px 12px;display:inline-block;background-color:var(--color-blue);border-radius:8px}.header .horizontal{margin-top:40px;display:flex;align-items:center;justify-content:space-between}.header .logo{text-align:center}.header .logo a{display:inline-flex;align-items:center;justify-content:center;color:var(--color-black)}.header .logo i{display:block;width:90px;height:70px;background-image:url("../image/logo.png");background-position:center;background-size:100%;margin:0 12px}.header .logo div p{margin:0}.header .logo div p:first-child{font-size:34px;font-weight:bold;text-shadow:0 0 10px #fff}.header .logo div p:last-child{font-size:12px;line-height:36px;font-weight:bold}.header .search{display:flex;align-items:center;justify-content:space-between;padding:6px;max-width:400px;height:50px;border-radius:10px;background-color:#fff}.header .search input{flex-grow:1;min-width:100px;height:100%;border:none;padding:0 20px;font-size:16px;border-radius:8px 0 0 8px}.header .search button{display:flex;align-items:center;justify-content:center;width:120px;min-width:80px;height:100%;color:#fff;border-radius:8px;background-color:var(--color-blue);cursor:pointer}.header .search button .iconfont{margin-right:12px;width:20px;height:20px;fill:#fff}.header .navbar{height:70px;background-color:var(--color-blue)}.header .navbar ul{display:grid;grid-template-columns:repeat(6, 1fr)}.header .navbar ul li a{display:block;width:100%;color:#fff;font-size:24px;font-weight:700;line-height:70px;text-align:center}.header .navbar ul .checked a,.header .navbar ul li a:hover{background-color:#007fe4}.header .mobile-navbar{display:none;height:60px;background-color:var(--color-blue);line-height:60px;color:#fff}.header .mobile-navbar>div{display:flex;align-items:center;justify-content:space-between}.header .mobile-navbar>div a{color:#fff}.header .mobile-navbar>div .iconfont{width:24px;height:24px;vertical-align:text-top;fill:#fff;margin-left:20px;cursor:pointer}.header .mobile-navbar-popup{z-index:2000;position:fixed;top:0;right:0;width:260px;height:100vh;background-color:var(--color-blue);transform:translate(100vw, 0);transition:transform .3s ease-in-out}.header .mobile-navbar-popup-mask{content:"";z-index:2000;position:fixed;top:0;left:0;width:calc(100vw - 260px);height:100vh;background-color:rgba(0,0,0,.4980392157);transform:translate(calc(-100vw + 260px), 0);transition:transform .3s ease-in-out;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.header .mobile-navbar-popup .iconfont{width:24px;height:24px;fill:#fff;padding:18px 24px}.header .mobile-navbar-popup ul{margin-top:20px;overflow-y:auto}.header .mobile-navbar-popup ul li a{padding:0 20px;display:block;width:100%;color:#fff;font-size:24px;font-weight:700;line-height:70px}.header .mobile-navbar-popup ul .checked a{background-color:#007fe4}@media screen and (max-width: 1024px){.header .horizontal{margin-top:20px;display:block}.header .search{margin:20px auto 0 auto}}@media screen and (max-width: 768px){.header>.background{height:300px;background-size:auto 100%}.header .link,.header .navbar{display:none}.header .logo a{margin-top:30px;flex-direction:column}.header .logo i{width:80px;height:60px}.header .logo div p:first-child{font-size:30px;text-align:center;text-shadow:0 0 6px #fff}.header .logo div p:last-child{font-size:12px;line-height:16px}.header .mobile-navbar{display:block}}@media screen and (max-width: 576px){.header>.background{background-position:80% 100%}.header .logo i{width:80px;height:60px}.header .logo div p:first-child{font-size:22px;text-align:center;text-shadow:0 0 6px #fff}.header .logo div p:last-child{font-size:12px;line-height:16px;transform:scale(0.8)}.header .search{margin-top:30px}}