@charset "utf-8";

/* ==========================================================================
   Base styles
   ========================================================================== */

html, body {
    height: 100%;
}

html {
	overflow-y: scroll;
}

body {
	color: #000;
	font-family: Arial, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	font-size: 13px;
	line-height: 1.8;
	-webkit-text-size-adjust: 100%;
}

body.is-loading {
    overflow: hidden;
}

a {
	color: #005bac;
	text-decoration: underline;
}

a:hover,
a:active {
	text-decoration: none;
}

/* ==========================================================================
   loading styles
   ========================================================================== */
#loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff url(../img/common/loading.gif) no-repeat center center;
    z-index: 9999;
}

/* ==========================================================================
   container styles
   ========================================================================== */
#container {
    position: relative;
    min-height: 100%;
}


/* ==========================================================================
   Header styles
   ========================================================================== */
#header h1 {
    position: absolute;
    top: 30px;
    right: 40px;
    z-index: 10;
}


/* ==========================================================================
   Content styles
   ========================================================================== */
main {
    width: 1200px;
    margin: 0 auto;
}

#content .menu-open {
    position: absolute;
    top: 33px;
    left: 36px;
    cursor: pointer;
    z-index: 10;
}

#content .menu {
    position: absolute;
    top: 0;
    left: -250px;
    width: 250px;
    background: rgba(255, 255, 255, 0.8);
    z-index: 10;
}

#content .menu-inner {
    position: relative;
    padding: 33px 34px 0;
}

#content .menu-inner h1 {
    margin: 0 0 0 10px;
    cursor: pointer;
}

#content .menu-inner > ul {
    margin: 55px 0 0 18px;
    line-height: 1;
}

#content .menu-inner > ul ul {
    margin: 0 0 0 13px;
}

#content .menu-inner > ul li {
    margin: 35px 0 0 0;
}

#content .menu-inner dl {
    overflow: hidden;
    margin: 50px 0 0 0;
    padding: 30px 0 0 10px;
    border-top: solid 2px #005BAC;
    line-height: 1;
}

#content .menu-inner dt {
    float: left;
    margin: 0 11px 0 0;
}

#content .menu-inner dd {
    overflow: hidden;
    float: left;
}

#content .menu-inner dd li {
    float: left;
    margin: 0 8px 0 0;
}

#content .menu .menu-close {
    position: absolute;
    top: 36px;
    left: 189px;
    cursor: pointer;
}


/* ==========================================================================
   Footer styles
   ========================================================================== */
#footer {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 80px;
    padding: 20px 0 0 0;
    color: #fff;
    background: #005BAC;
    z-index: 10;
}

#footer p {
    float: left;
    padding: 0 0 0 40px;
}

#footer ul {
    float: right;
    padding: 0 40px 0 0;
}

#footer ul a {
    padding: 0 0 0 15px;
    color: #fff;
    background: url(../img/common/arw_white.png) no-repeat left 0.2em;
    text-decoration: none;
}

#footer ul a:hover,
#footer ul a:active {
    text-decoration: underline;
}


/* ==========================================================================
   Pagetop styles
   ========================================================================== */
#pagetop {
    position: fixed;
    right: 40px;
    bottom: 140px;
}


/* ==========================================================================
   Common styles
   ========================================================================== */

/* clearfix
   -------------------------------------------------------------------------- */
.cf:before,
.cf:after {
	content: " ";
	display: table;
}

.cf:after {
	clear: both;
}

.cf {
	*zoom: 1;
}