@charset "utf-8";

/*  layout  */
body {margin:0px auto 0px auto;font-family: arial,helvetica,clean,sans-serif,新細明體;background-color: #f5fafb;}
div.yokoso {width:1000px;height:auto;padding:0px;margin:auto;background: url(../../images/yokosojapan/bg.jpg) no-repeat fixed center top;}

/* public */
p {	font-size: 15px;	line-height: 22px;	margin: 5px 0px 2px 0px;	padding: 0px;	font-weight: normal;	text-indent: 30px;}
h6 {font-size: 13px;	font-weight: normal;margin: 0px;	padding: 0px;	line-height: 18px;}
h5 {font-size: 15px;	line-height: 22px;	margin: 10px 0px 2px 0px;	padding: 0px;	font-weight: normal;}
h4 {font-size: 15px;	line-height: 22px;	margin: 10px 0px 2px 0px;	padding: 0px;	font-weight: bolder;	text-indent: 30px;}
h3 {font-size: 15px;	line-height: 20px;	font-weight: bolder;	margin: 10px 0px 2px 0px;	padding: 0px;}
h2 {font-size: 17px;	line-height: 24px;	font-weight: normal;	margin: 10px 0px 2px 0px;	padding: 0px;}
h1 {font-size: 18px;	line-height: 30px;	font-weight: bolder;	margin: 0px 0px 10px;	padding: 0px;	text-align: center;}
a:link , a:visited {	color: #0000FF;	text-decoration: underline;	font-size: 15px;	line-height: 22px;}
a:hover {text-decoration: underline;	color: #0066FF;	font-size: 15px;	line-height: 22px;}
blockquote {margin: 0px;	padding-top: 0px;	padding-right: 0px;	padding-bottom: 0px;	padding-left: 30px;}
li {margin: 0px 0px 0px 15px;	padding: 0px 0px 0px 0px;}
ol {font-weight: normal;	font-size: 15px;	margin: 0px 0px 0px 39px;	padding: 0px;	list-style-type: decimal;}
ul {font-size: 15px;	font-weight: normal;	padding-top: 0px;	padding-right: 0px;	padding-bottom: 0px;	padding-left: 50px;	margin: 0px;}

br.clear { float: none; display: block; clear:both; line-height: 1.0em; height: 1.0em; }

/* layout */
div.layout-top {width:100%;	height:100px;}
div.layout-middle {	width:100%;height:auto;clear:both;}
div.layout-bottom {width:100%;height:83px;background: url(../../images/yokosojapan/layout_bottom.jpg) no-repeat center center;padding:0px 0px 0px 0px;margin:3px 0px 0px 0px;clear:both;}

/* top */
div.layout-top ul {width:100%;height:auto;padding:0px;margin: 0px;list-style-type: none;}
div.layout-top li {width:auto;height:auto;padding:0px 0px 0px 0px;margin:0px 0px 0px 0px;float:left;}
div.layout-top div.logo {width:645px;height:100%;padding:0px 0px 0px 0px;margin:0px 0px 0px 0px;}
div.layout-top div.out {width:220px;height:100%;padding:0px 0px 0px 0px;margin:0px 0px 0px 0px;}
div.layout-top div.logo-r {width:132px;height:100%;padding:0px 0px 0px 0px;margin:0px 0px 0px 0px;}

/* bottom */
div.layout-bottom div.txt{width:40%;height:auto;padding:20px 0px 0px 150px;margin:0px auto 0px auto;	font-size: 12px;line-height: 19px;color: #000000;}

/* middle */
table.middle {width:100%;height:auto;border: none;margin: 0px;padding: 0px;}
table.middle td.left {width:260px;height:auto;border: 1px solid #96b0af;background: #e0f4fc;text-align: left;vertical-align: top;padding:0px 0px 5px 0px;}
table.middle td.right {	width:auto;	height:auto;background: #FFFFFF;border: 1px solid #96b0af;padding:0px 0px 5px 0px;text-align: left;vertical-align: top;}

/* left ad */
div.ad {width:100%;height:auto;text-align:center;margin:5px 0px 1px 0px;font-size: 12px;color: #666666;text-align:center;line-height: 18px;}
div.ad img {padding:1px 0px 1px 0px;margin:1px 0px 1px 0px;}

/* left button */
div.button {width:100%;height:auto;text-align:center;margin:5px 0px 1px 0px;}
div.button div.topic {width:auto;height:60px;margin:20px auto 0px auto;clear:both;}
div.button div.list {width:165px;height:28px;border-bottom: 1px dashed #999999;border-top-width: 0px;border-right-width: 0px;border-left-width: 0px;border-top-style: none;border-right-style: none;border-left-style: none;margin:0px 0px 1px 30px;clear:both;}
div.button div.home {width:100%;height:auto;margin:0px 0px 0px 0px;padding:15px 0px 0px 0px;clear:both;}
div.button div.home div.public-button {width:auto;height:auto;margin:2px 0px 0px 0px;padding:0px 0px 2px 0px;}
duv.button table.button {margin:0px auto 0px auto;}

/* right vi */
div.vi-days {width:695px;height:110px;background: url(../../images/yokosojapan/vi_days.jpg) no-repeat center center;margin:8px auto 0px auto;}
div.vi-share {width:695px;height:110px;background: url(../../images/yokosojapan/vi_share.jpg) no-repeat center center;margin:8px auto 0px auto;}
div.vi-public {width:695px;height:205px;background: url(../../images/yokosojapan/vi_public.jpg) no-repeat center center;margin:8px auto 0px auto;}

/* page */
div.page {width:98%;height:auto;display:block;overflow:none;float:none;margin:10px auto 0px auto;clear:both;background-color:#FFFFFF;}
div.title {	width:100%;	height:auto;margin:5px auto 10px auto;font-size: 16px;line-height: 22px;color: #008C8C;text-align: center;font-weight: bold;}
div.content {width:95%;height:auto;margin:5px auto 10px auto;font-size: 15px;line-height: 22px;color: #333333;text-align: left;}
span.red {color: #FF0000;}
span.blue {color: #0066FF;}
span.green {color: #009933;}
span.orange {color: #FF6600;}
span.gray {color: #999999;}

/* share main */
div.main {width:98%;height:auto;clear:both;margin:0px 5px 0px 5px;}
div.main div.main-left {width:480px;height:auto;margin:0px 0px 0px 0px;float:left;}
div.main div.main-right {width:210px;height:auto;margin:10px 0px 0px 0px;float:right;background-color:#ecfcf7;}

/* share menu */
div.menu {width:480px;height:auto;margin:10px 0px 0px 0px;float:left;}
div.menu ul {width:100%;height:auto;padding:0px;margin: 0px;list-style-type: none;}
div.menu li {width:auto;height:auto;padding:0px 0px 0px 0px;margin:0px 0px 0px 0px;float:left;}
div.menu div.topic {width:90%;height:21px;font-size: 13px;line-height: 21px;font-weight: bold;color: #097c24;background: url(../../images/yokosojapan/topic_bg.gif) no-repeat left top;padding:4px 0px 0px 20px;text-align:left;}
div.menu div.photo {	width:150px;height:170px;background: #efebef;border: 1px solid #959595;margin:5px 5px 5px 3px;}
div.menu div.pic {width:135px;height:100px;margin:10px auto 8px auto;overflow: hidden; text-align: center;}
div.menu div.txt {width:135px;height:30px;font-size: 11px;line-height: 16px;color: #535353;margin:3px auto 0px auto;overflow: hidden;}
div.menu div.author {width:135px;height:20px;font-size: 11px;line-height: 16px;color: #535353;text-align:center;margin:3px auto 0px auto;}

/* share hot */
div.more {width:100%;height:auto;text-align:right;}

/* share push */
div.push {width:210px;height:auto;margin:0px 0px 6px 0px;}
div.push div.topic {width:95%;height:20px;font-size: 13px;line-height: 21px;color: #b4470c;margin:0px 0px 0px 5px;}
div.push div.pic {width:180px;height:130px;margin:5px auto 5px auto;overflow: hidden;}
div.push div.txt {width:180px;height:40px;font-size: 13px;line-height: 19px;color: #535353;margin:0px auto 0px auto;overflow: hidden;}
div.push div.author {width:180px;height:20px;font-size: 11px;line-height: 16px;color: #535353;text-align:center;margin:0px auto 0px auto;}

/* share list */
div.list {width:100%;height:auto;margin:0px 0px 0px 0px;float:left;}
div.list ul {width:100%;height:auto;padding:0px;margin: 0px;list-style-type: none;}
div.list li {width:auto;height:auto;padding:0px 0px 0px 0px;margin:0px 0px 0px 0px;float:left;}
div.list div.photo {width:150px;height:170px;background: #efebef;border: 1px solid #959595;margin:5px 10px 10px 3px;}
div.list div.pic {width:135px;height:100px;margin:10px auto 8px auto;overflow: hidden; text-align: center;}
div.list div.txt {width:135px;height:30px;font-size: 11px;line-height: 16px;color: #535353;margin:3px auto 0px auto;overflow: hidden;}
div.list div.author {width:135px;height:20px;font-size: 11px;line-height: 16px;color: #535353;text-align:center;margin:3px auto 0px auto;}

div.prepage {width:100%;text-align: center;	margin: 30px 0px 0px 0px;font-size: 13px;line-height: 20px;color:#000000;}
div.prepage a:link , div.prepage a:visited {font-size: 13px;line-height: 20px;color:#0099FF;text-decoration: none;}
div.prepage a:hover {color:#0066FF;}

/* photp show */
table.show {width:685px;height:auto;margin:0px auto 0px auto;}
table.show td.top {background-image: url(../../images/yokosojapan/show_01.gif);	background-repeat: no-repeat;background-position: right bottom;height: 13px;width: 685px;}
table.show td.bottom {background-image: url(../../images/yokosojapan/show_05.gif);	background-repeat: no-repeat;background-position: right top;height: 18px;width: 685px;}
table.show td.left {background-image: url(../../images/yokosojapan/show_02.gif);background-repeat: repeat-y;background-position: right top;width: 8px;border-width: 0px;border-style: none;}
table.show td.right {background-image: url(../../images/yokosojapan/show_04.gif);background-repeat: repeat-y;background-position: left top;width: 30px;vertical-align: top;border-width: 0px;border-style: none;}
table.show td.center {	height: 480px;width: 647px;	text-align: left;	vertical-align:top;}

table.show div.photo {width:640px;height:480px;margin:0px auto 0px auto;}
table.show div.topic {width:98%;height:auto;font-size: 15px;line-height: 22px;margin:10px auto 0px auto;color: #ac4b07;}
table.show div.content {width:98%;height:auto;text-align:left;font-size: 13px;line-height: 20px;font-weight: normal;color: #333333;margin:0px auto 0px auto;}
table.show div.content p{text-align:left;font-size: 13px;line-height: 20px;font-weight: normal;color: #333333;}
table.show div.author {width:98%;height:auto;font-size: 13px;font-weight: normal;margin: 0px;padding: 0px;line-height: 18px;text-align:right;color: #0068b7;}

/* share award */
div.share-award {width:580px;height:auto;margin:2px auto 10px auto;border: 0px solid #666666;background-color:#FFFFFF;}
div.share-award ul {width:100%;height:auto;padding:0px;margin: 5px 0px 0px 0px;list-style-type: none;background-color:#FFFFFF;}
div.share-award li {width:auto;height:auto;padding:0px 0px 0px 0px;margin:0px 0px 0px 0px;float:left;}
div.share-award div.cat-date {width:95%;	height:auto;margin:0px 0px 0px 0px;padding:2px 2px 2px 2px;font-size: 13px;line-height: 20px;color: #000000;background: #FFFFF0;	text-align:right;vertical-align: bottom;}
div.share-award div.award-win {width:570px;	height:auto;margin:2px 0px 0px 0px;	padding:2px 2px 2px 2px;font-size: 15px;line-height: 20px;color: #000000;background: #FF9966;clear:both;}
div.share-award div.award-name {width:135px;height:auto;margin:0px 0px 5px 5px;padding:5px 0px 0px 2px;font-size: 13px;line-height: 20px;color: #000000;background: #FFFFF0;border-bottom: 1px dashed #999999;}

/* login bar */
div.login-bar {width:690px;height:20px;margin:5px auto 15px auto;padding:0px 2px 0px 2px;background-color: #f2fbdb;font-size: 13px;color: #000000;} 
div.login-bar div.left {width:auto;height:20px;float:left;}
div.login-bar a:link , div.login-bar a:visited {font-size: 13px;color:#eb6100;text-decoration: underline;}
div.login-bar a:hover {color:#0066FF;text-decoration: underline;}
div.login-bar div.right {width:auto;height:auto;text-align:right;float:right;vertical-align: middle;}
div.login-bar form {margin:0px;padding:0px;height:20px;}
div.login-bar div.right input {	height:17px;border: 1px solid #000000;margin:0px 0px 0px 0px;background: #FFFFFF;}
div.login-bar div.right img{margin:0px 0px 2px 0px;vertical-align: middle;}

/* days question */
div.question {width:610px;height:auto;margin:2px auto 10px auto;clear:both;display:block;overflow:none;float:none;}
div.question div.date {display:block;width:605px;height:auto;border-bottom: 1px solid #f0e4d3;font-size: 24px;color: #a74200;	line-height: 30px;margin:0px 0px 20px 0px;font-family: arial,helvetica,clean,sans-serif;clear:both;}
div.question div.date span.date-s{font-size: 13px;color: #535353;}
div.question div.title {width:65px;height:18px;	font-size: 15px;color: #1b1b1b;	background: #fbecdc;border: 1px solid #b4b0b0;margin:20px 0px 10px 0px;	padding:2px 0px 0px 4px;line-height: 18px;font-weight: normal;text-align: left;clear:both;}
div.question div.name {display:block;width:70%;height:auto;font-size: 15px;color: #0099FF;	line-height: 25px;margin:0px 0px 0px 5px;float:right;}
div.question div.pic {display:block;width:165px;height:180px;float:left;}
div.question div.txt {display:block;width:70%;height:auto;font-size: 15px;color: #313131;	line-height: 25px;margin:0px 0px 10px 5px;float:right;}
div.question div.topic {width:90%;height:auto;font-size: 15px;color: #e60011;	line-height: 25px;margin:0px 0px 10px 40px;}
div.question div.answer {width:90%;font-size: 15px;	color: #313131;line-height: 25px;margin:0px 0px 10px 40px;clear:both;}
div.question div.answer dd {margin:0px 20px 0px 0px;float:left;}
div.question div.sent {	cursor:pointer;	width:90%;	margin:0px auto 0px auto;	padding:25px 0px 10px 0px;	text-align:center;	clear:both;	border-width: 0px;	border-style: none;}
div.question div.sent input {height:20px;border: 1px outset #000000;margin:0px 0px 0px 0px;font-size: 13px;background: #CCCCCC;width: 50px;line-height: 19px;} 

/* ad gift */
div.ad-gift {width:99%;height:auto;margin:20px auto 0px auto;padding:3px 1px 3px 3px;border: 1px dashed #EABFAA;clear:both;float: none;display:block;}
table.gift-tb {width:100%;height:auto;border-collapse: collapse;}
table.gift-tb td.gift-l {width:65%;height:auto;font-size: 15px;line-height: 22px;color: #FF6600;text-align:right;vertical-align: middle;margin:0px 0px 0px 0px;	padding:0px 0px 0px 0px;font-weight: bold;}
table.gift-tb td.gift-r {width:auto;height:auto;text-align:left;vertical-align: middle;margin:0px 0px 0px 0px;padding:0px 5px 0px 5px;}
table.gift-tb td.gift-r img {border: 0px solid #999999;}

/* ad bottom */
div.ad-bottom {	width:99%;height:auto;margin:20px auto 0px auto;padding:3px 1px 3px 3px;border: 1px solid #EBEBEB;clear:both;float: none;display:block;}
table.ad-tb {width:100%;height:auto;border-collapse: collapse;}
div.ad-bottom div.ad-left {width:152px;height:auto;margin:1px 5px 0px 0px;float:left;}
div.ad-bottom div.ad-right {width:440px;height:auto;margin:0px 0px 0px 0px;float:right;text-align:left;}
div.ad-bottom div.topic {width:100%;height:0px;font-size: 15px;line-height: 22px;color: #009966;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}
div.ad-bottom div.txt {width:100%;height:auto;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}
div.ad-bottom div.txt a:link , div.ad-bottom  div.txt a:visited {font-size: 13px;line-height: 18px;color:#006666;text-decoration: none;}
div.ad-bottom div.txt a:hover {color:#006699;text-decoration: underline;}
div.ad-bottom.todayaward {
text-align:center;color:#ff8c00;margin-top:10px;padding:10px 0 10px 0;font-weight:bold;border:1px dashed #ff8c00;
}

/* days menu */
div.days-menu {width:100%;height:auto;margin:2px 0px 0px 0px;}
div.days-menu ul {width:100%;height:auto;padding:0px;margin: 0px;list-style-type: none;}
div.days-menu li {width:auto;height:auto;padding:0px 0px 0px 0px;margin:0px 0px 0px 0px;float:left;}
div.days-menu div.card {width:165px;height:auto;margin:2px 3px 3px 2px;padding:0px 0px 3px 0px;border: 1px solid #eaeaea;}
div.days-menu div.card-today {width:165px;height:auto;margin:2px 3px 3px 2px;padding:0px 0px 1px 0px;border: 2px solid #FF6633;}
div.days-menu div.date {width:99%;height:22px;font-size: 19px !important;color: #da570f;font-weight: bold;font-family: arial,helvetica,clean,sans-serif;margin:1px 0px 1px 2px;overflow: hidden;}
div.days-menu div.name {width:99%;height:0px;font-size: 15px;color: #6a3905;font-weight:normal;margin:1px 0px 1px 2px;overflow: hidden;}
div.days-menu div.cup {width:165px;height:180px;}
div.days-menu div.cup img {	border-width: 0px;border-style: none;}

/* day award */
div.award {width:580px;height:auto;margin:10px auto 10px auto;border: 0px solid #666666;}
div.award dd.cat-win {width:280px;height:auto;margin:0px 0px 0px 0px;padding:2px 2px 2px 2px;font-size: 15px;line-height: 20px;color: #000000;background: #FFFFF0;float:left;}
div.award dd.cat-name {width:140px;height:auto;margin:0px 0px 0px 0px;padding:2px 2px 2px 2px;font-size: 15px;line-height: 20px;color: #000000;background: #FFFFF0;float:left;}
div.award dd.cat-nickname {width:148px;height:auto;margin:0px 0px 0px 0px;padding:2px 2px 2px 2px;font-size: 15px;line-height: 20px;color: #000000;	background: #FFFFF0;float:left;}
div.award dt.award-date {width:576px;	height:auto;margin:2px 0px 0px 0px;	padding:2px 2px 2px 2px;font-size: 15px;line-height: 20px;color: #FFFFFF;background: #FF9966;border-bottom: 1px solid #FF7735;}
div.award dd.award-win {width:280px;height:auto;margin:0px 0px 0px 0px;padding:5px 2px 2px 2px;font-size: 13px;line-height: 20px;color: #000000;background: #FFFFF0;border-bottom: 1px dashed #999999;float:left;}
div.award dd.award-name {width:140px;height:auto;margin:0px 0px 0px 0px;padding:5px 2px 2px 2px;font-size: 13px;line-height: 20px;color: #000000;background: #FFFFF0;border-bottom: 1px dashed #999999;float:left;}
div.award dd.award-nickname {width:148px;height:auto;margin:0px 0px 0px 0px;padding:5px 2px 2px 2px;font-size: 13px;line-height: 20px;color: #000000;	background: #FFFFF0;border-bottom: 1px dashed #999999;float:left;}

/* join member */
dfn {
	font-style: normal;
}
#userlogin, #userlogin1, dfn.title {
	font-size: 12px;
}
#userlogin, #userlogin1 {
	text-align: center;
}
dfn.title {
	color: #c33;
}
#joinEventMember div,
#shareEventMember div {
	float: left;
	font-size: 12px;
}
#joinEventMember div.item,
#shareEventMember div.item {
	width: 80px;
}

/* questionary */
#questionary {
	font-size: 1.0em;
	color: #360;
	border: 1px solid #efefef;
	padding: 6px;
}
#questionary ol dfn.question {
	font-weight: bold;
	line-height: 2.0em;
}
#questionary ol li {
	line-height: 1.5em;
	padding-bottom: 4px;
	border-bottom: 1px dashed #efefef;
	margin-bottom: 6px;
}
#questionary label {
	color: #737373;
}

.controlevent a {
	font-size: 12px;
}

/* paging */

div.paging {
	font-size: 12px;
	color: #666;
	text-align: center;
	width: 100%;
	clear: both;
}
ul.paging-list {
	list-style-type: none;
	margin: 0.5em auto;
}
ul.paging-list li {
	float: left;
	margin: 0 2px;
	cursor: pointer;
}


/* award user list */
#userAwards {
	height: auto;
}
#userAwards div {
	border: 1px solid #efefef;
	float: left;
	padding: 4px;
	margin: 2px;
}
#userAwards div.userid {
	width: 120px;
}
#userAwards div.username {
	width: 100px;
}
#userAwards div.email {
	width: 230px;
}
#userAwards div.mobile {
	width: 120px;
}
div.slogan {
	width: 610px;
	background-color: #ef3cac;
	border: 1px solid #efefef;
	padding: 4px;
	margin: 2px;
}
