#box_out{margin:120px auto; width:650px; height: 400px; background: url(../images/icon/bg-in-350c.png) no-repeat center center;z-index: 10;position:relative;}
#box_main{
    overflow: hidden;
    position: relative;
    float:left;
    width:350px;
    height:350px;
    -webkit-border-radius: 125px;
    -moz-border-radius: 125px;
    border-radius: 125px;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
    background: url(../images/icon/bg-in-350c.png) no-repeat center center;
}
#box_main:hover{
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}
#box_out_3d{margin:120px auto; width:650px; height: 400px;}
.box_main_in{
    overflow: hidden;
    position: relative;
    float:left;
    width:350px;
    height:350px;
    -webkit-border-radius: 125px;
    -moz-border-radius: 125px;
    border-radius: 125px;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
    background: url(../images/icon/bg-in-350b.png) no-repeat center center;
}
.box_main_in:hover{
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
    background: url(../images/icon/bg-in-350ba.png) no-repeat center center;
}
.box_logo{
    float:left;
    width:350px;
    height:350px;
    background: url(../images/icon/bg-in-logo.png) no-repeat center center;
}
.box_logo:hover{
    background: url(../images/icon/bg-in-logoh2.png) no-repeat center center;
}
.dv:hover {background: url(../images/ser_hov.png) no-repeat center center;}
.dv a img {border: none;padding-top:35px} 
/**********BOX ICON**********/
#main{position: absolute; top:25px;left:150px;background: url(../images/icon/bg-in-350c.png) no-repeat center center; height:350px;width: 350px;}
#box_home_0{position: absolute; top:-67px; left:138px;background: url(../images/icon/icon_moc150.png) no-repeat center center; text-indent: -9999; height: 150px;width:150px;}
#box_home_1{position: absolute; bottom:-49px; left:111px;background: url(../images/icon/icon_hoa150.png) no-repeat center center; text-indent: -9999; height: 150px;width:150px;}
#box_home_2{position: absolute; bottom:145px; left:25px;background: url(../images/icon/icon_hoa150.png) no-repeat center center; text-indent: -9999; height: 150px;width:150px;}
#box_home_3{position: absolute; bottom:122px; right:27px;background: url(../images/icon/icon_tho150.png) no-repeat center center; text-indent: -9999; height: 150px;width:150px;}
#box_home_4{position: absolute; top:-48px; right:108px;background: url(../images/icon/icon_hoa150.png) no-repeat center center; text-indent: -9999; height: 150px;width:150px;}
#box_home_5{position: absolute; bottom:-49px; right:116px;background: url(../images/icon/icon_kim150.png) no-repeat center center; text-indent: -9999; height: 150px;width:150px;}
#main{
    overflow: hidden;
    position: relative;
    float:left;
    width:350px;
    height:350px;
    background: url(../images/icon/bg-in-350a.png) no-repeat center center;
}
.box_item a{
    text-align: left;
    width: 100%;
    height: 100%;
    display: block;
    color: #000;
    position: relative;
   -moz-box-shadow:0px 0px 3px #000000;
   -webkit-box-shadow:0px 0px 3px #000000;
   box-shadow:0px 0px 3px #000000;

}
.box_item h3,h2{color:#000;}
.box_item{
    overflow: hidden;
    position: relative;
    float:left;
    height:150px;
    width:150px;
    margin-right: 4px;
    -webkit-border-radius: 125px;
    -moz-border-radius: 125px;
    border-radius: 125px;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}
.box_item .item_bg{position:absolute;top:0px;left:0px;width:100%;z-index:-1;}
.box_item .item_des{position:absolute;top:0px;left:0px;width:100%;z-index:2;}
.ca-icon{
    font-family: 'WebSymbolsRegular', cursive;
    font-size: 20px;
    color: #f6f6f6;
    line-height: 60px;
    position: absolute;
    width: 100%;
    height: 40px;
    left: 0px;
    top: 10px;
    text-align: center;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}
.ca-icon img{width:60px;}
.ca-main{
    font-size: 12px;
    position: absolute;
    top: 70px;
    height: 80px;
    width: 130px;
    left: 50%;
    margin-left: -65px;
    opacity: 0.8;
    text-align: center;
}
.ca-sub{
    text-align:center;
    color: #000;
    font-size: 12px;
    position: absolute;
    height: 80px;
    width: 120px;
    left: 70%;
    margin-left: -85px;
    top: 70px;
    opacity: 0;
    -webkit-transition: all 400ms linear;
    -moz-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    -ms-transition: all 400ms linear;
    transition: all 400ms linear;
}
.box_item:hover{
    color:#333;
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}
.box_item h2,.box_item h3{font:Thufap;}
.box_item:hover h2, h3{color:#333;}
.box_item:hover .ca-icon{
    color: #555;
    font-size: 60px;
}
.box_item:hover .ca-main{
    display: none;
}
.box_item:hover .ca-sub{
    opacity: 0.8;
}