@charset "utf-8";
.subscribe_banner{width: 100%; height: 580px; background-position: center 80px; background-repeat: no-repeat;background-image: url(../images/subscribe_banner.jpg);}
.subscribe_main{ width: 1200px; margin: -80px auto 50px; background-color: #fff; border-radius: 10px;}
.subscribe_warp{margin: 40px 0 30px 100px; width: 1019px; padding-left: 40px; border-left: 1px solid #e8e8e8; position: relative;}
.subscribe_title{width: 100%; height: 42px; margin-bottom: 40px; margin: 20px 0 20px -62px;}
.subscribe_title i{display: block; width: 42px; height: 42px; background-color: #0086ff; border-radius: 21px; line-height: 42px; text-align: center; font-size: 20px; font-style: normal; font-weight: bold; color: #fff; float: left;}
.subscribe_title h2{font-size: 18px; color: #333; line-height: 42px; margin-left: 20px; float: left;}
.item_ul{width: 952px; height: auto; margin-top: 40px;}
.item_ul li{width: 106px; height: 140px; float: left; margin-right: 30px; margin-bottom: 30px; text-align: center; cursor: pointer; position: relative;}
.item_ul li i{border: 1px solid #e8e8e8; width: 104px; height: 104px; background-image: url(../images/item_0_h.png); background-position: center; background-repeat: no-repeat; background-size: 80px auto;  display: block; border-radius: 10px;}
.item_ul li i.index_item_1{background-image: url(../images/item_1_h.png);}
.item_ul li i.index_item_2{background-image: url(../images/item_2_h.png);}
.item_ul li i.index_item_3{background-image: url(../images/item_3_h.png);}
.item_ul li i.index_item_4{background-image: url(../images/item_4_h.png);}
.item_ul li i.index_item_5{background-image: url(../images/item_5_h.png);}
.item_ul li i.index_item_6{background-image: url(../images/item_6_h.png);}
.item_ul li i.index_item_7{background-image: url(../images/item_7_h.png);}
.item_ul li i.index_item_8{background-image: url(../images/item_8_h.png);}
.item_ul li i.index_item_9{background-image: url(../images/item_9_h.png);}
.item_ul li i.index_item_10{background-image: url(../images/item_10_h.png);}
.item_ul li i.index_item_11{background-image: url(../images/item_11_h.png);}
.item_ul li i.index_item_12{background-image: url(../images/item_12_h.png);}
.item_ul li i.index_item_13{background-image: url(../images/item_13_h.png);}
.item_ul li p{ width: 100%; height: 30px; font-size: 16px; text-align: center; line-height: 30px; color: #999;text-decoration: none;}

.item_ul li.on::after{ display: block; content: ""; position: absolute; top: -12px; right: -12px; width: 30px; height: 30px; border: 2px solid rgb(0,135,255); background-color: #fff; background-image: url(../images/xuanzhong2.png); background-position: center; background-repeat: no-repeat; background-size: 20px auto; border-radius: 50%;}
.item_ul li.on i,.item_ul li:hover i{border: 1px solid rgb(0,134,225);background-image: url(../images/item_0_b.png);}
.item_ul li.on i.index_item_1,.item_ul li:hover i.index_item_1{background-image: url(../images/item_1_b.png);}
.item_ul li.on i.index_item_2,.item_ul li:hover i.index_item_2{background-image: url(../images/item_2_b.png);}
.item_ul li.on i.index_item_3,.item_ul li:hover i.index_item_3{background-image: url(../images/item_3_b.png);}
.item_ul li.on i.index_item_4,.item_ul li:hover i.index_item_4{background-image: url(../images/item_4_b.png);}
.item_ul li.on i.index_item_5,.item_ul li:hover i.index_item_5{background-image: url(../images/item_5_b.png);}
.item_ul li.on i.index_item_6,.item_ul li:hover i.index_item_6{background-image: url(../images/item_6_b.png);}
.item_ul li.on i.index_item_7,.item_ul li:hover i.index_item_7{background-image: url(../images/item_7_b.png);}
.item_ul li.on i.index_item_8,.item_ul li:hover i.index_item_8{background-image: url(../images/item_8_b.png);}
.item_ul li.on i.index_item_9,.item_ul li:hover i.index_item_9{background-image: url(../images/item_9_b.png);}
.item_ul li.on i.index_item_10,.item_ul li:hover i.index_item_10{background-image: url(../images/item_10_b.png);}
.item_ul li.on i.index_item_11,.item_ul li:hover i.index_item_11{background-image: url(../images/item_11_b.png);}
.item_ul li.on i.index_item_12,.item_ul li:hover i.index_item_12{background-image: url(../images/item_12_b.png);}
.item_ul li.on i.index_item_13,.item_ul li:hover i.index_item_13{background-image: url(../images/item_13_b.png);}
.item_ul li.on p,.item_ul li:hover p{color: rgb(0,134,225); text-decoration: none;}

.subscribe_div{ position: relative; padding-left: 130px; min-height: 46px; margin-bottom: 40px;}
.subscribe_div::before{display: block; content: ""; width: 14px; height: 14px; border: 1px solid #e8e8e8; background-color: #fff; border-radius: 50%; position: absolute; left: -49px; top: 16px;}
.subscribe_div dt{width: 100px; height: 46px; position: absolute; left: 0; top: 0; line-height: 46px; font-size: 16px; color: #666; text-align: right;}

.item_rule{ width: 960px; height: auto; margin-bottom: 40px; border-radius: 10px; overflow: hidden;}
.item_rule img{width: 100%; height: auto; display: block;}

.subscribe_input_warp{ position: relative;}
.subscribe_input{display: block; float: left; width: 280px; height: 44px; padding: 0 10px; margin-right: 30px; border: 1px solid #e8e8e8; border-radius: 4px;font-size: 14px;}
.subscribe_input.arrow_down{ background-image: url(../images/jt_down.png); background-position: 270px center; background-repeat: no-repeat; background-size: 12px auto;}
.subscribe_input.hover{cursor: pointer;}
.subscribe_input_warp .get_code{position: absolute; width: 160px; height: 44px; left: 141px; top: 1px; background-color: rgb(240,240,240); border: 0; border-left: 1px solid #e8e8e8; border-radius: 0 4px 4px 0; cursor: pointer; color: #666;}

.area_code_select{width: 400px; height: auto; padding: 5px 18px 0px; font-size: 14px; line-height: 30px; background-color: #fff; position: absolute; left: 0; top: 46px; z-index: 4;border-radius: 4px; border: 1px solid #e8e8e8; display: none;-moz-box-shadow:0px 1px 6px #D4D4D4; -webkit-box-shadow:0px 1px 6px #D4D4D4; box-shadow:0px 1px 6px #D4D4D4;}
.area_code_select h3{border-bottom: 1px solid rgb(220,220,220); line-height: 36px;font-size: 14px;}
.area_code_select h3 a.category_back{display: none; width: 60px; height: 24px; color: #fff; background-color: #1694C8; margin: 6px 0; font-size: 13px; line-height: 24px; border-radius: 24px; text-align: center; float: right;}
.area_code_select h3 a.category_back:hover{background-color: #0b709b; text-decoration: none;}
.area_code_select .category_one_ul{width: 400px; height: auto; margin: 10px 0 10px;}
.area_code_select .category_one_ul::after{content: ''; display: table; clear: both;}
.area_code_select .category_one_ul a{display: block; margin-right: 10px; float: left; min-width: 90px ;}
.area_code_select .category_one_ul a:hover,.area_code_select .category_one_ul a.on{text-decoration: none; color: #1694C8;}
.area_code_select .category_two_ul{width: 400px; height: auto; margin: 10px 0 10px; display: none;}
.area_code_select .category_two_ul::after{content: ''; display: table; clear: both;}
.area_code_select .category_two_ul a{display: block; margin-right: 20px; float: left; min-width: 80px ;}
.area_code_select .category_two_ul a:hover,.area_code_select .category_two_ul a.on{text-decoration: none; color: #1694C8;}

.subscribe_time_warp{position: relative;}
.subscribe_time{display: block; float: left; width: 200px; height: 44px; padding: 0 44px 0 10px; margin-right: 30px; border: 1px solid #e8e8e8; border-radius: 4px; cursor: pointer; font-size: 14px;}
.subscribe_time_warp::after{display: block; content: ""; width: 44px; height: 44px; top: 1px; left: 211px; background-color: rgb(245,245,245); position: absolute; background-image: url(../images/time_icon_h.png); background-position: center; background-repeat: no-repeat; background-size: 30px auto;}

.subscribe_textarea{ width: 720px; height: 75px; font-size: 14px; padding: 10px; line-height: 25px; color: #666;border: 1px solid #e8e8e8; border-radius: 4px;resize:none; font-family: "微软雅黑","华文细黑",Arial,sans-serif;}

.subscribe_staff_warp{ width: 920px; height: auto; position: relative; margin-bottom: 40px;}
.subscribe_staff_ul{ width: 100%; height: 42px;}
.subscribe_staff_ul li{ width: 285px; height: 42px; background-color: rgb(240,240,240); border: 1px solid rgb(220,220,220); font-size: 16px; text-align: center; line-height: 42px; color: #666; float: left; margin-right: 30px; border-radius: 22px; cursor: pointer;}
.subscribe_staff_ul li.on,.subscribe_staff_ul li:hover{background-color:#3b9eff; border: 1px solid #2882db; color: #fff;}
.staff_select_div{width: 898px; max-height: 500px; border: 1px solid #3b9eff; border-radius: 8px; color: #fff; margin-top: 18px; position: relative; display: none; padding: 20px 0 0 20px;}
.staff_select_div::before{width: 0; height: 0; border: 14px solid transparent; border-bottom-color: #3b9eff ; left: 445px; top: -28px; position: absolute; content: "";}

.staff_select_ul{ width: 898px; max-height: 440px;}
.staff_select_ul li{ width: 262px; padding-left: 165px; height: 198px; background-color:rgb(240,246,246); border: 1px solid #e7e7e7; margin: 0 20px 20px 0; float: left;  position: relative;transition: .3s;}
.staff_select_ul li .img{ width: 140px; height: 180px; position: absolute; left: 10px; top: 10px; overflow: hidden; background-color: #2882db; border-radius: 8px;}
.staff_select_ul li .img img{width: 140px; height: 180px; display: block;transition: .3s;}
.staff_select_ul li .title{line-height: 32px; color: #444;font-size: 18px; padding-top: 8px; margin-bottom: 10px; padding-left: 8px;}
.staff_select_ul li .title h3{display: inline-block; margin-right: 20px;}
.staff_select_ul li .title em{color: #666; margin-right: 10px; font-size: 16px;}
.staff_select_ul li .info p{color: #444;font-size: 14px; line-height: 24px; background-color: rgb(252,252,252); border: 1px solid rgb(230,230,230); padding: 0 15px; display: inline-block; border-radius: 13px; margin-bottom: 10px; margin-right: 10px;}
.staff_select_ul li .staff_btns{ width: 250px; height: 36px; text-align: center; position: absolute; left: 165px; bottom: 10px; border-top: 1px solid rgb(230,230,230); padding-top: 10px; }
.staff_select_ul li .staff_btns a{height: 34px; padding: 0 20px; background-color: #3b9eff; color: #fff; margin: 0 10px; font-size: 14px; line-height: 34px; border-radius: 20px; display: inline-block;}
.staff_select_ul li .staff_btns a:hover{text-decoration: none;}

.staff_select_ul li:hover,.staff_select_ul li.on{background-color:#d5e6f7; border: 1px solid #8fc5fc;}
.staff_select_ul li:hover .img img{transform:scale(1.1);}
/*
.staff_select_ul li:hover .title,.staff_select_ul li.on .title{color: #fff;}
.staff_select_ul li:hover .title em,.staff_select_ul li.on .title em{color: #fff;}
.staff_select_ul li:hover .staff_btns a,.staff_select_ul li:hover .staff_btns a{background-color: #fff; color: #2882db;}
*/
.staff_select_ul li.on::before{display: block; width: 30px; height: 30px; background-color:#fff; position: absolute; right: -8px; top: -8px; content: ""; border-radius: 50%; border: 2px solid #2882db;background-image: url(../images/xuanzhong2.png); background-position: center; background-repeat: no-repeat; background-size: 20px auto;}

.staff_select_page{ width: 100%; height: 32px; margin-bottom: 20px; text-align: center;} 
.staff_select_page a,.staff_select_page p{ display: inline-block; margin: 0 10px; padding: 0 15px; height: 30px; font-size: 13px; background-color: rgb(240,240,240); border: 1px solid rgb(220,220,220); line-height: 30px; color:#2882db; border-radius: 16px;}
.staff_select_page p em{font-weight: bold; color: #f60; padding: 0 3px;}
.staff_select_page a{background-color: #3b9eff; border: 1px solid#2882db; color: #fff;}
.staff_select_page a:hover{background-color:#2882db; text-decoration: none;}
.staff_select_page a.nolink{background-color: rgb(240,240,240); border: 1px solid rgb(220,220,220); color: #888; cursor: default;}

.subscribe_msg{font-size: 14px; box-sizing: border-box; line-height: 24px; color: #666; padding: 8px 0 10px 45px; border: 1px solid rgb(220,220,220); background-color: rgb(250,250,250); border-radius: 8px; width: 600px; background-image: url(../images/warning.png); background-position: 12px 10px; background-repeat: no-repeat; background-size: 24px auto;}
.subscribe_msg em{display: block; line-height: 30px; color: #888;}
.subscribe_btn_warp{height: 44px;  margin:60px auto 80px; text-align: center;}
.subscribe_btn_warp .subscribe_btn{display: inline-block; width: 320px; height: 44px; background-color:#3b9eff; font-size: 18px; line-height: 44px; border: 0; border-radius: 22px; cursor: pointer; color: #fff;}
.subscribe_btn_warp .subscribe_btn:hover{background-color:#2882db}
/*
#3b9eff
#19c3ff
#2882db
*/