@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@300;400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400&display=swap');
@import url("reset.css?v=2.1");
html, body{
	font-family: "微軟正黑體", Arial, Helvetica, sans-serif;
	
/* 	background: #cedc1c; */
}

body{
	width: 100%;
	
/* 文字的渲染方式 */
	-webkit-font-smoothing:antialiased;
	-moz-font-smoothing: antialiased;
	-ms-font-smoothing: antialiased;
	-o-font-smoothing: antialiased;
	font-smoothing: antialiased;

}

/* input{
	border-radius: 0!important;
} */


/* body#index{
	background: url("../images/bg/20230121bg.jpg?v=2") no-repeat right bottom fixed #000000; 
	                
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover; 
	background-position: center top;

} */

body#index.updbg{
	background: url("../images/bg/20240806bg.jpg?v=3.1") no-repeat center bottom fixed #000000; 
	background-size: cover!important; 
}

body#index.demobg{
	background: url("../images/bg/20240806bg.jpg?v=3.1") no-repeat center bottom fixed #000000; 
	background-size: cover!important; 
}

.d-flex{
	display: flex!important;
}

.mainHeader{
	width: 95%;
	height: 80px;
	margin: 0 auto;
	color: #5b5b5b;
}

.mainHeader a{
	color: #5b5b5b;
}


body.darkBgPage .mainHeader{
	color: #888888;
}

body.darkBgPage .mainHeader a{
	color: #888888;
}

.mainHeader h1, .mainHeader p, .mainHeader a.mailCheer, .mainHeader h1 a{
	line-height: 60px;
	float: left;
	font-size: 12px;
/* 	color: #c1c1c1; */
/* 	color: rgba(65, 65, 65, 0.6); */
/* 	color: #686868; */
	font-family: Georgia;
	font-weight: 400;
	font-size: 11px;
	
}

.mainHeader h1 a{
	text-decoration: none;
}

.mainHeader p{
	margin-left: 20px;
}

.mainHeader a.mailCheer{
	display: block;
	padding: 0px 10px;
	text-decoration: none;
	float: right;
	margin-left: 0px;
}


.pageloading{
	width:100%;
	height:100%;
	position:fixed;
	top:0;
	left:0;
	z-index:1000;
	background:#000000 url(../images/guest_loading.gif) no-repeat;

	background-position: center center;
} 


.head{
	width: 1400px;
	height: 115px;
	margin: 0 auto;
	padding-top: 20px;
}

.head a{
	float: right;
	font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    font-weight: lighter;
    color: #7c7878;
    line-height: 16px;
    text-decoration: none;
    margin-left: 50px;
}

.head h1{
	padding-left: 0px;
	float: left;
}

.head h1 a{
	margin-left: 0;
}
/*

.head h1 a:link, .head h1 a:visited{
	font-family: Verdana, Geneva, sans-serif;
	                font-size: 12px;
	                font-weight: lighter;
	                color: #7c7878;
	                line-height: 16px;
	                text-decoration: none;
}
*/

.head h1 a:hover{
	color: white;
}

.mobileBack{
	background: url("../images/bg/guest_bg_20230217.jpg") no-repeat;
	background-size: cover;
	background-position: top left;
	/* background-attachment: fixed; */
	width:100%;
	height: 100vh;
	position: fixed;
	z-index: -1;
}




.wrapper{
/* 	width: 1180px; */
	width: 95%;
	margin: 0 auto;
	min-width: 1180px;
	margin-bottom: 100px;
	display: flex;
	flex-direction: row;
}




/* 留言板 */
.wrapper .content.Left.message{
	width:100%;
	height:auto;
}


.leftMsgWrapper{
	width: auto;
	padding:0 13px;
	padding-bottom:13px;
	background: white;
	/* float: left; */
	margin-right: 20px;
	opacity: 1;
	transition: all .3s ease-in-out;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	margin-bottom:100px;
}

.leftMsgWrapper.xhide{
	opacity: 0;
}

.openMsg{
	display: none;
	text-decoration: none;
	color:#5f5c5c;
}

.content.Left.message .title{
	width: 100%;
}

.content.Left.message .title h2{
	font-size: 11px;
	color: #666666;
	font-family: 'Noto Serif TC', 'Noto Serif SC', serif;
	font-weight: normal;
}

.content.Left.message .title a{
	font-size: 11px;
	color: #666666;
	text-decoration: none;
	line-height: 3;
}


.content.Left.message .title table{
	width: 100%;
	margin-bottom: 1.2rem;
}


.content.Left.message .messageBox{
	display: flex;
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 1px solid #e3dddd;
}

.content.Left.message .messageBox.top:last-of-type{
/* 	border-bottom: 0px; */
}

/* 
.content.Left.message .messageBox.top{
	background: #f1f1f1; */
/*
	border-bottom: 2px solid black;
	border-top: 2px solid black;
	padding-bottom: 0px;
	padding-top: 10px;

/* 	background: -webkit-linear-gradient(#ffffff 0%, #eaeaea 100%); 
}
*/





.inTop{
	width: 100px;
	display: block;
	margin: 0 auto;
	text-align: center;
	background: #000;
	color: #ccc;
	font-size: 11px;
	padding: 5px;
	margin-top: 10px;
}




.content.Left.message .imgBox{
	width: 100px;
	float: left;
}



.content.Left.message .messageText{
	width: 100%;
	/* float: left; */
	margin-left:.5rem;
}

.content.Left.message .messageText h3{
	font-size: 10pt;
	color: black;
	line-height: 1.4;
	margin-bottom: 10px;
	font-family: 'Noto Serif TC', 'Noto Serif SC', serif;
}


.content.Left.message .messageText p{
	width: 100%;
	overflow: auto;
	line-height: 1.7;
	margin-bottom:1rem;
	word-wrap: break-word;
	text-align: justify;
	font-size: 10pt;
	color: #333333;
	font-family: 'Noto Serif TC', 'Noto Serif SC', serif;
}

/*
.content.Left.message .messageText p{
	 font-size:9pt;
	 color:rgba(128,128,128,1);	
	 background-color:#f2f2f2;
	 padding:15px 5px;	
	 border-radius:5px;
	}
*/

.content.Left.message .messageText .user, .content.Left.message .messageText .user a
{font-size: 10pt;color: #666666;line-height: 1.4;text-align: right;}

.content.Left.message .messageText .user, .content.Left.message .messageText .user .userinfo{
	display: flex;
	justify-content: flex-end;
	flex-direction: row;
	align-items: center;
}

.content.Left.message .messageText .user.replybtnbox{
	align-items: flex-end;
}

.content.Left.message .messageText .user.userWithid a{
	font-size: 10pt;
	line-height: 1.4;
}


.content.mobile.reply{
	display: none;
}

.content.Right.reply{
	display: block;
/* 	width: 410px; */
	/* min-width: 410px; */
/* 	background: red; */
	width: 60%;
/* 	float: left; */
	overflow: hidden;
/* 	margin-left: 20px; */
}

.content.Right.reply .noNukeTitle{
	width: 100%;
	text-align: right;
	margin-bottom: 5px;
}



/*
.blackBoard{
	font-family: Georgia, "STSong", "Times New Roman", Times, serif;
	padding-top: 0px;
	margin-bottom: 15px;
}
*/





.blackBoard {
    font-family: Georgia, "STSong", "Times New Roman", Times, serif;
    font-size: 12px;
    /* background: url(./images/guest/blackboardBack.gif) repeat-y; */
    background-color: black;
    /* width: 288px; */
/*     height: 100%; */
/*     padding: 13px; */
    padding-top: 0px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    /* min-width: 410px; */
    margin-bottom: 15px;
}



.content.Right.reply .blackBoard .replyTitle{
	width: 100%;
	font-size: 11px;
	color: #34dab5;
	background: #000000;
	padding:5px 15px;
}

.content.Right.reply .blackBoard .replyTitle p{
	font-family: Georgia, "STSong", "Times New Roman", Times, serif;
	float: left;
	height: 30px;
	line-height: 30px;
	width: 90%;
	text-align: center;
}

.content.Right.reply .blackBoard .replyTitle img{
	float: right;
}

.content.Right.reply .blackBoard .replyTitle a.fixBack{
	float: left; 
	color: #34dab5;
	height: 30px;
	line-height: 30px;
	font-size: 12pt;
	text-decoration: none;
}

.content.Right.reply .blackBoard .reply_content{
	font-family: 'Noto Serif TC', 'Noto Serif SC', serif;
    /* font-family: "微軟正黑體","Microsoft JhengHei","Heiti TC", arial; */
    background: rgba(0,0,0,1);
/*     height:auto; */
    height: min-intrinsic;
    
}


.content.Right.reply .blackBoard .reply_content p{
	padding: 0px 15px;
	padding-bottom: 20px;
    font-size: 13px;
    font-weight: 100;
    line-height: 1.6;
    color: #ffffff;
    opacity: 1;
     word-wrap: break-word;
    word-break: break-all;
}



.content.Right.reply .showBlackBoard{
	display: none;
}



/*
.content.Right.reply .blackBoard{
	font-family: Georgia, "STSong", "Times New Roman", Times, serif;
	background: #000000;
	padding: 15px;
	padding-top: 0px;
	margin-bottom: 15px;
}



.content.Right.reply .blackBoard .replyTitle{
	width: 100%;
	font-size: 11px;
	color: #34dab5;
	
}

.content.Right.reply .blackBoard .replyTitle p{
	font-family: Georgia, "STSong", "Times New Roman", Times, serif;
	float: right;
	height: 30px;
	line-height: 30px;
	width: 95%;
	text-align: center;
}

.content.Right.reply .blackBoard .replyTitle img{
	float: right;
}

.content.Right.reply .blackBoard .reply_content{
	font-family: Georgia, "STSong", "Times New Roman", Times, serif;
    /* font-family: "微軟正黑體","Microsoft JhengHei","Heiti TC", arial; 
    font-size: 13px;
    font-weight: 100;
    line-height: 1.7;
    padding-top: 10px;
    color: #ffffff;
    filter: alpha(opacity=70);
    opacity: 0.7;
    word-wrap: break-word;
    word-break: break-all;
}
*/

.content.Right.reply .warnning{
	font-family: Georgia, "STSong", "Times New Roman", Times, serif;
    line-height: 200%;
    filter: alpha(opacity=90);
    opacity: 0.9;
    color: #333333;
    font-size: 11px;
}


/*
.menuBar{
	background: #180E0c;
	position: fixed;
	bottom: 0px;
	width: 100%;
	height: 60px;
}

.menuBar .loginBox{
	float: left;
	margin-left: 80px;
}

.menuBar .menuBox{
	float: right;
	margin-right: 80px;
}
*/


/* NAV */

#TOP-MENU{
	display: none;
}

#NAV{
	display: none;
}

/* menu_2016 */

.e9{
	color: #483e3c;
	font-size: 11px;
	line-height: 1.6;

}

.e9 a{
	color: #483e3c;
	width: 98%;
	height: 30px;
	line-height: 30px;
	display: inline;
	border: 0px;
	background: rgba(0, 0, 0, 0.6);
	text-decoration: none;
	text-align: center;
}

.e9 a{
}

.e9 a::before{
	content: "/";
	margin: 0 5px;
}

#join{
	margin-top: 15px;
}

#join a{
	color: #483e3c;
	font-size: 12px;
	line-height: 1.7;
	margin-bottom: 20px;
	margin-top: 15px;
	text-decoration: none;
}

#join a:nth-child(2){
	margin-left: 15px;
}

#signerr{
	display: block;
	color: red;
}

/* new menu 2016 */


.mobileHeader{
	display: none;
}




/* guest book page */

.guestBook{
	width: 730px;
	background: #fff;
	padding:0px 15px;
	padding-bottom: 15px;
	margin-left: 80px;
	margin-bottom: 50px;
}

.guestBook div{
/* 	margin-bottom: 5px; */
}


.guestBook .guestBookTitle{
	width: 100%;
}

.guestBook .guestBookTitle a{
	width: 13px;
	height: 30px;
	float: left;
}

.guestBook .guestBookTitle h1{
	float: left;
	font-size: 12px;
	color: #3b3b3b;
	height: 30px;
	line-height: 30px;
	font-weight: lighter;
	text-align: center;
	width: 97%;
}

.guestBook .guestBookTitle h1::before{
	clear: both;
}

.guestBook h2{
	font-size: 13px;
	line-height: 1.6;
	color: #3b3b3b;
	margin-bottom: 15px;
}


.guestBook .moodpic{
	margin-bottom: 15px;
}

.guestBook p.itemTitle{
	font-size: 12px;
	color: #3b3b3b;
	float: left;
	padding-top: 5px;
}

.guestBook .moodpic .picWrapper{
	width: 650px;
	float: left;
}

.guestBook .moodpic .picWrapper .picBox{
	text-align: center;
	float: left;
	margin: auto 5px;
	margin-bottom: 20px;
	
}

.guestBook .moodpic .picWrapper .picBox img{
	border:2px solid #180E0C;
	margin-bottom: 10px;
}

.guestBook .moodpic .picWrapper .picBox input[name='imgType']{
	margin: 0 auto;
}


.guestBook .messageInput{
	font-size: 12px;
	color: #3b3b3b;	
}


.guestBook .messageInput input#subject{
	width: 642px;
	padding: 3px;
}

.guestBook .messageInput button{
	font-family: times, sans-serif;
	color: gray;
	padding: 3px 10px;
	background: none;
	border: 1px solid #ccc;
}


.guestBook .messageInput button.loginBtn{
	float: left;
	margin-top: -5px;
	margin-right: 10px;
}


.guestBook .messageInput a{
	text-decoration: none;
}


.guestBook .messageInput input, .guestBook .messageInput textarea{
	float: left;
	margin-left: 5px;
	margin-bottom: 10px;
	
}



/* 送出留言的按鈕 開始 */

.guestBook .sendMsgBox{
	width: auto;
	height: 30px;
	line-height: 30px;
	float: right;
}


.guestBook .sendMsgBox div.sendMsgBtn, .guestBook .sendMsgBox button.resetMsgBtn{
	width: 60px;
	height: 36px; 
	line-height: 36px;
	color: gray; 
	border: 1px solid #ccc;
	text-align: center;
	float: left;
	margin-top: -5px; 
	font-size: 8pt; 
	cursor: pointer;
	margin-bottom: 0px;
}


.guestBook .sendMsgBox div.sendMsgBtn{
	float: left;
}


.guestBook .sendMsgBox button.resetMsgBtn{
	float: left;
	margin-left: 10px;
}

.guestBook .sendMsgBox span{
	font-size: 12px;
	float: left;
	height: 30px;
	line-height: 30px;
	color: gray;
	margin-left: 10px;
}



/* 忘記密碼按鈕 開始 */

.fogetBtn{
	margin-top: 5px;
	margin-left: 10px;
}

.fogetBtn a{
	color: gray;
	padding: 0px 10px;
}

.guestBook .messageInput textarea{
	width:642px; 
	min-height: 150px;
	background-color: #F2F2F2; 
	border:0px; 
	padding: 5px;
	position: relative !important;
	margin-bottom: 20px;
}


.guestBook .privateCheck{
	margin-left: 50px;
}


.privateCheck input{
	margin-top: 5px;
}

#member{
	padding: 15px;
	margin-left: 80px;
}

#member .messageInput input{

	padding: 2px;
}

.msgLoading{
	font-size: 12px;
	line-height: 2;
	color: black;
	padding: 5px 0px;
	margin-bottom: 10px;
}


#goTop{
	position: fixed;
	left: 0px;
	bottom:7%;
	width: 50px;
	height: 30px;
	background: rgba(55, 55, 55, 0.7);	
}

#goTop a{
	width: 50px;
	height: 30px;
	display: block;
	background: url(../images/back-top-icon.png) no-repeat;	
	text-decoration: none;
	background-size: 30px auto;
	background-position: center center;
}


#guestPage{
	/* background: url("../images/bg/guest_bg_20230217.jpg?v=2") no-repeat;
	background-size: cover;
	background-position: left top;
	background-attachment: fixed; */
	background: #000;
}

/*
#showallBtn, #hideallBtn{
	color: #999999;
	font-weight: lighter;
	box-shadow: none;
	border: 1px solid #999999;
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	background: #fff;
}
*/



/* search bar */
.searchBar{
	width: 100%;
	display: block;
	margin-bottom: 15px;
}

.searchBar p{
	color: gray;
	font-size: 12px;
}

.searchBar table{
	width: 100%;
}

.searchBar table tr{}

.searchBar table tr td:first-child{
	width: 200px;
}

.searchBar table tr td:last-of-type{
	width: auto;
	text-align: left;
}


.searchBar button{
	border-radius: 0;
/* 	border: 1px solid #ccc; */
	border: 0px;
	width: 30px;
	height: 30px;
	display: block;
	background: #fff;
	background-image: url("../images/searchicon.png");
	background-repeat: no-repeat;
	background-size: 26px 26px;
	cursor: pointer;
	margin-left: 10px;
	
}


.searchBar input{
	padding: 5px;
	width: 200px;
	height: 30px;
	line-height: 30px;
	border: 1px solid rgb(200, 200, 200);
	border-radius: 0;
	font-family: 'Noto Serif TC', 'Noto Serif SC', serif;
}

.searchBar form{
	float: left;
}

#whoselect-button span{
	display: none;
}


.whoreply{
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border: 1px solid #ccc;
	padding: 5px;
	display: none;
}


.showDelBtn{
	width: 15px;
	height: 15px;
	display: block;
	background: url(../images/gear.png);
	background-size: 15px 15px;
	cursor: pointer;
	margin-top: 5px;
	float: right;
}

.admDeleteBtn{
	display: flex;
	height: auto;
	line-height: 1.6;
	justify-content: flex-end;
	align-items: center;
	margin-left: .3rem;
}

.admDeleteBtn form{
	line-height: 1.6;
}

button.loginBtn.toTop{
	padding: 4px;
	color:#666666;
	background: transparent!important;
	border: 1px solid #989898;
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	font-family: 'Noto Serif TC', 'Noto Serif SC', serif;
}

.admDeleteBtn button.loginBtn.toTop{
	border:0;
	padding:0;
}

.replyadmBtn{
	height: auto;
}

/* searchResult */

.getrep{
	width: 100%;
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 3px solid black;
}

.searchResultList{
	width: 100%;
	
	display: block;
	margin-bottom: 10px;
}

.searchResultList p{
	float: left;
}

.searchResultList p:nth-child(2){
	float: right;
	margin-right: 10px;
}

.searchResultList a:link, .searchResultList a:visited{
	width: 100%;
	height: 40px;
	line-height: 40px;
	display: block;
	font-size: 11pt;
	text-decoration: none;
	padding-left: 10px;
	color: gray;
	background: #ffffff;
	border: 1px solid #e7e7e7;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

.searchResultList a:hover{
	background: #e7e7e7;
	border: 1px solid #cecece;
}

/* guestResultList.php */

a.CheerResponseBtn{
	margin-left: 10px;
	width: 30px;
	height: 30px;
	display: block;
	background: url(../images/cheerResponseBtn.png) no-repeat center center;
	background-size: 23px;
	background-position-y: 2px;
}


#msgContent h2{
	font-size: 10pt;
	font-weight: normal;
	margin-bottom: 10px;
}


/* #msgContent p{
	font-size: 10pt;
	color: rgba(128,128,128,1);
	font-family: 'Noto Serif TC', 'Noto Serif SC', serif;
} */



#msgContent .searchResultBox{
	width: 100%;
	margin-bottom: 10px;
}

#msgContent .searchResultBox p{
	font-size: 10pt;
	color: gray;
	line-height: 1.5;
}

#msgContent .searchResultBox p#showResultContent{
	width: 100%;
	height: 30px;
	line-height: 30px;
	background: #cecece;
	padding-left: 5px;
}

#msgContent .searchResultBox .resultContent{
	padding: 15px;
}

#msgContent .searchResultBox .resultContent{}


/* 2016 reply update on frontDesk */

.blackBoardFixSection.hhide{
	display: none;
}


.showFixContent_m{
	display: none;
}

.showFixContent_d{
	width: 18px;
	height: 18px;
	display: block;
	background: url(../images/replyFixBtn.png) no-repeat;
	background-size: 18px;
	float: left;
	margin-top: 5px;
}

.showFixContent{
	width: 18px;
	height: 18px;
	display: block;
	background: url(../images/replyFixBtn.png) no-repeat;
	background-size: 18px;
	float: left;
	margin-top: 5px;
}



.reply_contentfix{
	font-family: Georgia, "STSong", "Times New Roman", Times, serif;
    /* font-family: "微軟正黑體","Microsoft JhengHei","Heiti TC", arial; */    
    background: #000;
	width: 95%;
	margin: 0 auto;
	overflow: hidden;
	margin-bottom: 30px;
}


.blackBoard.fix{
	height: auto;
}

.replyImg.fix{
/* 	background: pink; */
}

.uploadfileInput{
	color: gray;
	margin-bottom: 20px;
}

.uploadfileInput input{
	width: 95%;
	margin: 0 auto;
}

.replyImg.fix img{
	margin-bottom: 15px;
}

.replytextContent{
	display: block;
	background: #000;
	color: #fff;
	border: 0px;
	font-size: 13px;
    font-weight: 100;
    line-height: 1.7;
	font-family: Georgia, "STSong", "Times New Roman","新細明體" , Times, serif;
	overflow: hidden;
	height: auto;
}

font.font1{
	color: #fff;
}



.removeImgInput{
	width: 95%;
	margin: 0 auto;
	padding-top: 3px;
	text-align: right;
}

.removeImgInput label{
	color: #cecece;
	font-size: 11pt;
}


.submitbtn_Bar{
	width: 100%;
	height: 50px;
	line-height: 50px;
	display: block;
	text-align: center;
	
}

.submitbtn_Bar .fixSendBtn{
	width: 80px;
	height: 40px;
	margin: 0 auto;
	
}

.submitbtn_Bar input.inputBtn{
	width: 80px;
	height: 35px;
	display: block;
	line-height: 33px;
	text-align: center;
	background: #7f7f7f;
	border: 0px;
	color: #000;
	border: 0px;
	cursor: pointer;
	font-size: 12pt;
	
}

.submitbtn_Bar input:hover{
	background: #414141;
	color: #cecece;
}

.submitbtn_Bar a{
	width: 80px;
	height: 40px;
	display: block;
	text-align: center;
	line-height: 40px;
	background: #cecece;
	color: #000;
	border: 0px;
	float: left;
	text-decoration: none;
	margin-left: 5px;
}


.hhide{
	opacity: 0;
	transition: ease 0.5s;
/* 	display: none; */
}

.sshow{
	opacity: 1;
	transition: ease 0.5s;
/* 	display: block; */
}

.searchBar select{
	-webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   border-radius: 0px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border: 1px solid #cccccc;
	padding: 5px auto;
	width: 80px;
	height: 30px;
	overflow: hidden;
	background: url("../images/arrow.png") no-repeat scroll right center transparent;
	padding-right: 14px;
	padding-left: 5px;
}

.searchyear{
/*
		border-radius: 0px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border: 1px solid gray;
*/
}

.sendMsgBtn{
	width: 40px;height: 20px; line-height: 20px;color: gray; border: 1px solid #ccc;text-align: center;float: left;margin-top: -5px; font-size: 8pt; cursor: pointer;
}

/* 2018 leaf find頁面 */
.lifeContent.findPage{
	margin-left: -5px;
}

.lifeContent.findPage .lifeArticle{
	width: 100px;
	height: 100px;
	float: left;
	overflow: hidden;
	margin-left: 11px;
	background: #000;
}

.lifeContent.findPage .lifeArticle .imgArea{
	width: 100%;
	height: 100%;
	position: relative;
}

.lifeContent.findPage .lifeArticle .imgArea a{
	width: 100%;
	height: 100%;
	display: block;
	font-size: 10px;
	color: #a9a9a9;
	position: relative;
}

.lifeContent.findPage .lifeArticle .imgArea a.theContent{
	padding: 6px 8px;
	overflow:hidden;
	line-height: 1.5;
/*
	text-align:justify;
	display: -webkit-box;  
	text-overflow : ellipsis;
	-webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
*/
    
}

.lifeContent.findPage .lifeArticle .imgArea a img{
	
	
}

.lifeContent.findPage .lifeArticle .imgArea span{
	position: absolute;
	bottom: 0px;
	right: 0px;
/*
	width: 20%;
	height: 20%;
	border-radius: 50%;
*/
	background: #9c9c9c;
	color: #000;
	z-index: 2;
	font-size: 9pt;
	padding: 1px 2px;
	text-align: center;
	min-width: 20px;
	line-height: 20px;
}

.lifeContent.findPage .lifeArticle .imgArea span.isPublic{
	background: #34dab5;
}


/* title bar */
.titleBar{
	width: 100%;
	height: 40px;
	display: flex;
	justify-content: space-between;
	position: relative;	
}

.titleBar h2{
	width: 100%;
	position: relative;
	line-height: 40px;
	color: #686868;
	text-align: center;
	font-family: Georgia;
    font-weight: 400;
    font-size: 11px;
}

.titleBar a.dispBtn{
	margin: auto;
   vertical-align: middle; 
   display: inline-block;
	
}


.titleBar a img{
	
}

.titleBar .chgLan{
	width: 10%;
	position: absolute;
	left: 0;
	z-index: 1;
}

.titleBar .chgLan a{
	text-decoration: none;
	color: #686868;
	font-size: 9pt;
	line-height: 40px;
}


/* mail to Cheer */
#mailtoCheerWrapper{
	width: 100%;
	height: 100%;
	position: absolute;
	display: inline-block;
	background: rgba(0,0,0,.8);
	z-index: 99999;
}

.mailtoCheerBody{
	width:450px;
	height:auto;
	background: #E9E6E1;
	position:fixed;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	padding: 30px;
	padding-bottom: 25px;
}


.mailtoCheerBody .copyNote{
	width: 140px;
	height: 40px;
	line-height: 40px;
	background: rgba(0,0,0,.5);
	border-radius: 5px;
	display: none;
	position: absolute;
	left: 0;
	top:0;
	right: 0;
	bottom: 0;
	margin: auto;
	font-size: 10pt;
	text-align: center;
	color: #fff;
	font-weight: 300;
}

.mailtoCheerBody a#closeToCheer{
	width: 14px;
	height: 14px;
	display: block;
	background: url(../images/close_icon.svg);
	position: absolute;
	top:5px;
	right:5px;
}


.mailtoCheerBody .mailtoText p
{
	line-height: 1.5;
	font-size: 10pt;
	margin-bottom: 15px;
	position: relative;
	text-align: justify;
}


.mailtoCheerBody .mailtoText p.copyLink{
	margin-bottom: 5px;
}

.mailtoCheerBody .mailtoText p.copyLink span{
	float: left;
}



.mailtoCheerBody .mailtoText p span.copyIcon{
	width: 20px;
	height: 20px;
	display: inline-block;
	background: url(../images/copy_icon.svg) no-repeat 1px;
	background-size: 16px auto;
	cursor: pointer;
	margin-left: 5px;
}


.mailtoCheerBody .mailtoText p span.copyIcon:hover{
	opacity: 0.6;
}


.mailtoCheerBody .mailtoText p.copyLink a{
	text-decoration:none;
	color: #000;
	float: left;
}

.mailtoCheerBody .mailtoText p.copyLink a:hover{
	color: #717171;
}

/* 登入欄位 */

.formSection form{
	width: 100%;
}

.formSection .inputFiled{
	width: 100%;
	margin-bottom: 15px;
	text-align: center;
}

.formSection .inputFiled .filedColum{
	display: flex;
	justify-content:flex-start;
	margin-bottom: 10px;
	align-items: center;
	flex-wrap: nowrap;
}

.formSection .inputFiled .filedColum span{
	width: 14%;
	display: inline-block;
	text-align: right;
}

.formSection .inputFiled .filedColum input{
	width: 50%;
	padding: 5px;
	font-size: 10pt;
	line-height: 1.5;
	height: auto;
	margin-left: 3%;
}

.imgcodeBox{
	display: flex;
	align-items: center;
	margin-left:3%;
}

.formSection .inputFiled .filedColum .forRadio{
	margin-left:.5rem;
}

.formSection .inputFiled .filedColum .forRadio label{
	padding:.5rem;
}

.formSection .inputFiled .filedColum .forRadio label input{
	padding-right:.35rem;
}


.formSection input{
	padding: 5px;
}

.formSection .inputFiled .filedColum select{
	margin-left: 10px;
	margin-right: 10px;
}


.formSection a.loginBtn:link, .formSection a.loginBtn:visited{
	border: 1px solid #b2b2b2;
	font-size: 9pt;
	padding:2px 5px;
	text-decoration: none;
	color: #525252;
}

.formSection a.loginBtn:hover{
	color: #3e3e3e;
	border: 1px solid #7b7b7b;
}

.formSection .memOperation{
	width: 100%;
	display: flex;
	justify-content: center;
}

.formSection .memOperation a{
	text-decoration: none;
	color: #525252;
}


.formSection .joinRule{
	width: 100%;
	margin-bottom: 20px;
}

.formSection .joinRule p{
	font-size: 9pt;
	line-height: 1.6;
	margin-bottom: 5px;
}

.formSection .joinRule ol{
	
	margin-left: 15px;
}

.formSection .joinRule ol li{
	font-size: 9pt;
	line-height: 1.6;
	list-style: decimal;
}

.formSection .operatInput{
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 20px;
}

.formSection .operatInput label{
	margin-left: 5px;
}

/* ipad 轉正的修復 */
@media only screen 
and (orientation : portrait) {
	
	html, body{
		width:100%;
		height: 100%;
	}
	
	.wrapper{
		min-width: 100%;
	}
	
	.mobileBack{
		background: url("../images/bg/guest_bg_ipad_20230217.jpg") no-repeat;
		background-size: cover;
		background-position: top left;
		/* background-attachment: fixed; */
		width:100%;
		height: 100%;
		position: fixed;
		z-index: -1;
	}
	
	.content.Left.message{
		margin-left:1.3rem;
	}
	
	.content.Right.reply{
		margin-right:1.3rem;
	}

}