﻿@charset "UTF-8";

/* -------------------------------------------------------
 変数宣言
 IEだと未対応のため、本スタイルで定義は二重定義をしています
------------------------------------------------------- */
:root {
    --fontF: "メイリオ","Meiryo",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;   /* フォントファミリ */
}

/* テーマカラー */
:root {
    --bgBaseColor: #EFF5F4;    /* 基本背景色 */
}
:root {
    --bgFrontColor: #ffffff;   /* 基本前景色 */
}
:root{
    --ftBaseColor: #333333;    /* 基本文字色 */
}
:root{
    --ftLabelColor: #555555;   /* ラベル文字色 */
}
:root {
    --mainColor: #60B2B2;      /* メインカラー(ヘッダ背景など) */
}
:root {
    --subColor: #25658B;       /* サブカラー(ナビゲーション背景やTH背景など) */
}
:root{
    --ftTitleColor: #ffffff;   /* タイトル文字色(ヘッダ文字、TH文字など) */
}
:root {
    --accentColor: #F4CF7A;    /* アクセントカラー（見出し左ボーダーなど） */
}
:root {
    --accentColor2: #CC3956;   /* アクセントカラー（見出し左ボーダーなど） */
}
:root {
    --borderColor: #808080;    /* 枠線カラー(区切りなど) */
}

/*===== 以下は修正不要 ================================================================================================

/* -------------------------------------------------------
 ベース
------------------------------------------------------- */
html, form {
    height: 100%;
}

body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #EFF5F4;
    background-color: var(--bgBaseColor);
    color: #333333;
    color: var(--ftBaseColor);
    font-family: "メイリオ","Meiryo",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
    font-family: var(--fontF);
}

p {/* bootstrap上書き */
    margin: 0;
}

ul {/* bootstrap上書き */
    list-style: none;
    padding: 0;
    margin: .5rem;
}

dt {/* bootstrap上書き */
    font-weight: normal;
    color: #555555;
    color: var(--ftLabelColor);
}

dd {/* bootstrap上書き */
    margin-bottom: 0.3rem;
}

label {/* bootstrap上書き */
    margin-bottom: 0!important;
}

input[type="date"] {
    max-width:12rem;
}

.bg-yellow {
    background-color: cornsilk!important;
}

.bg-gray {
    background-color: #eeeeee!important;
}

/* -------------------------------------------------------
 レイアウト[コンテナ]
------------------------------------------------------- */
.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl {/* bootstrap上書き */
    min-height: calc(100% - 6rem);
    padding-top: 1rem;
    padding-bottom: 3rem;
    background-color: #ffffff;
    background-color: var(--bgFrontColor);
}
.container {/* bootstrap上書き */
    max-width: 690px;
}

#main_container p {
    margin: .5rem;
}

/* -------------------------------------------------------
 レイアウト[ヘッダー]
------------------------------------------------------- */
header {
    background-color: #60B2B2;
    background-color: var(--mainColor);
    border-bottom: solid 1px #fff;
    z-index: 999;
}

header .title{
    padding: 2px 10px 2px 35px;
    /*background-image: url("./../img/logo.png");*/
    background-image: url("/portal/javax.faces.resource/img/logo.png.xhtml");
    background-repeat: no-repeat;
    background-position: 9px;
    background-size: 15px;
    color: #ffffff;
    color: var(--ftTitleColor);
    font-size: 1rem;
}

/* -------------------------------------------------------
 レイアウト[ナビゲーション]
------------------------------------------------------- */
nav {/* bootstrap上書き */
    background-color: #25658B;
    background-color: var(--subColor);
}

nav .loginInfo {
    margin-top: .3rem;

    color: #F4CF7A;
    color: var(--accentColor);

    font-size: 0.9rem;
}

.navbar {/* bootstrap上書き */
    padding: .3rem 1rem;
    -moz-box-shadow: 2px 2px 1px rgba(0,0,0,0.1);
    -webkit-box-shadow: 2px 2px 1px rgba(0,0,0,0.1);
    box-shadow: 2px 2px 1px rgba(0,0,0,0.1);
}

.nav-link {/* bootstrap上書き */
    line-height: 1rem;
    margin: .5rem 0 .2rem;
    padding: .1rem 1rem;
    border-bottom: solid .2rem #25658B;
    border-bottom: solid .2rem var(--subColor);
}
    @media screen and (max-width: 720px) {
        .nav-link {
            padding: .5rem 1rem;
        }
    }

.nav-link.active {/* bootstrap上書き */
    border-bottom: solid .2rem #F4CF7A;
    border-bottom: solid .2rem var(--accentColor);
}

.navbar-nav {/* bootstrap上書き */
    padding-left: 20px;
}

.navbar-dark .navbar-toggler {/* bootstrap上書き */
    padding: .04rem .75rem;
    border-color: transparent;
}

nav button:focus {/* bootstrap上書き */
    outline: 0;
}

.navbar-nav .dropdown-item:hover{/* bootstrap上書き */
    background-color: #eeeeee;
}

.navbar-nav .dropdown-item.active{/* bootstrap上書き */
    background-color: #F4CF7A;
    background-color: var(--accentColor);
    color: #333333;
    color: var(--ftBaseColor);
}

.dropdown:hover > .dropdown-menu {
    display: block;
}
.dropdown > .dropdown-toggle:active {
    /*Without this, clicking will make it sticky*/
    pointer-events: none;
}

.dropdown-item {
    padding: .5rem 1.5rem;
}
/* -------------------------------------------------------
 レイアウト[フッター]
------------------------------------------------------- */
footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    background-color: #ffffff;
    background-color: var(--bgFrontColor);
    z-index: 999;
}

footer p {
    margin: 0;
    padding: 5px 0;
    border-top: solid 1px #60B2B2;
    border-top: solid 1px var(--mainColor);
    font-size: 0.8em;
    text-align: right;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
}

/* コンテンツフッター固定エリア */
.footer {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;

    position: fixed;
    bottom: 26px;
    width: 100%;
    padding: 5px 0;
    background-color: rgba(150,150,150,0.5);
    border-top: solid 1px #ffffff;

    -ms-flex-pack: center;
    justify-content: center;
    z-index: 999;
}

/* -------------------------------------------------------
 レイアウト[ボタン]
------------------------------------------------------- */
.btn {/* bootstrap上書き */
    margin: .5px .2rem;
    white-space: nowrap;
}

/* outlineボタンの背景色を透明から半透明にする */
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-success,
.btn-outline-info,
.btn-outline-warning,
.btn-outline-danger,
.btn-outline-light,
.btn-outline-dark,
.btn-outline-primary.disabled   , .btn-outline-primary:disabled,
.btn-outline-secondary.disabled , .btn-outline-secondary:disabled,
.btn-outline-success.disabled   , .btn-outline-success:disabled,
.btn-outline-info.disabled      , .btn-outline-info:disabled,
.btn-outline-warning.disabled   , .btn-outline-warning:disabled,
.btn-outline-danger.disabled    , .btn-outline-danger:disabled,
.btn-outline-light.disabled     , .btn-outline-light:disabled,
.btn-outline-dark.disabled      , .btn-outline-dark:disabled  {/* bootstrap上書き */
    background-color: rgba(255, 255, 255, 0.3);
}

/* -------------------------------------------------------
 レイアウト[見出し・ラベル]
------------------------------------------------------- */
/* 見出し１ */
h1 {
    font-size: 1.5em;
    font-weight: bold;
    margin-bottom: 10px;
    padding-left: 8px;
    border-left: solid 5px #60B2B2;
    border-left: solid 5px var(--mainColor);
    color: #25658B;
    color: var(--subColor);
}

/* 見出し２ */
h2 {
    font-size: 1.2em;
    font-weight: bold;
    margin: 5px 10px;
    padding-left: 8px;
    border-left: solid 5px #F4CF7A;
    border-left: solid 5px var(--accentColor);
    color: #25658B;
    color: var(--subColor);
}

/* -------------------------------------------------------
 レイアウト[入力フォーム]
------------------------------------------------------- */
.form-group {
    margin-bottom: .25rem;
}

/* 入力フォームラベル */
.col-form-label {/* bootstrap上書き */
    font-weight: bold;
    color: #555555;
    color: var(--ftLabelColor);
}

/* 入力フォームinputをラベルと位置合わせ */
.col-form-input {
    padding-top: .25rem;
}

/* カスタムチェックボックスのラベル無し位置合わせ */
.custom-control-label.custom-no-label {
    top: .3rem;
    left: .5rem;
}

.form-control {
/*
    font-size: .9rem;
    padding: .1rem .5rem;
    height: auto;
*/
}

/* -------------------------------------------------------
 レイアウト[モーダル]
------------------------------------------------------- */
.modal-header {/* bootstrap上書き */
    background-color: #60B2B2;
    background-color: var(--mainColor);
    color: #ffffff;
    color: var(--ftTitleColor);
    padding: .3rem 1rem;
}

/* -------------------------------------------------------
 レイアウト[ポップオーバー]
------------------------------------------------------- */
.popover {/* bootstrap上書き */
    max-width: 600px;
    background-color: #F4CF7A;
    background-color: var(--accentColor);
    -moz-box-shadow: 2px 2px 1px rgba(0,0,0,0.1);
    -webkit-box-shadow: 2px 2px 1px rgba(0,0,0,0.1);
    box-shadow: 2px 2px 1px rgba(0,0,0,0.1);
}

.bs-popover-top > .arrow::after, .bs-popover-auto[x-placement^="top"] > .arrow::after {/* bootstrap上書き */
    border-top-color: #F4CF7A;
    border-top-color: var(--accentColor);
}

.bs-popover-right > .arrow::after, .bs-popover-auto[x-placement^="right"] > .arrow::after {/* bootstrap上書き */
    border-right-color: #F4CF7A;
    border-right-color: var(--accentColor);
}

.bs-popover-bottom > .arrow::after, .bs-popover-auto[x-placement^="bottom"] > .arrow::after {/* bootstrap上書き */
    border-bottom-color: #F4CF7A;
    border-bottom-color: var(--accentColor);
}

.bs-popover-left > .arrow::after, .bs-popover-auto[x-placement^="left"] > .arrow::after {/* bootstrap上書き */
    border-left-color: #F4CF7A;
    border-left-color: var(--accentColor);
}

/* -------------------------------------------------------
 レイアウト[テーブル]
------------------------------------------------------- */
table.table-fixed {
    table-layout: fixed;
}

table.table {/* bootstrap上書き */
    font-size: 0.9rem;
    border-spacing: 0;
    margin-bottom: 0;
}

table.table tr {/* bootstrap上書き */
    background-color: #ffffff;
    background-color: var(--bgFrontColor);
}

table.table th {/* bootstrap上書き */
    white-space: nowrap;
    text-align: center;
    font-weight: normal;
    background-color: #25658B;
    background-color: var(--subColor);
    color: #ffffff;
    color: var(--ftTitleColor);
    border: solid 1px #808080;
    border: solid 1px var(--borderColor);
}

table.table td {/* bootstrap上書き */
    border: solid 1px #808080;
    border: solid 1px var(--borderColor);
}

.table-striped tbody tr:nth-of-type(odd) {/* bootstrap上書き */
    background-color: #EFF5F4;
    background-color: var(--bgBaseColor);
}

table.tablesorter th {
    padding-right: 20px;
}

/* テーブルヘッダ固定 */
.table.table-sticky tr th,
.table.table-sticky thead tr th,
.table.table-sticky .sticky_x {
    position: -webkit-sticky;
    position: sticky;
}
.table.table-sticky tr th,
.table.table-sticky thead tr th {
    z-index: 2;
}

.table.table-sticky tr:nth-child(1) th,
.table.table-sticky thead tr:nth-child(1) th {
    top: 0;
}

.table.table-sticky th:first-child,
.table.table-sticky thead th:first-child {
    z-index: 3;
}

.table.table-sticky .sticky_x {
    z-index: 1;
}

.table.table-sticky .sticky_x {
    left: 0;
}
.table.table-sticky .sticky_x {
    background-color: inherit;
}

.table.table-sticky .sticky_x::before {
    content : "" ;
    position : absolute ;
    top : 0 ;
    left : 0 ;
    width : 100% ;
    height : 100% ;
    border-right: solid 0.5px #ccc;
}

.table-sticky tr:nth-child(2) th,
.table-sticky thead tr:nth-child(2) th {
    top: 1.5rem;/* スクロール2段目高さ */
}

.table-sm th {
    padding: .1rem .5rem;
}

/* -------------------------------------------------------
  Patrs[メッセージ]
------------------------------------------------------- */
.alert {/* bootstrap上書き */
    padding: .3rem 1.25rem;
    margin-bottom: .2rem;
    font-size: .9rem;
}

.msgArea ul:last-child {
    margin-bottom: 1rem;
}


/* -------------------------------------------------------
  ローディング
------------------------------------------------------- */
#loading {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: #FFF;
  background-image: url("/portal/javax.faces.resource/img/loading.gif.xhtml");
  background-size: 50px;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0.8;
  z-index: 1;  
}

/* -------------------------------------------------------
 その他
------------------------------------------------------- */
/* 改行をそのまま表示 */
.preformatted{
    overflow: auto;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/* 新着 */
.new:after {
    color: red;
    font-weight: bold;
    content: " NEW!";
}



/* -------------------------------------------------------
 印刷設定
------------------------------------------------------- */
@media print {
    body {
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        -webkit-print-color-adjust: exact;
        font-size: 10pt;
        zoom: 99%;
    }
    * {
        text-shadow: none !important;
        box-shadow: none !important;
    }
}
.prt_scrolloff{}
.prt_hide{}
.prt_show{display: none;}
.prt_area{}



/* -------------------------------------------------------
 個別[TODO予定、総務予定]
------------------------------------------------------- */
.taskView {
    position: absolute;
    background-color: #EFF5F4;
    background-color: var(--bgBaseColor);
    margin: 10px 0px;
    padding: 10px 10px;
    border-radius: 4px;
    border: solid 1px #808080;
    border: solid 1px var(--borderColor);
    -moz-box-shadow: 2px 2px 1px rgba(0,0,0,0.1);
    -webkit-box-shadow: 2px 2px 1px rgba(0,0,0,0.1);
    box-shadow: 2px 2px 1px rgba(0,0,0,0.1);
    font-size: .9rem;
    z-index: 10;
}

/* -------------------------------------------------------
 個別[月別勤怠]
------------------------------------------------------- */
.knt_label {
    margin: 0;
    padding: 0;
    font-size: xx-small;
    font-weight: bold;
    color: #999;
}

/* -------------------------------------------------------
 個別[アンケート]
------------------------------------------------------- */
.qa_label {
    margin: 0;
    padding: 0;
    font-size: xx-small;
    font-weight: bold;
    color: #999;
}
.qa_title_1 {
    background-color: #25658B;
    background-color: var(--subColor);
    color: #ffffff;
    color: var(--ftTitleColor);
}
.qa_title_2 {
    background-color: #60B2B2;
    background-color: var(--mainColor);
    color: #ffffff;
    color: var(--ftTitleColor);
}
