.tkonline2020-grid{ width: 1200px; display: block; margin: 0 auto;}
.service-banner{ background: url(//mcdn.tk.cn/tkcms/file/upload/tkonline2020/images/service/service_banner.jpg) center top no-repeat; height: 518px;}
.protection-banner{ background: url(//mcdn.tk.cn/tkcms/file/upload/tkonline2020/images/file_protection/protection_banner.jpg) center top no-repeat; height: 518px;}
.service-title{ font-size: 24px; line-height: 30px; font-weight: 700; padding-left: 18px; position: relative; margin-bottom: 40px;}
.service-title:before{ content: ''; width: 6px; height: 30px; background: #ff8d18; position: absolute; left: 0; top: 0;}
.service-container{ background: #f7f7f7; padding: 120px 0 50px; position: relative;}
.service-container .number{ height: 180px; background: rgba(6,34,117,.9); position: absolute; left: 50%; margin-left: -600px; top: -100px;}
.service-container .number ul{ padding-top: 40px;}
.service-container .number li{ width: 400px; float: left; color: #fff; text-align: center;}
.service-container .number li b{ font-size: 48px; line-height: 60px; display: block; font-weight: 500;}
.service-container .number li p{ font-size: 18px; margin-top: 10px;}
.service-container .article-wrap{ width: 860px;}
.service-container .aside-wrap{ width: 310px;}
.service-container .article-item{ background: #fff; padding: 20px 20px 0;}
.service-container .article-item .icolist{ display: flex; justify-content: flex-start; flex-wrap: wrap;}
.service-container .article-item .icolist li{ font-size: 18px; text-align: center; line-height: 20px; flex: 0 1 25%; margin-bottom: 50px;}
.service-container .article-item .icolist li span{ width: 100px; height: 100px; display: block; border-radius: 50%; background: #ff8d18; position: relative; margin: 0 auto 15px;}
.service-container .article-item .icolist li span:before{ content: ''; background: url(//mcdn.tk.cn/tkcms/file/upload/tkonline2020/images/service/service_ico.png) no-repeat; width: 74px; height: 74px; position: absolute; left: 50%; top: 50%; margin: -37px 0 0 -37px; transition: 1s;}
.service-container .article-item .icolist li span.s1:before{ background-position: 0 0;}
.service-container .article-item .icolist li span.s2:before{ background-position: 0 -74px;}
.service-container .article-item .icolist li span.s3:before{ background-position: 0 -148px;}
.service-container .article-item .icolist li span.s4:before{ background-position: 0 -222px;}
.service-container .article-item .icolist li span.s5:before{ background-position: 0 -296px;}
.service-container .article-item .icolist li span.s6:before{ background-position: 0 -370px;}
.service-container .article-item .icolist li span.s7:before{ background-position: 0 -444px;}
.service-container .article-item .icolist li span.s1-3-1:before{ background-position: -74px 0;}
.service-container .article-item .icolist li span.s1-3-2:before{ background-position: -74px -74px;}
.service-container .article-item .icolist li span.s1-3-3:before{ background-position: -74px -148px;}
.service-container .article-item .icolist li span.s1-2-1:before{ background-position: -74px -222px;}
.service-container .article-item .icolist li span.s1-2-3:before{ background-position: -74px -296px;}
.service-container .article-item .icolist li span.s1-4-1:before{ background-position: -74px -370px;}
.service-container .article-item .icolist li span.s1-4-2:before{ background-position: -74px -444px;}
.service-container .article-item .icolist li span.s2-2-1:before{ background-position: -148px 0;}
.service-container .article-item .icolist li span.s2-2-2:before{ background-position: -148px -74px;}
.service-container .article-item .icolist li span.s2-2-3:before{ background-position: -148px -148px;}
.service-container .article-item .icolist li a{ display: inline-block;}
.service-container .article-item .icolist li a:hover span:before{ -webkit-animation: .8s swing; animation: .8s swing;}
.service-container .article-item .icolist li a:hover{ color: #ff8d18;}
.service-container .article-item:not(:first-child){ margin-top: 20px;}
.service-container .article-item .policy{ display: flex; flex-wrap: wrap; justify-content: space-around; padding: 0 10px 20px;}
.service-container .article-item .policy .info{ width: 380px; height: 248px; border-radius: 5px; box-shadow: 0 0 6px 0 rgba(0,0,0,0.1); margin-bottom: 20px; position: relative; display: flex; flex-flow: column nowrap; justify-content: flex-end; align-items: center;}
.service-container .article-item .policy .info:before{ content: ''; background: url(//mcdn.tk.cn/tkcms/file/upload/tkonline2020/images/service/service_policy.png) no-repeat; width: 162px; height: 174px; position: absolute; top: 18px; right: 18px;}
.service-container .article-item .policy .info ul{ position: relative; z-index: 2; font-size: 18px; line-height: 26px; min-height: 52px;}
.service-container .article-item .policy .info a{ width: 300px; height: 50px; background: #ff8d18; display: block; border-radius: 25px; font-size: 18px; line-height: 50px; text-align: center; color: #fff; position: relative; z-index: 2; margin: 48px 0 24px; transition: .3s;}
.service-container .article-item .policy .info a:hover{ opacity: .8;}
.service-container .article-item .other{ padding: 0 15px 50px;}
.service-container .article-item .other h3{ display: flex; align-items: center; font-size: 18px; color: #ff8d18; font-weight: 700; margin-bottom: 30px;}
.service-container .article-item .other h3 span{ margin: 0 15px 0 0; width: 60px; height: 60px; display: block; border-radius: 50%; background: #ff8d18; position: relative;}
.service-container .article-item .other h3 span:before{ content: ''; background: url(//mcdn.tk.cn/tkcms/file/upload/tkonline2020/images/service/service_other.png) no-repeat; width: 46px; height: 46px; position: absolute; left: 50%; top: 50%; margin: -23px 0 0 -23px;}
.service-container .article-item .other h3 span.o1:before{ background-position: 0 0;}
.service-container .article-item .other h3 span.o2:before{ background-position: 0 -46px;}
.service-container .article-item .other dl{ line-height: 26px; margin-bottom: 36px;}
.service-container .article-item .other dt{ font-size: 18px; font-weight: 700; margin-bottom: 15px;}
.service-container .article-item .other dd{ font-size: 14px; position: relative;}
.service-container .article-item .other dd .tm{ margin-top: 25px;}
.service-container .article-item .other dd .codeapp{ width: 116px; position: absolute; top: -40px; right: 100px; text-align: center; font-size: 14px; line-height: 18px;}
.service-container .article-item .other dd .codeapp img{ display: block; border: 6px solid #062275; border-radius: 2px; margin-bottom: 5px;}
.service-container .article-item .other .pic img{ display: block; margin: 20px auto 0;}
.service-container .article-item .other .datalist li{ font-size: 14px; line-height: 28px; display: flex; justify-content: space-between;}
.service-container .article-item .other .datalist li a{ display: block; flex: auto;}
.service-container .article-item .other .datalist li span{ color: #999; display: block;}
.service-container .article-item .other .step{ width: 100%; display: block; margin-top: 20px;}
.service-container .article-item .other .step2{ display: block; margin: 20px auto 0;}
.service-container .article-item .other .btn{ display: block; font-size: 14px; color: #fff; line-height: 40px; text-align: center; width: 120px; border-radius: 20px; background: #ff6600; margin: 20px auto 0;}
.service-container .article-item h4{ font-size: 18px; line-height: 40px; background: #f7f7f7; font-weight: 700; text-indent: 15px; margin-bottom: 25px;}

.service-container .aside-item{ background: #fff url(//mcdn.tk.cn/tkcms/file/upload/tkonline2020/images/service/service_aside.jpg) no-repeat center bottom; padding: 20px 25px; height: 354px;}
.service-container .aside-item a{ display: block; background: #ffcc66; font-size: 18px; line-height: 34px; border-radius: 17px; padding: 0 12px 0 24px; margin-bottom: 15px; position: relative;}
.service-container .aside-item a:after{ content: ''; background: url(//mcdn.tk.cn/tkcms/file/upload/tkonline2020/images/service/service_arr.png) no-repeat; width: 8px; height: 12px; position: absolute; right: 20px; top: 50%; margin-top: -6px; transition: .5s;}
.service-container .aside-item a:hover:after{ -webkit-transform: translateX(6px); transform: translateX(6px);}
.service-container .menu{ padding: 25px 25px 10px; background: #fff;}
.service-container .menu dl{ font-size: 18px; line-height: 36px;}
.service-container .menu dt{ background: #062275; border-radius: 18px; color: #fff; text-indent: 22px;}
.service-container .menu dd{ padding: 10px 0;}
.service-container .menu dd a{ display: block; text-indent: 28px; margin: 2px 0; position: relative;}
.service-container .menu dd a:after{ content: ''; background: url(//mcdn.tk.cn/tkcms/file/upload/tkonline2020/images/service/service_arr.png) no-repeat; width: 8px; height: 12px; position: absolute; right: 12px; top: 50%; margin-top: -6px; transition: .5s;}
.service-container .menu dd a:hover:after{ -webkit-transform: translateX(6px); transform: translateX(6px);}
.service-container .menu dd a:hover,.service-container .menu dd a.active{ color: #ff8d18;}

.service-container-list{ padding: 30px 0 100px;}
.service-container-list .dress{ font-size: 14px; line-height: 30px; margin-bottom: 25px; text-indent: 1em;}
.service-container-list .article-item{ min-height: 560px;}
.service-container-list .article-item .icolist li{ flex: 0 1 33%;}

#mask{ width: 100%; height: 100vh; background: rgba(0,0,0,0.5); position: fixed; left: 0; top: 0; z-index: 999; display: none;}
.service-dialog{ width: 650px; height: 530px; background: #fff; border-radius: 5px; position: fixed; left: 50%; top: 50%; margin: -265px 0 0 -325px; z-index: 1000; display: none; -webkit-animation-duration: .5s; animation-duration: .5s;}
.service-dialog h3{ font-size: 18px; line-height: 60px; margin: 0 12px; border-bottom: 1px solid #ddd; text-indent: 12px; font-weight: 700;}
.service-dialog .close{ background: url(//mcdn.tk.cn/tkcms/file/upload/tkonline2020/images/service/service_close.png) no-repeat center center; width: 24px; height: 24px; position: absolute; right: 24px; top: 18px; cursor: pointer; transition: .5s;}
.service-dialog .close:hover{ -webkit-transform: rotate(180deg); transform: rotate(180deg);}
.service-dialog .info{ padding: 26px; overflow-y: auto; height: 416px;}
.service-dialog .info::-webkit-scrollbar{ width: 6px;}
.service-dialog .info::-webkit-scrollbar-track{ border-radius: 6px;}
.service-dialog .info::-webkit-scrollbar-thumb{ border-radius: 6px; background: #999;}
.service-dialog .codetxt{ font-size: 18px; line-height: 24px; text-align: center; overflow: hidden;}
.service-dialog .codetxt img{ display: block; margin: 100px auto 35px;}
.service-dialog .codetxt span{ color: #ff6600;}
.service-dialog .doclist li{ height: 88px; border: 1px solid #ff6600;}
.service-dialog .doclist li:not(:first-child){ margin-top: 15px;}
.service-dialog .doclist li a{ height: 100%; display: flex; align-items: center; justify-content: space-between; padding: 0 25px; font-size: 24px; color: #ff6600;}
.service-dialog .doclist li a span{ font-size: 12px; color: #0a8ce4; text-align: center; width: 30px; line-height: 24px; margin-left: 90px;}
.service-dialog .doclist li a span:before{ content: ''; background: url(//mcdn.tk.cn/tkcms/file/upload/tkonline2020/images/service/service_dl.png) no-repeat; width: 30px; height: 31px; display: block;}
.service-dialog .intro{ padding: 36px 0 0 60px;}
.service-dialog .intro li{ margin-bottom: 30px; line-height: 30px; position: relative; padding-left: 80px;}
.service-dialog .intro li h4{ font-size: 26px;}
.service-dialog .intro li p{ font-size: 16px; color: #666;}
.service-dialog .intro li span{ width: 56px; height: 56px; background: url(//mcdn.tk.cn/tkcms/file/upload/tkonline2020/images/file_syxb2020/ico_claims.png) no-repeat; position: absolute; left: 0; top: 0;}
.service-dialog .intro li:nth-child(1) span{ background-position: 0 0;}
.service-dialog .intro li:nth-child(2) span{ background-position: 0 -56px;}
.service-dialog .intro li:nth-child(3) span{ background-position: 0 -112px;}
.service-dialog .intro li:nth-child(4) span{ background-position: 0 -168px;}

.intelbx-container .banner{ background: #ff7200 url(//mcdn.tk.cn/tkcms/file/upload/tkonline2020/images/service/intelbx_banner.jpg) center top no-repeat; height: 240px;}
.intelbx-container .info{ width: 780px; margin: 40px auto 0;}
.intelbx-container .info dl{ padding: 25px 20px; line-height: 40px;}
.intelbx-container .info dl:not(:last-of-type){ border-bottom: 1px solid #f2f2f2;}
.intelbx-container .info dt{ font-size: 32px; font-weight: 700; margin-bottom: 10px;}
.intelbx-container .info dd{ font-size: 26px; color: #666;}
.intelbx-container .info dd a{ color: #0033cc; text-decoration: underline;}

.service-container .newslist li{ line-height: 76px; border-bottom: 1px dashed #E6E6E6;}
.service-container .newslist li a{ display: block; font-size: 18px; color: #666; transition: .3s; position: relative; padding-left: 20px;}
.service-container .newslist li a:before{ content: ''; width: 6px; height: 6px; border-radius: 50%; background: #ddd; position: absolute; left: 0; top: 50%; margin-top: -3px;}
.service-container .newslist li a:hover{ color: #ff8d18;}
.service-container .newslist li a:hover:before{ background: #ff8d18;}
.service-container .newslist li a:hover span{ color: #999;}
.service-container .newslist li a span{ font-size: 14px; position: absolute; right: 0; color: #999;}

.service-container .pages{ text-align: center; margin-top: 40px; padding-bottom: 40px;}
.service-container .pages a,.service-container .pages span{ display: inline-block; font-size: 14px; line-height: 26px; border: 1px solid #ddd; padding: 0 10px; margin-left: 10px; cursor: pointer;}
.service-container .pages a.active{ border-color: #ff8d18; background: #fff; color: #ff8d18;}
.service-container .pages a.disabled{ color: #ddd; cursor: initial;}
.service-container .pages a:hover{ border-color: #ff8d18;}
.service-container .pages a.disabled:hover{ border-color: #ddd;}
.service-container .pages span{ cursor: initial;}
.service-container .pages span font{ color: #ff8d18;}

@media screen and (max-width:1440px){
  .tkonline2020-grid{ width: 1080px;}
  .service-container .number{ margin-left: -540px;}
  .service-container .number li{ width: 360px;}
  .service-container .number li b{ font-size: 42px;}
  .service-container .article-wrap{ width: 740px;}
  .service-container .article-item .policy .info{ width: 320px;}
  .service-container .article-item .policy .info a{ width: 250px;}
}
