@charset "UTF-8";
/*変数*/
/*色の変数*/
/*font*/
/*画面マックスサイズ*/
body {
  color: #ffffff;
  line-height: 1.5;
  margin: 0;
  background-color: #1a1a1a;
  letter-spacing: 0.1em; }

.container {
  width: 100%;
  margin: auto;
  overflow: hidden; }

div, section {
  box-sizing: border-box; }

ul, ol {
  list-style: none;
  margin: 0;
  padding: 0;
  box-sizing: border-box; }
  ul li, ol li {
    box-sizing: border-box; }

dl, dt, dd {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

img {
  display: block;
  outline: none; }

*:focus {
  outline: none; }

h1, h2, h3, h4, h5, p {
  margin: 0;
  padding: 0; }

.dspnone {
  display: none !important; }

.sp {
  display: none !important; }

.kerning {
  letter-spacing: -0.4em; }

.mt0 {
  margin-top: 0px !important; }

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

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

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

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

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

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

.pb10 {
  padding-bottom: 10px !important; }

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

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

.pt20 {
  padding-top: 20px !important; }

.pb20 {
  padding-bottom: 20px !important; }

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

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

.pt30 {
  padding-top: 30px !important; }

.pb30 {
  padding-bottom: 30px !important; }

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

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

.pt40 {
  padding-top: 40px !important; }

.pb40 {
  padding-bottom: 40px !important; }

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

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

.pt50 {
  padding-top: 50px !important; }

.pb50 {
  padding-bottom: 50px !important; }

.mt60 {
  margin-top: 60px !important; }

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

.pt60 {
  padding-top: 60px !important; }

.pb60 {
  padding-bottom: 60px !important; }

.mt70 {
  margin-top: 70px !important; }

.mb70 {
  margin-bottom: 70px !important; }

.pt70 {
  padding-top: 70px !important; }

.pb70 {
  padding-bottom: 70px !important; }

.mt80 {
  margin-top: 80px !important; }

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

.pt80 {
  padding-top: 80px !important; }

.pb80 {
  padding-bottom: 80px !important; }

.mt90 {
  margin-top: 90px !important; }

.mb90 {
  margin-bottom: 90px !important; }

.pt90 {
  padding-top: 90px !important; }

.pb90 {
  padding-bottom: 90px !important; }

.mt100 {
  margin-top: 100px !important; }

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

.pt100 {
  padding-top: 100px !important; }

.pb100 {
  padding-bottom: 100px !important; }

.mt110 {
  margin-top: 110px !important; }

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

.pt110 {
  padding-top: 110px !important; }

.pb110 {
  padding-bottom: 110px !important; }

.mt120 {
  margin-top: 120px !important; }

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

.pt120 {
  padding-top: 120px !important; }

.pb120 {
  padding-bottom: 120px !important; }

.mt130 {
  margin-top: 130px !important; }

.mb130 {
  margin-bottom: 130px !important; }

.pt130 {
  padding-top: 130px !important; }

.pb130 {
  padding-bottom: 130px !important; }

.mt140 {
  margin-top: 140px !important; }

.mb140 {
  margin-bottom: 140px !important; }

.pt140 {
  padding-top: 140px !important; }

.pb140 {
  padding-bottom: 140px !important; }

.mt150 {
  margin-top: 150px !important; }

.mb150 {
  margin-bottom: 150px !important; }

.pt150 {
  padding-top: 150px !important; }

.pb150 {
  padding-bottom: 150px !important; }

.mt160 {
  margin-top: 160px !important; }

.mb160 {
  margin-bottom: 160px !important; }

.pt160 {
  padding-top: 160px !important; }

.pb160 {
  padding-bottom: 160px !important; }

.mt170 {
  margin-top: 170px !important; }

.mb170 {
  margin-bottom: 170px !important; }

.pt170 {
  padding-top: 170px !important; }

.pb170 {
  padding-bottom: 170px !important; }

.mt180 {
  margin-top: 180px !important; }

.mb180 {
  margin-bottom: 180px !important; }

.pt180 {
  padding-top: 180px !important; }

.pb180 {
  padding-bottom: 180px !important; }

.mt190 {
  margin-top: 190px !important; }

.mb190 {
  margin-bottom: 190px !important; }

.pt190 {
  padding-top: 190px !important; }

.pb190 {
  padding-bottom: 190px !important; }

.mt200 {
  margin-top: 200px !important; }

.mb200 {
  margin-bottom: 200px !important; }

.pt200 {
  padding-top: 200px !important; }

.pb200 {
  padding-bottom: 200px !important; }

@media screen and (max-width: 768px) {
  .mt0 {
    margin-top: 0px !important; }

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

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

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

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

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

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

  .pb10 {
    padding-bottom: 5px !important; }

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

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

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

  .pb20 {
    padding-bottom: 10px !important; }

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

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

  .pt30 {
    padding-top: 15px !important; }

  .pb30 {
    padding-bottom: 15px !important; }

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

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

  .pt40 {
    padding-top: 20px !important; }

  .pb40 {
    padding-bottom: 20px !important; }

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

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

  .pt50 {
    padding-top: 25px !important; }

  .pb50 {
    padding-bottom: 25px !important; }

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

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

  .pt60 {
    padding-top: 30px !important; }

  .pb60 {
    padding-bottom: 30px !important; }

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

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

  .pt70 {
    padding-top: 35px !important; }

  .pb70 {
    padding-bottom: 35px !important; }

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

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

  .pt80 {
    padding-top: 40px !important; }

  .pb80 {
    padding-bottom: 40px !important; }

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

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

  .pt90 {
    padding-top: 45px !important; }

  .pb90 {
    padding-bottom: 45px !important; }

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

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

  .pt100 {
    padding-top: 50px !important; }

  .pb100 {
    padding-bottom: 50px !important; }

  .mt110 {
    margin-top: 55px !important; }

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

  .pt110 {
    padding-top: 55px !important; }

  .pb110 {
    padding-bottom: 55px !important; }

  .mt120 {
    margin-top: 60px !important; }

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

  .pt120 {
    padding-top: 60px !important; }

  .pb120 {
    padding-bottom: 60px !important; }

  .mt130 {
    margin-top: 65px !important; }

  .mb130 {
    margin-bottom: 65px !important; }

  .pt130 {
    padding-top: 65px !important; }

  .pb130 {
    padding-bottom: 65px !important; }

  .mt140 {
    margin-top: 70px !important; }

  .mb140 {
    margin-bottom: 70px !important; }

  .pt140 {
    padding-top: 70px !important; }

  .pb140 {
    padding-bottom: 70px !important; }

  .mt150 {
    margin-top: 75px !important; }

  .mb150 {
    margin-bottom: 75px !important; }

  .pt150 {
    padding-top: 75px !important; }

  .pb150 {
    padding-bottom: 75px !important; }

  .mt160 {
    margin-top: 80px !important; }

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

  .pt160 {
    padding-top: 80px !important; }

  .pb160 {
    padding-bottom: 80px !important; }

  .mt170 {
    margin-top: 85px !important; }

  .mb170 {
    margin-bottom: 85px !important; }

  .pt170 {
    padding-top: 85px !important; }

  .pb170 {
    padding-bottom: 85px !important; }

  .mt180 {
    margin-top: 90px !important; }

  .mb180 {
    margin-bottom: 90px !important; }

  .pt180 {
    padding-top: 90px !important; }

  .pb180 {
    padding-bottom: 90px !important; }

  .mt190 {
    margin-top: 95px !important; }

  .mb190 {
    margin-bottom: 95px !important; }

  .pt190 {
    padding-top: 95px !important; }

  .pb190 {
    padding-bottom: 95px !important; }

  .mt200 {
    margin-top: 100px !important; }

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

  .pt200 {
    padding-top: 100px !important; }

  .pb200 {
    padding-bottom: 100px !important; } }
@media screen and (max-width: 768px) {
  body {
    min-width: auto; }

  .sp {
    display: block !important; }

  .pc {
    display: none !important; }

  header nav {
    flex-direction: column;
    position: fixed;
    background-color: #1a1a1a;
    margin: 0;
    height: 100%;
    width: 100%;
    right: -100%;
    margin-right: 0;
    top: 0;
    justify-content: center;
    -webkit-transition: all 0.3s cubic-bezier(0, 0, 0, 1);
    -o-transition: all 0.3s cubic-bezier(0, 0, 0, 1);
    transition: all 0.3s cubic-bezier(0, 0, 0, 1);
    z-index: 15000; }
  header nav.open {
    right: 0; }
  header #nav__btn {
    position: absolute;
    display: block;
    top: 0;
    right: calc(100%);
    height: 70px;
    width: 70px;
    cursor: pointer;
    pointer-events: auto;
    z-index: 2;
    z-index: 15001;
    background-color: #1a1a1a; }
  header #nav__btn::after,
  header #nav__btn::before {
    position: absolute;
    right: 0;
    top: 0;
    content: '';
    background-color: #b79e4a;
    height: 2px;
    width: 30px;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out; }
  header .open #nav__btn {
    position: absolute;
    right: 0;
    top: 0;
    background-color: #b79e4a;
    width: 70px; }
  header #nav__btn::before {
    top: 25px;
    right: 20px; }
  header #nav__btn::after {
    top: 40px;
    right: 20px; }
  header nav.open #nav__btn::before {
    top: 50%;
    transform: translate(0, -50%);
    background-color: #1a1a1a;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg); }
  header nav.open #nav__btn > i {
    opacity: 0; }
  header nav.open #nav__btn::after {
    top: 50%;
    transform: translate(0, -50%);
    background-color: #1a1a1a;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg); } }
a {
  text-decoration: none;
  color: #ffffff; }

a:hover {
  filter: alpha(opacity=70);
  opacity: .7;
  transition: opacity 0.5s 0s ease-out;
  -webkit-transition: opacity 0.5s 0s ease-out;
  -o-transition: opacity 0.5s 0s ease-out; }
  a:hover img {
    filter: alpha(opacity=70);
    opacity: .7;
    transition: opacity 0.5s 0s ease-out;
    -webkit-transition: opacity 0.5s 0s ease-out;
    -o-transition: opacity 0.5s 0s ease-out; }

.recruit {
  position: fixed;
  bottom: -65px;
  right: 40px;
  z-index: 1;
  width: 234px;
  display: block;
  transition: all 0.5s cubic-bezier(0, 0, 0, 1); }
  .recruit img {
    width: 100%; }

.breadnavi {
  font-family: "NotoSansCJKjp-Medium", sans-serif;
  font-size: 14px;
  color: #ffffff; }

@media screen and (max-width: 768px) {
  .breadnavi {
    font-size: 12px; } }
.bottom {
  bottom: -300px;
  transition: all 0.5s cubic-bezier(0, 0, 0, 1); }

.opacity0 {
  opacity: 0;
  position: relative;
  pointer-events: none;
  cursor: default; }

.opacity0-2 {
  opacity: 0;
  position: relative;
  animation: opacity0 1s linear 0s; }

.opacity100 {
  opacity: 1;
  animation: opacity100 1s linear 0s; }

.opacity100-2 {
  opacity: 1;
  animation: opacity100-2 1s linear 0s; }

.loading {
  opacity: 1;
  animation: loading 1.8s infinite ease-in-out both; }

.img_anime {
  opacity: 1;
  animation: marker 4.8s infinite; }

@keyframes opacity0 {
  0% {
    opacity: 1; }
  50% {
    opacity: 0.5; }
  100% {
    opacity: 0; } }
@keyframes opacity100 {
  0% {
    opacity: 0; }
  50% {
    opacity: 0.5; }
  100% {
    opacity: 1; } }
@keyframes opacity100-2 {
  0% {
    opacity: 0;
    top: 20px; }
  50% {
    opacity: 0.5; }
  100% {
    opacity: 1;
    top: 0; } }
@keyframes loading {
  0% {
    opacity: 0; }
  50% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@keyframes marker {
  0% {
    -webkit-transform: translateY(0) scaleY(0.2);
    transform: translateY(0) scaleY(0.2);
    transform-origin: left bottom;
    opacity: 0; }
  5.5% {
    -webkit-transform: translateY(-5px) scaleY(1);
    transform: translateY(-5px) scaleY(1);
    transform-origin: left bottom;
    opacity: 1; }
  11% {
    -webkit-transform: translateY(0) scaleY(0.7);
    transform: translateY(0) scaleY(0.7);
    transform-origin: left bottom; }
  16.5% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    transform-origin: left bottom; } }
.totop {
  display: block;
  width: 54px;
  position: fixed;
  right: 40px;
  bottom: 40px; }
  .totop img {
    width: 100%; }

@media screen and (max-width: 768px) {
  .totop {
    display: block;
    width: 36px;
    right: 20px;
    bottom: 20px; } }