@charset "utf-8";
.pointer {cursor: pointer;}
input,button,select,textarea {outline:none}
[class^="icon-"]:before, [class*=" icon-"]:before { line-height: 35px; }

/*header*/
.header-active {
	width: 100%;
	height: 35px;
    line-height: 35px;
    font-size: 1.5em;
    vertical-align: middle;
    color: #FFF;
	background-color: #3c3c3c;
    box-shadow: 0 2px 3px 0 rgba(0,0,0,.3);
    padding: 0 1%;
    overflow: hidden;
    position: fixed;
    z-index: 9999;     
}
.header-logo { float: left; margin: 0;}
.header-logo h1 img { width: auto; height: 35px; }

.header-cart a { float: right; color: #FFF; margin: 0 15px 0 0; }
.header-member a { float: right; color: #FFF; margin: 0 20px; }
.icon-basket-1 { position: relative; }
.icon-basket-1 .badge {
	position: absolute; top: 1px; right:-12px; z-index: 19;
	display: inline-block;
	min-width: 10px;
    padding: 3px 5px;
    font-size: 0.5em;
    font-weight: normal;
	font-style: normal;
    color: #FFF;
    text-align: center;
    white-space: nowrap;
    background-color: #ff0000;
    border-radius: 10px;
}

/*搜尋*/
.header-search {
    float: right;
    width: 17%;
    padding: 3px 0 1px 0;
}
.header-search-box {
    overflow: hidden;
}
input[type="search"] {
    float: left;
    width: 85%;
    height: 28px;
    font-size: 0.65em;
    font-family: Arial, Helvetica, 微軟正黑體, "Microsoft JhengHei", "LiHei Pro", sans-serif, 新細明體;
    color: #444;
    background-color: #FFF;
    border-radius: 0;
	border: none;
    padding: 0 8px;
}
input[type="search"]:focus { background-color: #FFF; outline:none }
input[type="search"]:-webkit-autofill { 
        -webkit-box-shadow:0 0 0px 1000px white inset;
        -webkit-text-fill-color: #444;
} 
.header-search-icon a {
    float: left;
    width: 15%;
    height: 28px;
	line-height: 28px;
	font-size: 1em;
	text-align: center;
	color: #444;
    background-color: #FFF;
    display: block;
}
.icon-search-1:before { line-height: 28px; }


/*---------------------------------------------------------------
----------------------------------------------------------------*/

@media screen and (max-width: 1440px) {
    .header-search { width: 20%; } 
}

@media screen and (max-width: 834px) {
    .header-active { padding: 0 3%; height: 73px; }
    .header-search { float:none; width: 100%; background-color: #3c3c3c; padding: 3px 0; margin: 0 auto; clear: both; }
}

@media screen and (max-width: 480px) {
    .header-cart a { margin: 0 10px 0 0; }
    .header-search { float:none; width: 100%; background-color: #3c3c3c; padding: 3px 0; clear: both; }
}

@media screen and (max-width: 320px) {
    .header-active  { padding: 0 2%; }
    .header-cart a { margin: 0 10px 0 0; }
    .header-member a { margin: 0 8px; }
}