@charset "UTF-8";

/* 퍼블 가이드 배경 - 작업 후 삭제 */
/* .mainGuide{height: 4790px; background:url('/images/00_Main_1.jpg') no-repeat center 136px; } */

.mainGuide > section{width: 100%; }
.mainGuide > section:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.mainGuide .contens-area{width: 1100px; margin: 0 auto; position: relative; padding: 100px 0px; overflow: hidden; text-align: center;}



/* 이미지 베너 영역 */
.section_01{}
.sw-visual{text-align:center;}
.sw-visual .swiper-slide {opacity: 0 !important;}
.sw-visual .swiper-slide.swiper-slide-active {opacity: 1 !important;}
.section_01 .sw-visual-point{top : 35px !important;bottom: unset !important; left: 445px;}
.section_01 .sw-visual-point > .swiper-pagination-bullet{position: relative; padding: 0 10px 8px 10px; color: rgba(255, 255, 255, 0.3); border-bottom: 1px solid rgba(255, 255, 255, 0.3); display: inline-block;}
.section_01 .sw-visual-point > .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{ display: inline-block; padding: 0 10px 8px 10px; color: rgba(255, 255, 255, 0.3); border-bottom: 1px solid rgba(255, 255, 255, 0.3); }
.section_01 .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {margin: 0;}
.section_01 .swiper-pagination-bullet {width: auto; height: auto; border-radius: 0; background-color: transparent; opacity: 1;}
.section_01 .swiper-pagination-bullet.swiper-pagination-bullet-active{color: #fff;}
.section_01 .swiper-pagination-bullet.swiper-pagination-bullet-active:after {content: ''; width: 100%; height: 2px; background-color: #fff; position: absolute; bottom: -1px; left: 0;}


/* 게시물 추출/개강안내/상담신청 */
.section_02{position: relative;}
.section_02:before{display:block; content:''; background-color:#fff; width:50%; height:210px; position:absolute; left:0; z-index:-99;}
.latest-area, .starting-date-area, .consulting-area{float: left; height: 210px;}
.latest-area{background: #ffffff; width: 625px;}
.latest-area .notice{text-align: left; padding-top: 37px; position: relative;}
.latest-area .notice h3{color: #222222; font-size: 36px; padding-bottom: 24px;}
.latest-area .notice ul li{font-size:16px; color:#666666; line-height: 28px;}
.latest-area .notice ul li .notice-data{font-size: 12px; color: #999999; float: right; padding-right: 52px; letter-spacing: 0px}
.latest-area .notice .notice_more {position: absolute; top: 54px; right: 60px;}
.latest-area .notice .notice_more a{border-right: 1px solid #000; width:22px; height: 22px; display: block;}
.latest-area .notice .notice_more a:after{content:"" ;border-right: 1px solid #000; height: 22px; display: block; position: relative; transform: rotate( 90deg ); transform-origin: 50% 50%; top: -11px; left: 11px;}

.starting-date-area{background: #858df3; width: 305px; text-align: left;}
.starting-date{padding-top: 42px; padding-left: 49px;}
.starting-date h3{font-size:36px; font-weight: bold; color:#ffffff; padding-bottom: 13px; }
.starting-date dl{clear:both; font-size: 18px; color: #fff; line-height: 30px;}
.starting-date dl:before{content:"/"; display: inline-block; color:#dcdffb; font-size: 18px; position: relative; transform: rotate( 10deg ); transform-origin: 0% 100%;}
.starting-date dl > dt{vertical-align: top;display: inline-block; color: #dcdffb;padding: 0px 7px;}
.starting-date dl > dt + dd{display:inline-block; font-weight: bold;}


.consulting-area{background: #e7e8fd; width: 170px;}
.consulting-area > a{font-size: 28px; color: #5960d4; display: block; font-weight: 100; padding: 45px 0px 88px; line-height: 35px;}
.consulting-area > a:after{background: url(/images/btn_line_03.png) no-repeat 0 0; width: 54px; height: 6px; content: ""; display: block; margin: 0px auto; position: relative; top: 37px}


.section_02 .width {position: relative;}
.section_02 .section_02_top {width: 650px;}
.section_02 .section_02_top > div .title {width: 80px; }
.section_02 .section_02_top > div > * {float: left;}
.section_02 .section_02_top > .notice {padding: 20px 0 15px;}
.section_02 .section_02_top > .starting {padding: 15px 0 17px;}
.section_02 .section_02_top .notice {border-bottom: 1px solid #e0e0e0; padding: 20px 0 15px;}
.section_02 .section_02_top .notice .title {font-family: 'Sunflower', sans-serif; font-size: 18px; font-weight: bold;}
.section_02 .section_02_top .noticeSlider {width: 570px;  padding-right: 50px; -webkit-box-sizing: border-box; box-sizing: border-box; margin-top: -3px;}
.section_02 .section_02_top .starting .title {font-size: 16px; font-weight: bold;}
.section_02 .section_02_top .starting ul:not(:last-child) {margin-right: 18px;}
.section_02 .section_02_top .starting ul li {float: left;}
.section_02 .section_02_top .starting ul li.title {width: auto; margin-right: 8px;}

.section_02 .section_02_top .noticeSlider .title {font-family: 'Noto Sans KR', sans-serif; font-size: 16px !important; font-weight: normal !important;}
.section_02 .section_02_top .noticeSlider .date {font-size: 14px !important; color: #808080 !important; font-weight: normal !important;}
.section_02 .section_02_top .noticeSlider a > span.date {float: right;}

.section_02 .section_02_btm {border-top: 1px solid #000; padding: 20px 0;}
.section_02 .section_02_btm .consulting {padding: 0;}
.section_02 .section_02_btm .consulting > * {float: left;}
.section_02 .section_02_btm .consulting .consultingInfo {margin-right: 34px;}
.section_02 .section_02_btm .sTitle {font-family: 'Sunflower', sans-serif; font-size: 14px; color: #333; }
.section_02 .section_02_btm .tel {font-family: 'Sunflower', sans-serif;  font-weight: bold; font-size: 32px; color: #000; letter-spacing: -1px; }
.section_02 .section_02_btm .ex {font-size: 13px; color: #666;}
.section_02 .section_02_btm .consultingIcon ul {padding-top: 4px;}
.section_02 .section_02_btm .consultingIcon li {float: left; padding: 0 20px;}
.section_02 .section_02_btm .consultingIcon li a, .section_02 .section_02_btm .consultingIcon li a * {display: block; text-align: center; margin: 0 auto;}
.section_02 .section_02_btm .consultingIcon li a span {padding-top: 15px; font-size: 13px; color: #222; position: relative;}
.section_02 .section_02_btm .consultingIcon li:not(:last-child) span:after {content: ''; display: block; width: 1px; height: 13px; background-color: #01e399; position: absolute; right: -21px; top: 19px; transform: rotate(30deg); -webkit-transform: rotate(30deg); }

.section_02 .section_02_btm .consultingIcon li img {transition: all 0.3s;}
.section_02 .section_02_btm .consultingIcon li:hover img {transform: rotateY(180deg);}

.section_02 .section_02_float {width: 450px; height: 232px; position: absolute; right: 0; top:-43px; border-radius: 10px 0 30px 10px; background-color: #01e399; z-index:10; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 26px 26px 22px 30px; }
.section_02 .section_02_float .topBg {position: absolute;}
.section_02 .section_02_float .topBg01 {top: -8px; left: 72px; }
.section_02 .section_02_float .topBg02 {top: 22px; right: 55px; }
.section_02 .section_02_float h3 {font-size: 20px; text-align: center; }
.section_02 .section_02_float h3 span {font-size: 24px; color: #fff;}
.section_02 .section_02_float .passerWrap {width: 100%; height: 120px; margin-top: 8px; -webkit-box-sizing: border-box; box-sizing: border-box; }
.section_02 .section_02_float .passerWrap .passer {position: relative;}
.section_02 .section_02_float .passerWrap .passer:after {content: ''; display: block; clear: both;}
.section_02 .section_02_float .passerWrap .passer > * {float: left;}
.section_02 .section_02_float .passerWrap .passer p {width: 75%; max-width: 75%;overflow: hidden;white-space: nowrap;-o-text-overflow: ellipsis;text-overflow: ellipsis; font-size: 15px;}
.section_02 .section_02_float .passerWrap .passer p:after {content: ''; display: block; clear: both;}
.section_02 .section_02_float .passerWrap .passer span {width: 20%; float: right;}
.section_02 .section_02_float .passerWrap .passer.swiper-slide-active p, .section_02 .section_02_float .passerWrap .passer.swiper-slide-active span {font-size: 18px;}
.section_02 .section_02_float .passerWrap .passer.swiper-slide-active p i{top: -3px}

	.section_02 .section_02_float .passerWrap .passer p{}
	.section_02 .section_02_float .passerWrap .passer p i{background-color: #fff; text-align: center;font-size: 12px; border-radius: 4px; margin-right: 12px; width: 50px; height: 21px; line-height: 21px; display: inline-block; vertical-align: middle; position: relative; top: -2px}
	.section_02 .section_02_float .passerWrap .passer p i.bu_College{color: #454fba;}
	.section_02 .section_02_float .passerWrap .passer p i.bu_College:before{content: '대학';}
	.section_02 .section_02_float .passerWrap .passer p i.bu_Graduate{color: #454fba;}
	.section_02 .section_02_float .passerWrap .passer p i.bu_Graduate:before{content: '대학원';}
	.section_02 .section_02_float .passerWrap .passer p i.bu_Certificate{color: #009363;}
	.section_02 .section_02_float .passerWrap .passer p i.bu_Certificate:before{content: '자격증';}


/* 학원소개 */
.section_03{background:url('/images/section_03.jpg') no-repeat center}
.section_03 > .contens-area > .title-area{float:right; width: 35%; text-align: left; padding-top: 105px}
.section_03 > .contens-area > .title-area:before{content:"/"; display: block; color:#5960d4; font-size: 28px; position: relative; line-height: 14px; transform: rotate( 10deg ); transform-origin: 0% 100%;}
.section_03 > .contens-area > .title-area > .c-title > .en{letter-spacing: -0.3px;}
.section_03 .c-title{font-size: 38px; color: #333333; letter-spacing: -3.2px; font-weight: bold; padding-top: 21px; line-height: 42px;}
.section_03 .c-title .sttile{font-weight: 100; letter-spacing: 0px;}
.section_03 .s-title{font-size: 16px; color: #666666; padding-top: 22px; letter-spacing:-1.2px;}
.section_03 .ss-title{font-size: 13px; color: #9999; padding-top: 27px; letter-spacing:-1px; line-height: 155%;}

.section_03 {background: url(/images/main/section_03_bg.png) no-repeat; background-size: 100% auto;}
.section_03_c02 {overflow: hidden; background: url(/images/main/section_03_c02_bg_v2.png) no-repeat center bottom; padding: 20px 0 60px;}
.section_03_c02 .width {position: relative;}
.section_03_c02 .light {position: absolute; left: 10px; top: 170px; opacity: 0;}
.section_03_c02 .light1 {animation: light 1.2s infinite linear;}
.section_03_c02 .light2 {animation: light 0.7s infinite linear;}
@keyframes light {
	0% {
		-webkit-transform: scale(0.7);
		-moz-transform: scale(0.7);
		-o-transform: scale(0.7);
		-ms-transform: scale(0.7);
		-ms-transform: scale(0.7);
		transform: scale(0.7);
		opacity: 0;
	}
	50% {
		-webkit-transform: scale(0.9);
		-moz-transform: scale(0.9);
		-o-transform: scale(0.9);
		-ms-transform: scale(0.9);
		-ms-transform: scale(0.9);
		transform: scale(0.9);
		opacity: 1;
	}
	100% {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-o-transform: scale(1);
		-ms-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
		opacity: 0;
	}
}
.section_03 .section_03_c02 .dreamWrap {width: 190px; height: 125px; text-align:center; display: inline-block; position: relative; top: 280px; left: 70px;}
.section_03 .section_03_c02 .dreamTxt p {font-size: 20px; color: #222; line-height: 1.2;  display:block; height:3.6em;overflow:hidden; text-overflow:ellipsis;word-wrap:break-word; display: -webkit-box;-webkit-line-clamp:3; -webkit-box-orient: vertical; margin-bottom: 8px; word-break: keep-all;}
.section_03 .section_03_c02 .dreamTxt span {font-size: 15px; color: #666;}
.section_03 .section_03_c02 .dreamTxt {opacity: 0 !important;}
.section_03 .section_03_c02 .dreamTxt.swiper-slide-active {opacity: 1 !important;}

.section_03 .section_03_cont {float: right; width: 715px; padding-top: 60px; position: relative;}
.section_03 .section_03_contBox {width: 225px; height: 225px; float: left; border-radius: 100%; margin-top: 20px; position: relative; transition: all 0.5s; margin-right: 20px;}
.section_03 .section_03_contBox:nth-child(3n) {margin-right: 0;}
.section_03 .section_03_contBox:nth-child(2n) {background-color: #fff;}
.section_03 .section_03_contBox:nth-child(2n-1) {background-color: #999aa3;}
.section_03 .section_03_contBox * {text-align: center;}
.section_03 .section_03_contBox .content {padding-top: 8px;}
.section_03 .section_03_contBox h3 {margin-top: 32px;}
.section_03 .section_03_contBox h3 span {display: inline-block;font-size: 20px; padding-bottom: 8px; position: relative;}
.section_03 .section_03_contBox h3 span:after {content: ''; display: block; width: 16px; height: 1px; position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%);}
.section_03 .section_03_contBox:nth-child(2n) h3 span {color: #000;}
.section_03 .section_03_contBox:nth-child(2n) h3 span:after {background-color: #3b4360; }
.section_03 .section_03_contBox:nth-child(2n-1) h3 span {color: #fff;}
.section_03 .section_03_contBox:nth-child(2n-1) h3 span:after {background-color: #fff; }
.section_03 .section_03_contBox p {font-size: 15px; font-weight: 400; margin: 11px 0; font-weight: 300; line-height: 1.2;}
.section_03 .section_03_contBox .moreBtn {width: 39px; height: 39px; border-radius: 100%; position: absolute; top: 85%; left: 50%; -webkit- transform: translate(-50%, -50%); transform: translate(-50%, -50%); transition: all 0.1s;}
.section_03 .section_03_contBox:nth-child(2n) .moreBtn {background-color: #01e399;}
.section_03 .section_03_contBox:nth-child(2n-1) .moreBtn {background-color: #525679;}
.section_03 .section_03_contBox .moreBtn:before, .section_03 .section_03_contBox .moreBtn:after {content: ''; width: 15px; height: 3px; background-color: #fff; position: absolute; top: 18px; left: 12px; transition: all 0s; }
.section_03 .section_03_contBox .moreBtn:after {-webkit-transform: rotate(90deg); transform: rotate(90deg); }
.section_03 .section_03_contBox:not(:last-child):hover {box-shadow: 33px 15px 70px rgba(0,0,0,0.35);}
.section_03 .section_03_contBox .btn_goto {width: 0; height: 0; opacity: 0; background-color: rgba(0,0,0,0.7); position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border-radius: 100%; transition: all 0.1s;}
.section_03 .section_03_contBox .btn_goto p {font-size: 14px; text-align: center; margin-top: 65px;}
.section_03 .section_03_contBox .btn_goto span {display: block; width: 16px; height: 6px; margin: 9px auto 0; }
.section_03 .section_03_contBox:nth-child(2n) .btn_goto span {background-image: url(/images/main/btn_section_03_contBox_even.png); }
.section_03 .section_03_contBox:nth-child(2n-1) .btn_goto span {background-image: url(/images/main/btn_section_03_contBox_odd.png);}
.section_03 .section_03_contBox:nth-child(2n) .btn_goto p {color: #5fbe9f;}
.section_03 .section_03_contBox:nth-child(2n-1) .btn_goto p {color: #606cd4;}

.section_03 .section_03_contBox .btn_goto.on {animation: btn_goto_on 0.3s ease-out forwards 0.2s; }

@keyframes btn_goto_on {
	0% {
		width: 0;
		height: 0;
		opacity: 0;
	}
	100%{
		width: 160px;;
		height: 160px;;
		opacity: 1;
	}
}

.section_03_contBox {position: relative;}
/*.section_03_contBox > .hover {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: none;}*/
.section_03_contBox > .hover {position: absolute; top: 0; left: 0; transform: rotateY(180deg); display: block; transition: all 0.4s; opacity: 0; display: none;}
.section_03_contBox > .hover img {font-size: 0;}

.section_03_contBox:hover .hover { display: block; animation: section_03_contBoxHov 0.4s both; }
@keyframes section_03_contBoxHov {
	0%{
		transform: rotateY(180deg);
		opacity: 0;
	}
	100%{
		opacity: 1;
		transform: rotateY(0);
	}
}

.section_03 .section_03_c01 {padding-top: 50px; width: 100%; position: relative;}
.section_03 .processWrap {padding: 15px 0 30px;}
.section_03 .processWrap .processContent {width: 230px; height: 300px;position: absolute;left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); transition: all 0.3s;}
.section_03 .processWrap .processContent .processContentMain {position: relative; z-index: 3; padding: 35px 10px; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; height: 100%;}
.section_03 .processWrap .processContentMain h3 {display: inline-block; text-align: center; font-size: 20px; color: #fff; padding-bottom: 5px; border-bottom: 2px solid #fff; position: relative; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%);}
.section_03 .processWrap .processBox {position: relative; height: 330px;}
.section_03 .processWrap .processBox > .bg {display: none; position: absolute; bottom: -50px; left: -47px;}
.section_03 .processWrap .processContent:after {content: '';background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);width: 100%;height: 40%;position: absolute;top: 0;left: 0;z-index: 2;}

/* hover시 */
.section_03 .processWrap .processBox.on {position: relative;}
.section_03 .processWrap .processBox.on > .bg {display: block;}
.section_03 .processWrap .processBox.on .processContent {/*animation: height330 0.2s ease-out forwards; transform-origin: 50%;*/ height: 100%;}
.processWrap .processBox.on .processConten {animation: height330 0.3s ease-out forwards; transform-origin: 50%; }
.processWrap .processBox.on .processContent .processContentHov{animation: height330 0.3s ease-out forwards; transform-origin: 50%; }

@keyframes height330 {
	0% {
		height: 300px;
	}
	100% {
		height: 330px;
	}
}

.section_03 .processWrap .processContentHov {z-index: 3; width: 100%; height: 100%; background-color: rgba(50, 63, 203, 0.7); position: relative; overflow: hidden; display: none; position: absolute; top: 0; left: 0; }
.section_03 .processWrap .processContentHov .mainTitle span {position: relative; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); padding: 17px 10px 19px; display: inline-block; background-color: #030e8b; font-size: 17px; color: #01e399;}
.section_03 .processWrap .processContentHov .title {padding-top: 20px;}
.section_03 .processWrap .processContentHov .title span {display: inline-block; text-align: center; font-size: 20px; color: #fff; padding-bottom: 5px; border-bottom: 2px solid #fff; padding-top: 22px; position: relative; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
.section_03 .processWrap .processContentHov .ex {font-size: 15px; color: #dcdef1; word-break: keep-all; line-height:1.2; margin-top: 23px; padding: 0 40px; box-sizing: border-box; -webkit-box-sizing: border-box; text-align: center;}
.section_03 .processWrap .processContentHov .more {width:300px; height: 50px; bottom: -110px; left: 0; -webkit-transform: rotate(-15deg); transform: rotate(-15deg); background-color: #01e399; position: absolute; padding-top: 34px;}
.section_03 .processWrap .processContentHov .more > div {position: relative; -webkit-transform: rotate(15deg); transform: rotate(15deg); left: -70px; bottom: 50px;}
.section_03 .processWrap .processContentHov .more img {float: right; padding-right: 20px;}
.section_03 .processWrap .processContentHov .more p {font-size: 14px; color: #012a1d;text-align: right; position: relative; top: -10px; padding-right: 20px;}

.section_03 .section_03_c01 .processWrap-button-prev {z-index: 10; cursor:pointer;position: absolute; top: calc(50% + 25px); -webkit-transform: translateY(-50%); transform: translateY(-50%); left: 10%; width: 64px; height: 64px; background-image: url(/images/main/processWrap_prev_off.png); }
.section_03 .section_03_c01 .processWrap-button-next {z-index: 10;cursor:pointer;position: absolute; top: calc(50% + 25px); -webkit-transform: translateY(-50%); transform: translateY(-50%);  right: 10%; width: 64px; height: 64px; background-image: url(/images/main/processWrap_next_off.png); }
.section_03 .section_03_c01 .processWrap-button-prev:hover{background-image: url(/images/main/processWrap_prev_on.png);}
.section_03 .section_03_c01 .processWrap-button-next:hover{background-image: url(/images/main/processWrap_next_on.png);}


.section_03 .processWrap .processBox.on .processContentHov .more {animation: processBoxAni 0.3s forwards 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);}
@keyframes processBoxAni {
	0% {
		bottom: -100px;
	}
	100%{
		bottom: -35px;
	}
}
/*
.processWrap .swiper-slide-active .processContent.on {height: 330px !important;}
.processWrap .swiper-slide-active .processContent.on .processContentHov {height: 330px !important;}
*/


.section_03 .section_03_c03 .portfolioMainWrap {padding: 54px 0 68px;}
.section_03 .portfolioMainWrap > .width {position: relative; left: -110px;}
.section_03 .portfolioMainWrap .titleWrap {width: 281px; height: 399px; background-image: url(/images/main/seciont_03_c03_bg.png); position: absolute; top: 0; right: -105px;}
.section_03 .portfolioMainWrap .title {z-index: 10;position: absolute; right: 35px; top: 180px;}
.section_03 .portfolioMainWrap .titleWrap p {font-size: 20px; font-weight: bold; line-height: 1.3;}
.section_03 .portfolioMainWrap .titleWrap span {font-size: 12px; color: #999; display: block; margin-bottom: 8px;}
.section_03 .portfolioMainWrap .titleWrap a {transition: all 0.3s;font-size: 14px; color: #222; display: inline-block; padding: 7px 14px 9px; border: 1px solid #222; background-color: #fff;}
.section_03 .portfolioMainWrap .titleWrap img {vertical-align: 3px;}
.section_03 .portfolioMainWrap .portfolioSlideWrap {width: 100%; height: 100%; position: relative;}
.section_03 .portfolioSlideWrap .portfolioSlide {position: absolute;}
.section_03 .portfolioSlideWrap .portfolioSlide01 {width: 300px; height: 200px; top: 0; left: 0; overflow: hidden;}
.section_03 .portfolioSlideWrap .portfolioSlide02 {width: 200px; height: 300px; top: 220px; left: 100px;  overflow: hidden;}
.section_03 .portfolioSlideWrap .portfolioSlide03 {width: 380px; height: 500px; top: 40px; left: 320px; overflow: hidden;}
.section_03 .portfolioSlideWrap .portfolioSlide04 {width: 200px; height: 300px; top: 60px; left: 720px; overflow: hidden;}
.section_03 .portfolioSlideWrap .portfolioSlide05 {width: 300px; height: 200px; bottom: 0; left: 720px; overflow: hidden; }
.section_03 .portfolioSlide .content {width: 100%; height: 100%; position: absolute;}
.section_03 .portfolioSlide .content .txt {width: 100%; height: 40px; background-color: rgba(0,0,0,0.5); position: absolute; left: 0; bottom: 0; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0 16px; }
.section_03 .portfolioSlide .content .title {line-height: 39px; position: static; top: 0; left: 0; font-size: 16px; color: #fff; max-width: 65%; display: inline-block;overflow: hidden;white-space: nowrap;-o-text-overflow: ellipsis;text-overflow: ellipsis; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 12px;}
.section_03 .portfolioSlide .content .name {line-height: 40px; top: 0; left: 0; font-size: 14px; color: #b2b2b2; max-width: 30%; display: inline-block;overflow: hidden;white-space: nowrap;-o-text-overflow: ellipsis;text-overflow: ellipsis; -webkit-box-sizing: border-box; box-sizing: border-box; padding-left: 13px; position: relative;}
.section_03 .portfolioSlide .content .name:before {content: ''; position: absolute; width: 1px; height: 13px; background-color: #b2b2b2; left: 0; top: 14px;}

.section_03 .portfolioMainWrap .titleWrap a:hover {box-shadow: 2px 2px 10px rgba(0,0,0,0.5);}


.section_03 .portfolioSlide .swiper-slide {opacity: 0 !important;}
.section_03 .portfolioSlide .swiper-slide.swiper-slide-active {opacity: 1 !important;}


.section_03 .section_03_c03 .portfolioMainWrap .bg {position: absolute; z-index: 1;}
.section_03 .section_03_c03 .portfolioMainWrap .bg01 {top: 190px; left: 30px;}
.section_03 .section_03_c03 .portfolioMainWrap .bg02 {bottom: 95px; left: 64px;}
.section_03 .section_03_c03 .portfolioMainWrap .bg03 {bottom: 28px; left: 280px;}
.section_03 .section_03_c03 .portfolioMainWrap .bg04 {top: 10px; left: 648px;}
.section_03 .section_03_c03 .portfolioMainWrap .bg05 {top: -20px; left: 696px;}

.section_03 .portfolioSlideWrap .portfolioSlide01 .content {top: -100%; }
.section_03 .portfolioSlideWrap .portfolioSlide01 .content.on {animation: portfolioSlide01 0.8s ease-out forwards;}
.section_03 .portfolioSlideWrap .portfolioSlide02 .content {bottom: -100%;}
.section_03 .portfolioSlideWrap .portfolioSlide02 .content.on {animation: portfolioSlide02 0.8s ease-out 0.4s forwards;}
.section_03 .portfolioSlideWrap .portfolioSlide03 .content {top: -100%;}
.section_03 .portfolioSlideWrap .portfolioSlide03 .content.on {animation: portfolioSlide03 0.8s ease-out 0.6s forwards;}
.section_03 .portfolioSlideWrap .portfolioSlide04 .content {right: -100%;}
.section_03 .portfolioSlideWrap .portfolioSlide04 .content.on {animation: portfolioSlide04 0.8s ease-out 0.8s forwards;}
.section_03 .portfolioSlideWrap .portfolioSlide05 .content {right: -100%;}
.section_03 .portfolioSlideWrap .portfolioSlide05 .content.on {animation: portfolioSlide05 0.8s ease-out 1s forwards;}
.section_03 .portfolioMainWrap .portfolioSlideWrap-pagination {position: absolute; bottom: 0; right: -70px; z-index: 10; width: 26px;}
.section_03 .portfolioMainWrap .portfolioSlideWrap-pagination span {font-weight: bold;text-align: center; width: 26px; position: relative;font-family: 'Sunflower', sans-serif; display: block; font-size: 14px; color: #999; padding: 6px 0; width: auto !important; height: auto !important; border-radius: 0; opacity: 1;}
.section_03 .portfolioMainWrap .portfolioSlideWrap-pagination span:before {transition: all 0.2s; content: '';position: absolute; bottom: 0; right:0; display: block; width: 26px; width: 100%; height: 1px; background-color: #999;}
.section_03 .portfolioMainWrap .portfolioSlideWrap-pagination span.swiper-pagination-bullet {background-color: transparent;}
.section_03 .portfolioMainWrap .portfolioSlideWrap-pagination span.swiper-pagination-bullet:focus {outline: 0;} 
.section_03 .portfolioMainWrap .portfolioSlideWrap-pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active {background-color: transparent; color: #222;}
.section_03 .portfolioMainWrap .portfolioSlideWrap-pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active:before {background-color: #222; color: #222; width: 50px; }

@keyframes portfolioSlide01 {
	0% {
		top: -100%;
		opacity:0;
	}
	100% {
		top: 0;
		opacity:1;
	}
}
@keyframes portfolioSlide02 {
	0% {
		bottom: -100%;
		opacity:0;
	}
	100% {
		bottom: 0;
		opacity:1;
	}
}
@keyframes portfolioSlide03 {
	0% {
		top: -100%;
		opacity:0;
	}
	100% {
		top: 0;
		opacity:1;
	}
}
@keyframes portfolioSlide04 {
	0% {
		right: -100%;
		opacity:0;
	}
	100% {
		right: 0;
		opacity:1;
	}
}
@keyframes portfolioSlide05 {
	0% {
		right: -100%;
		opacity:0;
	}
	100% {
		right: 0;
		opacity:1;
	}
}


/* 학원소개 스와이프 */
.sw-company-area{float: left; width: 620px; padding-top: 90px;}
.sw-company > .swiper-wrapper{text-align:left;}
.sw-company > .swiper-slide{width: 620px !important}
.sw-company > .swiper-container{height: 348px}
.sw-company > .swiper-pagination > .swiper-pagination-bullet{width: 10px; height: 10px; display: inline-block; border-radius: 100%; background: #6b6e7d; opacity: 1; vertical-align: middle;}
.sw-company > .swiper-pagination > .swiper-pagination-bullet-active{background: none; border: 2px solid #6460d9; }
.sw-company-sp-position{top : 25px !important;text-align: right; width: 97% !important;}

/* 커리큘럼 */
.section_04:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.section_04 > .contens-area > .title-area{text-align: center;}
.section_04 > .contens-area > .title-area:before{content:"/"; display: block; color:#5960d4; font-size: 28px; position: relative; line-height: 14px;}
.section_04 > .contens-area > .title-area > .c-title > .en{letter-spacing: -0.3px;}
.section_04 .c-title{font-size: 38px; color: #333333; letter-spacing: -3.2px; font-weight: bold; padding-top: 22px; line-height: 42px;}
.section_04 .c-title .sttile{font-weight: 100}
.section_04 .s-title{font-size: 16px; color: #666666; padding-top: 19px; letter-spacing:-1.2px;}
.section_04 .s-title > .en{letter-spacing: 0px;}
.step-curri{padding-top: 40px}
.step-curri li{float: left; margin-right: 44px; width: 22%; box-sizing: border-box;}
.step-curri li:last-child{margin-right:0px}
.step-curri:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.curri_list{}
.curri_list > li{display: block; width: 100%; margin-top: 13px; letter-spacing:0;}
.curri_list > li a{padding: 13px 0px; background-color: #eaeaea; text-align: left; color: #333; font-size: 16px; text-indent: 21px; display:block; position: relative;}
.curri_list > li a:hover{background-color: #858df3; color: #fff;}
.curri_list > li a:hover:after{background: url(/images/btn_line_02.png) no-repeat 0 0; width: 44px; height: 7px; position: absolute; content: ""; top: 18px; right: 15px;}


.section_04 .realReviewTitle {float: left;}
.section_04 .realReviewTitle .realReviewTitleImg {position: relative;}
.section_04 .realReviewTitle .realReviewTitleImg > div {position: absolute; top: 92px; left: 30px;}
.section_04 .realReviewTitle .realReviewTitleImg > div .bTxt { font-size: 40px; color: #000; font-weight: bold; white-space: nowrap; line-height: 1.1; padding-top: 4px;}
.section_04 .realReviewTitle .realReviewTitleImg > div .smTxt {font-size: 26px; color: #000; font-weight: 400; white-space: nowrap; line-height: 1.3; letter-spacing: -1px;}
.section_04 .realReviewTitle img {position: absolute; top: 11px; left: -40px;}
.section_04 .realReviewTitle .txt {box-sizing: border-box; padding: 0 28px; margin-top: 300px; position: relative; z-index: 10;}
.section_04 .realReviewTitle .txt p a {font-size: 16px; color: #fff; display: block;}

.section_04 {background-color: #01e399;}
.section_04 .realReviewWrap {width: 816px; float: right; position: relative;}
.section_04 .realReviewWrap:before, .section_04 .realReviewWrap:after {content: ''; display: block; width: 272px; height: 100%; position: absolute; top: 0; background-color: #02d48f;}
.section_04 .realReviewWrap:before {left: 0;}
.section_04 .realReviewWrap:after {right: 0;}
.section_04 .realReview {}
.section_04 .realReviewWrap .realReviewBox {float: left; width: 272px; padding: 60px 0 68px; height: 465px; -webkit-box-sizing: border-box; box-sizing: border-box;}
/*.section_04 .realReviewWrap .realReviewBox:nth-child(2n) {background-color: #02d48f;}
.section_04 .realReviewWrap .realReviewBox:nth-child(2n-1) {background-color: #01e399;}*/
.section_04 .realReviewWrap .realReviewBox h3 span {display: inline-block; padding: 6px 12px 7px 30px; background-color: #00ab73; font-size: 14px; color: #fff;}
.section_04 .realReviewWrap .realReviewBox .txtWrap {box-sizing: border-box; padding: 0 20px 0 30px;}
.section_04 .realReviewWrap .realReviewBox h4 {margin: 8px 0 11px; height:2.4em;line-height:1.2;overflow:hidden;text-overflow:ellipsis;text-align:left;word-wrap:break-word; display: -webkit-box;-webkit-line-clamp:2;-webkit-box-orient: vertical;word-break: keep-all;}
.section_04 .realReviewWrap .realReviewBox .thumb {margin-bottom: 10px;}
.section_04 .realReviewWrap .realReviewBox .thumb span {display: inline-block; width: 100px; height: 100px; background-size: cover; border-radius: 100%; }
.section_04 .realReviewWrap .realReviewBox .name {margin-bottom: 13px; font-size: 16px; }
.section_04 .realReviewWrap .realReviewBox  .title {font-size: 15px; color: #222;height:5.2em;line-height:1.3;overflow:hidden;text-overflow:ellipsis;text-align:left;word-wrap:break-word; display: -webkit-box;-webkit-line-clamp:4;-webkit-box-orient: vertical;word-break: keep-all;}

.section_04 .realReviewWrap .realReview-button {position: absolute; bottom: 0; width: 45px; height: 45px; z-index: 10; cursor: pointer;}
.section_04 .realReviewWrap .realReview-button-prev {background-image: url(/images/main/realReview-button-prev.jpg); left:-90px;}
.section_04 .realReviewWrap .realReview-button-next {background-image: url(/images/main/realReview-button-next.jpg); left: -45px;}

/*section_05*/

.section_05 {padding: 64px 0 50px;}
.section_05 .section_05_left {width: 550px; float: left;}
.section_05 .section_05_left h2 {background: url(/images/main/section_05_title01.png) right center no-repeat; font-size: 25px; letter-spacing: -1px; margin-bottom: 18px;}
.section_05 .section_05_left h2 strong {font-family: 'Sunflower', sans-serif; font-size:40px; color: #303cc3; font-weight: bold; padding-right: 5px; letter-spacing: 0;}
.section_05 .section_05_left .section_05_leftContBox {width: 260px; position: relative; float: left;}
.section_05 .section_05_left .section_05_leftContBox:before{background: url(/img/btn_play.png)no-repeat center center; background-size: cover; content: ''; display: block; width: 52px; height: 52px; position: absolute; z-index: 9; left: 50%; margin-left: -28px; top: 49px;}
.section_05 .section_05_left .section_05_leftContBox:not(:last-child) {margin-right: 30px;}
.section_05 .section_05_leftContBox .imgBox {width: 260px; height: 170px; overflow: hidden;}
.section_05 .section_05_leftContBox .txtBox {width: 240px; height: 160px; background-color: #fff; margin-top: -34px;}
.section_05 .section_05_leftContBox .txtBox h3 {padding: 18px 0 18px; font-size:17px; box-sizing: border-box;max-width: 100%;overflow: hidden;white-space: nowrap;-o-text-overflow: ellipsis;text-overflow: ellipsis;}
.section_05 .section_05_leftContBox .txtBox .txt {font-size:15px; color: #333; margin-bottom: 14px;line-height: 1.2;  display:block; max-height:3.6em;overflow:hidden; 
text-overflow:ellipsis;word-wrap:break-word; display: -webkit-box;-webkit-line-clamp:3; -webkit-box-orient: vertical; margin-bottom: 8px; word-break: keep-all;}
.section_05 .section_05_leftContBox .txtBox span {font-family: 'Sunflower', sans-serif; font-size: 15px; color: #999;}
.section_05 .section_05_right {width: 500px; float: right; background: url(/images/main/section_05_title02.png) right top 19px no-repeat; position: relative;}
.section_05 .section_05_right h2 {margin-bottom: 13px;}
.section_05 .section_05_right strong {font-family: 'Sunflower', sans-serif; font-size:40px;font-weight: bold; display: inline-block; padding-right: 13px; background-color: #fff;}
.section_05 .section_05_right .title {width: 154px; height: 178px; background: url(/images/main/section_05_title_bg.png) right bottom 10px no-repeat;}
.section_05 .section_05_right .title p {font-size: 14px; color: #666666; font-weight: 400; margin-bottom: 17px; line-height: 1.4;}
.section_05 .section_05_right .title a {transition: all 0.3s;display: inline-block; padding: 6px 14px 8px; border: 1px solid #222; background-color: #fff; font-size: 14px; color: #222;}
.section_05 .section_05_right .title img {padding: 4px 0 0 10px; display: inline-block;}
.section_05 .section_05_right .sectionCom {transition: all 0.3s;}
.section_05 .section_05_right .sectionCom span {display: block; text-align: center; font-size: 16px; font-weight: bold; color: #000; padding-bottom: 6px; font-size: 16px;}
.section_05 .section_05_right .sectionCom > p { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); left: 0;}
.section_05 .section_05_right .section1 {width: 114px; height: 114px; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #fff; position: absolute;top: 50px; left: 170px;border: 1px solid #ebebeb; border-radius: 100%; }
.section_05 .section_05_right .section1 p {width: 100%; position: absolute; text-align: center; font-size: 15px; color: #3b4360; word-break: keep-all; line-height: 1.2; }
.section_05 .section_05_right .section2 {width: 130px; height: 130px; border-radius: 100%; background-color: #e8f0fa; border: 1px solid #e8f0fa; position: absolute; top: 50px; left: 310px; -webkit-box-sizing: border-box; box-sizing: border-box;}
.section_05 .section_05_right .section2 p {width: 100%; text-align:center; line-height: 1.2; position: absolute; color: #222; font-size: 15px;}
.section_05 .section_05_right .section3 {width: 150px; height: 150px; border-radius: 100%; background-color: #dee0f8; border: 1px solid #dee0f8; text-align:center;position: absolute; top: 148px; left: 185px;-webkit-box-sizing: border-box; box-sizing: border-box;}
.section_05 .section_05_right .section3 p {width: 100%;text-align:center; line-height: 1.2; position: absolute;color: #222; font-size: 17px; -webkit-box-sizing: border-box; box-sizing: border-box;}
.section_05 .section_05_right .section3 p span {font-size: 18px;}
.section_05 .section_05_right .section4 {width: 150px; height: 150px; border-radius: 100%; background-color: #fff; border: 1px solid #3b4360;   position: absolute; top: 160px; left: 352px; -webkit-box-sizing: border-box; box-sizing: border-box;}
.section_05 .section_05_right .section4 p {width: 100%; text-align:center; word-break: keep-all; line-height: 1.2; position: absolute; color: #3b4360; font-size: 15px;}



/* 커리큘럼 스와이프 */
.sw-curri_list{height: 158px; padding-top: 75px;}
.sp-position{bottom: 175px !important; text-align: right;}
.sp-position > .swiper-pagination-bullet{
width: 10px;
height: 10px;
vertical-align: middle;
}
.sp-position > .swiper-pagination-bullet-active{
background: #fff;
border: 2px solid #5e64d5;
}
.sp-position > .swiper-slide > p{color: #fff; font-size: 18px; font-weight: bold;}


.snip1361 {
letter-spacing:0;
position: relative;
overflow: hidden;
min-width: 243px;
max-width: 158px;
width: 100%;
color: #141414;
text-align: left;
font-size: 16px;
}
.snip1361 * {
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all 0.35s ease;
transition: all 0.35s ease;
}
.snip1361 img {
max-width: 100%;
vertical-align: top;
}
.snip1361 figcaption {
position: absolute;
top: calc(50%);
width: 100%;
padding: 40px 20px;
}

.snip1361 h3,
.snip1361 p {
margin: 0 0 15px;
}
.snip1361 h3 {
font-weight: bold;
font-size: 18px;
line-height: 1.2em;
color:#fff;
}
.snip1361 p {
font-size: 13px;
letter-spacing: -1px;
color:#d5d5d5;
position: relative;
}
.snip1361 p:after{
background: url(/images/btn_line_02.png) no-repeat 0 0;
width: 44px;
height: 7px;
display: inline-block;
content: "";
position: absolute;
bottom: 0px;
right: 0px;
}

.snip1361 a {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 2;
}
.snip1361:hover figcaption,
.snip1361.hover figcaption {
top: 0px;
background-color: rgba(13, 15, 41, 0.8);
}

/* 교육환경 */
.section_06{ position: relative; margin-bottom: 60px;}
.section_06:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.section_06 .title-area{text-align: left; position: absolute; top: 45px; left: 50%; margin-left: -552px; width: 20%; padding-left: 48px;}
.section_06 .title-area > .c-title > .en{letter-spacing: -0.3px;}
.section_06 .c-title{font-size: 38px; color: #333333; letter-spacing: -3.2px; font-weight: bold; padding-top: 22px; line-height: 42px;}
.section_06 .c-title .sttile{font-weight: 100}
.section_06 .s-title{font-size: 14px; color: #535c6c; padding-top: 14px; line-height: 1.3;}
.section_06 .s-title > .en{letter-spacing: 0px;}


.section_06 .swiper-pagination_sw-facility {
position: absolute;
top: 230px;
left: -360px;
width: 327px;
z-index: 9;
}

.section_06 .sw-facility_boxWrap {float: left; position: relative; vertical-align: middle; margin-top: 1px; width: 108px; height: 108px; background-color: #dcdde6; text-align: center; line-height: 107px; color: #fff; border-radius: 0; opacity: 1; border: 0; position: relative;}
.section_06 .sw-facility_boxWrap .bg {position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: rgba(0,0,0,0.5);}
.section_06 .sw-facility_boxWrap:not(:nth-child(3n)) {margin-right: 1px;}
.section_06 .swiper-pagination_sw-facility .swiper-pagination-bullet-active .bg {background-color: rgba(48, 60, 195, 0.9);}
.section_06 .swiper-pagination_sw-facility .swiper-pagination-bullet span {position: absolute; z-index: 1; width: 100%; text-align: center; top: 0 ;left: 0;}

.section_06 .sw-facility .swiper-slide {width: 700px; opacity:0.4; }
.section_06 .sw-facility .swiper-slide-active {opacity: 1 !important;}
.section_06 .sw-facility .swiper-slide-active > img{opacity:1 !important} 
.section_06 .sw-facility .swiper-slide > img{opacity:0.4; width: 100%;}

.section_06 .facility-area{width: 58%; position:relative; top: 45px; float:right;}
.section_06 .facility-info{width: 65%; background:#f8f8f8; position: relative; top: -67px; padding: 25px 0px; display: none;}
.section_06 .facility-info > h4{font-size: 18px; color: #333; padding-bottom: 10px}
.section_06 .facility-info > p{font-size: 13px; color: #666; line-height: 20px;}
.section_06 .facility-info > .swiper-wrapper > .swiper-slide-active > .facility-info{display: block !important;}


.section_06 .sw-facility-thumbs-area{width: 500px;}
.section_06 .sw-facility-thumbs {height: 20%; box-sizing: border-box; padding: 10px 0;}
.section_06 .sw-facility-thumbs .swiper-slide {height: 100%; color:#999999;}
.section_06 .sw-facility-thumbs .swiper-slide-thumb-active {opacity: 1; color:#5960d4;}

.section_06 .sw-facility{height: 450px}
.section_06 .sw-facility > .swiper-button-next{background-image:url(/images/main/btn_mainSlider_next.png); width: 39px; height: 65px; background-size: 100%; top: 50%; right: auto; left: 650px; -webkit-transform: translateY(-50%); transform: translateY(-50%); margin-top: 0;}
.section_06 .sw-facility > .swiper-button-prev{background-image:url(/images/main/btn_mainSlider_prev.png); width: 39px; height: 65px; background-size: 100%; top: 50%; left: 20px; -webkit-transform: translateY(-50%); transform: translateY(-50%); margin-top: 0;}
.section_06  .facility-area:after{content:".";display:block;height:0;clear:both;visibility:hidden;}

.section_06 .section_06_title {position: absolute;  top: 38px; left: 50%; margin-left: -664px; z-index: 10; transform: rotate(-90deg);}
.section_06 .section_06_title p {font-size: 11px; color: #888fdd; font-weight: 300; text-transform: uppercase; margin-bottom : 8px; text-indent: 1px;}
.section_06 .section_06_title span { display: block; width: 183px; height: 44px; background-color: #6e76d5;}