﻿@charset "utf-8";

@import url('styles/reset.css');
@import url('styles/font.css');

@import url(http://fonts.googleapis.com/css?family=Raleway:500|Roboto:900,500|Playfair+Display:700);

html
{
    overflow-y: scroll;
}

body
{
    color: #333;
    background-color: white;
}

div#container
{
    width: 960px;
    margin: 20px auto;
    text-align: left;
    background: #fff;
}

#Top_logo
{
    float: left;
    -moz-user-select : none;
    -webkit-user-select : none;
    -ms-user-select : none;
    user-select : none;
}

#Top_logo_img{
    height:45px;
    background-image: url(../img/w_logo.png);
    background-repeat:no-repeat;
    background-position : left center;
    font-family:'Roboto',sans-serif;
    padding-top:0px;
    padding-bottom:0px;
    padding-left:55px;
    line-height : 1em;
}

#Top_logo_img h1{
    padding-top:3px;
    color:#3f324a;
    font-weight:900;
    font-size:24px;
}

#Top_logo_img h2{
    color:black;
    font-weight:500;
    /*font-style:italic;*/
    font-size:12px;
    padding-top:3px;
}

#lang
{
    width: auto;
    float: right;
    margin-top: 0;
}

    #lang ul
    {
        margin: 0;
        padding: 0;
    }

    #lang li
    {
        list-style-type: none;
        float: left;
    }

        #lang li a
        {
            display: block;
            text-decoration: none;
            text-align: center;
            height: 21px;
            display: inline-block;
            cursor: pointer;
            color: #505739;
            font-family: Arial;
            font-size: 14px;
            font-weight: bold;
            padding: 0px 16px;
            text-decoration: none;
            text-shadow: 0px 1px 0px #ffffff;
        }

.lang_selected
{
    -webkit-box-shadow: inset 2px 3px 3px -1px #3d3621; 
    box-shadow: inset 2px 3px 3px -1px #3d3621;
    background: linear-gradient(to bottom, #eae0c2 5%, #ccc2a6 100%);
}

.lang_unselected
{
    background: linear-gradient(to bottom, #eae0c2 5%, #ccc2a6 100%);
}

    .lang_unselected:hover
    {
        background: linear-gradient(to bottom, #ccc2a6 5%, #eae0c2 100%);
    }

.lang_jp
{
    border-radius: 2px 0px 0px 2px;
}

.lang_en
{
    border-radius: 0px 2px 2px 0px;
}

nav li
{
    float: left;
}

#gnavi ul
{
    margin: 0;
    padding: 0;
}

#gnavi li
{
    list-style-type: none;
    position: relative;
    width: 135px;
}

    #gnavi li a
    {
        display: block;
        /*border-left:1px darkgray dashed;*/
        border-right: 1px darkgray dashed;
        height: 30px;
        line-height: 30px;
        font-family: 'Raleway', sans-serif;
        font-size: 20px;
        color: black;
        text-align: center;
        text-decoration: none;
    }

.gnavi_f
{
    border-left: 1px darkgray dashed;
}

#gnavi li:hover
{
    /*background-color:darkturquoise;*/
    background-color: #00CCFF;
}

#gnavi li.current a
{
    border-bottom: 4px #003399 solid;
}

#gnavi li ul
{
    list-style: none;
    position: absolute;
    top: 100%;
    left: 0;
    margin: 0;
    padding: 0;
    border-radius: 0 0 3px 3px;
}

    #gnavi li ul li
    {
        overflow: hidden;
        border-bottom: none;
        /*width: 100%;*/
        height: 0;
        z-index: 100;
        -webkit-transition: .2s;
        transition: .2s;
        background: -webkit-linear-gradient(top, #FFFFFF 0%, #FFFFFF 70%, #00CCFF 100%);
        background: linear-gradient(to bottom, #FFFFFF 0%,#FFFFFF 70%, #00CCFF 100%);
    }

        #gnavi li ul li a
        {
            border-left: 1px dashed darkgray;
            border-bottom: 1px dashed darkgray;
            font-family: 'Raleway', sans-serif;
            font-size: 18px;
        }

#gnavi li:hover ul li
{
    overflow: visible;
    height: 30px;
}

#gnavi li ul li:hover
{
    background: #00CCFF;
}

#gnavi li.current ul li a
{
    border-bottom: none;
}

#gnavi li ul li.current_sub a
{
    background: -webkit-linear-gradient(top, #FFFFFF 0%, #FFFFFF 70%, #003399 100%);
    background: linear-gradient(to bottom, #FFFFFF 0%,#FFFFFF 70%, #003399 100%);
}

.headerspace
{
    height: 20px;
    clear: both;
}

#LeftInfo
{
    margin-top: 0;
    padding-top: 0;
    float: left;
    width: 55%;
    /*border:thin black solid;*/
}

#NewsContents
{
    max-height: 500px;
    overflow-y: auto;
}

#News time
{
    font-size: 16px;
}

#News table
{
    width: 100%;
}

#News th
{
    padding: 8px;
    width: 20%;
    text-align: left;
}

#News td
{
    padding: 8px;
}

#News h2
{
    font-size: 14px;
    margin-bottom: 5px;
}

.news_update
{
    padding-left: 8px;
    background-color: #99CCFF;
    color: black;
}

.news_event
{
    padding-left: 8px;
    background-color: #29529c;
    color: white;
}

.contents
{
    Margin-top: 10px;
    padding-top: 10px;
}

    .contents section
    {
        font-size: 16px;
    }

#RightInfo
{
    float: right;
    width: 44%;
    /*border:thin blue solid;*/
}

.commonhead h1
{
    padding-left: 5px;
    font-family: 'Raleway', sans-serif;
    font-size: 18px;
    border-left: 5px #003399 solid;
    margin-bottom: 10px;
}

a:hover img.overwhite
{
    cursor: pointer;
    opacity: 0.6;
    zoom: 1;
}

#Information ul li{
    margin-bottom:10px;
}


#SNSButtons
{
    text-align: center;
    vertical-align: central;
    padding-top: 5px;
    height: 30px;
    border: solid 1px #99ccFF;
    border-radius: 5px;
}

    #SNSButtons div
    {
        margin-right: 15px;
    }


#bottomarea
{
    clear: both;
    margin-top: 10px;
    padding-top: 10px;
    text-align: center;
    /*border:3px red solid;*/
}

#bannerarea
{
    margin-top: 20px;
}

    #bannerarea ul
    {
        margin: 0;
        padding: 0;
    }

    #bannerarea li
    {
        list-style-type: none;
        display: inline;
        padding-right: 10px;
    }

    #bannerarea a
    {
        text-decoration: none;
    }

footer
{
    margin-top: 10px;
    border-top: 4px #003366 solid;
    padding-top: 5px;
    padding-bottom: 20px;
}
