/*body.main{overflow: hidden}*/
#contents{min-width:1280px;padding-top: 0;}

.section{position: relative;}
.section .section_title{display:inline-block;position:absolute;width:100%;text-align: center;z-index: 2}
.section .section_title h2{font-size: 18px;padding-bottom:14px;opacity: 0;}
.section .section_title p{font-size: 16px;color:#adadad;opacity: 0;}

.main .video_container{display:block;position:relative;/*height:100vh;*/min-height:600px;}
.main .video_container .video_wrap{position: absolute;top: 0;left: 0;bottom: 0;right: 0;width:100%;height:100%;}

.main .video_container .video_wrap{opacity: 0;z-index:0;position: absolute;top:0;right:0;bottom: 0;left:0;
    -webkit-transition:opacity 2s;-moz-transition:opacity 2s;-o-transition:opacity 2s;transition:opacity 2s;
}
.main .video_container .video_wrap.first{opacity: 1}

.main .video_container .video_wrap.motion{z-index: 1;
    /*-webkit-transition:all 14s cubic-bezier(0, 1, 0.34, 0.99), opacity 2s;
    -moz-transition:all 14s cubic-bezier(0, 1, 0.34, 0.99), opacity 2s;
    -o-transition:all 14s cubic-bezier(0, 1, 0.34, 0.99), opacity 2s;
    transition:all 14s cubic-bezier(0, 1, 0.34, 0.99), opacity 2s;*/
}
.main .video_container .video_wrap.on {opacity: 1;z-index: 2;}

/*.main .video_container .video_wrap:nth-child(1){z-index: 4;}
.main .video_container .video_wrap:nth-child(2){z-index: 3;}
.main .video_container .video_wrap:nth-child(3){z-index: 2;}
.main .video_container .video_wrap:nth-child(4){z-index: 1;}*/
.main .video_container .video_wrap .video_inner{position: absolute;top: 0;left: 0;width: 100%;height: 100%;overflow: hidden;}
.main .video_container .video_wrap .video_inner:before{content: '';z-index: 1;position: absolute;top:0;left:0;right:0;bottom:0;background:url(../images/rolling-b_poster.jpg) no-repeat center top;background-size: cover;}
.main .video_container .video_wrap:first-child .video_inner:before{background-image: url(../images/rolling-a_poster.jpg)}
.main .video_container .video_wrap3 .video_inner:before{background-image: url(../images/rolling-c_poster.jpg)}
.main .video_container .video_wrap .video_inner:after{content: '';position: absolute;top:0;left:0;right:0;bottom:0;background: rgba(0,0,0,0.1);z-index: 1;}
.video_inner img{height: 100%}
.main .video_container .video_wrap .video_inner video{position: absolute;top: 50%;left: 50%;width: auto;height: auto;max-height: none;max-width: none;min-height: 100%;min-width: 100%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}
.main .video_container .video_wrap .copy_container{position: absolute; z-index: 1;bottom: 15%;left: 0;right:0;width: 100%;text-align: left;color:#ffffff;margin:0 auto;max-width: 1280px;}
/*.main .video_container .video_wrap .copy_container{transition: all 1s cubic-bezier(.25,.1,.25,1)}*/
.main .video_container .video_wrap.on .video_inner:before{content: none;}
.main .video_container .video_wrap.on .copy_container{opacity: 1;}
.main .video_container .video_wrap .copy_container .sub_title{position: relative;font-size: 18px;opacity: 0;padding-bottom: 30px;  line-height: 21px;letter-spacing: 0.4px;}
.main .video_container .video_wrap .copy_container:after{content: '';position: absolute;right: 0;top:10px;left:345px;height: 1px;background: rgba(255,255,255,0.3);
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
.main .video_container .video_wrap:first-child .copy_container:after{left: 400px;opacity: 0;}
.main .video_container .video_wrap3 .copy_container:after{left: 305px;}
.main .video_container .video_wrap .copy_container h2{opacity: 0;position: relative;font-size: 66px;line-height: 70px;float:left;padding-right: 30px;margin-right: 30px;}
.main .video_container .video_wrap .copy_container h2:after{content: '';position: absolute;top:10px;right: 0; height: 45px;width: 1px;background: rgba(255,255,255,0.3)}
.main .video_container .video_wrap .copy_container h2 em{display: inline-block;opacity: 0;}
.main .video_container .video_wrap .copy_container p{float: left;font-size: 16px;line-height:28px;letter-spacing: -0.1px;opacity: 0;margin-top: 5px}
.main .video_container .video_wrap .copy_container .btn_round{position:absolute;right: 0;top: 50px;opacity: 0;}
.main .video_container .video_wrap .copy_container .btn_round a{display:inline-block;width:168px;height:55px;/*border:2px solid #ffffff;*/text-align: center;line-height:59px;font-size:18px;border-radius: 58px;
    background: #ef85b3;
    background-image: -webkit-linear-gradient(46deg, #026749, #026749);
    background-image: -moz-linear-gradient(46deg, #026749, #026749);
    background-image: -o-linear-gradient(46deg, #026749, #026749);
    background-image: linear-gradient(46deg, #026749, #026749);
}
.main .video_container .video_wrap .copy_container .btn_round a:hover{/*background-color: #ffffff;color:#333333;*/opacity: 0.7}
.main .video_container .video_wrap.on .copy_container .sub_title{opacity: 1;}
.main .video_container .video_wrap.on .copy_container h2{opacity: 1;}
.main .video_container .video_wrap.on .copy_container h2.on{opacity: 1}
.main .video_container .video_wrap.on .copy_container p{opacity: 1;}
.main .video_container .video_wrap.on .copy_container .btn_round{opacity: 1;}
.main .video_container .video_wrap .copy_container.on:after{opacity: 1;}
.main .video_step_wrap{display: block;position: absolute;bottom:0px;width:150px;z-index: 5;color:#ffffff;  max-width: 1280px;left: 0;right: 0; margin: 0 auto 20px;}
.main .video_step_wrap ul{width:150px;margin-right: 10px;float: right}
.main .video_step_wrap ul li{float:left;display: inline-block;width: 25px;text-align: center;opacity: 0;}

.main .video_step_wrap ul li a{position: relative;text-align: center;width:22px;height:22px;margin:0 auto;display: block}
.main .video_step_wrap ul li a .step_bg_num{  text-indent: -9999em; overflow: hidden; display:block;position:absolute;left:2px;top:2px;height:20px;width:20px;border-radius: 100px; -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;}
.main .video_step_wrap ul li a .step_bg_num:before{content:'';position:absolute;top:0px;left:0px;width:20px;height:20px;border-radius: 50%;
    background: #026749;
    background-image: -webkit-linear-gradient(46deg, #026749, #026749);
    background-image: -moz-linear-gradient(46deg, #026749, #026749);
    background-image: -o-linear-gradient(46deg, #026749, #026749);
    background-image: linear-gradient(46deg, #026749, #026749);
    transform: scale(0);
    -moz-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;}
.main .video_step_wrap ul li a .step_bg_num:after{content:'';position:absolute;top:0px;left:0px;width:20px;height:20px;border-radius: 50%;}
.main .video_step_wrap ul li a .step_bg_num1:after{background: url(../images/ico_step1.png) no-repeat center; }
.main .video_step_wrap ul li a .step_bg_num2:after{background: url(../images/ico_step2.png) no-repeat center;}
.main .video_step_wrap ul li a .step_bg_num3:after{background: url(../images/ico_step3.png) no-repeat center;}

.main .video_step_wrap ul li a .step_circle{display:block;position:absolute;width:22px;height:22px;border-radius: 50%;opacity: 1;}

.main .video_step_wrap ul li a .step_circle canvas{position:relative;z-index: 2;}

.main .video_step_wrap ul li.on a .step_bg_num:before
,.main .video_step_wrap ul li a:hover .step_bg_num:before{transform: scale(1)}
.main .video_step_wrap ul li.on a .step_bg_num{border-color: #88bb8a;background:#88bb8a }

.main .video_step_wrap ul li.on a .step_circle{opacity: 1;}



.main .scroll_arrow{position: absolute;bottom:45px;left:50%;width:33px;height:33px;z-index: 2}

.main .scroll_arrow .arrow{position:absolute;width:33px;height:33px;overflow: hidden}
.main .scroll_arrow .arrow_img{position:absolute;opacity: 0;width:33px;height: 16px;background: url("../images/scroll_arrow.png") no-repeat center top;}
.main .scroll_arrow .arrow_img:nth-child(1){
    -webkit-animation: arrow 1.4s 0s linear infinite ;
    -moz-animation: arrow 1.4s 0s linear infinite ;
    animation:  arrow 1.4s 0s linear infinite ;
}
.main .scroll_arrow .arrow_img:nth-child(2) {
    -webkit-animation: arrow 1.4s 0.7s linear infinite;
    -moz-animation: arrow 1.4s 0.7s linear infinite;
    animation: arrow 1.4s 0.7s linear infinite;
}
@-webkit-keyframes arrow {
    0% {-webkit-transform: translate(0px, 2px);opacity: 0;}
    50% {-webkit-transform: translate(0px, 11px);opacity: 1;}
    100% {-webkit-transform: translate(0px, 20px);opacity: 0;}
}
@-moz-keyframes arrow{
    0% {-moz-transform: translate(0px, 2px);opacity: 0;}
    50% {-moz-transform: translate(0px, 11px);opacity: 1;}
    100% {-moz-transform: translate(0px, 20px);opacity: 0;}
}
@keyframes arrow {
    0% {transform: translate(0px, 2px);opacity: 0;}
    50% {transform: translate(0px, 11px);opacity: 1;}
    100% {transform: translate(0px, 20px);opacity: 0;}
}

.maincopy{display:block;height:320px;font-size:22px;line-height: 45px;letter-spacing: -0.25px;text-align: center;}
.maincopy p{opacity: 0;}
.maincopy p:first-child{padding-top:125px;}

.section.others{position: relative; overflow: hidden;}
.section.others .bg{position: absolute;top:0;right:0;left:0;bottom:0;background: url(../images/other_bg.jpg) no-repeat center top;}
.section.others .section_area{position: relative;box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box}
.section.others .section_area .pattern{position: absolute;}
.section.others .section_area .pattern1_1{top:-25px;right: 0;}
.section.others .section_area .pattern1_2{top:370px;left: 50%;margin-left: -487px;}
.section.others .section_area .pattern2_1{top:400px;left: 50%;margin-left: 487px;}
.section.others .section_area .pattern2_2{top:690px;left: 0}
.section.others .section_area .pattern2_3{top:715px;left: 50%;margin-left: -210px;}
.section.others .section_area .pattern2_4{top:1215px;left: 50%;margin-left: 550px;}
.section.others .section_area .pattern2_5{top:1030px;left: 50%;margin-left: -580px;}
.section.others .section_area .pattern3_1{top:280px;left: 50%;margin-left: -810px;}
.section.others .section_area .section_inner{position: relative;max-width: 1280px;margin: 0 auto;}
.section.others .section_area .section_inner h4{ font-family:Microsoft YaHei; font-weight:bold;position: relative;padding: 40px 0 15px;font-size: 40px;color: #026749;line-height: 60px;}
.section.others .section_area .section_inner h4 span{position: absolute;display: block; top:0;left:2px;width: 50px;height: 5px;border-radius: 10px;background: #009966;
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;}
.section.others .section_area .section_inner h4 span:before{content: '';background: #026749;position: absolute;top:0;left:0;width: 5px;height: 5px;border-radius: 10px;}
.section.others .section_area .section_inner h4 span:after{content: '';background: #026749;position: absolute;top:0;right:0;width: 5px;height: 5px;border-radius: 10px;}
.section.others .section_area .section_inner p{font-size: 20px;line-height: 36px;}
.section.others .section_area .section_inner .title_wrap{opacity: 0;transform: translate(0,30px);-webkit-transform: translate(0,30px); transition: all 1s cubic-bezier(.25,.1,.25,1);-webkit-transition: all 1s cubic-bezier(.25,.1,.25,1)}
.section.others .section_area.now_area .section_inner .title_wrap{transform: translate(-30px,0);-webkit-transform: translate(-30px,0);}
.section.others .section_area .section_inner .title_wrap.on{opacity: 1;transform: translate(0,0px);-webkit-transform: translate(0,0px);padding-top: 70px;}
.section.others .section_area .section_inner .title_wrap .arrow_btn_area{overflow: hidden;  width: 64px;margin-top: 35px; display:none;}
.section.others .section_area .section_inner .title_wrap .arrow_btn_area a{position: relative;float: left;width: 30px;height: 30px;background: #fff;border: 1px solid #cdcdcd;}
.section.others .section_area .section_inner .title_wrap .arrow_btn_area a img.on{position: absolute;left:0;right:0; opacity: 0;visibility: hidden;}
.section.others .section_area .section_inner .title_wrap .arrow_btn_area a:hover{background: #026749;border-color: #026749}
.section.others .section_area .section_inner .title_wrap .arrow_btn_area a:hover img.on{visibility: visible;opacity: 1}
.section.others .section_area .section_inner .title_wrap .arrow_btn_area a.btn_right{border-left: 0px}
.section.others .section_area .section_inner .title_wrap .arrow_btn_area a.btn_left{border-right: 0px}
.section.others .section_area .section_inner .title_wrap .arrow_btn_area a.btn_right:before{content: '';position: absolute;top:5px;bottom:5px;width: 1px;background:#e6e6e6; }
.section.others .section_area .section_inner .title_wrap .arrow_btn_area a.btn_right:hover:before{content: none;}
.section.others .section_area .section_inner .title_wrap .arrow_btn_area a.btn_left:hover+.btn_right:before{content: none;}
.section.others .business_area .section_inner{height: 570px;padding-top: 60px;}
.section.others .business_area .section_inner .title_wrap{position: relative;top: 50px;float: left}
.section.others .business_area ul{float: right}
.section.others .business_area ul li{
	position: relative;
	float: left;
    transition-timing-function: cubic-bezier(.25,.1,.25,1);
    -webkit-transition-timing-function: cubic-bezier(.25,.1,.25,1);
    -moz-transition-timing-function: cubic-bezier(.25,.1,.25,1);
    -ms-transition-timing-function: cubic-bezier(.25,.1,.25,1);
    transition-duration: .3s;
    -webkit-transition-duration: .3s;
    -moz-transition-duration: .3s;
    -ms-transition-duration: .3s;
	border-right: 1px solid #fff;
}
.section.others .business_area ul li .overlay{position: absolute;left:0;top:0;right:0;bottom:0;width: 100%;height: 100%;background: #026749;visibility: hidden;opacity: 0; display: none;}

.section.others .business_area ul li a{/*opacity: 0;visibility: hidden; */}
.section.others .business_area ul li a .box{position: relative;display: block;width: 310px;height: 500px; overflow: hidden;
    -webkit-transition: transform .3s ease;
    -moz-transition: transform .3s ease;
    -ms-transition: transform .3s ease;
    transition: transform .3s ease;
}
.section.others .business_area ul li a .box:after{content: ''; position: absolute;top:0;right:0;bottom:0;left:0;background: rgba(0,0,0,0.4); -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;}
.section.others .business_area ul li a .text{
    position: absolute;
    left:0;
    right:0;
    bottom: 0;
    transition: transform .3s ease;
    -webkit-transition: transform .3s ease;
    -moz-transition: transform .3s ease;
    -ms-transition: transform .3s ease;
    height: 190px;
    overflow: hidden;
}
.section.others .business_area ul li a .box:before{content: ''; position: absolute;right:0;bottom:0;left:0;height: 277px;z-index:1;background:#026749;
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: transform .3s ease;
    -moz-transition: transform .3s ease;
    -ms-transition: -o-transform .3s ease;
    transition: transform .3s ease;}
.section.others .business_area ul li a .text .text_inner{
    position: relative;
    color: #fff;
    width: 240px;
    white-space: nowrap;
    margin: 0 auto;
    padding: 35px 0;
    transition: transform .3s ease;
    -webkit-transition: transform .3s ease;
    -moz-transition: transform .3s ease;
    -ms-transition: transform .3s ease;
    transform: none;
}
.section.others .business_area ul li a .text .text_inner .tit{font-size: 28px;line-height: 40px;letter-spacing: 1px;padding: 0 0 45px;font-weight: bold;}
.section.others .business_area ul li a .text .text_inner .tit .ico{display: block}
.section.others .business_area ul li a .text .text_inner .desc{font-size: 13px;line-height: 23px;white-space: nowrap;padding-bottom: 25px;border-bottom:1px solid rgba(255,255,255,0.3)}
.section.others .business_area ul li a .text .text_inner .more{position: relative; font-size: 17px;margin-top: 25px; padding-left: 40px;}
.section.others .business_area ul li a .text .text_inner .more span{  position: absolute;
    display: block;
    top: 7px;
    left: 0;
    width: 25px;
    height: 4px;
    border-radius: 8px;
    background: rgba(255,255,255,0.3);}
.section.others .business_area ul li a .text .text_inner .more span:before{content: '';background: #fff;position: absolute;top:0;left:0;width: 4px;height: 4px;border-radius: 8px;}
.section.others .business_area ul li a .text .text_inner .more span:after{content: '';background: #fff;position: absolute;top:0;right:0;width: 4px;height: 4px;border-radius: 8px;}

.section.others .business_area ul li a .text .tit >br.on{display: none;}

.section.others .business_area ul li a .img{  transition: transform .3s ease;
    -webkit-transition: transform .3s ease;
    -moz-transition: transform .3s ease;
    -ms-transition: transform .3s ease; position: absolute;top: 0;left: 0;right: 0;bottom: 0;width: 100%;height: 100%;-o-object-fit: cover;object-fit: cover;}
.section.others .business_area ul li:hover a .box{
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    -webkit-box-shadow: 1px 1px 35px 0 rgba(0,0,0,0.23);
    -moz-box-shadow: 1px 1px 35px 0 rgba(0,0,0,0.23);
    -ms-box-shadow: 1px 1px 35px 0 rgba(0,0,0,0.23);
    box-shadow: 1px 1px 35px 0 rgba(0,0,0,0.23);

}
.section.others .business_area ul li:hover{}
.section.others .business_area ul li:hover{
    z-index: 10;
}
.section.others .business_area ul li:hover a .box .img{
    -webkit-transform: translateY(-120px);
    -moz-transform: translateY(-120px);
    -ms-transform: translateY(-120px);
    -o-transform: translateY(-120px);
    transform: translateY(-120px);}
/*.section.others .business_area ul li:hover a .img{top:30px;}*/
.section.others .business_area ul li:hover a .text{  transform: translateY(45px);-webkit-transform: translateY(45px);height: 316px;}
.section.others .business_area ul li:hover a .box:before{
    -webkit-transform: scale(1.12);
    -moz-transform: scale(1.12);
    -ms-transform: scale(1.12);
    -o-transform: scale(1.12);
    transform: scale(1.12);
    /*transform: none;-webkit-transform: none;-moz-transform: none;-ms-transform: none;-o-transform: none;*/}
.section.others .business_area ul li:hover a .box:after{visibility: hidden;opacity: 0;}
.section.others .business_area ul li:hover a .text .text_inner{width: 240px;padding: 18px 0 }
.section.others .business_area ul li:hover a .text .tit{padding-bottom: 10px}
.section.others .business_area ul li:hover a .text .text_inner .tit .ico{display: none}
.section.others .infra_area .section_inner{height: 2084px;}
.section.others .infra_area ul{position: relative; width: 1200px;margin: 0 auto;}
.section.others .infra_area ul li{float: left;width: 100%;}

/*.section.others .infra_area ul li .text{transform: translate(0px,100px); }
.section.others .infra_area ul li.on .text{transform: translate(0px,0px);transition: all 1s cubic-bezier(.25,.1,.25,1);}
.section.others .infra_area ul li .img{transform: translate(0px,100px);}
.section.others .infra_area ul li.on .img{transform: translate(0px,0px);transition: all 1s cubic-bezier(.25,.1,.25,1);}*/

.section.others .infra_area ul li .text{float: left;padding: 125px 118px;}

.section.others .infra_area ul li .text h5{font-size: 28px;line-height: 31px;font-weight: normal}
.section.others .infra_area ul li .text .desc{font-size: 18px;line-height: 30px;padding: 25px 0}
.section.others .infra_area ul li .text .infra_icons{font-size: 14px;line-height: 20px; color: #666666;overflow: hidden}
.section.others .infra_area ul li .text .infra_icons .item{position: relative; float: left; width: 105px;text-align: center;padding: 0 20px;}
.section.others .infra_area ul li .text .infra_icons .item:before{content: '';position: absolute;top:22px;left:0;bottom:12px;width: 1px; background: #f5f5f5;}
.section.others .infra_area ul li .text .infra_icons .item:first-child{width: auto;padding-left: 0px;}
.section.others .infra_area ul li .text .infra_icons .item:first-child:before{content: none}
.section.others .infra_area ul li .text .infra_icons .item span{display: block;padding-top: 10px;}
.section.others .infra_area ul li .text a{position: relative; font-size: 18px;line-height: 55px; width: 180px;height: 55px;letter-spacing: 0.4px;text-align: center;margin-top: 45px;color: #fff;display: block; }
.section.others .infra_area ul li .text a .more_text{position: relative; opacity: 0;visibility: hidden;background:#009966; box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box}
.section.others .infra_area ul li .text a .more_text:before{content:'';-webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;}
.section.others .infra_area ul li .text a span.ico{  position: absolute;display: block;top: 25px;left: -14px;width: 28px;height: 5px;border-radius: 10px;background: #009966;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;}
.section.others .infra_area ul li .text a span.ico:before{content: '';background: #026749;position: absolute;top:0;left:0;width: 5px;height: 5px;border-radius: 10px;}
.section.others .infra_area ul li .text a span.ico:after{content: '';background: #026749;position: absolute;top:0;right:0;width: 5px;height: 5px;border-radius: 10px;}
.section.others .infra_area ul li .text a span.overlay{  position: absolute;left: 0;top: 0;right: 0;bottom: 0; width: 100%; height: 100%;  background: #74b0b6;
    -webkit-transform-origin: left top;
    -moz-transform-origin: left top;
    -ms-transform-origin: left top;
    -o-transform-origin: left top;
    transform-origin: left top;
    -webkit-transform: scale(.05,0);
    -moz-transform: scale(.05,0);
    -ms-transform: scale(.05,0);
    -o-transform: scale(.05,0);
    transform: scale(.05,0);
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -ms-animation-duration: 2s;
    -o-animation-duration: 2s;
    animation-duration: 2s;
    -ms-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-timing-function: cubic-bezier(.785,.135,.15,.86);
    animation-timing-function: cubic-bezier(.785,.135,.15,.86);
}
.section.others .infra_area ul li .text a:hover .more_text:before{padding: 0 0 0 35px}
.section.others .infra_area ul li .text a:hover span.ico{width: 80px;left: -40px;}
.section.others .infra_area ul li .img{position: relative; float: right;}
.section.others .infra_area ul li .img .overlay{position: absolute;left:0;top:0;right:0;bottom:0;width: 100%;height: 100%;background: #73c697;
    -webkit-transform-origin: left top;
    -moz-transform-origin: left top;
    -ms-transform-origin: left top;
    -o-transform-origin: left top;
    transform-origin: left top;
    -webkit-transform: scale(.05,0);
    -moz-transform: scale(.05,0);
    -ms-transform: scale(.05,0);
    -o-transform: scale(.05,0);
    transform: scale(.05,0);
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -ms-animation-duration: 2s;
    -o-animation-duration: 2s;
    animation-duration: 2s;
    -ms-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-timing-function: cubic-bezier(.785,.135,.15,.86);
    animation-timing-function: cubic-bezier(.785,.135,.15,.86);
}
.section.others .infra_area ul li .img .mask{ height: 580px;overflow: hidden; box-shadow: 0px 4px 18px 0 rgba(60,74,66,0.2)}
.section.others .infra_area ul li.infra_li2 .img{float: left}
.section.others .infra_area ul li.on .img .mask{opacity: 1;visibility: visible}
.section.others .infra_area ul li.on .text a .more_text{transition-delay: 0.5s;-webkit-transition-delay: 0.5s;opacity: 1;visibility: visible}

/*.section.others .infra_area ul li.on .text a span.overlay{animation-name: slide-bg-1;-webkit-animation-name: slide-bg-1;}
.section.others .infra_area ul li.on .img .overlay{animation-name: slide-bg-1;-webkit-animation-name: slide-bg-1;}*/
@keyframes slide-bg-1 {
    0% {
        display: none;
    }
    0% {
        display: block;
    }
    33.3% {
        -webkit-transform-origin: left top;
        -moz-transform-origin: left top;
        -ms-transform-origin: left top;
        -o-transform-origin: left top;
        transform-origin: left top;
        -webkit-transform: scale(.05, 1);
        -moz-transform: scale(.05, 1);
        -ms-transform: scale(.05, 1);
        -o-transform: scale(.05, 1);
        transform: scale(.05, 1)
    }
    66.6% {
        -webkit-transform-origin: left center;
        -moz-transform-origin: left center;
        -ms-transform-origin: left center;
        -o-transform-origin: left center;
        transform-origin: left center;
        -webkit-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }
    66.7% {
        -webkit-transform-origin: right center;
        -moz-transform-origin: right center;
        -ms-transform-origin: right center;
        -o-transform-origin: right center;
        transform-origin: right center;
        -webkit-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }
    100% {
        -webkit-transform-origin: right center;
        -moz-transform-origin: right center;
        -ms-transform-origin: right center;
        -o-transform-origin: right center;
        transform-origin: right center;
        -webkit-transform: scale(0, 1);
        -moz-transform: scale(0, 1);
        -ms-transform: scale(0, 1);
        -o-transform: scale(0, 1);
        transform: scale(0, 1)
    }
}
@-webkit-keyframes slide-bg-1 {
    0% {
        display: none;
    }
    0% {
        display: block;
    }
    33.3% {
        -webkit-transform-origin: left top;
        -moz-transform-origin: left top;
        -ms-transform-origin: left top;
        -o-transform-origin: left top;
        transform-origin: left top;
        -webkit-transform: scale(.05, 1);
        -moz-transform: scale(.05, 1);
        -ms-transform: scale(.05, 1);
        -o-transform: scale(.05, 1);
        transform: scale(.05, 1)
    }
    66.6% {
        -webkit-transform-origin: left center;
        -moz-transform-origin: left center;
        -ms-transform-origin: left center;
        -o-transform-origin: left center;
        transform-origin: left center;
        -webkit-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }
    66.7% {
        -webkit-transform-origin: right center;
        -moz-transform-origin: right center;
        -ms-transform-origin: right center;
        -o-transform-origin: right center;
        transform-origin: right center;
        -webkit-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }
    100% {
        -webkit-transform-origin: right center;
        -moz-transform-origin: right center;
        -ms-transform-origin: right center;
        -o-transform-origin: right center;
        transform-origin: right center;
        -webkit-transform: scale(0, 1);
        -moz-transform: scale(0, 1);
        -ms-transform: scale(0, 1);
        -o-transform: scale(0, 1);
        transform: scale(0, 1)
    }
}

@-webkit-keyframes slide-bg-2 {
    33.3% {
        -webkit-transform-origin: left top;
        -moz-transform-origin: left top;
        -ms-transform-origin: left top;
        -o-transform-origin: left top;
        transform-origin: left top;
        -webkit-transform: scale(.05, 1);
        -moz-transform: scale(.05, 1);
        -ms-transform: scale(.05, 1);
        -o-transform: scale(.05, 1);
        transform: scale(.05, 1)
    }
    66.6% {
        -webkit-transform-origin: left center;
        -moz-transform-origin: left center;
        -ms-transform-origin: left center;
        -o-transform-origin: left center;
        transform-origin: left center;
        -webkit-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }
    66.7% {
        -webkit-transform-origin: right center;
        -moz-transform-origin: right center;
        -ms-transform-origin: right center;
        -o-transform-origin: right center;
        transform-origin: right center;
        -webkit-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1)
    }
    100% {
        -webkit-transform-origin: right center;
        -moz-transform-origin: right center;
        -ms-transform-origin: right center;
        -o-transform-origin: right center;
        transform-origin: right center;
        -webkit-transform: scale(0, 1);
        -moz-transform: scale(0, 1);
        -ms-transform: scale(0, 1);
        -o-transform: scale(0, 1);
        transform: scale(0, 1)
    }
}
.section.others .inside_area #clipCircle circle{-webkit-transform-origin: center center;
    -moz-transform-origin: center center;
    -ms-transform-origin: center center;
    -o-transform-origin: center center;
    transform-origin: center center;}
.section.others .inside_area #clipCircle.on circle{ -webkit-transform: scale(0.66, 0.66);
    -moz-transform: scale(0.66, 0.66);
    -ms-transform: scale(0.66, 0.66);
    -o-transform: scale(0.66, 0.66);
    transform: scale(0.66, 0.66)}
.section.others .inside_area .section_inner{height: 738px;margin-top:30px;}
.section.others .inside_area .circle_area{position: absolute;left:0;top:0;right:0;bottom:0;}
.section.others .inside_area .circle_area svg{  display: block;margin: 0 auto;}
.section.others .inside_area .title_wrap.left{position: absolute;top:320px;left: 0;}
.section.others .inside_area .title_wrap.right{position: absolute;top:365px;right: 70px;}
.section.others .inside_area .title_wrap.right p:before{content: '“';margin-left: -8px;display: none;}
.section.others .inside_area .title_wrap.right .text_area{width: 260px; text-align: justify}
.section.others .inside_area .title_wrap.right .assignment{font-size: 14px;color: #026749;margin-top: 22px;}
.section.others .inside_area .title_wrap.right .thumb{position: relative;margin-top: 35px;margin-left: 5px; display:none;}
.section.others .inside_area .title_wrap.right .thumb ul{overflow: hidden}
.section.others .inside_area .title_wrap.right .thumb ul li{float: left;margin-right: 10px;}
.section.others .inside_area .title_wrap.right .thumb ul li a{position: relative;display: block;width: 7px;height: 7px;text-indent: -999em;overflow: hidden;border-radius: 100%;background: #b5b5b5;}

.section.others .inside_area .section_inner[data-num='0'] .title_wrap.right .thumb ul li.thumb1 a{background: #026749;}
.section.others .inside_area .section_inner[data-num='1'] .title_wrap.right .thumb ul li.thumb2 a{background: #026749;}
.section.others .inside_area .section_inner[data-num='2'] .title_wrap.right .thumb ul li.thumb3 a{background: #026749;}
.section.others .inside_area .section_inner[data-num='3'] .title_wrap.right .thumb ul li.thumb4 a{background: #026749;}

.section.others .inside_area .section_inner .title_wrap.right .text{display: none}
.section.others .inside_area .section_inner[data-num='0'] .title_wrap.right .text1{display: block}
.section.others .inside_area .section_inner[data-num='1'] .title_wrap.right .text2{display: block;}
.section.others .inside_area .section_inner[data-num='2'] .title_wrap.right .text3{display: block;}
.section.others .inside_area .section_inner[data-num='3'] .title_wrap.right .text4{display: block;}


.section.others .inside_area .circle_area .btn_play{position: absolute;top:50%;left:50%;width: 91px;height: 91px;margin: -46px 0 0 -46px;border-radius: 100%;transform: scale(0);-webkit-transform: scale(0)}
.section.others .inside_area .circle_area .btn_play a{visibility: hidden;opacity: 0;position: absolute;top:0;left:0;width: 91px;height: 91px;display: block;overflow: hidden;border-radius: 100%;background: #fff;}
.section.others .inside_area .circle_area .btn_play a:hover{transform: scale(1.22);-webkit-transform: scale(1.22)}
.section.others .inside_area .circle_area svg image{visibility: hidden;opacity: 0; -webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-ms-transition: all 0.2s ease-out;transition: all 0.2s ease-out;}

.section.others .inside_area .section_inner[data-num='0'] .circle_area svg image.inside_img1{visibility: visible;opacity: 1}
.section.others .inside_area .section_inner[data-num='1'] .circle_area svg image.inside_img2{visibility: visible;opacity: 1}
.section.others .inside_area .section_inner[data-num='2'] .circle_area svg image.inside_img3{visibility: visible;opacity: 1}
.section.others .inside_area .section_inner[data-num='3'] .circle_area svg image.inside_img4{visibility: visible;opacity: 1}

.section.others .inside_area .section_inner[data-num='0'] .circle_area .btn_play1{visibility: visible;opacity: 1}
.section.others .inside_area .section_inner[data-num='1'] .circle_area .btn_play2{visibility: visible;opacity: 1}
.section.others .inside_area .section_inner[data-num='2'] .circle_area .btn_play3{visibility: visible;opacity: 1}
.section.others .inside_area .section_inner[data-num='3'] .circle_area .btn_play4{visibility: visible;opacity: 1}

.section.others .now_area{background: #f2f2f2;padding: 80px 0}
.section.others .now_area .section_inner{overflow: hidden}
.section.others .now_area .section_inner .title_wrap{float: left}
.section.others .now_area .section_inner .slide_area{float: right;}
.section.others .now_area .section_inner .slide_area ul li{opacity: 0; transform: translate(30px,0);-webkit-transform: translate(30px,0); transition: all 0.5s cubic-bezier(.25,.1,.25,1);-webkit-transition: all 0.5s cubic-bezier(.25,.1,.25,1);}
.section.others .now_area .section_inner .slide_area.on ul li{ opacity: 1; transform: translate(0,0px);-webkit-transform: translate(0,0px);}
.section.others .now_area .section_inner .slide_area.on ul li:nth-child(1){transition-delay: 0.1s;-webkit-transition-delay: 0.1s;}
.section.others .now_area .section_inner .slide_area.on ul li:nth-child(2){transition-delay: 0.2s;-webkit-transition-delay: 0.2s;}
.section.others .now_area .section_inner .slide_area.on ul li:nth-child(3){transition-delay: 0.3s;-webkit-transition-delay: 0.3s;}
.section.others .now_area .section_inner .slide_area .slide_inner{width: 978px;overflow: hidden}
.section.others .now_area .section_inner .slide_area .slide_inner ul{width: 310%;overflow: hidden}
.section.others .now_area .section_inner .slide_area .slide_inner ul li{position: relative; float: left;margin:0 13px;box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box}
.section.others .now_area .section_inner .slide_area .slide_inner ul li a{display: block;width: 300px;height: 300px;color: #fff; -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box}
.section.others .now_area .section_inner .slide_area .slide_inner ul li a:before{content: '';position: absolute;top:0;right:0;bottom:0;left:0;background: rgba(0,0,0,0.5);opacity: 0;visibility: hidden; -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;}
.section.others .now_area .section_inner .slide_area .slide_inner ul li a .text_area{position: absolute;top: 225px;right: 0px;bottom: 0px;left: 0px;background-color:rgba(0,0,0,0.5); padding: 20px;}
.section.others .now_area .section_inner .slide_area .slide_inner ul li a .text_area .sns_ico{float:right; display:none;}
.section.others .now_area .section_inner .slide_area .slide_inner ul li a .text_area .now_tit{position: absolute;bottom:35px;font-size: 18px;line-height: 21px;-webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;}
.section.others .now_area .section_inner .slide_area .slide_inner ul li a .text_area .now_date{position: absolute;bottom:0;font-size: 12px;line-height: 15px;bottom: 15px;}
.section.others .now_area .section_inner .slide_area .slide_inner ul li.article a{border: 1px solid #dedede;background: #fff;color: #333;}
.section.others .now_area .section_inner .slide_area .slide_inner ul li.article a .text_area .now_desc{font-size: 14px;line-height: 24px;  height: 164px; /* word-break: keep-all;*/
    overflow: hidden;text-overflow: ellipsis;display: block;-webkit-line-clamp: 7;-webkit-box-orient: vertical;word-wrap: break-word;}
.section.others .now_area .section_inner .slide_area .slide_inner ul li.article a:before{content: none;}
.section.others .now_area .section_inner .slide_area .slide_inner ul li a:hover{border-color: #026749}
.section.others .now_area .section_inner .slide_area .slide_inner ul li a:hover .now_tit{color: #fff;}
.section.others .now_area .section_inner .slide_area .slide_inner ul li a:hover:before{opacity: 1;visibility: visible}
.section.others .now_area .section_inner .slide_area .carousel ul{font-size: 0;letter-spacing: 0;word-spacing: 0;text-align: center;margin-top: 30px}
.section.others .now_area .section_inner .slide_area .carousel ul li{width: 7px;height: 7px;background: #b5b5b5;display: inline-block;vertical-align: top;margin: 0 5px;border-radius: 100%;}
.section.others .now_area .section_inner .slide_area .carousel ul li.on{background: #026749;}
.section.others .now_area .section_inner .slide_area .carousel ul li a{display: block;width: 7px;height: 7px;}
.section.others .now_area .section_inner[data-num='0'] .slide_area .carousel ul li.carousel1{background: #026749;}
.section.others .now_area .section_inner[data-num='1'] .slide_area .carousel ul li.carousel2{background: #026749;}
.section.others .now_area .section_inner[data-num='2'] .slide_area .carousel ul li.carousel3{background: #026749;}
.wave{position: absolute;top:0;left:0;}
.wave .curve{position: absolute;top:0;left:0;display: block}
.wave .curve img{max-width: none;width: 2000px;}
.waves{position: absolute;top:0;left:50%;right: 0;margin-left: -1000px}
#wave1{position: absolute;top:280px;height:400px;}
#wave2{position: absolute;top:1170px;height:400px;}
#wave3{position: absolute;top:2500px;height:400px;}
#wave4{position: absolute;top:3300px;height:400px;}


.dimmed{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: #fff;z-index: 999;}
.dimmed.on{opacity: 0;visibility: hidden;}


/*Main Layer Popup 2018-01-25*/
.layerPopup {position: absolute; top: 70px;  left: 50%;margin-left: 166px; border: 1px solid #73c697; z-index: 998;display: none !important;}
.layerPopup .layerPopInner{float: right}
.layerPopup img {width: auto; max-width: inherit;}
.layerPopup .layerToday {padding: 5px 10px; background-color: #FFF; font-size: 14px; border-top: 1px solid #ebebeb; overflow: hidden;}
.layerPopup .layerToday input[type="checkbox"] { margin-right: 3px; -webkit-appearance: checkbox;}
.layerPopup .layerToday label {display: inline-block; vertical-align: middle;}
.layerPopup .layerToday a {float: right; display: inline-block;}
.layerPopup .layerToday a:before {content: 'X ';}

.hidden {position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; border: 0; clip: rect(0 0 0 0);}
.e_pagebox-000 a{
	display: none;
}