@CHARSET "UTF-8";
@import url(//static.izikimi.com/font/NotoSansKR-Hestia/NotoSansKR-Hestia.css?Ver=2019012900);

body															{ font-family: "Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic","맑은 고딕",Dotum,"돋움",sans-serif; color: #777777; font-weight: 350; position: relative; }
a:link															{ color: #777777; text-decoration:none; }
a:visited														{ color: #777777; text-decoration:none; }
a:hover															{ color: #555555; text-decoration:underline; }
a:active														{ color: #555555; text-decoration:underline; }

a.text-bold														{ font-weight: 500; }
a.text-underline												{ text-decoration: underline; }

a.text-red:link													{ color: #C6262C; }
a.text-red:visited												{ color: #C6262C; }
a.text-red:hover												{ color: #C6262C; }
a.text-red:active												{ color: #C6262C; }

a.text-blue:link												{ color: #0080BB; }
a.text-blue:visited												{ color: #0080BB; }
a.text-blue:hover												{ color: #0080BB; }
a.text-blue:active												{ color: #0080BB; }

/*******************************************************************************
 * 기본 테이블 스타일 정의.
 ******************************************************************************/
table															{ width: 100%; border-top: 2px solid #4c4c4c; border-bottom: 1px solid #d3d3d3; table-layout: fixed; font-size: 14px; }
table th														{ padding: 7px 0 7px 0; border-bottom: 1px solid #d3d3d3; border-right: 1px solid #d3d3d3; text-align: center; background: #f8f8f8; font-weight: 500; }
table tr.no-vertical-border th									{ border-right-width: 0; }
table td														{ padding: 7px 0 7px 0; border-bottom: 1px solid #d3d3d3; border-right: 1px solid #d3d3d3; text-align: center; word-wrap: break-word; }
table tr.no-vertical-border td									{ border-right-width: 0; }
table th.two-line, table td.two-line							{ padding: 4px 0 4px 0; line-height: 110%; }
table th:last-child												{ border-right: none; }
table td:last-child												{ border-right: none; }
table th:last-child.right-border								{ border-right: 1px solid #d3d3d3; }
table td:last-child.right-border								{ border-right: 1px solid #d3d3d3; }
table th.bottom-border-dark,	table td.bottom-border-dark		{ border-bottom: 1px solid #4c4c4c; }

table.th-center-align th,		table.td-center-align td		{ text-align: center; padding-left: 0px; padding-right: 0px; }
table.th-left-align th,			table.td-left-align td			{ text-align: left; padding-left: 12px; }
table.th-right-align th,		table.td-right-align td			{ text-align: right; padding-left: 12px; }
table thead.th-center-align th,	table thead.td-center-align td	{ text-align: center; padding-left: 0px; padding-right: 0px; }
table thead.th-left-align th,	table thead.td-left-align td	{ text-align: left; padding-left: 12px; }
table thead.th-right-align th,	table thead.td-right-align td	{ text-align: right; padding-left: 12px; }
table tbody.th-center-align th,	table tbody.td-center-align td	{ text-align: center; padding-left: 0px; padding-right: 0px; }
table tbody.th-left-align th,	table tbody.td-left-align td	{ text-align: left; padding-left: 12px; }
table tbody.th-right-align th,	table tbody.td-right-align td	{ text-align: right; padding-left: 12px; }
table th.center-align,			table td.center-align			{ text-align: center; padding-left: 0px; padding-right: 0px; }
table th.left-align,			table td.left-align				{ text-align: left; padding-left: 12px; }
table th.justify-align,			table td.justify-align			{ text-align: justify; padding-left: 12px; }
table th.right-align,			table td.right-align			{ text-align: right; padding-right: 12px; }

/*******************************************************************************
 * 일반적인 <div> element에 적용되는 클래스 정의.
 ******************************************************************************/
div.square-box							{ padding: 10px; background-color: #FAFAFA; border: 1px solid #DDDDDD; }
div.round-box							{ padding: 10px; background-color: #FAFAFA; border: 1px solid #DDDDDD; border-radius: 5px; }
div.red-square-box						{ padding: 10px; background-color: #FFFFFF; border: 1px solid #C6262C; }
div.text-black							{ color: #2F2F2F; }

/* 이하 Deprecated. */
div.SquareBox							{ padding: 10px; background-color: #FAFAFA; border: 1px solid #DDDDDD; }
div.RoundBox							{ padding: 10px; background-color: #FAFAFA; border: 1px solid #DDDDDD; border-radius: 5px; }
div.SummaryBox							{ border-top: 3px solid #C6262C; border-bottom: 1px solid #d3d3d3; padding-top: 10px; padding-bottom: 10px; box-shadow: inset 0 7px 7px -7px #777777, inset 0 -9px 9px -9px #E3E3E3; }
div.RedTopLineBox						{ border-bottom: 1px solid #DDDDDD; border-left: 1px solid #DDDDDD; border-right: 1px solid #DDDDDD; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; background: url('../image/RedTopLineBoxBackground.png') repeat-x; background-color: #FAFAFA; }
div.RightAlign							{ text-align: right; }
div.CenterAlign							{ text-align: center; }
div.MarginTop5							{ margin-top: 5px; }
div.MarginTop10							{ margin-top: 10px; }
div.MarginBottom5						{ margin-bottom: 5px; }
div.MarginBottom10						{ margin-bottom: 10px; }
div.MarginBottom20						{ margin-bottom: 20px; }
div.MarginBottom50						{ margin-bottom: 50px; }

/*******************************************************************************
 * 일반적인 <span> element에 적용되는 클래스 정의.
 ******************************************************************************/
span.text-black							{ color: #2F2F2F; }
span.text-red							{ color: #C6262C; }
span.text-orange						{ color: #FF5001; }
span.text-blue							{ color: #0080BB; }
span.text-green							{ color: #5bb500; /*64c800;*/ }

span.text-bold							{ font-weight: 500; }
span.text-underline						{ text-decoration: underline; }
span.text-red-dot						{ padding-left: 10px; background:url('/image/customer/pop_dot.gif') no-repeat 0 8px; }
span.text-gray-dot						{ padding-left: 10px; background: url('/image/customer/service_dot.gif') no-repeat 0 8px; }
span.text-line-through					{ text-decoration: line-through; }

span.text-size-15px						{ font-size: 15px; }
span.text-size-16px						{ font-size: 16px; }
span.text-size-18px						{ font-size: 18px; }
span.text-size-20px						{ font-size: 20px; }
span.text-size-22px						{ font-size: 22px; }
span.text-size-24px						{ font-size: 24px; }
span.text-size-26px						{ font-size: 26px; }
span.text-size-28px						{ font-size: 28px; }
span.left-margin-5px					{ margin-left: 5px; }
span.left-margin-10px					{ margin-left: 10px; }
span.right-margin-5px					{ margin-right: 5px; }
span.right-margin-10px					{ margin-right: 10px; }

/* 이하 Deprecated. */
span.RedDot								{ padding-left: 10px; font-size: 0.95em; background:url('/image/customer/pop_dot.gif') no-repeat left 4px; }
span.GrayDot							{ padding-left: 10px; font-size: 0.95em; background: url('/image/customer/service_dot.gif') no-repeat 0 4px; }
span.MarginLeft20						{ margin-left: 20px; }
span.MarginRight20						{ margin-right: 20px; }
span.Red								{ color: #C6262C; }
span.Orange								{ color: #FF5001; }
span.Blue								{ color: #0080BB; }
span.LightGray							{ color: #999999; }
span.Bold								{ font-weight: bold; }
span.NanumGothic						{ font-family: "Nanum Gothic", sans-serif; }
span.NormalSizeFont						{ font-size: 1em; }
span.LargeText							{ font-size: 2em; }
span.NeutralFont						{ font-family: "돋움", "굴림", sans-serif; }

/*******************************************************************************
 * select, option 클래스.
 ******************************************************************************/
select.text-black						{ color: #2F2F2F; }
select.text-orange						{ color: #FF5001; }
select.text-blue						{ color: #0080BB; }
select.text-green						{ color: #5bb500; }
select.text-bold						{ font-weight: 500; }

option.text-black						{ color: #2F2F2F; }
option.text-orange						{ color: #FF5001; }
option.text-blue						{ color: #0080BB; }
option.text-green						{ color: #5bb500; }

/*******************************************************************************
 * 빨간 네모를 bullet으로 하는 ul 스타일.
 ******************************************************************************/
ul.red-square-list						{ list-style: none; margin: 0; padding: 0; }
ul.red-square-list li					{ background: url('/image/RedSquareDot.png') no-repeat 0px 14px; font-size: 16px; line-height: 2; padding-left: 20px; margin-bottom: 0; text-align: justify; }

ul.red-square-list-16px					{ list-style: none; margin: 0; padding: 0; }
ul.red-square-list-16px li				{ background: url('/image/RedSquareDot.png') no-repeat 0px 14px; font-size: 16px; line-height: 2; padding-left: 20px; margin-bottom: 0; text-align: justify; }

ul.red-square-list-14px					{ list-style: none; margin: 0; padding: 0; }
ul.red-square-list-14px li				{ background: url('/image/RedSquareDot.png') no-repeat 0px 8px; font-size: 14px; line-height: 22px; padding-left: 20px; margin-bottom: 0; text-align: justify; margin-bottom: 4px; }
ul.red-square-list-14px li:last-child	{ margin-bottom: 0; }

/*******************************************************************************
 * 회색 점을 bullet으로 하는 ul 스타일.
 ******************************************************************************/
ul.gray-dot-list						{ list-style: none; margin: 0; padding: 0; }
ul.gray-dot-list li						{ background: url('/image/GrayDot.gif') no-repeat 0px 9px; font-size: 14px; line-height: 1.5; padding-left: 8px; margin-bottom: 0; text-align: justify; }

/*******************************************************************************
 * 빨간 선이 왼쪽에 세로로 그어져 있는 div 스타일.
 ******************************************************************************/
div.red-bar-block						{ border-left: 6px solid #C6262C; padding-left: 15px; margin-bottom: 20px; }

/*******************************************************************************
 * Bootstrap 3 form 레이블.
 ******************************************************************************/
div.form-group > label.control-label	{ font-weight: 500; color: #333333; }

/*******************************************************************************
 * Bootstrap 3 빨간 버튼. btn-red.
 * http://blog.koalite.com/bbg/
 ******************************************************************************/

.btn-red {
	color: #FFFFFF;
	background-color: #d44247;
	border-color: #C6262C;
}

.btn-red:link,
.btn-red:hover,
.btn-red:focus,
.btn-red:active,
.btn-red:visited,
.btn-red.active,
.open .dropdown-toggle.btn-red {
	color: #FFFFFF;
	background-color: #C6262C;
	border-color: #C6262C;
}

.btn-red:active,
.btn-red.active,
.open .dropdown-toggle.btn-red {
	background-image: none;
}

.btn-red.disabled,
.btn-red[disabled],
fieldset[disabled] .btn-red,
.btn-red.disabled:hover,
.btn-red[disabled]:hover,
fieldset[disabled] .btn-red:hover,
.btn-red.disabled:focus,
.btn-red[disabled]:focus,
fieldset[disabled] .btn-red:focus,
.btn-red.disabled:active,
.btn-red[disabled]:active,
fieldset[disabled] .btn-red:active,
.btn-red.disabled.active,
.btn-red[disabled].active,
fieldset[disabled] .btn-red.active {
	background-color: #d44247;
	border-color: #C6262C;
}

.btn-red .badge {
	color: #d44247;
	background-color: #FFFFFF;
}

/*******************************************************************************
 * Bootstrap 3 검정 버튼. btn-black.
 * http://blog.koalite.com/bbg/
 ******************************************************************************/

.btn-black {
	color: #FFFFFF;
	background-color: #3D3D3D;
	border-color: #444444;
}

.btn-black:link,
.btn-black:hover,
.btn-black:focus,
.btn-black:active,
.btn-black:visited,
.btn-black.active,
.open .dropdown-toggle.btn-black {
	color: #FFFFFF;
	background-color: #444444;
	border-color: #444444;
}

.btn-black:active,
.btn-black.active,
.open .dropdown-toggle.btn-black {
	background-image: none;
}

.btn-black.disabled,
.btn-black[disabled],
fieldset[disabled] .btn-black,
.btn-black.disabled:hover,
.btn-black[disabled]:hover,
fieldset[disabled] .btn-black:hover,
.btn-black.disabled:focus,
.btn-black[disabled]:focus,
fieldset[disabled] .btn-black:focus,
.btn-black.disabled:active,
.btn-black[disabled]:active,
fieldset[disabled] .btn-black:active,
.btn-black.disabled.active,
.btn-black[disabled].active,
fieldset[disabled] .btn-black.active {
	background-color: #3D3D3D;
	border-color: #444444;
}

.btn-black .badge {
	color: #3D3D3D;
	background-color: #FFFFFF;
}

/*******************************************************************************
 * Bootstrap 3 회색 버튼. btn-gray.
 * http://blog.koalite.com/bbg/
 ******************************************************************************/

.btn-gray {
	color: #ffffff;
	background-color: #949494;
	border-color: #949494;
}

.btn-gray:link,
.btn-gray:hover,
.btn-gray:focus,
.btn-gray:active,
.btn-gray:visited,
.btn-gray.active,
.open .dropdown-toggle.btn-gray {
	color: #ffffff;
	background-color: #949494;
	border-color: #949494;
}

.btn-gray:active,
.btn-gray.active,
.open .dropdown-toggle.btn-gray {
	background-image: none;
}

.btn-gray.disabled,
.btn-gray[disabled],
fieldset[disabled] .btn-gray,
.btn-gray.disabled:hover,
.btn-gray[disabled]:hover,
fieldset[disabled] .btn-gray:hover,
.btn-gray.disabled:focus,
.btn-gray[disabled]:focus,
fieldset[disabled] .btn-gray:focus,
.btn-gray.disabled:active,
.btn-gray[disabled]:active,
fieldset[disabled] .btn-gray:active,
.btn-gray.disabled.active,
.btn-gray[disabled].active,
fieldset[disabled] .btn-gray.active {
	background-color: #949494;
	border-color: #949494;
}

.btn-gray .badge {
	color: #949494;
	background-color: #ffffff;
}

/*******************************************************************************
 * Bootstrap 3의 label class의 font-weight 기본값이 700이어서 500으로 수정함.
 *******************************************************************************/
.label {
	font-weight: 500;
}

/*******************************************************************************
 * Bootstrap 3 주황색 label. 적용해보니 너무 진해서 현재 사용하지는 않음.
 * https://stackoverflow.com/questions/21725557/additional-twitter-bootstrap-label-button-alert-badge-colors
 ******************************************************************************/
.label-orange {
	background-color: #FF5001;
}
.label-orange[href]:hover,
.label-orange[href]:focus {
	background-color: #FF5001;
}