html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
body{
  background:#eff3f6;
}
/*利用規約*/
#container{
  display: block;
  position:relative;
  width: 65%;
  margin: 3% auto 0;
  flex:1;
}
#container h1{
  width:60%;
  margin:5% auto 0;
  padding: 0.5% 2%;
  background-color:#f8f8f8;
  border:solid #dedddd 1px;
  border-top-left-radius: 50px;
  border-top-right-radius: 50px;
  border-bottom-left-radius: 50px;
  border-bottom-right-radius: 50px;
  -moz-border-radius-topleft: 50px;
  -moz-border-radius-topright: 50px;
  -moz-border-radius-bottomleft: 50px;
  -moz-border-radius-bottomright: 50px;
  font-size:1.5em;
  text-align: center;
}
#container h2{
  margin-top: 12%;
  color:#ad154e;
  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
  line-height: 1.5em;
}
#container p{
  width: 100%;
  margin-top: 2%;
  font-size: 1.1em;
  text-align: center;
}
#container p span{
  display: block;
  text-align: left;
}
/*
#container_p {
  display: block;
  position:relative;
  width: 100%;
  margin: 3% auto 0;
  flex:1;
}
#container_p h1{
  width:60%;
  margin:5% auto 0;
  padding: 0.5% 2%;
  background-color:#f8f8f8;
  border:solid #dedddd 1px;
  border-top-left-radius: 50px;
  border-top-right-radius: 50px;
  border-bottom-left-radius: 50px;
  border-bottom-right-radius: 50px;
  -moz-border-radius-topleft: 50px;
  -moz-border-radius-topright: 50px;
  -moz-border-radius-bottomleft: 50px;
  -moz-border-radius-bottomright: 50px;
  font-size:1.5em;
  text-align: center;
}
*/
#scroll_cont{
  height: 60vh;
  border: 1px solid;
  overflow-y: scroll;
  margin:1em 0;
  padding:1em;
  text-align: left;
}
#scroll_cont p{
  margin-right:1em;
  text-align: right;
}
#scroll_cont dt{
  margin-top: 0.8em;
  font-size: 1.1em;
  text-align: left;
}
/*#scroll_cont dt:nth-of-type(1){
  margin-bottom: 1rem;
}*/
#scroll_cont dd{
  margin: 0.2em 0 0.5em 1em;
}
#scroll_cont ol{
  margin: 0.5em 0em 0.5em 2em;
  text-align: left;
}
#scroll_cont ol li{
  list-style: decimal;
  margin: 0.5em;
}
#scroll_cont ul{
  margin-left:1em;
  text-align: left;
}
#scroll_cont ul li {
  list-style-type: none;
  counter-increment: cnt;
  padding-left: 1em;
  text-indent: -1em;
  }
  #scroll_cont ul li::before{
    list-style:decimal;
    content: "(" counter(cnt) ") ";
  }
#container .btn_position{
  text-align:center;
}
#btn_next{
  display: inline-block;
  width:30%;
  margin:1rem;
  padding:0.5rem;
  background-color: #3cb0fd;
  border-color: #357ebd;
  border-radius: 5px;
  font-size:1.2rem;
  opacity: 0.5;
}
#btn_next:hover{
  background-color: #3cb0fd;
  border-color: #357ebd;
  font-weight: bold;
  opacity: 1;
  color: black;
}
#btn_next2{
  color: black;
  cursor: pointer;
  display: inline-block;
  width:30%;
  margin:1rem;
  padding:0.5rem;
  background-color: #3cb0fd;
  border-color: #357ebd;
  border-radius: 5px;
  font-size:1.2rem;
  font-weight: bold;
}
.hide{
  display: none;
}
/*利用規約*/

.txtCheck{
  text-align: center;
}
.com_c{
  text-align: center;
}
.errM{
  position:absolute;
  text-align:center;
  top:3rem; width:100%;
  color:red;
  font-size:1.5rem;
}
.box{
  display: block;
  margin:2rem auto;
  width:60%;
  background:#F7F9FA;
  border: 1px solid #0d6db6;
  -webkit-border-radius:5px #0d6db6;
  -moz-border-radius:5px #0d6db6;
  border-radius:5px #0d6db6;
  -moz-box-shadow:rgba(0,0,0,0.15) 0 0 1px;
  -webkit-box-shadow:rgba(0,0,0,0.15) 0 0 1px;
  box-shadow:rgba(0,0,0,0.15) 0 0 1px;
  border-radius: 10px;
  color:#444;
  font:normal Arial, Helvetica, Sans-serif;
  overflow:hidden;
}
.box h1{
  margin:0;
  padding:2rem 0;
  background-color: #e8e8e8;
  background-image: url("../images/logo_login.png");
  background-repeat: no-repeat;
  background-size: 8%;
  background-position: 95% 50%;
  font-size:2rem;
  font-weight:bold;
  text-align:center;
}
.box h2{
  display: block;
  width:95%;
  margin: 1rem auto;
  border-bottom: 2px dotted #4d4d4d;
  font-size:1.5rem;
  font-weight:bold;
  text-align:center;
}
.box p{
  display: block;
  margin:0 auto;
  font-size:1.2rem;
  padding:1rem 2rem;
}
.box p.position{
  margin:2rem auto;
  text-decoration: none;
}
.box p.position a{
  margin:2rem auto;
}
.box p.desc{
  display: block;
  margin:0 auto;
  font-size:0.9rem;
  padding:1rem 2rem;
}
.box dl{
  margin:0;
}
.box dt{
  margin:0;
  padding:2rem 0;
  background-color: #e8e8e8;
  background-image: url("../images/logo_login.png");
  background-repeat: no-repeat;
  background-size: 8%;
  background-position: 95% 50%;
  font-size:2rem;
  font-weight:bold;
  text-align:center;
}
.box dd{
  margin:1rem 2rem;
  font-size:1.2rem;
}
.box table{
  width:90%;
  border:none;
  border-radius: 10px;
  margin:0 auto;
}
.box table tr{
  /*height: 6rem;*/
  border-bottom:#ddd dotted 2px;
}
.box table tr:nth-of-type(3){
  height: 5rem;
  border-bottom: none;
}
.box table th{
  width:30%;
  vertical-align: top;
  padding-top:1.3rem;
  font-size: 1.2rem;
}
.box table.add th{
  width:30%;
  vertical-align: top;
  padding-top:1.3rem;
  font-size: 1.2rem;
}
.box table td{
  width:auto;
  padding:0.5rem;
}
.box table tr:last-child{
  border-bottom:none;
  text-align: center;
}
.box table td span{
  font-size:0.8rem;
  margin-left:1.2rem;
  position:relative;
}
.box table td span:nth-of-type(2){
  color:red;
}
.box table td span #mesmail:empty{
  display: none;
}
.box .message{
  display: block;
  margin:0 auto;
  background-color: #e8e8e8;
  font-size:1.2rem;
  padding:1rem 2rem;
}
.box .wrapper{
  display: grid;
  width: 95%;
  margin:0 auto;
  padding:1rem 0;
  border-bottom: 2px dotted #d4d4d4;
  grid-template-rows:3rem auto;
  grid-template-columns:25% 70%;
  gap:1rem;
  /*background-color:#ccc;*/
  font-size: 1rem;
  text-align:left;
}
.box .wrapper:nth-of-type(4){
  border-bottom: 1px solid #d4d4d4;
}
.box .wrapper div{
  display: flex;
  flex-flow: column;
  align-items: left;
  justify-content: center;
}
.box .wrapper div:nth-child(2){
  margin:3px 0;
}
.box .wrapper div #pass_message {
  display: inline-block;
  width: 95%;
}
.box .wrapper div span{
  display: inline-block;
  width: 95%;
  color: red;
}
.box .wrapper input{
  margin-left:8px;
  width:100%;
}
.box .wrapper .element{
  grid-row:span 2;
  border-right: 1px solid #ddd;
  align-items: center;
}
/* ↓↓↓↓↓ 2022.6.22 ここから ↓↓↓↓↓ */
.box .wrapper .btn_test{
  display:inline-block;
  width:12rem;
  background: #d4d4d4;
  -webkit-border-radius: 3;
  -moz-border-radius: 3;
  border-radius: 3px;
  border:none;
  color: #4d4d4d;
  font-size: 0.9rem;
  text-decoration: none;
  margin-top:0.5rem;
  padding: 0.5rem;
  position:relative;
  text-align:center;
}
.box .wrapper .btn_test:hover {
  background: #e4e4e4;
  font-weight: bold;
}
/* "送信中"文字列 */
.sendingstr {
  color: red;
  font-size: 1.1rem;
  margin: -2rem 0 1rem 16rem;
  visibility: hidden;
}
/* ↑↑↑↑↑ 2022.6.22 ここまで ↑↑↑↑↑ */
.box checkuser{
  color:red;
  margin-left:8px;
}
.box .btn_position{
  text-align: center;
}
#btn_submit{
  display: inline-block;
  width:30%;
  margin:1rem;
  padding:0.5rem;
  background-color: #3cb0fd;
  border-color: #357ebd;
  border-radius: 5px;
  font-size:1.2rem;
  opacity: 0.5;
}
#btn_submit:hover{
  background-color: #3cb0fd;
  border-color: #357ebd;
  font-weight: bold;
  opacity: 1;
}
.btn_primary{
  width:30%;
  margin:1rem;
  padding:0.5rem;
  background-color: #3cb0fd;
  border-color: #357ebd;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  font-size:1.2rem;
  text-decoration: none;
  opacity: 0.5;
}
.btn_primary:hover{
  font-weight: bold;
  opacity: 1;
}
.btn_back {
  width: 30%;
  margin:1rem;
  padding:0.5rem;
  background: #d4d4d4;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  border: #444 solid 1px;
  color: #4d4d4d;
  font-size: 1.2rem;
  text-decoration: none;
  opacity: 0.5;
}
.btn_back:hover{
  font-weight: bold;
  opacity: 1;
}
#loginForm{
  display: table;
}
.box.login{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 40%;
  height: 35%;
}
.boxBody
{
  background:#fefefe;
  background-image: url("../images/logo_login.png");
  background-repeat: no-repeat;
  background-size: 8%;
  background-position: 95% 5%;
  border-top:1px solid #dde0e8;
  border-bottom:1px solid #dde0e8;
  padding:2.5rem 1rem;
}

.box footer
{
  padding:1rem 1.5rem;
  background:#eff4f6;
  border-top:1px solid #fff;
  overflow:hidden;
  /*height:32px;*/
}

.box label
{
  display:block;
  font:18px/22px Arial, Helvetica, Sans-serif;
  margin:10px 0 0 6px;
}
.box footer label{
   margin:0;
   display: block;
   position: relative;
   padding-left: 1.5rem;
}
.box footer input[type=checkbox]{
  /*vertical-align:sub;*/
  /*vertical-align:middle;*/
  /*margin-right:10px;*/
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  transform: scale(1.5);
}
.box input[type=text],
.box input[type=password],
.txtField,
.cjComboBox{
  display:block;
  width:94%;
  margin:0px 0 4px;
  padding:8px 6px;
  border:6px solid #F7F9FA;
  -webkit-border-radius:3px;
  -moz-border-radius:3px;
  border-radius:3px;
  -moz-box-shadow:2px 3px 3px rgba(0, 0, 0, 0.06) inset, 0 0 1px #95a2a7 inset;
  -webkit-box-shadow:2px 3px 3px rgba(0, 0, 0, 0.06) inset, 0 0 1px #95a2a7 inset;
  box-shadow:2px 3px 3px rgba(0, 0, 0, 0.06) inset, 0 0 1px #95a2a7 inset;
}
.box input[type=text]:focus,
.box input[type=password]:focus,
.txtField:focus,
.cjComboBox:focus
{
  border:6px solid #f0f7fc;
  -moz-box-shadow:2px 3px 3px rgba(0, 0, 0, 0.04) inset, 0 0 1px #0d6db6 inset;
  -webkit-box-shadow:2px 3px 3px rgba(0, 0, 0, 0.04) inset, 0 0 1px #0d6db6 inset;
  box-shadow:2px 3px 3px rgba(0, 0, 0, 0.04) inset, 0 0 1px #0d6db6 inset;
  color:#333;
}
.cjComboBox
{
  width:294px;
}
.cjComboBox.small
{
  padding:3px 2px 3px 6px;
  width:100px;
  border-width:3px !important;
}
.txtField.small
{
  padding:3px 6px;
  width:200px;
  border-width:3px !important;
}

.rLink{padding:0 6px 0 0; font-size:11px; float:right;}
/*.box a{color:#999;}
.box a:hover, .box a:focus{text-decoration:underline;}
.box a:active{color:#f84747;}*/
.btnLogin
{
  -moz-border-radius:2px;
  -webkit-border-radius:2px;
  border-radius:15px;
  background:#a1d8f0;
  background:-moz-linear-gradient(top, #badff3, #7acbed);
  background:-webkit-gradient(linear, left top, left bottom, from(#badff3), to(#7acbed));
  border:1px solid #7db0cc !important;
  cursor: pointer;
  padding:11px 16px;
  font:bold 12px/14px Verdana, Tahomma, Geneva;
  text-shadow:rgba(0,0,0,0.2) 0 1px 0px; 
  color:#fff;
  -moz-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
  -webkit-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
  box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
  margin-left:12px;
  float:right;
  padding:7px 21px;
}
#errmes{
  display: block;
  color:red;
  margin:1rem auto;
  font-size:1rem;
  font-weight: bold;
  text-align:center;
}
.btn_login {
  display: block;
  position:relative;
  width: 12rem;
  margin: 1rem auto;
  padding:0 2rem;
  border-radius: 5px;
  color: #ffffff;
  font-size:1.2rem;
  height:3rem;
  line-height:3rem;
  text-decoration: none;
}
.btn_login:hover {
  text-decoration: none;
  font-weight: bold;
}
/* [メニューに戻る]ボタン */
.btn_login_b {
  background: #3cb0fd;  
}
.btn_login_b:hover {
  background: #3498db;
}
.btnLogin:hover,
.btnLogin:focus,
.btnLogin:active{
  background:#a1d8f0;
  background:-moz-linear-gradient(top, #7acbed, #badff3);
  background:-webkit-gradient(linear, left top, left bottom, from(#7acbed), to(#badff3));
}
.btnLogin:active
{
  text-shadow:rgba(0,0,0,0.3) 0 -1px 0px; 
}
footer#main{
  position:fixed;
  left:0;
  bottom:10px;
  text-align:center;
  font:normal 11px/16px Arial, Helvetica, sans-serif;
  width:100%;
}
/* ------------------------------------------------ 
   レスポンシブ（768px以下）
 ------------------------------------------------ */
 @media screen and (max-width: 768px) {
  #container{
    width: 80%;
  }  
  #container h1{
    width:90%;
    font-size:14px;
  }
  #scroll_cont{
    font-size:12px;
  }
  #btn_next{
    width:60%;
    margin:1rem 0.5rem;
    padding:0.3rem;
    background-color: #3cb0fd;
    border-color: #357ebd;
    font-size:1.2rem;
  }
  .box{
    margin:5rem auto 0;
    width:90%;
    border-radius: 5px;
  }
  .box table th{
    width:30%;
    padding-top:1.5rem;
    font-size: 0.8rem;
    text-align: left;
  }
  .box table td span{
    font-size:0.8rem;
    margin-left: 0;
  }
  .box.login{
    position: relative;
    margin-top: 15%;
    width: 86%;
    height: 35%;
  }
  .box .wrapper{
    font-size: 0.8rem;
  }
  #errmes{
    font-size:0.8rem;
  }
}
/* ------------------------------------------------ 
   規約印刷
 ------------------------------------------------ */
 @media print{
  body{
    background:#fff;
  }
  #container{
    width: 100%;
    margin: 3% auto 0;
    background-color: #fff;
  }  
  
  #container_p{
    width: 100%;
    margin: 3% auto 0;
    background-color: #fff;
  }
  .print-off {
    display: none;
  }
  
  .remodal-wrapper {
  	padding: 0;
  }
  .remodal {
  	max-width: 100%;
  }
  #scroll_cont{
    height: 100vh;
    border: none;
    overflow-y:visible;
    margin:1em 0;
    padding:1em;
    text-align: left;
  }
  #scroll_cont ul{
    margin-left:0em;
    text-align: left;
  }
  #scroll_cont ul li {
    padding-left: 2em;
    text-indent: -2em;
    }
  
  #btn_next,
  #btn_next2,
  .txtCheck{
    display: none;
  }
  .hide{
    display: block;
    text-align: right;
  }
  .btn_privacy{
    display:none;
  }
 }
