/* @setup 生成配置
----------------------------------------------------------------*/
.main-wrapper.setup { height: calc(100% - 66px) }
.main-wrapper.setup .session.l-s { height: 100%; width: 62%; }
.main-wrapper.setup .session.r-s { height: 100%; width: 38%; overflow: auto; background-color: #f4f4f4; position: relative }
.menu-l { width: 250px; height: 100%; min-height: 500px; background: #f4f4f4; position: relative; padding-bottom: 30px; box-sizing: border-box; }
.menu-l-cont { width: calc(100% - 250px - 80px); height: calc(100% - 70px); padding: 35px 40px; overflow: auto; position: relative }
.menu-l-cont.w_op { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; height: 100%; overflow: initial }

/* 菜单 */
.menu-l .title-wrap { height: 100px; background: #505050; position: relative; }
.menu-l .title-wrap h1 { position: absolute; left: 15px; top: 50%; right: 36px; transform: translateY(-50%); font-size: 16px; color: #11bf92; color: #fff; }
.menu-l .title-wrap .arrow { width: 100%; height: 100px; cursor: pointer; position: relative; }
.menu-l .title-wrap .arrow i { width: 0; height: 0; border-style: solid; position: absolute; top: 50%; left: 224px; transform: translateY(-50%); border-width: 0 6px 6px 6px; border-color: transparent transparent #fff transparent; }
.menu-l .title-wrap .arrow.active i { border-width: 6px 6px 0 6px; border-color: #fff transparent transparent transparent; }
.menu-l .title-wrap .name-drop { position: absolute; left: 0; top: 100px; right: 0; background: #fff; z-index: 2000; font-size: 14px; box-shadow: 0px 2px 10px rgba(0,0,0,.25); max-height: 260px; overflow-y: auto; display: none; }
.menu-l .title-wrap .name-drop dt { padding: 0 10px; height: 46px; line-height: 46px; color: #505050; font-weight: bold; }
.menu-l .title-wrap .name-drop dd { height: 46px; line-height: 46px; }
.menu-l .title-wrap .name-drop dd a { padding: 0 20px; display: block; color: #505050; }
.menu-l .title-wrap .name-drop dd:hover a { background: #11bf92; color: #fff; }
.menu-l .navTree-wrap { overflow: auto; position: relative }
.menu-l .nav-lists.bt { border-top: 10px solid #fff }
.menu-l .nav-lists .item { line-height: 50px; font-size: 18px; color: #505050; padding: 0 16px 0 30px; }
.menu-l .nav-lists .item .item-l .ico { background: url('../images/pic.png') no-repeat; display: inline-block; vertical-align: middle; margin-right: 14px; }
.menu-l .nav-lists .item .item-l .txt { vertical-align: middle }
.menu-l .nav-lists .item.jbxx .item-l .ico { width: 18px; height: 18px; background-position: -72px -2px; }
.menu-l .nav-lists .item.fgsz .item-l .ico { width: 18px; height: 16px; background-position: -92px -2px; }
.menu-l .nav-lists .item.xcxpz .item-l .ico { width: 18px; height: 18px; background-position: -113px -1px; }
.menu-l .nav-lists .item.wxzf .item-l .ico { width: 18px; height: 18px; background-position: -134px -1px; }
.menu-l .nav-lists .item.zxlb .item-l .ico { width: 18px; height: 18px; background-position: -134px -24px; }
.menu-l .nav-lists .item.fllb .item-l .ico { width: 18px; height: 18px; background-position: -113px -24px; }
.menu-l .nav-lists .item.active, .menu-l .nav-lists .item:hover { background-color: #c8c8c8 }
.menu-l .nav-lists .item.active .arrow, .menu-l .nav-lists .item:hover .arrow { display: inline-block; width: 6px; height: 12px; background: url('../images/pic.png') no-repeat; background-position: -157px -4px; margin-top: 20px; }
.menu-l .create-btn { position: absolute; left: 10px; right: 10px; bottom: 30px; font-size: 18px; color: #fff; background-color: #f26a58; height: 50px; line-height: 50px; text-align: center; border-radius: 5px; }

/* 菜单详情 */
.menu-l-cont .top-title { padding-bottom: 24px; border-bottom: 1px solid #e5e5e5; font-size: 0 }
.menu-l-cont .top-title .ico { width: 18px; height: 18px; background: url(../images/pic.png) no-repeat; background-position: -72px -2px; display: inline-block; vertical-align: middle; margin-right: 14px; }
.menu-l-cont .top-title .txt { font-size: 16px; line-height: 18px; color: #505050; vertical-align: middle; font-weight: bold; }
.menu-l-cont .top-title .tip { width: 18px; height: 18px; background: url(../images/pic.png) no-repeat; background-position: -93px -48px; display: inline-block; vertical-align: middle; margin-left: 12px; cursor: pointer }
.menu-l-cont .item.kfdh-i { display: inline-block; margin-right: 20px }
.menu-l-cont .item.gfwz-i { display: inline-block }
.menu-l-cont .save-btn { display: block; font-size: 18px; color: #ffffff; line-height: 40px; width: 100px; background-color: #11bf92; border-radius: 4px; text-align: center; margin-top: 50px; padding: 0 }
.menu-l-cont .save-btn:hover { background-color: #0fad84; border-radius: 0; }

/* 模板展示 */
.main-wrapper.setup .session.r-s .title { color: #f26a58; font-size: 20px; text-align: center; margin-top: 70px; margin-bottom: 60px }
.main-wrapper.setup .session.r-s .left-wrap { width: 40%; margin-left: 5% }
.main-wrapper.setup .session.r-s .phone-wrap { width: 100%; height: 626px; background: url('../images/phone_model.png') no-repeat; background-size: 100%; position: relative; }
.main-wrapper.setup .session.r-s .pic-wrap { width: 88%; height: 446px; overflow: auto; position: absolute; top: 12%; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); border: 1px solid #dcdcdc; }
.main-wrapper.setup .session.r-s .pic-wrap img { width: 100%; }
.main-wrapper.setup .session.r-s .left-wrap .intro { margin-top: 30px; font-size: 14px; color: #575757; margin-bottom: 30px; padding: 0 }
.main-wrapper.setup .session.r-s .left-wrap .intro .title { font-size: 24px; line-height: 24px; color: #303030; padding: 10px 0; border-bottom: 1px solid #ece9e9; margin-top: 0 }
.main-wrapper.setup .session.r-s .left-wrap .intro .js { margin-top: 16px; }
.main-wrapper.setup .session.r-s .left-wrap .intro .tit { color: #040404; }
.main-wrapper.setup .session.r-s .left-wrap .intro .jg .adorn { color: #f26c5a }
.main-wrapper.setup .session.r-s .right-wrap { margin-left: 51%; width: 44%; overflow: hidden; }
.main-wrapper.setup .session.r-s .right-wrap .p-navs { margin-top: 23px; }
.main-wrapper.setup .session.r-s .right-wrap .p-navs .tit { font-size: 20px; line-height: 20px; color: #303030; padding: 10px 0; border-bottom: 1px solid #d1d1d1 }
.main-wrapper.setup .session.r-s .right-wrap .p-navs .navs-wrap { font-size: 14px; line-height: 42px; color: #303030; cursor: pointer; max-height: 700px; position: relative; margin-top: 15px }
.main-wrapper.setup .session.r-s .right-wrap .p-navs .navs-wrap .nav-acco { background-color: #fff; padding: 0 22px; overflow: hidden }
.main-wrapper.setup .session.r-s .right-wrap .p-navs .navs-wrap .nav-acco .ico { display: inline-block; width: 6px; height: 10px; background: url('../images/pic.png'); background-position: -180px 0; margin-top: 16px; -webkit-transition: all .4s; transition: all .4s; }
.main-wrapper.setup .session.r-s .right-wrap .p-navs .navs-wrap .nav-acco .ico.active { -webkit-transform: rotate(90deg); transform: rotate(90deg); }
.main-wrapper.setup .session.r-s .right-wrap .p-navs .navs-wrap .item-s { padding: 0 22px; }
.main-wrapper.setup .session.r-s .right-wrap .p-navs .navs-wrap .item-s:hover { background-color: #11bf92; color: #fff }
.main-wrapper.setup .session.r-s .right-wrap .p-navs .navs-wrap .lists { display: none }
.main-wrapper.setup .session.r-s .right-wrap .p-navs .navs-wrap .lists.show { display: block; }
.main-wrapper.setup .session.r-s .right-wrap .p-navs .navs-wrap .lists .item-s.active { background: #11bf92; color: #fff }
.menu-l-cont .tips-wrap { margin-top: 24px; font-size: 14px; }
.menu-l-cont .tips-wrap p { margin-top: 6px }

/* 基本信息 */
.menu-l-cont.basicinfo .top-title .ico { background-position: -72px -2px; }
.menu-l-cont .layui-form-item.tb-i div.pic { position: relative; width: 60px; height: 60px; background-color: #e5e5e5; border-radius: 50%; margin-right: 16px; overflow: hidden; border: 1px solid #e6e6e6 }
.menu-l-cont .layui-form-item.tb-i div.pic img { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%) }
.menu-l-cont .layui-form-item.tb-i div.title { font-size: 16px; color: #505050; line-height: 60px; display: block; font-weight: bold; }
.menu-l-cont .layui-form-item.tb-i .tit { font-size: 18px; line-height: 18px; color: #11bf92; display: block; margin-top: 10px; margin-bottom: 10px; border: none; background-color: #fff }
.menu-l-cont .layui-form-item.tb-i .tit-s { font-size: 14px; line-height: 14px; color: #808080; display: block }

/* 风格设置 */
.menu-l-cont.styleset .top-title .ico { background-position: -92px -2px }
.menu-l-cont .item.zsd-i .colors-wrap { max-width: 560px }
.menu-l-cont .item.zsd-i .colors-wrap li { width: 50px; height: 50px; border: 1px solid #e7e7e7; padding: 4px; border-radius: 50%; overflow: hidden; margin-right: 20px; margin-bottom: 15px; position: relative; cursor: pointer }
.menu-l-cont .item.zsd-i .colors-wrap li span { display: inline-block; width: 100%; height: 100%; border-radius: 50%; }
.menu-l-cont .item.zsd-i .colors-wrap li.active:after { content: ''; position: absolute; width: 26px; height: 26px; background: url('../images/pic.png'); background-position: -31px -27px; top: 50%; left: 50%; margin-top: -13px; margin-left: -13px }
.menu-l-cont .item.zsd-i .colors-wrap li.active.white:after { content: ''; position: absolute; width: 26px; height: 26px; background: url('../images/pic.png'); background-position: -3px -27px; top: 50%; left: 50%; margin-top: -13px; margin-left: -13px }

/* 小程序配置 */
.menu-l-cont .d-cont .tips { width: 200px; height: 48px; line-height: 48px; text-align: center; font-size: 16px; background: #11bf92; z-index:10; box-shadow: 0 0 5px rgba(0,0,0,.3); border-radius: 5px; position: absolute; left: 50%; top: -30px; transform: translateX(-50%); color: #fff; display: none;}
.menu-l-cont .scan {}
.menu-l-cont .scan .layui-form-item { text-align: center }
.menu-l-cont .scan .title { font-size: 20px; padding-bottom: 20px; display: block; }
.menu-l-cont .scan .qrcode { width: 200px; height: 200px; border: 1px solid #e5e5e5; }
.menu-l-cont .scan .txt { font-size: 14px; color: #bbb; line-height: 24px; margin-top: 20px;}

/* 扫码预览 */
.menu-l-cont.xcxconfig .top-title .ico { background-position: -113px -1px; }
.menu-l-cont.xcxconfig input.self { width: 400px }

/* 微信支付 */
.menu-l-cont.wxpay .top-title .ico { background-position: -134px -1px; }
.menu-l-cont.wxpay .tips-wrap .tapto { margin-top: 8px; display: inline-block }

/* 资讯列表 */
.menu-l-cont.infolist .top-title .ico { background-position: -134px -24px; }

/* 分类列表 */
.menu-l-cont.classfylist .top-title .ico { background-position: -113px -24px; }

/* @backstage 后台
----------------------------------------------------------------*/
.main-wrapper.bs { height: calc(100% - 66px) }
.main-wrapper.bs .session.l-s { width: 100%; height: 100% }
.main-wrapper.bs .table-control { margin-top: 24px }
.main-wrapper.bs .btn-wrap { font-size: 0; }
.main-wrapper.bs .btn-wrap a { display: inline-block; color: #fff; font-size: 18px; width: 80px; line-height: 40px; border-radius: 6px; text-align: center; background-color: #11bf92; margin-right: 15px }
.menu-l-cont .layui-form-item.fm-i .list-item { position: relative; margin-right: 16px; margin-bottom: 16px; cursor: pointer }
.menu-l-cont .layui-form-item.fm-i .img-wrap { width: 148px; height: 148px; border: 1px solid #e5e5e5; position: relative }
.menu-l-cont .layui-form-item.fm-i .img-dele { display: none; position: absolute; right: -10px; top: -10px; text-align: center; width: 24px; height: 24px; border-radius: 50%; color: #fff; font-size: 23px; line-height: 24px; background-color: #d9534f; }
.menu-l-cont .layui-form-item.fm-i .list-item:hover .img-dele { display: block }
.menu-l-cont .layui-form-item.fm-i a.btn { width: 120px; line-height: 36px; line-height: 36px; text-align: center; font-size: 16px; color: #fff; border-radius: 4px; background-color: #11bf92; margin-top: 5px; margin-bottom: 20px; }
.menu-l-cont .layui-form-item.state-i a { display: inline-block; width: 80px; line-height: 38px; border: 1px solid #e5e5e5; color: #505050; font-size: 16px; text-align: center; margin-right: 18px; }
.menu-l-cont .layui-form-item.state-i .qy-btn.active { background-color: #29c59d; color: #fff }
.menu-l-cont .layui-form-item.state-i .jy-btn.active { background-color: #f26a58; color: #fff }
.menu-l-cont .layui-form-item.tgoods-i .list-item { position: relative; margin-right: 16px; margin-bottom: 16px; cursor: pointer; border: 1px solid #e5e5e5; width: 148px; cursor: all-scroll }
.img-wrapper {}
.img-wrapper .about-face-right { display: flex; flex-direction: column; justify-content: space-around; }
.img-wrapper .img-upload-btn { width: 148px; height: 148px; border: 1px dashed #e5e5e5; font-size: 30px; color: #ccc; text-align: center; line-height: 148px; float: left; margin-right: 16px; cursor: pointer; }
.menu-l-cont .layui-form-item.tgoods-i .img-wrap { width: 100%; height: 148px; border-bottom: 1px solid #e5e5e5; position: relative }
.menu-l-cont .layui-form-item.tgoods-i .img-dele { display: none; position: absolute; right: -12px; top: -12px; text-align: center; width: 24px; height: 24px; border-radius: 50%; color: #fff; font-size: 23px; line-height: 24px; background-color: #d9534f; cursor: pointer }
.menu-l-cont .layui-form-item.tgoods-i .info .tit { font-size: 12px; padding: 4px; }
.menu-l-cont .layui-form-item.tgoods-i .info .pri { padding: 0 4px 4px 4px }
.menu-l-cont .layui-form-item.tgoods-i .list-item:hover .img-dele { display: block; }
.menu-l-cont .layui-form-item.tgoods-i .list-item:hover { border-color: #11bf92; }
.menu-l-cont .layui-form-item.tgoods-i a.btn { width: 120px; line-height: 40px; text-align: center; font-size: 18px; color: #fff; border-radius: 4px; background-color: #11bf92; margin-bottom: 20px; margin-top: 5px }
.main-wrapper.bs .menu-l-cont .btto-wrap { margin-top: 30px; border-top: 1px solid #e5e5e5 }
.main-wrapper.bs .menu-l-cont .btto-wrap .comBtn { margin-top: 30px }
.menu-ifram-cont { padding: 0; width: calc(100% - 250px); height: calc(100%); overflow: hidden; }
.menu-ifram-cont>iframe { width: 100%; height: 100%; border: none; }
.content-iframe { padding: 30px; }
.content-iframe .top-title { padding-bottom: 24px; border-bottom: 1px solid #e5e5e5; font-size: 0; font-weight: bold; }
.content-iframe .top-title .ico { width: 18px; height: 18px; background: url(../images/pic.png) no-repeat; background-position: -72px -2px; display: inline-block; vertical-align: middle; margin-right: 14px; }
.content-iframe .top-title .txt { font-size: 18px; line-height: 16px; color: #505050; vertical-align: middle }
.content-iframe .top-title .tip { width: 18px; height: 18px; background: url(../images/pic.png) no-repeat; background-position: -93px -48px; display: inline-block; vertical-align: middle; margin-left: 12px; cursor: pointer }
.content-iframe .top-title .top-help { font-size: 14px; font-weight: normal; color: red; }
.content-iframe .top-title .top-help .text { width: 20px; height: 20px; line-height: 20px; text-align: center; border: 1px solid #ccc; display: inline-block; margin-right: 6px; border-radius: 50%; }
.content-iframe .top-title .top-help .text i { font-weight: normal; font-size: 14px; color: #999; font-family: serif; }


/* 商品编辑 */
.tips-title { font-size: 18px; font-weight: bold; padding: 15px 0; }
.alert-content { border: 1px solid #e5e5e5; border-radius: 5px; margin-bottom: 20px; }
.alert-content .content { padding: 20px; }
.alert-content .title { margin-bottom: 10px; }
.alert-content .line { height: 2px; border-top: 1px solid #e5e5e5; margin-bottom: 10px; margin-top: 20px; }
.alert-content .spec-select-wrapper {}
.alert-content .spec-select-wrapper button { display: inline-block; margin-left: 0; margin-right: 10px; }
.alert-content .spec-select-wrapper .layui-btn.active { border: 1px solid #009688; background-color: #009688; color: #fff; }
/* .alert-content .layui-layer-iframe .layui-layer-btn, .layui-layer-page .layui-layer-btn { border-top: 1px solid #e5e5e5; } */

.user-add-sepc { border: 1px solid #e5e5e5; border-radius: 4px; display: inline-block; padding: 5px; margin-right: 10px;}
.user-add-sepc .layui-icon { font-weight: bold; color: #1E9FFF; cursor: pointer;}
.user-add-sepc input {width: 60px; display: inline-block; height: 26px; margin: 2px 4px 0 2px; text-align: center; padding: 0; }

.g-btn { border: 1px solid #e5e5e5; border-radius: 4px; color: #585858; font-size: 12px; display: inline-block; padding: 5px; }
.g-btn.first { margin-right: 10px; padding: 15px; }
.g-btn .text { display: inline-block; height: 30px; line-height: 30px; margin-left: 4px;}
.g-btn input {width: 60px; display: inline-block; height: 26px; margin: 2px 4px 0 2px; text-align: center; padding: 0; }
.g-btn .layui-icon { font-weight: bold; color: #1E9FFF; cursor: pointer; margin-left: 5px;display: inline-block; vertical-align: middle;}
.g-btn .text.none, .g-btn input.none, .g-btn .layui-icon.none{ display: none; }

.g-btn-wrapper { border: 1px solid #e5e5e5; border-radius: 4px; color: #585858; font-size: 12px; display: inline-block; padding: 10px; }
.g-btn-wrapper .g-btn { margin-right: 10px; }
.g-btn-wrapper .btn-spec-sub-add { background: #fff; border: 1px solid #1E9FFF; color: #1E9FFF; }
.g-btn-wrapper .btn-spec-sub-add:hover { color: #1E9FFF; }

.btn-spec-item { height: 30px; line-height: 30px; display: inline-block; margin-right: 10px; font-size: 0; border-radius: 4px; float: left; }
.btn-spec-item .btn-spec { border-radius: 0; vertical-align: top; margin-right: 0; height: 100%; }
.btn-spec-item .del { height: 30px; line-height: 30px; display: inline-block; color: #1E9FFF; border: 1px solid #C9C9C9; border-left: none; box-sizing: border-box; }
.btn-spec-item .del i { padding: 0 3px; }
.btn-spec-item .del:hover i { font-weight: bold; }

.spec-wrapper {}
.spec-wrapper .spec-item { margin-bottom: 20px; }

.sku-table { width: 100%; border: 1px solid #ddd; }
.sku-table thead {}
.sku-table th { background: #f7f7f7; padding: 5px 0; font-weight: normal; }
.sku-table thead tr { border: 1px solid #ddd; }
.sku-table tbody tr { border: 1px solid #ddd; border-bottom-color: #f5f5f5; }
.sku-table td { text-align: center; padding: 4px 0; }
.sku-table tbody tr:last-of-type { border-bottom: none; }
.sku-table .pic { width: 50px; height: 50px; border-radius: 4px; position: relative; border: 1px solid #f5f5f5; display: inline-block; vertical-align: middle; }
.sku-table .pic img { width: 100%; position: absolute; left: 0; top: 50%; transform: translateY(-50%); font-size: 12px; }
.sku-table .input-text { width: 60px; font-size: 12px; padding: 0; text-align: center; display: inline-block; height: 30px; font-weight: normal; box-shadow: inset 0 1px 1px rgba(0,0,0,.075); }
.sku-table .input-text:focus { box-shadow: inset 0 0px 10px rgba(0,146,255,.2); }
.sku-table .change { color: #1991da; font-size: 14px; display: inline-block; margin-left: 6px; vertical-align: middle; }
.sku-table .change:hover { color: #333; }