/*!
Plugin Name: rishun_wp_members
Description: This plugin is to create a membership site.
Author: RishunTrading Limited.
Version: 1.0.0

License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

Rishun WordPress Plugin, Copyright (C) 2023 RishunTrading Limited.
Rishun WordPress Plugin is licensed under the GPL.
Update Author:RishunTrading Limited
Update Author URI:https://rishuntrading.co.jp/
Version:1.0.0
*/
@charset "utf-8";
/************************************************************/
:root{
    --rishun-mem-head:rgb(0, 157, 191,0.3);
    --rishun-mem-border:#009dbf;
    --input-outline:#aaa;
    --input-outline-focus:#fcb900;
    --submit-btn:linear-gradient(90deg, #f93 20%, #ff7166 80%);
    --rishun-mem-emphasis-color:#f04c06;
    --rishun-mem-border-color:#999;
    --rishun-mem-focus-color:#f93;
}
/*==========================================================*/
/* defalt define											*/
/*==========================================================*/
body, p{
    font-weight:500;
    font-size:17px;
}
body a{
    color:#333;
}
body a:hover{
    color:#333;
}
.nodata{
    color:#ff0000;
}
img{
    width:100%;
    height:auto;
}
figure{
    width:100%;
    padding-top:75%;
    margin:0;
    position:relative;
    overflow:hidden;
}
figure>img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center;
    position:absolute;
    top:0;
    left:0;
}
.rishun_mem_ok{
    display:flex;
    justify-content:center;
    padding:40px 0;
}
.rishun_mem_err{
    display:flex;
    justify-content:center;
    padding:40px 0;
    color:#ff0000;
}
.rishun_mem_underline{
    text-decoration:underline;
}
.rishun_return_top a{
    width:250px;
    height:50px;
    display:flex;
    justify-content:center;
    align-items:center;
    border:none;
    background:var(--submit-btn);
    color:#fff;
    font-weight:500;
    border-radius:10px;
    transition:all 0.3s;
    margin:0 auto;
}
.rishun_return_top a:hover{
    color:#fff;
    filter:brightness(1.2);
}
.field_require{
    color:#ff0000;
}
/*==========================================================*/
/* defalt define											*/
/*==========================================================*/
.form-wrap{
    width:100%;
}
.form-switch{
    width:100%;
}
.form-wrap>.form-switch{
    padding:0;  /* bootstrap 重複 */
}
/* switch process */
.form-user.form-hide{
    display:none;
}
.form-school.form-hide{
    display:none;
}
.dl-registerform{
    width:100%;
    display:flex;
    flex-flow:row wrap;
    margin:0;
    border:solid 1px var(--rishun-mem-border);
    margin-bottom:20px;
}
.dl-registerform>dt{
    width:100%;
    min-height:50px;
    display:flex;
    align-items:center;
    margin:0;
    line-height:1;
    font-size:16px;
    border-bottom:solid 1px var(--rishun-mem-border);
    background:var(--rishun-mem-head);
    padding:0 10px;
    font-weight:500;
}
.dl-registerform>dd{
    width:100%;
    min-height:50px;
    display:flex;
    align-items:center;
    margin:0;
    line-height:1;
    font-size:16px;
    padding:0 10px;
    flex-flow:row wrap;
}
.dl-registerform>dd.cl-switch-show{
    flex-flow:row nowrap;
}
.dl-registerform>dd.cl-switch-show input[type='password']{
    width:calc(100% - 30px);
}
.cl-switch-btn{
    border:none;
    background:transparent;
    width:30px;
    height:30px;
    display:flex;
    justify-content: center;
    align-items: center;
    font-size:24px;
    color:#aaa;
    transition:all 0.5s;
}
.cl-switch-btn:hover{
    filter:brightness(1.1);
}
.cl-switch-btn:focus{
    border:none;
}
.cl-switch-btn i.noactive{
    display:none;
}
.cl-switch-show input[type="password"]::-ms-reveal, .cl-switch-show input[type="password"]::-ms-clear {
    display: none;
}
.cl-pswd-note{
    margin-left:10px;
}
.dl-registerform label{
    margin:0 10px 0 0;
}
.dl-registerform label:last-of-type{
    margin:0;
}
.dl-registerform>dt>div{
    padding:5px 0;
}
.dl-registerform>dt>div small{
    display:block;
    font-weight:400;
    line-height:1.4;
    font-size:12px;
}
.dl-registerform input[type='text']{
    width:100%;
    padding:3px 10px;
    border:none;
    outline:1px solid var(--input-outline);
}
.dl-registerform input[type='text']:focus{
    outline:1px solid var(--input-outline-focus);
}
.dl-registerform input[type='password']{
    width:100%;
    padding:3px 10px;
    border:none;
    outline:1px solid var(--input-outline);
}
.dl-registerform input[type='password']:focus{
    outline:1px solid var(--input-outline-focus);
}
.dl-registerform input[type='email']{
    width:100%;
    padding:3px 10px;
    border:none;
    outline:1px solid var(--input-outline);
}
.dl-registerform input[type='email']:focus{
    outline:1px solid var(--input-outline-focus);
}
.dl-registerform input[type='tel']{
    width:200px;
    padding:3px 10px;
    border:none;
    outline:1px solid var(--input-outline);
}
.dl-registerform input[type='tel']:focus{
    outline:1px solid var(--input-outline-focus);
}
.dl-registerform textarea{
    width:100%;
    padding:3px 10px;
    border:none;
    outline:1px solid var(--input-outline);
}
.dl-registerform textarea:focus{
    outline:1px solid var(--input-outline-focus);
}
.dl-registerform label[for='last_name']{
    display:flex;
    margin:0;
    align-items:center;
    justify-content:flex-end;
    width:50%;
    padding:0 5px;
}
.dl-registerform label[for='first_name']{
    display:flex;
    margin:0;
    align-items:center;
    justify-content:flex-end;
    width:50%;
    padding:0 5px;
}
.dl-registerform label[for='last_name'] span{
    display:inline-block;
    width:40px;
    text-align:right;
    margin-right:5px;
}
.dl-registerform label[for='last_name'] .cl-last_name{
    display:inline-block;
    width:calc(100% - 30px);
    padding:3px 10px;
}
.dl-registerform label[for='first_name'] span{
    display:inline-block;
    width:40px;
    text-align:right;
    margin-right:5px;
}
.dl-registerform label[for='first_name'] .cl-first_name{
    display:inline-block;
    width:calc(100% - 30px);
    padding:3px 10px;
}
/* kana start */
.dl-registerform label[for='last_name_kana']{
    display:flex;
    width:50%;
    margin:0;
    justify-content:flex-end;
    align-items:center;
    padding:0 5px;
}
.dl-registerform label[for='first_name_kana']{
    display:flex;
    width:50%;
    margin:0;
    justify-content:flex-end;
    align-items:center;
    padding:0 5px;
}
.dl-registerform label[for='last_name_kana'] span{
    display:inline-block;
    width:40px;
    text-align:right;
    margin-right:5px;
    white-space:nowrap;
    letter-spacing:-1px;
}
.dl-registerform label[for='last_name_kana'] .cl-last_name{
    display:inline-block;
    width:calc(100% - 40px);
    padding:3px 10px;
}
.dl-registerform label[for='first_name_kana'] span{
    display:inline-block;
    width:40px;
    text-align:right;
    margin-right:5px;
    white-space:nowrap;
    letter-spacing:-1px;
}
.dl-registerform label[for='first_name_kana'] .cl-first_name{
    display:inline-block;
    width:calc(100% - 40px);
    padding:3px 10px;
}
/* kana end */
.dl-registerform label[for='user_birthday_year'] span{
    margin-left:5px;
}
.dl-registerform label[for='user_birthday_month'] span{
    margin-left:5px;
}
.dl-registerform label[for='user_birthday_day'] span{
    margin-left:5px;
}
.cl-user_birthday_year{
    padding:3px 10px;
    border:none;
    outline:1px solid var(--input-outline);
}
.cl-user_birthday_year:focus{
    outline:1px solid var(--input-outline-focus);
}
.cl-user_birthday_month{
    padding:3px 10px;
    border:none;
    outline:1px solid var(--input-outline);
}
.cl-user_birthday_month:focus{
    outline:1px solid var(--input-outline-focus);
}
.cl-user_birthday_day{
    padding:3px 10px;
    border:none;
    outline:1px solid var(--input-outline);
}
.cl-user_birthday_day:focus{
    outline:1px solid var(--input-outline-focus);
}
label[for='privacypolicy']{
    width:100%;
    display:flex;
    justify-content:center;
    margin-bottom:40px;
}
label[for='privacypolicy']>span{
    position:relative;
    padding-left:30px;
}
label[for='privacypolicy'] input{
    position:absolute;
    top:50%;
    left:5px;
    transform:translateY(-50%);
}
/* rishun-mem-btn */
.rishun-mem-btn{
    width:100%;
    display:flex;
    flex-flow:row wrap;
    padding:40px 0;
}
.return-btn{
    width:100%;
    display:flex;
    justify-content:center;
    margin-bottom:20px;
}
.return-btn>a{
    width:250px;
    height:50px;
    display:flex;
    justify-content:center;
    align-items:center;
    border:none;
    background:#999;
    color:#fff;
    font-weight:500;
    border-radius:10px;
    transition:all 0.3s;
}
.return-btn>a:hover{
    color:#fff;
    text-decoration:none;
    filter:brightness(1.2);
}
.submit-btn{
    width:100%;
    display:flex;
    justify-content:center;
}
.submit-btn input[type='submit']{
    width:250px;
    height:50px;
    display:flex;
    justify-content:center;
    align-items:center;
    border:none;
    background:var(--submit-btn);
    color:#fff;
    font-weight:500;
    border-radius:10px;
    transition:all 0.3s;
}
.submit-btn input[type='submit']:hover{
    filter:brightness(1.2);
}
.cl-add-box{
    width:100%;
    padding:10px 0;
}
.dl-registerform .cl-address label{
    width:100%;
    margin-bottom:10px;
}
.dl-registerform .cl-address label span{
    display:block;
    width:100%;
    margin-bottom:4px;
}
.dl-registerform .cl-address label .cl-user_zip{
    width:100px;
}
/* step */
.form-step{
    width:100%;
}
.ul-formstep{
    margin:0;
    padding:0;
    list-style:none;
    width:100%;
    display:flex;
    flex-flow:row nowrap;
    margin-bottom:40px;
}
.ul-formstep>li{
    display:inline-block;
    width:33.333%;
}
.ul-formstep>li>div{
    width:100%;
    height:60px;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:14px;
    background:#eee;
    position:relative;
}
.ul-formstep>li>div:after{
    content: "\f0da";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-size: 24px;
    color: #b1b1b2;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    position: absolute;
    top: 50%;
    right: -13px;
    transform: translateY(-50%);
}
.ul-formstep>li>div>span{
    text-align:center;
}
.ul-formstep>li:first-of-type{
    padding-right:10px;
}
.ul-formstep>li:nth-of-type(2){
    padding:0 5px;
}
.ul-formstep>li:last-of-type{
    padding-left:10px;
}
.ul-formstep>li:last-of-type div:after{
    content:none;
}
.ul-formstep.cls_step_ li:first-of-type div{
    background:var(--input-outline-focus);
}
.ul-formstep.cls_step_form_return li:first-of-type div{
    background:var(--input-outline-focus);
}
.ul-formstep.cls_step_form_check li:nth-of-type(2) div{
    background:var(--input-outline-focus);
}
.ul-formstep.cls_step_form_run li:last-of-type div{
    background:var(--input-outline-focus);
}
.ul-formstep.cls_step_form_error li:first-of-type div{
    background:var(--input-outline-focus);
}
.form_check input[type='text']{
    background:rgba(240,240,240);
    border:none;
    outline:none;
}
.form_check input[type='tel']{
    background:rgba(240,240,240);
    border:none;
    outline:none;
}
.form_check input[type='email']{
    background:rgba(240,240,240);
    border:none;
    outline:none;
}
.form_check input[type='password']{
    background:rgba(240,240,240);
    border:none;
    outline:none;
}
.form_check input[type='text']:focus{
    background:rgba(240,240,240);
    border:none;
    outline:none;
    box-shadow:none;
}
.form_check input[type='tel']:focus{
    background:rgba(240,240,240);
    border:none;
    outline:none;
    box-shadow:none;
}
.form_check input[type='email']:focus{
    background:rgba(240,240,240);
    border:none;
    outline:none;
    box-shadow:none;
}
.form_check input[type='password']:focus{
    background:rgba(240,240,240);
    border:none;
    outline:none;
    box-shadow:none;
}
div.form-error{
    width:100%;
    color:#ff0000;
    margin-bottom:20px;
}
.yyyymmdd-box{
    display:flex;
    flex-flow:row nowrap;    
}
.yyyymmdd-box>label{
    display:flex;
    flex-flow:row nowrap;
    align-items:center;
}
@media(min-width:768px){
    .dl-registerform{
        border:solid 1px var(--rishun-mem-border);
        margin-bottom:0;
        border-bottom:0;
    }
    .form-body .dl-registerform:last-of-type{
        border-bottom:solid 1px var(--rishun-mem-border);
        margin-bottom:40px;
    }
    .dl-registerform>dt{
        width:32%;
        border-bottom:none;
        border-right:solid 1px var(--rishun-mem-border);
        background:var(--rishun-mem-head);
    }
    .dl-registerform>dd{
        width:68%;
    }
    .rishun-mem-btn .return-btn{
        width:50%;
        margin-bottom:0;
    }
    .rishun-mem-btn .submit-btn{
        width:50%;
    }
}
/*==========================================================*/
/* login menu   											*/
/*==========================================================*/
.rishun-mem_login-menu{
    font-weight:700;
    cursor: pointer;
    line-height:1.2;
    transition:all 0.3s;
}
.rishun-mem_login-menu:hover{
    opacity:0.6;
}
.menu_name{
    display:inline-block;
    padding:5px 10px;
}
/*==========================================================*/
/* login menu   											*/
/*==========================================================*/
.rishun-mem_mypage-menu{
    font-weight:700;
    cursor: pointer;
    line-height:1.2;
    transition:all 0.3s;
}
.rishun-mem_mypage-menu:hover{
    opacity:0.6;
}
/*==========================================================*/
/* login form   											*/
/*==========================================================*/
.modal-login{
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    min-height:100vh;
    background:rgba(0,0,0,0.8);
    z-index:99999;
}
.modal-login-box{
	position: absolute;
    width: 90%;
    max-width: 500px;
    margin: 0 auto;
    min-height: 300px;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border-radius:20px;
}
.modal-login-wrap{
    border:4px solid var(--rishun-mem-border);
    overflow:hidden;
    border-radius:20px;
    background: #fff;
}
.modal-login-wrap>h2{
    width:100%;
    height:40px;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:20px;
    background:var(--rishun-mem-border);
    color:#fff;
    margin:0;
    padding:0;
}
/* login error */
#login-msg{
    display:flex;
    justify-content:center;
}
.login-modal-msg{
    text-align:left;
    margin:15px;
    padding:10px;
    color:var(--rishun-mem-emphasis-color);
    font-weight:700;
    border-radius:5px;
    border:solid 1px var(--rishun-mem-border-color);
}
.login-close-btn{
    display:flex;
    width: 90%;
    position:absolute;
    margin:0 auto;
    top:-40px;
    right:0;
}
.login-close-btn>a{
    display:flex;
    height:40px;
    align-items:center;
    margin:0 0 0 auto;
    font-size:16px;
    color:#aaa;
    text-align:right;
    text-decoration:none;
    position:relative;
}
.login-close-btn>a:before{
    content:'';
    width:0;
    height:1px;
    background:#aaa;
    position:absolute;
    bottom:10px;
    left:0;
    transition:all 0.3s;
}
.login-close-btn>a>span:last-of-type{
    font-size:18px;
    font-weight:900;
    margin-left:4px;
}
.login-close-btn>a:hover{
    color:#aaa;
	text-decoration:none;
	filter:brightness(1.2);
    opacity:1;
}
.login-close-btn>a:hover:before{
    width:100%;
}
/* login form */
.modal-login-wrap form{
    padding:20px;
}
.form-item{
    width:100%;
    display:block;
    margin-bottom:10px;
}
.form-item>label{
    display:block;
    width:100%;
}
.form-item>input[type='text']{
    width: 100%;
    border: none;
    outline: solid 1px var(--rishun-mem-border-color);
    padding: 5px 10px;
}
.form-item>input[type='password'] {
    width: 100%;
    border: none;
    outline: solid 1px var(--rishun-mem-border-color);
    padding: 5px 10px;
}
.form-item>input:focus{
    outline: solid 1px var(--rishun-mem-focus-color);
}
.modal-login-wrap form input[type='submit']{
    margin:20px 0 0 auto;
    background:var(--submit-btn);
    color:#fff;
    border:none;
    width:200px;
    height:40px;
    display:flex;
    justify-content: center;
    align-items:center;
    font-weight:700;
    border-radius:5px;
    text-shadow:3px 3px 3px rgba(0,0,0,0.2);
    box-shadow:3px 3px 3px rgba(0,0,0,0.2);
    transition:all 0.3s;
}
.modal-login-wrap form input[type='submit']:hover{
    text-decoration:none;
    transform:translate3d(2px,2px,2px);
    box-shadow:none;
}
/*==========================================================*/
/* verifyemail   											*/
/*==========================================================*/
.cl_verifyemail{
    margin:10px auto 0 auto;
    width:150px;
    height:40px;
    border:none;
    display:flex;
    justify-content:center;
    align-items:center;
    transition:all 0.3s;
    color:#333;
}
.cl_verifyemail:hover{
    filter:brightness(0.8);
}
/*==========================================================*/
/* mypage          											*/
/*==========================================================*/
.mypage-err{
    color:#ff0000;
    font-size:14px;
}
.div-mypage{
    width:100%;
    margin-bottom:60px;
}
.dl-mypageform{
    display:block;
    width:100%;
}
.dl-mypageform>dt{
    display:block;
    width:100%;
}
.dl-mypageform>dd{
    display:block;
    width:100%;
}
.dl-mypageform input[type='text']{
    width:100%;
    padding:5px 10px;
    outline:solid 1px rgb(118, 118, 118);
    border:none;
    border-radius:2px;
}
.dl-mypageform input[type='password']{
    width:100%;
    padding:5px 10px;
    outline:solid 1px rgb(118, 118, 118);
    border:none;
    border-radius:2px;
}
.dl-mypageform input[type='email']{
    width:100%;
    padding:5px 10px;
    outline:solid 1px rgb(118, 118, 118);
    border:none;
    border-radius:2px;
}
.dl-mypageform input[type='text']:focus{
    outline:solid 1px var(--input-outline-focus);
}
.dl-mypageform input[type='email']:focus{
    outline:solid 1px var(--input-outline-focus);
}
.dl-mypageform input[type='password']:focus{
    outline:solid 1px var(--input-outline-focus);
}
.div-mypage input[type='submit']{
    max-width:250px;
    height:45px;
    display:flex;
    justify-content:center;
    align-items:center;
    background:var(--submit-btn);
    color:#fff;
    border-radius:23px;
    border:none;
    margin:0 auto;
    box-shadow:0 0 5px rgba(0,0,0,0.1);
    font-size:14px;
    transition:all 0.3s;
}
.div-mypage input[type='submit']:hover{
    filter:brightness(1.2);
}
.dl-mypageform>dd label{
    width:100%;
}
.radio-label{
    display:flex;
    flex-flow:row nowrap;
    align-items:center;
}
.radio-label input[type='radio']{
    width:16px;
    height:16px;
    margin-right:5px;
}
.dl-mypageform>dd .yyyymmdd-box label select{
    width:90px;
    padding:5px 10px;
    border-color: rgb(118, 118, 118);
    border-width:2px;
}
.dl-mypageform>dd .yyyymmdd-box label:first-of-type{
    width:auto;
}
.dl-mypageform>dd .yyyymmdd-box label:nth-of-type(2){
    width:auto;
}
.dl-mypageform>dd .yyyymmdd-box label:nth-of-type(3){
    width:auto;
}
.dl-mypageform>dd .yyyymmdd-box label:first-of-type select{
    width:90px;
}
.dl-mypageform>dd .yyyymmdd-box label:nth-of-type(2) select{
    width:70px;
}
.dl-mypageform>dd .yyyymmdd-box label:nth-of-type(3) select{
    width:70px;
}
.dl-mypageform>dd .yyyymmdd-box label:first-of-type span{
    margin:0 10px 0 5px;
}
.dl-mypageform>dd .yyyymmdd-box label:nth-of-type(2) span{
    margin:0 10px 0 5px;
}
.dl-mypageform>dd .yyyymmdd-box label:nth-of-type(3) span{
    margin:0 10px 0 5px;
}
@media(min-width:768px){
    #fm_userinfo{
        padding:10px;
        display:flex;
        flex-flow:row nowrap;
        align-items:center;
        background:rgba(245,245,245);
        border-radius:5px;
    }
    .div-mypage input[type='submit']{
        width:180px;
        margin-left:20px;
    }
    #fm_emailinfo{
        padding:10px;
        display:flex;
        flex-flow:row nowrap;
        align-items:center;
        background:rgba(245,245,245);
        border-radius:5px;
    }
    #fm_profileinfo{
        padding:10px;
        display:flex;
        flex-flow:row nowrap;
        align-items:center;
        background:rgba(245,245,245);
        border-radius:5px;
    }
    #fm_profileinfo>div:first-of-type{
        width:calc(100% - 200px);
    }
    #fm_profileinfo>div:last-of-type{
        width:200px;
    }
}
@media(min-width:992px){
    #fm_userinfo{
        padding:20px;
    }
    #fm_emailinfo{
        padding:20px;
    }
    #fm_profileinfo{
        padding:20px;
    }
    .dl-mypageform{
        display:flex;
        width:100%;
        flex-flow:row wrap;
    }
    .dl-mypageform>dt{
        width:40%;
    }
    .dl-mypageform>dd{
        width:60%;
    }
}