@charset "UTF-8";

html {font-size: 20px;}
body {font-size: 1rem; background: linear-gradient(to bottom, #cff4e1, #fff9d9); font-family: 'Noto Sans KR', sans-serif; color:#444; font-weight: 500;} 
#wrap {background: url(/images/nmngCntst//bg.png) no-repeat bottom left; background-size:cover; padding-bottom: 5rem; min-height: 100vh;}

.in {width: 1100px; margin: 0 auto;}
.font-green01 {color: #18a94c;}
.font-green02 {color: #0d803f;}
.font-orange {color: #fe5a00;}
.font-red {color: #ff5353;}
.font-blue {color: #073e73;}
.font-medium {font-weight: 500 !important;}
.text-center {text-align: center;}

a:focus {outline: 1px solid #000; margin: 0;}
input[type="text"]:focus,
textarea:focus,
select:focus {outline: 1px solid #000;}

table {width: 100%; text-align: center;}
table caption {display:block; overflow:hidden; font-size:0; line-height:0; text-indent:-9999px;}
table th,
table td {padding: .5rem; vertical-align: middle;}
table th {color: #444;}
table thead th {background: #aadebd; font-weight:700; border-right:1px solid #fff;}
table thead th:last-child {border-right: 1px solid #aadebd;}
table tbody tr:first-child th {border-top: 1px solid #d3eddd;}
table tbody tr:first-child td {border-top: 1px solid #ddd;}
table tbody th {background: #d3eddd; border-bottom: 1px solid #fff;}
table tbody td {border-left: 1px solid #ddd; border-bottom: 1px solid #ddd; text-align: left;}
table tbody td:last-child {border-right: 1px solid #ddd;}
table tbody tr:last-child th {border-bottom: 1px solid #d3eddd;}
table th.star::after {content: '*'; display: inline-block; color: #ff5353; margin-left: .1rem;}
table.regist th,
table.regist td {padding: .3rem;}
.tableInfo {color: #ff5353; font-size: .7rem; letter-spacing: -.05rem; margin-top: .2rem;}

.btnWrap {text-align: center; margin-top: 2.5rem;}
.btnWrap > .btn {margin: .35rem .25rem;}
.btn {display: inline-block; background: linear-gradient(to right, #fd5200, #fe7508, #fd5200, #fe7508); background-size:300% 100%; color: #fff; font-size: 1.1rem; font-weight: 700; letter-spacing: -.05rem; padding: .5rem 3rem; border-radius: 1.5rem; border: 5px solid #fd3a00; transition: background-position .4s ease-in-out;}
.btn.sub {background: #ddd linear-gradient(to right, #ddd, #eee, #ddd, #eee); background-size:300% 100%; border: 5px solid #dcdcdc; color: #666;}
.btn:hover,
.btn:focus {background-position:100% 0%;}
.btn span::after {content: ''; display: inline-block; width: .7rem; height: .65rem; background: url(/images/nmngCntst//btnArrow.png) no-repeat; background-size: 100%; margin-left: .5rem; margin-bottom: .07rem;}
.btn.sub span::before {content: ''; display: inline-block; width: .7rem; height: .65rem; background: url(/images/nmngCntst//subbtnArrow.png) no-repeat; background-size: 100%; margin-right: .5rem; margin-bottom: .07rem; transform: rotate(180deg);}
.btn.sub span::after {display: none;}
.btnText {font-size: .9rem; font-weight: 900; margin-bottom: .7rem;}

.logo {display: flex; justify-content: space-between; padding-top: 1.25rem;}

.title {text-align:center; margin-top: 65px; position: relative;}
.title::after {content:''; display: block; width: 9.5rem; height: 13.5rem; background: url(/images/nmngCntst//leaf.png) no-repeat; background-size: 100%; position: absolute; top: 10px; right: -50px;}
.title .sub {font-size: 1.15rem; color: #fff; font-weight: 700; background: #fe8b2f; padding: 0.2rem 1.5rem; border-radius: 10px; letter-spacing: -.04rem;}
.title h2 {font-size: 2.8rem; font-weight: 900; margin-top: 1rem; letter-spacing: -.07rem;}
.title .date {font-size: 1.25rem; color: #5b5b5b; font-weight:700; letter-spacing: -.04rem; position: relative; z-index: 1;}
.title .date strong {font-size: 1.8rem;}

.body01 {padding-top: 240px; position: relative;}
.body01::before {content: ''; display: block; width:700px; height: 220px; background: url(/images/nmngCntst//people.png) no-repeat; position: absolute; top:30px; left: 50%; transform: translateX(-50%); background-size: 100%;}
.body01 .in {border-radius: 1rem; background: #00992b url(/images/nmngCntst//pattern.png); padding: 25px; box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;}
.body01 .content {border-radius: 1rem; background: #fff; padding: 2.5rem 3rem;}
.body01 table {font-size: .9rem;}

.body02 {margin-top: 2.5rem;}
.body02 .in {background: #fff; border-radius: 1rem; padding: 2.5rem 4rem; box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;}
.body02 table {font-size: .8rem;}
.body02 table th {font-weight: 700;}

.body03 {margin-top: 2.5rem;}
.body03 .in {background: #fff; border-radius: 1rem; padding: 3rem; box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;}
.body03 table {font-size: .8rem;}
.body03 table th {font-weight: 700;}

.list > li {letter-spacing: -.05rem; padding: .7rem 0; border-bottom: dotted 1px #ddd; display: flex; flex-wrap: wrap; align-items: center;}
.list > li:first-child {padding-top: 0;}
.list > li > span:nth-child(1) {color: #00681b; font-weight: 700;}
.list > li > span:nth-child(1)::before {content: ''; display: inline-block; width: .75rem; height: 1.3rem; background: url(/images/nmngCntst//tree2.png) no-repeat; background-size: 100%; margin-right: .4rem;}
.list > li > span:nth-child(2) {margin-left: 18px; padding-top: .2rem; padding-bottom: .2rem;}
.list > li > span.point {background:#ffd8c3; padding-left: .5rem; padding-right: .5rem;}
.list > li table {margin-top: .5rem;}
.body03 .list > li {font-size: .9rem;}
.body03 .list > li > span:nth-child(1)::before {width: .6rem; height: 1rem;}
.body03 .list > li > span:nth-child(2) {padding-top: 0; padding-bottom: 0;}
.listSub01 {padding-left: .5rem; font-size: .85rem; font-weight: 400; width: 100%;}
.listSub01 li {margin-bottom: .1rem; position: relative; padding-left: .5rem;}
.listSub01 li::before {content: '-'; position: absolute; top: 1px; left: 0; display: block; color: #00681b; margin-right: .25rem;}
.listSub02 {margin-top: .2rem;}
.listSub02 li {margin-bottom: .1rem; position: relative; padding-left: .5rem;}
.listSub02 li::before {content: '·'; position: absolute; top: 1px; left: 0; display: block; color: #00681b; margin-right: .25rem;}

.design {margin-top: 2rem; position: relative;}
.design .notebook {width: 25rem; height: 13.5rem; background: url(/images/nmngCntst//notebook.png) no-repeat; margin: 0 auto; position: relative; background-size: 100%;}
.design .notebook .pageImg {position: absolute; top: .65rem; left: 3.85rem; overflow:hidden; width: 17.5rem; height: 11.5rem;}
.design .notebook .pageImg img {width: 100%; height: 100%; transition: .2s;}
.design .notebook .pageImg:hover img,
.design .notebook .pageImg:focus img {transform: scale(1.1);}
.design .notebook .pageMore {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; font-weight: 700;}
.design .notebook .pageMore::before {content:''; display: block; width:1.75rem; height: 1.75rem; background: url(/images/nmngCntst//plus.png) no-repeat; margin: 0 auto; margin-bottom: .5rem; background-size: 100%;}
.design > img {position: absolute;}
.design > img:nth-of-type(1) {top: 8rem; left: 7%;}
.design > img:nth-of-type(2) {top: 6rem; right: 15%;}
.design > img:nth-of-type(3) {top: 5rem; left: 15%;}
.design > img:nth-of-type(4) {top: 7.5rem; right: 5%;}
.tit01 {color: #0d803f; font-weight: 900; font-size: 1.25rem; letter-spacing: -.08rem; margin-top: 2.5rem;}
.tit01.border {border-bottom: 3px solid #006e25; padding-bottom: .5rem;}
.tit01:nth-of-type(1) {margin-top: 0;}
.tit01::before {content: ''; display: inline-block; width: .9rem; height: 1.5rem; background: url(/images/nmngCntst//tree2.png) no-repeat; background-size: 100%; margin-right: .5rem;}
.tit02 {font-weight: 900; margin: 1rem 0 .3rem;}

.scrollBox {border: 1px solid #ddd; border-top: 3px solid #006e25; background: #f9f9f9; height: 11.5rem; margin-top: .5rem; padding: 1rem; overflow-y: scroll; font-size: .85rem; color: #666; letter-spacing: -.03rem; line-height: 1.6;}
.scrollBox  table {font-size: .85rem; color: #666; letter-spacing: -.03rem; line-height: 1.6;}
.scrollBox  table th,
.scrollBox  table td {padding: .2rem .5rem;}
.scrollBox  table td {background: #fff;}

.textList01 {font-weight: 400;}
.textList01 > li {padding-left: .5rem; position: relative; margin-bottom: .4em;}
.textList01 > li:last-child {margin-bottom: 0;}
.textList01 > li::before {content: ''; display: block; width: 5px; height: 5px; background: #0d803f; position: absolute; top: .5rem; left: 0;}
.textList01 > li .tit {color: #333; font-weight: 700;}
.textList01 .textSub01 > li {position: relative; padding-left: .5rem;}
.textList01 .textSub01 > li::before {content: '-'; display: block; position: absolute; top:0; left: 0;}
.textList01 .textSub02 > li {position: relative; padding-left: .5rem;}
.textList01 .textSub02 > li::before {content: '·'; display: block; position: absolute; top:0; left: 0;}

.textList02 {font-weight: 400;}
.textList02 > li {margin-bottom: .4em;}
.textList02 > li:last-child {margin-bottom: 0;}
.textList02 > li .tit {color: #333; font-weight: 700;}
.textList02 .textSub01 {padding-left: .5rem;}
.textList02 .textSub01 > li {position: relative; padding-left: .5rem;}
.textList02 .textSub01 > li::before {content: '-'; display: block; position: absolute; top:0; left: 0;}
.textList02 .textSub02 {padding-left: .5rem;}

.agree {margin-top: .2rem; font-size: .8rem; text-align: right;}

.ckbox {position: relative; display: inline-block; word-break: break-all;}
.ckbox input[type="checkbox"] {width: 20px; height: 20px; position: absolute; top: 5px; left: 0;}
.ckbox input[type="checkbox"]:focus {outline: 0;}
.ckbox input[type="checkbox"] + label {cursor: pointer; vertical-align: middle; padding-left: 25px; word-break: break-all;}
.ckbox input[type="checkbox"] + label::before {content: ''; display: inline-block;width: 20px; height: 20px; border: 1px solid #ddd; cursor: pointer; vertical-align: middle; position: absolute; top: 5px; left: 0; z-index: 1; background: #fff;}
.ckbox input[type="checkbox"]:checked + label::before {background: #0d803f url(/images/nmngCntst//check.png) no-repeat center;}
.ckbox input[type="checkbox"]:focus + label::before {outline: 1px solid #000;}

input[type="text"],
select {width: 350px; height: 30px; border: 1px solid #ddd; padding: 0 .5rem; background: #fff; font-size: 14px; font-family: 'Noto Sans KR', sans-serif; color: #444;}
select {background: url(/images/nmngCntst//selectArrow.jpg) no-repeat center right;}
textarea {width: 100%; border: 1px solid #ddd; resize: none; display: block; padding: .5rem; font-family: 'Noto Sans KR', sans-serif; font-size: 14px; color: #444; letter-spacing: 0;}
.inputGroup span {margin: 0 .1rem; font-size: .7rem;}
.inputGroup.col3 input[type="text"],
.inputGroup.col3 select {width: 120px;}
.formInfo {font-size: .7rem; letter-spacing: -.05rem;}

.result {text-align: center;}
.result p {font-size: 2rem; margin-top: .5rem; font-weight: 900; letter-spacing: -.05rem;}
.result p:last-of-type {font-size: .9rem; margin-top: 1rem; font-weight: 500; background: #ffd8c3; display: inline-block; padding: .5rem 1.5rem; border-radius: 10px;}
.deadline {text-align: center; letter-spacing: -.05rem;}
.deadline p:nth-of-type(1) {font-size: 2.5rem; margin-top: .5rem; font-weight: 900;}
.deadline p:nth-of-type(2) {font-size: 1.5rem; margin-top: .5rem; font-weight: 700;}
.deadline p:nth-of-type(3) {font-size: .9rem; margin-top: 1rem; font-weight: 500; background: #ffd8c3; display: inline-block; padding: .5rem 1.5rem; border-radius: 10px;}

@media screen and (max-width:1200px) {
	html {font-size: 18px;}
	.in {width: 90%;}

	.ckbox input[type="checkbox"] {width: 15px; height: 15px; top: 6px; left: 1px;}
	.ckbox input[type="checkbox"] + label::before {width: 15px; height: 15px;}

	.logo h1:nth-child(1) img {width: 80px;}
	.logo h1:nth-child(2) img {width: 150px;}
	.title {margin-top: 50px;}
	.title::after {right: 0;}
	.body01 {padding-top: 165px;}
	.body01::before {width: 500px; top: 15px;}
}

@media screen and (max-width:1000px) {
	.design > img:nth-of-type(1) {left: 3%;}
	.design > img:nth-of-type(2) {right: 12%;}
	.design > img:nth-of-type(3) {left: 10%;}
	.design > img:nth-of-type(4) {right: 0;}
}

@media screen and (max-width:900px) {
	.design > img {display: none;}
	table.regist colgroup {display: none;}
	table.regist th,
	table.regist td {display: block;}
	input[type="text"] {width: 100%;}
	.inputGroup {display: flex; display: -ms-flexbox; flex-wrap: nowrap; -ms-flex-wrap: nowrap; line-height: 30px;}
	.inputGroup > input[type="text"],
	.inputGroup > select {flex-grow: 1; -webkit-box-flex: 1; -ms-flex: 1; width: 100% !important;}
}

@media screen and (max-width:700px) {
	#wrap {padding-bottom: 60px;}
	.design .notebook {width: 300px; height: 162px;}
	.design .notebook .pageImg {width: 210px; height: 140px; top: 6px; left: 45px;}
	.design .notebook .pageMore {font-size: 14px; width: 100%; text-align: center;}
	.design > img {display: none;}
}

@media screen and (max-width:600px) {
	html {font-size: 16px;}

	.logo h1:nth-child(1) img {width: 60px;}
	.logo h1:nth-child(2) img {width: 120px;}
	.title {margin-top: 30px;}
	.title::after {display: none;}
	.title .sub {font-size: 15px; padding-left: 10px; padding-right: 10px;}
	.title h2 {font-size: 30px; margin-top: 8px;}
	.title h2 span {display: block;}
	.title .date {font-size: 16px;}
	.title .date strong {font-size: 18px;}
	.body01 {padding-top: 100px;}
	.body01::before {width: 300px; top: 10px;}
	.body01 .in {padding: 15px;}
	.body01 .content {padding: 30px 20px;}
	.body02 {margin-top: 30px;}
	.body02 .in {padding: 30px 20px;}
	.body03 .in {padding: 25px;}
	.body03 .list > li {font-size: 15px; padding: 10px 0;}
	.listSub01 {font-size: 14px;}
	.list > li {padding: 7px 0;}
	.listSub01 li::before {top: 0;}
	.listSub02 li::before {top: 0;}
	.tit01 {font-size: 18px;}
	.result img {width: 80px;}
	.result p {font-size: 24px;}
	.deadline img {width: 80px;}
	.deadline p:nth-of-type(1) {font-size: 24px;}
	.deadline p:nth-of-type(2) {font-size: 18px;}
}

@media screen and (max-width:425px) {
	.design .notebook {width: 200px; height: 108px;}
	.design .notebook .pageImg {width: 140px; height: 90px; top: 5px; left: 31px;}
	.design .notebook .pageMore {font-size: 14px; width: 100%; text-align: center;}
	.design .notebook .pageMore::before {width: 25px; height: 25px;}
	.btnWrap {margin-top: 30px;}
	.scrollBox table {font-size: 13px;}
	.scrollBox table td,
	.body03 table td {word-break: break-all;}
}