@charset "UTF-8";






/*|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---------------------------------------------------------------
システムエラーページ
---------------------------------------------------------------
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||*/

#errorPage { overflow: hidden; }
.errorGuideArea { display: flex; align-items: center; justify-content: center; height: calc(100vh - 100px); background-color: #FFF; }
.errorGuideArea .errorGuideBox { display: flex; flex-direction: column; align-items: center; width: 420px; }
.errorGuideArea .errorGuideBox .errorTtl { display: flex; flex-direction: column; align-items: center; margin-bottom: 20px; }
.errorGuideArea .errorGuideBox .errorTtl span.errorIcoL { display: block; width: 74px; height: 66px; background-image: url("../images/ico_error_l.svg"); background-repeat: no-repeat; background-position: center center; background-size: 74px 66px; text-indent: -9999px; }
.errorGuideArea .errorGuideBox .errorTtl span:nth-of-type(1) { margin-bottom: 60px; }
.errorGuideArea .errorGuideBox .errorTtl span.errorName { font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif; font-size: 2.3em; font-weight: bold; }
.errorGuideArea .errorGuideBox .errorTtl span.errorName > .errorDetail { font-size: 14px; font-weight: normal; padding-top: 10px; }
.errorGuideArea .errorGuideBox .errorText { margin-bottom: 30px; }
.errorGuideArea .errorGuideBox .errorText p { font-size: 14px; }
.errorGuideArea .errorGuideBox .errorBtnBox {}
.errorGuideArea .errorGuideBox .errorBtnBox .topBtn { position: relative; text-decoration: none !important; line-height: 1em; font-weight: bold; display: inline-flex; justify-content: center; align-items: center; cursor: pointer; border-radius: 3px; transition: all 0.2s; border: 0; font-size: 1em; width: 420px; height: 40px; color: #FFF; background-color: #63BCBC; }
.errorGuideArea .errorGuideBox .errorBtnBox .topBtn:hover { opacity: 0.7; }
@media screen and (min-width: 480px) and (max-width: 600px) {
  .errorGuideArea .errorGuideBox { width: 330px; }
  .errorGuideArea .errorGuideBox .errorTtl { margin-bottom: 15px; }
  .errorGuideArea .errorGuideBox .errorTtl span:nth-of-type(1) { margin-bottom: 50px; }
  .errorGuideArea .errorGuideBox .errorTtl span.errorName { font-size: 1.8em !important; }
  .errorGuideArea .errorGuideBox .errorTtl span.errorName > .errorDetail { font-size: 14px; font-weight: normal; padding-top: 10px; }
  .errorGuideArea .errorGuideBox .errorTtl span.errorName > .errorDetail { padding-top: 5px; }
  .errorGuideArea .errorGuideBox .errorText { margin-bottom: 25px; }
  .errorGuideArea .errorGuideBox .errorText p { font-size: 14px; }
  .errorGuideArea .errorGuideBox .errorBtnBox {}
  .errorGuideArea .errorGuideBox .errorBtnBox .topBtn { position: relative; text-decoration: none !important; line-height: 1em; font-weight: bold; display: inline-flex; justify-content: center; align-items: center; cursor: pointer; border-radius: 3px; transition: all 0.2s; border: 0; font-size: 1em; width: 330px; height: 40px; color: #FFF; background-color: #63BCBC; }
  .errorGuideArea .errorGuideBox .errorBtnBox .topBtn:hover { opacity: 0.7; }
}
@media screen and (max-width: 480px) {
  .errorGuideArea { display: flex; align-items: center; justify-content: center; height: calc(100vh - 90px); background-color: #FFF; }
  .errorGuideArea .errorGuideBox { width: calc(100% - 40px); }
  .errorGuideArea .errorGuideBox .errorTtl { margin-bottom: 15px; }
  .errorGuideArea .errorGuideBox .errorTtl span:nth-of-type(1) { margin-bottom: 40px; }
  .errorGuideArea .errorGuideBox .errorTtl span.errorName { font-size: 1.6em !important; }
  .errorGuideArea .errorGuideBox .errorTtl span.errorName > .errorDetail { font-size: 14px; font-weight: normal; padding-top: 10px; }
  .errorGuideArea .errorGuideBox .errorTtl span.errorName > .errorDetail { padding-top: 5px; }
  .errorGuideArea .errorGuideBox .errorText { margin-bottom: 25px; }
  .errorGuideArea .errorGuideBox .errorText p { font-size: 14px; }
  .errorGuideArea .errorGuideBox .errorBtnBox { width: 100%; }
  .errorGuideArea .errorGuideBox .errorBtnBox .topBtn { position: relative; text-decoration: none !important; line-height: 1em; font-weight: bold; display: inline-flex; justify-content: center; align-items: center; cursor: pointer; border-radius: 3px; transition: all 0.2s; border: 0; font-size: 1em; width: 100%; height: 40px; color: #FFF; background-color: #63BCBC; }
  .errorGuideArea .errorGuideBox .errorBtnBox .topBtn:hover { opacity: 0.7; }
}




