@charset "UTF-8";
/* Pagination */
.PageContentNav .pagination {
    overflow: hidden;
    display: block;
    float: right;
    margin: 0 -2px 0 0;
}
.PageContentNav .pagination li {
    float: left;
    font-size: 16px;
    margin-left: 9px;
    width:39px;
    text-align: center;
    padding: 0;
    margin-right: 2px;
}
.PageContentNav .pagination li.active {background-color:#fff;}
.PageContentNav .pagination li a, .PageContentNav .pagination li span {
    border:solid 1px #b8b8b8;
    display: block;
    padding: 6px 0;
    background-color:#eee;
	color:#bbb;
    border-radius: 0;
    width:39px;
    margin-left: 0;
	transition-duration:.6s;
}
.PageContentNav .pagination li a:hover, .PageContentNav .pagination li.active span {background-color:#b8b8b8;color:#fff;border:1px solid #c6bcad;}
.PageContentNav>.pagination>li:first-child, .PageContentNav>.pagination>li:last-child {text-indent: 100%;white-space: nowrap;overflow: hidden;}
.PageContentNav>.pagination>li:first-child>a, .PageContentNav>.pagination>li:first-child>span,
.PageContentNav>.pagination>li.disabled:first-child>a:hover, .PageContentNav>.pagination>li.disabled:first-child>span:hover {background:#fff url(../../img/common/left_off.png) center center no-repeat;background-size:40%;overflow:hidden;}
.PageContentNav>.pagination>li:last-child>a, .PageContentNav>.pagination>li:last-child>span,
.PageContentNav>.pagination>li.disabled:last-child>a:hover, .PageContentNav>.pagination>li.disabled:last-child>span:hover {background: #fff url(../../img/common/right_off.png) center center no-repeat;background-size:40%;overflow:hidden;}
.PageContentNav>.pagination>li:first-child>a:hover, .PageContentNav>.pagination>li:first-child>span:hover {background:#b8b8b8 url(../../img/common/left_on.png) center center no-repeat;background-size:40%;overflow:hidden;}
.PageContentNav>.pagination>li:last-child>a:hover, .PageContentNav>.pagination>li:last-child>span:hover {background:#b8b8b8 url(../../img/common/right_on.png) center center no-repeat;background-size:40%;overflow:hidden;}
@media screen and (max-width: 768px) {
    .PageContentNav .pagination {width:100%;float:none;margin:0 auto}
    .PageContentNav .pagination li {font-size:14px;min-width:32px;}
}

.required input[type="text"],.required input[type="tel"],.required input[type="password"],.required input[type="time"],.custom.required{background-color:#EDF4F9;}
.custom{
  display:inline-block;
  *display:inline;
  *zoom:1;
  position:relative;
  border-radius:6px;
  border:1px solid #ccc;
  z-index:0;
}
.normalselect{background-color:#fff;min-width:110px;}
.custom > select{
  width:105%;
  padding:0.4em;
  padding-right:30px;
  box-sizing:border-box;
  z-index:10;
  min-width:120px;
}
.custom > select:focus{outline:none;}
.custom > select.middle{min-width:150px;}
.custom > select.long{min-width:190px;}
.custom:after{
	content: ' ';
    height: 15px;
    position: absolute;
    width:15px;
	display:block;
	background:url(../../img/common/triangle.png) left top no-repeat;
	background-size:13px;
    top: 50%;
	margin-top:-7px;
	right:8px;
	z-index:-2;
}
input.long{width:100%;}
.date:after{
    position:absolute;
	display:block;
	font-family:"Font Awesome 5 Free";
	content:"\f073";
    top:22%;
	right:10px;
	color:#aaa;
	font-size:1.2rem;
	z-index:1;
}
.time:after{
    position:absolute;
    display:block;
    font-family:"Font Awesome 5 Free";
    content:"\f017";
    top:22%;
    right:10px;
    color:#aaa;
    font-size:1.2rem;
    z-index:1;
}
span.req{
    white-space:nowrap;
	color:red;
	padding:0 9px;
	font-size:1.5rem;
}

/* Btn */
.icon_btn a,.icon_btn label{
	display:block;
	position:relative;
	z-index:0;
	height:30px;
	width:30px;
	text-align:center;
	color:#ccc;
	font-size:1.3rem;
}
.icon-on .icon_btn a,.icon-on .icon_btn label{color:#002FAF}

@media screen and (max-width: 960px) {}
@media screen and (max-width: 768px) {
	.scroll_sp{overflow-x:auto;white-space:nowrap;overflow-scrolling:touch;-webkit-overflow-scrolling:touch;}
	.custom > select.long{min-width:inherit;}
}


.movie-conten video{width:100%;}
.movie-url{
	margin-bottom:10px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
#modal-material-url,
#movie-url-video {
    max-height: 430px;
    background: #000;
}
.lr45{width:45%;}
#draglist,#dropbox{
	height:350px;
	overflow-y:scroll;
}
#calendar-roll {
    height: 350px;
}
.roll_list_content{
	padding:.5rem;
	margin-bottom:.25rem;
	background-color:#fff;
}
.roll_list_content video {
    width:60px;
    height: 60px;
}

@media screen and (max-width: 960px) {}
@media screen and (max-width: 768px) {}

/* datepicker */
.datepicker-days th.dow:first-child,.datepicker-days td:first-child {color:#f00;}
.datepicker-days th.dow:last-child,.datepicker-days td:last-child {color:#00f;}
.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover {
  background-color:#337ab7;
  color:#fff;
  text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);
}
.bootstrap-datetimepicker-widget table td span.active,
.bootstrap-datetimepicker-widget table td i.active {
  background-color: #337ab7;
  color:#fff;
  text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);
}

/* schedule */
.fc .fc-dayGridMonth-button.fc-button-primary,
.fc .fc-dayGridMonth-button.fc-button-primary:hover,
.fc .fc-timeGridWeek-button.fc-button-primary,
.fc .fc-timeGridWeek-button.fc-button-primary:hover,
.fc .fc-today-button.fc-button-primary:disabled{
    background-color: #ccc;
    background-color: var(--fc-button-bg-color,#ccc);
    border-color: #ccc;
    border-color: var(--fc-button-border-color,#ccc);
}
.fc .fc-button-primary:not(:disabled).fc-button-active, .fc .fc-button-primary:not(:disabled):active,
.fc .fc-prev-button.fc-button-primary,.fc .fc-next-button.fc-button-primary,
.fc .fc-today-button.fc-button-primary{
    background-color: #3788d8;
    background-color: var(--fc-button-active-bg-color,#3788d8);
    border-color: #3788d8;
    border-color: var(--fc-button-active-border-color,#3788d8);
}
#calendar-roll .fc-day-today {
    background-color: #FFF !important;
}
.fc .fc-dayGridMonth-button.fc-button-primary:hover{opacity:.8}
.fc .fc-button-primary:not(:disabled).fc-button-active{opacity:1}
.fc-day-sun{color:red; background-color:#FFF5F5}
.fc-day-sat{color:blue; background-color:#EEF7FF}

.list-group-item{padding:.75rem;}

/*.time-table-empty-roll {*/
/*    background-color: #fdd735;*/
/*    color: #616161;*/
/*    border-color: #fdd735;*/
/*}*/

/*.time-table-empty-roll .fc-event-main {color: #616161;}*/

.timetable-color .simpleColorContainer {
    margin-left: auto;
}

/*- ページ別設定 -------------------------*/
/* Login */
.Login{margin:50px auto;width:485px;}
.LoginIn{background-color:#fff;text-align:center;padding:35px;border-radius:5px;margin-bottom:30px;}
.LoginIn .logo img{width:100%;height:auto}
.Login dl{margin:40px auto 0 auto;width:345px;}
.Login dt,.Login dd{text-align:left;}
.Login dt{font-weight:bold; padding-left:5px;}
.Login dt i{margin-right:5px; opacity:.5}
.Login dd{margin-bottom:35px}
.Login dd .custom{background-color:#EDF4F9;}
.normalselect{min-width:inherit;width:100%;}
.Login .required{display:block}
.Login .required input{width:100%;}
.Login .LoginBtnGroup{overflow:hidden;padding-bottom:10px; text-align:center;}
.Login .LoginBtnGroup .btn{margin:0 auto; float:none}
@media screen and (max-width: 768px) {
.Login{margin:20px auto;width:90%;}
.LoginIn{padding:15px;}
.Login dl{ width:100%}
}

/* schedule */
.switchinglist{text-align:center}
.switching{background-color:#eee; color:#bbb; border:none; padding:6px 11px;}
.switching.active{background-color:#b8b8b8; color:#000;}

.calendar-head{position:relative; width:100%;}
.calendar-head .calendar-minLink{font-size:.8rem; top:-23px;}
.calendar-month{position:absolute; bottom:0; font-size:1.5rem;}
.calendar-month a{padding:5px 10px;}
.month-right{right:0}
.month-left{left:0;}
.calendar{table-layout:fixed}
.calendar td{text-align:center;font-size:.9rem; padding:.6rem 0 0}
.calendar thead{font-weight:bold}
.calendar thead tr td:nth-of-type(1),
.calendar tbody tr td:nth-child(1){background:#fff0f0;color:firebrick}
.calendar thead tr td:nth-of-type(7),
.calendar tbody tr td:nth-child(7){background:#f4fafe; color:darkblue}
.calendar tbody td{height:90px; position:relative}

.day-events,.day-events a{width:100%; color:#fff;}
.day-events a{display:block}

.table-hover tbody > tr.hover > td,
.table-hover tbody > tr:hover > td { background-color:#f2f2f2}

#dropbox table.table .roll_list_content {
    position: absolute;
    left: 0;
    right: 0;
    margin-left: 12px;
    margin-right: 12px;
    z-index: 1;
}

#draglist table.table .roll_list_content {

}

#dropbox table.table th {
    width: 10%;
    padding-top: 0px;
    padding-bottom: 1.75rem;
}

#draglist table.table th {

}

/* capture */
.capture{max-height:600px; overflow-y:scroll;}
.capture .capture-box{border-bottom:solid 1px #ccc; padding-bottom:1rem;}
.capture .capture-header{position:relative; padding-top:.3rem;}
.capture-btn{position:absolute; right:.3rem; top:-.3rem; font-size:1.5rem; cursor:pointer;}
.capture-modal{max-height:300px; overflow-y:scroll;}
@media screen and (max-width: 768px) {
.capture{margin-bottom:1rem}
}

/* resource_log */
.resource .resource-box{border-bottom:solid 1px #ccc; padding-bottom:1rem;}
.resource .resource-header{position:relative; padding-top:.3rem;}
.resource-btn{cursor:pointer;}
.resource-modal{max-height:300px; overflow-y:scroll;}
@media screen and (max-width: 768px) {
.resource{margin-bottom:1rem}
}
.table-sticky thead th{
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1;
    background: #FFFFFF;
    border-top:#FFFFFF;
}

/*terminal*/
.terminaltable{max-height:180px; overflow-y:scroll; margin-bottom:1rem;}
.terminaltable .table td,.terminaltable .table th{padding:.4rem;}
.label-keep-all {word-break: keep-all;}
.label-word-break {word-break: break-all;}



/*=======SBCr added=======*/
/* scroll_bar */
::-webkit-scrollbar {
    width: 10px;
}
::-webkit-scrollbar-track {
  border-radius: 10px;
  /*box-shadow: inset 0 0 5px rgba(0, 0, 0, .1);*/
}
::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 50, .5);
  border-radius: 10px;
  box-shadow:0 0 0 1px rgba(255, 255, 255, .3);
}

/* color_set */
:root{
  --mainColor1: #120096;
  --mainColor2: #7196ff;
  --subColor1: #f1f5ff;
  --subColor2: #f3f4f6;
  --alertColor1: #d6175a;
  --alertColor2: #f94081;
  --monoTone1: #6c6c6c;
  --monoTone2: #c0c0c0;
  --monoTone3: #dcdcdc;
  --monoTone4: #fcfcfc;
}
@media (prefers-color-scheme: dark) {
  :root {

  }
}

/* icon */
@font-face {
  font-family: 'icomoon';
  src:  url('fonts/icomoon.eot?s20p0f');
  src:  url('fonts/icomoon.eot?s20p0f#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?s20p0f') format('truetype'),
    url('fonts/icomoon.woff?s20p0f') format('woff'),
    url('fonts/icomoon.svg?s20p0f#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.fa, .fas,
[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.sort i {
  content: "\f0dc";
  font-family: "Font Awesome 5 Free" !important;
  font-weight: 900;
}
.icon-icon_delete:before {
  content: "\e900";
  color: #120096;
}
.icon-icon_edit:before {
  content: "\e901";
  color: #120096;
}
.icon-icon_logout:before {
  content: "\e902";
  color: #120096;
}
.icon-icon_movie:before {
  content: "\e903";
  color: #120096;
}

.fa-film:before {
  content: "\e903";
  color: #120096;
}
.btn-group .fa-film:before {
  content: "\e903";
  color: inherit;
}

.icon-icon_plus:before {
  content: "\e904";
  color: #120096;
}
.icon-icon_search:before {
  content: "\e905";
  color: #120096;
}
.fa-search:before{
  content: "\e905";
}
.icon-menu_device:before {
  content: "\e906";
  color: #ff860d;
}
.icon-menu_media:before {
  content: "\e907";
  color: #1099ff;
}
.icon-menu_report:before {
  content: "\e908";
  color: #e0365b;
}
.icon-menu_setting:before {
  content: "\e909";
  color: #41a592;
}
.icon-menu_surveillance:before {
  content: "\e90a";
  color: #aa5aff;
}
.fa-plus:before {
  content: "\e904";
}
.fa-file-csv:before {
    content: "\e910";
}
.fa-file-csv:before {
    content: "\e910";
}
.fa-desktop:before {
    content: "\e90f";
}
.fa-store:before {
    content: "\e90c";
}
.fa-building:before {
    content: "\e90d";
}
.fa-calendar-alt:before {
    content: "\e90b";
}
.fa-list:before {
    content: "\e900";
}
.fa-copy:before {
    content: "\e90e";
}
.fa-times:before {
    content: "\e914";
}
.fa-upload:before {
    content: "\e915";
}
.fa-check:before {
    content: "\e911";
}
.fa-chevron-left:before {
    content: "\e913";
}
.fa-chevron-right:before {
    content: "\e912";
}

/* adjust */
body{
  background-image: none;
  background-color: var(--subColor2);
}
#header{
  box-shadow: none;
  border-bottom: 1px solid var(--monoTone3);
}

/* nav */
#headerNav ul{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
}
#headerNav {
    left: 180px;
    width: calc(100% - 320px);
    max-width: 800px;
    top: 0;
    height: 110px;
}
#logo::after {
    content: "";
    width: 1px;
    height: 112px;
    background-color: var(--monoTone3);
    position: absolute;
    top: -15px;
    right: -15px;
}
#headerNav ul > li {
    float: none;
    width: 20%;
    height: 110px;
    line-height: 110px;
}
#headerNav ul > li a {
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: none;
    color: var(--monoTone1);
}
#headerNav ul li.menu__multi ul.menu__second-level {
    top: 110px;
}
#headerNav ul li.menu__multi ul.menu__second-level li {
    background-color: var(--mainColor1);
    width: 100%;
}
#headerNav ul li.menu__multi ul.menu__second-level li a {
    transition: all .2s linear;
}
#headerNav ul li.menu__multi ul.menu__second-level li a:hover {
    background-color: var(--mainColor2);
}
#headerNav ul li.nav01 > a::before {
    content: "";
    width: 48px;
    height: 48px;
    background: url(../../img/common/icon/menu_media.svg) no-repeat center center;
    position: absolute;
    top: 10px;
}
#headerNav ul li.nav02 > a::before {
    content: "";
    width: 48px;
    height: 48px;
    background: url(../../img/common/icon/menu_device.svg) no-repeat center center;
    position: absolute;
    top: 10px;
}
#headerNav ul li.nav03 > a::before {
    content: "";
    width: 48px;
    height: 48px;
    background: url(../../img/common/icon/menu_surveillance.svg) no-repeat center center;
    position: absolute;
    top: 10px;
}
#headerNav ul li.nav04 > a::before {
    content: "";
    width: 48px;
    height: 48px;
    background: url(../../img/common/icon/menu_report.svg) no-repeat center center;
    position: absolute;
    top: 10px;
}
#headerNav ul li.nav05 > a::before {
    content: "";
    width: 48px;
    height: 48px;
    background: url(../../img/common/icon/menu_setting.svg) no-repeat center center;
    position: absolute;
    top: 10px;
}
#headerNav ul li a.active::after {
    content: "";
    width: 100%;
    height: 4px;
    background-color: var(--mainColor1);
    position: absolute;
    left: 0;
    bottom: 0;
}

#headerIn .LogOut{
    width: 133px;
    border-color: var(--mainColor1);
    background-color: transparent;
    background-image: none;
}
#headerIn .LogOut a{
  padding-left: 16px;
    color: var(--mainColor1);
    position: relative;   
}
#headerIn .LogOut a:before{
  content: "";
  width: 18.5px;
  height: 16px;
  position: absolute;
  left: -4px;
  top: 1px;
  background: url(../../img/common/icon/icon_logout.svg) no-repeat center center;
  background-size: 100%;
}

@media screen and (max-width: 480px){
  #logo::after {
      height: 92px;
  }
}

#headerIn .StoreName {
  background-color: var(--mainColor1);
  border-radius: 20px;
  padding: .1rem .4rem;
  font-size: .9rem;
}
#headerIn .StoreName .dropdown-menu.show {
    right: 0 !important;
    left: auto !important;
}

@media screen and (max-width: 768px){
  .slicknav_btn {
    background-color: var(--mainColor1);
  }
  #headerIn .LogOut {
    left: auto;
    right: 146px;
  }
}
@media screen and (max-width: 480px){
  #headerIn .StoreName {
      background-color: var(--mainColor1);
      left: auto;
      bottom: 13px;
      width: auto;
      margin-right: 80px;
  }
  #headerIn .StoreName a {
    color: #fff;
  }
  #headerIn .LogOut {
    right: 80px;
  }
}

/* page */
.PageContent{
  border-radius: 8px;
  box-shadow: 0 15px 28px rgba(222,222,222,.25);
}
.PageContent h2 {
    color: #000;
    font-size: 1.15rem;
    padding: 20px;
    margin: -24px -24px 20px;
    border: none;
    border-bottom: 1px solid var(--monoTone3);
    position: relative;
    background-color: #fff;
    border-radius: 8px 8px 0 0;
}
.cp_ipcheck input[type="checkbox"]:checked:after {
    background: var(--mainColor1);
    border: 2px solid var(--mainColor1);
}
.PageContentNav .pagination li a, .PageContentNav .pagination li span {
    border-radius: 8px;
    background-color: #fff;
    color: #000;
}
.PageContentNav .pagination li a:hover, .PageContentNav .pagination li.active span {
    background-color: var(--mainColor1);
    color: #fff;
    border: 1px solid var(--mainColor1);
}
.PageContentNav>.pagination>li:first-child>a:hover, .PageContentNav>.pagination>li:first-child>span:hover {background:var(--mainColor1) url(../../img/common/left_on.png) center center no-repeat;background-size:40%;overflow:hidden;}
.PageContentNav>.pagination>li:last-child>a:hover, .PageContentNav>.pagination>li:last-child>span:hover {background:var(--mainColor1) url(../../img/common/right_on.png) center center no-repeat;background-size:40%;overflow:hidden;}
.tablesorter-default td {
    background-color: #fff;
    border-bottom: #ccc 1px solid;
    vertical-align: top;
}
.tablesorter-default td {
    overflow-wrap: normal;
    word-break: normal;
}
input[type="text"], input[type="tel"], input[type="email"], input[type="password"], input[type="time"] {
    height: 40px;
    line-height: 40px;
}
.select2-container .select2-selection--multiple {
    min-height: 40px;
}
.btn-primary{
    min-height: 40px;   
}
.custom-control-input:checked~.custom-control-label::before {
    background-color: #0335ad;
    box-shadow: 0 0 0 2px white inset;
}

@media screen and (max-width: 768px){
  .PageContent h2 {
    margin: -13px -13px 20px;
  }
}
.card-body{
  font-size: .9rem;
  white-space: normal;
  overflow-wrap: normal;
    word-break: normal;
}

.underline a {
  color: #0335ad !important;
}

.underline a:hover {
  text-decoration: underline !important;
}

.ann-btn-back {
  background-color:#fff;
  text-align:center;
} 

.ann-list-line {
  border-top:1px solid #533f03;
}

.ann-date {
  width:150px;
}

.ann-title {
  display:block;
  width:100%;
}