@charset "utf-8";
/* CSS Document */

html, body {
  height: 100%!important;
  margin: 0!important;
  padding: 0;
}
body {
  min-height: 100vh;
  display: flex!important;
  flex-direction: column!important;
}


/*フッター*/
footer {
  text-align: center !important;
  line-height: 140%;
  margin: 0;
  padding: 0;
}
.security {
clear: both;
max-width: 600px;
text-align: center !important;
margin: 0 auto 0;
padding: 8em 0 0;
}
.security ul{
width: 100%;
}
.security li{
float: left;
width: 50%;
font-weight: 400!important;
color: #555!important;
}

@media screen and (max-width: 640px) {
.security {
padding: 2em 0 0;
margin-bottom: -2em;
}
.security li{
width: 100%;
float: none;
text-align: center !important;
}
}

.footer_company{
clear: both;
  text-align: center !important;
  background-color: #235fca;
  color: #fff;
  font-size: 0.9em;
  line-height: 140%;
  margin: 0!important;
  padding: 30px 0;
}

.privacy-box iframe {
margin: 1em auto;
width: 100%;
height: 100px;
border: 1px #ccc solid;
}


/*共通*/
@media screen and (max-width: 640px) {
.pc {
 display:none;
}
}
@media screen and (min-width: 641px) {
.sp {
 display: none;
}
}




/*フォーム*/
form {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  max-width: 560px;
  padding:2em;
  margin: 1em auto 1em;
  border: 1px solid #ddd;
  overflow: auto;
  display: inline-block;
  width: 100%;
  color: #000;
}

.form_main{
  text-align: center;
  margin: 0em auto;
  box-sizing: border-box;
}
.form_box {
width: 100%;
  max-width: 560px;
  flex: 1!important;
  text-align: center!important;
  margin: 0em auto 0em;
}
.form_box h1 {
  padding: 1em 0;
  font-weight: 500;
  color: #000!important;
}

@media screen and (max-width: 640px) {
  form {
    max-width: 420px;
    padding: 1em;
  }
  .form_box {
    padding: 1em 0.4em;
    margin: 1em auto;
  }
  .form_box h1 {
  padding: 0em 0 1em;
}
} 



section{
clear: both;
overflow: auto;
}


label {
 margin: 12px 0 4px
}
input, select {
 width: 100%;
 padding: 10px;
 border: 1px solid #ccc;
 border-radius: 8px
}
input[type="email"] {
 width: 100%;
 padding: 10px;
 border: 1px solid #ccc;
 border-radius: 12px;
 font-size: 1.2em;
 color: #000;
}
input[type="submit"] {
 margin-top: 16px;
 width: auto;
 background: #0d6efd;
 color: #fff;
 border: none!important;
 cursor: pointer;
 border-radius: 8px;
 min-width: 10em;
}




.alert_box{
 width: 100%;
 max-width: 640px;
 margin: 0em auto 0em;
 padding: 0 1em 0em;
 color: #777;
 font-size: 1em;
 text-align: center;
 overflow: auto;
 display: block;
 clear: both;
}
.alert {
 max-width: 640px;
 margin: 0 auto 16px;
 padding: 1em 1em 1.6em ;
 border-radius: 8px;
 text-align: center;
}
.alert-error {
 background: #ffe4e6;
 color: #8a0c19;
 border: 1px solid #f5c2c7
}
.alert-info {
 background: #e7f1ff;
 color: #0b3d91;
 border: 1px solid #cfe2ff
}
.alert-ok {
 background: #e7f7ec;
 color: #0b5f3b;
}

.small {
 color: #000;
 font-size: 0.9em
}
@media screen and (max-width: 640px) {
.small {
 font-size: 1em
}
}





.item_mail{
font-size: 1.2em;
padding: 4px 10px 10px;
}





.tokuten_box{
 width: 100%;
 max-width: 480px;
 margin: 0em auto 1em;
 padding: 0 1em 0.6em;
 color: #4257BA;
 font-size: 1em;
 text-align: center;
 overflow: auto;
 display: block;
 clear: both;
}
.tokuten_box-img{
 background-image: url("/images/menber01.png");
 background-repeat: no-repeat;
 background-position: right -12px top -14px;
 background-size: auto;  
}

.tokuten_title{
 font-size: 1.2em;
 font-weight: 500;
 padding-top: 0;
 padding-bottom: 0.4em;
 text-align:center;
}
.tokuten_text{
text-align: left;
font-size: 1em;
}

@media screen and (max-width: 640px) {
  .tokuten_title{
 font-size: 1.1em;
 }
  .tokuten_text{
font-size: 0.9em;
text-indent: 0em;
}
}





/*確認*/
.check-box{
clear: both;
margin: 2em auto 2em;
}
.check{
clear: both;
margin: 2em auto 0em;
text-align: center;
}
.check h2{
font-size: 1em;
}
.check label{

}
.check .confirm-value{
width: 100%;
border: 1px solid #ddd;
padding: 10px 20px;
}
.button-group{
clear: both;
overflow: auto;
}
.button-group li {
float: left;
width: 40%;
margin: 0 1em;
text-align: center;
display: block;
overflow: auto;
}
.check-btn {
margin: 1em auto;
background-color: #005FD5;
color: #fff;
min-width: 10em;
padding: 10px 20px;
text-decoration: none;
font-size: 1em;
border: none;
border-radius: 8px;
}
.check-btn:hover {
  color: #fff;
  opacity: 0.8;
}
.check-btn02 {
margin: 1em auto;
background-color: #ccc;
color: #000;
padding: 10px 10px;
text-decoration: none;
font-size: 1em;
border: none;
}
.check-btn02:hover {
  color: #fff;
  opacity: 0.8;
}



.btn-submit{
margin: 1em auto;
background-color: #005FD5;
color: #fff;
padding: 10px 20px;
text-decoration: none;
font-size: 1em;
border: 1px solid #ccc;
border-radius: 8px;
}


/*verify_email*/
.box {
 max-width: 720px;
 padding: 16px;
 border: 1px solid #ddd;
 background: #f8fafc
}
.ok {
 background: #e7f7ec;
 border-color: #b7eed3;
 color: #0b5f3b
}
.ng {
 background: #ffe4e6;
 border-color: #f5c2c7;
 color: #8a0c19
}
a.btn {
 display: inline-block;
 margin-top: 12px;
 padding: 10px 16px;
 border-radius: 8px;
 text-decoration: none;
 background: #0d6efd;
 color: #fff
}
.debug {
 max-width: 720px;
 margin: 16px 0;
 padding: 12px;
 border: 1px dashed #999;
 border-radius: 8px;
 background: #f9f9f9
}




/**/
.help {
 color: #666;
 font-size: .9em
}
.row {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 12px
}






/*フォーム*/
.form_main h2 {
 background-color: #5A5555 !important;
 color:#FFFFFF !important;
 font-size:1em;
 font-weight:normal !important;
 padding:1.2em 1.2em !important;
 margin:0em auto 0.4em !important;
}
.form_main h3 {
 background-color: #5A5555;
 color:#FFFFFF;
 font-size:1em;
 font-weight:normal;
 padding:0.5em;
 margin:1.4em auto 0.4em;
}
.form_main hr{
margin: 0 1em;
border-top: 1px dotted #ECECEC;
}

.form_main form{
 padding:0em;
 margin:0em ;
}



#kaiinform01{
width: 100%;
margin: 0 auto;
text-align: left!important;
}

#kaiinform01 hr{
margin: 1em 0;
border-top: 1px dotted #ECECEC;
}


#kaiin02{
 margin-bottom:1em;
 float:none;
 overflow:hidden;
 padding: 10px 10px 10px;
}


.body_main ul{
 list-style:none;
 border-bottom:none !important;
 padding:0em;
 margin:0em;
}
.body_main li{
 font-size:1.1em;
 color:#000000;
 font-weight:500 !important;
 padding:0.1em 0.1em 0.1em 0.1em;
 margin:1em;
 line-height:200%;
	list-style:none;
}
 .jusho02{
 margin-top:0.2em!important;
}



.kaiin_textbox {
width:92% !important;
padding:0.4em 0.2em!important;
font-size:1.1em !important;
font-weight:normal !important;
border:solid 3px #666 !important;
-webkit-border-radius: 3px !important;
-moz-border-radius: 3px !important;
border-radius: 3px !important;
color:#000 !important;
margin-right:1em !important;
}

.kaiin_textbox01 {
width:92% !important;
padding:0.4em 0.2em!important;
font-size:1.1em !important;
font-weight:normal !important;
border:solid 1px #666 !important;
-webkit-border-radius: 3px !important;
-moz-border-radius: 3px !important;
border-radius: 3px !important;
color:#000 !important;
margin-right:1em !important;
background-color: #fff!important;
}

.kaiin_textbox02 {
width:86% !important;
padding:0.4em 0.2em!important;
margin-top: 0.4em;
font-size:1.1em !important;
font-weight:normal !important;
border:solid 3px #666 !important;
-webkit-border-radius: 3px !important;
-moz-border-radius: 3px !important;
border-radius: 3px !important;
color:#000 !important;
}

.kaiin_textbox03 {
padding:0.4em 0.2em!important;
font-size:1.1em !important;
font-weight:normal !important;
border:solid 3px #666 !important;
-webkit-border-radius: 3px !important;
-moz-border-radius: 3px !important;
border-radius: 3px !important;
background-color:#fff !important;
color:#000 !important;
margin:0.2em !important;
width:80% !important;
}

.kaiin_textbox04 {
padding:0.4em 0.2em!important;
font-size:1.1em !important;
font-weight:normal !important;
border:solid 3px #666 !important;
-webkit-border-radius: 3px !important;
-moz-border-radius: 3px !important;
border-radius: 3px !important;
background-color:#fff !important;
color:#000 !important;
margin:0.2em !important;
width:36% !important;
}

.kaiin_textbox05 {
padding:0.4em 0.2em!important;
font-size:16px !important;
font-weight:normal!important;
line-height: 160%;
border:solid 3px #666 !important;
-webkit-border-radius: 3px !important;
-moz-border-radius: 3px !important;
border-radius: 3px !important;
background-color:#fff !important;
color:#000 !important;
margin:0.2em !important;
width:95% !important;
word-break: break-all;
overflow: scroll;
}

.kaiin_textbox06 {
width:50% !important;
padding:0.4em 0.2em!important;
font-size:1.1em !important;
font-weight:normal !important;
border:solid 3px #666 !important;
-webkit-border-radius: 3px !important;
-moz-border-radius: 3px !important;
border-radius: 3px !important;
color:#000 !important;
}

.kaiin_hissu {
 font-size:0.6em;
font-weight:normal !important;
 background-color:#E48A8B;
 padding:0.1em 0.2em !important;
 margin-left:0.4em !important;
 color:#FBFBFB;
 position:relative;
 top:-3px;
}

.kaiin_rei{
font-size:0.8em;
font-weight:normal !important;
white-space: nowrap !important;
text-wrap:none !important;
word-break:break-all !important;
position: relative;
top: -0.1em;
}
.posi01{
position: relative;
top: -0.2em;
}
.kaiin_doui{
 font-size:14px;
 line-height:140%;
 margin:3em 0 1em 0em;
 padding:0.8em 2em;
 background-color:#E4E4E4;
}

.kaiin_chk01 {
 width:24px !important;
 margin:0.6em 0.1em 0.6em 0.6em !important;
 position:relative;
 top:0.4em;
border:solid 3px #666 !important;
}


/* Firefoxのみ */
@-moz-document url-prefix() {
input .kaiin_chk01{
 -webkit-appearance: none!important;
 appearance: none!important;
 border:solid 3px #666 !important;
}
.kaiin_chk01 {
 width:14px !important;
 margin:0.6em 0.9em 0.6em 0.6em !important;
 position:relative;
 top:0.4em;
border:solid 3px #666 !important;
}
}

input[type=checkbox] ,input ,input .kaiin_chk01{
border:solid 3px #666 !important;
}


.select01 {
width:44% !important;
padding:0.6em 0.12em!important;
font-size:1.1em !important;
font-weight:normal !important;
border:solid 3px #666 !important;
-webkit-border-radius: 3px !important;
-moz-border-radius: 3px !important;
border-radius: 3px !important;
color:#000 !important;
background-color: #fff;
}
.select02 {
width:60% !important;
padding:0.6em  0.2em !important;
font-size:1em !important;
height: 40px!important;
font-weight:normal !important;
border:solid 3px #666 !important;
-webkit-border-radius: 3px !important;
-moz-border-radius: 3px !important;
border-radius: 3px !important;
color:#000 !important;
margin-left:0.2em !important;
margin-top: 0.4em;
margin-bottom: 0.4em;
}



.kaiin_input {
 font-size:1.2em;
 font-weight:600;
 padding:0.6em 1em;
 margin:1em auto;
}


.kaiin_err01{
border:solid 3px #FB0004 !important;
background-color:#fff !important;
padding:1em !important;
margin:-0.4em 1em -1em 1em !important;
}



#matubi{
   font-size: 11px;
   color: #000;
   position:relative;
			top:-0.2em;
			left: 4em;
   padding: 6px 5px 12px 5px;
   background: url("/member/images/baloon02.png") no-repeat top left;
   z-index: 99;
   opacity: 0.9;  
			}
#matubi div {
   background: url("/member/images/baloon_right02.png") no-repeat top right;
   padding: 7px 7px 14px 0;
   white-space: nowrap;
			opacity: 0.9;  
}



.box-1column ul{
clear: both!important;
}
.box-2column ul{
clear: both!important;
}
.box-2column li{
float: left;
width: 40%;
}



.margin01{
margin-top: 0.4em;
}


.remember-me{
float: left;
overflow: auto!important;
display: block;
margin: 1em;
}
.remember-me input, .remember-me label{
width: inherit!important;
}

.btn-login{
text-align: center;
margin: 1em auto;
background-color: #005FD5;
color: #fff;
padding: 10px 20px;
text-decoration: none;
font-size: 1em;
border: 1px solid #ccc;
border-radius: 8px;
}

.back-link{
text-align:center;
font-size: 0.9em;
}

.post-box{
text-align: center;
margin: 0 auto;
}