@charset "UTF-8";
@import url('http://c.dubuplus.com/inc/css/font/notosans/notosanskr.css');
@import url('https://fonts.googleapis.com/css?family=Lato&display=swap');


*{margin:0; padding:0; vertical-align:top; box-sizing:border-box;}
li{list-style:none;}
a{text-decoration:none; color:#666;}
img{max-width:100%;}

body{font-family: 'Lato','Noto Sans KR',sans-serif; color:#000; font-size: .95rem;}
p{color:#666;} 


/********************** contents **********************/

.cont_wr{max-width:1200px; margin:0 auto; overflow:hidden; width:100%;}
h1{font-weight:500; text-align:center; margin-bottom:65px; letter-spacing: -0.03em; font-size:2.4rem;}

 #hd{ text-align:right; position:fixed; padding:30px 80px; width:100%;   z-index:999;  }
 #hd.scr{ padding:20px 60px;  background: rgba(0,0,0,0.9); z-index:9999;}
 #hd .open{display:none; }
 #hd .nav a{display:inline-block; margin-left:50px; color:#fff; font-size:18px; font-weight:400; padding:10px 0;}
 #hd .nav a:hover{color:#8dc63f; font-weight:500; transition:all .6s; position:relative;}
 #hd .nav a:hover:before{content:''; width:100%; height:2px; background:#8dc63f; position:absolute; left:0; bottom:0;  -webkit-animation: line 1s ; animation: line 1s ;}
@-webkit-keyframes line {
  0% { 
    width:0;
  } 
  100% {
    width:100%;
  }
}
 
#cont1{padding:300px 0; text-align:center; background:url('../images/cont1_bg.jpg') no-repeat center center; background-size:cover; position:relative;}
#cont1 h1{color:#fff; font-size:3rem; margin-bottom:100px; position:relative;}
#cont1 h1:before{content:''; width:60px; height:3px; border-radius:3px; background:#fff; position:absolute; bottom:-30px; left:50%; margin-left:-30px;}
#cont1 p{font-size:1.6rem; font-weight:300; color:#eee;}
#cont1 p span{font-weight:500; color:#fff;}
#cont1:after{width:100%; height:217px; content:''; position:absolute; left:0; bottom:0; background:url('../images/cont2_bg.png')  no-repeat center bottom;}

#cont2{padding:150px 0; color:#fff; text-align:center; background:url('../images/cont2_bg.png') #01274e no-repeat center bottom;} 
#cont2 .left{float:left; width:50%; padding:50px; box-sizing:border-box; position:relative;}
#cont2 .left:before{content:''; width:1px; height:100%; background:rgba(255,255,255,0.3); position:absolute; right:0; top:50px;}
#cont2 .left:after{content:''; width:9px; height:9px; border-radius:9px; background:#fff; position:absolute; right:-4px; top:50px;}
#cont2 .right{float:left; width:50%; padding:50px; box-sizing:border-box;}
#cont2 h1{font-weight:400; border:1px solid rgba(255,255,255,0.5); padding:15px; width:100%; max-width:400px; margin:0 auto; font-size:1.6rem;}
#cont2 h2{font-size:2rem; margin:0 0 20px; font-weight:400;}
#cont2 p{color:#fff; font-size:1rem;}

#cont3{padding:150px 0;}
#cont3 ul{overflow:hidden; position:relative;}
#cont3 ul:after{content:''; width:1px; height:100%; background:#ebebeb; position:absolute; left:33.33%;}
#cont3 ul:before{content:''; width:1px; height:100%; background:#ebebeb; position:absolute; right:33.33%;}
#cont3 ul li{float:left; width:33.33%; padding:0 30px;}  
#cont3 ul li p{width:calc(100% - 80px); float:right;}
#cont3 .source_box{padding:10px 15px; border:1px solid #ebebeb; float:right; font-size:13px; color:#666; text-align:right; margin:20px 0 0;}

#cont4{padding:0 0 150px; }
#cont4 h1{font-size:1.5rem; color: #1070e8; margin-bottom:35px;}
#cont4 .cont_wr{ position:relative;} 
#cont4 ul{overflow:hidden; position:relative; max-width:1120px; margin:0 auto;} 
#cont4 ul li{float:left; width:50%; text-align:center;}   
#cont4 .source_box{padding:10px 15px;  font-size:13px; color:#666; text-align:right; margin:20px 0 0;}
 
#cont5{padding:150px 0; background:url('../images/cont5_bg.jpg') no-repeat center center; background-size:cover;}
#cont5 ul{overflow:hidden; text-align:center;} 
#cont5 ul li{display:inline-block; width:24.5%; text-align:center; padding:40px 0;}   
#cont5 ul li h2{font-size:1.1rem; font-weight:500; margin:20px 0 10px;}
#cont5 ul li p{color:#666; font-size:.92rem;}

#cont6{background:#fff; padding:150px 0; text-align:center;}
#cont6 h1{font-size:2rem; color: #1070e8; margin-bottom:60px;}
#cont6 p{margin:10px 0; color:#000; font-weight:500;}
#cont6 .slick-prev:before{ content: ''; background: url('../images/cont6_prev.png') center center; width: 100%; height: 100%; display:block;}
#cont6 .slick-next:before{content: ''; background: url('../images/cont6_next.png') center center; width: 100%; height: 100%; display:block;}
#cont6 .slick-prev,#cont6 .slick-next{width:36px; height:71px; margin-top:-35.5px;}
#cont6 .slick-dots li button:before{color:#000;} 
#cont6 .slick-slide img{ border: 1px solid #ddd;}

#cont7{background:#e0eaf6; padding:200px 0; text-align:center;} 
#cont7 h1{font-size:2rem; color: #1070e8; margin-bottom:60px;}
#cont7 p{margin:10px 0; color:#000; font-weight:500;}
#cont7 .slick-prev:before{ content: ''; background: url('../images/cont6_prev.png') center center; width: 100%; height: 100%; display:block;}
#cont7 .slick-next:before{content: ''; background: url('../images/cont6_next.png') center center; width: 100%; height: 100%; display:block;}
#cont7 .slick-prev,#cont7 .slick-next{width:36px; height:71px; margin-top:-35.5px;}
#cont7 .slick-dots li button:before{color:#000;} 
#cont7 .slick-slide img{ border: 1px solid #adadad;}

#cont8{padding:150px 0;}
#cont8 ul li{border-bottom:1px solid #ebebeb; padding:30px 0; overflow:hidden;}
#cont8 ul li:first-child{border-top:1px solid #333;}
#cont8 ul li:last-child{border-color:#333;}
#cont8 ul li div{float:left; padding:0 20px 0 120px; width:50%; position:relative;} 
#cont8 ul li div img{position:absolute; left:20px; top:10px; width:70px;}
#cont8 ul li div h2{height:50px; color:#00224e; font-size:1.3rem; font-weight:500;}
#cont8 ul li div p{padding-left:10px; position:relative; margin-bottom:10px; color:#9e9c9c;}
#cont8 ul li div p:before{content:'·'; position:absolute; left:0;}

#cont9{padding:300px 0; background:url('../images/cont9_bg.jpg') no-repeat center center; background-size:cover; color:#fff;} 
#cont9 ul li{float:left; width:33.33%; text-align:center;}
#cont9 ul li h2{font-size:1.4rem; margin:20px 0 10px; font-weight:400;}
#cont9 ul li p{color:#eee;}


#cont10{padding:150px 0; } 
#cont10 ul {overflow:hidden;}
#cont10 ul li{float:left; width:49%; text-align:center; border-bottom:1px solid #ebebeb;}
#cont10 ul li:last-child{float:right;}
#cont10 ul li h2{background:url('../images/cont10_bg.jpg'); padding:10px 0; font-weight:400; font-size:1.3rem;}
#cont10 ul li p{padding:20px 0;}
#cont10 .contact{overflow:hidden; border-bottom:0;}
#cont10 .contact a{margin:30px 0 0; float:left; line-height: 31px; font-size:1.1rem; color:#000;} 
#cont10 .contact a:first-child{margin-right:20px; padding-right:20px; position:relative;}
#cont10 .contact a:first-child:after{content:''; width:1px; height:60%; background:#aaa; position:absolute; right:0; top:20%;}
#cont10 .contact a img{margin-right:5px;}
#cont10 .contact a.brochure{float:right; border:2px solid #1081dd; border-radius:50px; width:273px; padding: 10px 20px; color:#1081dd; font-size:1.1rem; font-weight:400; background:url('../images/cont10_ic_down.png') no-repeat center right 20px;  transition:all .6s;}
#cont10 .contact a.brochure img{margin-right:0;}
#cont10 .contact a.brochure:hover{background:url('../images/cont10_ic_down_w.png') #1081dd no-repeat center right 20px; color:#fff; }
#cont10 .contact a.brochure:hover img{margin-left:-20px; transition:all .6s;}

#cont10 .contact a.signup{float:right; border:2px solid #dc143c; border-radius:50px; width:273px; padding: 10px 20px;color:#dc143c; font-size:1.1rem; font-weight:400; transition:all .6s;text-align:center;margin-right:5px;}
#cont10 .contact a.signup img{margin-right:0;}
#cont10 .contact a.signup:hover{color:#fff; background-color:#dc143c; }
#cont10 .contact a.signup:hover img{margin-left:-20px; transition:all .6s;}

#cont11{padding:150px 0 75px; } 
#cont11 .line_bg{background:url('../images/line_bg.png') #ebebeb; padding:15px; max-width:1100px; margin:0 auto;}
#cont11 .box{width:100%; background:#fff; padding:50px;}
#cont11 .box p{line-height:2;}

#cont12{padding:320px 0; background:url('../images/line_bg.png') #01274e; } 
#cont12 h1{color:#fff;}
#cont12 .line_bg{background:#fff;  padding:15px; max-width:1100px; margin:0 auto;}
#cont12 .box{width:100%; background:url('../images/line_bg.png') #01274e; padding:50px;}
#cont12 .box p{line-height:2; color:#fff; font-size:1.2rem;} 

#cont13{background:#fff; padding:150px 0; text-align:center;}
#cont13 h1{font-size:2rem; color: #1070e8; margin-bottom:60px;}
#cont13 p{margin:10px 0; color:#000; font-weight:500;}
#cont13 .slick-prev:before{ content: ''; background: url('../images/cont6_prev.png') center center; width: 100%; height: 100%; display:block;}
#cont13 .slick-next:before{content: ''; background: url('../images/cont6_next.png') center center; width: 100%; height: 100%; display:block;}
#cont13 .slick-prev,#cont13 .slick-next{width:36px; height:71px; margin-top:-35.5px;}
#cont13 .slick-dots li button:before{color:#000;} 
#cont13 .slick-slide img{ border: 1px solid #ddd;}


#ft{ }
#ft .download{overflow:hidden; padding:100px 0 0;}
#ft .download a{float:left; width:32%; margin-right:2%; border-radius:6px; padding: 10px 20px;  background:url('../images/cont10_ic_down_w.png') no-repeat center right 20px;  font-weight:400;  color:#fff; line-height:50px; font-size:1.1rem;}
#ft .download a:last-child{margin-right:0;}
#ft .download a img{margin-right:10px;} 
#ft .download a.android{background-color:#a6c63b; border:1px solid #96b826;}
#ft .download a.android:hover{background-color:#96b826;}
#ft .download a.apple{background-color:#111; border:1px solid #000;}
#ft .download a.apple:hover{background-color:#000;}
#ft .download a.window{background-color:#1081dd; border:1px solid #006ec7;}
#ft .download a.window:hover{background-color:#006ec7;} 
#ft p{color:#666; font-size:.9rem; padding:35px 0 60px; border-top:1px solid #444;}
#ft p span{display:block; font-size:1.2rem; margin-bottom:10px; font-weight:500; }
 



/********************** responsive **********************/

@media screen and (max-width:1400px){
	#cont6 .slick-prev, #cont6 .slick-next,#cont7 .slick-prev, #cont7 .slick-next,#cont13 .slick-prev, #cont13 .slick-next{display:none !important;}
}
@media screen and (max-width:1220px){
	.cont_wr{width:95%; margin:0 auto;}
	.slick-slider{width:95%;}
	#cont4 ul{width:95%;}
	#cont4 ul li{padding:0 5px;}
}
@media screen and (max-width:1024px){
	#hd{padding:17px 20px;}
	#hd.scr{padding:17px 20px;}
	#hd .open{display:inline-block; cursor:pointer;} 
	#hd .nav{width:100%; position:absolute; top:57px; right:0; background:#fff; display:none;}
	#hd .nav a{display:block; text-align:center; color:#333; border-bottom:1px solid #ddd; margin:0;}
	#cont3 ul li{padding:0 20px;}
	#ft .download a img{width:30px;}
	#ft .download a{width:100%; margin-right:0; margin-bottom:10px; line-height:30px; font-size:1rem;}
	#cont10 .contact{text-align:center;}
	#cont10 .contact a{font-size:1rem; float:none; display:inline-block;}
	#cont10 .contact a.brochure{font-size:1rem; float:none; display:block; margin: 30px auto 0; text-align:left;}
	#cont10 .contact a.signup{font-size:1rem; float:none; display:block; margin: 30px auto 0; text-align:center;}
}
@media screen and (max-width:768px){
	h1,#cont13 h1,#cont7 h1,#cont6 h1{margin-bottom:35px; font-size:2rem;}

	#cont1{padding:150px 0;}
	#cont1 p{font-size:1.2rem;}
	#cont1:after{background-size:100px;}

	#cont2{padding:80px 0;}
	#cont2 .left{padding:30px 30px 30px 10px;}
	#cont2 .right{padding:30px 10px 30px 30px;}

	#cont3{padding:80px 0;}
	#cont3 ul{border-top:1px solid #ebebeb;}
	#cont3 ul li{width:100%; padding:20px 10px; border-bottom:1px solid #ebebeb;}
	#cont3 ul:before,#cont3 ul:after{display:none;}

	#cont4{padding:0 0 80px;}
	#cont4 .cont_wr{padding:0;}
	#cont4 .cont_wr:before{display:none;} 
	#cont4 ul{width:100%;}
	#cont4 ul li{width:100%; margin-bottom:10px; text-align:center;}
	#cont4 .source_box{text-align:center;} 
	#cont4 h1{font-size:1.3rem; font-weight:400;} 

	#cont5{padding:80px 0;}
	#cont5 ul li{width:100%; position:relative; padding: 10px 0 30px 120px; text-align:left;}
	#cont5 ul li img{position:absolute; left:20px; top:20px; width: 70px;} 
	#cont5 ul li h2{margin:10px 0;}

	#cont6{padding:80px 0;} 

	#cont7{padding:80px 0;}

	#cont8{padding:80px 0;}
	#cont8 ul li{padding:0; border-bottom:0;}
	#cont8 ul li div{float:none; width:100%; padding:20px 10px 20px 80px; border-bottom: 1px solid #ebebeb;}
	#cont8 ul li div h2{height:auto; margin-bottom:10px; font-size:1.1rem;}
	#cont8 ul li div img{width:60px; left:0; top:15px;}
	#cont8 ul li div p{font-weight:300} 

	#cont9{padding:80px 0;}
	#cont9 ul li{width:100%; float:none; position:relative; padding: 10px 0 30px 120px; text-align:left;}
	#cont9 ul li img{position:absolute; left:20px; top:20px; width: 70px;} 
	#cont9 ul li h2{margin:10px 0; font-size:1.2rem;}

	#cont10{padding:80px 0;}
	#cont10 ul li{width:100%;}
	#cont10 ul li h2{font-size:1.1rem;}
	#cont10 .contact a:first-child{margin-right:0;}
	#cont10 .contact a:first-child:after{display:none;}
	
	#cont11{padding:80px 0 50px;}
	#cont11 .box{padding:30px;} 

	#cont12{padding:80px 0;}
	#cont12 .box{padding:30px;}
	#cont12 .box p{font-size:1rem;}

	#cont13{padding:80px 0;}
 
}
@media screen and (max-width:480px){
	body{font-size:.92rem;}
	h1,#cont13 h1,#cont7 h1,#cont6 h1{font-size:1.5rem; max-width:300px; margin:0 auto 35px;}

	#cont1{padding:100px 0;}
	#cont1 img{max-width:200px; }
	#cont1 h1{font-size:2rem;}
	#cont1 p{font-size:1rem; padding:0 20px;}
	#cont1 p span:nth-child(2){display:block;}

	#cont2 h1{font-size:1.3rem; width:80%;} 
	#cont2 p{font-size:.92rem;}

	#cont4{padding:0 0 80px ;}
	
	#cont5 ul li img{width:50px; left:10px}
	#cont5 ul li {padding: 10px 10px 30px 75px;}

	#cont8 ul li div p{margin-bottom:5px; font-size:.92rem;}

	#cont9 ul li img{width:50px; left:10px}
	#cont9 ul li {padding: 10px 10px 30px 80px;}
	#cont9 ul li p{position:relative; padding-left:10px;}
	#cont9 ul li p:after{content:'·'; position:absolute; left:0; top:1px;}

	#cont10 .contact a:nth-child(2){margin-top:10px;}

	#ft p{text-align:center;}
	#ft .download{padding:50px 0 0;}
}