@charset "utf-8";

@media screen and (min-width: 1600px) and (max-width: 1920px) {
}


@media only screen and (max-width: 992px) {
	
	/* == 06. 主框架 =======================================*/
	.page-flex-left{ 
		position:fixed; 
		z-index:99; 
		left:-260px;
		width:250px; 
		height:100%; 
		background:#fff; 
		padding-top:140px;
		
		transition:All 0.5s ease;
	}
	.page-flex-left.opened{ left:0; }
	.page-flex-right{ width:100%; padding:120px 15px 0 15px }
	
	
	/* == 07. 左側列之選單設定 =======================================*/
	.side-menu-area{ border-top-width:0px; margin-bottom:15px; }
	
	.side-welcome{ display:none; }
	
	.side-nav li a{ padding-top:11px; padding-bottom:11px; }
	.side-nav > li > a{ padding-top:16px; padding-bottom:16px; }
	
	ul.mtree li.mtree-node > a:before{ top:25px; right:33px; }
	.side-nav li.mtree-node.mtree-open > a:before{ top:22px;  }
	
	
	
	/* == 08. 小螢幕時選單設定 =======================================*/
	.fixbar{ display:block; } 
	.noScroll { overflow: hidden; }
	
	
	
	/* == 10. 頁面共同設定 =======================================*/
	.three-cols-list li{ width:48%; margin-right:4%; }
	.three-cols-list li:nth-child(3n){ margin-right:4%; }
	.three-cols-list li:nth-child(2n){ margin-right:0; }
	
	
	
	/* == 11. 登入後進入的第一頁-歡迎頁 member_center.php =======================================*/
	.desktop-welcome-txt{ display:none; }
	.mobile-welcome-txt{ display:block; }
	
	
	
	/* == 18. 我的預約 =======================================*/
	.reserve-line-content .flex-left{ width:100%; }
	.reserve-line-content .flex-right{ width:100%; text-align:left; }
	
	
	/*.reserce-love-list{ max-width:400px; margin-left:auto; margin-right:auto; }
	.reserce-love-list li{ width:100%; margin-right:0; }*/
	
	
}


@media only screen and (max-width: 768px) {
	
	/* == 05. 表單套包設定 =======================================*/
	.form-line.third-width , .form-inline-line.third-width{ width:100%; margin-right:0; }


	
	/* == 10. 頁面共同設定 =======================================*/
	.three-cols-list li{ width:100%; margin-right:0; }
	.three-cols-list li:nth-child(3n){ margin-right:0; }
	
		
	
	/* == 18. 我的預約 =======================================*/
	.reserve-list{ max-width:400px; margin-left:auto; margin-right:auto; }
	.reserve-line-heading .flex-left{ width:100%; }
	.reserve-line-heading .flex-center{ width:100%; }
	.reserve-line-heading .flex-right{ width:100%; text-align:left; }

	.mobile-show{ display:block; }
	
	.scrollable{ overflow: auto; }
	.scrollable-item{ width:1000px; margin-bottom:30px; }
	
	

	.mini_search:before {
		cursor:pointer;
		content:attr(data-label);
		text-align:center;
		display:block;
		line-height:30px;
		color:blue;
	}
	.mini_search {
		padding:0px;
		height:30px;
		overflow:hidden;
		position:relative;
	}
	.mini_search_open:before {
		content:attr(data-label-close);
		position:absolute;
		left:50%;
		top:-10px;
		margin-left:-8px;
		color:red;font-size:1.5em;
	}
	.mini_search_open {
		padding:30px;
		height:auto;
		overflow:unset;
	}
}


@media only screen and (max-width: 640px) {
	
	/* == 04. 註冊、登入等填表設定 =======================================*/
	.backend-frame{ padding-left:15px; padding-right:15px; }
	
	
	/* == 05. 表單套包設定 =======================================*/
	.form-line .fm-title{ width:100%; margin-bottom:3px; }
	.form-line .fm-wrap{ width:100%; }
	.form-line.half-width , .form-inline-line.half-width{ width:100%; margin-right:0; }
	
	
	/* == 10. 頁面共同設定 =======================================*/
	.search-box{ margin-bottom:20px;}
	.search-box.last{ margin-bottom:0; }
	.search-item .control-input{ margin-top:7px; }
	
	
	/* == 12. 我的活動記事-參與過歷史活動 m_events_history.php =======================================*/
	.events-heading{ padding-left:0px; }
	.events-note{ position:relative; top:auto; left:0; display:block; }
	.events-view-line{ position:relative; bottom:auto; text-align:center; }
	.events-view-btn{ display:inline-block; margin:10px; }
	
	
	/* == 14. 作伙探夥伴中心-商品推廣 m_pd.php =======================================*/
	.promotion-box:before{ display:none; } 
	.promotion-left-area{ width:100%; padding:0px 0 15px 135px; min-height:135px; }
	.promotion-right-area{ width:100%; padding:15px 0 0 0; border-top:1px solid #ccc; }
	
	
	/* == 16. 賺錢資訊-最新賺錢資訊 m_money.php =======================================*/
	.social-share-item{ padding-right:20px; }
	.social-share-gobtn{ 
		position:relative;
		top:auto;
		right:auto;
		width:100%;
		height:auto;
		padding:5px 0 3px 0;
		margin:10px 0;
		
		display:flex;
		flex-wrap:wrap;
		justify-content:center;
		align-items:center;
	}
	.social-share-gobtn .title{ width:100%; }
	
}


@media only screen and (max-width: 480px) {
	
	/* == 06. 主框架 =======================================*/
	.page-flex-left{ left:-105%; width:100%; }
	
	
	/* == 14. 作伙探夥伴中心-商品推廣 m_pd.php =======================================*/
	.promotion-left-area{ padding:0px 0 10px 0px; min-height:auto; }
	.promotion-left-area .item-thumb-frame{
		position:relative; 
		top:0;
		left:0;
		width:120px;
		height:120px;
		margin:0 auto 15px auto;
	}
	
	
	/* == 16. 賺錢資訊-最新賺錢資訊 m_money.php =======================================*/
	.social-share-line{ margin:10px 0; }
	.social-share-cate{ margin-right:0; }
	.social-share-title , .social-share-state , .social-share-time , .social-share-point{ display:block; margin-right:0; }
	
}


@media only screen and (max-width: 360px) { 	
}






