@CHARSET "utf-8";

/********************************************************/
/* 全体HTML */
/********************************************************/
html {
	font-family:"游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "Meiryo UI" , "メイリオ" , Meiryo , Avenir ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "ＭＳ Ｐゴシック" , "MS PGothic" ,"Open Sans", Helvetica , Arial , Roboto ,  sans-serif;
}

/********************************************************/
/* 全体BODY */
/********************************************************/
body	{
	font-family:"游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "Meiryo UI" , "メイリオ" , Meiryo , Avenir ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "ＭＳ Ｐゴシック" , "MS PGothic" ,"Open Sans", Helvetica , Arial , Roboto ,  sans-serif;
  margin: 0;
  padding: 0;
}

/********************************************************/
/* 共通エラーエリア */
/********************************************************/
.system_error_area	{
	border: 1px #000 solid;
	padding:10px;
}

.system_error_line	{
	color:red;
}

/********************************************************/
/* 開発モードのvar_dumpエリア */
/********************************************************/
.system_dump_area	{
	margin-top: 50px;
	border: 1px #000 solid;
	padding:10px;
	font-size: 15px;
}

.system_dump_area h4	{
	font-size: 20px;
	font-weight: bold;
}

/*20200623 add*/

/********************************************************/
/* ヘッダー */
/********************************************************/

.header_bg{
    background: #fff;
    box-shadow: 0 3px 15px rgba(0, 0, 0, .1);
    height: 80px;
    width: 100%;
    position: absolute;
    left: 0;
    top:  0;
    z-index: 2;
}

.logo_img{
  width: 250px;
  padding: 18px 40px;
}

/********************************************************/
/* 共通 */
/********************************************************/
.contents{
  padding-top: 80px;
  background: #f4f4f4;
  width: 100%;
  height: calc(100vh - 80px);
  color:#34363a
}

/********************************************************/
/* 処理結果表示画面 */
/********************************************************/
.resulut_error_wrap {
  text-align: center;
  position: absolute;
  top: 40%;
  margin: 0 auto;
  width: 100%;
}

.resulut_error_wrap h2{
  font-size: 25px;
  color: #ea5800;
}

.resulut_error_wrap p{
  font-size: 18px;
  line-height: 1.8;
  letter-spacing:0.8pt;
}

.resulut_error_wrap button{
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
  font-size: 20px;
  margin-top: 30px;
  width: 200px;
  font-weight: bold;
  text-decoration: none;
  color: white;
  padding: 10px 20px;
  background-color: #ea5800;
  letter-spacing:0.8pt;
}

.resulut_error_wrap p.filename{
  font-size: 16px;
  text-align: right;
  margin-right: 5px;
}

/********************************************************/
/* ロード画面 */
/********************************************************/

/*大枠*/
.load_wrap{
  display: none;
  position: fixed;
  z-index: 200;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100vh;
  /*position: relative;*/
  background: #f4f4f4;
  /*opacity:0.7;*/
}

/*配置*/
.load_container{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-45%) translateX(-50%);
  -webkit-transform: translateY(-45%) translateX(-50%);
  text-align: center;
  z-index: 201;
}

/*車画像*/
.load_img{
  width: 7rem;
}

/*テキスト*/
.load-text {
  margin-top: 5px;
  font-size: 18px;
  font-weight: bold;
  position:relative;
  color:#34363a
}

.load-text span {
  display: inline-block;
  margin: 0 -.05em;
  animation: loading 5s infinite alternate;
}

.load-text span:nth-of-type(1) {
  animation-delay:0s;
  margin-left: 0.3rem;
}

.load-text span:nth-of-type(2) {
  animation-delay:0.1s;
}

.load-text span:nth-of-type(3) {
  animation-delay:0.2s;
}

.load-text span:nth-of-type(4) {
  animation-delay:0.3s;
  margin-left: 0.3rem;
}

.load-text span:nth-of-type(5) {
  animation-delay:0.4s;
}

.load-text span:nth-of-type(6) {
  animation-delay:0.5s;
}

.load-text span:nth-of-type(7) {
  animation-delay:0.6s;
}

.load-text span:nth-of-type(8) {
  animation-delay:0.7s;
}

.load-text span:nth-of-type(9) {
  animation-delay:0.8s;
}

.load-text span:nth-of-type(10) {
  animation-delay:0.9s;
}

.load-text span:nth-of-type(11) {
  animation-delay:1s;
}

@keyframes loading {
  0%   { opacity: 1; }
  50%  { opacity: 0.5; }
  100% { opacity: 0; }
}