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

/*header*/
header {
    display: block;
}

.header {
    position: fixed;
    top: 0;
    left: 0;
	right: 0;
    height: 100px;
    z-index: 9999;
    border-bottom: 1px #5992EB solid;
    transition: all .1s ease-out;
	width: auto;
}

body:not(.home) .header .inner {
    background: #ffffff;
	box-shadow: 0px 0px 10px rgba(32,82,169,0.2);
}

body:not(.home) .header.active .inner {
    background-color: #2f3e3f;
    
}


a,a[href="javascript:void(0);"]:hover{
	color: #333333;
	text-decoration: none;
	transition: all .4s ease-out;
	outline: none;
}

a[href="javascript:void(0);"],a[href="javascript:void(0);"]::before{
	color: inherit;
	cursor: default;
	opacity: 1;
	text-decoration: none;
	-webkit-tap-highlight-color: transparent;
}

a:focus{
	text-decoration: none!important;
}
/*アイコン*/

.header--logo a:hover:hover {
    opacity: .7
}

.header--id {
    height: 100%;
    display: grid;
	position: relative;
    grid-template-columns: min(220px,11.4583333333vw) 260px;
    grid-row-gap: 0;
    row-gap: 0;
    grid-column-gap: min(26px,1.3541666667vw);
    -moz-column-gap: min(26px,1.3541666667vw);
    column-gap: min(26px,1.3541666667vw);
    align-content: center;
    justify-content: normal;
    place-content: center normal;
    align-items: center;
    justify-items: normal;
    place-items: center normal;
    transition: all .4s ease-out;
	z-index: 99;
}


h1{
	line-height: 1.4;
	
}

.ico{
	width: 80px;
	height: 80px;
}

.SDG{
	width: 80px;
	height: 80px;
}

.header--logo a {
	display: flex;
    width: auto;
	position: relative;
	z-index: 99;
}

.header--logo:nth-child(n){
	display: flex;
}

/*==ナビゲーション全体*/
nav{
	color: #fff;
    position: relative;
	top: 26px;
	right: 210px;
	text-align: center;
	font-weight: bold;
	z-index: 99;
	display: none;
}

.gnav_sprecuruit_btn{
	right: 0;
	background: #0675F9;
	color: #fff;
	position: fixed;
	z-index: 999;
	display: none;
}

/*ハンバーガーメニュー*/	
	input[type="checkbox"]{
		opacity: 0;
		visibility: hidden;
		position: absolute;
	}
	.hamburger{
		display: block;
		width: 31px;
		height: 60px;
		position: fixed;
		display: flex;
		justify-content: center;
		align-items: center;
		cursor: pointer;
		z-index: 9999;
		left: 85%;
		top: 2em;	
	}
	.hamburger span,
	.hamburger span::before,
	.hamburger span::after{
		position: absolute;
		display: block;
		content: "";
		width: 100%;
		height: 2px;
		background-color: #6A90F5;
		transition: all 0.5s;
	}
	.hamburger span::before{
		top: -10px;
	}
	.hamburger span::after{
		bottom: -10px;
	}
	input[type="checkbox"]:checked + .hamburger span{
		background-color: transparent;
	}
	input[type="checkbox"]:checked + .hamburger span::before{
		top: 0;
		transform: rotate(45deg);
	}
	input[type="checkbox"]:checked + .hamburger span::after{
		bottom: 0;
		transform: rotate(-45deg);
	}
	.nav{
		position: fixed;
		width: 90%;
		height: 60vh;
		top: 123px;
		right: -120%;
		background-color: #2F4F7F;
		color: #f2f2f2;
		padding: 50px 0;
		transition: all 0.5s;
		z-index: 9999;
	}
    
.nav ul{
	list-style: none;
}
	.nav_item a{
		display: block;
		font-size: 20px;
		padding: 20px 0 20px 50px;
		text-transform: uppercase;
		color: #f2f2f2;
		font-weight: bold;
	}
	.nav_item a:hover{
		color: #2f4f7f;
		background-color: #f2f2f2;
	}
	input[type="checkbox"]:checked ~ .nav{
		right: 0;
	}