/* =======================================================================
	Element
======================================================================= */
	html {
		position: relative;
		min-height: 100%;
	}

	body {
		background: #fff;
		margin-bottom: 100px;
		font-family: 'Open Sans', sans-serif;
	}

	a:link,
	a:visited,
	a:hover,
	a:active {
		color: #333;
		text-decoration: none;
	}

	li {
		list-style: none;
	}

	table {
		display: table;
		width: 100%;
	}

	p {
		display: block;
		margin: 3px;
	}

	small {
		font-size: 12px;
	}

	.cursor {
		cursor: pointer;
	}

/* =======================================================================
	Layout
======================================================================= */
	.container {
		font-size: 14px;
	}

/* =======================================================================
	Modal
======================================================================= */
	.close-btn {
		display: inline-block;
		padding: 4px;
		border: 1px solid red;
		z-index: 3500;
	}

/* =======================================================================
	Loading Bar
======================================================================= */
	#loading {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		opacity: 0.7;
		background-color: #000;
		text-align: center;
		z-index: 2500;
	}

	#loading .content {
		display: inline-block;
		vertical-align: middle;
		z-index: 2500;
	}

	#loading .blank {
		display: inline-block;
		width: 0;
		height: 700px;
		vertical-align: middle
	}

	/* 마스크 씌우기 */
	#mask {
		position: absolute;
		left: 0;
		top: 0;
		z-index: 2000;
		background-color: #000;
		display: none;
	}

	/* 화살표 */
	.sidenav .collapsed .fa-chevron-down,
	.sidenav .fa-chevron-right {
		display: none;
	}

	.sidenav .collapsed .fa-chevron-right,
	.sidenav .fa-chevron-down {
		display: inline-block;
	}

	i.fa {
		cursor: pointer;
		margin-right: 5px;
	}

	.collapsed ~ .collapse-body {
		padding: 0;
	}

/* =======================================================================
	Sidenav
======================================================================= */
	.sidenav {
		height: 100%;
		width: 0;
		position: fixed;
		z-index: 3000;
		top: 0;
		left: 0;
		background-color: #111;
		overflow-x: hidden;
		transition: 0.5s;
		padding-top: 5px;
	}

	.sidenav a {
		padding: 8px 8px 8px 32px;
		text-decoration: none;
		font-size: 14px;
		color: #818181;
		display: block;
		transition: 0.3s;
	}

	.sidenav a:hover {
		color: #f1f1f1;
	}

	.sidenav .closebtn {
		position: absolute;
		top: -8px;
		right: 5px;
		font-size: 28px;
	}

	@media screen and (max-height: 450px) {
		.sidenav {padding-top: 15px;}
		.sidenav a {font-size: 14px;}
	}

/* =======================================================================
	Footer
======================================================================= */
	footer {
		font-size: 14px;
		position: absolute;
		bottom: 0px;
		width: 100%;
		height: 80px;
		background-color: #f5f5f5;
	}

	#btn_top {
		display: none;
		position: fixed;
		bottom: 25px;
		right: 10px;
		z-index: 500;
		border: none;
		outline: none;
		cursor: pointer;
		font-size: 20px;
		color: red;
	}
	#btn_top i:first-child {
		z-index: 550;
		bottom: 1px;
		right: 2px;
		color: #f0f0f0;
	}

/* =======================================================================
	profiler
======================================================================= */
	.page-header { padding-bottom: 9px; margin: 10px 0 20px; border-bottom: 1px solid #eee; }
	#codeigniter_profiler { word-break:break-all; }
	#codeigniter_profiler fieldset table tbody tr td { min-width: 100px; }

/* =======================================================================
	Main
======================================================================= */
	#box_menu {
		font-size: 16px;
	}

/* =======================================================================
	Contact : 이미지
======================================================================= */
	.card_img img, .card_img i {
		width: 260px;
		height: 140px;
		border: 2px solid #ddd;
	}

	.card_img:not img {
		max-width: 100%;
		height: auto !important;
	}

/* =======================================================================
	accbook
======================================================================= */
	/* 써클 버튼 */
	.btn-circle.btn-xl {
		width: 70px;
		height: 70px;
		padding: 10px 16px;
		border-radius: 35px;
		font-size: 24px;
		line-height: 1.33;
	}

	.btn-circle {
		width: 30px;
		height: 30px;
		padding: 6px 0px;
		border-radius: 15px;
		text-align: center;
		font-size: 12px;
		line-height: 1.42857;
	}

	/* 가계부 서브메뉴 */
	.bg-accbook-submenu {
		background-color: #06425C;
		font-size: 12px;
	}

	.bg-accbook-config {
		background-color: #51A39D;
		font-size: 12px;
	}

	.color-red {
		color: red;
	}

	/* 설정 */
	.sortable {
		list-style: none;
        padding-left: 0px;
	}

	#box_account_list.swiper-wrapper {
		min-height: 400px;
	}

	/* 자산 */
	#box_balance .nav-pills > li > a {
		border-radius: 4px 4px 0 0;
	}
	#box_balance .nav-pills > li > .active,
	#box_balance .nav-pills > li > a:hover {
		color: #333;
		background-color: #D9EDF7;
	}

	#box_balance .tab-content {
		padding : 5px 15px;
		font-size: 11px;
	}

	/* 내역 */
	#box_accbook_list kbd {
		font-size: 0.7em;
	}

/* =======================================================================
	칼렌더
======================================================================= */
	#box_calendar tbody td {
		position: relative;
		height: 60px;
	}

	/* 서브메뉴 */
	.bg-history-submenu {
		background-color: #06425C;
		font-size: 12px;
	}

	.bg-history-submenu2 {
		background-color: #51A39D;
		font-size: 12px;
	}

	.date_lunar {
		position: absolute;
		top: 6px;
		right: 2px;
	}

	/* icon */
	.event-icon {
		position: absolute;
		width: 90%;
		height: 10px;
		left: 3px;
		bottom: 0px;
	}

	.event-icon-primary {
		position: relative;
		float: left;
		margin-right: 2px;
		width: 5px;
		height: 5px;
		border-radius: 50%;
		background-color: #0275d8;
	}

	.event-icon-info {
		position: relative;
		float: left;
		margin-right: 2px;
		width: 5px;
		height: 5px;
		border-radius: 50%;
		background-color: #5bc0de;
	}

	.event-icon-success {
		position: relative;
		float: left;
		margin-right: 2px;
		width: 5px;
		height: 5px;
		border-radius: 50%;
		background-color: #5cb85c;
	}

	.event-icon-warning {
		position: relative;
		float: left;
		margin-right: 2px;
		width: 5px;
		height: 5px;
		border-radius: 50%;
		background-color: #f0ad4e;
	}

	.event-icon-danger {
		position: relative;
		float: left;
		margin-right: 2px;
		width: 5px;
		height: 5px;
		border-radius: 50%;
		background-color: #d9534f;
	}

	.event-icon-secondary {
		position: relative;
		float: left;
		margin-right: 2px;
		width: 5px;
		height: 5px;
		border-radius: 50%;
		background-color: #292b2c;
	}

	#box_view_detail .close {
		font-size: 1em;
	}

	#diary_contents img {
		max-width: 100%;
	}

/* =======================================================================
	타임라인
======================================================================= */
	#myTimeline {
		margin: 0;
		line-height: 1em;
		font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
		font-size: 14px;
		color: #333;
	}
	#myTimeline h2,
	#myTimeline h3,
	#myTimeline h4,
	#myTimeline h5 {
		margin-top: 5px; margin-bottom: 5px; line-height: 1;
	}
	ul#timeline-menu { min-height:50px; text-align:center; display: inline-block; }
	ul#timeline-menu li { position: relative; float: left; list-style: none; margin: 0px; padding: 0px; }
	ul#timeline-menu li a { display: block; text-decoration: none; font-size: 16px; padding: 10px; padding-top: 20px; color: black; font-weight:bold; border-bottom: 5px solid transparent; }
	ul#timeline-menu li a:hover { color: #EF693A; border-bottom: 5px solid #EF693A; font-weight:normal;}
	ul#timeline-menu li:after { content: ''; display: block; clear: both; }

	section#timeline { position: relative; width: 90%; margin: 20px auto; padding-bottom: 20px; }
	section#timeline:before { top: 0; bottom: 0; position: absolute; content: " "; width: 2px; background-color: #EF693A; left: 50%; height: 100%; margin-left: -1.5px; }
	section#timeline article { width: 100%; margin-bottom: 20px; position: relative; }
	section#timeline article:after { content: ''; display: block; clear: both; }
	section#timeline > article > div.panel { width: 45%; float: left; background: #FFF; border: none; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15); box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15); }
	section#timeline > article > div.panel .panel-heading { padding: 5px 10px; margin: 0; font-size: 1.2em; background-color: #EF693A; overflow: hidden; text-align: center; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; }
	section#timeline > article > div.panel .panel-heading .panel-title { color: #FFF; }
	section#timeline > article > div.panel .panel-body { padding: 15px; position: relative; }
	section#timeline article div.panel-body:after { content: ''; position: absolute; top: 20px; right: -5px; width: 10px; height: 10px; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); background: #FFF; }
	section#timeline > article > div.panel .panel-body img { display: inline-block; margin: 0 15px 15px 0; }
	section#timeline > article > div.panel .panel-footer { padding: 15px; background-color: #EEE; }
	section#timeline > article.inverted > div.panel { float: right; }
	section#timeline > article.inverted > div.panel .panel-body:after { left: -5px; }
	section#timeline > article.inverted > div.panel .panel-body img { display: inline-block; }
	section#timeline div[class*="group"],
	section#timeline article div.panel div.badge { display: block; text-align: center; cursor: none; font-weight: bold; -moz-box-shadow: 0 0 0 2px #EF693A, inset 0 2px 0 rgba(0, 0, 0, 0.1), 0 3px 0 2px rgba(0, 0, 0, 0.15); -webkit-box-shadow: 0 0 0 2px #EF693A, inset 0 2px 0 rgba(0, 0, 0, 0.1), 0 3px 0 2px rgba(0, 0, 0, 0.15); box-shadow: 0 0 0 2px #EF693A, inset 0 2px 0 rgba(0, 0, 0, 0.1), 0 3px 0 2px rgba(0, 0, 0, 0.15); }
	section#timeline div[class*="group"] { width: 65px; font-size: 1.3em; margin: 35px auto; padding: 5px; border-radius: 0px; background: #EF693A; color: #FFF; }
	section#timeline article div.panel div.badge { position: absolute; top: 0; left: 50%; margin: 0 0 0 -15px; border-radius: 50%; font-size: 0.75em; width: 30px; height: 30px; background: #FFF; color: #EF693A; line-height: 130%; }
	section#timeline article div.panel div.badge:last-child { background-color: #EF693A; width: 20px; height: 20px; margin: 0 0 0 -10px; }

/* =======================================================================
	다이얼로그 창
======================================================================= */
	.modal-body p { word-wrap: break-word; }