@charset "UTF-8";
/* =========================================================
 Foundation
========================================================= */
/* =========================================================
 Base
========================================================= */
/* ==============================
	base/base
================================= */
html {
  font-size: 62.5%;
  color: #333;
  -webkit-text-size-adjust: 100%;
}

body {
  position: static;
  word-break: break-all;
  font-size: 150%;
  font-family: "Noto Sans JP", YuGothic, "游ゴシック体", "Yu Gothic Medium", "游ゴシック Medium", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
  letter-spacing: 0.05em;
}

canvas {
  vertical-align: top;
}

ul,
ol,
li {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

a {
  text-decoration: none;
}

img {
  max-width: 100%;
  vertical-align: bottom;
}

i {
  font-style: normal;
}

button {
  border: none;
  border-color: none;
  background: none;
  cursor: pointer;
}

div {
  line-height: 1.3;
  letter-spacing: 0.05em;
}

p {
  font-size: inherit;
  line-height: 1.3;
  letter-spacing: 0.05em;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
}

label {
  font-size: inherit;
  line-height: 1.3;
  letter-spacing: 0.05em;
}

input::-webkit-input-placeholder {
  font-size: inherit;
}

input::-moz-placeholder {
  font-size: inherit;
}

input:-ms-input-placeholder {
  font-size: inherit;
}

input::-ms-input-placeholder {
  font-size: inherit;
}

input::placeholder {
  font-size: inherit;
}

table {
  width: 100%;
  border-collapse: collapse;
}

main {
  display: block;
}

/* ==============================
	base/ 調整
================================= */
.mt0 {
  margin-top: 0px !important;
}

.mt5 {
  margin-top: 5px !important;
}

.mt10 {
  margin-top: 10px !important;
}

.mt15 {
  margin-top: 15px !important;
}

.mt20 {
  margin-top: 20px !important;
}

.mt25 {
  margin-top: 25px !important;
}

.mt30 {
  margin-top: 30px !important;
}

.mt35 {
  margin-top: 35px !important;
}

.mt40 {
  margin-top: 40px !important;
}

.mt45 {
  margin-top: 45px !important;
}

.mt50 {
  margin-top: 50px !important;
}

.mb0 {
  margin-bottom: 0px !important;
}

.mb5 {
  margin-bottom: 5px !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.mb15 {
  margin-bottom: 15px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb25 {
  margin-bottom: 25px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.mb35 {
  margin-bottom: 35px !important;
}

.mb40 {
  margin-bottom: 40px !important;
}

.mb45 {
  margin-bottom: 45px !important;
}

.mb50 {
  margin-bottom: 50px !important;
}

.mb60 {
  margin-bottom: 60px !important;
}

.mb80 {
  margin-bottom: 80px !important;
}

.mb100 {
  margin-bottom: 100px !important;
}

.mb110 {
  margin-bottom: 110px !important;
}

.mb120 {
  margin-bottom: 120px !important;
}

.ml0 {
  margin-left: 0px !important;
}

.ml5 {
  margin-left: 5px !important;
}

.ml10 {
  margin-left: 10px !important;
}

.ml15 {
  margin-left: 15px !important;
}

.ml20 {
  margin-left: 20px !important;
}

.ml25 {
  margin-left: 25px !important;
}

.ml30 {
  margin-left: 30px !important;
}

.ml35 {
  margin-left: 35px !important;
}

.ml40 {
  margin-left: 40px !important;
}

.ml45 {
  margin-left: 45px !important;
}

.ml50 {
  margin-left: 50px !important;
}

.mr0 {
  margin-right: 0px !important;
}

.mr5 {
  margin-right: 5px !important;
}

.mr10 {
  margin-right: 10px !important;
}

.mr15 {
  margin-right: 15px !important;
}

.mr20 {
  margin-right: 20px !important;
}

.mr25 {
  margin-right: 25px !important;
}

.mr30 {
  margin-right: 30px !important;
}

.mr35 {
  margin-right: 35px !important;
}

.mr40 {
  margin-right: 40px !important;
}

.mr45 {
  margin-right: 45px !important;
}

.mr50 {
  margin-right: 50px !important;
}

.pt0 {
  padding-top: 0px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.pb0 {
  padding-bottom: 0px !important;
}

/* =========================================================
 Layout
========================================================= */
/* =========================================================
 Module
========================================================= */
.border {
  border-radius: 5px;
  /* border: #CCC 1px solid; */
  padding: 15px 10px 10px 10px;
  margin-bottom: 40px;
  box-shadow: 0 7px 14px 0 rgb(65 69 88 / 10%), 0 3px 6px 0 rgb(0 0 0 / 7%);
}

@media (min-width: 768px) {
  .border {
    padding: 20px 20px;
  }
}

.border.add-margin {
  margin-bottom: 40px;
}

.box-parent .box {
  margin: 15px 0px;
  padding: 10px;
  border-radius: 5px;
  /* border: #CCC 1px solid; */
  min-height: 110px;
  box-shadow: 0 7px 14px 0 rgb(65 69 88 / 10%), 0 3px 6px 0 rgb(0 0 0 / 7%);
  color: #494949;
  background: transparent;
  border-left: solid 10px #18416A;
}

.box-parent .box.no-radius {
  border-radius: 0px;
  margin: 0;
}

.box-parent .box-tag-parent-tag {
  display: inline-block;
  margin-top: 5px;
}

.box-parent .box-tag-parent-tag .deletable-tag:hover {
  opacity: 0.7;
}

.box-parent .box:last-child {
  margin-bottom: 0px;
}

@media (min-width: 768px) {
  .box-parent .box {
    padding: 20px 32px;
    margin: 20px 0px;
  }
  .box-parent .box-padding {
    padding: 15px;
  }
}

.position-tag {
  display: inline-block;
}

.invite {
  display: inline-block;
  color: #17416A;
  border-radius: 10px;
  background-color: #F7E451;
  font-weight: bold;
  padding: 10px;
  font-size: 14px;
}


.invite:hover {
  opacity: 0.7;
}

@media (min-width: 768px) {
  .fa-plus {
    margin-left: 20px;
  }
}

.manager {
  border: #CCC 1px solid;
  border-radius: 5px;
  font-weight: bold;
  font-size: 16px;
  padding: 10px 10px;
  margin: 15px 0px;
}

.manager:last-child {
  margin-bottom: 0px;
}

@media (min-width: 768px) {
  .manager {
    padding: 20px 20px;
  }
}

.check-border {
  border: #CCC 1px solid;
  border-radius: 3px;
  color: #CCC;
  padding: 2px;
}

.public-domain {
  border: #CCC 1px solid;
  padding: 15px 10px;
  border-radius: 5px;
}

@media (min-width: 768px) {
  .public-domain {
    padding: 20px;
  }
}

.public-domain-child:last-child .margin-checkbox {
  margin: 0;
}

.job-detail {
  border: #CCC 1px solid;
  border-radius: 3px;
  color: #333;
  width: 100%;
  height: 150px;
  margin: 10px 0px 5px 0px;
  padding: 10px;
}

.job-detail.no-margin-bottom {
  margin-bottom: 0px;
}

.restriction {
  padding: 10px 120px 10px 10px;
  width: 150px;
  border-radius: 5px;
  border: 1px solid #CCC;
}

.restriction :disabled {
  color: #959595;
  background: #CCC;
  font-size: 14px;
}

@media (min-width: 768px) {
  .restriction {
    width: 200px;
  }
}

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

input[type="number"] {
  -moz-appearance: textfield;
}

.table-border {
  border: solid 1px #CCC;
  border-radius: 10px;
  max-width: 580px;
}

.management-border {
  border: solid 1px #CCC;
  border-top: 0;
}

.management-border:hover {
  opacity: 0.7;
}

.management-border:last-child {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.table-base {
  border: 1px solid #CCC;
  padding: 15px;
}

.table-base.table-title {
  font-size: 14px;
  font-weight: bold;
  background-color: #E3F1FF;
}

.table-base.text-decoration {
  text-decoration: underline;
}

.table-base.three-point {
  max-width: 200px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.table-base.three-point:nth-child(3) {
  max-width: 210px;
}

.table-base.three-point:nth-child(4) {
  max-width: 300px;
}

.table-base.three-point.company-table:nth-child(2) {
  max-width: 420px;
}

.table-base.three-point.company-table:nth-child(3) {
  max-width: 400px;
}

.text-decoration :hover {
  opacity: 0.7;
}

.default-border {
  border: 1px solid #CCC;
  border-radius: 5px;
  padding: 10px;
  width: 100%;
}

.default-border.error-color {
  background-color: #fad2d7;
}

.color.color-yellow {
  background-color: #fffcbc;
}

.border-parent .border-solid-line {
  padding: 10px;
  border: #CCC 1px solid;
}

.border-parent .border-solid-line:first-child, .border-parent .border-solid-line:last-child {
  border-bottom: none;
}

@media (min-width: 768px) {
  .border-parent .border-solid-line {
    padding: 15px;
  }
  .border-parent .border-solid-line.padding-last {
    padding: 10px;
  }
}

.work-create .text-form {
  margin-bottom: 15px;
}

@media (min-width: 768px) {
  .work-create .text-form {
    margin-bottom: 20px;
  }
}

.work-create .mail-error {
  margin-bottom: 0;
}

.work-create-company-name {
  margin-bottom: 15px;
}

@media (min-width: 768px) {
  .work-create-company-name {
    margin-bottom: 20px;
  }
}

.work-create .margin-change {
  margin-bottom: 5px;
}

.period-set {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.period-set .pt-size {
  padding: 15px;
}

.period-set-date .mail-error {
  margin-bottom: 0;
}

.period-set .error-text {
  margin: 0;
}

.period-set .error-text input,
.period-set .error-text textarea {
  margin: 0;
  padding: 0;
}

.period-set .error-text .input-icon {
  padding: 10px;
}

@media (min-width: 768px) {
  .period-set .error-text .input-icon {
    padding: 10px 5px 10px 40px;
  }
}

.applicants-set .error-text {
  margin: 0;
}

.applicants-set .error-text input {
  width: 150px;
}

@media (min-width: 768px) {
  .applicants-set .error-text input {
    width: 200px;
  }
}

.mdl-main-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 50px auto 20px auto;
  width: 100%;
  max-width: 310px;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  color: #17416A;
  padding: 15px 0;
  border-radius: 10px;
  background-color: #F7E451;
}

.mdl-main-button:hover {
  opacity: 0.7;
}

@media (min-width: 768px) {
  .mdl-main-button {
    font-size: 18px;
  }
}

@media (min-width: 768px) {
  .mdl-main-button {
    margin-top: 70px;
  }
}

.none-bottom-margin {
  margin-bottom: 0;
}

.all-none-margin {
  margin: 0;
}

.pc-right {
  margin-left: auto;
}

@media (min-width: 1000px) {
  .pc-right {
    width: calc(100% - 250px);
  }
}

.chat-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  position: fixed;
  z-index: 40;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
  height: 43px;
  padding: 0 15px;
  top: 60px;
  background-color: #E3F1FF;
  -webkit-transition: 0.3s top;
  transition: 0.3s top;
}

@media (min-width: 1000px) {
  .chat-top {
    top: 80px;
    width: calc(100% - 250px);
    height: 50px;
    padding: 0 20px;
    margin-left: auto;
  }
}

.chat-top-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-line-pack: justify;
      align-content: space-between;
  position: relative;
  width: 20px;
  height: 12px;
}

@media (min-width: 1000px) {
  .chat-top-btn {
    display: none;
  }
}

.chat-top-btn:hover {
  opacity: 0.7;
}

.chat-top-border {
  display: inline-block;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  width: 100%;
  height: 2px;
  border-radius: 1px;
  background-color: #17416A;
}

.chat-top .active {
  position: absolute;
}

.chat-top .active:nth-child(1) {
  height: 3px;
  -webkit-transform: translateY(6px) rotate(-45deg);
          transform: translateY(6px) rotate(-45deg);
  top: -1px;
  left: -1px;
  width: 100%;
}

.chat-top .active:nth-child(2) {
  opacity: 0;
}

.chat-top .active:nth-child(3) {
  height: 3px;
  -webkit-transform: translateY(-6px) rotate(45deg);
          transform: translateY(-6px) rotate(45deg);
  top: 11px;
  left: -1px;
  width: 100%;
}

.chat-top .mdl-text {
  width: calc(100% - 35px);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.chat-menu {
  position: fixed;
  z-index: 50;
  top: 103px;
  left: -100%;
  width: 100%;
  height: calc(100% - 103px);
  background-color: #E3F1FF;
  -webkit-transition: 0.3s left;
  transition: 0.3s left;
}

@media (min-width: 1000px) {
  .chat-menu {
    left: 0;
    top: 80px;
    width: 250px;
    height: calc(100% - 80px);
    padding-top: 50px;
    -webkit-box-shadow: -2px 0 6px 0 rgba(0, 0, 0, 0.2);
            box-shadow: -2px 0 6px 0 rgba(0, 0, 0, 0.2);
  }
}

.chat-menu-open {
  left: 0;
}

.chat-menu-scroll {
  height: 100%;
  overflow-y: scroll;
}

.chat-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 10px 15px;
}

.chat-link.active {
  background-color: rgba(255, 255, 255, 0.4);
  border-left: 5px solid #17416A;
  padding: 10px 15px 10px 10px;
}

.chat-link-name {
  font-size: 14px;
  font-weight: bold;
  color: #17416A;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.chat-link-company {
  font-size: 10px;
  font-weight: bold;
  color: #6D6D6D;
}

.chat-link:hover {
  opacity: 0.7;
}

.chat-field {
  margin-top: 50px;
  padding-bottom: 120px;
  overflow-y: scroll;
  -ms-overflow-style: none;
  /* IE, Edge 対応 */
  scrollbar-width: none;
  /* Firefox 対応 */
}

.chat-field::-webkit-scrollbar {
  /* Chrome, Safari 対応 */
  display: none;
}

.chat-field-wrap {
  width: 100%;
  padding: 15px;
}

@media (min-width: 1000px) {
  .chat-field-wrap {
    padding: 20px 20px 20px 50px;
  }
}

.chat-field-wrap-name {
  font-size: 14px;
  font-weight: bold;
}

.chat-field-wrap-date {
  font-size: 10px;
  font-weight: normal;
  color: #6D6D6D;
  padding-left: 5px;
}

@media (min-width: 1000px) {
  .chat-field-wrap-date {
    padding-left: 10px;
  }
}

.chat-field-wrap-text {
  font-size: 14px;
  line-height: 1.4;
  padding: 5px 0 0 25px;
}

#chat-field-scroll {
  height: 100%;
}

.chat-data {
  width: 100%;
  height: 100%;
  position: relative;
}

.chat-data-text {
  padding-top: 20px;
}

.chat-data .center-border {
  position: absolute;
  z-index: 20;
  top: 10px;
  left: 0px;
  width: 100%;
  height: 1px;
  background-color: #CCC;
}

.chat-data .date {
  position: absolute;
  top: 0;
  z-index: 30;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

.chat-textfield {
  position: fixed;
  bottom: 0;
  z-index: 35;
  width: 100%;
  padding: 5px 15px;
  background-color: #FFF;
  -webkit-box-shadow: 0 -2px 6px 0 rgba(0, 0, 0, 0.2);
          box-shadow: 0 -2px 6px 0 rgba(0, 0, 0, 0.2);
}

@media (min-width: 1000px) {
  .chat-textfield {
    width: calc(100% - 250px);
  }
}

.chat-textfield .file-error {
  display: inline;
  font-size: 12px;
  color: #c5283d;
}

.chat-textfield #textarea {
  resize: none;
  width: 100%;
  padding: 10px;
  margin: 5px 0;
  border-radius: 5px;
  border: 1px solid #CCC;
  overflow-x: hidden;
}

.chat-textfield #textarea::-webkit-input-placeholder {
  font-size: 16px;
  font-weight: bold;
  color: #959595;
}

.chat-textfield #textarea::-moz-placeholder {
  font-size: 16px;
  font-weight: bold;
  color: #959595;
}

.chat-textfield #textarea:-ms-input-placeholder {
  font-size: 16px;
  font-weight: bold;
  color: #959595;
}

.chat-textfield #textarea::-ms-input-placeholder {
  font-size: 16px;
  font-weight: bold;
  color: #959595;
}

.chat-textfield #textarea::placeholder {
  font-size: 16px;
  font-weight: bold;
  color: #959595;
}

.chat-textfield .chat-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.chat-textfield .chat-item-clip {
  font-size: 18px;
  color: #17416A;
}

.chat-textfield .chat-item .clip-btn:hover {
  opacity: 0.7;
}

.chat-textfield .chat-item-send {
  width: 100px;
  height: 33px;
  font-weight: bold;
  color: #17416A;
  border-radius: 5px;
  background-color: #F7E451;
}

.chat-textfield .chat-item-send:hover {
  opacity: 0.7;
}

.chat-file {
  display: none;
  overflow-x: scroll;
}

.chat-file .file {
  position: relative;
  width: 120px;
  min-width: 120px;
  height: 30px;
  padding: 5px;
  margin-right: 10px;
  border-radius: 5px;
  border: 1px solid #CCC;
}

@media (min-width: 768px) {
  .chat-file .file {
    margin-right: 15px;
  }
}

.chat-file .file:last-child {
  margin-right: 0;
}

.chat-file .file-icon {
  margin-right: 5px;
}

.chat-file .file-name {
  font-size: 10px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.chat-file .file-delete {
  position: absolute;
  top: -3px;
  right: -4px;
  width: 18px;
  height: 18px;
  border-radius: 10px;
  font-size: 12px;
  color: #17416A;
  background-color: #E3F1FF;
}

.chat-file .file-delete .icon {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.chat-file .file-delete:hover {
  opacity: 0.7;
}

.chat-file-open {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.chat-file-open .file {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 5px;
}

.input-checkbox {
  opacity: 0;
  margin: 0;
  position: absolute;
}

.input-checkbox-label {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  cursor: pointer;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.input-checkbox-label:hover {
  opacity: 0.7;
}

.input-checkbox-label::before {
  background-color: #FFF;
  border: #CCC 1px solid;
  border-radius: 2px;
  content: "";
  margin-right: 10px;
  padding: 10px 10px;
  width: 20px;
  height: 20px;
}

.input-checkbox-label::after {
  background-color: transparent;
  border-left: 3.5px solid #CCC;
  border-bottom: 3.5px solid #CCC;
  content: "";
  position: absolute;
  left: 4px;
  top: 4px;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  width: 15px;
  height: 10px;
  accent-color: #F7E451;
}

.input-checkbox[type="checkbox"]:checked + .input-checkbox-label::before {
  opacity: 1;
  background-color: #F7E451;
  border-color: #F7E451;
}

.input-checkbox[type="checkbox"]:checked + .input-checkbox-label::after {
  opacity: 1;
  background-color: #F7E451;
  border-color: #FFF;
}

.mdl-text {
  font-size: 14px;
  font-weight: normal;
}

@media (min-width: 768px) {
  .mdl-text {
    font-size: 16px;
  }
}

.mdl-text-bold {
  font-weight: bold;
}

.mdl-text-small {
  font-size: 12px;
  font-weight: normal;
}

@media (min-width: 768px) {
  .mdl-text-small {
    font-size: 14px;
  }
}

.mdl-bold {
  font-weight: bold;
}

.bottom20 {
  margin: 0 0 20px 0;
}

@media (min-width: 768px) {
  .bottom20 {
    margin: 0 0 30px 0;
  }
}

.popup-modal :hover {
  opacity: 0.7;
}

.popup-modal-dismiss:hover {
  opacity: 0.7;
}

.link :hover {
  opacity: 0.7;
}

.notification-link {
  display: inline-block;
  width: 100%;
  color: #333;
}

.notification-link:hover {
  opacity: 0.7;
}

.simple-border-radius {
  border: 1px solid #CCC;
  border-radius: 5px;
  padding: 10px;
}

@media (min-width: 768px) {
  .simple-border-radius {
    padding: 20px;
  }
}

.simple-border-radius .sub-paragraph-big {
  margin-bottom: 10px;
}

.simple-border-radius .pt-size {
  margin: 0;
}

.wrap-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.wrap-flex :first-child {
  margin-right: 30px;
}

.gray-text {
  font-size: 12px;
  color: #6D6D6D;
}

.display-area1-3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 1;
}

@media (min-width: 768px) {
  .display-area1-3 {
    -webkit-line-clamp: 3;
  }
}

.martin-b5-10 {
  margin-bottom: 5px;
}

@media (min-width: 768px) {
  .martin-b5-10 {
    margin-bottom: 10px;
  }
}

.margin-b40-50 {
  margin-bottom: 40px;
}

@media (min-width: 768px) {
  .margin-b40-50 {
    margin-bottom: 50px;
  }
}

.notification-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
}

.notification-area-left {
  width: calc(100% - 60px);
}

@media (min-width: 768px) {
  .notification-area-left {
    width: calc(100% - 123px);
  }
}

.inquiry .select-base {
  max-width: 345px;
}

.edit {
  display: inline-block;
  margin: 10px 0 0 0;
  color: #17416A;
}

@media (min-width: 768px) {
  .edit {
    margin: 5px 0 0 0;
  }
}

.edit-text {
  font-size: 14px;
  margin: 0 0 0 7px;
  text-decoration: underline;
}

.active-point-company .sub-paragraph-big {
  margin-top: 20px;
}

.fl-list {
  margin-bottom: 40px;
}

.fl-list:first-child {
  margin-top: 40px;
}

@media (min-width: 768px) {
  .fl-list {
    margin-bottom: 50px;
  }
  .fl-list:first-child {
    margin-top: 50px;
  }
}

.fl-list .sub-paragraph-big {
  margin-bottom: 15px;
}

@media (min-width: 768px) {
  .fl-list .sub-paragraph-big {
    margin-bottom: 20px;
  }
}

.fl-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.fl-wrap-name {
  display: inline-block;
  font-size: 16px;
  font-weight: bold;
  color: #17416A;
  margin-bottom: 5px;
  text-decoration: underline;
}

@media (min-width: 768px) {
  .fl-wrap-name {
    font-size: 18px;
  }
}

.company-name {
  font-size: 12px;
  color: #6D6D6D;
}

.data-point {
  font-size: 14px;
  font-weight: bold;
  margin-top: 18px;
}

.chat {
  position: relative;
}

.chat img {
  width: 18px;
}

@media (min-width: 768px) {
  .chat img {
    width: 40px;
  }
}

.chat-notification {
  position: absolute;
  width: 8px;
  min-width: 8px;
  height: 8px;
  border-radius: 10px;
  background-color: #c5283d;
  top: 2px;
  right: -3px;
}

@media (min-width: 768px) {
  .chat-notification {
    width: 14px;
    height: 14px;
  }
}

.double-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  margin-top: 15px;
  font-size: 16px;
  text-align: center;
}

.double-btn-link {
  width: 100%;
  height: 42px;
}

.double-btn-link:nth-child(1) {
  margin-right: 7.5px;
}

.double-btn-link:nth-child(2) {
  margin-left: 7.5px;
}

.gift-point-textfield {
  font-weight: bold;
  text-align: start;
}

.gift-point-textfield input {
  width: 150px;
}

@media (min-width: 768px) {
  .gift-point-textfield input {
    width: 200px;
  }
}

.pickr-width {
  width: 100%;
  max-width: 150px;
}

@media (min-width: 768px) {
  .pickr-width {
    max-width: 200px;
  }
}

.footer {
  margin: auto;
  padding: 13px 0;
  font-size: 12px;
  border-top: 2px solid #CCC;
  text-align: center;
  margin-top: 50px;
}

@media (min-width: 768px) {
  .footer {
    margin-top: 70px;
  }
}

.footer .mdl-text-link:hover {
  opacity: 0.7;
}

.mdl-text-link {
  display: inline-block;
  font-size: 14px;
  color: #17416A;
  text-decoration: underline;
}

.mdl-pulldown {
  font-size: 16px;
  font-weight: bold;
  width: 100%;
  padding: 11px 35px 11px 10px;
  margin: 15px 0;
  border: 1px solid #CCC;
  border-radius: 5px;
  background: url("../images/arrow.png") no-repeat right 10px center/18px auto;
}

@media (min-width: 768px) {
  .mdl-pulldown {
    max-width: 250px;
  }
}

.mdl-pulldown:hover {
  cursor: pointer;
  cursor: hand;
}

.mdl-pulldown.no-margin {
  margin-top: 0px;
}

.mdl-textfield {
  margin: 0 0 15px 0;
}

@media (min-width: 768px) {
  .mdl-textfield {
    margin: 0 0 20px 0;
  }
}

.mdl-textfield label {
  font-size: 14px;
  font-weight: bold;
}

@media (min-width: 768px) {
  .mdl-textfield label {
    font-size: 16px;
  }
}

.mdl-textfield input {
  width: 100%;
  padding: 10px 0 10px 8px;
  margin: 10px 0 0 0;
  border: 1px solid #CCC;
  border-radius: 5px;
  font-weight: bold;
}

.mdl-textfield ::-webkit-input-placeholder {
  font-size: 16px;
  font-weight: bolder;
  color: #959595;
}

.mdl-textfield ::-moz-placeholder {
  font-size: 16px;
  font-weight: bolder;
  color: #959595;
}

.mdl-textfield :-ms-input-placeholder {
  font-size: 16px;
  font-weight: bolder;
  color: #959595;
}

.mdl-textfield ::-ms-input-placeholder {
  font-size: 16px;
  font-weight: bolder;
  color: #959595;
}

.mdl-textfield ::placeholder {
  font-size: 16px;
  font-weight: bolder;
  color: #959595;
}

.mdl-textfield p {
  margin: 5px 0 0 0;
  font-size: 12px;
}

@media (min-width: 768px) {
  .gift-point-textfield {
    margin: 20px auto 0 auto;
  }
}

.mdl-transition {
  display: inline-block;
  width: 100%;
  text-align: center;
  text-decoration: underline;
  margin-bottom: 20px;
}

.mdl-transition a {
  color: #17416A;
}

.mdl-transition-top {
  margin-top: 20px;
}

.mdl-transition.margin-t40-50 {
  margin-top: 40px;
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .mdl-transition.margin-t40-50 {
    margin-top: 50px;
  }
}

.mdl-required {
  display: inline-block;
  width: 45px;
  height: 24px;
  text-align: center;
  font-size: 12px;
  color: #FFF;
  background-color: #c5283d;
  padding: 2px 0 0 0;
  margin: 0 0 0 5px;
  border-radius: 10px;
}

.mdl-required.width-auto {
  width: auto;
  padding: 3px 10px 0 10px;
  margin: 0;
}

.mdl-required.date {
  font-size: 10px;
  color: #333;
  background-color: #FFFCBC;
}

.status-color {
  font-weight: bold;
  padding: 3px 12px 2px 12px;
  width: auto;
}

.margin-none {
  margin: 0;
}

.release,
.applying {
  background-color: #449158;
}

.creating,
.order {
  background-color: #c5283d;
}

.endrelease,
.cancel {
  background-color: #959595;
}

.request {
  color: #333;
  background-color: #F7E451;
}

.complete {
  background-color: #333;
}

.beforeapply {
  background-color: #17416A;
}

.order-list {
  position: relative;
  padding: 10px;
  margin: 0 0 15px 0;
  border-radius: 5px;
  /* border: 1px solid #CCC; */
  box-shadow: 0 7px 14px 0 rgb(65 69 88 / 10%), 0 3px 6px 0 rgb(0 0 0 / 7%);
  overflow: hidden;
}

@media (min-width: 768px) {
  .order-list {
    margin: 0 0 20px 0;
  }
}

.order-list.add-margin {
  margin-bottom: 20px;
}

.order-list:last-child {
  margin: 0;
}

.order-list-status {
  margin: 0 0 5px 0;
}

@media (min-width: 768px) {
  .order-list-status {
    float: right;
  }
}

.order-list-sub-passenger {
  font-size: 16px;
  font-weight: bold;
  text-decoration: underline;
  margin: 0 0 20px 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.order-list-sub-passenger a {
  color: #17416A;
}

@media (min-width: 768px) {
  .order-list-sub-passenger {
    -webkit-line-clamp: 1;
  }
}

.order-list-sub-passenger:hover {
  opacity: 0.7;
}

.order-list-contents {
  clear: both;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  font-size: 12px;
  margin: 10px 0 0 0;
}

.order-list-contents-text {
  width: 100%;
  margin: 0 0 10px 0;
}

.order-list-contents-text:last-child {
  margin: 0;
}

.work-list .order-list-contents-text:last-child {
  margin-bottom: 20px;
}

@media (min-width: 768px) {
  .order-list-contents-text {
    width: auto;
    margin: 0 30px 0 0;
  }
}

.order-list-contents .textleft {
  display: inline-block;
  min-width: 100px;
}

@media (min-width: 768px) {
  .order-list-contents .textleft {
    margin: 2px 10px 0 0;
  }
}

.order-list-contents .textright {
  display: inline-block;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.4;
}

@media (min-width: 768px) {
  .order-list-contents .textright {
    white-space: nowrap;
  }
}

.order-list-contents .textright .client,
.order-list-contents .textright .client-name {
  display: inline-block;
  width: 100%;
}

@media (min-width: 768px) {
  .order-list-contents .textright .client,
  .order-list-contents .textright .client-name {
    display: inline;
    font-size: 12px;
  }
}

@media (min-width: 768px) {
  .order-list-contents {
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
}

@media (min-width: 768px) {
  .order-list {
    padding: 20px;
    /* min-height: 215px; */
  }
}

.notification::before {
  content: "";
  display: block;
  position: absolute;
  width: 10px;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #c5283d;
}

.notification-none {
  background-color: #CCC;
}

.margin-b15-20 {
  margin-bottom: 15px;
}

@media (min-width: 768px) {
  .margin-b15-20 {
    margin-bottom: 20px;
  }
}

.text-break-wrap {
  font-size: 20px;
  font-weight: bold;
}

.active-point {
  font-weight: bold;
  margin: 0 0 45px 0;
}

.active-point-text {
  color: #17416A;
  margin: 12px 0 0 0;
}

.active-point-text-big {
  font-size: 36px;
  margin: 0 12px 0 0;
}

.active-point.few-margin {
  margin-bottom: 30px;
}

.active-point.active-point-company {
  margin: 0;
}

@media (min-width: 768px) {
  .active-point.active-point-company {
    margin: 0 0 15px 0;
  }
}

.active-point.active-point-company .active-point-text {
  margin: 10px 0 0 0;
}

@media (min-width: 768px) {
  .active-point.active-point-company .active-point-text {
    margin: 20px 0 0 0;
  }
}

.point-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 15px 0;
  border-bottom: 1px solid #CCC;
}

.point-list-data {
  font-size: 12px;
  font-weight: bold;
  width: 100%;
  padding: 0 0 7px 0;
}

@media (min-width: 768px) {
  .point-list-data {
    font-size: 14px;
  }
}

.point-list-text {
  font-size: 14px;
  width: auto;
  width: calc(100% - 110px);
}

@media (min-width: 768px) {
  .point-list-text {
    max-width: 495px;
    font-size: 16px;
  }
}

.point-list-point {
  margin-left: auto;
  font-size: 14px;
  font-weight: bold;
  text-align: right;
  width: 110px;
}

@media (min-width: 768px) {
  .point-list-point {
    font-size: 16px;
  }
}

.plus {
  color: #17416A;
}

.minus {
  color: #c5283d;
}

.history-point-title {
  margin-bottom: 15px;
}

@media (min-width: 768px) {
  .history-point-title {
    margin-bottom: 20px;
  }
}

.history-point .text-form {
  margin-bottom: 0;
}

.history-point-data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media (min-width: 768px) {
  .history-point-data {
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
}

.history-point-data .mdl-main-button {
  width: auto;
  max-width: none;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  padding: 10px;
  margin: 10px 0 0 0;
}

@media (min-width: 768px) {
  .history-point-data .mdl-main-button {
    margin: 0 0 0 15px;
  }
}

.point-calendar {
  width: 100%;
}

@media (min-width: 768px) {
  .point-calendar {
    width: auto;
  }
}

.point-calendar .input-icon {
  max-width: 130px;
}

@media (min-width: 768px) {
  .point-calendar .input-icon {
    max-width: 200px;
  }
}

.find-count {
  font-size: 14px;
  font-weight: bold;
}

.toggle-button {
  position: relative;
  padding: 10px;
  margin: 10px 0 40px 0;
  /* border: 1px solid #CCC; */
  border-radius: 10px;
  box-shadow: 0 7px 14px 0 rgb(65 69 88 / 10%), 0 3px 6px 0 rgb(0 0 0 / 7%);
}

.toggle-button-checkbox {
  display: inline-block;
  font-size: 18px;
  font-weight: bold;
  width: 100%;
  background: url("../images/plus.png") no-repeat right 10px center/18px auto;
}

.toggle-button-checkbox:hover {
  cursor: pointer;
  cursor: hand;
  opacity: 0.7;
}

.toggle-button .none-input {
  display: none;
}

@media (min-width: 768px) {
  .toggle-button {
    padding: 20px;
    margin-bottom: 22px;
  }
}

.hidden {
  height: 0;
  opacity: 0;
  overflow: hidden;
}

.toggle-button input:checked ~ .hidden {
  height: auto;
  opacity: 1;
}

input:checked ~ .toggle-button-checkbox {
  background: url("../images/minus.png") no-repeat right 10px center/18px auto;
}

@media (min-width: 768px) {
  .hidden {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}

.hidden-work-keyword {
  margin: 20px 0 20px 0;
}

.hidden-work-keyword.few-margin {
  margin-bottom: 15px;
}

@media (min-width: 768px) {
  .hidden-work-keyword {
    width: 310px;
    margin-right: 20px;
  }
}

.hidden-contents-pulldown {
  margin-top: 10px;
}

.hidden-contents p {
  font-size: 14px;
  font-weight: bold;
}

@media (min-width: 768px) {
  .hidden-contents p {
    margin: 0 0 8px 0;
  }
}

.hidden-contents select {
  font-size: 14px;
  font-weight: bold;
}

@media (min-width: 768px) {
  .hidden-contents {
    width: 240px;
    margin-right: 20px;
  }
  .hidden-contents-pulldown {
    margin: 0;
  }
}

@media (opacity: 1199px) {
  .hidden-contents-last {
    margin-right: 0;
  }
}

.search-clear {
  color: #17416A;
  margin: 10px 0 0 0;
}

@media (min-width: 768px) {
  .search-clear {
    width: 120px;
  }
}

.none-margin {
  margin: 10px 0 0 0;
}

@media (min-width: 768px) {
  .none-margin {
    width: 155px;
    margin: 20px 20px 0 0;
  }
}

@media (min-width: 789px) {
  .none-margin {
    margin: 0px 20px 0 0;
  }
}

.work-list-sub-passenger {
  margin-bottom: 0;
}

.work-list-category {
  font-size: 12px;
  font-weight: 300;
  color: #6d6d6d;
  margin: 10px 0;
}

.work-list-contents {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.work-list-contents-text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 20px;
  padding: 0.25em 0.5em;
  color: #494949;
  background: transparent;
  border-left: solid 3px #7db4e6;
}

.work-list-edit {
  width: 100%;
  text-align: end;
  flex-basis: 50%;
}

@media (min-width: 768px) {
  .work-list-edit {
    width: 100%;
    text-align: end;
    flex-basis: 20%;
  }
}

.work-list-edit .edit:hover {
  opacity: 0.7;
}

.wrap .box-parent .reset {
  padding: 0;
  margin: 10px 0 0 0;
  border: 0px none;
}

@media (min-width: 768px) {
  .wrap .box-parent .reset {
    padding: 0;
    margin: 0;
    border: 0px none;
  }
}

.work-detail {
  padding: 0;
  border: 0px none;
}

.work-detail-top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 0 10px 0;
  width: 100%;
}

@media (min-width: 768px) {
  .work-detail-top {
    margin: 0 0 15px 0;
  }
}

.work-detail-top-category {
  width: calc(100% - 96px);
  margin: 0 5px 0 0;
}

.detail-text {
  font-size: 14px;
}

@media (min-width: 768px) {
  .detail-text {
    font-size: 16px;
  }
}

.detail-text-wrap {
  margin: 15px 0;
}

@media (min-width: 768px) {
  .detail-text-wrap {
    margin: 20px 0;
  }
}

@media (min-width: 768px) {
  .detail-text-wrap-margin {
    margin: 25px 0;
  }
}

.detail-text-wrap-paragraph {
  font-weight: bold;
  padding: 0 0 5px 0;
}

.detail-text-wrap-multiple-lines {
  line-height: 1.5;
}

.assign-table {
  width: 100%;
  table-layout: fixed;
  text-align: center;
}

.assign-table-title {
  font-size: 14px;
  font-weight: bold;
  background-color: #E3F1FF;
}

.assign-table-title th {
  padding: 7.5px 0;
}

.assign-table-contents {
  font-size: 16px;
  font-weight: bold;
}

.assign-table-contents td {
  padding: 10px 0;
}

.assign-table-contents-small-text {
  font-size: 12px;
}

.assign-table td,
.assign-table th {
  border: 1px solid #CCC;
}

.sticky {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: sticky;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  bottom: 0;
  text-align: center;
  padding: 5px 15px;
  margin: 50px 0 0 0;
  background-color: #FFF;
  -webkit-box-shadow: 0 -2px 6px 0 rgba(0, 0, 0, 0.2);
          box-shadow: 0 -2px 6px 0 rgba(0, 0, 0, 0.2);
}

.sticky-apply {
  width: 70%;
  margin: 0 10px 0 0;
}

@media (min-width: 768px) {
  .sticky-apply {
    margin: 0 20px 0 0;
    max-width: 475px;
  }
}

.sticky-apply-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: 100%;
  height: 54px;
  color: #17416A;
  font-size: 16px;
  font-weight: bold;
  border-radius: 10px;
  background-color: #F7E451;
}

.sticky-apply-link-work-finish {
  margin-top: 50px;
}

@media (min-width: 768px) {
  .sticky-apply-link-work-finish {
    max-width: 310px;
    margin: 0 auto;
    margin-top: 70px;
  }
}

.sticky-apply-link-work-finish:hover {
  opacity: 0.7;
}

.sticky-apply-link-double {
  height: 42px;
}

.sticky-apply-link-double span {
  font-size: 14px;
  width: 100%;
}

@media (min-width: 768px) {
  .sticky-apply-link-double span {
    font-size: 16px;
  }
}

.sticky-chat {
  width: 30%;
}

@media (min-width: 768px) {
  .sticky-chat {
    max-width: 105px;
  }
}

.sticky-chat-link-wrap {
  position: relative;
  padding: 13px 0;
  border-radius: 10px;
  border: 2px solid #17416A;
  background-color: #FFF;
}

.sticky-chat-link-wrap img {
  width: 25px;
}

.sticky-chat-link-icon {
  position: absolute;
  width: 18px;
  min-width: 18px;
  height: 18px;
  border-radius: 10px;
  background-color: #c5283d;
  top: 0;
  right: -9px;
}

.cancel-btn {
  color: #333;
  border: 2px solid #333;
  background-color: #FFF;
}

.modal {
  position: relative;
  width: 100%;
  max-width: 1180px;
  border-radius: 10px;
  background-color: #FFF;
  margin: auto;
}

.modal-wrap {
  max-width: 660px;
  margin: auto;
  text-align: center;
  padding: 30px 15px;
}

@media (min-width: 768px) {
  .modal-wrap {
    padding: 40px 30px;
  }
}

.modal-wrap-img {
  position: absolute;
  width: 15px;
  top: 15px;
  right: 15px;
}

.modal-wrap-title {
  font-size: 18px;
  font-weight: bold;
}

.modal-wrap-text {
  text-align: start;
  margin: 13px 0 10px 0;
}

@media (min-width: 768px) {
  .modal-wrap-text {
    margin: 20px 0;
  }
}

.modal-wrap-link {
  display: block;
  margin: 30px auto 15px auto;
}

@media (min-width: 768px) {
  .modal-wrap-link {
    width: 310px;
    margin: 40px auto 20px auto;
  }
}

@media (min-width: 768px) {
  .modal-wrap-link-top {
    margin-top: 70px;
  }
}

.modal-wrap-link-bottom {
  margin-bottom: 0;
}

.modal-wrap-back {
  font-size: 14px;
  color: #17416A;
  text-decoration: underline;
}

.header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: sticky;
  top: 0;
  z-index: 100;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  background-color: #17416a;
  height: 60px;
  margin: 0 0 20px 0;
  box-shadow: 0 7px 14px 0 rgb(65 69 88 / 10%), 0 3px 6px 0 rgb(0 0 0 / 7%);
  justify-content: space-between;
  padding-right: 24px;
}

@media (min-width: 1000px) {
  .header {
    height: 80px;
    margin: 0 0 40px 0;
  }
}

.header-img {
  width: auto;
  height: 40px;
  margin: 10px 0 10px 15px;
  -o-object-fit: cover;
     object-fit: cover;
}

@media (min-width: 1000px) {
  .header-img {
    height: 50px;
    margin: 15px 0 15px 25px;
  }
}

.header-pc {
  margin-left: auto;
  display: none;
  height: 100%;
}

@media (min-width: 1000px) {
.header-pc {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin: 0 24px;
  }
}

.header-sp {
  margin-left: auto;
}

@media (min-width: 1000px) {
  .header-sp {
    display: none;
  }
}

/*ホバーエフェクト*/

.header-pc ul li a {
  position: relative;
}

.header-pc ul li a:not(.change-button)::after {
  /*アンダーラインのスタイル*/
  position: absolute;
  content: "";
  display: block;
  width: 100%;
  height: 3px;
  background-color: #fff;
  border-radius: 5px;
  bottom: 10px;
  left: 0;
  /*横方向0で非表示にする*/
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  /*中央を基点にアニメーション*/
  -webkit-transform-origin: center top;
  transform-origin: center top;
  /*アニメーションの速度設定*/
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.header-pc ul li a:not(.change-button):hover::after {
  /*横方向等倍まで拡大*/
  transform: scale(1, 1);
}

.header-pc ul li a{
  flex-direction: column;
  display: flex;
  align-content: center;
  align-items: center;
}

.header-pc ul.m_left li a i{
  font-size: 14px;
  margin-bottom: 6px;
}

.menu {
  position: relative;
  height: 100%;
  /* margin-left: auto; */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #FFF;
}

.menu-login-btn {
  display: inline-block;
  height: 100%;
  font-size: 12px;
  color: #FFF;
  padding: 0 15px;
  line-height: 60px;
}

@media (min-width: 1000px) {
  .menu-login-btn {
    font-size: 16px;
    line-height: 80px;
  }
}

.header-pc ul{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}



.menu li {
  height: 100%;
  font-weight: bold;
}

/* .menu li:hover {
  opacity: 0.7;
} */

.menu-list {
  line-height: 40px;
  display: inline-block;
  height: 100%;
  font-size: 12px;
  color: #FFF;
  padding: 20px 10px;
}

@media (min-width: 1000px) {
  .menu-list {
    font-size: 16px;
  }
}

.menu .bell {
  position: relative;
  padding: 20px 15px;
  line-height: unset;
}

.menu .bell i {
  line-height: unset;
}

@media (min-width: 1000px) {
  .menu .bell {
    padding: 20px 10px;
    margin: 0 0 0 10px;
  }
}

.menu .bell-counter {
  display: inline-block;
  position: absolute;
  width: 22.5px;
  height: 22.5px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(15%, -90%);
          transform: translate(15%, -90%);
  border-radius: 15px;
  background-color: #c5283d;
}

.menu .bell-number {
  position: absolute;
  width: 100%;
  font-size: 12px;
  font-weight: normal;
  text-align: center;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.menu .user-name {
  padding: 20px 0;
}

.side-border {
  padding: 0 30px 0 15px;
  border-left: 2px solid #FFF;
}

.drop-menu {
  width: 250px;
  font-size: 16px;
  font-weight: bold;
  background-color: #FFF;
}

.drop-menu a {
  width: 100%;
  display: inline-block;
  padding: 15px;
  color: #17416A;
  border: 1px solid #CCC;
}

.drop-menu a:hover {
  opacity: 0.7;
}

.push-button {
  color: #17416A;
  background-color: #E3F1FF;
}

.dropdown-contents {
  position: absolute;
  top: 60px;
  width: 100%;
  height: 100vh;
  background-color: #FFF;
}

.dropdown-contents li {
  width: 100%;
}

.dropdown-contents-normal {
  display: inline-block;
  font-size: 16px;
  font-weight: bold;
  border-bottom: 1px solid #CCC;
}

.dropdown-contents-normal a {
  display: inline-block;
  width: 100%;
  padding: 15px;
  color: #17416A;
}

.dropdown-contents-normal a:hover {
  opacity: 0.7;
}

.dropdown-contents-paragraph {
  clear: both;
  font-size: 16px;
  font-weight: bold;
  color: #6D6D6D;
  padding: 25px 15px 15px 15px;
  border-bottom: 1px solid #CCC;
}

.dropdown-contents-logout {
  clear: both;
  font-size: 14px;
  font-weight: normal;
  color: #17416A;
  text-align: center;
  text-decoration: underline;
  margin: 50px 0 0 0;
}

.dropdown-contents-logout:hover {
  opacity: 0.7;
}

.right {
  float: right;
}

.hamburger-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  position: relative;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 45px;
  height: 30px;
  margin: 0 17.5px 0 20px;
}

.hamburger-btn-border {
  display: inline-block;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  /*アニメーションの設定*/
  position: absolute;
  width: 100%;
  height: 3px;
  background: #FFF;
}

.hamburger-btn-border:nth-of-type(2) {
  top: 13px;
}

.hamburger-btn-border:nth-of-type(3) {
  top: 26px;
}

.hamburger-btn-active:nth-of-type(1) {
  -webkit-transform: translateY(6px) rotate(-45deg);
          transform: translateY(6px) rotate(-45deg);
  top: 8px;
  left: 10%;
  width: 80%;
}

.hamburger-btn-active:nth-of-type(2) {
  opacity: 0;
}

.hamburger-btn-active:nth-of-type(3) {
  -webkit-transform: translateY(-6px) rotate(45deg);
          transform: translateY(-6px) rotate(45deg);
  top: 20px;
  left: 10%;
  width: 80%;
}

.drop-menu {
  position: absolute;
  top: 80px;
  right: 0;
}

.drop-menu-close {
  display: none;
}

.drop-menu-open {
  display: block;
}

.header-sp a:link {
  color: #FFF;
}

.header-sp a:visited {
  color: #FFF;
}

.keyword {
  border: 1px solid #CCC;
  border-radius: 5px;
  margin: 10px 0px 15px 0px;
  width: 100%;
  padding: 10px 10px;
  font-size: 16px;
  font-weight: bold;
  color: #333;
}

@media (min-width: 768px) {
  .keyword {
    margin-bottom: 0px;
    padding: 10px 10px;
    max-width: 315px;
  }
}

.pickr-width {
  size: 150px;
}

.point-input {
  max-width: 150px;
}

@media (min-width: 768px) {
  .point-input {
    max-width: 200px;
  }
}

.input-icon {
  border: 1px solid #CCC;
  border-radius: 5px;
  padding: 10px;
  max-width: 150px;
}

@media (min-width: 768px) {
  .input-icon {
    background: url("../images/calendar.png") no-repeat left 10px center/18px;
    padding: 10px 5px 10px 40px;
    max-width: 200px;
  }
}

.datalist-tag {
  display: inline;
  padding: 10px 30px 10px 5px;
  border-radius: 5px;
  border: 1px solid #CCC;
  font-size: 16px;
  font-weight: bold;
  width: 100%;
  background: url("../images/arrow.png") no-repeat right 10px center/18px;
}

@media (min-width: 768px) {
  .datalist-tag {
    max-width: 345px;
  }
}

@media (min-width: 768px) {
  .datalist-tag.pc-size {
    max-width: 570px;
  }
}

.icon-del[type="search"]::-webkit-calendar-picker-indicator {
  opacity: 0;
}

.input-flex {
  margin: 10px 0px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.error-input {
  margin: 0 0 15px 0;
  width: 100%;
  padding: 10px 0 10px 8px;
  margin: 10px 0 0 0;
  border: 1px solid #c5283d;
  border-radius: 5px;
  background-color: #fad2d7;
}

.input-long {
  display: inline-block;
  padding: 10px 0px 10px 5px;
  margin: 10px 5px 0px 0px;
  border-radius: 5px;
  border: 1px solid #CCC;
  font-size: 16px;
  font-weight: bold;
  width: 100%;
}

.input-long:last-child {
  margin: 0px;
}

@media (min-width: 768px) {
  .input-long {
    max-width: 150px;
  }
}

.input-short {
  display: inline-block;
  padding: 10px 0px 10px 5px;
  margin: 10px 5px 0px 0px;
  border-radius: 5px;
  border: 1px solid #CCC;
  font-size: 16px;
  font-weight: bold;
  width: 100%;
}

.input-short:last-child {
  margin: 0px;
}

.input-short.ex-year {
  max-width: 150px;
}

.input-short.experience-year {
  max-width: 170px;
}

@media (min-width: 768px) {
  .input-short {
    max-width: 100px;
  }
}

.flex-input-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media (min-width: 768px) {
  .flex-input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}

.list-ul {
  list-style-type: none;
  padding-left: 0;
}

.list-point {
  padding-left: 20px;
  text-indent: -20px;
  margin-bottom: 10px;
  position: relative;
}

.list-point::before {
  background-color: #F7E451;
  /* 円の色 */
  border-radius: 50%;
  content: "";
  top: 5px;
  /* 円の位置調整 */
  width: 8px;
  /* 円の幅 */
  height: 8px;
  /* 円の高さ */
  display: inline-block;
  border-radius: 50%;
  vertical-align: middle;
  margin-right: 10px;
}

.global {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0 16px;
}

.global-wrap {
  width: 100%;
  max-width: 720px;
  margin-top: 60px;
  box-shadow: 0 7px 14px 0 rgb(65 69 88 / 10%), 0 3px 6px 0 rgb(0 0 0 / 7%);
  padding: 80px;
  border-radius: 10px;
}

.global-wrap.global-width {
  max-width: 1100px;
}

.global-wide {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0 50px;
}

.global-wide-wrap {
  width: 100%;
  max-width: 1180px;
}

.main-paragraph {
  font-size: 20px;
  font-weight: bold;
  margin: 0 0 15px 0;
  padding: 0.25em 0.5em;
  color: #494949;
  background: transparent;
  border-left: solid 5px #7db4e6;
}

.main-paragraph.left_red{
  border-left: solid 5px #c5283d;
}

@media (min-width: 768px) {
  .main-paragraph {
    font-size: 22px;
    margin: 0 0 20px 0;
  }
}

.sub-paragraph-big {
  font-size: 18px;
  font-weight: bold;
}

@media (min-width: 768px) {
  .sub-paragraph-big {
    font-size: 20px;
  }
}

.error {
  color: #c5283d;
  background-color: #fad2d7;
  font-size: 12px;
  padding: 10px 7px;
  margin: 0 0 15px 0;
}

@media (min-width: 768px) {
  .error {
    font-size: 14px;
    padding: 15px;
    margin-bottom: 20px;
  }
}

.error-text {
  margin: 0 0 15px 0;
}

.error-text label {
  font-weight: bold;
}

.error-text input,
.error-text textarea {
  width: 100%;
  padding: 10px 0 10px 8px;
  margin: 10px 0 0 0;
  border: 1px solid #c5283d;
  border-radius: 5px;
  background-color: #fad2d7;
}

.error-text ::-webkit-input-placeholder {
  color: #959595;
}

.error-text ::-moz-placeholder {
  color: #959595;
}

.error-text :-ms-input-placeholder {
  color: #959595;
}

.error-text ::-ms-input-placeholder {
  color: #959595;
}

.error-text ::placeholder {
  color: #959595;
}

@media (min-width: 768px) {
  .error-text {
    margin-bottom: 20px;
  }
}

.mail-error {
  color: #c5283d;
  font-size: 12px;
  margin: 5px 0 20px 0;
}

.mail-error.margin-none {
  margin: 5px 0 0 0;
}

.work-status-pulldown {
  margin: 0 10px 15px 0;
  font-weight: bold;
}

.work-status-pulldown:last-child {
  margin: 0 0 15px 0;
}

@media (min-width: 768px) {
  .work-status-pulldown {
    max-width: 250px;
  }
}

@media (min-width: 768px) {
  .work-status {
    text-align: right;
  }
}

.validation-error {
  border: 1px solid #c5283d;
  border-radius: 5px;
  background-color: #fad2d7;
}

.validation-error ::-webkit-input-placeholder {
  color: #959595;
}

.validation-error ::-moz-placeholder {
  color: #959595;
}

.validation-error :-ms-input-placeholder {
  color: #959595;
}

.validation-error ::-ms-input-placeholder {
  color: #959595;
}

.validation-error ::placeholder {
  color: #959595;
}

.validation-error.add-padding {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 10px 0 10px 10px;
  margin-top: 10px;
  font-weight: bold;
}

.manager-details .name-position {
  margin: 0;
}

.manager-details .text-bold {
  margin-bottom: 0;
}

.manager-details .work-list-category {
  margin: 0;
  padding-bottom: 10px;
}

.manager-details .work-list-category:nth-child(3) {
  padding-bottom: 5px;
}

.manager-details .work-list-category:nth-child(4) {
  padding-bottom: 20px;
}

.manager-details .mdl-transition {
  margin: 50px 0 70px 0;
}

.manager-details .mdl-transition-center {
  margin: 30px 0 50px 0;
}

.manager-details .work-list-category:last-child {
  padding-bottom: 30px;
}

.manager-details .gift-point-textfield {
  margin: 0;
}

.manager-details .gift-point-textfield .point-input {
  margin: 0;
}

.manager-details .double-btn {
  margin-top: 30px;
  margin-bottom: 50px;
}

.manager-details .double-btn-link {
  height: 56px;
}

.manager-details .double-btn-link .sticky-apply-link-double {
  height: 100%;
}

.tab-wrap .active-point {
  margin-bottom: 30px;
}

.tab-wrap .active-point-text {
  margin-top: 10px;
}

.tab-wrap .assign-table-title {
  font-size: 16px;
  font-weight: bold;
}

.tab-wrap .assign-table-contents {
  text-align: start;
}

.tab-wrap .table-title {
  font-size: 16px;
  font-weight: normal;
  text-decoration: underline;
  color: #17416A;
  padding-left: 15px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.tab-wrap .table-title:hover {
  opacity: 0.7;
}

.tab-wrap .status {
  font-size: 16px;
  font-weight: normal;
  padding-left: 15px;
}

.tab-wrap .skill {
  max-width: 250px;
  padding: 10px;
}

.company-top .text-bold {
  margin-bottom: 5px;
}

.company-top-text :first-child {
  color: #333;
  margin-bottom: 10px;
}

.company-detail .active-point {
  margin: 0 0 25px 0;
}

.company-detail .size {
  margin-top: 20px;
}

.company-detail .double-btn {
  margin-top: 30px;
  margin-bottom: 50px;
}

.company-detail .double-btn-link {
  height: 56px;
}

.company-detail .sticky-apply-link-double {
  height: 100%;
}

#work-delete-success .text {
  font-weight: normal;
  margin-top: 40px;
}

#work-delete-error .exclamation {
  width: 47px;
  margin-bottom: 15px;
}

#work-delete-error .text {
  font-weight: normal;
  margin: 40px 0 50px 0;
}

.fl-wrap-name:hover {
  opacity: 0.7;
}

.notification-list-wrap .notification-link:last-child {
  margin-bottom: 0;
}

.inquiry-details .work-list-category {
  padding: 0;
}

.inquiry-details .work-list-category:last-child {
  padding-top: 5px;
  padding-bottom: 0;
}

.inquiry .text-bold {
  margin-top: 50px;
}

.inquiry .mdl-textfield {
  margin-top: 20px;
}

.inquiry .error-textarea {
  background-color: #fad2d7;
}

.inquiry .inquiry-display-none {
  display: none;
}

.inquiry :disabled {
  background-color: #CCC;
}

.pager ul {
  text-align: center;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  max-width: 345px;
  padding-top: 50px;
}

.pagination li {
  background: #F7E451;
  width: 40px;
  height: 40px;
  position: relative;
  border-radius: 3px;
}

.pagination a {
  vertical-align: middle;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  display: table;
  color: #17416A;
  text-decoration: none;
}

.pagination a span {
  display: table-cell;
  vertical-align: middle;
  font-size: 16px;
  font-weight: bold;
}

.pagination a:hover,
.pagination a.active {
  color: #17416A;
  background: #fff;
  border: 2px solid;
  border-radius: 3px;
}

.pagination a.active {
  pointer-events: none;
}

.pagination li,
.pagination li.next {
  display: inline-block;
  width: 40px;
  height: 40px;
  text-align: center;
}

.pagination li.pre a {
  width: 100%;
  text-align: center;
  background: url("../images/component01.png") no-repeat center 10px/20px auto;
}

.pagination li.next a {
  width: 100%;
  text-align: center;
  background: url("../images/component02.png") no-repeat center 10px/20px auto;
}

@media (min-width: 768px) {
  .pager ul {
    padding-top: 70px;
    text-align: center;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 345px;
  }
}

.skill {
  background: url("../images/arrow.png") no-repeat right 10px center/18px;
  margin: 10px 0px 15px 0px;
  padding: 10px 0px 10px 5px;
  border-radius: 5px;
  width: 100%;
  border: 1px solid #CCC;
  font-size: 16px;
  font-weight: bold;
}

.skill:last-child {
  margin-bottom: 0px;
}

.skill.no-margin {
  margin: 0;
}

@media (min-width: 768px) {
  .skill {
    margin-bottom: 0px;
    padding: 10px 30px 10px 10px;
    max-width: 345px;
  }
}

.select-base {
  background: url("../images/arrow.png") no-repeat right 10px center/18px;
  margin: 10px 0px 15px 0px;
  padding: 10px 30px 10px 5px;
  border-radius: 5px;
  width: 100%;
  border: 1px solid #CCC;
  font-size: 16px;
  font-weight: bold;
  white-space: normal;
}

.select-base:last-child {
  margin-bottom: 0px;
}

.select-base:hover {
  cursor: pointer;
  cursor: hand;
}

.select-base.no-margin {
  margin: 0;
}

.select-base.select-company {
  margin-bottom: 0px;
  padding: 10px 10px;
}

@media (min-width: 768px) {
  .select-base.select-company {
    padding: 10px 20px 10px 10px;
    max-width: 700px;
  }
}

@media (min-width: 768px) {
  .select-base {
    margin-bottom: 0px;
    padding: 10px 30px 10px 10px;
    max-width: 200px;
  }
  .select-base.max-width-max {
    max-width: 700px;
  }
}

.tag-select {
  margin-bottom: 0;
}

.pulldown-margin {
  margin-top: 15px;
}

.filter {
  border-radius: 10px;
  margin-top: 25px;
  width: 100%;
  padding: 16px;
  background-color: #F7E451;
  font-size: 16px;
  font-weight: bold;
  color: #17416A;
  text-align: center;
}

.filter:active {
  border-radius: 10px;
}

.filter:hover {
  cursor: pointer;
  opacity: 0.7;
}

.filter.no-margin {
  margin: 0;
}

@media (min-width: 768px) {
  .filter {
    text-align: center;
    padding: 10px 45px 10px 45px;
    font-size: 16px;
    margin: auto;
    max-width: 310px;
  }
}

.profile-button {
  font-size: 16px;
  margin-bottom: 0px;
  font-weight: bold;
}

@media (min-width: 768px) {
  .profile-button {
    font-size: 18px;
    margin-bottom: 0px;
    font-weight: bold;
  }
}

.button-wrap {
  margin-top: 50px;
  color: #17416A;
}

@media (min-width: 768px) {
  .button-wrap {
    margin-top: 70px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

.button-wrap:nth-child(2) {
  margin-left: 18px;
}


.border_bottom{
  border-bottom: 0.8px dotted #18416A;
  padding-bottom: 15px;
}

.white-button {
  width: 100%;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  border: #17416A 2px solid;
  border-radius: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 15px 20px;
  color: #17416A;
}

.white-button:hover {
  opacity: 0.7;
}

@media (min-width: 768px) {
  .white-button {
    font-size: 18px;
    margin: auto;
    max-width: 310px;
    color: #17416A;
  }
}

.tag-plus {
  background-color: #F7E451;
  border-radius: 5px;
  height: 40px;
  margin-left: 10px;
}

.tag-plus:hover {
  opacity: 0.7;
}

.item-center {
  color: #17416A;
  font-size: 30px;
  margin: 5px 5px;
}

.yellow-button {
  width: 100%;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  border: #F7E451 2px solid;
  background-color: #F7E451;
  border-radius: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 15px 20px;
  color: #17416A;
  margin-top: 15px;
}


.worker_btn .yellow-button{
  padding: 15px 80px;
  margin-right: 15px;
}

.worker_btn img{
  width:12%;
}

.worker_btn .white-button{
  padding: 15px 0px;
  margin: 0 15px;
}

.yellow-button:hover {
  opacity: 0.7;
}

@media (min-width: 768px) {
  .yellow-button {
    font-size: 18px;
    margin: 0 0 0 15px;
    max-width: 310px;
    color: #17416A;
  }
}

.yellow-button:nth-child(1) {
  margin-left: 0;
}

.black-button {
  width: 100%;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  border: #333 2px solid;
  background-color: #FFF;
  border-radius: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 15px 20px;
  color: #333;
  margin-top: 15px;
}

.black-button:hover {
  opacity: 0.7;
}

@media (min-width: 768px) {
  .black-button {
    font-size: 18px;
    margin: 0 0 0 15px;
    max-width: 310px;
    color: #333;
  }
}

.black-button:nth-child(1) {
  margin-left: 0;
}

.read-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.read-button :hover {
  opacity: 0.7;
}

.tab-group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.tab-group.color-blue-foot {
  background-color: #e3f1ff;
}

.tab-group :hover {
  opacity: 0.7;
}

.tab-group.tab-padding {
  padding-bottom: 20px;
}

.tab-set {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-align: left;
}

.tab-set.flex-between {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.tab-set.color-blue {
  background-color: #e3f1ff;
}

.tab-set.flex-end {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  padding: 10px;
}

.tab {
  padding: 10px 15px;
  list-style: none;
  border: solid 1px #CCC;
  border-bottom: none;
  text-align: center;
  cursor: pointer;
  bottom: none;
}

.tab.is-active {
  background: #17416A;
  color: #FFF;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  border-color: transparent;
  position: relative;
}

.tab.is-active::after {
  position: absolute;
  left: 50%;
  top: 100%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  display: block;
  border: 9px solid transparent;
  border-top: 9px solid #17416A;
  content: "";
}

.panel {
  display: none;
}

.panel.is-show {
  display: block;
}

.tab-under-border {
  border: solid 1px #CCC;
  border-right: none;
  border-bottom: none;
  border-left: none;
}

.tab-padding {
  padding-top: 15px;
}

@media (min-width: 768px) {
  .tab-padding {
    padding-top: 20px;
  }
}

.is-close {
  display: none;
}

.tab-hover {
  cursor: pointer;
}

.tab-hover:hover {
  opacity: 0.7;
}

.total {
  padding: 0 15px 15px 15px;
}

@media (min-width: 768px) {
  .total {
    padding: 0 50px 50px 50px;
  }
}

.max-screen-size {
  min-width: 1100px;
}

.text-title {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 15px;
  white-space: nowrap;
  padding: 0.25em 0.5em;
  color: #494949;
  background: transparent;
  border-left: solid 5px #7db4e6;
}

@media (min-width: 768px) {
  .text-title {
    font-size: 22px;
    font-weight: bold;
  }
}

.text {
  font-size: 14px;
  font-weight: bold;
  margin-top: 20px;
  margin-bottom: 10px;
  white-space: nowrap;
}

.text-bold {
  font-size: 18px;
  font-weight: bold;
  white-space: nowrap;
  margin-bottom: 5px;
}

@media (min-width: 768px) {
  .text-bold {
    font-size: 20px;
    font-weight: bold;
    margin: 0px 20px 10px 0px;
  }
  .text-bold.no-margin {
    margin-bottom: 0px;
  }
}

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

.text-size-bold.color-blue {
  color: #17416A;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-align: left;
}

.text-size-bold.color-blue.delete-width {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.text-size-bold.font-big {
  font-size: 20px;
}

.text-size-bold.under-line {
  text-decoration: underline;
}

.text-size-bold.position-stagger {
  margin-left: 25px;
}

.text-size-bold.exp-width {
  width: 116px;
}

.text-size-bold.skill-width {
  width: calc(100% - 130px);
}

@media (min-width: 768px) {
  .text-size-bold {
    font-size: 16px;
    font-weight: bold;
  }
}

.color-black {
  color: #333;
}

.name {
  font-size: 16px;
  font-weight: bold;
  width: 100%;
  margin-top: 10px;
  text-decoration: underline;
  color: #17416A;
}

.name:hover {
  cursor: pointer;
  opacity: 0.7;
}

@media (min-width: 768px) {
  .name {
    font-size: 18px;
    font-weight: bold;
  }
}

.tag {
  font-size: 12px;
  font-weight: bold;
  padding: 3px;
  color: #17416A;
  border-radius: 5px;
  border: #17416A 1px solid;
}

@media (min-width: 768px) {
  .tag {
    font-size: 14px;
    font-weight: bold;
    border-radius: 5px;
    border: #17416A 1px solid;
  }
}

.introduce {
  font-size: 14px;
  padding: 10px 0px 10px 0px;
}

@media (min-width: 768px) {
  .introduce {
    font-size: 16px;
  }
}

@media (min-width: 768px) {
  .border-inline {
    display: inline-block;
    margin-right: 20px;
    padding: 0px;
    max-width: 315px;
    margin-top: 20px;
  }
  .border-inline .text-skill {
    font-size: 16px;
    font-weight: bold;
  }
}

.text-form {
  margin-bottom: 20px;
}

.text-form :disabled {
  color: #959595;
  background: #CCC;
}

.error-margin {
  margin-bottom: 15px;
}

.txt {
  font-size: 14px;
  font-weight: normal;
  display: inline-block;
  margin-top: 5px;
}

@media (min-width: 768px) {
  .txt {
    font-size: 16px;
  }
}

.succes-text {
  color: #17416A;
  background-color: #e3f1ff;
}

.margin-change {
  margin-bottom: 15px;
}

.margin-change h3{
  background: transparent;
  border-left: solid 5px #7db4e6;
  padding: 0.25em 0.5em;
}

.margin-change :disabled {
  color: #959595;
  background: #CCC;
}

.margin-change:last-child {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .margin-change {
    margin-bottom: 20px;
  }
}

.margin-b-five-zero {
  margin-bottom: 5px;
}

@media (min-width: 768px) {
  .margin-b-five-zero {
    margin-bottom: 0;
  }
}

.change-margin {
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  .change-margin {
    margin-bottom: 20px;
  }
}

.margin-check {
  margin-bottom: 15px;
}

@media (min-width: 768px) {
  .margin-check {
    margin-bottom: 25px;
  }
}

.name-position {
  margin-bottom: 20px;
}

@media (min-width: 768px) {
  .name-position {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
}

.text-margin {
  margin: 20px 0px;
}

.text-margin:first-child {
  margin-top: 15px;
}

.text-margin:last-child {
  margin-bottom: 0px;
}

@media (min-width: 768px) {
  .text-size {
    font-size: 22px;
  }
}

@media (min-width: 768px) {
  .txt-size {
    font-size: 16px;
  }
}

.small-text {
  font-weight: normal;
  font-size: 12px;
  color: #6d6d6d;
}

.margin-tel {
  margin: 20px 0px 40px 0px;
}

@media (min-width: 768px) {
  .margin-tel {
    margin-bottom: 50px;
  }
}

.txt-bold {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 15px;
}

@media (min-width: 768px) {
  .txt-bold {
    font-size: 18px;
    margin-bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
        -ms-flex: auto;
            flex: auto;
  }
}

.manager-name {
  color: #17416A;
  text-decoration: underline;
  font-size: 14px;
  font-weight: normal;
  display: inline-block;
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  .manager-name {
    font-size: 16px;
  }
}

@media (min-width: 768px) {
  .size {
    font-size: 18px;
    font-weight: bold;
  }
}

@media (min-width: 768px) {
  .flex-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    margin-bottom: 25px;
  }
}

.container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.container.flex-between {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.bold {
  font-size: 18px;
  font-weight: bold;
  white-space: nowrap;
  margin-bottom: 5px;
}

@media (min-width: 768px) {
  .bold {
    font-size: 20px;
    font-weight: bold;
    margin: 0;
  }
}

.title {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 15px;
  white-space: nowrap;
}

.flex-container .title{
  margin-bottom:0;
}

@media (min-width: 768px) {
  .title {
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 20px;
    padding: 0.25em 0.5em;/*上下 左右の余白*/
    color: #494949;/*文字色*/
    background: transparent;/*背景透明に*/
    border-left: solid 5px #7db4e6;/*左線*/
  }
}

.text-twelve {
  font-size: 12px;
}

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

.margin-t-none {
  margin-top: 0;
}

.margin-b-ten {
  margin-bottom: 10px;
}

.margin-b-fifteen {
  margin-bottom: 15px;
}

.margin-b-fifty {
  margin-bottom: 50px;
}

.margin-b-twenty {
  margin-bottom: 20px;
}

.margin-b-five {
  margin-bottom: 5px;
}

.margin-r-five {
  margin-right: 5px;
}

.margin-r-fifteen {
  margin-right: 15px;
}

.margin-l-ten {
  margin-left: 10px;
}

.margin-l-twenty {
  margin-left: 20px;
}

.margin-t-ten {
  margin-top: 10px;
}

.margin-t-twenty {
  margin-top: 20px;
}

.flex-tag {
  width: 40px;
}

.margin-inline-block {
  display: inline-block;
  margin-left: 30px;
}

.long-text {
  line-height: 1.42;
}

.pop-modal {
  margin: 0 auto;
  text-align: left;
  width: 100%;
  max-width: 700px;
}

.month-text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  font-weight: bold;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  margin-right: 15px;
}

.month-text.margin-l-five {
  margin-left: 5px;
}

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

@media (min-width: 768px) {
  .month-text:last-child {
    margin-right: 15px;
  }
}

.management {
  display: inline-block;
  padding: 20px;
  width: 100%;
}

.management.title-color {
  background-color: #17416A;
  color: #FFF;
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
  width: 100%;
}

.management.title-center {
  text-align: center;
}

.management.margin-control {
  margin-top: 40px;
}

.inline-control {
  display: inline-block;
}

.flex-control {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.block-base {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.block-base.right-aligned {
  margin-top: 40px;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.icon-align {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.icon-align-baseline {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.text-default {
  font-size: 16px;
  font-weight: normal;
}

.text-blue {
  color: #17416A;
}

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

.align-right .skill {
  cursor: pointer;
}

.none-active-hamburger {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-line-pack: justify;
      align-content: space-between;
  width: 15px;
  height: 13px;
}

.none-active-hamburger-border {
  background-color: #CCC;
  width: 100%;
  height: 1px;
}

.border-solid-line.color {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: -webkit-grab;
  cursor: grab;
}

.cursor-grabbing {
  width: 100%;
  cursor: -webkit-grab;
  cursor: grab;
}

.pop-margin {
  margin: 40px 0;
}

.underline-blue {
  color: #17416A;
  text-decoration: underline;
  font-size: 14px;
}

.text-center {
  text-align: center;
  margin-top: 10px;
}

@media (min-width: 768px) {
  .text-center {
    margin: 20px 0 0 0;
  }
}

.margin-foury-sixty {
  margin-bottom: 40px;
}

@media (min-width: 768px) {
  .margin-foury-sixty {
    margin-bottom: 60px;
  }
}

.margin-twenty-thirty {
  margin-bottom: 20px;
}

@media (min-width: 768px) {
  .margin-twenty-thirty {
    margin-bottom: 30px;
  }
}

.margin-ten-fifteen {
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  .margin-ten-fifteen {
    margin-bottom: 15px;
  }
}

.margin-title {
  margin-bottom: 50px;
}

@media (min-width: 768px) {
  .margin-title {
    margin-bottom: 20px;
  }
}

.three-point {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.three-point-reader {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}



/* ログインタブ */

.tab_item {
  width: calc(100%/2);
  height: 50px;
  border-bottom: 3px solid #7db4e6;
  background-color: #f2f2f2;
  line-height: 50px;
  font-size: 16px;
  text-align: center;
  color: #565656;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
  cursor: pointer;
}

.tab_item:hover {
  opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content {
  display: none;
  padding: 40px 40px 0;
  clear: both;
  overflow: hidden;
}


/*選択されているタブのコンテンツのみを表示*/ 
#worker:checked~#worker_content,
#company:checked~#company_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.global-wrap input:checked+.tab_item {
  background-color: #7db4e6;
  color: #fff;
}


/* ヘッダーぼたん */

.change-button{
  width: 100%;
  text-align: center;
  font-size: 12px;
  font-weight: bold;
  border: #7db4e6 2px solid;
  background-color: #7db4e6;
  border-radius: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 15px 12px;
  color: #fff;
  margin-top: 15px;

}

/* スキル追加 */

.skil_plus{
  font-weight: bold;
  border: #7db4e6 2px solid;
  background-color: #7db4e6;
  border-radius: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  padding: 15px 12px;
  color: #fff;
  margin-top: 40px;
}

.flex a .fa-solid{
  display: inline-block;
  margin: 10px 0 0 0;
  color: #17416A;
  margin: 64px 0 0 20px;
  font-size:24px;
}

.assign-table{
  margin-top:15px;
}

.under_border{
  border-bottom: 0.8px dotted #18416A;
  padding-bottom: 15px;
}

/* flex */
.flex{
  display:flex;
}



/* =========================================================
 State
========================================================= */

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