@charset "utf-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");

/* reset css*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {margin:0; padding:0; border:0; font-size:100%; /*vertical-align:baseline;*/ background:transparent; font-family:"Pretendard Variable", Pretendard, sans-serif; letter-spacing:-0.25px}
body {line-height:normal !important; word-break:keep-all; background:#000}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
dl,ul,ol,menu,li {list-style:none}
caption, legend {overflow:hidden; text-indent:-9999px; height:1px}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content:none}
a {margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; text-decoration:none; color:inherit}
a:focus, a:hover {text-decoration:none !important}
ins {background-color:#ff9; color: #000; text-decoration:none}
mark {background-color:#ff9; color:#000; font-style:italic; font-weight:bold}
del {text-decoration:line-through}
abbr[title], dfn[title] {border-bottom:1px dotted; cursor:help}
table {border-collapse:collapse; border-spacing:0}
hr {display:block; height:1px; border:0; border-top: 1px solid #cccccc; margin:1em 0; padding:0}
input, select {vertical-align:middle}
i {vertical-align:middle}
a[href^="tel"] {color:inherit; text-decoration:none}
.text-light {font-weight:400}
.img-responsive {display:block; max-width:100%; height:auto}


#intro_container {width:100%; min-height:100vh; background:#000 url('/site/korean/image/ent_bg_campus.png?v=2') no-repeat top; display:flex; align-items:center; background-size:cover; box-sizing:border-box}
.intro_inner {width:100%; max-width:1140px; margin:0 auto}

.entBann > ul {display:flex; gap:20px; padding:0; width:100%}
.entBann > ul li {width:calc((100% - 60px) / 4); border-radius:15px; padding:20px; flex-shrink:0; box-sizing:border-box; transition:filter 0.3s ease; transition: transform .2s ease}
.entPopup {margin-top:40px; position:relative}
.entPopup ul {display:flex; padding:0; width:100%}
.entPopup ul li {width:calc((100% - 60px) / 4); min-height:180px; border-radius:15px; padding:20px; flex-shrink:0; box-sizing:border-box; transition:filter 0.3s ease}
.entbann__title {font-size:20px; font-weight:600; margin-top:15px}
.entbann__foot {margin-top:20px; font-size:14px; font-weight:600}
.entbann__foot .more {display:inline-flex; align-items:center}
.entbann__foot .more > i {font-size:10px; margin-left:7px; transition: transform .2s ease}
.entBann > ul li:hover .entbann__foot .more > i {transform:translateX(3px)}
.entPopup ul li:hover .entbann__foot .more > i {transform:translateX(3px)}
.entBann > ul li:hover {filter:brightness(1.05); transform:translateY(-3px)}
.entPopup ul li:hover {filter:brightness(1.07)}

.icon-circle {width:40px; height:40px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; box-sizing:border-box; font-size:18px}
.color01 {background-color:#e6f0fd; box-shadow:0 5px 0 0 #6191EE}
.color02 {background-color:#fcfbf0; box-shadow:0 5px 0 0 #e1b604}
.color03 {background-color:#edf8f8; box-shadow:0 5px 0 0 #0797b0}
.color04 {background-color:#edf9f4; box-shadow:0 5px 0 0 #229766}
.color01 > a > span > i {background-color:#CDDCFA; color:#6191EE}
.color02 > a > span > i {background-color:#F6EFC4; color:#907A02}
.color03 > a > span > i {background-color:#C2E7EA; color:#086B74}
.color04 > a > span > i {background-color:#C5EAD7; color:#20AD66}

.bottom_container {display:flex; justify-content:space-between; width:100%; background:#fff; margin-top:60px; padding:25px 20px; border-radius:15px; box-sizing:border-box}
.bottom_container .btns {display:flex; justify-content:space-between; align-items:center; gap:20px}
.bottom_container .btns .site_btns {display:flex; gap:20px}
.bottom_container .btns .site_btns a {display:flex; align-items:center; justify-content:center; flex-direction:column; gap:5px; padding:20px 0; border-radius:15px; width:260px; font-size:22px; font-weight:600; transition:filter .2s ease, transform .2s ease}
.bottom_container .btns .site_btns .btn_kor {background:#ccdbf3; color:#16325C}
.bottom_container .btns .site_btns .btn_ent {background:#2F6FEB; color:#fff}
.bottom_container .btns .site_btns .btn_kor:hover {background:#E4EDFF; transform:translateY(-2px)}
.bottom_container .btns .site_btns .btn_ent:hover {background:#1a56cb; transform:translateY(-2px)}
.bottom_container .btns .btn_sub {font-size:12px; font-weight:300; opacity:0.7}
.bottom_container .quick {display:flex; align-items:center; gap:40px; padding:0 30px}
.bottom_container .quick a {display:flex; flex-direction:column; align-items:center; text-align:center; font-size:14px; font-weight:500; color:#162656}
.bottom_container .quick a > i {font-size:28px; margin-bottom:10px}
.bottom_container .quick a > img {margin-bottom:14px}
.bottom_container .quick a:hover {color:#2f6feb}


.entPopup .swiper {width:100%; overflow:hidden; padding-bottom:5px}
.entPopup .swiper-button-prev, .entPopup .swiper-button-next {width:48px; height:48px; background-color:rgba(255, 255, 255, 0.4); border-radius:50%; color:#333; transition:background-color 0.3s}
.entPopup .swiper-button-prev:after, .entPopup .swiper-button-next:after {font-size:18px; font-weight:700}
.entPopup .swiper-button-prev:hover, .entPopup .swiper-button-next:hover {background-color:rgba(255, 255, 255, 0.8)}
.entPopup .swiper-button-prev {left:-78px}
.entPopup .swiper-button-next {right:-78px}

	
/* 반응형 */
@media (max-width: 1200px) {
	.entPopup .swiper-button-prev {left:-25px}
	.entPopup .swiper-button-next {right:-25px}
}

@media (max-width: 1040px) {
	#intro_container {padding:100px 20px}
	.entBann > ul {flex-wrap:wrap}
	.entBann > ul li {width:calc((100% - 20px) / 2)}
	.bottom_container {flex-direction:column}
	.bottom_container .quick {margin-bottom:25px; justify-content:center}
	.bottom_container .btns {justify-content:center}
}

@media (max-width:640px) {
	.bottom_container .btns .site_btns {width:100%; gap:10px}
	.bottom_container .btns .site_btns a {font-size:16px; width:calc((100% - 10px) / 2)}
	    .bottom_container .quick {gap:10px; align-items:flex-start; justify-content:space-between}
}

@media (max-width:425px) {
	.bottom_container .quick {padding:0}
	.bottom_container .quick a {font-size:12px}
}

@media (max-width:375px) {
	.entBann > ul li {width:100%}
	.bottom_container .btns .site_btns {width:100%}
}