/* 登入弹层使用 feed-detail-modal 样式，复用遮罩 */
#loginModal {
    z-index: 9998;
}

#loginModal .feed-detail-overlay {
    z-index: 9999;
}


/* 登入弹层 */
.index_login_diag {
    /* 默认桌面样式：使用固定宽高，确保内容完整显示 */
    width:90%;
    max-width: 468px;
    height: 680px;
    padding: 24px;
    box-sizing: border-box;
    position: fixed;
    z-index: 10000;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;       
    background: #fff url(../images/index_login_bg.jpg) top center no-repeat;
    background-size: 55%;
    border-radius: 8px;
    box-shadow: 0px 0px 10px 0px #333;
    overflow-y: auto;
    overflow-x: hidden;
    display: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.post_close {
    display: block;
    width: 30px;
    height: 30px;
    position: absolute;
    z-index: 10001;
    margin: auto;
    right: 1.5vw;
    top: 0.8vw;
    font-size: 24px;
    color: #333;
    cursor: pointer;
    text-align: center;
    line-height: 30px;
}

.post_close:hover {
    color: #7b378b;
}

/* step1 初始界面 */
.index_login_main {
    width: 100%;
    height: 100%;
    margin: auto;
    display: none;
}

.index_login_user {
    width: 100%;
    text-align: center;
    box-sizing: border-box;
    margin-top: 30%;
}

.index_login_user img {
    width: 88px;
}

.index_login_main .title_bigger {
    width: 100%;
    height: autto;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    overflow: hidden;
    margin: 30px 0;
}

.title_bigger .wenben {
    font-size: 24px;
    line-height: 3.5vw;
}

.title_bigger #logo {
    margin: auto 24px;
}

.title_bigger #logo img {
    width: 56px;
}

.index_login_bottom {
    width: 100%;
    height: 6vw;
}

.index_login_row {
    width: 100%;
    height: auto;
    display: inline-block;
    text-align: center;
    margin-bottom: 16px;
}

.index_login_submit {
    min-width: 248px;
    height: 45px;
    border-radius: 50px;
    border: 0;
    background-color: #7b378b;
    color: #fff;
    font-size: 18px;
    text-align: center;
    cursor: pointer;
    transition: background-color 0.2s ease;
    white-space: nowrap;
    padding: 0 1.5vw;
    box-sizing: border-box;
}

.index_login_submit:hover {
    background-color: #6a2d7a;
}

.index_login_goto {
    min-width: 248px;
    height: 45px;
    border-radius: 50px;
    border: 1px solid #7b378b;
    color: #7b378b;
    font-size: 18px;
    text-align: center;
    cursor: pointer;
    background: transparent;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.index_login_goto:hover {
    background-color: #7b378b;
    color: #fff;
}

/* step2-step5 和 step7 通用样式 */
.index_login_step2,
.index_login_step3,
.index_login_step4,
.index_login_step5,
.index_login_step7 {
    /* 固定最小尺寸，确保内容完整显示 */
    width: 420px;

    max-width: calc(100% - 48px);
    /* 留出左右各24px间距 */
    height: auto;
    max-height: calc(90vh - 48px);
    /* 留出上下各24px间距 */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
    background-color: rgba(255, 255, 255, 0.7);
    border-radius: 8px;
    display: none;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 24px;
    box-sizing: border-box;
    /* box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2); */
    -webkit-overflow-scrolling: touch;
    /* iOS平滑滚动 */
}

.index_login_step4 {
    max-height: calc(90vh - 40px);
    /* 稍高一点，因为内容更多 */
}

.index_login_step5 {
    max-height: calc(90vh - 32px);
    /* 更高，因为内容最多 */
}

.index_login_step7 {
    min-height: auto;
    /* 手机验证步骤内容较少 */
    max-height: calc(90vh - 48px);
}

.index_step2_logo {
    width: 100%;
    margin: 0 auto;
    text-align: center;
    padding-top: 1vw;
    box-sizing: border-box;
}

.index_step2_logo img {
    width: 68px;
}

.index_login_big_title {
    width: 100%;
    height: auto;
    overflow: hidden;
    font-size: 20px;
    text-align: center;
    margin-bottom: 1vw;
}

.index_login_small_title {
    display: block;
    width: 100%;
    font-size: 13px;
    text-align: center;
    padding: 12px 0;
    color: #7b378b;
    font-weight: 600;
    margin-bottom: 20px;
}

.index_input_row {
    width: 100%;
    height: 80px;
    margin-top: 16px;
    position: relative;
    padding-top: 0.5vw;
    box-sizing: border-box;
}

.index_input_row.h-captcha {
    width: 100%!important;
    margin: 20px 0!important;
}

.index_input_row .small_title {
    position: absolute;
    left: 6px;
    top: -4px;
    display: block;
    background-color: #fff;
    z-index: 10;
    color: #7b378b;
    font-size: 12px;
    transition: all 0.2s ease;
    padding: 0 6px;
}

.small_title.active {
    color: #7b378b;
    font-weight: 700;
}

.small_title.red {
    color: #d81e06;
}

.index_input_row input {
    width: 100%;
    height: 42px;
    border-radius: 4px;
    border: 2px solid #999;
    padding: 0 0.6vw;
    box-sizing: border-box;
    line-height: 42px;
    color: #666;
    transition: all 0.2s ease;
    font-size: 14px;
}

.index_input_row input.active {
    border: 2px solid #7b378b;
    color: #7b378b;
}

.index_input_row input.red {
    border: 2px solid #d81e06;
    color: #d81e06;
}

/* 登入/注册 input 的 autofill 背景覆盖为白色，去除浏览器蓝色 */
.index_input_row input:-webkit-autofill,
.index_input_row input:-webkit-autofill:hover,
.index_input_row input:-webkit-autofill:focus,
.index_input_row input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
    box-shadow: 0 0 0 1000px #fff inset !important;
    transition: background-color 5000s ease-in-out 0s !important;
    -webkit-text-fill-color: inherit !important;
}

.forgot_pass {
    width: 100%;
    height: 1.8vw;
    font-size: 14px;
    font-weight: 700;
    color: #f00;
    cursor: pointer;
    padding-left: 0.3vw;
    margin-top: 0.5vw;
    transition: color 0.2s ease;
}

.forgot_pass:hover {
    color: #6a2d7a;
}

#index_register_1,
.index_register {
    display: block;
    float: left;
    font-size: 16px;
    line-height: 1.85vw;
    font-weight: 700;
    cursor: pointer;
    padding-left: 0.3vw;
    color: #7b378b;
    transition: color 0.2s ease;
}

#index_register_1:hover,
.index_register:hover {
    color: #6a2d7a;
}

.index_login_button {
    padding:  0 13px;
    height: 38px;
    border-radius: 4px;
    background-color: #7b378b;
    line-height: 38px;
    text-align: center;
    color: #fff;
    font-size: 16px;
    border: 0;
    float: right;
    cursor: pointer;
    margin-left: 0.5vw;
    transition: background-color 0.2s ease;
    font-weight: 600;
}

.index_login_button:hover {
    background-color: #6a2d7a;
}

/* 6位验证码输入框容器 */
.verify-code-inputs {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 4px;
}

/* 验证码输入框的错误提示 */
.step7-verify-code .index_input_row .erro_info {
    position: relative !important;
    margin-top: 8px;
    display: none;
    width: 100%;
    text-align: left;
    padding-left: 0;
    background: none;
    height: auto;
    line-height: 1.5;
    font-size: 12px;
    color: #d81e06;
    height: 20px;
    padding-top: 8px;
}

/* 单个验证码输入框 */
.verify-code-input {
    flex: 1;
    width: 100%;
    height: 54px!important;
    border-radius: 4px;
    border: 2px solid #999;
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    color: #333;
    background-color: #fff;
    box-sizing: border-box;
    transition: all 0.2s ease;
    outline: none;
}

.verify-code-input:focus {
    border-color: #7b378b;
    box-shadow: 0 0 0 2px rgba(123, 55, 139, 0.2);
}

.verify-code-input.active {
    border-color: #7b378b;
}

.verify-code-input.red {
    border-color: #e74c3c;
}
.eye-off-icon{
    color: #999;
}
.eye-icon{
    color: #7b378b;
}
/* 移动端适配 */
@media screen and (max-width: 768px) {
    .index_login_diag{
        height: 60vh;
        min-height: 535px;
    }
    .verify-code-inputs {
        gap: 6px;
    }
    
    .verify-code-input {
        height: 40px;
        font-size: 18px;
    }
}

@media screen and (max-width: 375px) {
    .verify-code-inputs {
        gap: 4px;
    }
    
    .verify-code-input {
        height: 38px;
        font-size: 16px;
    }
}

/*
 * 眼睛按鈕：完全由父容器 .index_input_row 透過 Grid 控制水平靠右、垂直居中
 * 不再使用 position: absolute / top / right / margin auto 等定位屬性
 * 此元素本身只負責容納 SVG 的內部居中以及尺寸
 */
.show_password {
    width: 24px;
    height: 24px;
    min-width: 20px;
    min-height: 20px;
    flex-shrink: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.show_password svg {
    width: 100%;
    height: 100%;
    max-width: 24px;
    max-height: 24px;
}

/* 默認狀態：顯示 eye-off-icon，隱藏 eye-icon */
.show_password .eye-off-icon {
    display: block;
}

.show_password .eye-icon {
    display: none;
}

/* 點擊後（顯示密碼）：隱藏 eye-off-icon，顯示 eye-icon */
.show_password.on .eye-off-icon {
    display: none;
}

.show_password.on .eye-icon {
    display: block;
}

/*
 * 由父容器 .index_input_row 透過 CSS Grid 控制 .show_password 的對齊：
 * - input 和眼睛按鈕占同一 grid cell（"field"），按鈕用 justify-self:end + align-self:center
 *   實現「水平靠右 + 垂直居中」，所有媒體查詢斷點下行為一致；
 * - .small_title 本就是 absolute 浮動 label，不參與 grid 流，無需特殊處理；
 * - .erro_info 占獨立的 "error" 行，顯示時自然出現在 input 下方；
 * - 用 :has() 僅作用於含眼睛按鈕的 row，不影響其他普通輸入框。
 * 瀏覽器要求：支援 :has()（Chrome 105+ / Safari 15.4+ / Firefox 121+）。
 */
.index_input_row:has(.show_password) {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-areas:
        "field"
        "error";
    /*
     * align-content: start 讓 grid tracks 從 row 頂部開始，不被 stretch 撐高；
     * 這樣 input 在 grid row 中的垂直位置就跟普通 block 流一致（緊貼 row 的 padding-top），
     * 與其他沒有眼睛按鈕的 .index_input_row（block 流）的 input 位置嚴格對齊，
     * 也避免 .small_title（absolute）視覺上跟 input 的相對距離出現差異。
     */
    align-content: start;
    align-items: center;
}

.index_input_row:has(.show_password) > input.index_input,
.index_input_row:has(.show_password) > .show_password {
    grid-area: field;
}

.index_input_row:has(.show_password) > .erro_info {
    grid-area: error;
    /* 不被 grid 預設的 stretch 拉滿整行，避免 background-size:13% 把錯誤圖標放大；
       靠右對齊，與沒有眼睛按鈕的 row 中 float:right 視覺一致 */
    justify-self: end;
}

.index_input_row:has(.show_password) > input.index_input {
    width: 100%;
    padding-right: 40px; /* 為按鈕預留水平空間，避免文字疊到按鈕上 */
}

.index_input_row:has(.show_password) > .show_password {
    justify-self: end;   /* 水平靠右 */
    align-self: center;  /* 垂直居中（相對 input 所在 cell） */
    margin-right: 12px;  /* 距 input 右內邊 12px */
}

/* hCaptcha 容器样式 */
.h-captcha-container {
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: transparent;
    border-radius: 0;
    box-sizing: border-box;
    position: relative;
}

.h-captcha {
    display: flex;
    justify-content: flex-start;
    border-radius: 4px;
    overflow: hidden;
    min-height: 78px;
    width: 100%;
}

.h-captcha iframe {
    width: 100% !important;
    max-width: 100%;
    border-radius: 0 !important;
    background: #fff !important;
}

/* 控制 hCaptcha 渲染后的 iframe 尺寸 */
.h-captcha.hcaptcha-rendered iframe,
.h-captcha>iframe,
.h-captcha iframe[src*="hcaptcha.com"] {
    width: 100% !important;
    height: 78px !important;
    min-height: 78px !important;
    max-height: 78px !important;
    border: none !important;
}

/* 控制 hCaptcha widget 容器 */
.h-captcha.hcaptcha-rendered,
.h-captcha>div,
.h-captcha.hcaptcha-rendered>div {
    width: 100% !important;
    height: 78px !important;
    min-height: 78px !important;
    max-height: 78px !important;
    overflow: hidden !important;
}

.h-captcha-container .erro_info {
    position: absolute;
    bottom: -1.5vw;
    right: 0;
    margin: 0;
}

#captcha {
    padding-right: 5.5vw;
    box-sizing: border-box;
}

.next_captcha {
    display: block;
    position: absolute;
    top: 0.8vw;
    right: 0.4vw;
    width: 4.6vw;
    height: calc(2.5vw - 8px);
    overflow: hidden;
    z-index: 10;
    cursor: pointer;
}

.next_captcha img {
    height: 100%;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    cursor: pointer;
}

.erro_info {
    min-width: 30%;
    color: #d81e06;
    background: url(../images/error.svg) left center no-repeat;
    background-size: 13%;
    font-size: 12px;
    display: none;
    height: 30px;
    float: right;
    padding-left: 20px;
    line-height: 30px;
}

/* left-dropdown 默认隐藏 */
.left-dropdown {
    display: block;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    padding-top: 0;
    padding-bottom: 0;
    margin: 0;
    transition: max-height 0.3s ease, opacity 0.3s ease, padding-top 0.3s ease, padding-bottom 0.3s ease;
    visibility: hidden;
}

.left-dropdown.show {
    max-height: 500px;
    /* 足够大的值以容纳所有内容 */
    opacity: 1;
    padding-top: 5px;
    padding-bottom: 5px;
    visibility: visible;
}

/* 下拉箭头样式 */
.channel-list .item_2 li.you {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

#leftDropdown {
    /* padding-left: 20px; */
    overflow: visible !important;
}

#leftDropdown ul {
    padding: 20px 0;
    margin: 0;
    list-style: none;
    overflow: visible !important;
}

#leftDropdown li {
    display: block;
    width: 90%;
    /* border-bottom: 1px solid #f7f7f7; */
    margin: 0 auto;
    height: 40px;
    padding: 0;
    box-sizing: border-box;
    font-size: 16px;
    color: #000;
    cursor: pointer;
    transition: background-color 0.2s ease;
    overflow: visible !important;
    margin-bottom: 10px;
}

#leftDropdown li:last-child {
    border-bottom-width: 0;
}

#leftDropdown li:hover {
    background-color: #f7f7f7;
}

#leftDropdown li a {
    color: #999;
    text-decoration: none;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    gap: 8px;
    padding: 0 10px;
    box-sizing: border-box;
    overflow: visible !important;
}

#leftDropdown li.logout a {
    cursor: pointer;
}

#leftDropdown li .menu-icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    margin-right: 8px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.6;
    transition: opacity 0.2s ease;
}

#leftDropdown li.gaikuang .menu-icon {
    background-image: url(../images/gaikuang_n.png);
}

#leftDropdown li.tiezi .menu-icon {
    background-image: url(../images/tiezi_n.png);
}

#leftDropdown li.pinglun .menu-icon {
    background-image: url(../images/pinglun.png);
}

#leftDropdown li.dashang .menu-icon {
    background-image: url(../images/dashang_n.png);
}

#leftDropdown li.shoucang .menu-icon {
    background-image: url(../images/shoucang_n.png);
}

#leftDropdown li.shezhi .menu-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23555' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 010 2.83 2 2 0 01-2.83 0l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 01-4 0v-.09A1.65 1.65 0 009 19.4a1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 01-2.83-2.83l.06-.06A1.65 1.65 0 004.68 15a1.65 1.65 0 00-1.51-1H3a2 2 0 010-4h.09A1.65 1.65 0 004.6 9a1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 012.83-2.83l.06.06A1.65 1.65 0 009 4.68a1.65 1.65 0 001-1.51V3a2 2 0 014 0v.09a1.65 1.65 0 001 1.51 1.65 1.65 0 001.82-.33l.06-.06a2 2 0 012.83 2.83l-.06.06A1.65 1.65 0 0019.4 9a1.65 1.65 0 001.51 1H21a2 2 0 010 4h-.09a1.65 1.65 0 00-1.51 1z'/%3E%3C/svg%3E");
}

#leftDropdown li.logout .menu-icon {
    background-image: url(../images/logout-n.png);
}

#leftDropdown li a:hover .menu-icon {
    opacity: 1;
}

#leftDropdown li a:hover {
    color: #813f91;
}

.channel-list .item_2 li.you .dropdown-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    margin-left: auto;
    margin-right: 8px;
    color: #666;
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

.channel-list .item_2 li.you .dropdown-arrow svg {
    width: 100%;
    height: 100%;
    display: block;
}

/* 当 left-dropdown 显示时，箭头向上旋转 */
.channel-list .item_2 li.you:has(+ .left-dropdown.show) .dropdown-arrow,
.channel-list .item_2 li.you.active .dropdown-arrow {
    transform: rotate(180deg);
}

/* 兼容不支持 :has() 的浏览器 */
.channel-list .item_2 li.you.active .dropdown-arrow {
    transform: rotate(180deg);
}


/* 平板/小屏幕 (max-width: 959px) */
@media screen and (max-width: 959px) {


    /* .index_login_main {
        width: 100%;
        height: auto;
        min-height: auto;
    }

    .index_login_user {
        height: auto;
        padding: 2vw;
        min-height: 80px;
    }

    .index_login_user img {
        width: 50px;
        max-width: 60px;
    }

    .index_login_main .title_bigger {
        height: auto;
        min-height: 40px;
        flex-wrap: wrap;
        gap: 8px;
    }

    .title_bigger .wenben {
        font-size: 18px;
        line-height: 1.5;
    }

    .title_bigger #logo {
        margin: 0 8px;
    }

    .title_bigger #logo img {
        width: 35px;
    }

    .index_login_bottom {
        height: auto;
        margin-top: 2vw;
        min-height: 80px;
    }

    .index_login_row {
        height: auto;
        min-height: 45px;
        margin-bottom: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .index_login_submit,
    .index_login_goto {
        width: 60%;
        min-width: auto;
        height: 42px;
        font-size: 14px;
        border-radius: 21px;
        padding: 0 20px;
        box-sizing: border-box;
    } */

    .index_login_step2,
    .index_login_step3,
    .index_login_step4,
    .index_login_step5,
    .index_login_step7 {
        /* 宽度为 diag 的 90%，确保内容完整显示 */
        width: 90%;
        /* diag 宽度的 90% */

        max-width: 380px;
        /* 确保不超过 diag 的 90% */
        height: auto;
        max-height: calc(90vh - 80px);
        /* 增加上下间距，确保内容完整显示 */
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0;
        padding: 20px;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        /* iOS平滑滚动 */
    }

    .index_login_step4 {
        max-height: calc(90vh - 60px);
        /* 增加高度，确保内容完整显示 */
    }

    .index_login_step5 {
        max-height: calc(90vh - 40px);
        /* 增加高度，确保内容完整显示 */
    }

    .index_login_step7 {
        min-height: auto;
        max-height: calc(90vh - 80px);
    }

    /* .index_step2_logo {
        height: auto;
        min-height: 50px;
        padding-top: 1vw;
    }

    .index_step2_logo img {
        width: 40px;
    } */

    /* .index_login_big_title {
        font-size: 16px;
        min-height: auto;
        margin-bottom: 1.5vw;
    } */

    .index_login_small_title {
        font-size: 12px;
        height: auto;
    }

    .index_input_row {
        margin-top: 1vw;
        padding-top: 0.8vw;
    }

    /* .index_input_row .small_title {
        top:0;
    } */

    .index_input_row input {
        height: 42px;
        font-size: 14px;
        line-height: 42px;
        padding: 0 12px;
    }

    .forgot_pass {
        font-size: 12px;
        height: auto;
        min-height: 30px;
        margin-top: 12px;
    }

    #index_register_1,
    .index_register {
        font-size: 14px;
        line-height: 1.5;
    }

    .index_login_button {
        height: 38px;
        line-height: 38px;
        font-size: 14px;
    }

    .h-captcha-container {
        margin: 0 0;
        padding: 0;
    }

    .h-captcha-container .erro_info {
        bottom: -20px;
    }

    .h-captcha {
        min-height: 65px;
        width: 100%;
    }

    .h-captcha iframe {
        max-width: 100%;
        width: 100% !important;
    }

    .h-captcha.hcaptcha-rendered iframe,
    .h-captcha>iframe,
    .h-captcha iframe[src*="hcaptcha.com"] {
        width: 100% !important;
        height: 65px !important;
        min-height: 65px !important;
        max-height: 65px !important;
        border: none !important;
    }

    .h-captcha.hcaptcha-rendered,
    .h-captcha>div,
    .h-captcha.hcaptcha-rendered>div {
        width: 100% !important;
        height: 65px !important;
        min-height: 65px !important;
        max-height: 65px !important;
        overflow: hidden !important;
    }

    .h-captcha.hcaptcha-rendered iframe,
    .h-captcha>iframe {
        width: 100% !important;
        height: 65px !important;
        min-height: 65px !important;
        max-height: 65px !important;
    }

    .h-captcha.hcaptcha-rendered,
    .h-captcha>div {
        width: 100% !important;
        height: 65px !important;
        min-height: 65px !important;
    }

    .show_password {
        width: 20px;
        height: 20px;
        min-width: 20px;
        min-height: 20px;
    }

    .show_password svg {
        width: 20px;
        height: 20px;
        max-width: 20px;
        max-height: 20px;
    }

    .next_captcha {
        width: 60px;
        height: calc(42px - 8px);
        top: 0.8vw;
        right: 0.6vw;
    }

    .post_close {
        right: 1.5vw;
        top: 1vw;
        font-size: 22px;
        width: 28px;
        height: 28px;
        line-height: 28px;
    }
}

/* 移动端 (max-width: 768px) */
@media screen and (max-width: 768px) {


/* 

    .index_login_user {
        padding-top: 15px;
        min-height: 70px;
    }

    .index_login_user img {
        width: 45px;
    }

    .title_bigger .wenben {
        font-size: 18px;
    }

    .title_bigger #logo img {
        width: 30px;
    }

    .index_login_bottom {
        margin-top: 15px;
    }

    .index_login_submit,
    .index_login_goto {
        width: 60%;
        min-width: auto;
        height: 40px;
        font-size: 13px;
        padding: 0 20px;
        box-sizing: border-box;
    } */

    .index_login_step2,
    .index_login_step3,
    .index_login_step4,
    .index_login_step5,
    .index_login_step7 {
        /* 宽度为 diag 的 90%，确保内容完整显示 */
        width: 90%;
        /* diag 宽度的 90% */

        max-width: 380px;
        /* 确保不超过 diag 的 90% */
        height: auto;
        max-height: calc(85vh - 80px);
        /* 增加上下间距，确保内容完整显示 */
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0;
        padding: 16px;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        /* iOS平滑滚动 */
    }

    .index_login_step4 {
        max-height: calc(85vh - 60px);
        /* 增加高度，确保内容完整显示 */
    }

    .index_login_step5 {
        max-height: calc(85vh - 40px);
        /* 增加高度，确保内容完整显示 */
    }

    .index_login_step7 {
        min-height: auto;
        max-height: calc(85vh - 80px);
    }

    /* .index_step2_logo img {
        width: 35px;
    } */
/* 
    .index_login_big_title {
        font-size: 15px;
        margin-bottom: 12px;
    } */

    .index_login_small_title {
        font-size: 12px;
    }

    .index_input_row {
        margin-top: 12px;
        padding-top: 0.6vw;
    }

    .index_input_row .small_title {
        font-size: 12px;
    }

    .index_input_row input {
        height: 40px;
        font-size: 13px;
        line-height: 40px;
    }

    .show_password {
        width: 18px;
        height: 18px;
        min-width: 18px;
        min-height: 18px;
    }

    .show_password svg {
        width: 18px;
        height: 18px;
        max-width: 18px;
        max-height: 18px;
    }
    #index_register_1, .index_register {
        font-size: 13px;
    }
    .index_login_button {
        height: 36px;
        line-height: 36px;
        font-size: 13px;
    }

    .post_close {
        right: 12px;
        top: 8px;
        font-size: 20px;
        width: 26px;
        height: 26px;
        line-height: 26px;
    }
}

/* 小屏幕 (max-width: 695px) */
@media screen and (max-width: 540px) {
    .index_login_user img {
        width: 78px;
    }

    .title_bigger .wenben {
        font-size: 20px;
    }

    .title_bigger #logo img {
        width: 48px;
    }

    .index_login_submit,
    .index_login_goto {
        width: 60%;
        min-width: auto;
        height: 38px;
        font-size: 16px;
        padding: 0 20px;
        box-sizing: border-box;
    }

    .index_login_step2,
    .index_login_step3,
    .index_login_step4,
    .index_login_step5,
    .index_login_step7 {
        /* 宽度为 diag 的 90%，确保内容完整显示 */
        width: 90%;
        /* diag 宽度的 90% */

        max-width: 380px;
        /* 确保不超过 diag 的 90% */
        height: auto;
        max-height: calc(85vh - 80px);
        /* 增加上下间距，确保内容完整显示 */
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0;
        padding: 16px;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        /* iOS平滑滚动 */
    }

    .index_login_step4 {
        max-height: calc(85vh - 60px);
        /* 增加高度，确保内容完整显示 */
    }

    .index_login_step5 {
        max-height: calc(85vh - 40px);
        /* 增加高度，确保内容完整显示 */
    }

    .index_login_step7 {
        min-height: auto;
        max-height: calc(85vh - 80px);
    }

    .index_login_big_title {
        font-size: 14px;
    }

    /* .index_input_row {
        min-height: 55px;
    } */

    .index_input_row input {
        height: 38px;
        font-size: 12px;
        line-height: 38px;
    }

    .show_password {
        width: 18px;
        height: 18px;
        min-width: 18px;
        min-height: 18px;
    }

    .show_password svg {
        width: 18px;
        height: 18px;
        max-width: 18px;
        max-height: 18px;
    }

    .index_login_button {
        height: 34px;
        line-height: 34px;
        font-size: 13px;
    }
    .index_login_diag{
        height:65vh;
    }
    .index_step2_logo{
        padding-top: 10vw;
    }
}

/* 超小屏幕 (max-width: 375px) */
@media screen and (max-width: 375px) {

    .index_login_diag{
        height: 55vh;
        min-height: 435px;
    }
    .index_login_user img {
        width: 68px;
    }

    .title_bigger .wenben {
        font-size: 18px;
    }
    .title_bigger #logo{
        margin: 0 12px;
    }
    .title_bigger #logo img {
        width: 36px;
    }

    .index_login_submit,
    .index_login_goto {
        width: 80%;
        min-width: auto;
        height: 36px;
        font-size: 13px;
        padding: 0 20px;
        box-sizing: border-box;
    }

    .index_login_step2,
    .index_login_step3,
    .index_login_step4,
    .index_login_step5,
    .index_login_step7 {
        /* 宽度为 diag 的 90%，确保内容完整显示 */
        width: 90%;
        /* diag 宽度的 90% */

        max-width: 90%;
        /* 确保不超过 diag 的 90% */
        height: auto;
        max-height: calc(90vh - 80px);
        /* 增加上下间距，确保内容完整显示 */
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0;
        padding: 16px;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        /* iOS平滑滚动 */
    }

    .index_login_step4 {
        max-height: calc(90vh - 60px);
        /* 增加高度，确保内容完整显示 */
    }

    .index_login_step5 {
        max-height: calc(90vh - 40px);
        /* 增加高度，确保内容完整显示 */
    }

    .index_login_step7 {
        min-height: auto;
        max-height: calc(90vh - 80px);
    }

    .index_login_big_title {
        font-size: 13px;
    }

    .index_input_row {
        min-height: 50px;
    }

    .index_input_row input {
        height: 36px;
        font-size: 11px;
        line-height: 36px;
    }

    .show_password {
        width: 16px;
        height: 16px;
        min-width: 16px;
        min-height: 16px;
    }

    .show_password svg {
        width: 16px;
        height: 16px;
        max-width: 16px;
        max-height: 16px;
    }

    .index_login_button {
        height: 32px;
        line-height: 32px;
        font-size: 10px;
    }

    .post_close {
        right: 8px;
        top: 6px;
        font-size: 18px;
        width: 24px;
        height: 24px;
        line-height: 24px;
    }
}