.container { max-width: 1440px!important; } /* page */ .page-num a { display: inline-block; padding: 4px 12px; margin: 0 5px; border: 1px solid #aaa; font-size: 14px; } .page-num a.on, .page-num a:hover { background-color: #2265a8; color: #fff!important; border-color: #2265a8; } @media (max-width: 767px) { .page-num a { padding: 2px 8px; margin: 0 3px; font-size: 12px; } } /* Banner指针 */ .carousel-control-prev > span.iconfont, .carousel-control-next > span.iconfont { font-size: 40px; color: #eee; } @media (min-width: 576px) { .carousel { overflow: hidden; } .carousel-control-next, .carousel-control-prev { -webkit-transition: all .6s; -moz-transition: all .6s; -ms-transition: all .6s; -o-transition: all .6s; transition:all .6s; } .carousel-control-prev { left: -15%; } .carousel-control-next { right: -15%; } .carousel:hover > .carousel-control-prev { left: 0; } .carousel:hover > .carousel-control-next { right: 0; } .carousel-control-prev > span.iconfont, .carousel-control-next > span.iconfont { font-size: 60px; } } /* banner */ .banner { margin: 0 -15px; } .carousel-indicators li { width: 8px; height: 8px; background: none; border-radius: 50%; border: 1px solid #fff; } .carousel-indicators .active { width: 20px; height: 5px; margin-top: 1.5px; border-radius: 3px; background-color: #fff; } @media (max-width: 1439px) { .banner { /* margin: 0 -15px; */ } } @media (max-width: 767px) { .carousel-indicators { bottom: 5px; } } @media (max-width: 575px) { /* .carousel-indicators { bottom: 0; } */ } /* title */ .title > h3 { letter-spacing: -1px; } .title > hr { width: 30px; border: 2px solid #555; } @media (max-width: 575px) { .title > h3 { font-size: 20px; } .title > hr { width: 24px; border: 1px solid #555; margin-top: 0; } } /* product */ .product-hot ul > li { width: 31%; margin-right: 3.5%; } .product-hot ul > li.last { margin-right: 0; } .product-hot ul > li > .product-img { /* height: 437px; */ background: url('../images/product_bg.jpg') no-repeat center center; -webkit-background-size: cover; background-size: cover; } .product-hot ul > li > .product-img img { -webkit-transition: all .8s; -moz-transition: all .8s; -ms-transition: all .8s; -o-transition: all .8s; transition:all .8s; } .product-hot ul > li > .product-img:hover img { transform: scale(1.1); } .product-hot ul > li > p { font-weight: 500; text-decoration: underline; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .product-hot .product-banner > a.icon-arrow { position: absolute; top: 60%; left:9.5%; height: 40px; width: 40px; line-height: 40px; font-size: 16px; border-radius: 50%; border: 1px solid #fff; color: #fff; cursor: pointer; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition:all .2s; } .product-hot .product-banner > a.icon-arrow:hover { background-color: #395bb3; border-color: #395bb3; } @media (max-width: 1439px) { /* .product-hot ul > li { width: 360px; } */ .product-hot ul > li > .product-img { /* height: 344px; */ } .product-hot .product-banner { margin: 0 -15px; } } @media (max-width: 1199px) { /* .product-hot ul > li { width: 300px; } */ .product-hot ul > li > .product-img { /* height: 288px; */ } } @media (max-width: 991px) { .product-hot ul > li { width: 48%; margin-right: 4%!important; } .product-hot ul > li.last-mini { margin-right: 0!important; } .product-hot ul > li > .product-img { /* height: 331px; */ } } @media (max-width: 767px) { /* .product-hot ul > li { width: 250px; margin-right: 10px!important; } .product-hot ul > li.last-mini { margin-right: 0!important; } */ .product-hot ul > li > .product-img { /* height: 245px; */ } } @media (max-width: 575px) { .product-hot ul > li { width: 100%; margin-right: 0!important; } .product-hot ul > li > .product-img { height: auto; } } /* partner */ .partner .partner-wrapper { margin-left: 33px; margin-top: 120px; height: 320px; } .partner .partner-wrapper .item-partner { overflow: hidden; position: absolute; top: 0; height: 159px; line-height: 159px; width: 159px; border: 1px solid #ddd; transform: rotate(45deg); cursor: pointer; -webkit-transition: all .4s; -moz-transition: all .4s; -ms-transition: all .4s; -o-transition: all .4s; transition:all .4s; } .partner .partner-wrapper .item-partner:hover { box-shadow: 5px 5px 15px #ddd; } .partner .partner-wrapper .item-partner > img { transform: rotate(-45deg); } .partner .partner-wrapper .item-partner.item-2 { left: 237px; } .partner .partner-wrapper .item-partner.item-3 { left: 474px; } .partner .partner-wrapper .item-partner.item-4 { left: 711px; } .partner .partner-wrapper .item-partner.item-5 { left: 948px; } .partner .partner-wrapper .item-partner.item-6 { left: 1185px; } .partner .partner-wrapper .item-partner.list-bottom { top: 118.5px; } .partner .partner-wrapper .item-partner.item-7 { left: 118.5px; } .partner .partner-wrapper .item-partner.item-8 { left: 355.5px; } .partner .partner-wrapper .item-partner.item-9 { left: 592.5px; } .partner .partner-wrapper .item-partner.item-10 { left: 829.5px; } .partner .partner-wrapper .item-partner.item-11 { left: 1066.5px; } @media (max-width: 1439px) { .partner .partner-wrapper { height: 250px; width: 1070px; left: 50%; margin-top: 80px; margin-left: -535px; } .partner .partner-wrapper .item-partner { height: 125px; width: 125px; line-height: 125px; } .partner .partner-wrapper .item-partner.item-2 { left: 186.666666px; } .partner .partner-wrapper .item-partner.item-3 { left: 373.333332px; } .partner .partner-wrapper .item-partner.item-4 { left: 560px; } .partner .partner-wrapper .item-partner.item-5 { left: 746.66666px; } .partner .partner-wrapper .item-partner.item-6 { left: 933.333326px; } .partner .partner-wrapper .item-partner.list-bottom { top: 93.333333px; } .partner .partner-wrapper .item-partner.item-7 { left: 93.333333px; } .partner .partner-wrapper .item-partner.item-8 { left: 280px; } .partner .partner-wrapper .item-partner.item-9 { left: 466.666666px; } .partner .partner-wrapper .item-partner.item-10 { left: 653.3333326px; } .partner .partner-wrapper .item-partner.item-11 { left: 840px; } } @media (max-width: 1199px) { .partner .partner-wrapper { height: 206.5px; width: 890px; margin-top: 60px; margin-left: -445px; } .partner .partner-wrapper .item-partner { height: 104.9px; width: 104.9px; line-height: 104.9px; } .partner .partner-wrapper .item-partner.item-2 { left: 156.333333px; } .partner .partner-wrapper .item-partner.item-3 { left: 312.666666px; } .partner .partner-wrapper .item-partner.item-4 { left: 467px; } .partner .partner-wrapper .item-partner.item-5 { left: 623.3333333px; } .partner .partner-wrapper .item-partner.item-6 { left: 779.6666663px; } .partner .partner-wrapper .item-partner.list-bottom { top: 78.16666665px; } .partner .partner-wrapper .item-partner.item-7 { left: 78.16666665px; } .partner .partner-wrapper .item-partner.item-8 { left: 235.05517766px; } .partner .partner-wrapper .item-partner.item-9 { left: 389.333333px; } .partner .partner-wrapper .item-partner.item-10 { left: 545.66666px; } .partner .partner-wrapper .item-partner.item-11 { left: 702px; } } @media (max-width: 991px) { .partner .partner-wrapper { height: auto; width: 100%; left: 0; margin-left: 0; margin-top: 30px; font-size: 0; } .partner .partner-wrapper .item-partner { display: inline-block; position: static; transform: rotate(0); width: 19%; padding: 0 10px; margin-right: 1.25%; margin-bottom: 10px; } .partner .partner-wrapper .item-partner > img { transform: rotate(0); } .partner .partner-wrapper .item-partner.item-5, .partner .partner-wrapper .item-partner.item-10 { margin-right: 0; } .partner .partner-wrapper .item-partner.item-11 { display: none; } } @media (max-width: 767px) { .partner .partner-wrapper .item-partner { height: 60px; line-height: 60px; } } @media (max-width: 575px) { .partner .partner-wrapper { margin-top: 15px; } .partner .partner-wrapper .item-partner { padding: 0 5px; margin-bottom: 6px; } .partner .partner-wrapper .item-partner, .partner .partner-wrapper .item-partner.item-5 { width: 32.5%; margin-right: 1.125%; } .partner .partner-wrapper .item-partner.item-3, .partner .partner-wrapper .item-partner.item-6, .partner .partner-wrapper .item-partner.item-9 { margin-right: 0; } .partner .partner-wrapper .item-partner.item-10 { display: none; } } /* success */ .success-story { margin-top: 70px; padding: 70px 0; background: url('../images/success_bg.jpg') no-repeat center center; -webkit-background-size: cover; background-size: cover; } .success-story .title > hr { border-color: #fff; } .success-story ul.story-list > li { width: 33.333333%; padding: 0 70px; } .success-story ul.story-list > li > .header-box { height: 155px; width: 155px; overflow: hidden; border-radius: 50%; } .success-story ul.story-list > li > p { color: #ccc; font-size: 14px; font-weight: 200; } @media (max-width: 991px) { .success-story ul.story-list > li { width: 100%; padding: 20px; } } @media (max-width: 767px) { .success-story { margin-top: 50px; padding: 40px 0; } .success-story ul.story-list > li { padding: 10px 20px; } } @media (max-width: 575px) { .success-story { margin: 30px -15px 0 -15px; } } /* footer */ footer { border-top: 1px solid #ddd; background-color: #f6f7f8; } footer a:hover { color: #2c457c; } footer .container { padding: 0 70px; } footer ul.list-primary { padding: 70px 0; } footer ul.list-primary > li.primary-item { width: 14.2857142857%; } footer ul.list-primary > li.item-link { margin-left: 14.2857142857%; } footer ul.list-primary > li.primary-item > a, footer ul.list-primary > li.primary-item > ul.list-secondary > li > a { font-size: 18px; font-weight: bold; } footer ul.list-primary > li.primary-item > ul.list-secondary > li > a { line-height: 35px; } footer ul.list-primary > li.primary-item > ol.list-secondary > li > a { line-height: 35px; font-size: 14px; color: #555; } footer ul.list-primary > li.primary-item > ol.list-secondary > li > a:hover { color: #2c457c; } footer ul.list-primary > li.primary-item > ol.other-link > li > a { /* padding: 10px; */ display: inline-block; width: 36px; height: 36px; line-height: 36px; margin-right: 10px; border-radius: 50%; } footer .copyright { font-size: 13px; color: #999; } footer .footer-bottom { background-color: #353637; } footer .footer-bottom span { font-size: 14px; font-weight: bold; } footer .footer-bottom p { font-size: 12px; } @media (max-width: 1439px) { footer ul.list-primary > li.item-link { margin-left: 10%; width: 18.5714285714% } } @media (max-width: 1199px) { footer ul.list-primary > li.item-link { margin-left: 5%; width: 23.5714285714% } } @media (max-width: 991px) { footer .container { padding: 0 15px; } footer ul.list-primary > li.item-link { margin-left: 0; width: 28.5714285714% } } @media (max-width: 767px) { footer ul.list-primary { padding: 20px 0; } footer ul.list-primary > li.primary-item { display: none; } footer ul.list-primary > li.item-link { display: block; width: 100%; } } /* secondary-menu */ ul.path { padding: 8px 0; font-size: 14px; } ul.path > li { margin-right: 5px; color: #555; } ul.path > li::after { content: '/'; margin-left: 5px; } ul.path > li.now { font-weight: bold; color: #444; } ul.path > li.now::after { content: ''; margin-left: 0; } ul.secondary-menu > li { position: relative; padding: 0 20px; font-weight: bold; font-size: 18px; color: #555; } ul.secondary-menu > li.active { color: #000; } ul.secondary-menu > li::after { content: ''; position: absolute; top: 25%; right: 0; height: 50%; width: 1px; background-color: #555; } ul.secondary-menu > li:last-of-type::after { display: none; } ul.secondary-menu > li.active > a { border-bottom: 3px solid #000; } ul.secondary-menu > li > a { display: inline-block; padding: 10px 0; } ul.secondary-menu > li > a:hover { color: #000; } ul.third-menu { padding: 12px 0; background-color: #f6f7f8; font-size: 14px; } ul.third-menu > li { margin-right: 30px; } ul.third-menu > li:last-of-type { margin-right: 0; } ul.third-menu > li.active { color: #395bb3; } @media (max-width: 991px) { ul.secondary-menu > li { font-size: 14px; padding: 0 10px; } ul.secondary-menu > li::after { height: 40%; top: 30%; } ul.secondary-menu > li > a { padding: 5px 0; } ul.secondary-menu > li.active > a { border-bottom: 2px solid #000; } } @media (max-width: 767px) { ul.third-menu { display: none; } } /* product */ ul.product-list > li { width: 32%; margin-right: 2%; margin-bottom: 20px; } ul.product-list > li.last { margin-right: 0; } ul.product-list > li > .img-box { /* height: 330px; */ /* background-color: #f6f7f8; */ overflow: hidden; } ul.product-list > li > .img-box img { -webkit-transition: all 1s; -moz-transition: all 1s; -ms-transition: all 1s; -o-transition: all 1s; transition:all 1s; } ul.product-list > li > .img-box img:hover { transform: scale(1.1); } ul.product-list > li > .text-box > p.title { font-size: 18px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } ul.product-list > li > .text-box > p.desc { color: #555; font-size: 14px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } ul.product-list > li > .text-box > a { color: #999; font-size: 14px; -webkit-transition: all .6s; -moz-transition: all .6s; -ms-transition: all .6s; -o-transition: all .6s; transition:all .6s; } ul.product-list > li > .text-box > a:hover { color: #395bb3; } ul.product-list > li > .text-box > a > i.icon-arrow { position: relative; top: 1px; } @media (max-width: 1439px) { ul.product-list > li > .img-box { /* height: 280px; */ } } @media (max-width: 1199px) { ul.product-list > li > .img-box { /* height: 220px; */ } } @media (max-width: 991px) { ul.product-list > li, ul.product-list > li.last { width: 48%; margin-right: 4%; } ul.product-list > li.last-mini { margin-right: 0; } ul.product-list > li > .img-box { /* height: 240px; */ } } @media (max-width: 767px) { ul.product-list > li > .img-box { /* height: 200px; */ } } @media (max-width: 575px) { ul.product-list > li { width: 100%!important; margin-right: 0!important; } ul.product-list > li > .img-box { /* height: auto; */ } } /* product apply */ ul.apply-list > li { width: 23.5%; margin-right: 2%; margin-bottom: 25px; background-color: #f6f7f8; } ul.apply-list > li.last { margin-right: 0; } ul.apply-list > li > .img-box { height: 250px; padding: 35px; } ul.apply-list > li > .text-box { padding: 0 20px 30px 20px; } ul.apply-list > li > .text-box > p.title { font-size: 20px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } ul.apply-list > li > .text-box > p.desc { height: 69px; font-size: 14px; color: #555; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } ul.apply-list > li > .text-box > a { font-size: 14px; padding: 8px 35px; border: 2px solid #000; border-radius: 20px; -webkit-transition: all .3s; -moz-transition: all .3s; -ms-transition: all .3s; -o-transition: all .3s; transition:all .3s; } ul.apply-list > li > .text-box > a:hover { background-color: #000; color: #fff!important; } @media (max-width: 1439px) { ul.apply-list > li > .img-box { height: 220px; padding: 30px; } } @media (max-width: 1199px) { ul.apply-list > li { width: 32%; margin-bottom: 20px; } ul.apply-list > li.last { margin-right: 2%; } ul.apply-list > li.last-lg { margin-right: 0; } ul.apply-list > li > .img-box { height: 250px; padding: 35px; } } @media (max-width: 991px) { ul.apply-list > li, ul.apply-list > li.last, ul.apply-list > li.last-lg { width: 48%; margin-right: 4%; margin-bottom: 30px; } ul.apply-list > li.last-mini { margin-right: 0; } ul.apply-list > li > .img-box { height: 280px; } } @media (max-width: 767px) { ul.apply-list > li > .img-box { height: 250px; } } @media (max-width: 575px) { ul.apply-list > li { width: 100%!important; margin-right: 0!important; } ul.apply-list > li > .img-box { height: auto!important; } } /* product detail */ .detail-box, .news-detail > .view-content { padding: 0 100px 50px 100px; } .detail-box > .info > .img-box { width: 40%; /* height: 320px; */ /* background-color: #f6f7f8; */ } .detail-box > .info > .text-box { width: 60%; padding: 20px 40px; line-height: 26px; letter-spacing: 1px; color: #555; text-indent: 32px; } .detail-box > .info > .text-box p { margin-bottom: 0; } .detail-box > .detail > span.detail-title { padding: 5px 25px; border-top-left-radius: 5px; border-top-right-radius: 5px; background-color: #2265a8; color: #fff; } @media (max-width: 1439px) { .detail-box, .news-detail > .view-content { padding-left: 60px; padding-right: 60px; } .detail-box > .info > .text-box { padding: 0 40px; } } @media (max-width: 1199px) { .detail-box, .news-detail > .view-content { padding-left: 0; padding-right: 0; } .detail-box > .info > .img-box { /* height: 280px; */ } .detail-box > .info > .text-box { font-size: 14px; text-indent: 28px; } } @media (max-width: 991px) { .detail-box > .info > .img-box { float: none!important; margin: 0 auto; width: 70%; /* height: auto; */ } .detail-box > .info > .text-box { width: 100%; margin-top: 30px; } } @media (max-width: 767px) { .detail-box > .info > .img-box { width: 90%; } .detail-box > .info > .text-box { padding: 0 20px; } } @media (max-width: 575px) { .detail-box > .info > .img-box { width: 100%; } .detail-box > .info > .text-box { padding: 0; margin-top: 10px; line-height: 22px; } } /* about */ .about { padding: 50px 100px; } .about > .title > p { font-size: 20px; font-weight: bold; } .about > .title > span { font-size: 14px; color: #999; } @media (max-width: 991px) { .about { padding: 50px; } } @media (max-width: 767px) { .about { padding: 0 15px; padding-bottom: 50px; } } /* news */ ul.news-list > li { /*height: 200px;*/ margin-bottom: 20px; background-color: #f6f7f8; } ul.news-list > li > .img-box { width: 20%; } ul.news-list > li > .text-box { width: 80%; padding: 28px; } ul.news-list > li > .text-box h5 { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } ul.news-list > li > .text-box > span, ul.news-list > li > .text-box > a.more { font-size: 14px; color: #999; } ul.news-list > li > .text-box > p { margin: 15px 0; font-size: 15px; color: #555; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } ul.news-list > li > .text-box > span::before { position: relative; top: 1.5px; font-size: 18px; margin-right: 3px; } ul.news-list > li > .text-box > a.more { -webkit-transition: color .5s; -moz-transition: color .5s; -ms-transition: color .5s; -o-transition: color .5s; transition:color .5s; } ul.news-list > li > .text-box > a.more > i.icon-arrow { margin-left: 5px; position: relative; top: 1px; left: 0; -webkit-transition: left .5s; -moz-transition: left .5s; -ms-transition: left .5s; -o-transition: left .5s; transition:left .5s; } ul.news-list > li > .text-box > a.more:hover { color: #395bb3; } ul.news-list > li > .text-box > a.more:hover > i.icon-arrow { left: 10px; } @media (max-width: 1439px) { ul.news-list > li { /*height: 180px;*/ } ul.news-list > li > .img-box { width: 23%; } ul.news-list > li > .text-box { width: 77%; padding: 20px; } ul.news-list > li > .text-box > p { margin: 10px 0; } } @media (max-width: 1199px) { ul.news-list > li > .img-box { width: 28%; } ul.news-list > li > .text-box { width: 72%; } } @media (max-width: 991px) { ul.news-list > li > .img-box { display: none; } ul.news-list > li > .text-box { width: 100%; } } /* partner */ ul.partner-list > li { width: 18%; margin-right: 2.5%; margin-bottom: 20px; } ul.partner-list > li.last-5 { margin-right: 0; } ul.partner-list > li > .img-box { height: 100px; border: 1px solid #ddd; } ul.partner-list > li > p { margin-top: 10px; color: #555; font-weight: bold; margin-bottom: 0; } @media (max-width: 1199px) { ul.partner-list > li, ul.partner-list > li.last-5 { width: 22%; margin-right: 4%; margin-bottom: 25px; } ul.partner-list > li.last-4 { margin-right: 0; } } @media (max-width: 991px) { ul.partner-list > li, ul.partner-list > li.last-5, ul.partner-list > li.last-4 { width: 31%; margin-right: 3.5%; } ul.partner-list > li.last-3 { margin-right: 0; } } @media (max-width: 767px) { ul.partner-list > li, ul.partner-list > li.last-5, ul.partner-list > li.last-4, ul.partner-list > li.last-3 { width: 47%; margin-right: 6%; } ul.partner-list > li.last-2 { margin-right: 0; } } @media (max-width: 575px) { ul.partner-list > li { width: 100%!important; margin-right: 0!important; } ul.partner-list > li > .img-box { height: auto; } } /* 资质荣誉 */ ul.certify-list > li { width: 25%; } ul.certify-list > li > a { display: block; overflow: hidden; } ul.certify-list > li > a > img { height: 380px; } ul.certify-list > li > p { height: 38px; line-height: 38px; background-color: #eee; } @media (max-width: 1439px) { ul.certify-list > li { width: 33.3333333%; } ul.certify-list > li > a > img { cursor: pointer; object-fit: cover; font-family: 'object-fit: cover;'; height: 420px; } } @media (max-width: 1199px) { ul.certify-list > li > a > img { height: 300px; } } @media (max-width: 991px) { ul.certify-list > li { width: 50%; } ul.certify-list > li > a > img { height: 400px; } } @media (max-width: 767px) { ul.certify-list > li { padding-bottom: 0!important; margin-bottom: 20px; } ul.certify-list > li > a > img { height: 320px; } ul.certify-list > li > p { font-size: 14px; } } @media (max-width: 575px) { ul.certify-list > li { width: 100%; padding: 0!important; } ul.certify-list > li > a > img { height: auto; } } /* 成功故事 */ .about ul.story-list > li { width: 48%; height: 150px; margin-right: 4%; margin-bottom: 30px; background-color: #f6f7f8; } .about ul.story-list > li.last { margin-right: 0; } .about ul.story-list > li > .img-box { width: 150px; padding: 15px; border-radius: 50%; overflow: hidden; } .about ul.story-list > li > .text-box { width: 445px; padding: 20px; } .about ul.story-list > li > .text-box h5 { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .about ul.story-list > li > .text-box p { font-size: 14px; color: #555; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; } @media (max-width: 1439px) { .about ul.story-list > li { height: 130px; } .about ul.story-list > li > .img-box { width: 130px; padding: 10px; } .about ul.story-list > li > .text-box { width: 321px; padding: 15px; } } @media (max-width: 1199px) { .about ul.story-list > li { height: 120px; } .about ul.story-list > li > .img-box { width: 120px; } .about ul.story-list > li > .text-box { width: 244px; } .about ul.story-list > li > .text-box h5 { margin-bottom: 5px; } } @media (max-width: 991px) { .about ul.story-list > li { width: 100%; height: 120px; margin-bottom: 15px; } .about ul.story-list > li > .img-box { width: 120px; } .about ul.story-list > li > .text-box { width: 500px; } } @media (max-width: 767px) { .about ul.story-list > li > .text-box { width: 390px; } } @media (max-width: 575px) { .about ul.story-list > li > .img-box { display: none; } .about ul.story-list > li > .text-box { width: 100%; } } ul.tgy-list > li { padding: 10px 0; border-bottom: 1px dotted #ccc; } ul.tgy-list > li > .title > a { font-size: 18px; } ul.tgy-list > li > .title > a:hover { color: #395bb3!important; } ul.tgy-list > li > .desc { font-size: 14px; color: #999; } select,option,input,button,textarea{border: none;background: none;box-shadow: none;outline: none;} .message{max-width: 800px;margin: 20px auto 0;} .box-title{font-size: 16px;margin-bottom: 10px;} .box-title span{color: #f00;margin-left: 5px;} .box-input,.box-textarea{width: 100%;height: 40px;border: 1px solid #eee;padding: 0 10px;margin-bottom: 20px;} .box-textarea{height: 160px;padding: 10px;resize: none;} .validate_code{padding-right: 120px;} .validate_code img#login_code{height: 40px;border-radius: 4px;cursor: pointer;position: absolute;top: 0;right: 0;} .box-submit{margin-top: 20px;width: 120px;height: 40px;background: #1684c7;color: #fff;} .box-submit:hover{background: #e60013;} ul.chat-app li{position: relative;cursor: pointer;} ul.chat-app li .code_bg:before{content: "";width: 0;height: 0;border: 12px solid #fff;position: absolute;right: -12px;top: 50%;transform: translateY(-50%);border-left-color: #fff;border-right: none;border-top-color: transparent;border-bottom-color: transparent;} ul.chat-app li .code_bg{background-color: #fff;padding: 10px;box-shadow: 0 2px 10px rgba(0,0,0,.1);position: absolute;width: 130px;top: 50%;transform: translateY(-50%);left: -145px;display: none;transition: all .6s;} ul.chat-app li:hover .code_bg{display: block;transition: all .6s;}