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

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
html {
	-ms-touch-action: none;
}
body, ul, li {
	padding: 0;
	margin: 0;
	border: 0;
}
a{ text-decoration:none;}
body {
	height:100%;
	font-size: 12px;
	font-family: ubuntu, helvetica, arial;
	/*overflow: hidden; */
	/* this is important to prevent the whole page to bounce */
}
#header {
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	width: 100%;
	height:3rem;
	line-height: 45px;
	background: #ccc;
	padding: 0;
	color: #eee;
	font-size: 20px;
	text-align: center;
	font-weight: bold;
	border-bottom: 2px solid #427FDA;
	overflow:hidden;
}
#footer {
	position: fixed;
	z-index: 5;
	bottom: 0;
	left: 0;
	width: 100%;
	height:4rem;
	background: #0D4888;
	padding: 0;
}
#wrapper {
	position: absolute;
	z-index: 1;
	top: 3rem;
	bottom: 4rem;
	left: 0;
	width: 100%;
	background: #657BA9;
	/*overflow: hidden;*/
}
#mask{
	width:100%;
	height:100%;
	z-index: 3;
	position:absolute;
	background:url(../images/fancybox_overlay.png);
}
.search{ width:96%;margin: 0 auto;}
.city {
	width: 37%;
	padding: 0 1.8rem 0 2%;
	margin-right:1%;
	background: url(../images/dropdown-v.jpg) no-repeat right center #FFF;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #707070;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	color: #666;
}
.keyword-input {
	width: 57%;
	padding:0 1% 0 2.2rem;
	background: url(../images/icon-search.jpg) no-repeat left center #FFF;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid #707070;
	color: #666;
}
#scroller {
	position: absolute;
	z-index: 1;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	width: 100%;
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: none;
	-o-text-size-adjust: none;
	text-size-adjust: none;
	background-color:#FFF;
}

.city,.keyword-input{height:2rem;background-size: auto 1.8rem;	font-size: 0.7rem;font-family: 微軟正黑體, 'Microsoft JhengHei';}
.width-combine{ width:79%; display:inline-block;vertical-align: text-bottom;}
.btn-search{vertical-align: text-bottom; background:url(../images/mbtn-go.png) no-repeat center center; width:14%; height:100%;font-size:0;background-size: contain;}
.btn-search,.btn-search img{display:inline-block;}
.btn-search,.city,.keyword-input{}
.hide{ display:none;}
.bounce-menu{
    position: absolute;
	bottom:4rem;
	z-index:4;
    width: 100%;
    height:8rem;
	background:url(../images/boun-nav_bg.png) no-repeat center center;
	background-size:100% 100%;
	/*background: #60c9ab;*/
}
/*
.bg-left{background:url(../images/sn-left.jpg) no-repeat right center;float:left;}
.bg-right{background:url(../images/sn-right.jpg) no-repeat left center;float: right;}
.bg-left,.bg-right{ width:2%; height:100%;background-size:cover auto;}
*/
.boun-nav{ width:96%; height:100%; margin:12px auto;}
.boun-nav li{float:left; width:24.8%;text-align: center;/* background:url(../images/sn-interval.png) no-repeat left center;*/}
/*.boun-nav li:first-child{background:none;}*/
.boun-nav a{ font-size:1rem; color:#009d70; text-decoration:none;line-height:3.4rem;}

.row-top{padding:0 3%;width:100%;height:2rem; border-bottom:1px solid #aaa;overflow: hidden;}
.logo{display:block;width:25%; height:2rem; margin-right:3%; float:left; background:url(../images/logo_m.jpg) no-repeat center;background-size: contain; font-size:0;}
.bread_disp{padding-left:5px; margin: 0.5rem 0; color:#E05334;font-family:微軟正黑體,'Microsoft JhengHei';font-size:0.7rem;font-weight:bold; line-height:1.9rem; border-left:1px solid #024432;}

.content-list li{padding:2% 3%;width:100%;/*height:5rem*/;border-bottom:1px solid #aaa;overflow: hidden; position:relative;}
.content-list a {text-decoration: blink;width: 100%;height: 100%;display: block;}
.pic{ position:relative; overflow:hidden; width:auto;height:4.5rem; float:left;margin-right: 3%;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}
/*.pic > img{ max-width:100%; position:absolute;}*/
.list-title{ color:#653302;font-size: 1rem;font-weight: bold;line-height: 1rem;}
.list-desc{ color:#4e4e4e;font-size: 0.85rem;line-height: 1rem;height: 2rem; display: block; overflow: hidden;padding-top:1px}
.btn-more{max-width:15%; max-height:20px; position:absolute;right: 2%;bottom: 6%;}

.row-bottom{padding:2%;text-align: center;overflow: hidden;}
.row-bottom span{color:#555}
.row-bottom a{
	BORDER: #555 1px solid;
    MARGIN: 0 2px;
    COLOR: #555;
    PADDING: 1px 3px;;
    TEXT-DECORATION: none;
}
.row-bottom a:hover{BORDER: #C3CEFF 1px solid;  BACKGROUND-COLOR: #C3CEFF}
a.btn-go2{ background:url(../images/mbtn-go2.jpg) no-repeat; background-size:CONTAIN; font-size:0; height: 1.5rem; width: 2rem; display: inline-block;  vertical-align: middle; border:none;}

.menu {
	width: 96%;
	height:inherit;
	border: 1px solid #3679C8;
	margin: 2px auto;
	clear: both;
	overflow:hidden;
}
.menu>li {
	width: 19.8%;
	height: 100%;
	display: block;
	float: left;
	text-align: center;
	background-repeat:no-repeat;
	background-position:center;
	background-size: contain;
}
.menu>li:hover, .btnx.select {
	background-color: #3779C8;
	border-top: 2px solid #3779C8;
	border-left: 1px solid #078350;
}
.menu .btnx{background-image:url(../images/btn_01.png)}
.menu .btn2{background-image:url(../images/btn_02.png)}
.menu .btn3{background-image:url(../images/btn_03.png)}
.menu .btn4{background-image:url(../images/btn_04.png)}
.menu .btn5{background-image:url(../images/btn_05.png)}
.menu a {
    width: 100%;
    height: 100%;
    display: block;
}

/***m_list-content***/
.list-content-area{position: relative;margin-top: 0.5rem;}
.discount-flag{ position:absolute; right:2%;top: -0.5rem;}
.discount-flag img{max-width:2.5rem;}

.list-left{float:left; width:30%;}
.img-row{}
.img-row img{width: 90%; margin: 0 auto;  display: block;}
.share-row{ margin-top:6%; overflow:hidden; text-align:center;}
.share-row a{ display:inline-block; width:1.4rem; height:1.4rem; background-size:contain; margin:0 0.2rem;}
.share-icon1{ background:url(../images/icon_m-fb.jpg) no-repeat;}
.share-icon2{ background:url(../images/icon_m-mail.jpg) no-repeat;}

.main-col {margin: 0 2% 0 30%;line-height: 125%;}
.main-col h2{ font-size:1.3rem; font-weight:bold; color:#319800;line-height: 150%;}
.list-panetitle{color:#c00;font-size:16px;padding-top:8px}

.list-feature{width:70%; margin-bottom:3%;font-size:14px;padding-top:8px;line-height:20px}



.list-notice{}
dl.list-notice dd{ margin-bottom:3%;}

.shop-info{ background:#DEEBFF; margin:3% 0;padding: 2%;}
.shop-info dl{border-bottom: 1px solid #8e7e62; margin-bottom:2%; padding-bottom:2%;}
.shop-info-title{color:#C00;font-size:15px}

.foot-notice{ background:#eee;margin: 0 2%; padding:2%; font-size:0.9rem; line-height:125%;}

.foot-info{margin:2%;color: #5bb230;font-size:0.6rem; overflow:hidden; clear:both;}
.pn{font-weight: bolder;}
.service-line,.service-mail{float: left;}
.service-mail{margin-left:2%;}
.service-mail,.service-mail a,.service-mail a:hover{color: #666;}
.service-line:before,.service-mail:before{display: inline-block;top:2px;content: "";}
.service-mail:before{width: 16px;
    height: 0.7rem;background: url(../images/icon-contact.png)no-repeat 0 0;background-size: 100%;}
.service-line:before{
    width: 16px;
    height: 0.7rem;
    background: url("../images/icon-service.png") no-repeat 0 0;
	background-size: 100%;
}

#coupon-iframe{
    z-index: 1;
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: #fff;
	text-align: center;
	padding: 3.3rem 2% 4rem;
}
.coupon-img{max-width:100%; max-height:75%;}   
.coupon-back-btn{ height:25%}
.coupon-back-btn img {margin: 1%;}