@charset "utf-8";
/* CSS Document */


#network{margin: 0 auto; padding: 60px 0;}
#network>.title{ text-align: center; margin: 0 auto;padding: 50px 0;}
#network>.title>h3{ font-size: 4rem; font-weight: normal; color: #333; margin: 0 auto;}

#network>.content{margin: 0 auto; padding: 50px 0;}
#network>.content>.text{ font-size: 1.6rem; color: #333; line-height: 2.8rem; padding-bottom: 20px;}
#network>.content>.text>p{ margin-bottom: 20px;}
#network>.content>.tel{ border-top: 1px solid #ddd; padding: 20px 0; text-align: left; font-size: 2.8rem;  color: #999;}
#network>.content>.tel>i{ display: inline-block;float: left; font-size: 3rem;margin-right: 10px;}
#network>.content>.tel>span{ display: inline-block; margin-left: 10px; font-weight: bold;color: rgba(14,189,201,1);}

#network>.map{text-align: center; position: relative; padding-bottom: 100px;}
#network>.map  .china-map{ position: relative; display: inline-block; margin: 0 auto;}
#network>.map  .china-map>img{height: auto; max-width: 100%;}
#network>.map  .nanhai{position: absolute; z-index: 1; right: 6%; bottom: 50px; width:200px;}
#network>.map  .nanhai>img{max-width: 100%;height: auto;}




@media only screen and (max-width: 1480px){

    #network>.map  .nanhai{width: 160px; right: 4%; }
}

@media only screen and (max-width: 1360px){

    #network>.map  .nanhai{width: 140px; right: 0; }
}

@media only screen and (max-width: 1280px){
    #network>.map  .china-map{ width: 90%;}
    #network>.map  .nanhai{width: 120px; }
}

@media only screen and (max-width: 1080px){

    #network>.map  .china-map{ width: 82%;}
    #network>.map  .nanhai{width: 100px; }

}


@media only screen and (max-width: 980px) {

    #network{padding: 30px 0;}
    #network>.content>.tel{ font-size: 2.4rem;}
    #network>.content>.tel>i{ font-size: 2.4rem;}

    #network>.title{padding: 10px 0;}
    #network>.title>h3{ font-size: 3.2rem;}


}

@media only screen and (max-width: 860px) {

    #network>.content>.text{ font-size: 1.4rem; line-height: 2.4rem;}

    #network>.map  .nanhai{width: 80px; right: 0; }

}

@media only screen and (max-width: 780px){

    #network  .nanhai{width: 60px;}

}

@media only screen and (max-width: 640px) {

    #network>.title>h3{ font-size: 2.8rem;}

    #network>.content>.tel{ font-size: 2rem;}
    #network>.content>.tel>i{ font-size: 2rem;}

    #network>.map .nanhai{width: 40px;}

}

@media only screen and (max-width: 520px) {

    #network>.title>h3{ font-size: 2.4rem;}
    #network>.content{padding:30px 0;}

}