@charset "UTF-8";

/*
------------------------------------*/
body, h1, h2, h3, h4, p, ul, ol{
  margin: 0;
  padding: 0;
}
img{
  vertical-align: middle;
}
ul>li{
  list-style-type: none;
}
/*
------------------------------------*/
html{
  font-size: 62.5%;
}
html * {
  box-sizing: border-box;
}
body{
  font-size: 1.3rem;
  font-family: arial,sans-serif;
  color: #333;
  overflow-wrap: break-word;
  word-wrap: break-word;
}
img{
  width: 100%;
}
a{
  text-decoration: none;
  color: #1381c4;
}
a:hover{
  text-decoration: underline;
}
@media (max-width: 768px) {
  body{
    font-size: 1.6rem;
  }
}
/*
------------------------------------*/
.pc_only{
  display: block;
}
@media (max-width: 768px) {
  .pc_only{
    display: none;
  }
}
/* .container
------------------------------------*/
.container{
  width: 606px;
  margin: 56px auto 28px;
  padding: 28px 28px 42px;
  border: 1px solid #e9e8e3;
  border-radius: 6px;
  box-shadow: 0 0 2px 2px #efeeea;
}
@media (max-width: 768px) {
  .container{
    width:  calc(100% - 20px);
    border-radius: 6px;
    -webkit-box-shadow: 0 0 2px 2px #d9d7d1;
    box-shadow: 0 0 2px 2px #d9d7d1;
    margin: 15px 10px;
    padding: 20px 15px 30px;
  }
}
.container p{
  margin-bottom: 10px;
}
hr{
  width: 100%;
  text-align: left;
  display: inline-block;
  border:0;
  border-bottom: 1px solid #ccc;
  margin: 19px 0 20px;
}
/* header
------------------------------------*/
header h1{
  margin-bottom: 20px;
  padding-bottom: 10px;
  text-align: center;
  font-size: 2.0rem;
  border-bottom: 1px solid #ccc;
}
.sp_only{
  display: none;
}
header .head_text{
  margin-bottom: 20px;
}
header .head_text:last-child{
  margin-bottom: 30px;
}
header .head_text strong{
  color: red;
}
@media (max-width: 768px) {
  header h1{
    margin-bottom: 5%;
    text-align: left;
  }
  .pc_only{
    display: none;
  }
  .sp_only{
    display: block;
  }
  header .head_text{
    margin-bottom: 2%;
  }
  header .head_text:last-child{
    margin-bottom: 5%;
  }
}
/* main
------------------------------------*/
main h2{
  margin-bottom: 10px;
  border-bottom: 2px solid #000;
  font-size: 1.7rem;
}
main h3{
  font-size: 1.3rem;
}
main .conts_text{
  margin-bottom: 20px;
  font-size: 1.3rem;
}
main .subconts{
  margin: 0 0 30px 20px;
  font-size: 1.3rem;
}
main .subconts span{
  font-weight: bold;
}
main .conts_border{
  padding-top: 20px;
  border-top: 1px solid #e5e5e5;
}
@media (max-width: 768px) {
  main h2{
    margin-bottom: 3%;
  }
  main .conts_text{
    margin-bottom: 2%;
  }
  main .subconts{
    margin: 0 0 5% 2%;
  }
  main .conts_border{
    padding-top: 5%;
  }
}
main p{

}
/* btn
------------------------------------*/

.btnLogin {
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  width: 320px;
  height: 32px;
  margin: 0 auto 15px;
  border-radius: 16px;
  border: 1px #f6ab3b solid;
  color: #fff;
  font-size: 13px; /* 108% */
  font-weight: bold;
  text-align: center;
  background: #ffd16b;
  background: linear-gradient(to bottom, #ffd16b 0%,#fab44a 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc455', endColorstr='#f8a339',GradientType=0 );
}
.btnLogin:hover {
  border: 1px #f3972b solid;
  background: #ffc455;
  background: linear-gradient(to bottom, #ffc455 0%,#f8a339 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffd16b', endColorstr='#fab44a',GradientType=0 );
  text-decoration: none;
}
.btnForm {
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  width: 320px;
  height: 32px;
  margin: 0 auto;
  border-radius: 16px;
  border: 1px #c3c3c3 solid;
  color: #666;
  font-size: 13px; /* 108% */
  font-weight: bold;
  text-align: center;
  background: #f8f8f8;
  background: linear-gradient(to bottom, #f8f8f8 0%,#e2e2e2 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#e2e2e2',GradientType=0 );
}
.btnForm:hover {
  border: 1px #b3b3b3 solid;
  background: #f6f6f6;
  background: linear-gradient(to bottom, #f6f6f6 0%,#dadada 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#dadada',GradientType=0 );
  text-decoration: none;
}

@media (max-width: 768px) {
  .btnLogin {
    display: inline-block;
    width: 100%;
    height: auto;
    border-radius: 6px;
    text-align: center;
    vertical-align: bottom;
    font-weight: bold;
    padding: 12px 0;
    margin-bottom: 20px;
    background-color: #f0920c;
    color: #fff;
    font-size: 1.4rem;
  }
  .btnForm {
    display: inline-block;
    width: 100%;
    height: auto;
    border-radius: 6px;
    text-align: center;
    vertical-align: bottom;
    padding: 12px 0;
    margin-bottom: 20px;
    background-color: #eee;
    color: #666;
    font-size: 1.4rem;
  }
}
/* footer
------------------------------------*/
footer{
  width: 825px;
  margin: 0 auto 30px;
  color: #999;
  text-align: center;
}
@media (max-width: 768px) {
  footer{
    width: 100%;
    margin: 7% auto;
  }
}