@charset "utf-8";

/*
----------------------------------------
MANGA CHAT
file name: common.css
Author: T.Hori
create: 2009.5/23

=================contents=================

1 : browser-style Reset
2 : common
3 : rayout



==========================================


 1: browser-style Reset
-----------------------------------------------------------------------------*/
body {
	margin: 0;
    padding: 0;
	font-family: "Arial","ＭＳ Ｐゴシック","Osaka";
	font-size: 12px;
	line-height: 1.3em;
	background: #fff;
}
h1,h2,h3,h4,h5,h6,p,dl,dt,dd,address,form {
    margin:0;
    padding:0;
}
em,address{
    font-style:normal;
}
img{
	margin: 0;
	border: 0;
	vertical-align: bottom;
}
table{
	border: 0;
}


/* 2: common
-----------------------------------------------------------------------------*/
body {
	background: url(/img/bg_body.gif) top repeat-x #1e1e1e;
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	display: inline-table;
	min-height: 1%;
}


/* bottom menu */

div.bottom_menu {
	text-align: center;
}
div.bottom_menu h2 {
	display: inline;
	font-size: 14px;
	font-weight: bold;
}


/* footer */
div.footer {
	color: #fff;
	text-align: center;
	padding: 10px 0;
}
div.footer img {
	margin: 5px 0;
}


/* 3: rayout
-----------------------------------------------------------------------------*/

div#main_frame {
	width: 970px;
	margin: 0 auto;
	padding: 0 10px 10px;
	background: #fdcd3b;
	border: 1px solid #000;
	border-top: 0;
}


/* 4: index
-----------------------------------------------------------------------------*/

/* header */

div.index_header {
	height: 156px;
	background: url(/img/bg_header_left.gif) top left no-repeat;
}
div.index_header h1 {
	float: left;
	width: 537px;
	height: 156px;
	background: url(/img/bg_header_left.gif) top center no-repeat;
}
div.index_header h1 img {
	display: block;
	margin: 20px 0 0 84px;
}
div.index_header p {
	float: right;
	width: 413px;
	height: 156px;
	background: url(/img/bg_header_right.gif) top center no-repeat;
}


/* form */

div.index_form {
	height: 410px;
	background: url(/img/bg_form_right.gif) top right no-repeat;
}
div.index_form_left {
	float: left;
	width: 632px;
	height: 410px;
	background: url(/img/bg_form_left.gif) top left no-repeat;
}
div.index_form_left a.regist {
	display: block;
	width: 168px;
	height: 54px;
	margin: 110px 0 0 220px;
	background: url(/img/btn_regist.gif) top center no-repeat;
}
div.index_form_left a.regist:hover {
	background-position: 0 100%;
}
div.index_form_left a.regist span {
	position: absolute;
	left: -9999px;
	overflow: hidden;
	width: 0;
}
div.index_form_left form.login {
	width: 255px;
	height: 50px;
	margin: 80px 0 0 344px;
}
div.index_form_left form.login div {
	float: left;
}
div.index_form_left form.login p.email,
div.index_form_left form.login p.password {
	margin-top: 5px;
	padding-top: 13px;
}
div.index_form_left form.login p.email {
	background: url(/img/txt_email.gif) top left no-repeat;
}
div.index_form_left form.login p.password {
	background: url(/img/txt_password.gif) top left no-repeat;
}
div.index_form_left form.login p input {
	width: 150px;
	border: 1px solid #989898;
}
div.index_form_left form.login a.login {
	float: right;
	display: block;
	width: 87px;
	height: 65px;
	margin: 15px 0 0 10px;
	background: url(/img/btn_login.gif) top center no-repeat;
}
div.index_form_left form.login a.login:hover {
	background-position: 0 100%;
}
div.index_form_left form.login a span {
	position: absolute;
	left: -9999px;
	overflow: hidden;
	width: 0;
}
div.index_form_left p.openid {
	clear: both;
	margin-top: 6px;
	text-align: center;
}
div.index_form_left p.openid a {
	font-size: 12px;
	font-weight: bold;
	color: #38c071;
}


/* Flash Area */

div.index_flash_area {
	height: 790px;
	/*border: 1px solid #000;
	background: #ccc;*/
}


/* menu */

div.index_menu,
div.index_menu div.index_menu_in {
	width: 911px;
	height: 221px;
}
div.index_menu {
	margin: 15px auto;
	background: url(/img/bg_menu_left.gif) top left no-repeat;
}
div.index_menu div.index_menu_in {
	background: url(/img/bg_menu_right.gif) top right no-repeat;
}

div.index_menu div.index_menu_in ul li a {
	display: block;
}

div.index_menu div.index_menu_in ul li.chat a {
	width: 76px;
	height: 19px;
	background: url(/img/btn_menu_chat.gif) top center no-repeat;
}
div.index_menu div.index_menu_in ul li.chatters a {
	width: 150px;
	height: 20px;
	background: url(/img/btn_menu_chatters.gif) top center no-repeat;
}
div.index_menu div.index_menu_in ul li.characters a {
	width: 190px;
	height: 20px;
	background: url(/img/btn_menu_characters.gif) top center no-repeat;
}
div.index_menu div.index_menu_in ul li.mypage a {
	width: 106px;
	height: 24px;
	background: url(/img/btn_menu_mypage.gif) top center no-repeat;
}
div.index_menu div.index_menu_in ul li a:hover {
	background-position: 0 100%;
}


div.index_menu div.index_menu_in ul {
	margin: 0;
	padding: 0;
}
div.index_menu div.index_menu_in ul li {
	float: left;
	list-style: none;
}
div.index_menu div.index_menu_in ul li a span {
	position: absolute;
	left: -9999px;
	overflow: hidden;
	width: 0;
}
div.index_menu div.index_menu_in ul li.chat {
	padding: 50px 0 0 60px;
}
div.index_menu div.index_menu_in ul li.chatters {
	padding: 28px 0 0 28px;
}
div.index_menu div.index_menu_in ul li.characters {
	padding: 55px 0 0 35px;
}
div.index_menu div.index_menu_in ul li.mypage {
	padding: 37px 0 0 40px;
}