@charaset "shift_jis";

/* FONT SIZE */
html { font-size: 62.5%; }
body { font-size: 14px; font-size: 1.4rem; } /* =14px */
h1   { font-size: 24px; font-size: 2.4rem; } /* =24px */

.clearfix {zoom:1;}
.clearfix:after{
    content: ""; 
    display: block; 
    clear: both;}

body { font-family: sans-serif; background: #fff; }
html,body { height:100%; margin:0px; padding:0px; }
img { border: none; vertical-align: bottom;}
a span { display: none;}
.hide { display: none;}

#frame-footer { width: 100%; height: 240px;}

#topcontrol { z-index:100;}


/* 表示確認 */
#wrapper,#frame-nav,#maincontent { display: none;}


/* H2 --------------------------- */
h2 { width: 1200px; height: 140px; margin: 14px auto 8px auto; padding: 0;}



/* BASE ------------------------- */
#frame-contents { width: 1200px; min-height:750px; margin: 0px auto;}

#frame-nav-side { width: 336px; height: 100%; background:url(image/nav/bg_nav-side.png) top center;  position: fixed;}
.frame-nav-side-innner { width: 320px; margin-left: 8px; margin-top:-16px; position: absolute; }

#frame-contents-inner { width: 1200px; float: right;}
.bg-index { height: 100%; background:url(image/bg_top-main.png) top center no-repeat; }


/* CONTENTS RIGHT AREA */

/* TOP */
.frame-index { width: 800px; height: 920px; position: relative; top: 0px; left: 420px;}
.box-text-01 { width: 600px; height: 200px; position: absolute; top: 490px; right:-50px;}

/* NAV */
.nav-side-logo-top { width: 564px; height: 398px; position: absolute; top: 330px; left: -3px;} /* TOPページ メインロゴ */

.nav-side-logo { width: 368px; height: 499px; position: absolute; top: 260px; left: -15px;} /* コンテンツページ メインロゴ */


.button-regist { width: 223px; height: 195px; margin-top: 0px;}
.button-regist a { width: 223px; height: 195px; display: block; background-image: url(image/nav/button_nav_regist.png);}
.button-regist a:hover { background-position: -223px 0;}

.banner-minigame { width: 223px; height: 83px; margin-top: 15px; text-align: center;}

.button-nav { width: 320px; min-height: 344px; background:url(image/nav/bg_nav-button.png) 0px 48px no-repeat; position: absolute; } /* メインナビボックス */
.button-nav-spacer { width: 336px; height: 10px;} /* 上の隙間調整 */
.button-nav ul { margin: 0px auto 0px -5px; padding: 5px 0 0 0;} /* height調整 */
.button-nav li { width: 320px; height: 40px; margin: 0; padding: 0; list-style: none;}
.button-nav li a { width: 320px; height: 40px; display: block; background-image:url(image/nav/button_nav-main.png);}

.box-new-01 { width: 60px; height: 24px; background: url(image/contents/pt_new.png) no-repeat; position:absolute; top: 12px; right: -25px; z-index: 60;}
.box-new-02 { width: 60px; height: 24px; background: url(image/contents/pt_new.png) no-repeat; position:absolute; top: 52px; right: -25px; z-index: 60;}
.box-new-03 { width: 60px; height: 24px; background: url(image/contents/pt_new.png) no-repeat; position:absolute; top: 92px; right: -25px; z-index: 60;}
.box-new-04 { width: 60px; height: 24px; background: url(image/contents/pt_new.png) no-repeat; position:absolute; top: 132px; right: -25px; z-index: 60;}
.box-new-05 { width: 60px; height: 24px; background: url(image/contents/pt_new.png) no-repeat; position:absolute; top: 172px; right: -25px; z-index: 60;}
.box-new-06 { width: 60px; height: 24px; background: url(image/contents/pt_new.png) no-repeat; position:absolute; top: 212px; right: -25px; z-index: 60;}
.box-new-07 { width: 60px; height: 24px; background: url(image/contents/pt_new.png) no-repeat; position:absolute; top: 252px; right: -25px; z-index: 60;}
.box-new-08 { width: 60px; height: 24px; background: url(image/contents/pt_new.png) no-repeat; position:absolute; top: 292px; right: -25px; z-index: 60;}

.nav-btn-01 a { background-position: 0 0;}
.nav-btn-02 a { background-position: 0 -40px;}
.nav-btn-03 a { background-position: 0 -80px;}
.nav-btn-04 a { background-position: 0 -120px;}
.nav-btn-05 a { background-position: 0 -160px;}
.nav-btn-06 a { background-position: 0 -200px;}
.nav-btn-07 a { background-position: 0 -240px;}
.nav-btn-08 a { background-position: 0 -280px;}
.nav-btn-09 a { background-position: 0 -320px;}

.nav-btn-01 a:hover { background-position: -320px 0;}
.nav-btn-02 a:hover { background-position: -320px -40px;}
.nav-btn-03 a:hover { background-position: -320px -80px;}
.nav-btn-04 a:hover { background-position: -320px -120px;}
.nav-btn-05 a:hover { background-position: -320px -160px;}
.nav-btn-06 a:hover { background-position: -320px -200px;}
.nav-btn-07 a:hover { background-position: -320px -240px;}
.nav-btn-08 a:hover { background-position: -320px -280px;}
.nav-btn-09 a:hover { background-position: -320px -320px;}

.nav-btn-01-act { background:url(image/nav/button_nav-main.png) -640px 0;}
.nav-btn-02-act { background:url(image/nav/button_nav-main.png) -640px -40px;}
.nav-btn-03-act { background:url(image/nav/button_nav-main.png) -640px -80px;}
.nav-btn-04-act { background:url(image/nav/button_nav-main.png) -640px -120px;}
.nav-btn-05-act { background:url(image/nav/button_nav-main.png) -640px -160px;}
.nav-btn-06-act { background:url(image/nav/button_nav-main.png) -640px -200px;}
.nav-btn-07-act { background:url(image/nav/button_nav-main.png) -640px -240px;}
.nav-btn-08-act { background:url(image/nav/button_nav-main.png) -640px -280px;}
.nav-btn-09-act { background:url(image/nav/button_nav-main.png) -640px -320px;}

.nav-btn-05-coming { background:url(image/nav/button_nav.png) -669px -280px;}


/* CP */

.box-contents { width: 920px; float: right; }

.box-contents img { margin-bottom: 25px; margin-left: 45px; }


.btn-cp01-1 { width: 800px; height: 80px;}
.btn-cp01-1 a { width: 800px; height: 80px; display: block; background-image: url(image/contents/btn_cont_01_cp.png);}
.btn-cp01-1 a:hover { background-position: 0 -80px;} 

#frame-btn-cp02 { width: 800px; height: 844px; background:url(image/contents/cont_01_04.png) no-repeat; position: relative; }
#frame-btn-cp02 a { width: 72px; height: 36px; display: block; background:url(image/contents/btn_cont_02_cp.png) no-repeat; position: absolute; top: 296px; left: 80px;}
#frame-btn-cp02 a:hover { background-position: 0 -36px;}

#frame-btn-cp03 { width: 800px; height: 448px; background:url(image/contents/cont_03_02.png) no-repeat; position: relative; }
#frame-btn-cp03 a { width: 72px; height: 36px; display: block; background:url(image/contents/btn_cont_02_cp.png) no-repeat; position: absolute; top: 360px; left: 80px;}
#frame-btn-cp03 a:hover { background-position: 0 -36px;}


/* BG ALL IMAGE ------------------------ */
img.bgmaximage{
  position:fixed !important;
}

#maincontent {
	width: 100%;  z-index: 50;
	position: absolute; top: 0px; left: 0px;
}