.diy-top-banner{position: relative;}
.diy-item-hover:hover{background-color:#eb5f07;background-image:linear-gradient(180deg,#e76d0c 0,#d74b00)}

.row{max-width:1200px;}
.diy-nav-panel-wrapper ::-webkit-scrollbar-thumb{background-color: red;
    border-radius: 5px;}
.diy-nav-panel-wrapper ::-webkit-scrollbar-thumb {
    border-radius: 4px;
}    
.diy-nav-panel-wrapper ::-webkit-scrollbar-track {
    border-left: 1px solid red;
    background-color: red;
}

.diy-box-website {position: relative;width: 100%;margin: 0 auto 30px;padding: 0;-webkit-tap-highlight-color: rgba(0,0,0,0);}
.diy-box-website .icon{
  font-weight: 500;position: relative;display: block;color: #414042;margin-top:40px;text-decoration: none;cursor: pointer;width: 100%;padding: 10px 20px 10px;margin-bottom: 0;
}
/*
a .title:hover,a .intro:hover{color:#ec7211;transition: all .5s;-webkit-transition: all .5s;}
a .title:hover,a .intro:hover{color:#ec7211;transition: all .5s;-webkit-transition: all .5s;}
*/
.diy-box-website :hover .intro,.diy-box-website :hover .title,.diy-box-website :hover i{transform: scale(1);transition: all .5s;-webkit-transition: all .5s;color:#ec7211;}
.diy-box-website :hover i{transform: scale(1.05);transition: all .5s;-webkit-transition: all .5s;}
.products-logo-div{font-weight: 450px; color:#fff;font-size:128px;transition: all 1s;-webkit-transition: all 1s;}
.products-logo-div:hover{transform: scale(1.05);transition: all 1s;-webkit-transition: all 1s;}

.diy-box-website .title {font-weight:500;position: relative;display: block;color: #202325;
    margin-top:40px;text-decoration: none;
    cursor: pointer;width: 100%;padding: 10px 20px 10px;
    margin-bottom: 0;transition: all 0.5s;-webkit-transition: all .5s;}
.diy-box-website .intro {transition: all .5s;-webkit-transition: all .5s;margin-left:auto;margin-right:auto;font-size: 0.875rem;width:65%;font-weight: 400;color: #202325;}
.diy-icon-ps-60-pie-bar-charts:before {background-position: -180px -420px;}

.diy-box-website .icon:before {content: "";display: block;float: left;margin-left: 0;width:50px;height: 50px;margin-right: 20px;top: 0;left: 50%;}
@media (-webkit-min-device-pixel-ratio: 1.5), not all, not all, not all{
	[class*="diy-icon-ps-"]:before, [class^=diy-icon-ps-]:before {
	    background-image: url(/wp-content/themes/html/images/generated/products_services_sprite_2a740d4227c6b317cf1f5242d7775ec9@2x.png);
	    background-size: 600px 570px;
	}
}


[class*="diy-icon-ps-"]:before, [class^=diy-icon-ps-]:before{

	background-image: url(/wp-content/themes/html/images/products_services_sprite_2a740d4227c6b317cf1f5242d7775ec9.png)
}

.diy-btn:hover{color:#f9f9f9;background: #EC7211;border: solid 0px #E76D0C;text-align: center;border-color: #e76d0c #e15500 #e15500;color: #fff;text-shadow: rgb(0 0 0 / 5%) 0 1px 0;background-color: #ec7211;background-image: linear-gradient(0deg,#f67c1b 0,#e15500);box-shadow: inset 0 1px 0 hsl(0deg 0% 100% / 20%);}
.diy-btn .active{line-height: 60px;height: 50px;color: #FFFFFF;padding: 10px 20px 12px 20px;font-size: 1rem;border-radius: 50px;background-color: #EC7211;border: solid 0px #E76D0C;text-align: center;border-color: #e76d0c #e15500 #e15500;color: #fff;text-shadow: rgb(0 0 0 / 5%) 0 1px 0;background-color: #ec7211;background-image: linear-gradient(0deg,#f67c1b 0,#e15500);box-shadow: inset 0 1px 0 hsl(0deg 0% 100% / 20%);}

/** 选中链接 **/    
/*transition: opacity .2s ease-in-out;transition-delay: .1s;

*/
.diy-a{opacity:1;border-bottom:solid 3px #ffffff;color:#333;line-height: 50px;height:50px;font-size:1.25rem;-webkit-transition: color .3s;transition: color .3s;}
.diy-a dd{width:80px;}
.diy-a dd:hover{cursor:pointer; opacity:1;border-bottom:solid 3px #FF6C00;color:#FF6C00;line-height: 50px;height:50px;font-size:1.25rem;max-width:100%;-webkit-transition: color .3s;transition: color .3s;}
.diy-a dd.active{border-bottom:solid 3px #FF6C00;color:#FF6C00;line-height: 50px;height:50px;font-size:1.25rem;max-width:100%;}
.diy-line-hover {position: absolute;z-index: 0;height: 3px;width: 0;padding: 0;background-color: #FF6C00;bottom: 0;-webkit-transition: .3s cubic-bezier(.4,0,.2,1);transition: .3s cubic-bezier(.4,0,.2,1);}
.diy-doc-title{margin-top:1.5rem;font-size:1.125rem;line-height: 1.6rem;font-weight: 700;}

/** 动画 **/
.diy-animate{transition: all .5s;-webkit-transition: all .5s;}

/** 文档 ui */
.diy-section-nav-header{height: 35px;line-height: 35px;margin-top:0rem;border-bottom: solid 0.0015rem #ddd;position: fixed;width: 100%;z-index: 999999;background: #eee;}
.diy-section-nav-header .full{background:rgba(50,50,50,0.055);}
.diy-section-side-nav {overflow:hidden;min-height:100vh;}
.diy-section-side-nav .side-item{overflow-y:auto;overflow-x:hidden;scroll-behavior: smooth;width:20%;width: 285px;margin-left:0px;height:calc(100vh);border-right:solid 0.05rem #ddd;}
.diy-section-side-nav .side-line{position: relative;padding-bottom:15px;border-bottom:1px solid #eee;}
.diy-section-side-nav dd{cursor: pointer; position:absolute;top:0px;right:5px;color:#545b64;}
.diy-section-side-nav .diy-side-flexible{overflow:hidden;min-height:100vh;min-width:100%;margin-left: 0px;}
.diy-side-navigation .side-arraw div{display:none;opacity:0;transition: opacity .2s ease-in-out;transition-delay: .1s;}

.diy-topic{height: calc((100vh - 0px) - 0px);overflow-y:auto;overflow-x:hidden;scroll-behavior: smooth;}
.diy-nav-resources-item a:hover{color:#b5b5b5;}

main a,main a:hover{ text-decoration:none;}

#container {margin: 0px auto;}
#container .top_banner{width:100%;height:480px;display: inline-block; background:url(/images/index/top_banner_1.jpg) no-repeat 0px 0px;background-position:top center;clear:none;}

/** service */
#container h1{word-spacing:5pt; letter-spacing:2pt;margin-left:30px;margin-top:15px;margin-bottom:15px;text-align:center;font-size:34px;color:#777;font-weight:normal;display: inline-block;display: block;}

#container .flow{text-align:top;float:left;color:#111111;width:100%;display:block;}
#container .flow ul{clear:none;float:left;letter-spacing:2px;font-size:16px;font-weight:normal;}
#container .flow img{}
#container .flow .flow-name{margin-top:10px;}
#container .flow-item{margin-top:25px;}

.wrapper p{ font-size:13px; }


.case-list {margin-left:20px;text-align: center;}
.case-list li{float:left;display:inline;margin-right: 2px;margin-bottom: 2px;}

#banner{ display: block; }  

#container .top_banner{width:100%;height:480px;display: inline-block; background:url(/images/index/top_banner_1.jpg) no-repeat 0px 0px;background-position:top center;clear:none;}

/*banner*/
#banner{width:100%;height:650px;background:#fff;overflow:hidden;position:relative;}
#banner_img{display:block;position:relative;}
#banner_img li{position:absolute;top:0;left:0;width:100%;height:650px;background-position:center;background-size:cover;display:none;}

#banner_img .ad_img{position:absolute;}
#banner_img .ad_txt{position:absolute;color:#fff;text-shadow:1px 1px rgba(51,51,51,0.3);}

/*width:506px;height:404px */
#banner_img .ad_txt h2{font:bold 36px/60px Microsoft YaHei;}
#banner_img .ad_txt a{display:block;width:100px;height:25px;line-height:25px;text-align:center;margin-top:10px;background:#fff;color:#232F3E;text-decoration:none;text-shadow:none;}
#banner_img .ad_txt a:hover{color:#ec7211;}
#banner_img .ad_txt p{line-height:25px;text-align: left;font-size:0.875rem;}
#banner_img .ad_txt p br{line-height:25px;}

#banner_ctr{position:absolute;width:960px;height:122px;margin-left:-480px;left:50%;bottom:40px;z-index:1;}

#banner_ctr li{display:block;float:left;width:115px;height:122px;cursor:pointer;}
#banner_ctr li.first-item{background:#fff;width:20px;-webkit-border-radius:20px 0 0 20px;-moz-border-radius:20px 0 0 20px;border-radius:20px 0 0 20px;cursor:default;}
#banner_ctr li.last-item{background:#fff;width:20px;-webkit-border-radius:0 20px 20px 0;-moz-border-radius:0 20px 20px 0;border-radius:0 20px 20px 0;cursor:default;}
#drag_ctr{position:absolute;top:-14px;left:24px;width:115px;height:156px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;bottom:170px;background: #232F3E;border: solid 0px #E76D0C;text-align: center;border-color: #e76d0c #e15500 #e15500;color: #fff;text-shadow: rgb(0 0 0 / 5%) 0 1px 0;background-color: #ec7211;background-image: linear-gradient(0deg,#f67c1b 0,#e15500);box-shadow: inset 0 1px 0 hsl(0deg 0% 100% / 20%);}
#drag_arrow{position:absolute;top:-14px;left:24px;width:115px;height:156px;background:#232F3E;border: solid 0px #E76D0C;text-align: center;border-color: #e76d0c #e15500 #e15500;color: #fff;text-shadow: rgb(0 0 0 / 5%) 0 1px 0;background-color: #ec7211;background-image: linear-gradient(180deg,#f67c1b 0,#e15500);box-shadow: inset 0 1px 0 hsl(0deg 0% 100% / 20%);border-radius: 5px;z-index:-1;}

/*
.case-list-miniapp {text-align: center;display: inline-block;width:100%;position:relative;text-align:center;margin-top:25px;float:center;white-space:nowrap;}

.app_system{ height:160px; color:#FFFFFF; cursor: pointer; }

.app_system p{ padding-top:65px;text-align:left;margin:0 auto;padding: 0 auto;text-align:center;vertical-align: middle; font-size:24px; }
.app_system dt{ display:none;padding-top: 12px;font-size:0.875rem; }

.case-list-miniapp li{float:left;margin: 0 auto;padding:0 auto; text-align: center;margin-bottom:15px;}  
*/
/** 业务场景 */
.app_scene{ height:110px; color:#444; }

.app_scene p{ padding-top:0px; letter-spacing: 0.1em;text-align:left;margin:0 auto;padding: 0 auto;text-align:center;vertical-align: middle; font-size:16px; }
.app_scene dt{ display:none;padding-top: 12px;font-size:12px; }    


/*.case-list li a:link,a:visited{color:#fff;text-decoration:none;}
.case-list li a:hover,a:active{color:#EEE;text-decoration:none;}
*/
.case-list li h3{font-size:14px;text-align:left;margin:15px 10px 10px 10px;color:#FFF;}

.case-list {margin-left:20px;text-align: left; }
.case-list li img{vertical-align:top;display:inline-block;width:243px;height:160px;position:relative;float:left;margin-right:3px;overflow:hidden;}
.case-list li{position:relative;float:left;margin-right:3px; margin-bottom:5px;width:243px;height:160px;overflow:hidden;} 

.case-list li div{top:0px;background: none repeat scroll 0 0 #212121;opacity: .95;position:absolute;width:243px;height:0px;text-align:center;color:#FFF;overflow:hidden;}
.case-list li p{margin:0px 10px 10px 10px; width:233px;line-height:18px;color:#999;text-align:left;text-indent:2em;font-size:13px; }
.case-list li a{margin:0 0 30px 130px;padding-left:0px;text-align: left; border-radius:2px;background-color: #B31100;padding:5px;}

/*.case-list li a:link,a:visited{color:#fff;text-decoration:none;}*/
/*.case-list li a:hover,a:active{color:#EEE;text-decoration:none;}*/
.case-list li h3{font-size:14px;text-align:left;margin:15px 10px 10px 10px;color:#FFF;}
.header-top-website-i{color:#232F3E;font-size:3.5rem;}
#banner_ctr ul{ min-width:1000px;height:122px;background-size: 965px 122px;font-size:0;line-height:0;position:relative; }
      .banner_ctr{border-radius:1.25px;color:#232F3E;background-color:rgba(255,255,255,0.95);border-radius: 20px;}
      .banner_ctr li{font-size:0.875rem;bottom:0px;}
      .item-active{ position:relative;top: -1080px;filter: drop-shadow(#fff 0px 1080px);fill:blue;
display: inline-block;
    font-family: bootstrap-icons !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    vertical-align: -0.125em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    z-index: 9999999;
      }
.index_item_selected{position:relative;top: -1080px;filter: drop-shadow(#ec7211 0px 1080px);}

a.diy-btn {
    white-space: nowrap;
    line-height: 60px;
    height: 50px;
    color: #333333;
    background-color: #fff;
    padding: 10px 20px 12px 20px;
    font-size: 1rem;
    border-radius: 50px;
}