/* スタイル上書き */
.text-dark {
    color:#212529!important;
}

/* フォント */
@font-face {
  font-family: 'Noto Sans CJK Japanese';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/NotoSansJP/NotoSansCJKjp-Light.woff2') format('woff2'),
     url('../fonts/NotoSansJP/NotoSansCJKjp-Light.woff') format('woff'),
     url('../fonts/NotoSansJP/NotoSansCJKjp-Light.ttf')  format('truetype'),
       url('../fonts/NotoSansJP/NotoSansCJKjp-Light.eot') format('embedded-opentype');
}
@font-face {
  font-family: 'Noto Sans CJK Japanese';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/NotoSansJP/NotoSansCJKjp-Medium.woff2') format('woff2'),
     url('../fonts/NotoSansJP/NotoSansCJKjp-Medium.woff') format('woff'),
     url('../fonts/NotoSansJP/NotoSansCJKjp-Medium.ttf')  format('truetype'),
       url('../fonts/NotoSansJP/NotoSansCJKjp-Medium.eot') format('embedded-opentype');
}
@font-face {
  font-family: 'Noto Sans CJK Japanese';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/NotoSansJP/NotoSansCJKjp-Bold.woff2') format('woff2'),
     url('../fonts/NotoSansJP/NotoSansCJKjp-Bold.woff') format('woff'),
     url('../fonts/NotoSansJP/NotoSansCJKjp-Bold.ttf')  format('truetype'),
       url('../fonts/NotoSansJP/NotoSansCJKjp-Bold.eot') format('embedded-opentype');
}

/* サイネージスタイル */
body {
  font: 14px 'Noto Sans CJK Japanese', 'Hiragino Kaku Gothic ProN', Arial, sans-serif;
  font-weight: 300;
  background-color: #212529;
  /* cursor: url(../img/mouse.png), default; */
}

/* サイドエリア */
#info {
  background-color: #212529;
  padding:50px;
  height: 100vh;
}

#info #head{
  height:80px;
  margin-bottom:50px;
}

#info #boad{
  height:850px;
}

#info #boad .line{
  border-top:solid 1px #111111;
}

#info .title {
  font-size:26px;
}

#info .main_text{
  font-size:72px;
  font-weight: 500;
}

#info .sub_text{
  font-size:52px;
  font-weight: 500;
}

#info .unit_text{
  font-size:32px;
  font-weight: 500;
}

#info .container_text{
  color:rgb(253, 253, 253);
  position: relative;
  box-shadow: 2px 2px 2px rgba(0,0,0,0.4);
}

#info .container_name{
  font-size:20px;
  font-weight:500;
  overflow: hidden;
  padding:14px 20px;
  white-space: nowrap;
	-o-text-overflow: ellipsis; /* Opera9,10対応 */
  background: linear-gradient(110deg, #000000, #000000 80%, #ffffff00 90%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: rgba(255, 255, 255, 0);
}

#info .container_type1{
  background:#fff8f2;
  border:solid 3px #f07a02;
}

#info .container_type2{
  background:#fafcff;
  border:solid 3px #2973d4;
}

#info .container_type3{
  background:#fafcff;
  border:solid 3px #757575;
}

#info .container_type1.complet{
  background:#f07a02;
  border:solid 3px #f07a02;
}

#info .container_type2.complet{
  background:#2973d4;
  border:solid 3px #2973d4;
}

#info .container_type3.complet{
  background:#757575;
  border:solid 3px #757575;
}

#info .complet .container_name{
	-o-text-overflow: ellipsis; /* Opera9,10対応 */
  background: linear-gradient(110deg, #ffffff, #ffffff 80%, #ffffff00 90%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: rgba(255, 255, 255, 0);
}

.complet_icon{
  position:absolute;
  font-size:20px;
  font-weight:300;
  /* background:#ffffff; */
  color:#ffffff;
  top:13px;
  right:20px;
  /* padding:8px 14px; */
  /* border-radius:50%; */
  /* box-shadow: 2px 2px 2px rgba(0,0,0,0.4); */
}

.container_update{
  font-size:12px;
}


/* bootstrap4調整用 */
.no-gutters {
  margin:0;
  padding:0;
}

/*************************************************************/
/* Vue.js                                                    */
/*************************************************************/

/* Transition fade */
.fade-enter-active, .fade-leave-active {
  transition: opacity 1s ease;
}

.fade-enter, .fade-leave-to {
  opacity: 0;
}

/* v-cloak */
 [v-cloak] {
  display: none;
}