﻿@charset "UTF-8";

/* Reset & Base
-------------------------------------------------------------- */
* { border: 0; font-family: inherit; font-size: 100%; font-style: inherit; font-weight: inherit; margin: 0; outline: 0; padding: 0; box-sizing: border-box; word-break: break-all; }
ol, ul { list-style: none; }
table { border-collapse: separate; border-spacing: 0; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
a { display: inline-block; }
input[type="submit"] { -webkit-appearance: none; }

p { text-align: left; }
strong { font-weight: bold; }
em { font-style: italic; }
blockquote { display: block; padding: 2em; }
img { max-width: 100%; height: auto; vertical-align: bottom; }
iframe { max-width: 100%; }

/* 
* common
-------------------------------------------------------------- */
a { text-decoration: none; }
a.line { text-decoration: underline; }
a:link, a:visited { color: inherit; }
a:hover { opacity: .5; }

.t_left { text-align: left !important; }
.t_right { text-align: right !important; }
.t_center { text-align: center !important; }
.sp { display: none !important; }

.w_full { width: 100%; }
.bold { font-weight: bold !important; }
.nowrap { white-space: nowrap; }
.flex {display: flex; justify-content: space-between; flex-wrap: wrap; align-items: flex-start;}
.flex-items-center {align-items: center;}
.flex-end {justify-content: flex-end !important;}
.flex-bw {justify-content: space-between !important;}
.m0 {margin: 0 !important;}
.p0 {padding: 0 !important;}

html {
  -webkit-text-size-adjust:100%;
  text-align: center;
  line-height: 1.5;
  font-size: 13px;
/*  font-family: 'メイリオ', Meiryo,'Arial',sans-serif;*/
  font-family: 'メイリオ', 'Meiryo', 'Hiragino Sans', 'ヒラギノ角ゴシック', sans-serif;
  background-color: #FAFAFA;
  letter-spacing: .15em;
  color: #111;
}
@media screen and (max-width: 1311px) {
  html {
    font-size: 0.99vw;
  }
}

.container {
  max-width: 1180px;
  width: 90%;
  margin: 0 auto;
  text-align: center;
  position: relative;
}

.ttl01 {
	font-size: 1.69rem;
  font-weight: bold;
}
.menu .ttl01 {
	border-bottom: 2px solid #444;
	margin-bottom: 2rem;
	text-align: left;
  padding-bottom: .5em;
}
.ttl02 {
  font-size: 1.38rem;
  font-weight: bold;
  text-align: left;
}

input, textarea, select {
	padding: .5em 1em;
  border: 2px solid #bdbdbd;
  background: #FFF;
  letter-spacing: inherit;
  line-height: inherit;
  border-radius: 5px;
}
:focus {
  border-color: var(--mycolor) !important;
}
:checked {
  accent-color: var(--mycolor);
}
input:read-only {
  background: #f6f6f6;
}
input[type="checkbox"],
input[type="radio"] {
  margin-right: .5em;
  width: 1em;
  height: 1em;
}
.small, small {
	font-size: .85em;
	font-weight: normal;
}
textarea {
	height: 10em;
}
span.hissu {
	color: #FFF;
	background-color: #F00;
	font-weight: bold;
	border: 1px solid #F00;	
	border-radius: 5px;
	margin-left: 1em;
	font-size: .8rem;
	padding: 0.3em 0.5em;
}

.button, input[type='submit'] {
  border: 2px solid #bdbdbd;
  background: #f6f6f6;
  font-size: 1.38rem !important;
  font-weight: normal;
  padding: .5em 1em;
  border-radius: 5px;
  cursor: pointer;
  color: #111;
}
.button:hover, input[type='submit']:hover {
  border-color: var(--mycolor);
  opacity: 1;
}
.save {
  font-family: 'Font Awesome 6 Free';
}

.button_radio {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.button_radio > * {
  border: 2px solid #bdbdbd;
  background: #f6f6f6;
  display: flex;
  align-items: center;
  padding-left: 1em;
  border-radius: 5px;
}
.button_radio > *:not(:last-of-type) {
  margin-right: .3em;
}
.button_radio label {
  padding: 1em 1em 1em 0;
}

.mb2 {
  margin-bottom: 2rem;
}
.mb5 {
  margin-bottom: 5rem;
}

i {
  margin-right: .2em;
}

.btn01 {
  color: #FFF !important;
  border-radius: 5rem;
  padding: 1em 2em;
  background: var(--mycolor);
  font-weight: bold;
}

.msg_subscribe {
  display: inline-block;
/*  background-color: #F00;*/
  font-weight: bold;
  border-radius: 5rem;
  padding: .5em 1em;
  color: #F00;
}
.msg_subscribe a {
  text-decoration: underline;
}
.wrap_msg_subscribe {
  text-align: center;
}

/* 
 * header
-------------------------------------------------------------- */
header {
	position: fixed;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 100;
	padding: 1.5rem 0;
}
header .flex {
  align-items: stretch;
}
body.page_signup .flex {
  justify-content: center;
}
.wrap_tenant_name {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
}
.tenant_name {
  text-align: left;
  font-size: 1.85rem;
  font-weight: bold;
}
.logo img {
  height: 5rem;
  width: auto;
}
.title {
	text-align: center;
	font-size: 2rem;
  font-weight: bold;
	border-bottom: 3px solid #444;
	padding: 3rem 0 .3rem;
  margin-bottom: 1rem;
	position: relative;
	width: 100%;
}
.home {
	color: #FFF !important;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #FFF;
  border-radius: 5rem;
  padding: .5em 1em;
}
.page_home .home {
  font-size: 0;
  border: 0;
}
.page_index header .flex {
  justify-content: center;
}
.s_image img {
  height: 3rem;
  border-radius: 50%;
}
.user_menu {
	text-align: right;
  font-weight: bold;
}
.user_menu > *:first-child {
  margin-bottom: 1rem;
}
.user_name {
  font-size: 1.23rem;
}
header .user_image {
	margin-left: 1rem;
}
.user_image > * {
  border-radius: 50%; 
  height: 3rem;
  width: auto;
  font-size: 3rem;
  margin: 0;
}
.header_btn {
  justify-content: flex-end;
  flex-wrap: nowrap;
}
.header_btn > *:not(:last-of-type) {
  margin-right: 1rem;
}
.header_btn a {
  display: flex;
  align-items: center;
  background: #FFF;
  padding: .5em 1em;
  border-radius: 50px;
  color: var(--mycolor);
}
.header_btn a img {
  margin-right: .3em;
}
.err_msg, .info_msg {
	height: auto;
/*	background-color: #FAFEED;*/
	background-color: #FFF;
	border-radius: 10px;
	text-align: center;
	font-weight: bold;
	font-size: 1.43rem;	
	margin: 3rem auto;
	padding: 3rem;
}
.err_msg {
	color: #FF0000;
	border: 6px double #FF0000;
}
.info_msg {
	color: #000;
	border: 6px double #5FB336;
}

header.UpMove {
  animation: UpAnime 0.5s forwards;
}
@keyframes UpAnime{
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(-100px);
  }
}
header.DownMove {
  animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime{
  from {
    opacity: 0;
    transform: translateY(-100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/* 
 * main
-------------------------------------------------------------- */
.main {
  padding: 9.5rem 0 5rem;
}
.content_main {
	background-color: #FFF;
	overflow-x: auto;
	-webkit-overflow-scrolling:touch;
	padding: 1.5em;
	border-radius: 5px;
	border: 1px solid #aaaaaa;
}
.content_body {
	width: 100%;
}
.loading {
/*	position: absolute;*/
/*	top: 00px;*/
/*	left: 0px;*/
	width:100%;
	height: 320px;
	z-index: 800;
	background: url( images/loading.gif) no-repeat center center;
}


/* 
 * login
-------------------------------------------------------------- */
.login_wrap {
	width: 90%;
	max-width: 480px;
	margin: 0 auto;
  margin-top: 7%;
  position: relative;
}
.login_wrap::before,
.login_wrap::after {
  content: '';
  position: absolute;
  bottom: 9px;
  z-index: -1;
  width: 50%;
  height: 50%;
  box-shadow: 0 15px 10px -6px rgba(0, 0, 0, .5);
}
.login_wrap::before {
  left: 10px;
  -webkit-transform: rotate(-4deg);
  transform: rotate(-4deg);
}
.login_wrap::after {
  right: 10px;
  -webkit-transform: rotate(4deg);
  transform: rotate(4deg);
}
.login_form {
	background-color: #FFF;
	text-align: right;
	border: 1px solid #444;
  border-radius: 5px;
	padding: 2rem;
}
.login_form p {
	text-align: left;
  margin-bottom: .5rem;
}
.login_form input:not([type="submit"]):not([type="checkbox"]) {
	margin-bottom: 2rem;
	width: 100%;
}
.login_form .signup {
  margin-top: 3rem;
  border-top: 1px solid #bdbdbd;
  padding: 1rem 0;
}

/* 
 * tab
-------------------------------------------------------------- */
.tabs {
	background: none;	
	border: none !important;
	padding: 0;
	width: 100%;
	max-width: 100%;
	/*display: none;*/
}
.tab_body {
	background-color: #FFF !important;	
	border: 1px solid #444 !important;
	overflow-x: auto;
	-webkit-overflow-scrolling:touch;
	padding: 1.5em !important;
	border-radius: 5px !important;
	border-top-left-radius: 0 !important;
}

.tab_title {
  padding-bottom: .5rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid #444;
}

#tab_menu {
  display: flex;
  justify-content: flex-start;
  margin-bottom: -1px;
}
#tab_menu > * {
}
#tab_menu > *:not(:last-of-type) {
  margin-right: .3rem;
}
#tab_menu a {
	font-size: 1.38rem;
  border: 1px solid #444;
  border-radius: 5px 5px 0 0;
  background: #f6f6f6;
	padding: .7em;
}
#tab_menu .active {
  background: #FFF;
  border-bottom-color: #FFF;
}


/* 
 * menu
-------------------------------------------------------------- */
.menu .ttl01 {
	margin-top: 5rem;
  justify-content: flex-start;
}
.menu .ttl01 img {
  margin-right: 1.5rem;
  max-height: 2.69rem;
}
.menu_area {
	margin-top: 2rem;
  align-items: stretch;
}
.menu_area > * {
	width: 30%;
  padding: 1.5rem;
}
.menu_box2 {
	width: 47%;
}
.menu_area .ttl02 {
  margin-bottom: 1rem;
}
.menu_area p {
	color: #FFF;
  text-align: center;
  margin-top: 1rem;
}
.menu_area img {
  max-height: 6.92rem;
}

/* 
 * calendar
-------------------------------------------------------------- */
table.cal {
	width: 100%;
	table-layout:fixed; 
  height: 100%;
}
table.cal th, table.cal td {
	border: 2px solid #FFF;
	padding: 5px;
	vertical-align: top;
}
table.cal thead {
	background-color: #FFF;
	font-size: 1.14rem;
	font-weight: bold;
}
table.cal thead th {
	border-bottom: 20px solid #FFF;
}
table.cal input {
	display: none;
}
table.cal .cal_main {
  height: 100%;
}
table.cal .cal_click {
	background-color: #FAFEED;
  border: 1px solid #FAFEED;
	padding: 1em 1em 15px 1em;
	border-bottom-right-radius: 15px;
	cursor: pointer;
  display: block;
  position: relative;
  height: 100%;
}
table.cal .cal_click:hover {
  border-color: #444;
}
table.cal .cal_click.no_hover {
	cursor: default;
}	
table.cal .cal_chk_img {
	position: absolute;
	right: 1em;
	bottom: 1em;	
}
table.cal .cal_chk_img i {
  color: var(--mycolor);
  font-weight: bold;
  font-size: 1.38rem;
}
table.cal .cal_shift {
  background-color: var(--mycolor);
	padding: .5em 1em;
	word-wrap: break-word;
	margin-top: 1rem;
  border-radius: 50px;
  color: #FFF;
}
table.cal tbody {
	background-color: #EBEBEB;	
}
table.cal tbody .sat {
/*	background-color: #0485CD;	*/
/*	color: #FFF !important;*/
}
table.cal tbody .sun,
table.cal tbody .holiday {
/*	background-color: #86251F;	*/
/*	color: #FFF !important;*/
}
table.cal .cal_date {
	font-size: 1.38rem !important;
	font-weight: bold !important;
  display: inline-block;
  height: 2.07rem;
  min-width: 2.07rem;
}
table.cal .today {
/*  background: #444;*/
  background: var(--mycolor);
  color: #FFF !important;
  border-radius: 50%;
}

/* 
 * normal table
-------------------------------------------------------------- */
table.normal {
	width: 100%;
	background-color: #FAFEED;
	border: 1px solid #bdbdbd;
  text-align: left;
}
table.normal tr {
	background-color: #FFF;	
}
table.normal tr:nth-of-type(2n) > * {
  background: #FAFEED;
}
table.normal th,
table.normal td {
	padding: 2rem;
}
table.normal th {
	white-space: nowrap;
	font-weight: bold;
	text-align: left;	
	padding-right: 2rem;
}
table.normal tr:not(:last-of-type) > * {
  border-bottom: 1px solid #bdbdbd;
}

.list_guide {
  margin-top: 3rem;
  text-align: left;
}
.list_guide > * {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.list_guide > *:not(:last-of-type) {
  margin-bottom: .3em;
}
.list_guide .spacer {
  margin-right: .5em;
}
.spacer {
  display: block;
  width: 1em;
  height: 1em;
}

.v_top {
  vertical-align: top;
}

.box_submit {
  padding: 2rem 0;
}

#notes_noreserve tr {
  background: inherit;
}
#notes_noreserve tr > * {
  padding: 2rem 0;
}

/* 
 * karte
-------------------------------------------------------------- */
.list_karte_img {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.karte_img {
	text-align: center;	
	position: relative;
  width: 23.5%;
}
.karte_img:nth-of-type(4n + 2):last-of-type {
  margin-right: 51%;
}
.karte_img:nth-of-type(4n + 3):last-of-type {
  margin-right: 25.5%;
}
.karte_img:not(:nth-of-type(1)):not(:nth-of-type(2)):not(:nth-of-type(3)):not(:nth-of-type(4)) {
  margin-top: 1rem;
}
.karte_img .del_img {
	position: absolute;
	right: 1rem;
	top: 1rem;
	background-color: #474747;
	color: #FFF;	
	border-radius: 5rem;
	font-size: .7rem;
	padding: .3em .5em;
}


/* 
 * data table
-------------------------------------------------------------- */
.box_dataTables {
}

.wrap_dataTables * {
  float: none !important;
}
.wrap_dataTables .head,
.wrap_dataTables .foot {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
.wrap_dataTables .body,
.largeTable
{
  overflow-x: auto;
}

.dataTable {
  border: 1px solid #bdbdbd;
  border-radius: 5px;
  text-align: left;
  margin-top: 1rem;
  margin: 1rem 0 !important;
}
.dataTable tr:nth-of-type(2n) > * {
  background: #FAFEED;
}
.dataTable td {
	padding: 1rem !important;
}
.dataTable tr:not(:last-of-type) td {
  border-bottom: 1px solid #bdbdbd;
}
.dataTable td.center {
	text-align: center;	
}
.dataTable td.sorting_1 {
  background-color: #f6f6f6 !important;	
}
.dataTable thead th,
.dataTable tfoot th {
  padding: 1rem !important;
  font-weight: bold !important;
  text-align: center !important;
  background: #f6f6f6;
  white-space: nowrap;
}
.dataTable thead th:not(:last-of-type),
.dataTable tfoot th:not(:last-of-type),
.dataTable td:not(:last-of-type) {
  border-right: 1px solid #bdbdbd;
}
.dataTable thead {
  border-bottom: 1px solid #bdbdbd;
}
.dataTable tfoot {
  border-top: 1px solid #bdbdbd;
}
.dataTable thead th:first-of-type {
  border-top-left-radius: 5px;
}
.dataTable thead th:last-of-type {
  border-top-right-radius: 5px;
}
.dataTable tfoot th:first-of-type {
  border-bottom-left-radius: 5px;
}
.dataTable tfoot th:last-of-type {
  border-bottom-right-radius: 5px;
}



.wrap_table {
	overflow-x: auto;
	/*overflow: scroll;*/
	width: 100%;
	-webkit-overflow-scrolling:touch;
}
.dataTables_paginate {
  display: flex;
  flex-wrap: wrap;
  border: 1px solid #bdbdbd;
  border-radius: 5px;
  padding: 0 !important;
  color: inherit !important;
}
.dataTables_paginate > * {
  margin: 0 !important;
  height: 100%;
  border: 0 !important;
}
.dataTables_paginate > *:not(:last-of-type) {
  border-right: 1px solid #bdbdbd !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
  color: inherit !important;
  border: 0;
  background: #bdbdbd;
  height: 100%;
  margin: 0;
  opacity: 1;
}

.nowrap {
	white-space: nowrap;	
}
#shiftTable thead th div.DataTables_sort_wrapper {
	padding: 0;
}
#noTable {
	position: absolute;
	right: 0;
	top: 0;
}
.dataTable_submit {
	margin-top: 2rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.dataTable_submit > *:not(:last-child) {
	margin-right: 1rem;
}

.caution {
	background-color: #FF0 !important;	
}
.noreserve {
	background-color: #474747 !important;
}
.on_youbi, .shift_on {
	background-color: #0485CD !important;	
}
.shift_off, .reserved {
	background-color: #86251F !important;	
}
.support {
	background-color: #DABDBB !important;	
}
.sat,
.sat a {
	color: #00F !important;
}
.sun,
.sun a,
.holiday,
.holiday a {
	color: #F00 !important;
}


/* 
 * button set
-------------------------------------------------------------- */
.shift_color img {
	width: 1em;
	height: 1em;
}
.default_shift_patern {
	font-size: .86rem;
}
select.shift_patern {
	text-shadow:0px 1px 1px #FFF,0px 0px 1px #FFF,1px 0px 1px #FFF,0px -1px 1px #FFF,-1px -1px 1px #FFF,-1px 0px 1px #FFF;
	filter:dropshadow(color=#FFF,offx=0,offy=1,positive=1),dropshadow(color=#FFF,offx=0,offy=0,positive=1),dropshadow(color=#FFF,offx=0,offy=-1,positive=1),dropshadow(color=#FFF,offx=-1,offy=-1,positive=1),dropshadow(color=#FFF,offx=-1,offy=0,positive=1);
}
.ui-buttonset .ui-state-active .ui-button-text{
	background: url(../images/ico_active.png) no-repeat left center !important;
}

/* 
 * signup
-------------------------------------------------------------- */
.tbl_regist {
  width: 100%;
  text-align: left;
  font-size: 1.3rem;
}
.tbl_regist tr > * {
  padding: 1.5rem 0;
}
.tbl_regist th {
  white-space: nowrap;
  padding-right: 5rem;
  text-align: center;
}
.tbl_regist a {
  font-weight: bold;
  text-decoration: underline;
}
.tbl_regist input[type="submit"] {
  padding: 1.5rem 7rem;
  background: #05B099;
  border-radius: 10rem;
  margin: auto;
  border: 0;
  color: #FFF;
  font-weight: bold;
  letter-spacing: .2em;
}


/* 
* jqplot
-------------------------------------------------------------- */
table.jqplot-table-legend {
  padding: 1em;	
}

/* 
* tiny box
-------------------------------------------------------------- */
.tbox {
  z-index: 10001;
  width: 95vw;
  height: 95vh;
  background: #FFF;
  max-width: 1180px;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%);
  padding: 2rem;
  overflow: hidden;
}
.tinner {
  background: #FFF url(./images/loading.gif) no-repeat center center;
  width: 100% !important;
  height: 100% !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}
.tcontent {
  width: 100%;
  overflow-y: auto;
  margin-bottom: 3rem;
  padding: 1rem;
}
.tmask {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 10000;
  background-color: #000;
}
.tclose {
  display: inline-block;
  padding: .8rem 3rem;
  border: 1px solid #bdbdbd;
  background: #bdbdbd;
  color: #FFF;
  border-radius: 50px;
  cursor: pointer;
}
.tclose:hover {
  background: #FFF;
  color: inherit;
}
.tclose::before {
  font-size: 1.38rem;
  font-weight: bold;
  font-family: 'Font Awesome 6 Free';
  content: '\f2d3閉じる';
}
.wrap_graph {
  margin: 0 auto;	
}
.graph, .graph2 {
  margin: 0 auto;
}


/* 
 * footer
-------------------------------------------------------------- */
footer {
	border-top: 1px solid #bdbdbd;	
	padding: 2rem 0;
}
#copylight {
	text-align: right;
	font-size: .71rem;
	color: #bdbdbd;
}
footer .home {
  position: static;
  border-radius: 50px;
}

/* 
* inform
-------------------------------------------------------------- */
.inform {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
/*  padding: 3rem;*/
/*  background: rgba(68, 68, 68, .5);*/
  background: rgba(255, 255, 255, .95);
/*  color: var(--mycolor);*/
  font-weight: bold;
  font-size: 1.38rem;
  height: 33%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.inform .close::after {
  content: '\f00d';
  font-family: 'Font Awesome 6 Free';
  right: 1rem;
  top: 1rem;
  position: absolute;
  padding: 1rem;
  font-size: 2rem;
}
.inform .flex {
  justify-content: center;
  align-items: center;
}
.inform i {
  font-size: 3rem;
  color: #FFD800;
  margin-right: 3rem;
}


/* 
* for SP
-------------------------------------------------------------- */
@media screen and (max-width: 640px) {
  .pc { display: none !important; }
  .sp { display: initial !important; }

  html {
    font-size: 3.33vw;
  }
  .header .container > * {
    width: 100%;
  }
  
  #user_menu > * {
    align-items: flex-start !important;
  }
  .header_btn {
    justify-content: space-between;
  }
  .header_btn a {
    display: flex !important;
    font-size: .92rem;
  }
  header .home {
    display: none;
  }
  .tenant_name {
    margin-bottom: 1rem;
  }
  
  .err_msg, .info_msg {
    padding: 1rem;
    font-size: 1rem;
    margin-bottom: 1rem;
  }
  
  .main {
    padding-top: 13.28rem;
  }

  
  .menu_area.flex {
    align-items: stretch;
  }
  .menu_area > * {
    padding: .5rem;
    width: 32%;
  }
  .menu_area .ttl02 {
    font-size: 1rem;
  }
  .menu_area a img {
    max-height: 3rem;
  }
  .menu_area p {
    font-size: .85rem;
    letter-spacing: 0;
  }
  
  
  .title {
    font-size: 1.85rem;
  }
  
  .ttl01 {
    font-size: 1.38rem;
  }
  
  #tab_menu a,
  .button, input[type='submit'] 
  {
    font-size: 1rem !important;
    padding: .5em;
  }
  #tab_menu a {
    text-align: left;
  }
  
  
  .tab_body {
    border-top-right-radius: 0 !important;
  }
  .tab_title .ttl01 {
    order: -1;
    width: 100%;
    margin-bottom: 1rem;
  }
  
  table.cal th, table.cal td {
    padding: 0;
  }
  table.cal .cal_click {
    padding: 0;
    border-bottom-right-radius: 0;
  }
  table.cal .cal_shift {
    padding: .3em;
    border-radius: 0;
    font-size: .77rem;
  }
  
  table.normal tr,
  table.normal th,
  table.normal td
  {
    display: block;
    border-bottom: none !important;
  }
  table.normal th {
    padding-bottom: 0;
    white-space: pre-wrap;
  }
  table.normal td {
    padding-top: 1rem;
  }
  input[type="file"] {
    width: 100%;
  }
  
  .dataTable_submit {
    justify-content: space-between;
  }
  .wrap_dataTables .foot {
    justify-content: center;
  }
  
  .graph, .graph2 {
    width: 100% !important;
  }
  
  .tbl_regist tr,
  .tbl_regist th,
  .tbl_regist td {
    display: block;
  }
  .tbl_regist th {
    padding: 0;
  }
  .tbl_regist td {
    padding: 1rem 0 3rem 0;
  }
  
  footer .flex {
    justify-content: center;
  }
  footer .flex > div {
    width: 100%;
    margin-top: 3rem;
  }
  #copylight {
    width: 100%;
    margin-top: 1rem;
  }
  
  .tbox {
    padding: 1rem;
  }
  .tclose::before {
    font-size: 1rem;
  }
}