 @charset "UTF-8";

/*============================================================================
common style
============================================================================*/

* {
}

html,
body {
height: 100%;
width:100%;
}

body {
background-color:#FFF;
}

/* a */
a:link {
color:#333;
text-decoration:none;
}

a:visited {
color:#333;
text-decoration:none;
}

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

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

/*layout
=======================================*/
#wrapper {
position:relative;
width:900px;
padding-top:30px;
margin:auto;
}

/* ModernBrowser ONLY */
body > #wrapper {
height:auto;
}

#container {
height:auto;
margin:0px auto;
overflow:hidden;
position:relative;
text-align:center;
width:900px;
}

#header {
height:117px;
margin:0px auto;
overflow:hidden;
padding:0;
position:relative;
width:900px;
}

#footer {
font-size:77%;/*13→10*/
left:0;
overflow:hidden;
position:relative;
text-align:center;
width:100%;
margin:100px 0 10px 0;
}

/*index 
=======================================*/
#index #container {
padding-top:30px;
height:467px;
}
#index #content {
width:100%;
display:none;
}
#index h1 {
width:705px;
float:left;
}
#index #enter {
width:127px;
height:46px;
overflow:hidden;
margin-top:421px;
position:absolute;
left:714px;
top:0;
}
#index #enter a{
display:block;
height:46px;
line-height:46px;
position:static;
}
#index #enter a img{
vertical-align:top;
height:46px;
}
#index #enter a:hover{
position:relative;
}
#index #enter a:hover img{
position:relative;
top:-46px;
height:46px;
}
#index #enter a{
background:url(../img/index/index_enter_on.gif) 0 0 no-repeat;
}

/*header
=======================================*/

#header h1,
#header #logo {
height:33px;
width:138px;
padding-left:30px;
float:left;
}

/*global-nav
=======================================*/
ul#global-nav {
height:117px;
overflow:hidden;
position:absolute;
left:252px;
width:648px;
}

ul#global-nav li {
float:left;
height:33px;
line-height:33px;
position:relative;
}

ul#global-nav li a {
display:block;
height:33px;
line-height:33px;
position:static;
}

ul#global-nav li a img {
vertical-align:top;
height:33px;
}

ul#global-nav li a:hover {
position:relative;
}

ul#global-nav li a:hover img {
position:relative;
top:-33px;
height:33px;
}

/*home*/
ul#global-nav li#gn-home {
left:0;
width:48px;
}
ul#global-nav li#gn-home a {
background:url(../img/common/gn_home_on.gif) 0 0 no-repeat;
}

/*news*/
ul#global-nav li#gn-news {
margin-left:47px;
width:48px;
}
ul#global-nav li#gn-news a {
background:url(../img/common/gn_news_on.gif) 0 0 no-repeat;
}

/*works*/
ul#global-nav li#gn-works {
margin-left:38px;
width:55px;
position:relative;
}
ul#global-nav li#gn-works a {
background:url(../img/common/gn_works.gif) 0 0 no-repeat;
cursor:default;
}

/*original*/
ul#global-nav li#gn-original{
margin-left:46px;
width:60px;
}
ul#global-nav li#gn-original a {
background:url(../img/common/gn_original_on.gif) 0 0 no-repeat;
}

/*profile*/
ul#global-nav li#gn-profile {
margin-left:58px;
width:51px;
}
ul#global-nav li#gn-profile a {
background:url(../img/common/gn_profile_on.gif) 0 0 no-repeat;
}

/*contact*/
ul#global-nav li#gn-contact {
margin-left:43px;
width:57px;
}
ul#global-nav li#gn-contact a {
background:url(../img/common/gn_contact_on.gif) 0 0 no-repeat;
}


/*sub-nav
=======================================*/
ul#global-nav li#gn-works ul.sub-nav {
width:143px;
position:absolute;
left:0;
}
ul#global-nav li#gn-works ul.sub-nav li{
display:none;
float:none;
position:relative;
overflow:hidden;
margin:0;
line-height:0;
}
ul#global-nav li#gn-works ul.sub-nav li a{
background-image:none;
position:static;
width:143px;
line-height:normal;
cursor:pointer;
}
ul#global-nav li#gn-works ul.sub-nav li a img{
vertical-align:top;
width:143px;
}
ul#global-nav li#gn-works:hover ul.sub-nav li{
display:block;
}
ul#global-nav li#gn-works ul.sub-nav li a:hover{
position:relative;
}

/*illust*/
ul#global-nav li#gn-works ul.sub-nav li#sgn_illust {
height:32px;
}
ul#global-nav li#gn-works ul.sub-nav li#sgn_illust a {
background:url(../img/common/sgn_illust_on.gif) 0 0 no-repeat;
}
ul#global-nav li#gn-works ul.sub-nav li#sgn_illust a img {
height:32px;
}
ul#global-nav li#gn-works ul.sub-nav li#sgn_illust a:hover img{
position:relative;
top:-32px;
height:32px;
}

/*direction*/
ul#global-nav li#gn-works ul.sub-nav li#sgn_direction {
height:28px;
}
ul#global-nav li#gn-works ul.sub-nav li#sgn_direction a {
background:url(../img/common/sgn_direction_on.gif) 0 0 no-repeat;
}
ul#global-nav li#gn-works ul.sub-nav li#sgn_direction a img {
height:28px;
}
ul#global-nav li#gn-works ul.sub-nav li#sgn_direction a:hover img{
position:relative;
top:-28px;
height:28px;
}

/*other*/
ul#global-nav li#gn-works ul.sub-nav li#sgn_other {
height:24px;
}
ul#global-nav li#gn-works ul.sub-nav li#sgn_other a {
background:url(../img/common/sgn_other_on.gif) 0 0 no-repeat;
}
ul#global-nav li#gn-works ul.sub-nav li#sgn_other a img {
height:24px;
}
ul#global-nav li#gn-works ul.sub-nav li#sgn_other a:hover img{
position:relative;
top:-24px;
height:24px;
}

/*content
=======================================*/
.content{
overflow:hidden;
position:relative;
width:840px;
margin:auto;
}

/*main-content
=======================================*/
#main-content {
float:left;
width:585px;
}

/*sub-content
=======================================*/
#sub-content {
float:right;
width:200px;
}
#sub-content li {
margin-bottom:10px;
padding-left:15px;
background:url(../img/common/sub_dot.gif) 0 -2px no-repeat;
font-size:92%; /*12px*/
line-height:150%;
}

/*page-top
=======================================*/
.page-top {
height:18px;
line-height:18px;
margin:50px auto 10px auto;
text-align:right;
width:100%;
}

.page-top a {
width:37px;
background:url(../img/common/btn_top_on.gif) 100% 0 no-repeat;
display:block;
height:18px;
line-height:18px;
overflow:hidden;
float:right;
}

.page-top a:hover{
position:relative;
}

.page-top a:hover img{
position:relative;
top:-18px;
height:18px;
}

/*page-line
=======================================*/
hr.page-line{
display:list-item;
list-style:url(../img/common/page_line.gif) inside;
filter : alpha(opacity=0);
width:100%;
height:16px;
border:0;
padding: 0;
}

/*page-nextback
=======================================*/
.page-nextback{
height:18px;
line-height:18px;
margin:0 auto 10px auto;
text-align:right;
clear:both;
overflow:hidden;
}

#news .page-nextback,
#original .page-nextback{
width:585px;
}

#other_list .page-nextback,
#direction_list .page-nextback,
#other_list .page-nextback,
#original_list .page-nextback{
width:840px;
padding-top:30px;
}

.page-nextback .page-next a {
width:54px;
background:url(../img/common/btn_next_on.gif) 0 0 no-repeat;
display:block;
height:18px;
line-height:18px;
overflow:hidden;
float:right;
}

.page-nextback .page-back a {
width:54px;
background:url(../img/common/btn_back_on.gif) 0 0 no-repeat;
display:block;
height:18px;
line-height:18px;
overflow:hidden;
float:left;
}

.page-nextback a:hover{
position:relative;
}

.page-nextback a:hover img{
position:relative;
top:-18px;
height:18px;
}
