/*==============================
        header
==============================*/
@charset "utf-8";

#header{
	.header {
		background-color:#FFFFFF;
		box-shadow:0 1px 6px rgba(0,0,0,.1);
		.header_inner {
			width: calc(100% - 60px);
			height:50px;
			max-width:1200px;
			margin:0 auto;
			display: grid;
			grid-template-columns: repeat(2,auto);
			justify-content:space-between;
			align-items:center;
			h1 {
				font-size:1.8rem;
				font-weight:500;
				letter-spacing:.1em;
			}
			a {
				font-weight:500;
				line-height:1;
				display: grid;
				grid-template-columns:repeat(2,auto);
				align-items: center;
				justify-content: center;
				grid-column-gap:.5em;
				&::before {
					content:'';
					width:1em;
					height:1em;
					background:url(../img/icon_logout.svg) no-repeat center center/contain;
				}
			}
		}
		.menu-gmenu-container {
			box-shadow:0 -2px 6px rgba(0,0,0,.1);
			background: #000000;
			background: linear-gradient(0deg,rgba(0, 0, 0, .05) 0%, rgba(0,0,0,0) 25%);
			.menu {
				width: calc(100% - 60px);
				max-width:1200px;
				margin:0 auto;
				display:flex;
				justify-content:center;
				align-items:center;
				li {
					flex-grow:1;
					text-align:center;
					a {
						display:inline-grid;
						font-size:1.6rem;
						height:2.4em;
						grid-template-columns:repeat(2,auto);
						align-items: center;
						justify-content: center;
						grid-column-gap:.5em;
						&::before {
							content:'';
							width:.8em;
							height:.8em;
							background:url(../img/icon_arrow.svg) no-repeat center center/contain;
						}
					}
				}
			}
		}
	}
}