@charset "utf-8";

/* reset css 설정 */
html,
body{height:100%;}
*{
	padding:0; margin:0;
	outline:0;
	vertical-align:top;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
	font-family:'Nanum Gothic', NanumGothic, 'Malgun Gothic', Dotum, sans-serif;
	}
article, aside, figcaption, figure, footer, header, nav, section{display:block;}
p, ul, ol, dl, ul li, ol li, dl dt, dl dd{
	list-style:none;
	padding:0; margin:0;
	}
body{
	font-family:'Nanum Gothic', NanumGothic, 'Malgun Gothic', Dotum, sans-serif;
	background:#ffffff;
	color:#2e393f;
	line-height:1.4;
	font-size:13px;
	min-width:320px;
	}
input, select, textarea{vertical-align:middle; border:0;}
a, a:hover, input, select, textarea{text-decoration:none;}

img{
	max-width:100%;
	line-height:0;
	font-size:0;
	border:0;
	-ms-interpolation-mode:bicubic;
}
a, a:hover, a:focus{
    color: inherit;
    text-decoration: none;
    transition: all 0.3s;
}

/* 공통 css 설정 */
.hide, hr{
	display:none;
	position:absolute;
	left:-99999999px;
	border:0 none;
	}
.text-center{text-align:center !important;}
.text-left{text-align:left !important;}
.text-right{text-align:right !important;}

.pull-right{float:right !important;}
.pull-left{float:left !important;}

.content-pc{display:block;}
.content-mobile{display:none;}

/* 모바일 설정 */
@media (max-width: 991px){
	.content-pc{display:none;}
	.content-mobile{display:block;}
}

/* tab 설정 ****************************************************************** */
ul.tabs{
    overflow:hidden;
    list-style:none;
    border-bottom:2px solid #ed5218;
    width:100%;
    font-size:13px;
}
ul.tabs li{
    float:left;
	width:20%;
    text-align:center;
    cursor:pointer;
	padding:6px 5px;
	border-right:2px solid #ffffff;
    font-weight:bold;
    background:#e5e5e5;
	font-size:13px;
	color:#7a7a7a;
    overflow:hidden;
    position:relative;
	letter-spacing:-1px;
}
ul.tabs li:last-child{
    border-right:0 none;
}
ul.tabs li.active{
    background:#ed5218;
	color:#ffffff;
}
.tab-container{
	padding:0px;
    border-top:none;
    clear:both;
    background:#FFFFFF;
}
.tab-content{
    font-size:13px;
    display:none;
}
.tab-content .content-box{
    padding:15px 0;
}

/* 폼 설정 ****************************************************************** */
input[type='checkbox']{appearance:checkbox;}
input[type='text'], input[type='tel'], input[type='password'], textarea{appearance:none; color:#666;}
input[type='text'], input[type='tel'], input[type='password']{width:100%;}
input[type='file']{display:block;}
input::placeholder,
textarea::placeholder{color:#ccc;}
label{cursor:pointer;}
textarea{-webkit-overflow-scrolling:touch;}
input[type='text']{height:30px;}
input[type='checkbox']{appearance:checkbox;}
input, .popup-container select, .popup-container textarea{vertical-align:middle; text-indent: 0;}
input[type='file']{display:block;}
input::placeholder,
textarea::placeholder{color:#ccc;}
.form-group{
    margin-bottom:15px;
	min-height:30px;
}
.form-control:focus{
    border-color:#66afe9;
    outline:0;
    -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
    box-shadow:inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
}
.form-group .layout-label{
	display:inline-block;
	padding-top:7px;
    margin-bottom:5px;
    font-weight:700;
}
.form-group .input-text{
	margin: 0 10px 0 0;
	display: inline-block;
	line-height: 30px;
}
textarea.form-control{
    height:auto;
	resize:none;
}
.help-block{
    display:block;
    margin-top:5px;
    margin-bottom:10px;
    color:#737373;
}
.form-control{
    display:block;
    width:100%;
    height:30px;
	letter-spacing:-0.5px;
    padding:6px 10px;
    font-size:14px;
    line-height:1.42857143;
    color:#555;
    background-color:#fff;
    background-image:none;
    border:1px solid #ccc;
    border-radius:0px;
    -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow:inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition:border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

/* 리스트 설정 ************************************************************** */
dl dd ul li{
	position:relative;
	padding-left:10px;
}
dl dd ul li::after{
	content:'- ';
	position:absolute;
	left:0; top: -1px;
}

/* 버튼 설정 ***************************************************************** */
.btn.btn-svy-go{/* nownsurvey 이동 버튼 */
    color:#fff !important;
    background-color:#F4662E;
    border-color:#EC4A0D;
	padding: 15px 40px;
	margin:25px 0 30px;
    font-size: 20px;
	border-radius: 0;
}
.btn.btn-svy-go:active, .btn.btn-svy-go:focus, .btn.btn-svy-go:hover{
    color:#fff !important;
    background-color:#EC4A0D;
    border-color:#EC4A0D;
}

/* 레이아웃 설정 ************************************************************* */
.layout-row{
margin-right:-10px;
margin-left:-10px;
margin-bottom:15px;
}
.layout-row::after{
	content:'';
	display:block;
	clear:both;
}
.layout-col-1, .layout-col-2, .layout-col-3, .layout-col-4, .layout-col-5, .layout-col-6, .layout-col-7, .layout-col-8, .layout-col-9, .layout-col-10, .layout-col-11, .layout-col-12{
	position:relative;
	min-height:1px;
	padding-right:10px;
	padding-left:10px;
	}


/* wrapper 설정 ***************************************************************/
.wrapper-intro{
    display: flex;
    width: 100%;
    align-items: stretch;
    perspective: 1500px;
}


/* 서비스 소개 설정 ************************************************************/
/* 서비스 소개 레이아웃 설정 */
.wrapper-intro #content{
	max-width:100%;
	width:100%;
	margin:0 auto;
	padding:0;
}

/* 서비스 소개 header */
#content-intro{
	display: flex;
	position:relative;
	width: 100%;
	align-items: stretch;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
	background: rgba(0, 0, 0, 0.3) !important;
}
#intro-header{
	max-width:1200px;
	width:100%;
	padding: 0 25px;
	margin:0 auto;
	position:relative;
	overflow:hidden;
}
#content-intro h3.logo{
	position:absolute;
	left:25px; top:0;
	display:inline-block;
	height: 35px;
	margin:17px 0;
	transition: all 0.6s cubic-bezier(0.945, 0.020, 0.270, 0.665);
	transform-origin: bottom left;
	text-align: left;
    z-index: 999;
}
#content-intro h3.logo img{
	width:140px;
}
#content #content-intro .navbar-light .navbar-nav li{
	border-radius: 15px;

}
#content #content-intro .navbar-light .navbar-nav li:first-child{
	margin-top:25px;
}
#content #content-intro .navbar-light .navbar-nav .active>.nav-link{
	color:#ffffff;
}
#content #content-intro .navbar-light .navbar-nav .nav-link {
	color: #ffffff;
	text-shadow: 1px 1px 8px rgb(91, 41, 21);
}

#content #content-intro .navbar{
    padding: 20px 0;
	min-height:70px;
	box-shadow: none;
    background: none;
    margin-bottom: 0;
}
#content #content-intro .navbar-light{}
#content #content-intro .navbar-light .btn-dark {
	color: #fff;
	background-color: #d44912;
	border-color: #b84112;
}
#content #content-intro .navbar-light .btn-dark:hover{
	color: #fff;
	background-color: #b84112;
	border-color: #b84112;
}



/* 상단 설정 */
.navbar-expand-lg .navbar-nav .nav-link{
    font-size:16px;
}
.navbar-light .navbar-nav .active>.nav-link,
.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .show>.nav-link{
    font-weight: bold;
}


/* 서비스 소개 컨텐츠 설정 */
#content-intro-container{
	margin:-180px auto 0;
	}


/* 메인 설정 */
#intro-section-main{
	background:#ED5C23 url('../img/bg-visual.jpg') repeat-x center bottom / 1200px 510px;
	height:500px;
	text-align:center;
}
#intro-section-main dl{
	padding:210px 30px 0;
	margin:0 auto;
	text-align:center;
	color:#ffffff;
	max-width:650px;
}
#intro-section-main dl dt{
	font-size:30px;
	line-height:35px;
	padding-bottom:15px;
}
#intro-section-main dl dd{
	font-size:14px;
	padding-bottom:25px;
}
#intro-section-main dl dd a.btn-join{
	display:inline-block;
	width:180px;
	padding:10px 0;
	background-color:#ed5c23;
	text-align:center;
	border:3px solid #ffffff;
	font-size: 16px;
}
#intro-section-main dl dd a.btn-join:hover{
	background-color:#DA4912;
}

/* 공통 section 설정 */
#intro-section-content{
}
#intro-section-content .content-box{
	padding:35px 25px 25px;
	height:auto;
	max-width:1200px;
	margin:0 auto;
	overflow:hidden;
	clear:both;
}
.content-box dl{
	vertical-align: middle;
}
.content-box dl dt{
	padding:0 0 15px 0;
	font-weight:bold;
	font-size:25px;
	letter-spacing: -1px;
}
.content-box dl dt > span{
	color:#ed5c23;
}
.content-box dl dd{
	font-size:14px;
	line-height:22px;
	margin-bottom:15px;
	letter-spacing: -0.5px;
}
.content-box dl dd > span.span-br{
	display:inline;
}
.content-box dl dd ul::after{
	content:'';
	display:block;
	clear:both;
}
.content-box .box-text{
	display:block;
	height:auto;
}
.content-box .box-img-pc{
	display:none;
}
.content-box .box-img-mobile{
	display:block;
	text-align:center;
}
.content-box .box-img > img{
	max-width:100%; max-height:100%;
}

/* 선택 section 설정 */
#intro-section-2 .content-box .box-img > img,
#intro-section-3 .content-box .box-img > img,
#intro-section-4 .content-box .box-img > img,
#intro-section-5 .content-box .box-img > img{vertical-align:middle;}

#intro-section-1,
#intro-section-3,
#intro-section-5{
	background-color:#f7f7f7;
}
#intro-section-1 .content-box{
	height:540px;
}
#intro-section-1 .box-img-mobile{
	margin: 15px auto 0;
}
#intro-section-2 .box-img-mobile{
	margin-top:25px;
}
#intro-section-2 .box-img-mobile > img{
	width:300px;
}
#intro-section-3 .content-box{
	overflow:hidden;
}
#intro-section-3 .box-img-mobile{
	margin-top:10px;
	margin-bottom:15px;
}
#intro-section-3 .box-img-mobile> img{
	width:250px;
}
#intro-section-3 .box-img{
	text-align:right;
}
#intro-section-4 .box-img-mobile{
	margin-top:25px;
}
#intro-section-4 .box-img-mobile > img{
	width:180px;
}
#intro-section-1 dl dd ul{
	box-sizing : border-box;
	margin-bottom:25px;
}
#intro-section-3 dl dd ul{
	overflow:hidden;
}
#intro-section-1 dl dd ul li{
	width:100%;
	font-size:14px;
	line-height:22px;
	letter-spacing: -0.5px;
}
#intro-section-3 dl dd ul li{
	width:100%;
	font-size:14px;
	line-height:22px;
	letter-spacing: -0.5px;
}
#intro-section-5 .content-box .box-img{
	text-align:center;
}
#intro-section-5 .content-box .box-img > img{
	width:250px; height:250px;
}


/* 테이블 설정 */
.box-table{padding-top:15px;}
.table-intro{
	margin-bottom: 0 !important;
}
.table-intro thead tr th{
	background-color:#d2d2d2;
	color:#3a3a3a;
}
.table-intro thead tr td{
}
.table-intro tbody tr th .sub-title,
.table-intro tbody tr td .sub-title{
	font-size: 12px;
	color: #9a9a9a;
	font-weight: 600;
}
.table-intro tr th,
.table-intro tr td{
	font-size:12px;
	text-align:center;
	color: #666666;
	padding: .25rem;
	word-break: keep-all;
	border:0 none;
	vertical-align: top;
}

/* footer 시작 */
#intro-section-footer{
	padding:15px 0;
	text-align:center;
	background-color:#3C3C3C;
	color:#ffffff;
}
#intro-section-footer #intro-footer{
	padding:25px 0;
}
#intro-footer dl{
}
#intro-footer dl dt{
	text-align:center;
	margin-bottom:10px;
}
#intro-footer dl dt > img{
	text-align:center;
	width:150px;
}
#intro-footer dl dd{
	margin-bottom:10px;
}
#intro-footer dl dd:last-child{
	margin-bottom:0;
	color:#929292;
}


/* mobile 설정 ============================================================== */
@media (max-width: 768px){

}

/* 중간 mobile 설정 ========================================================= */
@media (min-width:550px){

	#intro-section-3 .box-img-mobile{
	}
	#intro-section-3 dl dd ul{
		padding:10px 0 0 0;
	}
	#intro-section-1 dl dd ul li,
	#intro-section-3 dl dd ul li{
		font-size:14px;
	}
	#intro-section-3 dl dd ul li{
		width:50%;
		float:left;
		font-size:14px;
		line-height:22px;
		letter-spacing: -0.5px;
	}

}


/* tablet 설정 ============================================================== */
@media (min-width:768px){

	/* 서비스 소개 레이아웃 설정 */
	.intro #content{
		max-width:100%;
		margin:0 auto;
	}

	/* 서비스 소개 header */
	#content-intro h3.logo{
	}
	#content-intro h3.logo img{
		width:190px;
	}
	#content #content-intro .navbar-light .navbar-nav li:first-child{
		margin-top:0;
		background:url('../img/navbar_line.gif') no-repeat right 13px;
	}
	#content #content-intro .navbar{
	}

	/* 서비스 소개 컨텐츠 설정 */
	#content-intro-container{
		margin:-155px auto 0;
		}

	/* 메인시작 */
	#intro-section-main{
		background:#ED5C23 url('../img/bg-visual.jpg') repeat-x center bottom / 1200px 510px;
		height:550px;
		text-align:center;
	}
	#intro-section-main dl{
		padding:270px 0 0 0;
		margin:0 auto;
		text-align:center;
		color:#ffffff;
		max-width:700px;
	}
	#intro-section-main dl dt{
		font-size:38px;
		padding-bottom:25px;
	}
	#intro-section-main dl dd{
		font-size:18px;
		padding-bottom:30px;
	}

	/* 공통 section 설정 */
	#intro-section-content{
	}
	#intro-section-content .content-box{
		padding:0 25px 0;
		height:370px;
	}
	.content-box dl{
		display:table-cell;
		vertical-align: middle;
	}
	.content-box dl dt{
		padding:0 0 10px 0;
		font-size:27px;
		letter-spacing: -0.5px;
	}
	.content-box dl dt > span{
	}
	.content-box dl dd{
		font-size:15px;
	}
	.content-box dl dd > span.span-br{
		display:block;
	}
	.content-box .box-text{
		display:table;
		height:370px;
	}
	.content-box .box-img{
		display:block;
		vertical-align: bottom;
	    height: 370px;
	    line-height: 370px;
		text-align:right;
	}
	.content-box .box-img-pc{
		display:block;
	}
	.content-box .box-img-mobile{
		display:none;
	}

	/* 테이블 설정 */
	.box-table{padding-top:25px;}
	.table-intro{
	}
	.table-intro tr th,
	.table-intro tr td{
		text-align:center;
		font-size:14px;
	    padding: .75rem;
	}

	/* 선택 section 설정 */
	#intro-section-1 .content-box{
		height:auto;
	}
	#intro-section-1 .content-box .box-img > img{
		vertical-align:bottom;
		width:240px; height:460px;
		margin-top:70px;
	}
	#intro-section-3 .content-box{
		overflow:visible;
	}
	#intro-section-3 .box-img-mobile{
		float:none;
		width:auto;
	}
	#intro-section-3 .content-box .box-img > img{
		position:absolute;
		right:0; top:50px;
	}
	#intro-section-1 dl dd ul{
		float : none;
		margin-right : 0;
		padding-right :0;
		margin-bottom:0;
	}
	#intro-section-3 dl dd ul{
		overflow:hidden;
		margin:0;
		padding:0;
	}
	#intro-section-5 dl dd ul{
		float : none;
		margin-right : 0;
		padding-right :0;
		margin-bottom:0;
	}
	#intro-section-1 dl dd ul li,
	#intro-section-3 dl dd ul li,
	#intro-section-5 dl dd ul li{
		width:100%;
		float:left;
		font-size: 15px;
		line-height: 24px;
		letter-spacing: -1px;
	}
	#intro-section-5{
		height:auto;
	}
	#intro-section-5 .content-box{
		height:auto;
		padding:50px 25px;
	}
	#intro-section-5 .content-box .box-img > img{
		margin-top:35px;
		width:auto; height:auto;
	}


}
/* desktop 설정 ============================================================= */
@media (min-width:1025px){

	/* 공통 section 설정 */
	#intro-section-content{
	}
	#intro-section-content .content-box{
		padding:0 25px 0;
		height:400px;
	}

	.content-box .box-text{
		display:table;
		height:400px;
	}
	.content-box .box-img{
		display:block;
		vertical-align: bottom;
	    height: 400px;
	    line-height: 400px;
	}
	.content-box dl{
		display:table-cell;
		vertical-align: middle;
	}
	.content-box dl dt{
		padding:0 0 25px 0;
		font-size:34px;
		letter-spacing: -0.5px;
	}
	.content-box dl dd{
		font-size:16px;
	}
	.content-box dl dd:last-child{
		margin-bottom:0px !important;
	}

	/* 선택 section 설정 */
	#intro-section-1 .content-box .box-img > img{
		vertical-align:bottom;
		width:270px; height:460px;
		margin-top:90px;
	}
	#intro-section-1 dl dd ul li,
	#intro-section-3 dl dd ul li{
		width:50%;
		font-size:16px;
		line-height:26px;
	}
	#intro-section-5 dl dd ul li{
		width:100%;
		font-size:16px;
		line-height:26px;
	}
	#intro-section-1 dl dd ul li .list-row,
	#intro-section-3 dl dd ul li .list-row,
	#intro-section-5 dl dd ul li .list-row{
		display:block;
		padding:0 0 0 7px;
	}
	#intro-section-5{
		height:auto;
	}
	#intro-section-5 .content-box{
		height:auto;
		padding:50px 25px;
	}
	#intro-section-5 .content-box .box-img > img{
		margin-top:35px;
	}

}



/* mobile 설정 ============================================================== */
@media (max-width: 768px){

}

/* 중간 mobile 설정 ========================================================= */
@media (min-width:550px){

}

/* tablet 설정 ============================================================== */
@media (min-width:768px){

	/* 레이아웃 설정 ********************************************************* */
	.layout-col-1, .layout-col-2, .layout-col-3, .layout-col-4, .layout-col-5, .layout-col-6, .layout-col-7, .layout-col-8, .layout-col-9, .layout-col-10, .layout-col-11, .layout-col-12{
		float:left;
		}
	.layout-col-1{width:8.33333333%;}
	.layout-col-2{width:16.66666667%;}
	.layout-col-3{width:25%;}
	.layout-col-4{width:33.33333333%;}
	.layout-col-5{width:41.66666667%;}
	.layout-col-6{width:50%;}
	.layout-col-7{width:58.33333333%;}
	.layout-col-8{width:66.66666667%;}
	.layout-col-9{width:75%;}
	.layout-col-10{width:83.33333333%;}
	.layout-col-11{width:91.66666667%;}
	.layout-col-12{width:100%;}


}

/* desktop 설정 ============================================================= */
@media (min-width:1025px){


}
