@charset "utf-8"; 

body{overflow-x:hidden; overflow-y:auto;}

/* 초기 로딩화면 (애니메이션 없음) */
#loader{display:none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; background:rgba(255,255,255,1);}






/* 공통 */

.inner{max-width:1520px; margin:0 auto;}
i{font-style:italic;}

@media(max-width:1400px){
  .inner{margin:0 1rem;}
}


.btn-group{}
.btn-group a,
.btn-group button{min-width:22rem; height:7.2rem; padding:0 2rem; margin-right:0.3rem; background-color:#000; font-size:1.8rem; color:#fff;}

.btn-group a:last-child,
.btn-group button:last-child{margin-right:0;}

.btn-group a{line-height:7.2rem;}








/* 해더 */
.header{position:relative; height:10rem; line-height:10rem; background:#fff; text-align:center; border-bottom:1px solid #ddd; background:#f6f6f6; z-index:999; transition:all 0.3s ease;}
.header.sub{position:fixed; width:100%; left:0; top:0; background:transparent; z-index:9; border-color:rgba(255,255,255,0.25);}
.header.active{background:rgba(255,255,255,0.9); box-shadow:0 0 1rem rgba(0,0,0,0.1);}

.header .inner{position:relative; height:inherit;}
.header h1{position:absolute; left:0; top:0;}
.header h1 a svg{display:inline-block; line-height:1; vertical-align:middle;}

.header h1 a svg path,
.header h1 a svg polygon:not(#light),
.header h1 a svg rect{fill:#000; transition:all 0.3s ease;}

.header.sub h1 a svg path,
.header.sub h1 a svg polygon:not(#light),
.header.sub h1 a svg rect{fill:#fff; transition:all 0.3s ease;}

.header.sub.active h1 a svg path,
.header.sub.active h1 a svg polygon:not(#light),
.header.sub.active h1 a svg rect{fill:#111;}

/* GNB */
.header .gnb{height:10rem; overflow:hidden;}
.header .gnb ul{display:inline-block;}
.header .gnb ul li{float:left;}
.header .gnb ul li a{display:block; padding:0 3rem; font-size:2rem; color:#111; font-weight:700;}
.header .gnb ul li a span{}


@media(max-width:1600px){
  .header .inner{margin:0 1rem;}
}


@media(max-width:1024px){
  .header{height:8rem; line-height:8rem;}
  .header h1 a img{height:3rem;}
  .header .gnb{display:none;}

  .hamburger{display:block !important;}
}



/* 모바일 햄버거 버튼 */
.hamburger {
  display:none; position:absolute; width:34px; height:34px; right:0; top:50%; margin-top:-17px;
}

.hamburger.active{z-index:9999;}

.hamburger i {
  position:absolute;
  height:3px;
  border-radius:2px;
  background:#111;
  transition:transform 0.45s cubic-bezier(0.9, -0.6, 0.3, 1.6), width 0.2s ease 0.2s;
}

.hamburger.active i{background:#fff;}

.hamburger i:nth-child(1) {
  top:50%;
  left:0;
  margin:-2px 0 0 0;
  width:100%;
  transform-origin:50% 50%;
}
.hamburger i:nth-child(2) {
  top:7px;
  left:0;
  width:20px;
  transform-origin:0 50%;
}
.hamburger i:nth-child(3) {
  bottom:7px;
  left:0;
  width:28px;
  transform-origin:100% 50%;
}
.hamburger.active i:nth-child(1) {
  transform:rotate(-45deg);
  transition:transform 0.45s cubic-bezier(0.9, -0.6, 0.3, 1.6) 0.1s;
}
.hamburger.active i:nth-child(2) {
  width:17px;
  transform:translate(6px, -3px) rotate(45deg);
  transition:transform 0.45s cubic-bezier(0.9, -0.6, 0.3, 1.6) 0.1s, width 0.2s ease;
}
.hamburger.active i:nth-child(3) {
  width:17px;
  transform:translate(12px, 3px) rotate(45deg);
  transition:transform 0.45s cubic-bezier(0.9, -0.6, 0.3, 1.6) 0.1s, width 0.2s ease;
}



.header.sub .hamburger i{background:#fff;}
.header.sub.active .hamburger i{background:#111;}


/* GNB 에니메이션 */
.gnb .char {
	overflow: hidden;
	color: transparent;
}
.gnb .char:before,
.gnb .char:after {
	display:inline-block;
	visibility: visible;
	color: #111;
	-webkit-transition: -webkit-transform 0.5s cubic-bezier(0.9, 0, 0.2, 1);
	transition: -webkit-transform 0.5s cubic-bezier(0.9, 0, 0.2, 1);
	transition: transform 0.5s cubic-bezier(0.9, 0, 0.2, 1);
	transition: transform 0.5s cubic-bezier(0.9, 0, 0.2, 1), -webkit-transform 0.5s cubic-bezier(0.9, 0, 0.2, 1);
	-webkit-transition-delay: calc( 0.2s + ( 0.02s * ( var(--char-index)) ) );
			transition-delay: calc( 0.2s + ( 0.02s * ( var(--char-index)) ) );
}

.header.sub .gnb .char:before,
.header.sub .gnb .char:after{color:#fff;}

.header.sub.active .gnb .char:before,
.header.sub.active .gnb .char:after{color:#111;}

.header.sub.active .gnb .char:before,
.header.sub a:hover .char:before,
.gnb a:hover .char:before {
	color: #b38840;
	-webkit-transition-delay: calc( 0.02s * ( var(--char-index)) );
			transition-delay: calc( 0.02s * ( var(--char-index)) );
}
.gnb > ul > li:hover .char:before {
	-webkit-transition-delay: calc( 0.2s + ( 0.02s * ( var(--char-index)) ) );
			transition-delay: calc( 0.2s + ( 0.02s * ( var(--char-index)) ) );
}
.gnb > ul > li:hover .char:after {
	-webkit-transition-delay: calc( 0.02s * ( var(--char-index)) );
			transition-delay: calc( 0.02s * ( var(--char-index)) );
}

.gnb .char:before {
	-webkit-transform: translateX(110%);
			transform: translateX(110%);
}
.gnb > ul > li:hover .char:before {
	-webkit-transform: translateX(0%);
			transform: translateX(0%);
}
.gnb > ul > li:hover .char:after {
	-webkit-transform: translateX(-110%);
			transform: translateX(-110%);
}




/* 해더 영문 및 패밀리 사이트 링크 */
.header .func{position:absolute; right:0; top:0; transition:all 0.3s ease;}


@media(max-width:1900px){
  .header .func.active{right:19rem;}
  .header .func.active > ul > li > a{opacity:0;}
}



.header .func > ul > li{position:relative; float:left; margin-right:2.5rem; font-size:1.5rem; color:#888;}
.header .func > ul > li > a{display:block; height:10rem; transition:all 0.2s ease;}

.header .func > ul > li > a + a{position:absolute; left:0; top:calc(50% + 1rem); opacity:0; padding-left:2.1rem; line-height:1; height:auto; transition:all 0.3s ease 0.3s;}
.header .func > ul > li:hover > a + a{opacity:1; top:calc(50% + 2rem); color:#b38840;}

.header .func > ul > li:last-child{margin-right:0;}

.header .func > ul > li > button{position:relative; z-index:3; font-size:0;}
.header .func > ul > li > button span{position:relative; padding-right:3rem; font-size:1.5rem; color:#888; transition:all 0.3s ease 0s;}

.header.sub .func > ul > li > button span{color:#fff;}
.header.sub.active .func > ul > li > button span{color:#888;}

.header .func > ul > li > button span svg{position:absolute; right:0; top:50%; display:inline; margin-left:1rem; transform:translateY(-50%); transition:all 0.3s ease 0s;}


.header.sub .func > ul > li > button #s1,
.header.sub .func > ul > li > button #s2{stroke:#fff;}

.header.sub.active .func > ul > li > button #s1,
.header.sub.active .func > ul > li > button #s2{stroke:#888;}

.header .func > ul > li > button.active span{color:#fff; transition:all 0.3s ease 0.3s;}
.header .func > ul > li > button.active svg{right:-14rem; transform:translateY(-50%) scale(1.7) rotate(45deg); transition:all 0.3s ease 0.1s;}
.header .func > ul > li > button.active #s1,
.header .func > ul > li > button.active #s2{stroke:#fff; stroke-width:1;}

.header .func > ul > li > button + ul{position:absolute; width:100vw; height:100vh; left:35rem; top:0; padding-top:10rem; background:#000; z-index:2; transition:all 0.5s ease;}
.header .func > ul > li > button.active + ul{left:-4rem;}
.header .func > ul > li > button + ul li{border-top:1px solid rgba(255,255,255,0.1);}
.header .func > ul > li > button + ul li:last-child{border-bottom:1px solid rgba(255,255,255,0.1);}
.header .func > ul > li > button + ul li a{display:block; height:5.7rem; line-height:5.7rem; padding:0 4rem; font-size:1.6rem; color:#fff; text-align:left; transition:all 0.3s ease;}
.header .func > ul > li > button + ul li a:hover{background:#b38840;}
.header .func > ul > li > button + ul li a > span{position:relative;}
.header .func > ul > li > button + ul li a > span::after{display:inline-block; width:0; height:100%; left:calc(100% + 1rem); top:0; transition:all 0.3s ease; background:url(/eng/img/common/icon_family_hover.svg) no-repeat center;}
.header .func > ul > li > button + ul li:hover a span::after{width:2rem;}





.header .func > ul > li.language > a{}
.header .func > ul > li.language > a span{font-size:1.5rem;}
.header .func > ul > li.language > a svg{margin-right:0.5rem; vertical-align:middle;}


.header #l1,
.header #l2,
.header #l3,
.header #l4{transition:all 0.3s ease 0s;}


.header.sub #l1,
.header.sub #l2,
.header.sub #l3,
.header.sub #l4{stroke:#fff; transition-delay:0.2s;}

.header .func > ul > li.language:hover #l1,
.header .func > ul > li.language:hover #l2,
.header .func > ul > li.language:hover #l3,
.header .func > ul > li.language:hover #l4{stroke:#b38840; transition-delay:0.2s;}

.header.sub.active #l1,
.header.sub.active #l2,
.header.sub.active #l3,
.header.sub.active #l4{stroke:#888; transition-delay:0s;}


@media(max-width:1024px){
  .header{margin-top:4.6rem;}
  .header .func{position:fixed; width:100%; height:4.6rem; line-height:4.6rem; left:0; top:0; padding:0 1rem; background:#000; z-index:9;}
  .header .func ul li:nth-child(1){display:none;}
  .header .func ul li:nth-child(3){position:absolute; right:1rem; top:0;}

	
  .header .func > ul > li > button + ul{padding-top:4.6rem;}
  .header .func > ul > li > button.active + ul{left:-20rem;}


  .header .func.active{right:0;}
  .header .func.active > ul > li > a:first-child{opacity:1;}

  .header .func > ul > li > button.active svg{right:0;}
}

.header .func > ul > li > a .char {
	overflow: hidden;
	color: transparent;
}
.header .func > ul > li > a .char:before,
.header .func > ul > li > a .char:after {
	display:inline-block;
	visibility: visible;
	color: #888;
	-webkit-transition: -webkit-transform 0.5s cubic-bezier(0.9, 0, 0.2, 1);
	transition: -webkit-transform 0.5s cubic-bezier(0.9, 0, 0.2, 1);
	transition: transform 0.5s cubic-bezier(0.9, 0, 0.2, 1);
	transition: transform 0.5s cubic-bezier(0.9, 0, 0.2, 1), -webkit-transform 0.5s cubic-bezier(0.9, 0, 0.2, 1);
	-webkit-transition-delay: calc( 0.2s + ( 0.02s * ( var(--char-index)) ) );
			transition-delay: calc( 0.2s + ( 0.02s * ( var(--char-index)) ) );
}


.header.sub .func > ul > li > a .char:before,
.header.sub .func > ul > li > a .char:after{color:#fff;}

.header.sub.active .func > ul > li > a .char:before,
.header.sub.active .func > ul > li > a .char:after{color:#888;}

.header.sub.active .func > ul > li > a .char:before,
.header.sub .func > ul > li > a .char:before,
.header .func > ul > li > a .char:before {
	color: #b38840;
	-webkit-transition-delay: calc( 0.02s * ( var(--char-index)) );
			transition-delay: calc( 0.02s * ( var(--char-index)) );
}

.header .func > ul > li:hover .char:before {
	-webkit-transition-delay: calc( 0.2s + ( 0.02s * ( var(--char-index)) ) );
			transition-delay: calc( 0.2s + ( 0.02s * ( var(--char-index)) ) );
}
.header .func > ul > li:hover .char:after {
	-webkit-transition-delay: calc( 0.02s * ( var(--char-index)) );
			transition-delay: calc( 0.02s * ( var(--char-index)) );
}

.header .func > ul > li a .char:before {
	-webkit-transform: translateX(110%);
			transform: translateX(110%);
}
.header .func > ul > li:hover .char:before {
	-webkit-transform: translateX(0%);
			transform: translateX(0%);
}
.header .func > ul > li:hover .char:after {
	-webkit-transform: translateX(-110%);
			transform: translateX(-110%);
}




























/* 메인 콘테이너 */
#main.container{letter-spacing:-0.2;}
#main.container .inner{position:relative;}


/* 메인 비주얼 */
#main.container .visual{padding:7.8rem 0; background:#f6f6f6;}
#main.container .visual .visual-swiper{position:relative; height:61rem; overflow:hidden;}
#main.container .visual .visual-swiper .pic{position:absolute; right:0; top:0;}
#main.container .visual .visual-swiper .pic img{}


@media(max-width:1400px){
 
  /* #main.container .visual .visual-swiper{height:55rem;} */
  #main.container .visual .visual-swiper .pic img{width:50rem;}
}

@media(max-width:1200px){
  /* #main.container .visual .visual-swiper{height:50rem;} */
  #main.container .visual .visual-swiper .pic img{width:45rem;}
}

@media(max-width:1024px){

  #main.container .visual .visual-swiper{height:50rem;}
  #main.container .visual .visual-swiper .pic img{width:40rem; }

}

@media(max-width:800px){
  
  #main.container .visual{padding:3rem;}
  #main.container .visual .inner{margin:0;}
  #main.container .visual .visual-swiper{height:auto;}
  #main.container .visual .visual-swiper .pic{position:relative; width:100%; margin-bottom:2rem;}
  #main.container .visual .visual-swiper .pic img{width:100%; }
}

@media(max-width:480px){
  #main.container .visual{padding:2rem;}
  /* #main.container .visual .visual-swiper{height:180vw;} */
}


@media(max-width:420px){
  /* #main.container .visual .visual-swiper{height:200vw;} */
}

@media(max-width:360px){
  /* #main.container .visual .visual-swiper{height:210vw;} */
}


#main.container .visual .progress{position:absolute; width:100%; max-width:61rem; height:5px; right:0; bottom:0; z-index:9;}
#main.container .visual .progress .bar{position:absolute; width:0; height:inherit; background:#b38840; left:0; top:0; transition:all 0s ease;}
#main.container .visual .progress .bar.active{width:100%; transition:all 10s ease;}
#main.container .visual .progress .bar.active.first{width:100%; transition: all 7.5s ease 2.5s;}




#main.container .visual .visual-swiper .el{min-height:61rem;}
#main.container .visual .visual-swiper .el strong{font-size:5rem; line-height:7rem; letter-spacing:-1px;}
#main.container .visual .visual-swiper .el strong br.break{display:none;}
#main.container .visual .visual-swiper .el p{margin:3rem 0 5rem 0; font-size:1.8rem; color:#888; line-height:3rem;}
#main.container .visual .visual-swiper .el a{display:inline-block; width:22rem; height:7.2rem; line-height:7.2rem; text-align:center; background:#b38840; color:#fff; font-size:1.8rem;}
#main.container .visual .visual-swiper .el a span{}


@media(max-width:1400px){
  #main.container .visual .visual-swiper .el{min-height:0;}
  #main.container .visual .visual-swiper .el strong br.break{display:block;}
  #main.container .visual .visual-swiper .el p{margin:1rem 0 2rem 0; font-size:1.6rem; line-height:2.6rem;}
}

@media(max-width:1024px){
  #main.container .visual .visual-swiper .el{padding-bottom:5rem;}
  #main.container .visual .visual-swiper .el strong{font-size:4rem; line-height:5.4rem;}
  #main.container .visual .visual-swiper .el p{font-size:1.4rem; line-height:2.4rem; text-align:left;}
  
  #main.container .visual .visual-swiper .el a{height:5rem; line-height:5rem; font-size:1.5rem;}
}

@media(max-width:800px){
	#main.container .visual .progress{max-width:100%;}

  #main.container .visual .visual-swiper .el a{margin-bottom:8rem;}
}

@media(max-width:480px){
  #main.container .visual .visual-swiper .el strong{font-size:3rem; line-height:4rem;}
  #main.container .visual .visual-swiper .el p{font-size:1.4rem;}
  #main.container .visual .visual-swiper .el p br{display:none;}
  
  
}


#main.container .visual .func{position:absolute; left:0; bottom:0; z-index:9;}
#main.container .visual .func button{position:relative; width:11rem; height:6rem;}
#main.container .visual .func button::before{display:inline-block; width:8.5rem; height:1px; background:#888; top:50%;}
#main.container .visual .func button::after{display:inline-block; width:1rem; height:1px; background:#888; top:50%;}
#main.container .visual .func button i{position:absolute; width:6rem; height:6rem; border-radius:6rem; top:0; border:1px solid #888;}

@media(max-width:768px){
  #main.container .visual .func{bottom:2vw;}
}


#main.container .visual .func button::before,
#main.container .visual .func button::after,
#main.container .visual .func button i{transition:all 0.5s ease;}

#main.container .visual .func button:hover::before,
#main.container .visual .func button:hover::after{background-color:#111;}
#main.container .visual .func button:hover i{border-color:#111;}

#main.container .visual .func button.visual-prev i{left:0;}
#main.container .visual .func button.visual-prev::before{left:3rem;}
#main.container .visual .func button.visual-prev::after{left:3rem; margin-top:-0.4rem; transform:rotate(-45deg);}

#main.container .visual .func button.visual-next::before{right:3rem;}
#main.container .visual .func button.visual-next::after{right:3rem; margin-top:-0.4rem; transform:rotate(45deg);}
#main.container .visual .func button.visual-next i{right:0;}


#main.container .visual .func span{padding:0 2rem; line-height:6rem;}
#main.container .visual .func span i{font-size:1.5rem; letter-spacing:3px;}
#main.container .visual .func span i:nth-child(1){color:#816747; font-weight:700;}
#main.container .visual .func span i:nth-child(2){color:#aaa;}
#main.container .visual .func span i:nth-child(3){color:#888; font-weight:700;}


#main.container .visual .visual-swiper .swiper-slide strong span.char,
#main.container .visual .visual-swiper .swiper-slide p,
#main.container .visual .visual-swiper .swiper-slide a,
#main.container .visual .visual-swiper .swiper-slide .pic{
	-webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
	clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
	transform: translateY(-50px);
}

#main.container .visual .visual-swiper .swiper-slide strong span.char{animation:visualTestAnimationReverse ease 3s both 0s;}
#main.container .visual .visual-swiper .swiper-slide p{animation:visualTestAnimationReverse ease 3s  both 0s;}
#main.container .visual .visual-swiper .swiper-slide a{animation:visualTestAnimationReverse ease 3s  both 0s;}
#main.container .visual .visual-swiper .swiper-slide .pic{animation:visualTestAnimationReverse ease 3s  both 0s;}


#main.container .visual .visual-swiper .swiper-slide-active strong span.char{animation:visualTestAnimation ease 3s both calc(0.1s + ( 0.03s * ( var(--char-index)) ) );}
#main.container .visual .visual-swiper .swiper-slide-active p{animation:visualTestAnimation ease 4s both 1s;}
#main.container .visual .visual-swiper .swiper-slide-active a{animation:visualTestAnimation ease 3s both 1s;}
#main.container .visual .visual-swiper .swiper-slide-active .pic{animation:visualTestAnimation ease 3s both 0.5s;}



@keyframes visualTestAnimation {
	0% {
		transform: translateY(-50px);
		opacity: 0;
		-webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);;
		clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);;
	}
	50% {
		transform: translateY(0);
		opacity: 1;
		-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	}
	100% {
		transform: translateY(0);
		opacity: 1;
		-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	}
}

@keyframes visualTestAnimationReverse {
	0% {
		transform: translateY(0);
		opacity: 1;
		-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	}
	50% {
		transform: translateY(0);
		opacity: 1;
		-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
	}
	100% {
        transform: translateY(-50px);
		opacity: 0;
		-webkit-clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);;
		clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);;
    }
}




















/* 메인 공지사항 */
#main.container .notice{background:#000;}

#main.container .notice .notice-swiper{position:relative; height:8.8rem; line-height:8.8rem; padding-left:7.5rem; padding-right:2rem; overflow:hidden;}
#main.container .notice .notice-swiper::before{display:inline-block; left:0; top:0; font-size:1.6rem; color:#7c6846; content:'Notice'; font-weight:700;}
#main.container .notice .notice-swiper::after{display:inline-block; width:1px; height:1.6rem; background:#222; left:6rem; top:50%; margin-top:-0.8rem;}
#main.container .notice .notice-swiper .swiper-slide{}
#main.container .notice .notice-swiper .swiper-slide a{display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:1.6rem; color:#fff;}

#main.container .notice .notice-swiper .func{position:absolute; right:0; top:50%; transform:translateY(-50%); z-index:2;}
#main.container .notice .notice-swiper .func button{display:block; padding:0.75rem 0; font-size:0;}

#main.container .notice .notice-swiper .func button.notice-prev{}
#main.container .notice .notice-swiper .func button.notice-next{}





/* 메인 프로그램 */
#main.container .program{height:100vh; line-height:100vh; text-align:center; background:url(/eng/img/main/program_bg.jpg) no-repeat center; background-size:cover; font-size:0; background-attachment:fixed;}
body.safari #main.container .program{background-attachment:initial;}
#main.container .program .el{display:inline-block; line-height:1; vertical-align:middle;}
#main.container .program .el strong{display:block; margin-bottom:3rem; font-size:4.8rem; line-height:7rem; color:#fff;}
#main.container .program .el a{display:inline-block; width:22rem; font-size:1.5rem; color:#fff; line-height:calc(7.2rem - 2px); border:1px solid rgba(255,255,255,0.5);}

@media(max-width:1400px){
  #main.container .program{height:70vh; line-height:70vh;}
  #main.container .program .el strong{font-size:4rem; line-height:6rem;}
  #main.container .program .el a{width:20rem; height:5rem; line-height:calc(5rem - 2px);}
}






/* 미디어 */
#main.container .media{padding:24rem 0;}

#main.container .media .inner{position:relative;}
#main.container .media .inner::before{display:inline-block; left:-20rem; top:38rem; content:'ALUMNI’S FILMS IN PREVIOUS YEARS'; font-size:1.4rem; color:#ccc; transform:rotate(-90deg);}

@media(max-width:1400px){
  #main.container .media{padding:10rem 0;}
}

@media(max-width:768px){
  #main.container .media{padding:1rem 0;}
}

#main.container .media .inner .circle{position:absolute; width:20rem; height:20rem; line-height:20rem; right:0; top:0;}
#main.container .media .inner .circle::before{display:inline-block; width:100%; left:0; top:0; content:'BAFA'; font-size:3.2rem; font-weight:900; color:#111; text-align:center; letter-spacing:-0.4;}

@media(max-width:640px){
  #main.container .media .inner .circle{display:none;}
}


@keyframes rotating {
   from {
     -ms-transform: rotate(0deg);
     -moz-transform: rotate(0deg);
     -webkit-transform: rotate(0deg);
     -o-transform: rotate(0deg);
     transform: rotate(0deg);
   }
   to {
     -ms-transform: rotate(360deg);
     -moz-transform: rotate(360deg);
     -webkit-transform: rotate(360deg);
     -o-transform: rotate(360deg);
     transform: rotate(360deg);
   }
 }
 #main.container .media .inner .circle svg {
   -webkit-animation: rotating 20s linear infinite;
   -moz-animation: rotating 20s linear infinite;
   -ms-animation: rotating 20s linear infinite;
   -o-animation: rotating 20s linear infinite;
   animation: rotating 20s linear infinite;
 }



#main.container .media .el{float:left; position:relative; width:calc(50% - 2rem); height:76rem; line-height:76rem; margin-right:4rem; padding:5.5rem; background:#111 no-repeat center; background-size:cover; font-size:0;}
#main.container .media .el:last-child{margin-top:32rem; margin-right:0;}

@media(max-width:1400px){
  #main.container .media .el{width:calc(50% - 0.5rem); height:60rem; line-height:50rem; margin-right:1rem; padding:1rem;}
}

@media(max-width:768px){
  #main.container .media .el{width:100%; height:30rem; line-height:30rem;}
  #main.container .media .el:last-child{margin-top:1rem;}
}



#main.container .media .el dl{color:#fff; line-height:1;}
#main.container .media .el dl dt{}
#main.container .media .el dl dt sup{font-size:1.6rem;}
#main.container .media .el dl dt strong{display:block; margin:1.5rem 0 2.5rem 0; font-size:3.2rem;}
#main.container .media .el dl dd{}
#main.container .media .el dl dd > a,
#main.container .media .el dl dd > span{position:relative; padding-right:1rem; margin-right:1rem; font-size:1.4rem;}

#main.container .media .el dl dd > a::before,
#main.container .media .el dl dd > span::before{display:inline-block; width:1px; height:1rem; right:0; top:50%; margin-top:-0.5rem; background:#fff; opacity:0.2;}

#main.container .media .el dl dd > a:last-child,
#main.container .media .el dl dd > span:last-child{padding-right:0; margin-right:0;}

#main.container .media .el dl dd > a:last-child::before,
#main.container .media .el dl dd > span:last-child::before{display:none;}


#main.container .media .el:nth-child(1){background-image:url(/eng/img/main/media_bg01.jpg);}
#main.container .media .el:nth-child(2){background-image:url(/eng/img/main/media_bg02.jpg);}


#main.container .media .el:nth-child(1) dl{position:absolute; left:6rem; top:6rem;}
#main.container .media .el:nth-child(1) dl dd span{color:#aaa;}
#main.container .media .el:nth-child(2) dl{display:inline-block; vertical-align:middle; width:100%; left:0; text-align:center;}
#main.container .media .el:nth-child(2) dl dt{margin:0 0 7rem 0;}

@media(max-width:768px){
  #main.container .media .el:nth-child(1) dl{left:3rem; bottom:3rem;}
}


#main.container .media .el#movie,
#main.container .media .el#archive{animation:fadeOutDown 0.35s both;}


#main.container .media.active .el#movie{animation:fadeInUp 0.7s both 0.2s;}
#main.container .media.active .el#archive{animation:fadeInUp 0.7s both 0.4s;}


#main.container .media svg{fill:currentColor; transform-origin:center; width:20rem; height:20rem; color:#ccc;}




/* ABOUT */
#main.container .about{position:relative; color:#fff;}
#main.container .about::before{display:inline-block; width:100%; height:40rem; left:0; bottom:0; background:#f4f4f4; z-index:-1;}
#main.container .about .inner{
  height:80rem; line-height:80rem; background:url(/eng/img/main/about_bg.jpg) no-repeat center; background-size:cover; font-size:0; text-align:center; 

  -webkit-clip-path: inset(50% 50% 50% 50%);
	clip-path: inset(50% 50% 50% 50%);
}
#main.container .about .inner .el{display:inline-block; line-height:1; vertical-align:middle;}
#main.container .about .inner .el strong{font-size:4.8rem; line-height:7rem;}
#main.container .about .inner .el p{margin:2.5rem 0 5rem 0; font-size:1.8rem; font-weight:300;}
#main.container .about .inner .el a{display:inline-block; width:22rem; font-size:1.5rem; color:#fff; line-height:calc(7.2rem - 2px); border:1px solid rgba(255,255,255,0.5);}


#main.container .about.active .inner{animation:test ease 1s both;}

@media(max-width:1400px){
  #main.container .about .inner{margin:0; height:50rem; line-height:50rem;}
  #main.container .about .inner .el strong{font-size:4rem; line-height:6rem;}
  #main.container .about .inner .el p{font-size:1.5rem;}
  #main.container .about .inner .el a{width:20rem; height:5rem; line-height:calc(5rem - 2px);}
}


@keyframes test {
	0% {
    -webkit-clip-path:inset(50% 50% 50% 50%);
		clip-path:inset(50% 50% 50% 50%);
	}
	100% {
		-webkit-clip-path:inset(0 0 0 0);
		clip-path:inset(0 0 0 0);
	}
}






#main.container .social{padding:13rem 0; background:#f4f4f4; overflow:hidden;}


#main.container .social ul.init li a{display:inline-block; padding:0 4rem;}
#main.container .social ul.init li a > span{position:relative; display:block; padding-left:7rem; font-size:2.4rem; line-height:6rem; color:#ae8542; font-weight:700;}
#main.container .social ul.init li a > span::before{display:inline-block; width:6rem; height:6rem; left:0; top:0; background:no-repeat center;}


@media(max-width:1024px){
  #main.container .social{padding:9rem 0;}
  #main.container .social ul.init li a{padding:0 2rem;}
  #main.container .social ul.init li a > span{font-size:2rem;}
  #main.container .social ul.init li a > span::before{background-size:3rem;}
}

@media(max-width:768px){
  #main.container .social ul.init li{width:50%;text-align:right;}
  #main.container .social ul.init li:nth-child(even){text-align:left;}
}

@media(max-width:400px){
  #main.container .social ul.init li a{padding:0 1.5rem;}
  #main.container .social ul.init li a > span{font-size:1.8rem;}
}

#main.container .social ul.init li:nth-child(1) a span::before{background-image:url(/eng/img/main/icon_sns_facebook.svg);}
#main.container .social ul.init li:nth-child(2) a span::before{background-image:url(/eng/img/main/icon_sns_twitter.svg);}
#main.container .social ul.init li:nth-child(3) a span::before{background-image:url(/eng/img/main/icon_sns_instagram.svg);}
#main.container .social ul.init li:nth-child(4) a span::before{background-image:url(/eng/img/main/icon_sns_youtube.svg);}


#main.container .social ul.init li a > span:after {
  display: inline-block; width:6rem; height:6rem; right:-2rem; bottom:0; background:url(/eng/img/main/icon_sns_arrow.svg) no-repeat center; transform:scaleY(0) translateX(3rem);
}
#main.container .social ul.init li a > span:after,
#main.container .social ul.init li a > span .char {
  transition: transform 0.8s cubic-bezier(0.75, 0, 0.24, 0.98);
  transition-delay: calc( 0.015s * var(--char-index) );
}
#main.container .social ul.init li a > span .char {
  transform: translateX(-0.1rem);
}
#main.container .social ul.init li a > span:hover:after {
  transform: scaleY(1) translateX(1.5rem);
}
#main.container .social ul.init li a > span:hover .char {
  transform: translateX(-1rem) translateX(calc(-0.1px * var(--char-index)));
}






#sub.container{position:relative; background:#fff;}
#sub.container .inner{max-width:1260px;}

@media(min-width:1260px) and (max-width:1400px){
  #sub.container .inner{margin:0 auto;}
}

@media(max-width:1260px){
  #sub.container .inner{margin:0 1rem;}
}
#sub.container .visual{position:relative; height:100vh; line-height:100vh; left:0; top:0; background:#000 url(/eng/img/sub/sub_visual.jpg) no-repeat center; background-size:cover; text-align:center; font-size:0;}
#sub.container .visual h2{display:inline-block; line-height:1; font-size:6.8rem; color:#fff; vertical-align:middle;}
#sub.container .visual a.scroll{position:absolute; width:100%; left:0; bottom:8rem;  text-align:center; line-height:1; font-size:0;}
#sub.container .visual a.scroll span{font-size:1.3rem; color:#fff;}




#sub.container .visual a.scroll img {
  position: absolute;
  bottom: -3rem;
  left: 50%;
  margin-left:-5.5px;
  -webkit-animation: scrollDown 2s infinite;
  animation: scrollDown 2s infinite;
  opacity: 0;
}
#sub.container .visual a.scroll img:nth-child(1) {
  -webkit-animation-delay: .15s;
  animation-delay: .15s;
}
#sub.container .visual a.scroll img:nth-child(2) {
  bottom: -4rem;
  -webkit-animation-delay: .3s;
  animation-delay: .3s;
}

@-webkit-keyframes scrollDown {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 0;
  }
}
@keyframes scrollDown {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 0;
  }
}



















#sub.container .breadcrumbs{}
#sub.container .breadcrumbs ul{display:inline-block; vertical-align:top;}
#sub.container .breadcrumbs ul li{position:relative; float:left; padding-right:1rem; margin-right:1rem;}
#sub.container .breadcrumbs ul li:nth-child(n + 2):not(:last-child)::after{display:inline-block; width:1rem; height:100%; right:-0.5rem; top:0; background:url(/eng/img/sub/icon_breadcrumbs_arrow.svg) no-repeat center;}
#sub.container .breadcrumbs ul li:last-child{padding-right:0; margin-right:0;}
#sub.container .breadcrumbs ul li a{display:block; height:3rem; line-height:3rem; font-size:1.5rem; color:#888;}

#sub.container .breadcrumbs ul li:nth-child(1){padding-right:0;}
#sub.container .breadcrumbs ul li:nth-child(1) a{width:3rem; background:url(/eng/img/sub/icon_home.svg) no-repeat center;}



#sub.container .contents{position:relative; padding-top:8rem; background:#fff; padding-bottom:20rem; z-index:1;}
#sub.container .contents h3{margin:5rem 0; font-size:4.8rem; font-weight:900;}




#sub #side2m_{display:inline-block; width:100%; vertical-align:top; margin-top:2rem; margin-bottom:7rem; border-bottom:1px solid #ccc;}
#sub #side2m_ li{float:left; margin-right:5rem;}
#sub #side2m_ li:last-child{margin-right:0;}
#sub #side2m_ li a{position:relative; display:block; height:12rem; line-height:12rem; font-size:2.4rem; color:#aaa; letter-spacing:-2px; font-weight:700;}
#sub #side2m_ li.active a{color:#111;}
#sub #side2m_ li.active a::before{display:inline-block; width:100%; height:4px; left:0; bottom:-1px; background:#ae8542;}


@media(max-width:1024px){
	#sub #side2m_{margin-bottom:5rem;}
	#sub #side2m_ li a{font-size:2.4rem;}
}

@media(max-width:768px){
	#sub #side2m_ li a{height:6.5rem; line-height:6.5rem;}
}


@media(max-width:640px){
	#sub #side2m_ li{margin-right:4rem;}
	#sub #side2m_ li a{font-size:2.2rem; height:6rem; line-height:6rem;}

}

/* @media(max-width:375px){
	#sub #side2m_ li a{font-size:2.2rem;}
}
 */




#sub.container .contents .dummy{height:120rem; line-height:120rem; background:#f2f2f2; font-size:3rem; color:#aaa; text-align:center; font-weight:900;}

#sub.container .contents .tab{position:relative;}
#sub.container .contents .tab a{height:50px; line-height:50px; margin-right:50px; font-size:16px; font-weight:700; transition:all 0.2s ease;}
#sub.container .contents .tab a:last-child{margin-right:0;}
#sub.container .contents .tab a.active{color:#a4762a;}

#sub.container .contents .tab i{position:absolute; width:100%; height:4px; bottom:-1px; background:#ae8542;}


#sub.container .contents h4{margin-bottom:2rem; font-size:2.6rem; font-weight:700;}
#sub.container .contents mark{color:#a4762a;}

#sub.container .contents .tab-contents h4 + ul,
#sub.container .contents .tab-contents h4 + ol{padding-bottom:5rem; margin-bottom:5rem; border-bottom:1px solid #f0f0f0; font-size:1.8rem; line-height:2.5rem;}


#sub.container .contents .tab-contents ol li::before{display:inline-block; background-repeat:no-repeat; background-position:left center;}
#sub.container .contents .tab-contents ol li{position:relative;}
#sub.container .contents .tab-contents ol li:nth-child(n + 2){margin-top:0.5rem;}

#sub.container .contents .tab-contents ol{counter-reset:number;}
#sub.container .contents .tab-contents ol > li{margin-bottom:0.7rem; padding-left:2.5rem;}
#sub.container .contents .tab-contents ol > li:last-child{margin-bottom:0;}
#sub.container .contents .tab-contents ol > li::before{display:inline-block; content:counter(number) "."; counter-increment:number; left:0; top:0.4rem; width:2rem; height:2rem; line-height:calc(2rem - 2px); text-align:center;}
#sub.container .contents .tab-contents ol > li.none::before{display:none;}

#sub.container .contents .tab-contents ol > li > ul{margin:1rem 0 2rem 0;}

#sub.container .contents .tab-contents ul.circle > li{position:relative; padding-left:1rem; margin-bottom:0.7rem;}
#sub.container .contents .tab-contents ul.circle > li:last-child{margin-bottom:0;}
#sub.container .contents .tab-contents ul.circle > li::before{display:inline-block; width:0.5rem; height:0.5rem; border-radius:0.5rem; left:0; top:0.9rem; background:#222;}
#sub.container .contents .tab-contents ul.circle li.none::before{display:none;}
#sub.container .contents .tab-contents ul.circle > li > ul > li{padding-left:1rem;}
#sub.container .contents .tab-contents ul.circle > li > ul > li::before{width:3px; height:3px; border-radius:3px; left:0; top:1rem; background:#222;}
#sub.container .contents .tab-contents ul.circle > li > ul > li > ul > li{padding-left:1rem;}
#sub.container .contents .tab-contents ul.circle > li > ul > li > ul > li::before{width:2px; height:2px; border-radius:2px; left:0; top:1rem; background:#222;}


#sub.container .contents #faq{}
#sub.container .contents #faq > p{margin-bottom:3rem; font-size:2rem; color:#888;}

#sub.container .contents #faq ul{border-top:2px solid #000;}
#sub.container .contents #faq ul li{border-bottom:1px solid #ddd;}
#sub.container .contents #faq ul li button{position:relative; display:block; width:100%; min-height:10rem; padding:1rem 10rem; text-align:left; font-size:2.2rem; line-height:1.25; color:#111;}
#sub.container .contents #faq ul li button::before,
#sub.container .contents #faq ul li button::after{display:inline-block; width:10rem; height:10rem; line-height:10rem; top:0; background:no-repeat center;}

#sub.container .contents #faq ul li p{display:block; display:none; padding:5rem 10rem; background:#f7f7f7; border-top:1px solid #ddd; font-size:1.6rem; line-height:1.5;}


#sub.container .contents #faq ul li button::before{left:0; content:'Q'; text-align:center; font-weight:700;}
#sub.container .contents #faq ul li button::after{right:0; background-image:url(/kor/img/sub/icon_faq_arrow.svg); opacity:0.5;}
#sub.container .contents #faq ul li button.active::after{opacity:1; transform:rotate(180deg);}

@media(max-width:1024px){
  #sub.container .contents #faq ul li button{min-height:8rem; padding:1rem 5rem; font-size:2rem;}
  #sub.container .contents #faq ul li button::before,
  #sub.container .contents #faq ul li butlton::after{width:5rem; height:8rem; line-height:8rem;}

  #sub.container .contents #faq ul li p{padding:3rem 5rem;}
}



/* tab */
.tabBtn{margin-bottom: 60px; display:flex; flex-wrap: wrap;}
.tabBtn > li{position:relative;}
.tabBtn > li + li{margin-left: 1.4rem;}
.tabBtn > li a{display:block; min-width:130px; height: 5.6rem; line-height: 5.6rem; font-size:2rem; letter-spacing: -1px; font-weight:500; text-align:center; color:#555; background-color: #f7f7f7; border:1px solid #ddd; border-radius: 30px; transition:all 0.3s ease 0s;}
.tabBtn > li:first-child{margin-left:0;}
.tabBtn > li.on a{color:#fff; font-weight: 700; background-color: #ae8542; border-color:#ae8542; transition:all 0.3s ease 0s;}

@media(max-width:1024px){
.tabBtn > li a{min-width:110px; margin-bottom:10px;}
}






.footer{position:relative; padding-top:12rem; background:#111; z-index:1;}

.footer .inner{position:relative; max-width:1260px; background:url(/kor/img/common/logo_white2.svg) no-repeat left top;}



.footer .inner dl{padding-left:77rem;}
.footer .inner dl:first-child{margin-bottom:4rem;}
.footer .inner dl dt{margin-bottom:1rem; font-size:1.5rem; font-weight:700; color:#fff;}
.footer .inner dl dd{font-size:1.4rem; line-height:2.2rem; color:#888;}
.footer .inner dl dd img{vertical-align:middle;}

.footer .inner p{padding-left:77rem; margin:5rem 0; font-size:1.5rem; color:#888;}



@media(max-width:1280px){
  .footer .inner dl,
  .footer .inner p{padding-left:50%;}
}



@media(max-width:1024px){
  .footer{padding-top:4rem; text-align:center;}
  .footer .inner{padding-top:15rem; background-position:center 3rem;}

  .footer .inner dl,
  .footer .inner p{padding-left:0;}
}

@media(max-width:1024px){
  .footer .inner{background-size:30rem;}
}




.footer .inner .fnb{text-align:center;}
.footer .inner .fnb ul{border-top:1px solid #2e2e2e; font-size:0; white-space:nowrap;}
.footer .inner .fnb ul li{padding:4rem 0; display:inline-block;}
.footer .inner .fnb ul li a{display:block; padding:0 3.3rem; font-size:1.5rem; color:#aaa; transition:all 0.3s ease;}
.footer .inner .fnb ul li a:hover{color:#b7904f;}
.footer .inner .fnb ul li:first-child a{padding-left:0;}
.footer .inner .fnb ul li:last-child a{padding-right:0;}

.footer .inner .fnb ul li a span{position:relative;}
.footer .inner .fnb ul li a span::before{display:inline-block; width:100%; height:1px; left:0; bottom:-3px; background:#816747; transform-origin: 100% 50%; transform: scale3d(0, 1, 1); transition: transform 0.3s;}
.footer .inner .fnb ul li a span::after{opacity:0; display:inline-block; width:1rem; height:100%; right:-2rem; top:0; background:url(/eng/img/common/icon_fnb_hover.svg) no-repeat right top; transition:all 0.2s ease 0.3s;}

.footer .inner .fnb ul li a:hover span::after{opacity:1; right:-1.5rem;}
.footer .inner .fnb ul li a:hover span::before{transform-origin: 0% 50%; transform: scale3d(1, 1, 1);}



.footer .inner a.scrollTop{position:absolute; right:-13rem; top:-22rem; width:6rem; height:6rem; background:#b7904f url(/eng/img/common/icon_scroll_top.svg) no-repeat center; z-index:2;}


@media(max-width:1400px){
  .footer .inner .fnb ul{padding:3rem 0; white-space:normal;}
  .footer .inner .fnb ul li{padding:1.4rem 0;}
}



@media(max-width:1600px){
  .footer .inner a.scrollTop{right:0; top:-7rem;}
}


@media(max-width:1024px){
  .cb-cursor{display:none !important;}
}




/* 마우스 커서 */
.cb-cursor {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 150;
    contain: layout style size;
    pointer-events: none;
    will-change: transform;
    -webkit-transition: opacity 0.3s, color 0.4s;
    -o-transition: opacity 0.3s, color 0.4s;
    -moz-transition: opacity 0.3s, color 0.4s;
    transition: opacity 0.3s, color 0.4s; }
    
    .cb-cursor:before {
      top: -24px;
      left: -24px;
      display: block;
      width: 48px;
      height: 48px;
      border:1px solid transparent;
      -webkit-transform: scale(0);
         -moz-transform: scale(0);
          -ms-transform: scale(0);
           -o-transform: scale(0);
              transform: scale(0);
      background: currentColor;
      -webkit-border-radius: 50%;
         -moz-border-radius: 50%;
              border-radius: 50%;
      -webkit-transition: opacity 0.1s, -webkit-transform 0.3s ease-in-out;
      transition: opacity 0.1s, -webkit-transform 0.3s ease-in-out;
      -o-transition: opacity 0.1s, -o-transform 0.3s ease-in-out;
      -moz-transition: transform 0.3s ease-in-out, opacity 0.1s, -moz-transform 0.3s ease-in-out;
      transition: transform 0.3s ease-in-out, opacity 0.1s;
      transition: transform 0.3s ease-in-out, opacity 0.1s, -webkit-transform 0.3s ease-in-out, -moz-transform 0.3s ease-in-out, -o-transform 0.3s ease-in-out;
      }
    .cb-cursor-text {
      position: absolute;
      top: -74px;
      left: -74px;
      width: 148px;
      height: 148px;
      display: -webkit-box;
      display: -webkit-flex;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
         -moz-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
         -moz-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -webkit-transform: scale(0) rotate(10deg);
         -moz-transform: scale(0) rotate(10deg);
          -ms-transform: scale(0) rotate(10deg);
           -o-transform: scale(0) rotate(10deg);
              transform: scale(0) rotate(10deg);
      opacity: 0;
      color: white;
      font-size: 16px;
      line-height: 20px;
      text-align: center;
      letter-spacing: -0.01em;
      -webkit-transition: opacity 0.4s, -webkit-transform 0.3s;
      transition: opacity 0.4s, -webkit-transform 0.3s;
      -o-transition: opacity 0.4s, -o-transform 0.3s;
      -moz-transition: opacity 0.4s, transform 0.3s, -moz-transform 0.3s;
      transition: opacity 0.4s, transform 0.3s;
      transition: opacity 0.4s, transform 0.3s, -webkit-transform 0.3s, -moz-transform 0.3s, -o-transform 0.3s;}
        

    @supports (mix-blend-mode: exclusion) {
      .cb-cursor.-exclusion, .cb-cursor.-opaque {
        mix-blend-mode: exclusion; } }
    @supports (mix-blend-mode: exclusion) {
      .cb-cursor.-exclusion:before, .cb-cursor.-opaque:before {
        background: #f3f3f3; } }
    .cb-cursor.-normal, .cb-cursor.-text {
      mix-blend-mode: normal; }
      .cb-cursor.-normal:before, .cb-cursor.-text:before {
        background: currentColor; }
    .cb-cursor.-inverse {
      color: white; }
    .cb-cursor.none:before {
      -webkit-transform: scale(0) !important;
          -moz-transform: scale(0) !important;
          -ms-transform: scale(0) !important;
            -o-transform: scale(0) !important;
              transform: scale(0) !important; }

    .cb-cursor.circle:before {
      background:none; border:1px solid #111;
      -webkit-transform: scale(1) !important;
          -moz-transform: scale(1) !important;
          -ms-transform: scale(1) !important;
            -o-transform: scale(1) !important;
              transform: scale(1) !important; }

    .cb-cursor.circle-white:before {
      background:none; border:1px solid #b7904f;
      -webkit-transform: scale(1) !important;
          -moz-transform: scale(1) !important;
          -ms-transform: scale(1) !important;
            -o-transform: scale(1) !important;
              transform: scale(1) !important; }

    .cb-cursor.-visible:before {
      -webkit-transform: scale(0.2);
         -moz-transform: scale(0.2);
          -ms-transform: scale(0.2);
           -o-transform: scale(0.2);
              transform: scale(0.2); }
    .cb-cursor.-visible.-active:before {
      -webkit-transform: scale(0.23);
         -moz-transform: scale(0.23);
          -ms-transform: scale(0.23);
           -o-transform: scale(0.23);
              transform: scale(0.23);
      -webkit-transition-duration: 0.2s;
         -moz-transition-duration: 0.2s;
           -o-transition-duration: 0.2s;
              transition-duration: 0.2s; }
    .cb-cursor.-pointer:before {
      -webkit-transform: scale(0.15);
         -moz-transform: scale(0.15);
          -ms-transform: scale(0.15);
           -o-transform: scale(0.15);
              transform: scale(0.15); }
    .cb-cursor.-text:before {
      background:#b38840;
      top: -74px;
      left: -74px;
      width: 148px;
      height: 148px;
      -webkit-transform: scale(1);
         -moz-transform: scale(1);
          -ms-transform: scale(1);
           -o-transform: scale(1);
              transform: scale(1); }
    .cb-cursor.-text .cb-cursor-text {
      opacity: 1;
      -webkit-transform: scale(1);
         -moz-transform: scale(1);
          -ms-transform: scale(1);
           -o-transform: scale(1);
              transform: scale(1); }
    .cb-cursor.-text.-active:before {
      -webkit-transform: scale(1.6);
         -moz-transform: scale(1.6);
          -ms-transform: scale(1.6);
           -o-transform: scale(1.6);
              transform: scale(1.6);
      -webkit-transition-duration: 0.2s;
         -moz-transition-duration: 0.2s;
           -o-transition-duration: 0.2s;
              transition-duration: 0.2s; }
    .cb-cursor.-opaque:before {
      -webkit-transform: scale(1.32);
         -moz-transform: scale(1.32);
          -ms-transform: scale(1.32);
           -o-transform: scale(1.32);
              transform: scale(1.32);}
    .cb-cursor.-opaque.-active:before {
      -webkit-transform: scale(1.2);
         -moz-transform: scale(1.2);
          -ms-transform: scale(1.2);
           -o-transform: scale(1.2);
              transform: scale(1.2); }
    .cb-cursor.-lg:before {
      -webkit-transform: scale(2);
         -moz-transform: scale(2);
          -ms-transform: scale(2);
           -o-transform: scale(2);
              transform: scale(2); }
    .cb-cursor.-hidden:before {
      -webkit-transform: scale(0);
         -moz-transform: scale(0);
          -ms-transform: scale(0);
           -o-transform: scale(0);
              transform: scale(0); }






/* Reveal Effect */
@keyframes revealIn {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}

@keyframes revealOut {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}

              




/* 모바일 네비게이션 */
.mnb { position:fixed; width:100%; height:100vh; line-height:100vh; left:-100%; top:0; text-align:center; transition:left 0s calc(150ms * 2), transform 0s calc(150ms * 2);  z-index:9; font-size:0;}
.mnb::before, .mnb::after {display:inline-block;  width:100%;  height:50%; left:0; background-color:#111; transform:translateX(-110%); transform-origin:0 50%; transition:transform calc(150ms * 2) 150ms cubic-bezier(0.215, 0.61, 0.355, 1); z-index:-100;}
.mnb::before {top:0;}
.mnb::after {bottom:0;}
.mnb li {opacity:0; transform:translateX(-1rem); transition:opacity 150ms cubic-bezier(0.215, 0.61, 0.355, 1), transform 150ms cubic-bezier(0.215, 0.61, 0.355, 1);}
.mnb.active {left:0; transition:transform 0s;}
.mnb.active::before, .mnb.active::after {transform:translateX(0); transition-delay:0s;}
.mnb.active::after {transition-delay:calc(150ms / 2);}
.mnb.active li {opacity:1; transform:translateX(0); transition:opacity calc(150ms * 2) cubic-bezier(0.215, 0.61, 0.355, 1), transform calc(150ms * 2) cubic-bezier(0.215, 0.61, 0.355, 1);}
.mnb.active li:nth-child(1) {transition-delay:calc(150ms * 2 * (1 * 0.25)); z-index:-1;}
.mnb.active li:nth-child(2) {transition-delay:calc(150ms * 2 * (2 * 0.25)); z-index:-2;}
.mnb.active li:nth-child(3) {transition-delay:calc(150ms * 2 * (3 * 0.25)); z-index:-3;}
.mnb.active li:nth-child(4) {transition-delay:calc(150ms * 2 * (4 * 0.25)); z-index:-4;}
.mnb.active li:nth-child(5) {transition-delay:calc(150ms * 2 * (5 * 0.25)); z-index:-5;}

.mnb > ul {position:relative; display:inline-block; line-height:1; vertical-align:middle; text-align:center; z-index:1;}
.mnb > ul > li > a {display:block; font-size:4rem; line-height:1.4; font-weight:700; color:#aaa;}
.mnb > ul > li > ul {position:absolute; left:0; opacity:0; transform:translateY(-10%); top:100%; width:100%; padding-top:2rem; visibility:hidden; z-index:2;}
.mnb > ul > li > ul > li > a {font-size:1.6rem; font-weight:200; color:#fff; line-height:1.5;}
.mnb > ul > li > ul li a::before, .mnb > ul > li > ul li a::after {display:none;}

.mnb li {position:relative;}
.mnb li:hover a::before, .mnb li:hover a::after {animation:blink 1s 150ms steps(1, end) forwards infinite; transform:translateX(calc(100% - 0.5rem)); transition-duration:calc(150ms * 3);}
.mnb li:hover a::after {transition-delay:calc(150ms / 2);}
.mnb li:hover ul {opacity:1; transform:translateY(0); transition:transform calc(150ms * 2) calc(150ms * 3) cubic-bezier(0.215, 0.61, 0.355, 1), opacity calc(150ms * 2) calc(150ms * 3) cubic-bezier(0.215, 0.61, 0.355, 1), visibility 0s calc(150ms * 3);  visibility:visible;}


.mnb a {position:relative; display:inline-block; color:#364C62; overflow:hidden; padding:0.5rem 1rem 0.125rem;  transition:color 150ms cubic-bezier(0.215, 0.61, 0.355, 1), opacity 150ms cubic-bezier(0.215, 0.61, 0.355, 1), transform 150ms cubic-bezier(0.215, 0.61, 0.355, 1); z-index:1;}
.mnb a::before, .mnb a::after {display:inline-block;  width:100%; height:50%; left:0; background-color:#F5F5F5; transform:translateX(-110%); transform-origin:0 50%; transition:transform 0s cubic-bezier(0.215, 0.61, 0.355, 1); z-index:-1;}
.mnb a::before {top:0;}
.mnb a::after {bottom:0;}

.mnb ul:not(:focus-within):not(:hover) li .mnb a {opacity:1; transform:translate(0, 0);}
.mnb li a {opacity:0.25; transition-duration:calc(150ms * 3); transform:translate(0, calc(30% * -1));}
.mnb li ul a {opacity:0.8;}
.mnb li:hover > a {color:#b38840; opacity:1; transform:translate(0, 0);}
.mnb li:hover > a:hover {color:#b38840; transition-delay:0s;}
.mnb li:hover ~ li > a {transition-duration:calc(150ms * 3); transform:translate(0, 30%);}

/* 포인터 깜빡 거림 */
@keyframes blink {
  50%, 100% {
    opacity:0;
  }
}




/* 뉴스 검색 */
.news .search{text-align:center;}
.news .search select,
.news .search input,
.news .search button{margin:0; height:6rem; background-color:#fff; border-radius:0; font-size:1.6rem;}

.news .search select{width:24rem; padding:0 2rem;}
.news .search input{width:calc(100% - 30rem); padding:0 2rem; border-left:0; border-right:0; background:#fbfbfb;}
.news .search input:focus{border-color:#cdd0d3;}
.news .search input::placeholder{font-size:1.6rem;}
.news .search button{position:relative; width:6rem; border:1px solid #cdd0d3; border-left:0; background:#fbfbfb url(/eng/img/sub/icon_search.svg) no-repeat center;}
.news .search button::before{display:inline-block; width:1px; height:3rem; left:-1px; top:50%; margin-top:-1.5rem; background:#e4e4e4;}

@media(max-width:768px){
	.news .search select{width:100%;}
	.news .search input{width:calc(100% - 6rem); border-left:1px solid #dcdee0; border-top:0;}
	.news .search button{border-top:0;}
}


/* 뉴스 게시판 총 게시글 수 */
.news .total{margin:5rem 0 1rem 0; font-size:1.5rem; color:#555;}
.news .total mark{color:#b7904f;}


/* 뉴스 게시판 */
.news .notice{border-top:2px solid #111; text-align:center;}
.news .notice ul{display:inline-block; width:100%; border-bottom:1px solid #e0e0e0; vertical-align:top;}
.news .notice ul li{float:left; height:11rem; line-height:11rem; }
.news .notice ul li:nth-child(1){width:20rem;}
.news .notice ul li:nth-child(2){width:calc(100% - 50rem);}
.news .notice ul li:nth-child(3),
.news .notice ul li:nth-child(4){width:15rem;}
.news .notice ul li > em,
.news .notice ul li > span{display:inline-block; line-height:1; font-size:1.5rem;}
.news .notice ul li > em{font-size:1.6rem;}
.news .notice ul li a{display:inline-block; width:100%; line-height:1; text-align:left; vertical-align:middle;}
.news .notice ul li a img{display:inline-block; line-height:2.5rem; margin-right:0.5rem; vertical-align:-2px;}
.news .notice ul li a span{margin-bottom:10px; line-height:2.5rem;}
.news .notice ul li a em{font-size:1.8rem;}
.news .notice ul li a sub{line-height:1.5; font-size:1.6rem;}
.news .notice ul li:last-child span{padding-left:2.2rem; background:url(/eng/img/sub/icon_eye.svg) no-repeat left center;}

@media(max-width:1024px){
	.news .notice ul{padding:2rem 1rem;}
	.news .notice ul li{height:auto; margin:1rem 0; line-height:1;  text-align:left;}
	.news .notice ul li:nth-child(1),
	.news .notice ul li:nth-child(2){width:100%;}
	
	.news .notice ul li:nth-child(3),
	.news .notice ul li:nth-child(4){width:10rem;}
	
}



/* 게시판 페이지 */
.board-pagination{}
.board-pagination button,
.board-pagination a,
.board-pagination em{display:inline-block; width:4rem; height:4rem; margin:0 3px; font-size:1.5rem; color:#555;}

.board-pagination a{line-height:calc(4rem - 2px); border:1px solid #cfcfcf;}
.board-pagination a:hover{background:#f3f3f3}
.board-pagination em{background:#111; border:1px solid #111; color:#fff; line-height:calc(4rem - 2px);;}


.board-pagination button{width:4rem; height:4rem; margin:0; background-repeat:no-repeat; background-position:center;}

.board-pagination button.prev{background-image:url(/eng/img/sub/icon_page_prev.svg);}
.board-pagination button.next{background-image:url(/eng/img/sub/icon_page_next.svg);}

@media(max-width:768px){
	.board-pagination button,
	.board-pagination a,
	.board-pagination em{width:30px; height:30px; font-size:13px;}

	.board-pagination a{line-height:30px;}
	.board-pagination em{line-height:26px;}
}



/* 게시판 뷰 */
.news .view{border-top:2px solid #111;}

/* 게시판 뷰 타이틀 */
.news .view strong{padding-top:3.5rem; display:block; font-size:3.1rem; line-height:1.25;}

.news .view strong + dl{padding:1.5rem 0; border-bottom:1px solid #e0e0e0;}
.news .view strong + dl dt,
.news .view strong + dl dd{float:left; font-size:1.7rem; color:#888;}

.news .view strong + dl dt{position:relative; margin-bottom:1.5rem; font-weight:700; color:#111;}
.news .view strong + dl dt:nth-child(2){padding-left:2rem; margin-left:2rem;}
.news .view strong + dl dt:nth-child(2)::before{display:inline-block; width:1px; height:1rem; left:0; top:50%; margin-top:-0.5rem; border-left:1px dotted #b9b9b9;}
.news .view strong + dl dd{position:relative; padding-left:2rem; margin-left:2rem;}
.news .view strong + dl dd::before{display:inline-block; width:1px; height:1rem; left:0; top:50%; margin-top:-0.5rem; border-left:1px dotted #b9b9b9;}

.news .view strong + dl dd:last-child{padding-left:4rem; background:url(/eng/img/sub/icon_eye.svg) no-repeat 2rem center;}


.news .btn-group{margin-top:3.5rem; border:2px solid red;}




/* 게시판 뷰 콘텐츠 및 에디터 사용시 내부 태그, 테이블 스타일 초기화 */
.news .view .con{padding:5rem 0; font-size:1.6rem; line-height:1.65;}

.news .view .con *{font-size:inherit; margin:0; padding:0; line-height:inherit;}

.news .view .con table{width:auto; border:0;}

.news .view .con table th,
.news .view .con table td{padding:0; height:0; border:0;}

.news .view .con table{width:100%; border-top:1px solid #333; border-right:1px solid #333;}

.news .view .con table th,
.news .view .con table td{border-left:1px solid #333; border-bottom:1px solid #333;}



/* 게시판 첨부파일 */
.news .view .attachment{position:relative; padding:2.5rem 5rem 2.5rem 18rem; background:#f6f6f6; border:1px solid #e8e8e8;}
.news .view .attachment::before{display:inline-block; width:18rem; content:'첨부파일'; text-align:center; left:0; top:50%; transform:translate(0, -50%); font-size:1.7rem; color:#111; font-weight:700;}
.news .view .attachment ul{padding-left:3.5rem; border-left:1px solid #e0e0e0;}
.news .view .attachment ul li{padding:0.8rem 0;}
.news .view .attachment ul li a{padding:0 2.5rem; display:block; font-size:1.6rem; color:#555; line-height:1.5; background:url(/eng/img/sub/icon_document.svg) no-repeat left center;}
.news .view .attachment ul li a img{margin-left:1rem; vertical-align:-2px;}
.news .view .attachment ul li a span{padding-right:2.5rem;}


/* 게시판 이전, 다음 글 */
.news .view dl.control{}
.news .view dl.control.prev{margin-top:3rem; border-top:1px solid #111; border-bottom:1px solid #e0e0e0;}
.news .view dl.control.next{border-bottom:1px solid #111;}
.news .view dl.control dt,
.news .view dl.control dd{float:left; font-size:1.6rem; color:#333; line-height:7rem;}

.news .view dl.control dt{width:18rem; color:#111; text-align:center; font-weight:400;}
.news .view dl.control dt span{position:relative; display:inline-block; line-height:1; padding-right:2rem;}
.news .view dl.control dt span::before{display:inline-block; width:0; height:0; right:0; top:50%; border:4px solid transparent;}

.news .view dl.control.prev dt span::before{border-bottom:4px solid #b7904f; margin-top:-4px;}
.news .view dl.control.next dt span::before{border-top:4px solid #b7904f; margin-top:-2px;}

.news .view dl.control dd{width:calc(100% - 18rem); padding:0 1.5rem;}


@media(max-width:1024px){
	.news .view strong{padding-top:2rem; font-size:2.1rem;}
	
	.news .view strong + dl{padding-bottom:5px;}
	.news .view strong + dl dt,
	.news .view strong + dl dd{font-size:1.4rem;}
	
	.news .view .con{font-size:1.5rem;}
	
	.news .view .attachment{padding:4rem 2rem 2rem 2rem;}
	.news .view .attachment::before{left:2rem; top:3rem; width:100%; text-align:left;}
	.news .view .attachment ul{border-left:0; padding-left:0;}
	
	.news .view .attachment ul li a{font-size:1.4rem; line-height:2.5rem;}
	

	.news .view dl.control dt{width:10rem;}
	.news .view dl.control dd{width:calc(100% - 10rem);}
}









/* BAFA 소개 */

.intro{}
.intro p{font-size:1.8rem; line-height:1.5;}

.intro .section{position:relative; height:67rem; line-height:76rem; margin:10rem 0; font-size:0;}

.intro dl{width:100%; display:inline-block; line-height:1; vertical-align:middle;}
.intro dl::before{display:inline-block; width:60rem; height:100%; top:0; background:no-repeat center; background-size:cover;}


.intro .section:nth-child(odd) dl{padding-right:68rem;}
.intro .section:nth-child(even) dl{padding-left:67rem;}

.intro .section:nth-child(2) dl::before{left:0; background-image:url(/kor/img/sub/intro_bg01.jpg);}
.intro .section:nth-child(3) dl::before{right:0; background-image:url(/kor/img/sub/intro_bg02.jpg);}



.intro dl dt{margin-bottom:3rem; font-size:2.8rem; line-height:1.6;}
.intro dl dt sup{display:block; font-size:2.6rem; font-weight:300;}
.intro dl dd{font-size:1.8rem; line-height:1.6; font-weight:300;}


@media(max-width:1024px){
	.intro p br{display:none;}

	.intro .section{height:43rem; line-height:43rem;}

	.intro dl::before{width:40rem; height:43rem;}
	.intro .section:nth-child(odd) dl{padding-right:45rem;}
	.intro .section:nth-child(even) dl{padding-left:45rem;}

	.intro .section dl dd br{display:none;}
}

@media(max-width:640px){
	.intro .section{height:auto; margin:5rem 0; line-height:1;}
	
	.intro .section dl{text-align:center;}
	.intro dl::before{position:relative; display:block; width:40rem; height:43rem; margin:0 auto 3rem auto;}

	.intro .section:nth-child(odd) dl{padding-right:0;}
	.intro .section:nth-child(even) dl{padding-left:0;}


	.intro .section:nth-child(3){margin-bottom:0;}
}

@media(max-width:640px){
	.intro dl::before{width:35rem; height:43rem;}
}




/* 주최 */

.host{}
.host ul{}
.host ul li{position:relative; float:left; width:calc(50% - 2rem); margin-right:4rem;}
.host ul li:last-child{margin-right:0;}
.host ul li::before{position:relative; display:block; height:35rem; border:1px solid #e0e0e0; border-bottom:0; background:no-repeat center;}
.host ul li sub{display:block; height:6rem; line-height:6rem; background:#000; font-size:1.6rem; color:#fff; text-align:center;}


.host ul li.chanel::before{background-image:url(/kor/img/sub/logo_chanel.svg);}
.host ul li.biff::before{background-image:url(/kor/img/sub/logo_biff.png);}


@media(max-width:1280px){
	.host ul li{width:100%; margin-right:0;}
	.host ul li:last-child{margin-top:3rem;}

	
}


@media(max-width:640px){
	.host ul li::before{height:27rem;}
	.host ul li.chanel::before{background-size:20rem;}
	.host ul li.biff::before{background-size:30rem;}
}

@media(max-width:400px){
	.host ul li.chanel::before{background-size:15rem;}
	.host ul li.biff::before{background-size:25rem;}
}




/* History */
.history{text-align:center;}
.history p{font-size:1.8rem; line-height:1.7; text-align:left;}
.history img{display:block; margin:5rem 0;}
.history a{display:inline-block; width:20rem; height:6rem; line-height:calc(6rem - 2px); margin-top:5rem; border:1px solid #111; font-size:1.5rem; color:#111; text-align:center; transition:all 0.2s ease;}

.history a:hover{background:#111; color:#fff;}




/* program */
.program  .tit{font-size: 3rem; font-weight:700; padding-bottom:5rem;}
.program em{display:inline-block; font-size: 2rem; font-weight:700; padding-bottom: 2rem; }
.program p{font-size:1.8rem; line-height:1.7; padding-bottom:5rem;}
.program .b_text{display:inline-block; font-size:1.8rem; line-height:1.7; padding-bottom: 1.3rem;}


/* award */
.award .tit{font-size: 3rem; font-weight:700; padding-bottom:5rem;}
.award em{display:inline-block; font-size: 2rem; font-weight:700; padding-bottom: 2rem; }
.award p{font-size:1.8rem; line-height:1.7; padding-bottom:5rem;}


/* mentors */
.mentors .section{position:relative; min-height:35rem; margin-bottom:8rem; padding-bottom:8rem; border-bottom:1px solid #ccc;}
.mentors .section .img{position:absolute; width:30rem; height:35rem; left:0; top:0; background-repeat:no-repeat; background-position:center; background-size:cover; background-color:#aaa;}
.mentors .section .el{min-height:35rem; padding-left:34rem; color:#555; line-height:1.7;}
.mentors .section .el em{display: inline-block; font-size:3.6rem; color:#000;}
.mentors .section .el sub{display:block; font-size:2rem; color:#72777b; font-weight:700;}
.mentors .section .el sup{font-size:1.8rem; padding-left: 1.5rem;}
.mentors .section .el p{margin-top:1.5rem; font-size:1.6rem; }

@media(max-width:768px){

.mentors .section .img{position:relative;}
.mentors .section .el{padding-left:0; padding-top:2rem;}

.mentors .section .el p{position:relative; padding-top:2rem;}
.mentors .section .el p::before{display:inline-block; left:0; top:0; width:2rem; height:3px; background:#ae8642;}

}

@media(max-width:400px){
	.mentors .section .img{width:100%; height:40rem; background-position:top;}
	.mentors .section .el sup{display:block; padding-left: 0;}

}

/* instructors */
.instructors{font-size:0;}
.instructors .box{padding-left:12%; margin-bottom: 10rem; font-size:0; vertical-align:top;}
.instructors .box:nth-child(2n){margin-right: 0;}
.instructors .box .picture{display: inline-block;}
.instructors .box .picture img{width:23rem; border:1px solid #eee;}
.instructors .box .content{display: inline-block; padding-left:5rem; vertical-align:top;}
.instructors .box .content dl dt{display: inline-block; font-size: 2.5rem; font-weight:700; padding-bottom:10px;}
.instructors .box .content dl dd{display: inline-block; padding-left: 1.5rem; font-size:1.8rem; color:#333;}
.instructors .box .content ul{margin-top:2rem;}
.instructors .box .content ul li{position:relative; padding-left:1.5rem; color:#555; font-size:1.6rem; padding-bottom:1.5rem;}
.instructors .box .content ul li::before{display:inline-block; left:0; top:0.6em; width:5px; height:5px; border-radius:5px; background:#ccc;}


@media(max-width:1280px){
.instructors .box{padding-left:0;}
.instructors .box .picture img{width:25rem;}
.instructors .box .content{padding-left:2rem;}
}


@media(max-width:890px){

.instructors .box .picture{width:100%;}
.instructors .box .picture img{width:100%;}
.instructors .box .content{display:block; margin-top:3rem; padding-left:0;}
.instructors .box .content dl{border-bottom:1px solid #aaa;}
}



/*참가자*/

.fellows{font-size:0; display:flex; flex-wrap:wrap;}
.fellows a{position: relative; display: inline-block; width: calc(20% - 15px); vertical-align: middle; min-height: 320px; border: 1px solid #e8e8e8; margin-bottom: 2rem; overflow: hidden; margin-right: 18.76px;}
.fellows a:nth-child(5n){margin-right: 0;}
.fellows .box .photo{text-align:center;}
.fellows .box .photo dl{padding:2rem; line-height: 1.4; font-size: 1.5rem; text-align:left;}
.fellows .box .photo dl dt{font-size:1.8rem; font-weight:700; letter-spacing: -0.9px;}
.fellows .box .photo dl dd{padding-top:1rem;}
.fellows .box .photo img {width:100%; height: auto; display: block;}


.pop-wrap{display:none;position:fixed; width:100%; height:100vh; line-height:100vh; left:0; top:0; background:rgba(0,0,0,0.7); z-index:9; text-align:center; overflow:hidden; overflow-y:auto; z-index:999; -ms-overflow-style: none; /* IE and Edge */  scrollbar-width: none;  /* Firefox */}
.pop-wrap::-webkit-scrollbar {display: none;}

.pop-wrap .pop{position:relative; display:inline-block; vertical-align:middle; padding:5rem; line-height:1; background:#fff; box-shadow:0 0 30px rgba(0,0,0,0.5);  background:#fff; text-align:left;}

.pop-wrap .pop strong{display:block; font-size:30px; font-weight:700; line-height:50px; padding-bottom:10px; border-bottom:2px solid #111;}


.pop-wrap .pop ol{padding:10px 0; counter-reset:number;}
.pop-wrap .pop ol li{position:relative; padding:20px 0 20px 55px; font-size:17px; line-height:30px; border-bottom:1px dotted #a8a8a8;}
.pop-wrap .pop ol li::before{display:inline-block; width:30px; height:30px; border-radius:30px; left:15px; top:19px; background:#b81369; content:counter(number); counter-increment:number; text-align:center; color:#fff; font-weight:700; font-size:14px; font-family:'Red Hat Display', sans-serif;}
.pop-wrap .pop ol li img{display:block; margin-top:10px; border:3px solid #dcdcdc;}

.pop-wrap .pop button.close{position:absolute; width:23px; height:50px; right:50px; top:50px; background:url(/img/sub/icon_pop_close.png) no-repeat center;}

/* 참가자 - POP-WRAP ALERT */
#pop-wrap-alert{display:none; position:fixed; width:100%; height:100vh; line-height:100vh; left:0; top:0; padding:50px 0; background:rgba(0,0,0,0.7); z-index:9; text-align:center; overflow:hidden; overflow-y:auto; z-index:999; -ms-overflow-style: none; /* IE and Edge */  scrollbar-width: none;  /* Firefox */}
#pop-wrap-alert::-webkit-scrollbar {display: none;}

#pop-wrap-alert .pop{position:relative; display:inline-block; padding:50px; vertical-align:middle; line-height:1; background:#fff; box-shadow:0 0 30px rgba(0,0,0,0.5);  background:#fff; text-align:left;}

#pop-wrap-alert .pop strong{display:block; font-size:30px; font-weight:700; line-height:50px; padding-bottom:10px; border-bottom:2px solid #111;}


#pop-wrap-alert .pop ol{padding:10px 0; counter-reset:number;}
#pop-wrap-alert .pop ol li{position:relative; padding:20px 0 20px 55px; font-size:17px; line-height:30px; border-bottom:1px dotted #a8a8a8;}
#pop-wrap-alert .pop ol li::before{display:inline-block; width:30px; height:30px; border-radius:30px; left:15px; top:19px; background:#b81369; content:counter(number); counter-increment:number; text-align:center; color:#fff; font-weight:700; font-size:14px; font-family:'Red Hat Display', sans-serif;}
#pop-wrap-alert .pop ol li img{display:block; margin-top:10px; border:3px solid #dcdcdc;}

#pop-wrap-alert .pop button.close{position:absolute; width:23px; height:50px; right:50px; top:50px; background:url(/kor/img/sub/icon_pop_close.png) no-repeat center;}
#pop-wrap-alert .btn-group button{height: 5rem;}

.pop-wrap .pop[data-pop="팝업"]{width:1000px; margin-top:100px;}
.pop-wrap .pop[data-pop="팝업"] sub{font-size:16px; color:#888; font-weight:400;}
.pop-wrap .pop[data-pop="팝업"] .el{position:relative; min-height:260px; padding-left:250px; margin-top:30px; z-index:2;}
.pop-wrap .pop[data-pop="팝업"] .el .picture{position:absolute; width:220px; height:260px; left:0; top:0; background-repeat:no-repeat; background-position:center; background-size:cover;}
.pop-wrap .pop[data-pop="팝업"] .el .picture::before{display:inline-block; width:100%; height:100%; left:0; top:0; background:#eee; z-index:-1;}


.pop-wrap .pop[data-pop="팝업"] .el ul{margin-bottom:2rem; font-size:17px; color:#111; line-height:1.5;}  
.pop-wrap .pop[data-pop="팝업"] .el p{font-size:15px; color:#555; line-height:1.4;}




/*졸업작품*/
.graduation{font-size:0;}
.graduation .box{position: relative; display: inline-block; width: calc(50% - 10px); vertical-align: middle; border: 1px solid #e8e8e8; margin-bottom: 2rem; overflow: hidden; margin-right: 20px;}
.graduation .box:nth-child(2n){margin-right: 0;}

.graduation .box .photo{text-align:center;}
.graduation .box .photo img {width:100%; height: auto; display: block;}
.graduation .box .text{position: relative; padding:40px;}
.graduation .box .text a{}
.graduation .box .text a span{position: absolute; right:20px; top:20px; padding:10px 20px; font-weight:600; border: 1px solid #b7904f; font-size:14px; color:#b7904f ;}

.graduation .box .text dl{line-height: 1.4; font-size: 16px; text-align:left;}
.graduation .box .text dl dt{font-size:20px; font-weight:700; letter-spacing: -0.9px; transition: all 0.3s ease-in-out;}
.graduation .box .text dl dt:hover{color:#b7904f;}
.graduation .box .text dl dd{font-size:18px; padding-top:1rem;}
.graduation .box .text ul{margin-top:30px; color:#666; font-size:15px;}
.graduation .box .text ul li{display:inline-block; position:relative; margin-right:10px; padding-left:10px;}
.graduation .box .text ul li::before{display:inline-block; position:absolute; left:0; top:0; margin-top:2px; width:1px; height:10px; background:#ccc;}
.graduation .box .text ul li:first-child{padding:0;}
.graduation .box .text ul li:first-child::before{display:none; }

.pop-wrap .a-pop{position:relative; display:inline-block; vertical-align:middle; height:600px;  padding:5rem; line-height:1; background:#fff; box-shadow:0 0 30px rgba(0,0,0,0.5);  background:#fff; text-align:left; overflow-y:scroll;}
.pop-wrap .a-pop strong{display:block; font-size:30px; font-weight:700; line-height:50px; padding-bottom:10px; border-bottom:2px solid #111;}
.pop-wrap .a-pop strong span{margin-left:10px; font-size:20px; font-weight:500; color:#888;}
.pop-wrap .a-pop strong mark{margin-left:10px; font-size:23px; font-weight:700; color:#000;}
.pop-wrap .a-pop[data-pop="아카이브팝업"]{width:1000px; margin-top:100px;}
.pop-wrap .a-pop[data-pop="아카이브팝업"] sub{font-size:16px; color:#888; font-weight:400;}
.pop-wrap .a-pop[data-pop="아카이브팝업"] .el{position:relative; min-height:260px; padding:20px; margin-top:30px; z-index:2;}
.pop-wrap .a-pop[data-pop="아카이브팝업"] .el em{font-size:20px;}
.pop-wrap .a-pop[data-pop="아카이브팝업"] .el ul{margin:10px 0 40px 0; font-size:17px; color:#111; line-height:1.5;}  
.pop-wrap .a-pop[data-pop="아카이브팝업"] .el ul li{position:relative; padding-left:15px;}
.pop-wrap .a-pop[data-pop="아카이브팝업"] .el ul li::before{position:absolute; display:inline-block; left:0; top:11px; width:4px; height:4px; border-radius:5px; background:#333;}
.pop-wrap .a-pop[data-pop="아카이브팝업"] .el p{font-size:18px; color:#555; line-height:1.4;}






@media(max-width:1280px){	
	.pop-wrap{padding:10px; overflow-y:auto; }
	
	.pop-wrap .pop{padding:20px;}
	
	
	
	.pop-wrap .pop button.close{height:60px; right:20px; top:20px;}
	
	.pop-wrap .pop strong{font-size:23px; line-height:60px;}
	.pop-wrap .pop[data-pop="팝업"],
	.pop-wrap .a-pop[data-pop="아카이브팝업"]{width:100%; margin-top:120px;}



}


@media(max-width:1024px){
	.fellows a{width: calc(33.33333333% - 15px); margin-right:2.5rem;}
	.fellows a:nth-child(5n){margin-right:2.5rem;}
	.fellows a:nth-child(3n){margin-right: 0;}
}


@media(max-width:768px){
	.pop-wrap .pop[data-pop="팝업"] .el{padding-left:0;}
	.pop-wrap .pop[data-pop="팝업"] .el .picture{position:relative; left:auto; top:auto; margin:0 auto 25px auto;}
	.pop-wrap .pop[data-pop="팝업"] .el dl{margin-bottom:5px; font-size:14px;}

	.graduation .box{width:100%;}
	.pop-wrap .a-pop strong{font-size:23px; line-height:1.5; margin-bottom:10px;}
	.pop-wrap .a-pop strong span{font-size:16px;}
}


@media(max-width:640px){
	.fellows a{width: calc(50% - 15px); margin-right:3.5rem;}
	.fellows a .photo dl{font-size: 18px;}
	.fellows a:nth-child(5n){margin-right: 3.5rem;}
	.fellows a:nth-child(3n){margin-right: 3.5rem;}
	.fellows a:nth-child(2n + 2){margin-right: 0;}

	.pop-wrap .a-pop{padding:30px;}
	.pop-wrap .a-pop strong{font-size:20px; line-height:1.5; margin-bottom:10px;}
	.pop-wrap .a-pop strong span{display:block; margin-left:0;}
	.pop-wrap .a-pop strong mark{display:block; font-size:16px;  margin-left:0;}
}


@media(max-width:480px){
	.pop-wrap .pop strong{font-size:19px;}
	.fellows a{width: 100%;}
	.graduation .box .text{padding:20px 30px;}
	.graduation .box .text a{display:inline-block; position:relative; right:0; top:0; width:100%; margin-top:20px;}
	.pop-wrap .a-pop{padding:20px;}
	.pop-wrap .a-pop[data-pop="아카이브팝업"]{margin-top:0;}
	.pop-wrap .a-pop[data-pop="아카이브팝업"] .el{padding:0;}
}




/* 행사장소 */

.event .tit{font-size: 3rem; font-weight:700; padding-bottom:5rem;}
.event em{display:inline-block; font-size: 2rem; font-weight:700; padding-bottom: 1rem; }
.event p{font-size:1.8rem; line-height:1.7; padding-bottom:4rem;}

.event .tour img{display: inline-block; vertical-align: top;width: calc(20% - 20px); height: 160px; margin-right: 20px;
	text-align: center;background-color: #ddd;margin-bottom: 35px;background-repeat: no-repeat; background-size: cover;
    background-position: center; transition: all 0.3s ease-in-out;}

.tour img:nth-child(5n) {margin-right: 0;}


@media (max-width:1600px) { 
	.event .tour img{width:calc(20% - 19px);}
	.event .tour img:nth-child(5n){margin-right:0;}
}

@media (max-width:1024px) { 
	.event .tour img{width:calc(33.3333% - 9.7px); margin-right:12px; margin-bottom:20px;}
	.event .tour img:nth-child(3n){margin-right:0;}
}

@media (max-width:768px) { 
	.event .tour img{width:calc(50% - 8px); height: 190px;}
	.event .tour img:nth-child(2n){margin-right:0;}
}

@media (max-width:500px) { 
	.event .tour img{width:100%; height:100%;}
	.event .tour img:nth-child(3){margin-right:0;}
}

.tour2 img{display: inline-block; vertical-align: top;width: calc(25% - 28px); height: 180px; margin-right: 30px;
	text-align: center;background-color: #ddd;margin-bottom: 35px;background-repeat: no-repeat; background-size: cover;
    background-position: center; transition: all 0.3s ease-in-out;}

.tour2 img:nth-child(4n) {margin-right: 0;}


@media (max-width:1600px) { 
	.tour2 img{width:calc(25% - 25px);}
	.tour2 img:nth-child(4n){margin-right:0;}
}

@media (max-width:1024px) { 
	.tour2 img{width:calc(25% - 24.5px);}
	.tour2 img:nth-child(4n){margin-right:0;}
}

@media (max-width:768px) { 
	.tour2 img{width:calc(50% - 17px);}
	.tour2 img:nth-child(2n){margin-right:0;}
	.tour2 img:nth-child(3){margin-right:30px;}
}

@media (max-width:500px) { 
	.tour2 img{width:100%; height:100%;}
	.tour2 img:nth-child(3){margin-right:0;}
}

/*관리자 워닝문구*/
@keyframes blink-effect {
  50% {
    opacity: 0;
  }
}
.page_warning {position: fixed;top: 100px; z-index: 999999;}
.page_warning div {font-size:20px;color:#fff;background: #ae8542;padding:10px;margin:10px 0 20px;display:inline-block}
.page_warning .blink{animation: blink-effect 1s step-end infinite;}
.page_warning .blink img {width:26px; padding-right:5px;}