@charset "UTF-8";
header {
    border-bottom: none
}

header p#hdr_si_logo {
    display: none
}

#cover {
    position: relative;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 0;

}

#cover p.logo {
    /*margin: 83px 0 0 0;*/
    font-size: 24px;
    padding: 24px;
    line-height: 1;
    text-align: center;
    color: #000
}

#cover p.logo:before { /* content:""; */
    font-size: 40px;
}

#tab {
    padding: 55px 0 0 0
}

#tab ul {
    display: table;
    width: 100%
}

#tab ul li {
    position: relative;
    display: table-cell;
    padding: 0 15px 0 15px;
    text-align: center;
    font-size: 18px
}

#tab ul li a {
    display: block;
    padding: 16px 0 16px 0;
    color: #b0b0b0
}

#tab ul li a.tap {
    opacity: 1;
    color: #ececec
}

#tab ul li.current a {
    font-weight: bold;
    color: #333
}

#tab ul li.current a :before {
    position: absolute;
    left: 50%;
    bottom: 0;
    margin: 0 0 0 -8px;
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8px 10px 8px;
    border-color: transparent transparent #eeeeee transparent
}

#main {
    position: relative;
    background: #eee
}

#main .section {
    width: 100%;
    padding: 20px 14px 30px 14px;
    background: #eee;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box
}

#main .section .wearid p.input input {
    width: 100%;
    border: 1px #fff solid;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 10px 10px 7px 10px;
    vertical-align: middle;
    font-size: 15px
}

#main .section .wearid p.input input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px white inset
}

#main .section .wearid p.input input:-webkit-autofill {
    color: #fff
}

#main .section .wearid p.input.password {
    position: relative;
    margin: 2px 0 0 0
}

#main .section .wearid p.input.password input {
    padding: 12px 80px 8px 10px
}

#main .section .wearid p.input.password span {
    position: absolute;
    right: 12px;
    top: 8px
}

#main .section .wearid p.input.password span a {
    display: block;
    padding: 4px 0 4px 0
}

#main .section .wearid p.input.error input {
    background: #ffdede;
    border-color: #ffb7b7
}

#main .section .wearid.tmp p.input input {
    color: #fff
}

#main .section .wearid .btn {
    display: none;
    margin: 15px 0 0 0
}

#main .section .wearid .btn input {
    display: block;
    width: 100%;
    padding: 12px 0 12px 0;
    background: #2490d0;
    color: #fff;
    text-align: center;
    border-radius: 4px;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    border: none
}

#main .section .wearid .btn.load {
    pointer-events: none;
    position: relative
}

#main .section .wearid .btn.load:before {
    content: '';
    font-size: 0;
    line-height: 1;
    letter-spacing: 0;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    border-radius: 3px;
    background: rgba(36, 144, 208, 0.8) url("//i7.wimg.jp/content/icon/pc/loading_gif_05.gif") no-repeat 50% 50%;
    background-size: 22px 22px
}

#main .section .other_service {
    position: relative;
    margin: 23px 0 0 0
}

#main .section .other_service .or_box {
    text-align: center
}

#main .section .other_service .or_box .line {
    position: relative;
    margin: 0 0 -12px 0;
    border-top: 1px #ddd solid
}

#main .section .other_service .or_box .txt {
    display: inline-block;
    position: relative;
    padding: 0 25px 0 25px;
    font-size: 13px;
    background: #eee;
    color: #777
}

#main .section .other_service ul {
    padding: 3px 0 0 0
}

#main .section .other_service ul li {
    position: relative;
    margin: 10px 0 0 0;
    text-align: center;
    font-size: 18px
}

#main .section .other_service ul li a {
    display: block;
    border-radius: 4px;
    color: #fff;
    padding: 18px 0 18px 20px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    tap-highlight-color: rgba(0, 0, 0, 0)
}

#main .section .other_service ul li a:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 50px;
    display: block;
    border-right: 1px #000 solid;
    border-right: 1px rgba(0, 0, 0, 0.1) solid;
    height: 54px;
    padding: 15px 0 0 0;
    font-size: 25px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box
}

#main .section .other_service ul li.twitter a {
    background: #00acec
}

#main .section .other_service ul li.facebook a {
    background: #3a5897
}

#main .section .other_service ul li.zozo a {
    background: #6d6d6d;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

#main .section .other_service ul li.zozo a:before {
    content: "";
    font-size: 20px;
    padding-top: 17px
}

#main .section .other_service ul li.weibo a {
    background: #eb4c34
}

@media screen and (min-width: 320px) and (max-width: 374px) {
    #cover p.logo {
        margin-top: 65px
    }

    #tab {
        padding-top: 35px
    }
}

#overlay {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 300;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85);
    overflow: hidden;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

#overlay .close {
    position: absolute;
    right: 20px;
    top: 20px;
    font-size: 0;
    line-height: 1;
    color: #fff;
    cursor: pointer
}

#overlay .close:before {
    content: "";
    font-size: 22px
}

#overlay .section {
    display: none;
    padding: 0 14px 40px 14px
}

#overlay .section p.tit {
    padding: 75px 0 0 0;
    color: #fff;
    text-align: center;
    font-size: 20px
}

#overlay .section .container {
    margin: 25px 0 0 0
}

#overlay .section #overlay .section p.input input {
    width: 100%;
    border: 1px #fff solid;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 10px 10px 7px 10px;
    vertical-align: middle;
    font-size: 15px
}

#overlay .section p.input.error input {
    background: #ffdede;
    border-color: #ffb7b7
}

#overlay .section p.input.password {
    margin: 2px 0 0 0
}

#overlay .section p.input.password input {
    padding: 12px 10px 8px 10px
}

#overlay .section p.input input {
    width: 100%;
    font-size: 15px;
    height: 45px;
    border: 0px solid #fff;
    border-radius: 0px;
    -webkit-box-shadow: none;
    box-shadow: none
}

#overlay .section p.forget {
    margin: 10px 0 0 0
}

#overlay .section p.forget a {
    text-decoration: underline
}

#overlay .section p.btn {
    margin: 22px 0 0 0
}

#overlay .section p.btn input {
    display: block;
    width: 100%;
    padding: 12px 0 12px 0;
    background: #2490d0;
    color: #fff;
    text-align: center;
    border: none;
    border-radius: 4px;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer
}

#overlay .section p.btn input.tap {
    opacity: 1;
    background: #66afff
}

#overlay .section p.btn.load {
    pointer-events: none;
    position: relative
}

#overlay .section p.btn.load:before {
    content: '';
    font-size: 0;
    line-height: 1;
    letter-spacing: 0;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    border-radius: 3px;
    background: rgba(36, 144, 208, 0.8) url("//i7.wimg.jp/content/icon/pc/loading_gif_05.gif") no-repeat 50% 50%;
    background-size: 22px 22px
}

.error_message {
    color: #ff3b30;
    font-size: 12px;
    line-height: 1.4
}

.error_message p {
    margin: 0 0 8px 0
}

.buruburu {
    pointer-events: none;
    -moz-animation: buruburu 0.33s linear 0s;
    -webkit-animation: buruburu 0.33s linear 0s;
    animation: buruburu 0.33s linear 0s
}

@-moz-keyframes buruburu {
    0% {
        -moz-transform: translateX(12px)
    }
    20% {
        -moz-transform: translateX(-12px)
    }
    40% {
        -moz-transform: translateX(12px)
    }
    60% {
        -moz-transform: translateX(-12px)
    }
    80% {
        -moz-transform: translateX(12px)
    }
    to {
        -moz-transform: translateX(0px)
    }
}

@-webkit-keyframes buruburu {
    0% {
        -webkit-transform: translateX(12px)
    }
    20% {
        -webkit-transform: translateX(-12px)
    }
    40% {
        -webkit-transform: translateX(12px)
    }
    60% {
        -webkit-transform: translateX(-12px)
    }
    80% {
        -webkit-transform: translateX(12px)
    }
    to {
        -webkit-transform: translateX(0px)
    }
}

@keyframes buruburu {
    0% {
        -webkit-transform: translateX(12px);
        transform: translateX(12px)
    }
    20% {
        -webkit-transform: translateX(-12px);
        transform: translateX(-12px)
    }
    40% {
        -webkit-transform: translateX(12px);
        transform: translateX(12px)
    }
    60% {
        -webkit-transform: translateX(-12px);
        transform: translateX(-12px)
    }
    80% {
        -webkit-transform: translateX(12px);
        transform: translateX(12px)
    }
    to {
        -webkit-transform: translateX(0px);
        transform: translateX(0px)
    }
}

.captcha {
    display: none;
    width: 100%;
    position: relative;
    margin: 15px 0 0 0
}

.captcha .captchaCnt {
    display: table-cell;
    width: 160px
}

.captcha .captchaCnt span.div_captcha img {
    width: 100%;
    height: 70px;
    background: #000;
    display: block;
    margin: 0;
    padding: 0
}

.captcha .captchaCnt a.changeCaptcha {
    display: block;
    font-size: 0;
    position: absolute;
    top: 50px;
    left: 141px
}

.captcha .captchaCnt a.changeCaptcha:before {
    content: '';
    background: url("//cdn.wimg.jp/content/icon/pc/reload.png") no-repeat;
    display: inline-block;
    width: 15px;
    height: 15px;
    background-size: contain;
    vertical-align: middle
}

.captcha ul.captchaFormCnt {
    float: left;
    padding: 0 0 0 10px;
    width: 100%
}

.captcha ul.captchaFormCnt li input {
    width: 100%;
    font-size: 15px;
    height: 45px;
    border: 0px solid #fff;
    border-radius: 0px;
    -webkit-box-shadow: none;
    box-shadow: none
}

.captcha ul.captchaFormCnt li:last-child {
    margin: 5px 0 0 0
}

.captcha ul.captchaFormCnt li.err input {
    background: #ffedf5;
    border: 1px solid #ffb0bd
}

.captcha ul.captchaFormCnt li.errTxt {
    color: #e73554;
    font-size: 12px
}

.captcha ul.captchaFormCnt .info {
    margin: 6px 0 1px 0;
    font-size: 10px;
    color: #777
}

.captcha.show {
    display: table
}

#zozo_login p.password, #zozo_regist p.password {
    position: relative
}

#zozo_login p.password span, #zozo_regist p.password span {
    position: absolute;
    right: 12px;
    top: 8px
}

#zozo_login p.password span a, #zozo_regist p.password span a {
    display: block;
    padding: 4px 0 4px 0
}

#zozo_login .captcha, #zozo_regist .captcha {
    display: table
}

#zozo_login .captcha span.div_captcha img, #zozo_regist .captcha span.div_captcha img {
    width: 100%;
    height: 70px;
    border: 1px solid #fff;
    background: #000;
    display: block;
    margin: 0;
    padding: 0
}

#zozo_login .captcha ul.captchaFormCnt .info, #zozo_regist .captcha ul.captchaFormCnt .info {
    margin: 6px 0 1px 0;
    font-size: 10px;
    color: #fff
}