﻿/* 기본값
----------------------------------------------------------*/
html {
    margin: 0;
    padding: 0;
}
body {
    font-size: .75em;
    font-family: 돋움, 맑은 고딕, Arial;
    margin: 0;
    padding: 0;
}
a:link
{
	text-decoration: none;
}
a:visited
{
	text-decoration: none;
}
a:hover
{
	text-decoration: none;
}
a:active
{
	text-decoration: none;
}
p, ul
{
	margin-bottom: 20px;
	line-height: 1.6em;
}

/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3,
h4, h5, h6 {
    color: #000;
    margin-bottom: 0;
    padding-bottom: 0;
}

h1 {
    font-size: 2em;
}

h2 {
    font-size: 1.75em;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

h5, h6 {
    font-size: 1em;
}

    h5 a:link, h5 a:visited, h5 a:active {
        padding: 0;
        text-decoration: none;
    }
/* this rule styles <h2> tags that are the 
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2
{
	margin-top: 0;
}

/* sub layout
/*---------------------------------------------------------------*/
.ui-layout-pane { 
	border:	0px; 
} 
		
.ui-layout-north-pane { 
	overflow:hidden;
	background-color: #FFFFFF;
} 	
		
.ui-layout-west-pane { 
	background:	#e4ecf8;
} 	
		
.ui-layout-center-pane  
{
	background-color: #e4ecf8;
} 

.ui-layout-south-pane  
{
	background-color: #ffffff;
} 
	
.ui-layout-resizer {
	background:	#3ec2f9; 
} 
	
.ui-layout-toggler {
	background:	#D1D7E3;
	background-color: #FFF;
}
		
.ui-layout-toggler-west .ui-icon ,
.ui-layout-toggler-east .ui-icon { margin-left: -15px; } /* tweak arrow horizontal-center */
.ui-layout-toggler-west-closed .ui-icon,
.ui-layout-toggler-east-open .ui-icon {
	background-position: -48px -192px; /* ui-icon-circle-triangle-e */
	background-position: -144px -16px; /* ui-icon-triangle-2-e-w */
	background-position: -32px -16px; /* ui-icon-triangle-1-e */
}
.ui-layout-toggler-east-closed .ui-icon,
.ui-layout-toggler-west-open .ui-icon {
	background-position: -80px -192px; /* ui-icon-circle-triangle-w */
	background-position: -144px -16px; /* ui-icon-triangle-2-e-w */
	background-position: -96px -16px; /* ui-icon-triangle-1-w */
}

.ui-layout-north-pane-inner
{
	background: #e4ecf8;
}

.ui-layout-center-pane-inner
{
	overflow:hidden; 
	background: #e4ecf8;
}

.ui-layout-south-pane-inner
{
	overflow:hidden; 
	background: #e4ecf8;
}

.ui-layout-south-pane-inner a 
{
	margin-right: 5px;
	display: block;
	float: left;
	cursor: hand;
	font-weight: normal;
	font-size: 1.0em;
	line-height : 1.8em;
    font-family: 돋움, 맑은 고딕, Arial;
	color: #555;
	text-align: center;
	background-attachment: fixed;
	border-width: 0;
	border-style: none;
	width: 57px;
	height: 23px;
	background: url("/Content/images/btn4bl.gif") no-repeat 0px 0px;
}
.ui-layout-south-pane-inner a:hover {background: url("/Content/images/btn4or.gif") no-repeat 0px 0px;color: #000;}

.ui-layout-north { padding: 0em; margin: 0em; }
.ui-layout-west { padding: 0em; margin: 0em; }
.ui-layout-center { padding: 0em; margin: 0em; }
.ui-layout-south { padding: 0em; margin: 0em; }
.ui-layout-resizer { background-color: #3ec2f9; }

/* main layout
----------------------------------------------------------*/
#header, #footer, #hgroup, #nav, #section {
    display: block;
}

#header {
	margin: 0em;
	padding: 0em;
}

	#logo a:link, #logo a:visited, #logo a:hover, #logo a:active
	{
		color: #ffffff;
		text-decoration: none;
	}
	
#body {
	position: fixed;
}

#footer 
{
	margin: 0em;
	padding: 0em;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.clear-fix:after {
    content: ".";
    clear: both;
    display: block;
    height: 0;
    visibility: hidden;
}

.content-wrapper 
{
    width: 100%;
}

#his			{float:left; padding-left:10px; margin-top:0.5em; font-size:1.1em; color:#777; font-family: 돋움, 맑은 고딕, Arial;}
#his strong		{color:#3e59bb;}
#titleBar		{width:100%; height:0px; border-bottom:solid 1px #3ec2f9; display:block; background:#ffffff;}

#Condition	{margin:10px; background:#f2f5fd;}
	#Condition table {width:100%}

#ContentBody {margin:0px 10px 0px 10px;}
#BodyFrame {margin:0px;} 
	#BodyFrame tr td {vertical-align:top;}
	#BodyFrame .ui-jqgrid-btable td {vertical-align:middle;}
.Single {font-size:1.0em; background:#ffffff;}
	.Single table {width:100%}

.SingleInput {font-size:1.0em; background:#DAEEF3;}
	.SingleInput table {width:100%; }
	.SingleInput table th {text-align:center; }
		
.sub_title {border-top:1px solid; border-left:1px solid;}
.sub_title2 {background:#D4E3F2; text-align:center;}
.end_marker {border-right:1px solid;}
		
#Toolbar {margin:10px; padding: 4px; display: inline-block; }

.toolbar {padding: 4px; display: inline-block; }

/* support: IE7 */  
*+html #Toolbar { margin:10px; display: inline;  }

#PopupCondition {margin-bottom:10px; background:#f2f5fd; font-family: 돋움, 맑은 고딕, Arial;}
	#PopupCondition table {width:100%;}
#PopupResult{width:100%;}

#licence { position: relative; top: 16px; left:5px; width:95%;  }

/* site title
----------------------------------------------------------*/
.site-title {
    color: #ffffff;
    margin: 0;
}
/* login
----------------------------------------------------------*/
#login {
    display: inline;
    font-size: 1em;
    margin: 0 0 10px;
    text-align: right;
    float: right;
}

    #login a {
        background-color: #d3dce0;
        margin-left: 10px;
        margin-right: 3px;
        padding: 2px 3px;
        text-decoration: none;
    }

    #login a.username {
        background: none;
        margin: 0;
        padding: 0;
        text-decoration: underline;
    }

    #login ul {
        margin: 0;
    }

    #login li {
        display: inline;
        list-style: none;
    }

/* accordion
----------------------------------------------------------*/
.accordion { list-style-type: none; padding: 0px; margin: 0px;}
.accordion ul { padding: 0px; margin: 0px; float: left; display: block; width: 100%; }
.accordion li { cursor: pointer; list-style-type: none; padding-bottom: 0px; margin: 0px; display: block; width: 100%; background:#ffffff; border-bottom:1px solid #3EC2F9; }
.accordion a { font-size: 1.0em;
               line-height: 2.3em;
               font-family: 돋움, 맑은 고딕, Arial; 
               text-decoration: none; padding: 0px; padding-left:10px; display: block; cursor: pointer; }
.accordion li ul li { font-size: 1em; }

.accordion_normal { background:#ffffff right; color:#000000; }
.accordion_active { background:#3ec2f9; color:#ffffff; }
.accordion_sub_group { background:url('/Content/Images/system/imgOffClosed.gif') no-repeat center right; border-bottom:1px solid #3EC2F9;}

/* help
----------------------------------------------------------*/
#help { list-style:none; position:absolute; bottom:0; left: 0; margin:0px; padding:0px; width:100%; z-index:-1; }
#help_content{ background:#ffffff; border-bottom:1px solid #3ec2f9; }
#help_head{ background:#3ec2f9; color:#ffffff; }
#help h { padding: 0px; margin: 0px; width:100%;}
#help ul { padding: 0px; margin: 0px; width:100%;}
#help li { list-style:none; padding: 2px 5px 1px 5px; margin: 0px; }
#help li img { vertical-align:text-top; border:1px solid #3ec2f9;}

/* menu
----------------------------------------------------------*/
#nav { width: 100%; height: 32px; }
#menu {	margin:0px;	padding:0px; background: #3ec2f9; width:100%; border-top:1px solid #3ec2f9; border-bottom:1px solid #3ec2f9; border-left:0px; border-right:0px; height: 31px; }
#menu li { position: relative; margin:0px; border-top: 0px; border-bottom: 0px; border-right: 1px solid #3ec2f9; border-left: 0px; display:inline; list-style: none; float:left; }
#menu li a { font-weight: 400;
             font-size: 1.1em;
             line-height: 30px;
             font-family: 돋움, 맑은 고딕, Arial; position: relative; padding-left:2em; padding-right:2em; display: block; }
.menu_normal { background:#ffffff; color:#000000; }
.menu_active { background:#6680b0; color:#ffffff; }
        
/* page elements
----------------------------------------------------------*/
/* featured */
.featured {
    background-color: #fff;
}

    .featured .content-wrapper {
        background-color: #7ac0da;
        background-image: -ms-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
        background-image: -o-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
        background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #7ac0da), color-stop(1, #a4d4e6));
        background-image: -webkit-linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
        background-image: linear-gradient(left, #7ac0da 0%, #a4d4e6 100%);
        color: #3e5667;
        padding: 20px 40px 30px 40px;
    }

        .featured hgroup.title h1, .featured hgroup.title h2 {
            color: #fff;
        }

        .featured p {
            font-size: 1.1em;
        }

/* page titles */
hgroup.title {
    margin-bottom: 10px;
}

hgroup.title h1, hgroup.title h2 {
    display: inline;
}

hgroup.title h2 {
    font-weight: normal;
    margin-left: 3px;
}

/* features */
section.feature {
    width: 300px;
    float: left;
    padding: 10px;
}

/* ordered list */
ol.round {
    list-style-type: none;
    padding-left: 0;
}

    ol.round li {
        margin: 25px 0;
        padding-left: 45px;
    }

        ol.round li.zero {
            background: url("../Images/orderedList0.png") no-repeat;
        }

        ol.round li.one {
            background: url("../Images/orderedList1.png") no-repeat;
        }

        ol.round li.two {
            background: url("../Images/orderedList2.png") no-repeat;
        }

        ol.round li.three {
            background: url("../Images/orderedList3.png") no-repeat;
        }

        ol.round li.four {
            background: url("../Images/orderedList4.png") no-repeat;
        }

        ol.round li.five {
            background: url("../Images/orderedList5.png") no-repeat;
        }

        ol.round li.six {
            background: url("../Images/orderedList6.png") no-repeat;
        }

        ol.round li.seven {
            background: url("../Images/orderedList7.png") no-repeat;
        }

        ol.round li.eight {
            background: url("../Images/orderedList8.png") no-repeat;
        }

        ol.round li.nine {
            background: url("../Images/orderedList9.png") no-repeat;
        }

/* content */
article {
    float: left;
    width: 70%;
}

aside {
    float: right;
    width: 25%;
}

    aside ul {
        list-style: none;
        padding: 0;
    }

        aside ul li {
            background: url("../Images/bullet.png") no-repeat 0 50%;
            padding: 2px 0 2px 20px;
        }

    #loginForm input {
        width: 200px;
        margin-bottom: 2px; 
    }
    
    #manageForm input {
        width: 100px;
        margin-bottom: 2px; 
    }

	#homeForm input, #manageForm input, #loginForm input, #chgLangForm input
	{
        font-size: 1em;
	}

	#chgLangForm input
	{
	    float: left;
		display:inline; 
        margin: 0px;		
        padding: 2px;		
	}
	
	#chgLangForm label
	{
	    float: left;
		display:inline; 
        font-size: 1em;
        margin:4px;
	}	

	#manageForm .readonlyFld
	{
		background:#D4E3F2;
	}
    #loginForm .validation-error, #manageForm .validation-error {
        display: block;
        margin-left: 15px;
    }

    #loginForm .validation-summary-errors ul, #manageForm .validation-summary-errors ul {
        margin: 0;
        padding: 0;
    }

    #loginForm .validation-summary-errors li, #manageForm .validation-summary-errors li {
        display: inline;
        list-style: none;
        margin: 0;
    }

    #loginForm input[type="checkbox"],
    #loginForm input[type="submit"],
    #loginForm input[type="button"],
    #loginForm button, 
    #manageForm input[type="checkbox"],
    #manageForm input[type="submit"],
    #manageForm input[type="button"],
    #manageForm button 
    {
        width: auto;
    }

/* contact */
.contact h3 {
    font-size: 1.2em;
}

.contact p {
    margin: 5px 0 0 10px;
}

.contact iframe {
    border: 1px solid #333;
    margin: 5px 0 0 10px;
}

/* forms */
fieldset {
    margin: 0;
    padding: 0;
    font-weight:normal;  
    border:none; 
}    
    fieldset ol {
        padding: 0;
        list-style: none;
    }

    fieldset ol li {
        padding-bottom: 5px;
    }

	fieldset label {
		display: block;
		font-size: 1.0em;
	}

	fieldset label.checkbox {
		display: inline;
	}

	fieldset input, textarea {
		border: 1px solid #e2e2e2;
		background: #fff;
		color: #333;
		font-size: 1.0em;
		margin: 2px 0 2px 0;
		padding: 2px;
	}
	
	fieldset .pop_btn 
	{
		background: red;
		vertical-align:bottom;
		margin-left:-5px;
	}	

	fieldset textarea {
		font-family: inherit;
		width: 200px;
	}

    fieldset input:focus, textarea:focus {
        border: 1px solid #7ac0da;
    }

    fieldset input[type="checkbox"] {
        background: transparent;
        border: inherit;
        width: auto;
    }

    fieldset input[type="submit"],
    input[type="button"],
    button {
        background-color: #d3dce0;
        border: 1px solid #787878;
        cursor: pointer;
        font-size: 1.2em;
        padding: 7px;
        margin-right: 8px;
        width: auto;
    }

    fieldset td input[type="submit"],
    td label,
    td input[type="button"],
    td input[type="radio"],
    td button {
        font-size: 1em;
        padding: 4px;
        margin-right: 4px;
    }
/* info and errors */
.message-info {
    border: 1px solid;
    clear: both;
    padding: 10px 20px;
}

.message-error {
    clear: both;
    color: #e80c4d;
    font-size: 1.1em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.message-success {
    color: #7ac0da;
    font-size: 1.3em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.error {
    color: #e80c4d;
}

/* styles for validation helpers */
.field-validation-error {
    color: #e80c4d;
    font-weight: bold;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #e80c4d;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #e80c4d;
    font-weight: bold;
    font-size: 1.1em;
}

.validation-summary-valid {
    display: none;
}


/* tables
----------------------------------------------------------*/
table {
    border-spacing: 0;
    margin-top: 0.1em;
    margin-bottom: 0.1em;
    border: none 0px;
}

th {
    font-size: 1.0em;
    font-weight: normal;
    text-align: left;
    border: none 0px;
    padding-left: 0;
}

    th a {
        display: block;
        position: relative;
    }

    th a:link, th a:visited, th a:active, th a:hover {
        color: #333;
        text-decoration: none;
        padding: 0;
    }

    th a:hover {
        color: #000;
    }

    th.asc a, th.desc a {
        margin-right: .75em;
    }

    th.asc a:after, th.desc a:after {
        display: block;
        position: absolute;
        right: 0em;
        top: 0;
        font-size: 0.75em;
    }

    th.asc a:after {
        content: '▲';
    }

    th.desc a:after {
        content: '▼';
    }

td {
    padding: 0.01em 0.01em 0.01em 0em;
    border: none 0px;
}

tr.pager td {
    padding: 0 0.25em 0 0;
}

/* forms 공통*/
input.date_field 
{
	width:65px;
	font-family: 돋움, 맑은 고딕, Arial;
}

.number_field 
{
	text-align: right;
}

.data_readonly
{
	background: #D4E3F2;
}

.data_required
{
	background:#D2F6E8;
}

.data_options
{
	background:lightyellow;
}

.data_overflow
{
	color:red;
}

.data_radio
{
    padding-right: 3px;
    float:left; 
}

#separator
{
	width:100%; border-bottom:solid 3px #D4E3F2;
}

.ui-datepicker-trigger, .popup { position:relative; padding-left:2px; top:2px; }   
.ui-datepicker-trigger:hover, .popup:hover { position:relative; padding-left:2px; top:4px; }   

.item_image { padding-top:6px; }

#preview_frame  
{
	position: relative; 
	width: 100%;
	height: 100%;
}

#preview_image
{
	position: absolute; 
}

#image-content
{
	height: 100%;
}

.ui-button-text  
{
	font-weight: normal;
	font-size: 0.9em;
	font-family: 돋움, 맑은 고딕, Arial;  
} /* the overflow property removes extra width in IE */
#ContentTail .ui-button-text  
{
	vertical-align:text-top;
	font-weight: normal;
	font-size: 0.85em;
	font-family: 돋움, 맑은 고딕, Arial;  
} /* the overflow property removes extra width in IE */
.ui-dialog .ui-dialog-content { padding: .3em .0em; }
.ui-th-ltr {font-weight:100; font-family: 돋움, 맑은 고딕, Arial;}
.ui-icon-excel {width: 16px; height: 16px; background-image: url(/Content/images/btnprogram9.gif); }
.tree-line { color:red; }

/*
.ui-jqgrid { -moz-border-radius-topleft: 0px; -webkit-border-top-left-radius: 0px; -khtml-border-top-left-radius: 0px; border-top-left-radius: 0px; }
.ui-jqgrid { -moz-border-radius-topright: 0px; -webkit-border-top-right-radius: 0px; -khtml-border-top-right-radius: 0px; border-top-right-radius: 0px; }
.ui-jqgrid { -moz-border-radius-bottomleft: 0px; -webkit-border-bottom-left-radius: 0px; -khtml-border-bottom-left-radius: 0px; border-bottom-left-radius: 0px; }
.ui-jqgrid { -moz-border-radius-bottomright: 0px; -webkit-border-bottom-right-radius: 0px; -khtml-border-bottom-right-radius: 0px; border-bottom-right-radius: 0px; }
.ui-jqgrid-titlebar { -moz-border-radius-topleft: 0px; -webkit-border-top-left-radius: 0px; -khtml-border-top-left-radius: 0px; border-top-left-radius: 0px; }
.ui-jqgrid-titlebar { -moz-border-radius-topright: 0px; -webkit-border-top-right-radius: 0px; -khtml-border-top-right-radius: 5px; border-top-right-radius: 0px; }
.ui-jqgrid-pager { -moz-border-radius-bottomleft: 0px; -webkit-border-bottom-left-radius: 0px; -khtml-border-bottom-left-radius: 0px; border-bottom-left-radius: 0px; }
.ui-jqgrid-pager { -moz-border-radius-bottomright: 0px; -webkit-border-bottom-right-radius: 0px; -khtml-border-bottom-right-radius: 0px; border-bottom-right-radius: 0px; }
*/

.ui-widget {
	font-size: 0.98em;
}

.ui-th-column div
{
	font-size: 0.98em;
	margin-top: 4px;
}