@charset "utf-8";
/*----------------------------------------------------------------
グローバルナビ
-----------------------------------------------------------------*/
nav{
    font-family: "ヒラギノ明朝 Pro W6","Hiragino Mincho Pro","HGS明朝E","ＭＳ Ｐ明朝",serif;
    width:20%;
    padding:10px 1% 5%;
    box-sizing:border-box;
    vertical-align:top;
    display:inline-block;
    *display: inline;   /*IE用のハック*/
    zoom: 1;            /*IE用の hasLayout を true にするための記述*/

}
nav ul#gNavi{
}

nav a.topLogo img{
    width:100%;
}
nav li{
    font-size:24px;
    padding-top:20px;
    line-height:1.3em;
    border-bottom:#481d27 1px solid;
    text-shadow:0 0 5px #f28bac;
    position:relative;
    
}

nav li .cap{
    font-size:36px;
    color:#711026;
}


nav li .naviNew{
    color:#cf1854;
    font-size:14px;
    position:absolute;
    top:-5px;

}

nav li.selected a .cap,nav li.selected a .cap:hover{
    color:#fff;
    background-color:#a33156;
}

nav li:hover{

}
nav li a{
    display:block;
}
nav li a:hover{
    text-decoration:none;
    color:#bb8999;
}
nav li a.non,nav li a.non:hover,nav li a.non .cap{
    cursor:default;
    color:#ccc;
    text-decoration:none;
    text-shadow:0 0 0px #f28bac;
}
nav li.non{
}
    #smpBtArea{
        display:none;
    }
/*----------------------------------------------------------------
max-width: 960px
-----------------------------------------------------------------*/

@media (max-width: 960px) {
    nav{
        width:100%;
        padding:10px 1%;
        display:block;
        border-bottom:#610825 3px solid;
    }
    
    a.topLogo{
        width:20%;
        margin-right:2%;
        vertical-align:top;
        display:inline-block;
        *display: inline;   /*IE用のハック*/
        zoom: 1;            /*IE用の hasLayout を true にするための記述*/

    }
    nav ul#gNavi{
        width:78%;
        vertical-align:top;
        display:inline-block;
        *display: inline;   /*IE用のハック*/
        zoom: 1;            /*IE用の hasLayout を true にするための記述*/

    }
    
    nav li{
        width:33.3%;
        box-sizing:border-box;
        font-size:18px;
        padding:10px 0 5px;
        border-bottom:#481d27 1px solid;
        vertical-align:top;
        display:inline-block;
        *display: inline;   /*IE用のハック*/
        zoom: 1;            /*IE用の hasLayout を true にするための記述*/

    }
    
    nav li .naviNew{
        top:-9px;
    
    }

    
    nav li .cap{
    font-size:24px;
    color:#711026;
}



}
/*----------------------------------------------------------------
max-width: 786px
-----------------------------------------------------------------*/

@media (max-width: 786px) {

}

/*----------------------------------------------------------------
max-width: 480px
-----------------------------------------------------------------*/


@media (max-width: 480px) {
    nav{
        padding:0;
        display:block;
    }
    a.topLogo{
        width:70%;
        margin:10px 15%;
        display:block;

    }
    nav ul#gNavi{
        width:100%;
        display:block;
    }


    nav li{
        width:50%;
        /*display:block;*/
    }
    
    nav li:nth-last-child(1){
        border-bottom:0;
    }

/*スマホボタン///////////////////////*/
    #smpBtArea{
        position:relative;
        display:block;
        width:100%;
        background:#22040e;
        
    }
    #smpBtArea a{
        display:block;
        position:relative;
        padding:12px 0 10px;
        border-bottom:1px solid #fff;
        color:#fff;
        text-align:center;
        text-decoration:none;
    }
    
    #smpBt {
        position:absolute;
        width:25px;
        height:3px;
        top:20px;
        left:20px;
        transform:translate(-50%,-50%);
        -webkit-transform:translate(-50%,-50%);
        transition:linear .5s;
        -webkit-transition:all linear .5s;
        background:#fff;
        cursor: pointer;
    }
    #smpBt::after {
        content:' ';
        position:absolute;
        width:25px;
        height:3px;
        top:300%;
        left:0;
        background:#fff;
        cursor: pointer;
    }
    #smpBt::before {
        content:' ';
        position:absolute;
        width:25px;
        height:3px;
        top:-300%;
        left:0;
        background:#fff;
        cursor: pointer;
    }
    #smpBt.action {
        position:absolute;
        width:25px;
        height:3px;
        transform:translate(-50%,-50%) rotate(45deg);
        -webkit-transform:translate(-50%,-50%) rotate(45deg);
        transition:linear .5s;
        -webkit-transition:all linear .5s;
        background:none;
        cursor: pointer;
    }
    #smpBt.action::after {
        content:' ';
        position:absolute;
        width:25px;
        height:3px;
        top:50%;
        left:50%;
        transform:translate(-50%,-50%) rotate(90deg);
        -webkit-transform:translate(-50%,-50%) rotate(90deg);
        transition:linear .5s;
        -webkit-transition:all linear .5s;
        background:#fff;
        cursor: pointer;
    }
    #smpBt.action::before {
        content:' ';
        position:absolute;
        width:25px;
        height:3px;
        top:50%;
        left:50%;
        transform:translate(-50%,-50%) rotate(180deg);
        -webkit-transform:translate(-50%,-50%) rotate(180deg);
        transition:linear .5s;
        -webkit-transition:all linear .5s;
        background:#fff;
        cursor: pointer;
    }
    
}

