input, button, select, textarea, div, img, span { outline: none; } .cl:before { content: ''; display: table; } .cl:after { content: ''; display: table; clear: both; } [data-event=link] { cursor: pointer; } .pc_show { display: block !important; } .yd_show { display: none !important; } /* 澶撮儴 */ body { padding-top: 150px; font-size: 14px; } .header { background: #FFFFFF; z-index: 10000; position: fixed; top: 0; left: 0; } .header-mini { border-bottom: 1px solid #f2f2f2; } .header .logo-box { display: block; position: relative; } .header .logo { width: 254px; transition: all 0.3s; margin-left: calc((600px - 50vw) / 2 + 26px); } .header-mini .logo { width: 120px; } .header .nav-box { padding-top: 30px; transition: all 0.3s; } .header-mini .nav-box { padding-top: 0; } .header .title { /* padding: 30px 18% 0 8%; */ width: 1200px; margin-left: auto; margin-right: auto; align-items: center; display: flex; justify-content: space-between; } .header .search-box { position: relative; display: flex; justify-content: flex-end !important; transition: all 0.3s; height: 43px; opacity: 1; } .header-mini .search-box { height: 0; opacity: 0; overflow: hidden; } .header .search { width: 315px; height: 100%; border: 1px solid #C3C3C3; padding-left: 10px; padding-right: 40px; font-size: 16px; color: #666; } .search-img { right: 2%; height: 50%; top: 25%; cursor: pointer; position: absolute; } .nav-ul { margin-right: -20px; display: flex; } .nav-ul-li { margin: 0; padding: 0 20px; height: 77px; line-height: 77px; position: relative; color: #222222; font-size: 18px; transition: all 0.3s; } .header-mini .nav-ul-li { height: 60px; line-height: 60px; } .nav-ul-li::after { content: ''; position: absolute; left: 50%; bottom: 0; width: 0; height: 2px; background: #00A1EC; transition: all 0.3s; } .nav-ul-li.active, .nav-ul-li:hover { color: #00A1EC; } .nav-ul-li.active::after, .nav-ul-li:hover::after { width: 100%; left: 0; } .bottom-show { border-bottom: 3px solid #00A1EC; } /* 涓昏鍐呭鍖哄煙 */ .main-box { width: 1200px; margin: auto; } .route-navs { padding: 30px 0; } .vertical-line { margin: 0 20px; width: 2px; height: 14px; } .sub-categories { margin: 0 20px 0 0; } .sub-categories>li { padding: 24px 20px 0 20px; background-color: #ffffff; } .sub-categories>li:nth-of-type(1) { padding: 25px 50px; background-color: #00A1EC; } .sub-categories>li>span { width: 100%; padding: 0 0 24px 0; border-bottom: 1px solid #dcdcdc; cursor: pointer; } .sub-categories>li.active>span, .sub-categories>li:hover>span { color: #00A1EC; } .sub-categories>li:nth-last-of-type(1)>span { border-bottom: none; } .content-box { padding: 40px 30px 100px 30px; } .content-box .tit1 { font-size: 24px; } /* 搴曢儴 */ footer { position: relative; margin: 0 auto; background: url(../images/footer-bg.png); background: repeating-linear-gradient(-45deg, #0094d9 0, #0094d9 1px, #00a1ec 2px, #00a1ec 6px); /* background-size: cover; */ padding: 40px calc(50vw - 600px) 20px calc(50vw - 600px); } .select-wraper { position: relative; } .select-wraper>select { appearance: none; -moz-appearance: none; /* Firefox */ -webkit-appearance: none; /* Safari 鍜 Chrome */ border: none; /* //娓呴櫎select鑱氱劍鏃跺€欑殑杈规棰滆壊 */ outline: none; /* //灏唖elect鐨勫楂樼瓑浜巇iv鐨勫楂 */ display: inline-block; margin: 0 0 0 0; position: relative; font-size: 18px; padding: 0px 50px; background: none; color: #fff; } /* //浣跨敤浼被缁檚elect娣诲姞鑷繁鎯崇敤鐨勫浘鏍 */ .select-wraper:after { content: ""; width: 14px; height: 10px; background: url(../images/select-down.png) no-repeat center; background-size: contain; font-size: 0; /* //閫氳繃瀹氫綅灏嗗浘鏍囨斁鍦ㄥ悎閫傜殑浣嶇疆 */ position: absolute; right: 0px; top: 20%; /* //缁欒嚜瀹氫箟鐨勫浘鏍囧疄鐜扮偣鍑讳笅鏉ュ姛鑳 */ pointer-events: none; } .select-wraper>select>option { /* background-color: #00A1EC; */ color: #333; } .links { border-bottom: 1px solid rgba(255, 255, 255, 0.5); padding: 0 0 20px 0; } .links .link { margin-right: 100px; } .friend-icon { margin: 0 0 10px 0; } .copyright { width: 80%; margin: 50px 0 50px 0; line-height: 2; font-size: 14px; color: rgba(255, 255, 255, 0.8); } .copyright .p1 { display: block; } .copyright a { color: rgba(255, 255, 255, 0.8); } .copyright a:hover { color: rgba(255, 255, 255, 1); } .qrcode { bottom: 7%; right: 18.75%; } .qrcode .name { display: block; color: #fff; opacity: 0.8; font-size: 14px; text-align: center; } .scroll-top { display: block; position: fixed; width: 58px; height: 58px; background: url(../images/scroll_top.png); background-size: 100% 100%; right: calc(50% - 678px); bottom: -58px; cursor: pointer; z-index: 9999; transition: background 0.5s, opacity 0.5s, bottom 0.5s; } .scroll-top.show { display: block; bottom: 40px; opacity: 1; } .scroll-top:hover { background: url(../images/scroll_top-active.png); background-size: 100% 100%; } .not_found { padding: 80px 0; display: block; width: 100%; } .not_found img { display: block; margin: 0 auto; margin-bottom: 20px; width: 250px; } .not_found p { letter-spacing: 2px; text-align: center; font-size: 14px; color: #999; } /** * 褰撳睆骞曞搴﹀皬浜?200px鏃讹紝閮介噰鍙栨墜鏈虹鏍峰紡 */ @media (max-width: 1230px) { .nav-ul { margin-right: 0; } } @media (min-width: 1200px) { .header .nav-box { height: auto !important; } } @media (max-width: 1199.98px) { .pc_show { display: none !important; } .yd_show { display: block !important; } body { padding-top: 50px; } .header { border-bottom: 1px solid #F2F2F2; } .header .title { padding: 0; width: 92%; display: block; } .header .logo-box { height: 50px; width: 100%; display: flex; align-items: center; justify-content: space-between; } .header .logo { width: 100px; margin-left: 0; } .header .nav-box { position: fixed; z-index: 9999; left: 0; top: 50px; width: 100%; height: 0; overflow: hidden; padding-top: 0; transition: all 300ms linear 0s; background-color: rgba(255, 255, 255, 0.95); } .header .nav-show {} .header .search-box { /* display: none; */ height: 36px !important; opacity: 1 !important; width: 92%; margin: 15px 4% 10px 4%; } .header .search-box .search { border-radius: 18px; font-size: 14px; width: 100%; /* background: #F2F2F2; */ /* border: 0; */ background: none; /* border-color: #f2f2f2; */ } .header .search-box .search-img { height: 50%; top: 25%; right: 3%; } .navbar-toggle {} .bottom-show { border-bottom: 1px solid #c3c9cc; } .nav-ul-li { display: block; height: 50px !important; line-height: 50px !important; width: 100%; font-size: 16px; color: #1A1A1A; padding: 0 4%; /* margin: 10px 0 0 0; */ /* padding: 0px 20px 20px 22px; */ /* border-bottom: 1px solid #c3c9cc; */ } .nav-ul-li::after { height: 1px !important; background: #E5E5E5; } .nav-ul-li:hover { color: #1A1A1A; } .nav-ul-li.active, .nav-ul-li:active { color: #00A1EC; } .nav-ul-li:hover::after, .nav-ul-li.active::after { width: 0; } .nav-ul-li.active::after, .nav-ul-li:active::after { background: #00A1EC; } .nav-ul { /* height: 0px; */ display: block; margin-right: 0; /* overflow: hidden; */ transition: all 500ms linear 0s; } /* .nav-ul-show { height: 330px; overflow: auto; background-color: rgba(255, 255, 255, 0.6); transition: all 500ms linear 0s; } */ .icon-bar { display: block; width: 22px; height: 2px; border-radius: 1px; margin-bottom: 5px; background: #1A1A1A; } .icon-bar:last-child { margin-bottom: 0; } .main-box { width: 100%; } .route-navs { padding: 10px 0; padding-left: 0.15rem; } .sub-categories { margin: 0; overflow-x: auto; white-space: nowrap; text-align: center; margin-top: 10px; } .sub-categories>li { padding: 8px 12px 0 12px; display: inline-block; border-radius: 5px; } .sub-categories>li:nth-of-type(1) { padding: 10px 15px; font-size: 20px; display: none; } .sub-categories>li>span { padding: 0 0 8px 0; border-bottom: 0; font-size: 15px; } .content-box { margin: 20px 0 0 0; padding: 0.15rem; } .content-box .tit1 { font-size: 20px; } /* 搴曢儴 */ footer { margin: 0 auto; padding: 20px 4%; /* background: repeating-linear-gradient(-45deg, #0094d9, #0094d9 1px, #00a1ec 2px, #00a1ec 6px); */ } .friend-icon { width: 18px; margin: 0 5px 0 0; } .links { padding: 0 0 20px 0; } .links .link { width: 100%; margin-right: 0; margin-bottom: 10px; } .links .link span { font-size: 16px; } .select-wraper { width: 50%; } .select-wraper>select { width: 100%; padding: 10px 20px 5px; font-size: 14px; } .select-wraper:after { top: 45%; width: 8px; height: 6px; } .copyright { width: 100%; margin: 10px 0 140px 0; font-size: 13px; color: rgba(255, 255, 255, 0.7); } .copyright a { color: rgba(255, 255, 255, 0.7); } .copyright .p1 { display: inline-block; } .copyright .p2 { display: block; } .qrcode { bottom: 15px; right: calc(50vw - 55px); } .qrcode img { width: 110px; } .qrcode .name { font-size: 13px; } .not_found { padding: 40px 0; } .not_found img { margin-bottom: 10px; width: 180px; } .not_found p { font-size: 13px; } }