.needpopup-opened,.needpopup-opened body{position:fixed; width:100vw;  }
/* .needpopup-opened.needpopup-scrolled,.needpopup-opened.needpopup-scrolled body{background-color:red; height:auto }

.needpopup-opened.needpopup-scrolled body{position:fixed; width:100%}
 */
.needpopup_wrapper{position:fixed;z-index:999999999999999999999; top:0;left:0;visibility:hidden;overflow:auto;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;padding:40px 0;-webkit-transition:opacity .3s ease;transition:opacity .3s ease;opacity:0;background:#000;background:rgba(0,0,0,.8)}.needpopup-opened .needpopup_wrapper{visibility:visible;opacity:1}.needpopup-overflow .needpopup_wrapper{padding:10px}

.needpopup{position:relative;z-index:9999;top:50%;left:50%;display:none;-webkit-box-sizing:border-box;box-sizing:border-box;width:544px;max-width:100%;margin-left:-272px;padding:30px;-webkit-transform:scale(.1,.1);-ms-transform:scale(.1,.1);transform:scale(.1,.1);opacity:0;background:#fff; border-radius:20px}

.needpopup.opened{-webkit-transition:opacity .5s ease,-webkit-transform .5s ease;transition:opacity .5s ease,transform .5s ease;-webkit-transform:scale(1,1);-ms-transform:scale(1,1);transform:scale(1,1);opacity:1}.needpopup.stacked{top:0!important;margin-top:0!important}.needpopup-overflow .needpopup{left:0;width:auto;margin-left:0}.needpopup_remover{position:fixed;z-index:9999;top:30px;right:30px;font-size:40px;line-height:.5;color:#fff;text-decoration:none}.needpopup_remover:hover{color:#ccc}.needpopup_remover:before{content:'×'}

.needpopup .needpopup_remover{top:20px;right:20px;position:absolute; font-size:30px; font-weight:800; color:#111;  }
.needpopup .needpopup_remover:hover{color:#ccc}

.needpopup.join_pop {text-align:center; padding:40px}
.needpopup.join_pop a.btn {border:1px solid #333; border-radius:50%; width:200px; line-height:45px; display:inline-block; margin-top:10px }
.needpopup.join_pop  h3 {font-size:1.6em; font-weight:400; font-family: 'Sawarabi Mincho', serif;}
.needpopup.join_pop p {font-size:1.1em}
.needpopup.join_pop  svg {fill:var(--main_c)}
.needpopup.join_pop p.bg_text {background-color:#f1f1f1; width:auto; display:inline-block;  border-radius:50px; padding:10px 50px}

.needpopup.login_pop {text-align:center; padding:0;  height:432px;}
.needpopup.login_pop  .login_pop_in  {width:100%; height:100%;  display:flex; align-items:center; justify-content:Center;  padding:0 40px; box-sizing:border-box}

.needpopup.login_pop  h3 {font-size:1.6em; font-weight:400; font-family: 'Sawarabi Mincho', serif;}
.needpopup.login_pop input {border:1px solid #333; border-radius:50px; width:100%; max-width:360px; height:60px; padding-left:20px; box-sizing:border-box;  display:inline-block; margin-top:10px; font-size:1em }
.needpopup.login_pop input::placeholder {font-size:1em}
.needpopup.login_pop a.btn {background-color:var(--main_c); border-radius:50px; width:200px; line-height:45px; display:inline-block; margin-top:15px; color:#fff}
.needpopup.login_pop div.join_link {border-top:1px solid #ddd; border-bottom:1px solid #ddd; padding:10px 0; margin-top:20px; }
.needpopup.login_pop div.join_link a:nth-child(2) {margin-left:8%}
.needpopup.login_pop .w_box  {width:100%}
.needpopup.login_pop  textarea {width:100%; height:150px; box-sizing:border-box; padding:10px; font-size:1em}

@media all and (max-width:900px) {
		.needpopup.login_pop { height:400px;}
		.needpopup.login_pop input { height:45px;   }


}