@charset "utf-8";
.blue {color:#1a7fc3;vertical-align: top;}
.red {color:#ed1c2a;vertical-align: top;}

/* mainVisual */
#mainVisual {width:100%;position: relative;/* height:1100px; */}
#mainVisual .mask {overflow: hidden;}
#mainVisual .mask li {/* height:1100px; */overflow: hidden;position:relative;background-size:cover;background-position:50% 50%;}
#mainVisual .mask li img {position:absolute;top:0;left:50%;margin-left:-960px;height:100%;max-width:max-content;}
#mainVisual .mask li > span {display:block;width:100%;position:absolute;top:0;left:0;text-align: center;padding-top:75px;background-repeat:no-repeat;background-size:cover;background-position:50% 50%;}
#mainVisual .mask li .auto {padding-top:120px;}
#mainVisual .mask li .auto .txtBox {text-align:center;}
#mainVisual .mask li .auto .txtBox .txt01 {font-size:50px;color:#07b6a7;letter-spacing: 0.8em; margin-left: 35px;font-weight: 500;}
#mainVisual .mask li .auto .txtBox .txt02 {font-size:70px;color:#333;font-weight:700; margin-bottom: 15px; margin-top: -20px;}
#mainVisual .mask li .auto .txtBox .txt03 {font-size:25px;color:#333;font-weight:300;}
#mainVisual .btnPrev {position: absolute;left:0; top:50%;margin-top:-50px;z-index: 2;}
#mainVisual .btnNext {position: absolute;right:0; top:50%;margin-top:-50px;z-index: 2;}
#mainVisual .txtBox {position:absolute;top:370px;left:0;width:100%;text-align:center;z-index:1;color:#fff;}
#mainVisual .txtBox .main br {display:none;}
#mainVisual p.main {font-size:4rem;line-height:80px;position:relative;margin-bottom:20px;font-family: 'Lato';font-weight:bold;}
#mainVisual p.sub {font-size:22px;position:relative;letter-spacing:-0.1rem;line-height:1.8;font-weight:300;}
#mainVisual .scroll {position:absolute;bottom:40px;left:50%;margin-left:-25px;z-index:1;}
#mainVisual .video {position: relative;}
#mainVisual .video:before {content: "";display: block;padding-top: 56.6%;position: relative;}
#mainVisual .video iframe {position: absolute;left:0; top:0; right:0; bottom:0;width: 100% !important;height: 100% !important;}
#mainVisual .cover {position:absolute;top:0;left:0;width:100%;height:100%;z-index:55;}
#mainVisual .iconScroll {position:absolute;bottom:0;padding-bottom:200px;left:50%;margin-left:-77px;}


#mainVisual_mobile {height:100%;display:none;position:relative;}
#mainVisual_mobile .mask {overflow:hidden;height:100%;}
#mainVisual_mobile .mask li {height:100%;background-position:50% 0;background-repeat:no-repeat;background-size:cover;}
#mainVisual_mobile .mask .visual01 {background-image:url("../images/main/mainVisual_m01.jpg");}
#mainVisual_mobile .mask .visual02 {background-image:url("../images/main/mainVisual_m02.jpg");}
#mainVisual_mobile .mask .visual03 {background-image:url("../images/main/mainVisual_m03.jpg");}
#mainVisual_mobile .mask .table {display:table;width:100%;height:100%;}
#mainVisual_mobile .mask .tableCell {display:table-cell;vertical-align:middle;text-align:center;color:#fff;padding-bottom:100px;}
#mainVisual_mobile .mask .kor {opacity:0;font-size: 25px;}
#mainVisual_mobile .mask .eng {opacity:0;font-size: 20px;font-weight:  300;}
#mainVisual_mobile .iconScroll {position:absolute;bottom:0;padding-bottom:100px;left:50%;margin-left:-20px;z-index:9;width:40px;}

#mainContents {position:relative;}

#mainContents h2.title {font-size:2.5rem;color:#404040;font-weight:700;text-align:center;line-height:1;margin-bottom:40px;}
#mainContents > div {padding:120px 0;}

#mainContents .main_solution ul {margin:-10px;}
#mainContents .main_solution ul li {float:left;width:33.33%;padding:10px;height:430px;}
#mainContents .main_solution ul li a {display:block;position:relative;background-repeat:no-repeat;background-position:50% 50%;height:100%;}
#mainContents .main_solution ul li.sol01 a {background-image:url("../images/main/main_solution_img01.jpg");}
#mainContents .main_solution ul li.sol02 a {background-image:url("../images/main/main_solution_img02.jpg");}
#mainContents .main_solution ul li.sol03 a {background-image:url("../images/main/main_solution_img03.jpg");}
#mainContents .main_solution ul li img {width:100%;}
#mainContents .main_solution ul li p {position:absolute;left:0;bottom:0;width:100%;line-height:90px;text-align:center;font-size:25px;color:#fff;background:rgba(0,0,0,0.5);}
#mainContents .main_solution ul li .bg {position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);}
#mainContents .main_solution ul li.on .bg {opacity:0;transition:0.3s;}
#mainContents .main_solution ul li.on p {background:#005d4c;}

#mainContents .main_portfolio ul li {float:left;width:33.33%;padding:10px;position:relative;transition:0.2s all ease-out;top:0;}
#mainContents .main_portfolio ul li a {display:block;-webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.3);position:relative;
-moz-box-shadow:    4px 4px 5px 0px rgba(50, 50, 50, 0.3);
box-shadow:         4px 4px 5px 0px rgba(50, 50, 50, 0.3);
}
#mainContents .main_portfolio {background:#f3f3f3;}
#mainContents .main_portfolio ul li a .img {display:block;overflow:hidden;}
#mainContents .main_portfolio ul li a p {height:68px;line-height:68px;font-size:20px;color:#000;padding:0 20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:#fff;}
#mainContents .main_portfolio ul li a p span {color:#007d66}
#mainContents .main_portfolio ul li a .bd {position:absolute;top:0;left:0;width:100%;height:100%;border:2px solid #005d4c;display:none;}
#mainContents .main_portfolio ul li:hover {top:-10px;}
/* #mainContents .main_portfolio ul li:hover img {transform:scale(1.1);transition:0.2s all ease-out;} */
#mainContents .main_portfolio ul li:hover a .bd {display:block;}
#mainContents .main_portfolio .btnAdd {display:block;width:90px;margin:50px auto 0 auto;width:90px;height:90px;background:#222;transition:0.3s;text-align:center;}
#mainContents .main_portfolio .btnAdd:hover {background:#534741;} 
#mainContents .main_portfolio .btnAdd img {margin-top:25px;}
#mainContents .main_portfolio #pageBox {width:50px;float:right; font-size: 20px; margin-right: 10px;}

#mainContents .main_intro {height:445px;background:url("../images/main/main_intro_bg.jpg") no-repeat 50% 50%;background-size:cover;color:#fff;text-align:center;}
#mainContents .main_intro dt {font-size:50px;line-height:1;}
#mainContents .main_intro dd {font-size:20px;margin-top:10px;}
#mainContents .main_intro a {display:inline-block;width:265px;height:55px;line-height:55px;border:1px solid #fff;border-radius:30px;font-size:20px;font-weight:700;margin-top:30px;}
#mainContents .main_intro a:hover {transition:0.2s all ease-out;background:#fff;color:#005d4c;}


#mainContents .main_location {padding:0;position:relative;}
#mainContents .main_location .txtBox {z-index: 8;height: 100%;position: absolute;width: 100%;top:0;left:0;}
#mainContents .main_location .txtBox .auto {height:100%;}
#mainContents .main_location .txtBox .bg {background-color:rgba(0,93,76,0.9);position:absolute;top:0;left:0;width: 50%;height:100%;z-index:1;}
#mainContents .main_location .txtBox .inner {width:50%;position: relative;z-index: 3;color:#fff;padding:0 70px;top: 0;left: 50%;margin-left: -50%;height:100%;}
#mainContents .main_location .txtBox .inner .table {display:table;height:100%;}
#mainContents .main_location .txtBox .inner .tableCell {display:table-cell;vertical-align:middle;}
#mainContents .main_location .txtBox dl {text-align:center;border-bottom:1px solid #fff;padding-bottom:20px;margin-bottom:20px;}
#mainContents .main_location .txtBox dl dt {font-size:50px;font-weight:700;}
#mainContents .main_location .txtBox dl dd {font-size:20px;}
#mainContents .main_location .txtBox ul li {font-size:17px;padding:10px 0 10px 50px;background-repeat:no-repeat;background-position:0 50%;}
#mainContents .main_location .txtBox ul li:nth-child(1) {background-image:url("../images/main/main_location_icon01.png");}
#mainContents .main_location .txtBox ul li:nth-child(2) {background-image:url("../images/main/main_location_icon02.png");}
#mainContents .main_location .txtBox ul li:nth-child(3) {background-image:url("../images/main/main_location_icon03.png");}
#mainContents .main_location .map {width:100%;height:520px;overflow:hidden;background-image:url("../images/main/map_pc.jpg");background-repeat:no-repeat;background-position:50% 50%;background-size:cover;}
#mainContents .main_location .map img {width:100%;}
.root_daum_roughmap {width:100% !important;}
.root_daum_roughmap .wrap_map {height:520px !important;}
.root_daum_roughmap .wrap_controllers {display:none;}

.effect {position:relative;top:100px;opacity:0;transition:1s all ease-out;}
.effect.scroll {top:0;opacity:1;}

@media all and (max-width:1500px){
}
@media all and (max-width:1300px) {
	
}
@media all and (max-width:1200px) {
	/* #mainVisual {height:1000px;overflow:hidden;} */
	#mainVisual .iconScroll {padding-bottom:50px;}

	#mainContents .main_location .map {background-position:73% 50%;}
}

@media all and (max-width:1024px) {	
	
	#mainVisual {}
	#mainVisual .mask li .auto {padding-top:85px;}
	#mainVisual .btnPrev {display:none;}
	#mainVisual .btnNext {display:none;}

	#mainVisual {display:none;}
	#mainVisual_mobile {display:block;}

	#mainContents .main_portfolio ul li {width:50%;top:0 !important;}
	
	#mainContents .main_location .map {background-image:url("../images/main/map_m.jpg");padding-top:200%;height:auto;}
	#mainContents .main_location .txtBox {width:100%;background:rgba(0,93,76,0.9);top:auto;bottom:0;height:auto;}
	#mainContents .main_location .txtBox .bg {display:none;}
	#mainContents .main_location .txtBox .inner {margin-left:0;width:100%;left:0;top:0;padding:20px;}
	#mainContents .main_location .txtBox .inner .table {width:100%;}
	#mainContents .main_location .txtBox dl dt {font-size:1.5rem;}
	#mainContents .main_location .txtBox dl dd {font-size:0.9rem;}
	#mainContents .main_location .txtBox ul li {font-size: 0.9rem;}

	#mainContents .main_solution ul {position:relative;height:860px;}
	#mainContents .main_solution ul li {width:50%;padding:5px;height:430px;}
	#mainContents .main_solution ul li:nth-child(1) {width:100%;padding:10px;position:absolute;top:430px;}
	#mainContents .main_solution ul li a { background-size:cover;}
	#mainContents .main_solution ul li .bg {display: none;}
	#mainContents .main_solution ul li p {background:#005d4c;}

	#mainContents .main_portfolio .btnAdd {background:#534741;}
	#mainContents .main_portfolio ul li a {box-shadow:2px 2px 3px 0px rgba(50, 50, 50, 0.3)}
}

@media all and (max-width:980px) {

}
@media all and (max-width:800px) {
	#mainContents .main_solution ul {height:660px;}
	#mainContents .main_solution ul li {height:330px;}
	#mainContents .main_solution ul li:nth-child(1) {top:330px;}
}
@media all and (max-width:740px) {
	

}
@media all and (max-width:640px) {

	#header .btns {top:12px;}

	#mainVisual {he ight:630px;}
	#mainVisual .mask li .auto {padding-top:50px;}
	#mainVisual .mask li {height:630px;}
	#mainVisual .mask li img {margin-left:0 !important;transform:translateX(-50%);max-width:inherit;}
	/* #mainVisual .mask li.visual01 {background-image:url("../images/main/mainVisual02_m.jpg");}
	#mainVisual .mask li.visual02 {background-image:url("../images/main/mainVisual03_m.jpg");}
	#mainVisual .mask li.visual03 {background-image:url("../images/main/mainVisual04_m.jpg");}
	#mainVisual .mask li.visual04 {background-image:url("../images/main/mainVisual05_m.jpg");}
	#mainVisual .mask li.visual05 {background-image:url("../images/main/mainVisual06_m.jpg");}
	#mainVisual .mask li.visual06 {background-image:url("../images/main/mainVisual07_m.jpg");} */
	#mainVisual .txtBox {top:170px;}
	#mainVisual p.main {font-size:3rem;line-height:50px;}
	#mainVisual p.sub {font-size:1.2rem;}
	#mainVisual .btnPrev {width:60px;top:30%;}
	#mainVisual .btnNext {width:60px;top:30%;}

	#mainVisual .iconScroll {width:100px;margin-left:-50px;padding-bottom:20px;}

	#mainContents > div {padding:40px 0;}
	#mainContents .main_intro {height:auto;}
	#mainContents .main_intro dt {font-size:1.5rem;}
	#mainContents .main_intro dd {font-size:0.9rem;}

	#mainContents .main_intro a {font-size:0.9rem;width:155px;height:35px;line-height:35px;margin-top:20px;}


	
	

	.root_daum_roughmap .wrap_map {height:300px !important;}

	#mainContents h2.title {font-size:2rem;margin-bottom:20px;}	
	#mainContents .main_portfolio h2.title {margin-bottom:10px;}

	#mainContents .main_portfolio ul {margin:-5px;}
	#mainContents .main_portfolio ul li {padding:5px;}
	#mainContents .main_portfolio ul li a p {padding:10px;text-align:center;box-sizing:content-box;font-size:14px;height:50px;line-height:50px;line-height:1.4;height:2.8em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-wrap:break-word;overflow:hidden;}
	#mainContents .main_portfolio ul li a p span {display:block;}
	#mainContents .main_portfolio .btnAdd {width:50px;height:50px;margin:30px auto 0 auto;}
	#mainContents .main_portfolio .btnAdd img {margin-top:14px;width:25px;}
}
@media all and (max-width:480px) {
	/* #mainVisual {height:530px;} */
	
	#mainVisual .auto {padding:0 40px;}
	#mainVisual .auto .inner {padding-top:30px;}
	#mainVisual .mask li {height:530px;}
	#mainVisual .mask li .auto .txtBox .txt01 {font-size:1.2rem;letter-spacing:0.58em;margin-left:8px;}
	#mainVisual .mask li .auto .txtBox .txt02 {font-size:1.5rem;}
	#mainVisual .mask li .auto .txtBox .txt03 {font-size:0.75rem;margin:0 auto;width:267px;letter-spacing:-0.05rem}
	#mainVisual .btnPrev,
	#mainVisual .btnNext {width:40px;}

	#mainContents .main_solution ul {height:460px;}
	#mainContents .main_solution ul li {height:230px;}
	#mainContents .main_solution ul li:nth-child(1) {top:230px;}
	#mainContents .main_solution ul li p {line-height:50px;font-size:16px;}

	#mainContents .main_location .txtBox {height:50%;}
}