html{font-size:10px; background-color:#000;}
body,html{height:100%;}
*,
*::before,
*::after{box-sizing:border-box;}
body, h1, h2, h3, h4, h5, h6, th, td, input, select, textarea, button{font-family:'Pretendard', Arial, sans-serif;}
.user .layout{position:relative; max-width:1500px; margin:0 auto; padding:0 30px;}
@media screen and (max-width:1500px) {
    .user .layout{max-width:100%; width:calc(100% - 60px); margin:0 30px; padding:0;}
}
@media screen and (max-width:800px) {
    .user .layout{width:calc(100% - 40px); margin:0 20px;}
}

html{background-image:url(../../../images/site/kor/intro/bg.jpg); background-repeat:no-repeat; background-position:center center; background-size:cover; background-attachment:fixed;}
#wrap{display:flex; flex-direction:column; height:100%;}
#wrap h1{position:absolute; left:60px; top:50px; width:28.2em; height:5.2em; font-size:10px; background-image:url(../../../images/site/kor/layout/layout.svg); background-position:0 -6em; background-repeat:no-repeat; background-size:100em auto;}
#wrap h1>a{display:block; width:100%; height:100%;}
#wrap h1>a>span{opacity:0; position:absolute; font-size:0;}
@media screen and (max-width:1500px) {
    #wrap h1{left:30px; top:30px;}
}
@media screen and (max-width:800px) {
    #wrap h1{left:20px; top:20px;}
}

/* middle */
#middle{display:flex; width:100%; padding:150px 0; margin:auto 0;}
#middle>.in{margin:auto; width:100%; max-width:1440px;}
#middle>.in>.head{display:flex; flex-wrap:wrap; align-items:flex-end; width:100%;}
#middle>.in>.head>div:nth-child(1){display:flex; flex-direction:column;}
#middle>.in>.head>div:nth-child(1)>span{letter-spacing:8px; font-weight:200; font-size:14px; color:#fff;}
#middle>.in>.head>div:nth-child(1)>strong{
    line-height:1.3; margin-top:10px; font-weight:600; font-size:56px; color:#fff;
    text-shadow: 4px 4px 4px rgba(0, 0, 0, 0.3);
}
#middle>.in>.head>div:nth-child(1)>strong>span{display:block;}
#middle>.in>.head>div:nth-child(2){display:flex; margin-left:auto; padding-bottom:20px;}
#middle>.in>.head>div:nth-child(2)>a{display:flex; align-items:center; justify-content:center; width:182px; height:54px; line-height:1; margin-left:10px; font-size:18px; color:#fff; border:2px solid #fff; background-color:rgba(0, 0, 0, 0.5); border-radius:99px;}
#middle>.in>.head>div:nth-child(2)>a>span{display:flex; align-items:center;}
#middle>.in>.head>div:nth-child(2)>a>span::before{content:""; width:2em; height:2em; margin-right:8px; font-size:10px; background-image:url(../../../images/site/kor/intro/home.svg); background-repeat:no-repeat; background-position:center center; background-size:contain;}
#middle>.in>.midd{margin-top:50px;}
@media screen and (max-width:1500px) {
    #middle>.in>.head{width:calc(100% - 60px); margin:0 30px;}
}
@media screen and (max-width:1000px) {
    #middle>.in>.head{flex-direction:column; align-items:center; justify-content:center;}
    #middle>.in>.head>div:nth-child(1){text-align:center;}
    #middle>.in>.head>div:nth-child(2){margin-left:0; margin-top:40px;}
    #middle>.in>.midd{margin-top:20px;}
}
@media screen and (max-width:800px) {
    #middle>.in>.head{width:calc(100% - 40px); margin:0 20px;}
}
@media screen and (max-width:760px) {
    #middle>.in>.head>div:nth-child(1)>span{letter-spacing:6px; font-size:12px;}
    #middle>.in>.head>div:nth-child(1)>strong{font-size:45px;}
    #middle>.in>.head>div:nth-child(2)>a{width:166px; height:46px; font-size:16px;}
    #middle>.in>.head>div:nth-child(2)>a>span::before{font-size:9px;}
}
@media screen and (max-width:600px) {
    #middle{padding:130px 0 30px;}
}
@media screen and (max-width:540px) {
    #middle>.in>.head>div:nth-child(1)>span{letter-spacing:4px; font-size:10px;}
    #middle>.in>.head>div:nth-child(1)>strong{font-size:32px;}
    #middle>.in>.head>div:nth-child(2){width:100%; padding-bottom:0; margin-top:20px;}
    #middle>.in>.head>div:nth-child(2)>a{width:100%; margin-left:0; font-size:15px;}
    #middle>.in>.head>div:nth-child(2)>a:nth-child(n+2){margin-left:20px;}
    #middle>.in>.midd{margin-top:10px;}
}
@media screen and (max-width:360px) {
    #middle>.in>.head>div:nth-child(1)>strong{font-size:28px;}
    #middle>.in>.head>div:nth-child(2)>a:nth-child(n+2){margin-left:10px;}
}


/* card */
.notice-card{display:flex; flex-wrap:wrap; width:calc(100% + 30px); margin-left:-15px;}
.notice-card>li{flex-shrink:0; width:calc((100% - (30px * 4)) / 4); margin:15px;}
.notice-card>li>a{
    overflow:hidden; display:flex; position:relative; width:100%; height:180px; padding:30px; border-radius:8px;
    -webkit-transition:box-shadow 0.3s linear; transition:box-shadow 0.3s linear;
}
.notice-card>li>a::before,
.notice-card>li>a::after{
    content:""; display:block; position:absolute; right:0; bottom:0; z-index:0; width:100%; height:100%; border-radius:8px; background-color:#fff;
    -webkit-transition:all 0.3s linear; transition:all 0.3s linear;
}
.notice-card>li>a::before{width:calc(100% - 20px); height:calc(100% - 20px);}
.notice-card>li>a::after{
    z-index:1; 
    -webkit-transition:border-radius 0.3s linear; transition:border-radius 0.3s linear;
}
.notice-card>li>a>.in{display:flex; flex-direction:column; position:relative; z-index:10; width:100%;}
.notice-card>li>a>.in>em{
    display:inline-flex; align-items:center; justify-content:center; width:77px; height:32px; font-weight:400; font-style:normal; font-size:16px; color:#343A40; background-color:rgba(134, 142, 150, 0.2); border-radius:16px;
    -webkit-transition:color 0.3s linear, background-color 0.3s linear; transition:color 0.3s linear, background-color 0.3s linear;
}
.notice-card>li>a>.in>strong{
    line-height:1.3; margin-top:15px; font-weight:600; font-size:22px; color:#16171D;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.notice-card>li>a>.in>span{margin-top:auto; font-size:18px; color:#54555A;}

.notice-card>li[data-type*="공통"]>a>.in>em{color:rgba(134, 142, 150, 1); background-color:rgba(134, 142, 150, 0.2);}
.notice-card>li[data-type*="수시"]>a>.in>em{color:rgba(59, 91, 219, 1); background-color:rgba(59, 91, 219, 0.2);}
.notice-card>li[data-type*="정시"]>a>.in>em{color:rgba(12, 166, 120, 1); background-color:rgba(12, 166, 120, 0.2);}
.notice-card>li[data-type*="외국인"]>a>.in>em{color:rgba(240, 140, 0, 1); background-color:rgba(240, 140, 0, 0.2);}
.notice-card>li[data-type*="편입"]>a>.in>em{color:rgba(234, 85, 20, 1); background-color:rgba(234, 85, 20, 0.2);}
.notice-card>li[data-type*="대학원"]>a>.in>em{color:rgba(185, 133, 96, 1); background-color:rgba(185, 133, 96, 0.2);}

.notice-card>li>a:hover{
    -webkit-box-shadow: 0px 20px 32px rgba(22, 23, 29, 0.1);
    box-shadow: 0px 20px 32px rgba(22, 23, 29, 0.1);
}
.notice-card>li>a:hover::before{background-color:rgba(134, 142, 150, 1);}
.notice-card>li>a:hover::after{border-radius:8px 8px 120px 8px;}

.notice-card>li[data-type*="공통"]>a:hover>.in>em{color:#fff; background-color:rgba(134, 142, 150, 1);}
.notice-card>li[data-type*="공통"]>a:hover::before{background-color:rgba(107, 114, 120, 1);}
.notice-card>li[data-type*="수시"]>a:hover>.in>em{color:#fff; background-color:rgba(59, 91, 219, 1);}
.notice-card>li[data-type*="수시"]>a:hover::before{background-color:rgba(47, 73, 175, 1);}
.notice-card>li[data-type*="정시"]>a:hover>.in>em{color:#fff; background-color:rgba(12, 166, 120, 1);}
.notice-card>li[data-type*="정시"]>a:hover::before{background-color:rgba(10, 133, 96, 1);}
.notice-card>li[data-type*="외국인"]>a:hover>.in>em{color:#fff; background-color:rgba(240, 140, 0, 1);}
.notice-card>li[data-type*="외국인"]>a:hover::before{background-color:rgba(192, 112, 0, 1);}
.notice-card>li[data-type*="편입"]>a:hover>.in>em{color:#fff; background-color:rgba(234, 85, 20, 1);}
.notice-card>li[data-type*="편입"]>a:hover::before{background-color:rgba(187, 68, 16, 1);}
.notice-card>li[data-type*="대학원"]>a:hover>.in>em{color:#fff; background-color:rgba(185, 133, 96, 1);}
.notice-card>li[data-type*="대학원"]>a:hover::before{background-color:rgba(148, 106, 77, 1);}
@media screen and (max-width:1200px) {
	.notice-card>li{width:calc((100% - (18px * 4)) / 4); margin:9px;}
	.notice-card>li>a{height:148px; padding:20px;}
	.notice-card>li>a>.in>em{width:68px; height:26px; font-size:14px;}
	.notice-card>li>a>.in>strong{font-size:16px;}
	.notice-card>li>a>.in>span{font-size:15px;}
}

/* 암람 */
#ar-box{width:100%; height:calc(100% - 138px);}
#ar-box>.move{overflow:hidden; position:relative;}
#ar-box .grid{
	position:absolute; left:0; bottom:0; width:100%; 
}
#ar-box .grid{display:flex; flex-wrap:wrap; width:calc(100% + 30px); padding:0; margin-left:-15px;}
#ar-box .grid>span{overflow:hidden; display:none; position:relative; flex-shrink:0; width:calc((100% - (30px * 4)) / 4); height:180px; margin:15px; border-radius:8px;}
#ar-box .grid>span:not(:nth-child(n+9)){display:block;}
#ar-box .grid>span::before{content:""; display:block; position:absolute; right:0; bottom:0; z-index:0; width:100%; height:100%; background-color:rgba(6, 29, 60, 0.9); background-image:url(../../../images/site/kor/intro/logo_ban.svg); background-position:center center; background-repeat:no-repeat; background-size:auto;}
#ar-box .move{position:relative; z-index:100; width:100%; max-width:1500px; margin:0 auto;}
#ar-box .notice-card{position:relative;}


@media screen and (max-width: 1500px) {
	#ar-box{padding-left:15px; padding-right:15px;}
	#ar-box .grid,
	#ar-box .notice-card{max-width:100%; margin:0;}
}
@media screen and (max-width: 1280px) {
	#ar-box{top:66px; height:calc(100% - 66px);}
	body[data-popup="on"] #ar-box{top:223px; height:calc(100% - 223px);}
}
@media screen and (max-width: 1200px) {
	#ar-box{padding-left:21px; padding-right:21px;}
	#ar-box .grid>span{width:calc((100% - (18px * 4)) / 4); height:148px; margin:9px;}

    #ar-box .grid>span::before{background-size:55% auto;}
}
@media screen and (max-width:950px) {
	#ar-box .grid>span,
	#ar-box .notice-card>li{width:calc((100% - (18px * 3)) / 3);}

    #ar-box .grid>span:nth-child(n+7){display:none;}
}
@media screen and (max-width:800px) {
	#ar-box{padding-left:11px; padding-right:11px;}
}
@media screen and (max-width:600px) {
	#ar-box .grid,
	#ar-box .controll{display:none;}

	#ar-box{padding:20px 14px;}
	#ar-box>.move{overflow:auto; height:100%;}
	#ar-box .notice-card{overflow:visible; height:auto; padding:0;}
	#ar-box .notice-card>li{width:calc(100% - 12px); margin:6px;}
	#ar-box .notice-card>li>a{height:58px;}
	#ar-box .notice-card>li>a>.in{flex-direction:row; align-items:center;}
	#ar-box .notice-card>li>a>.in>em{flex-shrink:0; margin-right:10px;}
	#ar-box .notice-card>li>a>.in>strong{width:100%; margin-top:0; font-size:15px;}
	#ar-box .notice-card>li>a>.in>span{display:none;}
	#ar-box .notice-card>li.on{position:relative !important; left:auto !important; top:auto !important;}
}


/* footer */
#footer{display:flex; flex-direction:column; width:100%; margin-top:auto; background-color:#343F55;}
#footer>.item-1{flex-shrink:0; padding:16px 0; background-color:#061D3C;}
#footer>.item-1>.layout{display:flex; align-items:center; height:100%;}
#footer>.item-1>.layout>strong{position:relative; display:block; line-height:30px; padding-left:40px; font-weight:400; font-size:18px; color:#fff;}
#footer>.item-1>.layout>strong::before{content:""; display:block; position:absolute; left:0; top:0; width:3em; height:3em; margin-right:10px; font-size:10px; background-image:url(../../../images/site/kor/intro/you.svg); background-repeat:no-repeat; background-position:center center; background-size:contain;}
#footer>.item-1>.layout>strong span{margin-left:5px; font-weight:600;}
#footer>.item-1>.layout>ul{display:flex; margin-left:50px;}
#footer>.item-1>.layout>ul>li{display:flex; align-items:center;}
#footer>.item-1>.layout>ul>li:not(:last-child)::after{content:""; width:3px; height:3px; margin:0 13px; background-color:rgb(217, 217, 217,0.2);}
#footer>.item-1>.layout>ul>li>a{
    opacity:0.4; display:flex; align-items:center;
    -webkit-transition:opacity 0.3s linear; transition:opacity 0.3s linear;
}
#footer>.item-1>.layout>ul>li>a::after{content:""; width:2.4em; height:2.4em; margin-left:5px; font-size:10px; background-image:url(../../../images/site/kor/intro/arrow.svg); background-repeat:no-repeat; background-position:center center; background-size:contain;}
#footer>.item-1>.layout>ul>li>a>span{font-size:15px; color:#fff;}
#footer>.item-1>.layout>ul>li>a:hover{opacity:1;}
#footer>.item-2{flex-shrink:0;}
#footer>.item-2>.layout>.item-2-2{display:flex; padding:40px 0;}
#footer>.item-2>.layout>.item-2-2::before{flex-shrink:0; content:""; position:relative; width:19.1em; height:5.2em; font-size:10px; background-image:url(../../../images/site/kor/layout/layout.svg); background-repeat:no-repeat; background-position:0 -12em; background-size:100em auto;}
#footer>.item-2>.layout>.item-2-2>.copy{margin:0 10px 0 40px;}
#footer>.item-2>.layout>.item-2-2>.copy>address{font-style:normal; font-weight:300; font-size:16px; color:rgba(255,255,255,0.5);}
#footer>.item-2>.layout>.item-2-2>.copy>address>strong{display:block; margin-bottom:10px; font-weight:300; color:#fff;}
#footer>.item-2>.layout>.item-2-2>.copy>address>p{display:flex;}
#footer>.item-2>.layout>.item-2-2>.copy>address>p>strong{margin-right:20px; font-weight:300;}
#footer>.item-2>.layout>.item-2-2>.copy>p{margin-top:20px; font-weight:300; font-size:16px; color:rgba(255,255,255,0.5);}
#footer>.item-2>.layout>.item-2-2>.tel{flex-shrink:0; display:flex; margin-left:auto;}
#footer>.item-2>.layout>.item-2-2>.tel>li{display:flex; flex-direction:column; align-items:flex-end; justify-content:flex-start;}
#footer>.item-2>.layout>.item-2-2>.tel>li:not(:last-child){margin-right:45px;}
#footer>.item-2>.layout>.item-2-2>.tel>li>strong{font-weight:400; font-size:16px; color:rgba(255,255,255,0.5);}
#footer>.item-2>.layout>.item-2-2>.tel>li>span{font-weight:500; font-size:24px; color:#fff;}

@media screen and (max-width:1200px) {
	#footer>.item-2>.layout>.item-2-2>.tel{flex-direction:column;}
	#footer>.item-2>.layout>.item-2-2>.tel>li:not(:last-child){margin-right:0;}
}
@media screen and (max-width:1000px) {
	#footer>.item-2>.layout>.item-2-2{flex-direction:column;}
	#footer>.item-2>.layout>.item-2-2>.copy{margin:20px 0 0 0;}
	#footer>.item-2>.layout>.item-2-2>.tel{display:none;}
}
@media screen and (max-width:800px) {
    #footer>.item-1>.layout{flex-direction:column; align-items:flex-start;}
    #footer>.item-1>.layout>ul{margin-left:40px;}
}
@media screen and (max-width:600px) {
	#footer>.item-1>.layout>ul>li>a{font-size:16px;}
}
@media screen and (max-width:400px) {
	#footer>.item-1>.layout>ul>li:not(:last-child){margin-right:15px;}
}
@media screen and (max-width:360px) {
    #footer>.item-1>.layout>strong{line-height:24px; font-size:16px;}
    #footer>.item-1>.layout>ul{margin-top:10px;}
    #footer>.item-1>.layout>ul>li>a>span{line-height:1.2;}
}



.season{  
    background-color:#F0F7FE;
    background-image:url(../../../images/site/kor/card/bg-1.svg),
                     url(../../../images/site/kor/card/bg-2.svg),
                     url(../../../images/site/kor/card/bg-3.svg),
                     url(../../../images/site/kor/card/bg-4.svg);
    background-repeat:no-repeat,no-repeat,no-repeat,no-repeat;
    background-position:left top, right 0, left bottom, right bottom;
    background-size:auto,auto,auto,auto;

    
    
    border-radius:8px ; padding: 50px 40px ; font-size: 1.8em; }
.season h2{ text-align: center; font-size: 2em; color:#061D3C;}
.season h2 span{ color: #2f49af;}
.season .desc{ display: flex; justify-content: center; margin: 20px 0 30px; font-size: 1.1em;}
.season .desc li{ padding: 0 20px; line-height: 1;}
.season .desc li:not(:first-child){ border-left: 3px solid #ccc;}
.season .link-wrap{ display: flex; justify-content: center;}
.season .link-wrap a{ background-color: #061d3c; color: #fff; margin: 4px; padding: 10px 20px; border-radius: 30px;min-width: 140px; text-align: center; display: inline-block;}
.season .link-wrap a.dis{ background: #757575;}
.season .link-wrap li:first-child a{ background: #2f49af;}
.c-point{ color: #e75b5b;}
.season .info-box{ background-color: #fff; padding:20px 30px;margin: 30px 15% 0; border: 1px solid rgba(0, 0, 0, 0.1) ; border-radius: 8px;}
