@charset "utf-8";

.clearfix:after{clear:both; content:""; display:block;}
.inner{width:100%; max-width:1460px; margin:0 auto;}

/*
font-family: 'Noto Sans KR', sans-serif;  Regular 400 , Bold 700
*/


/*상단*/
.top_bg{
	width:100%;
	height:820px;
	background:url(../najun_img/top_bg_img.jpg) 0 0 no-repeat;
	background-size:cover;
}

.splash_img, .splash_text{
	float:left;
	width:50%;
}

.splash_box{
	padding-top:220px;
}

.splash_img{
	text-align:center;
}

.splash_text{
	padding:100px 0 0 200px;
}

.splash_text h1{
	font-family: 'Noto Sans KR', sans-serif; 
	font-size:35px;
	font-weight:700;
	color:#fff;
	margin-bottom:70px;
}

.splash_text h2{
	font-family: 'Noto Sans KR', sans-serif;
	font-size:22px;
	font-weight:400;
	color:#fff;
}

.splash_text h2:last-child{
	margin-top:20px;
}

.splash_text h1 img{
	vertical-align:middle;
	margin-right:20px;
}

/***상단***/

/*나출소개*/
.intro{
	background:url(../najun_img/bg_img02.jpg) 0 0 no-repeat;
	background-size:cover;
	width:100%;
	height:1200px;
	margin-top:400px;
}

.intro_box{
	padding-top:200px;
}

.intro_text, .intro_img{
	float:left;
	width:50%;
}

.intro_text{
	padding:220px 0 0 180px;
}

.intro_text p:first-child{
	font-family: 'Noto Sans KR', sans-serif; 
	font-size:35px;
	font-weight:700;
	color:#fff;
	margin-bottom:100px;
}

.intro_text p:last-child{
	font-family: 'Noto Sans KR', sans-serif; 
	font-size:22px;
	font-weight:400;
	line-height:40px;
	color:#c8c8c8;
}

.intro_img{
	text-align:center;
}

/***나출소개***/

/*나출특징*/

.feature{
	margin-top:200px;
	padding:50px 0;
}

.feature h2{
	text-align:center;
	font-family: 'Noto Sans KR', sans-serif; 
	font-size:35px;
	font-weight:700;
}

.feature ul{
	width:100%;
	margin:120px auto 0;
}

.feature ul li{
	display:inline-block;
	width:32%;
	text-align:center;
}

.feature figcaption{
	font-family: 'Noto Sans KR', sans-serif; 
	font-size:23px;
	font-weight:700;
	margin-top:20px;
}

/***나출특징***/

/*나출 회원가입*/

.join{
	margin-top:200px;
}

.join_img, .join_text{
	float:left;
	width:50%;
}

.join_img{
	text-align:center;
}

.join_text{
	padding: 250px 0 0 200px;
}

.join_text p{
	font-family: 'Noto Sans KR', sans-serif; 
	font-size:30px;
	font-weight:700;
}

.join_text p:last-child{
	margin-top:40px;
}


/***나출 회원가입***/

/*나출 장점*/

.merit{
	margin-top:200px;
	padding:50px 0;
}

.merit_text, .merit_img{
	width:50%;
	float:left;
}

.merit_text{
	padding: 100px 0 0 180px;
}

.merit_text h2{
	font-family: 'Noto Sans KR', sans-serif; 
	font-size:35px;
	font-weight:700;
	margin-bottom:120px;
}

.merit_text p{
	font-family: 'Noto Sans KR', sans-serif; 
	font-size:22px;
	font-weight:400;
	color:#525252;
}

.merit_text p:nth-child(3){
	margin:35px 0;
}

.merit_img{
	text-align:center;
	padding-top:120px;
}

/***나출 장점***/


/*나출 하단*/

.end{
	margin-top:200px;
	background:url(../najun_img/bg_img03.jpg) 0 -150px no-repeat;
	background-size:cover;
	height:1280px;
}

/***나출 하단***/

@media screen and (max-width:1300px){
	.top_bg {
		background: url(../najun_img/top_bg_img.jpg) -500px 0 no-repeat;
		background-size:cover;
	}	
	
	.splash_text {
		padding: 100px 0 0 100px;
	}
	
	.intro {
		background: url(../najun_img/bg_img02.jpg) -500px 0 no-repeat;
		background-size:cover;
	}
	
	.join_text {
		padding: 250px 0 0 100px;
	}
	
	.intro_text{
		padding:220px 0 0 100px;
	}
	
	
	
	.end {
		background: url(../najun_img/bg_img03.jpg) -300px -150px no-repeat;
		background-size:cover;
	}
}

@media screen and (max-width:1024px){
	.inner{
		width:90%;
	}
	
	.top_bg{
		height:700px;
	}
	
	.splash_box {
		padding-top: 150px;
	}
	
	.splash_text {
		padding: 70px 0 0 100px;
	}
	
	.splash_img img, .intro_img img, .join_img img{
		width:340px;
	}
	
	.intro{
		margin-top:200px;
		height:850px;
		background: url(../najun_img/bg_img02.jpg) -350px 0 no-repeat;
		background-size: cover;
	}
	
	.intro_box {
		padding-top: 85px;
	}
	
	.intro_text {
		padding: 170px 0 0 0px;
	}
	
	.join_text {
		padding: 250px 0 0 0px;
	}
	
	.feature {
		margin-top: 120px;
	}
	
	.join {
		margin-top: 150px;
	}
	
	.merit {
		margin-top: 150px;
		padding: 0 0;
	}
	
	.merit_box{
		text-align:center;
	}
	
	.merit_text{
		padding:0;
	}
	
	.merit_text, .merit_img {
		width: 100%;
		float:inherit;
	}
	
	.end {
		background: url(../najun_img/bg_img03.jpg) 0 0 no-repeat;
		background-size: cover;
		height:700px;
	}
	
}

@media screen and (max-width:768px){
	.splash_img img, .intro_img img, .join_img img {
		width: 230px;
	}
	
	.top_bg {
		background: url(../najun_img/top_bg_img.jpg) -600px 0 no-repeat;
		background-size: cover;
	}
	
	.splash_img, .splash_text, .intro_text, .intro_img, .join_img, .join_text{
		width:100%;
		float:inherit;
	}
	
	.splash_box{
		position:relative;
		padding-top:50px;
	}
	
	.splash_img{
		top:330px;
	}
	
	.splash_text{
		padding:0 0;
		text-align:center;
	}
	
	.splash_img, .splash_text{
		position:absolute;
	}
	
	
	.intro_text{
		padding:0 0;
		text-align:center;
	}
	
	.intro_text p:first-child{
		margin-bottom:40px;
	}
	
	.intro_img{
		margin-top:40px;
	}
	
	.intro_box{
		padding-top:60px;
	}
	
	.feature{
		margin-top:150px;
		padding:0;
	}
	
	.join{
		margin-top:150px;
	}
	
	.join_text {
		padding: 100px 0 0 0px;
		text-align: center;
	}
	
}

@media screen and (max-width:548px){
	.splash_text h1{
		margin-bottom:12.7vw;
	}
	
	.splash_text h1 img{
		width:10.5vw;
	}
	
	.splash_img{
		top:70vw;
	}
	
	.intro{
		margin-top:27.3vw;
	}
	
	.splash_text h1, .intro_text p:first-child, .feature h2, .merit_text h2{
		font-size:6.3vw;
	}
	
	.splash_text h2, .intro_text p:last-child, .merit_text p{
		font-size:4vw;
	}
	
	.join_text p{
		font-size:5.4vw;
	}
	
	.feature ul{
		margin:21.8vw auto 0;
	}
	
	.feature ul li{
		display:block;
		width:100%;
	}
	
	.feature ul li:nth-child(2){
		margin:60px 0;
	}
	
	.feature , .join, .merit, .end{
		margin-top:27.3vw;
	}
	
	.end {
		background: url(../najun_img/bg_img03.jpg) 50% 50% no-repeat;
		background-size: cover;
		height: 400px;
	}
	
	.merit_img img{
		width:45.6vw;
	}
	
	.merit_text h2{
		margin-bottom:12.7vw;
	}
	
}