/* CONTETN CSS */
.p1{font-size: 21px;}	
.p2{font-size: 18px;}	
.p3{font-size: 16px;}

.content h3{margin-bottom: 25px;}
.content {font-size:16px;position: relative;line-height: 24px;}
.content .wrapper{margin: 0 auto;width: 972px;}

.list-title{text-align: center;}
.list-title h2{background-color: #005dac;display: inline-block;padding: 9px 25px;color: white;font-size:26px;letter-spacing: 2px;}

.title-h1,.title-h2,.sub-h1,.sub-h2,.list-title h2{font-family: "Nanum Barun Gothic"; font-weight: initial;}
.title-h1{font-size:34px !important;line-height: 45px;margin-bottom: 15px;color:#0060af;}
.title-h2{font-size: 28px;line-height: 40px;margin-bottom: 30px;}
.title-h3{font-size: 22px;line-height: 30px;margin-bottom: 20px;}
	
.sub-h1{font-size: 21px;line-height: 32px;margin-bottom: 15px;}	
.sub-h2{font-size: 18px;line-height: 30px;margin-bottom: 10px;color: #333;}	

.blue-lined {display: inline-block;border-bottom: 2px solid #005dac;padding: 10px;}
.grey-lined {display: inline-block;border-bottom: 2px solid #cecece;padding: 10px;}

.center-on-img{position:absolute;left: 0;right: 0;}

/* Button --------------------------------*/
.btn-r{
	display: inline-block;
	padding: 8px 14px;
	border: 1px solid #555;
	margin: 10px 0;
	font-weight: bolder;
	font-size: 15px;
}
.allow-right{
	display: inline-block;
	width: 18px;
	height: 18px;
	margin-left: 10px;
}
.allow-right:after {
	content: '';
	display: inline-block;
	margin-top: 5px;
	margin-left: 4px;
	width: 6px;
	height: 6px;
	border-top: 2px solid #333;
	border-right: 2px solid #333;
	-moz-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

/* Layout --------------------------------*/
.row{margin:0 -1%;display: block;}
.row-item{
	display: inline-block;
	padding:0 1%;
	vertical-align: top;
}
.col-1{width:98%;}
.col-1_2{width:47.7%;}
.col-1_3{width:29%;}
.col-2_3{width:58.5%;}
.col-1_4{width:22.5%;}

.section{position: relative;}

.video-wrap {
	border: 1px solid #ddd;
	position: relative;
	padding-top: 56.25%;
	box-shadow: 0 1px 1px rgba(0,0,0,0.1);
	margin-bottom:10px;
}
.video-wrap iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

/* wife animation --------------------------------*/
.wifi_wrap{position:absolute;width:30px;height:24px;display: none\9;}
.wifi_wrap .wifi_circle{position:absolute;right:0;left:0;margin:0 auto;opacity:0;text-align:center;box-sizing:border-box;-webkit-animation:wifianimation 1.5s infinite;animation:wifianimation 1.5s infinite}
.wifi_wrap .wifi_circle img{width:100%}
.wifi_wrap .cir1{width:6px;height:6px;bottom:0;opacity:.5;animation-delay:3s}
.wifi_wrap .cir2{top:67%;width:20px;height:8px;margin-top:-7px;-webkit-animation-delay:400ms;animation-delay:.5s}
.wifi_wrap .cir3{top:0;width:30px;height:12px;-webkit-animation-delay:800ms;animation-delay:1s}
@keyframes wifianimation {
  0% { opacity: 0.8 }
  5% { opactiy: 1 }
  100% { opactiy: 0.3 }
}

/* wave animation --------------------------------*/
.wave_box4{position:absolute;width:180px;height:180px;display: none\9;}
.wave_box4 .wave{position:absolute;top:50%;left:50%;overflow:hidden;width:66px;height:66px;margin:-33px 0 0 -33px;border:1px solid #fff;border-radius:50%;box-sizing:border-box}
.wave_box4 .wave1{z-index:10}
.wave_box4 .wave2{z-index:9;animation:waveAni 2.4s linear 0s infinite;-webkit-animation:waveAni 2.4s linear 0s infinite}
.wave_box4 .wave3{z-index:8;animation:waveAni 2.4s linear 2s infinite;-webkit-animation:waveAni 2.4s linear 2s infinite}
.wave_box4 .wave4{z-index:7;animation:waveAni 2.4s linear 3s infinite;-webkit-animation:waveAni 2.4s linear 3s infinite}
.wave_box4 .wave5{z-index:6;animation:waveAni 2.4s linear 4s infinite;-webkit-animation:waveAni 2.4s linear 4s infinite}
.wave_box4 .wave6{z-index:5;border:0;animation:waveAni 2.4s linear 1s infinite;-webkit-animation:waveAni 2.4s linear 1s infinite;background:-wekbit-radial-gradient(ellipse at center, rgba(131,152,220,.5) 0%, rgba(131,152,220,.5) 70%, rgba(255,255,255,.5) 100%);background:radial-gradient(ellipse at center, rgba(131,152,220,.5) 0%, rgba(131,152,220,.5) 70%, rgba(255,255,255,.5) 100%)}
@keyframes waveAni{
	0% { transform:scale(1) }
	100% { transform:scale(2.5);opacity:0 }
}

/* wide screen --------------------------------*/
@media screen and (min-width: 1400px){
	body, button, select, input[type="text"], input[type="file"], textarea {font-size: 14px}
	
	.content .wrapper{margin: 0 auto;width: 1366px;}
	.p1{font-size: 24px;}	
	.p2{font-size: 21px;}	
	.p3{font-size: 19px;}
	
	.wifi_wrap{width:38px;height:30px;}
	.wifi_wrap .cir1{width:8px;height:8px;}
	.wifi_wrap .cir2{top:58%;width:24px;height:10px;}
	.wifi_wrap .cir3{width:38px;height:12px;}
}


/* Mobile --------------------------------*/
@media screen and (max-width: 640px){
	.p1{font-size: 16px;line-height: 20px;}	
	.p2{font-size: 14px;line-height: 18px;}	
	.p3{font-size: 12px;line-height: 16px;}
	
	.row.padding-50, .row.padding-30{padding:0;}
	
	.content{font-size: 14px;}
	.content .wrapper{width:auto;}
	.sub-h1{font-size: 18px;}
	.title-h2{ font-size: 22px; line-height: 30px;}	  
	.title-h3{font-size: 18px; line-height: 24px;}
	
	.feature-col{padding-top: 160px;padding-left: 0 !important;background-size: auto 130px !important;text-align: initial;background-position:top center !important;}
	
	.content .wrapper{
		padding: 25px 20px;
		width: 100%;
		box-sizing: border-box;
	}
	
	.col-1_2,.col-1_3,.col-2_3,.col-1_4{width:100%;}
	.row-itme{margin-bottom:20px;}
	
	.items.item-1 img{margin: 10px auto; float:none}
	.items.item-1 .row-item{width:100%}
}