@charset "utf-8";

/* 테마/sub/서브페이지.php 에 사용되는 css를 추가 할 수 있습니다. */


/* ****************************************************************************************** */
/* sub section common */
.sub_sec{padding:0px 0 0px}
.sub_sec .title{padding-bottom:4rem; text-align:center;}
.sub_sec .title h3{padding-bottom:4px; letter-spacing:0.02em; text-transform:capitalize; font-size:36px; font-weight:400;}
.sub_sec .title h3 span{text-transform:uppercase;}
.sub_sec_con{}



/* ****************************************************************************************** */


/* edu.php - 사업분야 */

.edu_area_sec {margin-bottom: 70px;}
.edu_area_sec .title{padding-bottom:1rem; text-align:center;}
.edu_area_sec .title h3{padding-bottom:4px; letter-spacing:0.02em; text-transform:capitalize; font-size:36px; font-weight:400;}
.edu_area_sec .title h3 span{text-transform:uppercase;}





.edu_area_sec ul{margin:0 -16px; font-size:0;background:#fafafa;}
.edu_area_sec ul li{display:inline-block; width:calc(50%); font-size:15px; vertical-align: top;}
.edu_area_sec ul li *{-webkit-transition:all .3s ease-out; transition:all .3s ease-out;}
.edu_area_sec ul li:first-child{height:100%;background:#fafafa;overflow:hidden;}
.edu_area_sec ul li:last-child{padding: 40px;}
.edu_area_sec ul li h4{font-size:25px; padding-top:0px; font-weight:300; color:#6FC7DB; line-height: 120%}
.edu_area_sec ul li h5{font-size:25px; padding-top:0px; font-weight:400; color:#6FC7DB; margin-bottom: 20px;}



.edu_area_sec ul li p{font-size: 16px;}

.edu_area_sec ul li img{width:100%; height:auto;}


.edu_area_sec .bu a{font-size: 16px; margin-top: 20px; border: 0px solid #000000;padding: 10px 40px; display: inline-block; cursor: pointer; background-color: #3D3D3D; color: white; border-radius:20px;}
.edu_area_sec .bu a:hover{font-size: 16px; margin-top: 20px; border: 0px solid #6FC7DB; padding: 10px 40px; display: inline-block; cursor: pointer; background-color: #6FC7DB;}


.edu_area_sec .topfont {letter-spacing:-0.04em; font-size:30px; font-weight:300; text-align: center; color: #6FC7DB; margin-bottom: 40px;line-height:120%}





/*과정 안내*/
.edu2_area_sec {margin:auto; max-width: 1200px}
.edu2_area_sec .title{padding-bottom:1rem; text-align:center;}
.edu2_area_sec .title h3{padding-bottom:4px; letter-spacing:0.02em; text-transform:capitalize; font-size:36px; font-weight:400;}
.edu2_area_sec .title h3 span{text-transform:uppercase;}



.edu2_area_secp h2 {text-align:center; font-size:30px; color:#333}
.edu2_area_sec h2 span{ display:block; padding:20px 0; color:#555; font-size:15px; font-weight:100}
.edu2_area_sec ul {margin-top:30px; overflow:hidden; margin-bottom: 70px;}
.edu2_area_sec ul li{ width:25%; text-align:center; float:left; display:block}
.edu2_area_sec ul li .icon { display:inline-block; padding:30px}
.edu2_area_sec ul li .icon i { color:#666}
.edu2_area_sec ul li img {vertical-align:middle; transition:transform 500ms}
.edu2_area_sec ul li:hover i{transform:rotateY(180deg); transition:transform 500ms}
.edu2_area_sec ul li .box {border-right:1px  #eaeaea solid; padding:0 10px; display:block}
.edu2_area_sec ul li:last-child .box {border-right:0px}
.edu2_area_sec ul li dl dt {font-weight:bold; padding-bottom:15px; line-height:20px; color:#222; font-size:20px}
.edu2_area_sec ul li dl dd {color:#555; font-size:15px; line-height:120%}
.edu2_area_sec ul li a {display:inline-block; margin-top:20px; border:1px #ddd solid; padding:0 20px; line-height:30px; color:#666;  transition: all .2s}
.edu2_area_sec ul li:hover a {background:#2253b8; color:#fff; transition: all .3s}
/*과정안내*/


/*자격증 소개*/
.edu3_area_sec {margin:auto; max-width: 1200px}
.edu3_area_sec .title{padding-bottom:1rem; text-align:center;}
.edu3_area_sec .title h3{padding-bottom:4px; letter-spacing:0.02em; text-transform:capitalize; font-size:36px; font-weight:400;}
.edu3_area_sec .title h3 span{text-transform:uppercase;}


	.business_type2{ width:100%; max-width:1200px; margin:0 auto;}
	.business_type2:after{content:""; display:block; clear:both;}
	.business_type2 .business_info { width:100%; background:#fff; margin-bottom:80px; }
	.business_type2 .business_info:after{content:""; display:block; clear:both;}
	.business_type2 .business_info ul{ padding:0; margin:0;}
	.business_type2 .business_info ul li{ padding:0; margin:0;}
	.business_type2 .business_info ul li.left_box { float:left; width:500px; height:500px; overflow:hidden; }
	.business_type2 .business_info ul li.left_box img{ width:100%; height:100%; }
	.business_type2 .business_info ul li.right_box{position:relative; float:right; width:50%; height:500px;}
	.business_type2 .business_info ul li.right_box .txt03{ position:absolute; left:0; bottom:0; width:100%; border-top:1px solid #ddd; font-size:0.9em; color:#555; line-height:1.5em; text-transform: uppercase; background:#f8f8f8; overflow:hidden;}
	.business_type2 .business_info ul li.right_box .txt03 span {display:block; padding:20px 25px; height:100px; }

	.business_type2 .txt_area { width:100%; padding-top:40px; border-top:2px solid #000; }
	.business_type2 .txt_area:after{content:""; display:block; clear:both;}
	.business_type2 .txt_area .txt01 { float:left; width:100%; word-break: keep-all; }
	.business_type2 .txt_area .txt01 p { padding:0; margin:0; margin-bottom:15px; padding:0;}
	.business_type2 .txt_area .txt01 span.tit { display:block; font-size:2.2em; color:#000; font-weight:700; line-height:1.2em;  }
	.business_type2 .txt_area .txt01 span.txt { display:block; font-size:1.15em; color:#333; font-weight:400; line-height:1.4em; }
	.business_type2 .txt_area .txt02 { float:left; width:100%; margin-top:20px;}
	.business_type2 .txt_area .txt02 ul {margin:0; padding:0; }
	.business_type2 .txt_area .txt02 ul li { position:relative; color:#555; font-weight:400; line-height:1.5em; list-style:none; padding-left:3%; margin-bottom:5px;}
	.business_type2 .txt_area .txt02 ul li:before {position:absolute; top:8px; left:0; content:""; display:inline-block; width:4px; height:4px; background:#555; margin-right:10px; vertical-align:middle;}


/*강사 소개*/
.edu4_area_sec { background:#fafafa;}
.edu4_area_sec .title{padding-bottom:50px; padding-top: 50px; text-align:center;}
.edu4_area_sec .title h3{padding-bottom:4px; letter-spacing:0.02em; text-transform:capitalize; font-size:36px; font-weight:400;}
.edu4_area_sec .title h3 span{text-transform:uppercase;}

.edu4_area_sec .content{margin:auto; max-width: 1200px}



	.edu_type1 .tech { position:relative; padding-bottom:100px; margin-bottom:50px}

	.edu_type1 .tech:before { content:''; display:block; position:absolute; top:0; left:50%; width:1px; height:100%; background:#eee;} /* 라인색상 */
	.edu_type1 .tech .img_box {position:absolute; top:0; left:0; padding:0; margin:0; width:50%; text-align:left; }
	.edu_type1 .tech .img_box img { width:auto; }
.edu_type1 .tech .img_box span { font-size: 16px; display: inline-block; margin-top: 10px;}
.edu_type1 .tech .img_box span strong{ font-size: 20px; display: inline-block; }

	.edu_type1 .tech > div { position:relative; margin-left:50%; padding-left:30px; margin-bottom:45px; }
	.edu_type1 .tech > div:before { content:''; display:block; position:absolute; top:10px; left:-2px; width:5px; height:5px; border-radius:50%; background:#555;} /* 라인포인트색상 */
	.edu_type1 .tech > div .year { top:0; left:20px; font-size:1em; color:#555; padding:5px 25px; margin-bottom:15px; display:inline-block; border:1px solid #ddd; background-color: #6FC7DB; color: white}
.edu_type1 .tech > div .year2 { top:0; left:20px; font-size:1em; color:#555; padding:5px 25px; margin-bottom:15px; display:inline-block; border:1px solid #ddd; background-color: #3D3D3D; color: white}

	.edu_type1 .tech > div ul {padding:0; margin:0; }
	.edu_type1 .tech > div ul li { padding:0; margin:0;}
	.edu_type1 .tech > div ul li p {margin-top:0px; }
	.edu_type1 .tech > div ul li p strong { width:100%; display:inline-block; vertical-align:top; font-size:16px;  }
.edu_type1 .tech > div ul li p strong2 { width:100%; display:inline-block; vertical-align:top; font-size:16px;  }

.edu_type1 .tech > div ul li p b{font-size: 16px; padding-left: 10px; padding-right: 10px; color: #6FC7DB}



/* 테이블 영역 */
.edu_type2 {  padding-bottom: 40px; }
.edu_type2 .title_bullet{margin-bottom:5px;color:#ed2c4b;font-size: 18px; font-weight:600;background:url('../img/title_round_bullet.png') 0 center no-repeat; padding-left:20px;}

.edu_type2 .title_bullet2{margin-bottom:5px;color:#3d3d3d;font-size: 18px; font-weight:600;background:url('../img/title_round_bullet3.png') 0 center no-repeat; padding-left:20px;}

.edu_type2 .title_sub {margin-bottom:10px;color:#000;font-size: 16px; font-weight:400;}


.edu_type3 {text-align: center; padding-bottom: 40px;}
.edu_type3 .button a{font-size: 16px;  border: 0px solid #000000;padding: 10px 40px; display: inline-block; cursor: pointer; background-color: #3D3D3D; color: white; border-radius:20px;}
.edu_type3 .button a:hover{font-size: 16px;  border: 0px solid #6FC7DB; padding: 10px 40px; display: inline-block; cursor: pointer; background-color: #6FC7DB;}

table.type01 {
  border-collapse: collapse;
  text-align: left;
  line-height: 1.5;
  border-top: 3px solid #ed2c4b;
  border-left: 1px solid #ccc;
  margin : 0px 0px;
}
table.type01 th {
  width: 147px;
  padding: 10px 20px;
  font-weight: bold;
  vertical-align: top;
  color: #153d73;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  background-color: #eeeeee

}
table.type01 td {
  width: 349px;
  padding: 10px 20px;
  vertical-align: top;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}




table.type02 {
  border-collapse: collapse;
  text-align: left;
  line-height: 1.5;
  border-top: 3px solid #3d3d3d;
  border-left: 1px solid #ccc;
  margin : 0px 0px;
}
table.type02 th {
  width: 147px;
  padding: 10px 20px;
  font-weight: bold;
  vertical-align: top;
  color: #153d73;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  background-color: #eeeeee

}
table.type02 td {
  width: 349px;
  padding: 10px 20px;
  vertical-align: top;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}






/* ****************************************************************************************** *
 * 1200px
 * ****************************************************************************************** */
@media screen and (max-width:1200px) {
	
	/* about */
	.about_contact_sec{padding:6rem 2rem;}

}
/* 1200px end */



/* ****************************************************************************************** *
 * 1024px
 * ****************************************************************************************** */
@media screen and (max-width:1024px) {
	
	/* about */
	.about_profile_sec > .inner{padding:0 24px;}

}
/* 1024px end */



/* ****************************************************************************************** *
 * 768px
 * ****************************************************************************************** */
@media screen and (max-width:768px) {
	
	/* about.php - 회사소개 */
	.project_request_sec .about_phil li{width:calc(50%); margin:0 0 1rem; font-size:13px;}
	.project_request_sec .about_phil li .txt{padding:0 24px 24px;}
	.about_contact_sec{padding:4rem 2rem;}
	.about_intro_sec dl dt span{font-size:48px;}
	.about_intro_sec dl dd h2{font-size:32px;}
	.about_intro_sec dl dd div{padding-left:0;}
	.about_intro_sec dl dd p{width:100%; padding-left:0;}
	.about_intro_sec dl dd p:first-child{padding-bottom:1rem;}


	/* contact */
	.contact_sec .address_info{padding:1.5rem 1rem 1rem;}
	.contact_sec .address_info dl dt{margin-bottom:.5rem; font-size:14px;}
	.contact_sec .address_info dl dd{font-size:16px;}
	.contact_sec .contact_info dl dt{width:80px; height:80px;}
	.contact_sec .contact_info dl dd{width:calc(100% - 80px); padding-top:.25rem;}
    
    
    	/* 교육센터 */

    
    
    .edu_area_sec .topfont {letter-spacing:-0.04em; font-size:20px; font-weight:300; text-align: center; color: #6FC7DB; margin-bottom: 40px;line-height:120%}
    
    
    .edu_area_sec ul{margin:0 -16px; font-size:0;background:#fafafa;}
.edu_area_sec ul li{display:inline-block; width:calc(100%); font-size:15px; vertical-align: top;}
.edu_area_sec ul li *{-webkit-transition:all .3s ease-out; transition:all .3s ease-out;}
.edu_area_sec ul li:first-child{height:100%;background:#fafafa;overflow:hidden;}
.edu_area_sec ul li:last-child{padding: 40px 20px;}
.edu_area_sec ul li h4{font-size:20px; padding-top:0px; font-weight:300; color:#6FC7DB; line-height: 120%}
.edu_area_sec ul li h5{font-size:20px; padding-top:0px; font-weight:400; color:#6FC7DB; margin-bottom: 20px;}



.edu_area_sec ul li p{font-size: 16px;}

.edu_area_sec ul li img{width:100%; height:auto;}
    

.edu_area_sec {margin-bottom: 0px;}    
    
    
.edu2_area_sec ul li{ width:100%; text-align:center; float:left; display:block}
.edu2_area_sec ul li .box { border-right:0; border-bottom:1px solid #ddd; padding-bottom:30px}
.edu2_area_sec ul {margin-top:0px; overflow:hidden; margin-bottom: 70px;}
.edu2_area_sec ul li:first-child{border-top:1px solid #ddd;}
    
    
 
.business_type2 .business_info ul li.left_box { width:100%; height:auto; overflow:hidden; display: none}
.business_type2 .business_info ul li.right_box{position:relative; width:100%; padding: 20px}    

    
    .edu_type1 .tech { position:relative; padding-bottom:0px; margin-bottom: 0px}
   .edu_type1 .tech .img_box { display:block; position:relative; top:0; left:0; width:100%; padding:0; margin-bottom:40px; text-align: center}
		.edu_type1 .tech .img_box img { width:100%;}
		.edu_type1 .tech:before { left:20px; } /* 라인 */
		.edu_type1 .tech > div { margin-left:0; }
		.edu_type1 .tech > div:before {left:18px; }
		.edu_type1 .tech > div .year { top:0px; left:40px; font-size:0.9em;}
		.edu_type1 .tech > div ul li { font-size:0.9em;}
    
    
    

    
    
    .edu_type2 { padding-bottom: 30px; padding-left: 10px; padding-right: 10px}
    
    
    
    

}
/* 768px end */



/* ****************************************************************************************** *
 * 767px
 * ****************************************************************************************** */
@media screen and (max-width:767px) {

	/* about.php - 회사소개 */
	.about_profile_sec > .inner{padding:0 20px;}
	.about_profile_sec dl{padding:10px 15px;}
	.about_profile_sec dl dt, 
	.about_profile_sec dl dd{float:none; width:100%; margin-left:0; padding:5px 0; text-align:left;}
	

	/* contact */
	.contact_sec .address_info{padding:1.5rem;}
	.contact_sec .address_info dl{width:100%;}
	.contact_sec .address_info dl:nth-child(1){padding-bottom:.5rem;}
	.contact_sec .address_info dl dt{margin-bottom:0; padding:0; border:0; font-size:14px;}
	.contact_sec .address_info dl dd{font-size:14px;}

	.contact_sec .contact_info dl{width:100%;}
	.contact_sec .contact_info dl dt{width:60px; height:60px; font-size:16px;}
	.contact_sec .contact_info dl dd{width:calc(100% - 60px); padding-left:.5rem;}
	.contact_sec .contact_info dl dd p{display:inline; font-size:13px;}
	.contact_sec .contact_info dl dd p:nth-of-type(1){padding-right:8px;}
	.contact_sec .contact_info dl dt i {font-size:18px;}


	/* work */
	.work_area_sec ul li{width:calc(100% - 32px);}
	.process_sec{background:#f7f7f7;}
	.project_request_sec{padding:4rem 20px;}


}
/* 767px end */





/* ****************************************************************************************** *
 * 480px
 * ****************************************************************************************** */
@media screen and (max-width:480px) {
	
	/* sub section common */
	.sub_sec .title{padding:0 1rem 3rem;}	
	.sub_sec .title h3{letter-spacing:0; font-size:28px;}
	.sub_sec .title p{display:inline;}

	/* about */
	.about_intro_sec dl dt span{font-size:36px;}	

	/* work */
	.work_area_sec ul li > div:last-child{padding:1.5rem 0 2rem;}
	.project_request_sec > .inner{padding:0 15px;}

}
/* 480px end */





/* ****************************************************************************************** *
 * 320px
 * ****************************************************************************************** */
@media screen and (max-width:320px) {
	
	/* contact */
	.contact_sec .contact_info dl dt{display:none;}
	.contact_sec .contact_info dl dd{width:100%; padding:0;}

}
/* 320px end */