.black_overlay { display: none; position: fixed; top: 0%; left: 0%; width: 100%; height: 100%; background-color: black; z-index:1001; -moz-opacity: 0.89; opacity:.80; filter: alpha(opacity=90); }

.white_content { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; min-height: 1380px; z-index:800; }
.white_content video{ position: fixed; width: 1260px; z-index:900; left: 50%; margin-left: -630px; top: 120px; }

a.main_pop_clo { color:#fff; top: 50px; position: fixed; z-index: 900; width:160px; height:54px; line-height:50px; border:1px solid #fff; text-align:center; left: 50%; margin-left:-80px; }
a.main_pop_clo span img { vertical-align: middle; height: 14px; margin: -3px 0 0 18px; }
a.main_pop_clo span { 
	position:absolute; top:50%; left:0; width:100%; height:100%; line-height:54px;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
a.main_pop_clo:before { 
	content: '';  position: absolute;  background: #01ae83;  border-color: #01ae83;  width: 0;  height: calc(100% + 2px);  left: -1px;  top: -1px;
	-webkit-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	-moz-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	-ms-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	-o-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
a.main_pop_clo:hover:before{ width: calc(100% + 2px); }

#scrollClick { margin: -40px 6px 20px 0px }

.quick_bottom_top { margin-top: 50px; margin-top: 30px; right: 8px; position: absolute; width: 23px; }
.headerContainer { border-bottom: 1px solid #e5e5e5; }

section	{ position:relative; display: block; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center;	}

.main section > div[class*="Wrap"]	{}
.main section > div[class*="Wrap"] > .title	{text-align:left; font-size:28px; line-height:1.6;font-weight:700; letter-spacing:1px; color:#00ad83;position:absolute; top:120px; left:50%; margin-left:-640px; z-index:2;}

.main section.start	{position:relative; padding:0 36px; background:#fff; overflow:hidden;}			
.main section.start .intro {position:relative; width:100%; height:100%; color:#00ad83; font-size:20px; line-height:1.75;}			
.main section.start .intro li	{position:absolute; top:0; left:0; width:100%; display: flex !important; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center;}

.main section.start .intro li[class*="intro02_"] p { height:420px; }
.main section.start .intro li[class*="intro02_"] p img { opacity:0; height:100%; }

.main section.start .intro .intro03 span { height:8vh; position:absolute; top:50%; left:50%; margin-left:-4vh; margin-top:-4vh; opacity:0; }
.main section.start .intro .intro03 span img { height:100%; }
.main section.start .intro .intro03 p { opacity:0; }

.main section.start .intro li[class*="intro04_"] p {height:413px;}
.main section.start .intro li[class*="intro04_"] img {opacity:0; height:100%;}
.main section.start .intro li.intro04 p	{opacity:0;}

.main section.start .intro .intro05 p { height:164px;}
.main section.start .intro .intro05 p img {opacity:0; height:100%;}

.main section.start .intro .bg {}
.main section.start .intro .bg .particle { background:#00ad83; border-radius:100%;	position:absolute; top:50%; left:50%; opacity:0.25; width:20px; height:20px; }

.main section.start .movie { position:absolute; bottom:6vh; right:50%; margin-right:-640px; }
.main section.start .movie a	{font-size:18px; background:#fff; border:1px solid #00ad83; width:143px; line-height:50px;color:#00ad83;}
.main section.start .movie a span	{vertical-align:middle; margin-top:-2px; margin-left:4px; display:inline-block; border:1px solid #00ad83; border-radius:2px; width:30px; height:22px;background:#fff url("../images/main/01_view.png") 50% 50% no-repeat; background-size:6px;}
.main section.start .movie a:hover span	{background:#00ad83 url("../images/main/01_view_on.png") 50% 50% no-repeat; background-size:6px;}

.main section.start .scroll	{ position:absolute; text-align:Center; bottom:6vh; color:#00ad83; font-size:18px;letter-spacing:6px;  left:0; width:100%; height:6vh; text-transform:uppercase; }
.main section.start .scroll ul { width:100%; height:100%; position:relative; }
.main section.start .scroll ul li { position:absolute;top:50%; left:0; width:100%;text-align:Center; opacity:0; }
.main section.start .scroll ul li:first-child { top:25% }
.main section.start .scroll ul li img { display:block; width:25px; margin:0 auto; }

/* Energy Technology & Service */
.main section.service {
	
	background: url('/images/main/02_bg01.jpg') no-repeat -9999px -9999px,
				url('/images/main/02_bg02.jpg') no-repeat -9999px -9999px,
				url('/images/main/02_bg03.jpg') no-repeat -9999px -9999px,
				url('/images/main/02_bg04.jpg') no-repeat -9999px -9999px,
				url('/images/main/02_bg05.jpg') no-repeat -9999px -9999px;
	background: url("/images/main/02_bg01.jpg") 50% 50% no-repeat; background-size:cover; color:#fff; position:relative; padding-top:200px;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;		
}

.main section.service.menu01 { background: url("/images/main/02_bg01.jpg"); }
.main section.service.menu02 { background: url("/images/main/02_bg02.jpg"); }
.main section.service.menu03 { background: url("/images/main/02_bg03.jpg"); }
.main section.service.menu04 { background: url("/images/main/02_bg04.jpg"); }
.main section.service.menu05 { background: url("/images/main/02_bg05.jpg"); }

.main section.service .serviceWrap .title { color:#fff; }
.main section.service .serviceWrap { display:block; width:1280px; margin:0 auto; }
.main section.service .serviceWrap .swiper-wrapper	{height:511px;}
.main section.service .serviceWrap .swiper-slide	{width:20%; float:left; }

.main section.service .serviceWrap .swiper-slide .wrap	{width:100%; margin:180px 0 40px;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;			
}
.main section.service .serviceWrap .swiper-slide:hover .wrap	{ margin:30px 0;}
.main section.service .serviceWrap .swiper-slide .wrap .img	{position:relative; width:100%; height:120px; text-align:center;
	-webkit-transition: background 0.5s ease-out;
	-moz-transition:background 0.5s ease-out;
	-o-transition: background 0.5s ease-out;
	transition: background 0.5s ease-out;			
}
.main section.service .serviceWrap .swiper-slide:hover .wrap .img	{height:190px; background:rgba(0,0,0,0.4); }
.main section.service .serviceWrap .swiper-slide .wrap .img img	{width:100%;bottom:0}
.main section.service .serviceWrap .swiper-slide .wrap .img p	{position:absolute; width:118px; height:95.03px; left:50%; bottom:12px; margin-left:-59px;
	display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center;		
}
.main section.service .serviceWrap .swiper-slide .wrap .img p:last-child	{height:0; overflow:hidden;
	-webkit-transition: height 1s ease-out;
	-moz-transition: height 1s ease-out;
	-o-transition: height 1s ease-out;
	transition: height 1s ease-out;		
}
.main section.service .serviceWrap .swiper-slide:hover .wrap .img p	{width:152px; height:122.41px; margin-left:-76px; bottom:33px;}
.main section.service .serviceWrap .swiper-slide .wrap .img p:last-child img	{position:absolute; left:0;}
.main section.service .serviceWrap .swiper-slide:hover .wrap .img p:last-child	{height:122.41px;}


.main section.service .serviceWrap .swiper-slide .wrap .text	{position:relative;  padding:28px 0 36px; margin-top:1px;
	-webkit-transition: background 0.5s ease-out;
	-moz-transition: background 0.5s ease-out;
	-o-transition: background 0.5s ease-out;
	transition: background 0.5s ease-out;			
}
.main section.service .serviceWrap .swiper-slide .wrap .text:before	{content:""; position:absolute; top:-1px; left:50%; margin-left:-9px; width:18px; height:1px; background:#fff;
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;			
}
.main section.service .serviceWrap .swiper-slide:hover .wrap .text	{background:rgba(0,0,0,0.4); padding-bottom:60px;}
.main section.service .serviceWrap .swiper-slide:hover .wrap .text:before	{left:0; margin-left:0; width:100%; opacity:0;}
.main section.service .serviceWrap .swiper-slide .wrap .text p	{font-size:18px;}
.main section.service .serviceWrap .swiper-slide .wrap .text dd	{font-size:15px; line-height:1.5; font-weight:300; margin:20px 0 24px;}
.main section.service .serviceWrap .swiper-slide .wrap .text span	{font-size:15px; line-height:1.5; font-weight:300; margin:20px 0 24px;}
.main section.service .serviceWrap .swiper-slide .wrap .text a	{display:none; position:relative; font-size:18px; text-align:center; width:145px; height:56px; border:1px solid #fff;}
.main section.service .serviceWrap .swiper-slide .wrap .text a:hover	{/*background:#01ad85; border-color:#01ad85;*/}
.main section.service .serviceWrap .swiper-slide:hover .wrap .text a	{display:inline-block; }
.main section.service .serviceWrap .swiper-slide .wrap .text a:hover	{color:#fff;}
.main section.service .serviceWrap .swiper-slide .wrap .text a span	{position:absolute; top:50%; left:0; width:100%; height:100%; line-height:54px; margin:0;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
.main section.service .serviceWrap .swiper-slide .wrap .text a:before	{content: '';  position: absolute;  background: #01ae83;  border-color: #01ae83;  width: 0;  height: calc(100% + 2px);  left: -1px;  top: -1px;
	-webkit-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	-moz-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	-ms-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	-o-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.main section.service .serviceWrap .swiper-slide .wrap .text a:hover:before{width: calc(100% + 2px);}
.main section.service .serviceWrap .swiper-slide:first-child .wrap span br:last-child	{display:none;}
.main section.service .serviceWrap .swiper-slide:nth-child(2) .wrap span br:last-child	{display:none;}
.main section.service .serviceWrap .swiper-slide:nth-child(3) .wrap span br:first-child	{display:none;}
.main section.service .serviceWrap .swiper-slide:nth-child(3) .wrap span br:last-child	{display:none;}
.main section.service .serviceWrap .swiper-slide:nth-child(4) .wrap span br:first-child	{display:none;}
.main section.service .serviceWrap .swiper-slide:last-child .wrap span br:last-child	{display:none;}


.main section.solution	{padding:0 36px;}
.main section.solution .solutionWrap {width:1280px; padding:90px 0; position:relative; margin:auto;}
.main section.solution .solutionWrap .title	{}
.main section.solution .solutionWrap .imgDeviceWrap	{}
.main section.solution .solutionWrap .imgDeviceWrap li {height:100%;}
.main section.solution .solutionWrap .imgDeviceWrap li img, 
.main section.solution .solutionWrap .imgDeviceWrap li div.jsgif {width:auto; height:100%; max-height:calc(100vh - 190px);}
.main section.solution .solutionWrap dl	{position:absolute; bottom:90px; left:50%; margin-left:-640px; text-align:left; line-height:1.8;}
.main section.solution .solutionWrap dt	{font-size:26px; font-weight:700;}
.main section.solution .solutionWrap dd	{font-size:20px; font-weight:300;}
.main section.solution .solutionWrap dd a { display:inline-block; position:relative; border:1px solid #000; text-align:center; width:145px; height:56px; font-size:18px; margin-top:34px; }
.main section.solution .solutionWrap dd a:hover	{color:#fff;}
.main section.solution .solutionWrap dd a span	{
	position:absolute; top:50%; left:0; width:100%; height:100%; line-height:54px;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
.main section.solution .solutionWrap dd a:before { 
	content: '';  position: absolute;  background: #01ae83;  border-color: #01ae83;  width: 0;  height: calc(100% + 2px);  left: -1px;  top: -1px;
	-webkit-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	-moz-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	-ms-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	-o-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.main section.solution .solutionWrap dd a:hover:before{width: calc(100% + 2px);}



.main section.news	{background:#eef9f5;}
.main section.news .newsWrap {display:block; width:100%; padding:190px 0;}
.main section.news .newsWrap .title	{}
.news .swiper-container {width:100%;  position:inherit;}
.news .swiper {width:calc(50% + 640px);  height: 100%;  padding-left:calc((100% - 1280px) / 2);}

.news .swiperBtn {position:absolute; top:117px; right:50%; margin-right:-640px; width:108px;}
.news .swiperBtn .swiper-button-next,	
.news .swiperBtn .swiper-button-prev {z-index:1; width:50px; height:50px; margin-top: 0; border:1px solid #bebebe;}
.news .swiperBtn .swiper-button-next {background:#fff url("../images/main/04_next.png") 50% 50% no-repeat; background-size:9px; right:0;}
.news .swiperBtn .swiper-button-prev {background:#fff url("../images/main/04_prev.png") 50% 50% no-repeat; background-size:9px; left:0;}
.news .swiperBtn .swiper-button-next:hover {border-color:#b6b6b6; background:#b6b6b6 url("../images/main/04_next_on.png") 50% 50% no-repeat;background-size:9px;}
.news .swiperBtn .swiper-button-prev:hover {border-color:#b6b6b6; background:#b6b6b6 url("../images/main/04_prev_on.png") 50% 50% no-repeat;background-size:9px;}
.news .swiperBtn .swiper-button-next:after,	
.news .swiperBtn  .swiper-button-prev:after	{ visibility: hidden; }

.news .swiper-slide {
	position:relative; opacity:0.3; height:505px; padding-bottom:70px; background-position:50% 0; background-repeat:no-repeat;
	-webkit-transition: opacity 0.3s ease-out;
	-moz-transition: opacity 0.3s ease-out;
	-o-transition: opacity 0.3s ease-out;
	transition: opacity 0.3s ease-out;		
}
.news .swiper-slide:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(/images/shadow.png) no-repeat center 44px/ contain;
	z-index: 1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.news .swiper-slide img	{width:100%;}
.news .swiper-slide .text	{text-align:left; position:absolute; box-sizing: border-box; width:calc(100% - 90px); top:280px; height:261px; left:0; padding:42px 30px; overflow:hidden; z-index:2;}
.news .swiper-slide .text p	{position:absolute; font-size:26px; color:#fff; font-weight:700; line-height:1.4; width:calc(100% - 60px); margin-top:75px; white-space:nowrap; text-overflow: ellipsis; overflow:hidden; 
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;	

}
.news .swiper-slide .text .content	{position: absolute;  font-size:22px; font-weight:300; line-height:1.8; overflow:hidden; width:calc(100% - 60px);	top:120px;    opacity: 0;    visibility: hidden; white-space:nowrap; text-overflow: ellipsis; overflow:hidden;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
	 -webkit-transition-delay: 0s;
	-moz-transition-delay: 0s;
	-ms-transition-delay: 0s;
	-o-transition-delay: 0s;
	transition-delay: 0s;

}

.news .swiper-slide .text:before {background: #fff;  width: 0;  content: '';  position: absolute;  top: 0;  left: 0;  bottom: 0;
	-webkit-transition: width 0.5s cubic-bezier(0.86, 0, 0.07, 1);
	-moz-transition: width 0.5s cubic-bezier(0.86, 0, 0.07, 1);
	-ms-transition: width 0.5s cubic-bezier(0.86, 0, 0.07, 1);
	-o-transition: width 0.5s cubic-bezier(0.86, 0, 0.07, 1);
	transition: width 0.5s cubic-bezier(0.86, 0, 0.07, 1);
}

.news .swiper-slide:hover .text:before {width: 100%;}


.news .swiper-slide:hover	{}
.news .swiper-slide:hover .text	{/*background:#fff; bottom:0;*//*width:calc(100% - 150px);*/}
.news .swiper-slide:hover .text p	{font-size:30px; color:#000; margin-top:0;}
.news .swiper-slide:hover .text .content	{opacity: 1;  visibility: visible; top:100px;
	-webkit-transition-delay: 0.3s;
	-moz-transition-delay: 0.3s;
	-ms-transition-delay: 0.3s;
	-o-transition-delay: 0.3s;
	transition-delay: 0.3s;	

}


.news .swiper-slide .text span:last-child	{height:13px; width:72px; text-align:right; overflow:hidden; position: absolute;  bottom:20px;  left: -72px; 
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;	
	 -webkit-transition-delay: 0s;
	-moz-transition-delay: 0s;
	-ms-transition-delay: 0s;
	-o-transition-delay: 0s;
	transition-delay: 0s;

}
.news .swiper-slide:hover .text span:last-child	{left:30px;
	-webkit-transition-delay: 0.3s;
	-moz-transition-delay: 0.3s;
	-ms-transition-delay: 0.3s;
	-o-transition-delay: 0.3s;
	transition-delay: 0.3s;		
}
.news .swiper-slide .text span:last-child img	{width:100%;}


.news .swiper-slide-active,.news  .swiper-slide-next	{opacity:1;}

.footerContainer { margin-top:0; }

/**
     * Dialog
     */
   .ds-dialog p {
    	font-size: 14px;
    	line-height: 1.2em;
    }

    .ds-dialog .ds-list-table {
    	margin: 8px 0;
    }

    .ds-dialog table.ds-list-table thead th,
    .ds-dialog table.ds-list-table tbody td {
    	font-size: 12px;
    	padding: 8px 4px;
    	line-height: 1.2em;
    }

    .ds-dialog ul li {
    	margin-bottom: 0.6em;
    }

    /**
     * Table related
     */
    .ds-list-table-area {
    	margin-top: 24px;
    }

    table.ds-list-table {
    	width: 100%;
    	text-align: center;
    	border-top: 2px solid #444;
    	border-bottom: 1px solid #444;
    }

    table.ds-list-table caption {
    	display: none;
    }

    table.ds-list-table thead {
    	background: #f0f0f0;
    }

    table.ds-list-table thead th {
    	font-size: 16px;
    	line-height: 24px;
    	font-weight: 700;
    	vertical-align: middle;
    	padding: 16px 12px;
    }

    table.ds-list-table tbody tr {
    	border-top: 1px solid #e1e1e1;
    }

    table.ds-list-table tbody td {
    	font-size: 16px;
    	line-height: 28px;
    	vertical-align: middle;
    	padding: 20px 12px;
    	color: #444;
    }

    table.ds-list-table tbody td:first-child {
    	padding-left: 24px;
    }

    table.ds-list-table tbody td:last-child {
    	padding-right: 24px;
    }

    table.ds-list-table tbody td.ds-list-title {
    	font-size: 18px;
    	text-align: left;
    }