@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css');

.mon { font-family:'Montserrat', 'Spoqa Han Sans Neo'; }
body { font-size:16px; font-family:'Spoqa Han Sans Neo', 'sans-serif'; letter-spacing:-0.5px; }
div, p, span, a { line-height:1.4; }
.inputWrap input[type=checkbox] { display:none; }
.inputWrap input[type=checkbox] + label { display:block; padding-left:30px; background:url('../images/intro/icon_check.png')no-repeat left center / 20px auto; color:#fff; }
.inputWrap input[type=checkbox]:checked + label { background-image:url('../images/intro/icon_check_on.png'); }

.intro { min-height:100vh; padding:50px 0 100px; background:url('../images/intro/intro_bg.png')no-repeat center / cover; }
.intro .contWrap { width:100%; max-width:1280px; margin:0 auto; }
.titleWrap { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:70px; color:#fff; }
.titleWrap .text span { font-size:1.875em; }
.titleWrap .text p { margin-top:10px; font-size:3em; font-weight:bold; line-height:1; }	
.titleWrap .linkWrap { flex-shrink:0; }
.titleWrap a { padding-right:20px; background:url('../images/main/quick_arrow.png')no-repeat right center; }
.titleWrap a + a { margin-left:30px; }
.titleWrap a span { font-size:1.125em; color:#fff; }
.titleWrap a:hover span { border-bottom:1px solid #fff; } 

.introList { display:flex; justify-content:space-between; align-items:stretch; flex-wrap:wrap; }
.introList .box { width:23.5%; margin-bottom:20px; }
.introList .box.none { background:rgba(0,0,0,0.5) url('../images/intro/intro_noCon.png')no-repeat center; }
.introList .box a { display:block; padding:20px; background-color:#fff; transition:all 0.5s; }
.introList .box .text { overflow:hidden; margin-top:20px; padding-left:20px; border-left:3px solid; }
.introList .box span { font-size:1.125em; }
.introList .box p { height:5.6em; margin-bottom:40px; font-size:1.5em; line-height:1.4; font-weight:500; 
	overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; }
.introList .box .title { font-size:20px; color:#888 !important; }
.introList .box i { float:right; display:block; width:25px; height:17px; background:url('../images/main/main_arrow_wh.png')no-repeat right center / contain; }
.introList .box:hover a { transform:translate(0,-20px); }
.introList .box:hover .cate { color:#fff !important; }
.introList .box:hover .text { border-color:#fff !important; }
.introList .box:hover .title { color:#fff !important; }

.introList .box.cate1 .cate { color:#98b4cc; } /* 고교대학연계 */
.introList .box.cate1 .text { border-color:#98b4cc; }
.introList .box.cate2 .cate { color:#2e4797; } /* 수시 */
.introList .box.cate2 .text { border-color:#2e4797; }
.introList .box.cate3 .cate { color:#00b26b; } /* 정시 */
.introList .box.cate3 .text { border-color:#00b26b; }
.introList .box.cate4 .cate { color:#4dafc1; } /* 재외국민 */
.introList .box.cate4 .text { border-color:#4dafc1; }
.introList .box.cate5 .cate { color:#ff9a66; } /* 편입약학 */
.introList .box.cate5 .text { border-color:#ff9a66; }
.introList .box.cate6 .cate { color:#727d83; } /* 공통 */
.introList .box.cate6 .text { border-color:#727d83; }

.introList .box.cate1:hover a { background-color:#98b4cc; color:#fff; }
.introList .box.cate2:hover a { background-color:#2e4797; color:#fff; }
.introList .box.cate3:hover a { background-color:#00b26b; color:#fff; }
.introList .box.cate4:hover a { background-color:#4dafc1; color:#fff; }
.introList .box.cate5:hover a { background-color:#ff9a66; color:#fff; }
.introList .box.cate6:hover a { background-color:#727d83; color:#fff; }

.footer { display:flex; justify-content:space-between; align-items:center; margin-top:50px; color:#fff; }
.footer .copy { font-size:14px; }



.intro.type2 { position:relative; padding:20vh 0 0; background:url('../images/intro/intro_bg2.png')no-repeat center / cover; color:#fff; text-align:center; }
.intro.type2 .link-wrap { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; width:100%; max-width:820px; margin:80px auto 0; }
.intro.type2 .link-wrap a { display:block; width:calc(50% - 10px); padding:30px 70px 30px 40px; background:url('../images/intro/link-wrap-arrow.png')no-repeat right 40px center;
	 border-radius:70px; box-shadow:0px 30px 30px 0 rgba(0, 0, 0, 0.3); color:#fff; font-size:22px; text-align:left; }
.intro.type2 .link-wrap strong { font-weight:bold; font-size:26px; }
.intro.type2 .link-wrap a:first-child { background-color:#00b26b; }
.intro.type2 .link-wrap a:last-child { background-color:#2e4797 }
.intro.type2 .copy { position:absolute; bottom:50px; left:0; right:0; text-align:center; font-size:14px;  }



.mobileMenu { display:none; }


@media (max-width:1280px) {
	.intro .contWrap { width:auto; margin:0 30px; }
	.titleWrap .text span { font-size:1.5em; }
	.titleWrap .text p { font-size:2.5em; }
	.introList .box p { font-size:1.375em; }

	.intro.type2 { margin:0 30px; }
}


@media (max-width:768px) {
	body { font-size:14px; }
	.intro { background-image:url('../images/intro/intro_bg_m.png'); }
	.titleWrap { margin-bottom:20px; justify-content:center; text-align:center; }
	.titleWrap .text span { font-size:1.3em; }
	.titleWrap .text p { font-size:2em; }
	.titleWrap a { display:none; }

	.introList { padding-top:30px; }
	.introList .box { width:48%; }
	.introList .box a { padding:15px; }
	.introList .box .cate { font-size:1em; }
	.introList .box .text { padding-left:15px; margin-top:15px;  }
	.introList .box p { margin-bottom:20px; font-size:1.125em; }
	.introList .box .title { font-size:14px; }
	.introList .box i { width:18px; }
	
	.introList .box:hover a { transform:translate(0,0); }
	.introList .box:hover .title { color:#888 !important; }

	.introList .box.cate1 .cate { color:#98b4cc !important; } /* 고교대학연계 */
	.introList .box.cate1 .text { border-color:#98b4cc !important; }
	.introList .box.cate2 .cate { color:#2e4797 !important; } /* 수시 */
	.introList .box.cate2 .text { border-color:#2e4797 !important; }
	.introList .box.cate3 .cate { color:#00b26b !important; } /* 정시 */
	.introList .box.cate3 .text { border-color:#00b26b !important; }
	.introList .box.cate4 .cate { color:#4dafc1 !important; } /* 재외국민 */
	.introList .box.cate4 .text { border-color:#4dafc1 !important; }
	.introList .box.cate5 .cate { color:#ff9a66 !important; } /* 편입약학 */
	.introList .box.cate5 .text { border-color:#ff9a66 !important; }
	.introList .box.cate6 .cate { color:#727d83 !important; } /* 공통 */
	.introList .box.cate6 .text { border-color:#727d83 !important; }

	.introList .box.cate1 i { background-image:url('../images/main/main_arrow_cate6.png'); }
	.introList .box.cate2 i { background-image:url('../images/main/main_arrow_cate1.png'); }
	.introList .box.cate3 i { background-image:url('../images/main/main_arrow_cate2.png'); }
	.introList .box.cate4 i { background-image:url('../images/main/main_arrow_cate3.png'); }
	.introList .box.cate5 i { background-image:url('../images/main/main_arrow_cate4.png'); }
	.introList .box.cate6 i { background-image:url('../images/main/main_arrow_cate5.png'); }

	.introList .box.cate1:hover a { background-color:#fff; color:#000; }
	.introList .box.cate2:hover a { background-color:#fff; color:#000; }
	.introList .box.cate3:hover a { background-color:#fff; color:#000; }
	.introList .box.cate4:hover a { background-color:#fff; color:#000; }
	.introList .box.cate5:hover a { background-color:#fff; color:#000; }
	.introList .box.cate6:hover a { background-color:#fff; color:#000; }

	.footer { margin-top:20px; justify-content:center; font-size:12px; }
	.footer .inputWrap { display:none; }

	.mobileMenu { position:fixed; bottom:0; left:0; right:0; display:block; padding:20px;
		background:rgba(0,0,0,0.8); }
	.mobileMenu .linkWrap { display:flex; justify-content:space-between; align-items:center; }
	.mobileMenu a { color:#fff; padding-right:16px; background:url('../images/main/quick_arrow.png')no-repeat right center; font-size:1.125em; font-weight:500;  }
	.mobileMenu a + a { margin-left:15px; }

	.intro.type2 { background-image:url('../images/intro/intro_bg2_m.png')}
	.intro.type2 h1 img { width:160px; }
	.intro.type2 .link-wrap { width:auto; max-width:none; margin:40px 5% 0; }
	.intro.type2 .link-wrap a { width:100%; padding:20px 50px 20px 30px;
		background-size:8px auto; background-position:right 30px center; font-size:1em;  }
	.intro.type2 .link-wrap strong { font-size:1.25em; }
	.intro.type2 .link-wrap a:last-child { margin-top:10px; }
	.intro.type2 .copy { bottom:30px; }
}