@font-face {
    font-family: 'Josefin Sans', sans-serif;
    font-weight: 100;
}

/* Material iconsを利用する */
.material-icons {
    font-size: 16px !important;
    width: 20px;
    height: 1em;
    line-height: 1.4 !important;
    vertical-align: text-top;
}

.sidebar-menu .material-icons {
    font-size: 18px !important;
    width: 20px;
    height: 1em;
    line-height: 1.4 !important;
    vertical-align: text-top;
}

.login-box .material-icons {
    font-size: 18px !important;
    padding-left: 10px;
    width: 20px;
    height: 1em;
    line-height: 1.4 !important;
    vertical-align: text-top;
}

.fa {
    width: 20px;
}

/* アイコンサイズ */
.material-icons.md-18 {
    font-size: 18px;
}

.material-icons.md-24 {
    font-size: 24px;
}

.material-icons.md-36 {
    font-size: 36px;
}

.material-icons.md-48 {
    font-size: 48px;
}

/* 背景が明るいとき用のアイコン色 */
.material-icons.md-dark {
    color: rgba(0, 0, 0, 0.54);
}

    .material-icons.md-dark.md-inactive {
        color: rgba(0, 0, 0, 0.26);
    }

/* 背景が暗いとき用のアイコン色 */
.material-icons.md-light {
    color: rgba(255, 255, 255, 1);
}

    .material-icons.md-light.md-inactive {
        color: rgba(255, 255, 255, 0.3);
    }

#main-menu-1 {
    margin-top: 25px;
    text-align: center;
    font-size: 12px;
}

    #main-menu-1 img {
        width: 72px;
    }

#main-menu-2 {
    margin-top: 25px;
    text-align: center;
    font-size: 12px;
}

    #main-menu-2 img {
        width: 72px;
    }

#main-menu-3 {
    margin-top: 25px;
    text-align: center;
    font-size: 12px;
}

    #main-menu-3 img {
        width: 72px;
    }

#main-menu-4 {
    margin-top: 25px;
    text-align: center;
    font-size: 12px;
}

    #main-menu-4 img {
        width: 72px;
    }

#main-menu-5 {
    margin-top: 25px;
    text-align: center;
    font-size: 12px;
}

    #main-menu-5 img {
        width: 72px;
    }

#main-menu-6 {
    margin-top: 25px;
    text-align: center;
    font-size: 12px;
}

    #main-menu-6 img {
        width: 72px;
    }

#main-menu-7 {
    margin-top: 25px;
    text-align: center;
    font-size: 12px;
}

    #main-menu-7 img {
        width: 72px;
    }

#main-menu-8 {
    margin-top: 25px;
    text-align: center;
    font-size: 12px;
}

    #main-menu-8 img {
        width: 72px;
    }

#main-menu-9 {
    margin-top: 25px;
    text-align: center;
    font-size: 12px;
}

    #main-menu-9 img {
        width: 72px;
    }

#main-menu-10 {
    margin-top: 25px;
    text-align: center;
    font-size: 12px;
}

    #main-menu-10 img {
        width: 72px;
    }

.form-icon-login {
    position: absolute;
    top: 5px;
    left: 0px;
    z-index: 2;
    display: block;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    pointer-events: none;
}

.txt-center {
    text-align: center;
}

.kadomaru {
    border-radius: 7px;
}

.kadomaru2 {
    border-radius: 18px;
}

.box-bgcf5f5f5 {
    background-color: #F5F5F5;
    padding: 20px 20px 10px 20px;
    margin-bottom: 10px;
}

.box-noline {
    margin-bottom: 10px;
    background-color: #F5F5F5;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #DCDCDC;
}

    .box-noline input {
        background-color: #F5F5F5;
        margin-left: 20px;
        margin-bottom: 10px;
        border-top-style: none;
        border-right-style: none;
        border-bottom-style: none;
        border-left-style: none;
        height: 26px;
    }

    .box-noline select {
        background-color: #F5F5F5;
        margin-left: 20px;
        height: 26px;
        margin-bottom: 10px;
        /*border: 1px solid #DCDCDC;*/
        padding-top: 1px;
        padding-right: 2px;
        padding-bottom: 1px;
        padding-left: 2px;
    }

@media (max-width: 767px) {
    .serch-btn-center {
        width: 300px;
        margin: 0 auto;
        display: block;
        text-align: center;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .box-noline input {
        width: 60%;
    }

    .box-noline select {
        display: inline-block;
        width: 60%;
    }
}

@media (min-width: 768px) {
    .serch-btn-center {
        width: 400px;
        margin: 0 auto;
        display: block;
        text-align: center;
    }

    .box-noline input {
        width: 80%;
    }

    .box-noline select {
        width: 80%;
    }
}

/* 写真一覧　ボタン追加 */
.box-btn {
    margin: 10px 10px 0 10px;
}

.btn-newphoto {
    color: #FFF;
    background-color: #F00;
    border-radius: 20px;
    margin: 0 0 0 10px;
}

    .btn-newphoto:active {
        color: #FFF;
        background-color: #C00;
    }

.btn-tile {
    color: #000;
    background-color: #EEE;
    /*	background-color: #51B2F4;*/
    border-radius: 20px 0px 0px 20px;
}

    .btn-tile:active {
        color: #FFF;
        /*	background-color: #367fa9;*/
        background-color: #51B2F4;
        box-shadow: inset 0px 3px 5px rgba(0,0,0,0.125);
    }

.btn-list {
    color: #000;
    background-color: #EEE;
    /*	background-color: #51B2F4;*/
    border-radius: 0px 20px 20px 0px;
}

    .btn-list:active {
        color: #FFF;
        /*	background-color: #367fa9;*/
        background-color: #51B2F4;
        box-shadow: inset 0px 3px 5px rgba(0,0,0,0.125);
    }

.box-list {
    display: block;
    padding: 10px;
}

/* 日報　ボタン追加 */
.btn-maru-l {
    color: #505050;
    background-color: #DCDCDC;
    border-radius: 20px 1px 1px 20px;
    margin-right: 1px;
    height: 2.1em;
    padding: 0.6em;
    font-size: 1em;
    line-height: 0.85em;
    /*	transition: all 0.3s ease 0s;*/
}

@media (min-width: 1024px) {
    .btn-maru-l:hover,
    .btn-maru-l:active,
    .btn-maru-l.hover {
        color: #FFF;
        background-color: #51B2F4;
        cursor: pointer;
    }
}

@media (max-width: 767px) {
    .btn-maru-l:active {
        color: #FFF;
        background-color: #51B2F4;
        /*background-color: #367fa9;*/
    }
}

.btn-maru-r {
    color: #505050;
    background-color: #DCDCDC;
    border-radius: 1px 20px 20px 1px;
    height: 2.1em;
    padding: 0.6em;
    font-size: 1em;
    line-height: 0.85em;
}

@media (min-width: 1024px) {
    .btn-maru-r:hover,
    .btn-maru-r:active,
    .btn-maru-r.hover {
        color: #FFF;
        background-color: #51B2F4;
        cursor: pointer;
    }
}

@media (max-width: 767px) {
    .btn-maru-r:active {
        color: #FFF;
        background-color: #51B2F4;
        /*background-color: #367fa9;*/
    }
}

.btn-maru-c {
    color: #505050;
    background-color: #DCDCDC;
    border-radius: 1px 1px 1px 1px;
    margin-right: 1px;
    height: 2.1em;
    padding: 0.6em;
    font-size: 1em;
    line-height: 0.85em;
}

@media (min-width: 1024px) {
    .btn-maru-c:hover,
    .btn-maru-c:active,
    .btn-maru-c.hover {
        color: #FFF;
        background-color: #51B2F4;
        cursor: pointer;
    }
}

@media (max-width: 767px) {
    .btn-maru-c:active {
        color: #FFF;
        background-color: #51B2F4;
        /*background-color: #367fa9;*/
    }
}

/* ボタンonの配色 */
.btn-on {
    /*color: #333;*/
    /*background-color:#CCC;*/
    color: #FFF;
    background-color: #51b2f4;
    box-shadow: inset 0px 3px 5px rgba(0,0,0,0.125);
}

/* 個人カレンダーボタンの配色 */
.fc-myCustomButton-button {
    color: #FFF !important;
    background-color: #51B2F4 !important;
    border-radius: 20px 20px 20px 20px !important;
}

.fc-today-button {
    color: #FFF !important;
    background-color: #51B2F4 !important;
    border-radius: 20px 20px 20px 20px !important;
    margin-right: 10px !important;
}

.fc-month-button {
    color: #505050 !important;
    background-color: #DCDCDC !important;
    border-radius: 20px 1px 1px 20px !important;
    margin-right: 1px !important;
}

.fc-agendaWeek-button {
    color: #505050 !important;
    background-color: #DCDCDC !important;
    border-radius: 1px 1px 1px 1px !important;
    margin-right: 1px !important;
}

.fc-agendaDay-button {
    color: #505050 !important;
    background-color: #DCDCDC !important;
    border-radius: 1px 20px 20px 1px !important;
}

    .fc-agendaDay-button:hover,
    .fc-month-button:hover,
    .fc-agendaWeek-button:hover {
        color: #FFF !important;
        background-color: #51B2F4 !important;
    }

.fc-right {
    margin: 5px 0px !important;
}

.fc-left {
    margin: 5px 0px !important;
}

.fc-center {
    margin: 5px 0px 5px 0px !important;
}

@media (max-width: 480px) {
    .fc-center {
        margin: 20px 0px 5px 0px !important;
    }
}

.fc-prev-button {
    background-color: #FFF !important;
}

.fc-next-button {
    background-color: #FFF !important;
}


/* 写真選択時のライン */
.photo-select-border {
    border: 4px #ff0000 solid;
    box-sizing: border-box;
}

/* 削除できない写真のグレーアウト */
.grayed-out {
    -webkit-filter: grayscale(1);
    filter: gray;
    filter: grayscale(1);
    cursor: default;
    opacity: 0.5;
}

/* 日報入力 */
.input-header {
    margin-top: -15px;
}

.btn-close {
    border-style: none;
    background-color: #FFF;
}

.btn-save {
    color: #51B2F4;
    border-style: none;
    background-color: #FFF;
}

/* 写真タイル表示 ansur */
@media (max-width: 480px) {
    .docs-pictures > li {
        float: left;
        width: 33.3%;
        margin: 0 -1px -1px 0;
        border: 1px solid transparent;
        overflow: hidden;
    }
}

/* モバイルロゴFIX ansur */
.logo-fix {
    display: none;
    width: 100%;
    text-align: center;
    color: #FFF;
    background-color: #4696dc;
    position: fixed;
    font-family: Josefin-Sans;
    height: 50px;
    font-size: 24px;
    line-height: 60px;
    text-align: center;
    margin: 0 auto;
    padding: 0px 0px;
    font-weight: 300;
    overflow: hidden;
    z-index: 2100;
}

@media (max-width: 767px) {
    .logo-fix {
        display: block;
    }

    .main-header .logo .logo-lg {
        display: none !important;
    }
}

/* チャット ansur */
.chat-msarea {
    color: #666;
    width: 90% !important;
    height: 2.5em !important;
    background: #EEE;
    border: 0 solid #EEE !important;
    border-radius: 7px !important;
    margin-left: 30px;
}

    .chat-msarea:focus {
        height: 4.5em !important;
    }

.chat-clip {
    font-size: 24px !important;
    position: absolute;
    left: 0;
}

.chat-btn {
    padding: 0px;
    background-color: #FFF;
    border-width: 0px;
}

.chat-send {
    color: #4696dc !important;
    font-size: 24px !important;
    line-height: 1em !important;
}

.time-label {
    text-align: center;
    margin: 0 auto;
    color: #555;
    background-color: #FFF;
}

.time-input {
    width: 150% !important;
}

/* 週間カレンダー日付文字サイズ */
.fc-agendaWeek-view span {
    font-size: 10px !important;
}

.fc-center h2 {
    font-size: 22px !important;
    line-height: 1.3em;
}

.table-sm {
    background-color: transparent;
    height: 30px;
    width: 100%;
    max-width: 100%;
}

    .table-sm th,
    .table-sm td {
        border-bottom: 1px solid #ddd;
    }