﻿@charset "utf-8";
/* CSS Document */

html, body { font-size:12px;font-family:"微软雅黑";navpart  }
html { color: #666; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; /*修正手持设备字体变化*/ }
* { margin: 0; padding: 0; }
a { outline: 0px; color: rgb(102, 102, 102); text-decoration: none; }
    a:hover { color: rgb(221, 0, 0); }
    a:active { color: rgb(221, 0, 0); }
p { margin: 0px; padding: 0px; }
table { border-collapse: collapse; }
ul, li { list-style: none; padding: 0px; margin: 0px; }
form { margin: 0px; }
img { border: 0px currentColor; border-image: none; vertical-align: middle; -ms-text-align-last: center; }
center { height: 50px; text-align: left; color: rgb(153, 153, 153); }
#dhtmltooltip { border: 1px solid rgb(204, 204, 204); border-image: none; text-align: left; visibility: hidden; position: absolute; z-index: 100; }
.fl { float: left; }
.fr { float: right; }
#clear { clear: both; display: block; }
.clear { clear: both; display: block; }
body { min-width: 1200px; }
#top { width: 100%; height: 80px;min-width:1200px; }
    #top .logo { width: 600px; height: 60px; float: left; margin-left: 50px; }
        #top .logo img { margin: 10px 0px 0px 0px; }
    #top .toplink { margin: 31px 50px 31px 0; width: 180px; height: 18px; text-align: right; border-left: 1px solid #bbb; }
        #top .toplink img { margin-right: 10px; }
        #top .toplink a { margin: 0 10px; color: #666; font: 12px/18px "Microsoft YaHei"; }
            #top .toplink a:hover { color: #d00; }
#search { margin-top: 25px; margin-right: 20px; width: 200px; height: 30px; }
    #search input { float: left; }
.inp_srh { width: 160px; height: 30px; line-height: 30px; text-indent: 5px; color: #999; background: url(../images/search.jpg) no-repeat left center; border: none; }
.btn_srh { width: 40px; height: 30px; line-height: 30px; background: url(../images/search.jpg) no-repeat -160px center; border: none; cursor: pointer; color: #fff; font: bold 14px/30px "Microsoft YaHei"; text-indent: -5000px; }
#search * { vertical-align: middle; }

.menu { border-top: 1px solid #ddd; height: 50px; min-width: 1200px; }
    .menu #menu { width: 1200px; height: 50px; line-height: 50px; float: left; text-align: left; margin-left: 20px; }
        .menu #menu a { padding: 0px 30px; color: rgb(34, 34, 34); font-size: 16px; font-weight: 500; display: inline-block; }
            .menu #menu a:hover,.menu #menu a.hover { color: rgb(221, 0, 0); }
            .menu #menu a:hover,.menu #menu a.hover { background: url("../images/menu_hover-current.png") no-repeat bottom; color: rgb(230, 33, 41) !important; }
        .menu #menu .A { background: url("../images/menu_hover-current.png") no-repeat bottom; color: rgb(230, 33, 41) !important; }
#menuson { width: 100%; position: absolute; z-index: 99; }
    #menuson .son { background: url("../images/shadow.png") repeat-x top rgba(255, 255, 255, 0.9); margin: 0px auto; width: 100%; overflow: hidden; }
        #menuson .son .smcontnet { width: 100%; height: 0px; overflow: hidden; }
            #menuson .son .smcontnet .sm { margin: 0px auto; width: 1200px; }
    #menuson .navcon { background: rgb(255, 255, 255); padding: 15px; border: 1px solid rgb(221, 221, 221); border-image: none; width: 470px; float: left; }
        #menuson .navcon img { float: left; }
        #menuson .navcon .nav { width: 105px; float: right; }
            #menuson .navcon .nav a { background: url("../images/menuson_hover-arr.png") no-repeat 90px; height: 30px; text-align: left; line-height: 30px; padding-left: 5px; border-bottom-color: rgb(212, 212, 212); border-bottom-width: 1px; border-bottom-style: solid; display: block; }
                #menuson .navcon .nav a:hover { background: url("../images/menuson_hover-arrA.png") no-repeat 95px; }
    #menuson .ad { width: 600px; height: 190px; text-align: left; color: rgb(136, 136, 136); line-height: 24px; padding-top: 10px; font-family: "微软雅黑"; font-size: 14px; float: right; position: relative; }
        #menuson .ad .view { background: rgb(170, 170, 170); width: 90px; height: 30px; text-align: center; right: 0px; bottom: 10px; color: rgb(255, 255, 255); line-height: 30px; font-family: "微软雅黑"; font-size: 13px; display: inline-block; position: absolute; }
            #menuson .ad .view:hover { background: rgb(221, 0, 0); }
#shadow { background: url("../images/shadow.png") repeat-x top; margin: 131px auto 0px; left: 0px; top: 0px; width: 100%; height: 3px; position: absolute; z-index: 9; }

#main { margin: 0px auto; width: 100%; min-width: 1200px; }
    #main .navpart { background: rgb(223, 239, 248);width: 100%; height: 200px; }
        #main .navpart ul {width:1200px;margin:0px auto; }
        #main .navpart li { width: 195px; height: 200px; display: inline-block; border-right: 1px solid rgb(220, 220, 220); }
            #main .navpart li.last { border-right: none; }
            #main .navpart li a { background: url("../images/navpart_hover-arr.png") no-repeat center 160px #c7e8fa; width: 195px; height: 200px; display: block; position: relative; }
            #main .navpart li .icon { left: 65px; top: 40px; width: 68px; height: 68px; overflow: hidden; position: absolute; }
                #main .navpart li .icon img { left: 0px; position: absolute; }
            #main .navpart li .text { width: 195px; top: 120px; text-align: center; color: rgb(155, 155, 155); font-family: "Arial"; font-size: 11px; position: absolute; }
                #main .navpart li .text strong { color: rgb(62, 62, 62); font-size: 14px; margin-bottom: 2px; display: block; font-family: "Microsoft YaHei"; }
            #main .navpart li a:hover { background: url("../images/navpart_hover-arrA.png") no-repeat center 160px; }
                #main .navpart li a:hover strong { color: rgb(221, 0, 0); }
                #main .navpart li a:hover .text { color: rgba(221, 0, 0, 0.5); }

    #main .product { background: url("../images/product_sun-index11.jpg") repeat-x center #e9e9e9; margin: 0px auto; width: 100%; height: 660px; overflow: hidden; }
        #main .product .title { margin: 0px auto; width: 1200px; padding-top: 60px;text-align:center; }
        #main .product h1 { color: rgb(204, 0, 0); font-family: Arial, Helvetica, sans-serif; font-size: 48px; font-weight: normal; display: block;text-align:center; }
        #main .product h2 { background: url("../images/product_line-index.jpg") repeat-x center; margin: 10px auto; width: 340px; color: rgb(61, 61, 61); font-size: 18px; font-weight: bold; display: block; }
            #main .product h2 b { background: url("../images/product_bg-index.jpg"); padding: 0px 25px; display: inline-block; }
        #main .product .hover { margin: 0px auto; padding: 10px 0px; color: rgba(61, 61, 61, 0.2); font-family: "微软雅黑"; font-size: 14px; }
            #main .product .hover a { padding: 0px 15px; color: rgba(61, 61, 61, 0.7); font-family: "微软雅黑"; font-size: 14px; font-weight: bold; display: inline-block; }
                #main .product .hover a:hover { color: rgba(221, 0, 0, 0.8); }

        #main .product .con { margin: 20px auto; width: 1200px; height: 400px; }
            #main .product .con .proShow { margin: 0px auto; width: 100%; height: 400px; }
                #main .product .con .proShow .animation { width: 100%; height: 325px; overflow: hidden; }
                    #main .product .con .proShow .animation li { width: 100%; height: 325px; display: block; }
                    #main .product .con .proShow .animation p { margin: 0px auto; padding: 3px 0px; width: 180px; font-family: "微软雅黑"; display: block; }
                    #main .product .con .proShow .animation a { background: rgb(134, 134, 134); width: 220px; height: 325px; margin: 0 10px; float: left; display: block; }
                    #main .product .con .proShow .animation .model { color: rgb(221, 0, 0); padding-top: 10px; font-size: 20px; font-weight: bold; overflow: hidden; height: 26px; }
                    #main .product .con .proShow .animation .name { color: rgb(255, 255, 255); font-size: 14px; font-weight: bold; overflow: hidden; height: 19px; }
                    #main .product .con .proShow .animation .text { width: 140px; color: rgba(225, 225, 225, 0.5); }
                    #main .product .con .proShow .animation a:hover { background: rgb(221, 0, 0); }
                        #main .product .con .proShow .animation a:hover .model { color: rgb(255, 255, 255) !important; }
                #main .product .con .proShow .arrow { margin: 0px auto; padding: 40px 0px; width: 100%; }
                    #main .product .con .proShow .arrow a { background: none; margin: 0px 3px; border-radius: 30px; border: 1px solid rgb(153, 153, 153); border-image: none; width: 10px; height: 10px; font-size: 0px; display: inline-block; }
                        #main .product .con .proShow .arrow a.activeSlide { background: rgb(221, 0, 0); border: 1px solid rgb(221, 0, 0); border-image: none; }

    #main .w1180 { margin: 0 auto; width: 1180px; height: auto; overflow: hidden; text-align: left; margin-top: 30px; }
    #main .tit3 { margin: 0px 0 30px; height: 40px; border-bottom: 1px solid #ddd; }
        #main .tit3 h2 { float: left; border-bottom: 3px solid #d00; color: #333; font: bold 18px/35px "Microsoft YaHei"; }
        #main .tit3 span { padding-left: 10px; color: #ccc; font: 12px/35px "Arial"; }

    #main .w570 { width: 570px; height: auto; overflow: hidden; }
    #main .i_newtop { margin-bottom: 10px; width: 570px; height: 120px; overflow: hidden; }
    #main .i_newtopimg { width: 180px; height: 120px; overflow: hidden; }
    #main .i_newtoptit { margin-bottom: 10px; width: 360px; height: 20px; color: #333; font: bold 13px/20px "Microsoft YaHei"; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
    #main .i_newtopcon { width: 360px; height: 90px; color: #666; font: 12px/24px "Microsoft YaHei"; overflow: hidden; }
    #main .news_con { width: 570px; height: 80px; overflow: hidden; }
        #main .news_con ul { margin: 0; padding: 0; }
            #main .news_con ul li { float: left; width: 570px; height: 28px; overflow: hidden; }
                #main .news_con ul li a { float: left; display: block; width: 500px; text-indent: 15px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; background: url(../images/ico1.png) no-repeat left center; color: #666; font: 12px/28px "Microsoft YaHei"; }
                    #main .news_con ul li a:hover { color: #d00; background: url(../images/ico1.png) no-repeat left center; }
                #main .news_con ul li span { float: right; display: block; color: #999; font: 11px/28px "Arial"; -webkit-text-size-adjust: none; }
    #main .i_newsmore { margin-top: 5px; height: 20px; }
        #main .i_newsmore a { color: #c00; font: bold 12px/20px "SimSun"; text-decoration: underline; }
            #main .i_newsmore a:hover { color: #000; }


    #main .case { background: rgb(255, 255, 255); margin: 0px auto; width: 1180px; height: 500px; overflow: hidden; position: relative; }
        #main .case .title { margin: 0px auto; width: 1200px; padding-top: 60px;text-align:center; }
        #main .case h1 { color: rgb(204, 0, 0); font-family: Arial, Helvetica, sans-serif; font-size: 48px; font-weight: normal; display: block; }
        #main .case h2 { background: url("../images/case_line-index.jpg") repeat-x center; margin: 10px auto; width: 340px; color: rgb(61, 61, 61); font-size: 18px; font-weight: bold; display: block; }
            #main .case h2 b { background: rgb(255, 255, 255); padding: 0px 25px; display: inline-block; }

        #main .case .casebox { margin: 40px auto; width: 1180px; height: 250px; }
            #main .case .casebox ul {height: 250px; }
            #main .case .casebox li { width: 735px; height: 250px;float:right; }
            #main .case .casebox .text { width: 360px; height: 250px; text-align: left; float: left; display: block; position: relative; }
                #main .case .casebox .text strong { padding: 20px 0px; color: rgb(51, 51, 51); font-size: 16px; display: block; }
                #main .case .casebox .text span { color: rgb(140, 140, 140); line-height: 18px; font-size: 12px; display: block; }
                #main .case .casebox .text .view { background: rgb(102, 102, 102); left: 0px; width: 140px; height: 36px; text-align: center; bottom: 20px; color: rgb(255, 255, 255); text-transform: uppercase; line-height: 36px; font-family: Arial, Helvetica, sans-serif; display: block; position: absolute; }
                    #main .case .casebox .text .view:hover { background: rgb(221, 0, 0); }
            #main .case .casebox .imglist { width: 735px; text-align: left; float: right; display: block; }
                #main .case .casebox .imglist a { width: 350px; margin-right: 30px; display: inline-block; position: relative; }
                #main .case .casebox .imglist h3 { padding: 20px 0px 10px; color: rgb(221, 0, 0); font-size: 16px; display: block; }
                #main .case .casebox .imglist h4 { color: rgb(153, 153, 153); font-weight: normal; }
                #main .case .casebox .imglist .arr { left: 20px; top: 146px; position: absolute; }
                #main .case .casebox .imglist a:hover img { opacity: 0.7; }
        #main .case .caseurl { margin: 0px auto; left: 0px; width: 1180px; text-align: left; bottom: 30px; position: absolute; }
            #main .case .caseurl a { width: 22px; height: 22px; margin-right: 5px; display: inline-block; opacity: 0.3; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -o-filter: grayscale(100%); }
                #main .case .caseurl a:hover { opacity: 0.8; -webkit-filter: grayscale(0); -moz-filter: grayscale(0); -o-filter: grayscale(0); }

#mod { margin: 0px 0px 0px -500px; left: 50%; width: 1200px; height: 300px; position: absolute; z-index: 1; }
    #mod p { background: rgba(221, 0, 0, 0.6); width: 200px; height: 120px; text-align: left; right: 0px; bottom: 0px; color: rgb(255, 255, 255); display: inline-block; position: absolute; }
    #mod strong { margin: 30px auto 0px; padding: 5px 0px; width: 160px; font-size: 24px; border-bottom-color: rgb(221, 221, 221); border-bottom-width: 1px; border-bottom-style: dotted; display: block; }
    #mod span { margin: 5px auto; width: 160px; color: rgba(255, 255, 255, 0.9); text-transform: uppercase; font-family: Arial, Helvetica, sans-serif; font-size: 21px; display: block; }

#location { margin: 0px auto; padding: 10px 0px; width: 1200px; text-align: right; color: rgb(153, 153, 153); }
    #location a { color: rgb(153, 153, 153); }
        #location a:hover { color: rgb(221, 0, 0); }

#navpart { margin: 0px auto; width: 1200px; height: 50px; text-align: left; border-bottom-color: rgb(221, 221, 221); border-bottom-width: 1px; border-bottom-style: solid; position: relative; }
    #navpart a { background: rgb(221, 0, 0); padding: 0px 40px; height: 35px; text-align: center; color: rgb(255, 255, 255); line-height: 35px; font-size: 14px; margin-left: 1px; float: left; display: block; }
        #navpart a:hover { background: rgb(230, 33, 41); }
    #navpart .A { background: rgb(230, 33, 41) !important; }
    #navpart .sear { top: 10px; right: 0px; position: absolute; }
        #navpart .sear #keys { padding: 0px 5px; border: 1px solid rgb(221, 221, 221); border-image: none; height: 25px; text-align: left; color: rgb(153, 153, 153); line-height: 25px; font-family: "微软雅黑"; font-size: 12px; }
        #navpart .sear #go { background: rgb(102, 102, 102); padding: 0px 5px; border: 1px solid rgb(102, 102, 102); border-image: none; height: 25px; text-align: left; color: rgb(255, 255, 255); text-transform: uppercase; line-height: 25px; cursor: pointer; }



#boot { background: url("../images/boot.jpg") repeat-x bottom; margin: 80px auto 0px; width: 100%; height: 350px; }
    #boot .links { margin: 0px auto; width: 1180px; height: 70px; text-align: left; line-height: 70px; }
        #boot .links strong { color: rgb(51, 51, 51); font-size: 14px; }
            #boot .links strong img { margin-right: 5px; }
        #boot .links a { color: rgb(153, 153, 153); margin-right: 10px; display: inline-block; }
            #boot .links a:hover { color: rgb(221, 0, 0); }
            #boot .links a img { margin: 0px 3px; }
    #boot ul { margin: 0px auto; width: 1180px; height: 232px; position: relative; }
        #boot ul .nav { left: 0px; width: 820px; height: 232px; position: absolute; }
            #boot ul .nav p { margin: 30px 0px 0px; padding: 0px; width: 116px; height: 170px; text-align: left; float: left; display: block; }
            #boot ul .nav strong { padding: 5px 0px 10px; color: rgb(255, 255, 255); font-size: 14px; display: block; }
            #boot ul .nav a { padding: 3px 0px; color: rgb(173, 173, 173); font-size: 14px; display: block; }
                #boot ul .nav a:hover { text-decoration: underline; }
        #boot ul .qrcode { width: 290px; height: 232px; text-align: left; right: 0px; color: rgb(255, 255, 255); margin-top: -50px; position: absolute; }
    #boot .copy { margin: 0px auto; width: 1180px; height: 48px; text-align: left; color: rgb(255, 255, 255); line-height: 48px; }
        #boot .copy a { color: rgba(255, 255, 255, 0.5); }
            #boot .copy a:hover { text-decoration: underline; }
        #boot .copy .e { color: rgb(255, 255, 255) !important; text-decoration: none !important; float: right !important; }


.box_skitter { top: 0px; height: 500px; position: relative; z-index: 1; }
    .box_skitter .w960 { left: 50%; height: 16px; bottom: 20px; margin-left: -480px; position: absolute; z-index: 5; }
    .box_skitter img { max-width: none; }
    .box_skitter ul { display: none; }
    .box_skitter .container_skitter { overflow: hidden; position: relative; }
    .box_skitter .image { left: 50%; top: 0px; width: 1920px; overflow: hidden; margin-left: -960px; position: absolute; }
        .box_skitter .image img { display: none; }
    .box_skitter .box_clone { left: 0px; top: 0px; width: 100px; overflow: hidden; display: none; position: absolute; z-index: 2; }
        .box_skitter .box_clone img { left: 0px; top: 0px; position: absolute; z-index: 2; }
    .box_skitter .btn { left: 50%; top: 193px; width: 65px; height: 66px; overflow: hidden; display: inline-block; position: absolute; z-index: 5; }
    .box_skitter .prev_button { margin-left: -623px; }
    .box_skitter .next_button { margin-left: 558px; }
    .box_skitter .prev_button img { left: 0px; top: 50%; margin-top: -32px; position: absolute; }
    .box_skitter .next_button img { top: 50%; right: 0px; margin-top: -32px; position: absolute; }
    .box_skitter .info_slide { top: 0px; height: 16px; right: 0px; display: inline-block; position: absolute; z-index: 5; }
        .box_skitter .info_slide .image_number { background: url("../images/bg_btn02.png") no-repeat; width: 16px; height: 16px; text-indent: -9999px; overflow: hidden; margin-left: 6px; float: left; display: inline-block; cursor: pointer; }
        .box_skitter .info_slide .image_number_select { background-position: 0px -16px; }
    .box_skitter .container_thumbs { height: 50px; overflow: hidden; position: relative; }
    .box_skitter .info_slide_thumb { padding: 0px !important; border-radius: 0px; left: 0px; top: 0px; height: 50px; overflow: hidden; opacity: 1; -moz-border-radius: 0; -webkit-border-radius: 0; }
        .box_skitter .info_slide_thumb .image_number { margin: 0px !important; padding: 0px !important; border-radius: 0px !important; width: 100px; height: 50px; overflow: hidden; position: relative; -moz-border-radius: 0; -webkit-border-radius: 0; }
            .box_skitter .info_slide_thumb .image_number img { left: -30px; top: -30px; height: 100px; position: absolute; }
    .box_skitter .box_scroll_thumbs { padding: 0px; }
        .box_skitter .box_scroll_thumbs .scroll_thumbs { background: rgb(204, 204, 204); border: 0px solid rgb(51, 51, 51); border-image: none; left: 50px; width: 200px; height: 10px; bottom: 60px; text-indent: -9999em; overflow: hidden; position: absolute; z-index: 101; cursor: pointer; }
    .box_skitter .info_slide_dots { padding: 5px 0px 5px 5px; border-radius: 50px; bottom: -40px; position: absolute; z-index: 151; -moz-border-radius: 50px; -webkit-border-radius: 50px; }
        .box_skitter .info_slide_dots .image_number { background: rgb(51, 51, 51); margin: 0px 5px 0px 0px; border-radius: 50px; transition: 0.2s; width: 18px; height: 18px; text-indent: -9999em; overflow: hidden; float: left; cursor: pointer; -moz-border-radius: 50px; -webkit-border-radius: 50px; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; }
            .box_skitter .info_slide_dots .image_number:hover { background: rgb(0, 0, 0); }
        .box_skitter .info_slide_dots .image_number_select { background: rgb(204, 51, 51); margin: 0px 5px 0px 0px; float: left; }
            .box_skitter .info_slide_dots .image_number_select:hover { background: rgb(204, 51, 51); margin: 0px 5px 0px 0px; float: left; }
.loading { background: url("../images/loading.gif") no-repeat; margin: -16px; top: 50%; width: 32px; height: 32px; right: 50%; color: rgb(255, 255, 255); text-indent: -9999em; overflow: hidden; position: absolute; z-index: 10000; }
.box_skitter .progressbar { background: rgb(0, 0, 0); border-radius: 20px; left: 15px; top: 5px; width: 200px; height: 5px; position: absolute; z-index: 99; }
.box_skitter .preview_slide { background: rgb(255, 255, 255); border: 1px solid rgb(34, 34, 34); border-image: none; left: -40px; width: 100px; height: 100px; bottom: 30px; overflow: hidden; display: none; position: absolute; z-index: 152; box-shadow: 2px 2px 5px rgba(0,0,0,0.7); -moz-box-shadow: rgba(0, 0, 0, 0.7) 2px 2px 5px; -webkit-box-shadow: rgba(0, 0, 0, 0.7) 2px 2px 5px; }
    .box_skitter .preview_slide ul { list-style: none !important; margin: 0px !important; left: 0px; top: 0px; height: 100px !important; overflow: hidden !important; display: block !important; position: absolute !important; }
        .box_skitter .preview_slide ul li { margin: 0px !important; padding: 0px !important; width: 100px !important; height: 100px !important; overflow: hidden !important; float: left !important; display: block !important; position: relative !important; }
            .box_skitter .preview_slide ul li img { left: 0px !important; top: 0px !important; width: auto !important; height: 150px !important; position: absolute !important; }
#overlay_skitter { background: rgb(0, 0, 0); left: 0px; top: 0px; width: 100%; position: absolute; z-index: 9998; opacity: 1; }
.box_skitter .focus_button { transition: 0.2s; top: 50%; width: 42px; height: 42px; text-indent: -9999em; overflow: hidden; margin-top: -25px; position: absolute; z-index: 100; opacity: 0; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; }
.box_skitter .play_pause_button { transition: 0.2s; top: 50%; width: 42px; height: 42px; text-indent: -9999em; overflow: hidden; margin-top: -25px; position: absolute; z-index: 151; opacity: 0; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; }
    .box_skitter .play_pause_button.play_button { }
    .box_skitter .play_pause_button:hover { opacity: 0.5 !important; }
.box_skitter .focus_button:hover { opacity: 0.5 !important; }
.box_skitter_large { width: 800px; height: 300px; }
.box_skitter_small { width: 200px; height: 100px; }
