@charset "utf-8";

/* RESET
---------------------------------------- */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}

ul,ol {list-style:none;}
sup {font-size: .85em}

blockquote, q {quotes:none;}
blockquote:before, blockquote:after,q:before, q:after {content:''; content:none;}

a {margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; outline:none;}

del {text-decoration:line-through;}

abbr[title], dfn[title] {border-bottom:1px dotted; cursor:help;}

table {border-collapse:collapse; border-spacing:0;}

input, select {vertical-align:middle;}

img {vertical-align:bottom; border:none; font-size:0; line-height:0;}

em {font-style:normal;}

body {-webkit-text-size-adjust:none; font-family: Helvetica, Arial, 'Hiragino Kaku Gothic ProN', 'ƒqƒ‰ƒMƒmŠpƒS ProN W3', 'ƒ‚ƒŠƒTƒ VƒS R', 'Droid Sans', ƒƒCƒŠƒI, 'sans-serif'; font-size:14px;}

address {font-style:normal;}

* {box-sizing: border-box;}

button {font-size: 100%;}

/*
 *  COMMON CLASS
 *
 *------------------------------------*/

a {color: #444;}


.layout-fixed {table-layout: fixed;}

.flexbox, .flex {display: -webkit-flex; display: flex; }
.flexbox {-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; }
.flex {justify-content: center; align-items: center; }
.flex i {margin-right: 5px; }

.w20 {width: 20px !important;}
.w30 {width: 30px !important;}
.w40 {width: 40px !important;}
.w50 {width: 50px !important;}
.w60 {width: 60px !important;}
.w70 {width: 70px !important;}
.w80 {width: 80px !important;}
.w90 {width: 90px !important;}
.w100 {width: 100px !important;}
.w110 {width: 110px !important;}
.w120 {width: 120px !important;}
.w130 {width: 130px !important;}
.w140 {width: 140px !important;}
.w150 {width: 150px !important;}
.w160 {width: 160px !important;}
.w170 {width: 170px !important;}
.w180 {width: 180px !important;}
.w190 {width: 190px !important;}
.w200 {width: 200px !important;}
.w210 {width: 210px !important;}
.w220 {width: 220px !important;}
.w230 {width: 230px !important;}
.w240 {width: 240px !important;}
.w250 {width: 250px !important;}
.w260 {width: 260px !important;}
.w270 {width: 270px !important;}
.w280 {width: 280px !important;}
.w290 {width: 290px !important;}
.w300 {width: 300px !important;}
.w320 {width: 320px !important;}
.w400 {width: 400px !important;}
.w500 {width: 500px !important;}
.w600 {width: 600px !important;}
.w100p {width: 100% !important;}
.wa {width: auto !important;}

.h50 {height: 50px !important;}
.h100 {height: 100px !important;}
.h150 {height: 150px !important;}
.h200 {height: 200px !important;}
.h300 {height: 300px !important;}
.h400 {height: 400px !important;}

.mt0 {margin-top: 0 !important;}
.mt10 {margin-top: 10px !important;}
.mt20 {margin-top: 20px !important;}
.mt30 {margin-top: 30px !important;}

.mb10 {margin-bottom: 10px !important;}
.mb20 {margin-bottom: 20px !important;}
.mb30 {margin-bottom: 30px !important;}

.taL, .tal {
    text-align: left !important;
}
.taC, .tac {
    text-align: center !important;
}
.taR, .tar {
    text-align: right !important;
}
.fL {
    float: left !important;
}
.fR {
    float: right !important;
}
.cB {
    clear: both;
}
.fwB, .fwb {
    font-weight: bold !important;
}

.fw85 {font-size: .85em}

.col-note {color: #555}

.clearfix:after {
  content: "";
  clear: both;
  display: block;
}

.hidden {display: none !important;}

.nowrap {white-space: nowrap;}

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

body {padding-top: 40px;}
header {position: fixed; left: 0; top: 0; z-index: 9999; width: 100%; height: 40px; overflow: hidden; background: #000; color: #FFF;}
header h1 {float: left; width: 150px; padding: 0 15px; text-align: center; line-height: 20px; font-size: 20px; color: #00AFCC;}
header h1 img {width: 100px;}

.header-utility-notification {float: left; border-right: 1px solid #333;}
.header-utility-button {float: right; border-left: 1px solid #333;}
.header-utility-button a {display: block;  padding: 10px 15px; line-height: 20px; color: #FFF; text-decoration: none;}
.header-utility-label {float: right; border-left: 1px solid #333; padding: 10px 15px; line-height: 20px;}
.header-utility-notification-button {display: block;  padding: 10px 15px; line-height: 20px; color: #FFF; text-decoration: none;}
.header-utility-notification-button span {margin-left:3px;}

.navigation {float: left; border-right: 1px solid #333;}
.navigation nav::after {content:""; display: block; clear: both;}
.navigation li {float: left; border-left: 1px solid #333;}
.navigation a {display: block; height: 40px; padding: 10px 15px; line-height: 20px; color: #FFF; text-decoration: none;}
.navigation a i {margin-right: 5px;}
.navigation a:hover {border-bottom: 2px solid #00AFCC; background: #111;}
.navigation .active {border-bottom: 2px solid #00AFCC;}

.contents {padding: 20px;}
.contents p {margin-bottom: 20px; line-height: 1.8;}

/*
 *  TITLE
 *
 *------------------------------------*/

/*
 *  BUTTON
 *
 *------------------------------------*/


/*
 *  SYSTEM MESSAGE
 *
 *------------------------------------*/

.message-wrap {
    display: none;
    position:fixed;
    left: 0;
    top: 0;
    z-index: 99999;
    width: 100%;
    height: 100%;
    padding-top: 50px;
    background:rgba(0, 0, 0, 0.5);
}

.sys-message-wrap {
    display: block;
    width: 50%;
    min-width: 300px;
    margin: 0 auto 20px;
    padding: 10px 15px;
    border: 1px solid #888;
    text-align: left;
    background: #EEE;
    color: #000;
}
.sys-message-wrap.sys-message-error {
    border: 1px solid #F00;
    background: #FEE;
    color: #F00;
}
.sys-message-wrap.sys-message-success {
    border: 1px solid #0A0;
    background: #EFE;
    color: #0A0;
}
.sys-message-wrap p {
    margin-bottom: 10px;
}
.sys-message-wrap p:last-child {
    margin-bottom: 0;
}

p.sys-error-inline {
    margin-bottom: 5px;
    color: #F00;
}

.loader-wrap {
    display: none;
    position:fixed;
    left: 0;
    top: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    padding-top: 50px;
    background:rgba(0, 0, 0, 0.7);
}
.loader {
    position: absolute;
    margin: auto;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 40px;
    height: 40px;
    border: 5px solid #096;
    border-top: 5px solid #CFE;
    border-radius: 20px;
    animation: spin 0.5s linear infinite;
    -webkit-animation: spin 0.5s linear infinite;
    -moz-animation: spin 0.5s linear infinite;
    -ms-animation: spin 0.5s linear infinite;
}
.loader-progress {
    display: none;
    position: absolute;
    margin: auto;
    left: 0;
    top: 120px;
    right: 0;
    bottom: 0;
    width: 50%;
    height: 40px;
    border: 1px solid #CCC;
    background: #FFF;
}
.loader-progress-bar {
    width: 0;
    height: 38px;
    background: #096;
}
.loader-progress-rate {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 38px;
    line-height: 38px;
    text-align: center;
}


@keyframes spin {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}
@-webkit-keyframes spin {
    0% {-webkit-transform: rotate(0deg);}
    100% {-webkit-transform: rotate(360deg);}
}
@-moz-keyframes spin {
    0% {-moz-transform: rotate(0deg);}
    100% {-moz-transform: rotate(360deg);}
}
@-ms-keyframes spin {
    0% {-ms-transform: rotate(0deg);}
    100% {-ms-transform: rotate(360deg);}
}


.pager {position: relative; height: 50px; margin-bottom: 10px; line-height: 50px; text-align: center; background: #FFF;}
.pager-prev,
.pager-next {position: absolute; top: 10px; width: 100px; height: 30px; padding: 6px 0; text-align: center; text-decoration: none; border: 1px solid #CCC;}
.pager-prev::before,
.pager-next::before {font-size: 16px; color: #000;}
.pager-prev {left: 10px;}
.pager-next {right: 10px;}

/*
 *  parts
 *
 *------------------------------------*/

.color-logo {color: #00AFCC;}
.color-hashtag {color: #ec5e36;}
.color-notify {color: #000;}
.color-star {color: #b6ec36;}
.color-unread {color: #ec36b6;}/*#36ec67*/
.color-like {color: #36bbec;}
.color-comment {color: #6736ec;}

.icon-unread::before {content: "\f09e"; display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}

.btn {display: inline-block; text-decoration: none; background: none; border: none;}
.btn-tiny {padding: 0 10px; line-height: 30px; border-radius: 5px; font-size: 14px; font-weight: normal;}
.btn-small {padding: 0 15px; line-height: 40px; border-radius: 5px; font-size: 14px; font-weight: normal;}
.btn-medium {padding: 10px 20px; min-width: 60px; text-align: center; border-radius:5px; font-size:16px; font-weight: normal;}
.btn.btn-primary {color: #FFF; background: #00AFCC;}
.btn.btn-proceed {color: #FFF; background: #000;}
.btn.btn-plain {color: #000; background: #FFF; border: 1px solid #AAA;}
.btn.btn-plain.btn-medium {padding: 9px 19px;}
.btn:hover {opacity: 0.8;}

.table-list {margin-bottom: 20px; border-top: 2px solid #AAA; border-bottom: 2px solid #AAA;}
.table-list th {padding: 10px; vertical-align: middle;}
.table-list td {padding: 5px 10px; vertical-align: middle;}
.table-list thead th {border-bottom: 2px solid #AAA; text-align: center;}
.table-list tbody th {border-bottom: 1px solid #AAA; text-align: left;}
.table-list tbody td {border-bottom: 1px solid #AAA; text-align: left;}

.table-horizontal {margin-bottom: 20px;}
.table-horizontal th {padding: 5px 10px; vertical-align: middle; background: #EEE;}
.table-horizontal td {padding: 5px 10px; vertical-align: middle; background: #FFF;}
.table-horizontal td.no-padding {padding: 0;}

.table-vertical {margin-bottom: 20px;}
.table-vertical th {padding: 10px; vertical-align: middle; border-bottom: 1px solid #FFF; background: #EEE; text-align: left;}
.table-vertical td {padding: 10px; vertical-align: middle; background: #FFF;}


.modal-wrap {display: none; position: fixed; left: 0; top: 0; z-index: 99000; width: 100vw; height: 100vh;}
.modal-layer {position: absolute; left: 0; top: 0; z-index: 99001; width: 100%; height: 100%; background: rgba(0,0,0,0.5);}
.modal-close {position: absolute; right: -15px; top: -15px; z-index: 99003; width: 30px; height: 30px; text-align: center; line-height: 28px; border-radius: 15px; background: #FFF; border: 1px solid #CCC; font-size: 20px; color: #888;}
.modal-inner {position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 99002; width: 50vw; height: 80vh; margin: auto; padding: 15px; background: #FFF;}
.modal-body {width: 100%; height: 100%; overflow: scroll; -ms-overflow-style: none;}
.modal-body::-webkit-scrollbar {display: none;}


/*
 *  pages
 *
 *------------------------------------*/

.page-title {margin: 0; padding: 20px; line-height: 20px; font-size: 18px; background: #EEE; color: #000; border-bottom: 1px solid #DDD;}
.page-wrap {padding: 20px;}
.section-title {margin: 40px -10px 20px; padding: 10px 20px; line-height: 20px; font-size: 16px; background: #EEE; color: #000; border-left: 5px solid #DDD;}


.section-form {width: 660px; margin: 10px auto 30px; padding: 20px; border: 1px solid #EEE; border-radius: 5px; background: #FFF; box-shadow: 0px 1px 1px #CCC; word-break: break-word; overflow: hidden;}
.section-form .section-title {margin: 40px -10px 20px; padding: 10px 20px; line-height: 20px; font-size: 16px; background: #EEE; color: #000;}
.section-form .section-title:first-child {margin-top: -10px;}

.article-wrap::after {content: ""; display: block; clear: both;}


.highlight {background-color:yellow;}

.article-list {float: left; width: 35%; height: calc(100vh - 40px); border-right: 1px solid #DDD; box-sizing: border-box;}
.article-list-nav {width: 100%; height: 50px; padding: 10px; background: #DDD;}
.article-list-nav-group {float: left; width: 48%; height: 30px; margin: 0 1%; overflow: hidden; border-radius: 5px;}
.article-list-nav-item {float: left; width: 50%; height: 30px; overflow: hidden; line-height: 30px; text-align: center; background: #FFF; color: #333; text-decoration: none;}
.article-list-nav-item-active {color: #00AFCC; background: #e8f8fb;}
.article-list-nav-item-count {display: inline-block; padding: 0 3px; line-height: 16px; background: #00AFCC; color: #FFF; font-size: 12px; border-radius: 3px;}

.article-list-search .flexbox {-webkit-flex-wrap: nowrap;-ms-flex-wrap: nowrap; flex-wrap: nowrap; }
.article-list-search {width: 100%; height: 200px; padding: 10px; background: #DDD;}
.article-list-search-row {margin-bottom: 10px;}
.article-list-search-row:last-child {margin-top: -5px; }
.article-list-search-row::after {content: ""; display: block; clear: both;}
.article-list-search-label {float: left; width: 4em; height: 30px; line-height: 30px;}
.article-list-search-row:last-child .article-list-search-control {justify-content: space-around; }
.article-list-search-row:last-child label {font-size: .9em; }
input[type="text"].article-list-search-input {width: 66%; height: 30px; padding: 0 5px; line-height: 28px; font-size: inherit;}
.article-list-search-star {display: inline-block; width: 13%; height: 30px; padding: 0 3px; line-height: 28px; text-align: center; vertical-align: bottom; border: 1px solid #CCC; background: #FFF; font-size: 20px; color: #AAA; border-radius: 3px;}
.article-list-search-star.__active {color: #b6ec36}
.article-list-search-all-user {display: inline-block; width: 8%; height: 30px; padding: 0 3px; line-height: 28px; text-align: center; vertical-align: bottom; border: 1px solid #CCC; background: #FFF; font-size: 20px; color: #AAA; border-radius: 3px;}
.article-list-search-all-user.__active {color: #543}
.article-list-search-all-user input {display: none;}
input[type="text"].article-list-search-input-date {width: calc(50% - 1em); height: 30px; padding: 0 5px; line-height: 28px; font-size: inherit;}
.article-list-search-input-select {width: calc(50% - 3px); height: 30px; padding: 0 5px; line-height: 28px;}
.article-list-search-button {width: 18%; height: 30px; line-height: 30px; text-align: center; vertical-align: middle; border: none; background: #00AFCC; color: #FFF;}
.article-list-search-control .select2-container .select2-selection {height: 30px; line-height: 30px;}

.article-list-search-sammary {position: relative; height: 40px; padding: 5px 10px; border-bottom: 1px solid #DDD; line-height: 30px;}
.article-list-search-sammary-download {display: none; position: absolute; right: 10px; top: 7px; height: 26px; padding: 0 10px; border: 1px solid #CCC; line-height: 24px; background: #FFF; text-decoration: none; border-radius: 5px;}

.article-list-body {width: 100%; height: calc(100vh - 90px); overflow-y: scroll; -ms-overflow-style: none;}

.article-list-item {position: relative; padding: 10px 10px 10px 60px; border-bottom: 1px solid #ddd; background: linear-gradient(to bottom, #FFF, #FFF 80%, #EEE);}
.article-list-item.__article_list_item_active {background: #e8f8fb; padding-left: 55px; border-left: 5px solid #00AFCC;}
.article-list-item.__article_list_item_active .article-list-item-thumbnail {left: 5px;}
.article-list-item-thumbnail {position: absolute; left: 10px; top: 10px; width: 40px; height: 40px; object-fit: cover; border-radius: 20px;}
.article-list-item-star {position: absolute; left: 0; bottom: 0; width: 0; height: 0; border: 20px solid transparent; border-left-color: #b6ec36; border-bottom-color: #b6ec36; line-height: 20px; text-indent: -8px; font-size: 15px; color: #FFF;}
.article-list-item-user {float: left; width: 70%; height: 20px; line-height: 20px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-list-item-date {float: right; width: 30%; height: 20px; line-height: 20px; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-list-item-tags {float: left; width: 70%; height: 20px; line-height: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-list-item-priority {float: right; width: 30%; height: 20px;}
.article-list-item-priority-score {float: right; width: 3em; padding-right: 5px; text-align: right; line-height: 20px; color: rgb(250,175,100);}
.article-list-item-priority-gauge {float: right; width: calc(100% - 3em); max-width: 4.5em; height: 10px; margin-top: 5px; background: #EEE; border-radius: 3px; overflow: hidden;}
.article-list-item-priority-bar[data-value="0.0"] {width: 0%; height: 10px; background: rgb(250,250,100);}
.article-list-item-priority-bar[data-value="0.1"] {width: 2%; height: 10px; background: rgb(250,247,100);}
.article-list-item-priority-bar[data-value="0.2"] {width: 4%; height: 10px; background: rgb(250,244,100);}
.article-list-item-priority-bar[data-value="0.3"] {width: 6%; height: 10px; background: rgb(250,241,100);}
.article-list-item-priority-bar[data-value="0.4"] {width: 8%; height: 10px; background: rgb(250,238,100);}
.article-list-item-priority-bar[data-value="0.5"] {width: 10%; height: 10px; background: rgb(250,235,100);}
.article-list-item-priority-bar[data-value="0.6"] {width: 12%; height: 10px; background: rgb(250,232,100);}
.article-list-item-priority-bar[data-value="0.7"] {width: 14%; height: 10px; background: rgb(250,229,100);}
.article-list-item-priority-bar[data-value="0.8"] {width: 16%; height: 10px; background: rgb(250,226,100);}
.article-list-item-priority-bar[data-value="0.9"] {width: 18%; height: 10px; background: rgb(250,223,100);}
.article-list-item-priority-bar[data-value="1.0"] {width: 20%; height: 10px; background: rgb(250,220,100);}
.article-list-item-priority-bar[data-value="1.1"] {width: 22%; height: 10px; background: rgb(250,217,100);}
.article-list-item-priority-bar[data-value="1.2"] {width: 24%; height: 10px; background: rgb(250,214,100);}
.article-list-item-priority-bar[data-value="1.3"] {width: 26%; height: 10px; background: rgb(250,211,100);}
.article-list-item-priority-bar[data-value="1.4"] {width: 28%; height: 10px; background: rgb(250,208,100);}
.article-list-item-priority-bar[data-value="1.5"] {width: 30%; height: 10px; background: rgb(250,205,100);}
.article-list-item-priority-bar[data-value="1.6"] {width: 32%; height: 10px; background: rgb(250,202,100);}
.article-list-item-priority-bar[data-value="1.7"] {width: 34%; height: 10px; background: rgb(250,199,100);}
.article-list-item-priority-bar[data-value="1.8"] {width: 36%; height: 10px; background: rgb(250,196,100);}
.article-list-item-priority-bar[data-value="1.9"] {width: 38%; height: 10px; background: rgb(250,193,100);}
.article-list-item-priority-bar[data-value="2.0"] {width: 40%; height: 10px; background: rgb(250,190,100);}
.article-list-item-priority-bar[data-value="2.1"] {width: 42%; height: 10px; background: rgb(250,187,100);}
.article-list-item-priority-bar[data-value="2.2"] {width: 44%; height: 10px; background: rgb(250,184,100);}
.article-list-item-priority-bar[data-value="2.3"] {width: 46%; height: 10px; background: rgb(250,181,100);}
.article-list-item-priority-bar[data-value="2.4"] {width: 48%; height: 10px; background: rgb(250,178,100);}
.article-list-item-priority-bar[data-value="2.5"] {width: 50%; height: 10px; background: rgb(250,175,100);}
.article-list-item-priority-bar[data-value="2.6"] {width: 52%; height: 10px; background: rgb(250,172,100);}
.article-list-item-priority-bar[data-value="2.7"] {width: 54%; height: 10px; background: rgb(250,169,100);}
.article-list-item-priority-bar[data-value="2.8"] {width: 56%; height: 10px; background: rgb(250,166,100);}
.article-list-item-priority-bar[data-value="2.9"] {width: 58%; height: 10px; background: rgb(250,163,100);}
.article-list-item-priority-bar[data-value="3.0"] {width: 60%; height: 10px; background: rgb(250,160,100);}
.article-list-item-priority-bar[data-value="3.1"] {width: 62%; height: 10px; background: rgb(250,157,100);}
.article-list-item-priority-bar[data-value="3.2"] {width: 64%; height: 10px; background: rgb(250,154,100);}
.article-list-item-priority-bar[data-value="3.3"] {width: 66%; height: 10px; background: rgb(250,151,100);}
.article-list-item-priority-bar[data-value="3.4"] {width: 68%; height: 10px; background: rgb(250,148,100);}
.article-list-item-priority-bar[data-value="3.5"] {width: 70%; height: 10px; background: rgb(250,145,100);}
.article-list-item-priority-bar[data-value="3.6"] {width: 72%; height: 10px; background: rgb(250,142,100);}
.article-list-item-priority-bar[data-value="3.7"] {width: 74%; height: 10px; background: rgb(250,139,100);}
.article-list-item-priority-bar[data-value="3.8"] {width: 76%; height: 10px; background: rgb(250,136,100);}
.article-list-item-priority-bar[data-value="3.9"] {width: 78%; height: 10px; background: rgb(250,133,100);}
.article-list-item-priority-bar[data-value="4.0"] {width: 80%; height: 10px; background: rgb(250,130,100);}
.article-list-item-priority-bar[data-value="4.1"] {width: 82%; height: 10px; background: rgb(250,127,100);}
.article-list-item-priority-bar[data-value="4.2"] {width: 84%; height: 10px; background: rgb(250,124,100);}
.article-list-item-priority-bar[data-value="4.3"] {width: 86%; height: 10px; background: rgb(250,121,100);}
.article-list-item-priority-bar[data-value="4.4"] {width: 88%; height: 10px; background: rgb(250,118,100);}
.article-list-item-priority-bar[data-value="4.5"] {width: 90%; height: 10px; background: rgb(250,115,100);}
.article-list-item-priority-bar[data-value="4.6"] {width: 92%; height: 10px; background: rgb(250,112,100);}
.article-list-item-priority-bar[data-value="4.7"] {width: 94%; height: 10px; background: rgb(250,109,100);}
.article-list-item-priority-bar[data-value="4.8"] {width: 96%; height: 10px; background: rgb(250,106,100);}
.article-list-item-priority-bar[data-value="4.9"] {width: 98%; height: 10px; background: rgb(250,103,100);}
.article-list-item-priority-bar[data-value="5.0"] {width: 100%; height: 10px; background: rgb(250,100,100);}

.article-list-item-notify {float: left; width: 70%; height: 20px; line-height: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-list-item-meta {float: right; width: 30%; height: 20px; line-height: 20px; text-align: right; white-space: nowrap;}
.article-list-item-meta-item {margin-left: 5px;}
.article-list-item-excerpt {clear: both; width: 100%; height: 20px; line-height: 20px; color: #666; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

.article-list-next a {display: block; height: 50px; line-height: 50px; text-align: center; text-decoration: none; color: #00AFCC; background: #e8f8fb; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-list-retry a {display: block; height: 50px; line-height: 50px; text-align: center; text-decoration: none; color: #00AFCC; background: #e8f8fb; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-list-notfound {height: 50px; line-height: 50px; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-list-loading {height: 100px; line-height: 100px; text-align: center; color: #FFF; background: #00AFCC; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

.notification-list {float: left; width: 35%; height: calc(100vh - 40px); border-right: 1px solid #DDD;}
.notification-list-nav {width: 100%; height: 50px;}
.notification-list-nav-item {float: left; width: 33.3%; height: 50px; overflow: hidden; line-height: 49px; border-right: 1px solid #CCC; border-bottom: 5px solid #EEE; text-align: center; background: #FFF; text-decoration: none;}
.notification-list-nav-item:last-child {border-right: none;}
.notification-list-nav-item.__active {border-bottom: 1px solid #CCC; font-weight: bold;}

.notification-list-body {width: 100%; height: calc(100vh - 90px); overflow-y: scroll; -ms-overflow-style: none;}
.notification-list-item {position: relative; padding: 10px 10px 10px 60px; border-bottom: 1px solid #ddd; background: linear-gradient(to bottom, #FFF, #FFF 80%, #EEE);}
.notification-list-item.__notification_list_item_active {background: linear-gradient(to bottom, #FFF, #FFF 80%, #f7e4df);}
.notification-list-item-thumbnail {position: absolute; left: 10px; top: 10px; width: 40px; height: 40px; object-fit: cover; border-radius: 20px;}
.notification-list-item-user {float: left; width: 70%; height: 20px; line-height: 20px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.notification-list-item-date {float: right; width: 30%; height: 20px; line-height: 20px; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.notification-list-item-excerpt {clear: both; display: inline-block; width: 100%; height: 20px; line-height: 20px; color: #666; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.notification-list-item-target {clear: both; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}



.article-view-unselected {float: left; width: 65%; height: calc(100vh - 40px); padding: 30px; background: #EEE;}
.article-view {float: left; width: 65%; height: calc(100vh - 40px);}

.article-view-header {position: relative; height: 165px; padding: 15px 15px 10px 90px; border-bottom: 1px solid #DDD; overflow-y: scroll; -ms-overflow-style: none;}
.article-view-header::-webkit-scrollbar {display: none;}
.article-view-header-thumbnail {position: absolute; left: 15px; top: 15px; width: 60px; height: 60px; object-fit: cover; border-radius: 30px;}
.article-view-header-row {height: 20px; line-height: 20px;}
.article-view-header-row::after {content: ""; display: block; clear: both;}
.article-view-header-label {float: left; width: 5em; font-weight: bold;}
.article-view-header-data {float: left; width: calc(100% - 5em);}
.article-view-header-control {position: absolute; right: 20px; top: 20px;}
.article-view-header-button {display: inline-block; padding: 3px 5px; border: 1px solid #CCC; line-height: 20px; background: #FFF; text-decoration: none;}
.article-view-hashtag-add {display: inline-block; height: 18px; margin-left: 10px; padding: 0 5px; border-radius: 5px; line-height: 18px; background: #f7e4df; text-decoration: none; word-break: keep-all;}
.article-view-hashtag-add:only-child {margin-left: 0;}
.article-view-notify-add {height: 18px; margin-left: 10px; padding: 0 5px; border-radius: 5px; line-height: 18px; background: #ECE1E9; text-decoration: none;}
.article-view-notify-add:only-child {margin-left: 0;}
.article-view-file-add {height: 18px; margin-left: 10px; padding: 0 5px; border-radius: 5px; line-height: 18px; background: #EEE; text-decoration: none;}

.article-view-body {float: left; width: 60%; height: calc(100vh - 205px); padding: 30px; border-right: 1px solid #DDD; line-height: 2; word-break: break-word; overflow-y: scroll; -ms-overflow-style: none;}
.article-view-body img {max-width: 100%;}
.article-view-body a {color: #00AFCC;}
.text-tiny {font-size: 60%;}
.text-small {font-size: 80%;}
.text-big {font-size: 125%;}
.text-huge {font-size: 150%;}

.article-view-action {float: left; width: 40%; height: calc(100vh - 205px);}
.article-view-action-nav::after {content: ""; display: block; clear: both;}
.article-view-action-nav-item {float: left; width: 33.33%; height: 40px; padding: 10px; line-height: 20px; font-size: 13px; border-right: 1px solid #EEE; border-bottom: 1px solid #EEE; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-view-action-nav-item-active {font-weight: bold; border-bottom: none;}

.article-view-comment-list {height: calc(100vh - 285px); padding: 10px; overflow-y: scroll; -ms-overflow-style: none;}
.article-view-comment-item {position: relative; margin-bottom: 25px;}
.article-view-comment-thumbnail {position: absolute; left: 0; top: 0; width: 40px; height: 40px; object-fit: cover; border-radius: 20px;}
.article-view-comment-user {padding-left: 50px; height: 20px; line-height: 20px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-view-comment-action {float: left; padding-left: 50px; height: 20px; line-height: 20px; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #888;}
.article-view-comment-action a {color: #888;}
.article-view-comment-action i {color: #AAA;}
.article-view-comment-date {float: right; margin-bottom: 10px; padding-left: 10px; height: 20px; line-height: 20px; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-view-comment-body {position: relative; clear: both; padding: 10px; border-radius: 10px; background: #EEE; word-break: break-word;}
.article-view-comment-body::before {content: ""; display: block; position: absolute; width: 0; height: 0; left: 10px; top: -20px; border: 10px solid transparent; border-bottom-color: #EEE;}
.article-view-comment-body-reply {color: #444;}
.article-view-comment-sticker {clear: both; padding: 0 35%;}

.article-view-comment-control::after {content: ""; display: block; clear: both;}
.article-view-comment-button {float: left; width: 50%; height: 40px; padding: 10px; line-height: 20px; border-right: 1px solid #EEE; border-top: 1px solid #EEE; text-align: center; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

.article-view-like-list {height: calc(100vh - 245px); overflow-y: scroll; -ms-overflow-style: none;}
.article-view-like-item {position: relative; padding: 10px 10px 10px 60px; border-bottom: 1px solid #EEE; line-height: 40px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-view-like-thumbnail {position: absolute; left: 10px; top: 10px; width: 40px; height: 40px; object-fit: cover; border-radius: 20px;}

.article-view-history-list {height: calc(100vh - 245px); overflow-y: scroll; -ms-overflow-style: none;}
.article-view-history-item {position: relative; padding: 10px; border-bottom: 1px solid #EEE;}
.article-view-history-thumbnail {position: absolute; left: 10px; top: 10px; width: 40px; height: 40px; object-fit: cover; border-radius: 20px;}
.article-view-history-user {padding-left: 50px; height: 20px; line-height: 20px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-view-history-date {padding-left: 50px; height: 20px; line-height: 20px; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-view-history-content {margin-top: 10px;}

.article-modal-hashtag-list {margin-bottom: 10px;}
.article-modal-hashtag-list::after {content: ""; display: block; clear: both;}
.article-modal-hashtag-item {float: left; margin: 0 10px 10px 0; padding: 5px 10px; border: 1px solid #ec5e36; border-radius: 5px; color: #ec5e36;}
.article-modal-hashtag-item-remove {margin-left: 5px; color: #888;}
.article-modal-hashtag-item-remove:hover {color: #000;}
.article-modal-hashtag-control {position: relative; height: 250px;}
.article-modal-hashtag-input {width: 100%; padding: 5px; font-size: 14px;}
.article-modal-hashtag-select {display: none; position: absolute; left: 0; top: 35px; width: 100%;}
.article-modal-hashtag-select-item {margin-top: -1px; padding: 10px; border: 1px solid #ec5e36; background: #f7e4df; cursor: pointer;}
.article-modal-hashtag-submit {position: absolute; right: 15px; bottom: 15px; padding: 10px 30px; background: #FFF; border: 1px solid #CCC;}

.article-modal-notify-list {margin-bottom: 10px;}
.article-modal-notify-list::after {content: ""; display: block; clear: both;}
.article-modal-notify-item {float: left; margin: 0 10px 10px 0; padding: 5px 10px; border: 1px solid #ec36b6; border-radius: 5px; color: #ec36b6;}
.article-modal-notify-item-remove {margin-left: 5px; color: #888;}
.article-modal-notify-item-remove:hover {color: #000;}
.article-modal-notify-control {position: relative; height: 250px;}
.article-modal-notify-input {width: 100%; padding: 5px; font-size: 14px;}
.article-modal-notify-select {display: none; position: absolute; left: 0; top: 35px; width: 100%;}
.article-modal-notify-select-item {margin-top: -1px; padding: 10px; border: 1px solid #ec36b6; background: #ECE1E9; cursor: pointer;}
.article-modal-notify-submit {position: absolute; right: 15px; bottom: 15px; padding: 10px 30px; background: #FFF; border: 1px solid #CCC;}

.article-modal-comment-to {margin-bottom: 10px;}
.article-modal-comment-to .select2-container {width: 100% !important;}
.article-modal-comment-input {width: 100%; height: 240px; margin-bottom: 10px;}
.article-modal-comment-submit {padding: 10px 30px; background: #FFF; border: 1px solid #CCC;}

.article-modal-sticker-list::after {content: ""; display: block; clear: both;}
.article-modal-sticker-item {float: left; width: 180px; height: 180px; overflow: hidden;}
.article-modal-sticker-item:hover {opacity: 0.8;}

.article-modal-comment-like-list {height: calc(100vh - 230px); overflow-y: scroll; -ms-overflow-style: none;}
.article-modal-comment-like-list::-webkit-scrollbar {display: none;}
.article-modal-comment-like-item {position: relative; padding: 10px 10px 10px 60px; border-bottom: 1px solid #EEE; line-height: 40px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.article-modal-comment-like-thumbnail {position: absolute; left: 10px; top: 10px; width: 40px; height: 40px; object-fit: cover; border-radius: 20px;}

.article-view-overlay {position: fixed; left: 100vw; top: 40px; z-index: 100; padding-right: 20px; width: 100vw; height: calc(100vh - 40px); background: rgba(0,0,0,0.5); transition: left 300ms 0s ease-in;}
.article-view-overlay .article-view {float: right; background: #FFF;}
.article-view-overlay.__show {left: 0;}
.article-view-overlay-close {float: left; width: 35%; height: calc(100vh - 40px); padding: 30px; text-align: right; font-size: 50px; color: #FFF;}

.calendar-search {margin-bottom: 20px;}
.calendar-search::after {content: ""; display: block; clear: both;}
.calendar-search-select {float: left; width: 35%; margin-right: 2%;}
.calendar-search .select2-container {float: left; width: 35%; margin-right: 1.5%;}
.calendar-search .select2-selection {height: 40px !important;}
.calendar-search .select2-selection__rendered {line-height: 38px !important;}
.calendar-search-button {float: left; width: 10%; height: 40px; padding: 0 10px; line-height: 40px; margin-right: 3%;}

.calendar-month-wrap {width: 100%; table-layout: fixed;}
.calendar-month-row::after {content: ""; display: block; clear: both;}
.calendar-month-cell {width: 14.2857%; border: 1px solid #000;}
.calendar-month-cell-head {position: relative; padding: 5px; border-bottom: 1px solid #000; text-align: center; line-height: 20px; background: #EEE;}
.calendar-month-cell-head a {position: absolute; top: 5px; right: 5px}
.calendar-month-cell-head .icon-holiday {position: absolute; top: 5px; left: 5px;}
.calendar-month-cell-head .toggle-holiday {position: absolute; top: 5px; left: 5px;}
.icon-holiday {display: inline-block; padding: 0 5px; background: #666; font-size: 10px; color: #FFF; border-radius: 5px;}
.toggle-holiday {display: inline-block; padding: 0 5px 0 2px; background: #666; font-size: 10px; color: #FFF; border-radius: 5px;}
.calendar-month-cell-body {min-height: 70px; padding: 5px;}
.calendar-month-cell-item, .calendar-week-cell-item {min-height: 20px; line-height: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #ec5e36; text-decoration: underline; cursor: pointer;}
.calendar-week-cell-item.calendar-cell-item-draft {color: #000;}
.calendar-month-cell-today {background: #f7e4df;}

.calendar-week-wrap {width: 100%; table-layout: fixed; border-top: 1px solid #000; border-left: 1px solid #000;}
.calendar-week-row::after {content: ""; display: block; clear: both;}
.calendar-week-col-head {width: 13%; height: 30px; line-height: 30px; border-right: 1px solid #000; border-bottom: 1px solid #000; text-align: center; background: #DDD;}
.calendar-week-col-head:first-child {width: 9%;}
.calendar-week-row-head {width: 9%; padding: 5px; border-right: 1px solid #000; border-bottom: 1px solid #000; background: #EEE;}
.calendar-week-cell {width: 13%; height: 70px; padding: 5px; border-right: 1px solid #000; border-bottom: 1px solid #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.calendar-week-cell.not_open, .calendar-month-cell.not_open {background-color: #ddd;}

.calendar-pager {margin-bottom: 20px; text-align: center;}
.calendar-pager-prev,
.calendar-pager-next {display: inline-block; padding: 0 30px; height: 40px; line-height: 38px; border: 1px solid #DDD; color: #000; text-decoration: none;}
.calendar-pager-select {width: 200px; height: 40px; margin: 0 10px; line-height: 38px; border: 1px solid #DDD; background: #FFF; color: #000; text-decoration: none;}

.date-add-row {margin-bottom: 5px; }
.date-add-row .date-add-head {font-weight: bold; }
.date-add-row .date-add-head span {margin-left: 10px; }
.date-add-row input[type="text"] {width: 90%; }

.manage-wrap::after {content: ""; display: block; clear: both;}
.manage-nav {position: fixed; left: 0; top: 40px; width: 200px; height: calc(100vh - 40px); background: #444;}
.manage-nav-item {display: block; padding: 10px 20px; border-bottom: 1px solid #333; color: #FFF; text-decoration: none;}
.manage-main {float: right; width: calc(100% - 200px); padding: 0 20px 20px;}
.manage-title {margin: 0 -20px 20px; padding: 20px; line-height: 20px; font-size: 18px; background: #EEE; color: #000; border-bottom: 1px solid #DDD;}

.manage-tab {height: 40px; margin-bottom: 20px; padding: 0 5px; border-bottom: 1px solid #CCC;}
.manage-tab a {float: left; height: 40px; margin: 0 5px; padding: 0 10px; line-height: 38px; border: 1px solid #CCC; border-radius: 5px 5px 0 0; text-decoration: none;}
.manage-tab a.active {border-bottom: 1px solid #FFF;}

body.dragging, body.dragging * {cursor: move !important;}
.dragged {position: absolute !important; opacity: 0.8; z-index: 2000;}

.team-list {margin-bottom: 20px; padding: 10px; background: #EEE;}
.team-list li {margin: 10px 0; padding: 10px; border: 1px solid #CCC; border-left: 20px solid #CCC; background: #FFF;}
.team-list li:first-child {margin-top: 0;}
.team-list li:last-child {margin-bottom: 0;}
.team-list li ul {margin: 10px;}
.team-list li ul.holder {margin: 0; margin-left: 10px;}
.team-list .placeholder {position: relative; background: #EEE; border: none; background: #DDD;}
.team-list input[type="text"] {width: calc(100% - 40px); height: 30px; padding: 0 5px; line-height: 28px; border: 1px solid #FFF; background: none; cursor: pointer;}
.team-list input:hover {border: 1px solid #EEE;}
.team-list-remove {width: 30px; height: 30px; padding: 0; text-align: center; line-height: 30px; border: none; background: none;}

.article-list-body::-webkit-scrollbar, .article-view-body::-webkit-scrollbar, .article-view-comment-list::-webkit-scrollbar, .article-view-like-list::-webkit-scrollbar, .article-view-history-list::-webkit-scrollbar, .notification-list-body::-webkit-scrollbar {display: none;}

.master-calendar-month {width: 420px; margin-bottom: 20px; text-align: center;}
.master-calendar-month-button {width: 40px; height: 40px; text-align: center; line-height: 38px; vertical-align: bottom; border: 1px solid #CCC; background: #FFF;}
.master-calendar-month-select {width: 150px;}
.master-calendar-head {width: 60px; height: 40px; border: 1px solid #CCC; text-align: center; vertical-align: middle; background: #EEE;}
.master-calendar-cell {width: 60px; height: 40px; border: 1px solid #CCC; text-align: center; vertical-align: middle; color: #999;}
.master-calendar-cell-editable {color: #000; cursor: pointer;}
.master-calendar-cell-today {background: #FFA;}
.master-calendar-cell-holiday {background: #FAA;}

/*
 *  control
 *
 *------------------------------------*/

input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"] {width: 100%; max-width: 100%; height: 40px; padding: 5px; line-height: 28px; font-size: 16px; border: 1px solid #CCC; border-radius: 5px;}

select {width: 100%; max-width: 100%; height: 40px; padding: 5px; line-height: 28px; font-size: 16px; border: 1px solid #CCC; border-radius: 5px;}
.select-compact {height: 30px; padding: 0 5px; line-height: 28px;}

textarea {padding: 5px; border: 1px solid #CCC; font-size: 16px;}

.select2-fat .select2-selection {height: 40px !important;}
.select2-fat .select2-selection__rendered {line-height: 38px !important;}
.select2-fat .select2-selection__arrow {height: 38px !important;}
.select2-container--open {z-index: 99999;}

.control-hashtag {position: relative; width: 100%; min-height: 50px; margin-bottom: 10px; padding: 10px 45px 5px 45px; border: 1px solid #CCC; border-radius: 5px;}
.control-hashtag::after {content: ""; display: block; clear: both;}
.control-hashtag-label {position: absolute; left: 0; top: 0; width: 35px; height: 100%; text-align: center; line-height: 50px; background: #ec5e36; color: #FFF; border-radius: 5px 0 0 5px;}
.control-hashtag-selected {float: left; margin: 0 10px 5px 0; padding: 5px 10px; line-height: 20px; border: 1px solid #ec5e36; border-radius: 5px; color: #ec5e36;}
.control-hashtag-remove {margin-left: 5px; color: #888;}
.control-hashtag-remove:hover {color: #000;}
.control-hashtag-new {position: absolute; right: 0; top: 0; width: 35px; height: 100%; border: none; border-left: 1px solid #CCC; background: #FFF; color: #ec5e36; border-radius: 0 5px 5px 0; cursor: pointer;}
.control-hashtag-modal {display: none; position: fixed; left: 0; top: 0; z-index: 99999; width: 100%; height: 100%; background: rgba(0,0,0,0.5);}
.control-hashtag-modal-inner {position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; width: 100%; max-width: 480px; height: 95px; padding: 10px; background: #FFF;}
.control-hashtag-modal-title {margin-bottom: 10px;}
.control-hashtag-modal-close {position: absolute; right: 0; top: 0; padding: 10px; background: none; border: none}
.control-hashtag-modal-input {width: calc(100% - 70px) !important; margin-right: 10px; vertical-align: middle;}
.control-hashtag-modal-button {width: 60px; height: 40px; background: #ec5e36; color: #FFF; border: none; border-radius: 5px; vertical-align: middle;}

.control-hashtag-selected input[type="checkbox"] {margin-left: 5px; vertical-align: top;}
.control-hashtag-note {clear: both; margin-bottom: 5px; font-weight: bold;}
.control-hashtag .select2-container {float: left; width: auto; height: 34px; line-height: 32px;}
.control-hashtag .select2-selection {height: 34px !important; border: none !important;}
.control-hashtag .select2-selection__rendered {line-height: 32px !important;}

.control-notify {position: relative; width: 100%; min-height: 50px; margin-bottom: 10px; padding: 10px 10px 5px 45px; border: 1px solid #CCC; border-radius: 5px;}
.control-notify::after {content: ""; display: block; clear: both;}
.control-notify-label {position: absolute; left: 0; top: 0; width: 35px; height: 100%; text-align: center; line-height: 50px; background: #ec36b6; color: #FFF; border-radius: 5px 0 0 5px;}
.control-notify-selected {float: left; margin: 0 10px 5px 0; padding: 5px 10px; line-height: 20px; border: 1px solid #ec36b6; border-radius: 5px; color: #ec36b6;}
.control-notify-remove {margin-left: 5px; color: #888;}
.control-notify-remove:hover {color: #000;}
.control-notify .select2-container {float: left; width: auto; height: 34px; line-height: 32px;}
.control-notify .select2-selection {height: 34px !important; border: none !important;}
.control-notify .select2-selection__rendered {line-height: 32px !important;}
.control-notify-multiple {position: relative; width: 100%; min-height: 50px; margin-bottom: 10px; padding: 5px 5px 5px 40px; border: 1px solid #CCC; border-radius: 5px;}
.control-notify-multiple .select2-container--default .select2-selection--multiple {border: none;}
.control-notify-multiple .select2-container--default.select2-container--focus .select2-selection--multiple {border: none;}
.control-notify-multiple .select2-container--default .select2-selection--multiple .select2-selection__choice {position: relative; padding: 5px 25px 5px 10px; border: 1px solid #ec36b6; border-radius: 5px; background-color: #FFF; color: #ec36b6;}
.control-notify-multiple .select2-selection__choice__remove {position: absolute; right: 5px; top: 5px; line-height: 20px; font-weight: bold; font-size: 18px;}
.control-notify-multiple .select2-container--default .select2-search--inline .select2-search__field {height: 30px; line-height: 30px; font-size: 16px;}

.control-upload {position: relative; width: 100%; min-height: 50px; margin-bottom: 10px; padding: 10px 10px 5px 45px; border: 1px solid #CCC; border-radius: 5px;}
.control-upload::after {content: ""; display: block; clear: both;}
.control-upload-label {position: absolute; left: 0; top: 0; width: 35px; height: 100%; text-align: center; line-height: 50px; background: #666666; color: #FFF; border-radius: 5px 0 0 5px;}
.control-upload-selected {float: left; margin: 0 10px 5px 0; padding: 5px 10px; border: 1px solid #666666; border-radius: 5px; color: #666666; line-height: 18px;}
.control-upload-remove {margin-left: 5px; color: #888;}
.control-upload-remove:hover {color: #000;}
.control-upload-add {clear: both; margin-bottom: 5px; padding: 30px; border: 1px solid #CCC; text-align: center; background: #EEE;}

.control-add-date {position: relative; width: 100%; margin-bottom: 10px; padding: 3px 10px 3px 45px; border: 1px solid #CCC; border-radius: 5px;}
.control-add-date-label {position: absolute; left: 0; top: 0; width: 35px; height: 100%; text-align: center; line-height: 45px; background: #666; color: #FFF; border-radius: 5px 0 0 5px; }
.control-add-date-fmt {height: 40px; padding: 5px; line-height: 28px; }

.multiple-select-row {margin-bottom: 5px;}
.multiple-select-row select {width: 80%;}
.multiple-select-remove {padding: 4px 6px; border: 1px solid #CCC; background: #FFF; border-radius: 3px;}
.multiple-select-add {padding: 4px 10px; border: 1px solid #CCC; background: #FFF; border-radius: 3px;}


.setting-hashtags label {display: none;}
.setting-hashtags .control-hashtag {padding-left: 10px;}
.setting-hashtags .control-hashtag-selected {float: none; position: relative;}
.setting-hashtags .control-hashtag-remove {position: absolute; right: 10px;}
.setting-hashtags .control-hashtag-add.w200 {width: 362px !important;}

.select2-container--default .select2-selection--single .select2-selection__placeholder {color: #444 !important;}


/*
 *  guide
 *
 *------------------------------------*/

.faq-row {position: relative; width: 90%; min-height: 50px; margin-bottom: 10px; padding: 20px 10px 15px 45px; border: 1px solid #CCC; border-radius: 5px;}
.faq-row::after {content: ""; display: block; clear: both;}
.divider { height: 5px; background: #f5f5f5; border: none;outline: none; width: 100%; }
.faq-row .divider {background: #fff}
.question::before, .answer::before {display: inline-block; margin-left: -19px; padding-right: 5px;font: normal normal normal 14px/1 FontAwesome; font-size: 14px; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.question::before {content: "\f2c4";}
.answer::before {content: "\f031";}