/* 海南公司注册 */
.hntopheight { height: 60px;}
.hn-header {width: 100%; min-width: 1200px; height: 60px;background-color: #fff; position: fixed; top: 0; left: 0; z-index: 35; overflow: hidden; box-shadow: 2px 2px 4px rgba(206,222,246,.4)}
.hn-header .logo { padding-top: 7px; height: 41px; float: left;}
.hn-header .logo a {display: block;}
.hn-header .telbar-phone { padding-top: 9px; float: right; text-align: right; position: relative}
.hn-header .telbar-phone:before {content: " "; width: 1px; height: 40px; background-color: #e5e5e5; display: inline-block;  position: absolute; left:0; top:10px; z-index: 1 }
.hn-header .telbar-phone img { margin:0 36px 0 40px; vertical-align: middle;}
.hn-header .telbar-phone .bf-btn { margin-top: 2px; height: 36px; line-height: 36px; font-size: 14px; display: inline-block}
.hn-header-nav { margin: 0 0 0 170px; padding-top: 10px; line-height: 40px; overflow: hidden;}
.hn-header-nav ul li {float: left; text-align: center}
.hn-header-nav ul li a {padding:0 15px; display: inline-block; position: relative}
.hn-header-nav ul li.active  a {color: #2f78f2; font-weight: bold}

.bf-btn { padding: 0 10px; min-width: 80px; height:40px; line-height: 40px; color: #fff; font-size: 15px;   text-align: center; background-color: #feac5b;border: 1px solid #feac5b; border-radius:4px; display:block; cursor: pointer;}
.bf-btn:hover {background-color: #f54f5d; color: #fff;transition: transform .5s,background-color .5s ease-out;}
.main-btn { padding: 40px 0 0; text-align: center;}
.main-btn .bf-btn { margin: 0 35px; padding: 0 20px; min-width: 120px; display: inline-block;}
.zt-wrapper {margin:0 auto; width:1000px;}
.hn-bodybg { background-color: #e0f2fe;}

.hn-bg1 {background: url("../images/hainan/bg1.png") no-repeat left  500px; }
.hn-bg2 {background: url("../images/hainan/bg3.png") no-repeat right  100px; }
.hn-bg3 {background: url("../images/hainan/bg4.png") no-repeat left bottom; }
.hn-bg4 {background: url("../images/hainan/bg2.png") no-repeat right  70%; }
/* 公共栏目 */
.index-title { padding: 40px 0; text-align: center; position: relative; background: url("../images/hainan/line-1.png") repeat-x left 52px; }
.index-title h2 { padding:0 26px; height:40px; line-height: 40px; display: inline-block;font-size: 34px; background-color: #e0f2fe; font-weight: bold; }
.index-title .mlr { width: 30px; display: inline-block}

.hn-two {padding:0;clear: both; overflow: hidden; }
.hn-two dl { margin:0 2% 15px 0; width: 49%; height: 200px; float: left; background-color: #ffffff;border-radius: 4px; overflow: hidden; }
.hn-two dl:nth-child(2n) {margin-right: 0}
.hn-two dl dt { width: 106px; height: 200px; background: #c4e7fd; float: left; overflow: hidden; text-align: center; position: relative;}
.hn-two dl dt p { padding-top: 30px; height: 85px;  font-weight: bold;  color: #333; font-size: 16px;}
.hn-two dl dt span { width:100%; height:108px; display:block; background-position: center top; background-repeat: no-repeat;}
.hnico1 { background-image: url("../images/hainan/ico-t1.png?713");}
.hnico2 { background-image: url("../images/hainan/ico-t2.png?713");}
.hnico3 { background-image: url("../images/hainan/ico-t3.png?713");}
.hnico4 { background-image: url("../images/hainan/ico-t4.png?713");}
.hn-two dl dd { margin: 0 0 0 120px; padding-top: 24px; min-height: 200px; line-height: 22px; position: relative; }
.hn-two dl dd p {padding: 2px 0;}
.st2 ,.st3,.st4,.st6,.st7,.st8,.st10{ margin-right: 8px; padding: 0 5px; height:22px; line-height: 22px; display: inline-block;   color: #737373; border-radius: 3px}
.st2 {background-color: #f4f9f9;}
.st3 {background-color: #eaf9fe;}
.st4 {background-color: #f2f9ff;}
.st6 {background-color: #f4f9f9;}
.st8 {background-color: #f0fcf6;}
.st7 {background-color: #f7f0fa;}
.st10 {background-color: #e0f8fb;}
.hn-two dl dd .t2 { padding-bottom: 15px; color: #0096ff; font-size: 18px; }
.hn-two dl .smore { position: absolute; bottom: 20px; right: 20px; color: #feb26a;}

.hn-two dl dd .t {display: inline-block; float: left; font-weight: normal;}
.hn-two dl dd .cr {display:block;}
.hn-two dl dd .cr span { margin-bottom: 8px;}
.hn-two .labellist span { margin-bottom: 10px;}


.hn-three-box .tbox {display: none}
.hn-three-tab {margin-bottom: 30px; height: 50px; position: relative; text-align: center; clear: both; }
.hn-three-tab ul li { margin-right: 10px; width: 158px; height: 48px; line-height: 48px; font-size: 18px; color: #ffffff; text-align: center; background-color: #0096ff;border-radius: 4px; cursor:pointer; float: left; position: relative}
.hn-three-tab ul li:last-child {margin-right: 0; width: 160px;}
.hn-three-tab ul li.active:before { content: " "; width: 18px; height: 18px; background-color: #0096ff; display: inline-block; position: absolute; left: 50%; bottom: -9px; transform: translateX(-50%) rotate(45deg);}

.hn-three {  clear: both; overflow: hidden;}
.hn-three-sun {  width: 156px; float: left; }
.hn-three-sun ul li { margin-bottom: 12px; height: 55px; line-height: 55px; font-size: 18px; text-align: center;border-radius: 4px; background-color: #b7e7ff; background-image: url("../images/hainan/bg_02.png"); background-repeat: no-repeat; cursor:pointer;}
.hn-three-sun ul li:nth-of-type(2) { background-position: -30px  -80px;}
.hn-three-sun ul li:nth-of-type(3) { background-position: -200px  -60px;}
.hn-three-sun ul li:nth-of-type(4) { background-position: -300px  -110px;}
.hn-three-sun ul li.active {color: #333; background-color: rgba(191,212,168,1); transition: transform .5s,background-color .5s ease-out; }
.subclassification-box { margin-left: 174px; }
.subclassification-box .cnbox { margin-bottom: 12px; padding: 20px 30px 20px 46px; min-height: 257px; background-color: #fff; border-radius: 4px;line-height: 26px; position: relative; display: none }
.subclassification-box .cnbox:before { content: " "; width: 14px; height: 14px; background-color: #fff; display: inline-block; position: absolute; left: -7px; top:30px; transform: rotate(45deg);}
.subclassification-box .cnbox:after { content: " "; width: 10px; height: 10px; background-color: #1cb4f6; border-radius: 100%; display: inline-block; position: absolute; left:26px; top:28px; }
.subclassification-box .cnbox p.tp24 { padding-left: 24px;}

.hn-ask {padding:20px; background: #fff  url("../images/hainan/bg_01.png") no-repeat  left bottom;border-radius: 4px; clear: both; overflow: hidden; }
.hn-ask h3 { margin-bottom: 30px; padding-top: 20px; height: 70px; font-size: 22px; font-weight: bold; color: #333; text-align: center;border-bottom: 1px dashed #38b4f3; position: relative; }
.hn-ask h3:before { content: " "; width: 90px; height:9px; background-color: #38b4f3; display: inline-block; position: absolute; left:50%; bottom:-5px;transform: translateX(-50%) ; }
.hn-ask-list { clear: both;}
.hn-ask-list dl { margin-bottom: 30px; padding: 0 2% 0 2%; width:48%; float: left; line-height: 24px;}
.hn-ask-list dl:nth-child(2n) { padding: 0 0 0 6%;}
.hn-ask-list dl dt { padding: 5px 0 10px 30px; font-weight: bold; position: relative;}
.hn-ask-list dl dt .t { width: 30px; height: 30px; line-height: 30px; background-color: #38b4f3; color: #ffffff; text-align: center; border-radius: 100%; display: inline-block; position: absolute; left:-6px; top:1px; }
.hn-ask-list dl dt .t:before { content: " "; width: 6px; height: 6px; background-color: #38b4f3; display: inline-block; position: absolute; right:-1px; bottom: 6px; transform: rotate(75deg);}
.hn-ask-list dl dd .t {font-weight: bold;}
.hn-ask .main-btn { padding-bottom: 20px;}

.hn-four { clear: both; overflow: hidden;}
.hn-four dl {margin: 0  24px 0 0; width: 228px;  line-height: 22px;  background-color: #ffffff;border-radius: 4px; float: left; overflow: hidden}
.hn-four dl:last-child { margin-right: 0;}
.hn-four dl dt {min-height: 94px; overflow: hidden;}
.hn-four dl dt p { margin: 0 10px; padding: 12px 0; font-size: 18px; text-align:center; font-weight: bold;border-bottom: 1px dashed #acc9fa;}
.hn-four dl dt img {}
.hn-four dl dd {padding:15px 10px 15px;text-align:justify; line-height: 24px; }
.hn-four dl dd p { min-height:250px;}
.hn-four dl dd .fbtn {text-align: center; display: block}
.hn-four dl dd .bf-btn { padding: 0 20px; line-height: 36px; height: 36px; display: inline-block}

.hn-five { padding: 30px 0 10px; width: 100%; text-align: center}
.hn-five img  {max-width:100%; height: auto;}

.hn-six { clear: both; }
.hn-six .item {margin:30px 0 30px 0; width:48%; background-color: #ffffff; border-radius: 4px;  float: left; line-height: 24px; position: relative}
.hn-six .item:nth-child(2n) { margin-right: 0; margin-left:25px;}
.hn-six h3 { margin: 0 25px; padding-left: 94px; height: 80px; line-height: 80px; font-size: 18px; font-weight: bold; border-bottom:1px dashed #70bfe1;}
.hn-six .cn { padding: 20px 25px 0; min-height: 235px; line-height: 26px; color: #666}
.hn-six .cn b {color: #222}
.hn-six .cn .ml {min-width: 120px; padding-right: 20px; display: inline-block;}
.hn-six em { width:96px; height: 94px; display: inline-block;  background-repeat: no-repeat; background-position: center; position: absolute; left: 20px; top: -40px; }
.hn-six em.s1 {background-image: url("../images/hainan/ico-six1.png");}
.hn-six em.s2 {background-image: url("../images/hainan/ico-six2.png");}
.hn-six em.s3 {background-image: url("../images/hainan/ico-six3.png");}
.hn-six em.s4 {background-image: url("../images/hainan/ico-six4.png");}
.hn-six em.s5 {background-image: url("../images/hainan/ico-six5.png");}
.hn-six em.s6 {background-image: url("../images/hainan/ico-six6.png");}


.hn-seven { padding: 20px 20px 10px; clear: both; background-color: #ffffff;}
.hn-seven dl {margin-bottom: 15px;}
.hn-seven dl dt { padding: 10px 0 15px;  color: #4d4f76}
.hn-seven dl dt .s {margin-right: 13px; width: 22px; height:22px; line-height: 22px; text-align: center; color: #ffffff; font-size: 10px;  background-color: #38b4f3; border-radius: 100%; display: inline-block; vertical-align: middle }
.hn-seven dl dd {padding-left: 35px; clear: both; overflow: hidden;}
.hn-seven dl dd span {width: 170px; height: 30px; line-height: 30px;  color: #5a5a5a; overflow: hidden; float: left; display: inline-block; cursor: pointer}
.hn-seven dl dd span i {width: 16px; height: 16px; margin:0 8px 2px 0;  border: 1px solid #e0f2fe; border-radius: 2px; background-color: #e0f2fe; display: inline-block; text-align: center; vertical-align: middle}
.hn-seven dl dd span i.active {border-color:  #38b4f3;  background: #38b4f3 url("../images/hainan/ico-selected.png") no-repeat center;  background-size:100%;}


.svg-user { width: 30px; height: 18px; fill:#38b4f3}
.svg-phone { width: 30px; height: 18px;fill:#38b4f3}

.nh-frow { margin-top: 50px; padding:130px 0 0 258px; height:275px; background:url("../images/hainan/bg-3.png") no-repeat left top;  clear: both; overflow: hidden}
.nh-frow .fbox { padding-top: 18px;}
.nh-frow .fcol {padding: 0 10px 0 50px; width:240px; float: left; position: relative}
.nh-frow .fcol .t {padding: 0 0 5px; width: 80px; text-align: right; line-height: 35px; font-size: 18px; color: #4d4f76; font-weight: bold; display: block; float: left;}
.nh-frow .fcol .ff {padding: 5px 0; position: relative}
.nh-frow .fcol .ff input { padding: 10px 10px 10px 36px; width:180px; height: 36px;  line-height: 18px; border: 1px  solid #e0f2fe; background-color: #e0f2fe; border-radius: 3px;}
.nh-frow .fcol .ff svg { position: absolute; left: 8px; top: 14px; z-index: 2}
.nh-frow .fcol .fmsg {color: #fe002a; line-height: 16px;}
.nh-frow .frombox { margin-left:60px; width: 150px; float: left;}


    /* 头部广告 */
.hn-topbanner{position:relative;clear:both; min-width: 1200px; }
.hn-topbanner .slide{position:relative;width:100%;height:600px; overflow: hidden}
.hn-topbanner .slide div{position:absolute;top:0;left:0;width:100%;height:100%;}
.hn-topbanner .slide div a{display:block;}
.hn-topbanner .slide p{ width: 100%;text-align:center; position:absolute;left: 0; bottom:20px; z-index:12;}
.hn-topbanner .slide-btn { display: none}
.hn-topbanner .slide p b{margin:0 3px;width:8px;height:8px; border-radius: 100%; background-color: #fff;cursor:pointer; display: inline-block; opacity: 0.8}
.hn-topbanner .slide p b.on {width:20px;border-radius: 6px; background-color: #fe002a}
.hn-topbanner .adv{display:block!important;width:969px;height:190px;margin:0 auto;padding:0 0 0 231px;overflow:hidden;}
.hn-topbanner .adv a{display:inline;float:left;margin:0 10px 0 0;}

.hn-topbanner .hn-toptext { width: 100%; position: absolute; left: 0; top: 15%; z-index: 24; text-align: center;}
.hn-topdescription {width: 100%;  height: 143px; position: absolute; left: 0; bottom: 0;z-index: 24; background-color: rgba(0,0,0,.6); }
.hn-topdescription .zt-wrapper { position: relative}
.hn-topdescription .zt-wrapper p { width: 100%; text-align: center; position: absolute;left: 0;  top: -8px;}
/*.hn-topdescription ul {clear: both; overflow: hidden; min-height: 120px; border-left:1px solid #ffffff; }*/
/*.hn-topdescription ul li {width: 25%; min-height: 120px; float: left; border-right:1px solid #ffffff; }*/
/*.hn-topdescription ul li h2 {padding: 0 15px; text-align: center; font-size: 16px; font-weight: bold; line-height: 30px;}*/
/*.hn-topdescription ul li p {padding:10px 20px 0; font-size: 13px; line-height: 20px; text-align: justify;}*/

.remind-dox {transform: translateX(-50%); top: 10%; left: 50%; position:fixed; z-index: 33; display: none}

/* footer begin */
.hn-footer { width: 100%; min-width: 1200px; height: 567px;  background: #2f78f2 url("../images/hainan/foot-bg.jpg") no-repeat center;}
.hn-footer .fbox {padding: 0 0 0 0; width: 45%; float: right;}
.hn-footer .fbox .t {padding:70px 0 45px; text-align: center;}
.hn-footer .fbox .cn { text-indent: 24px; line-height: 28px; color: #ffffff}

.service-right { display: none}

.home-right-top {background-color: #38b4f3; }
.hnservice-right { width: 54px; position: fixed; right: 20px;  top: 30%; z-index: 28}
.hnservice-right li {width:60px; position: relative; z-index: 67}
.hnservice-right .item {width:60px;  height: 66px;  text-align: center;   background-color:#f9515a; display: inline-block;}
.hnservice-right .item.wxbg { background-color:#2987fb;}
.hnservice-right .item em {margin: 10px 0 5px; width: 28px; height: 23px; display: inline-block;background-image: url("../images/hainan/ico-right-wx.png"); background-repeat: no-repeat; cursor: pointer;  }
.hnservice-right .item .t { font-size: 12px; color: #fff; font-weight: normal; line-height: 22px; display:block;}
.hnservice-right .hn-consulting {  background-color:#fff; box-shadow: 0px 0px 3px rgba(222,224,225,.5); border-radius: 5px;  position: absolute; right:68px; top:0;  z-index: 68; overflow: hidden; display: none}
.hnservice-right .hn-consulting  a { padding: 10px 20px; width:240px;  display: block;}
.hnservice-right .hn-consulting  a:hover {color: #222}
.hnservice-right .hn-consulting .closex { padding: 10px; -webkit-appearance: none; font-family:"Arial Black"; font-weight: 700;line-height: 1;color: #999; font-size: 15px; display: inline-block; position: absolute; right: 0px; top: 0px; z-index: 7; cursor: pointer;}
.hnservice-right .hn-consulting dt { font-size: 15px; font-weight: bold;}
.hnservice-right .hn-consulting dt img { vertical-align: text-bottom; margin-right: 10px;}
.hnservice-right .hn-consulting dd { padding-top: 6px; color: #999999; font-size: 13px;}
.hnservice-right .hnwx {  position: absolute; right:68px; top:0;  z-index: 6;}
.hnservice-right .hnwx .box { padding: 10px 0 10px; width: 220px; text-align: center;  background-color:#fff;box-shadow: 0px 0px 3px rgba(222,224,225,.5);  border-radius: 5px; clear: both; overflow: hidden; display: none}
.hnservice-right .hnwx img { width: 210px; height: auto;}
.hnservice-right .hnwx p { padding-top:2px; font-size: 12px; color: #666}
.hnservice-right  li:hover .hn-consulting {animation:hnservicePhoneAnimation 0.4s 1 ease-in-out;animation-fill-mode: forwards;display: block}
.hnservice-right  li:hover .hnwx  .box {animation:hnserviceWxAnimation 0.4s 1 ease-in-out;animation-fill-mode: forwards;display: block}
@keyframes hnservicePhoneAnimation {
    0% {opacity: 0; width: 56px}
    100% {opacity: 1; width:250px}
}
@keyframes hnserviceWxAnimation {
    0% {opacity: 0; width: 0px}
    100% {opacity: 1; width:240px}
}




