/* course_bar */
.course_bar{float: left;width: 100%;margin:120px 0 30px;}
.course_bar .address{width: 100%;float: left;display: flex;flex-direction: row;line-height: 20px;margin-bottom: 20px;gap: 10px;}
.course_bar .address a{color: #333;}
.course_bar .address i{color: #00000033;font-size: 12px;font-style: normal;}
.course_bar .address em{color: #333;}
.course_bar .box{width: 100%;background: #fff;float: left;display: grid;flex-direction: row;grid-template-columns:  400px 1fr 220px;}
.course_bar .box .l{float: left;display: flex;flex-direction:column;padding: 30px;}
.course_bar .box .l .img{width: 100%;float: left;}
.course_bar .box .l #imglist{width: 100%;float: left;margin-top: 15px;display: flex;flex-direction: row;justify-content: space-between;}
.course_bar .box .l #imglist img{width: 50px;height:50px;float: left;cursor: pointer;}
.course_bar .box .l #imglist img.cur{border: 2px solid #fd3f49;width: 50px;height: 50px;}
.course_bar .box .info{flex: 1;padding: 30px 30px 0 10px;}
.course_bar .box .info h2{width:100%;line-height: 30px;font-size: 20px;color: #222;font-weight: bold;margin-bottom: 10px;}
.course_bar .box .info .stock{width:100%;line-height: 40px;color: #555;float: left;margin-top: 20px;border-top: 1px solid #e5e5e5;border-bottom: 1px solid #e5e5e5;}
.course_bar .box .info .stock p{width:140px;line-height: 40px;color: #888;text-align: center;float: left;margin-bottom: 0;text-align: center;}
.course_bar .box .info .stock p b{color: #ff4200;}
.course_bar .box .info .stock span{width:40px;line-height: 40px;color: #ddd;text-align: center;float: left;}
.course_bar .box .info .pricebox{width:100%;background: #fafafa;line-height: 28px;float: left;padding: 20px;color: #888;display: grid;grid-template-columns: 1fr 70px;}
.course_bar .box .info .pricebox p{float: left;width: 100%;font-size: 13px;padding: 0;margin-bottom: 0;}
.course_bar .box .info .pricebox p span{float: left;line-height: 28px;margin: 0;padding: 0;text-decoration: line-through;padding-left: 15px;}
.course_bar .box .info .pricebox p em{float: left;line-height: 28px;margin: 0;padding: 0;text-decoration: line-through;font-style: normal;color: #888;}
.course_bar .box .info .pricebox p i{float: left;line-height: 28px;margin: 0;padding: 0;font-style: normal;color: var(--colorone);}
.course_bar .box .info .pricebox p b{float: left;line-height: 28px;margin: 0;padding: 0;font-style: normal;color: var(--colorone);font-size: 20px;padding-left: 15px;}
.course_bar .box .info .pricebox .favor{float: left;height: 50px;background: none;color: #666;line-height: 50px;font-size: 14px;font-weight: normal;cursor: pointer;transition: 0.5s;background: none;border: 1px solid #eee;color: #666;grid-column: 2/3;grid-row: 1/3;align-items: center;justify-content: center;display: flex;border-radius: 4px;}
.course_bar .box .info .pricebox .favor.cur{border: 1px solid var(--colorone);color:var(--colorone);}
.course_bar .box .info .guige{width:100%;float: left;line-height: 28px;margin-top: 20px;}
.course_bar .box .info .guige span{float: left;height: 30px;color:#888;}
.course_bar .box .info .guige a{float: left;height: 30px;border: 1px solid #ddd;color: #888;line-height: 30px;padding: 0 20px;margin: 0 10px 0 0;}
.course_bar .box .info .guige a.cur{border: 2px solid #ff4200;line-height: 28px;}
.course_bar .box .info .guige a:hover{border: 2px solid #ff4200;line-height: 28px;padding: 0 19px;}
.course_bar .box .info .numbox{width:100%;line-height: 34px;color: #555;margin-top: 20px;height: 30px;float: left;}
.course_bar .box .info .numbox span{float: left;color:#888;}
.course_bar .box .info .numbox input{float: left;width: 36px;border: 1px solid #ddd;background: #eee;height: 34px;margin: 0px 0 0;}
.course_bar .box .info .numbox #add{float: left;border-left: none;}
.course_bar .box .info .numbox #min{float: left;border-right: none;}
.course_bar .box .info .numbox #text_box{float: left;width: 50px;background: #fff;text-align: center;border-left: none;border-right: none;height: 34px;}
.course_bar .box .info .numbox p{float: left;height: 34px;line-height: 34px;padding-left: 12px;color:#888;}
.course_bar .box .info .numbox p b{color: #ff4200;}
.course_bar .box .info .btns{float: left;height: 50px;margin-top: 20px;background: none;color: #666;line-height: 50px;font-size: 18px;font-weight: normal;margin-right: 20px;cursor: pointer;transition: 0.5s;}
.course_bar .box .info .goBuy{background: #ffc8b5;padding: 0 60px;border: 1px solid #ff4200;color: #ff4200;}
.course_bar .box .info .addCart{background: #ff4200;padding: 0 40px;border: 1px solid #ff4200;color: #fff;}
.course_bar .box .info .addCart:hover{background: #dd0000;}
.course_bar .box .info .btplay{background: var(--colorone);padding: 0 40px;border: 1px solid var(--colorone);color: #fff;}
.course_bar .box .info .btplay:hover{background: var(--colorone);}
.course_bar .box .info .sharebar{width: 670px;height:40px;float: left;margin: 20px 0px 0px;}
.course_bar .box .info .sharebarbox{height:40px;float: left;margin: 0px 0px 0px;}
.course_bar .box .info .sharebar .click{height:40px;float: left;margin: 0px 20px 0px 0;line-height: 30px;color: #aaa;}
.course_bar .box .info .oem{width:100%;line-height: 28px;float: left;color: #888;margin-top: 20px;}
.course_bar .box .teacher {background: #fafafa;text-align: center;transition: all 0.3s ease;padding: 20px;display: flex;flex-direction: column;    align-items: center;}
.course_bar .box .teacher .avatar {width: 80px;height: 80px;margin: 0 auto 15px;border-radius: 50%;overflow: hidden;border: 3px solid #f0f0f0;transition: all 0.3s ease;}
.course_bar .box .teacher .avatar:hover {border-color: var(--colorone);}
.course_bar .box .teacher .avatar img {width: 100%;height: 100%;object-fit: cover;object-position: center;display: block;}
.course_bar .box .teacher .title {font-size: 16px;font-weight: bold;color: #333;margin-bottom: 10px;line-height: 1.4;word-break: break-word;display: flex;flex-direction: row;gap: 7px;}
.course_bar .box .teacher .title .rz {background: var(--colorone);color: #fff;padding: 0 10px;height: 20px;border-radius: 20px;display: flex;gap: 5px;font-size: 10px;align-items: center;}
.course_bar .box .teacher .title .rz span{font-size: 10px;}
.course_bar .box .teacher .summary {font-size: 13px;color: #666;line-height: 1.5;margin: 0;word-break: break-word;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}
.course_bar .play{width: 100%;display: flex;flex-direction: row;gap: 30px;margin-bottom: 60px;}
.course_bar .play .video{flex: 1;}
.course_bar .play .video video{flex: 1;aspect-ratio: 16/9;}
.course_bar .play .chapter{width: 400px;display: flex;flex-direction: column;}
.course_bar .play .chapter .addresss{width: 100%;float: left;display: flex;flex-direction: row;line-height: 20px;margin-bottom: 20px;gap: 10px;background-color: #fff;border-radius: 8px;padding: 20px;display: none;}
.course_bar .play .chapter .addresss a{color: #333;font-size: 17px;font-weight: bold;;}
@media (max-width: 768px) {
.course_bar{margin:0;padding-top: 70px;}
.course_bar .box{padding: 20px;flex-direction: column;grid-template-columns: 1fr;}
.course_bar .address{display: none;}
.course_bar .box .l{width: 100%;padding: 0;}
.course_bar .box .l .img{width: 100%;float: left;}
.course_bar .box .info{border-left:none;padding-left: 0;margin-left: 0;width: 100%;padding-top: 15px;padding-right: 0;}
.course_bar .box .info .stock p{width:auto;line-height: 40px;color: #888;text-align: center;float: left;margin-bottom: 0;text-align: center;}
.course_bar .box .info .stock p b{color: #ff4200;}
.course_bar .box .info .stock span{width:40px;}
.course_bar .box .info h2{margin-bottom: 15px;}
.course_bar .box .teacher {margin-top: 10px;display: grid;grid-template-columns: 90px 1fr;text-align: left;}
.course_bar .box .teacher .avatar {width: 80px;height: 80px;margin: 0 10px 0 0;border-radius: 50%;overflow: hidden;border: 3px solid #f0f0f0;transition: all 0.3s ease;grid-row: 1/3;}
.course_bar .box .teacher .avatar:hover {border-color: var(--colorone);}
.course_bar .box .teacher .avatar img {width: 100%;height: 100%;object-fit: cover;object-position: center;display: block;}
.course_bar .box .teacher .title {font-size: 16px;font-weight: bold;color: #333;margin-bottom: 0px;line-height: 20px;word-break: break-word;margin: 8px 0 8px;}
.course_bar .box .teacher .summary {font-size: 13px;color: #666;line-height: 1.5;margin: 0;word-break: break-word;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}
.course_bar .box .info .btplay{display: none;}
.course_bar .play{margin-bottom:0px;flex-direction: column;gap: 20px;}
.course_bar .play .video{flex: 1;}
.course_bar .play .video video{flex: 1;aspect-ratio: 16/9;}
.course_bar .play .chapter{width: 100%;padding:0 20px;}
.course_bar .play .chapter .addresss{display: block;}

}


/*show_page*/
.show_page{ float: left;width: 100%;margin-bottom: 60px;}
.show_page .box{float: left;width: 100%;display: grid;grid-template-columns: auto 300px;gap: 30px;align-items: self-start;}
.show_page .box .right{background-color: #fff;display: flex;flex-direction: column;}
.show_page .box .right .title{background-color: #fafafa;line-height: 53px;font-size: 16px;font-weight: bold;padding-left: 20px;}
.show_page .box .right .hot-list{background-color: #fff;display: grid;gap: 20px;grid-template-columns: 1fr;padding: 20px;}
.show_page .box .right .hot-list a{background-color: #fff;display: flex;flex-direction: column;}
.show_page .box .right .hot-list a img{width: 100%;}
.show_page .box .right .hot-list a b{line-height: 24px;font-size: 15px;margin: 10px 0 0;}
.show_page .box .right .hot-list a em{color:var(--colorgreen)}
.show_page .box .right .hot-list a span{color:var(--colorred)}
.show_page .box .left{float: left;width: 100%;line-height: 24px;font-size: 13px;}
.show_page .box .left .tab{float: left;width: 100%;margin:0;line-height: 50px;font-size: 16px;position: sticky;top: 90px;background-color: #fff;display: flex;justify-content: space-around;flex-direction: row;box-shadow: 0 10px 10px rgba(0,0,0,0.02);}
.show_page .box .left .tab a {color: #666;text-decoration: none;display: flex;align-items: center;justify-content: center;transition: all 0.3s ease;border-bottom: 3px solid transparent;position: relative;}
.show_page .box .left .tab a:hover {color: var(--colorone, #ff4200);}
.show_page .box .left .tab a.cur {color: var(--colorone, #ff4200);font-weight: 600;border-bottom-color: var(--colorone, #ff4200);}
.show_page .box .left .tab a.cur::before {content: '';position: absolute;bottom: -3px;left: 50%;transform: translateX(-50%);width: 30px;height: 3px;background: var(--colorone, #ff4200);border-radius: 2px;}
.show_page .box .left .htext{float: left;width: 100%;padding:30px;background: #fff;}
.show_page .box .left .htext .info{float: left;width: 100%;line-height: 30px;margin-bottom: 10px;color: #aaa;}
.show_page .box .left .htext .price{float: left;width: 100%;padding-bottom: 20px;border-bottom: 1px solid #ddd;margin-bottom: 40px;}
.show_page .box .left .htext .price b{float: left;line-height: 50px;font-size: 30px;color: var(--colorone);}
.show_page .box .left .htext .price a{float: right;line-height: 50px;background: var(--colorone);color: #fff;border-radius: 6px;color: #fff;padding: 0 20px;font-size: 18px;font-weight: bold;}
.show_page .box .left .htext .text{float: left;width: 100%;line-height: 30px;font-size: 15px;background: #fff;}
.show_page .box .left .htext .text img{max-width: 100%;}
.show_page .box .left .htext .text h1{float: left;width: 100%;line-height: 60px;font-size: 36px;margin: 0 0 20px;padding: 0 0 15px;font-weight: bold;border-bottom: 3px dashed #eee;}
.show_page .box .left .htext .text h2{float: left;width: 100%;line-height: 60px;font-size: 24px;margin: 0 0 10px;padding: 0;font-weight: bold;}
.show_page .box .left .htext .text h3{float: left;width: 100%;line-height: 40px;font-size: 18px;margin: 0 0 10px;padding: 0;font-weight: bold;}
.show_page .box .left .htext .text blockquote{float: left;width: 100%;line-height: 30px;font-size: 15px;margin: 5px 0;padding: 15px;background: #fafafa;margin:  0 0 15px;}
.show_page .box .left .htext .text blockquote p{color: #999;}
.show_page .box .left .htext .text .syntaxhighlighter{margin: 15px 0 !important;display: inline-block;}
.show_page .box .left .course{background:#fff;float: left;width: 100%;padding: 80px 30px 20px;}
.show_page .box .left .course .title{font-size:20px;font-weight:600;color:#333;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #f0f0f0;display:flex;align-items:center;gap:8px;}
.show_page .box .left .course .title i{color:#ff6b6b;}
@media (max-width: 768px) {
.show_page{ float: left;width: 100%;margin-bottom: 0;padding-top: 0;margin-top: 0px;}
.show_page .box{float: left;width: 100%;background: none;border-radius: 0px;box-shadow: none;grid-template-columns: 1fr;}
.show_page .box .left{padding:20px 0;}
.show_page .box .left .htext{padding: 20px;}
.show_page .box .left .htext .h1{margin:10px 0 15px;font-size: 24px;line-height: 24px;}
.show_page .box .left .tab{justify-content: space-between;padding: 0 20px;top: 70px;box-shadow: 0 10px 10px rgba(0,0,0,0.05);}
.show_page .box .right{display: none;}
.show_page .box .left .course{padding: 20px 20px 100px;}
}


/* Course Catalog 课程目录 */
.course-catalog {background: #fff;border-radius: 8px;overflow: hidden;box-shadow: 0 2px 8px rgba(0,0,0,0.06);}
.chapter-item {border-bottom: 1px solid #f0f0f0;}
.chapter-item:last-child {border-bottom: none;}
.chapter-header {display: flex;align-items: center;padding: 16px 20px;background: #fafafa;cursor: pointer;transition: all 0.3s ease;border-bottom: 1px solid #eee;}
.chapter-header:hover {background: #f0f0f0;}
.chapter-header.active {background: #e8f4ff;}
.chapter-icon {font-size: 14px;color: #666;margin-right: 12px;transition: transform 0.3s ease;display: inline-block;}
.chapter-header.active .chapter-icon {transform: rotate(90deg);color: var(--colorone);}
.chapter-header h3 {flex: 1;font-size: 16px;font-weight: 600;color: #333;margin: 0;line-height: 1.4;}
.chapter-info {font-size: 12px;color: #999;margin-left: auto;}
.lesson-list {display: none;background: #fff;}
.lesson-list.active {display: block;}
.lesson-item {display: flex;align-items: center;padding: 12px 20px 12px 48px;border-bottom: 1px solid #f8f8f8;transition: all 0.3s ease;cursor: pointer;}
.lesson-item.cur{background: #f8f9fa;border-left: 4px solid var(--colorone);color: var(--colorone);padding-left: 44px;}
.lesson-item.cur .lesson-title{color:var(--colorone);font-weight: bold;}
.lesson-item:hover {background: #f8f9fa;}
.lesson-item:last-child {border-bottom: none;}
.lesson-item .lesson-icon {font-size: 14px;margin-right: 8px;opacity: 0.7;}
.lesson-item .lesson-title {flex: 1;font-size: 14px;color: #333;line-height: 1.4;}
.lesson-item .lesson-duration {font-size: 12px;color: #999;margin-right: 12px;font-family: 'Courier New', monospace;}
.lesson-item .lesson-status {font-size: 11px;padding: 2px 8px;border-radius: 12px;font-weight: 500;background: #f0f0f0;color: #666;}
.lesson-item .lesson-status.free {background: #e8f5e8;color: #52c41a;border: 1px solid #b7eb8f;}
.lesson-item .lesson-status.is_try {background: #e8f5e8;color: #52c41a;border: 1px solid #b7eb8f;line-height: 20px;height: 22px;padding: 0 10px;margin-right: 10px;}
/* 响应式设计 */
@media (max-width: 768px) {
.chapter-header {padding: 14px 16px;}
.chapter-header h3 {font-size: 15px;}
.chapter-info {font-size: 11px;}
.lesson-item {padding: 10px 16px 10px 40px;}
.lesson-title {font-size: 13px;}
.lesson-duration {font-size: 11px;}
.lesson-status {font-size: 10px;padding: 1px 6px;}
.lesson-item.cur {padding-left: 36px;}
}


/* 评价css */
.comment-section{background:#fff;float: left;width: 100%;padding: 80px 30px 150px;}
.comment-section .comment-title{font-size:20px;font-weight:600;color:#333;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #f0f0f0;display:flex;align-items:center;gap:8px;}
.comment-section .comment-title i{color:#ff6b6b;}
.comment-section .comment-count{color:#666;font-size:16px;font-weight:normal;}
.comment-section .comment-item{display:flex;gap:15px;padding:20px 0;border-bottom:1px solid #f5f5f5;transition:all 0.3s ease;}
.comment-section .comment-item:last-child{border-bottom:none;}
.comment-section .comment-item:hover{background:#fafafa;margin:0 -10px;padding:20px 10px;border-radius:8px;}
.comment-section .comment-avatar{flex-shrink:0;text-align:center;}
.comment-section .comment-avatar img{width:60px;height:60px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,0.1);transition:transform 0.3s ease;}
.comment-section .comment-avatar img:hover{transform:scale(1.05);}
.comment-section .user-badge{margin-top:8px;}
.comment-section .badge{padding:2px 8px;border-radius:12px;font-size:10px;font-weight:500;}
.comment-section .badge-gold{background:linear-gradient(135deg,#ffd700,#ffed4e);color:#8b6914;}
.comment-section .badge-silver{background:linear-gradient(135deg,#c0c0c0,#e8e8e8);color:#666;}
.comment-section .badge-normal{background:#e3f2fd;color:#1976d2;}
.comment-section .comment-content{flex:1;min-width:0;}
.comment-section .comment-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px;flex-wrap:wrap;gap:10px;}
.comment-section .user-info h4{margin:0;font-size:16px;font-weight:600;color:#333;line-height: 24px;}
.comment-section .user-meta{display:flex;gap:15px;margin-top:4px;flex-wrap:wrap;}
.comment-section .user-contact,
.comment-section .user-email{font-size:12px;color:#666;display:flex;align-items:center;gap:4px;}
.comment-section .comment-meta{display:flex;flex-direction:column;align-items:flex-end;gap:5px;}
.comment-section .star-rating{display:flex;align-items:center;gap:2px;}
.comment-section .star-active{color:#ffb400;}
.comment-section .star-inactive{color:#ddd;}
.comment-section .rating-text{font-size:12px;color:#666;margin-left:5px;}
.comment-section .comment-time{font-size:12px;color:#999;display:flex;align-items:center;gap:4px;}
.comment-section .comment-body{margin-bottom:15px;}
.comment-section .comment-text{line-height:1.6;color:#333;margin:0;word-break:break-word;}
.comment-section .comment-images{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap;}
.comment-section .image-item{width:80px;height:80px;border-radius:8px;overflow:hidden;cursor:pointer;transition:transform 0.3s ease;}
.comment-section .image-item:hover{transform:scale(1.05);}
.comment-section .image-item img{width:100%;height:100%;object-fit:cover;}
.comment-section .no-comments{text-align:center;padding:60px 20px;color:#666;}
.comment-section .no-comments-icon{font-size:48px;color:#ddd;margin-bottom:15px;}
.comment-section .no-comments p{font-size:16px;margin:0 0 8px 0;}
.comment-section .no-comments small{font-size:14px;color:#999;}
/* 响应式设计 */
@media (max-width:768px){
    .comment-section .comment-item{flex-direction:row;gap:12px;}
    .comment-section .comment-avatar{align-self:flex-start;}
    .comment-section .comment-avatar img{width:50px;height:50px;}
    .comment-section .comment-header{flex-direction:row;justify-content:space-between;align-items:flex-start;} 
    .comment-section .comment-meta{align-items:flex-end;} 
    .comment-section .user-meta{flex-direction:row;gap:8px;flex-wrap:nowrap;}
    .comment-section{padding: 20px 20px 100px;}
}
@media (max-width:480px){
    .comment-section{} 
    .comment-section .comment-item{padding:15px 0;}
    .comment-section .comment-title{font-size:18px;}
    .comment-section .comment-header{flex-direction:row;justify-content:space-between;}
    .comment-section .user-meta{flex-direction:row;gap:6px;flex-wrap:nowrap;}
    .comment-section .user-contact,.comment-section .user-email{font-size:11px;}
}


.cartheaderWrap{width:100%;height:110px;float: left;margin-top: 90px;}
.cartheader{width:100%;height:110px;float: left;}
.cartheader h1{float:left;margin-top: 36px;}
.cartheader h1 a{float:left;}
.cartheader h1 a img{float: left;height: 34px;}
.cartheader .cartip{width: 42px;height: 38px;float: right;background: url(../Images/cartip.png) no-repeat;line-height: 38px;color: var(--colorone);font-size: 20px;margin-top: 35px;width: 397px;}
.cartheader .process{float: right;margin-top: 40px;}
.cartheader .process span{float: left;line-height: 40px;color: #fff;background: #aaa;margin-left: 1px;padding: 0 30px;}
.cartheader .process span.cur{background: var(--colorone);}
.cartheader .process a{float: left;line-height: 40px;color: #fff;background: #aaa;margin-right: 10px;padding: 0 30px;border-radius: 4px;}
@media (max-width: 768px) {
.cartheaderWrap{display: none;}
.cartheader .process{display: none;}
}


/* 购物车 */
.cartpage{float: left;width: 100%;margin-bottom: 40px;}
.cartpage .box{float: left;width: 100%;background: #fff;}
.cartpage .selectCate{float: left;width: 100%;margin: 0px 0 20px;padding: 0 15px;}
.cartpage .selectCate .titles{float: left;width: 100%;line-height: 40px;background: #eee;height: 40px;}
.cartpage .selectCate .hr{float: left;width: 100%;margin: 20px 0 0;}
.cartpage .selectCate label{float: left;height: 20px;}
.cartpage .selectCate label span{float: left;height: 20px;line-height: 20px;margin-right: 10px;}
.cartpage .selectCate label input{float: left;margin-right: 4px;}
.cartpage .selectCate b{float: left;height: 20px;line-height: 20px;margin-right: 10px;}
.cartpage .selectCate .submitBox{float: left;width: 100%;padding: 15px 0 0 0;}
.cartpage .selectCate .submitBox .sub{float: left;color: #fff;line-height: 34px;height: 36px;padding: 0 30px;border-radius: 4px;background: #fa0;border: none;font-size: 14px;}
.cartpage .selectCate .submitBox .no{float: left;color: #666;line-height: 34px;height: 36px;padding: 0 30px;border-radius: 4px;background: #ccc;border: none;font-size: 14px;margin-left: 20px;}
.cartpage .selectbox{float: left;width: 100%;margin: 20px 0;display: none;}
.cartpage .title{float: left;width: 100%;line-height: 60px;background: #ddd;height: 60px;font-size: 16px;text-indent: 20px;border-top: 1px solid #eee;color: #999;}
.cartpage .title b{font-size: 15px;font-weight: bold;color: #333;}
.cartpage .cartlist{float: left;width:100%;}
.cartpage .cartlist .li{float: left;width:100%;border-bottom: 1px dashed #eee;padding: 20px 15px;display: grid;grid-template-columns:50px 1fr 100px 30px;gap: 10px;}
.cartpage .cartlist .li .carlistimg{float: left;height: 50px;width: 50px;border-radius: 6px;overflow: hidden;padding: 4px;box-shadow: 0 0px 10px rgba(0,0,0,0.1);margin-top: 4px;}
.cartpage .cartlist .li .goodinfo{float: left;}
.cartpage .cartlist .li .goodinfo .carlisttitle{float: left;line-height: 24px;display: flex;flex-direction: column;}
.cartpage .cartlist .li .goodinfo .carlisttitle b{font-weight: normal;font-size: 14px;margin-bottom: 8px;}
.cartpage .cartlist .li .goodinfo .carlisttitle i{font-style: normal;color: var(--colortwo);font-size: 20px;font-family: 'MB';}
.cartpage .cartlist .li .goodinfo .carlisttitle i::before{content: '￥';font-size: 12px;}
.cartpage .cartlist .li .carlistprice{float: left;line-height:32px;}
.cartpage .cartlist .li .cartlistnumbox{float: left;background:#fff;box-shadow: 0 0px 10px rgba(0,0,0,0.1);height: 36px;overflow: hidden;padding: 2px;border-radius: 36px;display: flex;flex-direction: row;text-align: center;justify-content: center;}
.cartpage .cartlist .li .cartlistnumbox .numinput{border:none;height:32px;padding: 0;width:32px;float: left;color: var(--colorone);text-align: center;text-indent: 0;line-height: 32px;font-family: 'MB';font-weight: bold;}
.cartpage .cartlist .li .cartlistnumbox .numleft{border:none;height:32px;padding:0;width:32px;float: left;color: #444;text-align: center;text-indent: 0;border-right: 0;line-height: 30px;background: #eee;cursor: pointer;border-radius: 32px;overflow: hidden;}
.cartpage .cartlist .li .cartlistnumbox .numright{border:none;height:32px;padding:0;width:32px;float: left;color: #444;text-align: center;text-indent: 0;border-left: 0;line-height: 30px;background: #eee;cursor: pointer;border-radius: 32px;overflow: hidden;}
.cartpage .cartlist .li .cartlistdel{float: right;display: flex;justify-content: center;padding-top: 6px;}
.cartpage .cartlist .li .cartlistdel span{font-size: 18px;color: red;}
.cartpage .cartlist .li .giftcheckbox{float:right;margin:8px 8px 0 0;}
.cartpage .cartlist .li .gift_id{float:right;margin:8px 8px 0 0;}
.cartpage .cartSum{float: left;width: 100%;background: #fff;padding: 15px;}
.cartpage .cartSum .totalprice{height:40px;line-height:40px;float: right;margin: 10px 10px 10px 0;}
.cartpage .cartSum .totalprice b{color: #d00;font-size: 24px;float: left;line-height: 40px;margin-right: 10px;}
.cartpage .cartSum .totalprice span{color: #666;font-size:13px;float: left;line-height: 40px;margin-top: 0;}
.cartpage .cartSum .go{height:60px;line-height:60px;float: right;background: var(--colorone);color: #fff;padding: 0 60px;font-size: 20px;border-radius: 6px;border: none;}
.cartpage .cartSum .nologin{height:60px;line-height:60px;float: right;background: #aaa;color: #fff;padding: 0 60px;font-size: 20px;border-radius: 6px;}
.cartpage .cartSum #carlistdelall{float: left;color: #dd3300;font-size: 14px;height: 40px;line-height: 40px;margin: 10px 0 0;}
.cartpage .html{float: left;width:100%;margin: 0px 0px;padding: 0px 0px;background: #fff; }
.cartpage .html .lih{float: left;width:100%;background: #eee;}
.cartpage .html .lih .c1{float: left;width: 10%;line-height: 36px;padding: 0 0 0 15px;height: 36px;}
.cartpage .html .lih .c2{float: left;width: 30%;line-height: 36px;padding: 0 0 0 15px;height: 36px;}
.cartpage .html .lih .c3{float: left;width: 25%;line-height: 36px;padding: 0 0 0 15px;height: 36px;}
.cartpage .html .lih .c4{float: left;width: 10%;line-height: 36px;padding: 0 0 0 15px;height: 36px;}
.cartpage .html .lih .c5{float: left;width: 10%;line-height: 36px;padding: 0 0 0 15px;height: 36px;}
.cartpage .html .lih .c6{float: left;width: 10%;line-height: 36px;padding: 0 0 0 15px;height: 36px;}
.cartpage .html .lic{float: left;width:100%;border-bottom: 1px solid #eee;padding: 10px 0;}
.cartpage .html .lic .c1{float: left;width: 10%;line-height: 36px;padding: 0 0 0 15px;height: 36px;}
.cartpage .html .lic .c1 .carlistimg{height: 36px;}
.cartpage .html .lic .c2{float: left;width: 30%;line-height: 16px;padding: 2px 0 2px 15px;height: 36px;}
.cartpage .html .lic .c2 .carlisttitle{float: left;width: 100%;line-height: 16px;margin-left: 0;}
.cartpage .html .lic .c2 .gg{float: left;width: 100%;line-height: 16px;color: #aaa;}
.cartpage .html .lic .c3{float: left;width: 25%;padding: 0 0 0 15px;height: 36px;line-height: 36px}
.cartpage .html .lic .c4{float: left;width: 10%;line-height: 36px;padding: 0 0 0 15px;height: 36px;}
.cartpage .html .lic .c5{float: left;width: 10%;line-height: 36px;padding: 0 0 0 15px;height: 36px;}
.cartpage .html .lic .c6{float: left;width: 10%;line-height: 36px;padding: 0 0 0 15px;height: 36px;}
.cartpage .html .lic .c4 .cartlistnumbox{float: left;margin: 5px 0 0 0px;}
.cartpage .html .lic .c4 .cartlistnumbox .numinput{border:1px solid #ddd;height:26px;padding:4px 0;width:32px;float: left;color: #aaa;text-align: center;text-indent: 0;}
.cartpage .html .lic .c4 .cartlistnumbox .numleft{border:1px solid #ddd;height:26px;padding:00 0;width:20px;float: left;color: #ddd;text-align: center;text-indent: 0;border-right: 0;line-height: 24px;}
.cartpage .html .lic .c4 .cartlistnumbox .numright{border:1px solid #ddd;height:26px;padding:00 0;width:20px;float: left;color: #ddd;text-align: center;text-indent: 0;border-left: 0;line-height: 24px;}
.cartpage .html .lib{float: left;width:100%;padding: 15px 0;}
.cartpage .html .lib .c1{float: left;width: 35%;line-height: 40px;padding: 0 0 0 15px;height: 40px;}
.cartpage .html .lib .c2{float: left;width: 65%;line-height: 40px;padding: 0 15px 0 15px;height: 40px;text-align: right;}
.cartpage .html .lib .c2 .nologin{float: right;line-height: 40px;border: none;background: #aaa;color: #fff;padding: 0 20px;border-radius: 4px;}
.cartpage .html .lib .c2 .go{float: right;line-height: 40px;border: none;background: #dd3300;color: #fff;padding: 0 20px;border-radius: 4px;}
.cartpage .html .lib .c2 .totalprice{float: right;line-height: 40px;color: #999;margin-right: 10px;}
.cartpage .html .lib .c2 .totalprice b{color: #dd3300;}
.cartpage .c{float: left;width:100%;margin: 0px 0px;padding: 0px 0px;background: #fff; }
.cartpage .c .table{width:100%;margin:0px 0px 0;vertical-align:middle;color:#000;font-size:12px;}
.cartpage .c .table a{color:#000;}
.cartpage .c .table th{height:40px;text-align:left;text-indent:30px;background:#e8e8e8;}
.cartpage .c .table td{height:40px;text-align:left;text-indent:30px;background:#f6f6f6;border-spacing: 0px;}
.cartpage .c .table th{font-weight:normal;}
.cartpage .c .table .td{background:#e1e1e1;}
.cartpage .c .tableborder{width:100%;margin:0px 0px 0;vertical-align:middle;color:#000;font-size:12px;border: 1px solid #eee;border-bottom: none;}
.cartpage .c .tableborder a{color:#555;}
.cartpage .c .tableborder th{height:40px;text-align:left;background:#f4f4f4;padding:0px 6px;}
.cartpage .c .tableborder td{height:40px;text-align:left;background:#fff;border-spacing: 0px;padding:10px 0 10px 6px;border-bottom: 1px solid #eee;}
.cartpage .c .tableborder2{width:100%;margin:0px 0px 0;vertical-align:middle;color:#000;font-size:12px;}
.cartpage .c .tableborder2 a{color:#000;}
.cartpage .c .tableborder2 th{height:30px;text-align:left;background:#f4f4f4;padding:3px 6px;border-bottom: 1px solid #eee;}
.cartpage .c .tableborder2 td{height:30px;text-align:left;background:#fff;border-spacing: 0px;padding:3px 6px;border-bottom: 1px solid #eee;}
.cartpage .c .totalprice{height:36px;line-height:36px;float: right;margin: 10px 10px 10px 0;}
.cartpage .c .totalprice b{color: #dd3300;font-size: 14px;font-style: normal;}
.cartpage .c .tableborder .nologin{float: right;height: 36px;font-size: 14px;text-align: center;;line-height: 36px;background: #ddd;margin-left: 20px;text-indent: 0;color: #fff;padding: 0 35px;margin: 10px 0;}
.cartpage .c .tableborder .go{float: right;height: 36px;font-size: 14px;text-align: center;;line-height: 36px;background: #dd3300;color: #fff;padding: 0 10px;margin: 10px 0 10px 5px;}
.cartpage .c .contentTitle{float: left;width: 100%;line-height: 40px;border-bottom: 1px dotted #ddd;font-size: 14px;color: #666;font-weight: bold;}
.cartpage .c .box{float: left;width: 100%;line-height: 30px;margin: 0px 0 0px;padding: 20px 0;}
.cartpage .c .box label{margin-bottom: 10px;}
.cartpage .c .activity_apply{float: left;width: 1160px;padding:30px 20px;background: #f4f4f4;line-height: 30px;}
.cartpage .c .activity_apply p{float: left;width: 100%;margin: 0 0 10px 0;}
.cartpage .c .activity_apply span{float: left;width: 80px;}
.cartpage .c .activity_apply p .select{width: 120px;line-height: 18px;text-indent: 5px;font-size: 12px;border: 1px solid #ddd;padding: 5px;color: #888;}
.cartpage .c .activity_apply p input{width: 400px;line-height: 18px;text-indent: 5px;font-size: 12px;border: 1px solid #ddd;padding: 5px;color: #888;}
.cartpage .c .activity_apply p input.short{width: 150px;}
.cartpage .goodlist{float: left;width:100%;padding: 20px 20px 0;}
.cartpage .goodlist .li{float: left;width:100%;border-bottom: 1px dashed #eee;padding: 20px 0;display: grid;grid-template-columns: 60px 1fr 200px;}
.cartpage .goodlist .li:last-child{border-bottom:none}
.cartpage .goodlist .li img{float: left;height: 50px;width: 50px;border-radius: 6px;}
.cartpage .goodlist .li .goodinfo{position: relative;min-height: 50px;}
.cartpage .goodlist .li .goodinfo b{font-weight: bold;line-height: 24px;font-size: 16px;word-break:break-all;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
.cartpage .goodlist .li .goodinfo span{float: left;margin-right: 10px;}
.cartpage .goodlist .li .carlistprice{line-height:24px;text-align: right;}
.cartpage .goodlist .li .carlistprice b{color:var(--colorred)}
.cartpage .goodlist .li .carlistprice b::before{content: '￥';font-size: 10px;}
@media (max-width: 768px) {
.cartpage{margin-top: 70px;}
.cartpage .goodlist{padding-top: 0;}
.cartpage .goodlist .li{border-bottom: 1px dashed #eee;padding:20px 0;position: relative;}
.cartpage{float: left;width: 100%;padding:0 0;}
.cartpage .c .box{padding: 10px;}
.cartpage .c .tableborder .go{margin-right: 0px;margin-left: 0;}
.cartpage .c .totalprice{margin: 10px 5px 10px 0;}
.cartpage .selectCate{float: left;width: 100%;margin: 0px 0 10px;padding: 0 15px;}
.cartpage .selectCate .hr{float: left;width: 100%;margin: 10px 0 10px;border-bottom: 1px dashed #ddd;}
.cartpage .selectCate label{float: left;height: 24px;overflow: hidden;margin: 0 10px 0 0;}
.cartpage .selectCate label span{float: left;height: 24px;line-height: 24px;margin-right: 0px;}
.cartpage .selectCate label input{float: left;margin-right: 4px;margin-left: 1px;}
.cartpage .selectCate b{float: left;height: 24px;line-height: 24px;margin-right: 10px;width: 100%;}
.cartpage .selectCate .submitBox{float: left;width: 100%;padding: 5px 0 10px 0;text-align: center;}
.cartpage .selectCate .submitBox .sub{float: left;color: #fff;line-height: 34px;height: 36px;padding: 0 0px;border-radius: 4px;background: #fa0;border: none;font-size: 14px;width: 48%;}
.cartpage .selectCate .submitBox .no{float: right;color: #666;line-height: 34px;height: 36px;padding: 0 0px;border-radius: 4px;background: #ccc;border: none;font-size: 14px;margin-left: 0px;width: 48%;}
.cartpage .html{float: left;width:100%;margin: 0px 0px;padding: 0px 0px;background: #fff; }
.cartpage .html .lih{float: left;width:100%;background: #eee;}
.cartpage .html .lih .c1{float: left;width: 12%;line-height: 36px;padding: 0 0 0 5px;height: 36px;}
.cartpage .html .lih .c2{float: left;width: 36%;line-height: 36px;padding: 0 0 0 5px;height: 36px;}
.cartpage .html .lih .c3{float: left;width: 16%;line-height: 36px;padding: 0 0 0 5px;height: 36px;}
.cartpage .html .lih .c4{float: left;width: 26%;line-height: 36px;padding: 0 0 0 5px;height: 36px;}
.cartpage .html .lih .c5{float: left;width: 12%;line-height: 36px;padding: 0 0 0 5px;height: 36px;display: none;}
.cartpage .html .lih .c6{float: left;width: 6%;line-height: 36px;padding: 0 0 0 5px;height: 36px;}
.cartpage .html .lic{float: left;width:100%;border-bottom: 1px solid #eee;padding: 10px 0;}
.cartpage .html .lic .c1{float: left;width: 12%;line-height: 36px;padding: 0 0 0 5px;height: 36px;}
.cartpage .html .lic .c2{float: left;width: 36%;line-height: 36px;padding: 2px 0 2px 5px;height: 36px;line-height: 16px;}
.cartpage .html .lic .c3{float: left;width: 16%;padding: 0 0 0 5px;height: 36px;}
.cartpage .html .lic .c4{float: left;width: 26%;line-height: 36px;padding: 0 0 0 5px;height: 36px;}
.cartpage .html .lic .c5{float: left;width: 12%;line-height: 36px;padding: 0 0 0 5px;height: 36px;display: none;}
.cartpage .html .lic .c6{float: left;width: 6%;line-height: 36px;padding: 0 0 0 5px;height: 36px;}
.cartpage .html .lic .c4 .cartlistnumbox{float: left;margin: 5px 0 0 0px;}
.cartpage .html .lic .c4 .cartlistnumbox .numinput{border:1px solid #ddd;height:26px;padding:4px 0;width:32px;float: left;color: #aaa;text-align: center;text-indent: 0;}
.cartpage .html .lic .c4 .cartlistnumbox .numleft{border:1px solid #ddd;height:26px;padding:00 0;width:20px;float: left;color: #ddd;text-align: center;text-indent: 0;border-right: 0;line-height: 24px;}
.cartpage .html .lic .c4 .cartlistnumbox .numright{border:1px solid #ddd;height:26px;padding:00 0;width:20px;float: left;color: #ddd;text-align: center;text-indent: 0;border-left: 0;line-height: 24px;}
.cartpage .html .lib{float: left;width:100%;padding: 15px 0;}
.cartpage .html .lib .c1{float: left;width: 35%;line-height: 40px;padding: 0 0 0 15px;height: 40px;}
.cartpage .html .lib .c2{float: left;width: 65%;line-height: 40px;padding: 0 15px 0 15px;height: 40px;text-align: right;}
.cartpage .html .lib .c2 .nologin{float: right;line-height: 40px;border: none;background: #aaa;color: #fff;padding: 0 20px;border-radius: 4px;}
.cartpage .html .lib .c2 .go{float: right;line-height: 40px;border: none;background: #dd3300;color: #fff;padding: 0 20px;border-radius: 4px;}
.cartpage .html .lib .c2 .totalprice{float: right;line-height: 40px;color: #999;margin-right: 10px;}
.cartpage .html .lib .c2 .totalprice b{color: #dd3300;}
.cartpage .cartlist .li{border-bottom: 1px dashed #eee;padding:10px 20px;position: relative;}
.cartpage .cartlist .li .goodinfo{float: left;width:100%;}
.cartpage .cartlist .li .goodinfo .carlistimg{float: left;height: 50px;width: 50px;border-radius: 6px;overflow: hidden;margin-right: 6px;}
.cartpage .cartlist .li .goodinfo .carlisttitle{float: left;line-height: 20px;}
.cartpage .cartlist .li .goodinfo .carlisttitle b{font-weight: bold;font-size: 12px;position: absolute;width: 100%;}
.cartpage .cartlist .li .goodinfo .carlisttitle i{display:block;}
.cartpage .cartlist .li .carlistprice{display: none;}
.cartpage .cartlist .li .cartlistnumbox{float: left;width: auto;position: absolute;z-index: 2;top: 10px;right:55px;}
.cartpage .cartlist .li .cartlistnumbox .numinput{border:1px solid #eee;height:36px;padding:4px 0;width:36px;float: left;color: #aaa;text-align: center;text-indent: 0;}
.cartpage .cartlist .li .cartlistnumbox .numleft{border:1px solid #eee;height:36px;padding:0;width:30px;float: left;color: #ddd;text-align: center;text-indent: 0;border-right: 0;line-height: 30px;background: #fafafa}
.cartpage .cartlist .li .cartlistnumbox .numright{border:1px solid #eee;height:36px;padding:0;width:30px;float: left;color: #ddd;text-align: center;text-indent: 0;border-left: 0;line-height: 30px;background: #fafafa}
.cartpage .cartlist .li .cartlistdel{float: right;padding: 0 8px;position: absolute;top:10px;right: 8px;}
.cartpage .cartlist .li .giftcheckbox{position: absolute;top: 20px;right: 8px;}
.cartpage .cartlist .li .gift_id{position: absolute;top: 20px;right: 8px;}
.cartpage .cartSum{float: left;width: 100%;background: #fff;padding: 10px 0px 10px 20px;}
.cartpage .cartSum .totalprice{height:40px;line-height:40px;float: right;margin: 5px 10px 5px 0;}
.cartpage .cartSum .totalprice b{color: #d00;font-size: 17px;float: left;line-height: 40px;margin-right: 4px;}
.cartpage .cartSum .totalprice span{color: #666;font-size:12px;float: left;line-height: 40px;margin-top: 0;}
.cartpage .cartSum .go{height:50px;line-height:50px;float: right;background: var(--colorone);color: #fff;padding: 0 20px 0 30px;font-size: 16px;border-radius: 6px 0 0 6px;}
.cartpage .cartSum .nologin{height:50px;line-height:50px;float: right;background: #aaa;color: #fff;padding: 0 40px 0 30px;font-size: 18px;border-radius: 6px 0 0 6px;}
.cartpage .cartSum #carlistdelall{float: left;color: #aaa;font-size: 14px;height: 40px;line-height: 40px;margin: 5px 0 0;text-indent: 0;padding-top: 0;text-align: center;}
.cartpage .title{line-height: 50px;height: 50px;font-size: 16px;text-indent: 20px;}
.cartpage .title b{font-size: 14px;font-weight: bold;color: #333;}
}

/*购物车地直选择*/
.cartAddress{float: left;width: 100%;padding: 20px;position: relative;z-index: 100;border-bottom: 3px solid #eee;}
.cartAddress .con{float: left;width: 100%;}
.cartAddress .con span{float: left;line-height: 50px;font-size: 20px;width: 30px;color: #d00;}
.cartAddress .con .text{float: left;width: 70%;}
.cartAddress .con .text b{float: left;width: 100%;font-size: 15px;line-height: 24px;margin-bottom: 5px;color: #333;}
.cartAddress .con .text p{float: left;width: 100%;font-size: 12px;line-height: 20px;color: #666;word-wrap:break-word;}
.cartAddress .con a{float: right;}
.cartAddress .con a span{float: right;}
.cartAddress .con a img{float: right;height: 20px;margin-top: 10px;}
.cartAddress .b{float: left;width: 100%;}
.cartAddress .b img{float: left;width: 100%;}
@media (max-width: 768px) {
.cartAddress{margin-bottom: 0;box-shadow: 0 10px 10px rgba(0,0,0,0.05);}
.cartAddress .con{padding:0;}
}

.sumbox{float: left;width: 100%;margin: 20px 0;background: #fafafa;padding:10px 20px;font-weight: bold;}
.sumbox .huopin{float: left;line-height: 24px;margin-right: 20px;}
.sumbox .huopin b{float: left;font-weight: bold;}
.sumbox .yunfei{float: left;line-height: 24px;}
.sumbox .yunfei b{float: left;font-weight: bold;}
@media (max-width: 768px) {
.sumbox{float: left;width: 100%;margin:0 0 20px;border: none;padding: 10px 20px;}
.sumbox .huopin{float: left;line-height: 24px;margin-right: 20px;border: none;}
.sumbox .huopin b{float: left;font-weight: bold;}
.sumbox .yunfei{float: right;line-height: 24px;border:none;}
.sumbox .yunfei b{float: left;font-weight: bold;}
}
/* paymethod */
.paymethodt{float: left;width: 100%;margin: 0 0 15px;padding: 0px 20px;}
.paymethod{float: left;width: 100%;margin: 0 0 20px;}
.pay_method_box{float: left;width: 100%;margin: 0 0 20px 0;padding: 0 20px;}
.pay_method_box label{float: left;height: 60px;border: 1px solid #eee;margin: 0 10px 0 0;display: flex;flex-direction: row;justify-items: center;padding: 14px 25px 14px 18px;justify-content: space-between;border-radius: 6px;}
.pay_method_box label input{margin: 0 10px 0 0;}
.pay_method_box label span{font-size: 20px;line-height:30px;margin-right: 10px;}
.pay_method_box label i{line-height:30px;font-style: normal;font-size: 16px;font-weight: bold;}
.pay_method_box label em{font-size: 13px;line-height:30px;font-style: normal;font-weight: normal;color: #333;}
.pay_method_box .weixinpay{background: #eaf3ef;border-color: #a6ddcb;}
.pay_method_box .weixinpay span{font-size: 30px;color: #22a766;}
.pay_method_box .alipay span{font-size: 26px;color: #1193f1;}
.pay_method_box .alipay{margin-right: 0;background: #e1f3ff;border-color:#b6dffd}
.pay_method_box .deduction{background: #eaf3ef;border-color: #a6ddcb;}
.pay_method_box .deduction span{font-size: 16px;color: #22a766;font-weight: bold;}
.pay_method_box .deduction i{font-size: 14px;color: #333;}
@media (max-width: 768px) {
    .pay_method_box .deduction{margin-bottom: 10px;width: 100%;justify-content: flex-start;}
}

.order_note_wrap{width:100%;float: left;padding:0 20px 20px;}
.order_note{width:100%;float: left;height: 80px;padding: 10px;color: #888;background: #fafafa;box-shadow: 0 0 6px inset  rgba(0,0,0,0.05);border: none;border-radius: 5px;}
@media (max-width: 768px) {
.order_note_wrap{padding: 0 20px 20px;margin-bottom: 150px;}
.order_note{height: 80px;}
.order_note::-webkit-input-placeholder { color: #ccc;}
.order_note:-ms-input-placeholder {color: #ccc;}
.order_note::placeholder {color: #ccc;}
}

#company_name{float: left;width: 100%;}
.contentOrder{float: left;width: 100%;padding:20px;background: #fafafa;display: grid;grid-template-columns: 2fr auto;align-items: center;}
.contentOrder .submit{float: right;height: 70px;border: none;background: var(--colorone);font-size: 18px;color: #fff;padding: 0 80px;font-weight: bold;border-radius: 0 70px 70px 0;}
.contentOrder p{line-height:30px;float: left;font-size: 13px;margin-right: 20px;}
.contentOrder p b{color: var(--colorone);}
.contentOrder p i{color: var(--colorone);font-size: 20px;font-weight: bold;font-style: normal;}
@media (max-width: 768px) {
.contentOrder{float: left;width: 100%;margin: 0px 0 0px;padding:0 20px 20px;background: #fff;grid-template-columns: 1fr;position: fixed;bottom: 0px;left: 0px;width: 100%;box-shadow: 0 -5px 10px rgba(0,0,0,0.05);z-index: 999;}
.contentOrder .submit{float: right;height: 60px;border: none;background: var(--colorone);font-size: 18px;color: #fff;padding:0 30px;font-weight: bold;border-radius:6px;margin-top: 10px;}
.contentOrder p{line-height:26px;float: left;font-size: 13px;margin-right: 0px;width: 100%;margin: 10px 0;}
.contentOrder p b{color: var(--colorone);}
.contentOrder p i{color: var(--colorone);font-size: 20px;font-weight: bold;font-style: normal;}
}

 /* filter_1 */
.filter_1{float: left;width: 100%;background: #fff;position: sticky;top: 90px;margin: 0 0 40px 0;box-shadow: 0 10px 10px rgba(0,0,0,0.0);border-radius: 0 0 10px 10px;z-index: 999;}
.filter_1 .t{float: left;width: 100%;line-height: 40px;background: #ddd;text-indent: 30px;font-size: 14px;color: #666;margin-bottom: 35px;}
.filter_1 .title{float: left;width: 100%;background: #f4f4f4;padding: 0 15px;line-height: 44px;border-bottom: 1px solid #eee;display: none;}
.filter_1 .c{float: left;width: 100%;line-height: 30px;padding: 35px 15px 15px;}
.filter_1 .c span{float: left;width: 60px;color: #666;margin-bottom: 6px;}
.filter_1 .c .select{float: left;width: 100px;height: 30px;border: 1px solid #eee;margin: 0 10px 0 0;}
.filter_1 .c .box{float: left;width: 100%;display: grid;grid-template-columns: 80px 1fr;margin-bottom: 10px;}
.filter_1 .c .box .lil{}
.filter_1 .c .box .lir{}
.filter_1 .c .box em{float: left;color: #ddd;font-style: normal;margin: 0 6px 6px;}
.filter_1 .c .box a{float: left;color: #222;padding: 0 6px;margin-bottom: 8px;margin-right: 6px;background: #f4f4f4;border-radius: 3px;font-size: 12px;}
.filter_1 .c .box a.pa{color: #222;background: #f4f4f4;}
.filter_1 .c .box a.cur{color: #fff;background: #000;}
.filter_1 .c .box a:hover{color: #fff;background: #000;}
.filter_1 .filter_toggle{float: right;cursor: pointer;transition: all 0.3s ease;display: flex;align-items: center;justify-content: space-between;font-size: 14px;color: #495057;font-weight: 500;}
.filter_1 .filter_toggle span{margin-left: 6px;}
.filter_1 .filter_toggle .toggle_text{flex: 1;text-align: center;}
.filter_1 .filter_toggle .toggle_text{flex: 1;text-align: center;}
.filter_1 .cons{overflow: hidden;transition: all 0.3s ease;display: block;padding: 0;margin: 0;float: left;}
.filter_1 .reset{display: grid;grid-template-columns: auto auto;width: 100%;    align-items: center;padding: 0 15px 40px 15px;justify-content: space-between;}
.filter_1 .reset a{float: left;width: 150px;padding: 0 20px;line-height: 36px;border: none;}
.filter_1 .reset form{float: right;}
 @media (max-width: 768px) {
.filter_1{top: 74px;margin: 74px 0 0 0;box-shadow: 0 10px 10px rgba(0,0,0,0.03);}
.filter_1 .title{padding: 0 15px;display: block;}
.filter_1 .c{padding: 25px 15px 15px;}
.filter_1 .c .box{grid-template-columns: 70px 1fr;}
.filter_1 .cons{display: none;}
.filter_1 .reset{grid-template-columns: 1fr;}
.filter_1 .reset a{width: 100px;}
.filter_1 .reset form{display: none;}
}


/*page_index*/
.page_index{ float: left;width: 100%;margin-bottom: 60px;}
.page_index .cate{width: 100%;float: left;position: relative;margin-bottom: 60px;background: #ddd;padding: 20px 0;}
.page_index .cate .list{float:left; }
.page_index .cate .list a{height: 60px;line-height: 60px;color: #000;float: left;font-size: 20px;margin-right: 30px;font-weight: bold;font-family: 'MB';}
.page_index .cate .list a.cur{color: var(--colorone)}
.page_index .cate form{float: right;width:400px;max-width: 60%;height: 60px;border-bottom: 2px solid #888;display: flex;}
.page_index .cate form .input{flex:1;background: none;border: none;outline: none;color: #888;line-height: 60px;margin: 0;padding: 0;float: left;height: 60px;font-size: 15px;}
.page_index .cate form button{float: right;color: #000;font-size: 48px;line-height: 60px;height: 60px;background: none;border: none;margin: 0;padding: 0;width: 60px;text-align: center;}
.page_index .cate form button span{line-height: 60px;top: 0;font-size: 24px;color: #000;vertical-align: top;display: inline-block;}
.page_index .box{float: left;width: 100%;padding: 0 15px;}
.page_index .box .ul{float: left;width:100%;font-size:13px;display: grid;justify-content: start;flex-wrap: wrap;grid-template-columns: 1fr 1fr 1fr 1fr;gap: 30px;margin-bottom:20px;}
.page_index .box .ul a{width: 100%;float: left;position: relative;text-align: left;overflow: hidden;background: #fff;display: flex;transition: 0.5s;flex-direction: column;    height: 100%;border-radius: 10px;}
.page_index .box .ul a .img{float: left;width: 100%;aspect-ratio: 3/2;position: relative;}
.page_index .box .ul a .img span{position: absolute;right: 10px;top: 10px;width: 40px;height: 30px;border-radius: 30px 0 30px 30px;background: linear-gradient(45deg,#f70,#ffc979);text-align: center;line-height: 30px;color: #fff;font-size: 12px;}
.page_index .box .ul a .img span.span_2{background: linear-gradient(45deg,var(--colorone),#8481ff);}
.page_index .box .ul a .img img{float: left;width: 100%;aspect-ratio: 3/2;border-radius: 10px 10px 0 0;}
.page_index .box .ul a .r{flex:1;float: right;padding:10px;transition: 0.5s;}
.page_index .box .ul a .r b{float: left;width: 100%;transition: 0.5s;line-height: 20px;font-size: 15px;color:var(--themeone);font-family: 'MB';word-break: break-all;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;font-weight: normal;}
.page_index .box .ul a .r p{float: left;width: 100%;transition: 0.5s;font-family: 'ML';margin-top: 10px;font-size: 14px;line-height: 24px;display: flex;    align-items: end;}
.page_index .box .ul a .r p span:first-child{color: #f00;font-size: 20px;font-weight: bold;font-family: 'MB';margin-right: 5px;}
.page_index .box .ul a .r p span:first-child::before{content: '￥';font-size: 12px;color: #f00;margin-right: 3px;}
.page_index .box .ul a .r p span:last-child{color: #333;font-size: 11px;}
.page_index .box .ul a .r p span:last-child::before{content: '￥';}
.page_index .box .ul a:hover{background: var(--colorone)}
.page_index .box .ul a:hover .r b,
.page_index .box .ul a:hover .r span,
.page_index .box .ul a:hover .r p{color: #fff;}
.page_index .box .ul a:hover .r p span{color: #fff;}
.page_index .box .ul a:hover .r p span::before{color: #fff;}
.page_index .content{float: left;width: 100%;line-height: 24px;font-size: 13px;}
.page_index .content .htext{float: left;width: 100%;}
.page_index .content .htext .h1{float: left;width: 100%;margin:30px 0 15px;line-height: 30px;font-size: 30px;font-weight: bold;}
.page_index .content .htext .h1 .w3c:hover{color: #fff;background: var(--themecolor);padding: 0 30px 0 50px;}
.page_index .content .htext .info{float: left;width: 100%;line-height: 30px;margin-bottom: 10px;color: #aaa;}
.page_index .content .htext .price{float: left;width: 100%;padding-bottom: 20px;border-bottom: 1px solid #ddd;margin-bottom: 40px;}
.page_index .content .htext .price b{float: left;line-height: 50px;font-size: 30px;color: var(--colorone);}
.page_index .content .htext .price a{float: right;line-height: 50px;background: var(--colorone);color: #fff;border-radius: 6px;color: #fff;padding: 0 20px;font-size: 18px;font-weight: bold;}
.page_index .content .htext .text{float: left;width: 100%;line-height: 30px;font-size: 15px;}
.page_index .content .htext .text img{max-width: 100%;}
.page_index .content .htext .text h1{float: left;width: 100%;line-height: 60px;font-size: 36px;margin: 0 0 20px;padding: 0 0 15px;font-weight: bold;border-bottom: 3px dashed #eee;}
.page_index .content .htext .text h2{float: left;width: 100%;line-height: 60px;font-size: 24px;margin: 0 0 10px;padding: 0;font-weight: bold;}
.page_index .content .htext .text h3{float: left;width: 100%;line-height: 40px;font-size: 18px;margin: 0 0 10px;padding: 0;font-weight: bold;}
.page_index .content .htext .text blockquote{float: left;width: 100%;line-height: 30px;font-size: 15px;margin: 5px 0;padding: 15px;background: #fafafa;margin:  0 0 15px;}
.page_index .content .htext .text blockquote p{color: #999;}
.page_index .content .htext .text .syntaxhighlighter{margin: 15px 0 !important;display: inline-block;}
@media (max-width: 768px) {
.page_index{ float: left;width: 100%;margin-bottom: 40px;}
.page_index .cate{display: none;}
.page_index .box{float: left;width: 100%;background: none;border-radius: 0px;padding:20px 10px;box-shadow: none;}
.page_index .box .ul{grid-template-columns: 1fr 1fr;gap: 10px;}
.page_index .box .ul li{}
.page_index .box .ul li:nth-child(3n){margin-right: 0}
.page_index .box .ul li .info{padding:15px 15px 20px;}
.page_index .box .ul li .info .tit{font-size: 16px;line-height: 24px;}
.page_index .box .ul li .info .time{line-height: 30px;font-size: 14px;;}
.page_index .box .ul li .info p{font-size: 14px;line-height: 20px;transition:0.5s;margin-bottom: 15px;}
.page_index .box .ul li .info i{font-size: 14px;line-height:32px;padding: 0 15px;}
.page_index .box .ul li:hover .desc{color: var(--colorone)}
.page_index .box .ul li:hover p{color: var(--colorone)}
.page_index .box .ul li:hover i{background: var(--colorone);color: #fff;border: 1px solid var(--colorone);}
.page_index .box .ul li:hover .img img{transform: scale(1.1);}
.page_index .content{padding:20px;}
}

.good_show_fixed_bar{position: fixed;bottom: 0;left: 0;color: #000;z-index: 222;width: 100%;display: none;justify-content: center;}
.good_show_fixed_bar .box{width: 100%;max-width: 640px;box-shadow: 0 -10px 10px rgba(0,0,0,0.1);background: #fff;}
.good_show_fixed_bar .box .ttt{float: left;width: 100%;line-height: 20px;background: var(--colorone_bg);color: var(--colorone);padding: 15px;}
.good_show_fixed_bar .box .ttt .ll{float: left;}
.good_show_fixed_bar .box .ttt .ll i{font-size: 24px;font-family: 'MB';font-style: normal;}
.good_show_fixed_bar .box .ttt b{float: right;font-weight: normal;}
.good_show_fixed_bar .box .ttt p{float: left;width: 100%;background: rgba(255,255,255,0.7);padding: 10px;margin-top: 5px;display: none;border-radius: 6px 0 6px 6px;}
.good_show_fixed_bar .box .bbb{float: left;width: 100%;display: grid;grid-template-columns: auto auto;padding:15px 10px;align-items: center;}
.good_show_fixed_bar .box .bbb_l{float: left;display: grid;grid-template-columns: 44px 44px 56px 1fr 1fr;gap: 4px;align-items: center;}
.good_show_fixed_bar .box .bbb_l .a{display: flex;flex-direction: column;align-items: center;position: relative;}
.good_show_fixed_bar .box .bbb_l .a span{line-height: 24px;font-size: 20px;}
.good_show_fixed_bar .box .bbb_l .a .num{position: absolute;padding: 0 6px;line-height: 18px;background: rgba(221, 0, 0, 0.8);color: #fff;border-radius: 18px;font-size: 10px;right: 7px;top: -3px;}
.good_show_fixed_bar .box .bbb_l .a p{line-height: 20px;font-size: 11px;}
.good_show_fixed_bar .box .bbb .submit{margin-right: 0;height: 40px;overflow: hidden;border-radius:40px;line-height: 40px;text-align: center;padding: 0 30px;background: var(--colorone)}
.good_show_fixed_bar .box .bbb .submit span{font-size: 15px;font-weight: bold;}
@media (max-width: 768px) {
.good_show_fixed_bar{display: flex;}
}






/*order_detail*/
.order_detail{float:left;width: 100%;}
.order_detail .order{float:left;width: 100%;line-height: 30px;margin-bottom: 20px;display: flex;flex-direction: row;background: #fff;border-radius: 10px;overflow: hidden;box-shadow: 0 0 10px rgba(0,0,0,0.08);}
.order_detail .order .l{width:180px;display: flex;background: var(--colorone);}
.order_detail .order .l b{width:100%;line-height: 100%;display:flex;flex-direction: column;justify-content: center;align-items: center;}
.order_detail .order .l b span{line-height: 40px;font-size: 30px;color: #fff;}
.order_detail .order .l b i{line-height: 20px;font-size: 16px;color: #fff;font-style: normal;text-align: center;width: 100%;margin-top: 6px;display: inline-block;}
.order_detail .order .r{flex: 1;padding: 20px;}
.order_detail .records{float:left;width: 100%;line-height: 30px;margin-bottom:20px;display: flex;flex-direction: row;flex-wrap: wrap;background: #fafafa;padding: 20px 20px 0;border-radius: 10px;}
.order_detail .records .li{width: 230px;border-radius: 10px;padding: 15px;margin: 0 15px 15px 0;background: #fff;position: relative;box-shadow: 0 0px 10px rgba(0,0,0,0.05);}
.order_detail .records .li b{float: left;font-weight: normal;font-size: 12px;margin-bottom: 5px;line-height: 24px;color: #fff;background: var(--colorone);border-radius:  0 12px 12px 0;margin-left: -15px;padding: 0 20px 0 15px;}
.order_detail .records .li span{float: left;line-height: 24px;font-size: 12px;color: #aaa;width: 100%;}
.order_detail .records .li p{float: left;width: 100%;line-height: 20px;color: #666;font-size: 13px;}
.order_detail .deal{float:left;width: 100%;background: #fafafa;padding: 15px 20px;line-height: 30px;margin-bottom: 20px;border-radius: 10px;}
.order_detail .deal .titles{float:left;width: 100%;display: flex;flex-direction: row;justify-content: space-between;}
.order_detail .deal .titles .b{float: left;font-size: 16px;font-weight: bold;line-height: 40px;}
.order_detail .comment{float:left;width: 100%;background: #fafafa;padding: 15px 20px;line-height: 30px;margin-bottom: 20px;border-radius: 10px;}
.order_detail .comment .p{float:left;width: 100%;line-height: 40px;}
.order_detail .pay{float:left;width: 100%;background: #fafafa;padding: 15px 20px;line-height: 30px;margin-bottom: 20px;border-radius: 10px;}
.order_detail .btn_repay{float:left;margin: 20px 0;}
.more_box{float: left;width: 100%;display: none;background: #fafafa;}
.more_box .good{float: left;width: 100%;padding: 20px;}
.more_box .good .titles{float: left;width: 100%;line-height: 40px;font-size: 16px;font-weight: bold;margin-top: 0;}
.more_box .good .li{float: left;width: 100%;display: flex;padding: 15px;line-height: 24px;background: #fff;margin: 2px 0;box-shadow: 0 0 10px rgba(0,0,0,0.02);border-radius: 6px;transition:0.5s;justify-content: space-between;align-items: center;}
.more_box .good .li:hover{box-shadow: 0 0 10px rgba(0,0,0,0.15);}
.more_box .good .li .good_thumbnail{width: 40px;}
.more_box .good .li .good_thumbnail img{width: 100%;border-radius: 6px;height: auto;}
.more_box .good .li .good_title{flex:1;font-size: 14px;padding-left: 20px;font-weight: bold;}
.more_box .good .li .good_title b{width: 100%;}
.more_box .good .li .good_title p{display: none}
.more_box .good .li .good_dw{width: 10%;}
.more_box .good .li .good_detail{width: 25%;}
.more_box .good .li .good_price{width: 200px;}
@media (max-width: 768px) {
.order_detail .deal{padding: 20px 10px;}
.order_detail .deal .titles .btn{line-height: 38px;font-size: 15px;}
.order_detail .order{flex-direction: column;}
.order_detail .order .l{width: 55%;padding:0 20px;margin-top: 20px;float: left;border-radius: 0 40px 40px 0;box-shadow:5px 5px 0  rgba(0,0,0,0.05);}
.order_detail .order .l b{display:flex;flex-direction: row;justify-content: left;align-items: center;}
.order_detail .order .l b span{line-height: 40px;font-size: 20px;color: #fff;float: left;margin-right: 20px;}
.order_detail .order .l b i{line-height: 40px;font-size: 16px;color: #fff;display: inline-block;float: left;width: auto;}
.order_detail .order .r{width: 100%;padding: 10px 10px;}
.order_detail .records{padding:10px;justify-content: space-between}
.order_detail .records .li{width: 49%;margin-bottom: 10px;margin-right: 0;}
.more_box{padding: 10px;}
.more_box .good{padding: 0;}
.more_box .good .titles{margin-top: 0;}
.more_box .good .li .good_thumbnail{width: 80px;}
.more_box .good .li .good_price{display: none;}
.more_box .good .li .good_title{padding-left: 10px;}
.more_box .good .li .good_title p{display: block;}
}