/* ==========================================================================
   Intro
   ========================================================================== */

#wrap-d-intro {
    width: 100%;
    height: 728px;
    background: url(../../images/depart/intro/bg_intro.jpg) no-repeat top center;
}
.row-d-intro {
	width: 100%;
	height: 100%;
	max-width: 2000px;
	margin: 0 auto;
}
.intro-depart {
	position: relative;
	height: auto;
	padding-top: 90px;
}
.list-depart {
    position:relative;
	display: block;
	margin: 0 auto;
	max-width: 873px;
	height: 619px;
    background:url(../../images/depart/intro/depart_group_nbg.png) no-repeat;
}
.list-depart li {
	float: left;
    position:absolute;
	width: 194px;
	height: 225px;
	transition: all 0.3s ease-in-out;
}
.list-depart li h2 {
    padding: 35rem 0 0 0;
    font-size: 1.25rem;
    display: none;
}	

/* 20200619 2021학년도 학부개편 학과소개페이지 수정 */
.list-depart li.group1 {
	background: url(../../images/depart/intro/depart_group_n01.png) no-repeat center top;
	background-size: contain;
    left:291px;
}
.list-depart li.group2 {
	background: url(../../images/depart/intro/depart_group_n02.png) no-repeat center top;
	background-size: contain;
    top:169px;
    left:0;
}
.list-depart li.group3 {
	background: url(../../images/depart/intro/depart_group_n03.png) no-repeat center top;
	background-size: contain;
    top:169px;
    left:194px;
}
.list-depart li.group4 {
	background: url(../../images/depart/intro/depart_group_n04.png) no-repeat center top;
	background-size: contain;
    top:169px;
    left:388px;
}
.list-depart li.group5 {
	background: url(../../images/depart/intro/depart_group_n05.png) no-repeat center top;
	background-size: cover;
    top:169px;
    left:582px;
}
.list-depart li.group6 {
	background: url(../../images/depart/intro/depart_group_n06.png) no-repeat center top;
	background-size: contain;
    top:338px;
    left:97px;
}
.list-depart li.group7 {
	background: url(../../images/depart/intro/depart_group_n07.png) no-repeat center top;
	background-size: contain;
    top:338px;
    left:485px;
}
/* 20200619 2021학년도 학부개편 학과소개페이지 수정 */

.list-depart li.group1 h2,
.list-depart li.group2 h2,
.list-depart li.group3 h2,
.list-depart li.group4 h2,
.list-depart li.group5 h2,
.list-depart li.group6 h2,
.list-depart li.group7 h2,
.list-depart li.group8 h2,
.list-depart li.group9 h2 {
  background:none;
  text-indent:-9999px;
}

.list-depart li a{
	display: block;
	width: auto;
	height: 100%;
	color: #fff;
	text-align: center;
	transition: all 0.3s ease;
	box-sizing: border-box;
}
/*
.list-depart li a:hover {
	box-shadow: inset 0 0 0 1px rgba(192, 12, 12, .8);
}
*/
.intro-depart .title-box-depart {
	position: absolute;
	width: 100%;
	top: 305px;
	text-align: center;
}
.intro-depart .title-depart {
	display: none;
    padding: 10px 30px;
    border: 6px solid #fff;
    font-size: 1.4rem;
    color: #fff;
    font-weight: 600;
}


.modal-depart, .modal-container, #slide-modal, .bg1 {
	height: 100%;
	width:100%;
	max-width:2000px;
}

.modal-depart .modal-box {
	width: 100%;
    max-width: 2000px;
    height: 728px;
    background: url(../../images/depart/intro/bg_modal.png) repeat left top;
    color: #fff;
    padding: 80px 0 80px 0;
    margin: 0 auto;
    box-sizing: border-box;
    text-align: center;
}
.modal-depart .bg1 {
	background: url(../../images/depart/intro/bg_2021_depart1.jpg) no-repeat center top;
}
.modal-depart .bg2 {
	background: url(../../images/depart/intro/bg_2021_depart2.jpg) no-repeat center top;
}
.modal-depart .bg3 {
	background: url(../../images/depart/intro/bg_2021_depart3.jpg) no-repeat center top;
}
.modal-depart .bg4 {
	background: url(../../images/depart/intro/bg_2021_depart4.jpg) no-repeat center top;
}
.modal-depart .bg5 {
	background: url(../../images/depart/intro/bg_2021_depart5.jpg) no-repeat center top;
}
.modal-depart .bg6 {
	background: url(../../images/depart/intro/bg_2021_depart6.jpg) no-repeat center top;
}
.modal-depart .bg7 {
	background: url(../../images/depart/intro/bg_2021_depart7.jpg) no-repeat center top;
}

.modal-depart h3 {
    font-size: 1.54rem;
	padding: 150px 0 0 0;
}
.modal-depart .bg1 h3 {
	background: url(../../images/depart/intro/icon_2021_dapart1.png) no-repeat center 40px;
}
.modal-depart .bg2 h3 {
	background: url(../../images/depart/intro/icon_2021_dapart2.png) no-repeat center 40px;
}
.modal-depart .bg3 h3 {
	background: url(../../images/depart/intro/icon_2021_dapart3.png) no-repeat center 40px;
}
.modal-depart .bg4 h3 {
	background: url(../../images/depart/intro/icon_2021_dapart4.png) no-repeat center 40px;
}
.modal-depart .bg5 h3 {
	background: url(../../images/depart/intro/icon_2021_dapart5.png) no-repeat center 40px;
}
.modal-depart .bg6 h3 {
	background: url(../../images/depart/intro/icon_2021_dapart6.png) no-repeat center 40px;
}
.modal-depart .bg7 h3 {
	background: url(../../images/depart/intro/icon_2021_dapart7.png) no-repeat center 40px;
}

.modal-depart em {
	background: url(../../images/depart/intro/line_depart.gif) no-repeat center top;
    padding: 28px 0 0 0;
    margin: 4px 0 0 0;
    display: block;
}
.modal-depart p {
	background: url(../../images/depart/intro/line_depart.gif) no-repeat center top;
    font-size: 0.8rem;
	padding: 28px 0 0 0;
    margin: 10px 0 0 0;
	color: #c1c1c1;
}
.name-depart {
	width: 60%;
	margin: 0 auto;
	margin-top: 30px;
}
.name-depart li {
	width: 20%;
	display: inline-block;
	height: 34px;
    line-height: 34px;
	background: url(../../images/depart/intro/btn_modal.png) no-repeat right top;
	text-align: center;    margin: 5px !important;
    transition: all 0.2s ease;
	border-left: 1px solid #5c5855;
}
.name-depart li:hover {
	background: url(../../images/depart/intro/btn_modal_ov.png) no-repeat right top;
}
.name-depart li a {
	width: 100%;
	display: block;
	color: #fff;
	font-size: 0.8rem;
}
.modal-pos {
	position: absolute;
	left: 0px;
	top: -728px;
    width:100%;
	transition: all 0.4s ease;
}
.modal-pos.on {
	top: 0;
	display: block;
}
.modal-close {
    position: absolute;
    right: 10%;
    top: 17px;
    z-index: 10;
    width: 50px;
    margin-left: 465px;
    height: 50px;
    background: url(../../images/depart/intro/btn_modal_close.png) no-repeat center center;
}
.modal-close button {
	width: 50px;
	height: 50px;
	text-indent: -9999px;
}
.arrow_modal  {
	width: 40px;
    height: 80px;
    display: inline-block;
    position: absolute;
    top: 325px;
	z-index: 10;
}
.arrow_modal.next {
    right: 0px;
    background: url(../../images/main/arrow_depart_right.png) no-repeat center center;
}
.arrow_modal.prev {
    left: 0px;
    background: url(../../images/main/arrow_depart_left.png) no-repeat center center;
}

#slide-modal {
	/* background: url(../../images/depart_intro/happy_intro_bg1.png) no-repeat 93% top; */
}
#slide-modal li.list-modal {
	padding: 0;
}


/* ==========================================================================
   반응형 1280px 이하
   ========================================================================== */

@media all and (max-width: 1280px) {
	
}

/* ==========================================================================
   반응형 1000px 이하
   ========================================================================== */
   
@media all and (max-width: 1000px) {
	.list-depart li {
        width: 194px;
        height: 225px;
		/* background-position: center -100px !important; */
	}
	.list-depart li h2 {
		padding: 14rem 0 0 0;
		background-position: center 7rem !important;
	}
	.intro-depart .title-box-depart,
    .intro-depart2 .title-box-depart{
		display: none;
	}
	.modal-depart .modal-box {
		width: 85%;
		padding: 10px 60px;
		display: table-cell;
		vertical-align: middle;
		box-sizing: border-box;
	}
	.modal-depart em br {
		display: none;
	}
	.name-depart {
		width: 100%;
	}
	.name-depart li {
		width: 20%;
	}
	.modal-close {
		left: auto;
		right: 20px;
		margin-left: 0px;
	}
	.modal-depart .modal-box {
		height: 728px;
	}
	#slide-modal li.list-modal {
		padding:  0;
	}
}


/* ==========================================================================
   반응형 768px 이하
   ========================================================================== */
   
@media all and (max-width: 768px) {    

    /* 20200619 2021학년도 학부개편 학과소개페이지 수정 */
    .list-depart {
        width: 100%;
        max-width:600px;
        overflow:hidden;
        background:none;
    }
    .list-depart li {
        width: 194px;
        height: 225px;
    }

    .list-depart li.group1 {left: 97px;top: 0;}	
    .list-depart li.group2 {left: 291px;top: 0;}	
    .list-depart li.group3 {left: 0;top: 167px;}	
    .list-depart li.group4 {left: 194px;top: 167px;}	
    .list-depart li.group5 {left: 388px;top: 167px;}	
    .list-depart li.group6 {left: 97px;top: 335px;}	
    .list-depart li.group7 {left: 291px;top: 335px;}	
    /* 20200619 2021학년도 학부개편 학과소개페이지 수정 */
	
}

/* ==========================================================================
   반응형 600px 이하
   ========================================================================== */
   
@media all and (max-width: 600px) {

	.list-depart {
        max-width:420px;
	}
	.modal-depart h3 {
		background-image: none !important;
		padding: 0px;
	}
	.name-depart li {
		width: 100%;
	}
	.modal-depart .bg1 .name-depart li {
		width: 40%;
	}
  /*
	#wrap-d-intro {
		height:552px;
	}
  */
  
	.list-depart li {
		width: 140px;
		height: 163px;
	}
	.list-depart li h2 {
		display:none;
		padding: 10rem 0 0 0;
		background-position: center 3rem !important;
	}
    
    /* 20200619 2021학년도 학부개편 학과소개페이지 수정 */
    .list-depart li.group1 {left:70px;top:0;}	
    .list-depart li.group2 {left:210px;top:0;}	    
    .list-depart li.group3 {left:0;top:121px;}	
    .list-depart li.group4 {left:140px;top:121px;}	
    .list-depart li.group5 {left:280px;top:121px;}	
    .list-depart li.group6 {left:70px;top:242px;}	
    .list-depart li.group7 {left:210px;top:242px;}	
    /* 20200619 2021학년도 학부개편 학과소개페이지 수정 */
    
	.modal-depart em {
		font-size: 0.8rem;
	}
	.modal-close {
		top: 22px;
	}
}

/* ==========================================================================
   반응형 420px 이하
   ========================================================================== */
   
@media all and (max-width: 420px) {	
	
	#wrap-d-intro {
		width: 100%;
	}
	.list-depart {
        max-width:330px;
        height:324px;
	}
	.list-depart li {
		width: 110px;
		height: 128px;
	}
	.list-depart li h2 {
		display:none;
	}
    
    /* 2021학년도 학부개편 학과소개페이지 수정 */ 
    .list-depart li.group1 {left:55px;top:0;}	
    .list-depart li.group2 {left:165px;top:0;}	
    .list-depart li.group3 {left:0;top:96px;}	
    .list-depart li.group4 {left:110px;top:96px;}	
    .list-depart li.group5 {left:220px;top:96px;}	
    .list-depart li.group6 {left:55px;top:192px;}	
    .list-depart li.group7 {left:165px;top:192px;}
    /* 2021학년도 학부개편 학과소개페이지 수정 */
}

@media all and (max-width: 360px) {		
	.list-depart {
        max-width:300px;
	}
	.list-depart li {
		width: 100px;
		height: 116px;
	}
    
    .list-depart li.group1 {left:51px;top:0;}	
    .list-depart li.group2 {left:150px;top:0;}	
    .list-depart li.group3 {left:0;top:86px;}	
    .list-depart li.group4 {left:100px;top:86px;}	
    .list-depart li.group5 {left:200px;top:86px;}	
    .list-depart li.group6 {left:50px;top:173px;}	
    .list-depart li.group7 {left:150px;top:173px;}
}