@charset "utf-8";
/* CSS Document */


/*　白背景
─────────────────────────────────────────*/
#container {background: #fff;}
.breadcrumb-list {border-color: #ccc;}
.breadcrumb-list ol li .ico::before {color: #ccc;}
.breadcrumb-list ol li.current a {color: #333!important;}


/*　会員ログイン画面
─────────────────────────────────────────*/
#main-form {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#main-column.solo .static-area #user-login header {
  width: 100%;
  border-bottom: 3px solid #f53;
}
#user-login header h1 {color: #111;}
#user-login section {
  margin: 15px;
  padding: 15px;
  border: 1px solid #ddd;
  background: #fcfcfc;
  border-radius: 5px;
  /*box-shadow: 0 0 10px 0 #eee;*/
}
#main-form section {width: calc(50% - 64px);}
#main-column.solo .static-area #user-login section h2.ti {
  padding: 0 0 10px;
  border-bottom: 1px solid #f53;
  font-size: 18px;
  font-weight: bold;
  color: #f53;
}
#main-column.solo .static-area #user-login section p {
  padding: 10px 7px;
  text-align: center;
  font-size: 11px;
  color: #333;
}
#main-column.solo .static-area #user-login section p.txs-bk {
  font-size: 14px;
  color: #000;
}
#main-column.solo .static-area #user-login section p .caution {
  padding: 4px 0 0;
  display: block;
  line-height: 1.3em;
  color: #f00;
}
#main-column.solo .static-area #user-login section .caution-txt {
  display: flex;
  align-items: center;
  justify-content: center;
}
#main-column.solo .static-area #user-login section .caution-txt p {
  line-height: 1.3em;
  text-align: left;
  font-size: 17px;
  color: #f00;
}
#main-column.solo .static-area #user-login section .caution-txt .ico::before {
  content: "\e93a";
  font-size: 50px;
  color: #ffb300;
}
#user-login section .inputform {padding: 10px 0;}
#user-login section .inputform dl {
  padding: 0 0 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#user-login section .inputform dl dt {
  min-width: 100px;
  padding: 0 10px 0 0;
  text-align: right;
  font-size: 13px;
  font-weight: bold;
  color: #333;
}
#user-login section .inputform dl dd {
  width: 100%;
  max-width: 220px;
  padding: 0 20px 0 0;
}
#user-login section .inputform dl dd input {
  max-width: 240px;
  width: 100%;
  padding: 5px;
  border: 1px solid #ddd;
  border-radius: 3px;
  box-shadow: 0 0 3px 0 #eee;
  font-size: 16px;
  ime-mode: disabled;
}
#user-login section .inputform .auto-login {
  padding: 10px;
  text-align: center;
  font-size: 13px;
  color: #111;
}
#main-column.solo .static-area #user-login section .inputform .auto-login p {
  padding: 10px 5px 5px;
  line-height: 1.3em;
  font-size: 10px;
  color: #f53;
}
#container #user-login section .inputform .auto-login label.ckbx::before {
  background: #fff!important;
  border-color: #ddd!important;
}
#user-login section .submit-btn ,
#user-login section#non-members .btn {
  width: 150px;
  margin: 7px auto 20px;
  padding: 10px 0;
  display: block;
  border: none;
  border-radius: 4px;
  background: #f73;
  text-align: center;
  text-shadow: 0 -1px 1px #f53;
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  cursor: pointer;
  transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-ms-transition:all 0.3s ease;
}
#user-login section .submit-btn:hover ,
#user-login section#non-members .btn:hover {background: #f53;}
#user-login section .inputform .forget {
  padding: 20px 10px 0;
  border-top: 1px solid #ddd;
  text-align: center;
}
#user-login section .inputform .forget a {
  font-size: 12px;
  color: #f53;
}
#user-login section .inputform .forget a:hover {
  text-decoration: underline;
}

/*　未会員誘導　*/
#main-column.solo .static-area #user-login section#non-members p {
  text-align: left;
  font-size: 12px;
}
#user-login section#non-members .btn {width: 200px;}
#user-login section#non-members .btn span {font-weight: normal;}
#user-login section#non-members dl.caution dt {
  padding: 7px;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  color: #111;
}
#user-login section#non-members dl.caution dd {margin: 0;}
#user-login section#non-members dl.caution dd ul {
  margin: 0;
  padding: 0 0 0 15px;
  text-align: left;
  list-style-type: disc;
}
#user-login section#non-members dl.caution dd ul li {
  padding: 0;
  font-size: 11px;
  color: #f53;
}


/*　パスワード忘れ　*/
#user-login section.mailform {
  width: 700px;
  margin: 30px auto 15px;
  display: none;
}
#user-login section.mailform form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
#user-login section.mailform form dl {padding: 10px 0;}
#user-login section.mailform .submit-btn {
  margin: 0;
  padding: 7px 0;
  max-width: 90px;
}
#user-login section.mailform .return {
  margin: 10px 0 0;
  padding: 20px 10px 7px;
  border-top: 1px solid #ddd;
  text-align: center;
}
#user-login section.mailform .return a {
  font-size: 12px;
  color: #f53;
}


/*──────────────────────────────────────────────────────────────────────

  PC｜layout

──────────────────────────────────────────────────────────────────────*/
@media screen and (min-width: 1281px)/* and (max-width: 10000px)*/ {

}



/*──────────────────────────────────────────────────────────────────────

  Tablet｜layout

──────────────────────────────────────────────────────────────────────*/
@media screen and (min-width: 769px) and (max-width: 1280px) {

}


/*──────────────────────────────────────────────────────────────────────

  SMP｜layout

──────────────────────────────────────────────────────────────────────*/
@media screen and (max-width: 768px) {

  #user-login section {
    width: calc(100% - 22px);
    margin: 15px 0;
  }
  #user-login header h1 span {
    width: 10px;
    height: 5px;
    display: block;
    overflow: hidden;
    text-indent: -10em;
  }
  #user-login section.mailform {width: auto;}


}
