@charset "UTF-8";

/********** 공통 **********/
.layout-wrapper { overflow:hidden; }

.container-section {
	display:block;
	width:100%;
	word-wrap:break-word;
	word-break:keep-all;
	overflow-wrap:anywhere;
}
	.more-btn--frame { display:block; }
		.more-btn { 
			display:block;
			width:30px;
			height:30px;
			position:relative;
			transition:0.3s all ease-in-out;
		}
		
		.more-btn:hover,
		.more-btn:focus { background-color:#000; border-color:#000; }
		
			.more-btn .line-mark {
				display:block;
				background-color:#666;
				position:absolute;
				left:50%;
				top:50%;
				transform:translate(-50%, -50%);
				transition:0.3s all ease-in-out;
			}
			.more-btn .line-mark.line1 { width:2px; height:20px; }
			.more-btn .line-mark.line2 { width:20px; height:2px; }

			.more-btn:hover .line-mark { transform:translate(-50%, -50%) rotate(90deg); background-color:#fff; }

.mulit-line-ellipsis { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.mulit-line-ellipsis-sub { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 8; -webkit-box-orient: vertical; }

/* 레이어팝업 */
.layer-popup { display:block; width:auto; position:absolute; }
.layer-popup .layer-popup-content-box { display:block; width:100% !important; height:auto !important; background-color:#fff; }
.layer-popup .layer-popup-content-box img { vertical-align:top; width:100%; max-width:100%; height:auto !important; }

.layer-popup .close-btn-box { display:block; width:100%; background-color:#fff; padding:10px; }
.layer-popup .close-btn-box .btn-frame { display:flex; display:-ms-flexbox; justify-content:flex-end; -ms-flex-pack:end; width:100%; }
.layer-popup .close-btn-box .check,
.layer-popup .close-btn-box .close-btn,
.layer-popup .close-btn-box .check input,
.layer-popup .close-btn-box .check label  { -ms-flex-align: center; align-self: center; -ms-flex-item-align: center; }
.layer-popup .close-btn-box .check { display:flex; display:-ms-flexbox; justify-content:flex-start; -ms-flex-pack:start; width:auto; margin-right:20px; }

.layer-popup .close-btn-box .check label,
.layer-popup .close-btn-box .close-btn { font-weight:600; font-size:0.85em; }

/********** 공통 타이틀 **********/
.idx-title--frame {
	display:flex;
	justify-content:flex-start;
	align-items:flex-end;
	flex-wrap:wrap;
	width:100%;
	margin-bottom:25px;
}
	.idx-title--frame .cmn-title {
		display:block;
		width:auto;
		font-family:'GmarketSansMedium', sans-serif;
		font-weight:300;
		font-size:2.5rem;
		color:#000;
		line-height:1.4;
		letter-spacing:-.9px;
	}
	
	.idx-title--frame .cmn-en {
		display:block;
		width:auto;
		margin-left:12px;
		padding-bottom:12px;
		font-family:'SEBANG_Gothic_Regular', sans-serif;
		font-size:1.21rem;
		font-weight:400;
		color:rgba(0,0,0,.6);
		line-height:1.4;
	}

/********** 공통-컨트롤 디자인 **********/
.idx_common_slideController {
	display:flex;
	justify-content:flex-start;
	align-items:center;
	width:auto;
}
	.idx_common_slideController .ctrl-btn {
		display:block;
		width:30px;
		height:30px;
		background-repeat:no-repeat;
		background-position:center center;
		transition:0.3s all ease-in-out;
		opacity:0.6;
	}
	
	.idx_common_slideController .ctrl-btn.prev { background-image:url('/res/img/home/page/index/image_idx_slide_leftArrow.png'); }
	.idx_common_slideController .ctrl-btn.next { background-image:url('/res/img/home/page/index/image_idx_slide_rightArrow.png'); }
	.idx_common_slideController .ctrl-btn.pause { background-image:url('/res/img/home/page/index/image_idx_slide_pause.png'); }
	.idx_common_slideController .ctrl-btn.resume { background-image:url('/res/img/home/page/index/image_idx_slide_resume.png'); }
	
	.idx_common_slideController .ctrl-btn:not(.count):hover,
	.idx_common_slideController .ctrl-btn:not(.count):focus {
		background-color:#fff;
		border:1px solid #ccc;
		opacity:1;
	}


/********** 상단배너 **********/
#topBanner {
	display:block;
	width:100%;
}
	#topBanner .banner-area--frame { 
		display:block;
		width:100%;
		background-color:#fff;
		position:relative;
	}
		#topBanner .main-banner-slide--controller {
			display:flex;
			justify-content:center;
			width:100%;
			margin-bottom:17px;
			position:absolute;
			left:50%;
			transform:translateX(-50%);
			z-index:101;
		}
			#topBanner .ctrl-item { 
				display:block;
				width:35px;
				height:35px;
				align-self:center;
			}
			
			#topBanner .ctrl-item:not(:last-of-type) { margin-right:10px; }
						
				#topBanner .ctrl-item .ctrl-btn {
					display:block;
					width:100%;
					height:100%;
					border:1px solid #fff;
					border-radius:40px;
					background-color:transparent;
					background-repeat:no-repeat;
					background-position:center center;
					transition:0.3s all ease-in-out;
				}
				
				#topBanner .ctrl-item .ctrl-btn.prev { background-image:url('/res/img/home/page/index/image_mainBanner_ctrl_prev_mini.png'); }
				#topBanner .ctrl-item .ctrl-btn.next { background-image:url('/res/img/home/page/index/image_mainBanner_ctrl_next_mini.png'); }
				#topBanner .ctrl-item .ctrl-btn.pause { background-image:url('/res/img/home/page/index/image_mainBanner_ctrl_pause_mini.png'); }
				#topBanner .ctrl-item .ctrl-btn.resume { background-image:url('/res/img/home/page/index/image_mainBanner_ctrl_resume_mini.png'); }
				
				#topBanner .ctrl-item .ctrl-btn:hover,
				#topBanner .ctrl-item .ctrl-btn:focus {
					background-color:#464646;
					border-color:#464646;
				}

		#topBanner .banner--slide {
			display:block;
			width:100%;
		}
		
			#topBanner .slick-list { width:100%; }
			
				#topBanner .slide-item {
					display:block;
					width:100%;
				}
					#topBanner .slide-item .banner-link {
						display:flex;
						justify-content:center;
						align-items:center;
						flex-wrap:wrap;
						width:100%;
						background-repeat:no-repeat;
						background-position:center center;
						position:relative;
					}
					
					#topBanner .slide-item .banner-link:before {
						content:'';
						display:block;
						width:100%;
						height:100%;
						background-color:rgba(0,0,0,0.3);
						position:absolute;
						left:0;
						top:0;
						z-index:1;
					}
					
					#topBanner .slide-item.item1 .banner-link { background-image:url('../../img/home/page/index/image_idx_mainSlide_bg01.jpg'); }				
					#topBanner .slide-item.item2 .banner-link { background-image:url('../../img/home/page/index/image_idx_mainSlide_bg02.jpg'); }
					#topBanner .slide-item.item3 .banner-link { background-image:url('../../img/home/page/index/image_idx_mainSlide_bg03.jpg'); }
					
						#topBanner .slide-item .text-area {
							display:block;
							position:relative;
							z-index:2;
						}
					
							#topBanner .slide-item .main-title {
								display:block;
								width:100%;
							}
								#topBanner .slide-item .main-title .block {
									display:block;
									width:100%;
									font-size:3rem;
									font-family:'SEBANG_Gothic_Regular', sans-serif;
									color:#fff;
									font-weight:300;
									letter-spacing:-.9px;
									line-height:1.4;
									text-align:center;
								}
								
							#topBanner .slide-item .sub-title {
								display:block;
								width:100%;
								margin-bottom:10px;
								font-family:'SEBANG_Gothic_Regular', sans-serif;
								font-size:1.4rem;
								font-weight:300;
								color:rgba(255,255,255,.6);
								letter-spacing:-1.2px;
								text-align:center;
								line-height:1.4;
							}
							
							#topBanner .slide-item .en-text {
								display:block;
								width:100%;
								font-family:'SEBANG_Gothic_Regular', sans-serif;
								font-weight:400;
								color:rgba(255,255,255,1);
								letter-spacing:-.4px;
								text-align:center;
								line-height:1.4;
								text-align:center;
								font-size:1rem;
							}
							
							#topBanner .slide-item .discription {
								display:block;
								width:100%;
								padding-top:30px;
							}
								#topBanner .slide-item .discription .block {
									display:block;
									width:100%;
									font-weight:600;
									color:rgba(255,255,255,.6);
									letter-spacing:-.2px;
									line-height:1.4;
									text-align:center;
									font-size:0.85rem;
								}


/********** 바로가기 링크 **********/
#shortCutlink {
	display:block;
	width:100%;
	position:relative;
}
	#shortCutlink .inner-section {
		display:flex;
		justify-content:center;
		align-items:center;
		flex-wrap:wrap;
		padding:20px 0;
		background-color:#fff;
		border:1px solid #ccc;
	}
		#shortCutlink .short-link {
			display:block;
			width:auto;
			min-width:70px;
		}
		
			#shortCutlink .short-link .image-box {
				display:block;
				width:100%;
				padding-top:60px;
				background-position:center top;
				background-repeat:no-repeat;
			}
			
			#shortCutlink .short-link.link1 .image-box { background-image:url('/res/img/home/page/index/image_idx_shortLink_icon01.png'); }
			#shortCutlink .short-link.link2 .image-box { background-image:url('/res/img/home/page/index/image_idx_shortLink_icon02.png'); }
			#shortCutlink .short-link.link3 .image-box { background-image:url('/res/img/home/page/index/image_idx_shortLink_icon03.png'); }
			#shortCutlink .short-link.link4 .image-box { background-image:url('/res/img/home/page/index/image_idx_shortLink_icon04.png'); }
			#shortCutlink .short-link.link5 .image-box { background-image:url('/res/img/home/page/index/image_idx_shortLink_icon05.png'); }
			
			#shortCutlink .short-link .text-box {
				display:block;
				width:100%;
				margin-top:10px;
				font-family:'SEBANG_Gothic_Regular', sans-serif;
				font-size:1.1rem;
				font-weight:300;
				color:#000;
				text-align:center;
				transition:0.3s all ease-in-out;
			}

		#shortCutlink .short-link:hover,
		#shortCutlink .short-link:focus { text-decoration:none; }

			#shortCutlink .short-link:hover .image-box,
			#shortCutlink .short-link:focus .image-box {
				animation-name:swingVerti;
				animation-duration:1s;
				animation-iteration-count:infinite;
				animation-timing-function:ease-out;
			}
			
			#shortCutlink .short-link:hover .text-box,
			#shortCutlink .short-link:focus .text-box { color:#1e99c2; }

@keyframes swingVerti {
	0% { background-position:center top; }
	25% { background-position:center 5px; }
	50% { background-position:center top; }
	75% { background-position:center 5px; }
	100% { background-position:center top; }
}

/********** 프로그램 **********/
#programSection {
	display:block;
	width:100%;
}
	#programSection .program-frame {
		display:block;
		width:100%;
	}

		#programSection .tab-menu--frame {
			display:flex;
			justify-content:flex-start;
			width:100%;
			overflow-x:auto;
			margin-bottom:25px;
		}
		
			#programSection .tab-link {
				display:block;
				width:80px;
				min-width:80px;
				padding:13px 0;
				margin-top:5px;
				background-color:#fff;
				border:1px solid #ccc;
				border-radius:5px;
				font-size:0.85rem;
				font-weight:600;
				color:rgba(0,0,0,.6);
				text-align:center;
				transition:0.3s all ease-in-out;
				white-space:nowrap;
			}
			
			#programSection .tab-link:not(:last-of-type) { margin-right:8px; }
			
			#programSection .tab-link.current {
				background-color:#1e99c2;
				border-color:#1e99c2;
				color:#fff;
			}
			
			#programSection .tab-link:hover,
			#programSection .tab-link:focus {
				background-color:#464646;
				border-color:#464646;
				text-decoration:none;
				color:#fff;
			}

		#programSection .tab-content--frame {
			display:block;
			width:100%;
		}
			#programSection .tab-content {
				display:none;
				width:100%;
			}
			
			#programSection .tab-content.current { display:block; }
			
				#programSection .program-list--frame {
					display:flex;
					justify-content:flex-start;
					flex-wrap:wrap;
					width:100%;
				}	
				
				#programSection .program-list--frame.no-list {
					display:flex;
					justify-content:center;
					align-items:center;
					width:100%;
					height:150px;
					background-color:#fff;
					border:2px solid #000;
					border-radius:10px;
				}
					#programSection .program-list--frame.no-list .text {
						display:block;
						width:100%;
						font-family:'GmarketSansMedium', sans-serif;
						font-size:1.2rem;
						font-weight:300;
						color:#000;
						letter-spacing:-.9px;
						text-align:center;
					}
				
					#programSection .program-list {
						display:block;
						border-radius:10px;
						position:relative;
						overflow:hidden;
					}
					
						#programSection .program-list .image-box {
							display:block;
							width:100%;
							padding-top:75%;
							position:relative;
						}
						
							#programSection .program-list .image-box img {
								display:block;
								width:100%;
								height:100%;
								position:absolute;
								left:50%;
								top:50%;
								transform:translate(-50%, -50%);
								transition:0.3s all ease-in-out;
							}
							
							#programSection .program-list:hover .image-box img,
							#programSection .program-list:focus .image-box img {
								transform:scale(1.2) translate(-50%, -50%);
							}

						#programSection .program-list .status--frame .status {
							display:block;
							width:90px;
							padding:15px;
							border-radius:5px;
							font-size:0.80rem;
							font-weight:600;
							color:#fff;
							position:absolute;
							top:25px;
							right:25px;
							text-align:center;
						}
													
						#programSection .program-list .text-bg {
							display:block;
							width:100%;
							height:100%;
							background:linear-gradient(180deg, transparent 45%, rgba(0,0,0,1) 100%);
							position:absolute;
							left:0;
							top:0;
							z-index:2;
						}

						#programSection .program-list .text-box {
							display:block;
							width:100%;
							padding:25px;
							position:absolute;
							left:0;
							bottom:0;
							z-index:3;
						}
							#programSection .program-list .text-box .list-department {
								display:block;
								width:100%;
								margin-bottom:6px;
								font-weight:600;
								font-size:0.85rem;
								color:#fff;
							}
							
							#programSection .program-list .text-box .list-title {
								display:block;
								width:100%;
								margin-bottom:6px;
								font-family:'GmarketSansMedium', sans-serif;
								font-size:1.2rem;
								font-weight:300;
								color:#fff;
								letter-spacing:-.4px;
								line-height:1.4;
							}
							
							#programSection .program-list .text-box .list-description {
								display:block;
								width:100%;
								margin-bottom:12px;
								font-weight:600;
								font-size:0.85rem;
								color:rgba(255,255,255,.6);
							}
							
							#programSection .program-list .text-box .list-date {
								display:flex;
								justify-content:flex-start;
								align-items:center;
								flex-wrap:wrap;
								width:100%;
								font-weight:600;
								font-size:0.8rem;
								color:#fff;
							}
								#programSection .program-list .text-box .list-date .date-title,
								#programSection .program-list .text-box .list-date .date-cont {
									display:block;
									width:auto;
								}
								
								#programSection .program-list .text-box .list-date .date-title { margin-right:12px; }

/********** 강사소개 **********/
#instructorSection {
	display:block;
	width:100%;
}
	#instructorSection .inner-section {
		display:block;
		position:relative;
	}
		
		#instructorSection .instructor-slide .slide-list { width:100%; }
		
			#instructorSection .slide-item .image-box {
				display:block;
				width:100%;
				border-radius:10px;
				position:relative;
				padding-top:127.9%;
				overflow:hidden;
			}
				#instructorSection .slide-item .image-box img {
					display:block;
					width:100%;
					height:100%;
					position:absolute;
					left:50%;
					top:50%;
					transform:translate(-50%, -50%);
				}

			#instructorSection .slide-item .text-box {
				display:block;
				width:100%;
				margin-top:20px;
				text-align:center;
			}
			
				#instructorSection .slide-item .text-box .name {
					display:block;
					width:100%;
					font-family:'GmarketSansMedium', sans-serif;
					font-size:1.2rem;
					font-weight:300;
					color:#000;
					letter-spacing:-.4px;
					line-height:1.4;
				}
			
				#instructorSection .slide-item .text-box .department {
					display:block;
					width:100%;
					margin-top:6px;
					font-weight:600;
					font-size:0.85rem;
					color:rgba(0,0,0,.7);
				}

/********** 중간 **********/
@font-face {
    font-family: 'InkLipquid';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/InkLipquid.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

#sepaSection {
	display:block;
	width:100%;
	padding:85px 0;
	background-color:#eecea7;
	background-image:url('/res/img/home/page/index/image_idx_sepa_bg_01.png'), url('/res/img/home/page/index/image_idx_sepa_bg_02.png'), url('/res/img/home/page/index/image_idx_sepa_bg_03.png'), url('/res/img/home/page/index/image_idx_sepa_bg_04.png');
	background-repeat:no-repeat, no-repeat, no-repeat, no-repeat;
	background-position:left bottom, 15% top, 88% bottom, right top;
}
	
	#sepaSection .inner-section {
		display:flex;
		justify-content:center;
	}
		#sepaSection .inner-section .text-box {
			display:block;
			width:100%;
		}
			#sepaSection .text-box .small-text {
				display:block;
				width:100%;
				padding-bottom:12px;
				font-family:'InkLipquid', sans-serif;
				color:#000;
				letter-spacing:-.6px;
				line-height:1.4;
				text-align:center;
			}
			
			#sepaSection .text-box .large-text {
				display:block;
				width:100%;
				font-family:'GmarketSansMedium', sans-serif;
				font-weight:300;
				color:#000;
				letter-spacing:-.4px;
				line-height:1.4;
				text-align:center;
			}

/********** 작품갤러리 **********/
#galleySection {
	display:block;
	width:100%;
}
	#galleySection .inner-section { display:block; }
	
		#galleySection .inner-section .gallery-list--frame {
			display:flex;
			justify-content:flex-start;
			flex-wrap:wrap;
			width:100%;
		}
			#galleySection .gallery-list--frame .list-item { display:block; }
			
			#galleySection .gallery-list--frame .title-item { position:relative; }
			
				#galleySection .gallery-list--frame .idx-title--frame .cmn-title,
				#galleySection .gallery-list--frame .idx-title--frame .cmn-en { width:100%; }
				
				#galleySection .gallery-list--frame .idx-title--frame .cmn-en { margin-left:0; }
				
				#galleySection .gallery-list--frame .more-btn--frame { position:absolute; }

			#galleySection .gallery-list--frame .logo-item {
				display:flex;
				justify-content:center;
				align-items:center;
				background-color:#5bb7a3;
			}
				#galleySection .gallery-list--frame .logo-item .image-box {
					display:block;
					width:100%;
					text-align:center;
				}
					#galleySection .gallery-list--frame .logo-item .image-box img  {
						max-width:100%;
						vertical-align:top;
					}
		
			#galleySection .gallery-list--frame .cont-item { position:relative; }
			
				#galleySection .gallery-list--frame .cont-item .image-box {
					display:block;
					width:100%;
					padding-top:72.73%;
					position:relative;
					overflow:hidden;
				}
					#galleySection .gallery-list--frame .cont-item .image-box img {
						display:block;
						width:100%;
						height:100%;
						position:absolute;
						left:50%;
						top:50%;
						transform:translate(-50%, -50%);
						transition:0.3s all ease-in-out;
					}
			
					#galleySection .gallery-list--frame .cont-item:hover .image-box img,
					#galleySection .gallery-list--frame .cont-item:focus .image-box img {
						transform:scale(1.2) translate(-50%, -50%);
					}
			
				#galleySection .gallery-list--frame .cont-item .text-bg {
					display:block;
					width:100%;
					height:100%;
					background:linear-gradient(180deg, transparent 45%, rgba(0,0,0,1) 100%);
					position:absolute;
					left:0;
					top:0;
					z-index:2;
					opacity:0;
					transition:0.3s all ease-in-out;
				}
				
				#galleySection .gallery-list--frame .cont-item .text-box {
					display:block;
					width:100%;
					padding:27px;
					position:absolute;
					left:0;
					bottom:0;
					z-index:3;
					opacity:0;
					transition:0.3s all ease-in-out;
				}	
					#galleySection .gallery-list--frame .cont-item .text-box .date,
					#galleySection .gallery-list--frame .cont-item .text-box .title {
						display:block;
						width:100%;
						font-family:'GmarketSansMedium', sans-serif;
						font-weight:500;
						letter-spacing:-.9px;
						line-height:1.4;
					}
					
					#galleySection .gallery-list--frame .cont-item .text-box .date {
						font-size:1rem;
						color:rgba(255,255,255,.6);
					}
					
					#galleySection .gallery-list--frame .cont-item .text-box .title {
						font-size:1.5rem;
						color:#fff;
					}
					
			#galleySection .gallery-list--frame .cont-item:hover,
			#galleySection .gallery-list--frame .cont-item:focus {
				text-decoration:none;
			}
			
				#galleySection .gallery-list--frame .cont-item:hover .text-box,
				#galleySection .gallery-list--frame .cont-item:focus .text-box,
				#galleySection .gallery-list--frame .cont-item:hover .text-bg,
				#galleySection .gallery-list--frame .cont-item:focus .text-bg { opacity:1; }
				
/********** 하단 배너 & 공지사항 **********/	
#boardSection {
	display:block;
	width:100%;
}

	#boardSection .inner-section {
		display:flex;
		justify-content:flex-start;
		flex-wrap:wrap;
	}
		#boardSection .left-area {
			display:block;
			position:relative;
		}
			
			#boardSection .bottomBanner-slide--controller {
				padding:10px;
				background-color:rgba(255,255,255,.8);
				border:1px solid #ccc;
				border-radius:10px;
				z-index:101;
				right:10px;
				top:10px;
			}
		
			#boardSection .bottomBanner--slide {
				display:block;
				width:100%;
				border:1px solid #ccc;
				border-radius:10px;
				overflow:hidden;
			}
				#boardSection .bottomBanner--slide .slick-list {
					width:100%;
					height:100%;
				}
				#boardSection .bottomBanner--slide .slick-track { height:100%; }
				#boardSection .bottomBanner--slide .slide-item { width:100%; position:relative; }
					#boardSection .bottomBanner--slide .slide-item img {
						width:100%;
						max-width:100%;
					}
		
			#boardSection .ctrl-btn.count {
				display:flex;
				justify-content:flex-start;
				width:auto;
				margin-right:10px;
				height:auto;
			}
			
				#boardSection .ctrl-btn.count .c-num {
					display:block;
					width:auto;
					font-family:"SEBANG_Gothic_Regular", sans-serif;
					font-size:1.21rem;
				}
				
				#boardSection .ctrl-btn.count .c-num:not(:last-of-type) { margin-right:7px; }
				#boardSection .ctrl-btn.count .c-num.current,
				#boardSection .ctrl-btn.count .c-num.sepa { color:#000; }					
				#boardSection .ctrl-btn.count .c-num.total { color:rgba(0,0,0,.6); }
		
			/*
			#boardSection .bottom-banner--frame {
				display:flex;
				flex-direction:column;
				justify-content:space-between;
				width:100%;
				height:100%;
				padding:49px;
				background-color:#131937;
				background-image:url('/res/img/home/page/index/image_idx_under_banner_bg1.png'), url('/res/img/home/page/index/image_idx_under_banner_bg2.png');
				background-repeat:no-repeat, no-repeat;
				background-position:right bottom, right bottom;
				border-radius:10px;
			}
				#boardSection .bottom-banner--frame .text-box {
					display:block;
					width:100%;
				}
					#boardSection .bottom-banner--frame .text-box .t-list {
						display:block;
						width:100%;
						font-family:'GmarketSansLight', sans-serif;
						font-weight:300;
						color:#fff;
						line-height:1.21;
						letter-spacing:-.9px;
					}
					
					#boardSection .bottom-banner--frame .text-box .t-list.t-bold {
						font-family:'GmarketSansbold', sans-serif;
					}

				#boardSection .bottom-banner--frame .link {
					display:inline-flex;
					justify-content:flex-start;
					align-items:center;
					width:auto;
				}
					#boardSection .bottom-banner--frame .link .text,
					#boardSection .bottom-banner--frame .link .icon {
						display:block;
						width:auto;
					}
					
					#boardSection .bottom-banner--frame .link .text {
						padding-right:25px;
						font-size:1.15rem;
						font-family:'SEBANG_Gothic_Regular', sans-serif;
						font-weight:300;
						color:#fff;
					}
					
				#boardSection .bottom-banner--frame .link:hover,
				#boardSection .bottom-banner--frame .link:focus { text-decoration:none; }
				
					#boardSection .bottom-banner--frame .link:hover .text,
					#boardSection .bottom-banner--frame .link:focus .text { color:#ff0; }
		*/
		#boardSection .right-area { display:block; }
		
			#boardSection .notice-board--frame {
				display:block;
				width:100%;
				position:relative;
			}
				#boardSection .notice-board--frame .idx-title--frame { margin-bottom:15px; }
				
					#boardSection .notice-board--frame .idx-title--frame .cmn-title { font-size:2rem; }
					#boardSection .notice-board--frame .idx-title--frame .cmn-en { padding-bottom:8px; }
	
				#boardSection .notice-board--frame .board--frame {
					display:block;
					width:100%;
					border-top:1px solid #ccc;
				}
					#boardSection .notice-board--frame .board-link {
						display:block;
						width:100%;
						padding:25px 0;
						background-image:url('/res/img/home/page/index/image_idx_notice_arrow.png');
						background-repeat:no-repeat;
						background-position:right center;
						border-bottom:1px solid #ccc;
					}
					
						#boardSection .notice-board--frame .board-link .link-title {
							width:calc(100% - 42px);
							font-family:'GmarketSansMedium', sans-serif;
							font-weight:300;
							font-size:1.21rem;
							color:rgba(0,0,0,1);
							line-height:1.21;
							letter-spacing:-.6px;
							overflow:hidden;
							text-overflow:ellipsis;
							display:-webkit-box;
							-webkit-line-clamp:1;
							-webkit-box-orient:vertical;
							transition:0.3s all ease-in-out;
						}
							#boardSection .notice-board--frame .board-link .link-title .noti { font-family:'GmarketSansMedium', sans-serif; }
						
						#boardSection .notice-board--frame .board-link .link-date {
							display:block;
							width:calc(100% - 42px);
							margin-top:12px;
							font-family:'GmarketSansMedium', sans-serif;
							font-weight:300;
							font-size:1rem;
							color:rgba(0,0,0,.6);
							line-height:1.21;
							letter-spacing:-.6px;
						}
					
					#boardSection .notice-board--frame .board-link:hover,
					#boardSection .notice-board--frame .board-link:focus {
						animation-name:swing;
						animation-duration:1s;
						animation-iteration-count:infinite;
						animation-timing-function:ease-out;
						text-decoration:none;
					}
						
						#boardSection .notice-board--frame .board-link:hover .link-title,
						#boardSection .notice-board--frame .board-link:focus .link-title { color:#5bb7a3; }
	
				#boardSection .notice-board--frame .more-btn--frame {
					position:absolute;
					right:0;
					top:5px;
				}
	

@keyframes swing {
	0% { background-position:right center; }
	25% { background-position:99% center; }
	50% { background-position:right center; }
	75% { background-position:99% center; }
	100% { background-position:right center; }
}

/********** responsive - start **********/

/* Mobile */
@media screen and (min-width:1px) and (max-width:545px) {
	/********** 상단배너 **********/
	#topBanner .slide-item .sub-title { font-size:1.1rem; }
	#topBanner .slide-item .main-title .block { font-size:2rem; }
	#topBanner .slide-item .en-text { font-size:0.91rem; }
	
	/********** 중간 **********/
	#sepaSection { background-size:40%, 40%, 40%, 40%; }
}

/* Mobile */
@media screen and (min-width:1px) and (max-width:639px) {
	/********** 공통 타이틀 **********/
	.idx-title--frame .cmn-title { font-size:1.75rem; }
	
	.idx-title--frame .cmn-en {
		padding-bottom:6px;
		font-size:1rem;
	}
	
	/********** 공통 - 컨트롤러 디자인 **********/	
	.idx_common_slideController .ctrl-btn:not(.count) {
		width:25px;
		height:48px;
		position:absolute;
		top:50%;
		transform:translateY(-50%);
	}
	
	.idx_common_slideController .ctrl-btn.prev {
		background-image:url('../../img/home/page/index/image_idx_slide_leftArrow_mob.png');
		left:20px;
	}
	
	.idx_common_slideController .ctrl-btn.next {
		background-image:url('../../img/home/page/index/image_idx_slide_rightArrow_mob.png');
		right:20px;
	}
	
	.idx_common_slideController .ctrl-btn.pause { display:none !important; }
	
	/********** 상단배너 **********/
	#topBanner .slide-item .banner-link {
		padding-top:80px;
		padding-bottom:140px;
	}
	
	#topBanner .main-banner-slide--controller { bottom:60px; }
	
	/********** 바로가기 링크 **********/
	#shortCutlink .short-link { width:33.3333%; }	
	#shortCutlink .short-link:not(:last-of-type) { border-right:1px solid #ccc; }
	#shortCutlink .short-link:nth-of-type(n+4) { margin-top:20px; }

	/********** 프로그램 **********/
	#programSection .program-list { width:100%; }
	#programSection .program-list:nth-of-type(n+2) { margin-top:20px; }
	
	/********** 강사소개 **********/
	#instructorSection .instructor-slide {
		width:65% !important;
		margin-left:auto !important;
		margin-right:auto !important;
	}
	
		#instructorSection .more-btn--frame {
			display:flex;
			justify-content:center;
			width:auto;
			margin-top:40px;
		}
		
		#instructorSection .more-btn--frame .more-btn {
			width:50px;
			height:50px;
			border:1px solid #ccc;
			border-radius:25px;
		}
	
	/********** 중간 **********/
	#sepaSection { margin:30px 0; }
		#sepaSection .text-box .small-text { font-size:1.5rem; }
		#sepaSection .text-box .large-text { font-size:1rem; }
	
	/********** 작품갤러리 **********/
	#galleySection .idx-title--frame {
		justify-content:flex-end;
		flex-direction:row-reverse;
	}
	
		#galleySection .gallery-list--frame .idx-title--frame .cmn-title, 
		#galleySection .gallery-list--frame .idx-title--frame .cmn-en { width:auto; }
		
		#galleySection .gallery-list--frame .idx-title--frame .cmn-en { margin-left:12px; }
	
	#galleySection .gallery-list--frame .list-item { width:100%; }
	
	#galleySection .gallery-list--frame .more-btn--frame { display:none; }
	
	#galleySection .gallery-list--frame .logo-item { display:none; }
	
	#galleySection .mob-btn--frame {  }
	
		#galleySection .mob-btn--frame .more-btn--frame {
			display:flex;
			justify-content:center;
			width:auto;
			margin-top:40px;
		}
		
			#galleySection .mob-btn--frame .more-btn--frame .more-btn {
				width:50px;
				height:50px;
				border:1px solid #ccc;
				border-radius:25px;
			}
			
	/********** 하단 배너 & 공지사항 **********/
	#boardSection .left-area,	
	#boardSection .right-area { width:100%; }
	
	#boardSection .left-area { margin-bottom:30px; }
	
			#boardSection .bottomBanner-slide--controller {
				padding:0;
				background-color:transparent;
				border:0;
			}
	
			#boardSection .bottomBanner-slide--controller .count { display:none; }
			
			#boardSection .bottomBanner--slide {
				width:75%;
				margin-left:auto;
				margin-right:auto;
				margin-bottom:45px;
			}
				#boardSection .bottomBanner--slide .pc-size { display:none; }
				#boardSection .bottomBanner--slide .mob-size { display:block; }
	
		/*
		#boardSection .bottom-banner--frame .text-box { padding-bottom:35px; }
			#boardSection .bottom-banner--frame .text-box .t-list { font-size:1.5rem; }
		*/			
}

/* Mobile & Tablet */
@media screen and (min-width:1px) and (max-width:1316px) {
	/********** 공통 -컨트롤러 디자인 **********/	
	
	/********** 바로가기 링크 **********/
	#shortCutlink .inner-section { width:100%; }
	
	
	/********** 프로그램 **********/
	#programSection { padding:40px 30px; }
	
		#programSection .inner-section { width:100%; }
		
		#programSection .more-btn--frame {
			display:flex;
			justify-content:center;
			width:auto;
			margin-top:40px;
		}
		
		#programSection .more-btn--frame .more-btn {
			width:50px;
			height:50px;
			border:1px solid #ccc;
			border-radius:25px;
		}
	
	/********** 강사소개 **********/
	#instructorSection { padding:40px 30px; }
		
		#instructorSection .inner-section { width:100%; }
		
			
	/********** 중간 **********/
	#sepaSection .inner-section {
		width:100%;
		padding-left:30px;
		padding-right:30px;
	}
	
		#sepaSection .inner-section .small-text,
		#sepaSection .inner-section .large-text {			
			text-shadow:
			rgb(255, 255, 255) 2px 0px 0px, 
			rgb(255, 255, 255) 1.75517px 0.958851px 0px, 
			rgb(255, 255, 255) 1.0806px 1.68294px 0px, 
			rgb(255, 255, 255) 0.141474px 1.99499px 0px, 
			rgb(255, 255, 255) -0.832294px 1.81859px 0px, 
			rgb(255, 255, 255) -1.60229px 1.19694px 0px, 
			rgb(255, 255, 255) -1.97998px 0.28224px 0px, 
			rgb(255, 255, 255) -1.87291px -0.701566px 0px, 
			rgb(255, 255, 255) -1.30729px -1.5136px 0px, 
			rgb(255, 255, 255) -0.421592px -1.95506px 0px, 
			rgb(255, 255, 255) 0.567324px -1.91785px 0px, 
			rgb(255, 255, 255) 1.41734px -1.41108px 0px, 
			rgb(255, 255, 255) 1.92034px -0.558831px 0px;
		}
	
	/********** 작품갤러리 **********/
	#galleySection { padding:40px 30px; }
	
		#galleySection .inner-section { width:100%; }
		
	/********** 하단 배너 & 공지사항 **********/	
	#boardSection { padding:40px 30px; }

		#boardSection .inner-section { width:100%; }
			
			#boardSection .bottomBanner--slide .slide-item.slick-slide img { max-width:100%; }
			#boardSection .bottomBanner--slide .slide-item .image_box { display:block; width:100%; padding-top:100%; }
	
}

/* Tablet */
@media screen and (min-width:640px) and (max-width:1316px) {
	/********** 상단배너 **********/
	#topBanner .slide-item .banner-link {
		padding-top:120px;
		padding-bottom:180px;
	}
	
	#topBanner .main-banner-slide--controller { bottom:100px; }
	
	/********** 바로가기 링크 **********/
	#shortCutlink .short-link { width:20%; }	
	#shortCutlink .short-link:not(:last-of-type) { border-right:1px solid #ccc; }
	
	/********** 프로그램 **********/
	#programSection .program-list { width:49%; }
	#programSection .program-list:nth-of-type(odd) { margin-right:2%; }
	#programSection .program-list:nth-of-type(n+3) { margin-top:20px; }
	
	/********** 작품갤러리 **********/
	#galleySection .gallery-list--frame .list-item { width:50%; }
}

/* Tablet & PC */
@media screen and (min-width:640px) {
	/********** 공통-컨트롤 디자인 **********/
	.idx_common_slideController { position:absolute; }
	
	/********** 강사소개 **********/
	/*#instructorSection .instructor-slide { margin-right:-29rem; }*/
	
	#instructorSection .slick-track {
  margin-left: 0 !important; /* 또는 원하는 값으로 조정 */
}
	
		#instructorSection .instructor-slide .slide-item:not(:last-of-type) { margin-right:36px; }
	
	#instructorSection .instructor-slide--controller {
		right:35px;
		top:12px;
	}
		#instructorSection .more-btn--frame {
			position:absolute;
			right:0;
			top:12px;
		}
		
	/********** 중간 **********/
	#sepaSection { margin:80px 0; }
	
		#sepaSection .text-box .small-text { font-size:2rem; }	
		#sepaSection .text-box .large-text { font-size:1.35rem; }
	
	/********** 작품갤러리 **********/
	#galleySection .gallery-list--frame .title-item { padding:30px; }
	
	#galleySection .gallery-list--frame .list-item { width:33.33333%; }
	
	#galleySection .gallery-list--frame .no-list { width:33.33333%; text-align:center; }
	
	#galleySection .gallery-list--frame .more-btn--frame {
		right:30px;
		bottom:30px;
	}
	
	#galleySection .mob-btn--frame { display:none; }
	
	/********** 하단 배너 & 공지사항 **********/
	
	
		#boardSection .bottomBanner--slide .mob-size { display:none !important; }
		
		/*
		#boardSection .bottom-banner--frame { min-height:483px; }
	
			#boardSection .bottom-banner--frame .text-box .t-list { font-size:2rem; }
		*/
		
	
	
		
}

/* Tablet & PC */
@media screen and (min-width:1px) and (max-width:899px) { 
	#boardSection .left-area,
	#boardSection .right-area { width:100%; }
	#boardSection .right-area { margin-top:30px; }
}

/* Tablet & PC */
@media screen and (min-width:900px) {
	/********** 배너존 **********/
	#boardSection .left-area {
		width:47.5%;
		margin-right:5%;
	}
	
	#boardSection .right-area { width:47.5%; }
}



/* PC */
@media screen and (min-width:1317px) {
	/********** 상단배너 **********/
	#topBanner { padding-bottom:60px; }
	
		#topBanner .slide-item .banner-link {
			padding-top:150px;
			padding-bottom:200px;
		}
		
		#topBanner .main-banner-slide--controller { bottom:120px; }

	/********** 바로가기 링크 **********/
	#shortCutlink .inner-section {
		width:1300px;
		border-radius:100px;
		position:absolute;
		left:50%;
		transform:translateX(-50%);
		top:-125px;
	}
		#shortCutlink .short-link:not(:last-of-type) { margin-right:160px; }
	
	/********** 프로그램 **********/
	#programSection { padding:80px 0; }
	
		#programSection .inner-section {
			width:1300px;
			margin-left:auto;
			margin-right:auto;
			position:relative;
		}
		
			#programSection .program-list { width:32%; }			
			#programSection .program-list:not(:last-of-type) { margin-right:2%; }
			#programSection .program-list:nth-of-type(3n) { margin-right:0; }
			#programSection .program-list:nth-of-type(n+4) { margin-top:20px; }
			
			#programSection .more-btn--frame {
				position:absolute;
				right:0;
				top:85px;
			}
	
	/********** 강사소개 **********/
	#instructorSection .inner-section {
		width:1300px;
		margin-left:auto;
		margin-right:auto;
	}
	
	/********** 중간 **********/
	#sepaSection .inner-section {
		width:1300px;
		margin-left:auto;
		margin-right:auto;
	}
	
	/********** 작품갤러리 **********/
	#galleySection .inner-section {
		width:1300px;
		margin-left:auto;
		margin-right:auto;
	}
	
	/********** 하단 배너 & 공지사항 **********/
	#boardSection { padding:80px 0; }

		#boardSection .inner-section {
			width:1300px;
			margin-left:auto;
			margin-right:auto;
		}
		
			
			
			#boardSection .bottomBanner--slide .slide-item { height:100%; }
		
}

/**********  responsive - end **********/ 