body {
   background-color: #000000;
   height:100%;
}

a:link { color: #ff0000; }
a:visited { color: #ff0000; }
a:hover { color: #ff0000; }
a:active { color: #ff0000; }

#contents {
	width:900px;
	height:500px;
	margin-left:auto;
	margin-right:auto;
	background: url("../img/top/BG.gif") repeat;
}

#header {
	position:relative;
	top: -20px;
	width:900px;
	height:367px;
}

#head_top {
	position:relative;
	width:900px;
	height:87px;
}

#head_top_frame_top {
	position:relative;
	width:900px;
	height:90px;
	background: url("../img/top/char_top.png") no-repeat;
}


#head_top_cart {
	position:relative;
	left: 620px; 
	top: 48px; 
	width:30px;
	height:26px;
	background: url("../img/top/cartlogo.gif") no-repeat;
}

#head_left {
	position:relative;
	width:624px;
	height:323px;
	float:left;
	background: url("../img/top/chara_left_d.gif") no-repeat;
}

#head_right {
	position:relative;
	width:276px;
	height:323px;
	float:right;
	background: url("../img/top/char_right.png") no-repeat;
}

#head_bottom {
	position:absolute;
	left:0px;
	top:410px;
	width:900px;
	height:32px;
	background: url("../img/top/top_low.png") no-repeat;
}

#sns {
	position:absolute;
	left:810px;
	top:20px;
	width:200px;
	height:32px;
}

#btn_faq a {
	position:absolute;
	left:648px;
	top:30px;
	width:155px;
	height:53px;
	display:block;
	overflow:hidden;
	text-indent:-9999px;
	background: url("../img/top/faq.gif") no-repeat;
z-index:10;
}

#main {
	position:relative;
	left:0px;
	top:-15px; 
	width:900px;
	height:1040px; /* ここの長さで bttom の位置を調整する */ 
	color: #fff;
}

#menu {
	position:relative;
	left:0px;
	top:560px;	
	width:877px;
	height:116px; 
	background: url("../img/top/comicsort_bg.png") no-repeat;
	z-index: 999 ;
}

#menu_box {
	position:absolute;
	left:10px;
	top:34px; 
}

#w_champ {
	position:absolute;
	left:170px;
	top:0px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/wcham_button.gif") no-repeat;
z-index:10;
}
#w_champ_a {
	position:absolute;
	left:170px;
	top:0px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/wchamp_button_a.gif") no-repeat;
z-index:9;
}

#b_champ {
	position:absolute;
	left:340px;
	top:0px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/bchamp_button.gif") no-repeat;
z-index:10;
}

#b_champ_a {
	position:absolute;
	left:340px;
	top:0px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/bchamp_button_a.gif") no-repeat;
z-index:9;
}

#m_champ {
	position:absolute;
	left:510px;
	top:0px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/mcham_button.gif") no-repeat;
z-index:10;
}

#m_champ_a {
	position:absolute;
	left:510px;
	top:0px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/mchamp_button_a.gif") no-repeat;
z-index:9;
}

#yg_champ {
	position:absolute;
	left:680px;
	top:0px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/ycham_button.gif") no-repeat;
z-index:10;
}

#yg_champ_a {
	position:absolute;
	left:680px;
	top:0px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/ychamp_button_a.gif") no-repeat;
z-index:9;
}

#champ_r {
	position:absolute;
	left:0px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/chamred_button.gif") no-repeat;
z-index:10;
}

#champ_r_a {
	position:absolute;
	left:0px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/chapmred_button_a.gif") no-repeat;
z-index:9;
}


#lady_and_other {
	position:absolute;
	left:170px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/womancomic_button.gif") no-repeat;
z-index:10;
}

#lady_and_other_a {
	position:absolute;
	left:170px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/womancomic_button_a.gif") no-repeat;
z-index:9;
}

#lady {
	position:absolute;
	left:170px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/woman_other.gif") no-repeat;
z-index:10;
}

#lady_a {
	position:absolute;
	left:170px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/woman_other_a.gif") no-repeat;
z-index:9;
}

/*
#other {
	position:absolute;
	left:340px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/other_button.gif") no-repeat;
z-index:10;
}

#other_a {
	position:absolute;
	left:340px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/other_button_a.gif") no-repeat;
z-index:9;
}
*/

#sotsd {
	position:absolute;
	left:340px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/sameday_button.gif") no-repeat;
z-index:10;
}

#sotsd_a {
	position:absolute;
	left:340px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/sameday_button_a.gif") no-repeat;
z-index:9;
}


#top {
	position:absolute;
	left:510px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/all_button.gif") no-repeat;
z-index:10;
}

#top_a {
	position:absolute;
	left:510px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/all_button_a.gif") no-repeat;
z-index:9;
}


#btn_close {
	position:absolute;
	left:680px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/end_button.gif") no-repeat;
z-index:10;
}

#btn_close_a {
	position:absolute;
	left:680px;
	top:34px;
	width:170px;
	height:29px;
	display:block;
	background: url("../img/top/end_button_a.gif") no-repeat;
z-index:9;
}

#main_left {
	position:relative;
	width:624px;
	height:323px;
	float:left;
}

#information {
	position:relative;
	left:10px;
	top:5px;
	width:600px;
	height:200px;
}

#information_frame_top {
	position:absolute;
	left:3px;
	top:27px;
	width:623px;
	height:58px;
	background: url("../img/top/info_01.png") no-repeat;
	z-index: 999 ;
}

#information_frame_left {
	position:absolute;
	left:610px;
	top:85px;
	width:16px;
	height:102px;
	background: url("../img/top/info_04.png") no-repeat;
}

#information_frame_right {
	position:absolute;
	left:3px;
	top:85px;
	width:16px;
	height:102px;
	background: url("../img/top/info_03.png") no-repeat;
}

#information_frame_bottom {
	position:absolute;
	left:3px;
	top:235px;
	width:623px;
	height:11px;
	background: url("../img/top/info_02.png") no-repeat;
}

#information_main_bg {
	position:relative;
	left:8px;
	top:85px;
	width:613px;
	height:150px;
	background-color: #000000;
}

#information_main {
	position:relative;
	left:13px;
	top: 2px;
	width:580px;
	height:150px;
	font-size:14px;
	color: #ffffff;
	font-weight:bold;
}

#item {
	position:relative;
	left:10px;
	top:40px;
	width:600px;
	height:400px;
}

#harumichi {
	position:absolute;
	left:-16px;
	top:15px;
	width:640px;
	height:487px;
	background: url("../img/top/harumichi3.png") no-repeat; 
}

#youtube_box {
	position:absolute;
	left:2px;
	top:110px;
	position:relative;
	width:643px;
	height:181px;
}

#cart_info_box {
	position:absolute;
	left:-3px;
	top:555px; 
/*	top:705px; on youtube box*/
	width:643px;
	height:181px;
	background: url('../img/top/guidance.png') no-repeat; 
}

#item_main {
	position:absolute;
	left:20px;
	top: 190px;
	width:233px;
	height:100px;
	color: #ffffff;
}

#shop_items {
	position:absolute;
	left:-14px;
	top: 535px;
	width:910px; 
	height:640px;
	color: #ffffff;
	text-align:center;
	margin:0px auto;
	float:left; 
}

.comingsoon {
	position:relative;
	float:left;
	width:220px;
	height:280px;
	background: url("../img/top/comingsoon.png") no-repeat; 
}

.shop_item_info {
	position:absolute;
	left:20px;
	top: 155px;
	width:192px;
	height:120px;
	color: #000000;
	text-align:left; 
	font-size:12px;
	font-weight:bold;
	line-height:100%;
z-index:99;
}

#main_right {
	position:relative;
	width:276px;
	height:223px;
	float:right;
}

#close {
	position:relative;
	left: 15px;
	top: -20px;
	width:860px;
	height:80px;

	float:center;

	color: #000000;
	/* background-color: #DAD1C8; */
}

#close_img {
	position:absolute;
	left: 1px;
	top:2px;
}

#close_text {
	position:absolute;
	left: 5px;
	top:15px;

	color: #000000;
}

#login {
	position:relative;
	left:40px;
	top:20px;
	width:234px;
	height:800px;
	background: url("../img/top/log_in4.png") no-repeat;
}

#login_input {
display: inline;
width: auto;
font-family:tahoma;
size:12;
}

#login_main_bg {
	position:absolute;
	left:10px;
	top:79px;
	width:204px;
	height:150px;
	background-color: #000000;
z-index:1000;
}

#login_main {
	position:absolute;
	left:20px;
	top:1px;
	width:180px;
	height:220px;
	color: #ffffff;
}

#btn_login {
	position:absolute;
	left:22px;
	top:87px;
}

#btn_entry {
	position:absolute;
	left:22px;
	top:143px;
}

#btn_logout {
	position:absolute;
	left:85px;
	top:140px;
}

#right_cart_box {
	position:relative;
	left: 13px; 
	top:275px; 
	width:180px;
	height:32px;
	font-size: 15px;
	text-align:center;
	color: #cEcEcE ; 
}

#info_login {
	position:absolute;
	width:180px;
	height:100px;
	top:111px;
	font-size:12px; 
}

#btn_cart {
	position:absolute;
	left:31px;
	top:91px;
}

#btn_cart a {
	position:absolute;
	left:11px;
	top:220px;
	width:121px;
	height:17px;
	display:block;
	overflow:hidden;
	text-indent:-9999px;
	background: url("../img/top/cart_check.gif") no-repeat;
z-index:10;
}

#btn_cart a:hover {
	background: url("../img/top/cart_check.gif") no-repeat;
}

#link {
	position:relative;
	left:5px;
	top:10px;
	width:900px;
	height:207px;
	background: url("../img/top/link.png") no-repeat;
}

#link_box {
	position:absolute;
	left:50px;
	top: 130px;
	width:890px;
	height:50px;
z-index:100;
}

#link_dmy {
	position:absolute;
	left:3px;
	top:0px;
	width:201px;
	height:233px;
	background: url("../img/top/dummy_banner.png") no-repeat;
z-index:99;
}

#right_img_frame {
	position:absolute;
	left:10px;
	top:1435px;
	width:262px;
	height:565px;
	background: url("../img/top/char_top2.png") no-repeat;
}

#copyright {
	position:relative;
	width:900px;
	height:68px;
	background: url("../img/top/copy2.png") no-repeat;
}

/* top だけ位置が違う */

#main_bottom {
	position:relative;
	left:-5px;
	top:-100px;
	width:100%;
	height:160px;
	float:center;
}

#footer_main {
	position:relative;
	top:-100 px;
	left:25px;
	color:#ffffff; 
	text-align:left;
	font-size:12px;
	line-height:14px;
	font-weight:bold;
}

#footer_main2 {
	position:relative;
	color:#ffffff; 
	top:-52px;
	left:25px;
	text-align:left;
	font-size:11px;
	line-height:12px;
}

#img_champ_logo {
	position:absolute;
	left:32px;
	top:35px;
	width:105px;
	height:124px;
	background: url("../img/top/champ_logo.gif") no-repeat;
z-index:0;
}


#btn_home {
	position:absolute;
	left:45px;
	top:0px;
	width:148px;
	height:96px;
	background: url("../img/top/001_on.png") no-repeat;
}

#btn_setting a {
	position:absolute;
	left:3px;
	top:79px;
	width:114px;
	height:53px;
	display:block;
	overflow:hidden;
	text-indent:-9999px;
z-index:10;
}

#btn_setting a:hover {
	background: url("../img/top/002_on.png") no-repeat;
}

#btn_history a {
	position:absolute;
	left:130px;
	top:79px;
	width:146px;
	height:56px;
	display:block;
	overflow:hidden;
	text-indent:-9999px;
z-index:10;
}

#btn_history a:hover {
	background: url("../img/top/003_on.png") no-repeat;
}

#btn_mg a {
	position:absolute;
	left:-2px;
	top:138px;
	width:99px;
	height:43px;
	display:block;
	overflow:hidden;
	text-indent:-9999px;
z-index:10;
}

#btn_mg a:hover {
	background: url("../img/top/004_on.png") no-repeat;
}

#btn_qa a {
	position:absolute;
	left:115px;
	top:143px;
	width:148px;
	height:96px;
	display:block;
	overflow:hidden;
	text-indent:-9999px;
z-index:10;
}

#btn_qa a:hover {
	background: url("../img/top/005_on.png") no-repeat;
}


#btn_apply a {
	position:absolute;
	left:0px;
	top:0px;

	left:-9px;
	top:59px;

	width:235px;
	height:56px;
	display:block;
	overflow:hidden;
	text-indent:-9999px;
z-index:10000;
}

#btn_apply a:hover {
	background: url("../img/top/menu_07.png") no-repeat;
}

#banner_box {
	position:absolute;
	left:6px;
	top:260px;
	width:621px;
	height:286px;
z-index:20;
}

/*
.banner a {
	width:640px;
	height:286px;
	display:block;
	overflow:hidden;
	text-indent:-9999px;
z-index:30;
}
*/

#banner_effect_1 {
	width:640px;
	height:286px;
	background: url("../img/top/top_bigbanner01.png") no-repeat;
}
#banner_effect_2 {
	width:640px;
	height:286px;
	background: url("../img/top/top_bigbanner02.png") no-repeat;
}
#banner_effect_3 {
	width:640px;
	height:286px;
	background: url("../img/top/top_bigbanner03.png") no-repeat;
}

/* below for scroll */ 

#new-version
{
	border: 2px solid #f00;
	margin: 1em 0;
	padding: .5em 1em 0;
	background: #ffe;
}

#new-version h1
{
	margin-top: 0;
}

a.jScrollArrowUp {
	background: url(../images/basic_arrow_up.gif) repeat-x 0 0;
}
a.jScrollArrowUp:hover {
	background-position: 0 -15px;
}
a.jScrollArrowDown {
	background: url(../images/basic_arrow_down.gif) repeat-x 0 0;
}
a.jScrollArrowDown:hover {
	background-position: 0 -15px;
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	background-position: 0 -30px;
}

.orange-bar .jScrollPaneTrack {
	background: #f60;
}
.orange-bar .jScrollPaneDrag {
	background: #00f url(../images/drag_grab.gif) no-repeat 50% 50%;
}
.orange-bar .scroll-pane {
	background: #69f; 
}
			
.holder {
	float: left;
	margin: 10px;
}

.scroll-pane {
	width: 100%;
	height: 140px;
	overflow: auto;
	float: left;
}

.wide {
	width: 400px;
}

.super-wide {
	width: 700px;
}

.tall {
	height: 400px;
}

#pane1 {
}
#pane2 {
	height: 150px;
}
#pane3 {
	height: 190px;
}
#pane4 {
	height: 190px;
}

.button {
	display: block;
	color: #00a;
	text-align: center;
	text-decoration: none;
	/* ボタン画像サイズに合わせる */
	width: 180px;
	/* 画像と通常時のライン色を指定 */
	background: #ddd url(button.gif) center center no-repeat;
	/* 使用しているフォントに合わせて調節 */
	font-size: 12px;
	font-weight: bold;
	padding: 7px 0 8px;
	/* input タグ用にボーダーを消す */
	border: none;
}
/* リンクの状態ごとにライン色を指定 */
.button:visited {
	background-color: #ddd;
}
.button:hover {
	background-color: #3cc6f5;
}
.button:active {
	background-color: #f00;
}


#sm_footer {
	font-size:16px;
	text-align:center;
}