/* ��Ʈ ���� */
@font-face {
    font-family:NotoSans-Regular;
    src:url(font/NotoSans-Regular.eot); /* IE9 Compat Modes */
    src:url(font/NotoSans-Regular.eot?#iefix) format('embedded-opentype'), /* IE6-IE8 */
    	url(font/NotoSans-Regular.woff) format('woff'), /* Modern Browsers */
    	url(font/NotoSans-Regular.otf) format('truetype'); /* Safari, Android, iOS */
}

@font-face {
    font-family:NotoSans-Light;
    src:url(font/NotoSans-Light.eot); /* IE9 Compat Modes */
    src:url(font/NotoSans-Light.eot?#iefix) format('embedded-opentype'), /* IE6-IE8 */
    	url(font/NotoSans-Light.woff) format('woff'), /* Modern Browsers */
    	url(font/NotoSans-Light.otf) format('truetype'); /* Safari, Android, iOS */
}

@font-face {
    font-family:NotoSans-Medium;
    src:url(font/NotoSans-Medium.eot); /* IE9 Compat Modes */
    src:url(font/NotoSans-Medium.eot?#iefix) format('embedded-opentype'), /* IE6-IE8 */
    	url(font/NotoSans-Medium.woff) format('woff'), /* Modern Browsers */
    	url(font/NotoSans-Medium.otf) format('truetype'); /* Safari, Android, iOS */
}

@brand-primary: darken(#428bca, 6.5%); /* #337ab7 */
@brand-success: #5cb85c;
@brand-info:    #5bc0de;
@brand-warning: #f0ad4e;
@brand-danger:  #d9534f;

/* ��Ʈ ���� */
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-family: NotoSans-Regular,sans-serif !important;
	font-weight: 400;
	overflow-x: hidden;
	overflow-y: auto;
	margin-bottom:-10px;
	min-width:1280px;
	overflow-x:auto;
	background-color: #222d32;
}

/* �ؽ�Ʈ ���� ó�� */
.text-line-1 {
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.row_detail > td {
	background-color:#dce8e8;
}

/* ��Ʈ ���� */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: NotoSans-Regular,sans-serif !important;
}

/* */
.select2_default_width {
	width:200px;
}

.select2_phone_width {
	width:100px;
}

.main-sidebar, .left-side {
	height:100
}

.border-top-none {
	border-top: none !important;
}
.border-left-none {
	border-left: none !important;
}
.border-bottom-none {
	border-bottom: none !important;
}
.border-right-none {
	border-right: none !important;
}

.input-group .input-group-label {
	border-radius: 0;
	background-color: #fff;
	padding: 6px 12px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
	color: #555;
	text-align: center;
	border: 1px solid #ccc;
	border-right: none;
	white-space: nowrap;
	vertical-align: middle;
	line-height:20px;
}

.input-group .input-group-label-2 {
	border-radius: 0;
	background-color: #fff;
	padding: 6px 12px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
	color: #555;
	text-align: center;
	border: 1px solid #ccc;
	white-space: nowrap;
	vertical-align: middle;
	line-height:20px;
}


.switch-btn-box {
 	text-align:center;
 	padding-top: 180px;
}
.switch-btn-box button {
	margin-bottom: 5px;
}
.sorting-list li {
	background:url(../images/icon/dragdrop.png) no-repeat 260px
}
.keyword-list {
	height: 300px;
	overflow-x: hidden;
	overflow-y: auto;
}
.keyword-list li{
	cursor:pointer;
	display:block;
	height:45px;
	line-height:45px;
	padding-left:15px;
	font-size:15px;
	color:#333;
	display:list-item;
	text-align:-webkit-match-parent;
}
.keyword-list li.wait{
	color:#999
}
.keyword-list li.selected{
	background-color:#ebebeb
}
.switch-btn-box p button.btn_add,
.switch-btn-box p button.btn_cancel {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
.switch-btn-box p button.btn_add:active
.switch-btn-box p button.btn_cancel:active {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
.switch-btn-box p button.btn_add{
	width:40px;
	height:40px;
	border-radius:20px;
	border:2px solid #337ab7;
	font-size:15px;
	font-weight:bold;
	color:#337ab7;
	line-height:40px;
	background:#fff;
}
.switch-btn-box p button.btn_cancel{
	width:40px;
	height:40px;
	border-radius:20px;
	border:2px solid #d8d8d8;
	font-size:15px;
	font-weight:bold;
	color:#d8d8d8;
	line-height:40px;
	background:#fff;
}

.img_box{
	position:relative;
	max-height: 250px;
	max-width: 250px;
}
.btn_remove{
	position:absolute;
	cursor:pointer;
	top:2px;
	right:23px;
	display:none;
	z-index:1;
	font-weight:bold;
	border: 1px solid #fffff;
}

div.dataTables_paginate {
	text-align: center;
}
div.dataTables_paginate ul.pagination {
	margin:15px 0 10px;
}
.dataTables_empty {
	text-align:center;
}

.input-group .input-group-addon2 {
	border-radius: 0;
	border-color: #d2d6de;
	background-color: #e6e8ea;
}

.border-side-none {
	border-left:none;
	border-right:none;
}

span.glyphicon.glyphicon-calendar {
	cursor:pointer;
}

table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after {
	position: absolute;
	top: 8px;
	right: 8px;
	display: block;
	font-family: 'FontAwesome';
	opacity: 0.5;
}

table.dataTable thead .sorting:after {
	opacity: 0.2;
	content: "\f0dc";
	color: #337ab7;
}

table.dataTable thead .sorting_asc:after {
	content: "\f0de";
	color: #337ab7;
}

table.dataTable thead .sorting_desc:after {
	content: "\f0dd";
	color: #337ab7;
}

/* ������ ���̺� ���� ������ ���� �� */

/* Jquery Validate Error */
div.validation-error {
	height:20px;
	line-height:20px;
	color: #d9534f;
	font-size:12px;
}
input.validation-error {
	border: 1px solid #d9534f;
}
table.validation-error {
	border: 1px solid #d9534f !important;
}

/* Table Height Custom */
.table.write-table > thead > tr > th,
.table.write-table > tbody > tr > th,
.table.write-table > tfoot > tr > th,
.table.write-table > thead > tr > td,
.table.write-table > tbody > tr > td,
.table.write-table > tfoot > tr > td {
	line-height: 34px;
}

/* ģ���� */
.box-body em {
	color: #3c8dbc;
}
.header-title {
	display: inline-block;
}
 .form-input-free {
  width: 100% !important;
  height: 34px !important;
}

.form-input-title {
  width: 300px !important;
  height: 34px !important;
}

.form-input-text {
  width: 300px !important;
  height: 34px !important;
}

.form-input-email {
  width: 261px !important;
  height: 34px !important;
}

.form-input-mobile {
  width: 264px !important;
  height: 34px !important;
}

.form-input-short {
  width: 150px !important;
  height: 34px !important;
}

.form-input-mini {
  width: 80px !important;
  height: 34px !important;
}

.form-textarea {
	width:700px !important;
	height:160px;
	display: block;
}

.form-textarea-short {
	width:700px !important;
	height:80px;
	display: block;
}

.form-textarea-small-short {
	width:600px !important;
	height:80px;
	display: block;
}

.form-textarea-small {
	width:500px !important;
	height:100px;
	display: block;
}

.form-textarea-mini {
	width:400px !important;
	height:80px;
	display: block;
}

.form-textarea-free {
	width:auto !important;
	height:80px;
	display: block;
}
.form-search {
  width: 200px !important;
  height: 34px !important;
  font-size: 15px !important;
}
.form-search:not(select) {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.form-select {
  width: 100px !important;
  height: 34px !important;
}
.form-select:not(select) {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.form-select > option {
  cursor: pointer;
}

.form-select-free {
  width: auto !important;
  height: 34px !important;
}
.form-select-free:not(select) {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.form-select-mini {
  width: 65px !important;
  height: 34px !important;
}
.form-select-mini:not(select) {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.form-select-short {
  width: 78px !important;
  height: 34px !important;
}
.form-select-short:not(select) {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
form-select:after {
	content: ' ' !important;
	margin-left: 8px !important;
}
.form-select-no {
	max-width: 200px;
    overflow-x: hidden;
    overflow-y: scroll;
}

.btn-search {
  background-color: #3c8dbc;
  border-color: #367fa9;
  color: #fff;
  border-radius: 0 !important;
}
.btn-search:hover,
.btn-search:active,
.btn-search.hover {
  color: #fff;
  background-color: #367fa9;
}
.btn-add {
	padding: 0;
	margin: 0;
  background-color: #3c8dbc;
  border-color: #367fa9;
  font-weight: bold;
  font-size: 18px;
  width: 34px;
  height: 34px;
}
.btn-add:hover,
.btn-add:active,
.btn-add.hover {
  background-color: #367fa9;
}

.btn-list {
  background-color: #3c8dbc;
  border-color: #367fa9;
  color: #fff;
}
.btn-list:hover,
.btn-list:active,
.btn-list.hover {
  background-color: #367fa9;
  color: #fff;
}
.btn-save {
  background-color: #3c8dbc;
  border-color: #367fa9;
  color: #fff;
}
.btn-save:hover,
.btn-save:active,
.btn-save.hover {
  color: #fff;
  background-color: #367fa9;
}
.btn-temp {
  background-color: #3c8dbc;
  border-color: #367fa9;
  color: #fff;
}
.btn-temp:hover,
.btn-temp:active,
.btn-temp.hover {
  background-color: #367fa9;
  color: #fff;
}
.btn-delete {
  background-color: #3c8dbc;
  border-color: #367fa9;
  color: #fff;
}
.btn-delete:hover,
.btn-delete:active,
.btn-delete.hover {
  background-color: #367fa9;
  color: #fff;
}
.btn-create {
  background-color: #3c8dbc;
  border-color: #367fa9;
  color: #fff;
}
.btn-create:hover,
.btn-create:active,
.btn-create.hover {
  background-color: #367fa9;
  color: #fff;
}
.btn-setting {
  background-color: #3c8dbc;
  border-color: #367fa9;
  margin: 0 2px;
  color: #fff;
}
.btn-setting:hover,
.btn-setting:active,
.btn-setting.hover {
  background-color: #367fa9;
  color: #fff;
}
.btn-ftalk-send {
	display: none;
}
.glyphicon-menu {
	font-size: 17px;
}
.glyphicon-btn {
	padding: 3px 0 !important;
}
.fa-navi {
	margin: 3px 0;
}
.btn-window {
  background-color: #fff;
  color: #666;
  font-size:20px;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.btn-window:hover,
.btn-window:active,
.btn-window.hover {
  color: #666;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.btn-excel {
  background-color: #e7e7e7;
  color: #444;
  border-color: #bbb;
}
.btn-excel:hover,
.btn-excel:active,
.btn-excel.hover {
  background-color: #ccc;
}
.btn-fileupload {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip:rect(0,0,0,0);
  border: 0;
}
.title-group {
	display: table;
	width: 100%;
}
.btn-group-title {
	vertical-align: middle !important;
	display: table-cell;
}
.btn-group-title button {
    border-top-right-radius: 3px !important;
    border-bottom-right-radius: 3px !important;
	vertical-align: middle !important;
	display: block;
	margin: 0 auto;
	margin-right: 5px;
}
.btn-remove {
	position: absolute;
	cursor: pointer;
	padding: 3px 0 0 283px;
	font-weight: bold;
	color: #ddd;
}
.table-middle > tbody > tr > td {
	vertical-align: middle;
}
.table-middle > tbody > tr > td > img {
	max-width: 400px;
}
.table-controls {
  padding-top: 5px;
  padding-bottom: 5px;
}
.table-controls.with-border {
  border-bottom: 1px solid #f4f4f4;
}

 .contents-box {
 	margin: 0 15px;
 	padding-bottom: 20px;
 }
 
 .top-search-box {
 	margin-bottom: 7px;
 	overflow: hidden;
 	float: none;	
 }
 .top-search-box > div {
	margin-bottom: 8px !important
}
.top-search-box label {
	margin-right: 5px;
}
.keyboard-box-wrapper {
  min-width: 700px !important;
  margin-bottom: 15px !important;
}
.keyboard-box {
  min-width: 300px !important;
  width: 40% !important;
  margin-bottom: 15px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3) !important;
}
 .chart-box {
 	border: 1px solid #d2d6de;
 	margin: 10px 0;
 	box-shadow: none !important;
 }
 .stats-box {
 	min-width: 1020px !important;
 	overflow: hidden;
 }
 .stats-total-box {
 	margin: 0 !important;
 }
 .btn-box {
 	padding-top: 10px !important;
 	text-align: center;
 	overflow: hidden;
 	clear: both;
 }
 .btn-box-btm {
 	padding-bottom: 15px !important;
 	text-align: center;
 	overflow: hidden;
 	clear: both;
 }
 .switch-btn-box {
 	text-align:center;
 	padding-top: 180px;
 	margin: 0 15px;
 }
 .switch-btn-box button {
 	margin-bottom: 5px;
 }
 .radio-box {
 	margin-bottom: 10px;
 }
.checkbox-box {
	margin-right: 10px;
}
.btn-rm-box {
	width: 30px;
	height: 34px;
	border-radius: 0 !important;
	color: #fff;
	text-align: center;
	font-weight: bold;
	background-color: #808080;
}
.img-box {
	padding-top: 5px;
	 width: 300px;
	 clear: both;
}
.template-list {
	list-style: none;
	padding:0;
}
.template-list > li {
	cursor: pointer;
}
.template-list-checkbox {
	margin-right: 4px;
}
.cont-box {
	padding: 10px;
	min-height: 200px;
}
.search-date-box {
	position: relative;
	margin-right: 10px !important;
}
.numbers, .files {
	overflow: hidden;
}
.number-box {
	margin: 0 5px 5px 0;
}
.number-box-mini {
	width: 102px !important;
	margin: 0 5px 5px 0;
}
.numbers-box {
    padding: 10px;
    overflow: hidden;
	border: 1px solid #ccc;
}
.filter-box,
.next,
.add-cond {
	margin: 8px 10px !important;
}
 .filter-box label {
 	float: left;
 	margin-right: 5px;
 	line-height: 30px;
 }
.cond-box {
	clear: both;
	margin-bottom: 7px;
	height: 34px;
}
.first-box {
	clear: none !important;
}
.filter {
	border: 1px solid #ddd;
	display: block;
	overflow: hidden;
}
.user-all {
	border: 1px solid #ddd;
	padding: 8px 10px;
	display: block;
	overflow: hidden;
}
.control-box {
	overflow: hidden;
}
.control-box button {
	margin-left: 8px;
}
.contact-info {
	margin: 5px;
}
.contact-info a,
.contact-info a:hover {
	  color: #666;
	  border-top: 0;
}
.tutorial-box {
	border-radius: 2px !important;
}
.tutorial-title {
	padding: 15px 9px 9px !important;
}
.tutorial-content,
.tutorial-navigation {
	padding: 9px !important;
	min-width: 272px !important;
}
.textarea-desc {
	display: block;	
}
.form-text strong {
	color: #3c8dbc;
}
.form-date {
	width: 150px !important;
}
.form-text {
	line-height: 30px;
	font-size: 15px;
}
.text-invalid {
	color: red
}
.cursor-pointer {
	cursor: pointer;
}
.cursor-not-allowed {
	cursor: not-allowed !important;
}
.none-events {
	pointer-events: none;
}
.under-line {
	text-decoration: underline;
}
.table-view {
	border: 0;
}
table.table th.dt-left,
table.table td.dt-left {
  text-align: left;
}
table.table th.dt-center,
table.table td.dt-center,
table.table td.dataTables_empty {
  text-align: center;
}
table.table th.dt-right,
table.table td.dt-right {
  text-align: right;
}
table.table thead th.dt-head-left,
table.table thead td.dt-head-left,
table.table tfoot th.dt-head-left,
table.table tfoot td.dt-head-left {
  text-align: left;
}
table.table thead th.dt-head-center,
table.table thead td.dt-head-center,
table.table tfoot th.dt-head-center,
table.table tfoot td.dt-head-center {
  text-align: center;
}
table.table thead th.dt-head-right,
table.table thead td.dt-head-right,
table.table tfoot th.dt-head-right,
table.table tfoot td.dt-head-right {
  text-align: right;
}
table.table tbody th.dt-body-left,
table.table tbody td.dt-body-left {
  text-align: left;
}
table.table tbody th.dt-body-center,
table.table tbody td.dt-body-center {
  text-align: center;
}
table.table tbody th.dt-body-right,
table.table tbody td.dt-body-right {
  text-align: right;
}
table.table thead th.no-sorting {
	padding-right: 8px !important;
}
table.table tbody tr.selected {
	color: #3c8dbc;
	font-weight: bold;
}
.table-info-box {
	width: 100%;
	text-align: center;
}
.num-cnt {
	display:block;
	clear:both;
}
.capt {
	margin-bottom: 5px !important;
}
.capt strong {
	color: #3c8dbc;
}
.section {
	margin: 5px 0;
}
.text-section {
	max-height: 150px;
	overflow-y: hidden;
}
.label-title {
	font-size: 25px !important;
}
.label-content {
	font-size: 23px !important;
	overflow: hidden;
	text-align: center;
}
.label-content > div {
	display: inline-block;
}
.table-popup > tbody > tr > td {
	max-width: 300px !important;
	overflow: hidden;
}

.blind {
	display: block;
	overflow: hidden;
	*position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 0;
	border: 0;
	background: none;
	font-size: 0;
	line-height: 0
}
.hidden {
	display:none
}
.modal-ftalk-content {
	width: 100% !important;
}
.modal-template-content {
	width: 720px !important;
	margin-left: -50px;
}
.modal-preview-content {
	max-width: 430px !important;
	margin-left: 85px;
}
.modal-ftalk-preview-content {
	max-width: 315px !important;
	margin-left: 142px;
}
.modal-login-content {
	width: 400px !important;
	margin-left: 100px;
}
.msg-preview {
	position: relative;
	background: #fff;
	width: 420px;
	height: auto;
	min-height: 75px;
	padding: 5px 10px;
	font-size: 18px;
	border: 1px solid #ccc;
	border-radius: 1px;
    overflow-wrap: break-word;
}
.msg-preview img {
	max-width: 400px;
}
.msg-preview a,
.msg-preview a:hover {
	color: #999;
}
.msg-preview:after, .msg-preview:before {
	right: 100%;
	top: 40px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.msg-preview:after {
	border-color: rgba(255, 255, 255, 0);
	border-right-color: #fff;
	border-width: 10px;
	margin-top: -10px;
}
.msg-preview:before {
	border-color: rgba(204, 204, 204, 0);
	border-right-color: #ccc;
	border-width: 11px;
	margin-top: -11px;
}

.ftalk-button {
	border: 0 none; 
	border-top: 1px solid #ccc; 
	padding: 10px 0 0 0; 
	background: url('../images/icon/arr.png') right no-repeat;
}
.ftalk-button-no-border {
	border: 0 none;
}

.ftalk-preview .msg-preview {
	position: relative;
	width: 285px;
	height: auto;
	padding: 0;
	background: #fff;
	font-size: 15px;
	border: 1px solid #ccc;
	border-radius: 1px;
	overflow-wrap: break-word;
    font-weight: normal;
}

.ftalk-preview .msg-preview:before,
.ftalk-preview .msg-preview:after {
	border: none;
}

.ftalk-preview .section {
	margin: 0;
}

.ftalk-preview .text-box {
	padding: 10px;
	line-height: 25px;
}

.ftalk-preview .img-box {
	width: 283px;
	padding: 0;
	text-align: center;
}

.ftalk-preview .img-box img {
	max-width: 283px;
}

.ftalk-preview .button-box {
	position: relative;
	margin-bottom: 10px;
}

.ftalk-preview .button-box .button {
	width: 265px;
	height: 35px;
	padding: 0 15px;
	margin: 0 auto;
    color: #1eb9cb;
    border: 1px solid #ddd;
    line-height: 35px;
	cursor: pointer;
}

.msg-content-box {
	margin: 30px;
}
.chart-info {
	padding-top: 20px;
	font-size: 18px;
}
.campaignInfoLayer {
	display:none;
	position:absolute;
	top:49px;
	right:60px;
	width:300px;
	background-color:#fff;
	z-index:250;
	border:1px;
	solid #b9b9b9;
	padding:10px;
}
.media_msg_view {
	margin-bottom: 30px;
}
.step_title {
	padding:10px;
	line-height:20px;
	border:1px solid #d2d2d2;
	background:none repeat scroll 0 0 #f2f2f2;
	margin-bottom:2px;
}
	
.step_name {
	font-weight:bold;
}
.step_content {
	padding:10px;
	margin-bottom:20px;
	min-height:50px;
	border:1px solid #d2d2d2;
	background:none repeat scroll 0 0 #fezfafa;
}
.step_content p {
	line-height:20px;
}
.answer {
	color:#3c8dbc;
	font-weight:bold
}
.answer_margin {
	margin-top:10px;
}
.text-selected {
	color:#3c8dbc;
	font-weight:bold;
}

.template-box h3,
.template-buttons-box h3 {
	font-size: 15px;
}

.template-button-box {
	border: 1px #3c8dbc dashed;
    padding: 10px;
    margin: 5px 0;
}

.template-button-box .title {
	margin-top: 5px;
	margin-bottom: 5px;
	font-weight: bold;
}

/* Datepicker Custom */
.datepicker table tr td.disabled,
.datepicker table tr td.disabled:hover {
  background: none;
  color: #999;
  cursor: default;
}

/* template list */
.template-list  .thumbnail .image {
  height: auto;
  max-height: 200px;
  overflow: hidden;
}
.template-list .title {
	height: 30px;
	line-height: 25px;
	overflow: hidden;	
	border-bottom: 1px solid #ccc;
	margin-bottom: 3px;
}
.template-list .text-section {
	height: 25px;
	line-height: 25px;
	overflow: hidden;	
}
.template-list .btn-section {
	height: 30px;
	line-height: 30px;
	margin: 3px 0 7px 0;
	position: absolute;
	bottom: 0;
}
.template-list .thumbnail {
  height: 300px;
  overflow: hidden;
  position: relative;
}
.template-list .thumbnail div {
	cursor: pointer;
}

.col-md-77 {
  width: 50%;
  margin-bottom: 10px;  
  position: relative;
  min-height: 1px;
  float: left;
  padding-right: 10px;
  padding-left: 10px;
}
@media (min-width: 768px) {
  .col-md-77 {
    width: 25%;
  }
}
@media (min-width: 992px) {
  .col-md-77 {
    width: 25%;
  }
}
@media (min-width: 1200px) {
  .col-md-77 {
    width: 25%;
  }
}

.col-md-66 {
  width: 50%;
  margin-bottom: 10px;  
  position: relative;
  min-height: 1px;
  float: left;
  padding-right: 10px;
  padding-left: 10px;
}
@media (min-width: 768px) {
  .col-md-66 {
    width: 50%;
  }
}
@media (min-width: 992px) {
  .col-md-66 {
    width: 50%;
  }
}
@media (min-width: 1200px) {
  .col-md-66 {
    width: 50%;
  }
}

/* *********  media gallery  **************************** */

.thumbnail .image {
  height: 120px;
  overflow: hidden;
}
.caption {
  padding: 9px 5px;
  background: #F7F7F7;
}
.caption p {
  margin-bottom: 5px;
}
.thumbnail {
  height: 170px;
  overflow: hidden;
  margin-bottom: 0 !important;
}
.thumbnail-unselected {
	border: 1px solid #ddd;
}
.thumbnail-selected {
	border: 2px solid #3c8dbc;
}
.view {
  overflow: hidden;
  position: relative;
  text-align: center;
  box-shadow: 1px 1px 2px #e6e6e6;
  cursor: default;
}
.view .mask, .view .content {
  position: absolute;
  width: 100%;
  overflow: hidden;
  top: 0;
  left: 0
}
.view img {
  display: block;
  position: relative
}
.view .tools {
  text-transform: uppercase;
  color: #fff;
  text-align: center;
  position: relative;
  font-size: 17px;
  padding: 3px;
  background: rgba(0, 0, 0, 0.35);
  margin: 43px 0 0 0;
}
.mask.no-caption .tools {
  margin: 90px 0 0 0;
}
.view .tools a {
  display: inline-block;
  color: #FFF;
  font-size: 18px;
  font-weight: 400;
  padding: 0 4px;
}
.view p {
  font-size: 12px;
  position: relative;
  color: #fff;
  padding: 10px 20px 20px;
  text-align: center
}
.view a.info {
  display: inline-block;
  text-decoration: none;
  padding: 7px 14px;
  background: #000;
  color: #fff;
  text-transform: uppercase;
  box-shadow: 0 0 1px #000
}
.view-first img {
  transition: all 0.2s linear;
}
.view-first .mask {
  opacity: 0;
  background-color: rgba(0, 0, 0, 0.5);
  transition: all 0.4s ease-in-out;
}
.view-first .tools {
  transform: translateY(-100px);
  opacity: 0;
  transition: all 0.2s ease-in-out;
}
.view-first p {
  transform: translateY(100px);
  opacity: 0;
  transition: all 0.2s linear;
}
.view-first:hover img {
  transform: scale(1.1);
}
.view-first:hover .mask {
  opacity: 1;
}
.view-first:hover .tools, .view-first:hover p {
  opacity: 1;
  transform: translateY(0px);
}
.view-first:hover p {
  transition-delay: 0.1s;
}

ul.media-list {
	padding:0;
}
.media-view-box {
	padding: 20px;
	margin: 0 auto;
	min-width: 945px !important;
}
.col-md-55 {
  width: 50%;
  margin-bottom: 10px;  
  position: relative;
  min-height: 1px;
  float: left;
  padding-right: 10px;
  padding-left: 10px;
}
@media (min-width: 768px) {
  .col-md-55 {
    width: 20%;
  }
}
@media (min-width: 992px) {
  .col-md-55 {
    width: 20%;
  }
}
@media (min-width: 1200px) {
  .col-md-55 {
    width: 20%;
  }
}
/* *********  /media gallery  **************************** */

.back-to-top {
background: none;
margin: 0;
position: fixed;
bottom: 0;
right: 0;
width: 70px;
height: 70px;
z-index: 100;
display: none;
text-decoration: none;
}
.back-to-top i {
  font-size: 60px;
}

.ftalk-popup-content .title-box {
	padding-top: 10px;
	overflow:hidden;
	border-top: 1px solid #012831;
}
.ftalk-popup-content .write-box {
	overflow:hidden;
}
.ftalk-popup-content .emoti_box {
	position:relative;
	height:42px;
}
.ftalk-popup-content .emoti_box .emoti_box {
	position:absolute;
	left:0px;
	width:455px;
}
.ftalk-pnotify {
	right: 0 !important;
	height: 80% !important;
	width: 453px !important;
}
.ftalk-pnotify > div {
	overflow-y: auto;
}
.rcpt-list {
	position:relative;
	height:30px;
	line-height:30px;
	text-align:left;
	border-bottom:1px solid #dcdcdc;
}
img.preview {
	max-width: 300px;
}
.att_file {
	margin:0;
	padding:0;
	list-style: none;
}

.btn-tooltip { 
	margin-left: 8px;
	vertical-align: middle; 
}
.gray-tooltip + .tooltip.top > .tooltip-arrow { 
	border-top-color:#e7e7e7;
}
.gray-tooltip + .tooltip.bottom > .tooltip-arrow { 
	border-bottom-color:#e7e7e7;
}
.gray-tooltip + .tooltip.right > .tooltip-arrow { 
	border-bottom-right:#e7e7e7;
}
.gray-tooltip + .tooltip.top > .tooltip-inner,
.gray-tooltip + .tooltip.bottom > .tooltip-inner,
.gray-tooltip + .tooltip.right > .tooltip-inner {
	max-width: 500px !important;
	background-color: #e7e7e7; 
	font-size: 15px; 
	text-align:left;
	color: #444;
}

.templateList td {
	vertical-align: middle !important;
}
.subject-block {
	margin-bottom: 15px;
}
.subject-block:before,
.subject-block:after {
  content: " ";
  display: table;
}
.subject-block:after {
  clear: both;
}
.subject-block img {
  width: 40px;
  height: 40px;
  float: left;
}
.subject-block .username,
.subject-block .description,
.subject-block .comment {
  display: block;
  margin-left: 50px;
}
.subject-block .username {
  font-size: 16px;
  font-weight: 600;
}
.subject-block .description {
  color: #999;
  font-size: 13px;
}
.subject-block.user-block-sm .username,
.subject-block.user-block-sm .description,
.subject-block.user-block-sm .comment {
  margin-left: 40px;
}
.subject-block.user-block-sm .username {
  font-size: 14px;
}

.sorting-list li {
	background:url(../images/icon/dragdrop.png) no-repeat right;
}
.keyword-list {
	height: 300px;
	overflow: auto;
}
.keyword-list li{
	display:block;
	height:45px;
	line-height:45px;
	padding-left:15px;
	font-size:15px;
	color:#333;
	display:list-item;
	text-align:-webkit-match-parent;
    border-right: 10px solid transparent;
}
.keyword-list li.wait{
	color:#999
}
.keyword-list li.selected{
	background-color:#ebebeb
}
.switch-btn-box p button.btn_add,
.switch-btn-box p button.btn_cancel {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
.switch-btn-box p button.btn_add:active
.switch-btn-box p button.btn_cancel:active {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
.switch-btn-box p button.btn_add{
	width:40px;
	height:40px;
	border-radius:20px;
	border:2px solid #337ab7;
	font-size:15px;
	font-weight:bold;
	color:#337ab7;
	line-height:40px;
	background:#fff;
}
.switch-btn-box p button.btn_cancel{
	width:40px;
	height:40px;
	border-radius:20px;
	border:2px solid #d8d8d8;
	font-size:15px;
	font-weight:bold;
	color:#d8d8d8;
	line-height:40px;
	background:#fff;
}
.keyword-preview-box {
	position: relative;
	padding-top: 15px;
	width: 300px !important;
	height: 527px;
	background:url(/../images/smartphone.png) no-repeat center top;
	overflow: hidden;
}
.keyword-screen-box {
	position: relative;
	background-color: #e7eced;
	width: 282px;
	height: 340px;
	margin: 68px auto;
}
.keyword-keyboard-area {
	position: absolute;
	background-color: #fff;
	width: 100%;
	height: 170px;
	bottom: 0;
	padding: 20px 20px 5px 20px;
	
}
.keyword-buttons {
	text-align: center;
	padding: 0;
	margin: 0;
}
.keyword-buttons li {
	list-style: none;
	text-align: center;
	padding: 6px 0;
	margin: 5px auto;
	border: 1px solid #ddd;
}
.keyboard-dots {
	padding: 0;
	margin: 0 0 8px;
	height: 16px;
	text-align: center;
}
.keyboard-dots li {
  height: 6px;
  width: 6px;
  border-radius: 50%;
  text-align: center;
  vertical-align: middle;
  position: relative;
  background-color: #b6b6b6;
  display: inline-block;
  margin: 5px;
  cursor: pointer;
}
.keyboard-dots li.selected {
  background-color: #5ad9bd;
}

.btn-hint {
	overflow: hidden;
	padding: 10px 0 0 10px;
	cursor: pointer;
}
.hint-box {
	display: inline-table;
	overflow: hidden;
}
.hint-title {
    padding-top: 8px;
    margin-bottom: 5px;
    overflow: hidden;
    font-size: 15px;
}
.hint {
  position:absolute;
  background-color:#f39c12;
  width:1.3em;
  height:1.3em;
  border-radius:50%;
  -webkit-transform:translateX(-50%) translateY(-50%);
}
.hint:before {
  position:absolute;
  content:"";
  width:1.3em;
  height:1.3em;
  left:0;
  top:0;
  background-color:transparent;
  border-radius:50%;
  box-shadow:0px 0px 2px 2px #4f4f4f;
  -webkit-animation:active 2s infinite linear;
  animation:active 1.5s infinite linear;
}

.input-label {
	font-size: 12px;
}

@-webkit-keyframes active{
  0%{
    -webkit-transform:scale(.1);
    opacity:1;
  }
  70%{
    -webkit-transform:scale(1.5);
    opacity:0;
  }
  100%{
    opacity:0;
  }
}

@keyframes active{
  0%{
    transform:scale(.1);
    opacity:1;
  }
  70%{
    transform:scale(1.5);
    opacity:0;
  }
  100%{
    opacity:0;
  }
}
/* ģ���� */