@charset "utf-8";

@import url('reset.css');
@import url('swiper.min.css');
@import url('aos.css');
@import url('layout.css');

@media (min-width: 1024px) {
	#header{height: 81px;transition: all ease .4s;overflow: hidden}
	#header.active{height: 343px;background-color: #fff;}
	#header.active #lnb .sub_depth{visibility:visible;opacity:1;}
	#header.active #lnb > li > a{color: #212529 !important;}
	#header.active .logo > a{background-image: url(../images/logo.png) !important}
	#header.active .head{border-bottom: 1px solid #dee1e6}
	#lnb{margin-left: 90px;position: absolute;top:0;left:50%;transform:translateX(-50%);font-size: 0;white-space:nowrap;transition: right .3s ease}
	#lnb > li{display: inline-block;vertical-align: middle;margin:0 8px;position: relative;transition: padding .3s ease}
	#lnb > li > a{height:80px;padding:0 34px;font-size: 25px;color: #212529;font-weight: 700;letter-spacing: -0.04em;box-sizing: border-box;
		display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;
	    -webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;
	    -webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;
	    -webkit-tap-highlight-color : transparent !important;
	}
	#lnb > li > a:hover,
	#lnb > li.hover > a{color: #1C7ED6;}
	#lnb .sub_depth{display:block;width:100%;position: absolute;top:80px;left:50%;transform:translateX(-50%);box-sizing: border-box;overflow: hidden;}
	#lnb .sub_depth ul{padding-top: 7px;padding-bottom: 2px;}
	#lnb .sub_depth li{margin: 20px 0 21px}
	#lnb .sub_depth a{display: block;text-align: center;padding: 2px 16px;font-size: 16px;font-weight:400;transition: color .1s ease;}
	#lnb .sub_depth a:hover{color: #228BE6;}
	
	#header.main #lnb > li > a{color: #fff;}
}

@media (max-width: 1023px) and (min-width: 768px) {
	.program_list .cont{padding: 31px 20px 30px;}
	.program_list .tit{font-size: 28px;}
	.program_list .cont{font-size: 16px;}
}

@media (max-width: 1023px) {
	.hamberger{display: block;right: 18px}
	#header.active .hamberger.show .btn_total:before, 
	#header.active .hamberger.show .btn_total:after{background-color: #fff !important;}
	#header.active .total_nav{visibility: visible;left:0;opacity: 1;transition: opacity .2s}
	#header.active .total_nav .total_inner{transform:translateX(0);transition: transform .4s .1s}
	.total_nav{opacity: 0;visibility:hidden;position: fixed;top:0;left:100%;width: 100%;height: 100%;background: rgba(0,0,0,.6);z-index: 90;box-sizing: border-box;transition: right .2s ease}
	.total_nav .total_inner{position: absolute;top:0;right:0;height: 100%;width: 80%;overflow:hidden;overflow-y: auto;padding: 50px 0 0;box-sizing: border-box;background-color:#fff;transform:translateX(100%);}

	#lnb > li{text-align: left;border-bottom: 1px solid rgba(0, 0, 0, 0.2)}
	#lnb > li > a{position:relative;font-weight: 500;color: #222;font-size: 20px;display: block;padding: 22px 0;padding-left: 25px;background: url(../images/bul02.png) no-repeat right 16px top 50%;background-size: 12px auto;}
	#lnb > li > a:after{display:block;content:'';width:16px;height:16px;position: absolute;top:50%;right:18px;margin-top:-8px;background: url(../images/icon_plus.png) no-repeat 0 0;background-size:16px 16px}
	#lnb > li.on > a:after{background-image: url(../images/icon_minus.png)}
	#lnb .sub_depth{display:none;border-top: 1px solid rgba(0, 0, 0, 0.2);padding: 15px 0}
	#lnb .sub_depth a{font-size: 15px;font-weight: 400;color: #777;display: block;padding:5px 0;padding-left: 38px;}
	#lnb li.on .sub_depth{display: block}
	
	.total_nav .close{display: block;width: 34px;height: 34px;background: url(../images/close.svg) no-repeat 50% 50%;position: absolute;top:18px;right:13px;background-size: auto 34px}
	
	.gallery_list{margin: 0 -10px}
	.gallery_list > li{padding: 0 10px;margin-bottom: 20px;}
	
	.college_list > li{width: 33.333%}
	
	.business_area {padding: 40px 20px;}
	.business_list ul {padding-left: 20px;padding-right:20px;font-size: 16px;}
	.business_list .tit{width: 193px;height: 193px;font-size: 20px}
	.business_list ul{height: calc(100% - 262px);}
	
	.college_area .college_list .emblem{padding: 24px;}
	
	.organization_area .chart,
	.organization_area .chart .diagram .tit strong,
	.dl01 dt,
	.tbl01 table th{font-size: 20px}
	.organization_area .chart .diagram ol,
	.dl01 dd,
	.organization_area .txt,
	.tbl01 table td{font-size: 18px}
	.organization_area .chart .diagram .tit{font-size: 16px}
	.organization_area .chart .diagram ol > li{margin-left: 15px;}
	.organization_area .chart > ul:before {width: calc(50% + 20px);}
	.organization_area .chart > ul > li:nth-child(2){padding-right: 20px;}
	.organization_area .chart > ul > li:nth-child(3){padding-left: 20px;}
}

@media (max-width: 767px) {
	html, body{font-size: 14px;}
	
	.pc,
	.pc.inline{display: none;}
	.mo{display: block;}
	.mo.inline{display: inline;}
	
	colgroup.pc,
	col.pc,
	th.pc,
	td.pc{display: none}
	
	#header .head{height: 60px;box-sizing: border-box;border-bottom: 0}
	#header .logo{margin-top: 15px;}
	#header .logo > a{width: 151px;height: 30px;}
	
	.hamberger{right: 11px}
	.hamberger .btn_total{width:22px;height:2px;margin-left:-11px;}
	.hamberger .btn_total:before{top:-8px;}
	.hamberger .btn_total:after{top:8px;}
	
	#footer {padding-bottom: 30px;font-size: 14px;}
	#footer .util_link a{height: 43px;font-size: 14px;}
	#footer .util_link .bar{margin: 0 15px}
	#footer .logo{position: relative;top: 0;right: 0;margin-top: 0;width: 126px;height:25px;margin-top: 20px;margin-bottom: 21px;margin-left: 2px}
	#footer .info .resp_inner{padding-top: 0;padding-left: 15px}
	
	.subtitle{margin-top: 60px;margin-bottom: 23px;padding-top: 19px;display: block;font-size: 28px;font-weight: 700;text-align: center;color: #333}
	.subtitle + .sub_visual{margin-top: 0;}
	.sub_visual{height: 200px;margin-top: 60px;}
	.sub_visual .bg{background-position: 50% 50%;background-size: cover;}
	
	.location .resp_inner{padding: 0;height: 53px;}
	.location .home{display: none}
	.location .toggle_btn{font-size: 14px;padding-top: 2px;}
	.location .toggle_list{top: 54px;}
	.location .toggle_list a {padding: 5px 0;padding-left: 15px;font-size: 14px;}
	
	#container{padding-top: 43px;padding-bottom: 64px;}
	
	.title_row{display: block;margin-bottom: 20px;}
	.title01{font-size: 22px}
	.title02{font-size: 36px;margin-bottom: 15px;}
	
	.search_zone{margin-top: 20px}
	
	.board_write {padding-top: 10px;padding-bottom: 15px;}
	.board_write ul {padding: 10px 0;}
	.board_write li{display: block;padding: 6px 0;}
	.board_write .tit{width:100%;font-size: 14px;margin-bottom: 8px;display: block;}
	.board_write .mt1{margin-top: 8px}
	.board_write .row + .tit{width: 100%;padding-left: 0;margin-top: 12px}
	.board_write .code{height: 43px;font-size: 14px;border-radius: 4px;}
	
	.bar{height: 10px;margin: 0 4px;}
	
	.check label{font-size:13px;}
	.int,
	.textarea{border-radius: 4px;font-size: 14px;}
	.int{height: 43px;}
	
	.btn_right{margin-top: 20px}
	.btn_center{margin-top: 35px;}
	.btns.t1{width: 100px;height: 42px;font-size: 14px;border-radius: 4px;}
	.btns.t2{width: 130px;height: 50px;font-size: 14px;border-radius: 6px;}
	.btns.t3{width: 188px;height: 47px;font-size: 18px;}
	.btns.t5{font-size: 16px;width:200px;height: 46px;}
	.btns.t5 span{padding-right: 0}
	.btns.t5 span:after{display: none}
	.btns.t6{width: 68px;height: 26px;font-size: 12px;border-radius: 4px;}
	.btn_prev, 
	.btn_next{font-size: 15px;padding: 0 16px;}
	
	.gallery_list{margin: 0 -6px}
	.gallery_list > li{width: 50%;padding: 0 6px;margin-bottom: 12px;}
	.gallery_list .thumb{border-top-left-radius: 8px;border-top-right-radius: 8px}
	.gallery_list .cont{padding: 14px;border-bottom-left-radius: 8px;border-bottom-right-radius: 8px}
	.gallery_list .tit{font-size: 15px}
	.gallery_list p{font-size: 12px}
	
	.gallery_list + .base_paging {margin-top: 15px;}
	.base_paging .number a, 
	.base_paging .number .on{min-width: 30px;font-size: 14px}
	.base_paging a.page.prev:before {background-position: 0 0;}
	.base_paging a.page.next:before {background-position: -32px 0;}
	
	.tbl_list1 th, 
	.tbl_list1 td{font-size: 13px;padding-left: 2px;padding-right: 2px;}
	.tbl_list1 td.title{padding-left: 8px}
	.tbl_list1 .writer{width: 13%}
	.tbl_list1 .date{width: 13%}
	.tbl_list1 .hits{width: 13%}
	
	.board_view {padding-bottom: 21px;}
	.board_view .title{font-size: 24px;}
	.board_view .info{font-size: 13px;margin-top: 10px;}
	.board_view .top_row {padding-bottom: 12px;}
	.board_view .cont_row{min-height: 120px;font-size: 15px;padding-top: 22px;padding-bottom: 38px;}
	.board_view .tbl_util th, .board_view .tbl_util td{font-size: 14px}
	.board_view .tbl_util th{width: 68px}
	.board_view .tbl_util td{height: 32px}
	
	.qna_list .toggle_btn .tit{font-size: 20px;}
	.qna_list .toggle_btn, 
	.qna_list .toggle_answer{font-size: 15px;padding-left: 40px;}
	.qna_list .info{font-size: 13px}
	.qna_list .toggle_btn:before, 
	.qna_list .toggle_answer:before{width: 30px;height: 30px;font-size: 18px;top:18px}
	
	.qna_view .title_area .tit{font-size: 20px;}
	.qna_view .title_area, 
	.qna_view .answer_area{font-size: 15px;padding-left: 40px;}
	.qna_view .info{font-size: 13px}
	.qna_view .title_area:before, 
	.qna_view .answer_area:before{width: 30px;height: 30px;font-size: 18px;top:18px}
	
	.main_visual{height: 580px}
	.main_visual .cont{margin-top: 40px;text-align: center;letter-spacing: -0.05em;}
	.main_visual .tit{font-size: 32px;line-height: 1.38;}
	.main_visual p{font-size: 16px;font-weight: 300;line-height: 1.35;}
	.main_visual .btns {margin-top: 50px;}
	
	.main_title{font-size: 18px;}
	.main_title p{color: #495057;line-height: 1.4;font-weight: 300}
	
	.main_section01 {padding-top: 61px;padding-bottom: 27px;}
	.main_section02{padding-top: 61px;text-align: center;background-image: url(../images/business_bg_mo.jpg);background-size: cover}
	.main_section02 .main_title{text-align: center}
	.main_section02 .title02 {margin-bottom: 16px;}
	.main_section02 .main_title p{color: #fff;line-height: 1.38;}
	.main_section02 .btns {margin-top: 30px;}
	.main_section03 {padding-top: 61px;padding-bottom: 61px;}
	.main_section03 .title02{margin-bottom: 36px;text-align: center}
	.main_section03 .btn_center{margin-top: 10px;}
	.main_section04 {padding-top: 61px;padding-bottom: 37px;}
	.main_section04 .title02{text-align: center;margin-bottom: 35px;}
	
	.college_list > li{width: 50%;margin-bottom: 32px;}
	.college_list .tit {margin-top: 14px;}
	
	.tab_swiper {margin-bottom: 12px;}
	.tab_swiper a{height: 44px}
	
	.board_swiper a{padding: 20px 12px 38px;height: 194px;}
	.board_swiper .type{padding: 0 10px;height:22px;font-size: 12px;border-radius: 22px}
	.board_swiper .tit{font-size: 16px;line-height: 1.25;}
	.board_swiper .more{font-size: 14px;bottom: 19px;}
	.board_swiper .date{margin-top: 12px;}
	
	.program_list{margin: 0}
	.program_list > li{width: 100%;max-width: 330px;display: block;margin: 0 auto;margin-bottom: 23px;padding: 0}
	.program_list > li a{box-shadow: 0px 2px 16px 0px rgba(0,0,0,0.08);}
	.program_list .thumb{padding-bottom: 63.6%;}
	.program_list .cont{padding: 29px 30px 28px;}
	.program_list .more {margin-top: 32px;}
	
	.greeting_area .point{font-size: 18px;margin-bottom: 20px;}
	.greeting_area{padding-top: 30px;font-size: 16px}
	.greeting_area p{margin-bottom: 22px;}
	.greeting_area .ceo{margin-top: 40px;}
	.greeting_area .ceo .sign{font-size: 25px;margin-left: 10px;display: block;}
	
	.business_area {padding: 40px 20px 8px;}
	.purpose_list dt{float: none;font-size: 16px;width: 160px;margin: 0 auto 25px}
	.purpose_list dd{margin-left: 0;font-size: 14px;padding-left: 22px}
	.purpose_list dt, 
	.purpose_list dd{height: 60px}
	
	.business_list{display: block;}
	.business_list ul{height:auto;font-size: 16px;padding: 23px 0;padding-left: 25px}
	.business_list > li{float: none;width: 100%;margin-bottom: 33px;}
	.business_list ul > li{padding-left: 14px;line-height: 1.5;}
	.business_list ul > li:before{width: 4px;height: 4px;top:.6em;}
	
	.college_area .college_list > li{width: 50%;margin-bottom: 32px;}
	.organization_area .chart .team{width: 100%;height: 56px;}
	.organization_area .chart .top:after,
	.organization_area .chart > ul:before,
	.organization_area .chart > ul > li:nth-child(1):before,
	.organization_area .chart > ul > li:nth-child(2) .area:before,
	.organization_area .chart > ul > li:nth-child(3) .area:before,
	.organization_area .chart .area > ul > li:before{display: none}
	.organization_area .chart > ul > li:nth-child(1){top: 12px;}
	.organization_area .chart .top,
	.organization_area .chart .team,
	.organization_area .chart .diagram{border-radius: 6px;}
	.organization_area .chart .diagram + ul:after{position: absolute;
    display: block;content: '';background-color: #adb6bd;    width: 1px;height: 59px;top: 138px;left: 50%;}
	
	.organization_area .part{padding: 20px;margin-bottom: 40px;}
	.organization_area .chart .diagram ol > li{margin-left: 15px;}
	.organization_area .chart > ul:before {width: calc(50% + 20px);}
	.organization_area .chart > ul > li:nth-child(2){padding-right: 20px;}
	.organization_area .chart > ul > li:nth-child(3){padding-left: 20px;}	
	
	.organization_area .chart > ul{padding-top: 80px}
	.organization_area .chart > ul > li{width: 100%;}
	.organization_area .chart > ul > li:nth-child(2){padding-right: 0;}
	.organization_area .chart > ul > li:nth-child(3){padding-left: 0;}
	
	.organization_area .chart .diagram{margin-bottom: 12px}
	.organization_area .chart .diagram ol,
	.organization_area .chart .diagram.t1 ol{min-height: auto;padding-bottom: 15px;padding-left: 20px}
	.organization_area .txt {margin: 10px 0 15px;}
	.organization_area .chart .diagram .tit {height: 74px;}
	
	.dl01 dt{width: 100%;float: none;height: 50px;margin-bottom: 8px}
	.dl01 dd{margin-left: 0;height: auto;border-radius: 6px;padding: 15px 20px}
	.dl01 dd {padding: 22px 25px;}
	
	.tbl01 table th{height: 68px;}
	.tbl01 table td{height: 58px}
	
	.tbl02 th, 
	.tbl02 td{font-size: 14px;padding: 2px 0}
	.tbl02 th{padding-right: 18px}
	
	.map_box{margin-top: 22px;padding-bottom: 78%;}

	.secret-post{width:14px;height:14px;margin-right:1px}
	
	.layer_cont{padding-top: 36px;}
	.layer_wrap{width:90%;margin-left:-45%;}
	.layer_zone .close{width:40px;height:40px;background-size:20px 20px;}

	#footer .util_link a, #footer .util_link button{height:45px;font-size:13px}
	.terms_area .inner{padding: 35px 15px;height:90vh;overflow:hidden;overflow-y:auto;box-sizing:border-box;}
	.terms_area,
	.terms_area .tit02{font-size:13px;}
	.terms_link > li a{font-size:12px;height: 30px;}
	.terms_area .tit01 {font-size: 20px;margin-bottom: 10px;}
}

@media (max-width: 480px){
	.gallery_list{margin: 0;}
	.gallery_list > li{width: 100%;padding: 0;margin-bottom: 15px;}
	.gallery_list .thumb{padding-bottom: 45%;}
	
	.college_list > li,
	.college_area .college_list > li{width: 100%}
	.college_area .college_list img {width: 140px;}
	
	.organization_area .chart,
	.organization_area .chart .diagram .tit strong,
	.dl01 dt{font-size: 18px}
	.organization_area .chart .diagram ol,
	.dl01 dd,
	.organization_area .txt{font-size: 16px}
	.organization_area .chart .diagram .tit{font-size: 14px}
	
	.tbl01 table th{height: 54px;font-size: 15px}
	.tbl01 table td{height: 45px;font-size: 14px}
	
	.dl01 dd{padding: 15px 18px}
}

@media (max-width: 360px) {

}
