﻿/***************************************************************************************************
' ID          : default.css
' 작성자      : (주)나우텍아이
' 작성일      : 2008.03.13
' 기능요약    : 공통 스타일
'---------------------------------------------------------------------------------------------------
' 변경내역
'   일자        변경자      비고
'   --------------------------------------------------------------------------------------------
'
'***************************************************************************************************/
@charset "utf-8";
@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);
/*
@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://fonts.googleapis.com/earlyaccess/jejugothic.css);
*/
/*
@font-face {
   font-family: "Noto Sans Korean";
   src: url(http://www.nowtechi.com/font/NotoSansCJKkr-Regular.otf) format('opentype');
   font-style: normal;
   font-weight : normal;
}
@font-face {
   font-family: "Noto Sans Korean";
   src: url(http://www.nowtechi.com/font/NotoSansCJKkr-Light.otf) format('opentype');
   font-style: normal;
   font-weight : 100;
}

@font-face {
   font-family: "Noto Sans Korean";
   src: url(http://www.nowtechi.com/font/NotoSansCJKkr-Bold.otf) format('opentype');
   font-style: normal;
   font-weight : bold;
}
*/
/*
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 100;
  src: local('Noto Sans KR Thin'), local('NotoSansKR-Thin'), url(http://fonts.gstatic.com/s/notosanskr/v3/Pby6FmXiEBPT4ITbgNA5CgmOsn7tqrAepwxcvEcQNuvyxEcXVNHKVwsuxSvmm96TRe0a_mTdlhti.0.woff2) format('woff2');
}
*/

/*
@font-face {
    font-family: "Noto Sans KR";
    src: url(http://localhost/font/NotoSansCJKkr-Black.otf) format('opentype'),
    url(http://localhost/font/NotoSansCJKkr-Bold.otf) format('opentype'),
    url(http://localhost/font/NotoSansCJKkr-DemiLight.otf) format('opentype'),
    url(http://localhost/font/NotoSansCJKkr-Light.otf) format('opentype'),
    url(http://localhost/font/NotoSansCJKkr-Medium.otf) format('opentype'),
    url(http://localhost/font/NotoSansCJKkr-Regular.otf) format('opentype'),
    url(http://localhost/font/NotoSansCJKkr-Thin.otf) format('opentype'),
    url(http://localhost/font/NotoSansMonoCJKkr-Bold.otf) format('opentype'),
    url(http://localhost/font/NotoSansMonoCJKkr-Regular.otf) format('opentype');
}

@font-face {
    font-family: "Noto Sans CJK KR", "Noto Sans Kr", "Noto Sans Korean", "Nanum Gothic" ;
    src: url(//i1.daumcdn.net/cfs.tistory/static/font/notokr-regular.woff2) format('woff2'),
    url(//i1.daumcdn.net/cfs.tistory/static/font/notokr-regular.woff) format('woff');
    font-style: normal;
    font-weight: 400;
}

@font-face {
  font-family: 'Noto Sans Korean';
  font-style: normal;
  font-weight: 500;
  src: url(https://cdn.rawgit.com/theeluwin/NotoSansKR-Hestia/master/fonts/eot/NotoSansKR-Medium-Hestia.eot);
  src: url(https://cdn.rawgit.com/theeluwin/NotoSansKR-Hestia/master/fonts/eot/NotoSansKR-Medium-Hestia.eot?#iefix) format('embedded-opentype'),
    url(https://cdn.rawgit.com/theeluwin/NotoSansKR-Hestia/master/fonts/woff/NotoSansKR-Medium-Hestia.woff) format('woff'),
    url(https://cdn.rawgit.com/theeluwin/NotoSansKR-Hestia/master/fonts/otf/NotoSansKR-Medium-Hestia.otf) format('opentype');
}
*/
/**
 * 공통
 */

*
{
    text-decoration : none;
    font-size : 13px;
    font-family : "Noto Sans KR", "Noto Sans Korean", "Nanum Gothic", gulim, dotum, verdana;
    
}


body { font-family : "Noto Sans KR", "Noto Sans Korean", "Nanum Gothic", gulim, dotum, verdana;
        background-color:#f7f7f7;
        margin : 0px;
        padding : 0px;
        overflow:-moz-scrollbars-vertical; 
        overflow-y:scroll;
}


.body_white {
    width:100%; background-color:#ffffff; padding-bottom:50px;
}


#test {widh:100%; height:70px; background-color:#efefef;}
#gnb {widh:100%; height:70px; background-color:#151515; text-align:center; min-width:1080px;}
#menubar {max-width:1080px; margin:auto; border: 0px solid red}
#cibox {display:inline-block ; float:left; margin-left: 0px; margin-top: 16px; }
#exmenu {display:block; position:relative; float:right; top:27px; border: 0px solid red}
#exmenu a {font-size:10px; color : #cccccc;}
#exmenu a:hover {font-size:10px; color : #ffffff;}
#menubox {display:inline-block; overflow:hidden; clear:both; height:450px; margin-top: 5px;}
#home_container {width:1080px; margin-left:auto; margin-right:auto; border:0px solid #cccccc; overflow:display; margin-top:50px; }
#container      {width:1080px; margin-left:auto; margin-right:auto; border:0px solid #cccccc; overflow:visible; margin-top:50px;  min-height:580px; background-color:#ffffff; }

#cibox {
    width : 160px;
    height : 35px;
    overflow:hidden;
}
#logo_slide {
    position: relative;
    /*width: 400%;*/
    height : 400%;    
    margin: 0;
    top:0;
    left: 0;
    text-align: left;
    font-size: 0;
    -webkit-animation: 8s logo ease-in-out infinite;
    animation: 8s logo ease-in-out infinite;
}

@keyframes logo {
    0%   { top: 0%; opacity : 1}
    40%  { top: 0%; opacity : 1}
    45%  { opacity : 1}
    50%  { top: -100%; opacity : 1}    
    90%  { top: -100%; opacity : 1}
    95%  { opacity : 1}    
    100% { top: -200%; opacity : 1}
}
#logo_slide img { height: 25%; float: top; }


/*#menu {margin:0px; padding:0px}*/
#menu li {font-size : 13pt; /*color: #ffffff;*/  cursor:pointer; height:30px; }
#menu li a {padding-bottom:25px}
#menu li:hover > a { color: #5aa8ff;}

.menu li {
    width : 150px;
	position: relative;
	list-style: none;
    /*border: 1px solid red;*/
	float: left;
	display: block;
	height: 40px;
    /*margin-left:27px; margin-right:54px*/   
}

/* Links */
.menu li a {
    font-size : 15px;    
	display: block;
    text-align : center;
	text-decoration: none;
	color: #ffffff;
    /*color: rgba(184,209,237,1);*/
	-webkit-transition: color .3s ease-in-out;
	-moz-transition: color .3s ease-in-out;
	-o-transition: color .3s ease-in-out;
	-ms-transition: color .3s ease-in-out;
	transition: color .3s ease-in-out;
}


/* Sub Menu */
.menu ul {
	position: absolute;
    display : none;
    overflow : visible;
    text-align : center;
	left: 0;
	opacity: 0;
    /*
    padding-left : 15px;
    padding-right : 15px;
    padding-top : 10px;
    padding-bottom : 10px;
    */
	background: #000000;
    /*
	-webkit-transition: opacity 1.7s ease .3s;
	-moz-transition: opacity 1.7s ease .3s;
	-o-transition: opacity 1.7s ease .3s;
	-ms-transition: opacity 1.7s ease .3s;
	transition: opacity 1.7s ease .3s;  
    */    
}

.menu li:hover > ul { opacity: .70; display:block }

.menu ul li {
    font-size : 13px;    
    margin-left : 0px;
    margin-right : 0px;
	overflow: visible;   
    margin-left : -40px;    
}


#leftmenu {width:180px; overflow:hidden; float:left; margin-top:52px; margin-bottom:50px;}
#left_title {font-size:28px; border-bottom:2px solid #e5e5e5; text-align: left; color:#0f1825; padding-bottom:10px;}
#left_sub li {
    width : 180px;
	list-style: none;
	float: left;
	display: block;
	height: 30px;
    text-align: left;
    font-size:15px;
    color: #000000;
    font-weight : bold;
    margin-left : -40px;   
} 
 
#left_sub a {
    width : 180px;
	display: block;
	height: 30px;
    text-align: left;
    font-size:15px;
    color: #808080;
    font-weight : normal;
} 
  



#main_img {background-image: url('../images/main/main_img.png'); width:100%; height:400px; background-size: cover; margin:auto; color:#ffffff; vertical-align: middle; text-align: center}
#main_img .title {font-size:50px; padding-top:100px}
#main_img .description {font-size:18px; padding-top:10px}

#quicks {width:1080px; margin:auto; height:140px}
#quicks .quick {width:25%; float:left; text-align:left;}
#quicks .title {font-size:20px; color:#0f1825; margin-bottom:22px}
#quicks .text {font-size:13px; color:#0f1825; margin-bottom:15px}
#quicks .list {padding:-3px 10px 2px 10px;}
#quicks .row {width:540px; height:20px; line-height:20px; cursor:pointer; border: 0px solid red; }
#quicks .list_title {display:inline-block; float:left; width:450px; overflow:hidden; text-align:left; background-color:#ffffff}
#quicks .date {display:inline-block; width:90px; float:left;text-align:right;background-color:#ffffff}
/*
#quicks .button
{
    cursor : pointer;
    color : #595959;    
    font-size : 12px;   
    line-height:30px; 
    width : 105px;
    height: 30px;
    padding : 0px 10px 0px 10px;
    background-color : #ffffff;
    border : 1px solid #808080;
	display : inline-block;
    background-repeat: no-repeat;
    background-position: right;
	*display:inline;	
    border-radius : 3px;
}
#quicks .button:before{content:''; position:relative; left:90px;top:-1px;display:inline-block;width:6px;height:6px;-webkit-transform:rotate(45deg);transform:rotate(45deg);border:1px solid #808080; border-width:1px 1px 0 0;vertical-align:middle}

#quicks .button:hover
{
    background-color : #3c7dc6;  
	color : #efefef;  
}
#quicks .button:hover:before
{
	border-color : #efefef;  
}

#quicks .button:active
{
    background-color : #1f5591; 
    color : #ffffff;  
}
#quicks .button:active:before
{
	border-color : #efefef;  
}
*/
.button
{
    cursor : pointer;
    color : #595959;    
    font-size : 12px;   
    line-height:30px; 
    width : 105px;
    height: 30px;
    padding : 0px 10px 0px 10px;
    background-color : #ffffff;
    border : 1px solid #808080;
	display : inline-block;
    background-repeat: no-repeat;
    background-position: right;
	*display:inline;	
    border-radius : 3px;
    text-align : left;
}
.button:before{content:''; position:relative; left:90px;top:-1px;display:inline-block;width:6px;height:6px;-webkit-transform:rotate(45deg);transform:rotate(45deg);border:1px solid #808080; border-width:1px 1px 0 0;vertical-align:middle}

.button:hover
{
    background-color : #3c7dc6;  
	color : #efefef;  
}
.button:hover:before
{
	border-color : #efefef;  
}

.button:active
{
    background-color : #1f5591; 
    color : #ffffff;  
}
.button:active:before
{
	border-color : #efefef;  
}

#cont_top {margin-top:0px}
#cont_body .title {padding-top:50px}
#cont_body ul {width:808px; padding-top:30px; padding-bottom:50px; margin-left:auto; margin-right:auto; }
#cont_btm {vertical-align:bottom}

#page_title {
    margin-left : 260px;
}
#page_title .title
{
    font-size : 40px;
    color : #151515;/*#1f5591;*/
    font-weight : bold;
    /*padding : 0px 10px 10px 10px;*/
    text-align : left;
    margin-bottom: 20px;
}

#page_title .normal 
{
    font-size : 40px;
    font-weight : normal;
}

#page_title .description {  
    font-size : 17px;
    color : #4c4c4c;    
    /*padding : 10px;*/
    text-align : left;

}

#page_title .emp {  
    font-size : 17px;
    color : #3c7dc6;    
    /*padding : 10px;*/
    margin-bottom: 10px;
}

#contents
{
    width: 820px;
    margin-left : 260px;
    margin-right : auto;
    margin-top : 60px; 
    padding : 0px;
}

#contents .title
{
    font-size : 18px;
    font-weight : bold;
    color : #3c7dc6;     
    text-align : left;
    margin-top : 60px;
    margin-bottom : 14px;      
}

#contents ul
{
     padding-left: 20px;   
}

#contents .description, ul.text li
{
    font-size : 14px;
    color : #4c4c4c;     
    text-align : left; 
    line-height : 28px;
}

#contents .titleC
{
    font-size : 24px;
    font-weight : bold;
    color : #4c4c4c;     
    text-align : center;
    margin-top : 60px;
    margin-bottom : 30px;    
}

#contents .textC
{
    font-size : 14px;
    color : #333333;     
    text-align : center; 
    line-height : 28px;
    margin-bottom : 30px;
}

#contents .emp
{
    color : #2c2c2c; 
    font-size : 15px;
    font-weight : bold;
    margin : 10px 0px 5px 0px;
}


#contents div.col_type2 {width:50%; float:left;}
#contents li.listN
{
     list-style: none;
     padding-left: -40px;   
}
#contents span.list_title {display:inline-block; width:270px; height:20px; line-height:17px; }
#contents span.date {display:inline-block; width:90px; height:30px; line-height:17px;}

table {text-decoration: none; color :#837685; margin-left:auto; margin-right:auto; width:820px; border-top: 1px solid #dcd7dd; }
th {text-align: center; background: rgba(74, 138, 210, 0.05) ; height: 40px; padding: 3px 5px 1px 5px; font-weight: normal; border-bottom: 1px solid #dcd7dd}
td {height: 36px; border-bottom: 1px solid #dcd7dd; padding : 3px 5px 1px 5px; font-weight: normal;}
.left {text-align :left;}
.center {text-align :center}
.mover { background-color: #faf0f6; color: #595959; }
.mout { background-color: #ffffff; color: #837685;}
img {border : none;}
.link {cursor: pointer;}

a {color : #595959;}
a:hover {color : #F26522;}


textarea {background-color : #ffffff; border: #bcbec0 1px solid; color: #454545;}
input {color: #454545; height:28px; border: #cccccc 1px solid;}
input .text {border: #cccccc 1px solid;}
select {height:30px; }
.list_nodata { text-align: center; height : 50px; background-color : #ffffff;}


#footer {
    width: 100%; 
    color: #4c4c4c; 
    background-color:#f7f7f7; 
    text-align:center; 
    padding: 30px; 
    /*
    position: absolute;
    left: 0;
    right: 0;
    */
}

#login, #admin{width:100%; ; text-align:center; }
#login a {color:#f7f7f7}
#admin a {color:#5aa8ff}

#paging {color: #837685; text-align: center; margin: 10px}
#toolbar {text-align: center; margin: 10px ; padding-top:30px; overflow : hidden;}


/*
#toolbar .button
{
    cursor : pointer;
    color : #595959;    
    font-size : 12px;   
    padding : 8px 30px 8px 30px;
    background-color : #f2f2f2;
    border : 1px solid #d9d9d9;
	display : inline-block;
	*display:inline;	
	width : auto;
}

#toolbar .button:hover
{
    background-color : #3c7dc6;  
	color : #efefef;  
}

#toolbar .button:active
{
    background-color : #1f5591; 
    color : #ffffff;  
}

#toolbar .buttonR
{
    float : right;
    margin-left : 4px;    
}

#toolbar .buttonL
{
    float : left;
    margin-right : 4px;    
}
*/
#toolbar .button
{
    cursor : pointer;
    color : #595959;    
    font-size : 12px;   
    line-height:30px; 
    width : 80px;
    height: 30px;
    padding : 0px 10px 0px 10px;
    background-color : #ffffff;
    border : 1px solid #808080;
	display : inline-block;
    background-repeat: no-repeat;
    background-position: right;
	*display:inline;	
    border-radius : 3px;
    text-align : center;
}

#toolbar .button:before{content:''; display:none; border:none; vertical-align:middle}


#toolbar .button:hover
{
    background-color : #3c7dc6;  
	color : #efefef;  
}
/*
#toolbar .button:hover:before
{
	border-color : #efefef;  
}
*/
#toolbar .button:active
{
    background-color : #1f5591; 
    color : #ffffff;  
}
/*
#toolbar .button:active:before
{
	border-color : #efefef;  
}
*/

