@charset "UTF-8";
/* CSS Document */
/*  ---------------定義整頁 --------------- */
body {
	margin: 0px;
	padding:0px;
	font-family:"微軟正黑體","蘋果儷中黑","華康中黑體",  Arial, Helvetica, sans-serif;
	background:url(../pic/bg.jpg) top center;
	line-height: 1; 
}
html,a,form,area,div,img,td,th,ul,ol,dl,li,dt,dd,h1,h2,h3,h4,h5,h6,p {
	margin:0px;
	padding-left:0px;
}
img {
	border:none;
}
a,a:focus,a:visited {
	color:#492F1C;
	outline:none;
	text-decoration:none;
}
a:active,a:hover {
	color:#5B3B25;
	outline:none;
	text-decoration:none;
}
ul {
	list-style:none;
}
/*===============================================
clearfix
===============================================*/
.clearfix:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
.clearfix {
	display:inline-block;
}
display:inline
/* Hides from IE-mac \*/
*html .clearfix {
	height:1%;
}
.clearfix {
	display:block;
}
#clear {
	clear:both;
	height:0px;
}
/*===============================================
版面
===============================================*/
.bg_light{
}
#header {
	margin:0px;
	padding:0px 0px 0px 0px;
}
#head {
	margin:0px;
	padding:0px;
	margin:auto;
	width:990px;
	/* background:url(../pic/header_bg.png) top center no-repeat; */
}
#logo{
	position: relative ;
}
#logo::after{
	content: "" ;
	position: absolute ;
	width: 296px ;
	height: 45px ;
	top: 10px ;
	right: 0 ;
	transform: translateX(94%) ;
	background-color: yellow ;
	background:url(../pic/head-title.svg) top center no-repeat;
}

#inhead {
}
#picer {
	padding:0px 0px 0px 0px;
}
#pic {
	margin:0px;
	padding:0px;
	margin:auto;
	width:820px;
}
#inpic{
	padding:10px;
	margin:auto;
	width:800px;
}
#mider {
	padding:0px 0px 0px 0px;
	
}
#mid {
	padding:0px;
	margin:auto;
	width:980px;
	height:auto!important; 
	height:700px; 
	min-height:700px;
}
#inmid {
	padding:0px;
	margin:auto;
	width:960px;
}
#footer {
	padding:0px 0px 0px 0px;
}
#foot {
	padding:0px;
	margin:auto;
	width:980px;
}
#infoot {
	padding:30px 0 0 0;
	margin:auto;
	width:960px;
	height:120px;
}
.footer13 {
	font-size:12px;
	color:#333;
	line-height:20px;
	letter-spacing:0px;
}
.footer11 {
	font-size:11px;
	color:#999;
}
.copyright{
	padding-top:32px;
	margin-left:10px;
	font-size:11px;
	color:#FFF;
	text-align:left;
}
.copyright a{
	font-size:11px;
	color:#FFF;
}
/*===============================================
上方header
===============================================*/
#logo {
	padding:0px 0px 0px 0px;
	float:left;
	
}
#lang1 {
	width:500px;
	height:60px;
	padding:0px 0px 0px 0px;
	float:right;
	text-align:right;
	display:inline-block;
}
#lang2 {
	width:500px;
	height:80px;
	padding:0px 0px 0px 0px;
	float:left;
	text-align:left;
	display:inline-block;
}
ul.topmenu {	
	margin:0px;
	padding:10px;
}
ul.topmenu li {
	float:right;
	display: inline-block;
	margin-right:5px;
}
ul.topmenu li a {
	color:#fff;
	font-size:12px;
	width:60px;
	height:38px;
	text-align:center;
	display: inline-block;
}
ul.topmenu li a:hover {
}
ul.topmenu_pic {
	margin-right:0px;
}
ul.topmenu_pic li {
	font-size:12px;
	float:right;
	display:inline-block;
	margin-right:8px;
}
ul.topNavi {
	margin:0px;
	padding:0px;
}
ul.topNavi li {
	float:left;
	display: inline-block;
}
ul.topNavi li a {
	color:#fff;
	font-size:16px;
	width:80px;
	height:50px;
	margin-right:10px;
	text-align:center;
	display: inline-block;
	
}
ul.topNavi .selected a {
}
ul.topNavi li a:hover {
}
/*===============================================
下方選單
===============================================*/
ul.bottommenu {	
	margin:0px;
	padding-top:20px;
}
ul.bottommenu li {
	float:left;
	display: inline-block;
	margin-right:15px;
}
ul.bottommenu li a {
	color:#fff;
	font-size:12px;
	width:80px;
	height:48px;
	padding: 32px 0 0 0;
	display: inline-block;
	text-align:center;
	background-color:#492F1C;
	-webkit-border-radius: 40px;/* support Safari, Chrome */
	-moz-border-radius: 40px;/* support firefox */
	border-radius: 40px;
	filter: alpha(opacity=80);
	-moz-opacity:0.8;
	opacity:0.8;
}
ul.bottommenu li a:hover {
	color:#492F1C;
	background-color:#fff;
}
ul.bottommenu_pic {
	margin-right:0px;
}
ul.bottommenu_pic li {
	font-size:12px;
	float:right;
	display:inline-block;
	margin-right:8px;
}
/*===============================================
title定義
===============================================*/
#title_left{
	width:420px;
	float:left;
}
#title_mid{
	width:330px;
	float:left;
	padding-top:6px;
}
#title_right{
	width:200px;
	float:right;
}
.title_tag_s {
	color:#492F1C;
	padding:20px 0px 0px 50px;
	letter-spacing:2px;
	width:179px;
	height:59px;
	background:url(../pic/title_bg_tag_s.png) no-repeat;
}
.title_tag {
	color:#492F1C;
	padding:16px 0px 0px 50px;
	letter-spacing:2px;
	width:370px;
	height:59px;
	background:url(../pic/title_bg_tag.png) no-repeat;
}

/*===============================================
search欄位
===============================================*/
/*===============================================
方型按鈕
===============================================*/
.category_title{
	/* padding:15px 0 0 0; */
	font-size:40px;
	color:#FFF;
	font-weight:bold;
}
.category_title_en{
	padding:10px 0 0 0;
	font-size:12px;
	color:#FFF;
}
.list_inline {
	width:13.66667%;
	float:left;
	display:inline-block;
	padding:0 10px;
}
.list_line {
	display:block;
	width:100%;
	padding:0 10px;
}
.list_circle {
	display:block;
	width:100px;
	padding:0 30px;
}
.list_line a:hover {
	display:block;
	-moz-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
}
.member_tag{
	width:100px;
	height:100px;
	background:url(../pic/member_tag.png) right top no-repeat;
	position:absolute;
	margin:-7px;
}
.btn_pic{
	width: 100%;
	/* height:86px; */
	-webkit-border-radius: 10px;/* support Safari, Chrome */
	-moz-border-radius: 10px;/* support firefox */
	border-radius: 10px;
	display:block;
	overflow: hidden;
}
.btn_pic img{
	width: 100%;
}
.btn_txt{
	position:absolute;
	bottom: 7px;
	width:113px;
	font-size:16px;
	font-weight:bold;
	height:22px;
	padding:5px 2px 0 2px;
	margin-top:59px;
	color:#FFF;
	background:#000;
	border-bottom-right-radius: 10px;
	-moz-border-bottom-right-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	-moz-border-bottom-left-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	filter: alpha(opacity=70);
	-moz-opacity:0.7;
	opacity:0.7;
	display:block;
	overflow:hidden;
}
.btn_txt_s{
	width:86px;
	font-size:12px;
	font-weight:bold;
	height:14px;
	padding:13px 2px 12px 2px;
	color:#595959;
	background:#fff;
	-webkit-border-radius: 10px;/* support Safari, Chrome */
	-moz-border-radius: 10px;/* support firefox */
	border-radius: 10px;
	display:block;
}


#map{
	height:380px;
	border-radius: 5px;
	box-shadow: 5px 5px 10px rgba(0,0,0,0.3);
}
/* TODO:地圖標籤樣式 */
.map-section{
	margin: 100px 0;
}

.gm-ui-hover-effect{
	right: 3px !important;
	top: 10px !important;
}

.map-card-content{
	background-color: #ffffff;
	display: inline-block;
	padding: 9px 16px 9px 12px;
	width: 230px;
	border-radius: 10px;
	box-sizing: border-box;
	position: relative;
}

.map-card-content .close-btn{
	position: absolute;
	top: 10px;
	right: 10px;
	opacity: 1;
	transition: all .3s ease;
}

.map-card-content .close-btn:hover{
	opacity: .7;
}

.map-card-content .text{
	font-weight: 500;
	font-size: 14px;
	color: #000000;
	margin-bottom: 10px;
	overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-align: left
}

.map-card-content .img{
	vertical-align: middle;
}

.map-btn-group{
	text-align: center;
}

.map-card-content .map-btn{
	font-weight: 500;
	display: inline-block;
	vertical-align: middle;
	padding: 8px 10px;
	background-color: #F4F4F4;
	color: #753A0E;
	border-radius: 15px;
	opacity: 1;
	transition: opacity .3s ease;
	box-sizing: border-box;
	font-size: 14px;
}

.map-card-content .map-btn:hover{
	opacity: .7;
}

.map-card-content .map-btn:nth-of-type(1){
	margin-right: 10px;
}

.map-btn span{
	display: inline-block;
	vertical-align: middle;
}


/* TODO: 內頁list_inline */
.list_inline.category-page{
	width: 100px;
	padding: 0;
}

.list_inline.category-page .btn_txt{
	width: 82px;
}

/* TODO: 內頁color_btn */
.list_inline.category-page .color_btn01,.list_inline.category-page .color_btn02, .list_inline.category-page .color_btn03, .list_inline.category-page .color_btn04, .list_inline.category-page .color_btn05 ,.list_inline.category-page .color_btn06, .list_inline.category-page .color_btn07,.list_inline.category-page .color_btn08, .list_inline.category-page .color_btn09{
	width: 100px;
	height: 100px;
}

/* TODO: 內頁color_btn */
.list_inline.category-page .color02_btn{
	width: 100px;
	height: 100px;
}
/*=紅色=*/
.color_btn01{
	width:100%;
	height:131px;
	background:url(../pic/color_btn01.png);
	text-align:center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-position: center center;
	background-size: cover;
} 
.color01_btn{
	width:100%;
	height:131px;
	background:url(../pic/color_btn01_bg.png);
	background-position: center center;
	background-size: cover;
	text-align:center;
	display:block;
	margin-top:14px;
	padding:7px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
	box-sizing: border-box;
	position: relative;
}
.color01_btn_txt{
	width:92px;
	height:auto!important; 
	height:40px; 
	min-height:40px;
	background:url(../pic/color_btn01_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:4px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
}
   
/*=黃色=*/
.color_btn02{
	width:100%;
	height:131px;
	background:url(../pic/color_btn02.png);
	text-align:center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-position: center center;
	background-size: cover;
}
.color02_btn{
	width:100%;
	height:131px;
	background:url(../pic/color_btn02_bg.png);
	background-position: center center;
	background-size: cover;
	text-align:center;
	display:block;
	margin-top:14px;
	padding:7px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
	box-sizing: border-box;
	position: relative;
}
.color02_btn_txt{
	width:92px;
	height:auto!important; 
	height:40px; 
	min-height:40px;
	background:url(../pic/color_btn02_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:4px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
}
   
/*=綠色=*/
.color_btn03{
	width:100%;
	height:131px;
	background:url(../pic/color_btn03.png);
	text-align:center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-position: center center;
	background-size: cover;
}
.color03_btn{
	background:url(../pic/color_btn03_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:7px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
	box-sizing: border-box;
	position: relative;
	background-size: cover;
	background-position: center center;
	width: 100%;
	height:131px;
}
.color03_btn_txt{
	width:92px;
	height:auto!important; 
	height:40px; 
	min-height:40px;
	background:url(../pic/color_btn03_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:4px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
}
/*=藍綠色=*/
.color_btn04{
	width:100%;
	height:131px;
	background:url(../pic/color_btn04.png);
	text-align:center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-position: center center;
	background-size: cover;
}
.color04_btn{
	width:86px;
	height:86px;
	background:url(../pic/color_btn04_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:7px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
	box-sizing: border-box;
	position: relative;
	background-size: cover;
	background-position: center center;
	width: 100%;
	height:131px;
}
.color04_btn_txt{
	width:92px;
	height:auto!important; 
	height:40px; 
	min-height:40px;
	background:url(../pic/color_btn04_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:4px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
}
/*=藍色=*/
.color_btn05{
	width:100%;
	height:131px;
	background:url(../pic/color_btn05.png);
	text-align:center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-position: center center;
	background-size: cover;
}
.color05_btn{
	width:86px;
	height:86px;
	background:url(../pic/color_btn05_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:7px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
	box-sizing: border-box;
	position: relative;
	background-size: cover;
	background-position: center center;
	width: 100%;
	height:131px;
}
.color05_btn_txt{
	width:92px;
	height:auto!important; 
	height:40px; 
	min-height:40px;
	background:url(../pic/color_btn05_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:4px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
}
/*=深藍色=*/
.color_btn06{
	width:100%;
	height:131px;
	background:url(../pic/color_btn06.png);
	text-align:center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-position: center center;
	background-size: cover;
}
.color06_btn{
	width:86px;
	height:86px;
	background:url(../pic/color_btn06_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:7px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
	box-sizing: border-box;
	position: relative;
	background-size: cover;
	background-position: center center;
	width: 100%;
	height:131px;
}
.color06_btn_txt{
	width:92px;
	height:auto!important; 
	height:40px; 
	min-height:40px;
	background:url(../pic/color_btn06_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:4px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
}
/*=紫色=*/
.color_btn07{
	width:100px;
	height:100px;
	background:url(../pic/color_btn07.png);
	text-align:center;
	display:block;
}
.color07_btn{
	width:86px;
	height:86px;
	background:url(../pic/color_btn07_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:7px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
	box-sizing: border-box;
	position: relative;
	background-size: cover;
	background-position: center center;
	width: 100%;
	height:131px;
}
.color07_btn_txt{
	width:92px;
	height:auto!important; 
	height:40px; 
	min-height:40px;
	background:url(../pic/color_btn07_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:4px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
}
/*=紅紫色=*/
.color_btn08{
	width:100px;
	height:100px;
	background:url(../pic/color_btn08.png);
	text-align:center;
	display:block;
}
.color08_btn{
	width:86px;
	height:86px;
	background:url(../pic/color_btn08_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:7px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
	box-sizing: border-box;
	position: relative;
	background-size: cover;
	background-position: center center;
	width: 100%;
	height:131px;
}
.color08_btn_txt{
	width:92px;
	height:auto!important; 
	height:40px; 
	min-height:40px;
	background:url(../pic/color_btn08_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:4px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
}
/*=咖啡色 會員中心=*/
.color_btn09{
	width:100px;
	height:100px;
	background:url(../pic/color_btn09.png);
	text-align:center;
	display:block;
}
.color09_btn{
	width:86px;
	height:86px;
	background:url(../pic/color_btn09_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:7px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
	box-sizing: border-box;
	position: relative;
	background-size: cover;
	background-position: center center;
	width: 100%;
	height:131px;
}
.color09_btn_txt{
	width:92px;
	height:auto!important; 
	height:40px; 
	min-height:40px;
	background:url(../pic/color_btn09_bg.png);
	text-align:center;
	display:block;
	margin-top:14px;
	padding:4px;
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow: hidden;
}
.category_title_member{
	padding:35px 0 0 0;
	font-size:18px;
	color:#FFF;
	font-weight:bold;
}
/*===============================================
分類列表頁
===============================================*/
.arrow_bottom{
	width:32px;
	margin:auto;
	padding-top:10px;
}
/*===============================================
主要
===============================================*/
.all_content{
	float:right;
	width:960px;
	height:auto; 
	min-height:500px;
	padding-top:10px;
}
.left_content{
	float:left;
	width:140px;
	padding-top:10px;
}
.right_content{
	float:right;
	width:820px;
	height:auto!important; 
	height:500px; 
	min-height:500px;
	padding-top:10px;
}
.right_content1{
	float:right;
	width:820px;
	height:auto!important; 
	height:40px; 
	min-height:40px;
}
.mbox {
	display:inline-block;
	float:left;
    width: 250px;
	height:250px;
    padding: 0px;
    margin-right: 11px;
	margin-left:11px;
	margin-bottom:22px;
	-moz-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow:hidden;
}
.lbox {
	position:relative;
	float:left;
    width: 840px;
	height:auto!important; 
	height:460px; 
	min-height:460px;
	margin-left:64px;
	margin-bottom:10px;
	-moz-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow:hidden;
	background:#FFF;
}
.lbox1 {
	float:left;
    width: 840px;
	height:auto!important; 
	height:495px; 
	min-height:495px;
	margin-bottom:10px;
	margin-left:64px;
	-moz-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow:hidden;
	background:#FFF;
	z-index:-99999999999999;
	position: relative;
	padding-bottom: 40px;
}
.lbox1_back {
	display:none;
	float:left;
    width: 840px;
	height:auto!important; 
	height:495px; 
	min-height:495px;
	margin-bottom:10px;
	margin-left:64px;
	-moz-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow:hidden;
	background:#FFF;
	z-index:-99999999999999;
	position: relative;
}
.lbox_answer{
	position:absolute;
	bottom:6px;
	right:33px;
	width:140px;
	height:45px;
	background:url(../pic/more_yellow.png);
	cursor: pointer;
	margin-right:36px;
	margin-bottom: 4px;
}
.lbox_question, .lbox_more, .lbox_more_2, .lbox_more_question{
	position:absolute;
	bottom:-9px;
	right:200px;
	width:140px;
	height:45px;
	background:url(../pic/more_white.png);
	cursor: pointer;
}
.lbox_more_question{
	right: 33px;
	background: url(../pic/more_yellow.png);
}
.lbox_question{
	width: auto;
	background: none;
	line-height: 45px;
	font-weight: bold;
	letter-spacing: 0.1em;
	cursor: pointer;
}
.correct_answer .lbox_more, .correct_answer .lbox_more_2{
	right: 33px;
}
.wrong_answer .lbox_question{
	right: 33px;
	width: 140px;
	background:url(../pic/more_white.png);
}
.answer_detail .lbox_more_question{
	background:url(../pic/back_yellow.png);
}
.lbox_co{
	position:absolute;
	float:left;
    width: 81px;
	height:407px;
	margin-left:24px;
	margin-top:20px;
	z-index:100;
}
.lbox_close {
	position:absolute;
	float:left;
    width: 87px;
	margin-left:840px;
	margin-top:32px;
	z-index:9999999999999999999999;
}
.lbox_arrow_next_f {
	position:absolute;
	float:left;
    width: 49px;
	margin-left:920px;
	margin-top:140px;
}
.lbox_arrow_next {
	position:absolute;
	float:left;
    width: 49px;
	margin-left:920px;
	margin-top:140px;
}
.lbox_arrow_pre {
	position:absolute;
	float:left;
    width: 49px;
	margin-left:0px;
	margin-top:140px;
	z-index:99999999999999999;
}
.lbox_pic {
    margin:auto;
	width:600px;
/*	height:305px;*/
	height: auto;
	padding:30px 10px 10px 10px;
	font-size:12px;
	line-height:18px;
	color:#333;
	z-index:9999999999999;
	overflow:hidden;
	text-align:center;
}
.lbox_pic img{
	max-width: 100%;
	height: auto!important;
	margin-bottom: 1.6em;
}
.lbox_desc {
    position:absolute;
    bottom: 9px;
    width: 810px;
	height:20px;
    color:  #000;
    font-size: 14px;
    margin: 10px 0px 0px 20px;
    padding:5px;
}
.lbox_voice{
	float:left;
	display:block;
	width:32px;
	height:32px;
	padding-left: 13px;
	padding-top: 10px;
	z-index:99999999999;
}
.lbox_title {
    font-size:40px;
    font-weight: bold;
	color:#454545;
	padding:5px;
	/*width:740px;*/
	height:42px;
	line-height:42px;
	overflow:hidden;
	text-align:center;
}
.back .lbox_title{
	margin: 190px auto 0 auto;
}
.back.more-info .lbox_title{
	margin-top: 0;
}
.lbox_title_en {
    font-size: 16px;
	color:#5E5E5E;
	padding:15px 5px 10px 5px;
	/*width:740px;*/
	height:auto;
	overflow:hidden;
	line-height:20px;
	text-align:center;
}
.question_box .lbox_title_en {
	display: block;
	font-size: 20px;
	line-height: 1.4em;
}
.lbox_list{
	position: relative;
}
.lbox_list a {
	position: absolute;
	left: 88px;
	top: 30px;
	z-index: 21;
	float:left;
    font-size: 11px;
	color:#5E5E5E;
	width:70px;
	padding-top:4px;
	padding-left:15px;
	height:16px;
	text-align:center;
	background:url(../pic/list_iocn_new.png) no-repeat;
	background-position:5px 0px;
	display:block;
}
.social_share{
	float:left;
	width:140px;
	padding-top:0px;
	padding-left:0px;
	height:16px;
	text-align:center;
	display:block;
}
.lbox_pagenation {
	float:left;
    font-size: 11px;
	color:#5E5E5E;
	width:160px;
	padding-top:4px;
	height:16px;
	text-align:center;
	/*margin-left:-30px;*/
}
.lbox_note{
	float: right;
	padding: 5px 180px 0 0;
	font-size: 11px;
	color:#5E5E5E;
	letter-spacing: 0.05em;
}
.wrong_answer .lbox_note{
	color: #fff;
}
.apple.lbox_note{
	position: absolute;
	right: 33px;
	bottom: -9px;
	width: 140px;
	height: 45px;
	background: url(../pic/yellow.png);
	padding: 0;
}
.correct_answer .apple.lbox_note{
	background: url(../pic/white.png);
}
.lbox_love a{
	float:left;
	font-size: 11px;
	color:#492F1C;
	padding-top:4px;
	padding-left:16px;
	margin-left:140px;
	height:16px;
	width:32px;
	background:url(../pic/heart.png) no-repeat;
	background-position:0px 5px;
	overflow:hidden;
	cursor:pointer;
}
.lbox_love a:hover{
	color:#ED5454;
	background:url(../pic/heart1.png) no-repeat;
	background-position:0px 5px;
}
.lbox_love a.active{
	float:left;
  font-size: 11px;
	color:#ED5454;
	padding-top:4px;
	padding-left:16px;
	margin-left:140px;
	height:16px;
	width:32px;
	background:url(../pic/heart1.png) no-repeat;
	background-position:0px 5px;
	overflow:hidden;
	cursor:pointer;
}
.lbox_love a.active:hover{
	color:#492F1C;
	background:url(../pic/heart.png) no-repeat;
	background-position:0px 5px;
}
.lbox_love a span {
	color:#ED5454;
	background:url(../pic/heart1.png) no-repeat;
	background-position:0px 5px;
}
.lbox_pics {
	float:left;
    font-size: 10px;
	color:#666;
	margin-left:10px;
	padding-top:4px;
	padding-left:3px;
	height:16px;
	width:15px;
	background:url(../pic/circle.png) no-repeat;
	background-position:0px 1px;
}
.lbox_lastpage{
	width: 20px;
	text-align: center;
	font-size: 12px;
	left: 20px;
	top: 185px;
	color: #5e5e5e;
	position: absolute;
}
.lbox_nextpage{
	width: 20px;
	text-align: center;
	font-size: 12px;
	color: #5e5e5e;
	position: absolute;
	right: 20px;
	top: 185px;
}
.lbox_icon {
	float:left;
	margin-left:5px;
    font-size: 11px;
	color:#492F1C;
	height:20px;
}
.lbox_icon img {
	float:left;
	margin-left:5px;
}
/* list_page.php 單字卡內容列表 */
.sbox {
	display:inline-block;
	float:left;
    width: 150px;
	height:150px;
    padding: 0px;
    margin-right: 5px;
	margin-left:5px;
	margin-bottom:12px;
	-moz-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-border-radius: 5px;/* support Safari, Chrome */
	-moz-border-radius: 5px;/* support firefox */
	border-radius: 5px;
	overflow:hidden;
	background-color:#FFF;
}
.sbox_black {
	display:inline-block;
	float:left;
    width: 150px;
	height:150px;
    padding: 0px;
    margin-right: 7px;
	margin-left:7px;
	margin-bottom:12px;
	-moz-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-border-radius: 5px;/* support Safari, Chrome */
	-moz-border-radius: 5px;/* support firefox */
	border-radius: 5px;
	overflow:hidden;
	background-color:#4D4D4D;
}
.sbox_black .sbox_pic {
	color:#fff;
}
.sbox_pic {
    margin:auto;
	width:140px;
	height:93px;
	padding:5px;
	font-size:12px;
	line-height:18px;
	color:#333;
	z-index:9999999999999;
	overflow:hidden;
	background-repeat: no-repeat;
}
.sbox_desc {
	height:20px;
	background:#fff;
    color:  #000;
    font-size: 14px;
    margin: 0px;
    padding:0px;
}
.sbox_title {
	width:140px;
    font-size: 11px;
	color:#000;
	padding:0px 5px 5px 5px;
	margin:auto;
	height:11px;
	line-height:17px;
	overflow:hidden;
	text-align:center;
}
.sbox_cover{
	width: 110px;
	font-size: 14px;
	color: #848484;
	margin: auto;
	line-height: 25px;
	text-align: center;
	padding-top: 15px;
	margin-bottom: -15px;
}
.sbox_pagenation {
    font-size: 11px;
	color:#5E5E5E;
	width:100px;
	padding-top:5px;
	height:16px;
	text-align:center;
	margin:auto;
}
/* -------------join.php-加入會員--------------- */
.nbox {
	position:absolute;
	float:left;
    width: 700px;
	height:auto!important; 
	height:300px; 
	min-height:300px;
	margin-left:65px;
	margin-bottom:10px;
	-moz-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	box-shadow:4px 4px 12px -2px rgba(0,0,0,0.5);
	-webkit-border-radius: 15px;/* support Safari, Chrome */
	-moz-border-radius: 15px;/* support firefox */
	border-radius: 15px;
	overflow:hidden;
	background:#FFF;
}
.join_title{
}
.join_table{
	padding:20px 20px 20px 20px;
	font-size:14px;
	color:#333;
	width:500px;
	margin:auto;
}
.join_btn{
	text-align:center;
}
.login_table{
	padding:20px 20px 20px 20px;
	font-size:14px;
	color:#333;
	width:400px;
	margin:auto;
}
.member_title{
	padding:20px;
	font-size:20px;
}
/* ---------------頁碼--------------- */
div.pagination {
	font-size:12px;
	padding:10px 10px 10px 10px;
	text-align:center;
}
div.pagination a {
	color:#fff;
	font-size:12px;
	margin-right:2px;
	width:40px;
	height:27px;
	padding:13px 0 0 0;
	display: inline-block;
	background-color:#492F1C;
	-webkit-border-radius: 40px;/* support Safari, Chrome */
	-moz-border-radius: 40px;/* support firefox */
	border-radius: 40px;
	filter: alpha(opacity=80);
	-moz-opacity:0.8;
	opacity:0.8;
}
div.pagination a:hover, div.pagination a:active, div.pagination a.active {
	color:#492F1C;
	background-color:#fff;
}
div.pagination span.current {
	color:#492F1C;
	background-color:#fff;
}
div.pagination span.disabled {
	color:#492F1C;
	background-color:#fff;
}
.fb_message{
	width:840px;
	margin:auto;
}
.article_title{
	padding:20px;
	font-size:20px;
}
.article_txt{
	padding:20px ;
}
.search_txt{
	color:#FFF;
}
.search_txt a {
	color:#FFF;
	display:block;
	text-decoration:underline;
	line-height:30px;
}
.search_box {
	padding:15px;
}
#FBLogin {cursor:pointer;}
/* 錯誤提示視窗  Start */
			#jsAlert-bg {
				width:100%;
				height:auto;
				height:100%;
				min-height:100%;
				text-align:center;
				overflow:hidden;
				margin:0 auto;
				position:fixed;
				top:0;
				left:0;
				z-index:9999;
				float:left;
			}
			#jsAlert-block {
				width:100%;
				height:auto;
				height:100%;
				min-height:100%;
				text-align:center;
				overflow:hidden;
				position:fixed;
				top:0;
				left:0;
				z-index:9999;
				float:left;
				text-shadow:none;
			}
			#jsAlert-inner {
				width:500px;
				overflow:hidden;
				text-align:left;
				text-shadow:none;
				line-height:1.8em;
				margin:0 auto;
				-webkit-border-radius: 15px;
				-moz-border-radius: 15px;
				border-radius: 15px;
				letter-spacing:1px;
				font-weight:bold;
				box-shadow:4px 4px 4px rgba(20%,20%,40%,0.6),8px 8px 12px rgba(20%,20%,40%,0.4),12px 12px 18px rgba(20%,20%,40%,0.4);
			}
			#jsAlert-title {
				width:440px;
				color:#fff;
				text-shadow:-1px -1px 5px #ddd, -1px 1px 15px #fff;
				font-size:22px;
				padding:15px 30px;
				background-color:#a4c76c;
				-webkit-border-top-left-radius: 15px;
				-webkit-border-top-right-radius: 15px;
				-moz-border-radius-topleft: 15px;
				-moz-border-radius-topright: 15px;
				border-top-left-radius: 15px;
				border-top-right-radius: 15px;
			}
			#jsAlert-content {
				width:440px;
				color:#398569;
				font-size:16px;
				padding:10px 30px 10px 50px;
				background-color:#d9e1cd;
				-webkit-border-bottom-right-radius: 15px;
				-webkit-border-bottom-left-radius: 15px;
				-moz-border-radius-bottomright: 15px;
				-moz-border-radius-bottomleft: 15px;
				border-bottom-right-radius: 15px;
				border-bottom-left-radius: 15px;
			}
/* 錯誤提示視窗  End */
#qrcode{
	float:right; 
	margin-top:-35px; 
	padding:0 60px;
	}
	
/* 輸入密碼頁  Go */
#password_box_bg{
	background:url(../pic/bg.jpg);
	width:100%;
	height:100%;
	left:0;
	top:0;
	}
	
#password_box_bg2{
	position: fixed;
	z-index:99999;
	background-color:rgba(0%,0%,0%,0.4);
	width:100%;
	height:100%;
	left:0;
	top:0;
	}
	
#password_box{
	position: fixed;
	z-index:999999;
	top:30px;
	left:50%;
	margin:0 0 0 -200px;
	height:526px;
	width:400px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	background:url(../pic/passwd_bg.png);
	}	
	
#password_box_title{
	font-size:16px;
	color:#F30;
	text-align: center;
	margin:230px 20px 30px 20px;
	line-height:28px;
	letter-spacing:1px;
	}
	
#password_box_title5{
	font-size:20px;
	color:#F30;
	text-align:center;
	line-height:50px;
	letter-spacing:1px;
	}
	
.password_box_input{
	width:200px;
	height:40PX;
	line-height:50px;
	color:#555;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	border:1px #ccc solid;
	}
	
.password_box_btn{
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	height:50PX;
	width:50PX;
	background:#d69a05;
	border:none;
	color:#fff;
	letter-spacing:2px;
	margin:0px 0 0 10px;
	cursor: pointer;
	}
#password_box_con{
	text-align:center;
	font-size:16px;
	}	
	
#password_box_close{
	float:right; 
	padding:200px 10px 0 0;	
	}
/* 輸入密碼頁  End */
/* 蘋果點數 150522*/
.apple a{
	margin-left:150px;
	float:left;
    font-size: 11px;
	color:#5E5E5E;
	width:60px;
	padding-top:4px;
	padding-left:15px;
	height:16px;
	text-align:center;
	background:url(../pic/apple.png) no-repeat;
	background-position:0px 0px;
	cursor:pointer;
	display:block;
}
.apple.lbox_note a{
	float: initial;
	width: 100%;
	height: 45px;
	line-height: 40px;
	font-size: 14px;
	font-weight: bold;
	color: #454545;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	background-position: left 10px center;
	background-size: 40px;
	margin: 0 auto;
}
.apple a:hover{
	background:url(../pic/apple_hover.png) no-repeat;
}
.apple.lbox_note a:hover{
	background-position: left 10px center;
	background-size: 40px;
}
.apple a.bite{
	background:url(../pic/apple_bite.png) no-repeat;
}
.apple.lbox_note a.bite{
	background-position: left 10px center;
	background-size: 40px;
}
.social_fb {
	float:left;
	width:80px;
	padding-top:0px;
	padding-left:0px;
	height:16px;
	text-align:center;
	display:block;
}
.social_copy {
	float:left;
    display: block;
	width:26px;
}
  .social_line {
	float:left;
	padding-top:0px;
	padding-left:0px;
    display: block;
}
.author{
	float:left; 
	margin:0 0 0 65px; 
	color:#f0f0f0;
	}
.author_logo{
	width: 150px;
	height: 30px;
	float: right;
	color: #fff;
	text-align: center;
	line-height: 30px;
	margin: 0 55px 0 0;
	background: #000;
	border-radius: 5px; 
	overflow: hidden;
	position: relative;
}
/*選擇題*/
.question_box{
	display: block;
	width: 100%;
	font-size: 36px;
	font-weight: bold;
	color: #454545;
	vertical-align: top;
	letter-spacing: 0.1em;
	line-height: 1.4em;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	padding: 55px 65px 0 90px;
}
.answer-block{
	display: block;
	width: 100%;
	color: #454545;
	vertical-align: top;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	padding: 45px 65px 50px 90px;
}
.answer-block input[type="radio"],.answer-block input[type="checkbox"]{
	display: none;
}
.answer-block input[type="radio"]+label,.answer-block input[type="checkbox"]+label{
	width: 100%;
	font-size: 20px;
	background: url(../pic/checkbox.png) left top 3px no-repeat;
	line-height: 1.4em;
	cursor: pointer;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	text-indent: -1em;
	padding: 5px 0 5px 60px;
}
.answer-block input[type="radio"]:checked+label,.answer-block input[type="checkbox"]:checked+label{
	background: url(../pic/checkbox_checked.png) left top 3px no-repeat;
}
.answer-block .pic-wrap{
	display: block;
	width: 500px;
	margin-top: 50px;
}
.answer-block .pic-wrap img{
	max-width: 100%;
	height: auto!important;
	margin-bottom: 1.6em;
}
.lbox1_back.wrong_answer{
	background: #ff5a5a;
}
.lbox1_back.correct_answer{
	background: #ffe17f url(../pic/correct.png) center no-repeat;
}
.lbox1_back.wrong_answer .lbox_title{
	height: auto;
	color: #fff;
	letter-spacing: 0.15em;
	margin: 190px auto 0 auto;
}
.back_to_question{
	display: block;
	width: 45px;
	height: 1em;
	line-height: 1em;
	font-size: 16px;
	font-weight: normal;
	border: #fff solid 1px;
	letter-spacing: 0.2em;
	cursor: pointer;
	padding: 9px 15px;
	margin: 15px auto 0 auto;
}
.radio_card .lbox1_back{
	display: block;
}
/*-----題目卡-----*/

.radio_card #demo2 {
  position: absolute;
  transform: scaleY(1);
  height: auto;
  transition: 0.5s;
  transition-timing-function: linear;
}
/*-----答對卡-----*/

.radio_card #demo3 {
  position: absolute;
  z-index: 1;
  transform: scaleY(0);
  height: 494px;
  transition: 0.5s;
  transition-timing-function: linear;
}
/*-----答錯卡-----*/

.radio_card #demo {
  position: absolute;
  z-index: 1;
  transform: scaleY(0);
  height: 494px;
  transition: 0.5s;
  transition-timing-function: linear;
}
/*-----解說卡-----*/

.radio_card #demo4 {
  position: absolute;
  transform: scaleY(0);
  height: auto;
  transition: 0.5s;
  transition-timing-function: linear;
}
.answer_detail{
	padding-bottom: 110px;
}
.more_image{
	width: 595px;
	overflow: hidden;
	margin: 65px auto 0 auto;
}
.more_image img, .more_image iframe{
	display: block;
	max-width: 100%;
	margin: 0 auto 30px auto;
}