a { background-color: transparent; text-decoration: none; cursor: pointer; color: #333; } a:active, a:hover { color: #F10215; outline: 0; text-decoration: none; } a.nohover:hover { color: inherit; outline: 0; text-decoration: none; } .fl { float: left; } .fr { float: right; } .width-1200 { width: 1200px; margin: 0 auto; } .b-title { font-weight: 600; font-size: 26px; position: relative; padding-bottom: 30px; width: 105px; } ul, li, ol { margin: 0; padding: 0; list-style: none outside none; } /** 首页头部样式 **/ .header { background-color: #fff; border-bottom: 1px solid #ddd; margin-bottom: 10px; } .header .top-bg { height: 30px; line-height: 30px; color: #666; font-size: 13px; background-color: #f5f5f5; } .header .header-top { height: 90px; padding: 10px 0; } .header .logo-box { display: flex; justify-content: center; height: 48px; } .header .logo { height: 40px; margin-right: 20px; max-height: 40px; line-height: 6px; position: relative; top: 5px; } .header .space-line { height: 100%; width: 1px; background-color: rgba(0, 0, 0, 0.1); margin-right: 20px; } .header .logo-brand { margin-right: 10px; width: 100px; height: 70px; } .header .logo-title { font-size: 32px; font-weight: bold; color: #DC3223; display: inline; position: relative; } .btn-login { background-color: #DC3223; color: #fff; width: 60px; height: 30px; text-align: center; line-height: 30px; cursor: pointer; margin-top: 15px; border-radius: 5px; } .flex-between { display: flex; flex-wrap: nowrap; justify-content: space-between; } .detail_link_kefu { width: 800px; height: 250px; background: url(../images/pc_jiaocheng_banner_bg.png) no-repeat; background-size: auto; background-size: 100% 100%; text-align: center; box-sizing: border-box; margin-top: 20px; } .detail_link_kefu p { color: #fff; font-size: 24px; margin-bottom: 5px; } .nav { box-shadow: -2px -2px 10px #eee; color: #333; height: 60px; background-color: #fff; } .nav .nav-list { display: flex; flex-wrap: wrap; } .nav-item { text-align: center; font-weight: 600; font-size: 18px; cursor: pointer; position: relative; margin: 0 10px; padding: 0 10px; } .nav-item.active, .nav-item:hover { border-bottom: 3px solid red; } #navbarSupportedContent { justify-content: flex-end; } .nav-product:hover .nav-product-menu { display: block; } .nav-product-menu { width: 190px; background-color: rgba(0, 0, 0, 0.4); position: absolute; z-index: 9; display: none; } .nav-product-menu li { margin: 0 10px; line-height: 48px; font-size: 15px; color: #fff; border-bottom: 1px solid #ddd; } .call-24 { margin-top: 10px; } .call-24 .dh-ico { width: 40px; height: 40px; margin: 5px 5px 0 0; } .call-24 .dh-title { font-size: 16px; color: #666; letter-spacing: 4px; text-align: center; } .call-24 .dh-phone { font-size: 24px; color: #DC3223; font-weight: 600; } /* 底部導航 */ .index-footer { width: 100%; background-color: #666; color: rgba(255, 255, 255, 0.4); text-align: center; padding-bottom: 40px; border-top: 4px solid #DC3223; } .flex-start { display: flex; flex-wrap: nowrap; justify-content: flex-start; } .footer-menu { padding: 40px 0 20px; } .footer-menu span { margin: 0 8px 0 10px; } .footer-address span { margin-right: 20px; } .footer-bottom { font-size: 12px; line-height: 40px; color: #333; text-align: center; } .footer-item { width: 25%; color: #fff; text-align: left; line-height: 1.8; } .footer-item .footer-title { font-size: 18px; padding: 50px 0 10px; } .footer-item .footer-img { width: 140px; height: 140px; padding-top: 50px; box-sizing: content-box; } .footer-center { text-align: center; } .follow-tips { padding-top: 5px; } .noselect { -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -khtml-user-select: none; /* Konqueror */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently*/ } /** 首頁輪播圖 **/ .banner-bg { width: 100%; min-width: 1200px; height: 500px; background-repeat: no-repeat; background-position: center center; background-size: auto 100%; } .index-banner { position: relative; } .swiper-container { /*min-width: 1200px;*/ /*height: 500px;*/ } .swiper-pagination-bullet { background: #fff; opacity: 1; width: 10px; height: 10px; } .swiper-pagination-bullet-active { opacity: 1; background: #fff !important; } .index-about { background-color: #fff; padding-bottom: 30px; } .index-title { text-align: center; padding: 30px 0; } .index-title .name { color: #006272; font-size: 24px; font-weight: 600; padding: 35px 0 20px; } .index-title .desc { width: 276px; margin: 0 auto; background-color: #ebebeb; border-radius: 18px; color: #999; font-size: 14px; text-align: center; line-height: 36px; } .a-bg { width: 580px; height: 350px; position: relative; background: url(../images/29.png) no-repeat center center; } .a-bg2 { background: url(../images/30.png) no-repeat center center; } .a-bg .area-title { position: absolute; width: 500px; height: 100px; bottom: 0; left: 0; right: 0; margin: auto; background-color: rgba(242, 242, 242, 0.78); padding: 10px 15px; } .a-bg .a-title { font-size: 18px; font-weight: 600; margin-bottom: 8px; } .a-bg .a-desc { font-size: 16px; color: #666; } .why-item { width: 25%; text-align: center; } .why-img { width: 130px; height: 130px; } .why-title { font-size: 20px; font-weight: 600; margin: 6px 0 12px; } .why-desc { font-size: 14px; color: #666; } .serve-item { width: 23%; padding: 40px 20px; background-color: #eeeeee; text-align: center; } .serve-item:hover { background-color: #ff9278; } .serve-item .serve-img { width: 150px; height: 150px; margin-bottom: 80px; } .serve-item .serve-title { font-size: 22px; font-weight: 600; padding-bottom: 12px; } .serve-item .serve-desc { color: #666; font-size: 14px; } .course-list { background-color: #eee; padding: 20px; flex-wrap: wrap; line-height: 2.2; } .course-list .course-item { width: 33.33%; } .btn-more { width: 160px; height: 44px; margin: auto; background-color: #ebebeb; font-size: #999; line-height: 44px; text-align: center; margin-top: 20px; } a { color: inherit !important; } /* 软件中心 */ .soft-list { flex-wrap: wrap; } .soft-item { width: 600px; padding: 0 10px; display: flex; flex-wrap: nowrap; justify-content: flex-start; border-right: 1px solid #ccc; margin-bottom: 50px; } .soft-item .soft-img { width: 100px; height: 100px; margin-right: 20px; } .soft-item .soft-title { font-size: 22px; font-weight: 600; margin: 10px 0; } .soft-item .soft-desc { width: 300px; font-size: 14px; color: #666; } .soft-item .soft-btn { width: 140px; } .soft-item .sbtn-download { background-color: #DC3223; color: #fff; text-align: center; height: 35px; line-height: 35px; margin: 10px 0; cursor: pointer; } .soft-item .sbtn-detail { border: 1px solid #DC3223; color: #DC3223; text-align: center; height: 35px; line-height: 35px; cursor: pointer; } .buy-list .soft-item { border: none; box-shadow: 2px 2px 14px #666; padding: 20px; width: 48%; } .buy-soft-img { width: 50px; height: 50px; margin-right: 10px; } .buy-soft-title { text-align: center; font-size: 24px; font-weight: 600; line-height: 80px; background-color: #ffccbd; } .buy-item { width: 25%; line-height: 50px; font-size: 18px; font-weight: 600; text-align: center; margin: 30px 0; } .buy-item .buy-img { width: 40px; height: 40px; margin-right: 10px; } .buy-area { border: 1px solid #ddd; padding: 40px; margin-bottom: 60px; } .member-item { width: 20%; text-align: center; border: 1px solid #ddd; padding: 40px 20px; text-align: center; cursor: pointer; margin-bottom: 40px; } .member-item:hover, .member-item.active { border: 1px solid #DC3223; background-color: #FFCCBD; } .member-item .member-title { font-size: 28px; font-weight: 600; padding-bottom: 10px; margin-bottom: 30px; border-bottom: 1px solid #eee; } .member-item .member-money { font-size: 22px; font-weight: 600; color: #DC3223; margin-left: 4px; } .member-item .member-desc { margin-top: 12px; color: #666; font-size: 14px; } .pay-detail { width: 60%; line-height: 2; } .pay-title { font-weight: 600; font-size: 22px; margin-top: 18px; } .pay-desc { width: 40%; } .pay-type { padding: 4px 20px; border-radius: 4px; margin-right: 10px; } .buy-now { margin: 60px 0; width: 280px; height: 60px; line-height: 60px; background-color: #DC3223; color: #fff; text-align: center; border-radius: 4px; } .pay-money { color: #DC3223; font-size: 20px; font-weight: 600; } .pay-desc .pay-img { width: 180px; height: 180px; } .pay-content { line-height: 1.8; padding: 20px; font-size: 14px; } /* 帮助中心 */ .qa-item { background-color: #fff; padding: 30px; box-shadow: 4px 4px 10px #999; margin-bottom: 30px; } .qa-soft { width: 28%; border-right: 1px solid #ddd; margin-right: 2%; } .qa-soft-img { width: 100px; height: 100px; margin-right: 20px; } .qa-title { font-size: 18px; font-weight: 600; padding: 10px 0; } .qa-more { border: 1px solid #DC3223; color: #DC3223; width: 80px; height: 30px; text-align: center; line-height: 30px; border-radius: 4px; cursor: pointer; } .qa-list { width: 70%; flex-wrap: wrap; } .question-item { width: 50%; height: 30px; line-height: 20px; } .about-list { width: 800px; min-height: 500px; } .about-detail { width: 360px; margin-left: 40px; } .about-detail .about-area { background-color: #fff; margin-bottom: 20px; padding: 20px; } .about-area .about-title { font-size: 20px; font-weight: 600; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 2px solid #DC3223; } .about-area .news-item { line-height: 2.6; border-bottom: 1px solid #eee; } .about-list .about-item { display: flex; flex-wrap: wrap; justify-content: flex-start; background-color: #fff; margin-bottom: 6px; cursor: pointer; border-bottom: 1px solid #eee; } .no-data { text-align: center; padding: 50px; font-size: 18px; } .about-list .about-item a:hover { color: #fff; } .about-list .about-item:hover { background-color: #DC3223; color: #fff; } .about-list .about-item .i-time { width: 143px; padding: 24px; } .new-img { width: 120px; height: 80px; } .about-list .about-item .i-content { width: 600px; padding: 24px; } .about-item .i-content .i-title { font-size: 18px; font-weight: 600; } .about-item .i-content .i-desc { font-size: 14px; margin-top: 12px; } .news-detail { background-color: #fff; } .news-detail .news-title { font-size: 24px; font-weight: 600; text-align: center; padding: 40px 0 20px; } .news-detail .news-time { font-size: 14px; color: #666; text-align: center; padding-bottom: 20px; border-bottom: 1px dashed #eee; } .news-detail .news-content { padding: 40px 10px; line-height: 2.2; text-indent: 2em; } .news-content img, .news-content video { width: 100%; height: auto; padding: 10px 0; } .news-content video { height: 450px; } .pro-menu .menu-title { width: 292px; height: 60px; background-image: url('../images/menu-bg.png'); background-repeat: no-repeat; background-size: 100% 100%; color: #fff; font-size: 26px; text-align: center; line-height: 60px; } .pro-menu .menu-list { background-color: #EBEBEB; padding: 16px; line-height: 2; } .index-product { margin-top: 40px; } .menu-list .menu-item { height: 40px; line-height: 40px; padding: 0 15px; background-color: #fff; color: #333; font-size: 14px; margin-bottom: 8px; display: flex; flex-wrap: wrap; justify-content: space-between; cursor: pointer; } .menu-item .arrow-active, .menu-item .arrow { width: 12px; height: 12px; margin-top: 14px; } .menu-item .arrow-active { display: none; } .menu-item.active, .menu-item:hover { color: #DC3223; } .menu-item.active .arrow-active, .menu-item:hover .arrow-active { display: block; } .menu-item.active .arrow, .menu-item:hover .arrow { display: none; } /*公司简介页面*/ .menu-list .contact-info { color: #333; padding: 2px; } .introduce-detail { width: 100%; margin-left: 30px; } .de-title { width: 100%; border-bottom: 2px solid #DC3223; } .de-title .name { font-size: 28px; } .de-title .en-name { font-size: 14px; color: #999999; padding: 11px 0; } .introduce-content { color: #666; line-height: 2.2; text-indent: 2em; padding: 20px; margin-bottom: 40px; } .img-area { padding: 20px 0; } .car-img { margin: 20px; } /* 登录弹窗 */ .login-model { height: 340px; } .login-title { font-size: 16px; } .phone-login { padding: 40px 20px; } .login-title span { display: inline-block; padding: 10px 0; width: 49%; text-align: center; cursor: pointer; border-bottom: 2px solid #eee; } .login-title span.active { color: #BD2C00; border-bottom: 2px solid #BD2C00; } .wei-login { text-align: center; padding: 20px; } .login-border { display: inline-block; margin-top: 0; margin-bottom: 10px; } .login-code { width: 220px; height: 220px; border: 1px solid #eee; } .no-code { width: 220px; height: 220px; text-align: center; background-color: #eee; color: #e12424; font-size: 22px; font-weight: 600; cursor: pointer; padding-top: 70px; } .expire-time { font-size: 12px; font-weight: 600; color: #e12424; } .demo-spin-icon-load { animation: ani-demo-spin 1s linear infinite; } @keyframes ani-demo-spin { from { transform: rotate(0deg); } 50% { transform: rotate(180deg); } to { transform: rotate(360deg); } } .login-icon { vertical-align: middle !important; margin-right: 5px; width: 30px; height: 30px; } /* jimp */ .info-flex { display: flex; flex-wrap: nowrap; justify-content: space-around; align-items: center; padding: 50px 0; } .info-img, .info-content { width: 40%; } .into-title { font-size: 22px; line-height: 2.2; font-weight: 600; } .info-desc { font-size: 14px; line-height: 1.8; color: #666; } .info-flex .f-item { display: flex; flex-wrap: nowrap; justify-content: center; width: 33.33%; align-items: center; margin: 20px 0; font-size: 14px; } .font-14 { font-size: 14px; } .info-flex .icon-o { width: 50px; height: 40px; margin-right: 20px; } .info-flex .f-item2 { width: 26%; text-align: center; margin: 20px 0; font-size: 14px; } .f-item2 .f-cont { font-weight: 600; font-size: 16px; margin: 20px 0 10px 0; } .info-flex .icon-o2 { width: 50px; height: 50px; }