@charset "utf-8";


/* mypage */

/* login */
#login {
	clear: both;
	width: 760px;
	height: auto;
	margin: 0;
	padding: 10px;
	background-image: url(../img/bg_orange_gurade.gif);
	background-position: left top;
	background-repeat: repeat-x;
	background-color: #ffcc00;
	color: #663300;
	font-size: 100%;
	font-weight: bold;
	text-align: right;
	vertical-align: middle;
}
#login p, #login p a {
	display: block;
	float: right;
	width: 120px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_logout.gif);
	background-position: left top;
	background-repeat: no-repeat;
	text-align: right;
	overflow: hidden;
}
#login p a:hover {
	display: block;
	width: 120px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_logout.gif);
	background-position: left -20px;
	background-repeat: no-repeat;
	text-align: right;
	overflow: hidden;
}
#login p a span {
	display: none;
}
#login ul {
	float: left;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: left;
}
#login li {
	float: left;
	display: block;
	margin: 0 10px 0 0;
	padding: 3px 10px 3px 10px;
	width: auto;
	height: auto;
	background-color: #ffcc00;
	border: 1px #ffffff solid;
	color: #ffffff;
	font-weight: bold;
	text-align: left;
}
#login li.nowpage {
	background-color: #ffffff;
	/* border: 1px #ffffff solid; */
	color: #ffcc00;
}
#login li a {
	color: #ffffff;
	font-weight: bold;
	text-align: left;
	text-decoration: none;
}
#login li a:hover {
	color: #ff9900;
	font-weight: bold;
	text-align: left;
	text-decoration: none;
}

/* mypageleft */
#mypageleft {
	float: left;
	width: 200px;
	height: auto;
	margin: 0 10px 0 0 ;
	padding: 0 0 10px 0;
	background-image: url(../img/bg_rightmenu_footer.gif);
	background-position: center bottom;
	background-repeat: no-repeat;
	background-color: #ffffff;
	font-size: 100%;
	text-align: left;
}
#mypageleft h3 {
	display: block;
	width: 180px;
	height: auto;
	margin: 0;
	padding: 10px 10px 0 10px;
	background-image: url(../img/bg_rightmenu_header.gif);
	background-position: center top;
	background-repeat: no-repeat;
	background-color: #ffffff;
	font-size: 120%;
	font-weight: bold;
}
#mypageleft h4 {
	display: block;
	width: auto;
	height: auto;
	margin: 5px 10px 5px 10px;
	padding: 0;
}
#mypageleft a span {
	display: none;
}
#mypageleft p {
	display: block;
	margin: 5px 10px 0 10px; 
	padding: 0;
}
#mypageleft p.yourpage {
	display: block;
	margin: 0 10px 0 10px; 
	padding: 0;
	text-align: right;
}
p.profile_edit, p.profile_edit a {
	display: block;
	width: 180px;
	height: 20px;
	background-image: url(../img/btn_profile_edit.gif);
	background-position: left top;
	background-repeat: no-repeat;
	overflow: hidden;
}
p.profile_edit a:hover {
	display: block;
	width: 180px;
	height: 20px;
	background-image: url(../img/btn_profile_edit.gif);
	background-position: left -20px;
	background-repeat: no-repeat;
	overflow: hidden;
}
p.photo_edit, p.photo_edit a {
	display: block;
	width: 120px;
	height: 20px;
	background-image: url(../img/btn_photo_edit.gif);
	background-position: left top;
	background-repeat: no-repeat;
	overflow: hidden;
}
p.photo_edit a:hover {
	display: block;
	width: 120px;
	height: 20px;
	background-image: url(../img/btn_photo_edit.gif);
	background-position: left -20px;
	background-repeat: no-repeat;
	overflow: hidden;
}
.myphoto {
	display: block;
	width: 180px;
	height: 180px;
	margin: 3px 10px 0 10px;
	padding: 0;
	text-align: center;
	vertical-align: middle!important;
}
.myphoto img {
	border: none;
}

/* mypageright */
#mypageright {
	float: right;
	width: 570px;
	height: auto;
	margin: 0;
	padding: 0;
	font-size: 100%;
	text-align: left;
}
#mypageright a span {
	display: none;
}
.managemessage {
	width: auto;
	height: auto;
	margin: 0 0 10px 0;
	padding: 0 0 10px 0;
	background-color: #ffffff;
	border: 1px #ffcc00 solid;
}
.managemessage h3 {
	display: block;
	width: auto;
	height: 20px;
	margin: 0;
	padding: 5px 5px 5px 45px;
	background-image: url(../img/bg_whatsnew_kanrinews.gif);
	background-position: left top;
	background-repeat: no-repeat;
	background-color: #ffcc00;
	font-size: 120%;
	font-weight: bold;
}
.mypoint {
	float: left;
	width: 198px;
	height: auto;
	margin: 10px 10px 0 10px;
	padding: 0;
	background-color: #ffffff;
	border: 1px #cccccc solid;
}
.mypoint h4 {
	display: block;
	width: auto;
	height: auto;
	margin: 0;
	padding: 5px;
	background-image: url(../img/bg_gray_gurade.gif);
	background-position: left top;
	background-repeat: repeat-x;
	background-color: #cccccc;
	font-size: 120%;
	font-weight: bold;
}
.mypoint p {
	width: auto;
	height: auto;
	margin: 10px;
	padding: 0;
	text-align: right;
}
.message {
	float: left;
	width: 338px;
	height: auto;
	margin: 10px 0 0 0;
	padding: 0;
	background-color: #ffffff;
	border: 1px #cccccc solid;
}
.message h4 {
	display: block;
	width: auto;
	height: auto;
	margin: 0;
	padding: 5px;
	background-image: url(../img/bg_gray_gurade.gif);
	background-position: left top;
	background-repeat: repeat-x;
	background-color: #cccccc;
	font-size: 120%;
	font-weight: bold;
}
.message p {
	width: auto;
	height: auto;
	margin: 10px;
	padding: 0;
	text-align: left;
}
.kuchikomilist {
	clear: both;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	background-color: #ffffff;
	border: 1px #ffcc00 solid;
}
.kuchikomilist h3 {
	display: block;
	width: auto;
	height: auto;
	margin: 0;
	padding: 5px;
	background-image: url(../img/bg_orange_gurade.gif);
	background-position: left top;
	background-repeat: repeat-x;
	background-color: #ffcc00;
	color: #333333;
	font-size: 120%;
	font-weight: bold;
}
.kuchikomilist ul {
	clear: both;
	width: auto;
	height: auto;
	margin: 5px 10px 5px 10px!important;
	padding: 0;
	font-size: 100%;
}
.kuchikomilist ul a {
	padding-left: 20px;
	font-weight: bold;
}
.kuchikomilist a span {
	display: none;
}
.kuchikomilist li {
	display: block;
	width: auto;
	height: auto;
	margin: 0;
	padding: 3px 0 3px 20px;
	background-image: url(../img/icon_orange_list.gif);
	background-position: left;
	background-repeat: no-repeat;
	color: #999999;
	text-align: left;
}
.kuchikomilist p {
	display: block;
	margin: 10px;
	padding: 0;
	text-align: right;
}
.kuchikomilist p a {
	display: block;
	width: 280px;
	height: 20px;
	margin: 0 0 0 270px;
	padding: 0;
	background-image: url(../img/btn_kuchikomi-ichiran.gif);
	background-position: left top;
	background-repeat: no-repeat;
	text-align: right!important;
}
.kuchikomilist p a:hover {
	display: block;
	width: 280px;
	height: 20px;
	margin: 0 0 0 270px;
	padding: 0;
	background-image: url(../img/btn_kuchikomi-ichiran.gif);
	background-position: left -20px;
	background-repeat: no-repeat;
	text-align: right!important;
}

/* yourpagelist */
.yourpagelist {
	clear: both;
	width: auto;
	height: auto;
	margin: 0 0 10px 0;
	padding: 0;
	background-color: #ffffff;
	border: 1px #84c400 solid;
}
.yourpagelist h3 {
	display: block;
	width: auto;
	height: auto;
	margin: 0;
	padding: 5px;
	background-image: url(../img/bg_green_gurade2.gif);
	background-position: left top;
	background-repeat: repeat-x;
	background-color: #84c400;
	color: #ffffff;
	font-size: 120%;
	font-weight: bold;
}
.yourpagelist ul {
	clear: both;
	width: auto;
	height: auto;
	margin: 5px 10px 5px 10px;
	padding: 0;
	font-size: 100%;
}
.yourpagelist ul a {
	padding-left: 20px;
	font-weight: bold;
}
.yourpagelist li {
	display: block;
	width: auto;
	height: auto;
	margin: 0;
	padding: 3px 0 3px 20px;
	background-image: url(../img/icon_green_list.gif);
	background-position: left;
	background-repeat: no-repeat;
	color: #999999;
	text-align: left;
}
.yourpagelist dl {
	clear: both;
	width: auto;
	height: auto;
	margin: 5px 10px 5px 10px;
	padding: 0;
	font-size: 100%;
}
.yourpagelist dt {
	float: left;
	display: block;
	width: 10em;
	height: auto;
	margin: 0 5px 0 0;
	padding: 3px 0 3px 20px;
	background-image: url(../img/icon_green_list.gif);
	background-position: left;
	background-repeat: no-repeat;
	text-align: left;
}
.yourpagelist dd {
	display: block;
	width: auto;
	height: auto;
	margin: 0;
	padding: 3px 0 3px 0;
	text-align: left;
}
.yourpagelist p {
	display: block;
	margin: 10px;
	padding: 0;
	text-align: right;
}
.yourpagelist p a {
	display: block;
	width: 280px;
	height: 20px;
	margin: 0 0 0 268px;
	padding: 0;
	background-image: url(../img/btn_kuchikomi-ichiran.gif);
	background-position: left top;
	background-repeat: no-repeat;
	text-align: right!important;
}
.yourpagelist p a:hover {
	display: block;
	width: 280px;
	height: 20px;
	margin: 0 0 0 268px;
	padding: 0;
	background-image: url(../img/btn_kuchikomi-ichiran.gif);
	background-position: left -20px;
	background-repeat: no-repeat;
	text-align: right!important;
}

/* yourpage */
#yourpage {
	clear: both;
	width: 760px;
	height: auto;
	margin: 0;
	padding: 10px;
	background-image: url(../img/bg_green_gurade.gif);
	background-position: left top;
	background-repeat: repeat-x;
	background-color: #c6ef6c;
	color: #663300;
	font-size: 100%;
	font-weight: bold;
	text-align: right;
	vertical-align: middle;
}
#yourpage p, #yourpage p a {
	display: block;
	float: right;
	width: 120px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_logout.gif);
	background-position: left top;
	background-repeat: no-repeat;
	text-align: right;
	overflow: hidden;
}
#yourpage p a:hover {
	display: block;
	width: 120px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_logout.gif);
	background-position: left -20px;
	background-repeat: no-repeat;
	text-align: right;
	overflow: hidden;
}
#yourpage p a span {
	display: none;
}
#yourpage ul {
	float: left;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: left;
}
#yourpage li {
	float: left;
	display: block;
	margin: 0 10px 0 0;
	padding: 3px 10px 3px 10px;
	width: auto;
	height: auto;
	background-color: #84c400;
	border: 1px #ffffff solid;
	color: #ffffff;
	font-weight: bold;
	text-align: left;
}
#yourpage li.mypageback {
	background-color: #ffcc00;
}
#yourpage li.mypageback a:hover {
	color: #ff9900;
}
#yourpage li a {
	color: #ffffff;
	font-weight: bold;
	text-align: left;
	text-decoration: none;
}
#yourpage li a:hover {
	color: #ffcc00;
	font-weight: bold;
	text-align: left;
	text-decoration: none;
}

.prof {
	clear: both;
	width: auto;
	height: auto;
	margin: 0 0 10px 0;
	padding: 0;
	background-color: #ffffff;
	border: 1px #ffcc00 solid;
}
.prof h3 {
	display: block;
	width: auto;
	height: auto;
	margin: 0;
	padding: 5px;
	background-image: url(../img/bg_orange_gurade.gif);
	background-position: left top;
	background-repeat: repeat-x;
	background-color: #ffcc00;
	color: #333333;
	font-size: 120%;
	font-weight: bold;
}
.prof h4 {
	display: block;
	width: auto;
	height: auto;
	margin: 15px 0 5px 10px;
	padding: 0;
}
.prof ul {
	clear: both;
	width: auto;
	height: auto;
	margin: 5px 10px 5px 10px!important;
	padding: 0;
	font-size: 100%;
}
.prof ul a {
	padding-left: 20px;
	font-weight: bold;
}
.prof a span {
	display: none;
}
.prof li {
	display: block;
	width: auto;
	height: auto;
	margin: 0;
	padding: 3px 0 3px 20px;
	background-image: url(../img/icon_orange_list.gif);
	background-position: left;
	background-repeat: no-repeat;
	color: #999999;
	text-align: left;
}
#form {
	width: auto!important;
}
.profphoto_edit, .profphoto_edit a {
	display: block;
	width: 120px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_photo_edit.gif);
	background-position: left top;
	background-repeat: no-repeat;
	overflow: hidden;
}
.profphoto_edit a:hover {
	display: block;
	width: 120px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_photo_edit.gif);
	background-position: left -20px;
	background-repeat: no-repeat;
	overflow: hidden;
}
.proflist {
	display: block;
	margin: 10px;
	padding: 0;
	text-align: right!important;
}
.proflist a {
	display: block;
	width: 280px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_kuchikomi-ichiran.gif);
	background-position: left top;
	background-repeat: no-repeat;
	text-align: right!important;
}
.proflist a:hover {
	display: block;
	width: 280px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_kuchikomi-ichiran.gif);
	background-position: left -20px;
	background-repeat: no-repeat;
	text-align: right!important;
}
.mypage_topback a {
	display: block;
	width: 195px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_mypage_topback.gif);
	background-position: left top;
	background-repeat: no-repeat;
}
.mypage_topback a:hover {
	display: block;
	width: 195px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_mypage_topback.gif);
	background-position: left -20px;
	background-repeat: no-repeat;
}
.mypagephoto {
	display: block;
	width: auto;
	height: auto;
	margin: 10px;
	padding: 0;
	text-align: left;
}
.mypagephoto ul {
	display: block;
	width: auto;
	height: auto;
	margin: 0 0 10px 0;
	padding: 0;
	text-align: left!important;
}
.mypagephoto li {
	display: block;
	float: left;
	width: 180px;
	height: 210px;
	margin: 0 4px 10px 0;
	padding: 0;
	background-image: none;
	text-align: center;
}
.mypagephoto h4 {
	clear: both;
	display: block;
	width: auto;
	height: auto;
	margin: 10px 0 3px 0;
	padding: 3px 0 3px 20px;
	background-image: url(../img/icon_green_list.gif);
	background-position: left 3px;
	background-repeat: no-repeat;
	font-size: 120%;
	font-weight: bold;
	text-align: left;
}
.photo_edit2 {
	display: block;
	width: auto;
	height: auto;
	margin: 20px 0 0 0;
	padding: 0;
}
.photo_edit2 a {
	display: block;
	width: 120px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_photo_edit.gif);
	background-position: left top;
	background-repeat: no-repeat;
}
.photo_edit2 a:hover {
	display: block;
	width: 120px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_photo_edit.gif);
	background-position: left -20px;
	background-repeat: no-repeat;
}
.btn_edit {
	display: block;
	width: 80px;
	height: 20px;
	margin: 0;
	padding: 0;
}
.btn_edit a {
	display: block;
	width: 80px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_edit.gif);
	background-position: left top;
	background-repeat: no-repeat;
}
.btn_edit a:hover {
	display: block;
	width: 80px;
	height: 20px;
	margin: 0;
	padding: 0;
	background-image: url(../img/btn_edit.gif);
	background-position: left -20px;
	background-repeat: no-repeat;
}

/* ie hack */
*html .mypoint {
	margin: 10px 10px 0 5px;
}
*html .kuchikomilist dl {
	margin-left: -10px;
}
*html .kuchikomilist dt {
	margin-left: 0;
}
*html .kuchikomilist p a {
	margin: 0;
}
*html .kuchikomilist p a:hover {
	margin: 0;
}
/* Hides from IE-mac \*/
/* End hide from IE-mac */