@charset "utf-8";

@media screen and (max-width: 1700px) {
}

@media screen and (max-width: 1600px) {

.container{padding:0 20px;}
.container_wrap{padding: 0 20px;}

.logo{width: 310px;}
.depth1 > ul > li > a{font-size:1.6rem;word-break: keep-all;padding: 8px 0px;}

#sc2 .container_wrap{padding:0;}
    
.sub_title{padding:100px 20px 50px 20px}

/* 푸터 */
footer > section{padding: 0 20px;}
footer #footWrapper{margin:20px 0;}
}

@media screen and (max-width: 1497px) {

html{font-size:9px;}

/* 	헤더 */
.icon_box {width: 140px;margin-right: 20px;}
.icon_box .login_btn{}
.icon_box .tsu_home {display:none;}
.icon_box > li a{font-size: 1.6rem;margin-left: 0;padding: 5px 5px;height: auto;/* width: 59px; */height: 40px;}
.icon_box .log_btn img{display: none;}

.logo{width: 270px;margin-left: 20px;}
.gnb > li > a{font-size: 2rem;}
.gnb > li ~ li {}
.gnb{width: 100%;max-width: calc(100% - 480px);}

/*메인 퀵버튼*/
#sc0 .main_quick{width: 980px;}
#sc0 .button_ul .btn ~ .btn{margin-left: 10px;}


/* 	카드 슬라이드 */
#sc2 .card_container .swiper-slide{}

.list_form.grid_form a{width: 31.3%;}

}

@media screen and (max-width: 1400px) {

#sc0 .main_quick {width: 100%;display: flex;flex-direction: column;align-items: center;text-align: center;}
    
/*카드슬라이드*/
#sc2 .card_container .img_box{height: 230px;}

/*푸터 */
footer > section{display: flex;flex-direction: column;align-items: flex-start;}

/*비교과프로그램*/
#sub1 .link_ul{width:100%;}
#sub1 .link_ul a{}

.mile_btn  .link_ul{width:100%;}

.tCard_ul > li{width: calc(50% - 20px);margin-bottom: 30px;margin-left: 15px !important;}
.tCard_ul {display: flex;flex-wrap: wrap;justify-content: center;}



}

@media screen and (max-width: 1200px) {

/* 헤더 */
.logo{width: 400px;}
.gnb{display:none;}

.icon_box .log_btn{display:none;}
.icon_box .mobile_map, .icon_box .m_nav{display: block !important;border-radius: 0;}
.mobile_map.active{display:none;}
.snav_close_li.active{display: block !important;}
.snav_close_li.active .snav_close{display:block;}
.notice_tab button{}

header{height:80px;}
.mobile_map {display:block;}
.icon_box{height:80px;margin-right: 0;display: flex;align-items: center;}
 .icon_box > li .search_icon{position:absolute;right: 70px;top: 20px;}
.icon_box .m_nav{height:80px;width: 0;}
.mobile_map::before{display:block;}

/*메인슬라이드 */
.main-swiper-container .swiper-slide{height: 500px;}
#sc0 .main_quick > span{line-height: 1.2;margin-top: 10px;text-shadow: -1px 0 2px var(--slide-shadow-color), 0 1px 2px var(--slide-shadow-color), 1px 0 2px var(--slide-shadow-color), 0 -1px 2px var(--slide-shadow-color);opacity: 1;}
#sc0 .button_ul{margin-top:20px;}

/*메인 슬라이드 */
#sc0 .button_ul .btn{width: 80px;height: 80px;padding: 0 3px;margin: 0;}
#sc0 .button_ul li span{font-size:1.6rem;}
#sc0 .button_ul li{padding: 7px;}
#sc0 .button_ul .btn:nth-child(3n+1){margin-left:0;}
#sc0 .button_ul .btn::before{width: 100%;height: 50px;margin-bottom: -6px;margin-top: 5px;background-size: 770%;margin-bottom: -3px;}
#sc0 .button_ul .btn_1::before{background-position: 13px 0;}
#sc0 .button_ul .btn_2::before{background-position: -86px 0;}
#sc0 .button_ul .btn_3::before{background-position: -195px 0;}
#sc0 .button_ul .btn_4::before{background-position: -300px 0;}
#sc0 .button_ul .btn_5::before{background-position: -405px 0;}
#sc0 .button_ul .btn_6::before{background-position: -511px 0;}
#sc0 .button_ul .btn_7::before{background: url(../images/main/main_icon_etc.png) no-repeat center center;background-size:contain;width: 80px;}

/* 비교과프로그램 */
.list_view .img_box{width:100%;}
.list_view .txt_box{width:100%;margin-top: 15px;}
.pro_appli{float:right;}
.tg{width:100%;margin:0;}
.tg ~ .tg{margin-top:40px;}

.list_left{width:100%;}
 .list_right{margin:0;margin-top: 20px !important;width:100%;}
.list_right.pc{display:none;}
.list_right.mo{display:block;}

/* 준비중 */
#ready{height: calc(100vh - 288px - 143px - 130px);}
#ready img{width: 50%;}
#ready .txt_box > span{font-size: 2.3rem;}

/* 마이페이지 */
#mypage .box{padding: 25px 20px;}
#mypage .top-area .first{width:100%;height: auto;margin-bottom: 40px;display: flex;flex-direction: column;align-content: center;justify-content: center;align-items: center;}
#mypage .top-area .first .btn_st2{width:100%;}
#mypage .top-area .second{width:100%;}
#mypage .mid-area .second{width:100%;margin-bottom: 40px;}
#mypage .mid-area .third{width:100%;}
#mypage .print{top: 25px;right: 70px;}
#mypage .more{right:20px; top:25px;}
#mypage .table_st3 a{display: flex;flex-direction: column;width: 100%;height: auto;justify-content: flex-start;align-items: stretch;}
#mypage .table_st3 a div{width:100%;}
#mypage .table_st3 a div:nth-of-type(1){text-align:left;font-size:1.6rem;font-weight:400;margin-bottom:5px;}
#mypage .table_st3 a div:nth-of-type(2){display:none;}
#mypage .table_st3 .ellipsis{width:100%;text-indent:0;margin: 2px 0;}
#mypage .table_st3 button{height: 35px;display: flex;justify-content: center;margin-top: 7px;}

button.btn_st2 {}

/* 캘린더 */
#calendar{width:100%;margin: 0;}
.today_list{width:100%;margin-top: 30px;}
.today_list ul{max-height:300px;}

.c_legend{margin-top:20px;display: flex;justify-content: center;height: auto;align-items: center;}
.c_right{width:100%;}
.c_right li{width: 90px;display: flex;justify-content: flex-start;}
 .today_list li{width:100%;}
    
.calendar_nav{width:100%;}
.calendar_nav button.today{position: relative;float: right;}

/* 학생경력개발시스템 소개 */
.guide_wrap{padding: 60px 50px 0;width: 100%;display: flex;}
.guide_wrap .left{width:100%;display: inline-block;max-width: 100%;text-align: center;margin-bottom: 30px;}
.guide_wrap .right{width: 100%;}
.guide_wrap .right img{/* float:right; */width: 60%;margin: 0 auto;display: block;}
.guide_wrap br{display:block;}

 .pro_appli{margin-left: 5px;}

}


@media screen and (max-width: 969px) {
.img_box .mo{display: block;}
.img_box .pc{display:none;}
 
.txt_arow li{width: 50%;}
.txt_arow li:nth-child(3)::before{display:none;}
.txt_arow li:nth-child(3){background: #fff;color: #4c4f89;border: 1px solid #4c4f89;}
.txt_arow li:nth-child(4){background: #4c4f89;color: #fff;}
.txt_arow li:nth-child(4)::before{border-color: transparent transparent transparent #fff;}
 
/* 메인탭 */

/* 비교과프로그램 */
.sub_title h2::before{display:none;}

#sub1 .link_ul{border-radius:0;border: none;}
#sub1 .link_ul a{border-radius:0;width: calc(50% - 5px);margin-bottom: 10px;border: 1px solid #bbb;flex: none;}
#sub1 .link_ul a ~ a{margin-left:10px;}
#sub1 .link_ul a:nth-child(2n+1){margin-left:0;}
#sub1 .button_ul{width:100%;display: flex;}
#sub1 .button_ul button{flex:1;}

.mile_btn .link_ul{border-radius:0;border: none;}
.mile_btn .link_ul a{border-radius:0;width: calc(50% - 5px);margin-bottom: 10px;border: 1px solid #bbb;flex: none;}
.mile_btn .link_ul a ~ a{margin-left:10px;}
.mile_btn .link_ul a:nth-child(2n+1){margin-left:0;}
.mile_sbtn .button_ul{width:100%;display: flex;}
.mile_sbtn .button_ul button{flex:1;}

/* 핵심역량 */
.ability_con li{width:100%;}
.ability_con .squre{width: calc(100% - 334px);}

/*검색창*/
.srch_box .sub_input{display: flex;flex-direction: column;margin-top: 30px;}
.srch_box .sub_input select{width:100%;}
 .srch_box .detail_src li > div select{margin-bottom:5px;flex: none;}
.srch_box .sub_input .search_btn{margin-left:0;}

.srch_box .sub_input input{margin-top:10px;width:100%;min-width: auto;}
.srch_box .sub_input{width:100%;max-width: 100%;}
.srch_box .sub_input .input_src_box{width:100%;}
.srch_box .sub_input .search_btn{width:100%;margin-top:10px;}
 .srch_box .datail_menu{padding:0;width: 100%;}

/*역량진단*/
.test_form.list_form .txt_box li{width:100%;}
.test_form.list_form .txt_box{height:auto;padding: 20px 0;}
.test_form.list_form a .btn_st1{margin: 0 20px;width: calc(100% - 40px);}

footer #footWrapper .foot h2 {padding-bottom: 0;}

/* 학생경력개발시스템 소개 */
.guide_wrap .right img{width:80%;}

.list_form.grid_form a{width: 48.3%;}

.detail_src{max-width:100%;margin-bottom: 30px;}
.search_btn .datail_menu, .search_btn .form form{max-width:100%;width:90%;}

 .bbs_list .btn_li .info{width: 100%;}
 .bbs_list .btn_li .num{display:none;}
 .bbs_list .btn_li button{ margin-top: 10px; float: right; margin-left: auto; }
 .bbs_list .btn_li .btn_box{width:100%;}
 .bbs_list .btn_li .btn_box button{flex:1;}
}


@media screen and (max-width: 767px){

.tCard_ul > li{width: 100% !important;margin-left: 0 !important;}


/*메인탭*/
#sc2 .card_container .swiper-slide a{width:100%;max-width: 100%;}
#sc2 .tab_ul{display: flex;flex-wrap: wrap;margin-bottom: 20px;}
#sc2 .tab_ul button{margin: 0 0 10px 0;width: calc(50% - 5px);}
#sc2 .tab_ul button ~ button{margin-left:10px;}
#sc2 .tab_ul button:nth-child(2n + 1){margin-left:0;}
    
/* 검색창 */
.srch_box .sub_input input{margin-top:10px;width:100%;min-width: auto;}
.srch_box .sub_input{width:100%;max-width: 100%;}
.srch_box .sub_input .input_src_box{width:100%;}
.srch_box .sub_input .search_btn{width:100%;margin-top:10px;}

.logo{margin-left:20px;width: 67%;}
.m_logo{width: 80%;}
 .m_logo img{width:100%;}
.icon_box > li ~ li{margin-left:0;}

/*메인슬라이드*/
#sc0 .main_quick b{font-size: 3rem;}
#sc0 .main_quick b span{font-size: 3rem;}
#sc0 .main_quick > span{font-size:2rem;word-break: keep-all;padding: 0;}
#sc0 .main_quick > span br{display:none;}
#sc0 .button_ul{margin-top:10px;display: flex;flex-wrap: wrap;justify-content: center;}
#sc0 .button_ul .btn{font-size: 1.4rem;}
#sc0 .button_ul .btn:hover{transform:translate(0px, 0px);}
#sc0 .button_ul li{margin-bottom:10px;padding: 3px 4px;}

/*카드슬라이드*/
#sc2 .card_controll{display: flex;flex-direction: column;}
#sc2 .card_controll > div{width: 100%;margin-bottom: 20px;}

/*비교과프로그램*/
#sub1 .sub_title::before{width: 100px;height: 180px;background-size: cover;}
#sub1 .sub_title::after{height: 250px;width: 90px;background-size: cover;}
#sub1 .link_ul a{width:100%;height: 50px;font-size: 1.8rem;}
#sub1 .link_ul a ~ a{margin-left: 0;}
#sub1 .button_ul{display: flex;flex-wrap: wrap;margin-top: 20px;}
#sub1 .button_ul button{margin:0 0 10px 0;width: calc(50% - 5px);flex: none;}    
#sub1 .button_ul button ~ button{margin-left: 10px;}
#sub1 .button_ul button ~ button:nth-child(2n+1){margin-left:0;}
#sub1 .list_view{margin-top: 40px;padding-top: 30px;}

.mile_btn .link_ul a{width:100%;height: 50px;font-size: 1.8rem;}
.mile_btn .link_ul a ~ a{margin-left: 0;}
.mile_sbtn{display: flex;flex-wrap: wrap;margin-top: 20px;width: 100%;}
.mile_sbtn button{margin:0 0 10px 0;width: calc(50% - 5px);flex: none;}    
.mile_sbtn button ~ button{margin-left: 10px;}
.mile_sbtn button ~ button:nth-child(2n+1){margin-left:0;}

.sub_title h2{font-size: 5rem;}
    
.list_view .txt_box .title{font-size:2.3rem;}
    
.list_form .img_box{width:100%;}
.list_form .txt_box{width:100%;height: auto;padding: 20px !important;margin-top: 10px;}
.list_form .txt_box .title{font-size: 2.3rem;}
.list_form a{margin-bottom:20px;}

.list_view .img_box{height: 250px;}

/* 일반페이지 */
#sub2 .sub_title::before{height: 210px;width: 130px;}
#sub2 .sub_title::after{height: 250px;width: 160px;top: -90px;}

/* 핵심역량 */
.ability_con li{width:100%;position: relative;}
.ability_con .squre{width: 100%;padding: 27px 30px;min-width: 140px;height: auto;margin-bottom: 10px;margin-top: 150px;border-radius: 10px;}
.ability_con .squre02{margin-top: -20px;}
.ability_con .round{width: 100%;height: 140px;float: right;position: absolute;z-index: 10;top: 0;left: 0;border-radius: 10px;border: 3px solid;}
.ability_con .left{margin-right:10px;}
.ability_con .round::after{display:none;}
.ability_con .round::before{display: none !important;}
.ability_con .squre::before, .ability_con .squre::after{display: none !important;}

/*페이징 */

/* 푸터 */
footer #footWrapper .foot .address{padding-bottom: 40px;margin: 0;}

/*일반게시판 - 뷰페이지 */
.view_controll{margin-top: 20px;}
.view_controll > a:not(.btn_st2){width: 100%;margin-bottom: 10px;}
.view_controll > a.btn_st2{width:auto;margin: 0 10px;}
.view_controll p{padding: 0;}
.view_controll .prev p{margin-left:10px;}
.view_controll .next p{margin-right:10px;}

.bbs_bottom{width:100%;}
.bbs_bottom a{width:100%;margin-bottom:10px;}
.bbs_bottom a ~ a {margin-left:0;}

footer .linkArea select:last-child{margin-left:0;}
footer .linkArea select{margin-bottom:20px;}

/* 준비중 */
#ready{}
#ready img{width: 100%;max-width: 398px;}
#ready h2, .list_form .search_no > span, #ErrorPage .txt_box h2{font-size: 4rem;}
#ready .txt_box > span, .list_form .search_no, #ErrorPage .txt_box span{font-size: 2rem;word-break: keep-all;}

/* 마이페이지 */
#mypage .top-area .second .left{width:100%;}
#mypage .top-area .second .right{width:100%;margin-top: 25px;}
#mypage .mid-area .third .left{width:100%;height: auto;}
#mypage .mid-area .third .right:not(ul){width:100%;margin-top: 45px;}
#mypage .chart_box02{height:350px;}
#mypage .mid-area2 .box{width:100%;}
#mypage .mid-area2 .first{margin-bottom:40px;}
#mypage .bot-area .box{width:100%;}
#mypage .bot-area .first{margin-bottom:40px;}

#mypage .mid-area .third{padding-bottom: 25px !important;}
#mypage .mid-area .third table tr, 
#mypage .mid-area .third table td, 
#mypage .mid-area .third table th,
#mypage .table_st1 tr,
#mypage .table_st1 td,
#mypage .table_st1 th {border:none;display: inline-block !important;}
#mypage .mid-area .third table td,
#mypage .table_st1 td {width: calc(100% - 90px) !important;padding: 20px 0;}
#mypage .table_st1{width:100%;}
#mypage .table_st1 col,
#mypage .table_st1 td,
#mypage .table_st1 tr,
#mypage .table_st1 th,
#mypage .table_st1 thead,
#mypage .table_st1 tbody,
#mypage .table_st3 col,
#mypage .table_st3 td,
#mypage .table_st3 tr,
#mypage .table_st3 th,
#mypage .table_st3 thead,
#mypage .table_st3 tbody
{display: inline-block !important;width: 100% !important;}
#mypage .table_st3 tr td:nth-child(3){text-align:center;color: #545454;}
#mypage .table_st3 td:nth-child(2){display: none !important;}
#mypage .table_st3 tr td:nth-child(1){font-weight: 600;}
#mypage .mile_table td .progress{margin-left:0;}
#mypage .table_st1 tr{border-bottom:1px solid #000;}
.table_st1 tbody tr:nth-child(1) th,
.table_st1 tbody tr:nth-child(1) td,
.table_st1 tbody th,
.table_st1 tbody td{border-top: none !important;}
.table_st1 tbody tr:nth-child(1) th{border-bottom: 1px solid #ddd !important;}
#mypage .table_st1 td:nth-child(2){text-align: left;padding: 0 10px;font-size: 1.6rem;}
#mypage .top-area .table_st1 td,
#mypage .mid-area .table_st1 td,
#mypage .table_st2 th,
#mypage .mid-area2 td:nth-child(1){font-size: 1.8rem;font-weight:600;padding: 10px 0 0 0;}
#mypage .mid-area2 td:nth-child(1){padding:0;}
#mypage .table_st2 th{padding:10px 0;}
#mypage .top-area .table_st1 td{padding-top: 5px;text-align: left;}
#mypage .table_st1 td a{margin: 39px auto 10px;display: inline-block;font-size: 1.6rem;}
#mypage .mid-area .table_st1 td:nth-child(1) {text-align:left;border: none;width: 80px !important;margin-bottom: 10px;display: inline-block !important;}
#mypage .table_st1 td:nth-child(3){padding-top:0;}

/* 캘린더 */
#calendar .the_more .pc, .event{display:none;}
#calendar{grid-auto-rows: 80px;}
#calendar .the_more .mobile{position:absolute;width: 10px;height: 10px;background: var(--prgress-color-02);border-radius: 50%;left:50%;top: 70%;transform: translate(-50%, -50%);}

/**/
#ErrorPage .error_box::before{width: 130px;}
#ErrorPage .error_box span{font-size:9rem;}
#ErrorPage .error_box em{font-size:2rem;}

/* 학생경력개발시스템 소개 */
.guide_wrap .right img{width:100%;}
.guide_wrap{padding: 30px;}

.search_btn .search_wrap select{width: auto !important;font-size: 16px;} 
.search_btn input{font-size: 16px !important;}
.detail_src .select_box1 select{margin-bottom:5px;width: 100%;}


}

@media screen and (max-width: 600px) {
.list_form.grid_form a{width: 100%;}
.txt_arow li{width: 100%;}
.txt_arow li::before{display:none;}
 .txt_arow li:nth-child(2n){
    background: #fff;
    color: #4c4f89 !important;
}
 .txt_arow li:nth-child(2n + 1){background: #4c4f89;color: #fff !important;}
}

@media screen and (max-width: 345px) {

#sc0 .button_ul .btn:first-child{margin-left: 0 !important;}
#sc0 .button_ul .btn:nth-child(2n+1){margin-left:0;}
#sc0 .button_ul .btn:nth-child(3n+1){margin-left:10px;}

/**/
#ErrorPage button{width:100%;}
}