body{
  padding-top: 52px;
}

main{
  margin: 1.5rem 1.5rem;
}

main .container{
	margin: 1.5rem 0.1rem
}


h1 {
  font-size: 15pt
}

/*card*/
.card {
  border: 1px solid rgba(210, 205, 176, 0.3);
  background-color: white;
  /*box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02);*/
  box-shadow: none;
  color: #4a4a4a;
  max-width: 100%;
  position: relative;
}

.card-header {
	background-color: #f5f4ee;
	align-items: stretch;
	box-shadow: none;
	display: flex;
}

.card-header-title{
	font-weight: normal;
}

.card-content{
	padding: 1.5rem 0.8rem;
	.column;
	&:not(:last-child);
	padding-bottom: 1.25rem;
}

.card-content-login{
	padding: 0.5rem 1.5rem;
	.column;
	&:not(:last-child);
  padding-bottom: 1.25rem;
  background-color: #f5f4ee;
}

.card-content-mlogin{
  padding: 1.5rem 5.0rem;
	.column;
	&:not(:last-child);
  padding-bottom: 1.25rem;
}

/*card-content 塗りつぶし*/
.card-content-g{
	padding: 0.3rem 0.8rem;
	.column;
	&:not(:last-child);
  padding-bottom: 0.6rem;
  background-color: #f5f4ee;
}

/*card-content 塗りつぶし 清掃画面用*/
.card-content-seiso{
	padding: 1.5rem 0.8rem;
  .column;
	&:not(:last-child);
	padding-bottom: 1.25rem;
  background-color: #CCFFCC;
  color: green;
}

/*card-content 特記事項画面用*/
.card-content-sprep{
	padding: 1.5rem 0.8rem;
  .column;
	&:not(:last-child);
  padding-bottom: 1.25rem;
}

/*card-content タイトル用*/
.card-content-title{
	padding: 1.5rem 0.1rem;
	.column;
	&:not(:last-child);
  padding-bottom: 0.1rem;
  color: #808080;
}

/*card-content インポート説明用画面*/
.card-content-manual{
	padding: 1.5rem 0.8rem;
  .column;
	&:not(:last-child);
  padding-bottom: 1.25rem;
  font-weight: bold;
  background-color: #CCFFCC;
}

/*box*/
.box {
  border: 1px solid rgba(210, 205, 176, 0.3);
  background-color: white;
  border-radius: 6px;
  box-shadow: none;
  color: #4a4a4a;
  display: block;
  padding: 1.25rem;
}

/* select */
select.x-short{
	width: 50px
}

select.m-short{
	width: 100px
}

select.short{
	width: 120px
}

select.medium{
	width: 200px
}

select.long{
	width: 320px
}

select.datepicker{
	width: 150px
}

select.table-m{
  width: 150px;
}

/*
select.table-s{
  width: 100px;
  font-size: 14px;
}
*/

select.input{
  font-size:16px;
  padding: 3px 10px;
  height: 30px;
}

select.sform{
  font-size:15px;
  padding: 3px 10px;
  height: 30px;
}

select.sfrmodr{
  font-size:15px;
  padding: 3px 10px;
  height: 30px;
  width: 170px;
}

/* select option:first-child { color: #808080; } */
/* select option:first-child { color: gray; } */
/* select.placefolder{ */
   /* color: gray; */
/* } */

label.size15{
  font-size:15px !important;
}

label.size16{
  font-size:16px !important;
}


/* underline */
.underline {
  /*border-bottom: solid 3px #87CEFA;*/
  border-bottom: solid 3px #00d1b2;
}

/* 緑色 */
div.subtitleg{
  background-color: #CCFFCC;
  padding: 0.5rem;
  font-size: 1.0rem;
  color: green;
  margin-bottom: 15px !important;
}

/* 赤色 */
div.subtitler{
  background-color: #F78181;
  padding: 0.5rem;
  font-size: 1.0rem;
  color: #fff;
  margin-bottom: 15px !important;
}

/* 濃緑色 */
div.subtitledg{
  background-color: green;
  padding: 0.5rem;
  font-size: 1.0rem;
  color: #fff;
  margin-bottom: 15px !important;
}

/* 追加ボタン */
.button.is-lightbule {
  background-color: #5faee3;
  border-color: transparent;
  color: #fff;
}

.button.is-lightbule:hover, .button.is-lightbule.is-hovered {
  background-color: #48A2DE;
  border-color: transparent;
  color: #fff;
}

.button.is-lightgray {
  background-color: #dcdcdc;
  border-color: transparent;
  color: rgba(0, 0, 0, 0.7);
}

.button.is-lightgray:hover, .button.is-lightgray.is-hovered {
  background-color: #d3d3d3;
  border-color: transparent;
  color: rgba(0, 0, 0, 0.7);
}

.button.is-gray {
  background-color: #a9a9a9;
  border-color: transparent;
  color: #fff;
}

.button.is-gray:hover, .button.is-gray.is-hovered {
  background-color: #9B9B9B;
  border-color: transparent;
  color: #fff;
}

/* is-white 単位用 ホバーに色はつけない */
.button.is-white:hover, .button.is-white.is-hovered {
  background-color: white;
  border-color: transparent;
}

/* ボタン内テキスト左寄せ */
button.is-left{
  display: block !important; 
  text-align: left;
}

button.is-fleft{
  display: block !important; 
  float: left;
}

button.is-right{
  display: block !important; 
  text-align: right;
}

button.unit{
  padding-left: 0px;
}

/* hr */
hr {
  height: 1.0px;
  margin: 1.0rem 0
}

hr.gray {
  height: 1.0px;
  margin: 1.0rem 0;
  background-color: #808080;
}

hr.lightgray {
  height: 1.0px;
  margin: 1.0rem 0;
  background-color: #dcdcdc;
}

.z-index-zero {
  /*top以外にあるnavbar用 0にしないとTOPと重なる*/
  z-index: 0; 
}

/* div */
div.head{
  margin: 0.3rem 0.5rem;
}

div.center{
  text-align:center;
}

div.right{
  text-align:right;
}

div.fleft{
  display: block !important; 
  float: left;
}

div.fcenter{
  display: block !important; 
  float: center;
}

ul.right{
  text-align:right;
}


/*
p.space{
  padding: 4.0px;
}
*/

/* button */
button.fix-size{
  width: 150px;
  height: 50px;
}

/* button */
button.fix-size300{
  width: 305px;
  height: 50px;
}

/* input */
input.w100{
  width: 100px;
}

input.w200{
  width: 200px;
}

input.w300{
  width: 300px;
}

input.w320{
  width: 320px;
}

input.is-fleft{
  display: block !important; 
  float: left;
}

input.table-m{
  height: 30px;
}

input.table-s{
  height: 30px;
  width: 200px;
}


/* p */
/* タブレット以上のサイズでは非表示にする */
/* 画面width = 679以下なら適用 */
@media screen and (max-width: 679px) {
  p.space{
    padding: 4.0px;
  }
}
/* 画面width = 680以上なら適用 */
@media screen and (min-width: 680px) {
  p.space{
    display: none;
  }
}
p.space1{
  padding: 1.0px;
}

p.space2{
  padding: 2.0px;
}

p.space3{
  padding: 3.0px;
}

p.space4{
  padding: 4.0px;
}

p.space5{
  padding: 5.0px;
}

p.space6{
  padding: 6.0px;
}

p.space9{
  padding: 9.0px;
}


p.space10{
  padding: 10.0px;
}

p.space11{
  padding: 11.0px;
}

p.left{
  text-align: left;
}

p.fleft{
  float: left;
}

p.right{
  text-align: right;
}

/*  ボタン型左矢印 */
.bfarrow{
  position: relative;
  display:inline-block;
  margin-left: 20px;
  padding: 0 10px 0 5px;
  /* background: #666; */
  background: #ababab;
  border: none;
  /* border-top-right-radius: 3px; */
  /* border-bottom-right-radius: 3px; */
  font-size: 14px;
  color: #fff;
  line-height: 28px;
}
.bfarrow::before{
  content: "";
  position: absolute;
  top: 0;
  left: -14px;
  /* border-right: 14px solid #666; */
  border-right: 14px solid #ababab;
  border-top: 14px solid transparent;
  border-bottom: 14px solid transparent;
  transform-origin: right top;
  transform: scaleX(.7);
}

/*  ボタン型右矢印 */
.afarrow{
  position: relative;
  display:inline-block;
  margin-right: 20px;
  padding: 0 10px 0 5px;
  background: #666;
  border: none;
  /* border-top-right-radius: 3px; */
  /* border-bottom-right-radius: 3px; */
  font-size: 14px;
  color: #fff;
  line-height: 28px;
}

.afarrow::after{
  content: "";
  position: absolute;
  top: 0;
  right: 0px;
  border-right: 14px solid #666;
  border-top: 14px solid transparent;
  border-bottom: 14px solid transparent;
  transform-origin: right top;
  transform: scaleX(-0.7);
}

/* 必須エラー用のアスタリスク */
span.required:before {
  font-size: 14pt;
  font-weight: bold;
  color: #FF3399;
  content:"*"
}
/* 必須エラー用のアスタリスク※後ろ */
span.required-bk:after {
	font-weight: bold;
	color: #FF3399;
	content:"*"
  }


/* 色 */
span.is-danger{
  color: hsl(348, 100%, 61%);
}

/* スマホ用ログイン */
.login{
  width:20.0rem;
  margin:3.0rem auto 0;
}

.login .card .card-content{
  padding:1.5rem;
  background-color: #f5f4ee;  
}

.login .card-header{
  text-align: center;
}

.login p.card-header-title{
  display: block;
  color: gray;
}

a.forget{
  text-align: center;
  color: gray;
}

/* 管理者画面用ログイン */
.mlogin-base{
  display:flex;
  justify-content: center;
}

.mlogin{
  display: flex;
  /* width:30.0rem; */
  margin:4.0rem auto 0;
  /* width:25%; */
}

.mlogin .card .card-content{
  padding:1.5rem;
  background-color: #fff;
}

.mlogin .card-header{
  text-align: center;
}

.mlogin p.card-header-title{
  display: block;
  color: #fff;
  background-color: green; 
}

.mlogin .card .card-content{
  padding:1.5rem;
  background-color: #fff;
}


/*textarea*/
textarea.regular{
  min-height:70px !important;
}


label.content{
  /* margin-left:0px !important; */
  margin-right:0px !important;
}

label.content.chkbox{
  margin-left:3px !important;
  padding-right:0px !important;
  padding-left:30px !important;
}

div.field input {
  display: block;
  float: left;
}
 
div.field label {
  display: block !important;
  overflow: hidden !important; /* モダンブラウザ用 */
  /* padding: 0 30px !important; */
  padding-top: 0px !important;  
  padding-left: 30px !important;  
  padding-right: 0px !important;  
  zoom: 1; /* IE6?p */
}


/*table*/
table.lst th{
  background-color: #f5f5f5;
  vertical-align: middle !important;
}


table.lst td{
  vertical-align: middle !important;
}

table.manual{
  /* 固定 */
  table-layout: fixed !important;
}

table.manual th{
  background-color: #f5f5f5;
}

table.manual td{
  vertical-align: middle !important;
}

table.detail th{
  background-color: #fff !important;
  vertical-align: middle !important;
  color: green;
}

table.detail td{
  vertical-align: middle !important;
}


th.is-center{
  text-align: center !important;
}

th.is-right{
  text-align: right !important;
}

td.is-center{
  text-align: center !important;
}

td.is-right{
  text-align: right !important;
}

table.form th{
  color:green;
  background-color: white;
  /* border-left-color: blue; */
  border-left: 3px solid green !important;
  vertical-align: middle !important;
}

/* 必須エラー用のアスタリスク */
th.required:after {
  font-size: 14pt;
  font-weight: bold;
  color: #FF3399;
  content: "\0020*"
}

/*検索画面(modal)用*/
table.searchform input{
   display: block !important;
}
table.searchform th{
  font-size: 11pt;
}
table.searchform td{
  vertical-align: middle !important;
}


/*modal 管理画面用*/
div .modal-card-head.manage{
  background-color: green;
}

div .modal-card-title.manage{
  color: #fff;
}

div .modal-content.manage{
  background-color: #fff;
  padding-top: 20px;
  padding-bottom: 20px;
}

div .modal-card-foot.manage{
  background-color: #fff;
}

/* modal copy画面 */
div.modal-card.copy{
  width: 500px; 
}


/*--------------------------- 西野追加分 ---------------------------*/

#topmenu-wrap .card{
  box-shadow: 0 0.5em 0.2em -0.25em rgba(10, 10, 10, 0.2), 0 0 0 1px rgba(10, 10, 10, 0.02);
  border-radius: 5px;
  margin-right: 15px;
}

#topmenu-wrap .card:hover{
	background: rgba(72,199,116,0.2);
}

#topmenu-wrap .card:active{
	box-shadow:none;
}

#topmenu-wrap .card:last-child{margin-right:0px;}

#topmenu-wrap .col-topmenu{
  background-color: #f5f5f5;
  /* margin: 2rem 0; */
  padding: 1.2rem 1rem;

  margin: 0 0;
  margin-top:0;
  margin-bottom:2rem;
}

#topmenu-wrap .columns{display: flex;}

#topmenu-wrap .columns .column{padding: 0; max-width: 310px;}

#topmenu-wrap #diary.columns .column{}

.link {
    position: relative;
}
.link a {
    position: absolute;
    top: 0;
    left: 0;
    height:100%;
    width: 100%;
}

/* shimamine add. */
#topmenu-wrap .col-topmenu-head{
  background-color: #f5f5f5;
  margin: 0 0;
  margin-top:2rem;
  margin-bottom:0;
  padding: 1.2rem 1rem;
  padding-bottom:0;

  font-size:25px;
}

.media-detail
{
  /* もともと16px; */
  font-size:14px;
}

.card-header-title-opt
{
  padding-left:13px;
  padding-right:1px;
}

.title-no
{
  position:absolute !important;
  right:10px;
  top:22px;
  font-size:30pt !important;
}

/* 日誌一覧 提出済 */
.completion
{
   font-weight: bold;
   color: hsl(348, 100%, 61%);
}

/* 消したい要素を消すクラス */
.d-none{
  display: none!important;
}

.trash-color {
  color: gray !important;  
}


/*--------------↓山田追加分--------------------*/

/*枠線を実践に変更*/
input:not(.select2-search__field) {
  border: 1px solid #000 !important;
}
/* チェックボックス（有効な場合のみ枠線を黒） */
input[type="checkbox"].is-checkradio:not([disabled]) {
  border: 1px solid #000 !important;
}

/* チェックボックスのラベル::beforeに枠線（有効時のみ） */
.is-checkradio[type="checkbox"]:not([disabled]) + label::before {
  border: 1px solid #000 !important;
}
.is-checkradio[type=checkbox]+label::after,
.is-checkradio[type=checkbox]+label:after {
  border: 1px solid #000 !important;
  border-top: 0 !important;
  border-left: 0 !important;
  box-sizing: border-box;
  transform: translateY(0) rotate(45deg);
}
/* ラジオボタン（有効な場合のみ枠線） */
.is-checkradio[type="radio"]:not([disabled]) + label::before {
  border: 1px solid #000 !important;

}

/* セレクトボックス（有効時のみ） */
select:not([disabled]) {
  border: 1px solid #000 !important;
}
.select2-selection:not([disabled]) {
  border: 1px solid #000 !important;
}


/* フォーカス・ホバー時に 枠線を消して、影を追加 */
select:not([disabled]):focus,
select:not([disabled]):hover,
.select2-selection:not([disabled]):focus,
.select2-selection:not([disabled]):active,
input[type="checkbox"].is-checkradio:not([disabled]):focus,
input[type="checkbox"].is-checkradio:not([disabled]):active,
input:not(.select2-search__field):focus,
input:not(.select2-search__field):active{
  border: 1px solid #3273dc !important; /* または別の色 */
  box-shadow: 0 0 0 .300em rgba(50, 115, 220, .25);
}

.select2-selection:focus-visible {
  outline: none !important;
  border: 1px solid #3273dc !important; /* または別の色 */
  box-shadow: 0 0 0 .300em rgba(50, 115, 220, .25);
}

/* チェック状態のラベル::after（有効時のみ） */
.is-checkradio[type="checkbox"].is-success:checked:not([disabled]) + label::after {
  border-color: #000 !important;
}

/* ホバー時の枠線（有効時のみ） */
.is-checkradio[type="checkbox"].is-success:hover:not([disabled]) + label::before {
  border-color: #000 !important;
}
/* フォーカス（Tabキーで移動したとき）影を追加 */
.is-checkradio:focus:not([disabled]) + label::before,
.is-checkradio:focus-visible:not([disabled]) + label::before {
  border-color: #000 !important;
  box-shadow: 0 0 0 .300em rgba(50, 115, 220, .25);
}

/* フォーカス（Tabキーで移動したとき）影を追加 */
.is-checkradio:focus:not([disabled]) + label::before,
.is-checkradio:focus-visible:not([disabled]) + label::before {
  border-color: #000 !important;
  box-shadow: 0 0 0 .300em rgba(50, 115, 220, .25);
}
/* is-small クラスが付いたチェックボックスのみ影を小さく */
.is-checkradio.is-small:focus:not([disabled]) + label::before,
.is-checkradio.is-small:focus-visible:not([disabled]) + label::before {
  box-shadow: 0 0 0 .100em rgba(50, 115, 220, .25) !important;
}