@charset "utf-8";

/* office */

.office .mv .flex {
  justify-content: space-between;
  width: 82.9vw;
  float: right;
  margin: 140px 0 0px;
  align-items: end;
}
@media screen and (max-width: 768px), print {
  .office .mv .flex {
    width: 100%;
    float: none;
    margin: 52px 0 0;
    align-items: end;
    justify-content: flex-end;
  }
}
.office .mv .flex .flex-item.right {
  position: relative;
}
.office .mv .flex .flex-item.right .mv-icon {
  position: absolute;
  top: 12.9vw;
  left: -12vw;
  font-size: 3vw;
  font-weight: 700;
}
@media screen and (max-width: 768px), print {
  .office .mv .flex .flex-item.right .mv-icon {
    font-size: 5.33vw;
  }
}
@media screen and (max-width: 768px), print {
  .office .mv .flex .flex-item.left {
    margin: 0 7.5vw 0 0;
  }
}

.office .mv .flex .flex-item.right .bg {
  background-image: url(../images/office/mv.jpg);
  background-position: right top;
  background-repeat: no-repeat;
  background-size: contain;
  height: 32.533vw;
  width: 71.333vw;
  margin: 0 0 70px 0;
}
@media screen and (max-width: 768px), print {
  .office .mv .flex .flex-item.right .bg {
    height: 32vw;
    width: 82.667vw;
    background-size: contain;
    margin: 0 0 6.67vw 0;
  }
}

.office .cont1 {
  width: 66.667vw;
  margin: 0 auto 4.667vw;
}
@media screen and (max-width: 768px), print {
  .office .cont1 {
    width: 90%;
    margin: 0 auto 10vw;
  }
}

.office .cont1 .inner p {
  margin: 0 0 1.667vw 0;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .inner p {
    margin: 0 0 2vw 0;
    text-align: justify;
    font-size: 4vw;
  }
}

.office .cont1 .ttl {
  margin: 0 0 2.333vw 0;
  font-size: 1.6vw;
  font-weight: 700;
  border-bottom: 1px solid #a0a6a9;
  padding-bottom: 10px;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .ttl {
    margin: 0 0 4vw 0;
    font-size: 4vw;
  }
}
.office .cont1 .ttl span {
  display: block;
  font-weight: normal;
  font-size: 1.067vw;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .ttl span {
    font-size: 3.2vw;
  }
}

.office .cont1 .list {
  margin: 0 auto 4.667vw;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .list {
    margin: 0 auto 10vw;
  }
}
.office .cont1 .list.last {
  border: none;
  margin: 0 0 9.333vw 0;
}
.office .cont1 .staff .flex {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .staff .flex {
    flex-direction: column;
  }
}
.office .cont1 .staff > .flex .flex-item.right-photo {
  width: 32vw;
  margin: 0 0 0 4vw;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .staff > .flex .flex-item.right-photo {
    width: 100%;
    margin: 4vw 0 0 0;
  }
}
.office .cont1 .staff > .flex .flex-item.right-photo img {
  width: 100%;
}
.office .cont1 .staff > .flex .flex-item.left {
  flex: 1;
  font-size: 1.067vw;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .staff > .flex .flex-item.left {
    font-size: inherit;
  }
}
.office .cont1 .company .flex {
  justify-content: space-between;
  align-items: flex-start;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .company .flex {
    flex-direction: column;
  }
}
.office .cont1 .company .flex .flex-item.right {
  width: 31.333vw;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .company .flex .flex-item.right {
    width: 90vw;
  }
}
.office .cont1 .company .flex .flex-item.left {
  flex: 1;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .company .flex .flex-item.left {
    width: 100%;
  }
}
.office .cont1 .company iframe {
  width: 31.333vw;
  height: 19.333vw;
  border: 1px solid #a0a6a9 !important;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .company iframe {
    width: 89vw;
    height: 53.333vw;
    margin: 5.333vw 0 5.333vw;
  }
}
.office .cont1 .company .table-flex {
  display: flex;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .company .table-flex {
    flex-direction: column;
  }
}
.office .cont1 .company .table-flex .left {
  background: #e5e5e5;
  width: 12.333vw;
  padding: 0.2vw 0.4vw;
  border-bottom: 1px solid #d3d3d3;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .company .table-flex .left {
    width: 100%;
    border: none;
    padding: 2px 6px;
  }
}
.office .cont1 .company .table-flex .right {
  width: 20vw;
  border-bottom: 1px solid #d3d3d3;
  padding: 0.2vw 0.4vw;
  line-height: 1.3;
}
@media screen and (max-width: 768px), print {
  .office .cont1 .company .table-flex .right {
    width: 100%;
    border: none;
    padding: 2px 6px;
    line-height: inherit;
  }
}

.office .list-office p span {
  font-size: 1.6vw;
  color: #e56b00;
  font-weight: 600;
}
@media screen and (max-width: 768px), print {
  .office .list-office p span {
    font-size: 5.333vw;
  }
}
.office .list-office p.hyougo {
  text-align: center;
  font-size: 1.6vw;
  font-weight: 600;
  line-height: 2.2;
}
@media screen and (max-width: 768px), print {
  .office .list-office p.hyougo {
    font-size: 5.333vw;
  }
}