@charset "utf-8";

/*------------------------------------------------------------------------------------------------------------------------------------------
	File : UI_Style.CSS 
	Company : The Webstyle co.,ltd 
 	Author : Woo Seok, Shin 2015-07
 	CSS 적용순서 : 아이디 > 태그와 클래스 > 클래스 > 태그
	CSS 선택자 선언순서 : Type Selector, Layout Selector, Class Selector, Etc
	CSS 속성 선언순서 : display, position, float/clear, overflow, width/height, margin/padding, border, background, color/font, align, etc 
--------------------------------------------------------------------------------------------------------------------------------------------*/

/* UI_Style.css*/

/* a */
a {color:#444444; text-decoration:none;}
a:active, visited, link {color:#444444;}
a:hover {color:#444444;}

a.link {text-decoration:underline;}
a.link_download {color:#0079c1;}
a.anchor,
area.anchor {cursor:pointer;}

/* select */  
select {	
	min-width:70px;
	min-width:70px\9;
	height:40px;
	padding:2px 40px 2px 15px; 	
	border:1px solid #dfe2e7;	
	font-size:15px;
	line-height:38px;
	color:#444; 
	appearance:none;
	-webkit-appearance:none; 
	-moz-appearance:none;
	-o-appearance:none;		
	background:url('/Images/Common/ico_select_arrow.png') right center no-repeat;
	background:none\9;
	background-color:#fff;
}
:root select {padding:6px 9px 6px 15px \0/IE9; font-size:15px \0/IE9;}

select::-ms-expand {display:none;}

select:focus {border:1px solid #0079c1;}

.select_wrap {display:inline-block; *display:inline; *zoom:1; position:relative; z-index:1;}

/* Layer Select */
.selectBox {display:inline-block; position:relative; min-width:60px; height:40px; text-align:left; background-color:#fff;}
.selectBox a {display:block; padding:0px 10px; font-family:"NotoSansLight"; font-size:13px; line-height:24px; color:#666;}
.selectBox .selectVal {
	height:40px;
	padding:8px 36px 8px 11px;  
	border:1px solid #222; 	
	background:url('/Images/Common/ico_selectBox_arrow.gif') right center no-repeat;		
}
.selectBox .selectVal a {vertical-align:middle;}
.selectBox .selectVal a:focus {color:#fff; background-color:#3399FF;}
.selectBox .selectMenu {
	display:none; 
	position:absolute; 
	left:0;
	z-index:100;
	width:100%;
	padding:12px 11px 0px 11px;  
	border:1px solid #222;
	background-color:#fff;
	box-sizing:border-box; 
	-moz-box-sizing:border-box; 
	-webkit-box-sizing:border-box; 
	-o-box-sizing:border-box;						
}

/* input */
input {	
	border:0px;
	box-sizing:border-box; 
	-moz-box-sizing:border-box; 
	-webkit-box-sizing:border-box; 
	-o-box-sizing:border-box;			
}

input[type=radio], input[type=checkbox] {border:none;}
input[type=text], input[type=password] {
	padding:12px 15px; 
	border:1px solid #dfe2e7;
	background-color:#ffffff;
	appearance:none;
	-webkit-appearance:none; 
	-moz-appearance:none;
	-o-appearance:none;		
}
input[type=text]:focus, input[type=password]:focus {border:1px solid #0079c1;}

/* Placeholder Color */
:-ms-input-placeholder {color:#727272;} /* IE 10 + */
::-webkit-input-placeholder {color:#727272;} /* Webkit Browser */
:-moz-placeholder {color:#727272;}	/* Mozilla Firefox 4 to 18*/
::-moz-placeholder {color:#727272;} /* Mozilla Firefox 19+ */

.input_wrap {display:inline-block; *display:inline; *zoom:1; position:relative; z-index:1;}
.input_wrap.placeholder input {background-color:transparent\9;}
.input_wrap.placeholder input:focus {background-color:#ffffff\9;}
.input_wrap.placeholder label {	
	display:none;
	display:block\9;
	position:absolute; 
	left:0px; 
	top:1px;
	z-index:-1; 
	width:100%; 
	height:40px;
	padding:5px 15px; 	
	font-family:"NotoSansLight"; 
	font-size:15px;
	line-height:29px;
	color:#727272;
	text-align:left;
}

/* input datepicker */
.input_date_wrap {display:inline-block;}
.input_date {display:inline-block; *display:inline; *zoom:1; position:relative; line-height:38px !important;}
.input_date .btn_datepicker {display:block; position:absolute; top:10px; right:10px; z-index:5; width:20px; height:21px; text-indent:-9999px; background:url('/Images/Common/ico_btn_calendar.gif') center center no-repeat;}
.input_date input {padding-right:15px;}
.input_date input::-ms-clear {display:none;}


/* input size */
input.size122 {width:122px;}
input.size276 {width:276px;}
input.size775 {width:775px;}

textarea {
	padding:4px 10px; 
	border:1px solid #dfe2e7;
	font-family:"Dotum";
	font-size:12px; 
	color:#444;
	line-height:18px;	
}

/*----- Button -----*/
.btn_wrap {*zoom:1; position:relative; text-align:center;}
.btn_wrap:after {content:""; display:block; clear:both;}
.btn_wrap.right {text-align:right;}
.btn_wrap.left {text-align:left;}
.btn_wrap .btn_left {float:left;}
.btn_wrap .btn_right {float:right;}

.btn {
	position:relative; 
	display:inline-block; *display:inline; *zoom:1;
	cursor:pointer;		
	/*border-radius:4px;*/
	text-align:center;
	box-sizing:border-box; 
	-moz-box-sizing:border-box; 
	-webkit-box-sizing:border-box;
	-o-box-sizing:border-box;
}
.btn>span {display:block; position:relative; height:100%;}

.btn.sml {height:28px; padding:0 10px; font-family:"NanumGothic Bold"; font-size:13px; line-height:27px;}
.btn.mid {height:40px; padding:0 15px; font-family:"NanumGothic Bold"; font-size:15px; line-height:38px;}
.btn.big {height:60px; padding:0 58px; font-family:'NanumGothic Bold'; font-size:18px; line-height:58px;}
.btn.big.on {border:1px solid #dfdfdf}

.btn.gray {background-color:#ebedf1; color:#555;}
.btn.dGray {background-color:#999ca4; color:#fff;}

/* Icon */

/* Board Pager */
.board_pager_wrap {position:relative; margin-top:50px; margin-bottom:50px; text-align:center;}
.board_pager {display:inline-block; *display:inline; *zoom:1; overflow:hidden;}
.board_pager .boardNav {display:inline-block; *display:inline; *zoom:1; float:left;}
.board_pager .boardNav li {float:left; margin:0 2px;}
.board_pager .boardNav a {display:block; width:40px; height:40px; text-indent:-9999px;}
.board_pager .boardNav a.btn_prev {background:url('/Images/Common/btn_pager_prev.png') center 0 no-repeat;}
.board_pager .boardNav a.btn_next {background:url('/Images/Common/btn_pager_next.png') center 0 no-repeat;}

.board_pager .boardPage {float:left; overflow:hidden; margin:0 5px;}
.board_pager .boardPage li {float:left; margin:0 2px;}
.board_pager .boardPage li a {display:block; min-width:40px; height:40px; font-family:'NanumGothic Bold'; font-size:13px; color:#666; line-height:40px; padding:0 5px;}
.board_pager .boardPage li:hover a,
.board_pager .boardPage li.on a {font-size:14px; color:#fff; background-color:#999ca4;}

.board_pager.mob {display:none; overflow:hidden;}
.board_pager.mob .boardPage {display:inline-block; height:25px; padding:0 2px; font-size:13px; color:#666; line-height:23px;}
.board_pager.mob .boardPage .page {color:#0079c1;}

/* Board move */
.board_move {}
.board_move li {padding:22px 30px; background-color:#f3f5f9; border:1px solid #edeef1;}
.board_move li span {margin-right:30px; font-family:'NanumGothic Bold'; font-size:16px; color:#333;}
.board_move li a {font-size:16px; color:#333;}

/* Board Button */
.board_btn {display:inline-block; *display:inline; *zoom:1; position:absolute; top:0px;}
.board_btn.right {right:0px;}
.board_btn.left {left:0px;}

/* Tab */
.tap_type1 .tap_header {}
.tap_type1 .tapMenu {overflow:hidden}
.tap_type1 .tapMenu li {width:50%; float:left;}
.tap_type1 .tapMenu.num3 li {width:33.33%;}
.tap_type1 .tapMenu.partition_four li {width:25%;}
.tap_type1 .tapMenu li {}
.tap_type1 .tapMenu li a {border-bottom:2px solid #444; border-left:1px solid #444; border-top:1px solid #444;}
.tap_type1 .tapMenu li.on {border-bottom:0px; }
.tap_type1 .tapMenu li.on a {border-bottom:0px; border-left:2px solid #444; border-top:2px solid #444; border-right:1px solid #444;}
.tap_type1 .tapMenu li a {display:block; height:70px; line-height:70px;  font-family:'NanumGothic Bold'; font-size:18px; color:#8f8f8f; text-align:center;}
.tap_type1 .tapMenu li:last-child a {border-right:1px solid #444;}
.tap_type1 .tapMenu li:last-child.on a {border-right:2px solid #444;}

.tap_type1 .tapMenu li.on a {
	background:url('/Images/Common/ico_tapMenu.png') right center no-repeat;
	color:#000;
}
.tap_type1 .tapMenu li.bor_l0 a {border-left:0px !important}
.tap_type1 .tapMenu li.bor_l2 a {border-left:2px solid #444 !important;}
.tap_type1 .tapMenu li.bor_r0 a {border-right:0px !important}
.tap_type1 .tapMenu li.bor_r2 a {border-right:2px solid #444 !important;}
.tap_type1 .tap_body {padding:60px 0 50px 0;}

.tapMenu_type2 {position:relative;}
.tapMenu_type2 a.home {position:absolute;left:0px; top:0px;}
.tapMenu_type2 ul {overflow:hidden; padding-left:50px;}
.tapMenu_type2 ul li {float:left;}
.tapMenu_type2 ul li a {display:block; width:186px; height:50px; line-height:50px; border:1px solid #edeef1; border-left:0px; font-family:'NanumGothic Bold'; font-size:18px; color:#333; text-align:center;}
.tapMenu_type2 ul li a.on {background-color:#f3f5f9; border-bottom:0px;}

/* ico */
.ico {display:inline-block;}
.ico.ico_secret_close {width:15px; height:17px; margin-left:10px; background:url('/Images/Common/ico_secret_close.png') 0 0 no-repeat;}
.ico.ico_secret_open {width:15px; height:17px; margin-left:10px; background:url('/Images/Common/ico_secret_open.png') 0 0 no-repeat;}
.ico.ico_arrow_sml_r { width:8px; height:15px; margin:2px 0 0 10px; background:url('/Images/Common/ico_arrow_sml_r.png') 0 0 no-repeat;}
/* UL, OL List */
ul.li_type1 li {padding-left:12px; background:url('/Images/Common/ico_li_type1.png') 0 8px no-repeat;}
ul.li_type2 li {padding-left:8px; background:url('/Images/Common/ico_li_type2.png') 0 12px no-repeat;}




/* BxSlider */
.bx-wrapper .bx-controls-direction a {width:40px; height:81px; margin-top:-40px;}
.bx-wrapper .bx-prev {left:-90px; background:url('/Images/StudySystem/btn_silder_prev.png') no-repeat 0 0;}
.bx-wrapper .bx-next {right:0px; background:url('/Images/StudySystem/btn_silder_next.png') no-repeat 0 0;}

.bx-wrapper .bx-pager {display:none;}