@charset "utf-8";

/* -------------------------------------------
 initialize
------------------------------------------- */

* {
 margin: 0;
 padding: 0;
}

html {
 height: 100%;
 overflow-y: scroll;
}

body {
 height: 100%;
 font: 10px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Osaka-等幅",  "ＭＳ ゴシック", "MS Gothic", sans-serif;
 text-align: center;
 line-height: 1.4;
 color: #ffffff;
}

/* for IE8 and modern browsers */
html>/**/body {
 font-size: 10px;
}

/* for IE6 */
* html body {
 font-size: 62.5%;
}

/* for IE7 */
*:first-child+html body {
 font-size: 62.5%;
}

h1, h2, h3, h4, h5, h6 {
 font-size: 1em;
 font-weight: normal;
}

p, dd, li {
 text-align: justify;
 text-justify: distribute;
}

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

a {
 outline: none;
}

a:link {
 color: #595757;
 text-decoration: underline;
}

a:hover,
a:focus {
 color: #595757;
 text-decoration: none;
}

a:active {
 color: #595757;
 text-decoration: none;
}

a:visited {
 color: #595757;
 text-decoration: underline;
}

label {
 cursor: pointer;
}

table {
 font-size: 1em;
 line-height: 1.4;
}

em, address, cite {
 font-style: normal;
}

br {
 letter-spacing: 0;
}

/* -------------------------------------------
 for layout
------------------------------------------- */

#container {
 position: relative;
 margin: 0 auto;
 min-height: 100%;
 text-align: left;
 background: transparent url(../images/bg.gif) 50% 0 repeat-y;
}

* html #container {
 height: 100%;
}

#body {
 padding: 231px 0 0 0;
}

#body-inner {
 min-height: 356px;
 height: 356px;
}

#alpha {
 position: absolute;
 top: 50%;
 margin-top: -88px;
 width: 50%;
 text-align: center;
 color: #ffffff;
 overflow: hidden;
}

#beta {
 position: absolute;
 top: 50%;
 left: 50%;
 margin-top: -218px;
 width: 50%;
 text-align: center;
 color: #000000;
 overflow: hidden;
}

#alpha-inner, #beta-inner {
 position: relative;
 margin: 0 auto;
 width: 400px;
 height: 356px;
}

#footer {
 position: absolute;
 left: 50%;
 bottom: 0;
 margin-left: -385px;
 width: 770px;
 height: 124px;
}

/* -------------------------------------------
 for contents
------------------------------------------- */


#body #annon {
 position: absolute;
 left: 50%;
 bottom: 134px;
 margin-left: -181px;
 padding-top: 21px;
 width: 363px;
 height: 0;
 display: block;
 overflow: hidden;
 background: transparent url(../images/annon.gif) 0 0 no-repeat;
}

* html #body #annon {
 height: 21px;
}

#body .btn-enter a {
 padding-top: 23px;
 width: 109px;
 height: 0;
 display: block;
 overflow: hidden;
}

* html #body .btn-enter a { 
 height: 23px;
}

/* alpha */

#alpha .content {
 margin: 0 auto;
 width: 208px;
}

#alpha .text {
 padding-top: 39px;
 width: 208px;
 height: 0;
 display: block;
 overflow: hidden;
 background: transparent url(../images/text-ss.gif) 0 0 no-repeat;
}

* html #alpha .text {
 height: 39px;
}

#alpha .btn-enter {
 margin-left: 54px;
}

#alpha .btn-enter a {
 background: transparent url(../images/btn-ss-enter.gif) 0 0 no-repeat;
}

#beta .btn-enter a {
 background: transparent url(../images/btn-school-enter.gif) 0 0 no-repeat;
}

#alpha .btn-enter a:hover,
#alpha.btn-enter a:focus,
#beta .btn-enter a:hover,
#beta .btn-enter a:focus{
 background-position: 0 -23px;
}

/* beta */

#beta .content {
 width: 400px;
}

#beta .text {
 padding-top: 47px;
 width: 342px;
 height: 0;
 display: block;
 overflow: hidden;
 background: transparent url(../images/text-school.gif) 0 0 no-repeat;
}

* html #beta .text {
 height: 47px;
}

#beta .btn-enter {
 margin-left: 151px;
}

/* footer */

#footer #getflash {
 width: 575px;
 border: #ffffff solid 1px;
 background: #ffffff;
 float: left;
}

#footer #getflash-icon {
 padding: 22px 0;
 width: 129px;
 text-align: center;
 float: left;
}

#footer #getflash-msg {
 margin-left: 129px;
 padding: 10px 20px;
 letter-spacing: 0.2em;
 line-height: 1.8;
 background: #000000;
}

#footer #banner-mobile {
 margin-left: 588px;
 _margin-left: 585px;
 border: #000000 solid 1px;
}

#footer #logo-ms {
 margin-top: 10px;
 float: right;
}

#footer #copyright {
 margin-top: 18px;
 padding-top: 16px;
 width: 285px;
 height: 0;
 display: block;
 overflow: hidden;
 background: transparent url(../images/copyright.gif) 0 0 no-repeat;
}

* html #footer #copyright {
 height: 16px;
}