/**
* Theme styleseet file
*
* @Program     DWEBS
* @Type  	   css
* @author      DWEBS
* @link        https://www.dwebs.kr
*/

@import url(//fonts.googleapis.com/earlyaccess/nanummyeongjo.css);

/* -------------------------------------------------------------------
| Custom selection color
| ------------------------------------------------------------------*/
::selection { background-color: #5d5d5d; color: #58FAF4; }
::-moz-selection { background-color: #cccccc; color: white; }


/* -------------------------------------------------------------------
| Custom mark tag
| ------------------------------------------------------------------*/
mark {
	background: #CEECF5;
	border-radius: 3px;
	padding:4px;
	color: #000;
	font-weight:bold;
}

/* ------------------------------------------------------------------------------------
| Custom bootstrap breadcrumb
|
| 서브페이지 타이틀 영역
| 부트스트랩 breadcrumb 기본 구분자 및 속성 수정
|
| 부트스트랩은 페이지 로케이션을 위한 breadcrumb 클래스를 기본 제공합니다.
| 이러한 페이지로케이션의 각 영역간 구분자는 따로 명시하지 않으면 기본 / 로 표시하게되며,
| 이것을 변경하려면 .breadcrumb>li+li:before {content: ">";}등과 같이 재선언 합니다.
| -----------------------------------------------------------------------------------*/
.breadcrumb {color:#9c9c9c; font-size:12px; padding: 5px 0px 0; margin-bottom: 10px; list-style: none; border-radius: 4px; background:none;font-family: "NotoSans-Medium", sans-serif}
.breadcrumb>li+li:before {padding: 0 5px; color: #9c9c9c; content: ">";}
.breadcrumb .active{color:#9c9c9c;}


/* -------------------------------------------------------------------
| Header section
|
| 테마의 헤더영역내의 속성을 정의합니다.
| ------------------------------------------------------------------*/
header{z-index: 10000;}
body{font-family: 'Noto Sans KR', sans-serif;}
/*로그인바*/
.login_bar{ width: 100%; height: 30px; background-color: #f9f9f9; }
.login_center:after{display: block;content: "";clear: both;}
.login_center>ul{ float: right; margin-right: 10px; }
.login_center>ul:after{display: block;content: "";clear: both;}
.login_center>ul>li{ float: left; line-height: 28px; margin-right: 10px; }
.login_center>ul>li>a{  font-size:12px; color:#444; font-weight: 300;   }
.login_line{font-size:9px; color:#aaa; }

#navitop_mobile {vertical-align:middle;  background:#fff; border-bottom: 1px solid #ccc; }
.logo{padding:20px 20px}
.mobile_btn {float:right;position:relative;width:34px;height:34px;background-color:#000;border:0px solid #2f2f2f;margin:20px 15px 0 0}
.icon-bar {margin-top:4px;margin-bottom:4px;background-color:#939393;display:block;width:22px;height:2px;border-radius:1px}

.top_navi{background:#151314;padding:5px 0 7px}
.top_navi ul{;}
.top_navi ul li{display:inline;padding:0 2.3% 0;}
.top_navi ul li a{font-size:9pt;color:#fff;text-decoration:none;letter-spacing:0.5px;font-family: "nanumMJ_B", sans-serif}
.top_navi ul li a.active{color:#666}

.navitop_line{width: 100%; }
.navitop_line:after{display: block;content: "";clear: both;}
.navitop_line1{float: left; width:50%; height: 10px; background: #0b51a1; }
.navitop_line2{float: left; width:50%; height: 10px; background: #7bc42f; }

/*left navi*/
.right_bar1{position:relative; width: 100%; height: 40px; background: #383838; }
.right_bar1 ul{width:100%;}
.right_bar1 ul:after{display: block;content: "";clear: both;}
.right_bar1 ul>li:first-child{background:url('../images/common/right_li_bg.jpg') right center no-repeat;}
.right_bar1 ul>li{float: left; list-style: none!important;width: 50%; text-align: center;}
.right_bar1 ul>li>a{color: #fff; font-size: 11px; font-weight: 400; line-height: 40px;}




/*로그인페이지*/
.login_area{width: 100%; background: #f7f7f7; padding: 30px 20px; margin: 0 auto; }
.login_logo{text-align: center; }
.login_logo>img{ width: 80%; }
.login_title{font-size: 17px; font-weight: 400; color: #444; margin: 40px 0 3px 0; }
.login_title2{font-size: 12px; font-weight: 400; color: #777; margin-bottom: 10px;  }
.login_id{ margin-bottom: 20px; }
.login_id input{ height: 40px; }
.login_id input[type=id] { margin-bottom: 10px; }
.login_bt button{ background:#e4322b; font-size: 17px; font-weight: 400; color: #fff;height: 45px; border: 1px solid transparent;  transition: all 0.3s; }
.login_bt button:hover{ background: #ce2f28; }
.login_find:after{display: block;content: "";clear: both;}
.login_join{ background:#fafafa; border: 1px solid #ccc; padding:15px; font-size:13px; font-weight: 400; color: #9e9e9e; margin: 20px 0 10px 0;}
.login_find{ line-height: 30px; }
.id_find a{ font-size:14px; font-weight: 400; color: #777;}
.id_find a:hover{text-decoration: none; }
.pw_find a{ font-size:14px; font-weight: 400; color: #777;  }
.pw_find a:hover{text-decoration: none; }
.join_go{ float: right; }
.join_go a{ display: inline-block; width: 110px; height: 30px; text-align: center; line-height: 30px; background: #353535; font-size:13px; font-weight: 400;  color: #fff; transition: all 0.3s; }
.join_go a:hover{ background: #252525; text-decoration: none; }

/*회원가입동의*/
.agree_wrap{ background: #fafafa; padding: 15px; border-top:2px solid #e4322b;   }
.agree_wrap:after{display: block;content: "";clear: both;}
.agree_title{  font-size:18px; font-weight: 400; color: #333; margin-bottom: 10px; }
.agree_t textarea{ background-color: #fff!important; }
.agree_ch:after{display: block;content: "";clear: both;}
.agree_ch>div{ float: right; }
.agree_bt1{ background-color: #e4322b; color: #fff; border-radius: 4px; padding: 10px 30px; font-size:13px; font-weight: 400; margin-right: 5px;  }
.agree_bt2{ background-color: #353535; color: #fff; border-radius: 4px; padding: 10px 30px; font-size:13px; font-weight: 400;}
.agree_bt3{ background-color: #5f5f5f; color: #fff; border-radius: 4px; padding: 10px 30px; font-size:13px; font-weight: 400; margin-right: 5px;}
/*회원가입*/
.member_skin_top { width: 100%; margin: 0 auto 30px; padding: 20px 15px; border: 1px solid #cecece; background: #f9f9f9; }
.member_skin_top ul li { position: relative; padding-left: 12px; line-height: 26px;  font-weight: 300; font-size: 13px; color: #888888; }
.member_skin_top ul li:before { position: absolute; top: 11px; left: 4px; width: 3px; height: 3px; background: #888888; content: "";}
.register_c { position: relative; top: 3px; margin-right: 5px; color: #d71609;}
.register_bt{ text-align: center; }
.register_title{font-family: 'Nanum Gothic', sans-serif; font-weight: 400;  font-size:25px; color: #333; border-bottom: 0; }
.register_table{ border-top: 2px solid #666666; border-left:0; border-right: 0; table-layout:fixed; }
.register_table>tbody>tr>th{text-align: left; font-size: 12px; font-weight: 500;  color: #666666; background: #fafafa; vertical-align: middle;}
.register_table>tbody>tr>td{vertical-align: middle;}
/*아이디찿기*/
.find_wrap{ background: #f2f5f7; padding: 30px; }
.find_title{ text-align: center; font-size: 15px; font-weight: 400;  color: #666666; margin-bottom: 15px; }
.find_t{  font-size: 14px; font-weight: 500;  color: #353535; margin-right: 15px; }

/*마이페이지*/
.mypage_table{ width: 100%;  border-top: 2px solid #666666; border-left:0; border-right: 0; table-layout:fixed; }
.mypage_table>tbody>tr>th{ padding: 10px; text-align: left; font-size: 13px; font-weight: 500;  color: #666666; background: #fafafa; }
.mypage_table>tbody>tr>td{ font-size: 12px; font-weight: 400;  color: #666666; vertical-align: middle;  }


/* -------------------------------------------------------------------
| Foot section
|
| 테마의 푸터영역의 속성을 정의합니다.
| ------------------------------------------------------------------*/
.footer_area {width:100%; text-align:center;padding-bottom:5px;background:#fff; border-top: 1px solid #ccc; padding: 20px; }

.call{color:#fff;font-size:13px;}
.call_txt1{color:#2f2f2d;border-bottom:1px solid #2f2f2d;padding-bottom:1px;font-family: "nanum_EB", sans-serif}
.call img{max-width:5%}
.call a{display:block;border-radius:6px;background:#000;padding:4px 0;width:98%;margin:2% auto 0;color:#fff;font-size:10pt;font-weight:bold;text-decoration:none}

.open_info{border-top:1px solid #484848;border-bottom:1px solid #484848;padding:5px 0;color:#c0c0c0;font-size:12px;line-height:20px}
.open_info a{color:#898d8e;font-size:20px;}

.footer_copy {font-size:11px;color:#8e8e8e;line-height:18px;}
.admin{;}
.admin a{font-size:10px;color:#ccc;border:1px solid #666;background:#333;padding:3px 7px;border-radius:3px;font-family: "nanum_B", sans-serif;letter-spacing:0.5px;text-decoration:none}
.dwebs_logo{;}
.footer_device{;}
.footer_area .btn-default{font-size:10px;background:#fff;color:#666}
.footer_area .btn-primary.active, .btn-primary.active:hover{font-size:10px;background:#ececec;border:1px solid #ccc;color:#666}

.quick_wrap{width:100%}
.quick{position:relative;text-align:center;padding:20px 0}
.quick img{width:80%}
.quick a{text-decoration:none}
.quick ul{;}
.quick ul:after {display:block;clear:both;content:"";}
.quick ul li{width:48%;float:left;margin:0 1%}

/* -------------------------------------------------------------------
| Button section
|
| 테마내의 버튼들의 속성을 정의 합니다.
| ------------------------------------------------------------------*/
.btn_page_up{position:fixed; bottom:50px; right:50px; z-index:1000; display:none;}
.btn_page_up img:hover{opacity:0.5; cursor:pointer;}
.login_btn_default { background-color:#474a4d; border:1px solid #474a4d; color:#3c4349; font-size:12pt; height:68px; color:#ccc; }
.login_btn_default:hover { background-color:#333; color:#fff; }
#device_btn {vertical-align:middle; margin:0 auto;}
.board_btn_default { background-color:#474a4d; border:1px solid #474a4d; color:#d8d8d8; font-size:10pt; padding-left:10px; padding-right:10px; height:30px; }
.board_btn_default:hover { color:#fff; }


/* -------------------------------------------------------------------
| Bxslider section
|
| 테마의 Body영역의 속성을 정의합니다.
| ------------------------------------------------------------------*/
/* BXSLIDER */
.bxslider li img { margin:0 auto; }
.bxslider_btn_prev {
	position: absolute;
	left: 0px;
	top: 50%;
	z-index: 99;
	background: url('../images/bxslider_btn_prev.png') no-repeat 0 50%;
	border: 0;
	width: 46px;
	height: 64px;
	text-indent: -9999px;
	margin-top: -30px;
	opacity:0.6;
}
.bxslider_btn_next {
	position: absolute;
	right: 0px;
	top: 50%;
	z-index: 99;
	background: url('../images/bxslider_btn_next.png') no-repeat 0 50%;
	border: 0;
	width: 46px;
	height: 64px;
	text-indent: -9999px;
	margin-top: -30px;
	opacity:0.6;
}


.box1_wrap:after{display: block;content: "";clear: both;}
.box1_wrap>a{display: inline-block; float: left; width: 32%; margin-left:2%; }
.box1_wrap>a:first-child{margin: 0; }

.box3{width: 100%; background: url('../images/common/box3_bg.jpg') center center no-repeat; padding:20px 10px; }
.box3_wrap{width: 100%;  background: #fff; }
.box3_wrap:after{display: block;content: "";clear: both;}
.box3_title_top{position: relative; height: 70px;  }
.box3_title_top:after{display: block;content: "";clear: both;}
.box3_title{ position: absolute; top: 5px; left:10px; font-size:35px; font-weight: 500; color: #fff; }
.box3_more{ position: absolute; top: 15px; right:10px;  bottom:40px; display: inline-block; width: 45px; height: 45px; border: 1px solid #fff; background: url('../images/common/box3_more_bg.png') center center no-repeat;}

.box3_wrap {position:relative; }
.box3_wrap ul:after{display: block;content: "";clear: both;}
.box3_wrap li{ float: left; position: relative; width:50%;height:230px;  font-size:15px;color:#777;line-height: 25px; letter-spacing: -0.5px; padding:20px 15px;}
.box3_wrap li a{display: inline-block; font-size:13px;color:#777; font-weight: 400; line-height: 25px; text-decoration:none;}
.box3_wrap li a:hover{text-decoration:underline; }
.col01_t{font-size:14px;color:#292929;letter-spacing: -0.5px; font-weight: 500; }
.news_day{ font-weight: 500; color: #5e5e5e; font-size: 13px;  line-height:28px;}
.news_day>p{ font-size:40px; color: #000; }
.news_text_line{width: 25px; height: 1px; background: #000; margin:0 0 10px 10px; }
.box3_line1{position: absolute;  top: 80px; left: 50%; width:1px; height:100px; background:#ccc; }





/* -------------------------------------------------------------------
| Body section
|
| 테마내에 일반적인 컨텐츠들의 속성을 정의합니다.
| ------------------------------------------------------------------*/
/* warp */
#wrap {}
/* 서브 레이아웃 */
#sub_top_area_wrap{width:100%; }
.sub_top_area{position:relative;margin:0 auto;text-align:center;color:#fff; padding: 12% 10%;}
.sub_top_area_t{font-size:18px;font-family: "NanumSquare_B", sans-serif; word-break: keep-all;}
.sub_top_area_tt{font-size:12px;font-family: "NanumSquare_B", sans-serif;}
.sub_top_area_t2{font-size:12px;font-family: "NanumSquare", sans-serif}
.sub_article{position:relative;width:1300px;margin:0 auto;padding-bottom:50px;border-bottom:1px solid #151314}
.title{text-align:center;margin:10px 0 20px;border-bottom:1px dashed #494949;}
.sub_title{color:#342b2a;font-size:20px;letter-spacing:0.5px;font-family: "NotoSans-Medium", sans-serif}
.contents{padding:0 10px 30px;}



.sub_info{position:relative;font-size:15px;color:#666;line-height:35px;text-align:center}
.sub_txt1{font-size:25px;color:#333;font-family: "NotoSans-Bold", sans-serif}
.sub_txt2{font-size:25px;color:#0152a2;font-family: "NotoSans-Bold", sans-serif}
.sub_txt3{font-size:20px;color:#333;font-family: "NotoSans-Medium", sans-serif}

.sub_left{float:left;width:600px;padding-left:100px}
.sub_left img{float:right;margin-right:20px}
.sub_right{float:right;width:466px;margin-right:100px}


.greetings_title{font-size: 23px; font-weight: 300; color: #353535; text-align: center; letter-spacing:-0.7px; line-height: 33px; }
.greetings_title1{font-weight: 500; }
.greetings_title2{color: #e4322b; }

.greetings_text{font-size: 17px; font-weight: 400; color: #353535; text-align: center; letter-spacing:-0.7px; line-height:30px; word-break:keep-all; }
/* .greetings_text>p{font-size:20px; font-weight: 300; line-height:28px; }
.greetings_text>p>span{font-weight: 500; } */
.greetings_ceo{width: 100%; margin:40px 0 50px 0; text-align:center;}
.greetings_ceo>img{max-width: 75%;}
.greetings_ceo > p{font-size:20px; font-weight: 300; line-height:28px; margin-top:20px;}
.greetings_ceo > p > span {font-weight: 500; }

.greetings_name{ font-size: 20px; font-weight: 700; color: #000;  text-align: center; margin-top: 30px; }
.greetings_name>img{margin-top: 10px;}

.bbs_title{ background: #f8f8f8; padding: 15px; font-size: 12px; font-weight: 400; text-align: center; margin-bottom: 30px; word-break:keep-all; color: #353535; }

.encyclic_t{ font-weight: 500; font-size: 35px; color: #353535; text-align: center; }
.encyclic_title{font-weight: 400; font-size: 23px; color: #353535; text-align: center; margin:50px 0 30px 0;}
.encyclic_text{font-weight: 400; font-size: 15px; color: #666; margin: 40px 0; line-height:30px;  }
.encyclic_text>span{ font-weight: 500; font-size: 17px; color: #555;  }
.encyclic_table1{width: 100%;  margin-bottom: 20px;}
.encyclic_table1 th{background: #fafafa; font-size: 13px; text-align: center; border: 1px solid #ccc; font-weight: 500; padding:5px; }
.encyclic_table1 td{font-size: 13px; text-align: center; border: 1px solid #ccc; font-weight: 400; padding:10px; line-height:20px;}

.encyclic_table2{width: 100%;  }
.encyclic_table2 td{ background: #fafafa; font-size: 13px; text-align: center; border: 1px solid #ccc; font-weight: 400; padding:5px; line-height: 20px; }

.encyclic_table3{width: 100%;  margin-bottom: 20px;}
.encyclic_table3 th{background: #fafafa; font-size: 13px; text-align: center; border: 1px solid #ccc; font-weight: 500; padding:5px; }
.encyclic_table3 td{font-size: 13px; text-align: center; border: 1px solid #ccc; font-weight: 400; padding:10px; line-height:20px;}

.encyclic_img{width: 100%; }
.encyclic_img>img{width: 100%; }

.location_img1{width: 100%; border: 1px solid #ccc; overflow:hidden; margin-bottom: 50px; }
.location_img1>img{width: 100%; }
.location_title{font-size: 23px; font-weight: 700; color: #353535; letter-spacing:-0.7px;  margin-bottom: 30px; }
.location_title>img{width: 20%; margin-right:5px; }
.location_text{font-size:14px; font-weight: 400; color: #353535; letter-spacing:-0.7px; line-height: 35px; }
.location_text1{font-size:14px; font-weight: 400; color: #353535; letter-spacing:-0.7px; line-height: 25px; }
.location_t{font-size: 20px; font-weight: 500; }
.location_t1{font-size: 18px; font-weight: 500; }
.location_n{ font-size: 14px; font-weight: 500; display: inline-block;  height:25px; line-height:25px; color: #fff;  background:#e4322b; padding:0 5px; border-radius: 20px; }

.location_wrap:after{display: block;content: "";clear: both;}
.location_s{display: inline-block;  height:25px; line-height:25px; color: #fff;  background:#8b00e7; padding:0 10px; border-radius: 20px; }

.join_box{width: 100%; height: auto; background:#f3f9ff; padding:20px; }
.text_o{position: relative; top: -2px; display: inline-block; width: 10px; height: 10px; background:#d30800;margin-right:10px; }
.join_t{ width: 100%; margin:0 auto; padding: 10px; font-size: 14px; font-weight: 500; color: #666; background: #fff; text-align: center; }

.organizationchart_title{ color: #000; font-size:21px; font-weight: 400; margin-bottom: 10px;  }
.organizationchart_title>span{position: relative; top:-5px; display: inline-block; width: 8px; height: 8px; background:#e4322b; margin-right: 6px;}
.organizationchart_table1{ width: 100%;}
.organizationchart_table1 th{ color: #353535; font-size: 14px; font-weight: 400; text-align: center; padding: 7px; border: 1px solid #ccc; background: #fafafa; }
.organizationchart_table1 td{ color: #666; font-size: 12px; font-weight: 400; text-align: center; padding: 7px; border: 1px solid #ccc; }

/* about 추가 */
#about {text-align: center ;}
#about .top {width: 100%; height: 150px; background: url('../images/sub/ab_top.jpg') no-repeat 0% 50%;   background-size: cover;}
#about .w_box {width: 100%; background-color: #fff; position: relative; z-index: 2; padding:30px 0 0; margin:-0 auto 0; }
#about h1 {margin:0; font-size:24px; color:#000; font-weight: 500; word-break: keep-all; line-height: 35px;}
#about h2 {margin:15px 0 0; font-size:16px; font-weight: 300 ;color:#000; }
#about h2::after {content: ''; display: block ; width: 40px; height: 2px ;background-color: #e4322b; margin:25px auto;}
#about p {    font-size: 14px; font-weight:300; color: #333; text-align: center; letter-spacing: -0.4px; line-height:26px; word-break: keep-all;}