*{
   font-family:Verdana, Arial, Helvetica, sans-serif;
   font-size: 14px;
}
body { 
    margin: 0px;
    padding: 0px;       
}
table{
    padding: 0px;
    margin: 0px;    
}
.total{
font-weight: bold;
border: 1px solid rgb(221,221,221);   
}
.space{
    padding: 5px;
}
.guide{
   background-color: rgb(240,240,240);   
   padding: 5px;
   border-top: 1px solid rgb(221,221,221);   
   border-bottom: 1px solid rgb(221,221,221);   
   margin: 2px;
}
.menu { 
    height: 20px;
    padding: 20px;
}
.menu2 { 
    height: 20px;
    padding: 5px;
}
a{
	color:#333333;
	cursor: pointer;  
      
}
a:hover{
	color:#FF3300;
	text-decoration:none;
}
.foot{
    background-color: rgb(240,240,240);   
    border: solid 1px rgb(252,252,252); 
    height: 40px;
}

.foot-hotline { padding-top: 20px; }
.colhead{
    background-color: rgb(240,240,240);   
    border: solid 1px rgb(252,252,252); 
    height: 25px;
}
button{
    height: 30px;
    padding: 5px 10px 5px 10px;
    cursor: pointer;
    background-color: rgb(240,240,240); 
    border: 1px solid rgb(221,221,221);
    margin-left: 2px; 
    font-size: 12px;
}
.Linker-button{
    height: 50px;
    padding: 10px;
    cursor: pointer;
    background-color: rgb(240,240,240); 
    border: 1px solid rgb(221,221,221);
}
input{
    height: 20px;
    outline: 0;    
}
.phrase{
    height: 16px;
    width: 98%;    
}
.Grid-head td{
	padding: 3px 0px 3px 0px;
	background-color: rgb(248, 248, 248);	
	border-bottom: 1px solid rgb(221,221,221);
	text-align: center;
    font-weight: bold;
	border-left: 1px solid rgb(221,221,221);    
}
table {
    border-collapse: collapse;
}
.Red-row {
    color: red;
}
.Yellow-row {
    color: orange;
}
.Green-row {
    color: green;
}
.Grey-row {
    color: rgb(221,221,221);
}
.Grid-row {
	cursor: pointer;	
}
.Grid-row td  {
	padding: 3px;
	border-bottom: 1px solid rgb(221,221,221);
	border-left: 1px solid rgb(221,221,221);
}
.Grid-row.selected {
	background-color: rgb(248,248,248);
}
.Grid-row:hover  {
	background: rgb(248,248,248);
}
.Grid-row td:first-child  {
	border-left: 1px solid rgb(128,128,128);	
}
.Grid-row td:last-child  {
	border-right: 1px solid rgb(180,180,180);	
}
.Grid-row:first-child td  {
	border-top: 1px solid rgb(128,128,128);
}
.bar-head {
	padding: 5px;
	background-color: rgb(248, 248, 248);	
	border-top: 1px solid rgb(221,221,221);
	border-bottom: 1px solid rgb(221,221,221);
}


.newvcode {
    height: 30px;
    padding: 5px 10px 5px 10px;
    cursor: pointer;
    background-color: rgb(240,240,240); 
    border: 1px solid rgb(221,221,221);
    margin-left: 2px; 
    font-size: 12px;
    text-decoration: none;
}


#keyword { box-sizing: border-box; width: 660px; height: 30px; }
.formInput{ width: 196px; }
.td-lg20 { width: 20%; }
.td-lg60 { width: 60%; }
#mlists { display: none; }
#mproductListRows { display: none; }
#mdetailTableId { display: none; }
#muserlist { display: none; }
.hidden-lg-br { display: none; }
.ucenter-title { font-size: 20px; text-align: right; height: 35px; background-color: rgb(242, 242, 242); border: 1px solid rgb(221,221,221); color: rgb(0, 0, 255) }
.ucenter-title span,
.ucenter-title a,
.ucenter-title button { font-size: 20px; }
.fixed-myCartLinker { display: none; }

.fixed-pop { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 40px; background: #fff; box-shadow: 0 0 30px #aaa; text-align: center;border-radius: 10px; }
.fixed-pop img { display: block; width: 200px; margin: 0 auto; }
.fixed-pop p { margin: 20px 0 0; font-size: 16px; }
.fixed-pop .close { position: absolute; top: 20px; right: 20px; font-size: 18px; font-weight: bolder; color: #555; cursor: pointer; }
.fixed-pop .close:hover { color: #e84636; }

@media (max-width: 640px) {

    .Detail-form2-side { display: none;}

    #signInSpace a,
    .foot a { text-decoration: none; }
    .foot a { margin: 0 5px; }

    .guide .navigation { padding: 10px; border-radius: 6px; }

    .btn-td { white-space: nowrap; display: inline-block; border: 1px solid #e84636; color: #fff; background: #e84636; border-radius: 6px; } 

    #sumInfoSite { padding-top: 10px; }

    .total-td #email { padding: 3px 8px; border: 1px solid #c4c7ce; border-left: 0; border-radius: 0 4px 4px 0; }
    .total-td .total { background: #e84636; color: #fff; border-radius: 4px 0 0 4px; }

    #signupSpace { padding-top: 50px; }
    #signupSpace > table { width: 100%; }
    #signupSpace p { margin: 10px 0; text-align: center; } 
    #signupSpace input { padding: 4px 8px; border: 1px solid #c4c7ce; border-radius: 4px 0 0 4px; }
    #signupSpace input#vcode { width: 118px; border-right: 0; }
    #signupSpace .newvcode { color: #e84636; display: inline-block; padding: 0 10px; height: 28px; line-height: 28px; position: relative; top: -2px; vertical-align: middle; border-left: 0; border-color: #c4c7ce; border-radius: 0 4px 4px 0; background: transparent; margin: 0; }
    #signupSpace .newvcode::before { position: absolute; top: 7px; left: 0; width: 1px; height: 16px; background:rgb(222, 222, 222); content: ""; }
    #signupSpace .submit { font-size: 14px; color: #fff; width: 214px; height: 30px; background: #e84636; border-radius: 4px; box-shadow: rgb(242 78 105 / 30%) 0px 6px 16px 0px; border: 0; padding: 0; }


    #beforeSignIn { padding-top: 50px; }
    #beforeSignIn p { margin: 5px 0; text-align: center; } 
    #beforeSignIn input { padding: 4px 8px; border: 1px solid #c4c7ce; border-radius: 4px; }
    #beforeSignIn input#vcode { width: 118px; border-right: 0; }
    #beforeSignIn .newvcode { color: #e84636; display: inline-block; padding: 0 10px; height: 28px; line-height: 28px; position: relative; top: -2px; left: -2px; vertical-align: middle; border-left: 0; border-color: #c4c7ce; border-radius: 0 4px 4px 0; background: transparent; margin: 0; }
    #beforeSignIn .newvcode::before { position: absolute; top: 7px; left: 0; width: 1px; height: 16px; background:rgb(222, 222, 222); content: ""; }
    #beforeSignIn .submit { font-size: 14px; color: #fff; width: 214px; height: 30px; background: #e84636; border-radius: 4px; box-shadow: rgb(242 78 105 / 30%) 0px 6px 16px 0px; border: 0; padding: 0; }



    .gologin-box { padding: 10px 0 0 58px; }
    .regbox { padding: 10px 0 0 69px; }

    #pageInfoSite { padding-top: 20px; }
    #pageInfo { padding-top: 15px; }

    .fixed-pop { padding: 30px 20px; width: 60%; }
    .fixed-pop img { max-width: 100%; height: auto; }
    .fixed-pop p { font-size: 14px; }
    .fixed-pop .close { top: 15px; right: 15px }


    .Detail-form tbody td { padding: 18px; }
    .Detail-form tbody > tr:nth-child(2n+1) { background-color: #f6f6f6; }
    .Detail-form tbody > tr:hover,
    .Detail-form tbody > tr:hover .name { background: #eee; }
    .Detail-form a { text-decoration: none; }
    
    .name{
        font-weight: bold;		
        white-space: nowrap;
    }
    #head-text{
        position: relative;
        font-weight: bold;	
        padding-top: 20px;
        padding-bottom: 60px;
        font-size: 16px;	
        background: #fff;;
    }
    #head-text:hover{
        background: #fff;;
    }
    #head-text .btn-td { position: absolute; top: 80px; right: 20px; white-space: nowrap; }
    .tabs{
        padding: 0px;   
        overflow-x: auto;
        margin: 0px;
    }
    .tabs-bar{
        padding-top: 10px; 
        border-bottom: 1px solid rgb(204, 204, 204);	    
    }
    .tabs-bar-button{
        color: rgb(153,153,153);
        background-color: rgb(255,255,255);
        margin-left: 2px;
        border: 1px solid rgb(204, 204, 204);	
        border-bottom: none;
        cursor: pointer;	  
        font-size: 14px;  
        border-radius: 6px;
    }
    .tabs-tab{
        padding: 0px 0px 0px 0px;    
    }
    .tabs-bar-button.selected {
        background-color: rgb(248, 248, 248);
        border-bottom: none;
        position: relative;
        top: 1px;
        color: #e84636;
        font-weight: bolder;
    }

    .index-search { width: 120px; border: 1px solid #c4c7ce; border-right: 0;border-radius: 4px 0 0 4px; }

    .search-btn { position: relative; top: -1px; border-radius: 0 4px 4px 0; margin: 0; color: #fff; background: #e84636; border: 0;}

    .logo-td { padding: 90px 0 0; }



    #mdetailTableId { padding-top: 10px; padding-bottom: 20px; }
    #mdetailTableId > table td { white-space: nowrap; border: 0; padding: 12px; }
    #mdetailTableId > .table01 > tbody > tr:nth-child(2n) { background-color: #f6f6f6; }
    #mdetailTableId a { text-decoration: none; }
    #mdetailTableId > .table02 > tbody > tr:hover:hover td,
    #mdetailTableId > .table02 > tbody > tr:hover:hover a,
    #mdetailTableId > .table02 > tbody > tr:hover:hover span { color: #e84636; }
    .showorder-title { padding: 20px 0 0; font-size: 16px; font-weight: bolder; }
    #mdetailTableId .showorder-total { color: #e84636; font-size: 18px; font-weight: bolder; text-align: right; }
    .showorder-qrcode { font-size: 14px; }
    .showorder-qrcode img { display: block; width: 150px; margin-bottom: 20px; }
    


    .space{ padding: 20px 15px; }
    #keyword { width: auto; }
    #myCartLinker,
    #mycenter,
    .newsformtd { display: none; }
    .head { padding-bottom: 30px; } 
    .headlogo-td { vertical-align: top; }
    .input-vscode { width: 120px; }
    .formInput.input-vscode { width: 101px; }
    .td-sm13 { width: 13%; }
    .td-sm15 { width: 15%; }
    .td-sm40 { width: 40%; }
    #lists { display: none; }
    #mlists { display: table; }

    #userlist { display: none; }
    #muserlist { display: block; }

    .Grid-row td  {
        border-bottom: 0;
        border-left: 0;
    }
    .Grid-row td:first-child  {
        border-left: 0;
    }
    .Grid-row td:last-child  {
        border-right: 0;
    }
    .Grid-row:first-child td  {
        border-top: 0;
    }

    #productListRows { display: none; }
    #mproductListRows { display: block; }

    #detailTableId { display: none; }
    #mdetailTableId { display: block; }

    #carts-head { display: none; }

    .allnum { padding: 10px 0; }

    .hidden-lg-br { display: block; }


    .ucenter-title { color: #e84636; font-weight: bolder; padding-bottom: 20px; font-size: 16px; height: 35px; background-color: transparent; border: 0; }
    .ucenter-title span,
    .ucenter-title a,
    .ucenter-title button { font-size: 16px; }
    .ucenter-title button { background-color: transparent; border: 0; }

    .guide { border: 0; margin-bottom: 10px; }

    #mlists a,
    #mproductListRows a,
    #mdetailTableId a,
    #orderList a { text-decoration: none; }
    #cartlist-table,
    #cartlist-table td { border: 0; }

    .total { border: 0; }

    .fixed-myCartLinker {
        position: fixed;
        right: 15px;
        bottom: 50px;
    }
    .fixed-myCartLinker { display: block; }
    .fixed-myCartLinker #myCartLinker { display: block; width: 48px; height: 48px; border-radius: 50%; margin-bottom: 20px; border: 0; background: #fff url(../img/cart.png) no-repeat center center; box-shadow: 0 0 20px #ddd; font-size: 0; color: transparent; }
    .fixed-myCartLinker #btn-mycenter { display: block; width: 48px; height: 48px; border-radius: 50%; border: 0; background: #fff url(../img/user.png) no-repeat center center; box-shadow: 0 0 20px #ddd; font-size: 0; color: transparent; }

}



@media (min-width: 641px) {

    .space { min-width: 1200px; }
    .headlogo-td { width: 120px; }
    /* #userbar { padding: 20px 0; } */
    #userbar .menu2,
    #mycenter,
    #myCartLinker { display: inline-block; color: #e84636; border: 1px solid #e84636; border-radius: 100px; text-align: center; line-height: 28px; text-decoration: none; padding: 0 25px; height: auto; background: transparent; margin: 0 25px 0 0; }
    #userbar .menu2.active { color: #fff; background: linear-gradient(180deg,#f57c66,#e84636); }
    .logo-td { padding-top: 50px; }
    #keyword,
    #keywords { box-sizing: border-box; width: 350px; height: 44px; border: 2px solid #c4c7ce; border-right: 0; border-radius: 10px 0 0 10px; padding: 0 12px; }
    #newsform { display: inline-flex; align-items: center; }
    #newsform button { width: 108px; height: 44px; color: #fff; background: #e84636; border-radius: 0 10px 10px 0; font-size: 17px; border: 0; margin: 0; }
    .foot a { margin: 0 10px; text-decoration: none; }
    .guide { border: 0; }
    .guide .navigation { padding: 5px 10px; font-size: 16px; color: #666; font-weight: bolder; }
    #beforeSignIn { padding: 100px 10px 10px; text-align: center; }
    #beforeSignIn .formInput { box-sizing: border-box; width: 336px; height: 44px; border: 2px solid #c4c7ce; padding: 0 12px; border-radius: 10px; }
    #beforeSignIn .formInput#vcode { width: 216px; border-right: 0; border-radius: 10px 0 0 10px; }
    #beforeSignIn > p { display: inline-block; font-size: 16px; }
    #beforeSignIn .newvcode { position: relative; border: 2px solid #c4c7ce; border-radius: 0 10px 10px 0; border-left: 0; vertical-align: top; height: auto; padding: 0 25px 0 15px; line-height: 40px; display: inline-block; color: #e84636; background: transparent; margin: 0; text-align: center; font-size: 16px; }
    #beforeSignIn .newvcode::before { position: absolute; top: 14px; left: 0; width: 1px; height: 16px; background:rgb(222, 222, 222); content: ""; }
    #beforeSignIn .submit { font-size: 16px; color: #fff; width: 336px; height: 44px; background: #e84636; border-radius: 10px; box-shadow: rgb(242 78 105 / 30%) 0px 6px 16px 0px; border: 0; padding: 0; }

    #signupSpace { padding: 100px 10px 10px; text-align: center; }
    #signupSpace table { width: 100%; }
    #signupSpace .formInput { box-sizing: border-box; width: 336px; height: 44px; border: 2px solid #c4c7ce; padding: 0 12px; border-radius: 10px; }
    #signupSpace .formInput#vcode { width: 216px; border-right: 0; border-radius: 10px 0 0 10px; }
    #signupSpace p { display: inline-block; font-size: 16px; }
    #signupSpace .newvcode { position: relative; border: 2px solid #c4c7ce; border-radius: 0 10px 10px 0; border-left: 0; vertical-align: top; height: auto; padding: 0 25px 0 15px; line-height: 40px; display: inline-block; color: #e84636; background: transparent; margin: 0; text-align: center; font-size: 16px; }
    #signupSpace .newvcode::before { position: absolute; top: 14px; left: 0; width: 1px; height: 16px; background:rgb(222, 222, 222); content: ""; }
    #signupSpace .submit { font-size: 16px; color: #fff; width: 336px; height: 44px; background: #e84636; border-radius: 10px; box-shadow: rgb(242 78 105 / 30%) 0px 6px 16px 0px; border: 0; padding: 0; }
    .Grid-row td  {
        padding: 12px;
        border-bottom: 1px solid #eee;
        border-left: 0;
    }
    .Grid-row td:first-child  {
        border-left: 0;
    }
    .Grid-row td:last-child  {
        border-right: 0;
    }
    .Grid-row:first-child td  {
        border-top: 0;
    }
    .Grid-head td { padding: 12px; border: 0; background: transparent; white-space: nowrap; }
    .Grid-row td a { text-decoration: none; }
    /* #lists { padding-top: 20px; } */
    #lists .Grid-row:nth-child(2n) { background-color: #f6f6f6; }
    #lists .Grid-row:hover { background: #eee; }
    #lists .Grid-row:hover td,
    #lists .Grid-row:hover a,
    #lists .Grid-row:hover span { color: #e84636; }
    #pageInfo { padding-top: 40px; text-align: center; font-size: 15px; }
    #pageInfo a { font-size: 15px; }
    .btn-td { display: inline-block; border: 1px solid #e84636; color: #fff; background: #e84636; border-radius: 6px; white-space: nowrap; } 
    
    .header { 
        /* height: 72px;  */
        margin-bottom: 0; }

    #productList { padding-top: 20px; }
    #productListRows,
    .news-table { min-height: 600px; }
    #productListRows .Grid-row:nth-child(2n+1) { background-color: #f6f6f6; }
    #productListRows .Grid-row:hover { background: #eee; }
    #productListRows .Grid-row:hover td,
    #productListRows .Grid-row:hover a,
    #productListRows .Grid-row:hover span { color: #e84636; }
    #sumInfoSite { margin: 30px 40px 0; }
    .total { border: 0; }
    .total .allnum { font-size: 16px; }
    .total-td { padding-right: 30px; padding-top: 20px; }
    .total-td .total { margin: 0; border-radius: 0 10px 10px 0; color: #fff; background: #e84636; border: 0; height: 44px; }
    .total-td input { padding: 2px 12px; border-radius: 10px 0 0 10px; width: 300px; border: 2px solid #c4c7ce; border-right: 0; height: 36px; }
    .mine-table { margin-top: 20px; }
    .ucenter-title { padding: 0 40px; border: 0; color: #e84636; background: #eee; height: 50px; line-height: 50px; }
    .ucenter-title span { cursor: pointer; display: inline-block; font-weight: bolder; color: #e84636; }
    .ucenter-title button { vertical-align: top; text-decoration: none; border: 0; padding: 0; height: auto; line-height: 50px; }
    #orderList .Grid-row:nth-child(2n+1) { background-color: #f6f6f6; }
    #orderList .Grid-row:hover { background: #eee; }
    #orderList .Grid-row:hover td,
    #orderList .Grid-row:hover a,
    #orderList .Grid-row:hover span { color: #e84636; }
    #pageInfoSite { padding-top: 40px; text-align: center; font-size: 15px; }
    #pageInfoSite a { font-size: 15px; }
    #userlist { min-height: 600px; 
        /* margin-top: 20px;  */
    }
    .newsformtd  { padding-left: 40px; }


    
    .Detail-form tbody td { padding: 18px; }
    .Detail-form tbody > tr:nth-child(2n+1) { background-color: #f6f6f6; }
    .Detail-form tbody > tr:hover,
    .Detail-form tbody > tr:hover .name { background: #eee; }
    .Detail-form a { text-decoration: none; }

    .Detail-form2-body { display: flex; }
    .Detail-form2 { margin: 10px 0 20px; }
    .Detail-form2 tbody td { padding: 5px 10px; border: 1px solid rgb(221,221,221); border-right: 0; }
    .Detail-form2 a { text-decoration: none; }
    .Detail-form2 tbody .name  {
        background-color: rgb(248, 248, 248);
    }
    .Detail-form2-content { flex: 1 0 0; }

    .Detail-form2-side { border-left: 1px solid rgb(221,221,221); border-bottom: 1px solid rgb(221,221,221); padding: 20px 50px; }
    .Detail-form2-side > p { margin: 10px 0; }
    .Detail-form2-side .side-label { display: inline-block; width: 100px; }

    .Detail-form3 tbody td { padding: 5px 10px; }
    
    .name{
        font-weight: bold;		
    }
    #head-text{
        position: relative;
        font-weight: bold;	
        /* padding-top: 40px; */
        font-size: 18px;	
        background: #fff;;
    }
    #head-text:hover{
        background: #fff;;
    }
    #head-text .btn-td { position: absolute; top: 40px; right: 40px; white-space: nowrap; }
    .tabs{
        padding: 0px;   
        overflow-x: auto;
        margin: 0px;      
    }
    .tabs-bar{
        padding-top: 10px; 
        border-bottom: 1px solid rgb(204, 204, 204);	    
    }
    .tabs-bar-button{
        color: rgb(153,153,153);
        background-color: rgb(255,255,255);
        margin-left: 2px;
        border: 1px solid rgb(204, 204, 204);	
        border-bottom: none;
        cursor: pointer;	  
        font-size: 16px;  
        border-radius: 8px;
    }
    .tabs-tab{
        padding: 0px 0px 0px 0px;    
    }
    .tabs-bar-button.selected {
        background-color: rgb(248, 248, 248);
        border-bottom: none;
        position: relative;
        top: 1px;
        color: #e84636;
        font-weight: bolder;
    }

    .gologin-box { padding: 10px 0 0 64px; }

    .index-search#keyword { width: 550px; }
    .regbox { padding: 10px 0 0 76px; }

    #detailTableId { min-height: 500px; padding-top: 20px; padding-bottom: 40px; }
    #detailTableId > table td { border: 0; padding: 12px; }
    #detailTableId > .table01 > tbody > tr:nth-child(2n) { background-color: #f6f6f6; }
    #detailTableId > .table02 > tbody > tr:nth-child(2n+1) { background-color: #f6f6f6; }
    #detailTableId > .table02 > tbody > tr:hover,
    #detailTableId > .table02 > tbody > tr:hover .name { background: #eee; }
    #detailTableId a { text-decoration: none; }
    #detailTableId > .table02 > tbody > tr:hover:hover td,
    #detailTableId > .table02 > tbody > tr:hover:hover a,
    #detailTableId > .table02 > tbody > tr:hover:hover span { color: #e84636; }
    .showorder-title { padding: 40px 0 10px; font-size: 20px; font-weight: bolder; }
    #detailTableId .showorder-total { padding-right: 40px; color: #e84636; font-size: 20px; font-weight: bolder; text-align: right; }
    .showorder-qrcode { font-size: 16px; }
    .showorder-qrcode img { display: block; width: 200px; margin-bottom: 20px; }

    .mine-btnlg { padding-top: 150px; text-align: center; }
    .mine-btnlg button { border-radius: 10px; display: inline-block; width: 336px; height: 44px; box-sizing: border-box; border: 0; color: #fff; background: #e84636;; text-align: center; font-size: 16px; cursor: pointer; }
    
    #notResultId { display: none; min-height: 500px; background: url(../img/empty.png) no-repeat center center; }

    #totaltddiv { display: none; }
}
