@charset "utf-8"; @import url("styles.css"); /* * wx.zhangruiwoloveni * * http://e.xoabc.com/ * * Released on: 2019,11,27 * */ /* head */ .header { width: 100%; } .header .top { width: 100%; height: 33px; overflow: hidden; background-color: #035da9; } .header .top i { display: inline-block; vertical-align: 0; padding-right: 3px; } .header .top i.fa-phone { padding-left: 12px; } .header .logo { padding: 30px 0 31px; } .header .naver { height: 72px; } .header .naver li { float: left; } .header .naver li a { display: block; padding: 0 10px; color: #000; line-height: 50px; margin: 16px 7px 0; } .header .naver li a:hover, .header .naver li a.on { border-bottom: 3px solid #035da9; color: #035da9; } /* main */ .main { width: 1200px; margin: 0 auto; position: relative; } .main .m_title { padding-bottom: 25px; } .main .m_title h3, .main .m_title h6 { font-weight: normal; } .main .m_title h3 { font-size: 26px; color: #333; } .main .m_title h6 { font-size: 13px; color: #888; padding-top: 25px; } .main .m_title h6 i { display: inline-block; padding: 0 6px 0 8px; } /* wrapper */ .wrapper { width: 100%; } .wrapper .products { padding: 50px 0 60px; } .wrapper .products li { float: left; width: 23%; margin: 1%; } .wrapper .products li img { height: 100%; margin: 0 -100%; transition: all 0.7s } .wrapper .products li .p_pic { height: 250px; display: block; overflow: hidden; border: 1px solid #eee; } .wrapper .products li:hover .p_pic { border-color: #fff; border-color: #035da9 \0; } .wrapper .products li .p_pic:hover img { transform: scale(1.1); } .wrapper .products li span { display: block; padding-top: 18px; } .wrapper .products li span a { color: #444; display: block; } .wrapper .products li span a:hover { color: #c00; } .wrapper .products .p_more, .wrapper .news_box .p_more { width: 160px; height: 45px; margin: 40px auto 0; border: 1px solid #ddd; border-radius: 100px; } .wrapper .products .p_more a, .wrapper .news_box .p_more a { color: #666; display: block; position: relative; z-index: 999; transition: all 1s; } .wrapper .products .p_more a:hover, .wrapper .news_box .p_more a:hover { color: #fff; color: #035da9 \0; } .wrapper .abouts_box { width: 100%; height: 520px; background: url(/images/ab_bg.jpg) center 0 no-repeat #f4f4f4; } .wrapper .abouts_box_desc { width: 535px; padding-top: 68px } .wrapper .abouts_box_bt { border-bottom: 1px solid #c3c3c3; } .wrapper .abouts_box_bt span { border-bottom: 3px solid #035da9; display: inline-block; margin-bottom: -2px; padding: 5px 0 15px; } .wrapper .abouts_box_info { color: #777; padding: 30px 0 15px; } .wrapper .abouts_box_btn a { width: 150px; height: 45px; color: #fff; background-color: #e6101a; display: block; float: left; margin-right: 28px; border-radius: 2px; } .wrapper .abouts_box_btn a.btn2 { background-color: #035da9; } .wrapper .news_box { width: 100%; padding: 50px 0 70px; background: url(/images/news_bg.jpg) center bottom no-repeat; } .wrapper .news_box ul { margin-right: -45px; } .wrapper .news_box li { float: left; width: 355px; margin: 0 45px 10px 0; padding-bottom: 20px; } .wrapper .news_box li a { color: #555; display: block; font-size: 15px; padding: 15px 0; font-weight: bold; } .wrapper .news_box li:nth-of-type(odd) a:hover { color: #c30; } .wrapper .news_box li:nth-of-type(even) a:hover { color: #035da9; } .wrapper .news_box li span { display: block; } .wrapper .news_box li span.n_time { color: #aaa; } .wrapper .news_box li span.n_time i { display: inline-block; padding-right: 5px; } .wrapper .news_box li span.n_time i.fa-eye { padding-left: 6px; } .wrapper .news_box li span.n_info { padding-top: 10px; color: #888; } /* cols */ .col_slide { width: 100%; } .col_slide img { width: 100%; } .cols { width: 100%; padding: 50px 0 60px; background: url(/images/news_bg.jpg) center bottom no-repeat; } .cols_box { background-color: rgba(255,255,255,0.6); padding: 35px 30px 30px; box-shadow: 0 0 8px #f1f1f1; } .cols_nav { width: 100%; } .cols_nav li { display: inline-block; } .cols_nav li a { display: inline-block; border: 1px solid #dcdcdc; color: #777; padding: 11px 26px; margin: 5px; } .cols_nav li a:hover { background-color: #035da9; color: #fff; border-color: #035da9; } .cols_info { padding: 35px 30px 20px; color: #444 } .cols_info a { color: #444; } .cols_info a:hover { color: #c30; } .cols_info img { max-width: 100%; } .cols_info table { width: 100%; } .cols_img { padding: 35px 0; } .cols_img img { max-width: 100%; } .cols_next { border-top: 1px solid #eee; padding: 20px 28px; color: #444; } .cols_next a { color: #444; } .cols_next a:hover { color: #c00; } /* news */ .newslist { padding: 0 25px 10px; } .newslist li { float: left; width: 50%; margin: 1px 0; } .newslist li:nth-child(2) { float: right; } .newslist li span { display: inline-block; padding-left: 38px; } .newslist li a { color: #444; position: relative; z-index: 99; display: block; transition: all 0.6s; padding-left: 3%; } .newslist li a:hover { color: #fff; color: #035da9 \0; } /* photo */ .photos { padding: 10px 0; } .photos li { float: left; width: 23%; margin: 1%; } .photos li img { height: 100%; margin: 0 -100%; transition: all 0.7s } .photos li .p_pic { height: 250px; display: block; overflow: hidden; border: 1px solid #eee; } .photos li .p_pic:hover { border-color: #fff; border-color: #035da9 \0; } .photos li .p_pic:hover img { transform: scale(1.1); } .photos li span { display: block; padding-top: 18px; } .photos li span a { color: #444; display: block; } .photos li span a:hover { color: #c00; } /* message */ .message { padding: 0 0 20px } .message .msg { width: 49%; padding: 12px 7% 0 0 } .message .msglist { width: 37%; border-left: 1px solid #eaeaea; min-height: 400px; padding: 12px 0 12px 5% } .message .msglist h2 { color: #333; padding-bottom: 1%; } .message .msglist dl { border: 1px solid #eaeaea; font-size: 13px; margin-top: 3%; border-radius: 2px } .message .msglist dt { border-bottom: 1px solid #eaeaea; padding: 3%; background-color: #f9f9f9; color: #c70007; } .message .msglist dd { border-bottom: 1px solid #eaeaea; padding: 3%; color: #888; } .message .msglist .tr { text-align: right; } .message .msg ul { padding-top: 10px; } .message .msg li { position: relative; margin: 12px 0 } .message .msg li input,.msg li textarea { border-radius: 2px; border: 1px #ddd solid; padding: 10px; font-size: 13px; width: 95.8% } .message .msg li textarea { height: 80px } .message .msg li img { display: block; position: absolute; right: 5px; z-index: 999; bottom: 2px; cursor: pointer; } .message .msg li button { width: 100%; border: 0 none; background: #c70007; color: #fff; padding: 10px 0; font-size: 16px; border-radius: 2px; cursor: pointer; margin-top: 20px; font-weight: bold } .message .msg li:hover button { background: #ab000f } /* footer */ .footer { width: 100%; } .footer .foot_lx { width: 100%; background-color: #035da9; padding: 35px 0; } .footer .foot_lx li { float: left; } .footer .foot_lx li i { display: inline-block; padding-right: 5px; } .footer .foot_lx li.add { width: 40%; } .footer .foot_lx li.tel { width: 35%; } .footer .foot_lx li.fax { width: 21%; } .footer .foot_lx li.top { width: 4%; } .footer .foot_lx li a { color: #fff; } .footer .copy { color: #444; padding: 25px 0 20px; } .footer .copy a { color: #444; } .footer .copy a:hover { color: #035da9; } .footer .links { padding-bottom: 45px; color: #888; } .footer .links a { color: #888; padding: 0 5px; } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #999; font-size: 14px; } input::-moz-placeholder, textarea::-moz-placeholder { color: #999; font-size: 14px; } input:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #999; font-size: 14px; }