@charset "utf-8";
/***********************************************
 * 
 * @name      product.css
 * @package   IntelligenceQuotientUI.Libraries
 * @copyright © 2009 - 2020, SDL888, Inc.
 * @link      https://UI.SDL888.Net
 *
***********************************************/
.pro-top{margin-top:55px}
.pro-top .fl{width:665px;color:#333}
.pro-top .fl .top{margin-bottom:14px}
.pro-top .top h1{float:left;font-size:72px;font-weight:bold;line-height:75px}
.pro-top .top span{margin-top:52px;margin-left:30px;float:left}
.pro-top .fl p{width:100%;line-height:24px;font-size:14px}
.pro-top .buy{margin-top:40px}

.pro-intro{position:relative;margin-top:30px;min-height:317px}

.system-box{position:relative;margin:30px auto;width:1099px}
.system-box img{position:relative;display:block;border:none}
#planetmap area{outline:none}
.system-box .promt{display:none;position:absolute;padding:15px;width:300px;border:1px solid #45b7d4;border-radius:4px;background-color:#fff;z-index:999}
.system-box .promt h3{font-size:14px;border-bottom:1px solid #dedede;color:#000}
.system-box .promt p{margin-top:8px;font-size:12px;line-height:18px;color:#000}
.system-box .promt i{display:block;position:absolute;left:50%;bottom:-6px;margin-left:-5px;width:10px;height:6px;background:url(../images/ico_34.png) no-repeat left top}
.system-box .pr1{left:91px;bottom:250px}
.system-box .pr2{left:274px;bottom:344px}
.system-box .pr3{left:441px;bottom:427px}
.system-box .pr4{left:239px;bottom:166px}
.system-box .pr5{left:425px;bottom:259px}
.system-box .pr6{left:590px;bottom:342px}
.system-box .pr7{left:314px;bottom:68px} 
.system-box .pr8{left:484px;bottom:146px}
.system-box .pr9{left:672px;bottom:237px}
.system-box .pr10{left:615px;bottom:82px}
.system-box .pr11{left:893px;bottom:286px;width:198px}

.upgrade{position:relative;margin:90px auto 35px;width:765px;height:170px}
.upgrade .prev, .upgrade .next{display:block;position:absolute;top:50%;margin-top:-15px;width:13px;height:30px;z-index:3}
.upgrade .prev{left:0;background:url(../images/ico_arrow.png) no-repeat left top}
.upgrade .next{right:0;background:url(../images/ico_arrow.png) no-repeat right top}
.upgrade .u-top{position:absolute;top:0;left:0;width:765px;text-align:center;color:#127c93;font-size:14px}
.upgrade .u-middle{position:absolute;top:50px;left:50%;margin-left:-1px;height:78px;border-left:2px dashed #00a2ca}
.upgrade .u-bottom{position:absolute;bottom:0;left:50%;margin-left:-50px;width:100px;text-align:center;line-height:20px;color:#00a2ca}
.upgrade .gray{color:#999}
.upgrade .upgrade-wrap{position:absolute;right:0;bottom:22px;width:765px;height:10px;z-index:2;overflow:hidden;}
.upgrade .upgrade-wrap .upgrade-scroll{width:100%;height:10px;}
.upgrade-wrap .upgrade-scroll li{float:left;width:255px;text-align:center}
.upgrade-wrap .upgrade-scroll li span{margin:auto;display:block;width:8px;height:8px;border-radius:50%;-webkit-border-radius:50%;-mos-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%;border:1px solid #00a2ca;background-color:#fff;cursor:pointer;}
.upgrade-wrap .upgrade-scroll li span:hover{background-color:#00a2ca;}
.upgrade-wrap .upgrade-scroll .start span{background-color:#00a2ca;}
.upgrade-wrap .upgrade-scroll .gray{background:url(../images/ico_gray.png) no-repeat left 5px;}
.upgrade-wrap .upgrade-scroll .gray span{border:1px solid #999;}
.upgrade-wrap .upgrade-scroll .gray span:hover{background-color:#999;}
.upgrade-wrap .upgrade-scroll .last span{background-color:#999;}
.upgrade .up-line{position:absolute;left:0;bottom:25px;width:100%;height:2px;background-color:#999;z-index:1}
.upgrade .up-line-top{position:absolute;left:0;bottom:25px;width:24px;height:2px;background:url(../images/ico_up.gif) no-repeat left top;z-index:4}

.pro-service-box{float:left;margin:40px 0 40px 84px;width:490px;height:110px}
.pro-service-box img{float:left;margin-right:60px}
.pro-service-box .iq-blue{float:left;margin-top:10px;margin-bottom:8px;width:317px}
.pro-service-box p{float:left;line-height:18px}

.manual-wrap{float:left;margin:50px 70px 60px 30px;padding:17px;width:246px;border:1px solid #e6e7e7;font-size:12px;color:#272636}
.manual-wrap:hover{border:1px solid #45b7d4}
.manual-wrap h3{border-bottom:1px solid #e6e7e7}
.manual-wrap p{margin-top:6px;font-size:12px}