
/*-------------------------------------------------------------- ベース設定
*/

* {
  margin: 0;
  padding: 0;
}

/* default
-----------------------------------*/

body {
  font-size: 91.6%;/* 11pt */
}

/* Except IE
-----------------------------------*/

html > body {
  font-size: 11pt;
}

html {
  overflow-y: scroll;
/*  filter: expression(document.execCommand("BackgroundImageCache", false, true));*/
  height: 100%;
}

* html #Container,
* html #Container-In {
  height: 100%;
}

body {
  color: #4c4c4c;
  line-height: 1.5em;
  background: white;
/*  font-family: "MS UI Gothic", sans-serif;
  font-family: "meiryo";*/
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", sans-serif;
  text-align: center;
  height: 100%;
}

body > #Container,
body > #Container #Container-In {
  height: auto;
}

/*-------------------------------------------------------------- 基本スタイル
*/

a {
  color: #107AC0;
  text-decoration: none;
  cursor: pointer;
  outline-style: none;
}

a:hover {
  color: #f44;
  text-decoration: underline;
}

img {
  border: none;
  vertical-align: bottom;
}

hr {
  display: none;
  visibility: hidden;
}

.small {font-size: 81.8%;}
.Center {text-align: center;}
.Hidden {display: none;visibility: hidden;}
.red {color: #f24965;}

/*-------------------------------------------------------------- Container
*/

#Container {
  position: relative;
  min-height: 100%;
  text-align: left;
  background: url('images/container_bg.gif') repeat-y;
  width: 887px;
  margin: 0 auto;
  padding: 0 16px 0 17px;
}

#Container-In {
  background: url('images/container_bg_top.jpg') no-repeat;
  width: 887px;
}

/*-------------------------------------------------------------- Header
*/

#Header {
  position: relative;
  width: 872px;
  height: 162px;
  z-index: 100;
}

#Header h1 a {
  display: block;
  width: 264px;
  height: 160px;
  margin-left: 40px;
  text-indent: -1000em;
  overflow: hidden;
}

#Comet-Chan {
  position: absolute;
  top: 0px;
  left: 694px;
}

#Index-Video {
  position: absolute;
  top: 0px;
  left: 487px;
}

/*-------------------------------------------------------------- Wrapper
*/

#Wrapper {
  width: 808px;
  margin: 0 auto;
  padding: 0 0 57px 0;
  overflow: hidden;
}

#Wrapper-In {
  zoom: 100%;
  background: url('images/wrapper_bg.gif') repeat-y center top;
  width: 808px;
  overflow: hidden;
}

#Wrapper-In:after {
  content: "";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden;
}

#Wrapper-top {
  background: url('images/wrapper_top.png') no-repeat center top;
  width: 808px;
  height: 46px;
  overflow: hidden;
}

#Wrapper-bottom {
  background: url('images/wrapper_bottom.gif') no-repeat center top;
  width: 808px;
  height: 16px;
  overflow: hidden;
}

/*-------------------------------------------------------------- Footer
*/

#Footer {
  position: absolute;
  bottom: 0px;
  background: #296dcc url('images/footer_bg_top.gif') no-repeat center top;
  width: 887px;
  height: 25px;
  padding: 8px 0;
  overflow: hidden;
}

#Copyright {
  color: white;
  font-family: impact;
  text-align: center;
}

/*-------------------------------------------------------------- Contents
*/

.Contents {
  zoom: 100%;
  position: relative;
  display: inline;
  font-size: 90.9%;
  text-align: left;
  width: 616px;
  margin-right: 16px;
  padding-bottom: 24px;
  overflow: hidden;
  float: right;
}

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

.Contents h3 {
  font-size: 109%;
  line-height: 1.5em;
  background: url('images/contents_h3.jpg') no-repeat bottom center;
  width: 400px;
  min-height: 16px;
  margin: 16px auto;
  padding: 12px 124px 12px 76px;
}

* html .Contents h3 {
  height: 16px; /*IE6hack:*/
}

.Contents h4.CH4 {
  font-size: 100%;
  line-height: 1.5em;
  background: url('images/contents_h4.gif') no-repeat bottom left;
  min-height: 20px;
  margin: 16px auto;
  padding: 2px 0px 10px 40px;
}

* html .Contents h4.CH4 {
  height: 20px; /*IE6hack:*/
  padding: 3px 0px 9px 40px;
}

.Contents .CBorder01 {
  clear: both;
  background: url('images/contents_border01.gif') no-repeat;
  width: 600px;
  height: 8px;
  margin: 16px auto;
  overflow: hidden;
}

.Contents .CBorder02 {
  clear: both;
  background: url('images/contents_border02.gif') repeat-x;
  height: 4px;
  margin: 8px auto 16px;
  overflow: hidden;
}

.Contents .CBorder03 {
  clear: both;
  background: url('images/contents_border03.gif') repeat-x;
  height: 1px;
  margin: 8px auto 16px;
  overflow: hidden;
}

.Contents a.Return-Top {
  display: block;
  background: url('images/contents_return_top.gif') no-repeat;
  width: 552px;
  height: 18px;
  margin: 8px auto;
  text-indent: -1000em;
  line-height: 0;
  overflow: hidden;
}

.Contents a:hover.Return-Top {
  background-position: bottom;
}

/*-------------------------------------------------------------- Column
*/

.L-Column {
  display: inline;
  background: url('images/left_column_bg.gif') repeat-y;
  width: 152px;
  margin-left: 8px;
  float: left;
  overflow: hidden;
}
.L-Column .Bottom {
  background: url('images/left_column_bg_bottom.gif') no-repeat;
  height: 128px;
  width: 152px;
}

/*-------------------------------------------------------------- Navigation
*/

#Wrapper-In .Navigation {
  font-size: 90.9%;
  text-align: left;
  width: 152px;
  margin-bottom: 16px;
  overflow: hidden;
}

#Wrapper-In .Navigation li {
  list-style: none;
  float: left;
}

#Wrapper-In .Navigation li a {
  display: block;
  width: 152px;
  height: 28px;
  text-indent: -1000em;
  overflow: hidden;
}

#Wrapper-In .Navigation li a:hover {
  background-position: bottom;
}

#MM01 a {background: url('images/main_menu_01.gif') no-repeat;}
#MM02 a {background: url('images/main_menu_02.gif') no-repeat;}
#MM03 a {background: url('images/main_menu_03.gif') no-repeat;}
#MM04 a {background: url('images/main_menu_04.gif') no-repeat;}
#MM05 a {background: url('images/main_menu_05.gif') no-repeat;}
#MM06 a {background: url('images/main_menu_06.gif') no-repeat;}
#MM07 a {background: url('images/main_menu_07.gif') no-repeat;}
#MM08 a {background: url('images/main_menu_08.gif') no-repeat;}
#MM09 a {background: url('images/main_menu_09.gif') no-repeat;}
#MM10 a {background: url('images/main_menu_10.gif') no-repeat;}
#MM11 a {background: url('images/main_menu_11.gif') no-repeat;}
#MM12 a {background: url('images/main_menu_12.gif') no-repeat;}

.MM-Border {
  clear: both;
  background: url('images/main_menu_border.gif') no-repeat;
  width: 152px;
  height: 28px;
  overflow: hidden;
}

/*-------------------------------------------------------------- Sub Contents
*/

#Wrapper-In .SubContents {
  font-size: 90.9%;
  text-align: left;
  width: 152px;
  margin: 16px auto;
  overflow: hidden;
}
#Wrapper-In .SubContents .LBtn {
  width: 144px;
  margin: 0 auto;
}
#Wrapper-In .SubContents .LBtn li {
  list-style: none;
  float: left;
}
#Wrapper-In .SubContents .LBtn li a {
  display: block;
  text-indent: -1000em;
  width: 144px;
  height: 72px;
  margin-bottom: 4px;
  overflow: hidden;
}
#Wrapper-In .SubContents li a:hover {
  background-position: bottom;
}
#COLS a {background: url('images/online_shop_btn.jpg') no-repeat;}
#CMPD a {background: url('images/comepedia_btn.jpg') no-repeat;}

/*-------------------------------------------------------------- highslide（ナビボタン）
*/

#HS-Navi {
  display: block;
  overflow: hidden;
}

#HS-Image {
  overflow: hidden;
}

#HS-Navi .previous {float: left;}
#HS-Navi .next {float: left;}
#HS-Navi .close {float: right;}

#HS-Navi .previous a {background: url('images/hs_navi_previous.gif') no-repeat;  float: left;}
#HS-Navi .next a {background: url('images/hs_navi_next.gif') no-repeat;  float: left;}
#HS-Navi .close a {background: url('images/hs_navi_close.gif') no-repeat;  float: right;}

#HS-Navi .previous a,
#HS-Navi .next a,
#HS-Navi .close a {
  display: block;
  width: 72px;
  height: 23px;
  text-indent: -1000em;
  overflow: hidden;
}

#HS-Navi .previous a:hover,
#HS-Navi .next a:hover,
#HS-Navi .close a:hover {
  background-position: bottom;
}

.chara-navi {
  display: block;
  background: url('images/hs_navi_bg.gif');
  width: 592px;
  height: 24px;
  margin: 8px 0 0 0;
}

.chara-navi li {
  list-style: none;
}

.graphic-navi {
  height: 24px;
}

.graphic-navi ul {
  background: url('images/hs_navi_bg.gif') repeat-x center top;
  height: 24px;
  padding-top: 1px;
}

.graphic-navi li {
  list-style: none;
  width: 72px;
  height: 24px;
}

.movie-navi {
  display: block;
  background: url('images/hs_navi_bg.gif');
  width: 480px;
  height: 24px;
  margin: 8px 0 0 0;
}

.movie-navi li {
  list-style: none;
}

/*-------------------------------------------------------------- Underconstruction
*/

.Contents .UC {
  text-align: center;
}

.Contents .UC h3 {
  font-size: 163.6%;
  background: none;
  width: auto;
  margin: 0;
  padding: 0;
}

/*-------------------------------------------------------------- clear-fix
*/
.clf:after {
  content: ".";
  display: block;
  height: 0px;
  clear: both;
  visibility: hidden;
}

/* Win IE7 */
*:first-child+html .clf {
  height: 1%;
}
/* End Win IE7 */

/* Win IE6 \*/
* html .clf {
  height: 1%;
}
/* End Win IE6 */

/* Mac IE\*//*/
.clf {
  display: inline-table;
}
/* End Mac IE */



