@charset@charset"utf-8";
/*--TOPMENU---------------------------------------------------------------*/
nav#mainNav
{
    /*padding: 0 15px;*/
    clear: both;
    overflow: hidden;
    position: relative;
    background: url(../img/topnavBg.png);
    border-radius: 0 0 6px 6px;
    box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
    border: solid 1px #bbbbbb;
}

.ie8 nav#mainNav {
	border: solid 1px #ccc;
	-ms-box-shadow: 0 0 5px #555;
    filter: 
    progid:DXImageTransform.Microsoft.Shadow(color=#dddddd, direction=90, strength=1, enabled=true), progid:DXImageTransform.Microsoft.Shadow(color=#dddddd, direction=180, strength=2, enabled=true), progid:DXImageTransform.Microsoft.Shadow(color=#dddddd, direction=270, strength=1, enabled=true);
	margin-left: -1px;
	margin-right: -1px
}

nav#mainNav ul 
{
    width: 100%;
	clear:both;
	overflow:hidden
}

nav#mainNav ul li
{
    float: left;
    position: relative;
    vertical-align: middle;
}

/*nav#mainNav li.last
{
    border-right: 1px solid #ebebeb;
}
*/
nav#mainNav ul li a
{
    display: block;
    text-align: center;
    float: left;
    width: 100%;
	height: 40px;
	padding: 0.8em 0;
    vertical-align: middle;
    color: #374752;
    background-image: url(../img/topnavSep.png);
    line-height: 1.3em;
    /*-webkit-transition: all .3s;
    transition: all .3s;*/
    color: #006699;
    text-shadow: -1px -1px 0 rgba(255, 255, 255, 0.8);
   	border-left: #ABABAB solid 1px;
   	 cursor:pointer;
   	 background-position:left top

}

nav#mainNav ul li a:hover   	 
{
    background-position:left bottom
}

nav#mainNav ul li:first-child a 
{
    border-left: none;
}

nav#mainNav ul li a span
{
    display: block;
    font-size: 10px;
    font-size: 0.8em;
}

nav#mainNav ul li a span:first-child
{
    font-size: 14px;
    font-size: 1em;
}

nav div.panel
{
    display: block;
    float: left;
}

a#menu
{
    display: none;
}

nav#mainNav li.active a, nav#mainNav li a:hover
{
    color: #fff;
    background-position: 0 -60px;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
}

.ie8 nav div.panel
{
    display: block !important;
}

#menu
{
    float: none;
    height: auto;
    margin-left: auto;
    margin-top: 0px;
    clear: none;
    width: auto;
    min-height: 10px;
    margin-right: auto;
}

#menu input
{
    background: url('../img/bg_title.jpg') repeat-x 0 0 #67b6f2;
    border: 0;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    border-left: #b7ddfb solid 1px;
}

#menu input:first-child
{
    -webkit-border-radius: 0px 0 0 8px;
    -moz-border-radius: 0px 0 0 8px;
    border-radius: 0px 0 0 8px;
    border-left: none;
}

#menu input#input4
{
    -webkit-border-radius: 0px 0 8px 0;
    -moz-border-radius: 0px 0 8px 0;
    border-radius: 0px 0 8px 0;
}
/*---------------------------------------------------------------------------------------*/
/* 960px以下のＰＣ用の記述のみ */
/*---------------------------------------------------------------------------------------*/
@media screen and (max-width: 959px)
{
    nav#mainNav
    {
        padding: 0 0px;
    }
    nav#mainNav ul li a
    {
        width: 149px;
        line-height: 1.3em;
    }
    nav#mainNav ul li a span, nav#mainNav ul li a strong
    {
        display: block;
    }
    nav#mainNav ul li a span
    {
        font-size: 10px;
        font-size: 0.8em;
    }
}
/*---------------------------------------------------------------------------------------*/
/*メニューの表示維持用*/
/*---------------------------------------------------------------------------------------*/
@media screen and (min-width:768px)
{
    nav div.panel
    {
        display: block !important;
        float: left;
    }
}
/*---------------------------------------------------------------------------------------*/
/* 767px以下用（タブレット／スマートフォン用）の記述のみ */
/*---------------------------------------------------------------------------------------*/
@media screen and (max-width: 767px)
{
    nav#mainNav
    {
        clear: both;
        width: 100%;
        margin: 0 auto;
        padding: 0;
        background: -webkit-gradient(linear, left top, left bottom, color-stop(1, #f5f5f5), color-stop(0.5, #f0f0f0), color-stop(0.00, #f7f7f7));
        background: -webkit-linear-gradient(top, #f7f7f7 0%, #f0f0f0 50%, #f5f5f5 100%);
        background: -moz-linear-gradient(top, #f7f7f7 0%, #f0f0f0 50%, #f5f5f5 100%);
        background: -o-linear-gradient(top, #f7f7f7 0%, #f0f0f0 50%, #f5f5f5 100%);
        background: -ms-linear-gradient(top, #f7f7f7 0%, #f0f0f0 50%, #f5f5f5 100%);
        background: linear-gradient(top, #f7f7f7 0%, #f0f0f0 50%, #f5f5f5 100%);
        border: 1px solid #e4e4e4;
        background: none #f2f2f2;
    }
    
    nav#mainNav a.menu
    {
        width: 100%;
        display: block;
        height: 40px;
        line-height: 40px;
        font-weight: bold;
        text-align: left;
    }
    
    nav#mainNav a#menu span
    {
        padding-left: 10px;
    }
    
    nav#mainNav > a span:before
    {
        content: "→ ";
    }
    
    nav#mainNav a.menuOpen span:before
    {
        content: "↓ ";
    }
    
    nav#mainNav a#menu:hover
    {
        cursor: pointer;
    }
    
    nav .panel
    {
        display: none;
        width: 100%;
        position: relative;
        right: 0;
        top: 0;
        z-index: 1;
    }
    
    nav#mainNav ul li
    {
        float: none;
        clear: both;
        width: 100%;
        height: auto;
        line-height: 1.4em;
        background: none #f2f2f2;
    }
    
    nav#mainNav ul li a, nav#mainNav ul li.current-menu-item li a
    {
        display: block;
        padding: 15px 10px;
        text-align: left;
        border-bottom: 1px dashed #ABABAB;
        width: auto;
        float: none;
        background: none #f2f2f2;
        color: #006699;
        border-left:none
    }
    nav#mainNav ul li a:hover
    {
        background: none #eee;
        padding: 15px 10px;
        color: #00A0E9;
        text-shadow: 0px -1px 0px #f2f2f2;
    }
    
    nav#mainNav ul li a span
    {
        padding-left: 10px;
        display: inline-block;
        color: inherit;
    }
    
    nav#mainNav ul li a span:hover
    {
        color: #00A0E9;
    }
    
    nav#mainNav ul li a span, nav#mainNav ul li a strong
    {
        display: inline-block;
    }
    
    nav#mainNav ul li:first-child a
    {
        border-top: 1px solid #ddd;
    }
    
    nav#mainNav ul li:last-child a
    {
        border: 0;
    }
    
    nav#mainNav ul li.active a
    {
        color: #006699;
    }
}