/*-----------------------------------------------------------------------------------*/
/*	LAYOUT
/*-----------------------------------------------------------------------------------*/

@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css); 

/*

@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic&display=swap');

*/

@charset "utf-8";
/*-----------------------------------------------------------------------------------*/
/*	RESET
/*-----------------------------------------------------------------------------------*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent
}
body {
	x-line-height:1
}
ol, ul {
	list-style:none
}
blockquote, q {
	quotes:none
}
blockquote:before, blockquote:after, q:before, q:after {
	content:'';
	content:none
}
:focus {
	outline:0
}
ins {
	text-decoration:none
}
del {
	text-decoration:line-through
}
table {
	border-collapse:collapse;
	border-spacing:0
}
.clear {
	clear:both;
	display:block;
	overflow:hidden;
	visibility:hidden;
	width:0;
	height:0
}
.clearfix:after {
	clear:both;
	content:' ';
	display:block;
	font-size:0;
	line-height:0;
	visibility:hidden;
	width:0;
	height:0
}
.clearfix {
	display:inline-block
}
* html .clearfix {
	height:1%
}
.clearfix {
	display:block
}
th, td {
	margin:0;
	padding:0
}
table {
	border-collapse:collapse;
	border-spacing:0
}
.clear {
	clear: both;
}
br {
	line-height: 10px;
}
input[type="submit"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner {
 border : 0px;
}
input[type="submit"]:focus, input[type="button"]:focus {
	outline : none;
}

/*-----------------------------------------------------------------------------------*/
/*	GENERAL
/*-----------------------------------------------------------------------------------*/

/*
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 400;
  src:local('※');
  src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot);
  src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'),  url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff2) format('woff2'),
  url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff) format('woff'),
  url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.ttf) format('truetype');
}
*/


body { font-size:12px; 
     font-family: "Nanum Gothic", "굴림", gulim, "Trebuchet MS", "Lucida Grande", "Tahoma","Helvetica","Arial", "hiragino kaku gothic pro", sans-serif; 
}
input,select,textarea {font-size:12px; font-family:gulim;}
select {font-size:12px;font-family:dotum;}
label {cursor:pointer;}
a {text-decoration:none;color:#000;}
a:hover {color:#666;}

.centered {
	text-align: center;
	vertical-align: middle;
	margin-top: 25%;
	margin-bottom: 25%;
}

.wrap { 
	width:1140px; margin:auto; 
}

.header { }

.header .tnb { height:30px; background:rgba(255,255,255,0.3); }
.header .tnb .wrap .menutops {padding:5px 0 0px 0;text-align:right;font-size:11px;font-family:dotum;letter-spacing:2px;}
.header .tnb .wrap .menutops a {font-family:gulim;color:white; font-size:11px; font-weight:bold; letter-spacing:-1px;outline:none;}
.header .tnb .wrap .menutops a:hover {text-decoration:underline;}
.headertop .tnb .menutops img {margin-bottom:-3px;}
.header .tnb .wrap .menutops .admin {font-size:11px;font-family:dotum;font-weight:normal;color:#FA5800;}

p { font-size:14px; line-height:160%; color:#222; } 
.desc { font-family:Gulim, Arial, Sans Serif; }


.content {  } 
.title h1 { font-size: 27px; color: #777; font-weight: normal; } 
.title h1 .small { font-size:20px; } 
.content .comment { font-size:12px; color:#444; } 
.snb_sub_top { 
	margin:10px 0 20px; width:770px; min-height:40px; padding:20px; 
	font-size:22px; color:#333333; font-family:nanumgothic; text-align:justify; 
	x-background:url(image/sub/snb_title_bg.jpg); 
	border-radius:5px; border:solid 1px #b399ff; 
}

/* intro */ 
.intro { line-height:180%; } 
.intro h3 { font-size:30px; } 
.intro p { font-size:18px; } 

@media (max-width: 600px) {
	.intro h3 { font-size:20px; } 
    .intro p { font-size:16px; } 
}


/* ------------------------- */

#footer { margin:40px 0 0 0; clear:both; border-top:solid 1px #a5af33; background-color:#ffffff; }
#footer .wrap { padding:15px 20px 30px 20px; }
#footer .wrap .slinks { }
#footer .wrap .slinks .elink {padding:10px 0 10px 0;font-size:11px;font-family:dotum;color:#c0c0c0;letter-spacing:2px; text-align:center; }
#footer .wrap .slinks .elink a {font-family:gulim;font-size:14px;letter-spacing:-1px;color:#999999; x-font-weight:bold; }
#footer .wrap .slinks .elink a:hover {text-decoration:underline;}
#footer .wrap .slinks .copyright {font-size:11px;font-family:arial;color:#999999; text-align:center; }
#footer .wrap .powered {float:right;}
#footer .wrap .kimsq {padding:10px 0 10px 0;font-size:11px;font-family:arial;color:#c0c0c0;}

/*-----------------------------------------------------------------------------------*/
/* Hotbox 
/*-----------------------------------------------------------------------------------*/
.hotbox a { color:#000; }

.rightbanner {
    width: 120px;
    height: 150px;
    position: absolute;
    top: 0px;
    right: -130px;
    z-index: 10;
}

.rightbanner img {
    border: solid 1px #CCCCCC;
	margin-bottom:10px;	
}

/* --------------------------------------------- */
/* TABS                                          */
/* --------------------------------------------- */

.tabs {position:relative;padding:0;width:100%; clear:both; -padding-top:30px}
.tabs h6 {padding:0 0 15px 0;margin:0 0 5px 0;font-weight:bold; font-size:15px; color:#333;}

.tabs a {color:#333;}

.tabs H1 { margin-bottom: 2px; font-family: Garamond, "Times New Roman", Times, Serif;}
.tabs DIV.container { margin: auto; width: 90%; margin-bottom: 10px;}
.tabs TEXTAREA { width: 80%;}
.tabs FIELDSET { border: 1px solid #ccc; padding: 1em; margin: 0; }
.tabs LEGEND { color: #ccc; font-size: 120%; }
.tabs INPUT, TEXTAREA { font-family: Arial, verdana; font-size: 125%; padding: 7px; border: 1px solid #999; }
.tabs LABEL { display: block; margin-top: 10px; } 
.tabs IMG { margin: 5px; }

UL.tabNavigation {
    list-style: none;
    margin: 5px 0 0px;
    padding: 0px 0;
}

UL.tabNavigation LI {
    display: table-cell;
	border-spacing: 0px;
}

UL.tabNavigation LI:last-child {
	border-right:none;
}

UL.tabNavigation LI A {
    display: inline-block;
	margin-left:1px;
	padding: 5px 5px 5px 5px;
	margin-bottom:5px; 
	text-decoration: none;
	font-size: 14px;
	font-weight:bold;	
	font-family: nanumgothic;
	color: #777;
	x-background:#ecefc7;
	background:#fafafa;
	width:135px;
	text-align:center;
}

UL.tabNavigation LI A:after { }

UL.tabNavigation LI A.selected,
UL.tabNavigation LI A:hover {
    x-color: #fff;
    x-background:#a5af33;
	background:#eeeeee;
}

UL.tabNavigation LI A:focus {
    outline: 0;
}

div.tabs > div {
    padding: 5px;
    -margin-top: 3px;
    x-border: 1px solid #bbbbbb;
}

div.tabs > div h2 {
    margin-top: 0;
}

#first {
    background-color: #fff;
}

#second {
    background-color: #fff;
}

#third {
    background-color: #fff;
}

.waste {
        min-height: 100x;
}



/**************************************************************/
/* from pure css ( http://purecss.io/buttons/ ) */

.pure-button {
    /* Structure */
    display: inline-block;
    *display: inline; /*IE 6/7*/
    zoom: 1;
    line-height: normal;
    white-space: nowrap;
    vertical-align: baseline;
    text-align: center;
    cursor: pointer;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Firefox: Get rid of the inner focus border */
.pure-button::-moz-focus-inner {
    padding: 0;
    border: 0;
}

/* csslint unqualified-attributes:false, outline-none:false */ 
.pure-button {
	font-size: 100%;
	*font-size: 90%; /*IE 6/7 - To reduce IE's oversized button text*/
	*overflow: visible; /*IE 6/7 - Because of IE's overly large left/right padding on buttons */
	padding: 0.5em 1.5em 0.5em;
	color: #444; /* rgba not supported (IE 8) */
	color: rgba(0, 0, 0, 0.80); /* rgba supported */
	*color: #444; /* IE 6 & 7 */
	border: 1px solid #999;  /*IE 6/7/8*/
	border: none rgba(0, 0, 0, 0);  /*IE9 + everything else*/
	background-color: #E6E6E6;
	text-decoration: none;
	border-radius: 2px;
	/* Transitions */
	-webkit-transition: 0.1s linear -webkit-box-shadow;
	-moz-transition: 0.1s linear -moz-box-shadow;
	-ms-transition: 0.1s linear box-shadow;
	-o-transition: 0.1s linear box-shadow;
	transition: 0.1s linear box-shadow;
	margin-bottom:10px; 
}

.pure-button-hover,
.pure-button:hover,
.pure-button:focus {
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#1a000000',GradientType=0);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(40%, rgba(0,0,0, 0.05)), to(rgba(0,0,0, 0.10)));
	background-image: -webkit-linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10));
	background-image: -moz-linear-gradient(top, rgba(0,0,0, 0.05) 0%, rgba(0,0,0, 0.10));
	background-image: -o-linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10));
	background-image: linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10));
	color:#444; 
}
.pure-button:focus {
	outline: 0;
}
.pure-button-active,
.pure-button:active {
	box-shadow: 0 0 0 1px rgba(0,0,0, 0.15) inset, 0 0 6px rgba(0,0,0, 0.20) inset;
}

.pure-button[disabled],
.pure-button-disabled,
.pure-button-disabled:hover,
.pure-button-disabled:focus,
.pure-button-disabled:active {
	border: none;
	background-image: none;
	filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
	filter: alpha(opacity=40);
	-khtml-opacity: 0.40;
	-moz-opacity: 0.40;
	opacity: 0.40;
	cursor: not-allowed;
	box-shadow: none;
}

.pure-button-hidden {
    display: none;
}

/* Firefox: Get rid of the inner focus border */
.pure-button::-moz-focus-inner{
    padding: 0;
    border: 0;
}

.pure-button-primary,
.pure-button-selected,
a.pure-button-primary,
a.pure-button-selected {
    background-color: rgb(0, 120, 231);
    color: #fff;
}

.pure-button-success,
a.pure-button-success,
.pure-button-error,
a.pure-button-error,
.pure-button-warning,
a.pure-button-warning,
.pure-button-secondary,
a.pure-button-secondary {
	color: white;
	border-radius: 4px;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}

.pure-button-success {
	background: rgb(28, 184, 65); /* this is a green */
}

.pure-button-error {
	background: rgb(202, 60, 60); /* this is a maroon */
}

.pure-button-warning {
	background: rgb(223, 117, 20); /* this is an orange */
}

.pure-button-secondary {
	background: rgb(66, 184, 221); /* this is a light blue */
}

.pure-button-xsmall {
	font-size: 70%;
}

.pure-button-small {
	font-size: 85%;
}

.pure-button-large {
	font-size: 110%;
}

.pure-button-xlarge {
	font-size: 125%;
}