@charset "utf-8";

/*===== 학생생활관 소개 =====*/
/* 인사말 */
.dpt-char-type01.greeting {}
.greeting .txt {font-size:16px;line-height:inherit;}
.greeting-txt {display:block;padding-left:50px;margin-top:40px;box-sizing:border-box;}

@media only screen and (max-width:899px) {
	.greeting-txt {padding-left:25px;margin-top:30px;}
}

@media only screen and (max-width:799px) {
	.greeting .txt {font-size:15px;}
	.greeting-txt {margin-top:0;margin-bottom:30px;}
}

@media only screen and (max-width:699px) {
	.greeting-txt {padding-left:10px;margin-top:30px;margin-bottom:0;}
}

@media only screen and (max-width:599px) {
	.greeting .txt {font-size:14px;line-height:1.6em;}
}

@media only screen and (max-width:499px) {
	.greeting-txt {margin-top:20px;}
}

/* 청운재 개요 */
.outline-wr {position:relative;display:table;width:100%;border-bottom:1px solid #ccc;height:400px;padding:50px 30px;box-sizing:border-box;}
.outline-wr:before {position:absolute;content:"";display:block;top:0;left:0;width:100%;height:4px;background:url(/kor/_Img/Common/c_patt01.png) repeat-x;background-color:#005aab;}
.outline-wr:after {position:absolute;display:block;content:"";width:298px;height:307px;top:50px;right:0;background:url(/dorm/_Img/Content/outline_01.jpg) no-repeat;}
.outline-wr .txt-wr {display:table-cell;vertical-align:middle;box-sizing:border-box;}
.outline-wr dl {position:relative;margin-bottom:30px;}
.outline-wr dl:last-child {margin-bottom:0;}
.outline-wr dl dt {color:#0064bb;font-size:1.125em;margin-bottom:10px;}
.img-list-wr {margin-top:30px;}
.img-list-wr .img-list li {display:inline-block;width:47%;}
.img-list-wr .img-list li:nth-child(n+3) {margin-top:30px;}
.img-list-wr .img-list li img {width:100%;}
.img-list-wr .img-list li:nth-child(2n) {margin-left:5%;}
.img-list-wr .img-list li .txt {position:relative;display:block;padding-left:24px;margin-top:10px;}
.img-list-wr .img-list li .txt:before {position:absolute;display:block;content:"";width:0;height:0;left:0;top:10px;border-right:5px solid transparent;border-left:5px solid transparent;border-bottom:10px solid #004197;}

@media only screen and (max-width:999px) {
	.outline-wr {height:250px;padding:30px 20px;}
	.outline-wr:after {width:210px;height:222px;background-size:210px auto;}
	.outline-wr dl {padding-right:35%;padding-left:15px;}
	.outline-wr dl dt {position:relative;top:auto;left:auto;font-size:18px;padding:10px 0px 0px 0px;}
	.outline-wr dl dd {padding:0px 20px 20px 0px}
}

@media only screen and (max-width:599px) {
	.outline-wr:after {display:none;}
	.outline-wr {padding:20px;}
	.outline-wr dl {padding-right:0;padding-left:0;}
	.outline-wr dl dt  {font-size:16px;}
	.outline-wr dl dd {padding-bottom:0}
	.img-list-wr .img-list li {display:block;width:80%;margin:0 auto 30px;}
	.img-list-wr .img-list li:nth-child(n+3) {margin-top:0;}
	.img-list-wr .img-list li:nth-child(2n) {margin-left:auto;}
	.img-list-wr .img-list li:last-child {margin-bottom:0;}
	.img-list-wr .img-list li .txt {margin-top:12px;}
}

@media only screen and (max-width:499px) {
	.outline-wr {display:block;height:auto;}
	.outline-wr .txt-wr {display:block;vertical-align:top;}
	.outline-wr dl {margin-bottom:20px;}
	.img-list-wr .img-list li .txt:before {top:7px;}
}

/* 조직도 및 담당업무 */
.organization {background:#f7f7f7;padding:60px;text-align:center;}

@media only screen and (max-width:499px) {
	.organization {padding:30px;}
}


/*===== 생활안내 =====*/
/* 비상시 행동요령 */
.emergency-wr .emergency-list li {position:relative;display:inline-block;width:47%;vertical-align:top;}
.emergency-wr .emergency-list li img {width:100%;}
.emergency-wr .emergency-list li:nth-child(2n) {margin-left:5%;}
.emergency-wr .emergency-list li:nth-child(n+3) {margin-top:30px;}
.emergency-wr .emergency-list li .num {position:relative;display:block;float:right;margin-top:-25px;margin-right:33px;color:#fff;font-size:0.938em;text-align:center;font-weight:400;z-index:10;}
.emergency-wr .emergency-list li .num:before {position:absolute;content:"";display:block;width:0;height:0;right:-20px;border-top:43px solid #1b80d8;border-left:28px solid transparent;border-right:28px solid transparent;z-index:-5;box-sizing:border-box;}
.emergency-wr .emergency-list li .txt {float:none;display:block;width:85%;margin-top:20px;}

@media only screen and (max-width:599px) {
	.emergency-wr .emergency-list li {display:block;width:80%;margin:0 auto 30px;}
	.emergency-wr .emergency-list li:nth-child(n+3) {margin-top:0;}
	.emergency-wr .emergency-list li:nth-child(2n) {margin-left:auto;}
	.emergency-wr .emergency-list li:last-child {margin-bottom:0;}
	.emergency-wr .emergency-list li .num {top:50%;}
	.emergency-wr .emergency-list li .txt {width:75%;margin-top:12px;}
}






/* 레이아웃 기본 스타일 선언(컨텐츠 중앙 정렬) : 최대 width 확인 */
.div-abs {position:absolute;}
.m-div-wrap {position:relative;width:100%;text-align:center;margin:0 auto 0 auto;}
.m-div-cont {position:relative;text-align:left;margin:0 auto 0 auto;}
.m-div-cont:after {clear:both;content:"";display:block;}

@media all and (min-width:1200px) {
	.m-div-wrap {min-width:1200px;}
	.m-div-cont {max-width:1200px;width:100%;}
}
@media all and (min-width:481px) and (max-width:759px){
	.m-div-cont , #contents.m-div-cont {margin-left:0px;margin-right:0px;}
}
@media all and (max-width:480px){
	.m-div-cont, #contents.m-div-cont {margin-left:0px;margin-right:0px;}
}
.m-div-gap {height:20px;display:block;}
.mw-wrap {position:relative;width:100%;height:100%;}

/*///////////////////////////*/
#main-container {padding-top:268px;background:#bebec0}

/* 메인 비쥬얼 */
.msec-mvisual {position:absolute;width:100%;height:auto;overflow:hidden;z-index:1;top:0;}
#mvisual-wr .visimg-wr {position:relative;}
#mvisual-wr .visimg-img {position:absolute;top:0;left:0;transition:left .3s ease, margin .3s ease}
#mvisual-wr .visimg-img img {width:100%;vertical-align:top;}
#mvisual-wr .visimg-bg {display:none;}
#mvisual-wr .ctrl-nums {position:absolute;top:100px;left:50%;margin-left:-2%;z-index:5000;width:auto;text-align:center;background:rgba(0,0,0,0.3);display:block;padding:0 12px}
#mvisual-wr .ctrl-nums button, #mvisual-wr .ctrl-nums .nums button {border:0;width:35px;height:40px;background:url(/_Img/Template/Main/mvis_ctrl_btns.png) no-repeat;vertical-align:top;}
#mvisual-wr .ctrl-nums button span {width:1px;height:1px;overflow:hidden;position:absolute;top:-1000px;}
#mvisual-wr .ctrl-nums button.btn-stop {background-position:-13px 0}
#mvisual-wr .ctrl-nums button.btn-play {background-position:-149px 0;display:none;}
#mvisual-wr .ctrl-nums .nums button {background-position:-48px 0}
#mvisual-wr .ctrl-nums .nums button.active {background-position:-79px 0}
#mvisual-wr .ctrl-nums .btn-prev, #mvisual-wr .ctrl-nums .btn-next {display:none;}

/* 메인 컨텐츠 */
.mcont-wr {position:relative;padding-bottom:45px;max-width:1200px;margin-left:auto;margin-right:auto;z-index:10}
.mcont-wr .msec01 {position:absolute;top:0;left:0;width:270px;height:380px;overflow:hidden;}
.mcont-wr .msec02 {float:left;margin-left:310px;width:48.3%;margin-bottom:40px;}
.mcont-wr .msec02 > div {margin-right:310px;width:100%;}
.mcont-wr .msec02 .m-notice {height:290px;padding:20px 30px 0;box-sizing:border-box;background:#fff;}
.mcont-wr .msec02 .m-notice .no-data {padding-top:110px}
.mcont-wr .msec03 {clear:both;margin-right:310px;width:auto;}
.mcont-wr .msec04 {position:absolute;top:0;right:0;width:270px;}
.mcont-wr .msec04 .m-pop {height:258px;margin-bottom:40px;background:#16395e;padding:12px 15px 16px;box-sizing:border-box;}
.mcont-wr .msec04 .m-pop .mpop-kookje-01 h3 {background:#16395e;padding-left:0}
.mcont-wr .msec04 .m-link02 {height:258px}
@media only screen and (max-width:1199px){
	#main-container {padding-top:20%;}
	.mcont-wr {padding-bottom:0;}
	.mcont-wr .msec01 {position:relative;top:auto;left:auto;width:auto;height:auto;margin-right:290px;margin-bottom:20px;}
	.mcont-wr .msec01 li {width:16.6%;}
	.mcont-wr .msec02 > div {width:auto;margin-right:290px}
	.mcont-wr .msec02 {float:none;margin-left:0;width:auto;margin-bottom:20px}
	.mcont-wr .msec02 .m-notice {height:280px;}
	.mcont-wr .msec03 {margin-right:0}
}
@media only screen and (max-width:799px){
	.mcont-wr .msec01, .mcont-wr .msec02 > div {margin-right:0;}
	.mcont-wr .msec02 .m-notice {height:275px}
	.mcont-wr .msec04 {position:relative;top:auto;right:auto;padding:0 0 20px 290px;width:auto;margin-top:20px;}
	.mcont-wr .msec04 .m-pop {position:absolute;top:0;left:0;margin-bottom:0}
	.mcont-wr .msec04 .m-link02 {width:100%;}
}
@media only screen and (max-width:699px){
	.mcont-wr {margin-left:15px;margin-right:15px;}
	.mcont-wr .msec01 {margin-bottom:10px;}
	.mcont-wr .msec02 {margin-bottom:10px;}
}
@media only screen and (max-width:599px){
	.mcont-wr .msec02 .m-notice {padding:10px 15px 0;height:240px;}
}
@media only screen and (max-width:549px){
	.mcont-wr .msec04 {padding-left:0;margin-top:10px;}
	.mcont-wr .msec04 .m-pop {position:relative;top:auto;left:auto;margin-bottom:10px;height:auto;}
	.mcont-wr .msec04 .m-link02 {height:100%;}
}
@media only screen and (max-width:499px){
	.mcont-wr .msec04 {padding-bottom:15px;}
}
@media only screen and (max-width:439px){
	.mcont-wr .msec01 li {width:33.33%;}
}
@media only screen and (max-width:399px){
	.mcont-wr .msec01 {margin-bottom:0}	
} 
