@charset "UTF-8"; /* noto sans kr - Regular 400, medium 500, bold 700 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap'); * { font-family: 'Noto Sans KR', sans-serif; } 
/* reset */
* { box-sizing:border-box; -moz-box-sizing:border-box; --webkit-box-sizing:border-box; -webkit-tap-highlight-color : transparent !important; } 
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video { margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline; font-family:'Noto Sans KR','Apple SD Gothic Neo','Malgun Gothic', sans-serif, Arial } 
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block } 
dl,ul,ol,menu,li { list-style:none } 
blockquote,q { quotes:none } 
blockquote:before,blockquote:after,q:before,q:after { content:''; content:none } 
table { border-collapse:collapse; border-spacing:0 } 
table { padding:0; border:0 } 
th,td { padding:0 } 
body,th,td,input,select,textarea,button { font-family:'Noto Sans KR','MalgunGothic','Dotum','Gulim','Arial',sans-serif; } 
p, a, h1, h2, h3, h4, h5, h6, tr, span, input, textarea, select, caption { font-family:'Noto Sans KR','MalgunGothic','Dotum','Gulim','Arial',sans-serif } 
body,html { -webkit-text-size-adjust:none; font-size:10px; height:100% } 
body { background:#fff; line-height:1.4; color:#000; word-wrap:break-word; } 
fieldset,img { border:0 none } 
img { vertical-align:top } 
a { text-decoration:none; cursor:pointer; color:#000 } 
a:active,a:hover { text-decoration:none } 
input,select,textarea,button { color:#000; vertical-align:top; cursor:pointer } 
button { border:0 none; padding:0; background-color:transparent; cursor:pointer } 
address,caption,cite,code,dfn,em,var { font-style:normal; } 
legend,caption { visibility:hidden; overflow:hidden; position:absolute; top:0; left:0; width:1px; height:1px; font-size:0; line-height:0 } 
textarea { resize:none; outline:none } 
input { outline:none } 
input[type=text]::-ms-clear { display:none } 
input[type='file'] { --webkit-appearance:button; background:transparent; border-radius:0; border:0; cursor:pointer } 
body { -ms-overflow-style:none; background-color:#FFF } 
font b { font-weight: bold; font-family: 'Noto Sans KR', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif, Arial } 
/* Chrome, Safari, Edge, Opera - input type=number 화살표 제거 */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } 
/* input 기본 스타일 초기화 */
input[type='text'], input[type='tel'], input[type='email'] { border: none; background: inherit; -webkit-appearance: none; -moz-appearance: none; appearance: none; } 

/* IE10 이상에서 input box 에 추가된 지우기 버튼 제거 */
input::-ms-clear { display: none; } 

/* input type number 에서 화살표 제거 */
input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: none; appearance: none; } 

.bg_wrap { position: relative; width:100%; height: 100vh; min-height: 850px; background: url(../imgs/img_mask_bg.png) no-repeat center center fixed; background-size: cover; overflow: hidden; } 

.main_wrap { position: relative; width: 100%; height: 100%; } 

section { width: 100%; text-align: center; } 

.main_inner { width: 100%; position: absolute; z-index: 10; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 510px; } 

.main_box { width: 100%; margin-bottom: 20px; box-shadow: 0px 0px 20px #00000029; border-radius: 13px; position: relative;} 

.main_box_new { width: 100%; margin-bottom: 20px; box-shadow: 0px 0px 20px #432F91; border-radius: 13px; position: relative;} 


.box_header { width: 100%; padding: 10px 10px 5px 30px; background: #59DCC9; border-radius: 13px 13px 0 0; } 

.box_header_inner { width: 100%; display: flex; align-items: center; justify-content: space-between; cursor: pointer;} 

.header_tt { display: flex; flex-direction: column; align-items: flex-start; line-height: 30px; } 
.header_tt span { font-size: 19px; font-weight: 500; color: #262626; } 
.header_tt span.bold { font-size: 32px; font-weight: 700; color: #000; } 

.header_img img { width: 210px; } 

.box_contents { width: 100%; background: #FFF; border-radius: 0 0 13px 13px; border: 3px solid #9CFFF1; border-top: 0; min-height: 595px; } 
.box_contents_new { width: 100%; background: #FFF; border-radius:13px 13px 13px 13px; border: 3px solid #432F91; min-height: 595px; } 
.step1_row1 img {margin-top:10px;width:100%;}
.step1_row2_new button { width: 212px; height: 65px; background:#422f91;box-shadow: 0px 3px 6px #00000029; font-size: 18px; font-weight: 700; border-radius: 13px; color:#FFF700;margin-bottom:15px; } 




.box_step_wrap.step1 { width: 100%; padding: 84px 36px 0 36px; } 
.step1_inner { width: 100%; height: 370px; background: #F6F6F6; border-radius: 15px; display: flex; align-items: center; justify-content: center; flex-direction: column; } 
.step1_row1 { display: flex; align-items: center; flex-direction: column; margin-bottom: 25px; } 
.step1_row1 span { font-size: 29px; font-weight: 700; } 

.step1_row2 { width: 100%; text-align: center; margin-bottom: 10px; } 
.step1_row2 button { width: 212px; height: 65px; background: #24C2AB; box-shadow: 0px 3px 6px #00000029; font-size: 18px; font-weight: 700; border-radius: 13px; color:#FFF700 } 

.step1_row3 { width: 100%; text-align: center; } 
.step1_row3 p { font-size: 14px; font-weight: 500; } 
.step1_row3 p em { color: #24C2AB; } 

.step1_bottom { width: 100%; text-align: center; margin-top: 5px; } 
.step1_bottom span { font-size: 13px; color: #888888; font-weight: 500; letter-spacing: -0.3px; } 


.box_step_wrap.step2 { width: 100%; padding: 20px 53px 0 53px; display: none; } 

.step2_row1 { width: 100%; padding: 0 17px; text-align: left; } 
.step2_tt { font-size: 17px; font-weight: 600; margin-bottom: 20px; } 
.step2_tt em { color: #FF0000; } 

.step2_type_wrap { width: 100%; margin-bottom: 29px; } 
.type_inner { width: 100%; height: 56px; display: flex; align-items: center; position: relative; background: #E4E5EA; border-radius: 24px; box-shadow: inset 0px 3px 6px #00000029; } 
.type_item { width: calc(100% / 3); color: #A2A2A2; cursor: pointer; text-align: center; user-select: none; font-size: 19px; font-weight: 700; position: absolute; top: 50%; transform: translate(0, -50%); z-index: 1000; } 
.selector { width: calc(100% / 3); height: 100%; position: absolute; top: 0; left: 0; background: #FFF; border-radius: 10px; transition: transform 0.2s ease; will-change: transform; cursor: pointer; box-shadow: 0px 3px 6px #00000029; border-radius: 24px; border: 2px solid #5FD7C5; text-align: center; font-size: 19px; font-weight: 700; line-height: 52px; color: #333333; } 

.type_inner .type_item:nth-child(1) { left: 0; } 
.type_inner .type_item:nth-child(2) { left: 50%; transform: translate(-50%, -50%); } 
.type_inner .type_item:nth-child(3) { right: 0; } 


.step2_form_inner { width: 100%; background: #FBFBFB; border-radius: 15px; padding: 20px 25px; } 

.step2_form_row { width: 100%; margin-bottom: 30px; text-align: left; } 
.step2_form_row label { font-size: 15px; font-weight: 500; } 
.step2_form_row label em { color: #FF0000; } 
.step2_form_row input { font-size: 19px; font-weight: 500; border-bottom: 1px solid #D5D5D5; padding: 7px 0; width: 100%; margin-top: 5px; } 
.step2_form_row input::placeholder { color: #B1B1B1; font-weight: 400; } 

.step2_form_inner .step2_form_row:nth-child(3) { margin-bottom: 10px; } 
.step2_form_inner .step2_form_row:nth-child(3) input { border-bottom: 2px solid #D5D5D5; } 

.step2_form_row_last { text-align: left; width: 100%; } 
.step2_form_row_last label { font-size: 14px; font-weight: 500; } 
.step2_form_row_last label a { font-size: 14px; font-weight: 400; color: #A5A5A5; margin-left: 3px; } 


.step2_form_row_last { display: flex; align-items: center; } 

.custom_checkbox_label { display: flex; align-items: center; cursor: pointer; } 

.custom_checkbox_label::before { content: ''; display: inline-block; width: 19px; height: 19px; margin-right: 5px; background-color: transparent; background: url('/assets/imgs/checkbox_empty.png') no-repeat center center; background-size: cover; border: none; } 

#agree_submit:checked + .custom_checkbox_label::before { background: url('/assets/imgs/checkbox_green.png') no-repeat center center; background-size: cover; } 

#agree_submit { display: none; } 


#step2_submit_btn { width: 192px; height: 65px; margin-top: 19px; background: #24C2AB; border-radius: 13px; box-shadow: 0px 3px 6px #00000029; font-size: 19px; font-weight: 700; color: #F7FF00; } 

.company_info span { color: #505050; font-size: 10px; font-weight: 500; } 

.fix_kakao_btn{width: 75px; height: 75px;box-shadow: 0px 3px 6px #00000029; position: absolute; background-color: #F9E000; border-radius: 50%; bottom: 0; right: -80px; cursor: pointer;}
.fix_kakao_btn div{width: 100%; height: 100%; position: relative;}
.fix_kakao_btn img{width: 95%; position: absolute; top: 47%; left: 51%; transform: translate(-50%, -50%);}

@media(max-width : 768px){
 .main_inner { width: 350px; min-width: 350px; } 

 .box_header { padding: 20px 10px 25px 22px; } 
 .box_header_inner { display: block; position: relative; } 
 .header_img { position: absolute; top: -10px; right: 2px; } 
 .header_tt{line-height: 25px;}
 .header_tt span { font-size: 15px; } 
 .header_tt span.bold { font-size: 25px; } 
 .header_img img { width: 150px; } 

 .box_contents { min-height: 520px; } 
 .box_contents_new { width: 100%; background: #FFF; border-radius:13px 13px 13px 13px; border: 3px solid #432F91; min-height: 550px; }
 .box_step_wrap.step1 { padding: 84px 20px 0 20px; } 
 .step1_row2_new button {margin-bottom:25px; }

 .step1_inner { height: 284px; } 
 .step1_row1 span { font-size: 25px; } 
 .step1_row2 button { width: 186px; height: 55px; font-size: 16px; } 

 .step1_bottom { display: flex; flex-direction: column; align-items: center; } 
 .step1_bottom span { font-size: 12px; } 

 .box_step_wrap.step2 { padding: 20px 20px 0; } 
 .step2_tt { font-size: 15px; margin-bottom: 15px; } 
 .type_inner { height: 47px; } 
 .type_item { font-size: 16px; } 
 .selector { font-size: 16px; line-height: 42px; } 
 .step2_type_wrap { margin-bottom: 20px; } 

 .step2_form_row label { font-size: 13px; } 
 .step2_form_row input { font-size: 16px; margin-top: 0; padding: 5px 0; } 

 .step2_form_row_last label { font-size: 12px; } 
 .custom_checkbox_label::before, #agree_submit:checked + .custom_checkbox_label::before { width: 16px; height: 16px; } 
 .step2_form_row_last label a { font-size: 12px; } 
 #step2_submit_btn { width: 162px; height: 55px; font-size: 16px; margin-top: 25px; } 
 .company_info span { font-size: 9px; font-weight: 600; } 

 .fix_kakao_btn{width: 55px; height: 55px; right: -10px; bottom: 10px;}
 }