/*!
 * layout.css
 * Copyright (C) 2015 SmarTools Co. (http://smartools.co.kr)
*/

/** Body common attributes **/
#st-body { color: #333; }
#st-body .container .container { width: auto; }
#st-body .st-color1 { color: #3b3b3b; }
#st-body .st-color2 { color: #3b3b3b; }
#st-body a.st-link { color: #333; text-decoration: none; }
#st-body a.st-link:focus, 
#st-body a.st-link:hover {
	color: #333;
	text-decoration: none;
}

/** Content frame **/
#st-content { 
	position: relative;
	min-height: 500px; 
}
#st-content .rcontent {
	min-height: 500px;
	padding-bottom: 50px;
}
#st-content .lside {
	position: absolute;
	left: 15px;
	top: 0;
}
#st-content .lcontent {
	min-height: 500px; 
	padding-bottom: 50px;
}
#st-content .rside {
	position: absolute;
	right: 15px;
	top: 0;
}
#st-content .mside {
	text-align: center;
	display: none;
}
@media (min-width: 1200px) {
	#st-body .container-wide {
		width: 1420px;
		margin: 0 auto;
	}
}
@media (max-width: 991px) {
	#st-content .lside { display: none; }
	#st-content .rside { display: none; }	
	#st-content .mside { display: block; }
	#st-content .rcontent {
		margin-left: 0;
		padding-left: 0;
		border-left: 0;	
	}
	#st-content .lcontent {
		margin-right: 0;
		padding-right: 0;
		border-right: 0;	
	}	
}


/** Preloader **/
#preloader {
	position:fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color: #ffffff;
	z-index:999999; 
}
#preloader .spinner {
	margin: 150px auto 0;
	width: 70px;
	text-align: center;
	position:fixed;
	z-index:999999;
	width:250px;
	height:250px;
	position:absolute;
	left:50%; 
	top:50%; 
	background-size:32px 32px;
	background-repeat:no-repeat;
	background-position:center;
	margin:-125px 0 0 -125px; 
}
#preloader .spinner > div {
	width: 18px;
	height: 18px;
	background-color: #ccc;
	border-radius: 100%;
	display: inline-block;
	-webkit-animation: bouncedelay 1.4s infinite ease-in-out;
	animation: bouncedelay 1.4s infinite ease-in-out;
	/* Prevent first frame from flickering when animation starts */
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}
#preloader .spinner .bounce1 {
	-webkit-animation-delay: -0.32s;
	animation-delay: -0.32s;
}
#preloader .spinner .bounce2 {
	-webkit-animation-delay: -0.16s;
	animation-delay: -0.16s;
}
@-webkit-keyframes bouncedelay {
	0%, 80%, 100% { -webkit-transform: scale(0.0) }
	40% { -webkit-transform: scale(1.0) }
}
@keyframes bouncedelay {
	0%, 80%, 100% {
		transform: scale(0.0);
		-webkit-transform: scale(0.0);
	} 40% {
		transform: scale(1.0);
		-webkit-transform: scale(1.0);
	}
}


/** Back to top menu **/
#st-backtotop {
	color: #fff;
    position: fixed;
    bottom: 15px;
    right: 15px;
    text-decoration: none;
    padding: 16px;
    display: none;
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#33000000, endColorstr=#33000000)";
	background: rgba(0,0,0,0.4);
	z-index: 5000;
	cursor: pointer;
}
#st-backtotop:hover {    
	background-color: #333;
}


/** Common controls **/
#st-body .btn {
	font-weight: bold;
}
#st-body .btn-primary {
	background-color: #3b3b3b;
	border-color: #adadad;
}

#st-body .btn-primary.btn-estimate {
	background-color: #e2000d;
	border-color: #adadad;
}

#st-body .btn-primary:hover, 
#st-body .btn-primary:focus, 
#st-body .btn-primary:active, 
#st-body .btn-primary.active, 
#st-body .open .dropdown-toggle.btn-primary {
	background-color: #282828;
	border-color: #080808;
}
#st-body .btn-primary.disabled, 
#st-body .btn-primary[disabled],
#st-body fieldset[disabled] .btn-primary, 
#st-body .btn-primary.disabled:hover,
#st-body .btn-primary[disabled]:hover, 
#st-body fieldset[disabled] .btn-primary:hover,
#st-body .btn-primary.disabled:focus, 
#st-body .btn-primary[disabled]:focus,
#st-body fieldset[disabled] .btn-primary:focus, 
#st-body .btn-primary.disabled:active,
#st-body .btn-primary[disabled]:active, 
#st-body fieldset[disabled] .btn-primary:active,
#st-body .btn-primary.disabled.active, 
#st-body .btn-primary[disabled].active,
#st-body fieldset[disabled] .btn-primary.active {
	background-color: #3b3b3b;
	border-color: #282828;
}
#st-body .panel-primary {
	border-color: #282828;
}
#st-body .panel-primary > .panel-heading {
	color: #fff;
	background-color: #3b3b3b;
	border-color: #282828;
}
#st-body .panel-primary > .panel-heading a {
	color: #fff;
}



/** ST Layout framework **/
#st-body .tleft { text-align: left; }
#st-body .tright { text-align: right; }
#st-body .tcenter { text-align: center; }
#st-body .vtop { vertical-align: top; }
#st-body .vmiddle { vertical-align: middle; }
#st-body .vbottom { vertical-align: bottom; }
#st-body .btn:focus { outline: none; }
#st-body a:focus { outline: none; }
#st-body h1, #st-body h2, #st-body h3, #st-body .h1, #st-body .h2, #st-body .h3, 
#st-body h4, #st-body h5, #st-body h6, #st-body .h4, #st-body .h5, #st-body .h6 {
	margin-top: 0px;
}
#st-body .ellipsis {
	width: 100%;
    display: block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
#st-body .ellipsis-li {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
#st-body .ellipsis-multi {
	display: -webkit-box;
	overflow: hidden; 
	text-overflow: ellipsis; 
	-webkit-box-orient: vertical; 
	word-wrap:break-word;
}
#st-body .ellipsis-multi.l2 {
	-webkit-line-clamp: 2;
}
#st-body .ellipsis-multi.l3 {
	-webkit-line-clamp: 3;
}
/** class="container-full" 과 같이 .container 없이 사용. **/
#st-body .container-full {
	width: 100%;
	padding-right: 0;
	padding-left: 0;
}
#st-body .row-tiny {
	margin-right: -7px;
	margin-left: -7px;
}
#st-body .col-tiny {
	padding-right: 7px;
	padding-left: 7px;
}
#st-body .row-sm-middle {
    display: table;
    table-layout: fixed;
}
#st-body .col-sm-middle  {
    display: table-cell;
    vertical-align: middle;
    float: none;
}
@media (max-width: 767px) {
	#st-body .row-sm-middle,
	#st-body .col-sm-middle {
		display: block;
	}
	/** class="container container-xs-full" 과 같이 사용. **/
	#st-body .container-xs-full {
		width: 100%;
		padding-right: 0;
		padding-left: 0;
	}		
}
#st-body .visible-xs-v { display: none; }
#st-body .visible-xs-v-inline { display: none; }
@media (max-width: 480px) {
	#st-body .hidden-xs-v { display: none !important; }
	#st-body .visible-xs-v { display: block !important; }
	#st-body .visible-xs-v-inline { display: inline-block !important; }
	#st-body .col-xs-v6 { width: 50% !important; }
	#st-body .col-xs-v12 { width: 100% !important; }
}
@media print {
	#st-body a,
	#st-body a:visited {
		text-decoration: inherit;
	}
	#st-body a[href]:after {
		content: none;
	}
}
#st-body img {width: auto;}


/** Font-size framework **/
#st-body .bold { font-weight: bold; }
#st-body .italic { font-style: italic; }
#st-body .st-size1 { font-size: 36px; }
#st-body .st-size2 { font-size: 30px; }
#st-body .st-size3 { font-size: 16px;font-weight:bold}
#st-body .st-size4 { font-size: 17px; }
#st-body .st-size5 { font-size: 14px; }
#st-body .st-size6 { font-size: 12px; }


@media only screen and (min-width: 1200px) {
#st-body .st-size3 { font-size: 55px;}
}


