body {
  background: #fff;
  color: #222;
  cursor: auto;
   }

.table {
  width: 100%;
  padding:2px;
  border-collapse: collapse;
  border:1px solid #DDDDDD;
  background-color:#FFFFFF; 
}

.table02 {
	margin-top:50px;
  width: 100%;
  padding:2px;
  border-collapse: collapse;
  border:1px solid #DDDDDD;
  
}
.red-txt{
	color:#F00;
	padding-right:5px;}
.tdtitle{
	background-color: #e6e6e6;
	color:#2f2f2f;
	text-align:center;
        background-color:#DDDDDD;	
	}
.ordertitle{
	
	text-align:center;
	background-color:#DDDDDD;
	}
.num-title{
	font-family: Arial, Helvetica,sans-serif,  "微軟正黑體", "新細明體";
  font-style: normal;
  font-weight: normal;
  line-height:40px;
  position: relative;
  font-size:15px;
  cursor: auto;
	border:1px solid #DDDDDD;
	width:10%;
	background-color: #f5f5f5;
	}
.prod-title{
	font-family: Arial, Helvetica,sans-serif,  "微軟正黑體", "新細明體";
  font-style: normal;
  font-weight: normal;
  line-height:40px;
  position: relative;
  font-size:15px;
  cursor: auto;
	border:1px solid #DDDDDD;
	width:55%;
	background-color: #f5f5f5;
	}
.price-title{
	font-family: Arial, Helvetica,sans-serif,  "微軟正黑體", "新細明體";
  font-style: normal;
  font-weight: normal;
  line-height:40px;
  position: relative;
  font-size:15px;
  cursor: auto;
	border:1px solid #DDDDDD;
	width:15%;
	background-color: #f5f5f5;
	}
.qty-title{
	font-family: Arial, Helvetica,sans-serif,  "微軟正黑體", "新細明體";
  font-style: normal;
  font-weight: normal;
  line-height:40px;
  position: relative;
  font-size:15px;
  cursor: auto;
	border:1px solid #DDDDDD;
	width:5%;
	background-color: #f5f5f5;
	}
.total-title{
	font-family: Arial, Helvetica,sans-serif,  "微軟正黑體", "新細明體";
  font-style: normal;
  font-weight: normal;
  line-height:40px;
  position: relative;
  font-size:15px;
  cursor: auto;
	border: 1px solid #DDDDDD;
	width: 15%;
	background-color: #f5f5f5;
	}
.ship-title{
	font-family: Arial, Helvetica,sans-serif,  "微軟正黑體", "新細明體";
  font-style: normal;
  font-weight: normal;
  line-height:40px;
  position: relative;
  font-size:15px;
  cursor: auto;
	text-align:right;}
.remark-area{
	text-align:center;
	
	}
.table tbody tr td{
  font-family: Arial, Helvetica,sans-serif,  "微軟正黑體", "新細明體";
  font-style: normal;
  font-weight: normal;
  line-height:40px;
  position: relative;
  font-size:15px;
  cursor: auto;
		padding:10px;
		border:1px solid #DDDDDD;
		}

.table tbody tr td .cfp{
  width:100%


}


.ext{
	padding-left:10px;}
.order{
	font-family: Arial, Helvetica,sans-serif,  "微軟正黑體", "新細明體";
	letter-spacing:5px;
	font-size:22px;
	font-weight:bold;
	width: 100%;
    text-align: center;
    background-color: #a3a3a3;
    color: white;
    padding: 12px 20px;
    margin: 30px 0 8px 0;
    display: inline-block;
    border: none;
    border-radius: 4px;
	-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    }
.order:hover {
    background-color: #484848; /* Green */
    color: white;
}
.hd_qty{
	height:26px;
	margin-left:10px;
	border: 1px solid #dddddd;
	padding-left:10px;
	font-size:15px;
	letter-spacing:2px;
	}
.hd_qty03{
	height:26px;
	margin:0 auto;
	border: 1px solid #dddddd;
	padding-left:10px;
	font-size:15px;
	letter-spacing:2px;
	}
.size-01{
	width:100px;	
}
.size-02{
	width:60px;	
}

.size-04{
	width:270px;	
}
.size-05{
	width:500px;
	margin-left:10px;
}
.size-06{
        width:80px;
}
.hd_qty02{
	height:31px;
	/*margin:0 auto;*/
	border: 1px solid #dddddd;
	padding-left:10px;
	margin-left:10px;
	font-size:15px;
	}
.txt-area{
	border: 1px solid #dddddd;
	padding:15px;
	height:90px;
	width:90%;
	font-size:15px;
	
	}
.t1{
	width:120px;
}
@media only screen and (max-width: 640px) {
  
}
.table tbody tr {
  border-bottom: 1px solid #DDDDDD;
  
}
.table tbody tr:nth-of-type(even) {
  background: #F5F5F5;
}
@media only screen and (min-width: 640px) {
  .table tbody tr:nth-of-type(even) {
    background: #F9F9F9;
  }
}

@media screen and (max-width: 640px) {
    body {
         line-height:50px;
    font-size:16px;
    }
.ordertitle{
	font-size: 25px;
	}
.hd_qty02{
	height:49px;
	    font-size: 25px;

	padding-left:10px;
	}
.hd_qty{
	height:30px;
	margin-left:10px;
	margin-top:10px;
	border: 1px solid #dddddd;
	padding-left:10px;
	    font-size: 15px;
    
	letter-spacing:2px;
	}

.ext{
	padding-left:10px;}	
.size-01{
	width:150px;
    font-size: 25px;
    padding: 10px;
}
.size-02{
	width:60px;	
    font-size: 15px;
    padding: 5px;
}
.size-03{
	width:400px;
    font-size: 25px;
    padding: 10px;
}
.size-04{
	width:270px;
    font-size: 25px;
    padding: 10px;
}
.size-05{
	width:430px;
	margin-left:10px;
    font-size: 25px;
    padding: 10px;
}
.size-06{
	 width:80px;
    font-size: 15px;
    padding: 5px;
}
.t1{
	width:100px;
}
.order{
	font-size:30px;
	height:100px;
	background-color: #484848;
	
}
.txt-area{
	font-size: 25px;
}
}

@media screen and (max-width: 480px) {
	.size-01{
	width:80px;	
	    font-size: 25px;
    padding: 10px;
}
.size-02{
	width:60px;	
	    font-size: 15px;
    padding: 5px;
}
.size-03{
	width:280px;	
	    font-size: 25px;
    padding: 10px;
}
.size-04{
	width:280px;	
	    font-size: 25px;
    padding: 10px;
}
.size-05{
	width:290px;
	margin-left:10px;
	    font-size: 25px;
    padding: 10px;
}
.t1{
	width:100px;
}
}
@media screen  and (max-width: 360px) {
        .size-01{
        width:80px;
            font-size: 25px;
    padding: 10px;
display:block;
}
.size-02{
        width:100px;
        font-size: 15px;
    	padding: 5px;
	display:block;
}
.size-03{
        width:100%!important ;
            font-size: 25px;
    padding: 10px;
	display:block;
}
.size-04{
        width:100%;
            font-size: 25px;
    padding: 10px;
	display:block;
}
.size-05{
        width:100%;
        margin-left:10px;
            font-size: 25px;
    padding: 10px;
	display:block;
}
#zip1,#zip2{
margin-left:10px;
}
.t1{
        width:100px;
}
}

form[name="sorder"] input[type=text],
form[name="sorder"] input[type=email],
form[name="sorder"] input[type=password],
form[name="sorder"] select,
form[name="sorder"] textarea {
    font-size: 1em;
}