@charset "UTF-8"; /********** 교강사모드 **********/ /* 입학원서 레이아웃 */ #applicationForm{font-family:'NotoKr_R', 'Pretendard-Regular', sans-serif;} #applicationForm section.top{margin-bottom:2rem; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;} #applicationForm section.top h2.top-tit{font-weight:bold; font-size:1.5rem;} #applicationForm section.top p.top-inf{} #applicationForm div.application-form{} #applicationForm div.application-form section.step{} #applicationForm div.application-form section.step div.step-tit{background:#666; color:#fff; padding:1.2rem 1.5rem; border-radius:1rem 1rem 0 0; font-size:1.25rem; font-weight:bold; position:relative; padding-right:6rem;} #applicationForm div.application-form section.step div.step-tit div.step-num{position:absolute; right:1.5rem; font-size:1rem; top:48%; transform:translateY(-50%); font-weight:100; color:#ccc;} #applicationForm div.application-form section.step div.step-tit div.step-num span.current{font-weight:bold; font-size:1.5rem; color:#fff;} #applicationForm div.application-form section.step div.form-wrap{padding:0 1rem;} #applicationForm div.application-form section.step div.btn-wrap{} #applicationForm div.application-form section.step div.btn-wrap a[class^="btn-"]{margin:0 0.5rem; font-size:1.125rem; background:#fff; border-radius:0.5rem; font-weight:600; border:2px solid; padding:1rem 2rem; display:inline-block;} #applicationForm div.application-form section.step div.btn-wrap a.btn-prev{box-shadow:none;} #applicationForm div.application-form section.step div.btn-wrap a.btn-next{background:#333; color:#fff; border-color:#333; box-shadow:0 20px 30px rgba(0,0,0,0.2);} #applicationForm div.application-form section.step div.btn-wrap a.btn-regist{background:#b00100; color:#fff; border-color:#b00100; box-shadow:0 20px 30px rgba(176,1,0,0.2);} #applicationForm div.application-form section.step div.application-last{display:flex; flex-direction:column; gap:2rem; text-align:center; margin-top:1rem; padding-top:3rem;} #applicationForm div.application-form section.step div.application-last input{width:auto;} #applicationForm div.application-form section.step div.application-last p.txt{font-size:1.125rem; word-break:keep-all;} #applicationForm div.application-form section.step div.application-last p.date{} #applicationForm div.application-form section.step div.application-last p.date input{width:5rem;} #applicationForm div.application-form section.step div.application-last p.name{} #applicationForm div.application-form section.step div.application-last p.univ{font-weight:bold; font-size:1.65rem; margin-top:2rem;} /* 입학원서 입력폼 */ #applicationForm div.form-wrap{} #applicationForm div.form-wrap input[type="text"], #applicationForm div.form-wrap input[type="password"], #applicationForm div.form-wrap input[type="number"], #applicationForm div.form-wrap input[type="file"], #applicationForm div.form-wrap input[type="date"], #applicationForm div.form-wrap input[type="email"]{width:auto;} #applicationForm div.form-wrap div.form{display:flex; padding:1rem 0; border-bottom:1px dashed #ddd;} #applicationForm div.form-wrap div.form:last-child{border-bottom:none;} #applicationForm div.form-wrap div.form a.form-btn{width:auto; height:3rem; line-height:3rem; border-radius:0.5rem; font-size:1.125rem; padding:0 1.5rem; display:inline-block; background:#333; color:#fff; box-shadow:0 10px 15px rgba(0,0,0,0.2); transition:0.3s; -webkit-transition:0.3s;} #applicationForm div.form-wrap div.form a.form-btn:hover{transform:translateY(-5px);} #applicationForm div.form-wrap div.form div.tit{width:20%; margin-top:0.8rem; font-size:1.125rem; font-weight:bold;} #applicationForm div.form-wrap div.form div.con{width:80%;} #applicationForm div.form-wrap div.form div.con div.flex{display:flex; align-items:center; flex-wrap:wrap; gap:5px;} #applicationForm div.form-wrap div.form div.con div.chk-list{display:flex; gap:1rem; flex-wrap:wrap;} #applicationForm div.form-wrap div.form div.con div.chk-list div.etc{display:flex; align-items:center; gap:0.5rem; flex-wrap:wrap;} #applicationForm div.form-wrap div.form div.con div.chk-list.col{flex-direction:column; gap:0.25rem;} #applicationForm div.form-wrap div.form div.con div.chk-list.col label.c-input{width:fit-content;} #applicationForm div.form-wrap div.form div.con div.chk-list2{} #applicationForm div.form-wrap div.form div.con div.chk-list2 > label.c-input{display:inline-block; margin-right:1.5rem;} #applicationForm div.form-wrap div.form div.con div.attach-preview{width:9rem; height:10rem; margin-bottom:0.5rem;} #applicationForm div.form-wrap div.form div.con div.attach-preview img{width:100%; height:100%; object-fit:contain;} #applicationForm div.form-wrap div.form div.con.addr .addr01{width:10rem;}/*우편번호*/ #applicationForm div.form-wrap div.form div.con.addr .addr02{width:70%;}/*주소*/ #applicationForm div.form-wrap div.form div.con.addr .addr03{width:100%; margin-top:1rem;}/*상세주소*/ /* 입학원서 약관폼 */ #applicationForm div.term-wrap{} #applicationForm div.term-wrap div.term{padding:1rem; border-bottom:1px solid #ccc;} #applicationForm div.term-wrap div.term div.term-input{position:relative; padding-right:3rem;} #applicationForm div.term-wrap div.term div.term-input label.c-input{font-size:1.25rem; padding-left:2rem; line-height:initial; padding-top:0.5rem;} #applicationForm div.term-wrap div.term div.term-input label.c-input span.esse2{text-wrap:nowrap;} #applicationForm div.term-wrap div.term div.term-input a.term-box-arrow{width:3rem; height:3rem; display:block; background:url("/fro_end/img/ic_arrow01.svg")center/30% auto no-repeat; position:absolute; top:0; right:0; transform:rotate(90deg); border:1px solid #ddd;} #applicationForm div.term-wrap div.term div.term-input a.term-box-arrow.open{transform:rotate(-90deg);} #applicationForm div.term-wrap div.term div.term-input a.term-box-arrow:hover{border-color:#333;} #applicationForm div.term-wrap div.term div.term-box{background:#f5f5f5; height:0; padding:0; overflow:hidden; font-size:1rem;} #applicationForm div.term-wrap div.term div.term-box.open{height:auto !important; padding:1.5rem; margin-top:1rem;} #applicationForm div.term-wrap div.term div.term-box .point{color:blue;} #applicationForm div.term-wrap div.term div.term-box div.set{} #applicationForm div.term-wrap div.term div.term-box p.tit01{font-weight:bold; text-align:center; font-size:1.35em; margin:2rem 0;} #applicationForm div.term-wrap div.term div.term-box p.tit02{font-weight:bold; font-size:1.05em; margin:2rem 0 0.5rem 0;} #applicationForm div.term-wrap div.term div.term-box p.txt01{margin-bottom:0.5rem;} #applicationForm div.term-wrap div.term div.term-box ul.num{} #applicationForm div.term-wrap div.term div.term-box ul.num > li{position:relative; padding-left:1rem; margin:0.32rem 0; color:#000;} #applicationForm div.term-wrap div.term div.term-box ul.num > li:before{content:'0.'; display:block; position:absolute; top:0; left:0;} #applicationForm div.term-wrap div.term div.term-box ul.num > li:nth-child(1):before{content:'1.';} #applicationForm div.term-wrap div.term div.term-box ul.num > li:nth-child(2):before{content:'2.';} #applicationForm div.term-wrap div.term div.term-box ul.num > li:nth-child(3):before{content:'3.';} #applicationForm div.term-wrap div.term div.term-box ul.num > li:nth-child(4):before{content:'4.';} #applicationForm div.term-wrap div.term div.term-box ul.num > li:nth-child(5):before{content:'5.';} #applicationForm div.term-wrap div.term div.term-box ul.num > li:nth-child(6):before{content:'6.';} #applicationForm div.term-wrap div.term div.term-box ul.num > li:nth-child(7):before{content:'7.';} #applicationForm div.term-wrap div.term div.term-box ul.num > li:nth-child(8):before{content:'8.';} #applicationForm div.term-wrap div.term div.term-box ul.num > li:nth-child(9):before{content:'9.';} #applicationForm div.term-wrap div.term div.term-box ul.bar{} #applicationForm div.term-wrap div.term div.term-box ul.bar > li{position:relative; padding-left:1rem; margin:0.5rem 0; text-align:left;} #applicationForm div.term-wrap div.term div.term-box ul.bar > li:before{content:'-'; display:block; position:absolute; top:-2px; left:3px;} #applicationForm div.term-wrap div.term div.term-box > table{font-size:1rem; text-align:center; background:#fff;} #applicationForm div.term-wrap div.term div.term-box > table th{padding:0.5rem; border:1px solid #aaa; background:#eee;} #applicationForm div.term-wrap div.term div.term-box > table td{padding:0.5rem; border:1px solid #aaa;} #applicationForm div.term-wrap div.term div.term ul.term-inf{border:1px solid #ddd; padding:1rem; margin:0.5rem 0;} #applicationForm div.term-wrap div.term div.term ul.term-inf li{font-size:0.95rem; margin-bottom:0.5rem; position:relative; padding-left:0.8rem;} #applicationForm div.term-wrap div.term div.term ul.term-inf li:last-child{margin-bottom:0;} #applicationForm div.term-wrap div.term div.term ul.term-inf li:before{content:''; display:block; width:5px; height:1px; background:#777; position:absolute; top:0.5rem; left:0;} #applicationForm div.term-wrap div.term div.term div.term-chk{background:#f5f5f5; padding:0.5rem; display:flex; align-items:center; justify-content:center; gap:2rem; margin-top:0.5rem;} #applicationForm div.term-wrap div.term div.term div.term-chk div.lab{font-weight:bold; } /* 입학원서 약관폼 전체동의 */ #applicationForm div.term-wrap div.term.all{padding:0; border-bottom:2px solid #333;} #applicationForm div.term-wrap div.term.all div.term-input{border-bottom:none; padding:0.5rem 1rem;} #applicationForm div.term-wrap div.term.all div.term-input label.c-input{font-weight:bold;} #applicationForm div.term-wrap div.term.all div.term-box{font-size:1.25rem; line-height:1.6; padding:1.5rem; margin:1rem 0;} @media screen and (max-width:768px){ /* 레이아웃 */ #applicationForm div.application-form section.step div.step-tit{padding:1rem 1.2rem; padding-right:5rem;} #applicationForm div.application-form section.step div.step-tit div.step-num span.current{font-size:1.25rem;} /* 입학원서 입력폼 */ #applicationForm div.form-wrap div.form{display:block;} #applicationForm div.form-wrap div.form div.tit{width:100%; margin-top:0; margin-bottom:0.5rem;} #applicationForm div.form-wrap div.form div.con{width:100%;} #applicationForm div.form-wrap div.form div.con.addr .addr02{width:100%;} #applicationForm div.form-wrap div.form div.con.addr .addr03{margin-top:5px;} /* 입학원서 약관폼 */ #applicationForm div.term-wrap div.term.all div.term-input{padding:0.8rem 0.5rem;} #applicationForm div.term-wrap div.term.all div.term-box{font-size:1.125rem;} #applicationForm div.term-wrap div.term{padding:0.8rem 0.5rem;} #applicationForm div.term-wrap div.term div.term-input label.c-input{font-size:1.125rem;} #applicationForm div.term-wrap div.term div.term-input a.term-box-arrow{width:2.5rem; height:2.5rem;} #applicationForm div.term-wrap div.term div.term-box.open{margin-top:0.5rem; padding:1.25rem;} #applicationForm div.term-wrap div.term div.term-box > table{font-size:0.9rem;} #applicationForm div.term-wrap div.term div.term-box > table th{padding:5px;} #applicationForm div.term-wrap div.term div.term-box > table td{padding:5px;} } @media screen and (max-width:480px){ /* 레이아웃 */ #applicationForm div.application-form section.step div.step-tit{font-size:1.15rem;} #applicationForm div.application-form section.step div.application-last p.txt{font-size:1rem;} #applicationForm div.application-form section.step div.application-last p.univ{font-size:1.5rem;} /* 입학원서 입력폼 */ #applicationForm div.form-wrap div.form div.con span.img-size{display:block;} #applicationForm div.form-wrap div.form div.con div.chk-list2 > label.c-input{width:100%; margin-right:0;} /* 입학원서 약관폼 */ #applicationForm div.term-wrap div.term.all div.term-box{font-size:1rem; line-height:1.5;} #applicationForm div.term-wrap div.term div.term-input label.c-input{padding-top:0.25rem;} #applicationForm div.term-wrap div.term div.term-box.open{padding:1rem; font-size:0.9rem;} #applicationForm div.term-wrap div.term div.term-box > table{font-size:0.8rem;} } /********** 관리자모드 **********/ /* 관리자모드 입학원서 공통 */ #applicationForm.master div.application-form section.step div.step-tit{border-radius:0; padding:15px 30px; font-size:18px;} /* 관리자모드 입학원서 입력폼 */ #applicationForm.master{width:90%; margin:0 auto; border:1px solid #000; padding-top:30px;} #applicationForm.master span.esse{color:#ff2929 !important; font-size:12px; vertical-align:text-top; margin-right:5px; display:inline-block;} #applicationForm.master h2.sub-tit{text-align:center; font-size:25px;} #applicationForm.master ul.sub-info{text-align:center; margin:10px 0 30px 0;} #applicationForm.master div.form-wrap{font-size:16px;} #applicationForm.master div.form-wrap label.c-input{display:inline-block; font-size:16px; margin:0 5px;} #applicationForm.master div.form-wrap div.lay_flex{display:flex; align-items:center; flex-wrap:wrap; gap:5px;} #applicationForm.master div.form-wrap div.lay_item{display:flex; align-items:center; flex-wrap:wrap; gap:5px;} #applicationForm.master div.form-wrap div.lay_label{font-size:13px; margin-bottom:2px; font-weight:bold; margin-top:5px;} #applicationForm.master div.form-wrap input.wid_per95{width:95%;} #applicationForm.master div.form-wrap table.form{font-size:16px; border-top:1px solid #000;} #applicationForm.master div.form-wrap table.form tr{border-bottom:1px solid #aaa;} #applicationForm.master div.form-wrap table.form th{padding:15px; font-weight:bold; background:#eee;} #applicationForm.master div.form-wrap table.form td{padding:15px;} #applicationForm.master div.form-wrap div.form-last{text-align:center; padding:20px;} #applicationForm.master div.form-wrap div.form-last p.txt{margin-bottom:20px;} #applicationForm.master div.form-wrap div.form-last p.date{margin-bottom:20px;} #applicationForm.master div.form-wrap div.form-last div.name{justify-content:center; margin-bottom:20px;} #applicationForm.master div.form-wrap div.form-last p.univ{margin-bottom:10px; font-weight:bold; font-size:25px;} /* 관리자모드 입학원서 약관폼 */ #applicationForm.master div.term-wrap{margin-top:0; padding:20px;} #applicationForm.master div.term-wrap div.term{margin-top:0;} #applicationForm.master div.term-wrap div.term div.term-input label.c-input{padding-left:0; font-size:16px;} #applicationForm.master div.term-wrap div.term div.term-input a.term-box-arrow{width:30px; height:30px; top:-4px;} #applicationForm.master div.term-wrap div.term div.term-box{font-size:15px;} #applicationForm.master div.term-wrap div.term div.term-box > table{font-size:14px;} #applicationForm.master div.term-wrap div.term div.term-box ul.bar{display:block; width:auto; height:auto; background:initial; margin:initial;} #applicationForm.master div.term-wrap div.term div.term-box ul.bar > li{margin-top:8px; margin-bottom:0;} #applicationForm.master div.term-wrap div.term div.term-box.open{padding:15px;} #applicationForm.master div.term-wrap div.term.all div.term-box{font-size:16px; margin:0;}