﻿/* 웹폰트 Import */
@import url('http://fonts.googleapis.com/earlyaccess/nanumgothic.css');
@import url('https://fonts.googleapis.com/css?family=Raleway:300,400,500,600,700|Roboto:400,500,700');

/* 스크롤 설정 */
html {overflow-x: hidden; overflow-y: scroll;}
body {background-color: #fff;}

/* 폰트 설정 */
* {font-family: 'Nanum Gothic', sans-serif !important;}
h1, h2, h3, h4, h5, h6, p {font-family: 'Nanum Gothic', sans-serif !important;}
.fa {font-family: 'FontAwesome' !important;}
.glyphicon {font-family: 'Glyphicons Halflings' !important;}
ol, ul, li {list-style: none;}


/* 메뉴 설정 시작 */
.navbar-inverse {position: absolute; top:0; left:0; width:100%; margin:0; padding:0; z-index:11; background: #333; border:none;}
.navbar-inverse .divider-vertical, .navbar-inverse .caret {display: none;}
.navbar ~ br {display: none;}
.navbar-inverse .navbar-brand, .navbar-inverse .navbar-nav > li > a {text-shadow: 0 0 0 rgba(0,0,0,0);}
.topmarginLay_a {margin: -20px 0 0; height: 0 !important;}
@media (min-width: 768px) {
    .navbar-inverse {background: rgb(51, 51, 51); margin: 30px auto 0; max-width: 1170px;}
}

/* ----- 로고 설정 ----- */
.navbar-brand {padding:15px 0 0 0;}
.navbar-brand img {width: 100%;}

/* ----- 메인 메뉴 설정 -----*/
.navbar-inverse .navbar-nav > li > a {color: #fff; font-size: 15px; font-weight: 400; text-shadow: 0px 0px 0px rgba(0, 0, 0, 0) !important; letter-spacing: -0.03em; padding: 28px 10px 26px; margin: 0 15px; border-right: 1px solid rgba(0,0,0,0) !important; border-top: 4px solid rgba(0,0,0,0) !important;}
.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover{background: #fff; box-shadow: 0 0 0 rgba(0,0,0,0); color: #000; border: none; border-right: 1px solid rgba(0,0,0,0) !important; border-top: 4px solid #a8961d !important;}
.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {color: #fff; border: none; border-right: 1px solid rgba(0,0,0,0) !important; border-top: 4px solid #a8961d !important;}
@media screen and (max-width: 991px) {
    .navbar-inverse .navbar-nav > li > a {font-size: 16px; margin: 22px 0px 18px 0px; padding: 12px 20px 12px 20px;}
}
@media screen and (max-width: 767px) {
    .navbar-inverse .navbar-nav > li > a {font-size: 16px; margin: 0; padding: 14px 20px 14px 20px;}
	.navbar-nav .open .dropdown-menu {padding: 0;}
	.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover {color: #333; border: none !important; margin: 0 0 0; background: #f7f7f7;}}

/* ----- 서브 메뉴 설정 -----*/
.dropdown-menu {background: #000; left: 0 !important; right: auto !important; padding: 10px 0; margin: 0; border-radius: 0; border: none; box-shadow: 0 0 0 rgba(0,0,0,0); min-width: 190px;}
.dropdown-menu > li > a {color: #fff; padding: 10px 30px; margin: 0; font-size: 14px; font-weight: 300; text-align: left; letter-spacing: -0.03em;}
.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover {background-image: none; background-color: #000; color: #a8961d; text-decoration: underline !important;}

/* ----- 모바일 메뉴 설정 ----- */
.navbar-toggle{background: #008dd7; border-radius: 0; border: none; margin: 25px 20px 15px; padding: 10px 10px;}
@media(max-width: 767px) {
    .navbar-inverse .navbar-nav .open .dropdown-menu>li>a{color: #fff; background: #008dd7;}
    .navbar-nav .open .dropdown-menu .dropdown-header, .navbar-nav .open .dropdown-menu>li>a{padding: 10px 15px 10px 25px;}
}
/* //메뉴 설정 끝 */


/* 푸터 영역 설정 시작 */
.footer_copy .text-center{background: #333; color: #aaa; font-size: 12px; text-align: left; padding: 30px 0 10px; margin: 0;}
.footer-top {width: 1170px; margin: 0 auto 10px; padding: 0 15px;}
.footer-top ul{margin: 0; padding: 0; display: inline-block; width: 100%;}
.footer-top ul li{float: left; display: inline-block;}
.footer-top ul li a{color: #c5c5c5; font-size: 13px; margin-right: 30px;}
.footer-top ul li:last-child a:after{content: ""}
.footer-middle {width: 1170px; margin: 0 auto 20px; padding: 0 15px;}
.footer-middle ul{margin: 0; padding: 0; display: inline-block; width: 100%; line-height: 1.6;}
.footer-middle ul li{float: left; display: inline-block;}
.footer-middle ul li span:after{content: "|"; color: rgba(255,255,255,0.2); padding: 0 6px 0;}
.footer-middle ul li:last-child span:after{content: "";}
.footer-bottom {width: 1170px; margin: 0 auto; padding: 0 15px;}
.footer-bottom p{display: inline-block; width: 100%;}
.socialArea{display: none;}
@media screen and (max-width: 991px) {
	.footer-top{width: 100%;}
	.footer-middle{width: 100%;}
	.footer-bottom{width: 100%;}
}
/* //푸터 영역 설정 끝*/


/* 메인페이지 설정 */
.container_contents {width: 100%; padding: 0;}

/**************************** GENERAL ***************************/
.carousel-inner .item{height:470px; background-size: cover !important; background-position: center !important;}
.sliderTxt {position: absolute; top: 80%;left:0; margin: -220px 0 0; width: 100%;}
.sliderTxt > div {float: none; margin: 0px auto; width: 100%;}
.sliderTxt p.title {color: #fff; font-size: 48px; font-weight: 300; line-height: 1.3; text-align: center; margin: 0 0 30px;}
.sliderTxt p.title span {color: #e6ff94; font-weight: 600;}
.sliderTxt p.title span:last-child{color: #fff;font-size:22px;} 
.sliderTxt p.descript {display: none;}
@media (min-width: 768px) {
    .sliderTxt > div {width: 700px;}
    .sliderTxt p.descript {color: #e5e5e5; font-size: 15px; line-height: 1.6; text-align: center;}
    .sliderTxt p.descript {display: block;}	
}
@media (min-width: 992px) {
     .sliderTxt > div {width: 1170px;}
}
.showIt {display: none;}
.slider {position: relative; top: 0; left: 0; width: 100%; z-index: 0; margin: 0; z-index: 0; min-height: 470px;}


/*================================================= 서브페이지 - 공통 =================================================*/
/*****#####===== 상단이미지 =====#####*****/
.sub-layout{width:100%; padding: 0;margin: 0;}
.top-sub-bg {background-image: linear-gradient(rgba(0,0,0,0.0), rgba(86, 79, 73, 0.4)),url(/skin/img/sub/sub-top.jpg); background-repeat:no-repeat; background-position: center; width: 100%; height: 420px; position: relative;}
.top-sub-bg div.top-sub-bg-t-title {position: absolute;
    width: 100%;
    color: #fff;
    top: 50%;
    margin: -30px 0 0;}
.top-sub-bg-t-title h3 {font-size: 32px; font-weight: 600; margin: 0 0 5px; text-shadow:1px 1px 3px block;}
.top-sub-bg-t-title .separator {display: inline-block; width: 20px; height: 1px; background-color: #fff;}
.top-sub-bg-t-title p {font-size: 20px;
    font-weight: 100;
    margin: 0 0 0;
    border-bottom: 1px solid rgba(255,255,255,0.5);
    padding: 0 0 70px;}
.top-sub-bg-t-title ul {overflow: hidden; color: #fff; display: table; margin: 0 auto; padding: 12px 0 0;}
.top-sub-bg-t-title ul li {float: left; list-style:none; padding: 0 15px;}
.content {max-width: 1170px; width: 100%; margin: 0 auto; padding: 40px 0 60px;}

/*****#####===== 타이틀 =====#####*****/
.title-wrap h3 {color: #00A851;
    font-size: 24px;
    font-weight: 900;
    margin: 20px 0 0;}
.separator{display:block;width:50px;height:3px;margin:20px auto 30px;background-color:#00A851}
.point{color:#00A851}
h4.sub-title {
    font-size: 17px;
    font-weight: 600;
    letter-spacing: -0.03em;
    margin: 10px 0 15px;
}

/*=================================================
			ITEI 소개 / 한국아카데미(티랩아카데미) 
=================================================*/
.about .con1, .aca .con1{padding:100px 0 0}
.about .con1 ul, .aca .con1 ul{position:relative; list-style:none}
.about .con1 ul li:first-child, .aca .con1 ul li:first-child{position:absolute;left:0;top:-50px;z-index:2}
.about .con1 ul li:nth-of-type(2), .aca .con1 ul li:nth-of-type(2){position:absolute;right:0;top:0;}
.about .con1 .text-wrapper, .aca .con1 .text-wrapper{padding:60px 20px 50px 0}
.about .con2, .aca .con2 {padding: 100px 0 50px;}
.about .con2 .text-wrap, .aca .con2 .text-wrap {padding-top: 20px;}
.about .con2 .text-wrap, .aca .con2 .text-wrap p {line-height: 1.8; margin: 0 0 20px !important;}
.num {font-family: 'Raleway' , sans-serif !important;}
.big-point {color: #00A851;
    font-size: 25px;
    font-weight: 500;
    line-height: 1.6;
    letter-spacing: -0.03em;
    font-family: 'Roboto' , sans-serif !important; margin: 0 0 20px;}
.sub-point{font-size: 15px;
    line-height: 1.8;
    margin: 0 0 20px;}

/*****#####===== table =====#####*****/
table tr th{font-size:20px}
table tr td{vertical-align:middle !important}

/*=================================================
			교육과정
=================================================*/
/*****#####===== 공통 =====#####*****/
.edu .con1 .point {color: #BA770C;
    font-family: 'Roboto', sans-serif !important;
    font-size: 21px;
    font-weight: 500;
    letter-spacing: -0.03em;
    margin: 40px 0 20px;
    padding: 10px 0;
    background: #FFF1DC;}
.edu .con1 .sub-title .num{color: #999;
    font-size: 20px;
    font-style: italic;
    padding-right: 5px;}
.edu .con1 .sub-content{color: #666;
    font-size: 14px;
    letter-spacing: -0.03em;
    line-height: 1.7;
    margin: 0 0 20px;
    border-bottom: 1px dashed #bdbdbd;
    padding: 0 0 20px;}
.detail {background: #fafafa;
    border: 1px solid #cecece;
    padding: 25px 30px 0;
    margin: 0;}
.detail h5 {font-size: 15px;
    font-weight: 600;
    margin: 0 0 15px;}
.detail ul {padding: 0;
    margin: 0 0 30px;}
.detail ul li{list-style:none; line-height: 1.6;}
.detail ul li:before{content:"-"; padding-right:8px;}

/*=================================================
			 오시는 길
=================================================*/
.location .map-wrap{padding:75px 50px;}
.location .table-responsive{padding-left:50px;}

/*=================================================
			 뉴스/갤러리
=================================================*/
.dh-board,
.bbs-list-add-layout form,
.bbs-list-edit-layout form,
.img-bbs-default-add-layout form,
.img-bbs-default-edit-layout form,
.dh-view-box {max-width:1170px;width:100%; margin:50px auto}
.img-bbs-default-index-layout .row{max-width:1170px;width:100%; margin:0px auto}
.bd-gallery{padding-bottom:0}

/*=================================================
			메인
=================================================*/
.intro-html-layout .content {padding: 0; max-width: 100%;}
.thumb-box1 .item-wrap{text-align:center;padding:50px 30px}
.thumb-box1 > .row{padding:0 15px;}
.thumb-box1 .col-sm-4{padding:0;}
.thumb-box1 .col-sm-4 .item-wrap {-webkit-transition: all .4s ease-in; -moz-transition: all .4s ease-in; -ms-transition: all .4s ease-in; -o-transition: all .4s ease-in; transition: all .4s ease-in;}
.thumb-box1 .col-sm-4:nth-of-type(1) .item-wrap {background-color:#E7F5BA;}
.thumb-box1 .col-sm-4:nth-of-type(3) .item-wrap{background-color:#FFF1DC}
.thumb-box1 .item-wrap p{  font-family: 'Roboto', sans-serif !important;}
.thumb-box1 .item-wrap .mid-title{margin: 30px 0px 15px;}
.thumb-box1 span .btn{display:inline-block; padding:10px 20px; background-color:#333333; color:#fff;margin-top:10px; border: 2px solid rgba(255, 255, 255, 0) !important;}
.thumb-box1 .col-sm-4:nth-of-type(1) .item-wrap span .btn {background-color:#114921;}
.thumb-box1 .col-sm-4:nth-of-type(3) .item-wrap span .btn {background-color:#BA770C;}
.thumb-box1 span .btn:hover, .thumb-box1 span .btn:active{color:#fff;}

/*hover 효과*/
.thumb-box1 .col-sm-4:nth-of-type(1) .item-wrap:hover{background-image:linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3)),url('/skin/img/main/main-bg1.jpg'); background-repeat:no-repeat; background-size: contain; background-position: center; color:#fff;}
.thumb-box1 .col-sm-4:nth-of-type(2) .item-wrap:hover{background-image:linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)),url('/skin/img/main/main-bg2.jpg'); background-repeat:no-repeat; background-size: contain; background-position: center; color:#fff;}
.thumb-box1 .col-sm-4:nth-of-type(3) .item-wrap:hover{background-image:linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)),url('/skin/img/main/main-bg3.jpg'); background-repeat:no-repeat; background-size: contain; background-position: center; color:#fff;}
.thumb-box1 .col-sm-4 .item-wrap:hover span .btn{color:#fff;background-color:transparent !important;border:2px solid #fff !important;border-radius:3px;}
.intro-boardbox{max-width:1170px; width:100%; margin:0 auto; float: none !important;}
.intro-boardbox .col-md-4 a{background-position:center center}

/*****#####===== 미디어 쿼리 =====#####*****/
/***** md *****/
@media (min-width: 992px) and (max-width: 1199px){
}
/***** sm *****/
@media (min-width: 768px) and (max-width: 991px){
}
/***** xs *****/
@media (max-width: 767px){
	.big-point{font-size:18px}
	.content{padding:0 30px;}
	.carousel-inner:nth-of-type(1) item{background:url('/skin/img/slide/slide-img01_m.jpg')}
	.carousel-inner:nth-of-type(2) item{background:url('/skin/img/slide/slide-img02_m.jpg')}
	.carousel-inner:nth-of-type(3) item{background:url('/skin/img/slide/slide-img03_m.jpg')}
	.sliderTxt { top: 33%; margin: 0; padding:0}
	 .sliderTxt > div {padding:0;}
	.sliderTxt p.title{font-size:32px;}
	.sliderTxt p.descript {display: block; color:#fff; text-align:center}
	
}

/*=================================================
			게시판 설정
=================================================*/
/*========== 텍스트 게시판 ==========*/
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thea d > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {padding: 14px 10px; color: #555; font-size: 14px;}
.table > thead > tr > th {vertical-align: middle; border-bottom: 1px solid #ccc; font-weight: 500; color: #333;}
.table > tbody > tr > td > strong > a {color: #555;}
.table > tbody > tr > td > strong > a > span {color: #58ba36 !important;}
.dh-board > .table-hover {border-top: 1px solid #114921; border-bottom: 1px solid #ccc; margin: 0px 0 30px;}
.dh-board > .table-hover > tbody > tr:hover td {background-color: #fcfcfc;}
.table > tbody > tr:hover > td > strong > a {color: #222;}
.dh-margin-top {margin-top: 40px; display: inline-block;}
@media screen and (max-width: 767px) {
    .dh-board .table thead > tr > th.num, .dh-board .table tbody > tr > td.num {display: none;}
}
/*========== 게시판 버튼 ==========*/
.label{background: rgba(0,0,0,0); padding: 0px 5px 0px; font-size: 90%;}
.label-danger{color: #114921;}
.label-primary{color: #114921;}
.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {background-color: #114921; border: 1px solid #114921 !important;}
.pagination > li > a, .pagination > li > span{color: #114921;}
.pagination > li > a:focus, .pagination > li > a:hover, .pagination> li > span:focus, .pagination>li>span:hover{color: #114921;}
.dh-margin-top form#insertForm {width: 100%; max-width: 100%; display: block;}
.btnRead {font-weight: 500;}
.btn-default, .btn-primary, .btn-danger {background-image: none;}
.btn-group, .btn-group-vertical {margin: 10px 0 30px;}

/*========== 게시글 뷰 페이지 설정 ==========*/
.dh-view-box{padding: 0 !important;}
.sns-box{display: none;}
.dh-view-box > .row > .page-header {border-top: 1px solid #2c2c2c; border-bottom: 1px solid #eee; padding: 5px 20px 5px; margin: 0; display: inherit;}
.dh-view-box > .row > .page-header > h4 {color: #2c2c2c;}
.dh-view-box > .row > .dh-view-info{border-bottom: 1px solid #ccc; background: rgba(0,0,0,0); padding: 8px 20px 8px; color: #888;}
.dh-view-box > .row > .dh-view-info > span{padding: 0 15px 0 0;}
.dh-view-box > .row > .dh-view-info > span > strong{color: #555; padding: 0 5px 0 0;}
.dh-view-box .dh-attach h6 {margin: 0 0 0; padding: 5px 5px 0;}
.dh-view-box > .row:nth-child(2) > div:nth-child(3) {padding: 15px 20px 40px !important;}

/*=================================================
			로그인 페이지 설정
=================================================*/
.login-layout {min-height: 600px; width: 1170px; margin: 0 auto;}
.id-find-layout, .pw-find-layout {min-height: 400px;  width: 1170px; margin: 0 auto;}
.login-layout .inner-box-wrapper, .id-find-layout .inner-box-wrapper, .pw-find-layout .inner-box-wrapper {padding: 50px 30px; border: 1px solid #cecece; border-radius: 4px;}
.login-layout .inner-box-wrapper {margin: 200px 0 160px;}
.id-find-layout .inner-box-wrapper {margin: 140px 0 160px;}
.pw-find-layout .inner-box-wrapper {margin: 120px 0 160px;}
.login-layout .panel, .id-find-layout .panel, .pw-find-layout .panel {border-radius: 0; box-shadow: 0 0 0 rgba(0,0,0,0); border: 1px solid rgba(0,0,0,0); min-height: 320px;}
.login-layout .panel-body h2, .id-find-layout .panel-body h2, .pw-find-layout .panel-body h2 {margin: 0; color: #454545; font-size: 28px; font-weight: 500; letter-spacing: 0.01em;}
.login-layout .inner-box-msg p, .id-find-layout .inner-box-msg p, .pw-find-layout .inner-box-msg p {font-size: 13px; color: #666; margin: 0;}
.login-layout .inner-box-form form label, .id-find-layout .inner-box-form form label, .pw-find-layout .inner-box-form form label {font-size: 14px;}
.login-layout input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {background: #fff !important; border: 1px solid #d5d5d5;}
.login-layout .btn-warning, .id-find-layout .btn-warning, .pw-find-layout .btn-warning {background-image: none; background-color: #414141; border: none; border-radius: 0; box-shadow: 0 0 0 rgba(0,0,0,0); text-shadow: 0 0 0 rgba(0,0,0,0); color: #f5f5f5;}
.login-layout .btn-warning:focus, .login-layout .btn-warning:hover, .id-find-layout .btn-warning:focus, .id-find-layout .btn-warning:hover, .pw-find-layout .btn-warning:focus, .pw-find-layout .btn-warning:hover {background: #00A851;}
.login-layout form > div > p > a {display: inline-block; float: left; font-size: 12px; color: #777;}
.login-layout form > div > p > a:hover {color: #303030;}
.login-layout form > div > p > a:after {content: " | "; font-size: 8px; padding: 0 8px 0; margin: 0; color: #d9d9d9;}
.login-layout form > div > p:last-child > a:after {content: "";}
