/* CSS Document */

@media print {
	#spHeaderbar,
	.hamburger,
	nav.globalMenu {
		display: none !important;
	}
}

@media screen and (min-width:992px){
    #spHeaderbar{
        display: none;
    }
}
@media screen and (max-width:991px){
    #spHeaderbar{
        position: absolute;
        top:  0;
        left: 0;
        width: 100%;
        height: 60px;
        background: -webkit-linear-gradient(135deg, #006699, #0e3f72);
        background: -o-linear-gradient(135deg, #006699, #0e3f72);
        background: linear-gradient(135deg, #006699, #0e3f72);
        text-align: left;
        padding-left: 20px;
    }
}



@media screen and (min-width:992px){
	
    nav.globalMenu #logo{
        width:250px;
    }
    nav.globalMenu .gmenu{
        flex:1;
    }
    
    nav.globalMenu{
        
    background: -webkit-linear-gradient(135deg, #006699, #0e3f72);
    background: -o-linear-gradient(135deg, #006699, #0e3f72);
    background: linear-gradient(135deg, #006699, #0e3f72);
        box-shadow: 0 0 10px 10px rgba(51,102,102,0.2);
        
        
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        max-width: 1200px;
        height:65px;
        background-color: #0b477a;
        margin:auto;
    }
	nav.globalMenu ul{
		margin-left:auto;
		margin-right:auto;
		max-width: 1200px;
		padding-left: 0;
		display: flex;
		flex-wrap: wrap;
		justify-content:space-around;
	}
	nav.globalMenu ul li{
		list-style: none;
	}
	nav.globalMenu ul li a{
		display: block;
		color:white;
		line-height: 66px;
		letter-spacing: 0.15em;
	}
	nav.globalMenu li:nth-child(1){
		margin-left:20px;
	}
	
	nav.footerMenu{
		background-color: #0e3f72;
		height:50px;
	}
	nav.footerMenu ul{
		margin-left:auto;
		margin-right:auto;
		max-width: 1200px;
		padding-left: 0;
		display: flex;
		flex-wrap: wrap;
		justify-content:space-around;
	}
	nav.footerMenu li{
		list-style: none;
	}
	nav.footerMenu li a{
		display: block;
		color:white;
		line-height: 50px;
		letter-spacing: 0.15em;
	}
	nav.footerMenu li:nth-child(1){
		margin-left:20px;
	}
	
}
@media screen and (max-width:991px){
	
	nav.footerMenu{
		display: none;
	}
	
	/*　ハンバーガーボタン　*/
	.hamburger {
	  display : block;
	  position: fixed;
	  z-index : 3;
	  right : 13px;
	  top   : 12px;
	  width : 42px;
	  height: 42px;
	  cursor: pointer;
	  text-align: center;
	}
	.hamburger span {
	  display : block;
	  position: absolute;
	  width   : 30px;
	  height  : 2px ;
	  left    : 6px;
	  background : #fff;
	  -webkit-transition: 0.3s ease-in-out;
	  -moz-transition   : 0.3s ease-in-out;
	  transition        : 0.3s ease-in-out;
	}
	.hamburger span:nth-child(1) {
	  top: 10px;
	}
	.hamburger span:nth-child(2) {
	  top: 20px;
	}
	.hamburger span:nth-child(3) {
	  top: 30px;
	}

	/* ナビ開いてる時のボタン */
	.hamburger.active span:nth-child(1) {
	  top : 16px;
	  left: 6px;
	  background :#fff;
	  -webkit-transform: rotate(-45deg);
	  -moz-transform   : rotate(-45deg);
	  transform        : rotate(-45deg);
	}

	.hamburger.active span:nth-child(2),
	.hamburger.active span:nth-child(3) {
	  top: 16px;
	  background :#fff;
	  -webkit-transform: rotate(45deg);
	  -moz-transform   : rotate(45deg);
	  transform        : rotate(45deg);
	}

	nav.globalMenu {
		display: none;
	  position: fixed;
	  z-index : 2;
	  top  : 0;
	  left : 0;
	  color: #fff;
	  background: rgba(0,0,0,0.7);
	  text-align: center;
	  width: 100%;
	  opacity: 0;
	  transition: opacity .6s ease, visibility .6s ease;
	}

	nav.globalMenu ul {
	  margin: 0 auto;
	  padding: 0;
	  width: 100%;
	}

	nav.globalMenu ul li {
	  list-style-type: none;
	  padding: 0;
	  width: 100%;
	  transition: .4s all;
	}
	nav.globalMenu ul li:last-child {
	  padding-bottom: 0;
	}
	nav.globalMenu ul li:hover{
	  background :#ddd;
	}

	nav.globalMenu ul li a {
	  display: block;
	  color: #fff;
	  padding: 1em 0;
	  text-decoration :none;
	}

	/* このクラスを、jQueryで付与・削除する */
	nav.globalMenu.active {
		display: block;
	  opacity: 100;

	}
}