锘?header { position: relative; position: fixed; top: 0px; width: 100%; background: #fff; z-index: 500; } .header .toolbar { height: 32px; line-height: 32px; background: linear-gradient(0deg, #F3F3F3 0%, rgba(255,255,255,0.76) 100%); font-size: 12px; } .header .hotline { text-align: center; } .header .hotline span { color: #333; margin-left: 8px; } .header .account { margin-top: 8px; } .header .account .icoys { margin: -4px 4px 0px 0px; } .header .account li { height: 16px; line-height: 16px; float: left; padding: 0px 24px; border-left: 1px solid #D8D8D8; } .header .account li:first-child { border-left: none; } .header .account li a { color: #333; text-decoration: none; } .header .account li a:hover { color: #0793DE; } .header .toolsection { height: 48px; padding: 16px 0px; } .header .logo img { max-width: 194px; max-height: 48px; } .header .search { margin-top: 4px; } .header .search .wrap { width: 848px; height: 36px; border-radius: 20px; border: 2px solid #96DBFF; overflow: hidden; } .header .search .wrap input { float: left; width: 758px; height: 36px; line-height: 36px; padding: 0px 12px; } .header .search .wrap span { float: right; display: block; width: 66px; height: 36px; line-height: 32px; background: #008CD8; text-align: center; cursor: pointer; } .header .search .wrap span:hover { background: #0281C5; } .header .search .structure { line-height: 40px; margin-left: 24px; } .header .search .structure a { text-decoration:none;} .header .search .structure a:hover { color: #008CD8 ;} .header .search .structure span { margin: 0px 4px 0px 8px; } .header .nav { font-size: 16px; } .header .nav .category { position: relative; } .header .nav .category > a { display: block; width: 248px; height: 40px; line-height: 40px; text-align: center; font-weight: bold; color: #fff; background: #008CD8; text-decoration: none; } .header .nav .category ul { position: absolute; left: 0px; top: 40px; width: 248px; height: 376px; padding-top: 44px; background: rgba(0, 140, 216, 0.71); backdrop-filter: blur(10px); z-index: 200; display: none; } .header .nav .category li { height: 56px; line-height: 56px; position: relative; } .header .nav .category li a { padding: 0px 22px; display: block; color: #fff; text-decoration: none; } .header .nav .category li:hover > a { background: #fff; color: #333; } .header .nav .category li:hover dl { display: block; } .header .nav .category dl { display: none; width: 248px; position: absolute; right: -248px; top: 0px; background: rgba(0, 140, 216, 0.71); backdrop-filter: blur(10px); z-index: 200; box-shadow: 4px 0px 6px 0px rgba(0, 0, 0, 0.2); overflow: hidden; } .header .nav .category dd a { font-size: 14px; } .header .nav .category dd a:hover { background: #fff; color: #333; } .header .nav .category .icoys30 { margin: -2px 6px 0px 0px; } .header .nav .category .icoys-category0 { background-position: -545px -255px; } .header .nav .category .icoys-category1 { background-position: -605px -255px; } .header .nav .category .icoys-category2 { background-position: -665px -255px; } .header .nav .category .icoys-category3 { background-position: -725px -255px; } .header .nav .category .icoys-category4 { background-position: -785px -255px; } .header .nav .category .icoys-category5 { background-position: -845px -255px; } .header .nav .category li:hover .icoys30 { filter: brightness(0); } .header .nav .menu li { height: 24px; line-height: 24px; float: left; position: relative; } .header .nav .menu li > a { display: block; height: 40px; padding: 0px 24px; } .header .nav .menu li:last-child > a { padding: 0px 0px 0px 24px; } .header .nav .menu li > a:hover { text-decoration: none; color: #0793DE; } .header .nav .menu dl { display: none; position: absolute; min-width: 180px; top: 32px; left: 50%; transform: translate(-50%,0%); z-index: 2000; background: #fff; border: 1px solid rgba(216, 216, 216, 0.63); box-shadow: 0px 4px 20px 0px rgba(187, 187, 187, 0.4); } .header .nav .menu dd { height: 54px; line-height: 54px; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .header .nav .menu dd a { display: block; padding: 0px 40px; color: #333333; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; } .header .nav .menu dd a:hover { background: #0CA3F3; color: #fff; text-decoration: none; } .header .nav .menu li:hover dl { display: block; } .header .batch { display: inline-block; vertical-align: middle; width: 88px; height: 32px; line-height: 32px; text-align: center; border-radius: 20px; background: #0CA3F3; color: #FFFFFF; } .header .batch:hover { opacity: 0.8; } .header .cart { display: inline-block; vertical-align: middle; height: 40px; width: 40px; line-height: 40px; text-align: center; border-radius: 50%; background: #444C58; margin: 0px 16px; } .header .login { display: inline-block; vertical-align: middle; position: relative; padding: 10px 0px; } .header .login span { display: inline-block; vertical-align: middle; width: 40px; height: 40px; line-height: 40px; text-align: center; border-radius: 50%; background: #0CA3F3; margin-right: 8px; } .header .login b { font-weight: normal; } .header .login a { vertical-align: middle; } .header .login .tier { position: absolute; top: 60px; right: 0px; width: 200px; padding: 24px 20px; text-align: center; background: #fff; border: 1px solid #96DBFF; box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.05), 0px 10px 15px rgba(0, 0, 0, 0.1); z-index: 1000; display: none; } .header .login .tier > a { display: block; line-height: 32px; padding: 0px 20px; text-decoration: none; color: #666; white-space: nowrap; } .header .login .tier > a:hover { color: #0CA3F3; } .header .login .tier .name { padding: 4px 0px 6px 0px; } .header .login .tier .desc { padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid #eee; } .header .login:hover .tier { display: block; } .header .rightbar { width: 504px; } .header .contact { height: 34px; color: #444C58; padding-left: 28px; background: #fff; position: relative; } .header .contact span { color: #FF9B06; margin-left: 24px; } .header .contact:before { content: ""; position: absolute; top: 0px; left: -45px; display: block; border-left: 45px solid transparent; border-right: 0 solid transparent; border-top: 34px solid #fff; } .header .trapezoid { width: 45px; height: 68px; background: #1DA2E8; } .header .segment { height: 32px; border-bottom: 1px solid #D8D8D8; } .header.flex-top { box-shadow: 0px 2px 20px 0px rgba(219, 219, 219, 0.3); } .header.flex-top .nav .category ul { display: none; } .header.flex-top .segment { display: none; } .body { margin-top: 184px; } .body.body-top { margin-top: 120px; } .footer { color: #FFFFFF; } .footer .help {min-width:1300px; padding: 54px 0px 42px 0px; background: #008CD6; } .footer .contact dt { padding-bottom: 24px; } .footer .contact dd { width: 280px; padding-bottom: 6px; line-height: 24px; } .footer .contact dd p:last-child { font-size: 12px; } .footer .contact dd p span { display: inline-block; width: 250px; } .footer .contact dd p a { color: #fff; } .footer .contact dd .icoys { margin: 2px 6px 0px 0px; vertical-align: top; } .footer .nav { padding: 0px 80px; border-left: 1px solid rgba(216, 216, 216, 0.34); border-right: 1px solid rgba(216, 216, 216, 0.34); margin: 0px 42px 0px 80px; } .footer .nav dl { float: left; padding-right: 100px; max-width: 138px; } .footer .nav dl:last-child { padding-right: 0px; } .footer .nav dl a { color: #fff; } .footer .nav dt { padding-bottom: 24px; } .footer .nav dd { padding-bottom: 14px; line-height: 21px; } .footer .consultation { text-align: center; } .footer .consultation p { margin-top: 8px; } .footer .qrcode img { width: 120px; background-size: cover; } .footer .hotline { width: 120px; } .footer .copyright {min-width:1300px; background: #0078B8; box-shadow: inset 0px 4px 12px 0px rgba(4, 110, 167, 0.77); } .footer .copyright a { color: #fff; } .footer .links { line-height: 52px; border-bottom: 1px solid #5696B8; } .footer .links a { color: #fff; margin-left: 14px; } .footer .links a:first-child { margin-left: 24px; } .footer .icp { line-height: 48px; font-size: 12px; } /*鍙充晶瀵艱埅*/ .toolbar-right { position: fixed; top: 0; right: 0; width: 0; height: 100%; -webkit-transition: right .3s ease-in-out 0s; -moz-transition: right .3s ease-in-out 0s; transition: right .3s ease-in-out 0s; background: #fff; z-index: 600; overflow: visible !important; } .toolbar-right .tabs { position: absolute; top: 50%; left: -40px; width: 40px; margin-top: -132px; } .toolbar-right li { width: 40px; height: 40px; line-height: 40px; margin-bottom: 4px; position: relative; } .toolbar-right li label { display: block; width: 40px; height: 40px; text-align: center; z-index: 100; position: relative; cursor: pointer; border-radius: 5px; background: #008CD8; } .toolbar-right li:hover label, .toolbar-right li:hover span { background: #0281C5; } .toolbar-right li .ico30 { background-position-y: -555px; } .toolbar-right li span { position: absolute; top: 0; right: -120px; width: 108px; padding-left: 12px; transition: all 0.3s; color: #fff; border-radius:5px 5px 5px 5px; } .toolbar-right li:hover span { right: 0px; } .toolbar-right li:hover .wexin { right: 24px; } .toolbar-right li em { position: absolute; top: -10px; left: -15px; display: block; width: 24px; height: 24px; line-height: 24px; text-align: center; color: #fff; border-radius: 50%; background: #EE5F51; z-index: 200; } .toolbar-right li:hover em { opacity: 0; } .toolbar-right .tier { position: absolute; left: 0; top: 0; height: 100%; z-index: 50; background: #fff; box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1), 0px 2px 4px rgba(0, 0, 0, 0.06); z-index: 300; width: 300px; } .toolbar-right .tier .title { height: 40px; line-height: 40px; padding: 0px 12px 0px 24px; background: #F5F5F5; } .toolbar-right .tier .title .flr { width: 20px; height: 20px; margin-top: 10px; line-height: 20px; cursor: pointer; } .toolbar-right .tier .title .flr:hover { background: #ddd; } .toolbar-right .tier .item { padding: 18px 24px; border-bottom: 1px solid #eee; line-height: 20px; } .toolbar-right .tier .pic { width: 48px; height: 48px; border-radius: 50%; background: #eee; margin-bottom: 6px; overflow: hidden; } .toolbar-right .tier .pic img { max-height: 100%; max-width: 100%; } .toolbar-right .tier .name { width: 48px; text-align: center; } .toolbar-right .tier .info { padding-bottom: 6px; } .toolbar-right .tier .info:last-child { padding-bottom: 0px; } .toolbar-right .tier .info .ico { margin: 0px 7px 0px 0px; vertical-align: top; } .toolbar-right .tier .info span { display: inline-block; vertical-align: top; width: 150px; word-break: break-all; word-wrap: break-word; } .toolbar-right .tier .info a span:hover { text-decoration: underline; } .toolbar-right .tier table { width: 100%; text-align: left; } .toolbar-right .msg { padding: 16px 24px; } 青柠影视在线播放,青青热久免费精品视频在,青青热久免费精品视频在