@charset "UTF-8";
.icon-card { background: url("../../images/person-icon.html") no-repeat 0px 0px; background-size: 100px 66px; width: 32px; height: 32px; }

.icon-link { background: url("../../images/person-icon.html") no-repeat -34px 0px; background-size: 100px 66px; width: 32px; height: 32px; }

.icon-lock { background: url("../../images/person-icon.html") no-repeat 0px -34px; background-size: 100px 66px; width: 32px; height: 32px; }

.icon-phone { background: url("../../images/person-icon.html") no-repeat -34px -34px; background-size: 100px 66px; width: 32px; height: 32px; }

.icon-steam { background: url("../../images/person-icon.html") no-repeat -68px 0px; background-size: 100px 66px; width: 32px; height: 32px; }

.icon-vx { background: url("../../images/vx.html") no-repeat; width: 32px; height: 32px; }

.focus-tip { margin-top: -5px; margin-bottom: 15px; font-size: 14px; color: #C6D4DF; }

.vx-info { text-align: left; padding: 0 24px; font-size: 14px; }

.vx-info p { color: #C6D4DF; }

p, span, a { color: #b8b6b4; }

.icon-promote { width: 32px; height: 32px; background: url(../../images/promote.html) no-repeat center; display: inline-block; }

.clearfloat::after { content: ""; height: 0; clear: both; visibility: hidden; display: block; }

.clearfloat { zoom: 1; }

.myBag-contain { width: 1200px; margin: 0 auto; color: #ffffff; clear: both; }

.steam-person-conter { float: right; margin-left: 20px; width: 955px; font-size: 12px; margin-bottom: 50px; position: relative; }

.spc-top { width: 100%; height: 186px; background-color: #16202d; margin-bottom: 20px; overflow: hidden; }

.spct-left { width: 200px; height: 100%; position: relative; float: left; border-right: 1px dashed #2d3d50; }

.spct-left span { position: absolute; left: 193px; display: inline-block; width: 15px; height: 15px; background-color: #1b2838; border-radius: 50%; }

.spct-left span:first-child { top: -7.5px; }

.spct-left span:first-child + span { bottom: -7.5px; }

.spct-left section { width: 90px; margin: 0 auto; padding-top: 26px; }

.spct-left section img { width: 88px; max-height: 88px; border-radius: 50%; object-fit: cover; }

.spct-left section a { margin-top: 14px; width: 90px; }

.spct-right { float: left; width: 776px; }

.spctr-top { border-bottom: 1px solid #2d3d50; padding-left: 20px; }

.user-grade { max-width: 59%; height: 93px; float: left; display: flex; align-items: center; }

.user-grade > span { display: inline-block; color: #ffffff; font-size: 14px; }

.user-grade > span i { display: inline-block; position: relative; top: 2px; margin-left: 5px; }

.layui-progress { width: 300px; display: inline-block; }

.user-grade section p { display: inline-block; margin-left: 5px; }

.user-grade > div p { display: inline-block; padding: 8px; }

.user-grade > div a { margin-left: 15px; }

.user-grade > div p span { color: #e1c48a; }

.user-grade > div p i { color: #ffffff; }

.user-account { float: right; padding: 20px 0; }

.user-account section { float: right; display: inline-block; margin-right: 35px; }

.user-account section p, .user-account section > a { padding: 9px 0; }

.user-account section p.btn-text-yellow, .user-account section > a.btn-text-yellow { font-size: 14px; }

.user-account section .btn-text-yellow { padding: 9px 0; font-size: 14px; }

.user-account section .btn-text-yellow span { color: #e1c48a; }

span.btn-text-yellow:hover { color: #e1c48a; }

.user-account section p:first-child span { margin-right: 8px; }

.user-account section > a span { color: #e1c48a; }

.user-account section > a:hover span { color: #ffffff; }

.spctr-bottom ul li { float: left; width: 24.8%; border-left: 1px solid #2d3d50; box-sizing: border-box; text-align: center; margin: 21px 0; }

.spctr-bottom ul li:first-child { border-left: 0px solid #2d3d50; }

.spctr-bottom ul li p, .spctr-bottom ul li > a { padding: 9px 0; }

.spctr-bottom ul li > a:first-child { color: #ffffff; display: block; }

.spctr-bottom ul li p:first-child { color: #ffffff; }

.spctr-bottom ul li p:first-child img { margin-right: 5px; width: 16px; height: 16px; }

/* 账户设置 */
.spc-bottom { background-color: #16202d; margin-bottom: 100px; }

.spc-bottom h2 { height: 39px; line-height: 40px; border-bottom: 1px solid #2d3d50; padding-left: 18px; font-size: 14px; }

.spc-bottom ul li { border-top: 1px solid #2d3d50; padding: 15px 20px 15px 23px; overflow: hidden; height: 40px; }

.spc-bottom ul li:first-child { border-top: 0px solid #2d3d50; }

.as-left { float: left; }

.as-left i { font-size: 32px; color: #c6d4df; float: left; position: relative; top: 3px; }

.as-left section { float: left; width: 616px; padding-left: 23px; }

.as-left section h3 { font-size: 14px; color: #c6d4df; }

.as-left section > p span:first-child { margin-right: 20px; }

.as-left section > p { padding-top: 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

.as-right { float: right; padding-top: 4px; width: 266px; }

.as-right p { float: left; padding-top: 8px; line-height: 14px; }

.as-right p i { display: inline-block; float: left; margin-right: 4px; }

.as-right p span { color: #c6d4df; }

.as-right a { float: right; width: 120px; font-size: 14px; }

.gamelists { padding-left: 4px; }

.gamelists > p { padding: 20px 0; color: #e1c48a; }

.gamelists > p i { position: relative; top: 5px; left: -5px; }

.gamelists img { width: 24px; height: 24px; margin-right: 18px; margin-bottom: 17px; padding: 1px; background-color: #1b2838; border: 1px solid #1b2838; opacity: 0.5; }

.gamelists img:nth-child(8n) { margin-right: 0px; }

.popup-common.layui-layer-dialog .layui-layer-content { padding: 15px 22px; padding-bottom: 5px; }

.gamelists img:hover { cursor: pointer; opacity: 1; background-color: #000; border: 1px solid #2c4f67; }

.selected { opacity: 1 !important; background-color: #000 !important; border: 1px solid #2c4f67 !important; }

.stl input { width: 414px; }

.get-link, .get-api { margin-left: 10px; margin-right: 14px; }

.preservation-link:hover { background-color: #708e05; }

.popup-common .setpassword { width: 392px; overflow: hidden; padding-top: 10px; padding-left: 13px; }

.popup-common .setpassword > a { float: right; margin-top: 7px; width: 302px; }

.popup-common .setpassword ul li { line-height: 45px; }

.popup-common .setpassword ul li span { color: #ffffff; font-size: 12px; }

.popup-common .setpassword ul li p { width: 88px; margin-right: 2px; display: inline-block; text-align: right; color: #c6d4df; font-size: 12px; }

.popup-common .setpassword ul li p > span { color: #e1c48a; }

.popup-common .setpassword ul li input { width: 290px; }

.popup-common .setpassword ul li a { width: 145px; }

#verificationCode { width: 135px; margin-right: 10px; }

.popsetpassword.layui-layer-dialog .layui-layer-content { padding-top: 5px; }

.setpassword .btn-unable { height: 34px; line-height: 34px; background: #2c4f67; color: #ffffff; }

.setpassword .btn-unable span { color: #ffffff !important; }

.setpassword .btn-unable:hover { color: #ffffff; }

.pop-top ul li { padding-top: 22px; overflow: hidden; }

.pop-top ul li > section { float: left; line-height: 30px; }

.pop-top ul li > section:first-child { width: 120px; text-align: right; }

.pop-top ul li .money { font-weight: 900; }

.pop-bottom { text-align: center; padding-top: 25px; border-top: 1px solid #0f3356; padding: 0; margin: 20px 0; }

.pop-bottom a { color: #66c0f4; }

.pop-bottom input { position: relative; top: 2px; left: -5px; }

.pop-bottom button { display: block; width: 285px; margin-top: 20px; margin-left: 156px; }

.popActivationRobot .pop-top, .popEditLocalTradeLink .pop-top { padding-top: 15px; }

.popActivationRobot .pop-top ul li, .popEditLocalTradeLink .pop-top ul li { padding-top: 10px; overflow: hidden; }

.popActivationRobot .pop-top ul li section, .popEditLocalTradeLink .pop-top ul li section { float: left; line-height: 30px; }

.popActivationRobot .pop-top ul li section:first-child, .popEditLocalTradeLink .pop-top ul li section:first-child { width: 170px; text-align: right; }

.popActivationRobot .pop-top ul li section:first-child + section input, .popEditLocalTradeLink .pop-top ul li section:first-child + section input { width: 380px; }

.popActivationRobot .pop-top ul li section:first-child + section a, .popEditLocalTradeLink .pop-top ul li section:first-child + section a { display: block; color: #1c7cbe; font-size: 12px; }

.popActivationRobot .spcc-tips ul, .popEditLocalTradeLink .spcc-tips ul { padding: 10px 30px; }

.popActivationRobot .spcc-tips ul li, .popEditLocalTradeLink .spcc-tips ul li { padding: 0; font-size: 12px; }

.popActivationRobot .spcc-tips ul li:first-child i, .popActivationRobot .spcc-tips ul li:first-child span, .popEditLocalTradeLink .spcc-tips ul li:first-child i, .popEditLocalTradeLink .spcc-tips ul li:first-child span { color: #d00000; }

.popEditLocalTradeLink .pop-top section:first-child { width: 120px; }

.popEditLocalTradeLink .spcc-tips ul li { padding: 0; font-size: 12px; }

.popEditLocalTradeLink .spcc-tips ul li:first-child i, .popEditLocalTradeLink .spcc-tips ul li:first-child span { color: #459038; }

.edit-nick { color: #66C0F4; margin-left: 12px; cursor: pointer; }

.layer-edit-nick .layui-layer-content { padding-left: 15px; }

.layer-edit-nick .layui-layer-content > h3 { padding-top: 22px; font-size: 14px; color: #C6D4DF; }

.layer-edit-nick .layui-layer-content > div { width: 300px; height: 34px; background: #101822; border: 1px solid #2D3D50; box-sizing: border-box; margin: 5px 0 11px; }

.layer-edit-nick .layui-layer-content > div > input { display: block; width: 100%; height: 100%; background: #101822; border: none; color: #FFFFFF; font-size: 14px; text-indent: 9px; }

.layer-edit-nick .layui-layer-content > p { color: #B8B6B4; font-size: 12px; }

.m-t10 { margin-top: 10px; }

.QR-code { margin: 40px 0 20px; }

.vxnotice-info .QR-code { height: 120px; }

.qrcode-content .layui-layer-content { text-align: center; }

.unbind-steam { text-align: center; }

.unbind-steam .opt-box { height: 120px; clear: both; padding-top: 14px; box-sizing: border-box; }

.unbind-steam .opt-box .setpassword { padding: 0; width: 100%; }

.unbind-steam .opt-box .setpassword span { color: #C6D4DF; }

.unbind-steam .opt-box .setpassword li { line-height: 34px; }

.unbind-steam .opt-box .setpassword .bind-mode { margin-bottom: 8px; }

.unbind-steam .opt-box .setpassword ul li p { width: auto; margin-right: 0; }

.unbind-steam .btn-forty-green { width: 120px; }

.layui-timeline { width: 374px; height: 68px; margin-left: 69px; text-align: left; margin-top: 30px; }

.layui-timeline .layui-timeline-item { width: 170px; float: left; height: 67px; }

.layui-timeline .layui-timeline-item:before { left: 42px; top: 17px; z-index: 0; width: 120px; height: 1px; }

.layui-timeline .layui-timeline-item:first-child + div .layui-timeline-content .layui-timeline-title { margin-left: -6%; }

.layui-timeline .layui-timeline-item:last-child { width: 34px; }

.layui-timeline .layui-timeline-item.active .dd-icon { border: 1px solid #4C6B22; background-color: #4C6B22; }

.layui-timeline .layui-timeline-item.greenline:before { background-color: #4C6B22; }

.layui-timeline .dd-icon { width: 34px; height: 34px; line-height: 34px; color: #FFFFFF; border: 1px dashed #B8B6B4; border-radius: 50%; text-align: center; position: absolute; left: 0; top: 0; background-color: #1b2838; }

.layui-timeline .layui-timeline-content { padding-left: 0; white-space: nowrap; vertical-align: middle; color: #C6D4DF; padding-top: 52px; }

.layui-timeline .layui-timeline-content .layui-timeline-title { margin-left: -25%; }

.del { position: absolute; background-color: #171a21; width: 30px; height: 30px; line-height: 30px; left: 252px; top: 2px; cursor: pointer; display: none; }

.del b { width: 16px; height: 16px; display: inline-block; background: url("../../images/layer-del.png") no-repeat center; background-size: 100%; vertical-align: sub; }
