﻿@charset "utf-8";
/*----------------------------------------------------
	基本設定、リンクカラー、レイアウト、横幅設定など
----------------------------------------------------*/
* {
	margin: 0;
	padding: 0;
}

html {
	height:100%;
	font-size: 14px;
}
body {
	font-size: 15px;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	
	height:100%;
}

/* メインコンテンツ用ブロック */
#main_contents {
	height:100%;
	position:relative;
}

/* iframeを親のブロック要素の比率で表示させる */
.iframe_wrapper {
	position:relative;
}

.iframe_wrapper iframe {
	position:absolute;
	top:0;
	right:0;
	width:100%;
	height:100%;
	padding-top:10px;
	padding-bottom:10px;
}

.login {
	border-radius:10px !important;
	box-shadow: .125rem .125rem .25rem black!important;
	background:white !important;
}
/*メニュー*/
.menu {
	background:rgb(14,110,184) !important;
	border-bottom:solid 2px whitesmoke;
}

/*スマホで入力項目選択時にフォーカスさせないようにする*/
@media ( max-width :768px) {
	input:not([type="file"]),textarea,select {
		font-size:16px !important;
	}
	input[type="file"] {
		font-size:10px !important;
	}
}

input[disabled] {
	background: #dcdcdc !important;
}

input[type="submit"],
input[type="button"]{
	cursor:pointer;
}
input[type="image"]{
	cursor:pointer;
	display: inline;
	border:0;
}
input[type="image"]:hover
{
	opacity:0.7;
}
input[type=text],
input[type=number],
select {
	border: 1px solid #A2D0FF;
	background-color:#FFF;
	vertical-align:middle;
	margin:3px;
	padding: 0.3em;
}
input[type=password]{
	border: 1px solid #A2D0FF;
	background-color:#FFF;
	vertical-align:middle;
	margin:3px;
	padding: 0.3em;
}

textarea {
	border: 1px solid #A2D0FF;
	background-color:#FFF;
	ime-mode: active;
	vertical-align:middle;
	margin:3px;
	padding: 0.3em;
}

/*自由検索*/
input[name=s_smpl_input] {
	height:25px;
	font-size:12px;
}
@media (max-width :769px) {
	input[name=s_smpl_input] {
		margin-top:10px;
		margin-bottom:10px;
	}
}

/*入力不可の場合*/
input["disabled"] {
	background:darkgray;
}

label input[type="checkbox"] {
	cursor:pointer;
}

/*ul,li*/
ul,li { 
	list-style: none;
}

/*リンク*/
a {
	cursor:pointer;
	color: #0088cc;
	font-weight:bold;
}
a:link,
a:visited {
	text-decoration: none;
}
/* リンク箇所はホバー時に手カーソルに変更 */
a { 
	cursor: pointer;
	text-decoration:none;
}
a:hover { 
	text-decoration:none;
}
.link { cursor: pointer; } 
.link:hover {
	background : rgb(255,249,176) !important;
}
/* リンクを親エレメント全体に拡張させる */
.stretched-link::after{
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  z-index:1;
  pointer-events:auto;
  content:"";
  background-color:rgba(0,0,0,0)
}

/*position設定*/
.position-relative{
  position:relative!important;
}

.position-absolute{
  position:absolute!important;
}

.display-flex{
  display:inline-flex!important;
}
@media ( min-width :769px) {
	.container.position-center {
		position:absolute;
		top:25%;
		left: 50%;
		transform: translate(-50%, -25%);
	}
}
@media ( max-width :768px) {
	.container.position-center {
		position:absolute;
		top:0;	
		left: 0;
	}
}
:not(.container).position-center {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}


/*page-wrapper設定*/
#page-wrapper {
	background:white;
	padding-bottom:10px;
	height:100%;
}

/*実行ボタンエリア設定*/
#exec_form {
	padding-top:5px;
	padding-bottom:15px;
}

/*テーブル共通*/
table {
	border-collapse: collapse;
	clear: both;
	margin-bottom:5px;
}

table tr:hover {
	background:#fffafa;
}

table tr th
{
	color: white !important;
	text-align:center;
	background-color: #578EDA;
	padding-left:3px;
	padding-right:3px;
	font-size:1rem;
	white-space: nowrap;
    width: 100px;
}

table tr td{
	color: #666;
	text-align:left;
	border-top: solid 2px white;
	border-bottom: solid 2px white;
	padding-left:3px;
	padding-right:3px;
	font-size:0.9rem;
}

/* 横型テーブル*/
table thead{
	border-bottom: solid 3px darkgray;
}

table thead tr th:first-child 
{
	border-top: solid 1px whitesmoke;
}
table thead tr th:not(:first-child):not(:last-child)
{
	border-top: solid 1px whitesmoke;
}
table thead tr th:last-child 
{
	border-top: solid 1px whitesmoke;
}

/* 縦型テーブル*/
table.virtical tbody tr:first-child  th
{
	border-right: solid 1px whitesmoke;
	border-bottom: solid 1px whitesmoke;
}
table.virtical tbody tr:not(:first-child):not(:last-child) th
{
	border-right: solid 1px whitesmoke;
	border-bottom: solid 1px whitesmoke;
}
table.virtical tbody tr:last-child th
{
	border-right: solid 1px whitesmoke;
	border-bottom: solid 1px #578EDA;
}

table.virtical tr td{
	color: #666;
	text-align:left;
	border-top: solid 1px darkgray;
	border-bottom: solid 1px darkgray;
	padding-left:3px;
	padding-right:3px;
}
/*タブレット以下はテーブルのセルを縦表示*/
@media (max-width :768px) {
	table.virtical tr{
		display: block;
	}
	table.virtical th{
		display: block;
		width:100%;
	}
	table.virtical td{
		display: block;
	}
}

/* テーブル内部テーブル*/
tr table thead tr th {
	background:#e4ab9b;
}
tr table tbody tr.even_row td {
	background:#fbf6e6;
}

/*テーブルの偶数行、奇数行*/
.even_row {
	background:#eaf4fc;
}
.odd_row {
	background:white;
}
.stop_row {
	background:lightgray;
}
/*タイトル*/
h1 {
    padding-top:10px;
   padding-bottom:5px;
    font-size:1.5rem;
}

h1#title {
	padding-left: 10px;
	padding-right: 10px;
}

/*iziModal、fullmodのヘッダーにはクラスが反映されないようにする*/
h2:not(.iziModal-header-title) {
	font-size: 1rem;
	line-height: 1em;
	font-weight: bold;
	color: #6c757d;
	text-indent: 0.4em;
	margin-top: 5px;
	margin-bottom: 5px;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #6c757d;
	padding:2px;
}

h4 {
	font-size: 1em;
	line-height: 1.3em;
	font-weight: bold;
	margin-top: 10px;
    margin-bottom: 10px;
    padding:2px;
    background-color: #fced1b;
}

/*共通メッセージエリア*/
.common_msg_area {
	opacity:0;
	width:0;
	height:0;
}

/*エラーメッセージ*/
.error_message {
	color : red;
}

/*エラーのある項目*/
.form_error {
	background-color : pink !important;
	border :solid 1px #dc143c !important;
}  

.search_no_exist_error {
	background-color : pink !important;
	text-align:center;
	padding:5px;
	border-radius:4px;
	color:dimgray;
	margin-left:auto;
	margin-right:auto;
}

.warning {
	color : red;
}

/*日付項目*/
.datepicker:hover {
	cursol:pointer;
}

/* ページネイション*/
.pager {
    overflow: hidden;
}
 
.pager ul {
    list-style: none;
    position: relative;
    left: 50%;
    float: left;
    margin-top: 10px;
}
 
.pager ul li {
    margin: 0 2px;
    position: relative;
    left: -50%;
    float: left;
}

.pager ul li span,
.pager ul li a {
    display: block;
    font-size: 12px;
    border-radius: 3px;
    background: white;
    color: slategray;
    border-color: slategray;
    text-decoration: none;
}
 
.pager ul li a:hover {
    background: #slategray;
    color: #FFF;
}

.pager ul li.active a {
    background: #66cccc !important;
    color: #66cccc;
    border-color: #66cccc !important;
}
 
.pager ul li.active a:hover {
    background: #FFF !important;
    color: #66cccc;
}

/* ステータスカラー*/
.st {
    padding-right: 1em;
    padding-left: 1em;
    max-width: 140px;
    text-align: center;
}

.st.st_no_start {
	background:#dc3545!important;
	color:white !important;
}
.st.st_start {
	background:#f1c40f!important;
	color:white !important;
}
.st.st_end {
	background:#59b9c6!important;
	color:white !important;
}

/*ボタン設定*/
.btn-flat-logo {
  position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF !important;
  background: rgb(14,110,184);
  transition: .4s;
  border: solid 1px;
}

.btn-flat-logo:hover {
  background: #1ec7bb;
}

.btn-round-logo:hover {
  background: #1ec7bb;
}

.btn-round-logo {
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF !important;
  background: rgb(14,110,184);
  border-radius: 50%!important;
  width:65px;
  height:65px;
  text-align:center;
  padding: 1rem!important;
}
.btn-round-logo2:hover {
  background: #1ec7bb;
}

.btn-round-logo2 {
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF !important;
  background: darkgray;
  border-radius: 50%!important;
  width:65px;
  height:65px;
  text-align:center;
  padding: 1rem!important;
}

.btn-flat-logo2 {
  position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF !important;
  background : #3b7960;
  transition: .4s;
  border: solid 1px;
  height:30px;
}

.btn-flat-logo2:hover {
  background: #1ec7bb;
}


.btn-flat-logo3 {
  position: relative;
  display: inline-block;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #FFF !important;
  background:#f4a460;
  transition: .4s;
  border: solid 1px;
  height:30px;
}

/*メニュー*/
.navbar-brand,.navbar-nav .nav-link {
	color:whitesmoke !important;
}
.navbar-nav .nav-link:hover {
	border-left:solid 10px whitesmoke;
}


.title {
	display: inline-block;
	color:#6c757d!important;
}
.data {
	display: inline-block;
	width:100%;
}

/* コントロールパネル用設定*/
.control-panel {
	padding-right: .25rem!important;
	padding-left: .25rem!important;
	padding-top: .25rem!important;
	padding-bottom: .25rem!important;
}
.control-panel .card {
	font-size: 9px;
	text-align:center;
}

@media ( min-width :768px) {
	.control-panel .card {
		line-height: 1px;
	}
}
.control-panel .card:not(.disabled) {
	cursor:pointer;
	background:lightslategray;
	color:white;
}

.control-panel .card:hover:not(.disabled) {
	background:#17a2b8;
	color:white;
}
.card-body {
	padding-top: 1rem !important;
	padding-bottom: 1rem !important;
	padding: 0;
}

.btn-sm {
	font-size:.7em;
}
button {
	cursor:pointer;
}

.alert {
	word-break:break-all;
}

.alert .header {
	border-bottom:dashed 1px;
}

.alert .title {
	font-size: 1rem;
	font-weight:bold;
}

.alert .contents {
	font-size: 0.8em;
}

.del {
	 text-decoration: line-through !important;
}

/* ホバー時に項目拡大*/
.magnify:hover {
	transform:scale(1.02);
	border-color:cornflowerblue;
	z-index:1;
}

/* ラジオボタン用設定*/
.inline-radio {
    display: flex;
  border-radius: 3px;
    overflow: hidden;
  border: 1px solid #b6b6b6;
  margin-bottom:10px;
}

.inline-radio div {
        position: relative;
        flex: 1;
}

.inline-radio div:hover {
	border: 1px solid #A2D0FF;
}

.inline-radio input {
    width: 100%;
        height: 30px;
    opacity: 0;
    cursor:pointer;
}

.inline-radio label {
        position: absolute;
        top: 0; left: 0;
        color: #b6b6b6;
        width: 100%;
        height: 100%;
        background: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        pointer-events: none;
        border-right: 1px solid #b6b6b6;
}

.inline-radio div:last-child label {
        border-right: 0;
}

.inline-radio input:checked + label {
        background: #d1ecf1;
    font-weight: 500;
        color: black;
}

/*チェックボックス用設定*/
/* Base for label styling */
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
  position: absolute;
  left: -9999px;
}
[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
  position: relative;
  padding-left: 1.5em;
  cursor: pointer;
}

/* checkbox aspect */
[type="checkbox"]:not(:checked) + label:before,
[type="checkbox"]:checked + label:before {
  content: '';
  position: absolute;
  left: 0; top: 0;
  width: 1.25em; height: 1.25em;
  border: 2px solid #ccc;
  background: #fff;
  border-radius: 4px;
  box-shadow: inset 0 1px 3px rgba(0,0,0,.1);
}
/* checked mark aspect */
[type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after {
  content: '\2713\0020';
  position: absolute;
  top: .15em; left: .22em;
  font-size: 1.3em;
  line-height: 0.8;
  color: #09ad7e;
  transition: all .2s;
  font-family: 'Lucida Sans Unicode', 'Arial Unicode MS', Arial;
}
/* checked mark aspect changes */
[type="checkbox"]:not(:checked) + label:after {
  opacity: 0;
  transform: scale(0);
}
[type="checkbox"]:checked + label:after {
  opacity: 1;
  transform: scale(1);
}
/* disabled checkbox */
[type="checkbox"]:disabled:not(:checked) + label:before,
[type="checkbox"]:disabled:checked + label:before {
  box-shadow: none;
  border-color: #bbb;
  background-color: #ddd;
}
[type="checkbox"]:disabled:checked + label:after {
  color: #999;
}
[type="checkbox"]:disabled + label {
  color: #aaa;
}
/* accessibility */
[type="checkbox"]:checked:focus + label:before,
[type="checkbox"]:not(:checked):focus + label:before {
  border: 2px dotted blue;
}

/* hover style just for information */
label:hover:before {
  border: 2px solid #4778d9!important;
}

/*タブ設定*/
.nav-tabs .nav-link {
    border: 1px solid white;
    color: white;
    background: lightslategray;
}
.nav-tabs .nav-link.active {
	color:#0c5460;
}

/*データロック中表示*/
.lock_data {
	min-height:40px;
	min-width:60px;
	border: solid 1px #FFE8EC;
	background: #FFFBFB;
	padding: 4px;
	margin-bottom:10px;
	margin-right:10px;
	margin-left:10px;
	border-radius:8px;
	font-size:0.7rem;
}

/*zebrapinで要素固定している場合の表示*/
.Zebra_Pin.nav-tabs {
	border-bottom: none;
}
.Zebra_Pin .nav-item {
	filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.6));
}
.Zebra_Pin.alert {
	filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.6));
}
.Zebra_Pin button {
	filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.6));
}
.sort{
	color:white;
}
.sort:before {
	margin-right:3px;
}
.sort:not(.desc):not(.asc):before {
	content: "\f0dc";/*font-awesomeのソート（標準）マーク*/
	font-family: "Font Awesome 5 Free";
}
.sort.desc:before {
	content: "\f0dd";/*font-awesomeのソート（降順）マーク*/
	font-family: "Font Awesome 5 Free";
	color:yellow;
}
.sort.asc:before {
	content: "\f0de";/*font-awesomeのソート（昇順）マーク*/
	font-family: "Font Awesome 5 Free";
	color:yellow;
}

/* 表示順変更フォーム*/
.sort_update_list_highlight {
    height: 2.3em;
    border: dotted 2px orange !important;
}
#sort_update_list {
	width:100%;
}
#sort_update_list li {
	background:white;
	padding:4px;
	border:solid 1px darkgray;
	border-radius:5px;
	margin:3px;
	font-weight: bold;
}
#sort_update_list li .sort_no {
	font-weight:normal;
	font-size:12px;
}

/*コンテナ*/
@media (min-width: 576px) {
	.container {
	    max-width: 1400px;
	}
}
@media (max-width: 575px) {
	.container {
		padding-right:5px;
	 	padding-left:5px;	
	}

}

.row {
	margin-right:0;
	margin-left:0;
}

.datepicker {
	max-width:120px;
}

.command_area{
	background:lightgray;
	overflow-x:auto;
	white-space:nowrap;
	 -webkit-overflow-scrolling: touch;
	 padding:2px;
 position: -webkit-sticky; /* Safari用 */
    position:sticky; /* 要素をスクロールに応じて固定 */
    top:0; /* 縦スクロールに追従 */
    z-index: 2; /* z-indexで最前面に持ってくる */
}
.command_area .command {
	border:solid 1px white;
	color:white;
	padding:12px;
	height:40px;
	display:inline-block;
}
.command_area .command:hover {
	color:black;
	background:white;
  transition:1s all;
}
i {
	margin-right:5px;
}

*::-webkit-scrollbar{height:5px;width:5px;}/*バーの太さ*/
*::-webkit-scrollbar-track{background:rgba(0,0,0,0.2);}/*バーの背景色*/
*::-webkit-scrollbar-thumb{background:#2cc2e4;}/*バーの色*/
