.cf:after{display:block; content:"";clear:both}

.hide{
	position: absolute;
	visibility: hidden;
	left: 0;top: 0;width: 0;height: 0;line-height: 0;
	text-indent: -9999em;
	font-size: 0;
}

.message{width: 100%;background-color: #dc3228;text-align: center;position: fixed;color:#dcdcdc;
      top: 0;z-index: 9999;padding-top: 40px;padding-bottom: 40px;box-sizing:border-box}




#mainVisual{
	margin-top: 60px;
	    clear: both;
}

#mainVisual .span12{
	height:420px;
	overflow:hidden;

	position: relative;
}

@media (max-width:1200px){
	#mainVisual .span12{
		height:320px;
	}
}

@media (max-width:979px){
	#mainVisual .span12{
		height:280px;

	}
}

#mainVisual .span12 ul{
	margin:0;
	width:100%;
	height:100%;
	position:relative;
}

#mainVisual .span12 ul li{
	width:100%;
	height:420px;
	flo at:left;
	dis play: none;
	position:absolute;
	left: -100%;
	background:url(../images/main2.png) 50% 50% no-repeat;
	background-size:cover;
}
#mainVisual .span12 ul li:nth-child(1){
	left: 0;
}

#mainVisual .span12 ul li:nth-child(2){
	background-image: url(../images/main1.png);
}

#mainVisual .span12 ul li:nth-child(3){
	background-image: url(../images/main4.png);
}
#mainVisual .span12 ul li:nth-child(4){
	background-image: url(../images/main3.png);
}
#mainVisual .span12 ul li:nth-child(5){
	background-image: url(../images/main5.png);
}

@media (max-width:1200px){
	#mainVisual .span12 ul li{
		height:320px;
	}
}

@media (max-width:979px){
	#mainVisual .span12 ul li{
		height:280px;

	}
}




#mainVisual .span12 dl {position: absolute;bottom: 20px;left: 50%;margin-left: -62.5px;margin-bottom: 0;}
#mainVisual .span12 dl dd{float: left;margin-left: 5px;margin-right: 5px;width: 12px;height: 12px;background-color: rgba(0,0,0,0.2);border-radius:50%;cursor:pointer;}
#mainVisual .span12 dl dd.banner-on{background-color: rgba(122,225,216,0.8);}

#main section .container h2{
	margin-bottom:40px;
	margin-top:0;
	color:#626161;
}

#main section .container h2 .bar{
	display:inline-block;
	width:5px;
	height:28px;
	margin-right:13px;
	background:#ccc;
	transform: translateY(2px);
	-webkit-transform: translateY(2px);
	-moz-transform: translateY(2px);
	-ms-transform: translateY(2px);
	-o-transform: translateY(2px);
}

#main section .container h2 .color{
	color:#ccc;
}

#main section .container p{
	font-size:17px;
	font-weight:400;
	line-height:1.5;
}

@media (max-width:767px){
	#main section .container h2{
		padding-left:20px;
		box-sizing:border-box;
	}
	#main section.first .container h2{
		padding-left:0px;
	}

}

#main .sec{
	padding:100px 0;
}

#main .first{
	background-color:#f2f2f2;
	background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 47%, rgba(255, 255, 255, 0.7) 48%, rgba(255, 255, 255, 0.7) 52%, rgba(255, 255, 255, 0) 53%, rgba(255, 255, 255, 0) 100%);
	background-size: 6px 6px;
	background-repeat: repeat;
}

#main .first p{text-align: center;width: 90%;margin: auto;margin-bottom: 20px;}

#main .first p.kor{font-size:15px }

#main .second{background-color: #f7f6f2;}

#main .second article{float: left;width: 18%;disp lay: table;position: relative;border: 1px solid #dcdcdc;box-shadow:0px 5px 10px #dcdcdc;cursor:pointer;}
#main .second article .mask{width: 100%;height: 300px;overflow: hidden;}
#main .second article .mask img{width: auto;height: 100%;max-width: none;}
#main .second article p{color:#333 !important;text-align: center;width: 100%;font-size: 20px;pa dding: 20px 10px;background-color: rgba(255,255,255,0.5);box-sizing: border-box;height: 100px;display: flex; justify-content: center; align-items: center;margin-bottom: 0;}
#main .second article:first-child{backgr ound: url(../images/business/b1.png) 0 0 no-repeat;}
#main .second article:nth-child(2){back ground: url(../images/business/b5.png) 0 0 no-repeat;margin-left: 2%;}
#main .second article:nth-child(3){backg round: url(../images/business/b5.png) 0 0 no-repeat;margin-left: 2%;margin-right: 2%;}
#main .second article:nth-child(4){backgr ound: url(../images/business/b5.png) 0 0 no-repeat;margin-right: 2%;}
#main .second article:last-child{backgro und: url(../images/business/b3.png) 0 0 no-repeat;}
#main .second .go-busi{margin: auto;margin-top: 50px;width: 300px;height: 50px;display: block;}
#main .second .go-busi a{display: block;width: 100%;height: 100%;backgr ound-color: #bcbcbc;color:#333;text-align: center;line-height:50px;font-size: 18px;}

#main .third{background-color: #fff;}
#main .sec .container p.title-ex{margin: 0;text-align: center;font-size: 17spx;color:#333;margin-bottom: 50px;}
#main .third .container h2{margin-bottom: 30px;}
#main .third .wrap-box{position: relative;}
#main .third .btn-box{padding- top: 20px;text-align: center;}
#main .third .btn-box > a{display: inline-block;width: 12px;height: 12px;box-sizing:border-box;background-color: #dcdcdc;margin-left: 5px;margin-right: 5px;border-radius: 50%}
#main .third .btn-box a.on{background-color: #261c21;}
#main .third .btn-box a.port-btn1{}
#main .third .btn-box a.port-btn2{}
#main .third .btn-box a.port-btn3{}
#main .third .btn-box a.port-btn4{}
#main .third .bg-box{width: 100%;height: 350px;margin-bottom: 50px;background-color: #2c2c2c;padding: 35px 55px; box-sizing:border-box}
#main .third .bg-box button{font-family:'Lato';}
#main .third .bg-box div{display: none;}
#main .third .bg-box div.active{
	display: block;
	width: 100%;
	height: 100%;

	-webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
#main .third .bg-box div .exp{display: inherit; display: relative; padding: 15px 0 0;box-sizing:border-box;height: 100%;position: relative;}
#main .third .bg-box div .img{display: inherit;height: 100%;wid th:auto;float: right;position: relative;}
#main .third .bg-box div .img img{height: 100%;positi on: absolute;right: 0;float: right;}
#main .third .bg-box div h3{margin: 0;color:#dcdcdc}
#main .third .bg-box div p{white-space: pre-line; margin: 30px 0;color:#b3b3b3}
#main .third .bg-box div span{}
#main .third .bg-box div button {
	padd ing: 3px 15px;
	font-size: 14px;
	color: white;
	background: #2c2c2c;
	border: 0;
	transition: 0.3s;

	-moz-transition: background 0.3s;
	-o-transition: background 0.3s;
	position: absolute;bottom: 0;
}
#main .third .bg-box div button:hover{backg round: #7c7c7c;color:cyan}


@media (max-width:979px){
	#mainVisual{margin-top: 0px;}
	#main .sec{
		padding:50px 0 50px 0;
	}
	#main .second .wrap{tex t-align: center;}
	#main .second .wrap article{width: 70%;margin: auto;float: none; margin-bottom: 20px;}
	#main .second article p{margin-bottom: 10px;}
#main .second article .mask{width: 100%;height: auto;overflow: hidden;/*display: none;*/}
	#main .second article .mask img{width: 100%;height: auto;transform: translateX(0)}

	#main .third .bg-box{wid th: 92%;padding: 30px;}
	#main .third .bg-box div.active{padd ing: 35px;}
	#main .third .bg-box div .img{mar gin-top: 70px;}
	#main .third .bg-box div .exp{padding: 0;}

	.noShow{display: none;}
	.Show{display: block !important;}
}

.Show{display: none;}

@media (max-width:1200px){

	#main .third .bg-box .row-fluid .span7{width: 55%;}
}

@media (max-width:767px){
	#main .sec{
		padding:50px 0 50px 0;
	}

	#main .first .container{
		padding:0 20px;
	}
	#main .second article{width: 100%;hei ght: 200px;}
	#main .second article .cover{height: 200px;line-height: 200px;}
	#main .third .bg-box{height: auto;width: 90%;position:inherit;margin: auto;left: 0;margin-bottom: 20px;}
	#main .third .bg-box div .img{mar gin-top: 20px;margin-bottom: 15px;width: 100%;}

	#main .third .bg-box div .exp{/*transform:translateY(250px)*/}
	#main .third .bg-box div.active{paddi ng: 35px }
	#main section .container h2{margin-bottom: 40px;}
	#main section.third .container h2{marg in-bottom: 90px;}
	#main .third .bg-box div .exp{padding: 0;}
	#main .third .bg-box div .img img{width: 100%;}
	#main .third .bg-box .row-fluid .span7{width: 100%;}
	#main .sec .container p.title-ex{width: 90%;margin: auto;margin-bottom: 50px;}
}

/*@media (max-width:570px){

	#main .third .bg-box{width: 84%;}

}
*/
@media (max-width:440px){

	#main .second .go-busi{width: 70%;}

}