@charset "utf-8";

@font-face {
	font-family:'Noto Sans KR';
	font-style:normal;
	font-weight:300;
	src:url('../fonts/NotoSansKR-Light.eot');/* IE9 Compat Modes */
	src: url('../fonts/NotoSansKR-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		url('../fonts/NotoSansKR-Light.woff2') format('woff2'), /* Super Modern Browsers */
		url('../fonts/NotoSansKR-Light.woff') format('woff'), /* Modern Browsers */
		url('../fonts/NotoSansKR-Light.ttf') format('truetype'), /* Safari, Android, iOS */
		url('../fonts/NotoSansKR-Light.svg#NotoSansKR') format('svg');/* Legacy iOS */
}

@font-face {
	font-family:'Noto Sans KR';
	font-style:normal;
	font-weight:400;
	src:url('../fonts/NotoSansKR-Regular.eot');/* IE9 Compat Modes */
	src: url('../fonts/NotoSansKR-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('../fonts/NotoSansKR-Regular.woff2') format('woff2'), /* Super Modern Browsers */
		 url('../fonts/NotoSansKR-Regular.woff') format('woff'), /* Modern Browsers */
		 url('../fonts/NotoSansKR-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('../fonts/NotoSansKR-Regular.svg#NotoSansKR') format('svg');/* Legacy iOS */
}
@font-face {
	font-family:'Noto Sans KR';
	font-style:normal;
	font-weight:500;
	src:url('../fonts/NotoSansKR-Medium.eot');/* IE9 Compat Modes */
	src: url('../fonts/NotoSansKR-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('../fonts/NotoSansKR-Medium.woff2') format('woff2'), /* Super Modern Browsers */
		 url('../fonts/NotoSansKR-Medium.woff') format('woff'), /* Modern Browsers */
		 url('../fonts/NotoSansKR-Medium.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('../fonts/NotoSansKR-Medium.svg#NotoSansKR') format('svg');/* Legacy iOS */
}
@font-face {
	font-family:'Noto Sans KR';
	font-style:normal;
	font-weight:700;
	src:url('../fonts/NotoSansKR-Bold.eot');/* IE9 Compat Modes */
	src: url('../fonts/NotoSansKR-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('../fonts/NotoSansKR-Bold.woff2') format('woff2'), /* Super Modern Browsers */
		 url('../fonts/NotoSansKR-Bold.woff') format('woff'), /* Modern Browsers */
		 url('../fonts/NotoSansKR-Bold.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('../fonts/NotoSansKR-Bold.svg#NotoSansKR') format('svg');/* Legacy iOS */
}

@font-face {
	font-family:'SeoulNamsan';
	font-style:normal;
	font-weight:400;
	src:url('../fonts/SeoulNamsan.eot');/* IE9 Compat Modes */
	src:url('../fonts/SeoulNamsan.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
			 url('../fonts/SeoulNamsan.woff2') format('woff2'), /* Super Modern Browsers */
			 url('../fonts/SeoulNamsan.woff') format('woff'), /* Modern Browsers */
			 url('../fonts/SeoulNamsan.ttf') format('truetype'), /* Safari, Android, iOS */
			 url('../fonts/SeoulNamsan.svg#SeoulNamsan') format('svg');/* Legacy iOS */
}
@font-face {
	font-family:'SeoulNamsan';
	font-style:normal;
	font-weight:700;
	src:url('../fonts/SeoulNamsanB.eot');/* IE9 Compat Modes */
	src:url('../fonts/SeoulNamsanB.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
			 url('../fonts/SeoulNamsanB.woff2') format('woff2'), /* Super Modern Browsers */
			 url('../fonts/SeoulNamsanB.woff') format('woff'), /* Modern Browsers */
			 url('../fonts/SeoulNamsanB.ttf') format('truetype'), /* Safari, Android, iOS */
			 url('../fonts/SeoulNamsanB.svg#SeoulNamsanB') format('svg');/* Legacy iOS */
}

*{box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;margin: 0;padding: 0;}

body{
	font-family:'Noto Sans KR','Malgun Gothic',dotum, Arial, Helvetica, sans-serif;
	line-height: 1.5;
  color: #222;
  font-size: 16px;
  font-weight: 400;
	letter-spacing: -0.05em;
  background: #fff;
	-webkit-text-size-adjust:none;
  -webkit-font-smoothing: antialiased;
}

.sr-only {position: absolute;width: 1px;height: 1px;margin: -1px;padding: 0;overflow: hidden;clip: rect(0, 0, 0, 0);border: 0;}

/*** 설문조사 ***/
body.research {background: #f9f9f9}
.wrap-research {width: 100%;max-width: 1024px;margin: 0 auto;padding: 60px 0;}
.wrap-research * {word-break: keep-all;}
.wrap-research h1 {position: relative;margin-bottom: 20px;padding-left: 44px;color: #333;font-size: 2.25rem;font-weight: 700;}
.wrap-research h1:before {content: '';position: absolute;top: 10px;left: 0;width: 33px;height: 33px;background: url(../images/sub/ico-survey-title.png) no-repeat 0 0;}
.wrap-research h1 span {color: #4781ff;}

.con_tit .img_box {display: block; width: 100%;}
.con_tit .img_box img {width: 100%;box-shadow: 3px 2px 5px rgba(0,0,0, .1);border-radius: 10px;}
.con_tit .img_box img.pc {display: block}
.con_tit .img_box img.mo {display: none}

/* input */
.wrap-research .content {margin: 50px 0 0;box-shadow: 3px 2px 5px rgba(0,0,0, .1);border-radius: 10px;background: #ffffff;}
.wrap-research .content .content_tit {display: flex;justify-content: space-between;align-items: center;padding: 20px 40px;background: #e5f3ff;}
.wrap-research .content .content_tit p {color: #4781ff;font-size: 18px;font-weight: 600;}
.wrap-research .content .content_tit p.period {font-size: 16px;text-decoration: underline;text-underline-offset: 5px;}
.wrap-research .content .content_tit p.period span {display: inline-block;width: 23px;height: 21px;margin-right: 5px;text-indent: -999999em;background: url(../images/sub/ico-survey-cal.png) no-repeat 0 0;line-height: 1;}
.wrap-research .content form {padding: 10px 40px 50px;}

.wrap-research .content form .disabled * { color: #ccc !important; }
.wrap-research .content h2 {margin: 0px 0 5px;padding-left: 20px;text-indent: -20px;font-size: 1.25rem;}
.wrap-research .content h2>span {color: #4781ff;}

.wrap-research .content .explain {margin: 0 0 10px 35px;}
.wrap-research .content form > div {margin-top: 40px;}
.wrap-research .content ul {margin: 10px 0 0 30px;padding: 0;display: flex;flex-direction: column;align-items: flex-start;justify-content: flex-start;}
.wrap-research .content ul li {display: inline-flex;flex-wrap: wrap;align-items: center;width: 100%;margin: 5px 0;padding: 0;}
.wrap-research .content ul li input.iptTxt {margin: 10px 0;padding-left: 20px;width: 100%;height: 36px;font-size: 16px;border-radius: 5px;border: 1px solid #dedede}
.wrap-research .content ul li span {display: inline-block;margin-left: 10px;color: #4781ff;font-weight: 700;font-size: 14px;vertical-align: middle;}

/* custom input */
input[type='checkbox'],
input[type='radio'] {/* position: absolute;*/top: 0;left: 0;width: 1px;height: 1px;opacity: 0}
input[type='checkbox']:focus + label:before,
input[type='radio']:focus + label:before {outline: 1px dashed #888}

input[type='radio'] + label {display: flex;justify-content: space-between;align-items: center;gap: 20px;position: relative;min-width: 300px;padding: 5px 20px;border: 1px solid #d7d7d7;border-radius: 5px;cursor: pointer}
input[type='radio'] + label:after { content: ''; display: inline-block; width: 18px; height: 18px; background: #fff; border: 1px solid #dedede; border-radius: 50%; vertical-align: middle;flex-shrink: 0;}
input[type='radio'] + label span { display: inline-block; vertical-align: middle; margin-left: 10px;font-size:inherit;color: inherit;}
input[type='radio']:checked + label {background: #e5f3ff;border: 1px solid #4781ff;}
input[type='radio']:checked + label:after { border: 1px solid #797979; background: #fff url(../images/common/bg_radio_checked.png) no-repeat center center;}
/*input[type='checkbox'] { display: none;}*/

input[type='checkbox'] + label {display: flex;justify-content: space-between;align-items: center;position: relative;gap: 20px;min-width: 300px;padding: 5px 20px;border: 1px solid #d7d7d7;border-radius: 5px;cursor: pointer}
input[type='checkbox'] + label:after { content: ''; display: inline-block; width: 16px; height: 16px; vertical-align: middle; background-color: #fff; border: 1px solid #dddddd;flex-shrink: 0;}
input[type='checkbox']:checked + label:after { content: ''; display: inline-block; width: 16px; height: 16px; vertical-align: middle; background: #fff url("../images/common/icon_input_checked.png") no-repeat center center; border: 1px solid #767676;}
input[type='checkbox'] + label span { vertical-align: middle; margin-left: 10px;font-size: inherit;}

.wrap-research .banner_box img {display: flex;justify-content: center;margin: 10px 0 0 35px;width: 100%;max-width: 400px;border: 1px solid #d5d5d5;padding: 10px;}

.wrap-research .btn-area {display: flex;justify-content: center;margin: 40px 0 50px;}
.wrap-research .btn-area .btn2 {display: flex;align-items: center;gap: 10px;padding: 20px 50px;background: #4781ff;box-shadow: 2px 2px 1px #3971eb;border-radius: 5px;color: #fff;text-decoration: none;font-size: 18px;}
.wrap-research .btn-area .btn2:before {content: '';width: 22px;height: 22px;background: url(../images/sub/ico-survey-chk.png) no-repeat 0 0}
.wrap-research .btn-area .btn-close {padding: 10px 25px;font-size: 22px;font-weight: 700;}
.wrap-research .btn-area .btn-close:before {display: none}
.wrap-research .btn-area .btn-close:after {content: '';width: 18px;height: 18px;background: url(../images/sub/ico-survey-close.png) no-repeat 0 0}

/* 동의 */
.agree-area input[type='checkbox'] + label {justify-content: center;border: 0;font-size: 1.5em;}
.agree-area input[type='checkbox'] + label:after {display: none}
.agree-area input[type='checkbox'] + label:before {content: ''; display: inline-block; width: 24px; height: 24px;margin-right: 10px; vertical-align: middle; background-color: #fff; border: 1px solid #dddddd;flex-shrink: 0;}
.agree-area input[type='checkbox']:checked + label:before {background: #fff url("../images/common/icon_input_checked2.png") no-repeat center center; border: 1px solid #5188fe;}

#postLayer {background: #fff;}

/* 완료 메세지 */
#copyBox {width: 100%;height: calc(100vh - 120px);display: flex;align-items: center;justify-content: center;flex-direction: column;gap: 20px;}
#copyBox img {width: 100%;max-width: 325px;}
#copyBox p {display: flex;align-items: center;gap: 10px;font-size: 32px;font-weight: 700;text-align: center;word-break: keep-all}
#copyBox p:before {display: none;content: '';width: 33px;height: 33px;background: url(../images/sub/ico-survey-title.png) no-repeat 0 0;flex-shrink: 0;}

@media (max-width: 1100px) {
	.wrap-research {padding: 30px 20px}
}

@media (max-width: 860px) {
	.wrap-research {padding: 30px 20px}
	.wrap-research h1 {font-size: 1.5rem;padding-left: 32px;}
	.wrap-research h1:before {top: 5px;width: 28px;height: 28px;background-size: 100% auto;}
	.wrap-research .content {margin: 25px 0}
	.wrap-research .content .content_tit {flex-direction: column;align-items: flex-start;gap: 10px;padding: 20px;}
	.wrap-research .content form {padding: 10px 20px 20px 10px;}
	.wrap-research .content form > div {margin-top: 20px}

	.wrap-research .content h2 {font-size: 1rem;padding-left: 25px;text-indent: -25px;}
	.wrap-research .content .explain {margin-left: 25px;font-size: 0.875rem}
	.wrap-research .content ul {margin-left: 25px;}
	.wrap-research .content label {font-size: 0.8725rem}
	.wrap-research .content .content_tit p {font-size: 1rem}

	input[type='radio'] + label,
	input[type='checkbox'] + label {min-width: 100%;padding-left: 10px;}
	.wrap-research .content ul li input.iptTxt {font-size: 0.8725rem;padding-left: 10px;}
	.wrap-research .banner_box img {margin: 0 0 0 25px;width: calc(100% - 25px)}
}
@media (max-width: 640px) {

	.wrap-research h1 {font-size: 1.25rem;}
	.wrap-research h1:before {top: 0px;}
	.con_tit .img_box img.pc {display: none}
	.con_tit .img_box img.mo {display: block}

	/* 우편번호 팝업창 */
	#postLayer {width: 96% !important;height: 90% !important;top: 5% !important;left: 2% !important}

	/* 동의 */
	.agree-area input[type='checkbox'] + label {font-size: 18px}

	/* 완료 메세지 */
	#copyBox p {display: flex;align-items: center;gap: 10px;font-size: 20px;}
}

@media (max-width: 360px) {
	/* 완료 메세지 */
	#copyBox p {font-size: 16px}
}

/* 예외처리 */
#wrap.research-85 input[type='radio'] + label,
#wrap.research-85 input[type='checkbox'] + label {min-width: 580px}