@charset "utf-8";
@font-face { font-family: 'S-CoreDream-3Light'; font-weight: normal; font-style: normal; 
	src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-3Light.woff') format('woff'); }
@font-face { font-family: 'S-CoreDream-6Bold'; font-weight: normal; font-style: normal; 
	src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-6Bold.woff') format('woff'); }
@font-face { font-family: 'S-CoreDream-9Black'; font-weight: normal; font-style: normal; 
	src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-9Black.woff') format('woff');}

/* CSS Document */
* { box-sizing: border-box;}
html, body {background-color: #f0f3f4;}
body{ font-family: 'S-CoreDream-3Light','Nanum Gothic', '나눔고딕', 'Malgun Gothic','맑은 고딕', sans-serif;}
#wrap {width: 100%;max-width:720px;margin:0 auto;text-align:center;position:relative;padding-top: 1px;margin-top: -1px;}
#main_contents {width:100%;min-width:320px;margin: 0 auto;vertical-align:top;}
.contents_box { width:96%; padding:0 2%; margin:0 auto; }

.Bg{background: #fff;background-size:18%;}
.tit_box{text-align: center;margin: 0 auto;overflow: hidden;position: relative;}
.tit_box h2{margin: 0 auto;display: block;font-family: 'S-CoreDream-6Bold';font-size: 4em;line-height: 1.2em;letter-spacing: -0.05em;color: #111;}

/* footer */
.footer{padding: 25px 0;}
.footer p.copyright{text-align:center;text-transform: uppercase;color:#555;font-size: 1.8em;line-height: 1.4em;}

/* main */
.main { background: #00acef; }
.main .tit_box {padding: 5em 5em 0em 5em;overflow: inherit;position: initial; min-height: inherit;}
.main .tit_box h2{font-family: 'S-CoreDream-6Bold'; font-size:4.5em;line-height: 1.2em;color: #111;}
.main .tit_box h2 b{color:#d91c5c;}
.main .contents_box{padding: 3em 2%;}
.main .pic{margin: 5em auto 2em auto;}
.main #main_contents{background: #00acef; }
.main .txtBox{margin: 0 auto;}
.main .txtBox .tit{color: #fff;font-size: 35px;line-height: 1.4em;margin-bottom: 0.5em;text-align: center;}
.main .txtBox .txt{color: rgba(255,255,255,0.8);line-height: 1.2em;font-size: 25px;text-align: center;}

/* button */
.button_area{ overflow: hidden}
.button_area .button{width:48%;float: left;/* font-size: 25px; *//* height: 60px; *//* line-height: 60px; */border-radius: 10px;}
.button_area .button + .button{float:right;}
.button{background-color: #00abef;border-color: #00abef;font-size: 42px;width: 95%;height: 100px;line-height: 100px;border-radius:10px;color: #fff !important;font-weight: 700; font-family: 'S-CoreDream-6Bold';}
.button:hover, .button:active, .button:focus{ background-color:#222; border-color:#222; color:#fff;}
.main .button{background-color: #fff;border-color: #fff;color: #00abef !important;/* left: 2%; *//* bottom: 20px; *//* position: absolute; */}
.main .button:hover, .main .button:active, .main .button:focus{ background-color:#222; border-color:#222; color:#fff;}

.sub{ background:#f0f3f4;}

/* header */
.header {width:100%;position:fixed;z-index:9;background-color: #00adef;margin: 0 auto;}
.header .menu_area{max-width:720px;width:96%;padding:0;/* height: 60px; */margin:0 auto;position: relative;}
.header img {margin: 0 auto;padding: 10px 0;/*height: 70px;*/}
.header h1{margin:0;padding:0;text-align: center;font-family: 'S-CoreDream-6Bold';color: #fff;font-size: 1.5em;letter-spacing: -0.05em;}

.sub #main_contents{padding: 10em 0 3em 0;max-width: 720px; height: 100%;background: #fff;}
.sub .pic img{width: 290px;margin-bottom: 20px;}
.sub .tit_box{margin-bottom: 1.5em;/* border-bottom: 3px double #00acef; */padding-bottom: 1.5em;}
.sub .tit_box:after{content:'';display: block;width: 80px;height:5px;background: #00abef;margin: 35px auto 0px auto;}
.sub .txtBox{margin-bottom: 20px;}


.complet{font-size: 33px;text-align: center;display: block;padding: 25px 0;border-radius: 50px;color: #222;margin: 50px 0;}
.complet strong{color: #0080ef;font-size:33px;font-family: 'S-CoreDream-6Bold';}


input[type="checkbox"],
input[type="radio"] {width: 24px;height: 24px;border:0 !important;margin-right: 14px;margin-top:-1px;cursor:pointer;display: inline-block;vertical-align: middle;}

 /* 체크박스 기본 */
input[type="checkbox"] {background-image: none !important;position: relative;}
input[type="checkbox"]:before {content:'';display: block;width: 27px;height: 27px;background:#fff;border: 1px solid #a8a8a8;}
input[type="checkbox"]:after {content:'';display: block;width: 14px;height: 14px;background:#a8a8a8;position: absolute;left:50%;top:50%;margin: -4px 0 0 -5px;}
/* 체크박스 체크되었을 때 */
input[type="checkbox"]:checked:before { border-color:#0175ff;}
input[type="checkbox"]:checked:after {background:#0175ff; }
/* 체크박스 비활성화 일 때 */
input[type="checkbox"]:disabled:before{ border-color:#a8a8a8;}
input[type="checkbox"]:read-only:after {background:#a8a8a8; }
/* 체크박스 체크된 상태로 비활성화 일 때 */
input[type="checkbox"]:checked:disabled:before { border-color:#0175ff;}
input[type="checkbox"]:checked:read-only:after {background:#0175ff; }

.notice_box{}
.notice_box li{margin-bottom: 20px;display: block;width:100%;overflow: hidden;}
.notice_box > li label,
.notice_box span.labelTit {clear: both;color: #333;display: inline-block;margin: 10px 0;font-weight: 400;width: 100%;font-size: 2.5em;line-height: 1.4em;text-align: left;font-family: 'S-CoreDream-6Bold';}
.notice_box input[type="text"], 
.notice_box select, 
.notice_box > li textarea{display:block;height: 2.5em;line-height: 1.5em;font-size: 2.5em;border-color:#e6ebed;border-width:2px;width: 100%;}
.notice_box label input[type="radio"] {margin-right: 3px;}
.notice_box > li input + input {margin-top: 5px;}
.notice_box > li input[type="checkbox"], .notice_box > li input[type="radio"] {display: inline-block;}

.notice_box .radioBox{padding: 15px 0;border: 1px solid #ddd;border-width: 1px 0;text-align: left;}
.radioBox {padding:5px 0;}
.radioBox span {display:inline-block;font-size:14px;line-height:20px;}
.radioBox input[type="radio"]:first-child{ margin-left:0;}
.radioBox input[type="radio"] {margin-left:40px;vertical-align:middle;}
.radioBox label {  display: inline !important;  margin: 0; width: auto !important;font-family: 'S-CoreDream-3Light' !important; }

.notice_box .txt_sm{font-size: 20px !important;color: #222;}
.notice_box .txt_sm input{/* text-align: left; */}
.notice_box select{-webkit-appearance: none; -moz-appearance: none; appearance: none; background:#fff url('../images/arrow_select.png'); background-repeat: no-repeat; background-position: right 1rem center;}
.notice_box select::-ms-expand { display: none;}
.notice_box .txt_sm label {visibility:visible;font-size: 1.5em;display: inline-block;font-weight: 500;color: #666;}
.notice_box .txt_sm a{font-size:22px;line-height: 1em;color: #4b6a89;margin-top: 7px;display: inline-block;font-weight: 500;position: relative;margin-left: 15px;vertical-align: top;}
.notice_box .txt_sm a:after{content:'';display:inline-block;width:100%;height: 1px;border: 1px solid#4b6a89;position: absolute;bottom: -3px;left: 50%;margin-left: -120px;-webkit-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s;}
.notice_box .txt_sm a:hover{ color:#0175ff;}
.notice_box .txt_sm a:hover:after{border-color:#0175ff;}

.sub .txtBox .agreeList{background: #f0f3f4;margin-bottom: 0;padding: 15px;}
.sub .txtBox .agreeList li{text-align:left;font-size: 1.5em;margin-bottom:10px;line-height:1.2em;position: relative;padding-left:15px;}
.sub .txtBox .agreeList li:last-child{margin-bottom:0;}
.sub .txtBox .agreeList li:before{content:'';display: block;width:6px;height: 2px;background:#555;position: absolute;left: 0;top: 13px;}
.sub .txtBox .agreeArea{padding: 10px 0 25px 0;border-bottom:2px solid #f0f3f4;overflow:hidden;}
.sub .txtBox .agreeArea label{width:auto;margin:0;font-family: 'S-CoreDream-3Light';letter-spacing: -0.05em;}


@media only screen and (max-width:720px) {
	html, body {height: 100%;}
	#wrap {width: 100%;max-width:720px;}
	.main { height: 100%;}
	.main .tit_box{ height:75%;}
	.main #main_contents{ height:25%;}

	.main .button{position:absolute;left:2%;bottom: 20px;}
	/*.end .button{position:absolute;left:2%;bottom: 12%;}*/
	
	.end {height: 100%;}
	.end #main_contents{height: 90%;}
	.end .footer{height: 10%;}
}
	
