@charset "UTF-8";
video#video-local {
  -webkit-transform: scaleX(-1);
  -moz-transform: scaleX(-1);
	transform: scaleX(-1);
}
.loginBg {
  background-color: rgba(0,0,0,.8);
}
.login .invalid-feedback {
  color: #fba4af;
}
.main {
  width: 100%;
  height: 100vh;
  height: calc((var(--vh, 1vh) * 100) - 1px);
  height: 100dvh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
}
.main.is-api {
  background: rgba(0,0,0,.8);
  color: #FFF;
}
.title {
  padding: 0;
  text-align: center;
  color: #0079ee;
  margin-bottom: 21px;
}

.title>img {
  margin: 0 auto;
  width: 253px;
  height: 230px;
}
.title svg {
  margin-bottom: 1rem;
  width: 100%;
  max-width: 240px;
}
.title>img {
  margin: 0 auto;
  width: 198px;
  height: 180px;
}
.title h1 {
  font-size: 1.5rem;
}
.title h1 span {
  display: inline-block;
}
.end {
  padding: 2rem 0;
  text-align: center;
}
.end svg {
  width: 100%;
  max-width: 240px;
}

.destination,.login {
  margin: 0 auto;
  padding: 1rem 1rem 2rem;
  width: 100%;
  color: #004d9b;
}
.destination{
  max-width: 480px;
}
.login {
  max-width: 400px;
}
.modal-body ul {
  list-style: disc;
  margin: 1rem 0;
  padding: 0 0 0 1.5rem;
}

.destination .form-group .form-control ,
.login .form-group .form-control {
  background-color: #f0fcff;
}
.destination input ,
.destination .sendBtn,
.login input ,
.login .loginBtn {
  font-size: 120%;
}
.destination .sendBtn ,
.login .loginBtn {
  display: block;
  width: 100%;
  margin: 0 auto 1.5rem;
}
.destination .accordion .card .card-header {
  border: none;
}
.destination .accordion .card .card-header{
  background: #1daedc;
  color: #FFF !important;
}
.destination .accordion .card .card-header:hover ,
.destination .accordion .card .card-header:not(.collapsed) {
  background: #0a94cf;
  color: #FFF !important;
}
.qrModal {
  width: auto;
  max-width: 300px;
  margin: auto;
}
.btnArea {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  width: 2.5rem;
  position: fixed;
  top: 0.5rem;
  right: 0.5rem;
  z-index: 1;
}
.btnArea > div {
  position: relative;
}
@media (orientation: landscape) and (max-height: 480px){
.btnArea {
  width: 28rem;
  flex-direction: row-reverse;
}
.btnArea > div,button#toggle-fullscreen {
  margin-left: 0.5rem;
}
}
.top-information a {
  font-size: 14px;
}

.hostDevice .guestCam,
.guestDevice .hostCam {
  padding: 0;
  width: 100vw;
  height: 100vh;
  height: calc((var(--vh, 1vh) * 100) - 1px);
  height: 100dvh;
  position: fixed;
  background: rgba(0,0,0,.8);
}
.guestDevice .hostCam:hover .videoArea video {
  filter: saturate(1.1) brightness(1.1);
}
.hostDevice .guestCam .videoArea ,
.guestDevice .hostCam .videoArea,
.hostDevice .hostCam #video-remote-group,
.hostDevice .guestCam #video-remote-group ,
.guestDevice .hostCam #video-remote-group,
.guestDevice .guestCam #video-remote-group,
.guestDevice .hostCam #video-local-group,
.hostDevice .guestCam #video-local-group {
  width: 100%;
  height: 100vh;
  height: calc((var(--vh, 1vh) * 100) - 1px);
  height: 100dvh;
  /*height: -webkit-fill-available;*/
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.hostDevice .guestCam .loading ,
.guestDevice .hostCam .loading,
.hostDevice .hostCam .loading,
.guestDevice .guestCam .loading {
  display: none;
  justify-content: center;
  align-items: center;
  width: 100%;
  position: absolute;
  z-index: 10;
}
.videoArea video {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  z-index: 1;
}
.videoArea .status {
  position: absolute;
  top: 1rem;
  left: 1rem;
  z-index: 10;
  color: #FFF;
  background: rgba(80,100,120,.6);
  padding: 0.5rem 1rem;
  border-radius: 0.25rem;
}
.videoArea .screen-status {
  position: absolute;
  top: 4rem;
  left: 1rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.videoArea .recording-status {
  display: none;
  z-index: 10;
  color: #FFF;
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  margin-bottom: 0.25rem;
}
.videoArea .recording-status.recording {
  display: inline-block;
  background: #F7493E;
  opacity: 1;
}
.videoArea .recording-status.recording i.fas {
  animation: flash 3s ease-in-out infinite;
}
.videoArea .recording-status.recording i.fas::before {
  content: "\f111";
}
.videoArea .recording-status.pause {
  display: block;
  background: rgba(102,102,102,0.8);
  opacity: 0.6;
}
.videoArea .recording-status.pause i.fas::before {
  content: "\f04c";
}
@keyframes flash {
  0% {opacity: 1;}
  50% {opacity: 0.1;}
  100% {opacity: 1;}
}
.videoArea .share-status {
  display: none;
  z-index: 10;
  color: #000;
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  margin-bottom: 0.25rem;
}
.videoArea .share-status.sharing {
  display: inline-block;
  background: #ffca09;
  opacity: 1;
}
.videoArea .share-status.sharing i.fas {
  animation: flash 4s ease-in-out infinite;
}
.videoArea .share-status.sharing i.fas::before {
  content: "\f362";
}
.videoArea .waitingMessage {
  font-size: 1.35rem;
  color: #FFF;
  padding: 1rem;
  text-align: center;
  position: absolute;
  z-index: 9;
}
.videoArea .waitingMessage span {
  display: inline-block;
  font-feature-settings: "palt";
}
.hostDevice .hostCam,
.guestDevice .guestCam {
  width: 18vmax;
  height: 18vmax;
  max-width: 180px;
  max-height: 180px;
  position:fixed;
  bottom: 0.8rem;
  left: 0.8rem;
}
.hostDevice .hostCam .videoArea ,
.guestDevice .guestCam .videoArea {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #444;
  border-radius: 0.5rem;
  box-shadow: 0 0 1rem rgba(0,0,0,.25);
}
.hostDevice .hostCam .videoArea video,
.guestDevice .guestCam .videoArea video,
.guestCam #video-local-group,
.hostDevice .hostCam #video-local-frame #video-remote-group,
.hostDevice .hostCam #video-local-frame #video-local-group,
.guestDevice .guestCam #video-local-frame #video-remote-group {
  width: 100%;
  height: 100%;
  z-index: 1;
}
#video-local-group,
#video-remote-group {
  display: flex;
  justify-content: center;
  align-items: center;
}
.videoArea #video-remote+.video-mute-img {
  background: linear-gradient(135deg, #7a93ce,#59acbb,#81bb97,#59acbb,#7a93ce);
  background-size: 800% 800%;
  -webkit-animation: grd-anm 20s ease infinite;
  -moz-animation: grd-anm 20s ease infinite;
  -o-animation: grd-anm 20s ease infinite;
  animation: grd-anm 20s ease infinite;
  border-radius: 100%;
  position: absolute;
  z-index: 0;
}
#video-local+.video-mute-img {
  background: linear-gradient(135deg, #e8bd6d,#e39d87,#c48bb2,#e39d87,#e8bd6d);
  background-size: 800% 800%;
  -webkit-animation: grd-anm 20s ease infinite;
  -moz-animation: grd-anm 20s ease infinite;
  -o-animation: grd-anm 20s ease infinite;
  animation: grd-anm 20s ease infinite;
  border-radius: 100%;
  position: absolute;
  z-index: 0;
}
@-webkit-keyframes grd-anm {
  0%{background-position:0% 0%}
  50%{background-position:100% 100%}
  100%{background-position:0% 0%}
}
@-moz-keyframes grd-anm {
  0%{background-position:0% 0%}
  50%{background-position:100% 100%}
  100%{background-position:0% 0%}
}
@-o-keyframes grd-anm {
  0%{background-position:0% 0%}
  50%{background-position:100% 100%}
  100%{background-position:0% 0%}
}
@keyframes grd-anm {
  0%{background-position:0% 0%}
  50%{background-position:100% 100%}
  100%{background-position:0% 0%}
}

.hostDevice .hostCam .videoArea .video-mute-img,
.guestDevice .guestCam .videoArea .video-mute-img {
  width: 60%;
  height: 60%;
}
.hostDevice .guestCam .videoArea .video-mute-img,
.guestDevice .hostCam .videoArea .video-mute-img  {
  width: 30vw;
  height: 30vw;
  max-width: 300px;
  max-height: 300px;
  min-width: 120px;
  min-height: 120px;
}
.hostDevice .hostCam .videoArea .mic-mute-img,
.guestDevice .guestCam .videoArea .mic-mute-img {
  width: 100%;
  bottom: 0;
  max-height: 2rem;
  background: -moz-linear-gradient(left, rgba(102,102,102,0) 0%, rgba(102,102,102,0.8) 40%, rgba(102,102,102,0.8) 60%, rgba(102,102,102,0) 100%);
background: -webkit-linear-gradient(left, rgba(102,102,102,0) 0%,rgba(102,102,102,0.8) 40%,rgba(102,102,102,0.8) 60%,rgba(102,102,102,0) 100%);
background: linear-gradient(to right, rgba(102,102,102,0) 0%,rgba(102,102,102,0.8) 40%,rgba(102,102,102,0.8) 60%,rgba(102,102,102,0) 100%);
}
.hostDevice .guestCam .videoArea .mic-mute-img,
.guestDevice .hostCam .videoArea .mic-mute-img  {
  width: 60vw;
  max-width: 360px;
  min-width: 120px;
  bottom: 24vmax;
  max-height: 3rem;
  background: -moz-linear-gradient(left, rgba(102,102,102,0) 0%, rgba(102,102,102,0.8) 40%, rgba(102,102,102,0.8) 60%, rgba(102,102,102,0) 100%);
background: -webkit-linear-gradient(left, rgba(102,102,102,0) 0%,rgba(102,102,102,0.8) 40%,rgba(102,102,102,0.8) 60%,rgba(102,102,102,0) 100%);
background: linear-gradient(to right, rgba(102,102,102,0) 0%,rgba(102,102,102,0.8) 40%,rgba(102,102,102,0.8) 60%,rgba(102,102,102,0) 100%);
}
@media (max-width: 767px) {
  .hostDevice .hostCam,
  .guestDevice .guestCam {
    width: 16vmax;
    height: 16vmax;
  }
  .hostDevice .guestCam .videoArea .mic-mute-img,
  .guestDevice .hostCam .videoArea .mic-mute-img  {
    max-height: 3rem;
  }
}
@media (orientation: landscape) and (min-width: 768px){
  .hostDevice .guestCam .videoArea .mic-mute-img,
  .guestDevice .hostCam .videoArea .mic-mute-img  {
    max-width: 240px;
    bottom: 8vmax;
  }
}
@media (orientation: landscape) and (max-width: 767px){
  .hostDevice .guestCam .videoArea .mic-mute-img,
  .guestDevice .hostCam .videoArea .mic-mute-img  {
    bottom: 8vmax;
  }
}
.mic-mute-img {
  position: absolute;
  z-index: 2;
}
.videoArea .video-mute-img,
.videoArea .mic-mute-img {
  display: none;
}
.videoArea .is-video-mute {
  visibility: hidden;
}
.videoArea .is-video-mute+.video-mute-img,
.videoArea .is-mic-mute~.mic-mute-img {
  display: block;
}
.videoArea .is-video-loading~.loading {
  display: flex;
}



.stopBtn {
  position: fixed;
  bottom: 0.8rem;
  right: 0.8rem;
}
.stopBtn button:disabled {
  opacity: 0.4;
  pointer-events: none;
  filter: grayscale(0.5);
}
button#toggle-fullscreen {
  padding: 0.75rem;
  color: #FFF;
  background: rgba(80,100,120,.6);
  border: none;
  border-radius: 2rem;
  line-height: 1;
  width: 2.5rem;
  height: 2.5rem;
  margin-bottom: 1rem;
}
button#logout {
  position: absolute;
  top: 1rem;
  left: 1rem;
  z-index: 1;
  padding: 0.75rem;
  line-height: 1;
  width: auto;
  height: 2.5rem;
}

@media screen and (max-height: 767px) {
  .main {
    height: 100vh;
    height: 100dvh;
    justify-content: unset;
    align-items: unset;
  }
  .title {
    padding: 3rem 1rem 0;
    margin-bottom: 0;
  }
  .title svg {
    max-width: 30vmax;
  }
}
@media screen and (max-width: 767px) {
  .main {
    /*min-height: 100vh;*/
    height: 100vh;
    height: 100dvh;
    /*height: calc((var(--vmax, 1vmax) * 100) - 1px);*/
    /*height: -webkit-fill-available;*/
    justify-content: unset;
    align-items: unset;
  }
  .title {
    padding: 3rem 1rem 0;
    margin-bottom: 0;
  }
  .title svg {
    max-width: 30vmax;
  }
  .videoArea .waitingMessage {
    font-size: 1.125rem;
  }
  .destination,.login {
    padding: 1rem;
  }
  .destination input ,
  .destination .sendBtn ,
  .login input ,
  .login .loginBtn {
    font-size: 100%;
  }
  
  button#logout {
    position: relative;
    padding: 0.5rem;
    height: auto;
    margin: 1rem auto;
    left: auto;
    top: auto;
  }
  .videoArea .status {
    top: 0.5rem;
    left: 0.5rem;
	}
  .videoArea .screen-status {
    top: 3.5rem;
    left: 0.5rem;
  }
  
}
@media (orientation: landscape){
  .main {
    /*min-height: 100vh;*/
    height: 100vh;
    height: calc((var(--vh, 1vh) * 100) - 1px);
    height: 100dvh;
    /*height: -webkit-fill-available;*/
  }
}

html {
  overscroll-behavior: none;
}
html, body, form {
  margin: 0;
  padding: 0;
  font-family: "メイリオ", Meiryo, "Roboto","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif"; }

input[type=text] {
  border: 1px solid #ddd; }

a {
  color: #666;
  text-decoration: none; }

a:hover {
  color: #000; }

ul, ol, dl, dt, dd {
  margin: 0;
  padding: 0;
  list-style: none; }

li {
  display: list-item;
  zoom: normal;
  margin: 0;
  padding: 0; }

p {
  margin: 0;
  padding: 0; }

img {
  display: block; }

.clearfix:after {
  content: " ";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden; }

.clearfix {
  display: inline-table; }

.flozen {
  min-width: 980px; }

button {
  margin: 0;
  padding: 0; }

h1 {
  font-size: 25px; }

input[type=checkbox] {
  width: 16px;
  height: 16px;
  margin: 0 5px;
	vertical-align: -2px !important;
}

body {
  margin: 0;
  display: flex;
  flex-flow: column;
  min-height: 100vh;
  min-height: 100dvh;
  /*min-width: 1200px;*/
  background-color: #fff; }

main {
  flex: 1; }

.dialog {
  min-width: 896px !important; }

/* ヘッダ ------------------------------------------------------ */
.l-header {
  box-sizing: border-box;
  width: 100%;
  padding: 0px 0px;
  height: 56px;
  display: table; }

/* メイン ------------------------------------------------------ */
.l-main {
  box-sizing: border-box;
  width: 100%;
  padding: 28px;
  margin: 0 auto;
}
@media (max-width: 767px) {
  .l-main {
    padding: 0.75rem;
  }
}
.l-main-header {
  width: 100%;
  margin-bottom: 14px; }

.l-main-contents {
  width: 100%;
  margin-bottom: 14px; }

.l-main-footer {
  width: 100%;
  margin: 0 0 7px 0;
  padding: 0;
  display: -webkit-flex;
  display: flex; }


/* フッタ ------------------------------------------------------ */
.l-footer {
  box-sizing: border-box;
  padding: 0px 28px;
  width: 100%;
  height: 50px;
  background-color: #eee;
  display: table; }

/* 固定レイアウト ------------------------------------------------ */
.l-flozen {
  width: 980px;
  background-color: #aaa; }

/* 原稿設定 --------------------------------------------------- */
.l-main-manuscript {
  display: flex;
  justify-content: flex-start; }

.l-main-manuscript-left {
  width: 360px; }

.l-main-manuscript-right {
  -webkit-flex: 1;
  flex: 1;
  padding-left: 28px; }

.l-home {
  display: flex;
  flex-flow: row; }

.l-home-left {
  flex: 0 0 448px; }

.l-home-main {
  flex: 1 1 600px; }

/*-----  header  -----*/
.header-logo {
  width: 240px;
  height: 100%;
  padding-left:28px;
  display: table-cell;
  vertical-align: middle; }

.header-menu {
  height: 100%;
  display: table-cell;
  vertical-align: middle;
  color: #fff;
  padding-right: 14px; }

.header-menu-tel {
  line-height: 56px; }

.menu {
  float: left;
  text-align: left;
  font-size: 12px; }

.menu a {
  color: #fff; }

.menu li {
  display: inline-block;
  border-right: 1px solid #fff;
  padding: 7px 11px; }

.menu li:last-child {
  margin-right: 0px;
  border-right: none; }

.menu2 {
  float: right;
  text-align: left;
  font-size: 12px; }

.menu2 a {
  color: #fff; }

.menu2 li {
  display: inline-block;
  padding: 7px 11px; }

.menu2 li:last-child {
  margin-right: 0px;
  border-right: none;
  width: 14px; }

.menu-trigger {
  position: absolute;
  top: 13px;
  right: 10px;
  width: 36px;
  height: 30px; }

.menu-trigger span {
  background-color: #0288B5;
  position: absolute;
  left: 0;
  width: 100%;
  height: 4px;
  border-radius: 4px; }

/*-----  ヘッダメニュー  -----*/
.menu-trigger span:nth-of-type(1) {
  top: 0;
  transition-duration: 0.4s;
  transition-timing-function: ease-in-out; }

.menu-trigger span:nth-of-type(2) {
  top: 13px;
  transition-duration: 0.4s;
  transition-timing-function: ease-in-out; }

.menu-trigger span:nth-of-type(3) {
  bottom: 0;
  transition-duration: 0.4s;
  transition-timing-function: ease-in-out; }

/* 不要？ */
@media (max-width: 959px) {
  .menu-trigger {
    position: absolute;
    top: 26px;
    right: 24px; }

  .menu-trigger {
    position: absolute;
    top: 26px;
    right: 24px;
    width: 40px;
    height: 36px; }

  .menu-trigger, .menu-trigger span {
    display: inline-block;
    transition: all .4s !important;
    box-sizing: border-box; } }
.header-tel {
  display: table;
  height: 100%;
  vertical-align: middle; }

.header-tel .header-image {
  display: table-cell;
  width: 192px;
  height: 56px;
  vertical-align: middle;
  text-align: center; }

.menu-link {
  display: block;
  text-align: center; }

.menu-link i {
  font-size: 16px; }

/*-----  global  -----*/
/*-----  ヘッダ  -----*/
.color01 .header-menu {
  background: #6399ce;
  background: -moz-linear-gradient(left, #6399ce 0%, #76b0c0 100%);
  background: -webkit-linear-gradient(left, #6399ce 0%, #76b0c0 100%);
  background: linear-gradient(to right, #6399ce 0%, #76b0c0 100%); }

.color02 .header-menu {
  background: #e17b77;
  background: -moz-linear-gradient(left, #e17b77 0%, #e19c8e 100%);
  background: -webkit-linear-gradient(left, #e17b77 0%, #e19c8e 100%);
  background: linear-gradient(to right, #e17b77 0%, #e19c8e 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e17b77', endColorstr='#e19c8e',GradientType=1 ); }

.color03 .header-menu {
  background: #abc028;
  background: -moz-linear-gradient(left, #abc028 0%, #7ac865 100%);
  background: -webkit-linear-gradient(left, #abc028 0%, #7ac865 100%);
  background: linear-gradient(to right, #abc028 0%, #7ac865 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#abc028', endColorstr='#7ac865',GradientType=1 ); }

.color04 .header-menu {
  background: #28334b;
  background: -moz-linear-gradient(left, #28334b 0%, #59546c 100%);
  background: -webkit-linear-gradient(left, #28334b 0%, #59546c 100%);
  background: linear-gradient(to right, #28334b 0%, #59546c 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28334b', endColorstr='#59546c',GradientType=1 ); }

/*-----  main  -----*/
.desc {
  font-size: 14px; }

/*-----  main  -----*/
.main-header {
  width: 100%;
  margin: 0;
  padding: 0;
  flex-wrap: wrap;
}

.main-header2 {
  width: 100%;
  margin-bottom: 14px; }

.main-title {
  margin: 0;
  font-size: 24px;
  font-weight: normal;
  color: #338CE6;
  line-height: 1.3;
  float: left;
}
@media (max-width: 767px) {
  .main-header .main-title {
    font-size: 1rem;
    padding: 0.25rem 0;
    order: 1;
    width: calc(100% - 100px);
  }
  .main-header .user_group {
    font-size: 0.75rem;
    padding: 0.25rem 0;
    order: 3;
  }
  .main-header .btn-group {
    order: 2;
    margin-bottom: 0.25rem;
    justify-self: flex-end;
  }
  .main-header .btn-group .btn {
    align-self: flex-start;
    text-indent: 30px;
    overflow: hidden;
    width: 30px;
    height: 30px;
    padding: 0;
  }
  .main-header .btn-group .btn i.fas {
    text-indent: -49px;
  }
}

.main-header-step2 {
  margin-bottom: 21px; }

.main-header-step2 ol {
  list-style-type: none;
  counter-reset: item;
  font-size: 0;
  line-height: 0; }

.main-header-step2 li:before {
  display: inline-block;
  counter-increment: item;
  content: counter(item) "";
  font-weight: bold;
  border-right: 1px solid #2BAEA5;
  line-height: 32px;
  width: 20px;
  text-align: center; }

.main-header-step2 li {
  box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  font-size: 13px;
  border: 1px solid #2BAEA5;
  border-radius: 4px;
  margin: 0px;
  color: #2BAEA5; }

.main-header-step2 li:not(:last-child) {
  margin-right: 8px;
  content: '>'; }

.main-header-step2 li a {
  box-sizing: border-box;
  display: inline-block;
  line-height: 32px;
  padding-left: 7px;
  min-width: 130px;
  color: #2BAEA5; }

/*-----  footer  -----*/
.footer-copyright {
  height: 100%;
  display: table-cell;
  vertical-align: middle;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-align: center;
  font-size: 10px; }

/*-----  module  -----*/
/*-----  form  -----*/
.form-main {
  box-sizing: border-box;
  width: 100%;
  padding: 28px;
  background-color: #eee;
  border-radius: 4px; }

.form-main > div {
  display: grid;
  grid-auto-rows: minmax(55px, max-content);
  grid-template-columns: 400px 1fr;
}

.form-dialog {
  box-sizing: border-box;
  width: 100%;
  padding: 0px;
  background-color: #f8f8f8;
  border-radius: 4px; }

.form-dialog > div {
  display: grid;
  grid-template-rows: 60px;
  grid-template-columns: 250px 1fr;
}

.form-error {
  box-sizing: border-box;
  width: 100%;
  padding: 14px 28px;
  background-color: #FAE5E3;
  border-radius: 4px;
  margin-bottom: 14px;
  color: #f00; }

.form-error i {
  margin-right: 6px;
  position: relative;
  top: 2px; }

.form-cell-midashi {
  box-sizing: border-box;
  grid-row: span 1;
  grid-column: span 1;
  text-align: right;
  padding: 6px 7px;
  font-size: 15px; }

.form-cell-midashi i {
  font-size: 13px;
  margin-left: 4px;
  color: #666; }

.form-cell-midashi::after {
  content: "：";
  margin-left: 12px; }

.form-dialog-main {
  box-sizing: border-box;
  width: 100%;
  padding: 28px;
  background-color: #eee;
  border-radius: 4px; }

.form-dialog-main > div {
  display: grid;
  grid-auto-rows: minmax(55px, max-content);
  grid-template-columns: 200px 1fr;
}

.form-dialog-main > div.groups {
  display: grid;
  grid-auto-rows: minmax(55px, max-content);
  grid-template-columns: 200px 1fr;
}

.form-cell-input {
  box-sizing: border-box;
  grid-row: span 1;
  grid-column: span 1;
  padding: 0px 7px 7px;
  font-size: 15px; }

.form-cell-input label {
  display: inline-block;
  margin-top: 6px;
  margin-right: 11px; }

.form-main-center {
  width: 980px;
  margin: 0px auto;
  box-sizing: border-box;
  padding: 28px;
  background-color: #fff;
  border-radius: 6px;
  border: 2px solid #AADFDB; }

.form-main-center > article > p {
  box-sizing: border-box;
  font-weight: bold;
  font-size: 18px;
  color: #333;
  line-height: 28px;
  margin-bottom: 11px; }

.form-main-center > article > p > span {
  box-sizing: border-box;
  color: #fff;
  background-color: #2BAEA5;
  text-align: center;
  display: inline-block;
  vertical-align: middle;
  width: 28px;
  height: 28px;
  border-radius: 5px;
  margin-right: 12px;
  line-height: 28px; }

.form-main-center > article > p > i {
  color: #2BAEA5;
  line-height: 28px;
  font-size: 16px;
  display: inline-block;
  position: relative;
  top: 1px; }

.form-main-center-content {
  padding-left: 47px; }

.form-main-center article {
  margin-bottom: 35px; }

.form-main-center article:last-child {
  margin-bottom: 0px; }

.form-main-center2 {
  width: 100%;
  margin: 0px auto;
  box-sizing: border-box;
  padding: 28px;
  background-color: #fff;
  border-radius: 6px;
  border: 2px solid #AADFDB; }

.form-main-center2 > article > p {
  box-sizing: border-box;
  font-weight: bold;
  font-size: 18px;
  color: #333;
  line-height: 28px;
  margin-bottom: 11px; }

.form-main-center2 > article > p > span {
  box-sizing: border-box;
  color: #fff;
  background-color: #2BAEA5;
  text-align: center;
  display: inline-block;
  vertical-align: middle;
  width: 28px;
  height: 28px;
  border-radius: 5px;
  margin-right: 12px;
  line-height: 28px; }

.form-main-center2 > article > p > i {
  color: #2BAEA5;
  line-height: 28px;
  font-size: 16px;
  display: inline-block;
  position: relative;
  top: 1px; }

.form-main-center2-content {
  padding-left: 47px; }

.form-main-center2 article {
  margin-bottom: 35px; }

.form-main-center2 article:last-child {
  margin-bottom: 0px; }

.cell-grid {
  display: grid;
  /*    grid-template-rows: 38px 38px 38px 38px 38px 38px 38px 38px 38px 38px 38px 38px;*/
  grid-template-columns: 120px 120px 120px 120px 120px; }

.cell-grid > a {
  margin: 4px; }

.cell-grid-button {
  grid-column: 1 / 6;
  width: 232px; }

/* frm -------------------------------------------------------- */

.frm-error {
  border: 1px solid #e9546b !important; }

.frm-jushinsyaid {
  width: 117px; }

.frm-jushinsyamei {
  width: 340px; }

.frm-jushinsyahurigana {
  width: 340px; }

.frm-groupid {
  width: 180px; }

.frm-groupname {
  width: 500px; }

.frm-sousinsyamei {
  width: 340px; }

.frm-fax {
  width: 180px; }

.frm-email {
  width: 340px; }

.frm-memo {
  width: 800px; }

.frm-maintenancedate {
  width: 120px; }

.frm-maintenancetime {
  width: 80px; }

.frm-soushinuketsukebi {
  width: 120px; }

.frm-groupid {
  width: 180px; }

.frm-groupmei {
  width: 400px; }

.frm-label-radio {
  display: inline-block;
  width: 100px; }

.frm-select-long {
  width: 300px; }

.frm-check {
  margin-top: 14px;
  font-size: 14px; }

.frm-login {
  width: 100%;
  height: 40px; }

.frm-main {
  box-sizing: border-box;
  /*	margin: 28px;*/
  padding: 28px;
  background-color: #eee;
  border-radius: 4px;
  margin-bottom: 28px; }

.frm-title {
  font-size: 16px;
  font-weight: bold;
  color: #333;
  margin-bottom: 21px; }

/*
.frm-item{
	margin: 0px;
	padding: 11px;
	display: flex;
}

.frm-item-midashi{
    box-sizing: border-box;
   	margin: 0px;
	padding: 8px 28px 8px 0px;
	width: 200px;
	text-align: right;
	font-size: 15px;
}

.frm-item-column{
    box-sizing: border-box;
	margin: 0px;
	padding: 0px;
	width: 200px;
	width: 80%;
}

.frm-item-data p{
	margin: 0px;
	padding: 0px;
}

.frm-item-data p{
	padding: 8px 0px;
	display: inline-block;
	min-width: 10px;
}
*/
.frm-item {
  margin: 0px;
  padding-bottom: 4px;
  display: grid;
  grid-auto-rows: minmax(35px, max-content);
  grid-template-columns: 200px 1fr; }

.frm-item-midashi {
  padding-right: 14px;
  box-sizing: border-box;
  grid-row: span 1;
  grid-column: span 1;
  text-align: right;
  padding: 6px 7px;
  /* line-height: 46px; */
  font-size: 15px; }

.frm-item-data {
  box-sizing: border-box;
  grid-row: span 1;
  grid-column: span 1;
  padding: 6px 7px 7px;
  /* line-height: 51px; */
  font-size: 15px; }

.frm-yoko {
  display: flex;
  flex-direction: row; }

.frm-yoko p:not(:last-child) {
  margin-right: 14px; }

.frm-tate {
  display: flex;
  flex-direction: column;
  flex-basis: auto; }

.frm-tate p:not(:last-child) {
  margin-bottom: 7px; }

.frm-main input[type=text] {
  padding: 7px 7px;
  font-size: 15px;
  border: 1px solid #ccc;
  border-radius: 2px; }

.frm-main p {
  padding: 4px 0px;
  /*	font-size: 15px;*/
  /*	display: inline-block;*/
  min-width: 10px; }

/*-----  btn  -----*/

.btn-guide {
  box-sizing: border-box;
  line-height: 30px;
  padding: 4px 12px;
  border: 1px solid #888;
  border-radius: 20px;
  background-color: #888;
  color: #fff;
  font-size: 14px; }

.btn-set {
  padding: 0px;
  float: right; }

.btn i {
  vertical-align: middle; }

.btn span {
  padding: 0px 0em; }

/*-----  buttonのサイズ  -----*/
.btn-large {
  padding: 0px 28px;
  height: 38px;
  line-height: 38px;
  font-size: 18px;
  min-width: 160px; }

.btn-large span {
  display: inline-block;
  vertical-align: middle;
  line-height: 38px;
  vertical-align: middle;
  letter-spacing: 0em;
}

.btn-large i {
  display: inline-block;
  vertical-align: top;
  margin-right: 0.6em;
  height: 33px;
  line-height: 33px; }

/*--------------------*/
.btn-medium {
  padding: 0px 14px;
  /*	min-width: 140px;*/
  height: 34px;
  font-size: 16px; }

.btn-medium span {
  display: inline-block;
  vertical-align: middle;
  line-height: 33px;
  vertical-align: middle;
	/*  letter-spacing: 0.1em;*/
	/*  margin-right: -0.4em;*/
}

.btn-medium i {
  display: inline-block;
  vertical-align: top;
  margin-right: 0.6em;
  height: 29px;
  line-height: 29px; }

.btn-medium-icon {
  /*	padding: 0px 24px;*/
  width: 34px;
  height: 34px;
  font-size: 17px; }

/*--------------------*/
.btn-small {
  padding: 0px 19px;
  height: 29px;
  font-size: 13px;
  line-height: 29px; }

.btn-small span {
  display: inline-block;
  vertical-align: middle;
  line-height: 29px;
  vertical-align: middle;
  letter-spacing: 0.4em;
  margin-right: -0.4em; }

.btn-small i {
  display: inline-block;
  vertical-align: top;
  margin-right: 0.6em;
  height: 25px;
  line-height: 25px; }

.btn-small-icon {
  /*	padding: 0px 19px;*/
  width: 29px;
  height: 29px;
  font-size: 14px; }

.btn-small-table {
  padding: 0px 19px;
  height: 29px;
  font-size: 12px;
  /*	line-height: 29px;*/ }

.btn-small-table span {
  display: inline-block;
  vertical-align: middle;
  line-height: 29px;
  vertical-align: middle; }

.btn-small-table i {
  display: inline-block;
  vertical-align: top;
  margin-right: 0.6em;
  height: 25px;
  line-height: 25px; }

/*--------------------*/
.btn-mini {
  padding: 0px 14px;
  height: 28px;
  font-size: 12px; }

.btn-mini span {
  display: inline-block;
  vertical-align: middle;
  line-height: 26px;
  vertical-align: middle;
  letter-spacing: 0.4em;
  margin-right: -0.4em; }

.btn-mini i {
  display: inline-block;
  vertical-align: top;
  margin-right: 0.6em;
  height: 23px;
  line-height: 23px; }

.btn-mini-table {
  padding: 0px 7px;
  height: 28px;
  font-size: 12px; }

.btn-mini-table span {
  display: inline-block;
  vertical-align: middle;
  line-height: 26px;
  vertical-align: middle; }

.btn-mini-table i {
  display: inline-block;
  vertical-align: top;
  margin-right: 0.6em;
  height: 23px;
  line-height: 23px; }

/*-----  buttonの色  -----*/
.btn-default {
  background-color: #FFF;
  border-color: #337DC4;
  color: #337DC4; }

.btn-default:hover {
  background-color: #FFF;
  border-color: #007fff;
  color: #007fff; }

.btn-off {
  background-color: #ccc;
  border-color: #ccc;
  color: #fff; }

.btn-primary {
  background-color: #337DC4;
  border-color: #337DC4;
  color: #fff !important;
}

.btn-primary:hover {
  background-color: #007fff;
  border-color: #007fff;
  color: #fff; }

.btn-danger {
  background-color: #F7493E;
  border-color: #F7493E;
  color: #fff; }

.btn-add {
  background-color: #fff;
  border-color: #2BAEA5;
  color: #2BAEA5;
	border: 2px solid #2BAEA5;
}

.btn-edit {
  background-color: #fff;
  border-color: #337DC4;
  color: #337DC4; }

.btn-edit:hover {
  background-color: #337DC4;
  border-color: #337DC4;
  color: #fff;
  font-weight: bold; }

.btn-delete {
  background-color: #fff;
  border-color: #ef5350;
  color: #ef5350 !important; }

.btn-delete:hover {
  background-color: #ef5350;
  border-color: #ef5350;
  color: #fff !important;
  font-weight: bold; }

.btn-delete2 {
  background-color: #F7493E;
  border-color: #F7493E;
  color: #fff !important; }

.btn-preview {
  background-color: #fff;
  border-color: #337DC4;
  color: #337DC4 !important; }

.btn-preview:hover {
  background-color: #F7493E;
  border-color: #F7493E;
  color: #fff;
  font-weight: bold; }

.btn-arrow {
  background-color: #fff;
  border-color: #333;
  color: #333 !important; }

.btn-arrow:hover {
  background-color: #333;
  border-color: #333;
  color: #fff;
  font-weight: bold; }

.btn-copy {
  background-color: #fff;
  border-color: #337DC4;
  color: #337DC4;
  font-weight: bold; }

.btn-copy:hover {
  background-color: #337DC4;
  border-color: #337DC4;
  color: #fff;
  font-weight: bold; }

/*----------*/
.btn-sel-add {
  background-color: #2BAEA5;
  border-color: #2BAEA5;
  color: #fff; }

.btn-sel-edit {
  background-color: #337DC4;
  border-color: #337DC4;
  color: #fff; }

.btn-sel-delete {
  background-color: #ef5350;
  border-color: #ef5350;
  color: #fff; }

.btn-sel-copy {
  background-color: #337DC4;
  border-color: #337DC4;
  color: #fff; }

/*----------*/
.btn-download {
  width: 100px;
  background-color: #70B065;
  border-color: #70B065;
  color: #fff; }

.btn-search {
  background-color: #337DC4;
  border-color: #337DC4;
  color: #fff; }
.btn-search:hover {
    color: #FFF;
    background-color: #007fff;
}


/*----- ダイアログ用ボタン -----*/
.btn-dlg {
  min-width: 160px;
  height: 32px;
  line-height: 32px;
  font-size: 14px; }

.btn-password {
  padding: 0px 28px;
  height: 40px;
  font-size: 18px;
  width: 386px; }

.btn-login {
  padding: 0px 28px;
  height: 40px;
  font-size: 18px;
  width: 100%; }

/*-----  table  -----*/
.tbl {
  table-layout: fixed;
  border-collapse: collapse;
  box-sizing: border-box; }

.tbl tr, th, td {
  box-sizing: border-box; }

.tbl th {
  vertical-align: middle;
  overflow: hidden; }

.tbl th a {
  display: block; }

.tbl td {
  vertical-align: middle;
  overflow: hidden; }

.tbl td a {
  /*	display:block;*/
  /*	text-decoration: underline;*/
  color: #337DC4; }

.tbl-scroll {
  box-sizing: border-box;
  width: 100%;
  overflow-x: auto;
  margin-bottom: 11px;}

.tbl-scroll-dialog-y {
  box-sizing: border-box;
  max-height: 501px;
  overflow-y: scroll;
  margin-bottom: 11px; }

.tbl-no-scroll {
  box-sizing: border-box;
  width: 100%;
  margin-bottom: 14px; }

/*-----  テーブル  -----*/
.tbl-header {
  width: 100%;
  margin-bottom: 7px;
  vertical-align: middle; }

.tbl-header-label {
  font-size: 18px;
  font-weight: bold;
  float: left;
  line-height: 34px;
  margin-right: 14px;
}
@media (max-width: 767px) {
  .tbl-header-label {
    font-size: 1rem;
  }
  .tbl-header-label+.btn {
    font-size: 0.8rem;
  }
  .tbl-scroll {
    position: relative;
  }
  .tbl-scroll::before {
    display: block;
    width: calc(100vw - 1.5rem);
    height: 100%;
    background: rgba(0,0,0,.5);
    color: #FFF;
    text-align: center;
    padding-top: 120px;
    content: "スクロールできます";
    position: absolute;
    transition: all 2s ease;
  }
  .tbl-scroll::after {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    width: calc(100vw - 1.5rem);
    height: 100px;
    color: #FFF;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 4rem;
    content: "\f0a6";
    position: absolute;
    top: 20px;
    animation-name: swipe;
    animation-duration:1.5s;
    animation-fill-mode:forwards;
    animation-iteration-count:infinite;
    transform: translateX(20px);
  }
  .tbl-scroll.view::before ,
  .tbl-scroll.view::after {
    display: none;
  }
}
@keyframes swipe {
  0% {transform: translateX(20px);}
  70% {transform: translateX(-20px);}
  100% {transform: translateX(20px);}
}

.tbl-header-count {
  float: right; }

.tbl-header-count .frm {
  height: 28px; }

.tbl-footer {
  width: 100%;
  height: 37px; }

.pagination {
  font-size: 0;
  float: right;
  box-sizing: border-box;
  flex-wrap: wrap;
}

.pagination li {
  display: inline-block;
  height: 35px;
  width: 38px;
  background-color: #fff;
  text-align: center;
  margin: 0;
  font-size: 13px;
  line-height: 35px;
}
.pagination li:first-child ,
.pagination li:last-child {
  width: 50px;
}
.pagination li a {
  display: inline-block;
  width: 100%;
  color: #999;
}
.pagination li.active .page-link {
  background-color: #337DC4;
  border-color: #337DC4;
}
.pagination li a:hover,
.pagination li:last-child a:hover {
  background-color: #999;
  border-color: #999;
  color: #fff;
}
.pagination li .page-link,
.pagination li.disabled .page-link {
  border: 1px solid #CCC;
  border-right: none;
}
.pagination li:last-child .page-link {
  border-right: 1px solid #CCC;
}
.pagination .isactive {
  background-color: #999;
  color: #fff;
}

/*-----  モーダル  -----*/
.modal-footer .btn {
  min-width: 130px;
  margin: 0;
}
.modal-content .thumb {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 240px;
  aspect-ratio: 1/1;
  min-height: 100px;
  background: #888;
  margin: 0 auto 0.375rem;
}
.modal-content .thumb video,
.modal-content .thumb img {
  width: 100%; 
  height: 100%; 
  object-fit: contain;
}
@media screen and (max-width: 767px) {
  .modal-footer .btn {
    width: 60%;
    min-width: 256px;
    margin: 0.75rem auto;
  }
}

.recording-file-list {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
}
.recording-file-list .block {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 84px;
  width: 33.3332%;
  padding: 1rem 0.25rem;
}
.recording-file-list .block .thumb {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 280px;
  aspect-ratio: 1/1;
  min-height: 100px;
  background: #888;
  margin-bottom: 0.375rem;
  position: relative;
}
.recording-file-list .block .thumb.image::after {
  display: block;
  background: rgba(77, 88, 146, 0.8);
  color: #FFF;
  content: "画像ファイル";
  position: absolute;
  top: 0;
  left: 0;
  padding: 0.125rem 0.5rem;
  font-size: 0.75rem;
}
.recording-file-list .block .thumb.video::after {
  display: block;
  background: rgba(149, 74, 74, 0.8);
  color: #FFF;
  content: "動画ファイル";
  position: absolute;
  top: 0;
  left: 0;
  padding: 0.125rem 0.5rem;
  font-size: 0.75rem;
}
.recording-file-list .block .thumb.message::after {
  display: block;
  background: rgba(53, 120, 62, 0.8);
  color: #FFF;
  content: "メッセージテキスト";
  position: absolute;
  top: 0;
  left: 0;
  padding: 0.125rem 0.5rem;
  font-size: 0.75rem;
}
.recording-file-list .block .thumb video,
.recording-file-list .block .thumb img {
  max-width: 100%;
  max-height: 100%;
}
.recording-file-list .block .fname {
  font-size: 0.75rem;
  margin-bottom: 0.375rem;
  word-break: break-word;
  text-align: center;
}
.recording-file-list .block .btn {
  width: 100%;
  max-width: 100px;
}
@media screen and (max-width: 767px) {
  #file-control.main .inner {
    padding: 20px 10px;
  }
  .recording-file-list .block .thumb.image::after,
  .recording-file-list .block .thumb.video::after,
  .recording-file-list .block .thumb.message::after {
    font-size: 0.625rem;
  }
}

/*-----  送信履歴  -----*/
.tbl-soushinrireki {
  width: 2000px; }

.tbl-soushinrireki thead {
  background-color: #777;
  color: #fff; }

.tbl-soushinrireki thead tr {
  height: 44px; }

.tbl-soushinrireki th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-soushinrireki th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-soushinrireki th:first-child {
  width: 90px; }

.tbl-soushinrireki th:nth-child(2) {
  width: 90px; }

.tbl-soushinrireki th:nth-child(3) {
  width: 120px; }

.tbl-soushinrireki th:nth-child(4) {
  width: 160px; }

.tbl-soushinrireki th:nth-child(5) {
  width: 160px; }

.tbl-soushinrireki th:nth-child(6) {
  width: 200px; }

.tbl-soushinrireki th:nth-child(7) {
  width: 80px; }

.tbl-soushinrireki th:nth-child(8) {
  width: 80px; }

.tbl-soushinrireki th:nth-child(9) {
  width: 80px; }

.tbl-soushinrireki th:nth-child(10) {
  width: 80px; }

.tbl-soushinrireki th:nth-child(11) {
  width: 200px; }

.tbl-soushinrireki th:nth-child(12) {
  width: 180px; }

.tbl-soushinrireki th:nth-child(13) {
  width: 80px; }

.tbl-soushinrireki th:nth-child(14) {
  width: 180px; }

.tbl-soushinrireki td:first-child {
  text-align: center; }

.tbl-soushinrireki td:nth-child(2) {
  text-align: center; }

.tbl-soushinrireki td:nth-child(3) {
  text-align: left; }

.tbl-soushinrireki td:nth-child(4) {
  text-align: center; }

.tbl-soushinrireki td:nth-child(5) {
  text-align: center; }

.tbl-soushinrireki td:nth-child(6) {
  text-align: center; }

.tbl-soushinrireki td:nth-child(7) {
  text-align: center; }

.tbl-soushinrireki td:nth-child(8) {
  text-align: center; }

.tbl-soushinrireki td:nth-child(9) {
  text-align: center; }

.tbl-soushinrireki td:nth-child(10) {
  text-align: center; }

.tbl-soushinrireki td:nth-child(11) {
  text-align: left; }

.tbl-soushinrireki td:nth-child(12) {
  text-align: left; }

.tbl-soushinrireki td:nth-child(13) {
  text-align: center; }

.tbl-soushinrireki td:nth-child(14) {
  text-align: center; }

.tbl-soushinrireki tbody tr {
  height: 62px;
  color: #444; }

.tbl-soushinrireki tbody tr:nth-child(2n+1) {
  background-color: #fff; }

.tbl-soushinrireki tbody tr:nth-child(2n) {
  background-color: #F6F6F6; }

.tbl-soushinrireki td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px; }

.tbl-td-title {
  background-color: #777777; }

/*-----  送信履歴詳細  -----*/
.tbl-fax-history-detail {
  width: 442px; }

.tbl-fax-history-detail tr {
  height: 50px; }

.tbl-fax-history-detail th, .tbl-fax-history-detail td {
  padding: 6px 14px;
  border: 1px solid #ddd;
  font-size: 13px;
  text-align: left;
  line-height: 24px; }

.tbl-fax-history-detail th {
  width: 170px;
  font-weight: normal;
  background-color: #777;
  color: #fff; }

.tbl-fax-history-detail tr:nth-child(2n) {
  background: #f8f8f8; }

.tbl-fax-history-detail tr:nth-child(2n+1) {
  background: #fff; }

/*-----  宛先メンテナンス  -----*/

.tbl-riyou-joukyou {
  width: 100%; }

.tbl-riyou-joukyou thead {
  background-color: #888;
  color: #fff; }

.tbl-riyou-joukyou thead tr {
  height: 44px; }

.tbl-riyou-joukyou th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-riyou-joukyou th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-riyou-joukyou th:first-child {
  width: 160px; }

.tbl-riyou-joukyou th:nth-child(2) {
  width: 160px; }

.tbl-riyou-joukyou th:nth-child(3) {
  width: 120px; }

.tbl-riyou-joukyou th:nth-child(4) {
  width: 120px; }

.tbl-riyou-joukyou th:nth-child(5) {
  width: 140px; }

.tbl-riyou-joukyou th:nth-child(6) {
}

.tbl-riyou-joukyou th:nth-child(7) {
}

.tbl-riyou-joukyou th:nth-child(8) {
  width: 6%; }

.tbl-riyou-joukyou td:first-child {
  text-align: center; }

.tbl-riyou-joukyou td:nth-child(2) {
  text-align: center; }

.tbl-riyou-joukyou td:nth-child(3) {
  text-align: center; }

.tbl-riyou-joukyou td:nth-child(4) {
  text-align: center; }

.tbl-riyou-joukyou td:nth-child(5) {
  text-align: center; }

.tbl-riyou-joukyou td:nth-child(6) {
  text-align: left; }

.tbl-riyou-joukyou td:nth-child(7) {
  text-align: left; }


.tbl-riyou-joukyou tbody tr {
  height: 50px;
  color: #444; }

.tbl-riyou-joukyou tbody tr:nth-child(2n+1) {
  background-color: #fff; }

.tbl-riyou-joukyou tbody tr:nth-child(2n) {
  background-color: #F6F6F6; }

.tbl-riyou-joukyou td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px; }



/*-----  利用レポート  -----*/

.tbl-riyou-report {
  width: 100%;
  /*min-width: 1200px;*/
}
.tbl-riyou-report thead {
  background-color: #888;
  color: #fff; 
}
.tbl-riyou-report thead tr {
  height: 44px;
}
.tbl-riyou-report th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  line-height: 1.2;
  font-weight: normal;
  text-align: center;
  white-space: nowrap;
}
.tbl-riyou-report th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%;
}
.tbl-riyou-report tbody tr {
  height: 50px;
  color: #444;
}
.tbl-riyou-report tbody tr:nth-child(2n+1) {
  background-color: #fff;
}
.tbl-riyou-report tbody tr:nth-child(2n) {
  background-color: #F6F6F6;
}
.tbl-riyou-report td {
  padding: 8px;
  border: 1px solid #ddd;
  font-size: 13px;
}
@media (max-width: 767px) {
  .tbl-riyou-report {
    min-width: 100%;
  }
  .tbl-riyou-report tbody tr {
    height: 42px;
  }
  .tbl-riyou-report td {
    padding: 4px;
  }
}

.tbl-riyou-report.tsuuwabetsu .date-time {width: 168px;}
.tbl-riyou-report.tsuuwabetsu .method {width: 90px;}
.tbl-riyou-report.tsuuwabetsu .time {width: 110px;}
.tbl-riyou-report.tsuuwabetsu .auto {width: auto;}
.tbl-riyou-report.tsuuwabetsu .text {width: 200px;}

.tbl-riyou-report.month-user .date-time {width: 190px;}
.tbl-riyou-report.month-user .time {width: 100px;}
.tbl-riyou-report.month-user .num {width: 100px;}
.tbl-riyou-report.month-user .auto {width: auto;}
.tbl-riyou-report.month-user .text {width: 180px;}
.tbl-riyou-report.month-user .button {width: 70px;}

.tbl-riyou-report.month-user-group .date-time {width: 190px;}
.tbl-riyou-report.month-user-group .time {width: 100px;}
.tbl-riyou-report.month-user-group .num {width: 100px;}
.tbl-riyou-report.month-user-group .auto {width: auto;}
.tbl-riyou-report.month-user-group .text {width: 160px;}

.tbl-riyou-report.tsuuwa-history .date-time {width: 168px;}
.tbl-riyou-report.tsuuwa-history .method {width: 90px;}
.tbl-riyou-report.tsuuwa-history .time {width: 100px;}
.tbl-riyou-report.tsuuwa-history .auto {width: auto;}
.tbl-riyou-report.tsuuwa-history .text {width: 190px;}
.tbl-riyou-report.tsuuwa-history .agency {width: 120px;}
.tbl-riyou-report.tsuuwa-history .recording {width: 420px;}

.tbl-riyou-report.contractor .date-time {width: 168px;}
.tbl-riyou-report.contractor .count {width: 72px;}
.tbl-riyou-report.contractor .colspan {width: 188px;border-left: solid 1px #888;}
.tbl-riyou-report.contractor .time {width: 100px;}
.tbl-riyou-report.contractor .time2 {width: 120px;}
.tbl-riyou-report.contractor .auto {width: auto;}
.tbl-riyou-report.contractor .text {width: 190px;}
.tbl-riyou-report.contractor .agency {width: 120px;}
.tbl-riyou-report.contractor .term {width: 200px;}

.tbl-riyou-report.contractor thead tr:first-child {height: 18px;}
.tbl-riyou-report.contractor thead tr:nth-child(2) {height: 32px;}
.tbl-riyou-report.contractor tbody td.bg-u69 {background: #e6f5ff;color: #2e547d;}
.tbl-riyou-report.contractor tbody td.bg-o70 {background: #fff6b5;color: #7a5d08;}
.tbl-riyou-report.contractor tbody td.bg-o90 {background: #ffd6da;color: #9b2833;}

.tbl-riyou-report.information .date-time {width: 120px;}
.tbl-riyou-report.information .auto {width: auto;}
.tbl-riyou-report.information .text-pre {
  white-space: pre-line;
  overflow-x: auto;
}
.tbl-riyou-report.information .info-title {
  font-size: 14px;
  font-weight: bold;
}
.tbl-riyou-report.information td {
  vertical-align: baseline;
}

.term-select {
  display: flex;
}
.term-select .term {
  display: flex;
  flex-grow: 1;
  padding: 0.6125rem 1rem;
  color: #666;
  font-weight: bold;
  justify-content: center;
  align-items: center;
  border-radius: 0.25rem;
  margin: 0 0.5rem;
  background: #EEE;
}
@media (max-width: 767px) {
  .term-select .term {
    font-size: 0.875rem;
  }
}
.explanatoryNotes table tr th {width: 14rem;padding-left: 1rem;padding-right: 1rem;background: #eaf4f3;text-align: right;}
.explanatoryNotes table tr td {padding-left: 1rem;padding-right: 1rem;}
@media (max-width: 767px) {
  .explanatoryNotes table tr th {
    width: 9rem;
    text-align: left;
  }
}

.tbl-user-list {
  width: 100%; }

.tbl-user-list thead {
  background-color: #888;
  color: #fff; }

.tbl-user-list thead tr {
  height: 44px; }

.tbl-user-list th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-user-list th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-user-list th:first-child {
  width: 120px; }

.tbl-user-list th:nth-child(2) {
  width: 120px; }

.tbl-user-list th:nth-child(3) {
  width: 100px; }

.tbl-user-list th:nth-child(4) {
  width: 160px; }

.tbl-user-list th:nth-child(5) {
}

.tbl-user-list th:nth-child(6) {
  width: 120px; }

.tbl-user-list th:nth-child(7) {
  width: 320px; }

.tbl-user-list th:nth-child(8) {
  width: 120px; }



.tbl-user-list td:first-child {
  text-align: center; }

.tbl-user-list td:nth-child(2) {
  text-align: center; }

.tbl-user-list td:nth-child(3) {
  text-align: center; }

.tbl-user-list td:nth-child(4) {
  text-align: left; }

.tbl-user-list td:nth-child(5) {
  text-align: left; }

.tbl-user-list td:nth-child(6) {
  text-align: left; }

.tbl-user-list td:nth-child(7) {
  text-align: left; }

.tbl-user-list td:nth-child(8) {
  text-align: center; }





.tbl-user-list tbody tr {
  height: 50px;
  color: #444; }

.tbl-user-list tbody tr:nth-child(2n+1) {
  background-color: #fff; }

.tbl-user-list tbody tr:nth-child(2n) {
  background-color: #F6F6F6; }

.tbl-user-list td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px; }


































/*-----  グループメンテナンス  -----*/
.tbl-group {
  width: 100%; }

.tbl-group thead {
  background-color: #777;
  color: #fff; }

.tbl-group thead tr {
  height: 44px; }

.tbl-group th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-group th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-group td:first-child {
  width: 8%;
  text-align: center; }

.tbl-group td:nth-child(2) {
  width: 10%;
  text-align: center; }

.tbl-group td:nth-child(3) {
  text-align: left; }

.tbl-group td:nth-child(4) {
  width: 10%;
  text-align: right; }

.tbl-group td:nth-child(5) {
  width: 12%;
  text-align: center; }

.tbl-group td:nth-child(6) {
  width: 12%;
  text-align: center; }

.tbl-group td:nth-child(7) {
  width: 12%;
  text-align: center; }

.tbl-group tbody tr {
  height: 62px;
  color: #444; }

.tbl-group tbody tr:nth-child(2n+1) {
  background-color: #fff; }

.tbl-group tbody tr:nth-child(2n) {
  background-color: #F6F6F6; }

.tbl-group td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px; }

/*-----  グループメンテナンス  -----*/
.tbl-group-dialog-header {
  width: 100%; }

.tbl-group-dialog-header thead {
  background-color: #777;
  color: #fff; }

.tbl-group-dialog-header thead tr {
  height: 44px; }

.tbl-group-dialog-header th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-group-dialog-header th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-group-dialog-header th:first-child {
  width: 60px; }

.tbl-group-dialog-header th:nth-child(2) {
  width: 130px; }

.tbl-group-dialog-header th:nth-child(3) {
  width: 466px; }

/*-----  グループメンテナンス  -----*/
.tbl-group-dialog {
  width: 100%; }

.tbl-group-dialog thead {
  background-color: #777;
  color: #fff; }

.tbl-group-dialog thead tr {
  height: 44px; }

.tbl-group-dialog th {
  padding: 4px 7px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-group-dialog th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-group-dialog td:first-child {
  width: 60px;
  text-align: center; }

.tbl-group-dialog td:nth-child(2) {
  width: 130px;
  text-align: center; }

.tbl-group-dialog td:nth-child(3) {
  width: 466px;
  text-align: left; }

.tbl-group-dialog td:nth-child(4) {
  text-align: right; }

.tbl-group-dialog tbody tr {
  height: 50px;
  color: #444; }

.tbl-group-dialog tbody tr:nth-child(2n+1) {
  background-color: #fff; }

.tbl-group-dialog tbody tr:nth-child(2n) {
  background-color: #F6F6F6; }

.tbl-group-dialog td {
  padding: 6px;
  border: 1px solid #ddd;
  font-size: 12px; }

/*-----  クリーニングリスト  -----*/
.tbl-cleaning {
  width: 100%; }

.tbl-cleaning thead {
  background-color: #777;
  color: #fff; }

.tbl-cleaning thead tr {
  height: 44px; }

.tbl-cleaning th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-cleaning th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-cleaning th:nth-child(1) {
  width: 8%; }

.tbl-cleaning th:nth-child(3) {
  width: 8%; }

.tbl-cleaning th:nth-child(4) {
  width: 10%; }

.tbl-cleaning th:nth-child(5) {
  width: 10%; }

.tbl-cleaning th:nth-child(6) {
  width: 8%; }

.tbl-cleaning th:nth-child(7) {
  width: 8%; }

.tbl-cleaning td:nth-child(1) {
  text-align: center; }

.tbl-cleaning td:nth-child(2) {
  text-align: left; }

.tbl-cleaning td:nth-child(3) {
  text-align: center; }

.tbl-cleaning td:nth-child(4) {
  text-align: center; }

.tbl-cleaning td:nth-child(5) {
  text-align: center; }

.tbl-cleaning td:nth-child(6) {
  text-align: center; }

.tbl-cleaning td:nth-child(7) {
  text-align: right; }

.tbl-cleaning tbody tr {
  height: 62px;
  color: #444; }

.tbl-cleaning tbody tr:nth-child(2n+1) {
  background-color: #fff; }

.tbl-cleaning tbody tr:nth-child(2n) {
  background-color: #F6F6F6; }

.tbl-cleaning td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px; }

/*-----  メンテナンス履歴（宛先）  -----*/
.tbl-rireki-atesaki {
  width: 100%; }

.tbl-rireki-atesaki thead {
  background-color: #777;
  color: #fff; }

.tbl-rireki-atesaki thead tr {
  height: 44px; }

.tbl-rireki-atesaki th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-rireki-atesaki th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-rireki-atesaki th:first-child {
  width: 14%; }

.tbl-rireki-atesaki th:nth-child(2) {
  width: 8%; }

.tbl-rireki-atesaki th:nth-child(3) {
  width: 8%; }

.tbl-rireki-atesaki th:nth-child(5) {
  width: 8%; }

.tbl-rireki-atesaki th:nth-child(6) {
  width: 10%; }

.tbl-rireki-atesaki th:nth-child(7) {
  width: 8%; }

.tbl-rireki-atesaki th:nth-child(8) {
  width: 8%; }

.tbl-rireki-atesaki td:first-child {
  text-align: center; }

.tbl-rireki-atesaki td:nth-child(2) {
  text-align: center; }

.tbl-rireki-atesaki td:nth-child(3) {
  text-align: center; }

.tbl-rireki-atesaki td:nth-child(4) {
  text-align: left; }

.tbl-rireki-atesaki td:nth-child(5) {
  text-align: center; }

.tbl-rireki-atesaki td:nth-child(6) {
  text-align: center; }

.tbl-rireki-atesaki td:nth-child(7) {
  text-align: center; }

.tbl-rireki-atesaki td:nth-child(8) {
  text-align: center; }

.tbl-rireki-atesaki tbody tr {
  height: 62px;
  color: #444;
  background-color: #fff; }

/*
.tbl-rireki-atesaki tbody tr:nth-child(2n+1){
	background-color: #fff;
}

.tbl-rireki-atesaki tbody tr:nth-child(2n){
	background-color: #F6F6F6;
}
*/
.tbl-rireki-atesaki td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px; }

/*-----  メンテナンス履歴（グループ）  -----*/
.tbl-rireki-group {
  width: 100%; }

.tbl-rireki-group thead {
  background-color: #777;
  color: #fff; }

.tbl-rireki-group thead tr {
  height: 44px; }

.tbl-rireki-group th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-rireki-group th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-rireki-group th:first-child {
  width: 16%; }

.tbl-rireki-group th:nth-child(2) {
  width: 16%; }

.tbl-rireki-group th:nth-child(3) {
  width: 16%; }

.tbl-rireki-group th:nth-child(4) {
  width: 16%; }

.tbl-rireki-group th:nth-child(5) {
  width: 16%; }

.tbl-rireki-group th:nth-child(6) {
  width: 20%; }

.tbl-rireki-group td:first-child {
  text-align: center; }

.tbl-rireki-group td:nth-child(2) {
  text-align: center; }

.tbl-rireki-group td:nth-child(3) {
  text-align: center; }

.tbl-rireki-group td:nth-child(4) {
  text-align: center; }

.tbl-rireki-group td:nth-child(5) {
  text-align: left; }

.tbl-rireki-group tbody tr {
  height: 62px;
  color: #444;
  background-color: #fff; }

/*
.tbl-rireki-group tbody tr:nth-child(2n+1){
	background-color: #fff;
}

.tbl-rireki-group tbody tr:nth-child(2n){
	background-color: #F6F6F6;
}
*/
.tbl-rireki-group td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px; }

/*-----  原稿設定  -----*/
.tbl-genkou {
  width: 100%; }

.tbl-genkou thead {
  background-color: #777;
  color: #fff; }

.tbl-genkou thead tr {
  height: 33px; }

.tbl-genkou th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-genkou th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-genkou th:nth-child(2) {
  width: 10%; }

.tbl-genkou th:nth-child(3) {
  width: 10%; }

.tbl-genkou th:nth-child(4) {
  width: 10%; }

.tbl-genkou th:nth-child(5) {
  width: 20%; }

.tbl-genkou th:nth-child(6) {
  width: 10%; }

.tbl-genkou th:nth-child(7) {
  width: 10%; }

.tbl-genkou th:nth-child(8) {
  width: 10%; }

.tbl-genkou td:first-child {
  text-align: left; }

.tbl-genkou td:nth-child(2) {
  text-align: center; }

.tbl-genkou td:nth-child(3) {
  text-align: center; }

.tbl-genkou td:nth-child(4) {
  text-align: center; }

.tbl-genkou td:nth-child(5) {
  text-align: center; }

.tbl-genkou td:nth-child(6) {
  text-align: center; }

.tbl-genkou td:nth-child(7) {
  text-align: center; }

.tbl-genkou td:nth-child(8) {
  text-align: center; }

.tbl-genkou td img {
  width: 90%;
  height: auto;
  margin: 0 auto; }

.tbl-genkou tbody tr {
  height: 62px;
  color: #444; }

.tbl-genkou tbody tr:nth-child(2n+1) {
  background-color: #fff; }

.tbl-genkou tbody tr:nth-child(2n) {
  background-color: #F6F6F6; }

.tbl-genkou td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px; }

/* メンテナンス履歴（宛先） ---------------------------------------------- */
.tbl-rireki-atesaki .td01 {
  text-align: center !important; }

.tbl-rireki-atesaki .td02 {
  text-align: center !important; }

.tbl-rireki-atesaki .td03 {
  text-align: center !important; }

.tbl-rireki-atesaki .td04 {
  text-align: left !important; }

.tbl-rireki-atesaki .td05 {
  text-align: center !important; }

.tbl-rireki-atesaki .td06 {
  text-align: left !important; }

.tbl-rireki-atesaki .td07 {
  text-align: center !important; }

.tbl-rireki-atesaki .td08 {
  text-align: left !important; }

/*-----  送信工程－宛先一覧  -----*/
.tbl-soushin-atesaki {
  width: 100%; }

.tbl-soushin-atesaki thead {
  background-color: #777;
  color: #fff; }

.tbl-soushin-atesaki thead tr {
  height: 44px; }

.tbl-soushin-atesaki th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-soushin-atesaki th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-soushin-atesaki th:first-child {
  width: 8%; }

.tbl-soushin-atesaki th:nth-child(2) {
  width: 8%; }

.tbl-soushin-atesaki th:nth-child(3) {
  width: 16%; }

.tbl-soushin-atesaki th:nth-child(4) {
  width: 16%; }

.tbl-soushin-atesaki th:nth-child(5) {
  width: 8%; }

.tbl-soushin-atesaki th:nth-child(6) {
  width: 10%; }

.tbl-soushin-atesaki th:nth-child(7) {
  width: 8%; }

.tbl-soushin-atesaki td:first-child {
  text-align: center; }

.tbl-soushin-atesaki td:nth-child(2) {
  text-align: center; }

.tbl-soushin-atesaki td:nth-child(3) {
  text-align: left; }

.tbl-soushin-atesaki td:nth-child(4) {
  text-align: left; }

.tbl-soushin-atesaki td:nth-child(5) {
  text-align: center; }

.tbl-soushin-atesaki td:nth-child(6) {
  text-align: center; }

.tbl-soushin-atesaki td:nth-child(7) {
  text-align: center; }

.tbl-soushin-atesaki tbody tr {
  height: 62px;
  color: #444; }

.tbl-soushin-atesaki tbody tr:nth-child(2n+1) {
  background-color: #fff; }

.tbl-soushin-atesaki tbody tr:nth-child(2n) {
  background-color: #F6F6F6; }

.tbl-soushin-atesaki td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px; }

.tbl-fax-kakunin {
  width: 100%;
  margin-bottom: 14px; }

.tbl-fax-kakunin thead {
  background-color: #777;
  color: #fff; }

.tbl-fax-kakunin thead tr {
  height: 33px; }

.tbl-fax-kakunin th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-fax-kakunin th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-fax-kakunin th:nth-child(2) {
  width: 10%; }

.tbl-fax-kakunin th:nth-child(3) {
  width: 10%; }

.tbl-fax-kakunin th:nth-child(4) {
  width: 10%; }

.tbl-fax-kakunin td:first-child {
  text-align: left; }

.tbl-fax-kakunin td:nth-child(2) {
  text-align: center; }

.tbl-fax-kakunin td:nth-child(3) {
  text-align: center; }

.tbl-fax-kakunin td:nth-child(4) {
  text-align: center; }

.tbl-fax-kakunin td img {
  width: 90%;
  height: auto;
  margin: 0 auto; }

.tbl-fax-kakunin tbody tr {
  height: 62px;
  color: #444; }

.tbl-fax-kakunin tbody tr:nth-child(2n+1) {
  background-color: #fff; }

.tbl-fax-kakunin tbody tr:nth-child(2n) {
  background-color: #F6F6F6; }

.tbl-fax-kakunin td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px; }

.tbl-title {
  font-weight: bold;
  font-size: 14px; }

.tbl-fax-atesaki {
  width: 100%;
  margin-bottom: 14px; }

.tbl-fax-atesaki thead {
  background-color: #777;
  color: #fff; }

.tbl-fax-atesaki thead tr {
  height: 33px; }

.tbl-fax-atesaki th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-fax-atesaki th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-fax-atesaki th:first-child {
  width: 140px; }

.tbl-fax-atesaki th:nth-child(2) {
  width: 10%; }

.tbl-fax-atesaki th:nth-child(3) {
  width: 10%; }

.tbl-fax-atesaki th:nth-child(4) {
  width: 10%; }

.tbl-fax-atesaki td:first-child {
  width: 140px;
  text-align: left; }

.tbl-fax-atesaki td:nth-child(2) {
  width: 506px;
  text-align: center; }

.tbl-fax-atesaki td:nth-child(3) {
  width: 100px;
  text-align: center; }

.tbl-fax-atesaki td:nth-child(4) {
  text-align: center; }

.tbl-fax-atesaki td img {
  width: 90%;
  height: auto;
  margin: 0 auto; }

.tbl-fax-atesaki tbody tr {
  height: 62px;
  color: #444; }

.tbl-fax-atesaki tbody tr:nth-child(2n+1) {
  background-color: #fff; }

.tbl-fax-atesaki tbody tr:nth-child(2n) {
  background-color: #F6F6F6; }

.tbl-fax-atesaki td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px; }

.tbl-fax-atesaki-header {
  width: 100%; }

.tbl-fax-atesaki-header thead {
  background-color: #777;
  color: #fff; }

.tbl-fax-atesaki-header thead tr {
  height: 44px; }

.tbl-fax-atesaki-header th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-fax-atesaki-header th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-fax-atesaki-header th:first-child {
  width: 140px; }

.tbl-fax-atesaki-header th:nth-child(3) {
  width: 100px; }

.tbl-fax-atesaki-header th:nth-child(4) {
  width: 140px; }

.tbl-rirekimeisai-dialog {
  width: 100%;
  margin-bottom: 14px; }

.tbl-rirekimeisai-dialog thead {
  background-color: #777;
  color: #fff; }

.tbl-rirekimeisai-dialog thead tr {
  height: 33px; }

.tbl-rirekimeisai-dialog th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-rirekimeisai-dialog th a {
  text-decoration: none;
  color: #BBEEFF;
  width: 100%; }

.tbl-rirekimeisai-dialog th:first-child {
  width: 14%; }

.tbl-rirekimeisai-dialog th:nth-child(3) {
  width: 14%; }

.tbl-rirekimeisai-dialog th:nth-child(4) {
  width: 8%; }

.tbl-rirekimeisai-dialog th:nth-child(5) {
  width: 8%; }

.tbl-rirekimeisai-dialog th:nth-child(6) {
  width: 14%; }

.tbl-rirekimeisai-dialog th:nth-child(7) {
  width: 14%; }

.tbl-rirekimeisai-dialog td:first-child {
  text-align: center; }

.tbl-rirekimeisai-dialog td:nth-child(2) {
  text-align: left; }

.tbl-rirekimeisai-dialog td:nth-child(3) {
  text-align: left; }

.tbl-rirekimeisai-dialog td:nth-child(4) {
  text-align: right; }

.tbl-rirekimeisai-dialog td:nth-child(5) {
  text-align: right; }

.tbl-rirekimeisai-dialog td:nth-child(6) {
  text-align: right; }

.tbl-rirekimeisai-dialog td:nth-child(7) {
  text-align: center; }

.tbl-rirekimeisai-dialog td img {
  width: 90%;
  height: auto;
  margin: 0 auto; }

.tbl-rirekimeisai-dialog tbody tr {
  height: 62px;
  color: #444; }

.tbl-rirekimeisai-dialog tbody tr:nth-child(2n+1) {
  background-color: #fff; }

.tbl-rirekimeisai-dialog tbody tr:nth-child(2n) {
  background-color: #F6F6F6; }

.tbl-rirekimeisai-dialog td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px; }

/*-----  検索条件  -----*/
.search-term {
  width: 100%;
  /*min-width: 1200px;*/
  background-color: #eee;
  margin-bottom: 21px;
  padding: 14px 21px;
  border-radius: 4px;
  box-sizing: border-box;
  color: #444;
  display: flex;
  flex-wrap: wrap;
}
@media (max-width: 1023px) {
  .search-term {
    min-width: auto;
    padding: 0.75rem;
    font-size: 0.8rem;
  }
}
@media (max-width: 767px) {
  .search-term {
    min-width: auto;
    padding: 0.75rem;
    font-size: 0.8rem;
    grid-column-gap: unset;
    grid-row-gap: unset;
  }
}

.search-term-right{
 	width: 100%;
 	text-align: right;
}

.tbl th span{
	display: inline-block;
	width: 100%;
	line-height: 40px;
	margin: 0 auto;
}
/*
.search-term-riyou{
  grid-template-rows: 44px 44px 44px;
  grid-template-columns: 120px 250px 120px 250px 120px 1fr;
}
.search-term-riyou div:first-child {
  grid-column: 1 / 1;
  grid-row   : 1 / 1;
}
.search-term-riyou div:nth-child(2) {
  grid-column: 2 / 4;
  grid-row   : 1 / 1;
}
.search-term-riyou div:nth-child(3) {
  grid-column: 5 / 5;
  grid-row   : 1 / 1;
}
.search-term-riyou div:nth-child(4) {
  grid-column: 6 / 6;
  grid-row   : 1 / 1;
}
.search-term-riyou div:nth-child(5) {
  grid-column: 1 / 1;
  grid-row   : 2 / 2;
}
.search-term-riyou div:nth-child(6) {
  grid-column: 2 / 2;
  grid-row   : 2 / 2;
}
.search-term-riyou div:nth-child(7) {
  grid-column: 3 / 3;
  grid-row   : 2 / 2;
}
.search-term-riyou div:nth-child(8) {
  grid-column: 4 / 4;
  grid-row   : 2 / 2;
}
.search-term-riyou div:nth-child(9) {
  grid-column: 5 / 5;
  grid-row   : 2 / 2;
}
.search-term-riyou div:nth-child(10) {
  grid-column: 6 / 6;
  grid-row   : 2 / 2;
}
.search-term-riyou div:nth-child(11) {
  grid-column: 6 / 6;
  grid-row   : 3 / 3;
}


.search-term-user-list{
  grid-template-rows: 54px 54px 54px 54px;
  grid-template-columns: 120px 250px 120px 250px 120px 1fr;
}
.search-term-user-list div:first-child {
  grid-column: 1 / 1;
  grid-row   : 1 / 1;
}
.search-term-user-list div:nth-child(2) {
  grid-column: 2 / 4;
  grid-row   : 1 / 1;
}
.search-term-user-list div:nth-child(3) {
  grid-column: 5 / 5;
  grid-row   : 1 / 1;
}
.search-term-user-list div:nth-child(4) {
  grid-column: 6 / 6;
  grid-row   : 1 / 1;
}
.search-term-user-list div:nth-child(5) {
  grid-column: 1 / 1;
  grid-row   : 2 / 2;
}
.search-term-user-list div:nth-child(6) {
  grid-column: 2 / 2;
  grid-row   : 2 / 2;
}
.search-term-user-list div:nth-child(7) {
  grid-column: 3 / 3;
  grid-row   : 2 / 2;
}
.search-term-user-list div:nth-child(8) {
  grid-column: 4 / 4;
  grid-row   : 2 / 2;
}
.search-term-user-list div:nth-child(9) {
  grid-column: 5 / 5;
  grid-row   : 2 / 2;
}
.search-term-user-list div:nth-child(10) {
  grid-column: 6 / 6;
  grid-row   : 2 / 2;
}
.search-term-user-list div:nth-child(11) {
  grid-column: 1 / 1;
  grid-row   : 3 / 3;
}
.search-term-user-list div:nth-child(12) {
  grid-column: 2 / 2;
  grid-row   : 3 / 3;
}
.search-term-user-list div:nth-child(13) {
  grid-column: 3 / 3;
  grid-row   : 3 / 3;
}
.search-term-user-list div:nth-child(14) {
  grid-column: 4 / 4;
  grid-row   : 3 / 3;
}
.search-term-user-list div:nth-child(15) {
  grid-column: 6 / 6;
  grid-row   : 4 / 4;
}
.search-term-total-monthly{
  grid-template-rows: 54px 54px 54px;
  grid-template-columns: 120px 360px 120px 1fr;
}
.search-term-total-monthly div:first-child {
  grid-column: 1/ 2;
  grid-row   : 1 / 1;
}
.search-term-total-monthly div:nth-child(2) {
  grid-column: 2 / 3;
  grid-row   : 1 / 1;
}
.search-term-total-monthly div:nth-child(3) {
  grid-column: 3 / 4;
  grid-row   : 1 / 1;
}
.search-term-total div:nth-child(4) {
  grid-column: 4 / 5;
  grid-row   : 1 / 1;
}
.search-term-total-monthly div:nth-child(5) {
  grid-column: 1 / 2;
  grid-row   : 2 / 2;
}
.search-term-total-monthly div:nth-child(6) {
  grid-column: 2 / 3;
  grid-row   : 2 / 2;
}
.search-term-total-monthly div:nth-child(7) {
  grid-column: 5 / 5;
  grid-row   : 3 / 3;
}

.search-term-total-daily{
  grid-template-rows: 54px 54px 54px;
  grid-template-columns: 120px 360px 120px 1fr;
}

.search-term-total-daily div:first-child {
  grid-column: 1/ 2;
  grid-row   : 1 / 1;
}
.search-term-total-daily div:nth-child(2) {
  grid-column: 2 / 3;
  grid-row   : 1 / 1;
}
.search-term-total-daily div:nth-child(3) {
  grid-column: 3 / 4;
  grid-row   : 1 / 1;
}
.search-term-total-daily div:nth-child(4) {
  grid-column: 4 / 5;
  grid-row   : 1 / 1;
}
.search-term-total-daily div:nth-child(5) {
  grid-column: 1 / 2;
  grid-row   : 2 / 2;
}
.search-term-total-daily div:nth-child(6) {
  grid-column: 2 / 4;
  grid-row   : 2 / 2;
}
.search-term-total-daily div:nth-child(7) {
  grid-column: 4 / 4;
  grid-row   : 3 / 3;
}



.search-term-report-tsuuwa {
  grid-template-columns: 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 1fr;
  grid-template-rows: 50px 50px 50px;
}
.search-term-report-tsuuwa div:first-child {
  grid-column: 1 / 3;
  grid-row   : 1 / 2;
}
.search-term-report-tsuuwa div:nth-child(2) {
  grid-column: 3 / 14;
  grid-row   : 1 / 2;
}
.search-term-report-tsuuwa div:nth-child(2) .hasDatepicker {
  width: 120px;
}
.search-term-report-tsuuwa div:nth-child(3) {
  grid-column: 14 / 16;
  grid-row   : 1 / 2;
}
.search-term-report-tsuuwa div:nth-child(4) {
  grid-column: 16 / 24;
  grid-row   : 1 / 2;
}
.search-term-report-tsuuwa div:nth-child(5) {
  grid-column: 1 / 3;
  grid-row   : 2 / 3;
}
.search-term-report-tsuuwa div:nth-child(6) {
  grid-column: 3 / 9;
  grid-row   : 2 / 3;
}
.search-term-report-tsuuwa div:nth-child(7) {
  grid-column: 9 / 11;
  grid-row   : 2 / 3;
}
.search-term-report-tsuuwa div:nth-child(8) {
  grid-column: 11 / 20;
  grid-row   : 2 / 3;
  width: 100%;
}
.search-term-report-tsuuwa div:nth-child(8) select {
  width: 100%;
}
.search-term-report-tsuuwa div:nth-child(9) {
  grid-column: 1 / 3;
  grid-row   : 3 / 4;
}
.search-term-report-tsuuwa div:nth-child(10) {
  grid-column: 3 / 11;
  grid-row   : 3 / 4;
  width: 100%;
}
.search-term-report-tsuuwa div:nth-child(10) select {
  width: 100%;
}
.search-term-report-tsuuwa div:nth-child(11) {
  grid-column: 11 / 14;
  grid-row   : 3 / 4;
}
.search-term-report-tsuuwa div:nth-child(12) {
  grid-column: 14 / 20;
  grid-row   : 3 / 4;
  width: 100%;
}
.search-term-report-tsuuwa div:nth-child(12) input {
  width: 100%;
}
.search-term-report-tsuuwa div:last-child {
  grid-column: 20 / 25;
  grid-row   : 3 / 4;
}
@media (max-width: 767px) {
  .search-term-report-tsuuwa {
    display: flex;
    flex-direction: column;
  }
  .search-term-report-tsuuwa div:nth-child(2) .hasDatepicker+span.small {
    display: block;
    margin: 0 0 0.25rem !important;
  }
}


.search-term-report-monthly {
  grid-template-columns: 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 1fr;
  grid-template-rows: 50px 50px 50px;
}
.search-term-report-monthly div:first-child {
  grid-column: 1 / 3;
  grid-row   : 1 / 2;
}
.search-term-report-monthly div:nth-child(2) {
  grid-column: 3 / 16;
  grid-row   : 1 / 2;
}
.search-term-report-monthly div:nth-child(3) {
  grid-column: 1 / 3;
  grid-row   : 2 / 3;
}
.search-term-report-monthly div:nth-child(4) {
  grid-column: 3 / 11;
  grid-row   : 2 / 3;
  width: 100%;
}
.search-term-report-monthly div:nth-child(4) select {
  width: 100%;
}
.search-term-report-monthly div:nth-child(5) {
  grid-column: 12 / 14;
  grid-row   : 2 / 3;
}
.search-term-report-monthly div:nth-child(6) {
  grid-column: 14 / 22;
  grid-row   : 2 / 3;
  width: 100%;
}
.search-term-report-monthly div:nth-child(6) select {
  width: 100%;
}
.search-term-report-monthly div:nth-child(7) {
  grid-column: 1 / 3;
  grid-row   : 3 / 4;
}
.search-term-report-monthly div:nth-child(8) {
  grid-column: 3 / 8;
  grid-row   : 3 / 4;
  width: 100%;
}
.search-term-report-monthly div:nth-child(8) input {
  width: 100%;
}
.search-term-report-monthly div:last-child {
  grid-column: 11 / 25;
  grid-row   : 3 / 4;
}
@media (max-width: 767px) {
  .search-term-report-monthly {
    display: flex;
    flex-direction: column;
  }
}


.search-term-tsuuwa-history {
  grid-template-columns: 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 1fr;
  grid-template-rows: 50px 50px 50px;
}
.search-term-tsuuwa-history div:first-child {
  grid-column: 1 / 3;
  grid-row   : 1 / 2;
}
.search-term-tsuuwa-history div:nth-child(2) {
  grid-column: 3 / 14;
  grid-row   : 1 / 2;
}
.search-term-tsuuwa-history div:nth-child(2) .hasDatepicker {
  width: 120px;
}
.search-term-tsuuwa-history div:nth-child(3) {
  grid-column: 14 / 16;
  grid-row   : 1 / 2;
}
.search-term-tsuuwa-history div:nth-child(4) {
  grid-column: 16 / 24;
  grid-row   : 1 / 2;
}
.search-term-tsuuwa-history div:nth-child(5) {
  grid-column: 1 / 3;
  grid-row   : 2 / 3;
}
.search-term-tsuuwa-history div:nth-child(6) {
  grid-column: 3 / 12;
  grid-row   : 2 / 3;
  width: 100%;
}
.search-term-tsuuwa-history div:nth-child(7) {
  grid-column: 1 / 3;
  grid-row   : 3 / 4;
}
.search-term-tsuuwa-history div:nth-child(8) {
  grid-column: 3 / 12;
  grid-row   : 3 / 4;
  width: 100%;
}
.search-term-tsuuwa-history div:nth-child(6) input,
.search-term-tsuuwa-history div:nth-child(8) input {
  width: 100%;
}
.search-term-tsuuwa-history div:last-child {
  grid-column: 20 / 25;
  grid-row   : 3 / 4;
}
@media (max-width: 767px) {
  .search-term-tsuuwa-history {
    display: flex;
    flex-direction: column;
  }
  .search-term-tsuuwa-history div:nth-child(2) .hasDatepicker+span.small {
    display: block;
    margin: 0 0 0.25rem !important;
  }
}

.search-term-agency-report {
  grid-template-columns: 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 40px 1fr;
  grid-template-rows: 50px 50px 50px;
}
.search-term-agency-report div:first-child {
  grid-column: 1 / 3;
  grid-row   : 1 / 2;
}
.search-term-agency-report div:nth-child(2) {
  grid-column: 3 / 14;
  grid-row   : 1 / 2;
  width: 100%;
}
.search-term-agency-report div:nth-child(2) .hasDatepicker {
  width: 120px;
}
.search-term-agency-report div:nth-child(3) {
  grid-column: 1 / 3;
  grid-row   : 2 / 3;
}
.search-term-agency-report div:nth-child(4) {
  grid-column: 3 / 12;
  grid-row   : 2 / 3;
  width: 100%;
}
.search-term-agency-report div:nth-child(5) {
  grid-column: 1 / 3;
  grid-row   : 3 / 4;
}
.search-term-agency-report div:nth-child(6) {
  grid-column: 3 / 12;
  grid-row   : 3 / 4;
  width: 100%;
}
.search-term-agency-report div:nth-child(4) input,
.search-term-agency-report div:nth-child(6) input {
  width: 100%;
}
.search-term-agency-report div:last-child {
  grid-column: 20 / 25;
  grid-row   : 3 / 4;
}
@media (max-width: 767px) {
  .search-term-agency-report {
    display: flex;
    flex-direction: column;
  }
  .search-term-agency-report div:nth-child(2) .hasDatepicker+span.small {
    display: block;
    margin: 0 0 0.25rem !important;
  }
} 
*/



/*-----  検索条件（グループ）  -----*/
.search-term-group {
  width: 100%;
  background-color: #eee;
  margin-bottom: 21px;
  padding: 11px;
  border-radius: 4px;
  box-sizing: border-box;
  color: #444;
  display: grid;
  grid-template-rows: 44px;
  grid-template-columns: 140px 250px 140px 250px 140px 1fr; }

/*-----  検索条件（クリーニング）  -----*/
.search-term-cleaning {
  width: 100%;
  background-color: #eee;
  margin-bottom: 21px;
  padding: 11px;
  border-radius: 4px;
  box-sizing: border-box;
  color: #444;
  display: grid;
  grid-template-rows: 44px 44px;
  grid-template-columns: 140px 250px 140px 250px 140px 1fr; }

/*-----  検索条件（クメンテナンス履歴（宛先））  -----*/
.search-term-rireki-atesaki {
  width: 100%;
  background-color: #eee;
  margin-bottom: 21px;
  padding: 11px;
  border-radius: 4px;
  box-sizing: border-box;
  color: #444;
  display: grid;
  grid-auto-rows: minmax(55px, max-content);
  grid-template-columns: 120px 210px 180px 300px 340px 1fr; }

/*-----  検索条件（クメンテナンス履歴（グループ））  -----*/
.search-term-rireki-group {
  width: 100%;
  background-color: #eee;
  margin-bottom: 21px;
  padding: 11px;
  border-radius: 4px;
  box-sizing: border-box;
  color: #444;
  display: grid;
  grid-template-rows: 44px;
  grid-template-columns: 150px 250px 150px 250px 150px 1fr; }

/* grid */
.grid-item {
  vertical-align: middle;
  line-height: 44px; }

.grid-midashi {
  text-align: right;
  vertical-align: middle; }

.grid-cell {
  flex: 1; }

.cell-left {
  text-align: left; }

.cell-right {
  text-align: right; }

/* ユーティリティ */
.margin-right {
  margin-right: 7px; }

.margin-left {
  margin-left: 14px; }

/* msg -------------------------------------------------------- */
.msg {
  box-sizing: border-box;
  width: 100%;
  border-radius: 4px;
  padding: 14px 28px;
  margin-bottom: 14px;
  font-size: 15px; }

.msg-info {
  border: 1px solid #a0d8ef;
  background-color: #a0d8ef; }

.msg-error {
  background-color: #FAE5E3;
  color: #f00; }

.msg-error i {
  margin-right: 6px;
  position: relative;
  top: 2px; }

/* alert ------------------------------------------------------ */
.alert {
  box-sizing: border-box;
  width: 100%;
  border-radius: 4px;
  padding: 14px 28px;
  margin-bottom: 14px;
  font-size: 15px; }

.alert-info {
  border: 1px solid #ebf7fd;
  background-color: #ebf7fd; }

.alert-error {
  background-color: #FAE5E3;
  color: #f00; }

.alert-error i {
  margin-right: 6px;
  position: relative;
  top: 2px; }

.alt {
  box-sizing: border-box;
  width: 100%;
  border-radius: 4px;
  padding: 14px 28px;
  margin-top: 14px;
  margin-bottom: 14px;
  font-size: 15px; }

.alt-info {
  border: 1px solid #ebf7fd;
  background-color: #ebf7fd;
  color: #2d7091; }

.alt-success {
  border: 1px solid #f0f9eb;
  background-color: #f0f9eb;
  color: #67c23a; }

.alt-warning {
  border: 1px solid #fdf6ec;
  background-color: #fdf6ec;
  color: #e6a23c; }

.alt-error {
  background-color: #FAE5E3;
  color: #f00; }

.alt i {
  margin-right: 6px;
  position: relative;
  top: 2px; }

/* dialog ----------------------------------------------------- */
.dlg {
  /*	box-sizing: border-box;*/
  padding: 28px;
  background-color: #fff; }

.dlg-large {
  width: 1024px; }

.dlg-medium {
  width: 896px; }

.dlg-small {
  width: 768px; }

.dlg-header {
  width: 100%;
  margin-bottom: 11px; }

.dlg-main {
  width: 100%;
  margin-bottom: 21px; }

.dlg-footer {
  width: 100%; }

.dlg-title {
  color: #338CE6;
  font-size: 24px;
  margin-bottom: 4px; }

.dlg-desc {
  color: #333333;
  font-size: 14px; }

.dlg-frame {
  box-sizing: border-box;
  width: 100%;
  padding: 28px 28px;
  background-color: #f8f8f8;
  border-radius: 4px;
  text-align: left;
  font-size: 16px;
  line-height: 28px; }

.dlg-frame-title {
  font-weight: bold;
  font-size: 18px;
  color: #333; }

.dlg-frame-desc {
  line-height: 40px; }

.dlg-waiting {
  border-radius: 6px;
  border: 6px solid #D6E5F3; }

.dlg-waiting-icon {
  text-align: center;
  color: #ADCBE7;
  font-size: 100px;
  height: 120px; }

.dlg-waiting-icon-refresh {
  padding: 14px 0px 28px 0px;
  text-align: center;
  color: #ADCBE7;
  font-size: 80px;
  height: 120px; }

/* icon ------------------------------------------------------- */
.icon-rotate {
  display: inline-block;
  /*	animation: r1 1s linear infinite;
		transform-origin:center center;*/ }

@keyframes r1 {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }
/* dialog ----------------------------------------------------- */
.dlg-waiting-title {
  text-align: center;
  color: #338CE6;
  font-size: 24px;
  margin-bottom: 4px; }

.dlg-waiting-desc {
  text-align: center;
  color: #333;
  font-size: 11px; }

.dlg-waiting-progress {
  text-align: center;
  padding: 21px; }

.dlg-waiting-progress progress {
  width: 80%;
  height: 18px;
  color: #338CE6;
  /*	background-color: #ccc;*/ }

/* flex ------------------------------------------------------- */
.flxs {
  width: 100%;
  display: flex;
  justify-content: center;
  justify-content: space-between; }

.flx {
  margin-right: 14px; }

.flx:first-child {
  margin-right: auto; }

.flx:last-child {
  margin-right: 0px; }

.indent01 {
  padding-left: 1em;
  text-indent: -1em; }

.flxs-start {
  display: flex;
  justify-content: flex-start; }

.flxs-start-item:not(:last-child) {
  margin-right: 14px; }

.flxs-left {
  display: flex;
  justify-content: flex-start; }

.flxs-item {
  margin-right: 14px; }

.dlg-step-flx {
  box-sizing: border-box;
  border: 1px solid #eee;
  border-radius: 4px;
  background-color: #eee;
  padding: 7px 11px;
  width: 240px;
  font-size: 14px;
  line-height: 44px;
  text-align: center;
  margin-top: 14px;
  margin-bottom: 14px; }

.dlg-step-separater {
  color: #ccc;
  font-size: 11px;
  line-height: 84px; }

.dlg-instructions {
  margin-bottom: 14px; }

.dlg-frm-title {
  font-size: 14px; }

.icon-importfile {
  font-size: 80px;
  color: #aadfdb;
  display: block; }

.dropbox {
  border-radius: 15px;
  border: 4px dashed #AADFDB;
  background-color: #fff;
  text-align: center;
  padding: 28px;
  width: 100%;
  box-sizing: border-box; }

.upload-title {
  margin-top: 21px;
  font-size: 21px;
  color: #2BADA5; }

.upload-desc {
  margin-top: 21px; }

.upload-select-desc {
  font-weight: normal;
  font-size: 14px;
  margin-top: 11px;
  padding: 14px;
  border-radius: 4px;
  /*	border: 1px solid #D9EEEC;
		background-color: #D9EEEC;*/
  border: 1px solid #f8f8f8;
  background-color: #f8f8f8; }

.upload-select-desc > span {
  color: #f00;
  font-size: 13px; }

.tbl-upload-ikkatsu {
  width: 2000px; }

.tbl-upload-ikkatsu th td {
  text-align: center; }

.innner2 {
  margin-top: 14px; }

.tbl-upload-ikkatsu {
  width: 2000px; }

.tbl-upload-ikkatsu thead {
  background-color: #777;
  color: #fff; }

.tbl-upload-ikkatsu thead tr {
  height: 44px; }

.tbl-upload-ikkatsu th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-upload-ikkatsu tbody tr {
  height: 30px;
  color: #444; }

.tbl-upload-ikkatsu tbody tr:nth-child(2n+1) {
  background-color: #fff; }

.tbl-upload-ikkatsu tbody tr:nth-child(2n) {
  background-color: #F6F6F6; }

.tbl-upload-ikkatsu td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px; }

.tbl-upload-ikkatsu2 {
  width: 100%; }

.tbl-upload-ikkatsu2 th td {
  text-align: center; }

.innner2 {
  margin-top: 14px; }

.tbl-upload-ikkatsu2 {
  width: 100%; }

.tbl-upload-ikkatsu2 thead {
  background-color: #777;
  color: #fff; }

.tbl-upload-ikkatsu2 thead tr {
  height: 44px; }

.tbl-upload-ikkatsu2 th {
  padding: 4px;
  border: 1px solid #ddd;
  font-size: 13px;
  font-weight: normal;
  text-align: center; }

.tbl-upload-ikkatsu2 th:first-child {
  width: 80px; }

.tbl-upload-ikkatsu2 td:first-child {
  text-align: center; }

.ikkatsu-error {
  background-color: #FAE5E3; }

.tbl-upload-ikkatsu2 tbody tr {
  height: 30px;
  color: #444; }

.tbl-upload-ikkatsu2 tbody tr:nth-child(2n+1) {
  background-color: #fff; }

.tbl-upload-ikkatsu2 tbody tr:nth-child(2n) {
  background-color: #F6F6F6; }

.tbl-upload-ikkatsu2 td {
  padding: 10px;
  border: 1px solid #ddd;
  font-size: 13px;
  word-wrap: break-word; }

.innner2 .txt {
  margin-top: 14px;
  margin-bottom: 7px;
  font-size: 13px; }

.upload-message {
  font-weight: normal !important;
  font-size: 16px !important;
  margin-top: 11px;
  padding: 14px;
  border-radius: 4px;
  border: 1px solid #f8f8f8;
  background-color: #f8f8f8;
  text-align: center; }

/*----- ダイアログ -----*/
.widgets-dialog-container {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0px;
  top: 0px; }

.widgets-dialog-overlay {
  position: absolute;
  width: 100%;
  height: 120%;
  background: rgba(0, 0, 0, 0.5); }

.widgets-dialog-body {
  position: absolute;
  background: #fff;
  border-radius: 6px;
  padding: 28px;
  box-shadow: 2px 2px 14px -10px; }

.sidebar {
  background-color: #fff; }

.page-main {
  background-color: #ddd; }

.home-logo {
  box-sizing: border-box;
  width: 100%;
  height: 200px;
  padding: 56px 28px; }

.home-logo img {
  margin: 0 auto; }

.home-info {
  box-sizing: border-box;
  width: 100%;
  padding: 56px; }

.home-info li:first-child {
  /*	border-top: 1px solid #ddd;
		padding-top: 28px;*/ }

.home-info li {
  margin-bottom: 28px;
  padding-bottom: 28px;
  border-bottom: 1px solid #AECCE9; }

.home-info-title {
  font-size: 24px;
  color: #337dc4;
  margin-bottom: 14px;
  padding-bottom: 7px;
  border-bottom: 1px solid #AECCE9; }

.home-info-entry-date {
  font-size: 14px;
  margin-bottom: 7px;
  color: #337dc4; }

.home-info-entry-title {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 7px; }

.home-info-entry-content {
  font-size: 14px;
  line-height: 24px; }

.dashboard {
  background: #133155;
  background: -moz-linear-gradient(135deg, #133155 30%, #907983 80%);
  background: -webkit-linear-gradient(135deg, #133155 30%, #907983 80%);
  background: linear-gradient(135deg, #133155 30%, #907983 80%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#133155', endColorstr='#907983',GradientType=1 );
  /*    height: 100%;*/
  padding-top: 28px;
  padding-bottom: 28px; }

.dashboard-menu {
  width: 576px;
  margin: 28px auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start; }

.dashboard-panel {
  text-align: center;
  vertical-align: middle;
  margin: 1px; }

.dashboard-panel a {
  height: 190px;
  display: flex;
  justify-content: center;
  align-items: center; }

.dashboard-panel a:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)"; }

.home-menu1 {
  width: 190px;
  background-color: #53566C;
  color: #fff; }

.home-menu1 a {
  color: #fff; }

.home-menu2 {
  width: 382px;
  background-color: #fff;
  color: #333; }

.home-menu2 a {
  color: #333; }

.home-banner {
  background-color: #333;
  color: #fff; }

/* ログイン画面 ---------------------------------------------------*/
body.page-login {
  background: linear-gradient(-135deg, #4DA1C6, #337DC4); }

.form-login {
  margin: 64px auto;
  width: 500px;
  /*	height: 400px;*/
  border-radius: 4px;
  text-align: center;
  padding: 56px;
  box-sizing: border-box;
  font-size: 14px;
  color: #333;
  border: 1px solid #fff;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1); }

.login-logo {
  margin: 0 auto; }

.form-login-header {
  line-height: 120px;
  background-color: #eee;
  border-radius: 4px;
  font-size: 20px; }

.form-login-main {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 28px 0px 21px; }

.form-login-main input[type=text], .form-login-main input[type=password] {
  margin-top: 7px;
  margin-bottom: 7px;
  line-height: 40px; }

.form-login-footer {
  width: 100%;
  line-height: 38px; }

.form-login-main label {
  font-size: 13px; }

input[type="radio"], input[type="checkbox"] {
  vertical-align: middle; }

.form-login-reminder {
  display: inline-block;
  margin-top: 14px;
  vertical-align: middle; }

.message-error {
  color: #e60033;
  font-size: 12px;
  position: relative;
  text-align: left;
  margin-bottom: 9px; }

.page-login .l-footer {
  background-color: transparent !important;
  color: #fff; }

/* パスワード画面 ---------------------------------------------- */
.form-password {
  margin: 64px auto;
  width: 640px;
  border-radius: 4px;
  text-align: center;
  padding: 56px;
  box-sizing: border-box;
  font-size: 14px;
  color: #333;
  border: 1px solid #fff;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1); }

.form-password-header {
  line-height: 120px;
  border-radius: 4px;
  font-size: 20px;
  text-align: center; }

.form-password-main {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 0px 0px 21px;
  font-size: 16px;
  line-height: 1.8em; }

.form-password-main input[type=text], input[type=password] {
  margin-top: 7px;
  margin-bottom: 7px;
  line-height: 34px; }

.form-password-main-desc {
  margin-top: 14px;
  margin-bottom: 28px; }

.form-password-footer {
  width: 100%;
  line-height: 38px;
  height: 110px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around; }

.form-password-main-notice {
  font-size: 12px;
  line-height: 1.6em;
  text-align: left; }

/* lbl -------------------------------------------------------- */
.lbl {
  display: inline-block;
  border-radius: 4px;
  line-height: 13px;
  position: relative;
  top: -2px;
  margin: 0 4px 0 7px; }

.lbl-danger {
  background-color: #f00;
  color: #fff;
  font-size: 11px;
  padding: 2px 4px; }

.lbl-hissu::after {
  display: inline-block;
  border-radius: 4px;
  line-height: 13px;
  position: relative;
  top: -2px;
  margin: 0 4px 0 7px;
  background-color: #e60033;
  color: #fff;
  font-size: 11px;
  padding: 2px 4px;
  content: "必須"; }

.lbl-error {
  color: #e60033;
  font-size: 12px;
  padding-top: 7px; }

.lbl-err {
  color: #e60033;
  font-size: 12px; }

.lbl-notice {
  color: #333;
  font-size: 12px; }

.lbl-box {
  display: inline-block;
  border: 1px solid #999;
  border-radius: 4px;
  font-size: 14px; }

.lbl-box:not(:last-child) {
  margin-right: 14px; }

.lbl-box dt {
  box-sizing: border-box;
  float: left;
  padding: 4px 7px;
  width: 100px;
  background-color: #777;
  color: #fff;
  text-align: center; }

.lbl-box dd {
  box-sizing: border-box;
  margin-left: 100px;
  padding: 4px 7px;
  width: 100px;
  color: #777;
  text-align: center; }

/* tgl -------------------------------------------------------- */
.tgl-box {
  display: inline-block;
  width: 160px;
  border: 1px solid #999;
  border-radius: 4px;
  font-size: 14px; }

.tgl-box li {
  display: inline-block;
  width: 80px; }

.tgl-box li a {
  display: inline-block;
  width: 100%;
  color: #2BAEA5; }

.tgl-box li.tgl-isselect a {
  display: inline-block;
  width: 100%;
  color: #fff; }

.tgl-isselect {
  background-color: #2BAEA5;
  color: #fff; }

.tgl-genkou {
  border: 1px solid #2BAEA5;
  background-color: #fff;
  color: #2BAEA5; }

/* sender info ------------------------------------------------ */
.sender-info {
  width: 100%;
  background-color: #eee;
  margin-bottom: 21px;
  padding: 11px;
  border-radius: 4px;
  box-sizing: border-box;
  color: #444; }

.sender-info dl {
  display: inline-block;
  line-height: 30px; }

.sender-info dt {
  box-sizing: border-box;
  float: left;
  padding: 4px 7px;
  text-align: left; }

.sender-info dd {
  float: left;
  box-sizing: border-box;
  padding: 4px 7px;
  width: 100px;
  text-align: left;
  margin-right: 28px; }

.dlg-main-header {
  font-size: 15px;
  line-height: 1.8em;
  margin-bottom: 21px; }

.dlg-main-header p {
  margin: 7px 0px; }

.dlg-frame p {
  margin-bottom: 4px; }

.dlg-notice {
  font-size: 14px;
  padding-left: 1em;
  text-indent: -1em; }

.dlg-alt {
  box-sizing: border-box;
  width: 100%;
  border-radius: 4px;
  padding: 7px 14px;
  margin-top: 14px;
  margin-bottom: 14px;
  font-size: 15px; }

.txtarea {
  width: 100%;
  height: 200px;
  border: 1px solid #ccc;
  border-radius: 4px;
  font-size: 14px;
  line-height: 1.4em; }

.notice-box {
  width: 100%;
  text-align: center;
  padding: 7px 0; }

.notice-icon {
  text-align: center;
  font-size: 100px;
  height: 120px; }

.dlg .notice-icon {
  margin-top: -21px; }

.notice-title {
  text-align: center;
  font-size: 24px;
  margin: 7px 0px; }

.notice-desc {
  text-align: center;
  color: #333;
  font-size: 14px;
  line-height: 2;
  margin: 14px 0px; }

.notice-bar {
  text-align: center;
  padding: 7px 0; }

.bar-stripe {
  width: 620px;
  height: 24px;
  background: linear-gradient(45deg, #337ab7 25%, #518EC2 25%, #518EC2 50%, #337ab7 50%, #337ab7 75%, #518EC2 75%, #518EC2);
  -webkit-animation: bar-stripe-animation 16s linear infinite;
  background-size: 40px 40px;
  border-radius: 4px;
  margin: 0 auto; }

@-webkit-keyframes bar-stripe-animation {
  0% {
    background-position: 100% 0; }
  100% {
    background-position: 0 0; } }
.notice-footer {
  padding: 28px 0 0px; }

.notice-normal .notice-icon {
  color: #ADCBE7; }

.notice-normal .notice-title {
  color: #338CE6; }

.notice-error .notice-icon {
  color: #F2BDBA; }

.notice-error .notice-title {
  color: #df5b52; }

.notice-warning .notice-icon {
  color: #ffd9a3; }

.notice-warning .notice-title {
  color: #e6a23c; }

.dlg-arrow {
  box-sizing: border-box;
  width: 100%;
  padding: 14px 0 0px;
  text-align: center;
  font-size: 21px; }

.flx-copy-1 {
  box-sizing: border-box;
  padding: 4px 7px;
  flex-basis: 20%; }

.flx-copy-2 {
  box-sizing: border-box;
  padding: 4px 7px;
  flex-basis: 60%; }

.flx-copy-3 {
  box-sizing: border-box;
  padding: 4px 7px;
  flex-basis: 20%; }

.flx-copy {
  box-sizing: border-box;
  background-color: #ddd;
  padding: 4px 11px;
  border-radius: 4px;
  word-break: break-all;
  height: 100%;
  justify-content: center;
  align-items: center; }

.flx-tate {
  flex-direction: column;
  vertical-align: middle; }

.notice-desc-notice {
  color: #f00; }

.fax-send-no {
  width: 65%;
  margin: 21px auto 14px;
  line-height: 24px; }

.fax-send-no span {
  font-size: 24px;
  font-weight: bold;
  line-height: 24px;
  color: #000; }

.tel-send {
  margin: 21px auto; }

.graph {
  width: 95%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start; }

.group-tougou {
  font-size: 14px;
  margin-bottom: 14px;
  display: flex;
  justify-content: space-between; }

.group-tougou-graph {
  flex-basis: 85%; }

.group-tougou-count {
  flex-basis: 15%; }

.graph-item1 {
  background-color: #039BE5; }

.graph-item2 {
  background-color: #81D4FA; }

.graph-item1-after {
  background-color: #039BE5; }

.graph-item-juuhuku {
  background-color: #29B6F6; }

.graph-item2-after {
  background-color: #81D4FA; }

.group-arrow {
  width: 100%;
  text-align: center;
  margin: 7px auto; }

.group-title {
  font-weight: bold;
  color: #333; }

.group-count {
  font-weight: bold;
  font-size: 16px; }

.preview {
  box-sizing: border-box;
  padding: 28px;
  border: 1px solid #aaa;
  border-radius: 7px;
  box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, 0.5);
  width: calc(100% - 50px) !important;
  height: calc(100% - 50px) !important;
  top: 25px !important;
  left: 25px !important;
  z-index: 1131;
  position: fixed !important;
  min-height: 240px; }

.preview-title {
  color: #338CE6;
  font-size: 24px;
  margin-bottom: 4px; }

.preview-header {
  width: 100%;
  margin-bottom: 11px; }

.preview-main {
  width: 100%;
  margin-bottom: 21px;
  background: url(../images/bg_preview.png) repeat;
  box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.5);
  position: relative;
  border: 0;
  padding: 0;
  overflow: auto;
  height: calc(100% - 102px) !important;
  text-align: center; }

.preview-footer {
  width: 100%;
  text-align: center; }

.toolmenu-set {
  display: inline-block;
  font-size: 0; }

.toolmenu-btn {
  width: 49px;
  height: 35px;
  background-color: rgba(45, 45, 45, 0.8);
  color: #E5E5E5;
  border: none;
  font-size: 16px;
  cursor: pointer; }

.toolmenu-page {
  display: inline-block;
  width: 49px;
  height: 35px;
  background-color: rgba(45, 45, 45, 0.8);
  color: #E5E5E5;
  font-size: 16px;
  vertical-align: top;
  line-height: 35px;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none; 
}

.toolmenu-btn:first-child {
  border-radius: 7px 0px 0px 7px; }

.toolmenu-btn:last-child {
  border-radius: 0px 7px 7px 0px; }

.toolmenu {
  position: absolute;
  left: 0;
  bottom: 16px;
  margin-left: 0;
  width: 100%;
  text-align: center; }

.inner {
  box-sizing: border-box;
  padding: 20px;
  margin: 0px;
  width: 100% !important;
  height: 100% !important;
  text-align: center;
  overflow: auto; }

.preview_outer {
  box-sizing: border-box;
  position: relative; }

.preview_inner {
  box-sizing: border-box;
  position: absolute;
  left: 50%;
  transform: translateX(-49%);
  max-width: 100%;
  max-height: 100%; }

.search-term-group-dialog {
  width: 100%;
  background-color: #eee;
  margin-bottom: 21px;
  padding: 11px;
  border-radius: 4px;
  box-sizing: border-box;
  color: #444;
  display: grid;
  grid-template-rows: 44px 44px;
  grid-template-columns: 120px 200px 120px 200px 1fr;
  font-size: 14px; }

.search-term-atesaki-dialog {
  width: 100%;
  background-color: #eee;
  margin-bottom: 21px;
  padding: 11px;
  border-radius: 4px;
  box-sizing: border-box;
  color: #444;
  display: grid;
  grid-template-rows: 44px;
  grid-template-columns: 120px 200px 120px 200px 1fr;
  font-size: 14px; }

.messagebox {
  box-sizing: border-box;
  width: 400px;
  font-size: 16px;
  padding: 21px 28px;
  text-align: center;
  background-color: #eee; }

.messagebox i {
  margin-right: 6px;
  position: relative;
  top: 2px; }

.messagebox-info {
  border: 1px solid #ebf7fd;
  background-color: #ebf7fd;
  color: #2d7091; }

.messagebox-error {
  border: 1px solid #FAE5E3;
  background-color: #FAE5E3;
  color: #f00; }

.messagebox-warning {
  border: 1px solid #fdf6ec;
  background-color: #fdf6ec;
  color: #e6a23c; }

.messagebox-success {
  border: 1px solid #f0f9eb;
  background-color: #f0f9eb;
  color: #67c23a; }

.lbl-jushinsyaid {
  border: 1px solid #bbb;
  background-color: #ccc;
  display: inline-block;
  height: 30px;
  width: 114px;
  margin-top: 1px;
  margin-bottom: 4px;
  border-radius: 4px;
  line-height: 100px;
  font: 400 13.3333px Arial;
  vertical-align: middle;
  cursor: pointer; }

.lbl-jushinsyaid span {
  line-height: 30px;
  padding-left: 7px; }

.lbl-jushinsyaid span::after {
  content: 'x';
  color: #fff;
  padding-left: 5px;
  display: inline-block; }

.lbl-groupid {
  border: 1px solid #BDBDBD;
  background-color: #E0E0E0;
  display: inline-block;
  height: 32px;
  width: 104px;
  margin-top: 1px;
  margin-bottom: 4px;
  border-radius: 4px;
  line-height: 32px;
  vertical-align: middle;
  cursor: pointer;
  font-size: 13px;
  padding: 0px 4px;
  text-align: center; }

.lbl-groupid span {
  display: inline-block;
  line-height: 32px;
  padding-left: 7px; }

.lbl-groupid span::after {
  display: inline-block;
  content: 'x';
  color: #fff;
  padding-left: 5px; }

.dtmf {
  box-sizing: border-box;
  width: 75%;
  padding: 14px;
  font-size: 18px;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: #fff;
  margin-bottom: 21px; }

.fax-send-buttons {
  display: flex;
  justify-content: center;
  margin-bottom: 28px; }

.fax-send-buttons a {
  margin: 14px; }

.fax-send-buttons button {
  margin: 14px; }

/* -------------------------------------------------------- */
.main-header-step {
  margin-bottom: 21px; }

.main-header-step ol {
  display: flex;
  justify-content: space-between;
  list-style-type: none;
  counter-reset: item;
  font-size: 0;
  line-height: 0; }

.main-header-step li:before {
  display: inline-block;
  counter-increment: item;
  content: counter(item) "";
  font-weight: bold;
  border-right: 1px solid #2BAEA5;
  line-height: 32px;
  width: 20px;
  text-align: center; }

.main-header-step li {
  box-sizing: border-box;
  display: inline-block;
  font-size: 13px;
  border: 1px solid #2BAEA5;
  border-radius: 4px;
  width: 100%;
  margin: 0px;
  color: #2BAEA5; }

.main-header-step li:not(:last-child) {
  margin-right: 8px;
  content: '>'; }

.main-header-step li a {
  box-sizing: border-box;
  display: inline-block;
  line-height: 32px;
  padding-left: 7px;
  min-width: 130px;
  color: #2BAEA5;
  width: calc(100% - 21px);
  /*	background-color: #fff;*/ }

.main-header-step li:hover {
  background-color: #2BAEA5;
  color: #fff; }

.main-header-step li a:hover {
  color: #fff; }

.main-header-step li:hover:before {
  border-right: 1px solid #fff; }

.isstep {
  border: 1px solid #ebf7fd;
  background-color: #ebf7fd;
  font-weight: bold;
  color: #333; }

/*# sourceMappingURL=style.css.map */





.frm input[type="text"] {
  height: 34px;
  padding: 0px 7px;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ddd;
  border-radius: 4px;
  box-sizing: border-box;
  font-family: "メイリオ", Meiryo, "Roboto","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
  font-size: 13.5px !important;
  width: 160px;
}
.frm input.date-control {
  width: 150px;
}
.frm select {
  height: 34px;
  padding: 0px 7px;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ddd;
  border-radius: 4px;
  box-sizing: border-box;
}

.frm-err {
  border: 1px solid #e9546b !important;
}

.frm-err-msg{
  color:#f00;
  font-size: 12px;
  padding: 4px 0px;
}
.search-term-block {
  display: flex;
  width: 42.5%;
  margin-bottom: 0.5rem;
  margin-right: 1.5rem;
}
@media (max-width: 767px) {
.search-term-block {
  width: 100%;
  flex-direction: column;
  margin-right: 0;
}
.frm input.date-control {
  width: 45%;
  max-width: 150px;
}
}
.search-term-title {
	width: 6rem;
	padding-right: 4px;
	line-height: 34px;
	text-align: right;
  font-weight: bold;
  font-size: 0.85rem;
  margin: 0 0.5rem 0.5rem 0;
  flex-shrink: 0;
}
.search-term-item{
	padding-left: 4px;
  margin: 0 0.5rem 0.5rem 0;
}
.search-term-item label {
  margin-top: 0.25rem;
}
@media (max-width: 767px) {
  .search-term-title {
    text-align: left;
    width: 100% !important;
    line-height: 1.5;
    margin: 0;
  }
  .search-term-item {
    margin: 0;
    padding: 0;
  }
  .search-term-item input,.search-term-item select {
    margin-bottom: 0.5rem;
  }
  .search-term-item.search-term-right {
    margin-top: 1rem;
  }
  .search-term-item.search-term-right .btn {
    width: 100%;
    font-size: 1rem;
  }
}



.frm dl {
	display: flex;
	flex-direction: row;
	min-height: 49px;
}

.frm dt {
  display: inline-block;
  width: 350px;
  text-align: right;
  padding-right: 14px;
}

.frm dt span {
  line-height: 49px;
  display: inline-block;
  height: 49px;
}

.frm dt i {
  top: -2px;
  margin-left: 4px;
}

.frm dt:after {
  content: "\FF1A";
  margin-left: 12px;
}

.frm dd {
  -webkit-flex: 1;
  flex: 1;
  margin: 0;
  padding: 7px 0;
}

.frm dd span {
  line-height: 34px;
  display: inline-block;
  height: 34px;
}

.frm dd label {
  line-height: 49px;
  display: inline-block;
  height: 49px;
}





@media (max-width: 600px) {

	body{
		min-width: 100%;
	}

	.tbl-tsuuwa-rireki{
		box-sizing: border-box;
		width: 100%;
		background-color: #fff;
		margin-bottom: 14px;
		padding: 11px 14px;
		border-radius: 7px;
		display: flex;
		flex-direction: column;
	}
	.tbl-tsuuwa-rireki li{
		width: 100%;
		padding: 4px 7px;
	}
	.tbl-header{
		display: none;
	}
	.tbl-tsuuwa-rireki .panel-date{
		color: #999;
		font-weight: bold;
		font-size: 16px;
		order: 1;
	}
	.tbl-tsuuwa-rireki .panel-data{
		color: #666;
		font-size: 16px;
		order: 3;
	}
	.tbl-tsuuwa-rireki .panel-duration{
		color: #666;
		order: 2;
	}
	.tbl-tsuuwa-rireki .panel-duration:before{
		content: '(通話時間：';
	}
	.tbl-tsuuwa-rireki .panel-duration:after{
		content: ')';
	}
}

@media (min-width: 601px) {

	body{
		min-width: 100%;
	}

	.tbl-tsuuwa-rireki{
		box-sizing: border-box;
		width: 100%;
		background-color: #fff;
		padding: 11px 14px;
		display: flex;
		flex-direction: row;
	}

	.tbl-tsuuwa-rireki li{
		width: 100%;
		padding: 4px 7px;
	}

	.tbl-header{
		font-weight: bold;
		color: #999;
	}

	.tbl-main{
		margin-bottom: 14px;
	}

	.tbl-tsuuwa-rireki .panel-date{
		color: #666;
		font-size: 15px;
	}

	.tbl-tsuuwa-rireki .panel-data{
		color: #666;
		font-size: 16px;
	}

	.tbl-tsuuwa-rireki .panel-duration{
		color: #666;
	}

}


.tbl-footer{
	text-align: center;
}




.footer-button {
	display: flex;
	justify-content: space-between;
}

.btn-camera-change {
	font-size: 15px;
	margin-right: 10px;
}

.btn-hungup{
	font-size: 15px;
}

.login .form-check-input {
	position: static !important;
}

.form-check-input{
	position:relative;
	flex-shrink:0;
	margin-top:0;
	margin-right:.25rem;
	margin-left:0;
}

.linkarea {
  margin: 0.5rem 1rem;
  text-align: center;
  width: calc(100% - 2rem);
}
.linkarea ul li {
  font-size: 75%;
  display: inline-block;
  padding: 0.5rem;
}
.loginBg a {
  color: #FFF;
  opacity: 0.6;
}
.loginBg a:hover {
  opacity: 1;
}
.loginBg .linkarea {
  position: absolute;
  bottom: 0;
}
@media (max-width: 767px) and (orientation: landscape){ 
.loginBg .linkarea {
  position: relative;
  bottom: unset;
}
}
.version {
  margin: 0.5rem;
  font-size: 0.625rem;
  color: rgba(128,128,128,.75);
  text-align: right;
  width: calc(100% - 1rem);
  position: absolute;
  bottom: 0;
}
@media (max-width: 767px) {
  .version {
    position: relative;
  }
}


/* info */
.info {
  background: #FFF;
  font-family: "Roboto","sans-serif";
  font-feature-settings: "palt";
  letter-spacing: 0.025rem;
}
.info header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-shadow: 0 0 0.25rem 0.25rem rgba(0,0,0,.1);
}
.info header .logo {
  padding: 0.5rem 1rem;
}
.info header .logo img {
  width: 189px;
  height: 47px;
  display: block;
}
.info header .home-link {
  font-size: 0.85rem;
  margin:0 1rem;
  padding: 0.25rem 1rem;
  border: solid 1px #888;
  border-radius: 0.25rem;
}
.info header .home-link:hover {
  background: #EEE;
  text-decoration: none;
}
.info .main-content {
  width: 90vw;
  max-width: 800px;
  margin: 0 auto;
}
.info .main-content h1 {
  margin: 2.5rem 0 1.5rem;
  font-size: 1.75rem;
  text-align: center;
}
.info .main-content h2 {
  margin: 2rem 0 1.5rem;
  font-size: 1.375rem;
}
.info .main-content h3 {
  margin: 1.5rem 0 1.25rem;
  font-size: 1.125rem;
}
.info .main-content h4 {
  margin: 1.25rem 0 1rem;
  font-size: 1rem;
}
.info .main-content h5 {
  margin: 0.9rem 0 0;
  font-size: 0.9rem;
}
.info .main-content .text {
  margin: 0 0 2rem;
}
.info .main-content p,
.info .main-content li {
  font-size: 0.9rem;
  line-height: 1.65;
  margin: 0 0 0.5rem;
}
.info .main-content ul,
.info .main-content ol {
  padding: 0 0 0 1.5rem;
  margin: 0 0 0.5rem;
}
.info .main-content ul {
  list-style: disc;
}
.info .main-content ul>li>ul,
.info .main-content ol>li>ul {
  list-style: circle;
  padding: 0 0 0 2.5rem;
}
.info .main-content ol {
  list-style: decimal;
}
.info .main-content .contact {
  background: #d7f0f5;
  padding: 1rem;
  margin: 0 auto 1rem;
  text-align: center;
}
.info .main-content .contact h4 {
  margin-top: 0;
  text-align: center;
}
.info .main-content .contact .btn {
  display: block;
  margin: 0 auto 1rem;
  max-width: 260px;
}

@media (max-width: 767px) {
  
  .info header .logo {
    padding: 0.5rem;
  }
  .info header .logo img {
    width: 148px;
    height: 36px;
  }
  .info header .home-link {
    font-size: 0.8rem;
    margin:0 0.5rem;
    padding: 0.25rem 0.5rem;
  }
  .info .main-content h1 {
    margin: 2rem 0 1.5rem;
    font-size: 1.375rem;
  }
  .info .main-content h2 {
    margin: 2rem 0 1.5rem;
    font-size: 1.25rem;
  }
  .info .main-content h3 {
    margin: 1.5rem 0 1.25rem;
    font-size: 1.125rem;
  }
  .info .main-content h4 {
    margin: 1.25rem 0 1rem;
    font-size: 1rem;
  }
  .info .main-content h5 {
    margin: 0.9rem 0 0;
    font-size: 0.9rem;
  }
  .info .main-content .contact {
    margin: 0 -5vw 1rem;
    text-align: left;
  }
}


/* controlMenu */
.controlMenu {
  position: absolute;
  width: 30px;
  height: 80px;
  z-index: 10;
  top: calc(50% - 40px);
  right: 0;
  overflow: hidden;
}
.controlMenu.open {
  width: 100%;
  height: 100%;
  top: 0;
}
.controlMenu .controlMenu_overlay {
  width: 0;
  height: 100vh;
  background: rgba(0,0,0,.4);
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.4s ease;
}
.controlMenu.open .controlMenu_overlay {
  width: 100%;
  opacity: 1;
}
.controlMenu .controlMenu_container {
  display: flex;
  align-items: center;
  width: 80px;
  height: 100%;
  /*height: -webkit-fill-available;*/
  background: rgba(32,32,32,.6);
  position: absolute;
  top: 0;
  right: -80px;
  transition: right 0.1s ease;
}
.controlMenu.open .controlMenu_container {
  right: 0;
}
.controlMenu_container:before, .controlMenu_container:after {
  display: block;
  content: "";
  width: 1px;
  height: calc(50% - 39px);
  position: absolute;
  left: 0;
  background: rgba(255,255,255,.5);
}
.controlMenu_container:before {
  top: 0;
}
.controlMenu_container:after {
  bottom: 0;
}
.controlMenu_container .controlMenu_trigger {
  position: absolute;
  top: calc(50% - 40px);
  left: -30px;
  height: 80px;
  width: 30px;
  padding: 0 0 0 10px;
}
.controlMenu_container .controlMenu_trigger button {
  height: 80px;
  width: 20px;
  border-top: solid 1px rgba(255,255,255,.5);
  border-right: solid 1px transparent;
  border-bottom: solid 1px rgba(255,255,255,.5);
  border-left: solid 1px rgba(255,255,255,.5);
  border-radius: 10px 0 0 10px;
  border-start-start-radius: 10px;
  border-end-start-radius: 10px;
  color: #FFF;
  background: rgba(32,32,32,.6);  
}
.controlMenu.open .controlMenu_container .controlMenu_trigger button i.fas {
  transform: rotateY(180deg);
}
.controlMenu_container .controlMenu_trigger button:hover,
.controlMenu_container .controlMenu_trigger button:focus {
  outline: none;
}
.controlMenu_container .controlMenu_nav {
  padding: 0.5rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  color: #FFF;
  width: 100%;
}
.controlMenu_container .controlMenu_nav button {
  background: none;
  border: none;
  color: #FFF;
  font-size: 0.75rem;
  line-height: 1.4;
  margin: 16px auto;
  transition: all 0.15s ease;
}
.controlMenu_container .controlMenu_nav button:focus {
  outline: none;
}
.controlMenu_container .controlMenu_nav button:disabled {
  pointer-events: none;
  opacity: 0.4;
}
.controlMenu_container .controlMenu_nav button img {
  display: block;
  width: 48px;
  height: 48px;
  margin: 4px auto;
}
.controlMenu.open + .tips.tips_controlMenu {
  right: 95px;
}

/* tips */
.tips {
  display: none;
  position: absolute;
  z-index: 11;
}
.tips .tips_inner {
  display: flex;
  align-items: baseline;
  background: #0a94cf;
  font-size: 14px;
  color: #FFF;
  padding: 0.375rem 0.5rem;
  border-radius: 5px;
  box-shadow: 0 0 0.5rem rgba(0,0,0,.5);
}
.tips .tips_inner:after {
  display: block;
  content: "";
  position: absolute;
}
.tips.tips_controlMenu {
  top: calc(50% - 140px);
  right: 15px;
}
.tips.tips_controlMenu .tips_inner {
  width: 145px;
}
.tips.tips_controlMenu .tips_inner:after {
  bottom: -20px;
  right: 10px;
  border-top: solid 20px #0a94cf;
  border-right: solid 0px transparent;
  border-bottom: solid 0px transparent;
  border-left: solid 10px transparent;
  transform: skewX(20deg);
}
.tips.tips_displayChange {
  /*bottom: calc(18vmax + 1.8rem);
  left: 0.8rem;*/
  top: -5rem;
  left: 0;
  position: absolute;
}
.tips.tips_displayChange .tips_inner {
  width: 180px;
}
.tips.tips_displayChange .tips_inner:after {
  bottom: -20px;
  right: 80px;
  border-top: solid 20px #0a94cf;
  border-right: solid 10px transparent;
  border-bottom: solid 0px transparent;
  border-left: solid 0px transparent;
  transform: skewX(-20deg);
}
.tips.tips_fullscreen {
  top: 1.25rem;
  right: 4rem;
}
.tips.tips_fullscreen .tips_inner {
  width: 180px;
}
.tips.tips_fullscreen .tips_inner:after {
  top: 0px;
  right: -20px;
  border-top: solid 10px transparent;
  border-right: solid 0px transparent;
  border-bottom: solid 0px transparent;
  border-left: solid 20px #0a94cf;
  transform: skewY(-40deg);
}
.tips.tips_cameraChange {
  top: 1.25rem;
  right: 4rem;
}
.tips.tips_cameraChange .tips_inner {
  width: 220px;
}
.tips.tips_cameraChange .tips_inner:after {
  top: 0px;
  right: -20px;
  border-top: solid 10px transparent;
  border-right: solid 0px transparent;
  border-bottom: solid 0px transparent;
  border-left: solid 20px #0a94cf;
  transform: skewY(-40deg);
}
.tips.tips_video-mute {
  top: 1.25rem;
  right: 4rem;
}
.tips.tips_video-mute .tips_inner {
  width: 156px;
}
.tips.tips_video-mute .tips_inner:after {
  top: 0px;
  right: -20px;
  border-top: solid 10px transparent;
  border-right: solid 0px transparent;
  border-bottom: solid 0px transparent;
  border-left: solid 20px #0a94cf;
  transform: skewY(-40deg);
}
.tips.tips_audio-mute {
  top: 1.25rem;
  right: 4rem;
}
.tips.tips_audio-mute .tips_inner {
  width: 156px;
}
.tips.tips_audio-mute .tips_inner:after {
  top: 0px;
  right: -20px;
  border-top: solid 10px transparent;
  border-right: solid 0px transparent;
  border-bottom: solid 0px transparent;
  border-left: solid 20px #0a94cf;
  transform: skewY(-40deg);
}
.tips.tips_recording {
  top: 1.5rem;
  right: 4rem;
}
.tips.tips_recording .tips_inner {
  width: 178px;
}
.tips.tips_recording .tips_inner:after {
  top: 0px;
  right: -20px;
  border-top: solid 10px transparent;
  border-right: solid 0px transparent;
  border-bottom: solid 0px transparent;
  border-left: solid 20px #0a94cf;
  transform: skewY(-40deg);
}
.tips.tips_share,
.tips.tips_capture {
  top: 1.5rem;
  right: 4rem;
}
.tips.tips_share .tips_inner,
.tips.tips_capture .tips_inner {
  width: 108px;
}
.tips.tips_share .tips_inner:after,
.tips.tips_capture .tips_inner:after {
  top: 0px;
  right: -20px;
  border-top: solid 10px transparent;
  border-right: solid 0px transparent;
  border-bottom: solid 0px transparent;
  border-left: solid 20px #0a94cf;
  transform: skewY(-40deg);
}
.tips.tips_send-file {
  top: 1.5rem;
  right: 4rem;
}
.tips.tips_send-file .tips_inner {
  width: 122px;
}
.tips.tips_send-file .tips_inner:after {
  top: 0px;
  right: -20px;
  border-top: solid 10px transparent;
  border-right: solid 0px transparent;
  border-bottom: solid 0px transparent;
  border-left: solid 20px #0a94cf;
  transform: skewY(-40deg);
}
.tips.tips_recording-list,
.tips.tips_download-list {
  top: 1.5rem;
  right: 4rem;
}
.tips.tips_recording-list .tips_inner,
.tips.tips_download-list .tips_inner {
  width: 152px;
}
.tips.tips_recording-list .tips_inner:after,
.tips.tips_download-list .tips_inner:after {
  top: 0px;
  right: -20px;
  border-top: solid 10px transparent;
  border-right: solid 0px transparent;
  border-bottom: solid 0px transparent;
  border-left: solid 20px #0a94cf;
  transform: skewY(-40deg);
}
.tips.tips_view-message {
  top: 1.5rem;
  right: 4rem;
}
.tips.tips_view-message .tips_inner {
  width: 150px;
}
.tips.tips_view-message .tips_inner:after {
  top: 0px;
  right: -20px;
  border-top: solid 10px transparent;
  border-right: solid 0px transparent;
  border-bottom: solid 0px transparent;
  border-left: solid 20px #0a94cf;
  transform: skewY(-40deg);
}
@media (orientation: landscape) and (max-height: 480px) {
  .tips.tips_cameraChange {
    top: 13.5rem;
    right: 0rem;
}
.tips.tips_cameraChange .tips_inner:after {
    top: -11rem;
    right: 0.75rem;
    border-top: solid 0px transparent;
    border-right: solid 5px transparent;
    border-bottom: solid 11rem #0a94cf;
    border-left: solid 5px transparent;
    transform: skewX(1deg);
}
.tips.tips_video-mute {
    top: 11rem;
    right: -0.5rem;
}
.tips.tips_video-mute .tips_inner:after {
    top: -8.5rem;
    right: 1rem;
    border-top: solid 0px transparent;
    border-right: solid 5px transparent;
    border-bottom: solid 8.5rem #0a94cf;
    border-left: solid 5px transparent;
    transform: skewX(5deg);
}
.tips.tips_audio-mute {
    top: 8.5rem;
    right: -1.5rem;
}
.tips.tips_audio-mute .tips_inner:after {
    top: -6rem;
    right: 1.5rem;
    border-top: solid 0px transparent;
    border-right: solid 5px transparent;
    border-bottom: solid 6rem #0a94cf;
    border-left: solid 5px transparent;
    transform: skewX(15deg);
}
.tips.tips_recording {
    top: 6rem;
    right: -2rem;
}
.tips.tips_recording .tips_inner:after {
    top: -3.5rem;
    right: 2rem;
    border-top: solid 0px transparent;
    border-right: solid 4px transparent;
    border-bottom: solid 3.5rem #0a94cf;
    border-left: solid 4px transparent;
    transform: skewX(15deg);
}
.tips.tips_capture {
    top: 3.5rem;
    right: -2rem;
}
.tips.tips_capture .tips_inner:after {
    top: -1rem;
    right: 2.5rem;
    border-top: solid 0px transparent;
    border-right: solid 4px transparent;
    border-bottom: solid 1rem #0a94cf;
    border-left: solid 4px transparent;
    transform: skewX(15deg);
}
.tips.tips_recording-list, .tips.tips_download-list {
    top: 11.5rem;
    right: 3rem;
}
.tips.tips_recording-list .tips_inner:after, .tips.tips_download-list .tips_inner:after {
    top: -9rem;
    right: 0.5rem;
    border-top: solid 0px transparent;
    border-right: solid 5px transparent;
    border-bottom: solid 9rem #0a94cf;
    border-left: solid 5px transparent;
    transform: skewX(-22deg);
}
.tips.tips_share {
    top: 9rem;
    right: 3rem;
}
.tips.tips_share .tips_inner:after {
    top: -6.5rem;
    right: -0.5rem;
    border-top: solid 0px transparent;
    border-right: solid 5px transparent;
    border-bottom: solid 6.5rem #0a94cf;
    border-left: solid 5px transparent;
    transform: skewX(-22deg);
}
.tips.tips_send-file {
    top: 6.5rem;
    right: 2rem;
}
.tips.tips_send-file .tips_inner:after {
    top: -4rem;
    right: 0rem;
    border-top: solid 0px transparent;
    border-right: solid 4px transparent;
    border-bottom: solid 4rem #0a94cf;
    border-left: solid 4px transparent;
    transform: skewX(-22deg);
}
.tips.tips_view-message {
    top: 4rem;
    right: 1rem;
}
.tips.tips_view-message .tips_inner:after {
    top: -1.5rem;
    right: 0.5rem;
    border-top: solid 0px transparent;
    border-right: solid 4px transparent;
    border-bottom: solid 1.5rem #0a94cf;
    border-left: solid 4px transparent;
    transform: skewX(-25deg);
}
}
.tips-pop {
  width: 2.5rem;
  height: 2.5rem;
  justify-content: center;
  align-items: center;
  color: #FFF;
  font-size: 1.25rem;
  text-shadow: 0 0 0.25rem rgba(0, 0, 0, 0.8);
  opacity: 0.8;
  cursor: pointer;
  display: none;
}
.tips-pop.popup {
  color: #0a94cf;
}
.tips-pop:hover {
  opacity: 1;
}

.video-toggle,
.voice-toggle,
.recording-toggle,
.capture-toggle,
.share-toggle,
.recording-list-btn,
.send-file-btn,
.download-list-btn,
.view-message-toggle {
  background-color: transparent;
  border: none;
  margin-bottom: 1rem;
  cursor: pointer;
  border-radius: 100%;
  transition: 0.1s ease;
}
.video-toggle:hover,
.voice-toggle:hover,
.recording-toggle:hover,
.capture-toggle:hover,
.share-toggle:hover,
.recording-list-btn:hover,
.send-file-btn:hover,
.download-list-btn:hover,
.view-message-toggle:hover {
  background-color: rgba(255, 255, 255, 0.5);
}
.video-toggle::before,
.voice-toggle::before,
.recording-toggle::before,
.capture-toggle::before,
.share-toggle::before,
.recording-list-btn::before,
.send-file-btn::before,
.download-list-btn::before,
.view-message-toggle::before {
  display: block;
  width: 2.5rem;
  height: 2.5rem;
  content: "";
  background-size: cover;
}
.video-toggle:active,
.voice-toggle:active,
.recording-toggle:active,
.capture-toggle:active,
.share-toggle:active,
.recording-list-btn:active,
.download-list-btn:active,
.send-file-btn:active,
.view-message-toggle:active,
.video-toggle:focus,
.voice-toggle:focus,
.recording-toggle:focus,
.capture-toggle:focus,
.share-toggle:focus,
.recording-list-btn:focus,
.download-list-btn:focus,
.send-file-btn:focus,
.view-message-toggle:focus {
  border: none;
  outline: none;
}
.send-file-btn { 
  position: relative; 
  display: block; 
  width: 2.5rem; 
  height: 2.5rem; 
  overflow: hidden; 
}
.send-file-btn input { 
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%; 
  opacity: 0; 
  cursor: pointer; 
} 
.video-toggle::before {
  background-image: url(../img/video-on.svg);
}
.voice-toggle::before {
  background-image: url(../img/voice-on.svg);
}
.recording-toggle::before {
  background-image: url(../img/recording-start.svg);
}
.capture-toggle::before {
  background-image: url(../img/capture-start.svg);
}
.share-toggle::before {
  background-image: url(../img/share-start.svg);
}
.video-toggle.off::before {
  background-image: url(../img/video-off.svg);
}
.voice-toggle.off::before {
  background-image: url(../img/voice-off.svg);
}
.recording-toggle.off::before {
  background-image: url(../img/recording-stop.svg);
}
.capture-toggle.stop::before {
  background-image: url(../img/capture-stop.svg);
}
.share-toggle.stop::before {
  background-image: url(../img/share-stop.svg);
}
.video-toggle.disabled::before {
  background-image: url(../img/video-no.svg);
}
.voice-toggle.disabled::before {
  background-image: url(../img/voice-no.svg);
}
.recording-toggle.disabled::before {
  background-image: url(../img/recording-no.svg);
}
.capture-toggle.disabled::before {
  background-image: url(../img/capture-no.svg);
}
.recording-list-btn::before,
.download-list-btn::before {
  background-image: url(../img/recording-list.svg);
}
.send-file-btn::before {
  background-image: url(../img/send-start.svg);
}
/*.send-file-btn:focus::before {
  background-image: url(../img/send-stop.svg);
}*/
.view-message-toggle::before {
  background-image: url(../img/view-message-on.svg);
}
.view-message-toggle.off::before {
  background-image: url(../img/view-message-off.svg);
}
.video-toggle.disabled,
.voice-toggle.disabled,
.recording-toggle.disabled {
  cursor: default;
  pointer-events: none;
}
.download-list.notice::after,
.view-message.notice::after,
.recording-list.notice::after  {
  content: "";
  display: block;
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 100%;
  background: #A00;
  position: absolute;
  top: 2rem;
  right: 0;
  border: solid 1px #D00;
  box-shadow: 0 0 0.5rem 0.05rem #F00;
  animation: flashing 1.25s ease-out 0s infinite normal;
}
@keyframes flashing {
  0% {background: #D00;box-shadow: 0 0 0.25rem 0.05rem #F00;border: solid 1px #D00;}
  50% {background: #F33;box-shadow: 0 0 0.5rem 0.5rem rgba(255, 0, 0, 0.5);border: solid 1px #F33;}
  100% {background: #D00;box-shadow: 0 0 0.25rem 0.05rem #F00;border: solid 1px #D00;}
}

.messageArea {
  display: flex;
  flex-direction: column;
  position: absolute;
  width: 0vw;
  left: 100vw;
  background: #FCFCFC;
  top: 0;
  right: -25vw;
  transition: all 0.05s ease;
  overflow: hidden;
}
.messageArea.show {
  width: 25vw;
  left: 75vw;
}
.messageArea-head {
  display: flex;
  align-items: center;
  background: rgba(0, 0, 0, 0.05);
  border-bottom: solid 1px rgba(0, 0, 0, 0.1);
  height: 3rem;
}
.messageArea-head h4 {
  font-size: 1rem;
  color: #666;
  padding: 0.75rem;
  margin: 0;
  flex-grow: 1;
  display: flex;
}
.messageArea-head .close-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  appearance: none;
  border: none;
  border-radius: 100%;
  background: #FFF;
  width: 2.25rem;
  height: 2.25rem;
  margin-right: 0.5rem;
  position: relative;
  outline: none;
}
.messageArea-head .close-btn::before,
.messageArea-head .close-btn::after {
  display: block;
  width: 1.5rem;
  height: 2px;
  background: #000;
  content: "";
  position: absolute;
}
.messageArea-head .close-btn::before {
  transform: rotateZ(45deg);
}
.messageArea-head .close-btn::after {
  transform: rotateZ(-45deg);
}
.messageArea-head .close-btn:hover::before,
.messageArea-head .close-btn:hover::after {
  background: #F7493E;
}
.message-block {
  flex-grow: 1;
  height: calc(100dvh - 9rem);
}
.message-block .message-block-inner {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow-y: hidden;
}
.message-block .message-block-inner .wrap {
  padding: 0 1rem;
  overflow-y: auto;
}
.message-balloon {
  width: calc(100% - 1rem);
  border-radius: 0.5rem;
  padding: 0.75rem;
  margin-bottom: 0.75rem;
  margin-top: 0.75rem;
  font-size: 0.875rem;
  box-shadow: 0 0.025rem 0.125rem rgba(0,0,0,.25);
  position: relative;
  word-break: break-all;
  white-space: pre-line;
}
.message-balloon::after {
  display: block;
  width: 0;
  height: 0;
  content: "";
  position: absolute;
  top: 0.75rem;
  right: -1rem;
  left: auto;
  border-top: solid 0rem transparent;
  border-bottom: solid 1rem transparent;
}
.message-balloon.host-message {
  background: #cae9ec;
}
.message-balloon.guest-message {
  background: #fae1d7;
}
.hostDevice .message-balloon.guest-message,
.guestDevice .message-balloon.host-message {
  margin-left: 1rem;
}
.hostDevice .message-balloon.guest-message::after,
.guestDevice .message-balloon.host-message::after {
  right: auto;
  left: -1rem;
}
.hostDevice .message-balloon.host-message::after {
  border-right: solid 0rem #cae9ec;
  border-left: solid 1rem #cae9ec;
}
.hostDevice .message-balloon.guest-message::after {
  border-right: solid 1rem #fae1d7;
  border-left: solid 0rem #fae1d7;
}
.guestDevice .message-balloon.host-message::after {
  border-right: solid 1rem #cae9ec;
  border-left: solid 0rem #cae9ec;
}
.guestDevice .message-balloon.guest-message::after {
  border-right: solid 0rem #fae1d7;
  border-left: solid 1rem #fae1d7;
}
.message-sending {
  height: 6rem;
  padding: 0.75rem;
  background: rgba(0, 0, 0, 0.05);
  border-top: solid 1px rgba(0, 0, 0, 0.1);
  position: relative;
}
.message-sending textarea {
  height: 4.25rem;
  resize: none;
  font-size: 0.875rem;
}
_:lang(x)+_:-webkit-full-screen-document, .message-sending textarea {
  font-size: 1rem;
}
.message-sending .message-sending-alert-area {
  position: absolute;
  bottom: 5.125rem;
  left: 0.75rem;
  width: calc(100% - 1.5rem);
}
.message-sending .message-sending-alert {
  display: block;
  background: white;
  color: #f7493e;
  margin-bottom: 0.125rem;
  border: solid 2px #f7493e;
  border-radius: 0.25rem;
  box-shadow: 0 0.25rem 0.25rem rgba(196, 0, 0, 0.25);
  padding: 0.25rem 0.5rem;
  font-size: 0.75rem;
}

@media (min-width: 992px) {
  .messageArea.show {
    width: 25vw;
    left: 75vw;
  }
  .main.show-message {
  width: 75%;
  }
  .main.show-message .btnArea,
  .main.show-message .stopBtn {
    right: calc(25% + 0.5rem);
  }
  .hostDevice .main.show-message .guestCam,
  .guestDevice .main.show-message .hostCam {
    width: 75%;
  }
}
@media (max-width: 991px) {
  .messageArea.show {
    width: 15rem;
    left: calc(100vw - 15rem);
  }
  .main.show-message {
    width: calc(100% - 15rem);
  }
  .main.show-message .btnArea,
  .main.show-message .stopBtn {
    right: calc(15rem + 0.5rem);
  }
  .hostDevice .main.show-message .guestCam,
  .guestDevice .main.show-message .hostCam {
    width: calc(100% - 15rem);
  }
}
@media (max-width: 575px) {
  .message-balloon {
    font-size: 0.75rem;
  }
  .messageArea.show {
    width: 100vw;
    left: 0;
    background: rgba(64,64,64,0.8);
    z-index: 200;
  }
  .messageArea-head {
    background: #333;
  }
  .messageArea-head h4 {
    color: #EEE;
  }
  .main.show-message {
    width: 100%;
  }
  .main.show-message .btnArea,
  .main.show-message .stopBtn {
    right: 0.5rem;
  }
  .hostDevice .main.show-message .guestCam,
  .guestDevice .main.show-message .hostCam {
    width: 100%;
  }
}
@media (max-width: 932px) and (max-height: 430px) and (orientation: landscape)  {
  .messageArea.show {
    width: 100vw;
    left: 0;
    background: rgba(64,64,64,0.9);
    z-index: 200;
  }
  .messageArea-head {
    background: #333;
  }
  .messageArea-head h4 {
    color: #EEE;
  }
  .main.show-message {
    width: 100%;
  }
  .main.show-message .btnArea,
  .main.show-message .stopBtn {
    right: 0.5rem;
  }
  .hostDevice .main.show-message .guestCam,
  .guestDevice .main.show-message .hostCam {
    width: 100%;
  }
}

.latest-message {
  display: flex;
  justify-content: center;
  width: calc(100vw - 44vmax);
  position: fixed;
  bottom: 6vmax;
  left: 22vmax;
  cursor: pointer;
}
.latest-message .alert {
  padding: 0;
  color: #FFF;
  background-color: rgba(96,96,96,0.875);
  border-color: rgba(0,0,0,0.75);
  box-shadow: 0 0.125rem 0.375rem rgba(0, 0, 0, 0.25),0 0.5rem 0.75rem rgba(0, 0, 0, 0.25);
  width: auto;
  display: inline-block;
  position: relative;
  transition: all 0.1s ease-out;
}
.latest-message .alert:hover {
  background-color: rgba(64,64,64,1);
  border-color: rgba(0,0,0,0.875);
  box-shadow: 0 0.5rem 0.75rem rgba(0, 0, 0, 0.25),0 0.75rem 1rem rgba(0, 0, 0, 0.25);
}
.latest-message .alert .latest-message-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.75rem;
  height: 1.75rem;
  color: #FFF;
  position: absolute;
  top: 0.375rem;
  left: 0.375rem;
  font-size: 1rem;
}
.latest-message .messag-text {
  font-size: 0.875rem;
  margin: 0 2.75rem 0.625rem 0;
  padding: 0.625rem 0 0 2.25rem;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  word-break: break-all;
  position: relative;
  white-space: pre-line;
}
.latest-message .close {
  padding: 0.5rem 0.75rem;
  opacity: 0.75;
  text-shadow: none;
  transition: all 0.1s ease-out;
  height: 100%;
  display: grid;
}
.latest-message .close:not(:disabled):not(.disabled):hover {
  color: #F66;
  opacity: 1;
}
.latest-message .close:not(:disabled):not(.disabled):focus {
  outline: none;
}
@media (max-width: 767px) {
  .latest-message {
    width: calc(100vw - 19vmax - 0.8rem);
    bottom: 8.5vmax;
    left: 19vmax;
  }
  .latest-message .alert {
    padding: 0.5rem 0.75rem;
  }
  .latest-message .alert .latest-message-icon {
    top: 0.25rem;
    left: 0.25rem;
  }
  .latest-message .messag-text {
    font-size: 0.75rem;
    margin: 0 1.5rem 0 0;
    padding: 0 0 0 1.375rem;
  }
  .latest-message .close {
    padding: 0.25rem 0.5rem;
  }
}
@media (max-width: 932px) and (max-height: 430px) and (orientation: landscape) {
  .latest-message {
    width: calc(100vw - 44vmax);
    bottom: 8.5vmax;
    left: 22vmax;
  }
}

.displayChange {
  z-index: 12;
  position: absolute;
  left: 0;
  top: -3rem;
  width: 100%;
  display: none;
}
.toggle-camera-control {
  background: rgba(80,100,120,.6);
  display: flex;
  width: 2.5rem;
  height: 2.5rem;
  justify-content: center;
  align-items: center;
  border: none;
  border-radius: 2rem;
  padding: 0;
  z-index: 1;
  margin-bottom: 1rem;
}
.toggle-camera-control.disabled,
.toggle-camera-control:disabled {
  pointer-events: none;
  cursor: default;
}
.toggle-camera-control.back {
  background: #37bf29;
}
.toggle-camera-control img {
  width: 2rem;
  height: 2rem;
  transition: transform 0.25s;
}
.toggle-camera-control.back img {
  transform: rotateY(180deg);
}
.toggle-camera-control.back.disabled,
.toggle-camera-control.back:disabled {
  background: rgba(80,100,120,.6);
}
.toggle-camera-control.back.disabled img,
.toggle-camera-control.back:disabled img {
  transform: rotateY(0deg);
}
@media (min-width: 768px) {
  .controlMenu_container .controlMenu_nav button:hover {
    opacity: .6;
  }
}
@media (max-width: 767px) {
  .controlMenu_container .controlMenu_nav button:hover {
    opacity: 1;
  }
  .controlMenu_container .controlMenu_nav button:active {
    opacity: .6;
  }
  .displayChange button {
    font-size: 2vmax;
  }
}
@media (max-width: 767px) and (orientation: landscape){
  .controlMenu .controlMenu_container {
    width: 160px;
    right: -160px;
  }
  .controlMenu_container .controlMenu_nav button {
    width: 50%;
  }
  .controlMenu + .tips.tips_controlMenu {
    top: calc(50% + 20px);
    right: 30px;
  }
  .controlMenu.open + .tips.tips_controlMenu {
    right: 175px;
  }
  .tips.tips_controlMenu .tips_inner:after {
    top: -25px;
    right: 5px;
    bottom: unset;
    border-top: solid 0px transparent;
    border-right: solid 0px transparent;
    border-bottom: solid 25px #0a94cf;
    border-left: solid 15px transparent;
    transform: skewX(-30deg);
  }
  .toggle-camera-control,
  .video-toggle, 
  .voice-toggle,
  .recording-toggle,
  .recording-list-btn,
  .download-list-btn,
  .send-file-btn  {
    margin: 0 0 0.5rem 0.5rem;
  }
  button#toggle-fullscreen {
    margin: 0 0 0.5rem 1rem;
  }
}


.top_menu {
  position: absolute;
  top: 1rem;
  right: 1rem;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
.top_menu {
  top: 0.5rem;
  right: 0.5rem;
} 
}

/* footer */
footer {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
footer .linkarea {
  text-align: left;
  width: auto;
}
footer .version {
  margin: 0.5rem 1rem;
  width: auto;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
footer .caution {
  width: 100%;
  padding: 0.5rem 1.5rem;
  font-size: 0.75rem;
}

/* CTI版対応 */
.loginBg_CTI,.homeBg_CTI {
  background-color: #061c6c;
}
.homeBg_CTI a:not(.dropdown-item a) {
  color: #FFF;
  opacity: 0.75;
}
.homeBg_CTI .top_menu .btn-outline-secondary:not(:hover) {
  color: rgba(255, 255, 255, 0.75);
}