@charset "utf-8";

/*------------------------------------------------------------------------------------------------------------------------------------------
	File : UI_Style.CSS 
	Company : The Webstyle co.,ltd 
 	Author : Jong Hoon, Park 2015-12
 	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 
--------------------------------------------------------------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------------
                                         * select *
-------------------------------------------------------------------------------------------*/
select {
	min-width:70px;
	height:32px;
	padding:6px 19px 6px 6px; 
	padding-right:5px\9;
	border:1px solid #A4A4A4;
	font-size:12px;
	color:#999;
	-webkit-appearance:none; 
	-moz-appearance:none;
	-o-appearance:none;
	appearance:none;
	background:url('/Images/Common/ico_select_arrow.gif') right center no-repeat;
	background:none\9;
	background-size:19px 5px;
	background-color:#fff;
}


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

input[type=text], input[type=password] {
	height:32px;
	padding:6px; 
	border:1px solid #A4A4A4;
	color:#666;
	font-size:12px;
	line-height:20px; 
	vertical-align:middle; 
	background-color:#ffffff;
}


/*------------------------------------------------------------------------------------------
                                         * textarea *
-------------------------------------------------------------------------------------------*/
textarea {width:100%; padding:10px; height:100%; border:1px solid #CDCDCD; vertical-align:middle;
	font-size:13px; line-height:19px; color:#666; resize:none;
	box-sizing:border-box; 
	-moz-box-sizing:border-box; 
	-webkit-box-sizing:border-box;
	-webkit-transition-property: width;
	-moz-transition-property: width;
	transition-property: width;
	-webkit-transition-duration: 0.5s, 0.5s;
	-moz-transition-duration: 0.5s, 0.5s;
	transition-duration: 0.5s, 0.5s; 
	-webkit-transition-timing function: linear, ease-in;
	-moz-transition-timing function: linear, ease-in; 
	transition-timing function: linear, ease-in;
}


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

/* Button */
button {overflow:visible; padding:0px; border:0px; cursor:pointer; outline:none; }
button::-moz-focus-inner {border:0px; padding:0px;}
button>span {position:relative;}

.btn {position:relative; display:inline-block; *display:inline; *zoom:1; vertical-align:middle; cursor:pointer; text-align:center;
	box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;
}


/*------------------------------------------------------------------------------------------
                                         * Table *
-------------------------------------------------------------------------------------------*/
/* Table Element (TH, TD)*/
th {color:#666; font-size:13px; text-align:center;}
td {color:#333; font-size:13px; text-align:center;}
td a:hover {color:#333;}

table .ellipsis {display:inline-block; overflow:hidden; width:100%; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle;}


/*------------------------------------------------------------------------------------------
                                         * Tab *
-------------------------------------------------------------------------------------------*/
ul.tab_type1 {overflow:hidden; border-bottom:1px solid #DCDCDC;}
ul.tab_type1 li {float:left; width:25%; text-align:center;}
ul.tab_type1 li a {display:block; margin-left:1px; padding:25px 0; border-bottom:5px solid #CCC; font-size:18px; color:#666;}
ul.tab_type1 li a:hover, ul.tab_type1 li.on a {border-bottom:5px solid #0076BA; color:#333;}
ul.tab_type1 li:first-child a {margin-left:0;}


/*------------------------------------------------------------------------------------------
                                         * UL_type *
-------------------------------------------------------------------------------------------*/
.ul_type1 {overflow:hidden;}
.ul_type1.margin_b30 li {margin-bottom:30px;}
.ul_type1 li {position:relative;}
.ul_type1 li .num {position:absolute; left:0px; top:0px; width:40px; height:40px; line-height:40px; background-color:#0076ba; color:#fff; text-align:center}
.ul_type1 li .explain {padding-left:60px;}