@charset "UTF-8";

/* CSS Document */
/*---------------------------------

  基本

---------------------------------*/
body {
  background: #f2f2f2;
  position: relative;
}

:root {
  --main: #ED8432;
}

@media screen and (min-width: 1025px) {
  .sp {
    display: none;
  }
}

@media screen and (max-width: 1024px) {
  .pc {
    display: none;
  }
}

/*---------------------------------

  header

---------------------------------*/
@media screen and (min-width: 1025px) {
  .style-sp {
    display: none;
  }

  header {
    background: #fff;
    box-shadow: 0 .5rem 2rem rgba(0, 0, 0, 0.08);
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 100;
  }

  header a {
    color: #333;
  }

  header .style-wrap {
    align-items: center;
    justify-content: space-between;
    display: flex;
    margin: 0 auto;
    width: 90%;
  }

  header .style-wrap h1 a {
    display: block;
    padding: 2rem 0;
  }

  header .style-wrap .gnav #toggle,
  header .style-wrap .gnav .navToggle {
    display: none;
  }

  header .style-wrap .gnav nav ul {
    border-left: solid 1px #eee;
    display: flex;
  }

  header .style-wrap .gnav nav ul li {
    border-right: solid 1px #eee;
  }

  header .style-wrap .gnav nav ul li.style-name {
    padding: 2rem;
  }

  header .style-wrap .gnav nav ul li a {
    display: block;
    font-size: 15px;
    font-weight: 500;
    padding: 2rem;
  }

  header .style-wrap li:hover a {
    color: var(--main);
    opacity: 1;
  }

  header .style-wrap .gnav nav ul li.dropdown {
    position: relative;
  }

  header .style-wrap .gnav nav ul li.dropdown input {
    display: none;
  }

  header .style-wrap .gnav nav ul li.dropdown .child {
    background: #fff;
    border: none;
    box-shadow: 0 .5rem 2rem rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    opacity: 0;
    padding: 0;
    position: absolute;
    left: -3rem;
    top: 0;
    text-align: center;
    transition: .3s top, .3s opacity;
    visibility: hidden;
    width: 15rem;
  }

  header .style-wrap .gnav nav ul li.dropdown:hover .child,
  header .style-wrap .gnav nav ul li.dropdown .child:hover {
    opacity: 1;
    top: 100%;
    visibility: visible;
  }

  header .style-wrap .gnav nav ul li.dropdown ul.child li {
    border: none;
    border-bottom: dashed 1px #eee;
  }

  header .style-wrap .gnav nav ul li.dropdown ul.child li a {
    color: #333;
    padding: 2rem 1rem;
    transition: 0s;
  }

  header .style-wrap .gnav nav ul li.dropdown ul.child li a:hover {
    color: var(--main);
  }
}

@media screen and (max-width: 1320px) {
  header .style-wrap h1 a {
    font-size: 15px;
    padding: 1.5rem 0;
  }

  header .style-wrap .gnav nav ul li a {
    font-size: 14px;
    padding: 1.5rem 1rem;
  }

  header .style-wrap .gnav nav ul li.style-name {
    font-size: 14px;
    padding: 1.5rem;
  }
}

/*  
  1024pxトグルメニュー
---------------------------------*/
@media screen and (max-width: 1024px) {
  .style-pc {
    display: none;
  }

  header {
    background: #fff;
    box-shadow: 0 .5rem 2rem rgba(0, 0, 0, 0.1);
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 5rem;
    z-index: 100;
  }

  header .style-wrap h1 {
    display: inline-block;
  }

  header .style-wrap h1 a {
    color: #333;
    display: block;
    padding: 1.4rem 1rem;
  }

  header .style-wrap .gnav .navToggle {
    align-items: center;
    background: #fff;
    display: flex;
    justify-content: center;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 100;
    width: 5rem;
    height: 5rem;
  }

  header .style-wrap .gnav .navToggle span,
  header .style-wrap .gnav .navToggle span:before,
  header .style-wrap .gnav .navToggle span:after {
    background: var(--main);
    border-radius: 3px;
    content: '';
    display: block;
    position: absolute;
    width: 25px;
    height: 3.5px;
  }

  header .style-wrap .gnav .navToggle span:before {
    bottom: 8px;
  }

  header .style-wrap .gnav .navToggle span:after {
    top: 8px;
  }

  header .style-wrap .gnav #toggle {
    display: none;
  }

  header .style-wrap .gnav #toggle:checked~.navToggle span {
    background: rgba(255, 255, 255, 0);
  }

  header .style-wrap .gnav #toggle:checked~.navToggle span::before {
    bottom: 0;
    transform: rotate(-135deg);
    transition: .2s;
  }

  header .style-wrap .gnav #toggle:checked~.navToggle span::after {
    top: 0;
    transform: rotate(135deg);
    transition: .2s;
  }

  header .style-wrap .gnav nav {
    background: #f2f2f2;
    position: fixed;
    bottom: 0;
    left: 100%;
    transition: all .5s;
    width: 100%;
    height: calc(100% - 5rem);
    z-index: 90;
  }

  header .style-wrap .gnav #toggle:checked~nav {
    left: 0;
  }

  header .style-wrap .gnav nav ul {
    padding: .5rem 2rem;
  }

  header .style-wrap .gnav nav ul li {
    border-bottom: solid 1px #e8e8e8;
    list-style: none;
  }

  header .style-wrap .gnav nav ul li a {
    color: #333;
    display: block;
    font-weight: 500;
    padding: 1rem 2rem 1rem .5rem;
    position: relative;
  }

  header .style-wrap .gnav nav ul li a::before {
    border-right: solid 2px var(--main);
    border-top: solid 2px var(--main);
    content: '';
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%)rotate(45deg);
    width: 7px;
    height: 7px;
  }

  header .style-wrap .gnav nav ul li.dropdown .ac {
    display: none;
  }

  header .style-wrap .gnav nav ul li.dropdown ul.child {
    height: 0;
    opacity: 0;
    padding: 0 0 0 2rem;
    visibility: hidden;
  }

  header .style-wrap .gnav nav ul li.dropdown .ac:checked+.label+ul.child {
    height: auto;
    opacity: 1;
    visibility: visible;
  }
}

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

/*---------------------------------

  ページ共通

---------------------------------*/
button {
  border: 0;
  background-color: transparent;
  cursor: pointer;
}

.btn {
  background: var(--main);
  border: solid 3px var(--main);
  border-radius: 5rem;
  color: #fff;
  cursor: pointer;
  display: block;
  font-size: 100%;
  font-weight: 600;
  padding: .7rem;
  transition: .3s;
}

.btn a {
  color: #fff;
  display: block;
  height: 100%;
}

.btn:hover {
  background: #E66D2F;
  opacity: 1;
}

.style-headerBG {
  padding-top: 7rem;
}

@media screen and (max-width: 480px) {
  .style-headerBG {
    padding-top: 5rem;
  }
}

/*---------------------------------

  ページ別

---------------------------------*/
/*
  login
----------------------------*/
article.style-login {
  align-items: center;
  background: #f6f6f6;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100vh;
}

article.style-login section {
  width: 100%;
}

article.style-login .style-wrap {
  width: 100%;
}

article.style-login .style-wrap h1 {
  font-size: 120%;
  font-weight: 600;
  text-align: center;
}

article.style-login .style-wrap .style-container {
  background: #fff;
  border-radius: 2rem;
  box-shadow: 0 .5rem 2rem rgba(0, 0, 0, 0.08);
  margin: 4rem auto;
  padding: 4rem 5rem;
  width: 90%;
  max-width: 45rem;
}

article.style-login .style-wrap .style-container dl>div {
  margin: 0 0 1.5rem;
}

article.style-login .style-wrap .style-container dl dt {
  font-weight: 500;
  margin-bottom: .8rem;
}

article.style-login .style-wrap .style-container dl dd {
  position: relative;
}

article.style-login .style-wrap .style-container dl dd button#passview {
  background: url("../images/passview_visible.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  cursor: pointer;
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  width: 2.2rem;
  height: 1.5rem;
}

article.style-login .style-wrap .style-container dl dd button#passview.invisible {
  background: url("../images/passview_invisible.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

article.style-login .style-wrap .style-container .btn {
  margin: 2rem 0;
  text-align: center;
}

article.style-login .style-wrap .style-container p.style-help {
  font-size: 80%;
  text-align: center;
}

article.style-login .style-wrap .style-container p.style-help a {
  color: #999;
  position: relative;
}

article.style-login .style-wrap .style-container p.style-help a::before {
  background: #999;
  border-radius: 50%;
  color: #fff;
  content: "?";
  font-size: 90%;
  line-height: .8;
  margin-right: .3rem;
  padding: 0 .6rem;
}

.is_error {
  display: none;
}

.is_error.errored {
  background: #F8E2E4;
  color: #C8101D;
  display: block;
  padding: .5rem;
  width: 100%;
}

input.style-text.right {
  text-align: right;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

input[type="file"] {
  border: none;
}

input[type="file"]#csv,
input[type="file"]#excel {
  background: #e7e7e7;
  margin-bottom: 1rem;
}

button[type="submit"].upload {
  background: var(--main);
  border-radius: 10rem;
  color: #fff;
  font-weight: 600;
  padding: 1rem 2rem;
}

.adminAction .btn a {
  border-radius: 10rem;
  color: #fff;
  display: block;
  font-size: 102%;
  font-weight: 600;
  margin: auto;
  min-width: 12rem;
  text-align: center;
}

.adminAction section .style-container .tableWrap table a {
  text-decoration: none;
}

.adminAction .btn a:hover {
  opacity: 1;
}

.style-text {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: transparent;
  background-image: none;
  border: solid 1px #ccc;
  border-radius: 5px;
  color: inherit;
  font-family: inherit;
  font-size: 1em;
  padding: 0.4em 0.8em;
  width: 100%;
}

.style-text::placeholder {
  color: #bbb;
}

.style-text:focus {
  border: solid 1px var(--main);
  box-shadow: none;
  outline: none;
}

.style-text.w300 {
  max-width: 300px;
}

.style-text.w250 {
  max-width: 250px;
}

.style-text.w200 {
  max-width: 200px;
}

.style-text.w150 {
  max-width: 150px;
}

.style-text.w100 {
  max-width: 100px;
}

.style-text.w50 {
  max-width: 50px;
}

.style-check {
  display: none;
}

.style-check+span {
  cursor: pointer;
  display: inline-block;
  font-size: 95%;
  margin-top: .8rem;
  padding: 0 0 0 2.8rem;
  position: relative;
}

.style-check+span::before {
  -webkit-transform: translateY(-50%);
  background: #fff;
  border: solid 1px #ccc;
  border-radius: 4px;
  content: "";
  display: block;
  left: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2rem;
  height: 2rem;
}

.style-check+span::after {
  border-bottom: solid 4px var(--main);
  border-left: solid 4px var(--main);
  content: "";
  display: block;
  left: 1.5px;
  margin-top: -0.2em;
  opacity: 0;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%) rotate(-45deg);
  transform: translateY(-50%) rotate(-45deg);
  transition: all 0.2s ease 0s;
  width: 1.1em;
  height: 0.7em;
}

.style-check:checked+span::after {
  opacity: 1;
}

.style-check {
  margin-bottom: 20px;
}

textarea {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: transparent;
  background-image: none;
  border: solid 1px #ccc;
  border-radius: 5px;
  color: inherit;
  font-family: inherit;
  font-size: 1em;
  resize: vertical;
  min-height: 100px;
  height: 150px;
  padding: 0.4em 0.8em;
  width: 100%;
}

textarea:focus {
  border: solid 1px var(--main);
  box-shadow: none;
  outline: none;
}

.style-select {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background: url("../images/btn_arrow_down.svg") no-repeat center right 3px / 2.3rem 2.3rem;
  border: solid 1px #ccc;
  border-radius: 5px;
  color: inherit;
  cursor: pointer;
  display: block;
  font-family: inherit;
  font-size: 1em;
  padding: .3rem 4rem .3rem 0.8rem;
  width: 100%;
}

.style-select::-ms-expand {
  display: none;
}

.style-select:focus {
  border: 1px solid var(--main);
  box-shadow: none;
  outline: none;
}

.style-submit {
  background: var(--main);
  border: solid 3px var(--main);
  border-radius: 5rem;
  color: #fff;
  cursor: pointer;
  font-size: 100%;
  font-weight: 600;
  padding: 1.5rem;
  transition: .3s;
  width: 80%;
}

.style-submit:hover {
  background: #E66D2F;
}

.message {
  background: #F8E2E4;
  color: #C8101D;
  margin-bottom: 1rem;
  padding: .5rem;
}

article.style-login .style-wrap .style-container label {
  margin-top: 0;
}

article.style-login .style-wrap .style-container p.style-help {
  margin-top: 1rem;
}

@media screen and (max-width: 480px) {
  article.style-login .style-wrap h1 {
    font-size: 115%;
  }

  article.style-login .style-wrap .style-container {
    margin: 3rem auto;
    padding: 3rem;
  }

  article.style-login .style-wrap .style-container p.style-help a::before {
    padding: 0 .5rem;
  }

  .style-submit {
    width: 100%;
  }
}

/*
  top
----------------------------*/
article.style-top {
  background: #f6f6f6;
  min-height: 100vh;
  padding-bottom: 2rem;
}

article.style-top section {
  background: #fff;
  border-radius: 2rem;
  box-shadow: 0 .5rem 2rem rgba(0, 0, 0, 0.08);
  margin: 2rem auto;
  padding: 3rem 5rem;
  width: 90%;
  max-width: 150rem;
}

article.style-top section h2 {
  margin-bottom: 2rem;
  padding: 0 0 0 3.5rem;
  position: relative;
}

article.style-top section h2::before {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 2.5rem;
  height: 2.6rem;
}

article.style-top section.loginBlock h2::before {
  content: url("../images/icon_user.svg");
}

article.style-top section.loginBlock dl {
  border-top: solid 1px #eee;
  color: #555;
  font-size: 93%;
}

article.style-top section.loginBlock dl>div {
  border-bottom: solid 1px #eee;
  display: flex;
  padding: 1.5rem 0;
}

article.style-top section.loginBlock dl dt {
  border-right: solid 1px var(--main);
  flex-basis: 10rem;
  font-weight: 500;
}

article.style-top section.loginBlock dl dd {
  padding-left: 5rem;
}

article.style-top section.newsBlock h2::before {
  content: url("../images/icon_news.svg");
}

article.style-top section.newsBlock ul {
  border-top: solid 1px #eee;
  list-style: none;
}

article.style-top section.newsBlock ul li {
  border-bottom: solid 1px #eee;
  color: #555;
  display: block;
  padding: 1.5rem 1rem;
  position: relative;
}

article.style-top section.newsBlock ul li time {
  color: var(--main);
  font-weight: 500;
}

article.style-top section.newsBlock ul li p {
  font-size: 93%;
  text-align: justify;
}

@media screen and (max-width: 480px) {
  article.style-top section {
    margin: 2rem auto;
    padding: 2.5rem 3rem;
    width: 90%;
  }

  article.style-top section.loginBlock dl dt {
    flex-basis: 28%;
    white-space: nowrap;
  }

  article.style-top section.loginBlock dl dd {
    flex-basis: 72%;
    width: auto;
    padding-left: 2.5rem;
  }
}

/*
  training
----------------------------*/
article.style-training {
  background: #f6f6f6;
  min-height: 100vh;
  padding-bottom: 2rem;
}

article.style-training section.style-table .style-container .tableWrap table tr td:first-of-type {
  text-align: center;
}

/*
  表組ページ
----------------------------*/
section.style-table {
  background: #fff;
  border-radius: 2rem;
  box-shadow: 0 .5rem 2rem rgba(0, 0, 0, 0.08);
  margin: 3rem auto;
  padding: 4rem 5rem;
  width: 90%;
  max-width: 150rem;
}

section.style-table .style-wrap {
  margin: auto;
  max-width: 150rem;
}

section .style-title {
  margin-bottom: 2.5rem;
  text-align: center;
}

section .style-title h2 {
  font-size: 26px;
  font-weight: 600;
}

section .style-title p a {
  font-size: 90%;
  text-decoration: underline;
}

section .style-title .btn {
  margin: 1.5rem auto 3rem;
  max-width: 22rem;
}

.style-container label {
  display: inline-block;
  margin: 2rem .5rem 1.5rem;
}

#backup .style-container label {
  display: inline-block;
  margin: 0 0 1.5rem;
}

.style-container .style-tool {
  display: flex;
  justify-content: center;
}

.style-container .style-tool .style-search {
  flex-basis: 60%;
  position: relative;
  max-width: 50rem;
}

#searchModal .style-container .style-tool .style-search {
  flex-basis: 100%;
  margin-top: 2rem;
  max-width: 100%;
}

#searchModal .style-container .tableWrap {
  margin: 1rem 0;
  max-height: 45rem;
  overflow: scroll;
}

#searchModal .style-container .tableWrap table {
  margin-top: 0;
  white-space: nowrap;
}

#searchModal .style-container .tableWrap table th {
  top: 0;
}

.style-container .style-tool .style-output {
  flex-basis: 60%;
  max-width: 20rem;
  text-align: center;
}

.style-container .style-tool .style-search button {
  background: url("../images/icon_search.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  content: "";
  position: absolute;
  right: 2rem;
  top: 50%;
  transform: translateY(-50%);
  width: 2rem;
  height: 2rem;
}

.style-container .style-tool input.style-text {
  border-radius: 5rem;
  padding-left: 2rem;
  width: 100%;
}

.style-container .style-pagenation {
  align-items: center;
  display: flex;
  justify-content: center;
}

.style-container .style-pagenation p {
  margin-right: 2rem;
}

.style-container .style-pagenation li {
  border: solid 1px #eee;
  line-height: 4rem;
  margin-left: .5rem;
  text-align: center;
  width: 4rem;
  height: 4rem;
}

@media screen and (max-width: 480px) {
  .style-container .style-pagenation li {
    line-height: 3rem;
    margin-left: .5rem;
    text-align: center;
    width: 3rem;
    height: 3rem;
  }
}

.style-container .style-pagenation li.active {
  background: #eee;
}

.style-container .style-pagenation li a {
  display: block;
  height: 100%;
  text-decoration: underline;
}

.style-container .style-pagenation .prevArrow {
  background: url("/images/btn_arrow_prev.svg");
  background-repeat: no-repeat;
}

.style-container .style-pagenation .nextArrow {
  background: url("/images/btn_arrow_next.svg");
  background-repeat: no-repeat;
}

section .style-container .tableWrap table {
  font-size: 90%;
  margin: 2rem auto;
  position: relative;
  width: 100%;
}

section .style-container .tableWrap table a {
  text-decoration: underline;
}

section .style-container .tableWrap table th {
  background: var(--main);
  border: solid 1px #fff;
  color: #fff;
  padding: .8rem .4rem;
  top: 6rem;
  vertical-align: middle;
}

section .style-container .tableWrap table.sticky th {
  position: -webkit-sticky;
  position: sticky;
  z-index: 2;
}

section .style-container .tableWrap table th.large {
  width: 40%;
}

section .style-container .tableWrap table tr:nth-of-type(2n) {
  background: #f6f6f6;
}

section .style-container .tableWrap table td {
  border: solid 1px #ccc;
  padding: .5rem .3rem;
}

/*list*/
.style-list .style-container .tableWrap table td {
  vertical-align: middle;
}

/*companylist*/
section .style-container .tableWrap.style-scroll {
  overflow-x: scroll;
  white-space: nowrap;
}

section.style-table .style-container .tableWrap.style-scroll table th {
  position: static;
  vertical-align: middle;
}

section.style-table .style-container .tableWrap {
  overflow-x: scroll;
  white-space: nowrap;
}

section.style-table .style-container .tableWrap table th {
  position: static;
  vertical-align: middle;
}

section.style-table .style-container .tableWrap table td {
  white-space: normal;
}

@media screen and (min-width: 1000px) {
  section.style-table .style-container .tableWrap table th {
    max-width: 40rem;
  }

  section.style-table .style-container .tableWrap table td {
    max-width: 40rem;
    white-space: normal;
  }

  section.style-table .style-container .tableWrap table td.w400 {
    min-width: 40rem;
  }

  section.style-table .style-container .tableWrap table td.w200 {
    min-width: 25rem;
  }

}

@media screen and (max-width: 1000px) {
  section .style-title {
    margin-bottom: 1.5rem;
    text-align: center;
  }

  section.style-table .style-container .tableWrap {
    white-space: nowrap;
  }

}

@media screen and (max-width: 700px) {
  section.style-table {
    margin: 3rem auto;
    padding: 1.5rem;
    width: 90%;
  }

  section .style-title h2 {
    font-size: 18px;
  }

  section.style-table .style-title .btn {
    margin: 1rem auto 1.5rem;
  }

  section.style-table .style-container .style-tool {
    display: block;
  }

  section.style-table .style-container .style-tool .style-pagenation {
    justify-content: center;
    margin: 2rem 0;
  }

  section.style-table .style-container .style-tool .style-pagenation p {
    margin: 0 2rem;
    order: 2;
  }

  section.style-table .style-container .style-tool .style-pagenation .prevArrow {
    order: 1;
  }

  section.style-table .style-container .style-tool .style-pagenation .nextArrow {
    order: 3;
  }

  section.style-table .style-container .tableWrap table {
    margin: 1.5rem 0;
  }
}

@media screen and (max-width: 500px) {
  section.style-table {
    margin: 3rem auto 5rem;
  }
}

/*
  表組詳細設定
----------------------------*/
@media screen and (min-width: 1000px) {

  table tr th,
  table tr td {
    max-width: 70rem;
    overflow-wrap: break-word;
    word-wrap: break-word;
  }

  #adminNamelist table tr th,
  #adminNamelist table tr td {
    max-width: 25rem;
    overflow-wrap: break-word;
    word-wrap: break-word;
  }
}

/*companyTraining*/
#companyTraining table tr td:first-of-type,
#companyTraining table tr td:nth-of-type(2),
#companyTraining table tr td:nth-of-type(7),
#companyTraining table tr td:last-of-type {
  text-align: center;
}

/* companyStudents */
#companyStudents table tr td:first-of-type,
#companyStudents table tr td:nth-of-type(7),
#companyStudents table tr td:last-of-type {
  text-align: center;
}


/*CompanyStudentslist*/
#CompanyStudentslist table tr td:first-of-type,
#CompanyStudentslist table tr td:nth-of-type(2),
#CompanyStudentslist table tr td:nth-of-type(3),
#CompanyStudentslist table tr td:nth-of-type(8),
#CompanyStudentslist table tr td:nth-of-type(9),
#CompanyStudentslist table tr td:nth-of-type(11),
#CompanyStudentslist table tr td:last-of-type {
  text-align: center;
}

#CompanyStudentslist #searchModal table tr td {
  text-align: left;
}

/*CompanyList*/
#CompanyList table tr td:first-of-type,
#CompanyList table tr td:nth-of-type(5),
#CompanyList table tr td:nth-of-type(6),
#CompanyList table tr td:last-of-type {
  text-align: center;
}

/*student/list*/
.style-pointsSum {
  border: dashed 2px #ccc;
  border-radius: 1rem;
  display: inline-block;
  font-weight: 500;
  margin-right: 1.5rem;
  padding: 1rem;
}

.style-pointsSum strong {
  color: var(--main);
  font-size: 135%;
  font-weight: 900;
  padding-left: 1rem;
  vertical-align: baseline;
}

.style-searchResult {
  background: #eee;
  font-weight: 600;
  margin: 1rem 0;
  padding: 1rem;
}

/*studentTraining*/
#studentTraining table tr td:first-of-type,
#studentTraining table tr td:nth-of-type(2),
#studentTraining table tr td:nth-of-type(4),
#studentTraining table tr td:nth-of-type(5),
#studentTraining table tr td:nth-of-type(6),
#studentTraining table tr td:nth-of-type(7),
#studentTraining table tr td:nth-of-type(8),
#studentTraining table tr td:nth-of-type(9),
#studentTraining table tr td:last-of-type {
  text-align: center;
}

#studentTraining #checkModalTable tr td {
  text-align: left;
}

/*adminUnitlist*/
#adminUnitlist table tr td:first-of-type,
#adminUnitlist table tr td:last-of-type {
  text-align: center;
}

#adminUnitlist table#unitlistTable tr td:nth-of-type(2) {
  text-align: left;
}

#adminUnitlist .modal table tr td {
  text-align: left;
}

/*adminWorkflow*/
#adminWorkflow table tr td:nth-of-type(5) {
  text-align: left;
}

/*adminCompanylist*/
#adminCompanylist table tr td:first-of-type,
#adminCompanylist table tr td:nth-of-type(4),
#adminCompanylist table tr td:nth-of-type(16),
#adminCompanylist table tr td:last-of-type {
  text-align: center;
}

/*adminMemberlist*/
#adminMemberlist table tr td:first-of-type,
#adminMemberlist table tr td:nth-of-type(6),
#adminMemberlist table tr td:nth-of-type(7),
#adminMemberlist table tr td:nth-of-type(8),
#adminMemberlist table tr td:nth-of-type(9),
#adminMemberlist table tr td:nth-of-type(10),
#adminMemberlist table tr td:last-of-type {
  text-align: center;
}

#adminMemberlist table tr td:nth-of-type(3),
#adminMemberlist table tr td:nth-of-type(4) {
  max-width: 20rem;
}

/*adminList*/
#adminList table tr td:first-of-type,
#adminList table tr td:nth-of-type(6),
#adminList table tr td:nth-of-type(7),
#adminList table tr td:nth-of-type(8),
#adminList table tr td:last-of-type {
  text-align: center;
}

/*adminNamelist*/
#adminNamelist table tr td {
  vertical-align: middle;
}

#adminNamelist table tr td:first-of-type,
#adminNamelist table tr td:nth-of-type(5),
#adminNamelist table tr td:last-of-type {
  text-align: center;
}

#adminNamelist table tr th.valColumn {
  width: 40%;
}

@media screen and (max-width: 1024px) {
  .style-pointsSum {
    display: block;
    margin-right: 0;
    text-align: center;
  }

  #StudentList section.style-table .style-container .tableWrap {
    overflow-x: visible;
    white-space: unset;
  }

  #StudentList .style-trainingItem {
    border: solid 2px #ddd;
    border-radius: 5px;
    margin: 2rem 0;
    overflow: hidden;
  }

  #StudentList .style-emp {
    background: var(--main);
    border-bottom: solid 1px #fff;
    color: #fff;
    padding: .5rem;
    text-align: center;
  }

  #StudentList .style-trainingInfo {
    line-height: 1.4;
    padding: .5rem 1rem;
  }

  #StudentList .style-trainingInfo.center {
    font-weight: 600;
    text-align: center;
  }

  #StudentList .style-trainingInfo p strong {
    display: block;
    margin-bottom: .5rem;
  }

  #StudentList .style-scrollX {
    overflow-x: scroll;
    white-space: nowrap;
  }

  #StudentList .style-tableCell {
    display: flex;
  }

  #StudentList .style-tableCell p {
    border-right: solid 1px #ccc;
    padding: .5rem;
    text-align: center;
    min-width: 25%;
  }

  #StudentList .style-tableCell p.style-emp {
    border-right: solid 1px #fff;
  }

  #StudentList .style-tableCell p:last-of-type {
    border-right: none;
  }
}

/*ソート*/
table tr th.sortCol span.sortBtn {
  cursor: pointer;
}

/*
  upload
----------------------------*/
article.style-upload section.uploadBlock {
  background: #fff;
  border-radius: 2rem;
  box-shadow: 0 .5rem 2rem rgba(0, 0, 0, 0.08);
  margin: 3rem auto;
  padding: 4rem 5rem;
  width: 90%;
  max-width: 150rem;
}

article.style-upload section.uploadBlock .style-container {
  margin-top: 4rem;
}

article.style-upload section.uploadBlock .style-container .style-btnWrap {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

article.style-upload section.uploadBlock .style-container .style-btnWrap input {
  flex-basis: 81%;
  margin-bottom: 2rem;
}

article.style-upload section.uploadBlock .style-container .style-btnWrap .btn {
  flex-basis: 18%;
  padding: .5rem 2rem;
  text-align: center;
}

.btn.reference {
  background: #bbb;
  border: solid 2px #aaa;
  padding: .5rem 1rem;
}

article.style-upload section.uploadBlock .style-container .style-wrap>.btn {
  max-width: 25rem;
  text-align: center;
}

@media screen and (max-width: 700px) {
  section.uploadBlock {
    margin: 3rem auto;
    padding: 2rem;
    width: 90%;
  }

  article.style-upload section.uploadBlock {
    padding: 2rem;
  }
}

/*
  studentTraining
----------------------------*/
#studentTraining main {
  position: relative;
}

#studentTraining main .style-cumulate {
  background: #fff;
  border: solid 1rem var(--main);
  display: block;
  padding: 6.5rem 1.5rem 1.5rem;
  position: absolute;
  right: 10%;
  text-align: center;
  width: 20rem;
}

#studentTraining main .style-cumulate p strong {
  font-size: 18px;
  font-weight: 600;
}

#studentTraining main .style-cumulate p small {
  font-size: 13px;
}

#studentTraining main .style-cumulate p span {
  color: var(--main);
  font-size: 30px;
  font-weight: 900;
}

#studentTraining main .style-cumulate .btn {
  border: none;
  padding: 0;
}

#studentTraining main .style-cumulate .btn a {
  padding: .4rem 0;
}

#studentTraining main .style-cumulate .btn:not(.active) {
  background: #ccc;
  pointer-events: none
}

@media screen and (max-width: 810px) {
  #studentTraining main .style-cumulate {
    padding: 1.5rem;
    position: relative;
    left: 5%;
    right: auto;
    top: 8rem;
    width: 90%;
  }

  #studentTraining main .style-headerBG {
    padding-top: 7rem;
  }
}

/*
  baselist
----------------------------*/
section.addListBlock {
  background: #fff;
  border-radius: 2rem;
  box-shadow: 0 .5rem 2rem rgba(0, 0, 0, 0.08);
  margin: 3rem auto;
  padding: 4rem 5rem;
  width: 90%;
  max-width: 150rem;
}

section.addListBlock h2 {
  font-size: 20px;
}

section.addListBlock .style-container .style-wrap {
  margin: 0 auto;
  max-width: 75rem;
}

section.addListBlock .style-container .style-wrap form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

section.addListBlock .style-container .style-wrap form p {
  flex-basis: 100%;
}

section.addListBlock .style-container .style-wrap form select {
  margin-bottom: 1rem;
  flex-basis: 80%;
}

section.addListBlock .style-container .style-wrap form input[type="file"]#csv,
section.addListBlock .style-container .style-wrap form input[type="file"]#excel {
  flex-basis: 80%;
  margin-bottom: 0;
}

section.addListBlock .style-container .style-wrap form button {
  font-size: 102%;
}

@media screen and (max-width: 700px) {
  section.addListBlock {
    margin: 3rem auto;
    padding: 2rem;
    width: 90%;
  }

  section.addListBlock .style-container .style-wrap form {
    display: block;
  }

  section.addListBlock .style-container .style-wrap form button {
    margin-top: 1rem;
  }

}

/*
  workflow
----------------------------*/
article.style-workflow section.style-table .style-container label {
  margin: 0;
}

article.style-workflow section.style-table .style-container .tableWrap table {
  margin-top: 1rem;
}

article.style-workflow section.style-table .style-container .tableWrap table tr.inactive {
  display: none;
}

article.style-workflow section.style-table .style-container .tableWrap table tr td {
  text-align: center;
}

article.style-workflow section.style-table .style-container .tableWrap table tr td:nth-of-type(3),
article.style-workflow section.style-table .style-container .tableWrap table tr td:last-of-type {
  text-align: left;
}

/*
  ローディング
----------------------------*/
#style-loader {
  background-color: rgba(255, 255, 255, 0.8);
  position: fixed;
  left: 0;
  top: 0;
  transition: all 1s;
  width: 100vw;
  height: 100vh;
  z-index: 9999;
}

.style-spinner {
  animation: scaleout 1.0s infinite ease-in-out;
  background-color: var(--main);
  border-radius: 100%;
  margin: 40vh auto auto;
  width: 10rem;
  height: 10rem;
}

@keyframes scaleout {
  0% {
    transform: scale(0);
  }

  100% {
    transform: scale(1.0);
    opacity: 0;
  }
}

#style-loader.loaded {
  opacity: 0;
  visibility: hidden;
}

/*
  モーダル
----------------------------*/
.modal,
.delModal,
.searchModal,
.checkModal,
.addModal {
  background-color: rgba(0, 0, 0, 0.6);
  display: none;
  overflow: auto;
  position: fixed;
  left: 0;
  top: 0;
  text-align: center;
  width: 100%;
  height: 100vh;
  z-index: 100;
}

.modal.active,
.delModal.active,
.searchModal.active,
.checkModal.active,
.addModal.active {
  display: block;
}

.style-modal__content {
  animation: modalOpen .3s;
  background: #fff;
  border-radius: 2rem;
  box-shadow: 0 .5rem 2rem rgba(0, 0, 0, 0.08);
  display: inline-block;
  margin: 10vh auto;
  text-align: left;
  width: 90%;
  max-width: 70rem;
}

#adminUnitlist .second .style-modal__content {
  max-width: 90rem;
}

@keyframes modalOpen {
  from {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

.style-modal__content .style-txt {
  color: #555;
  font-size: 90%;
  margin-top: .5rem;
}

.style-modal__content>div {
  padding: 4rem;
}

.style-modal__content>div:nth-of-type(2) {
  background: #f2f2f2;
  border-radius: 0 0 2rem 2rem;
  padding: 3rem 4rem;
  position: relative;
}

.style-modal__content>div:nth-of-type(2) input {
  background: #fff;
}

.style-modal__content>div:nth-of-type(2) input.style-text {
  border: solid 1px #ccc;
}

.style-modal__content>div:nth-of-type(2) input.style-text:focus {
  border: solid 1px var(--main);
}


.style-modal__content>div:nth-of-type(2) input::placeholder {
  font-size: 80%;
}

.style-modal__content>div:nth-of-type(2) button {
  background: url("../images/icon_send.svg");
  content: "";
  cursor: pointer;
  position: absolute;
  right: 5rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.8rem;
  height: 1.8rem;
}

.style-modal__content dl {
  margin: 1.5rem 0 2rem;
}

.style-modal__content dl>div {
  display: flex;
  font-size: 90%;
  padding: 1.5rem 0;
  border-bottom: dotted 1px #ddd;
}

.style-modal__content dl dt {
  /*border-right: solid 1px #ddd;*/
  flex-basis: 35%;
}

.style-modal__content dl dt span {
  background: #F8E2E4;
  color: #C8101D;
  display: inline-block;
  font-size: 80%;
  font-weight: 700;
  padding: .1rem .5rem;
}

.style-modal__content dl dd {
  flex-basis: 65%;
  flex-wrap: wrap;
  padding-left: 2rem;
}

.style-modal__content dl dd div span {
  display: flex;
  margin: 1rem 0;
}

.style-modal__content dl dd select {
  padding: .5rem;
}

.style-modal__content dl dd button {
  color: var(--main);
  margin-bottom: 1.5rem;
}

.style-modal__content .style-btnWrap {
  display: flex;
  justify-content: flex-end;
  text-align: center;
}

#checkModal .style-modal__content .style-btnWrap {
  margin-top: 1rem;
}

#checkModal .style-modal__content h2 {
  margin-bottom: 1rem;
}

#checkModal .style-modal__content .tableWrap {
  max-height: 65vh;
  overflow-y: scroll;
}

#checkModal .style-modal__content .tableWrap table {
  margin: 0;
}

#checkModal .style-modal__content .tableWrap table th {
  top: 0;
}

.style-modal__content .style-btnWrap .btn {
  font-size: 14px;
  font-weight: 500;
  margin: 0 .7rem;
  padding: .6rem;
  width: 11.5rem;
}

.style-modal__content .style-btnWrap .btn.modalClose,
.style-modal__content .style-btnWrap .btn.delModalClose,
.style-modal__content .style-btnWrap .btn.searchModalClose,
.style-modal__content .style-btnWrap .btn.checkModalClose,
.style-modal__content .style-btnWrap .btn.addModalClose {
  background: #ddd;
  border: solid 3px #ddd;
  color: #555;
}

.style-modal__content .style-btnWrap .btn.modalClose:hover {
  background: #ccc;
}

.style-modal__content .addModalWrap {
  margin: 2rem 0;
  max-height: 50rem;
  overflow-y: scroll;
}

.style-modal__content .addModalWrap table {
  margin: 0;
}

#CompanyStudentslist .style-modal__content .addModalWrap table tr td {
  text-align: left;
}

/*workflow*/
.style-workflow .style-modal__content dl>div:last-of-type {
  display: block;
}

.style-workflow .style-modal__content dl>div:last-of-type dd {
  margin-top: .5rem;
}

.style-workflow .style-modal__content dl>div:last-of-type dd a {
  text-decoration: underline;
}

@media screen and (max-width: 480px) {
  .style-modal__content {
    margin: 3vh auto 10vh;
  }

  .style-modal__content>div {
    padding: 2rem;
  }

  .style-modal__content>div:nth-of-type(2) {
    padding: 2rem;
  }

  .style-modal__content>div:nth-of-type(2) button {
    right: 3rem;
  }

  .style-modal__content .style-btnWrap .btn {
    width: 10rem;
  }

  #checkModal .style-modal__content .tableWrap {
    max-height: 75vh;
  }
}

/*
  students
----------------------------*/
article.style-students {
  background: #f6f6f6;
  min-height: 100vh;
  padding-bottom: 2rem;
}

article.style-students section .style-infoBlock {
  margin: 2rem auto;
}

article.style-students section.style-table .style-title .btn {
  margin: 1.5rem auto 2rem;
}

article.style-students section.style-table .style-btnWrap {
  margin: 2.5rem 0 0;
}

article.style-students section.style-table .style-btnWrap .btn {
  border: none;
  background: none;
  display: inline-block;
  padding: 0;
}

article.style-students section.style-table .style-btnWrap .btn a {
  background: var(--main);
  border-radius: 5rem;
  font-weight: 400;
  padding: .2rem 1rem;
}

article.style-students section.style-table .style-btnWrap .btn a.disabled {
  background: #bbb;
}

article.style-students section.style-table .style-btnWrap .btn a.disabled:hover {
  opacity: 1;
}

article.style-students section.style-table .style-container .tableWrap table {
  margin-top: 1rem;
}

article.style-students section.style-table table label {
  margin: 0 0 0 .5rem;
  position: relative;
  top: -.5rem;
}

article section .style-infoBlock dl {
  border-top: solid 1px #eee;
  color: #555;
  font-size: 93%;
}

article section .style-infoBlock dl>div {
  border-bottom: solid 1px #eee;
  display: flex;
  padding: 1rem 0;
}

article section .style-infoBlock dl dt {
  border-right: solid 1px var(--main);
  flex-basis: 10rem;
  font-weight: 500;
}

article section .style-infoBlock dl dd {
  padding-left: 5rem;
}

@media screen and (max-width: 480px) {
  article.style-students section.style-table .style-btnWrap {
    margin-top: 0;
  }

  article section .style-infoBlock dl>div {
    display: block;
  }

  article section .style-infoBlock dl dt {
    border-bottom: dashed 1px var(--main);
    border-right: none;
    font-weight: 600;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
  }

  article section .style-infoBlock dl dd {
    padding-left: 0;
  }
}

/*
  log
----------------------------*/
article.style-log section.style-search {
  background: #fff;
  border-radius: 2rem;
  box-shadow: 0 .5rem 2rem rgba(0, 0, 0, 0.08);
  margin: 3rem auto;
  padding: 1.5rem 3rem;
  width: 90%;
  max-width: 150rem;
}

article.style-log section.style-search .style-title {
  margin-bottom: 1rem;
}

article.style-log section.style-search .style-infoBlock dl dd {
  align-items: center;
  display: flex;
}

article.style-log section.style-search .style-infoBlock dl dd button {
  font-weight: 600;
  margin: 2rem auto;
  width: 20rem;
}

article.style-log section.style-search .style-infoBlock dl dd span {
  margin: 0 1rem;
}

article.style-log section.style-search button {
  background: var(--main);
  border: solid 3px var(--main);
  border-radius: 5rem;
  color: #fff;
  cursor: pointer;
  display: block;
  font-size: 100%;
  font-weight: 600;
  margin: 1.5rem auto 0;
  max-width: 25rem;
  min-width: 16rem;
  padding: .7rem;
  text-align: center;
  transition: .3s;
}

article.style-log section.style-search button:hover {
  background: #E66D2F;
  opacity: 1;
}

article.style-log section.style-table table th,
article.style-log section.style-table table td {
  vertical-align: middle;
}

@media screen and (max-width: 480px) {
  article.style-log section.style-search .style-infoBlock dl dd {
    display: block;
  }

  article.style-log section.style-search button {
    padding: .6rem;
  }

}

/*
  admin
----------------------------*/
article.style-admin .style-txt {
  margin: 1rem auto 3rem;
}

article.style-admin section.style-table .style-container table tr td {
  padding: 1rem;
  vertical-align: middle;
}

article.style-admin section.style-table .style-container table tr td:first-of-type {
  text-align: center;
  width: 80%;
}

article.style-admin section.style-table .style-container dl {
  margin: 3rem auto;
  max-width: 80rem;
}

article.style-admin section.style-table .style-container dl>div {
  align-items: center;
  background: #eee;
  border-radius: .5rem;
  display: flex;
  margin: 1.5rem 0;
  padding: 0 1rem;
}

article.style-admin section.style-table .style-container dl>div dt {
  flex-basis: 20%;
}

article.style-admin section.style-table .style-container dl>div dd {
  display: flex;
  flex-basis: 80%;
  justify-content: space-between;
}

@media screen and (max-width: 700px) {
  article.style-admin section.style-table .style-container dl>div {
    display: block;
  }
}

/*
  error
----------------------------*/
article.style-error {
  background: #f6f6f6;
  height: 100vh;
  padding-top: 18vh;
  text-align: center;
}

article.style-error .errorBlock {
  margin: 0 auto;
  width: 90%;
  max-width: 1000px;
}

article.style-error .style-title {
  margin: 4rem 0;
}

article.style-error .style-title h2 {
  color: var(--main);
  font-size: 16vw;
  line-height: 1;
}

article.style-error .style-title p {
  font-size: 3vw;
  font-weight: 600;
}

article.style-error .errorBlock .style-btnWrap {
  display: flex;
  justify-content: space-between;
  margin: 4rem 0;
}

article.style-error .errorBlock .style-btnWrap .btn {
  flex-basis: 31%;
}

@media screen and (max-width: 500px) {
  article.style-error .errorBlock .style-btnWrap {
    display: block;
  }

  article.style-error .errorBlock .style-btnWrap .btn {
    margin-bottom: 1.5rem;
  }
}

.style-errorList, .style-failedList {
  background: #eee;
  border: solid 1px #ccc;
  list-style: none;
  margin: 8px 0 20px;
  padding: 10px;
  overflow-y: scroll;
}
.style-errorList {
  height: 10vh;
}

.style-failedList {
  height: 50vh;
}

.importInfo p {
  margin-bottom: 16px;
}