/* リデザイン用スタイルシート*/

@charset "utf-8";

/* ===================================================================
 style info :共通リセットスタイル
=================================================================== */
* { min-height: 0; min-width: 0;}
/*--- reset-- */
html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; }
address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; }
table { border-collapse: collapse; border-spacing: 0; }
caption, th { text-align: left; vertical-align: top; }
object, embed { vertical-align: top; }
legend { display: none; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; }

img, abbr, acronym, fieldset { border: 0; }
ul li { list-style-type: none; list-style-position: outside; }
ol li { list-style-position: outside; margin-left: 20px; }

.w5 { width: 5%; } .w10 { width: 10%; } .w15 { width: 15%; } .w20 { width: 20%; } .w25 { width: 25%; } .w30 { width: 30%; } .w35 { width: 35%; } .w40 { width: 40%; } .w100px { width: 100px; } .w150px { width: 150px; } .w200px { width: 200px; } .w250px { width: 250px; } .m-b-20 { margin-bottom: 20px; }

main table { border-collapse: collapse;     border-spacing: 0;    width: 100%; }

/* ===================================================================
 style info :グリットデザイン用スタイル
=================================================================== */
/*	12 COLUMN : RESPONSIVE GRID SYSTEM
	DEVELOPER : DENIS LEBLANC
	URL : http://responsive.gs
	VERSION : 3.0
	LICENSE : GPL & MIT */
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; *behavior: url(/scripts/boxsizing.htc); }
.commu-container { max-width: 100%; margin: 0 auto; }
.commu-container:after, .row:after, .col:after, .clr:after, .group:after { content: ""; display: table; clear: both; }
.row { padding-bottom: 0em; }
.col { display: block; float: left; width: 100%; }
@media (min-width: 768px) { .gutters .col {     margin-right: 2%; }
}

/*--※JSにて右余白調整すること--*/
@media (min-width: 768px) { .span_1 { width: 8.33333333333%; } .span_2 { width: 16.6666666667%; } .span_3 { width: 25%; } .span_4 { width: 33.3333333333%; } .span_5 { width: 41.6666666667%; } .span_6 { width: 50%; } .span_7 { width: 58.3333333333%; } .span_8 { width: 66.6666666667%; } .span_9 { width: 75%; } .span_10 { width: 83.3333333333%; } .span_11 { width: 91.6666666667%; } .span_12 { width: 100%; }

.gutters .span_1 { width: 6.5%; } .gutters .span_2 { width: 15.0%; } .gutters .span_3 { width: 23.5%; } .gutters .span_4 { width: 32.0%; } .gutters .span_5 { width: 40.5%; } .gutters .span_6 { width: 49.0%; } .gutters .span_7 { width: 57.5%; } .gutters .span_8 { width: 66.0%; } .gutters .span_9 { width: 74.5%; } .gutters .span_10 { width: 83.0%; } .gutters .span_11 { width: 91.5%; } .gutters .span_12 { width: 100%; }
}
/* ===================================================================
style info :共通スタイル
=================================================================== */

a {
    outline: none;
    text-decoration: none;
}

a:visited {
    color: #FFF;
    text-decoration: none;
}

a:hover {
    transition: all .4s;
    text-decoration: none;
}

a:active {
    text-decoration: none;
}

i {
    vertical-align: middle;
}

main a {
    color: #0071BC;
    outline: none;
}

main a:visited {
    color: #0071BC;
    text-decoration: none;
}

main a:hover {
    color: #5AB6DF;
    text-decoration: none;
    transition: all .4s;
}

main a:active {
    text-decoration: none;
}


/* ===================================================================
style info :游ゴシックを適用させる
=================================================================== */

@font-face {
    font-family: "Yu Gothic";
    src: local("Yu Gothic Medium");
    font-weight: 100;
}

@font-face {
    font-family: "Yu Gothic";
    src: local("Yu Gothic Medium");
    font-weight: 200;
}

@font-face {
    font-family: "Yu Gothic";
    src: local("Yu Gothic Medium");
    font-weight: 300;
}

@font-face {
    font-family: "Yu Gothic";
    src: local("Yu Gothic Medium");
    font-weight: 400;
}

@font-face {
    font-family: "Yu Gothic";
    src: local("Yu Gothic Bold");
    font-weight: bold;
}

@font-face {
    font-family: "Helvetica Neue";
    src: local("Helvetica Neue Regular");
    font-weight: 100;
}

@font-face {
    font-family: "Helvetica Neue";
    src: local("Helvetica Neue Regular");
    font-weight: 200;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif;
}


/* IE10以上 */

@media all and (-ms-high-contrast: none) {
    body {
        font-family: Verdana, Meiryo, sans-serif;
    }
}


/*------------------ layout --------------------------*/

body {
    background: #FFF;
    color: #808080;
    font-size: 12px;
    line-height: 1.4;
}

#commu header {
    position: static;
    width: 100%;
    height: 50px;
    background: #FFFFFF;
    z-index: 999;
    border-bottom: 1px solid #E6E6E6;
    display: flex;
}

#commu .content-area {
    height: calc(100vh - 50px);
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

#commu aside {
    order: -1;
    width: 240px;
    min-height: calc(100vh - 50px);
    margin: 0;
    padding-bottom: 0;
    background: #F8F8FC;
    color: #808080;
    font-weight: bold;
    z-index: 999;
    position: static;
    top: 0;
    align-items: stretch;
}

#commu main {
    flex: 1;
    padding: 0;
    position: relative;
}


/*------------------ header --------------------------*/

#commu header h1 {
    height: 50px;
    padding: 5px 0 0 5px;
    text-align: left;
}

#commu header h1 a {
    display: inline-block;
    height: 50px;
    background:none;
    color: #50C6D5;
    font-size: 24px;
    font-family: 'Pacifico', cursive;
}

#commu header h1 a span {
    font-size: 10px;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", "Meiryo,Sans-Serif", "ＭＳ Ｐゴシック", "MS PGothic";
}

#commu header #menu {
    height: 49px;
    line-height: 49px;
    width: 320px;
    display: -webkit-flex; /* Safari */
    display: flex;
    justify-content: flex-end;
}


/* お知らせ部分 */

#commu #menu #notification {
    width: 60px;
    text-align: center;
    color: #50C6D5;
    cursor: pointer;
}

#commu #menu #notification i {
    font-size: 28px;
}

#commu #menu div#notice-pulldown {
    color: #666;
    position: absolute;
    top: 65px;
    left: calc(-350px / 2 + 50px);
    width: 350px;
    height: 70vh;
    background-color: white;
    border: 1px solid #E6E6E6;
    z-index: 1004;
    box-shadow: -1px 0 4px rgba(150, 150, 150, 0.3);
    /*ダッシュボードとの兼ね合いで必要*/
}

#commu #menu div#notice-pulldown:before {
    content: "";
    position: absolute;
    top: -6px;
    left: 68%;
    margin-left: -9px;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 6px 6px 6px;
    border-color: transparent transparent white transparent;
    z-index: 0;
}

#commu #menu div#notice-pulldown:after {
    content: "";
    position: absolute;
    top: -7px;
    left: 68%;
    margin-left: -10px;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 7px 7px 7px;
    border-color: transparent transparent #E6E6E6 transparent;
    z-index: -1;
}

#commu #menu div#notice-pulldown.fade,
#commu #tabs .fade {
    transition: all linear 300ms;
    opacity: 1;
}

#commu #menu div#notice-pulldown.fade.ng-hide,
#commu #tabs .fade.ng-hide {
    opacity: 0;
}

#commu #menu div#notice-pulldown h4 {
    color: #0071BC;
    font-size: 1.3em;
    font-weight: bold;
    text-align: left;
    padding: 10px;
    border-bottom: 1px solid #DEF0F9;
}

#commu #menu div#notice-pulldown h4 > div {
    font-size: 0.5em;
    padding-top: 5px;
    color: #666;
}

#commu #menu div#notice-pulldown > div {
    position: relative;
    width: 100%;
    color: #666;
    text-align: left;
    padding: 10px;
    display: block;
}

#commu #menu div#notice-pulldown > div > div {
    padding: 10px;
}

#commu #menu div#notice-pulldown > div:last-child {
    border-bottom: none;
}

#commu #menu div#notice-pulldown .detail-link {
    text-align: right;
    padding-right: 20px;
    font-size: 1.2em;
    color: #0071BC;
    cursor: pointer;
}

#commu #menu #notice-modal .modal_btn {
    text-align: right;
}

#commu #menu #notice-modal .notice-detail ul {
    padding: 20px;
}

#commu #menu #notice-modal .notice-detail ul li {
    list-style-position: inside;
    list-style-type: disc;
}

#commu #menu div#notice-pulldown h4 > div > div {
    display: inline-block;
}

#commu #menu div#notice-pulldown h4 div.new {
    background-color: #ff735f;
    border-radius: 6px;
    color: white;
    padding: 3px;
    font-weight: bold;
}


/* ユーザー設定 */

#commu header div#user-settings {
    margin-left: 20px;
    padding: 0 20px 0 0;
    font-size: 14px;
    display: -webkit-flex;
    /* Safari */
    display: flex;
    justify-content: flex-end;
    cursor: pointer;
}

#commu header div#user-settings #user-icon img {
    height: 26px;
    width: 26px;
    border-radius: 50%;
}

#commu header div#user-settings #user-name {
    width: 120px;
    color: #50C6D5;
    padding: 0 5px;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}

#commu header div#user-settings #user-name em {
    max-width: 80px;
    display: inline-block;
    padding: 0 5px;
}

#commu header div#user-settings #user-name i {
    font-size: 12px;
    height: 49px;
    line-height: 49px;
    vertical-align: top;
}

#commu #menu div#user-settings-pulldown {
    color: #666;
    position: absolute;
    top: 65px;
    right: 40px;
    width: 150px;
    background-color: #FFFFFF;
    border: 1px solid #E6E6E6;
    z-index: 1010;
    /* ダッシュボードとの兼ね合いで必要 */
}

#commu #menu div#user-settings-pulldown:before {
    content: "";
    position: absolute;
    top: -6px;
    left: 70%;
    margin-left: -9px;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 6px 6px 6px;
    border-color: transparent transparent white transparent;
    z-index: 0;
}

#commu #menu div#user-settings-pulldown:after {
    content: "";
    position: absolute;
    top: -7px;
    left: 70%;
    margin-left: -10px;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 7px 7px 7px;
    border-color: transparent transparent #E6E6E6 transparent;
    z-index: -1;
}

#commu #menu div#user-settings-pulldown.fade {
    transition: all linear 300ms;
    opacity: 1;
}

#commu #menu div#user-settings-pulldown.fade.ng-hide {
    opacity: 0;
}

#commu #menu div#user-settings-pulldown > ul {
    position: relative;
    width: 100%;
    height: 100%;
    color: #666;
    text-align: left;
    padding: 0;
    margin: 0;
}

#commu #menu div#user-settings-pulldown > ul > li {
    position: relative;
    width: 100%;
    padding: 0;
    margin: 0;
    border-bottom: #E6E6E6 solid 1px;
}

#commu #menu div#user-settings-pulldown > ul > li:last-child {
    border-bottom: none;
}

#commu #menu div#user-settings-pulldown > ul > li > a {
    text-align: left;
    font-size: 14px;
    margin-left: 12px;
    width: auto;
    color: #808080;
    cursor: pointer;
}

#commu #menu div#user-settings-upgrade {
    padding: 5px 15px 5px 15px;
}

#commu #menu div#user-settings-upgrade > a {
    height: 100%;
    border: 1px solid #50C6D5;
    border-radius: 20px;
    background-color: #50C6D5;
    display: -webkit-inline-flex;
    display: flex;
    color: #FFFFFF;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}

#commu #menu div#user-settings-upgrade > a:hover {
    background-color: #FFFFFF;
    color: #50C6D5;
}

#commu #menu div#user-settings-upgrade > a > span {
    background: none;
    width: 80px;
    height: 20px;
    line-height: 21px;
    font-size: 10px;
}

/*------------------ aside --------------------------*/
#commu aside {
    font-size: 0;
}

#commu aside div#project-area {
    height: 100%;
    overflow-y: scroll;
    position: relative;
    width: calc(100% - 40px);
    display: inline-block;
}

#commu aside div#project-area p {
    color: #50C6D5;
    background: #D4EEF2;
    font-size: 12px;
    font-weight: bold;
    padding: 15px 0 13px 15px;
    position: relative;
}

#commu aside div#project-area p span.project-count {
    padding-left: 5px;
}

#commu aside div#project-area p span.close-sidemenu {
    padding: 0 10px;
    position: absolute;
    font-weight: normal;
    font-size: 20px;
    right: 0;
    color: #B9B9BE;
    top: 7px;
    cursor: pointer;
}

#commu aside div#project-area .howto-banner {
    position: fixed;
    width: 190px;
    bottom: 0;
    padding: 20px 15px;
}

#commu aside div#project-area .howto-banner img {
    width: 100%;
    transition-duration: 0.3s;
}

#commu aside div#project-area .howto-banner img:hover {
    transform: scale(1.1);
    transition-duration: 0.3s;
}

#commu aside nav#projectNav {
    width: 100%;
    height: auto;
    padding: 0;
    margin: 0;
}

#commu aside nav#projectNav > ul > li {}

#commu aside nav#projectNav ul li a {
    height: 100%;
    font-size: 13px;
    color: #808080;
    padding: 8px 0 5px 15px;
}

#commu aside nav#projectNav ul li a:hover {
    color: #50C6D5;
    background: #F5F5F5;
}

#commu aside div#project-area a#create-project {
    color: #B3B3B3;
    font-size: 12px;
    padding: 8px 0 5px 15px;
    margin-bottom: 100px;
    display: block;
}

#commu aside nav#projectNav ul li.select a:link,
#commu aside nav#projectNav ul li.select a:visited,
#commu aside nav#projectNav ul li.select a:hover,
#commu aside nav#projectNav ul li.channel li.select,
#commu aside nav#projectNav ul li.channel ul li.select:hover {
    color: #50C6D5;
    background: #F5F5F5;
}

#commu aside nav#projectNav ul li a.projectNav-selected {
    background: #E2E6EB;
}


/*------------------ main --------------------------*/

#commu section#tabs {
    width: 1140px;
    padding: 0 30px;
    margin: 0 auto;
}

#commu section#tabs > ul {
    height: 50px;
    display: -webkit-flex;
    /* Safari */
    display: flex;
    /*justify-content: center;*/
    list-style: none;
    border-bottom: 1px solid #E6E6E6;
}

#commu section#tabs > ul > li {
    margin: 0;
    padding: 11px 0 0 0;
}

#commu section#tabs > ul > li:first-child {
    padding: 5px 0 0 0px;
    color: #808080;
    font-size: 14px;
    font-weight: bold;
    min-width: 33%;
}

#commu section#tabs ul > li#project-settings {
    margin-left: auto;
    padding: 15px 10px 0;
    color: #B9B9BE;
    font-size: 18px;
    font-weight: bold;
}

#commu section#tabs ul li#project-settings a {
    color: #B9B9BE;
    margin-left: auto;
    height: auto;
    padding: 0;
}

#commu section#tabs ul li > a {
    display: block;
    height: 30px;
    margin: 0;
    padding: 6px 11px;
    font-size: 14px;
    font-weight: bold;
    color: #808080;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
}

#commu #menu li:hover,
#commu section#tabs > ul > li > a:hover,
#commu #menu div#user-settings-pulldown > ul > li > a:hover {
    color: #50C6D5;
    background: #D4EEF2;
    transition: all .4s;
}

#commu section#tabs > ul > li > a:hover {
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
}

#commu section#tabs > ul > li.select a:link,
#commu section#tabs > ul > li.select a:visited,
#commu section#tabs > ul > li.select a:hover,
#commu section#tabs > ul > li.channel li.select,
#commu section#tabs > ul > li.channel ul li.select:hover,
#commu .create-menu > div:hover {
    color: #50C6D5;
    background: #D4EEF2;
}

#commu {
    overflow: hidden;
    height: 100%;
}


/* content */

#commu section#content {
    padding: 20px 30px 0;
    overflow-y: scroll;
    overflow-x: hidden;
    height: calc(100vh - 90px);
    /*header40+tabs50+padding*/
}

#content-center {
    width: 1080px;
    margin: 0 auto 20px;
}

#project-settings i {
    font-size: 1.3em;
}

#project-name span {
    display: inline-block;
    width: 25px;
    color: #B9B9BE;
    cursor: pointer;
}

#project-name > div > div {
    display: inline-block;
    line-height: 39px;
    position: relative;
}

#project-name .add-btn {
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    margin: 0px;
    font-weight: bold;
    font-size: 1.2em;
    background-color: #50C6D5;
    color: #FFFFFF;
    cursor: pointer;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

#commu .create-menu {
    position: absolute;
    top: 33px;
    left: 0px;
    background-color: white;
    z-index: 1000;
    min-width: 140px;
    text-align: center;
    border: #E6E6E6 solid 1px;
}

#commu .create-menu > div {
    color: #666;
}

#commu .create-menu a {
    color: inherit !important;
    text-decoration: none;
    display: block;
    height: 100%;
}

#commu .alert,
#commu .success,
#commu .warning {
    margin-bottom: 0;
    box-shadow: none;
}

#commu #message .close {
    margin-top: -3px;
}

#commu #message {
    position: absolute;
    width: 400px;
    top: 60px;
    right: 5%;
    z-index: 1004;
    border-radius: 15px;
    filter: drop-shadow(1px 1px 4px rgba(0,0,0,0.2));
}

.message-area .messages .alert {
    display: flex;
    justify-content: space-between;
    flex-direction: row;
}

.message-area .messages .alert .msg {
    width: 350px;
    word-wrap: break-word;
    line-height: 23px;
}

#commu #menu a {
    padding: 0;
    line-height: 60px;
}

#commu #menu a i {
    margin-top: -4px;
}


/* ===================================================================
style info :search部分を調整(まにあわせ)
=================================================================== */

.td_field,.td_btn {
    background: #F5F5FA;
}

#commu .animate-hide {
    -webkit-transition: all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
    -moz-transition: all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
    -o-transition: all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
    transition: all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
}

#commu .animate-hide.ng-hide {
    opacity: 0;
}

#commu .sidemenu-hide.ng-hide {
    margin-left: -240px;
}

#commu .show-icon-hide.ng-hide {
    margin-left: -25px;
}


/*
三点リーダー
*/

#commu .hide-overflow {
    overflow: hidden;
    white-space: nowrap;
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis;
}

#commu i.fa.fa-circle-o,
#commu i.fa.fa-check-circle-o {
    padding-right: 8px;
    font-size: 20px;
    color: #50C6D5;
    cursor: pointer;
    vertical-align: top;
}


/* プロジェクト設定画面 */

#project-manage {
    margin: 0px auto;
    width: 700px;
    border-top: #E6E6E6 solid 1px;
}

#project-manage tr {
    height: 50px;
    border-bottom: #E6E6E6 solid 1px;
}

#project-manage td:nth-child(1) {
    width: 20%;
}

#project-manage td {
    padding: 12px 0px;
}

#project-manage td:nth-child(2) {
    color: #B3B3B3;
}

#project-manage li {
    height: 24px;
    line-height: 24px;
    border-radius: 50px;
    border: 1px solid #E6E6E6;
    margin: 0px 5px 5px 0px;
    display: inline-block;
}

#project-manage ul.member-list li {
    border-radius: 50px;
    background: #F5F5FB;
    border: none;
}

#project-manage span.item-color {
    cursor: pointer;
}

#project-manage li span.item-text {
    padding: 0px 10px;
}

#project-manage li span.item-mark {
    padding: 0px 10px 0px 0px;
    cursor: pointer;
}

#project-manage li span.item-mark-none {
    padding: 0px 10px 0px 0px;
}

#project-manage img {
    height: 24px;
    width: 24px;
    border-radius: 50px;
    vertical-align: top;
}

#project-manage .add-mark,
#project-manage .exit-mark {
    color: #50C6D8;
    cursor: pointer;
}

#project-manage .delete-mark {
    color: #D9346C;
}

#project-manage .links p {
    margin: 10px 0px 0px 0px;
    cursor: pointer;
    width: 140px;
}

#project-manage .tags span.item-color {
    height: 18px;
    width: 18px;
    margin: 2px;
    border-radius: 50px;
    border: 1px solid #E6E6E6;
    display: inline-block;
    vertical-align: top;
}

#project-manage .priority div {
    height: 40px;
    line-height: 40px;
    border-bottom: 1px solid #E6E6E6;
    position: relative;
}

#project-manage .priority span.item-color {
    height: 18px;
    width: 18px;
    border-radius: 50px;
    display: inline-block;
    vertical-align: middle;
    margin: 0px 18px 0px 0px;
}

#project-manage .priority span.item-name {
    position: absolute;
    top: 2px;
}

#project-manage .exist-tag-area,
#project-manage .add-tag-area,
#project-manage .add-status-area,
#project-manage .edit-priority-area {
    position: relative;
}

#project-manage p.add-tag,
#project-manage p.add-status {
    margin: 10px 0px 0px 0px;
    position: relative;
}

#project-manage .add-tag input {
    height: 30px;
    line-height: 30px;
    padding: 0px 8px;
    width: 320px;
    border: #E6E6E6 solid 1px;
    border-right: none;
    outline: none;
}

#project-manage .add-status input {
    height: 30px;
    line-height: 30px;
    padding: 0px 8px;
    width: 350px;
    border: #E6E6E6 solid 1px;
    border-right: none;
    outline: none;
}

#project-manage p span {
    height: 30px;
    line-height: 30px;
    display: inline-block;
    text-align: center;
}

#project-manage p span.select-color-area {
    border-top: #E6E6E6 solid 1px;
    border-bottom: #E6E6E6 solid 1px;
    width: 30px;
    vertical-align: bottom;
}

#project-manage p span.color-button {
    border: #E6E6E6 solid 1px;
    width: 18px;
    height: 18px;
    border-radius: 18px;
    position: absolute;
    top: 6px;
    right: 215px;
    cursor: pointer;
}

#project-manage p span.add-new-tag,
#project-manage p span.add-new-status {
    background: #50C6D8;
    color: #FFFFFF;
    font-size: 12px;
    vertical-align: top;
    width: 60px;
    cursor: pointer;
}

#project-manage .color-palette {
    border: #E6E6E6 solid 1px;
    display: inline-block;
    box-shadow: 2px 2px 5px 2px rgba(0, 0, 0, 0.1);
    position: absolute;
    width: 160px;
    background: #FFFFFF;
    z-index: 1;
}

#project-manage .color-palette p {
    margin: 10px;
    height: 24px;
}

#project-manage .color-palette span {
    margin: 1px 3px;
    width: 18px;
    height: 18px;
    border-radius: 18px;
    cursor: pointer;
    border: #E6E6E6 solid 1px;
}

#project-manage .new-tag-palette {
    top: -4px;
    left: 328px;
}

#project-manage .exist-tag-palette {
    top: 22px;
    left: 2px;
}

#project-manage .exist-tag-palette {
    top: 22px;
    left: 2px;
}

#project-manage .edit-priority-palette {
    top: 32px;
    left: 0px;
}

#project-manage .item-name-text,
#project-manage .item-name-edit,
#project-manage .project-name-text,
#project-manage .project-name-edit {
    position: relative;
}

#project-manage .item-name-text,
#project-manage .project-name-text {
    height: 24px;
    line-height: 24px;
    width: 500px;
    display: inline-block;
    padding: 0px 5px;
    border: 1px solid #FFFFFF;
    cursor: pointer;
}

#project-manage .item-name-text:hover,
#project-manage .project-name-text:hover {
    border: 1px solid #E6E6E6;
}

#project-manage .item-name-text .fa-pencil,
#project-manage .project-name-text .fa-pencil {
    display: none;
}

#project-manage .item-name-text:hover > .fa-pencil,
#project-manage .project-name-text:hover > .fa-pencil {
    z-index: 1;
    position: absolute;
    left: 470px;
    top: 5px;
    cursor: pointer;
    display: inline;
}

#project-manage .item-name-edit input,
#project-manage .project-name-edit input {
    height: 24px;
    line-height: 24px;
    width: 500px;
    padding: 0px 5px;
    border: 1px solid #E6E6E6;
}

#project-manage .item-name-edit input:focus,
#project-manage .project-name-edit input:focus {
    outline: none;
}

#project-manage tags-input {
    height: 30px;
    line-height: 30px;
    display: inline-block;
}

#project-manage tags-input .tags {
    padding: 0 8px;
    width: 350px;
    border-radius: 0;
    display: inline-block;
    border: none;
    outline: none;
    box-shadow: none;
}

#project-manage tags-input input {
    padding: 0;
    margin: 0;
    font-size: 13px !important;
    color: #808080 !important;
    height: 30px;
    box-shadow: none;
}

#project-manage tags-input .host {
    border: #E6E6E6 solid 1px;
    border-right: none;
    height: 30px;
    outline: none;
}

#project-manage .email-notification td div {
    display: flex;
    justify-content: flex-start;
}

#project-manage .email-notification td div i {
    padding: 0 5px 0 5px;
    font-size: 16px;
}

#project-manage .email-notification td div i.fa-toggle-on {
    color: #50C6D5;
}


/* ===================================================================
style info :プロジェクトマネージャー用 スタイル ★2018.1.11 kubota
=================================================================== */
#project-manage .project-leader-area {
    position: relative;
}

#project-manage .project-leader-area img {
    height: 24px;
    width: 24px;
    border-radius: 50px;
    vertical-align: top;
}

#project-manage li.project-leader {
    border-radius: 0;
    margin: 0;
    display: inline-block;
    background: #FFFFFF;
    text-align: left;
    padding: 0 10px;
    width: 150px;
    cursor: pointer;
    position: absolute;
    top: 12px;
}

#project-manage ul.unSelected-leader-list {
    color: #B3B3B3;
    width: 150px;
    min-height: 30px;
    line-height: 30px;
    border: solid 1px #e5e5e5;
    border-top: none;
    position: absolute;
    background: #FFFFFF;
    z-index: 1;
    top: 36px;
}

#project-manage li.unSelected-user {
    width: 100%;
    height: 32px;
    line-height: 32px;
    border-radius: 0;
    border: none;
    margin: 0;
    background: #FFFFFF;
    text-align: left;
    padding: 0 5px;
    display: inherit;
}

#project-manage li.unSelected-user span {
    margin: 3px;
}

#project-manage li.unSelected-user:hover {
    background: #DEF0F9;
    cursor: pointer;
}

#project-manage .pulldown-mark {
    font-size: 13px;
    text-align: center;
    width: 24px;
    cursor: pointer;
    color: #4ABED0;
    background: #F5F5FB;
    border-top: solid 1px #e5e5e5;
    border-bottom: solid 1px #e5e5e5;
    border-right: solid 1px #e5e5e5;
    position: absolute;
    top: 12px;
    height: 24px;
    line-height: 24px;
    left: 150px;
}

#project-manage .invite-users {
    background: #50C6D8;
    color: #FFFFFF;
    font-size: 12px;
    vertical-align: top;
    width: 60px;
    cursor: pointer;
    display: inline-block;
    margin: 5px 0 0 0;
    height: 30px;
    line-height: 30px;
    text-align: center;
}

#project-manage .invite-users-area {
    display: block;
    position: relative;
}

#project-manage .input-users {
    display: inline-block;
}

#project-manage .autocomplete {
    color: #B3B3B3;
    background: #FFFFFF;
    font-weight: normal;
    font-size: 12px;
    width: 350px;
    height: 24px;
    border-radius: 0;
    padding: 0px;
}

#project-manage .autocomplete .suggestion-list {
    width: 100%;
    height: 100%;
}

#project-manage .autocomplete .suggestion-item {
    color: #B3B3B3;
    background: #FFFFFF;
    font-weight: normal;
    font-size: 12px;
    padding: 0px 10px;
    width: 100%;
    height: 100%;
    margin: 0px;
    border: none;
    border-radius: 0;
}

#project-manage .autocomplete .suggestion-item:hover {
    color: #50C6D5;
    background: #D4EEF2;
}

#project-manage .autocomplete em {
    color: #B3B3B3;
    background: none;
    font-weight: normal;
    font-size: 12px;
}

#project-manage .tag-list .tag-item,
#project-manage .tag-list .remove-button {
    color: #B3B3B3;
    background: #FFFFFF;
    font-weight: normal;
    font-size: 12px;
    margin: 2px 5px 2px 0px;
}

#project-manage .uninvited-member-list {
    border: 1px solid #E6E6E6;
    display: inline-block;
    position: absolute;
    top: 36px;
    left: 0px;
    z-index: 1;
    background: #fff;
}

#project-manage .uninvited-member-list span {
    padding: 0 0 0 10px;
}

#project-manage .uninvited-member-list li {
    all: initial;
    display: block;
    width: 100px;
    padding: 10px 20px 10px 10px;
    font-size: 12px;
    color: #808080;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#project-manage .uninvited-member-list li:hover {
    background: #DBF2F6;
    cursor: pointer;
}

#project-manage .uninvited-member-list img {
    width: 16px !important;
    height: 16px !important;
    border-radius: 8px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
}

#project-manage .input-users {
    height: 30px;
    line-height: 30px;
    width: 334px;
    padding: 8px;
    margin: 5px 0 0 0;
    border-top: 1px solid #E6E6E6;
    border-bottom: 1px solid #E6E6E6;
    border-left: 1px solid #E6E6E6;
    border-right: none;
    position: relative;
}

#project-manage .input-invite-users,
#project-manage .input-select-leaders {
    border: none;
    outline: none;
    width: 59px;
}

#project-manage .invite-user-list {
    height: 28px;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 333px;
    padding: 0 0 0 5px;
    overflow-y: scroll;
}

#project-manage .invite-user-list span {
    margin: 0px 4px;
}

#project-manage .invite-user-list .delete-mark {
    cursor: pointer;
    color: #B3B3B3;
}

#project-manage .invite-user-list li {
    padding: 0px 5px;
}

#project-manage .invite-user-list li.user-input {
    border: none;
    margin: 0px;
    padding:0px;
}

/* プロフィール設定画面 */

.profile-setting {
    width: 700px;
    margin: 30px auto;
}

.profile-setting div.tabs {
	margin: 0px 0px 20px 0px;
	padding: 0px;
}

.profile-setting div.tabs li {
	font-weight: 700;
	display: block;
	width: 7em;
	float: left;
	margin: 20px 0px 0px 0px;
	padding: 3px;
	text-align: center;
	border-radius: 12px;
	cursor: pointer;
}

.profile-setting div.tabs li.active {
	color: #50C6D5;
	background: #D4EEF2;
}

.profile-setting tr:nth-child(1) {
    border-top: #E6E6E6 solid 1px;
    border-bottom: #E6E6E6 solid 1px;
}

.profile-setting tr:nth-child(2) {
    border-bottom: #E6E6E6 solid 1px;
}

.profile-setting tr:nth-child(2) button {
    background: #FFFFFF;
    color: #808080;
    font-weight: 100;
    border: #E6E6E6 solid 1px;
    box-shadow: none;
}

.profile-setting tr:nth-child(2) td:nth-child(2) {
    width: 200px;
}

.profile-setting tr:nth-child(2) td:nth-child(3) {
    vertical-align: bottom;
    padding: 10px 0px;
}

.profile-setting tr:nth-child(2) img {
    width: 200px;
    height: 200px;
    border: #E6E6E6 solid 1px;
    padding: 2px;
}

.profile-setting tr:nth-child(3) {
    border-bottom: #E6E6E6 solid 1px;
}

.profile-setting tr:nth-child(3) td {
    padding: 10px 0 100px 0px;
}

.profile-setting tr:nth-child(3) button {
    background: #50C6DC;
    color: #FFFFFF;
    font-weight: 100;
    box-shadow: none;
    border-radius: 0;
    width: 150px;
    height: 35px;
}

.profile-setting tr:nth-child(4) {
    border-bottom: #E6E6E6 solid 1px;
}

.profile-setting tr:nth-child(4) a {
    color: #50C6DC;
    cursor: pointer;
}

.profile-setting td {
    padding: 10px;
}

.profile-setting input#name {
    width: 400px;
    height: 35px;
    padding: 0px 10px;
}

.profile-setting button.update-profile:disabled {
    background: #E2E6ED;
    color: #FFFFFF;
}

.profile-setting table tbody tr td div i.fa-toggle-on {
    color: #50C6D5;
}

.settings-title {
    background: #FFFFFF;
    border-bottom: #E6E6E6 solid 1px;
    font-size: 17px;
    font-weight: bold;
    margin: 0;
    padding: 0px 0px 13px 0px;
}

.settings-title i {
    color: #B9B9C0;
    padding: 0px 10px 0px 0px;
    font-size: 14px;
    cursor: pointer;
}

.attach-btn i {
    cursor: pointer;
}

#commu header h1 a img {
    height: 35px;
}

#commu header h1 a {
    padding: 2px;
}

#commu header h1 a span {
    margin-left: 5px;
}


/* ===================================================================
style info :モーダル用 スタイル ★2017.7.13 common.style.css から移植 satoru
=================================================================== */

.modal-body {
    font-size: 15px;
    min-height: 150px;
    padding: 20px;
}

.modal-content {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    border: none;
}

.modal-backdrop {
    background: rgba(45, 45, 45, 1.0);
}

.modal-header {
    padding: 18px;
    background: #FFFFFF;
}

.modal-title {
    color: #808080;
    font-size: 17px !important;
    font-weight: bold !important;
    margin: 0 !important;
}

.modal-footer .btn-primary {
    outline: none;
    min-width: 100px;
    border: 0;
    color: #FFF;
    margin: 0 10px 0 0;
    height: 32px;
    font-size: 14px;
    background: #4ABED0;
    font-weight: bold;
    border-radius: 0;
}

.modal-footer .btn-default {
    outline: none;
    min-width: 100px;
    border: 0;
    color: #FFF;
    margin: 0 10px 0 0;
    height: 32px;
    font-size: 14px;
    background: #CCCCCC;
    font-weight: bold;
    border-radius: 0;
}

.modal-footer .btn-primary:hover {
    background: #DBF2F6;
    color: #4ABED0;
}

.modal-footer .btn-default:hover {
    background: #EFEFEF;
    color: #808080;
}

.modal-footer {
    padding: 15px 20px;
    text-align: center;
}

.modal-footer .btn+.btn {
    margin-left: 0px;
}

.modal-dialog:not(#ticket-edit-modal .modal-dialog) {
    width: 600px;
}

.modal {
    overflow-y: auto;
    max-height: 100%;
}

.modal_btn {
    text-align: left;
}

.modal_btn button {
    width: 180px;
    height: 34px;
    font-size: 13px;
    padding: 3px 0 0;
    margin: 0 5px 0 0;
    background: #F5A300;
}

.modal_btn .btn_close {
    width: 100px;
    height: 32px;
    background: #4ABED0;
    border-radius: 0;
    margin: 0px;
    padding: 0px;
}

.modal_btn .btn_close:hover {
    background: #DBF2F6;
    color: #4ABED0;
}

.modal_btn .btn_continue {
    background: #0071BC;
}

.modal-footer .btn-danger {
    outline: none;
    min-width: 100px;
    border: 0;
    color: #FFF;
    margin: 0 10px 0 0;
    height: 32px;
    font-size: 14px;
    background: #E20135;
    font-weight: bold;
    border-radius: 0;
}

.modal-footer .btn-danger:hover {
    background: #FDEBEF;
    color: #E20135;
}

.modal-body table {
    width: 100%;
}

.modal-body th {
    font-size: 13px;
    text-align: center;
    vertical-align: middle;
    width: 30%;
    background: #DEF0F9;
    border-bottom: #FFF solid 1px;
    padding: 8px 10px;
}

.modal-body td {
    background: #F5F3F0;
    border-bottom: #FFF solid 1px;
    padding: 8px 10px;
}

.modal-body td textarea {
    padding: 5px;
    font-size: 14px;
    min-height: 140px;
    width: 100%;
}

.modal-body td input[type="text"] {
    width: 100%;
}

.modal-body td input.color-picker-input {
    width: 100px;
}

/* ===================================================================
style info :チーム設定画面の「チームメンバー招待」モーダル用 スタイル ★2017.7.25
=================================================================== */
#add-user-dialog .modal-content {
    height: 274px;
}

#add-user-dialog .modal-body {
    position: relative;
}

#add-user-dialog .input-projects {
    display: block;
    height: 32px;
    line-height: 32px;
    font-size: 12px;
    margin: 0px 0px 20px 0px;
}

#add-user-dialog .input-projects .modal-body-title,
#add-user-dialog .input-users .modal-body-title {
    line-height: 34px;
    position: absolute;
}

#add-user-dialog .input-projects ul {
    color: #B3B3B3;
    width: 25%;
    min-height: 30px;
    line-height: 30px;
    border: solid 1px #e5e5e5;
    position: absolute;
    left: 120px;
    z-index: 1;
}

#add-user-dialog .input-projects ul .project-list {
    height: 32px;
    line-height: 32px;
    background: #FFFFFF;
    text-align: left;
    padding: 0px 10px;
    /** 三点リーダー表示設定 - ここから **/
    overflow: hidden;
    word-break: break-all;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    /** 三点リーダー表示設定 - ここまで **/
}

#add-user-dialog .input-projects ul .open:hover {
    background: #DEF0F9;
    cursor: pointer;
}

#add-user-dialog .input-projects .pulldown-mark {
    font-size: 13px;
    text-align: center;
    width: 34px;
    cursor: pointer;
    color: #4ABED0;
    background: #F5F5FB;
    border-top: solid 1px #e5e5e5;
    border-bottom: solid 1px #e5e5e5;
    border-right: solid 1px #e5e5e5;
    height: 34px;
    line-height: 34px;
    position: absolute;
    left: 270px;
}

#add-user-dialog .input-users {
    display: block;
    height: 32px;
    line-height: 32px;
    font-size: 12px;

}

#add-user-dialog .input-users tags-input {
    width: 460px;
    height: 28px;
    margin: 0px 100px;
}

#add-user-dialog tags-input .tags {
    border: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    -webkit-transition: none;
    transition: none;
}

#add-user-dialog tags-input > *:hover {
    outline: none;
}

#add-user-dialog tags-input > * {
    border: solid 1px #e5e5e5;
}

#add-user-dialog tags-input input {
    font-size: 12px;
}

#add-user-dialog .input-users input {
    color: #B3B3B3;
    height: 28px;
    line-height: 28px;
}

#add-user-dialog .tag-item {
    font-size: 12px;
    background: none;
    color: #B3B3B3;
    border: 1px solid #e5e5e5;
    border-radius: 30px;
}

#add-user-dialog .remove-button {
    font-size: 12px;
    margin: 0px;
    color: #B3B3B3;
    cursor: pointer;
    font-weight: normal;
}

#add-user-dialog .modal-footer button {
    float: right;
    margin: 0px;
}
/* ===================================================================
style info :2017.7.24 WIKI作成がBaseに移動したためCSSも移動
=================================================================== */

#commu .create-wiki-dialog-wrapper {
    width: 100%;
    height: calc(100% - 40px);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1003;
}

#commu .create-wiki-dialog-wrapper .create-wiki-dialog {
    background-color: #FFF;
    width: 100%;
    height: 100%;
    border: 1px solid #E6E6E6;
    position: absolute;
    top: 49px;
    left: 0;
    /*left: calc(50% - 350px); */
}

#commu .create-wiki-dialog-wrapper h2.create-wiki-dialog-header {
    padding: 15px 20px 0 20px;
    font-size: 14px;
    height: 40px;
    font-weight: bold;
    border-bottom: #E6E6E6 solid 1px;
}

#commu .create-wiki-dialog-wrapper h2 i {
    position: absolute;
    top: 12px;
    right: 20px;
}

header .create-wiki-dialog-wrapper p {
    color: #808080;
    position: static;
    font-weight: normal;
    word-wrap: break-word;
}

.re-wiki-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

#commu .re-left-wiki-header {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    border-bottom: #E6E6E6 solid 1px;
}

#commu .re-right-wiki-header {
    height: 100%;
    padding-left: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    border-bottom: #E6E6E6 solid 1px;
}

.re-wiki-title .re-left {
    width: 50%;
    padding: 0 20px;
    height: 50px;
    border-right: #E6E6E6 solid 1px;
}

.re-wiki-title .re-left .re-dir {
    padding: 20px 10px;
    font-size: 12px;
    color: #bbb;
    min-width: 150px;
    text-align: right;
}

.re-wiki-title .re-left .re-dir .re-wiki-create-folder-icon {
    font-size: 130%;
    color: #bbb;
    margin-left: 5px;
}

.re-wiki-title .re-left .re-dir .re-wiki-create-folder-icon:hover {
    cursor: pointer;
    color: #50C6D5;
    transition: all .4s;
}

.re-wiki-title .re-right {
    width: 50%;
    padding: 10px 20px 0;
    font-size: 24px;
    height: 50px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#commu .re-wiki-title input[type="text"] {
    width: 85%;
    border: none;
    font-weight: bold;
    /*border-bottom: #E6E6E6 solid 1px;*/
    height: auto;
    /*padding-top: 5px;*/
    /*display: inline-block;*/
    margin-right: auto;
}

.re-wiki-create-folder-dialog {
    position: absolute;
    left: 48%;
    margin-top: 35px;
    background-color: white;
    z-index: 1005;
    text-align: left;
    border: #E6E6E6 solid 1px;
    width: 275px;
}

.re-wiki-list-folder-icon {

}

.re-wiki-create-folder-short {
    margin: 10px 0 10px 15px;
    color: #46D2C8;
}

.re-wiki-create-ng-msg,
.re-wiki-create-ng-error-msg {
    margin-left: 15px;
    margin-bottom: 5px;
    padding-bottom: 10px;
    color: #bbb;
}
.re-wiki-create-ng-error-msg {
    color: #FF0000;
}

.re-wiki-create-folder-list li,
.wiki-view .re-wiki-edit-folder-list li {
    position: relative;
    height: 36px;
    line-height: 36px;
    padding: 0 0 0 15px;
    list-style: none;
    cursor: pointer;
    color: #bbb;
}

.re-wiki-create-folder-list li:hover,
.re-wiki-create-folder-list li p:hover,
.wiki-view .re-wiki-edit-folder-list li:hover,
.re-wiki-create-folder-upper:hover {
    color: #50C6D5;
    background: #D4EEF2;
    transition: all .4s;
}

.re-wiki-current-folder-name {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100px;
}

.re-wiki-create-folder-list li p,
.re-wiki-edit-folder-list li p {
    color: #bbb;
    width: 204px;
}

.wiki-view .re-wiki-create-folder-dialog ul{
    padding: 0;
    margin: 0;
}

.wiki-view .re-wiki-edit-folder-list li p {
    color: #bbb;
}

#commu .re-wiki-title .re-wiki-create-folder-dialog input[type="text"] {
    margin: 0 0 15px 15px;
    height: 24px;
    line-height: 24px;
    font-size: 13px;
    font-weight: normal;
    width: 200px;
    background: #FFF;
    padding: 0 8px;
    border: #ccc solid 1px;
    color: #bbb;
    outline: none;
}

.re-wiki-select-folder-btn {
    position: absolute;
    right: 10px;
    height: 20px;
    padding: 1px 10px;
    line-height: 20px;
    background: none;
    color: #FFF;
    box-shadow: none;
    top: 8px;
}

.re-wiki-create-folder-dialog li:hover .re-wiki-select-folder-btn {
    position: absolute;
    right: 10px;
    height: 20px;
    padding: 1px 10px;
    line-height: 20px;
    background: #50C6D5;
    color: #FFF;
    box-shadow: none;
    top: 8px;
}

.re-wiki-create-folder-btn {
    border-radius: 0;
    margin-top: -4px;
    margin-left: -4px;
    /*margin-right: 10px;*/
    height: 24px;
    box-shadow: none;
    background-color: #50C6D5;
}

.re-wiki-create-folder-btn:hover {
    cursor: pointer;
}

.re-wiki-create-folder-btn[disabled="disabled"] {
    background-color: #B9B9BE;
    cursor: default;
}

.re-wiki-create-folder-upper {
    margin-left: 10px;
    font-size: 12px;
    cursor: pointer;
}

.re-wiki-create-folder-upper-icon {
    cursor: pointer;
}

.re-wiki-summary {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: calc(100% - 220px);
    border-bottom: #E6E6E6 solid 1px;
}

.wiki-edit-dialog-wrapper .re-wiki-summary {
    height: calc(100% - 260px);
}

.wiki-edit-dialog-wrapper .re-wiki-summary p {
    margin: 0 !important;
    word-wrap: break-word;
}

.re-wiki-summary .re-left {
    width: 50%;
    padding: 20px 20px 20px;
    border-right: #E6E6E6 solid 1px;
}

.re-wiki-summary .re-right {
    width: 50%;
    padding: 20px 20px 20px;
    overflow-y: scroll;
}

.re-wiki-summary .re-left textarea {
    border: none;
    width: 100%;
    height: 100%;
    resize: none;
    outline: none;
}

#commu .create-wiki-dialog-wrapper button.create-wiki-btn,
#commu .wiki-edit-dialog-wrapper button.edit-wiki-btn {
    border: none;
    line-height: 1;
    height: 40px;
    text-align: center;
    font-weight: bold;
    background-color: #4abed0;
    color: #FFF;
    border-radius: 0;
    cursor: pointer;
    outline: none;
    box-shadow: none;
    padding: 15px;
    width: 130px;
}

#commu .create-wiki-dialog-wrapper button.create-wiki-btn[disabled="disabled"],
#commu .wiki-edit-dialog-wrapper button.edit-wiki-btn[disabled="disabled"] {
    background-color: #E2E6EB;
}

#commu .create-wiki-dialog-wrapper i {
    cursor: pointer;
    font-size: 17px;
    vertical-align: top;
}

#commu .create-wiki-dialog-wrapper .selected-properties span {
    display: table-cell;
    padding-right: 5px;
}

#commu .create-wiki-dialog-wrapper .properties {
    padding: 20px;
    float: left;
}

#commu .create-wiki-dialog-wrapper .selected-properties {
    padding: 3px 5px;
    display: inline-block;
    width: calc(100% - 180px);
}

#commu .create-wiki-dialog-wrapper .properties > ul > li,
#commu .create-wiki-dialog-wrapper .selected-properties ul > li {
    display: inline-block;
    position: relative;
}

#commu .create-wiki-dialog-wrapper .selected-properties > div {
    padding: 5px 0;
    width: 100%;
}

#commu .create-wiki-dialog-wrapper .selected-properties > div > span {
    display: table-cell;
    vertical-align: middle;
}

#commu .create-wiki-dialog-wrapper .selected-properties > div ul li {
    background-color: #F8F8FC;
    padding: 5px 10px;
    border-radius: 14px;
    font-weight: bold;
    margin-right: 5px;
    margin-bottom: 5px;
    vertical-align: middle;
    height: 24px;
}
#commu .create-wiki-dialog-wrapper .selected-properties > div ul li.clip-icon {
    background: none;
    padding: 2px 0 0 0;
}

#commu .create-wiki-dialog-wrapper .selected-properties > div.tags ul li {
    background-color: #FFF;
    border: 1px solid #E6E6E6;
}

#commu .create-wiki-dialog-wrapper .selected-properties > div ul li span {
    line-height: 13px;
    font-weight: bold;
    color: #B3B3B3;
    max-width: 200px;
}

#commu .create-wiki-dialog-wrapper .selected-properties > div.tags ul li span:first-child {
    font-weight: 400;
}

#commu .create-wiki-dialog-wrapper .selected-properties > div ul li span:last-child {
    padding: 0;
    cursor: pointer;
}

#commu .create-wiki-dialog-wrapper .selected-properties > div.watchers ul li {
    background-color: #FFF;
    padding: 5px 0px;
}

#commu .create-wiki-dialog-wrapper .selected-properties > div.watchers ul li span {
    position: relative;
}

#commu .create-wiki-dialog-wrapper .selected-properties > div.watchers ul li span img {
    cursor: auto;
}

#commu .create-wiki-dialog-wrapper .selected-properties > div.watchers ul li span i {
    font-size: 0.7em;
    position: absolute;
    top: -5px;
    right: -5px;
}

#commu .create-wiki-dialog-wrapper .properties > ul > li > i {
    margin-right: 10px;
}

#commu wiki-create-dialog ul.drop-down-list {
    border: 1px solid #E6E6E6;
    background-color: #FFF;
    z-index: 1001;
}

#commu wiki-create-dialog ul.drop-down-list li {
    position: relative;
    padding: 10px 20px 10px 10px;
    cursor: pointer;
    white-space: nowrap;
    max-width: 150px;
    width: 100%;
}

#commu wiki-create-dialog ul.drop-down-list li.not-selected {
    padding-left: 20px;
}

#commu wiki-create-dialog ul.drop-down-list li:hover {
    background-color: #DEF0F9;
}

#commu wiki-create-dialog ul.drop-down-list li span {
    padding: 0 0 0 10px;
}

#commu wiki-create-dialog ul.watchers.single {
    max-width: 105px;
    text-align: left;
}

#commu wiki-create-dialog ul.drop-down-list {
    vertical-align: top;
    position: absolute;
    background-color: #FFF;
}

#commu wiki-create-dialog img {
    width: 30px !important;
    height: 26px !important;
    border-radius: 8px;
    margin-left: 15px;
}

#commu .properties > ul > li ul.tag-list,
#commu .properties > ul > li ul.sub-wiki-list {
    overflow-y: scroll;
    max-height: 300px;
    min-width: 150px;
    max-width: 180px;
    overflow-x: hidden;
}

#commu .properties > ul > li ul.tag-list input,
#commu .properties > ul > li ul.sub-wiki-list input {
    width: 100%;
}

#commu .properties > ul > li ul.tag-list li:first-child,
#commu .properties > ul > li ul.sub-wiki-list li:first-child {
    padding: 3px;
}

#commu .properties > ul > li ul.tag-list li span.color-sample {
    border: 1px solid #E6E6E6;
    width: 17px;
    height: 17px;
}

#commu .properties > ul > li ul.sub-wiki-list {
    width: 231px;
}

#commu .properties > ul > li ul.sub-wiki-list,
#commu .properties > ul > li ul.sub-wiki-list li {
    max-width: 231px;
}

.wiki-view .attach-files p {
    margin: 10px 0 0;
}

body main section .md p {
    margin: 10px 0;
}

.wiki-dialog-footer,
.wiki-edit-dialog .wiki-dialog-footer {
    padding: 10px 0 0 10px;
}

.wiki-dialog-footer .submit-area {
    color: #ff0000;
    float: right;
    margin: 0 20px 0 20px;
    height: 100%;
}

.wiki-dialog-footer .attach-files {
    padding: 3px 5px;
    display: inline-block;
    width: calc(100% - 180px);
    overflow-y: auto;
    height: 80px;
}

.wiki-dialog-footer .attach-files p {
    margin: 0 0 10px 0;
}

.wiki-dialog-footer .error {
    width: 100%;
    height: 30px;
    padding: 5px 0 0 10px;
}

.wiki-dialog-footer .error > span {
    display: inline-block;
    color: #ff0000;
}

/* ===================================================================
style info :カレンダー用スタイル
==================================================================== */

.dropdown-menu,
.dropdown-menu li {
    margin: 0;
    padding: 0;
}

.dropdown-menu {
    padding: 0 5px 10px;
}

.dropdown-menu .btn{
    border: none;
    box-shadow: none;
    border-radius: 0;
}
.dropdown-menu .btn-default.active {
    background-color: #FFFFFF;
}
.dropdown-menu .btn-info,
.dropdown-menu .btn-info.active {
    background-color: #50C6D5;
}
.dropdown-menu:focus, .dropdown-menu *:focus {
    outline: 0;
}

/* ===================================================================
style info : サインアップ周り ★2017.7.31 suzuki.m
=================================================================== */

.register{
    width:700px;
    margin:0 auto;
}

.register h3 {
    font-size: 22px;
    padding: 13px 10px 10px;
    margin:20px 0 15px;
    border-bottom: 1px solid #E6E6E6;
    border-top: 1px solid #E6E6E6;
}

.register dt {
    margin-top: 20px;
    font-size: 15px;
    display:block;
    font-weight:normal;
    color:#4ABED0;
    padding: 0 5px 1px;
    border-bottom: 1px solid #E6E6E6;
}

/* ===================================================================
style info : OGPの画像 ★2017.9.19 cyubachi
=================================================================== */
div[ng-bind-html="comment.ogpHTML"] > blockquote > p > img {
    max-width: 400px;
}
/* ===================================================================
style info : 未読件数周り ★2017.9.15 chubachi
=================================================================== */

#projectNav .unread-count {
    display: inline-block;
    border-radius: 10px;
    background-color: rgb(211, 213, 223);
    color: rgb(255, 255, 255);
    text-align: center;
    font-size: 0.8em;
    width: 18px;
    height: 18px;
    text-decoration: none;
    vertical-align: top;
    line-height: 19px;
}
#projectNav .unread-count:hover {
    box-shadow: 0 0 4px 2px #50C6D5;
    -moz-box-shadow: 0 0 4px 2px #50C6D5;
    -webkit-box-shadow: 0 0 4px 2px #50C6D5;
}
#projectNav .project-name {
    display: inline-block;
    width: 84%;
}

/* ===================================================================
style info :Markdown ★2017.9.22 kubota
=================================================================== */

.wiki-view {
    padding-bottom: 30px;
    border: none;
    width: 100%;
    height: 100%;
    resize: none;
    display: block;
}

.md h1,
.md h2,
.md h3,
.md h4,
.md h5,
.md h6,
.wiki-view h1,
.wiki-view h2,
.wiki-view h3,
.wiki-view h4,
.wiki-view h5,
.wiki-view h6 {
    margin: 40px 0 10px 0;
    font-weight: 600;
    width: inherit;
}

.md h1:first-child,
.md h2:first-child,
.md h3:first-child,
.md h4:first-child,
.md h5:first-child,
.md h6:first-child,
.wiki-view h1:first-child,
.wiki-view h2:first-child,
.wiki-view h3:first-child,
.wiki-view h4:first-child,
.wiki-view h5:first-child,
.wiki-view h6:first-child {
    margin: 10px 0 10px 0;
}

.md h1,
.wiki-view h1 {
    background: #e9e7e4 none repeat scroll 0 0;
    padding: 5px 8px 3px !important;
    line-height: 1.5;
    font-size: 20px;
    height: initial !important;
}

.md h2,
.wiki-view h2 {
    border-bottom: solid 1px #d4d4d4;
    font-size: 20px;
    padding:0;
}

.md h3,
.wiki-view h3 {
    font-size: 18px;
    background:none;
    padding:0;
}

.md h3,
.wiki-view h3 {
    background:none;
    font-size: 18px;
    padding:0;
    margin: 10px 0 10px 0;
}

.md h4,
.wiki-view h4 {
    font-size: 16px;
    padding:0;
}

.md h5,
.wiki-view h5 {
    font-size: 16px;
}

.md h6,
.wiki-view h6 {
    font-size: 14px;
}

/* ダイアログのデザインが入るまでの間に合わせ */

.md p,
.wiki-view p {
    margin: 0;
    word-wrap: break-word;
}

.md blockquote,
.wiki-view blockquote {
    color: #888;
    font-size: 13px;
    border-left: solid 6px #DDD;
    margin: 20px 0;
    padding: 0 20px;
}

.md ul,
.wiki-view ul {
    line-height: 1.6em;
    margin: 1em 0;
    padding-left: 2em;
}

#edit-delete-dialog ul {
    padding: 0px;
}

.md ul > li,
.wiki-view ul > li {
    list-style-type: disc;
}

.md ul li,
.wiki-view ul li {
    line-height: 1.6;
}

.md ul li p:first-child,
.wiki-view ul li p:first-child {
    margin: 0;
}

.md ul ol,
.wiki-view ul ol {
    margin: 0;
}

.md ul ul,
.wiki-view ul ul {
    margin: 0;
}

.md ol,
.wiki-view ol {
    line-height: 1.6em;
    margin: 1em 0;
    padding-left: 2em;
}

.md ol > li,
.wiki-view ol > li {
    list-style-type: decimal;
}

.md ol li,
.wiki-view ol li {
    line-height: 1.6;
}

.md ol li p:first-child,
.wiki-view ol li p:first-child {
    margin: 0;
}

.md ol ul,
.wiki-view ol ul {
    margin: 0;
}

.md ol ol,
.wiki-view ol ol {
    margin: 0;
}

.md em,
.wiki-view em {
    font-style: italic;
}

.md del,
.wiki-view del {
    text-decoration: line-through;
}

.md img,
.wiki-view img {
    border: solid 1px #E6E6E6;
    padding: 10px;
    margin: 5px 0;
    max-width: 100%;
}

.md a,
.wiki-view a {
    border-bottom: dashed 1px #117EC6;
    margin: 0 2px;
    padding: 1px;
}

.md a:link,
.md a:visited,
.wiki-view a:link,
.wiki-view a:visited {
    color: #117EC6;
    text-decoration: none;
}

.md a:hover,
.wiki-view a:hover {
    border-radius: 3px;
    background: #0f72b3;
    color: #fff;
    text-decoration: none;
}

.md a:active,
.wiki-view a:active {
    color: #fff;
    text-decoration: none;
}

.md dl,
.wiki-view dl {
    margin: 1em 0;
}

.md dl dd,
.wiki-view dl dd {
    margin-left: 2em;
}

.md table,
.wiki-view table {
    width: auto;
    margin: 1em 0;
    border-top: solid 1px #CCC;
    border-left: solid 1px #CCC;
}

.md table thead td,
body main section .md table th,
.wiki-view table thead td,
.wiki-view table th {
    padding: 8px 10px;
    font-weight: 600;
    border-right: solid 1px #CCC;
    border-bottom: solid 1px #CCC;
}

.md table tbody tr:nth-child(odd),
.wiki-view table tbody tr:nth-child(odd) {
    background-color: rgba(0, 0, 0, 0.03);
}

.md table td,
.wiki-view table td {
    word-wrap: break-word;
    padding: 8px 10px;
    border-right: solid 1px #CCC;
    border-bottom: solid 1px #CCC;
}

.md table td a,
.wiki-view table td a {
    word-wrap: break-word;
    word-break: break-all;
}

.md code,
pre,
.wiki-view code,
pre {
    background-color: #F5F3F0;
    border: 1px solid #AAAAAA;
    font-family: Courier, monospace;
}

.md code,
.wiki-view code {
    display: inline;
    margin: 0 5px;
    padding: 2px 5px 0;
}

.md pre,
.wiki-view pre {
    overflow: auto;
    margin: 10px 0;
}

.md pre code,
.wiki-view pre code {
    display: block;
    border: none;
    margin: 0;
    padding: 15px 20px;
}

.md hr,
.wiki-view hr {
    display: block;
    margin: 20px 0;
    border: 0;
    border-top: solid 1px #CCC;
    border-bottom: 1px solid #ffffff;
}

/* ===================================================================
style info :Loading spinner ★2017.10.02 satoru
=================================================================== */

#commu span.loading-spinner {
    top: calc(50%);
    left: calc(50%);
    z-index: 10000;
}

/* ===================================================================
style info :Login screen error message ★2017.10.25 satoru
=================================================================== */

.register-contents .error {
    margin: 10px auto;
    width: 500px;
    color: red;
    text-align: center;
}
.register-contents .error p {
    padding: 3px;
    font-size: 1.2em;
}

/* ===================================================================
style info :Team delete dialog ★2017.10.31 satoru
=================================================================== */

.user .delete-team .warning {
    color: #FF0000;
    font-weight: normal;
    font-size: 0.9em;
}

.user .delete-team .notice {
    color: #808080;
    font-weight: normal;
    font-size: 0.9em;
}

/* ===================================================================
style info :Login screen error message ★2017.11.02 satoru
=================================================================== */

.nologin-error {
    margin: 50px 250px;
}

.nologin-error p {
    padding: 5px 0;
    font-weight: bold;
    font-size: 1.2em;
    color: red;
}

/*---ユーザー登録が完了しました画面---*/
/*---sekiya---*/

#commu section#content #register-format{
    padding:0;
}
#commu section#content #register-format{
    width: 1080px;
     margin: 0 auto;
}
#commu section#content #register-format .user-regist-form{
    width: 500px;
    margin: 40px auto 0;
    border-radius: none;
    background-color: #F8F8FC;
    text-align: center;
    padding: 40px;
}
#commu section#content #register-format label{
    color: #808080;
    font-size: 16px;
    padding-right: 0;
    font-weight: bold;
}
#commu section#content #register-format p {
    font-size: 12px;
    margin: 10px 0 0;
    
}
#commu section#content #register-format .login_input{
    height: 34px;
    width: 100%;
    margin-top: 5px;
    padding-left: 10px;
    font-weight: bold;
    border: #CCC solid 1px;
}
#commu section#content #register-format .submitBtn{
    width: 130px;
    height: 40px;
    background-color: #4ABED0;
    border-radius: 0;
    margin: 20px 0 40px 0;
    box-shadow: none;
}
#commu section#content #register-format #span_pass{
    font-size: 14px;
    color: #808080;
}
#commu section#content #register-format #span_pass a{
    color: #4ABED0;
    font-weight: bold;
}


/*--スマートフォン対応--*/
/*--sekiya--*/
@media screen and (max-width: 999px) and (min-width: 737px) {
/* 999px以下用（タブレット用）の記述 */
    header,#visual,.start01,.start02,#function {
    min-width:100%;
    margin: auto;
    }
    #content-center {
        width: 100%;
        height: auto;
    }
    #top_header header{
        min-width:1000px;
    }
}
@media screen and (max-width: 736px) {
/* 736px以下用（SP用）の記述 */
    body {
        background: #FFF;
        line-height: 1.6;
    }
    main {
        width: 100%;
        overflow: hidden;
    }
    
    /*--header--*/
    header {
        height: auto;
    }
    header h1 {
        padding: 10px 0 0 10px;
    }
    
    #content-center{
    width:100%;
    height: auto;
    }
    #commu section#content{
        padding:30px 20px 30px;
        width: 100%;
    }
    #commu section#content #register-format{
            width: 100%;
    }
    #commu section#content #register-format .user-regist-form{
        width: 100%;
        height: auto;
        margin: 0 auto;
        text-align: center;
        padding: 25px;
    }
    #commu section #register-format input[type="text"] {
        width: 100%;
        height: 40px;
    }
    #commu section #register-format p {
        margin: 5px 0;
    }
    #commu section #register-format  .submitBtn {
        margin: 15px 0 12px 0;
    }
    #commu section #register-format  .login_input{
        border:#CCC solid 1px;
    }
}
#commu section#content #register-format{
    width: 100%;
}

/* ===================================================================
style info : Common dialog ★2017.11.02 satoru
=================================================================== */

.common-dialog {
    background: rgba(45, 45, 45, 0.5);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1001;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow-y: scroll;
}

.common-dialog .common-dialog-body {
    position: absolute;
    width: 800px;
    z-index: 1002;
    background: #FFFFFF;
    text-align: center;
}

.common-dialog .common-dialog-header {
    background: #50C6D5;
    height: 80px;
    line-height: 80px;
    color: #FFFFFF;
}

.common-dialog .common-dialog-content {
    height: 80px;
    line-height: 80px;
}

.common-dialog .common-dialog-footer {
    height: 80px;
    line-height: 80px;
}

/* ===================================================================
style info : Walk through dialog ★2017.11.02 satoru
=================================================================== */

#walkthrough .common-dialog-header .walk-icon {
    position: absolute;
    top: 4px;
    left: 20px;
}

#walkthrough .common-dialog-header .walk-step {
    position: absolute;
    top: -5px;
    right: 3px;
}

#walkthrough .common-dialog-header .walk-content {
    position: absolute;
    font-size: 18px;
    font-weight: bold;
    width: 600px;
    text-align: left;
    left: -60px;
    top: -3px;
}

#walkthrough .common-dialog-header .walk-content p {
    line-height: 26px;
}

#walkthrough .common-dialog-content {
    border-bottom: 1px solid #E6E6E6;
}

#walkthrough .common-dialog-content .walk-title {
    border-bottom: 1px solid #E6E6E6;
    height: 60px;
    line-height: 60px;
    font-size: 18px;
    font-weight: bold;
    text-align: left;
    padding: 0 0 0 20px;
}

#walkthrough .common-dialog-content {
    height: 180px;
}

#walkthrough .common-dialog-content .walk-input-project input {
    height: 45px;
    line-height: 45px;
    width: 760px;
    outline: none;
    padding: 0 10px;
    border: 1px solid #E6E6E6;
}

#walkthrough .common-dialog-content .walk-input-mail {
    margin: 17px 20px 10px 20px;
}

#walkthrough .common-dialog-content .walk-input-mail tags-input .tags {
    box-shadow: none;
    height: 45px;
    line-height: 45px;
    width: 760px;

    overflow-y: scroll;
    position: absolute;

    padding: 0 15px;
}

#walkthrough .common-dialog-content .walk-input-mail tags-input .tags .tag-item {
    margin-top: 8px;
    background: #FFFFFF;
    border-radius: 50px;
    color: #D4D4D4;
    border: solid 1px #D4D4D4;
    padding: 0 8px 0 12px;
}

#walkthrough .common-dialog-content .walk-input-mail tags-input .tags .tag-item .remove-button {
    color: #D4D4D4;
}

#walkthrough .common-dialog-content .walk-input-mail tags-input .host {
    outline: none;
    height: 45px;
    line-height: 45px;
}

#walkthrough .common-dialog-content .walk-input-mail tags-input .tags .input {
    height: 43px;
    line-height: 43px;
    margin: 0px;
    color: #D4D4D4;
}

#walkthrough .common-dialog-content .walk-notice-message {
    height: 20px;
    line-height: 20px;
    text-align: left;
    padding: 0 0 0 20px;
    color: #808080;
}

#walkthrough .common-dialog-content .walk-error-message {
    height: 20px;
    line-height: 20px;
    text-align: left;
    padding: 0 0 0 20px;
    color: red;
}

#walkthrough .walk-profile-content {
    height: 300px;
    text-align: left;
}

#walkthrough .common-dialog-content .walk-profile img {
    border: solid 1px #E6E6E6;
    width: 200px;
    height: 200px;
    padding: 2px;
    margin: 20px;
}

#walkthrough .common-dialog-content .walk-profile button {
    top: 330px;
    position: absolute;
    box-shadow: none;
    border-radius: 0;
    height: 30px;
    line-height: 30px;
    padding: 0 15px;
    background: #FFFFFF;
    border: 1px solid #D4D4D4;
    color: #B0B0B0;
    font-weight: normal;
}

/* 各ベンダープレフィックスが取れた標準版！！(http://caniuse.com/#search=placeholder-shown) */
#walkthrough :placeholder-shown {
    color: #E2E6EE;
}
/* Google Chrome, Safari, Opera 15+, Android, iOS */
#walkthrough ::-webkit-input-placeholder {
    color: #E2E6EE;
}
/* Firefox 18- */
#walkthrough :-moz-placeholder {
    color: #E2E6EE; opacity: 1;
}
/* Firefox 19+ */
#walkthrough ::-moz-placeholder {
    color: #E2E6EE; opacity: 1;
}
/* IE 10+ */
#walkthrough :-ms-input-placeholder {
    color: #E2E6EE;
}

#walkthrough .common-dialog .walk-complete-dialog-header {
    background: #D4EEF2;
    height: 210px;
    line-height: 210px;
    margin: 20px 20px 0 20px;
}

#walkthrough .common-dialog .walk-complete-dialog-header .walk-icon {
    position: absolute;
    left: 170px;
    top: 20px;
}

#walkthrough .common-dialog .walk-complete-dialog-header .walk-content {
    position: absolute;
    width: 600px;
    text-align: left;
    left: 190px;
    top: 30px;
}

#walkthrough .common-dialog .walk-complete-dialog-header .walk-content p {
    line-height: 26px;
    color: #50C6D5;
    font-size: 18px;
}

#walkthrough .common-dialog .walk-complete-dialog-header .walk-content strong {
    line-height: 80px;
    font-size: 45px;
}

#walkthrough .walk-complete-dialog-content .walk-title {
    border-bottom: 1px solid #E6E6E6;
    height: 60px;
    line-height: 60px;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
}

#walkthrough .walk-complete-dialog-content .walk-error-message {
    display: none;
    height: 20px;
    line-height: 20px;
    text-align: center;
    padding: 20px 0;
    color: red;
}

#walkthrough .walk-complete-dialog-footer {
    margin: 20px 0;
    text-align: center;
    padding: 0 20px 0 0;
}

#walkthrough .common-dialog-footer {
    text-align: right;
    padding: 0 20px 0 0;
}

#walkthrough .common-dialog-footer .walk-submit-btn,
#walkthrough .walk-complete-dialog-footer .walk-submit-btn {
    background: #50C6D5;
    box-shadow: none;
    border-radius: unset;
    height: 50px;
    width: 140px;
    font-size: 18px;
}

#walkthrough .common-dialog-footer .walk-submit-btn-disabled {
    background: #D4EEF2;
    box-shadow: none;
    border-radius: unset;
    height: 50px;
    width: 140px;
    font-size: 18px;
    cursor: default;
}

#walkthrough .common-dialog-footer .walk-skip-btn,
#walkthrough .walk-complete-dialog-footer .walk-skip-btn {
    background: #F8F8FC;
    box-shadow: none;
    border-radius: unset;
    height: 50px;
    width: 140px;
    font-size: 16px;
    color: #50C6D5;
}

/* ===================================================================
style info : Walk through dialog slider ★2017.11.13 satoru
=================================================================== */

#walkthrough .walk-slide {
    position: relative;
    height: 500px;
}

#walkthrough .walk-slide .slide-prev,
#walkthrough .walk-slide .slide-next {
    position: absolute;
    background: #D4EEF2;
    height: 40px;
    width: 40px;
    top: 200px;
    border-radius: 20px;
    line-height: 40px;
    font-size: 18px;
    font-weight: bold;
    color: #FFFFFF;
    z-index: 3;
}

#walkthrough .walk-slide .slide-prev:hover,
#walkthrough .walk-slide .slide-next:hover {
    background: #50C6D5;
    cursor: pointer;
}

#walkthrough .walk-slide .slide-prev {
    left: 20px;
}

#walkthrough .walk-slide .slide-next {
    right: 20px;
}

#walkthrough #slider-list img.slider {
    position: absolute;
    top: 20px;
    left: 30px;
    z-index: 1;
}

#walkthrough #slider-list img.current {
    z-index: 2;
}

#walkthrough #slider-nav {
    position: absolute;
    top: 456px;
    height: 43px;
    width: 100%;
    line-height: 43px;
}

#walkthrough #slider-nav div.slider-nav {
    width: 16px;
    height: 16px;
    border-radius: 8px;
    background: #D4EEF2;
    display: inline-block;
    margin: 0 5px;
}

#walkthrough #slider-nav div.current {
    background: #50C6D5;
}


#commu #tabs i.display-menu {
    background-image: url(/static/img/common/icon/menu.png);
    background-size:contain;
    background-repeat: no-repeat;
    width: 14px;
    height: 14px;
}

#commu #tabs i.display-menu-notice {
    background-image: url(/static/img/common/icon/menu-notice.png);
    background-size:contain;
    background-repeat: no-repeat;
    width: 19px;
    height: 19px;
}

/* ===================================================================
style info : Share link modal ★2018.01.17 satoru
=================================================================== */

.share-link-modal .modal-body {
    text-align: center;
}

.share-link-modal .share-link {
    margin: 20px 0 0 0;
}

.share-link-modal .share-link span {
    overflow: hidden;
}

.share-link-modal .copy-url {
    border: #E6E6E6 solid 1px;
    border-right: none;
    height: 38px;
    line-height: 38px;
    display: inline-block;
    padding: 0 10px;
    font-size: 12px;
    width: 350px;
    text-align: left;
    text-overflow: ellipsis;
}

.share-link-modal .fa-file-text-o {
    cursor: pointer;
    height: 38px;
    line-height: 38px;
    background: #50C6D5;
    width: 50px;
    color: #FFF;
}

/* ===================================================================
style info : Wiki breadcrumb list style ★2018.02.05 satoru
wiki/style-redesign.css にこのスタイルを定義すると、このファイルの定義で上書き
されてしまうため、一部のWikiの定義をここに実装しました。
=================================================================== */

.wiki-top-folder a,
.wiki-top-folder a:visited,
.wiki-top-folder span,
.wiki-detail-folder a,
.wiki-detail-folder a:visited,
.wiki-detail-folder span {
    color: #ccc !important;
    padding: 0 1px;
    border: none;
    font-size: 13px;
}

.wiki-top-folder a:hover,
.wiki-detail-folder a:hover {
    color: #50C6D5;
    background: none;
}

/* ===================================================================
style info : Common calendar ★2018.03.19 satoru
=================================================================== */

.common-calendar .dropdown-menu {
    text-align: center;
    padding: 10px;
}

.common-calendar .dropdown-menu li {
    border: none !important;
}

.common-calendar .dropdown-menu li:nth-child(2) {
    float: right;
}

.common-calendar .dropdown-menu li:nth-child(2) span {
    margin: -7px -10px;
}

.common-calendar .dropdown-menu .btn-info.active,
.common-calendar .dropdown-menu .btn-info {
    background: #FFFFFF;
    color: #31708f;
}

.common-calendar .dropdown-menu .btn-info.active:hover,
.common-calendar .dropdown-menu .btn-info:hover {
    background: #e6e6e6;
}

.common-calendar .dropdown-menu .glyphicon {
    top: -1px;
}

.common-calendar .dropdown-menu .btn {
    outline: none;
}

.common-calendar table {
    outline: none;
    display: inline-block;
}

.common-calendar th {
    font-size: inherit;
    text-align: inherit;
    vertical-align: inherit;
    width: inherit;
    background: inherit;
    border-bottom: inherit;
    padding: inherit;
}

.common-calendar tr {
    height: 26px !important;
    width: 38px !important;
    border-bottom: none !important;
}

.common-calendar td {
     padding: 0 !important;
}

.common-calendar .pull-left .btn:first-child,
.common-calendar .pull-left + .btn-sm {
    display: none;
}

.common-calendar .pull-left .btn:nth-child(2) {
    background: #50C6D5;
}

.common-calendar thead {
    font-size: 12px;
    color: #808080;
}

/* ===================================================================
style info : Milestone project settings ★2018.03.19 satoru
=================================================================== */

#project-manage .add-milestone-area {
    display: block;
}

#project-manage p.add-milestone {
    margin: 10px 0px 0px 0px;
    position: relative;
    top: -5px;
    height: 30px;
}

#project-manage .add-milestone input {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 30px;
    line-height: 30px;
    padding: 0px 8px;
    width: 250px;
    border: #E6E6E6 solid 1px;
    border-right: none;
    outline: none;
    background: #FFFFFF;
    color: #B3B3B3;
}

#project-manage .common-calendar .input-group-addon {
    position: absolute;
    top: -35px;
    left: 250px;
    background: #FFFFFF;
    border: none;
    border-top: #E6E6E6 solid 1px;
    border-bottom: #E6E6E6 solid 1px;
    height: 30px;
    width: 20px;
    text-align: center;
    padding: 0px;
    padding: 5px 0 0 0;
    z-index: 2;
    color: #50C6D8;
    cursor: pointer;
}

#project-manage .common-calendar .input-group input {
    border: #E6E6E6 solid 1px;
    border-left: none;
    border-right: none;
    height: 30px;
    position: absolute;
    top: -35px;
    left: 270px;
    width: 80px;
    color: #B3B3B3;
    background: #FFFFFF;
    font-size: 12px;
    line-height: 30px;
    /* 入力ボックスにカーソルインさせない（手で直接カレンダーの日付を入力するのを禁止） */
    pointer-events : none;
}

#project-manage .common-calendar .input-group input:focus {
    border-top: #E6E6E6 solid 1px;
    border-bottom: #E6E6E6 solid 1px;
    box-shadow: none;
}

#project-manage p span.add-new-milestone {
    position: absolute;
    left: 350px;
    top: 0px;
    background: #50C6D8;
    color: #FFFFFF;
    font-size: 12px;
    vertical-align: top;
    width: 60px;
    cursor: pointer;
}

#project-manage .add-milestone-area p span {
    line-height: 0px;
    padding: 15px 0 0 0;
}

/* マイルストーンアイコンのスタイル設定 */
#project-manage #milestone-area .milestone-icon {
    cursor: pointer;
}
#project-manage #milestone-area .milestone-name {
    max-width: 150px;
    display: inline-block;
}
#project-manage #milestone-area .milestone-date {
    float: right;
    margin: 0 10px 0 0;
}
#project-manage #milestone-area .item-mark {
    float: right;
}

/* Clear ボタンを非表示 */
#project-manage #milestone-area .dropdown-menu li:nth-child(2) {
    display: none;
}

/* ===================================================================
style info : Milestone edit dialog ★2018.03.20 satoru
=================================================================== */

[id^="edit-milestone-modal"] .milestone-name {
    max-width: 100% !important;
    display: block !important;
    height: 30px !important;
    line-height: 30px !important;
    margin: 20px 0 0 30px !important;
}

[id^="edit-milestone-modal"] .milestone-th {
    width: 150px !important;
    display: inline-block !important;
    text-align: right !important;
}

[id^="edit-milestone-modal"] .milestone-name input {
    height: 30px !important;
    line-height: 30px !important;
    width: 320px !important;
    border: 1px solid #e5e5e5 !important;
    color: #B3B3B3;
}

[id^="edit-milestone-modal"] .milestone-date {
    position: relative !important;
    height: 30px !important;
    line-height: 30px !important;
    margin: 15px 0 0 30px !important;
    float: none !important;
}
[id^="edit-milestone-modal"] .input-group input {
    border: none !important;
    top: 0px !important;
    left: 170px !important;
    cursor: pointer !important;
    /* 入力ボックスにカーソルインさせない（手で直接カレンダーの日付を入力するのを禁止） */
    pointer-events : none !important;
}

[id^="edit-milestone-modal"] .input-group-addon {
    border: none !important;
    top: 1px !important;
    left: 150px !important;
}

/* Clear ボタンを非表示 */
[id^="edit-milestone-modal"] .dropdown-menu li:nth-child(2) {
    display: none !important;
}

/* ===================================================================
style info : Selected project name design ★2018.04.09 satoru
=================================================================== */
/* Common header */
#tabs #project-name .project-select-area {
    position: relative;
    max-width: 315px;
    display: inline-block;
}
#tabs #project-name .selected-project-name {
    max-width: 315px;
    margin: 0 20px 0 0;
}
#tabs #project-name .project-select-area .common-menu-button {
    position: absolute;
    top: 7px;
    right: -25px;
}

/* ===================================================================
style info : File drop confirm dialog ★2018.04.13 satoru
=================================================================== */
file-drop-confirm-dialog {
    background: rgba(45, 45, 45, 0.5);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1004;
    display: none;
}

/* ===================================================================
style info : Drag & Drop message beside clip icon  ★2018.04.13 satoru
=================================================================== */
.dragDropMsg {
    color: #B3B3B4;
    margin: 0 0 0 5px;
}

/* ===================================================================
style info : Grows 施策 プロモーションコード導入  ★2018.06.15 satoru
=================================================================== */
#promotion_code {
    height: auto;
    margin: 20px 40px 10px 40px;
    position: relative;
}
#promotion_code h4 {
    margin: 30px 10px 16px;
    display: inline-block;
    font-size: 12px;
}
#promotion_code i {
    cursor: pointer;
    color: dodgerblue;
    margin-left: 0px;
}
/*「?」アイコンにマウスオーバーした場合にツールチップを表示 */
#promotion_code i:hover + .promotion-tool-tip {
    display: block;
}
#promotion_code .promotion-tool-tip {
    display: none;
    background: #FFFFFF;
    width: 250px;
    text-align: left;
    border-radius: 15px 15px 15px 0;
    border: solid 1px;
    padding: 15px;
    position: absolute;
    top: -93px;
    left: 267px;
}
#promotion_code .promotion-tool-tip h5 {
    font-size: 12px;
    font-weight: bold;
    padding: 0 0 10px 0;
    text-align: center;
}
#promotion_code .promotion-tool-tip p {
    font-size: 10px;
}
#promotion_code .input-promotion-code {
    outline: none;
/*    position: absolute;
    top: 65px;
    left: 82px;*/
    width: 260px;
    border-radius: 20px;
    padding: 0 10px;
    height: 34px;
}
#promotion_code .validation {
    display: inline-block;
    width: 20px;
    height: 20px;
    line-height: 20px;
    color: #FFFFFF;
    border-radius: 12px;
    font-size: 10px;

    position: absolute;
    top: 67px;
    left: 240px;
}
#promotion_code .ok {
    background: #32CD32;
}
#promotion_code .ng {
    background: #FF0000;
}
#promotion_code .message {
    position: absolute;
    left: 68px;
    top: 110px;
    color: red;
}

/* ===================================================================
style info : Wiki Folder Gray Overlay ★2018.09.04 anzai
=================================================================== */
.wiki-select-folder-over {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(8,8,8,0.5);
    z-index: 1005;
    margin: 0;
    padding: 0;
}

/*--プロモーションコード　スマートフォン対応--sekiya--*/
/*--sekiya--*/
@media screen and (max-width: 999px) and (min-width: 737px) {
     /*999px以下用（タブレット用）の記述 */
    #promotion_code .input-promotion-code {
        position: static;
    }
    }

@media screen and (max-width: 736px) {
    /* 736px以下用（SP用）の記述 */
    #promotion_code .input-promotion-code {
        position: static;
    }
    
    #promotion_code {
        margin: 24px 0;
        margin: 0px auto;
        height: auto;
    }
    #register-sign_up .submitBtn {
        margin: 0 auto;
    }
}


@media screen and (max-width: 999px) and (min-width: 737px) {
    #promotion_code {
        width: 344px;
        margin:0 auto;
    }
}

.register-format-input p {
    text-align: justify;
    margin-bottom: 0px;
}

.register-format-input {
    margin-top:20px;
}

/* ===================================================================
style info : Coach Mark ★2019.01.31 satoru
=================================================================== */

.coach-mark-screen {
    background: rgba(45, 45, 45, 0.5);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1001;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    justify-content: center;
    align-items: center;
}

.coach-mark-img-create-ticket {
    position: absolute;
    width: 398px;
}

.coach-mark-img-commu-icon {
    position: absolute;
    width: 432px;
}

.coach-mark-img-open-close {
    position: absolute;
    width: 398px;
}

/* スタイルを当てた要素をぼかす */
.background-blur {
    pointer-events: none;
    transition: all .2s ease-out;
    filter: blur(8px);
}

/* Commu Icon */
commu-icon {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1000;
}