@charset "utf-8";
/* CSS Document */

/*基本*/
 nav.globalMenuSp {
    position:   fixed;
    z-index:    2;
    top:        0;
    left:       0;
    background-image:  url(/);
    background-repeat: repeat;
    color:             #000;
    text-align:        center;
    transform:         translateY(-100%);
    transition:        all 0.6s;
    width:             100%;
}
nav.globalMenuSp ul {
    background-color: #13447f;
    margin:           0 auto;
    padding:          0;
    width:            100%;
}
nav.globalMenuSp ul li {
    font-size:       1.1em;
    list-style-type: none;
    padding:         0;
    width:           100%;
    height:          79px;
    border-bottom:   1px dotted;
				border-color:    rgba(255,255,255,0.3);
    display:                 -webkit-flex;
    display:                 flex;
    -webkit-align-items:     center; /* 縦方向中央揃え（Safari用） */
    align-items:             center; /* 縦方向中央揃え */
    -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
    justify-content:         center; /* 横方向中央揃え */
}

/* 最後はラインを描かない */
nav.globalMenuSp ul li:last-child {
    padding-bottom:  0;
    border-bottom:   none;
}
nav.globalMenuSp ul li a {
    display:         block;
    color:           #FFF;
    padding:         1em 0;
    text-decoration: none;
}

/* このクラスを、jQueryで付与・削除する */
nav.globalMenuSp.active {
    transform: translateY(0%);
}


.navToggle {
    /*display:    block;*/
    /*position:   fixed;*/    /* bodyに対しての絶対位置指定 */
    /*right:      13px;*/
    /*top:        12px;*/
    width:            43px;
    height:           43px;
    cursor:           pointer;
    z-index:          3;
    background-color: #13447f;
    text-align:       center;
    position:         relative;
}

/* 線の大きさ */
.navToggle span {
    display:            block;
    position:           absolute;    /* .navToggleに対して */
    width:              29px;
    border-bottom:      solid 1px #eee;
    -webkit-transition: .35s ease-in-out;
    -moz-transition:    .35s ease-in-out;
    transition:         .35s ease-in-out;
    left:               7px;
}

/* 線の位置 */
.navToggle span:nth-child(1) {
    top: 11px;
}
.navToggle span:nth-child(2) {
    top: 21px;
}
.navToggle span:nth-child(3) {
    top: 31px;
}
.navToggle span:nth-child(4) {
    border:      none;
    color:       #eee;
    font-size:   9px;
    font-weight: bold;
    top:         34px;
}       
/* 最初のspanをマイナス45度に */
.navToggle.active span:nth-child(1) {
    top: 21px;    /* Xの中心（navToggle span:nth-child(2)）と同じ値 */
    left: 7px;
    -webkit-transform: rotate(-45deg);
    -moz-transform:    rotate(-45deg);
    transform:         rotate(-45deg);
}
/* 2番目と3番目のspanを45度に */
.navToggle.active span:nth-child(2),
.navToggle.active span:nth-child(3) {
    top: 21px;
    -webkit-transform: rotate(45deg);
    -moz-transform:    rotate(45deg);
    transform:         rotate(45deg);
}