@charset "utf-8";
/* CSS Document */
.intro_wrap {margin:0 auto;position:relative;overflow:hidden;}

.head_basic {width:540px;margin: 0 auto;text-align:center;padding-bottom:55px;}
.head_basic h2 {font-size:31px; letter-spacing:-1px; font-weight:unset; color:#444; margin-bottom:20px;}
.head_basic .line { width:30px; height:3px; background:#2aa8e7; margin:0 auto;}
.head_basic p {margin-top:20px; color:#444; letter-spacing:-0.5px; font-size:16px; margin-left:20px;}

.footer_intro {margin:140px 0 90px 0;background:#f7f7f7; height:445px; }
.footer_intro .img_aside {width:1200px; margin:0 auto;}
.footer_intro img {margin-top:-53px;}


.head_intro {background:url(/image/sub/intro/01.jpg);height: 545px;margin-bottom: 25px;padding: 63px;box-sizing: border-box;}
.head_intro h2 {margin-top:90px;font-size: 23px;font-weight: 400;margin-bottom: 20px;}
.head_intro h3 {font-size:19px;border-bottom:1px solid #111;display:inline-block;margin-bottom:10px;}

.head_intro p {font-size:16px;line-height:25px;}
.head_intro p:nth-of-type(1) {margin-top:25px;}
.head_intro p:nth-of-type(4) {margin-top:20px;} 
.head_intro p:nth-of-type(6) {margin-top:50px;} 
.head_intro p:nth-of-type(6) span {font-size:25px;margin-left:10px;}

.intro_wrap ul {overflow:hidden;}
.intro_wrap li {float:left;width:50%;text-align:center;height:50px;line-height:50px;font-size:15px;font-weight:bold;}

.cf_content h3 {color: #555;margin-bottom: 40px;font-size: 21px;margin-top:80px;}
.cf_content h3 span {font-size:15px;color:#b7b7b7;margin-left:30px;}
.cf_content h3 span.bg {background:url(/image/sub/product/cf.jpg) no-repeat;width:22px;height: 21px;margin:0;display:inline-block;margin-right: 10px;}

.content>img {width:100%;}

.img03 {text-align:center;background: #f7f7f7;}



.aboutCircle{width: 1200px;position:relative;margin:0 auto;height:  800px;}

.cirDiv{float:left;width: 300px;height: 300px;margin-left: -1px;z-index: 0;}
.cirDiv:first-child{margin-left:0}

.cirTop{width: 300px;height: 150px;overflow:hidden;}
.cirTopInner{-webkit-transform:rotateZ(180deg);transform:rotateZ(180deg);width: 300px;height: 300px;-webkit-transition:all .3s linear;transition:all .3s linear;}
.cirTopInner:after{content:"";display:block;border-radius: 300px 300px 0 0;width: 298px;height: 150px;border-top:1px solid #000;border-left:1px solid #000;border-right:1px solid #000;}

.cirBottom{width: 300px;height: 151px;overflow:hidden;}
.cirBottomInner{margin-top: -150px;-webkit-transform:rotateZ(180deg);transform:rotateZ(180deg);padding-top: 150px;width: 300px;height: 150px;-webkit-transition:all .3s linear;transition:all .3s linear;}
.cirBottomInner:after{content:"";display:block;border-radius: 0 0 300px 300px;width: 298px;height: 150px;border-bottom:1px solid #000;border-left:1px solid #000;border-right:1px solid #000;}


.clear-both{display:block;clear:both}

.on #circle1{-webkit-transform:rotateZ(0);transform:rotateZ(0);-webkit-transition-delay:1.5s;transition-delay:1.5s}
.on #circle2{-webkit-transform:rotateZ(0);transform:rotateZ(0);-webkit-transition-delay:.6s;transition-delay:.6s}
.on #circle3{-webkit-transform:rotateZ(360deg);transform:rotateZ(360deg);-webkit-transition-delay:.9s;transition-delay:.9s}
.on #circle4{-webkit-transform:rotateZ(360deg);transform:rotateZ(360deg);-webkit-transition-delay:1.2s;transition-delay:1.2s}

.on #circle5{-webkit-transform:rotateZ(360deg);transform:rotateZ(360deg);-webkit-transition-delay:1.2s;transition-delay:1.2s}
.on #circle6{-webkit-transform:rotateZ(360deg);transform:rotateZ(360deg);-webkit-transition-delay:.9s;transition-delay:.9s}
.on #circle7{-webkit-transform:rotateZ(0);transform:rotateZ(0);-webkit-transition-delay:.6s;transition-delay:.6s}
.on #circle8{-webkit-transform:rotateZ(0);transform:rotateZ(0);-webkit-transition-delay:1.5s;transition-delay:1.5s}

.circleUl{background:transparent}
.circleUl::after{content:"";display:block;clear:both}
.circleLi{display:block;margin-left: 0px !important;/* margin-right: 38px; */float: left !important;width: 300px !important;height: 300px !important;margin-left: -11px;}
.circleLi:first-child{margin-left:0}

.about-org-line-1{display:block;position:absolute;top: 148px;left:-50%;margin-left: -598.5px;height:1px;width:0;background: #000;-webkit-transition:all .6s ease-in-out;transition:all .6s ease-in-out;}
.about-org-line-2{display:block;position:absolute;top: 148px;right:-50%;margin-right: -596.5px;height:1px;width:0;background: #000;-webkit-transition:all .6s ease-in-out;transition:all .6s ease-in-out;}
.on>.about-org-line-1{width:100%}
.on>.about-org-line-2{width:100%}


.circleTit{line-height: 1.5em;opacity:0;letter-spacing:5px;z-index:  5555;position:  absolute;text-align:center;margin-top: -300px;color:  #000;width: 300px;/* margin-left: 30px !important; */height: 300px;line-height: 300px;font-size:26px;vertical-align:middle;background:transparent;-webkit-transition:all 1s;transition:all 1s;-webkit-transition-delay:.3s;transition-delay:.3s;}
.circleTiteng{width:200px;line-height: 27px;margin-top: -173px;margin-left: 49px;/* height:200px; */}
.on .circleTit{opacity:1;letter-spacing:0;-webkit-transition:all 1s;transition:all 1s;-webkit-transition-delay:.3s;transition-delay:.3s}
.circleCont{opacity:0;margin-left: 0px !important;-webkit-transform:translateY(-20px);transform:translateY(-20px);margin:40px 0 0 30px;color: #474747;line-height: 26px;font-weight:300;font-size: 15px;-webkit-transition:all 1s;transition:all 1s;-webkit-transition-delay:1.8s;transition-delay:1.8s;}
.on .circleCont{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}

.subTopTit{font-size: 54px;font-weight:bold;width: 425px;height: 230px;/* display:  inline-block; *//* float: left; */position:  relative;}
.subTopTit p{line-height: 62px;font-weight: 800;}
.subTopDiv{width:1200px;margin:0 auto;/* height: 856px; */display:  block;}

.subTopCont h4{margin-top: 117px;font-size: 26px;font-weight: bold;opacity:  0;letter-spacing: -1px;margin-bottom: 68px;transition: all 1.0s ease-out;}
.subTopCont{display:inline-block;height: 350px;float:  right;}
.subTopImg{
    margin-top:  20px;
    opacity:  0;
    transition: all 1.0s ease-out;
    z-index:  9;
}
.subTopCont p{line-height: 27px;font-size:16px;transition:  all 1.0s ease-out;opacity:0;letter-spacing: -1px;}
.subMdDiv{height:717px;display:  block;background:#1a2b57;}
.subMdDiv1200{width:1200px;margin:0 auto;padding-top: 287px;}
.subTopTit div{background:#f06508;color:#fff;width:154px;height:124px;padding-top:30px;position: absolute;bottom: -74px;left: 40px;transition:  all 1.0s ease-out;opacity:  0;z-index:  99;}
.subTopTit h5{margin-left:26px;font-weight: 600;line-height:25px;letter-spacing: -1px;}
.subTopTit img{position:absolute;bottom:33px;left:25px;}
.subMdDiv1 h3{font-size: 32px;color:#fff;font-weight:bold;letter-spacing:  -1px;margin-bottom: 98px;margin-top: 10px;opacity:  0;transition:  all 0.8s ease-out;}
.subMdDiv1 .engH3{width:60%;line-height: 40px;}
.subMdDiv1 p{color:#fff;line-height:30px;opacity:  0;letter-spacing:  -1px;transition:  all 0.8s ease-out;}
.subMdDiv1 {width: 746px;display:inline-block;float: left;}
.subMdDiv2{display:inline-block;margin-top:  30px;}
.subMdDiv2 p {color:#fff;text-align:center;margin-top:  23px;letter-spacing:  -1px;}
.subBtDiv {background-image:url("/image/sub/sub01_background.jpg");background-repeat:  no-repeat;height:  1124px;margin:  0 auto;text-align:  center;}
.subBtDiv h2{padding-top: 138px;margin-bottom: 28px;letter-spacing:  -1px;transition: all 0.8s ease-out;opacity:  0;}
.subBtDiv p{margin-bottom: 121px;letter-spacing:  -1px;opacity:  0;transition:  all 0.8s ease-out;}
.subBtDiv img{margin-bottom:81px;opacity:  0;transition:  all 0.8s ease-out;}
.aboutCircleDiv{position:relative;}

.hDiv1{display:inline-block;vertical-align: top;opacity: 0;transition: all 0.8s ease-out;margin-top:-30px;}

.sel1 .hDiv2{width: 435px;height: 534px;display:inline-block;padding-left:65px;position: relative;opacity: 0;}
.sel2 .hDiv2{width: 435px;height: 344px;display:inline-block;padding-left:65px;position: relative;opacity: 0;/* transition: opacity 0.8s ease-out; */}
.sel3 .hDiv2{width: 435px;height: 344px;display:inline-block;padding-left:65px;position: relative;}
.sel1 .hline2{position:absolute;width: 0%;height:15px;background:#f06508;top: 55px;left: -80px;opacity: 1;transition: all 0.8s ease;transition-delay: 0.6s;}
.sel1 .hline3{position:absolute;width:15px;height: 0%;background:#f06508;right: -40px;top: 55px;transition: all 0.6s ease;opacity: 1;transition-delay: 1.5s;}
.sel1 .hline4{position:absolute;width: 0px;height:15px;background:#f06508;bottom: 44px;right: -40px;transition: all 0.6s ease;transition-delay: 2.2s;opacity: 1;}
.sel1 .hline1{
    position: absolute;
    width: 15px;
    height: 0px;
    left: -80px;
    bottom: 344px;
    opacity: 1;
    background: #f06508;
    transition: all 0.6s ease;
}
.sel1 .hDiv2 h3{padding-top: 90px;font-size: 39px;margin-bottom: 26px;font-weight:bold;opacity: 0;transition: all 2.5s ease-out;transition-delay: 0.4s;}
.hDiv2 h3{padding-top:128px;font-size: 39px;margin-bottom: 26px;font-weight:bold;}
.sel3 .hDiv2 h3{padding-top: 40px;opacity: 0;transition: all 0.8s ease-out;transition-delay: 0.4s;}
.hDiv2 h4{font-size: 32px;margin-bottom: 25px;/* font-weight: 500; */opacity: 0;letter-spacing: -3px;transition: all 2.8s ease-out;transition-delay: 0.8s;}
.sel3 .hDiv2 h4{margin-bottom:85px;}
.hDiv2 h5{font-size: 17px;margin-bottom:9px;font-weight: 600;opacity: 0;letter-spacing: -1px;transition: all 3s ease-out;transition-delay: 1s;}
.hDiv2 .fiH5{margin-bottom: 95px;}
.sel2 .hDiv2 .fiH5{
    margin-bottom: 80px;
}
.hDiv2 p{color:#707070;font-size: 14px;letter-spacing: -1.2px;line-height: 26px;font-weight: 600;opacity: 0;transition: all 3s ease-out;transition-delay: 1s;}
.sel2{margin-top:88px;}
.sel2 .hDiv2 h3{padding-top: 20px;opacity: 0;transition: all 0.8s ease-out;transition-delay: 0.4s;}

.sel2 .hline1{
    height: 15px;
    width: 0px;
    position: absolute;
    left: 30px;
    background: #1a2b57;
    bottom: 15px;
    transition: all 0.6s ease;
    transition-delay: 2.2s;
}
.sel2 .hline2{
    position: absolute;
    width: 15px;
    height: 0px;
    top: 15px;
    left: 15px;
    background: #1a2b57;
    transition: all 0.6s ease;
    transition-delay: 1.5s;
}
.sel2 .hline3{
    position: absolute;
    height: 15px;
    width: 0px;
    top: 0px;
    right: -65px;
    background: #1a2b57;
    transition: all 0.6s ease;
    transition-delay: 0.6s;
}
.sel2 .hline4{
    position: absolute;
    width: 15px;
    height: 0px;
    opacity: 1;
    right: -80px;
    bottom: 214px;
    background: #1a2b57;
    transition: all 0.6s ease;
}

.sel3 .hline1{
    height: 15px;
    width: 0px;
    position: absolute;
    left: 30px;
    background: #f06508;
    bottom: 85px;
    transition: all 0.6s ease;
    transition-delay: 2.2s;
}
.sel3 .hline2{
    position: absolute;
    width: 15px;
    height: 0px;
    top: 45px;
    left: 15px;
    background: #f06508;
    transition: all 0.6s ease;
    transition-delay: 1.5s;
}
.sel3 .hline3{
    position: absolute;
    height: 15px;
    width: 0px;
    top: 30px;
    right: -65px;
    background: #f06508;
    transition: all 0.6s ease;
    transition-delay: 0.6s;
}
.sel3 .hline4{
    position: absolute;
    width: 15px;
    height: 0px;
    transition: all 0.6s ease;
    background: #f06508;
    right: -80px;
    bottom: 214px;
}

.sel3{margin-top:90px;margin-bottom: 70px;}

.oneline1{position:absolute;transform:translateX(-50%);width:1px;left: 50%;height: 0%;top: 300px;transition: all 0.8s ease-out;background: #cdcbcb;z-index:-1;}
.oneline2{position:absolute;transform:translateX(-50%);width:9px;left: 50%;border-radius: 9px;height:9px;top: 95%;background: #cdcbcb;}


@media screen and (max-width: 1200px){
.intro_wrap{margin-bottom:200px;}
}