/*!
 * layout.css
 * Copyright (C) 2015 SmarTools Co. (http://smartools.co.kr)
*/

/** Common & Template patch **/
#wrapper { background-image: none; }
#st-body { color: #333; word-break: keep-all; }
#st-body p {color: #333; }
#st-body .btn { border-width: 1px;}
#st-body .btn-sm {
    font-size: 12px;
    line-height: 1.5;
	padding: 5px 10px;
    border-radius: 3px;
}
#st-body .btn-sm.btn-circle {
	font-size: 14px;
	padding: 0;
    line-height: 25px;
    width: 29px;
    height: 29px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%; 	
}
#st-body .btn-xs {
	padding: 1px 5px;
    font-size: 12px;
	font-weight: 400;
    line-height: 1.5;
    border-radius: 3px;
}
#st-body .btn-default {
	border-color: #ccc;
}
#st-body .glyphicon {
    font-family: 'Glyphicons Halflings';
}
#st-body .text-lnl, #st-body .text-lnl a { color: #7369AF; }
#st-body .text-lnl a::hover, #st-body .text-lnl a::focus, #st-body .text-lnl a::active { color: #665ca4; }


/** Topbar **/
#st-body .topbar {
	text-align:right; 
	background:none; 
	padding-top:5px;	
	position: relative;
	background-color: transparent;
	z-index: 2000;
	opacity: 0.9;
}
#st-body .topbar a {
	color: #fff;
	font-size: 13px;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8);
}
#st-body .topbar a:hover {
	color: rgba(255, 255, 255, 0.85);
}


/** Header **/
/* Topbar 추가에 따른 크기/위치조정 시작 */
#header {height: 91px;}
#header .bg-wrapper {
	height: 65px;
	background-color: rgba(0, 0, 0, 0.6);	/* 메인메뉴에 음영추가 */
}
#header .navbar { height: 65px; }
#header .navbar-default.navbar-collapsed-md .navbar-brand { height: 65px; }
@media (min-width: 768px) {
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li > a span {
		color: white;
		height: 65px;
	}
}	
#st-body .navbar-header {  /* 로고 이미지나 텍스트 크기에 따라 유동적 */
	position: relative;
	top: -12px;
}
/* Topbar 추가에 따른 크기/위치조정 끝 */

#st-body .navbar-brand {
	color: #fff;
	font-weight: bold;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8);
}
#st-body .navbar-brand img { max-height: 45px; }
#header .navbar .panel-search { margin-bottom: 0; }
#header .navbar .panel-search .panel-body { padding: 0; }
#header .navbar .navbar-search {
	padding-left: 15px;
	padding-right: 15px;
}
@media screen and (max-width: 767px) {
	#header .navbar .navbar-form {
		border: 0;
		padding-top: 15px;
		margin-top: 0;
		margin-bottom: 0;
		box-shadow: none;
		-webkit-box-shadow: none;
	}
}
@media screen and (min-width: 767px) {
	#header .navbar-default .navbar-nav > li > a > span {
		font-size: 15px;
	}	
}


/** 서브메뉴 **/
@media (min-width: 768px) {
	/** 메인메뉴 하단라인 제거 **/
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li.open > a:hover span,
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li.open > a:focus span,
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li.active > a:hover span,
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li.active > a:focus span {
		border-bottom-color: rgba(255, 255, 255, 0);
	}
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li > a:hover span, 
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li > a:focus span {
		border-bottom-color: rgba(255, 255, 255, 0);
	}		
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li.open > a span, 
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li.open > a:hover span, 
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li.open > a:focus span, 
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li.active > a span, 
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li.active > a:hover span, 
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li.active > a:focus span {
		border-bottom-color: rgba(255, 255, 255, 0);
	}
	/** 2단 메뉴 **/
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li .dropdown-menu {
		border: 0;
		margin-top: -2px;
		/***
		margin-top: 15px;
		border: 5px solid;
		***/		
		width: 200px;
		margin-right: -50px;
		/***
		width: 216px;
		right: 50%;
		margin-right: -108px;
		***/
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px; 		
		/***
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		border-radius: 10px; 
		***/
	}
	/** IE9/10 Patch for triangle **/
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li:last-child .dropdown-menu {
		right: -40%;
	}
	/** 2단 메뉴 Triangle **/
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li.open:before {
		/* 위치조정 */
		bottom: 2px;
		/* 두께조절  to theme
		border-left: 7px solid transparent;
		border-right: 7px solid transparent;		
		border-bottom: 7px solid #793a98;
		*/
		/*border-bottom: 7px solid #7369AF;*/
	}
	/** 3단 메뉴 **/
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > .open .dropdown-menu > li.dropdown-submenu .dropdown-menu {
		top: 2px;
		right: -165px; 
	}
	/** 3단 메뉴 Triangle **/
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > .open .dropdown-menu > li.dropdown-submenu .dropdown-menu:before {
		/*border-right: 7px solid #793a98; to theme */
		/*border-right: 7px solid #7369AF;*/
		margin-left: -2px;
	}
	/** 메뉴 아이템 **/
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li .dropdown-menu > li:first-child > a,
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li .dropdown-menu > li:last-child > a {
		-webkit-border-radius: 0;
		-moz-border-radius: 0;		
		border-radius: 0;
	}
	/** 검색 판넬 **/
	#header .navbar .panel-search {
		-webkit-border-radius: 0;
		-moz-border-radius: 0;		
		border-radius: 0;
	}
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > li.search.open:before {
		/* 위치조정 */
		bottom: 2px;
		/* 두께조절 */
		border-left: 7px solid transparent;
		border-right: 7px solid transparent;		
		border-bottom: 7px solid #fff;
	}	
}
@media (max-width: 767px) {
	/** 모바일 2단 메뉴 **/
	#header .navbar-default.navbar-collapsed-sm .navbar-nav > .open .dropdown-menu > li > a {
		color: #ddd;
	}	
}


/** Subheader **/
#wrapper { 
	width: 100%;
	height: 500px;
	background-position: center;
	background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#main-content {
	padding-top: 0 !important;
}

/** Search **/
#st-body .search-box {
	padding: 0 0 0;
	/**padding: 15px 0 10px;**/
	background-color: #f5f5f5;
	border-bottom: 1px solid #ddd;
	margin-bottom: 30px;
	/**margin-bottom: 60px;**/
}
#st-body .search-box .btn-search {
	color: #676f7a;
	/**border: 2px solid #eaedf2;**/
	/**border-left: 1px solid #ddd;**/
}
#st-body .search-box .search {
	max-width: 768px;
	margin: 0 auto;
}


#st-body .search-box .row.category {
	font-size: 16px;
	font-weight: bold;
	margin: 10px 0;
}
#st-body .search-box .row.category .title {
	font-weight: bold;
	margin-top: 10px;
	margin-bottom: 10px;
}
/***
#st-body .search-box .row.category .alert-title {
	color: #fff; 
	background-color: #672687; 
	border-color: #434955;
	margin: 0 auto;
	margin-bottom: 10px;
	max-width: 480px; 
}
#st-body .search-box .row.category .alert-title h4 {
	font-size: 18px;
	font-weight: bold;
	margin: 0;
}
***/
#st-body .search-box .row.category .icon,
#st-body .search-box .row.category .icon a {
	color: #434955;
	text-decoration: none;
}
#st-body .search-box .row.category .icon a:hover {
	color: #672687;
}
#st-body .search-box .row.category .icon .mg {
	margin: 10px;
}


#st-body .search-box .row.addinfo {
	margin-top: 10px;
}
#st-body .search-box .col-sm-6.border-right {
	border-right: 1px solid #dadada;
	/**border-right: 1px solid #eaedf2;**/
}
#st-body .search-box .info {
	text-align: right;
	margin-right: 25px;
}
#st-body .search-box .info a {
	font-size: 22px;
	font-weight: bold;
	text-decoration: none;
}
#st-body .search-box .links {
	text-align: left;
	margin-left: 25px;
}
#st-body .search-box .links .icon {
    width: 36px;
    height: 36px;
	margin-top: 8px;
}
@media (max-width: 767px) {
	#st-body .search-box .col-sm-6.border-right {
		border-right: 0;
	}	
	#st-body .search-box .info {
		text-align: center;
		margin-right: 0;
	}	
	#st-body .search-box .links {
		text-align: center;
		margin-left: 0;
		margin-top: 15px;
	}	
}
#st-body .search-box .inner-box {
	background-color: #ededed;
	padding: 15px 0;
}

#st-body .search-box form .form-control { border: 2px solid #ccc; }
#st-body .search-box form .form-control:focus {
	-webkit-box-shadow: 0 0 8px rgba(1, 169, 224, 0.6);
	-moz-box-shadow: 0 0 8px rgba(1, 169, 224, 0.6);
	box-shadow: 0 0 8px rgba(1, 169, 224, 0.6); 
}
#st-body .search-box form .form-control:-moz-placeholder { color: #676f7a; }
#st-body .search-box form .form-control:-ms-input-placeholder { color: #676f7a; }
#st-body .search-box form .form-control::-webkit-input-placeholder { color: #676f7a; }
		


/** Slider **/
#st-carousel.hero-carousel {
    top: -123px;
    margin-bottom: -123px;
}
#st-carousel.carousel-contrast .normal {
    color: white !important;
}
#st-carousel .slides {
	height: 100%;
}
#st-carousel .slides .item {
	height: 100%;
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
@media (min-width: 768px) {
/*@media (min-width: 992px) {*/
	.carousel-contrast .big, 
	.carousel-contrast .carousel-blur .normal, 
	.carousel-blur .carousel-contrast .normal, 
	.carousel-contrast .carousel-image .normal, 
	.carousel-image .carousel-contrast .normal {
		font-size: 34px;
		line-height: 38px;
		margin-top: 250px;
		/***
		font-size: 42px;
		line-height: 54px;
		***/
	}
	.carousel-contrast .normal {
		font-size: 22px;
		line-height: 22px;
		/***
		font-size: 24px;
		line-height: 30px;
		***/
	}
}
@media (max-width: 767px) {
	.carousel-contrast .big, 
	.carousel-contrast .carousel-blur .normal, 
	.carousel-blur .carousel-contrast .normal, 
	.carousel-contrast .carousel-image .normal, 
	.carousel-image .carousel-contrast .normal {
		font-size: 26px;
		line-height: 30px;
		margin-top: 250px;
	}
	.carousel-contrast .normal {
		font-size: 16px;
		line-height: 20px;
	}
}
@media (max-width: 480px) {
	.carousel-contrast .big, 
	.carousel-contrast .carousel-blur .normal, 
	.carousel-blur .carousel-contrast .normal, 
	.carousel-contrast .carousel-image .normal, 
	.carousel-image .carousel-contrast .normal {
		font-size: 26px;
		line-height: 30px;
		margin-top: 175px;
	}
	.carousel-contrast .normal {
		font-size: 16px;
		line-height: 20px;
	}
}


/** Subheader **/
#main-content-header .title small {
	line-height: 22px;
}

/** Sidebar **/
#st-body .sidebar .panel-shop {
	border: 0;
	border-radius: 5px;	
	box-shadow: 0 0;
}
#st-body .sidebar .panel-shop .panel-heading {
	background-color: #fff;
	border: 1px solid #eaedf2;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;	
}
#st-body .sidebar .panel-shop .panel-heading:hover {
	background-color: #f5f5f5;
}
#st-body .sidebar .panel-shop .panel-heading a,
#st-body .sidebar .panel-shop .panel-heading a:hover {
	color: #555;
	text-decoration: none;
}
#st-body .sidebar .panel-shop .panel-heading .panel-title {
	font-size: 14px;
}
	
	
#st-body .sidebar .panel-shop .list-group .list-group-item {
	font-size: 14px;
	border-width: 1px 1px;
}
#st-body .sidebar .panel-shop .list-group .list-group-item:last-child {
	border-bottom: 1px solid #eaedf2;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

@media (max-width: 767px) {
	.sidebar {
		border-top: 2px solid #eaedf2;
		border-bottom: 0;
		padding-top: 20px;
		padding-bottom: 20px;
		margin-top: 40px;
		margin-bottom: 0;
	}
}
#st-body .article-heading {
    width: 100%;
    margin-bottom: 15px;
    border-bottom: 1px solid #ddd;
    clear: both;
}
#st-body .article-heading .title {
    font-weight: bold;
    display: inline-block;
    position: relative;
    bottom: -3px;
    padding: 0 5px 5px 0;
    margin-bottom: 0;
	text-transform: none;
}
#st-body .article-heading .more {
	float: right;
	margin-top: 15px;
}


/** Content **/
#st-body .content-wrapper {
	min-height: 500px;
	background-color: #fff;
}
.page-header.page-header-with-icon.top {
	margin-top: 10px;
}
.page-header.page-header-with-icon h2 {
	font-weight: bold;
}
#st-body .nav-tabs-bar > li {
	border-top: 4px solid #e5e5e5;
}
/** to theme
#st-body .nav-tabs-bar > li.active {
	border-top: 4px solid #7369AF;
}
**/
#st-body .nav-tabs-bar > li > a {
	color: #555;
	font-weight: bold;
	border-left: #e5e5e5 1px solid;
	border-radius: 0;
	margin: 0;
	outline: 0;
}
#st-body .nav-tabs-bar > li:last-child > a {
	border-right: 1px solid #ddd;
}
#st-body .nav-tabs-bar > li.active + li > a {
	border-left-color: transparent;
}
#st-body .input-group-addon {
    border: 1px solid #eaedf2;
}


/** Back-to-top 메뉴 patch for Mobile **/
#scroll-to-top { display: block; } 


/** Pages **/
#st-pages .hr {
	margin: 20px 0 50px;
	border-color: #ddd;
	border-top-width: 1px;
}


/** ST Layout framework **/
#st-body .vtop { vertical-align: top; }
#st-body .vmiddle { vertical-align: middle; }
#st-body .vbottom { vertical-align: bottom; }
#st-body .img-center { margin: 0 auto; }
#st-body .col-vmiddle {
	display: inline-block;
	vertical-align: middle;
	float: none;
}
#st-body .btn:focus { outline: none; }
#st-body a:focus { outline: none; }
#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-line-clamp: 2;
    -webkit-box-orient: vertical;  	
	/***
	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;
}

#st-body .row-tiny {
	margin-right: -7px;
	margin-left: -7px;
}
#st-body .col-tiny {
	padding-right: 7px;
	padding-left: 7px;
}
#st-body .visible-xs-v { display: none; }
#st-body .visible-xs-v-inline { display: none; }
#st-body .visible-xs-v-tr { 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 .visible-xs-v-tr { display: table-row; }	
	#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;}

/** Table framework **/
#st-body .st-table {
	display: table;
	width: 100%;	
}
#st-body .st-table .tr {
	display: table-row;
}
#st-body .st-table .td {
	display: table-cell;
	padding: 10px;
}
#st-body .st-table.bordered {
	border-left: 1px solid #eaedf2;
	border-top: 1px solid #eaedf2;
}
#st-body .st-table.bordered .td {
	border-right: 1px solid #eaedf2;
	border-bottom: 1px solid #eaedf2;
}



/** 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: 22px; }
#st-body .st-size4 { font-size: 17px; }
#st-body .st-size5 { font-size: 14px; }
#st-body .st-size6 { font-size: 12px; }


/** Footer **/
#footer #footer-main {
	background-color: #333;
}
#footer #footer-main .title {
	font-weight: bold;
	text-transform: capitalize;
	margin-bottom: 15px;
}
#footer #footer-main .info-box a {
    color: #eee;
}
#footer #footer-main .info-box a:hover {
    color: #eee;
}
#footer #footer-main p {
	color: #bbb;
	font-weight: normal;
	font-size: 14px;
	line-height: 20px;
}
#footer #footer-copyright {
	background-color: #fff;
	text-align: left;
	font-size: 14px;
	padding: 10px 0;
}
#footer #footer-copyright .copyright {
	color: #000;
}
#footer #footer-copyright .links .icon {
	margin-top: 5px;
	width: 36px;
	height: 36px;
}
@media (max-width: 767px) {
	#footer #footer-copyright {
		text-align: center;
	}	
}
