g @charset "utf-8"; @import url('https://fonts.googleapis.com/css2?family=Inter:wght@900&display=swap'); /* doc.css는 디자인페이지 스타일을 정의합니다. */
/* doc-tit */
.doc-tit { font-size:28px; line-height:1.2em; color:#2a7ec2; margin-bottom:14px; font-weight:700; } 
/* sub01_01 */
.introduce .tit { margin-bottom:80px; height:550px; text-align:center; background:url('../images/sub/introduce.jpg') center center no-repeat; background-size:cover; border-radius:20px; overflow:hidden; position:relative; } 
.introduce .tit .txt { margin-top:66px; } 
.introduce .tit .txt h3 { font-size:46px; line-height:1.1em; color:#fff; font-weight:400; margin-bottom:24px; } 
.introduce .tit .txt h3>span { color:#eaa000; } 
.introduce .tit .txt h3 strong span { color:#0ac39e; } 
.introduce .tit .txt p { font-size:20px; line-height:2em; color:#fff; } 
.introduce .tit .tt { position:absolute; font-size:100px; color:#fff; line-height:1em; font-family:'Inter'; left:-5px; width:100%; bottom:-20px; letter-spacing:.165em; white-space:nowrap; } 
.introduce .wrap { margin-bottom:80px; } 
.introduce .cnt01 { margin-bottom:80px; } 
.introduce .cnt01 ul { display:flex; flex-wrap:wrap; margin:0 -15px -30px; } 
.introduce .cnt01 ul li { padding:0 15px; margin-bottom:30px; width:50%; } 
.introduce .cnt01 ul li .inner { padding:40px; border:1px solid #dfdfdf; border-radius:10px; height:100%; position:relative; } 
.introduce .cnt01 ul li .inner:after { content:''; width:80px; height:80px; background-repeat:no-repeat; background-size:cover; position:absolute; top:40px; right:40px; } 
.introduce .cnt01 ul li:nth-child(1) .inner:after { background-image:url('../images/sub/introduce-icon01.png'); } 
.introduce .cnt01 ul li:nth-child(2) .inner:after { background-image:url('../images/sub/introduce-icon02.png'); } 
.introduce .cnt01 ul li:nth-child(3) .inner:after { background-image:url('../images/sub/introduce-icon03.png'); } 
.introduce .cnt01 ul li:nth-child(4) .inner:after { background-image:url('../images/sub/introduce-icon04.png'); } 
.introduce .cnt01 li span { width:50px; line-height:50px; text-align:center; border-radius:50%; color:#fff; font-size:18px; font-weight:700; display:inline-block; margin-bottom:10px; } 
.introduce .cnt01 li:nth-child(1) span { background:#0ac39e; } 
.introduce .cnt01 li:nth-child(2) span { background:#eaa000; } 
.introduce .cnt01 li:nth-child(3) span { background:#00aeee; } 
.introduce .cnt01 li:nth-child(4) span { background:#9e56e8; } 
.introduce .cnt01 li h3 { font-size:22px; font-weight:500; line-height:1.4em; color:#2c2c2c; margin-bottom:14px; } 
.introduce .cnt01 li p { font-size:17px; color:#505050; line-height:1.8em; } 
.introduce .cnt01 li p strong { display:block; font-weight:500; } 
.introduce .cnt01 li:nth-child(1) p strong { color:#0ac39e; } 
.introduce .cnt01 li:nth-child(2) p strong { color:#eaa000; } 
.introduce .cnt01 li:nth-child(3) p strong { color:#00aeee; } 
.introduce .cnt01 li:nth-child(4) p strong { color:#9e56e8; } 
.introduce .cnt02 table { width:100%; border-collapse:collapse; border-spacing:0; } 
.introduce .cnt02 table th { border-top:1px solid #a8a8a8; border-bottom:1px solid #dfdfdf; background:#fafafa; font-size:18px; color:#2c2c2c; padding:15px 0; } 
.introduce .cnt02 table td { border-bottom:1px solid #dfdfdf; border-right:1px solid #dfdfdf; text-align:center; font-size:16px; padding:16px 10px; color:#505050; } 
.introduce .cnt02 table td:last-child { border-right:0; color:#eaa000; font-weight:700; } 
/* sub01_03 */
.support .tit { margin-bottom:80px; height:340px; background:url('../images/sub/support.jpg') 0 0 no-repeat; background-size:cover; border-radius:20px; overflow:hidden; position:relative; } 
.support .tit h3 { position:absolute; width:100%; left:0; top:50%; transform:translateY(-50%); font-size:38px; line-height:1.2em; color:#fff; font-weight:400; padding:0 60px; } 
.support .tit h3 .c_eaa000 { color:#eaa000; } 
.support .tit h3 .c_0ac39e { color:#0ac39e; } 
.support .cnt { margin-bottom:80px; } 
.support .cnt .tt { font-size:17px; color:#505050; font-weight:300; line-height:1.6em; margin-bottom:24px; } 
.support ol { display:flex; margin:0 -13px; } 
.support ol li { padding:0 13px; width:20%; } 
.support ol li .inner { border:1px solid #dfdfdf; padding:36px 15px; border-radius:10px; text-align:center; height:100%; position:relative; } 
.support ol li .inner:after { content:''; width:70px; height:36px; background:url('../images/sub/support-arrow.png') 0 0 no-repeat; background-size:cover; position:absolute; top:33px; right:-24px; } 
.support ol li:last-child .inner:after { display:none; } 
.support ol li span { font-size:21px; font-weight:700; display:block; margin-bottom:26px; line-height:1.5em; } 
.support ol li .img-box { margin-bottom:20px; } 
.support ol li h4 { font-size:17px; font-weight:500; line-height:1.7em; margin-bottom:14px; height:calc(1.7em * 1 * 2); } 
.support ol li:nth-child(1) h4 { color:#0ac39e; } 
.support ol li:nth-child(2) h4 { color:#eaa000; } 
.support ol li:nth-child(3) h4 { color:#00aeee; } 
.support ol li:nth-child(4) h4 { color:#9e56e8; } 
.support ol li:nth-child(5) h4 { color:#ee6b75; } 
.support ol li p { font-size:14px; line-height:1.8em; color:#878787; } 
/* sub01_04 */
.directions .maps { margin-bottom:60px; } 
.directions .root_daum_roughmap { width:100% !important; height:450px !important; } 
.directions .root_daum_roughmap .wrap_map { height:450px !important; } 
.directions .roughmap_lebel_text { line-height:0 !important; font-size:0 !important; } 
.directions .roughmap_lebel_text:after { content:"모블교육센터"; font-size:12px; line-height:15px; } 
.directions ul { display:flex; } 
.directions ul li { width:33.33333333%; border-right:1px dashed #dfdfdf; text-align:center; padding:20px; } 
.directions ul li:last-child { border-right:0; } 
.directions ul li .img-box { margin-bottom:20px; } 
.directions ul li span { font-size:15px; line-height:2em; font-weight:500; color:#eaa000; display:block; margin-bottom:16px; } 
.directions ul li p { font-size:20px; line-height:1.5em; color:#2c2c2c; } 
/* sub02 */
.process-list .items { margin:0 -24px; display:flex; flex-wrap:wrap; } 
.process-list .item { padding:0 24px; margin-bottom:48px; width:33.333333%; height:100%; } 
.process-list .item a { display:block; padding:32px; border:2px solid #fff; border-radius:15px; position:relative; } 
.process-list .item a:hover { border-color:#2a7ec2; box-shadow:5px 5px 5px rgba(0,0,0,0.13); } 
.process-list .item a .box { display:flex; flex-wrap:wrap; margin:0 -3px 14px; } 
.process-list .item a .box span { display:inline-block; padding:2px 10px; line-height:1.5em; color:#fff; font-size:15px; font-weight:500; border-radius:5px; margin:0 3px 6px; white-space:nowrap; } 
.process-list .item a .box span.category { background:#2a7ec2; } 
.process-list .item a .box span.ing { background:#0ac39e; } 
.process-list .item a .box span.end { background:#a8a8a8; } 
.process-list .item a h4 { font-size:22px; color:#2cc2c2c; line-height:1.4em; margin-bottom:16px; height:calc(1.4em * 1 * 3); overflow:hidden; text-overflow:ellipsis; word-break:break-all; white-space:normal; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; } 
.process-list .item a.end-class h4 { color:#a8a8a8; } 
.process-list .item a dl { display:flex; font-size:15px; color:#505050; line-height:1.8em; } 
.process-list .item a.end-class dl { color:#a8a8a8; } 
.process-list .item a dt { width:70px; } 
.process-list .item a dd { width:1%; flex:1 1 auto; } 
.process-list .item a .img-box { margin-top:36px; border-radius:15px; overflow:hidden; } 
.process-list .item a .img-box .pic { position:relative; height:0; padding-bottom:75.255%; overflow:hidden; } 
.process-list .item a .img-box .pic img { position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s; } 
.process-list .item a .btn { width:64px; height:64px; background:url('../images/main/sec1-btn.png') 0 0 no-repeat; background-size:cover; position:absolute; top:83px; right:-32px; z-index:1; display:none; opacity:0; } 
.process-list .item a:hover .btn { display:block; opacity:1; } 
/* sub02_detail */
.detail-common { padding:40px; border:1px solid #dfdfdf; border-radius:15px; margin-bottom:20px; } 
.process-detail .tit { background:#fafafa; display:flex; } 
.process-detail .tit .img-box { max-width:300px; width:100%; border-radius:5px; overflow:hidden; } 
.process-detail .tit .img-box .pic { position:relative; height:0; padding-bottom:75%; overflow:hidden; } 
.process-detail .tit .img-box .pic img { position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s; } 
.process-detail .tit .txt-box { flex:1 1 auto; width:1%; padding-left:40px; } 
.process-detail .tit .txt-box ul { display:flex; flex-wrap:wrap; margin:0 -3px 14px; } 
.process-detail .tit .txt-box ul li { display:inline-block; padding:2px 10px; line-height:1.5em; color:#fff; font-size:15px; font-weight:500; border-radius:5px; margin:0 3px 6px; white-space:nowrap; } 
.process-detail .tit .txt-box ul li.category { background:#2a7ec2; } 
.process-detail .tit .txt-box ul li.ing { background:#0ac39e; } 
.process-detail .tit .txt-box ul li.end { background:#a8a8a8; } 
.process-detail .tit .txt-box .txt h3 { font-size:24px; color:#2c2c2c; line-height:1.4em; margin-bottom:16px; word-break:normal; } 
.process-detail .tit .txt-box .txt p { font-size:16px; font-weight:500; color:#a8a8a8; font-weight:500; line-height:1.8em; height:calc(1.8em * 1 * 3); overflow-Y:scroll; text-overflow:ellipsis; word-break:break-all; } 
.process-detail .box { background:#fff; } 
.process-detail .box .inner { display:flex; margin:0 -30px -60px; justify-content:center; align-items:center; flex-wrap:wrap; } 
.process-detail .box .inner>ul { padding:0 30px; margin-bottom:60px; } 
.process-detail .box .txt { display:flex; margin:0 -20px; } 
.process-detail .box .txt li { display:flex; padding:0 20px; align-items:center; } 
.process-detail .box .txt li .img-box { margin-right:14px; } 
.process-detail .box .txt li .tt span { font-size:14px; display:block; font-weight:500; color:#eaa000; line-height:1.5em; } 
.process-detail .box .txt li .tt p { font-size:18px; color:#2c2c2c; line-height:1.4em; } 
.process-detail .box .btns { margin:0 -3px; display:flex; } 
.process-detail .box .btns li { padding:0 3px; } 
.process-detail .box .btns li a { display:block; color:#fff; line-height:56px; border-radius:28px; padding:0 24px; } 
.process-detail .box .btns li a:after { content:''; width:17px; height:17px; background:url('../images/sub/detail-arrow.png') 0 0 no-repeat; background-size:cover; display:inline-block; vertical-align:middle; margin-top:-2px; margin-left:24px; } 
.process-detail .box .btns li:nth-child(1) a { background:#2a7ec2; } 
.process-detail .box .btns li:nth-child(2) a { background:#0ac39e; } 
.process-detail .cnt h3 { font-size:28px; color:#2c2c2c; font-weight:500; line-height:1.3em; text-align:center; margin-bottom:26px; } 
.process-detail .cnt .table { margin-bottom:12px; } 
.process-detail .cnt table { width:100%; border-collapse:collapse; border-spacing:0; } 
.process-detail .cnt table th { border-top:1px solid #a8a8a8; border-bottom:1px solid #dfdfdf; background:#fafafa; font-size:18px; color:#2c2c2c; font-weight:400; padding:15px 0; } 
.process-detail .cnt table tbody th { font-size:16px; text-align:center; border-right:1px solid #dfdfdf; } 
.process-detail .cnt table td { border-bottom:1px solid #dfdfdf; border-right:1px solid #dfdfdf; font-size:16px; padding:16px 30px; color:#505050; } 
.process-detail .cnt table td:last-child { border-right:0; } 
.process-detail .cnt table td li { padding-left:8px; position:relative; } 
.process-detail .cnt table td li:before { content:''; width:4px; height:1px; background:#505050; position:absolute; top:14px; left:0; } 
.process-detail .cnt .tt { font-size:15px; font-weight:300; color:#878787; line-height:1.8em; } 
.process-detail .cnt .tt span { color:#00aeee; } 
.process-detail .img-cnt h3 { font-size:28px; color:#2c2c2c; font-weight:500; line-height:1.3em; text-align:center; margin-bottom:26px; } 
.process-detail .img-cnt .box { max-width:1000px; height:auto; margin:0 auto; } 
/* sub03 */
.lecturer { margin-top:40px; } 
.lecturer .cnt { margin-bottom:10px; padding:46px 50px; border:1px solid #dfdfdf; border-radius:15px; } 
.lecturer .cnt h3 { font-size:30px; line-height:1.1em; color:#2c2c2c; margin-bottom:30px; } 
.lecturer .cnt h3 span { display:inline-block; font-size:16px; line-height:1.7em; color:#878787; font-weight:400; margin-left:20px; } 
.lecturer .col { display:flex; } 
.lecturer .row { width:50%; } 
.lecturer .row span { line-height:33px; display:inline-block; padding:0 8px; border-radius:5px; color:#fff; font-size:16px; margin-bottom:14px; } 
.lecturer .row span.career { background:#2a7ec2; } 
.lecturer .row span.record { background:#eaa000; } 
.lecturer .row span.writing { background:#0ac39e; } 
.lecturer .row li { font-size:16px; line-height:1.8em; color:#505050; font-weight:300; position:relative; padding-left:8px; } 
.lecturer .row li:before { content:''; width:4px; height:1px; background:#505050; position:absolute; top:14px; left:0; } 
/* sub04_03 */
.epilogue-list .items { margin:0 -8px; display:flex; flex-wrap:wrap; } 
.epilogue-list .item { padding:0 8px; margin-bottom:30px; width:33.333333%; } 
.epilogue-list .item a { background:#fff; display:block; padding:36px 40px; border-radius:15px; border:1px solid #dfdfdf; } 
.epilogue-list .item a:hover { border-color:#fff; box-shadow:0px 3px 7px 2px rgba(0,0,0,0.17); } 
.epilogue-list .item a .title { display:flex; margin-bottom:20px; justify-content:space-between; align-items:center; } 
.epilogue-list .item a .title h4 { font-size:22px; line-height:1.2em; color:#2c2c2c; } 
.epilogue-list .item a .title p { font-size:15px; line-height:1.6em; color:#a8a8a8; } 
.epilogue-list .item a .txt { color:#a8a8a8; } 
.epilogue-list .item a .txt p { font-size:15px; line-height:1.6em; margin-bottom:20px; font-weight:300; height:calc(1.6em * 1 * 3); overflow:hidden; text-overflow:ellipsis; word-break:break-all; white-space:normal; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; } 
.epilogue-list .item a .txt .date { font-size:12px; line-height:2em; margin-bottom:10px; } 
.epilogue-list .item a .txt .tt { font-size:12px; line-height:1.5em; color:#eaa000; font-weight:500; letter-spacing:-.04em; word-break:normal; } 
.epilogue-list .item a .btn { background-image:url('../images/sub/epilogue-more.png'); background-repeat:no-repeat; background-size:cover; width:17px; height:17px; display:block; margin:36px auto 0; } 
.epilogue-list .item a:hover .btn { background-image:url('../images/sub/epilogue-more-on.png'); } 
/* sub04_04 */
.event-list ul { display:flex; flex-wrap:wrap; margin:0 -8px; } 
.event-list ul li { padding:0 8px; margin-bottom:30px; width:33.333333%; } 
.event-list li a { border:1px solid #dfdfdf; border-radius:15px; padding:40px; text-align:left; display:block; } 
.event-list li a:hover { border-color:#fff; box-shadow:0px 3px 7px 2px rgba(0,0,0,0.17); } 
.event-list li a .img-box .pic { margin-bottom:16px; position:relative; height:0; padding-bottom:56.4%; overflow:hidden; } 
.event-list li a .img-box .pic img { position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s; } 
.event-list li a h3 { font-size:17px; color:#2c2c2c; font-weight:400; line-height:1.6em; height:calc(1.6em * 1 * 2); overflow:hidden; text-overflow:ellipsis; word-break:break-all; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; } 
.event-list li a.end h3 { color:#a8a8a8; } 
.event-list li .tt { display:flex; align-items:center; justify-content:space-between; margin-top:16px; } 
.event-list li .tt .date { font-size:13px; line-height:1.8em; color:#a8a8a8; } 
.event-list li .tt span { font-size:15px; line-height:26px; font-weight:500; color:#fff; padding:0 8px; border-radius:5px; } 
.event-list li a.ing .tt span { background:#2a7ec2; } 
.event-list li a.end .tt span { background:#a8a8a8; } 
/* sub04_05 */
.gallery-list ul { display:flex; flex-wrap:wrap; margin:0 -8px; } 
.gallery-list ul li { padding:0 8px; margin-bottom:30px; width:33.333333%; } 
.gallery-list li a { border:1px solid #dfdfdf; border-radius:15px; padding:40px; text-align:left; display:block; } 
.gallery-list li a .img-box .pic { margin-bottom:16px; position:relative; height:0; padding-bottom:56.4%; overflow:hidden; } 
.gallery-list li a .img-box .pic img { position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s; } 
.gallery-list li a h3 { font-size:17px; margin-bottom:16px; color:#2c2c2c; font-weight:400; line-height:1.6em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } 
.gallery-list li a .date { font-size:13px; line-height:1.8em; color:#a8a8a8; } 
/* sub05 */
.inquiry { margin-top:40px; } 
.inquiry .tt { } 
.inquiry .tt h3 { font-size:28px; line-height:1.5em; color:#2a7ec2; margin-bottom:16px; } 
.cen-btns { line-height:60px; border-radius:32px; border:2px solid #333333; padding:0 143px 0 33px; color:#2c2c2c; font-size:22px; font-weight:500; background:url('../images/bbs/inquiry-send.png') 180px center no-repeat; background-size:20px; cursor:pointer; display:inline-block; } 
/* mypage04 */
.register-list table { width:100%; border-collapse:collapse; border-spacing:0; } 
.register-list table th { border-top:1px solid #a8a8a8; border-bottom:1px solid #dfdfdf; background:#fafafa; font-size:16px; color:#2c2c2c; font-weight:500; padding:15px 0; } 
.register-list table td { border-bottom:1px solid #dfdfdf; border-right:1px solid #dfdfdf; text-align:center; padding:15px 0; font-size:16px; font-weight:300; color:#505050; } 
.register-list table td:nth-child(2) { text-align:left; padding:15px 30px; } 
.register-list table td:last-child { border-right:0; } 
.register-list table td a { display:inline-block; line-height:38px; border:1px solid #a8a8a8; padding:0 24px; color:#505050; font-size:15px; font-weight:300; border-radius:20px; } 
/* mypage04 detail */
.register-detail h3 { font-size:28px; line-height:1.5em; color:#2a7ec2; margin-bottom:16px; } 
.register-detail { } 
.register-detail table { width:100%; border-collapse:collapse; border-spacing:0; border-top:1px solid #a8a8a8; } 
.register-detail table th { border-bottom:1px solid #dfdfdf; border-right:1px solid #dfdfdf; background:#fafafa; font-size:17px; font-weight:500; padding:16px; color:#2c2c2c; } 
.register-detail table td { border-bottom:1px solid #dfdfdf; font-size:17px; color:#505050; padding:16px 24px; } 
.register-detail .list { text-align:center; margin-top:60px; } 

.foin-tit { font-size:28px; line-height:1.5em; color:#2a7ec2; margin-bottom:16px; font-weight:700; } 

/* sub07 */
.gallery02 { margin-top: 40px; } 

.gallery-list.type2 ul { margin:0 -15px; } 
.gallery-list.type2 ul li { padding:0 15px; width:25%; } 
.gallery-list.type2 li a { border: none; border-radius: 0; padding: 0; text-align: center; display: block; } 
.gallery-list.type2 li a .img-box .pic { padding-bottom: 36.1%; } 
.gallery-list.type2 li a .img-box .pic:after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border: 1px solid rgba(0,0,0,.08); } 