@charset "utf-8";
/* CSS Document */

/*body{background:url("../images/index.png") top center;}
*/

/* default共用 */
body, h1, h2, h3, h4, div,  ul{	padding:0;	margin:0;}
body,table,tr,button,th,form,select, input , input textarea,p {
	padding:0;	margin:0; color: #444; 
	font: 13px/20px "verdana", "Georgia","apple LiGothic Medium", "arial", "Courier", "Helvetica", "Times";}
input ,textarea, select{
	border:1px solid #bab0a4;	padding:2px; color:#998968;	font-size:12px; line-height:16px; vertical-align:middle;}
option{margin:0; color:#998968;}
#checkbox, #radio {	border:0;}
img{border:0;}
a, 
a:visited {text-decoration:none; outline:none;/* 20071120新增 ● 去除Firefox會在鏈接周圍產生一個虛線外框 */}
a:hover{	text-decoration:underline;}
/* end */	

body{font: 13px "verdana", "Georgia","apple LiGothic Medium", "arial", "Courier", "Helvetica", "Times";-webkit-text-size-adjust:none;}

a{color: #1c100b; text-decoration: none;}
a:hover{color: #424d22;}

.rt_ad_min{right:-5px;}

/*tabcss*/
.tabContent > div { display: none; }
.tabContent .active { display: block; }

/*首頁佈局*/
.eslitesp{width: 150px; text-align: center; float: left; background-color: #ffffff; height: 350px; box-shadow:-2px 0px 5px rgba(20%,20%,20%,0.2);}
.slider{background:url(../../images/index/sliderbg.png); width: 100%; margin-top: -10px;}
.slider_content{width: 930px; height: 350px; margin: auto;}
.slider_banner{float: right; position: relative;}


.slider_banner .num {position: absolute; bottom: 12px; right: 10px;}
.slider_banner .num li{ float: left; margin-right: 12px;}


.threeblock{width: 930px; margin:auto;margin-top: 30px; }

.leftblock{float: left;  width: 148px; }
.centerblock{float: left; margin-left: 30px; width:570px;}
.rightblock{float: right; width:148px;}


.todaybest{height: 270px; text-align: center; border: 1px solid #d8d8d8;}
.hottopic{height: 270px; text-align: center;}
.preorder{height: 270px;}


.week{height: 333px;text-align: center; border: 1px #d8d8d8 ridge;}
.selected{height: 333px; text-align: center;}
.coupon{height: 333px;}

.brand{height: 252px;text-align: center; border: 1px #d8d8d8 ridge;}
.plan{height: 252px;}
.ranking{height: 252px; text-align: center;}

.finding{height: 500px; text-align: center;}
.recommend{height: 500px;}
.service{text-align: center; text-align: center; border: 1px #d8d8d8 ridge; height: 148px;}
.edm{text-align: center; text-align: center; border: 1px #d8d8d8 ridge; height: 70px; margin-top: 10px;}

.edm input{width:86px; border: 1px solid #cccccc; margin-right: 5px; line-height: 18px;}
.edm button{padding: 1px;}

.belt{width: 930px; margin: 30px auto 30px auto; position: relative;}
.event{width: 100%; height: 90px; margin: 0px auto 0px auto; border-top:1px solid #ececec;border-bottom:1px solid #ececec;}
.event2{width: 100%; height: 90px; margin: 0px auto 30px auto; border-bottom:1px solid #ececec;}

.fiveblock{width: 930px; margin: 0px auto 20px auto; height: 278px;}
.oneblock{width: 930px;  margin: 0px auto 20px auto;  height: 513px;}

.clear{clear: both;}

/*區塊內樣式*/

h3 {font-family: 'Noto Serif TC', serif; font-size:18px; font-weight:700; line-height: 27px;}
h4 {font-family: 'Noto Serif TC', serif; font-size:20px; font-weight:700; color:#38421c; line-height: 20px; padding-left: 8px; border-left:6px solid #537800; float: left;}

.eslitesp h3{margin-top: 16px;}
.todaybest h3{color:#a7212f; margin-top: 4px;}
.week h3{color:#a7212f; margin-top: 4px;}
.brand h3{color:#a7212f; margin-top: 4px;}
.service h3{color:#38421c; margin-top: 4px;}
.hottopic h3{color:#38421c;}
.preorder h3{color:#38421c; float: left;}
.edm h3{color:#38421c; margin-top: 8px; margin-bottom: 2px;}
.recommend h3{color:#38421c; float: left; height: 31px;}
.coupon h3{color:#38421c; float: left; height: 31px;}
.plan h3{color:#38421c; float: left; height: 31px;}
.ranking h3{color:#38421c;}
.finding h3{color:#38421c;}

.service img{margin-top: 5px;}
.eslitesp img{margin:6px auto 6px auto;}


.img_s {display: block; margin: 5px auto 0px auto; max-width: 136px; /*width: 110px;height: 136px;object-fit: contain;*/ max-height: 136px;}

.selectedimg{display: block; margin: 14px auto 5px auto; width: 110px;height: 140px;object-fit: contain;}

.des{padding: 6px 8px 0px 8px; line-height: 18px; display: block; text-align: center;}
.des_grey{padding: 5px 5px 3px 5px; color: #666666; display: block; line-height: 18px;}
.des_red{color:#a7212f;}

.price{ font-size: 15px; font-weight: 700; color: #a7212f; }
.deleteline{ text-decoration:line-through;}

.countdown{height: 28px; background-color: #a7212f; margin-top: 10px; color: #ffffff; line-height: 28px; display: block;}
.day{font-size: 15px; font-weight: bold; margin: 0px 2px 0px 2px;}

.more {margin-top: 8px;}
.more a{color:#aaaaaa;font-size: 12px; }
.more a span{font-size: 15px;}

.more_left {float: right;}
.more_left a{color:#aaaaaa;font-size: 12px; line-height: 25px; }
.more_left a span{font-size: 15px;}

.countdown{height: 28px; background-color: #a7212f; margin-top: 10px; color: #ffffff; line-height: 28px;} 
.countdown span{font-size: 15px; font-weight: bold; margin: 0px 2px 0px 2px;}


.submenu li{font-family: 'Noto Sans TC', sans-serif; height: 31px; float: left; font-size: 15px; font-weight:500; width: 57px; line-height: 27px; color:#1c100b; text-align: center;}


.centerblock .arrow{float: left; margin: 7px 9px 0px 12px;}

.hrline{clear: both;  border: none; height: 1px; color: #537800; background-color: #537800;}
.titleline{height: 20px; width: 750px; border-bottom: 1px solid #e9e9e9; float: left; margin:0px 20px 0px 20px;}
.shortline{clear: both;  border: none; height: 1px; color: #537800; background-color: #537800; width: 58px;}

.submenu .active{border-bottom: 3px solid #537800; color: #537800;}

.item{height: 225px; margin-bottom: 10px;}
.item p { float: left; width: 142px; margin: 0px; padding: 0px;}
.item p img{display: block; margin: 5px auto 0px auto; width: 125px;height: 175px;object-fit: contain;}


.item li { float: left; width: 142px; }
.item li.final{margin-right: 0px;}
.item img{display: block; margin: 5px auto 0px auto; width: 125px;height: 175px;object-fit: contain;}
.item li span{height: 36px; overflow: hidden;}

.planbanner{margin-top: 5px;}

.fivemore{ font-size: 12px; line-height: 33px; color: #38421c;}

.hottopic ul{ width: 125px; margin: 10px auto 0px auto;}
.hottopic li{background:url("../../images/index/list.png") no-repeat; text-align: left; background-position: 0px 5px; padding-left: 9px; height: 38px; overflow: hidden; margin-bottom: 8px;}

.couponad{margin-top: 5px; display: inline-block; margin-right: 10px;}
.coupon img{display: block;}
.coupon .final{margin-right: 0px;}
.coupon ul{ width: 180px; margin-top: 5px;}
.coupon li{background:url("../../images/index/list.png") no-repeat; background-position: 0px 5px; padding-left: 15px;
    height: 37px; overflow: hidden; margin-bottom: 10px;}
.word{height:27px; border: 1px solid #e9e9e9; width: 178px; text-align: center; line-height: 27px;}

.ranking ul {margin-top: 20px; clear: both;}
.ranking ul li{width: 140px; height: 31px; text-align: left; clear: both;}
.rank1{width: 16px; font-size: 12px; line-height: 17px; text-align: center; height: 16px; background: #d9b340; color: #ffffff; border-radius: 16px; float: left; margin-left: 3px;}
.rank2{width: 16px; font-size: 12px; line-height: 17px;text-align: center; height: 16px; background: #6f7b83; color: #ffffff; border-radius: 16px; float: left; margin-left: 3px;}
.rank3{width: 16px; font-size: 12px; line-height: 17px;text-align: center; height: 16px; background: #a15326; color: #ffffff; border-radius: 16px; float: left; margin-left: 3px;}
.rank4{width: 16px; font-size: 12px; line-height: 17px;text-align: center; height: 16px; background: #38421c; color: #ffffff; border-radius: 16px; float: left; margin-left: 3px;}
.rank5{width: 16px; font-size: 12px; line-height: 17px;text-align: center; height: 16px; background: #38421c; color: #ffffff; border-radius: 16px; float: left; margin-left: 3px;}
.rankword{width: 116px; float: right; line-height: 18px; max-height: 38px; overflow: hidden; margin-bottom: 3px;}

.oneleft{width: 560px; height: 474px; background-color:#f4f4f4; float: left; display: block; margin-top: 5px;}
.oneimg{padding: 10px;}
.oneimg span{overflow: hidden; height: 24px;}
.oneimg p{overflow: hidden; height: 24px;}
.oneimg .title{font-weight: bold; display: block; line-height: 24px; }


.oneright{width: 370px; height: 474px; float: right;margin-top: 5px;}
.img_oneitem {display: block; margin: 0px auto 0px auto; width: 170px;height: 170px;object-fit: contain; background-color: #ffffff;}
.oneright ul li{width: 170px; height: 230px; border: 1px solid #f4f4f4; background-color: #f4f4f4; float: left; margin: 0px 0px 10px 10px;}

.belt .leftbtn{position: absolute; left: 0px;}
.belt .rightbtn{position: absolute; right: 0px;}
.belt .dot{position: absolute;left: 443px; bottom:10px;}
.dot{width: 54px; height: 5px;}
.dot li{float: left; margin-right: 8px;}

.finding ul li.title{font-weight: bold; margin-top: 2px;}
.finding ul li.two{ margin-top:3px; padding: 0px 8px 0px 8px;}
.finding .dot{margin:8px auto 25px auto;}
.finding  .shortline{margin-bottom: 16px;}


.econtent{width:930px; margin: auto;}

.econtent li{float: left; width: 231px; height: 90px; border-right: 1px solid #ececec;}

.econtent li img{ float: left; margin-left: 18px; margin-top: 12px; margin-right: 10px;}

.econtent li div.a{ width: 210px; margin-top: 16px; margin-bottom: 2px;}
.econtent li div.a a{ text-decoration: underline;}
.econtent li div.a a:hover{ color:#424d22;}
.econtent div.more{float: right; margin-right: 28px;}


/* 橫幅banner */
.hslider{height:120px;width:930px;overflow: hidden;position: relative;}
.hslider-content li{ display: block;  position: relative; z-index: 1;  width: 930px;  height: 120px;  overflow: hidden;float: left}
.hslider-content .hslider-c{display: none;}
.hslider-content .active{display: block;z-index: 3;}
.hslider .main-img {display:block;}
.hslider .left-img { opacity:0; display: block;z-index: 1;position: absolute;left:-800px;_left: 0;_display: none;top: 0;}
.hslider .right-img { opacity:0; display: block;z-index: 2;position: absolute;right:20px;_right: 0;_display: none;top: 0;}
.hslider-nav{ position: absolute; z-index: 4; bottom: 5px; right: 444px; }
.hslider-nav li{background:#fff;float:left;display: inline;width: 7px;height:7px; border-radius: 7px; margin-left:10px;font-size:0;line-height:0; opacity: 0.4;filter: alpha(opacity=40);overflow: hidden;cursor: pointer}
.hslider-nav li.active{ opacity: 1; filter: alpha(opacity=100); }
.hslider .next,.hslider .prev{position:absolute;top:50%;margin-top:-31px;z-index:4;width:28px;height:62px;line-height:62px;background: #000;background:rgba(0,0,0,.2);color:#fff;text-align:center;font-size:22px;font-weight:400;font-family:simsun;cursor: pointer;_background-color: #000;filter: alpha(opacity=20);-webkit-user-select:none;}
.hslider .hslider-pager{display:none;}
.hslider:hover .hslider-pager{display:block;}
.hslider .prev{left:0;border-radius:0 5px 5px 0;}
.hslider .next{right:0;border-radius:5px 0 0 5px;}


#J_slider4 .hslider-content{position: absolute;top:0;}
#J_slider4 .hslider-content .hslider-c{display:inline;position: absolute;left:0;top:0;opacity:0;transition: opacity 0.3s ease-in;}
#J_slider4 .hslider-content .active{opacity:1;}