@charset "UTF-8";
@import url(//fonts.googleapis.com/earlyaccess/nanummyeongjo.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

@font-face {/* 占싸뀐옙占쏙옙.. */
 font-family: 'Noto';
 
 src: url('./fonts/NotosansCJK/NotoSansCJKkr-Black.eot');
 src: url('./fonts/NotosansCJK/NotoSansCJKkr-Black.eot') format('embedded-opentype'),
 url('./fonts/NotosansCJK/NotoSansCJKkr-Black.woff') format('woff');
}
@font-face {
 font-family: 'NotoB';
 
 src: url('./fonts/NotosansCJK/NotoSansCJKkr-Bold.eot');
 src: url('./fonts/NotosansCJK/NotoSansCJKkr-Bold.eot') format('embedded-opentype'),
 url('./fonts/NotosansCJK/NotoSansCJKkr-Bold.woff') format('woff');
}
@font-face {
 font-family: 'NotoR';
 
 src: url('./fonts/NotosansCJK/NotoSansCJKkr-Regular.eot');
 src: url('./fonts/NotosansCJK/NotoSansCJKkr-Regular.eot') format('embedded-opentype'),
 url('./fonts/NotosansCJK/NotoSansCJKkr-Regular.woff') format('woff');
}
@font-face {
 font-family: 'NotoL';
 
 src: url('./fonts/NotosansCJK/NotoSansCJKkr-Light.eot');
 src: url('./fonts/NotosansCJK/NotoSansCJKkr-Light.eot') format('embedded-opentype'),
 url('./fonts/NotosansCJK/NotoSansCJKkr-Light.woff') format('woff');
}
@font-face {
 font-family: 'NotoDL';
  font-style: 700;
 font-weight:700;
 src: url('./fonts/NotosansCJK/NotoSansCJKkr-DemiLight.eot');
 src: url('./fonts/NotosansCJK/NotoSansCJKkr-DemiLight.eot') format('embedded-opentype'),
 url('./fonts/NotosansCJK/NotoSansCJKkr-DemiLight.woff') format('woff');
}
@font-face {
 font-family: 'Noto Serif';
  font-style: 700;
 font-weight:700;
 src: url('./fonts/NotoSerifCJKkr-Regular.otf');
 src: url('./fonts/NotoSerifCJKkr-Regular.otf') format('embedded-opentype'),
 url('./fonts/NotoSerifCJKkr-Regular.otf') format('woff');
}


/*SCROLL TYPE*/
html::-webkit-scrollbar-track , .modal_container::-webkit-scrollbar-track,.inner.modalscrab1 .modalscrab_wrap .scrab_no1 > ul::-webkit-scrollbar-track {/*  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 	 */  background-color: rgba(0,0,0,.1); border-radius:10px; margin-top:5px; margin-bottom:0px; }
html::-webkit-scrollbar , .modal_container::-webkit-scrollbar , .inner.modalscrab1 .modalscrab_wrap .scrab_no1 > ul::-webkit-scrollbar{ width: 5px;  background-color: #fff;margin-top:20px; margin-bottom:20px;}
html::-webkit-scrollbar-thumb , .modal_container::-webkit-scrollbar-thumb , .inner.modalscrab1 .modalscrab_wrap .scrab_no1 > ul::-webkit-scrollbar-thumb{ background-color: #717171; border-radius:10px; margin-top:20px; margin-bottom:20px;}
body::-webkit-scrollbar-track , .modal_container::-webkit-scrollbar-track,.inner.modalscrab1 .modalscrab_wrap .scrab_no1 > ul::-webkit-scrollbar-track {/*  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 	 */  background-color: rgba(0,0,0,.1); border-radius:10px; margin-top:5px; margin-bottom:0px; }
body::-webkit-scrollbar , .modal_container::-webkit-scrollbar , .inner.modalscrab1 .modalscrab_wrap .scrab_no1 > ul::-webkit-scrollbar{ width: 5px;  background-color: #fff;margin-top:20px; margin-bottom:20px;}
body::-webkit-scrollbar-thumb , .modal_container::-webkit-scrollbar-thumb , .inner.modalscrab1 .modalscrab_wrap .scrab_no1 > ul::-webkit-scrollbar-thumb{ background-color: #717171; border-radius:10px; margin-top:20px; margin-bottom:20px;}

@-webkit-keyframes sc1 {
    0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; }
}
@keyframes sc1 {
    0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; }
}
@-webkit-keyframes sc2 {
    0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; }
}
@keyframes sc2 {
    0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; }
}

[data-nav="on"] { animation: nav .35s ease-out .35s forwards; }
[data-nav="off"] { display: none; }
@-webkit-keyframes nav {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes nav {
    from { opacity: 0; }
    to { opacity: 1; }
}
[data-an="fade-up"]{
    opacity: 0;
    -webkit-transform: translateY(100px);
    -ms-transform: translateY(100px);
    transform: translateY(100px);
    -webkit-transition: ease-in-out 1s;
    -o-transition: ease-in-out 1s;
    transition: ease-in-out 1s;
}
[data-fade="in"] [data-an="fade-up"]{
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}
[data-an-order="1"]{
    -webkit-transition-delay: .4s;
    -o-transition-delay: .4s;
    transition-delay: .4s;
}
[data-an-order="2"]{
    -webkit-transition-delay: .55s;
    -o-transition-delay: .55s;
    transition-delay: .55s;
}
[data-an-order="3"]{
    -webkit-transition-delay: .7s;
    -o-transition-delay: .7s;
    transition-delay: .7s;
}
[data-an-order="4"]{
    -webkit-transition-delay: .85s;
    -o-transition-delay: .85s;
    transition-delay: .85s;
}
[data-an-order="5"]{
    -webkit-transition-delay: 1s;
    -o-transition-delay: 1s;
    transition-delay: 1s;
}
[data-an-order="6"]{
    -webkit-transition-delay: 1.15s;
    -o-transition-delay: 1.15s;
    transition-delay: 1.15s;
}
[data-section="1"] .fade-contents { margin-top: -80px; }

.header-wrap{width: 100%; height: 100px; overflow: hidden; background-color: rgba(0, 0, 0, 0.8); z-index: 20; position: fixed; top: 0; left: 0; transition: 0.4s;}
.header-wrap:hover{height: 420px; transition: 0.4s;}
.header-wrap .top-menu-wrap{width: 100%; height: 100px; position: absolute; top: 0; background-color: #ffffff; }
.header-wrap .top-menu-wrap .head-logo{display: block; left: 130px; top: 21px; position: absolute;}
.header-wrap .top-menu-wrap .head-logo img{display: block;}
.header-wrap .top-menu-wrap .top-menu-ul{text-align: center; height: 100px; position: absolute; top: 0; left: 50%; transform: translateX(-50%);}
.header-wrap .top-menu-wrap .top-menu-ul .top-menu-li{display: inline-block;}
.header-wrap .top-menu-wrap .top-menu-ul .top-menu-li:after{width: 4px; height: 4px; border-radius: 50%; content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); background-color: #636363;}
.header-wrap .top-menu-wrap .top-menu-ul .top-menu-li:last-child:after{display: none;}
.header-wrap .top-menu-wrap .top-menu-ul .top-menu-li .top-menu-a{padding-left: 50px; padding-right: 50px; line-height: 100px; color: #636363; font-family: 'NotoB', sans-serif; font-size: 15px; text-align: center; transition: 0.4s; display: block;} 
.header-wrap .top-menu-wrap .top-menu-ul .top-menu-li .top-menu-a:hover{color: #c69c6d; transition: 0.4s;}
.header-wrap .top-menu-wrap .top-menu-ul .top-menu-li .top-menu-sub-ul{width: 100%; position: absolute; top: 100px;}
.header-wrap .top-menu-wrap .top-menu-ul .top-menu-li .top-menu-sub-ul .top-menu-sub-li{margin-top: 20px; width: 100%; }
.header-wrap .top-menu-wrap .top-menu-ul .top-menu-li .top-menu-sub-ul .top-menu-sub-li .top-menu-sub-a{width: 100%; height: 30px; line-height: 30px; text-align: center; color: #ffffff; font-family: 'NotoR', sans-serif; font-size: 15px; display: block; transition: 0.4s;}
.header-wrap .top-menu-wrap .top-menu-ul .top-menu-li .top-menu-sub-ul .top-menu-sub-li .top-menu-sub-a:hover{color: #c69c6d; transition: 0.4s;}
.header-color{color: #c69c6d !important;}

.section1{width: 100%; padding-top: 46.87%; z-index: 1; overflow: hidden;}
.section1 .section1-wrap{width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.section1 .section1-wrap .section1-ul{width: 100%; height: 100%;}
.section1 .section1-wrap .section1-ul .section1-li{float: left; width: 25%; height: 100%; transition: 0.4s;}
.section1 .section1-wrap .section1-ul .section1-li .section1-list-wrap{width: 100%; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: auto 100%;}
.section1 .section1-wrap .section1-ul .section1-li .section1-list-wrap .section1-content-wrap{width: 100%; height: 100%;}
.section1 .section1-wrap .section1-ul .section1-li .section1-list-wrap .section1-content-underbar{width: 100%; height: 15px; position: absolute; bottom: 0; left: 0;}
.section1 .section1-wrap .section1-ul .section1-li .section1-list-wrap .section1-content-wrap .section1-content-div{width: 100%; transform: translateY(-50%); top: 50%; height: 252px;}
.section1 .section1-wrap .section1-ul .section1-li .section1-list-wrap .section1-content-wrap .section1-content-div:after{content: ''; width: 50px; height: 3px; background-color: #ffffff; position: absolute; top: 0; left: 50%; transform: translateX(-50%); transition: 0.4s;}
.section1 .section1-wrap .section1-ul .section1-li .section1-list-wrap .section1-content-wrap .section1-content-div:before{content: ''; width: 50px; height: 3px; background-color: #ffffff; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); transition: 0.4s;}
.section1 .section1-wrap .section1-ul .section1-li:hover .section1-list-wrap .section1-content-wrap .section1-content-div:after{ width: 90%; transition: 0.4s;}
.section1 .section1-wrap .section1-ul .section1-li:hover .section1-list-wrap .section1-content-wrap .section1-content-div:before{ width: 90%; transition: 0.4s;}
.section1 .section1-wrap .section1-ul .section1-li:hover .section1-list-wrap .section1-content-wrap .section1-content-div .section1-content-1{width: 0; transition: 0.2s;}
.section1 .section1-wrap .section1-ul .section1-li .section1-list-wrap .section1-content-wrap .section1-content-div .section1-content-1{overflow: hidden; width: 100%; height: 100%;  transition: 0.2s; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.section1 .section1-wrap .section1-ul .section1-li .section1-list-wrap .section1-content-wrap .section1-content-div .section1-content-1 img{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.section1 .section1-wrap .section1-ul .section1-li .section1-list-wrap .section1-content-wrap .section1-content-div .section1-content-2{ transition: 0.4s; width: 0%; height: 100%; overflow: hidden; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.section1 .section1-wrap .section1-ul .section1-li .section1-list-wrap .section1-content-wrap .section1-content-div .section1-content-2 .section1-content-text1{width: 450px; position: absolute; top: 35px; text-align: center; left: 50%; transform: translateX(-50%); color: #ffffff; font-family: 'Nanum Myeongjo', sans-serif; font-size: 28px; letter-spacing: 24px; font-weight: 600;}
.section1 .section1-wrap .section1-ul .section1-li .section1-list-wrap .section1-content-wrap .section1-content-div .section1-content-2 .section1-content-text2{width: 450px; position: absolute; bottom: 35px; text-align: center; left: 50%; transform: translateX(-50%); color: #ffffff; font-family: 'Nanum Myeongjo', serif; font-size: 21px; letter-spacing: -2px; line-height: 1.6;}
.section1 .section1-wrap .section1-ul .section1-li:hover .section1-list-wrap .section1-content-wrap .section1-content-div .section1-content-2{width: 100%; transition: 0.4s;}

.section2{width: 100%; height: 676px; z-index: 3; text-align: center;}
.section2 .section2-title{position: absolute; top: 90px; left: 50%; transform: translateX(-50%); display: block;}
.section2 .section2-content{position: absolute; top: 200px; left: 50%; transform: translateX(-50%); width: 1200px; height: 580px; background-color: #f0e9e6;}
.section2 .section2-content .section2-content-left{position: absolute; left: 0; top: 0; width: 600px; height: 580px; background-image: url('../images/main/section2_content_left.jpg'); background-size: 100%; background-position: center center; background-repeat: no-repeat;}
.section2 .section2-content .section2-content-left .section2-left-text1{position: absolute; top: 60px; left: 40px; display: block; font-family: 'Nanum Myeongjo', sans-serif; color: #ffffff; font-size: 32px; line-height: 1.3; text-align: left; font-weight: 600;}
.section2 .section2-content .section2-content-left .section2-left-text2{position: absolute; bottom: 90px; left: 45px; display: block; font-family: 'Nanum Gothic', sans-serif; color: #ffffff; font-size: 19px; line-height: 1.4; text-align: left; font-weight: 500;}
.section2 .section2-content .section2-content-right{position: absolute; right: 0; top: 0; width: 600px; height: 580px;}
.section2 .section2-content .section2-content-right .right-content{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}

.section3{width: 100%; height: 600px; z-index: 1; background-image: url('../images/main/section3_back.jpg'); background-position: center center; background-repeat: no-repeat; background-size: auto 100%;}
.section3 .section3-text{position: absolute; display: block; left: 50%; transform: translateX(-50%); bottom: 10%;}

.section4{width: 100%; padding-top: 85px; padding-bottom: 105px;}
.section4 .section4-title{margin: 0 auto; display: block;}
.section4 .section4-program-wrap{width: 1200px; margin: 0 auto; margin-top: 72px; height: 640px;}
.section4 .section4-program-wrap .program1{width: 280px; height: 640px; float: left; display: block;}
.section4 .section4-program-wrap .program1 img{width: 100%; display: block;}
.section4 .section4-program-wrap .program{width: 400px; height: 320px; float: left; display: block;}
.section4 .section4-program-wrap .program img{width: 100%; display: block;}




.footer-wrap{width: 100%; height: 133px; background-color: #252525;}
.footer-wrap .footer-div{width: 1300px; height: 133px; margin: 0 auto;}
.footer-wrap .footer-div .footer-info{position: absolute; left: 0; top: 50%; transform: translateY(-50%);}

.content-top-wrap{width: 100%; height: 240px; background-position: center center; background-repeat: no-repeat; background-size: auto 100%;}
.content-top-wrap .content-top-title{width: 100%; display: block; position: absolute; text-align: center; top: 82px; font-size: 50px; color: #ffffff; font-family: 'NotoB', sans-serif;}
.content-top-wrap .content-top-ul{position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 1040px;}
.content-top-wrap .content-top-ul .content-top-li{display: block; border-right: 1px solid rgba(255, 255, 255, 0.7); background-color: rgba(0, 0, 0, 0.5); width: 260px; height: 45px; float: left;}
.content-top-wrap .content-top-ul .content-top-li:last-child{border-right: none;}
.content-top-wrap .content-top-ul .content-top-li .content-top-a{display: block; width: 260px; height: 45px; line-height: 45px; text-align: center; color: #ffffff; font-family: 'NotoR', sans-serif;}

.content-top-wrap .curriculum-top-ul{position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 1248px;}
.content-top-wrap .curriculum-top-ul .curriculum-top-li{display: block; border-right: 1px solid rgba(255, 255, 255, 0.7); background-color: rgba(0, 0, 0, 0.5); width: 208px; height: 45px; float: left;}
.content-top-wrap .curriculum-top-ul .curriculum-top-li:last-child{border-right: none;}
.content-top-wrap .curriculum-top-ul .curriculum-top-li .curriculum-top-a{display: block; width: 208px; height: 45px; line-height: 45px; text-align: center; color: #ffffff; font-family: 'NotoR', sans-serif;}


.ceo-content{width: 100%; padding-top: 92px; padding-bottom: 86px; text-align: center;}
.ceo-content .ceo-img{margin: 0 auto; display: block;}

.facility-content{width: 100%; padding-top: 63px; padding-bottom: 80px; text-align: center;}
.content-sub-title{width: 100%; text-align: center; font-size: 16px; font-family: 'NotoL', sans-serif; letter-spacing: 16px; color: #363636; display: block; line-height: 2;}
.content-main-title{width: 100%; text-align: center; font-size: 40px; font-family: 'NotoB', sans-serif; color: #363636; letter-spacing: -0.8px; display: block; line-height: 1.25;}
.facility-content-div{width: 1000px; position: relative; margin: 0 auto; margin-top: 60px;}
.facility-img{width: 100%;}
.facility-info-div{width: 365px; height: 100%; background-color: rgba(49, 47, 58, 0.9); padding-top: 140px; padding-left: 37px; text-align: left; padding-right: 37px; position: absolute; top: 0; right: 0;}
.facility-info-title1{width: 100%; font-size: 20px; color: white; position: relative; display: block;  margin-bottom: 10px; font-family :'NotoR',sans-serif; letter-spacing: -2px;}
.facility-info-title2{width: 100%; font-size: 50px; color: #e9b670; font-weight: bold; position: relative; display: block; font-family :'NotoR',sans-serif;}
.facility-info-line{display: block; position: relative; margin-bottom: 34px; margin-top: 45px;}
.facility-info-content{width: 100%; font-size: 20px; color: white; position: relative; display: block; font-family :'NotoR',sans-serif; line-height: 28px;}

.location-content{width: 100%; padding-top: 50px; padding-bottom: 150px;}
.location-content-wrap{width: 1200px; margin: 0 auto; margin-top: 65px;}

.instructor-content{padding-top: 82px; padding-bottom: 350px;}
.instructor-content .instructor-content-wrap{width: 1200px; margin: 0 auto;}
.instructor-content .instructor-content-wrap .instuctor-title1{width: 100%; display: block; text-align: center; font-family: 'NotoB', sans-serif; font-size: 40px; color: #3c4153;}
.instructor-content .instructor-content-wrap .instuctor-title2{width: 100%; display: block; text-align: center; font-family: 'NotoR', sans-serif; font-size: 20px; color: #848484; margin-top: 20px; line-height: 1.33;}

.instructor-img{width: 100%; margin-top: 63px; display: block;}

.curriculum-wrap{width: 1200px; margin: 0 auto;}
.curriculum-wrap img{width: 100%; display: block;}


.gallery-content{width: 100%; padding-top: 80px; padding-bottom: 150px;}
.gallery-content .gallery-wrap{width: 1200px; margin: 0 auto; margin-top: 60px;}
.gallery-content .gallery-wrap .gallery-ul{width: 100%; list-style: none;}
.gallery-content .gallery-wrap .gallery-ul .gallery-li{width: 380px; float: left; margin-right: 30px;}
.gallery-content .gallery-wrap .gallery-ul .gallery-li:nth-child(3n){margin-right: 0px;}
.gallery-content .gallery-wrap .gallery-ul .gallery-li .gallery-div{width: 100%; margin-bottom: 50px;}
.gallery-content .gallery-wrap .gallery-ul .gallery-li .gallery-div .gallery-thumb{width: 380px; height: 220px; display: block;}
.gallery-content .gallery-wrap .gallery-ul .gallery-li .gallery-div .gallery-title{display: block; text-align: left; height: 30px; font-size: 15px; color: #363636; font-family: 'NotoR', sans-serif; line-height: 30px; margin-top: 20px;}
.gallery-content .gallery-wrap .gallery-ul .gallery-li .gallery-div .gallery-date{display: block; text-align: left; height: 30px; font-size: 12px; color: #363636; font-family: 'NotoR', sans-serif; line-height: 20px; margin-top: 0px;}



.navi-td{height: 40px; vertical-align: middle;}
.tb-row-tr:hover{background-color: #f5f5f5;}
.navi{display: inline-block; color: #bbbbbb; font-size: 14px; margin: 0 1px; padding: 6px 6px; border-radius: 4px;}
.navi_active{background-color: #E9B670; color: #ffffff;}
.search-type{width: 80px; height: 30px; display: inline-block; font-size: 14px;}
.search-text{width: 200px; height: 30px; display: inline-block;  font-size: 14px;}
.search-btn{width: 80px; height: 30px;  background-color: #E9B670; color: #ffffff; font-size: 14px; border: none; cursor: pointer; display: inline-block;}


.board-table{width: 100%; margin: 0 auto; table-layout: fixed; margin-top: 55px;}
.tb-title{height: 50px; border-bottom: 3px solid #aaa; background-color: #f5f5f5; font-size: 14px; text-align: center; vertical-align: middle; font-family: 'NotoR', sans-serif;}
.tb-row-tr{height: 50px; border-bottom: 1px solid #ccc; cursor: pointer;}
.tb-row-td{vertical-align: middle; text-align: center; board-tablefont-size: 14px; font-family: 'NotoL', sans-serif; color: #333333;}


.user-ul{text-align: center; position: absolute; right: 150px; height: 20px; top: 50%; transform: translateY(-50%);}
.user-ul .user-li{display: inline-block;}
.user-ul .user-li:after{content:''; height: 12px; width: 1px; background-color: #636363; position: absolute; top: 50%; transform: translateY(-50%); right: -4px;}
.user-ul .user-li:last-child:after{display: none;}
.user-ul .user-li .user-a{display: block; height: 20px; line-height: 20px; padding-right: 15px; padding-left: 15px; color: #636363; font-size: 16px; font-family: 'NotoR', sans-serif;}

.ceo-more{display: block; position: absolute; right: 40px; bottom: 50px;}



.board-div{width: 100%; height: auto; position: relative;}


.board-div .board-content{width: 1060px; padding-bottom: 43px; margin: auto; padding-top: 50px;}
.board-div .board-content .cs-div{width: 300px; margin-right: 80px; float: left; height: 300px; cursor: pointer;}
.board-div .board-content .cs-div .cs-title{width: 100%; text-align: center; position: relative;}
.board-div .board-content .cs-div .cs-title-line{width: 100%; position: relative; text-align: center; padding-bottom: 20px; margin-top: 10px;}
.board-div .board-content .cs-div .cs-content-div{width: 100%; min-height: 150px;}
.board-div .board-content .cs-div .cs-content-div .cs-table{width: 280px; margin: 0 auto; table-layout: fixed;}
.board-div .board-content .cs-div .cs-content-div .cs-table .cs-table-tr {height: 30px;}
.board-div .board-content .cs-div .cs-content-div .cs-table .cs-table-tr .cs-table-title{text-align: left; color: #464646; font-size: 14px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;  width: 180px; font-family: 'NotoR',sans-serif;}
.board-div .board-content .cs-div .cs-content-div .cs-table .cs-table-tr .cs-table-date{text-align: c1enter; color: #464646; font-size: 14px; width: 100px; font-family: 'NotoR',sans-serif;}
.board-div .board-content .cs-div .cs-more{width: 100%; padding-top: 33px; text-align: center;}


.sns-ul{text-align: center; position: absolute; top: 50%; transform: translateY(-50%); right: 0;}
.sns-ul .sns-li{display: inline-block; margin-right: 5px;}
.sns-ul .sns-li:last-child{margin-right: 0;}
.sns-ul .sns-li .sns-a{display: block; }
.sns-ul .sns-li .sns-a img{display: block;}