@charset "utf-8";


/*　メニュー：共通　*/
@keyframes fade-in1 {
	from {
		opacity: 0.75;
	}
	to {
		opacity: 1;
	}
}


/*　メニュー：ボタン　*/
header button {
	width: 55px;
	height: 65px;
	text-decoration: none;
	border-radius: 5px;
	padding: 10px 0 0 0;
	background: none;
	border: none;
position: fixed;
top: 10px;
right: 10px;
z-index: 200;
cursor: pointer;
}

header .trigger-box {
	width: 25px;
	display: inline-block;
position: relative;
pointer-events: none;
vertical-align: super;
}

header .text {
	display: block;
	color: #424242;
	margin: 10px auto 0 auto;
}

header .menu-inner {
	display: block;
	width: 25px;
	height: 3px;
	background-color: #424242;
	border-radius: 4px;
position: absolute;
}

header .menu-inner::before,
header .menu-inner::after {
	content: "";
	display: block;
	width: 25px;
	height: 3px;
	background-color: #424242;
	border-radius: 4px;
position: absolute;
}

header .menu-inner::before {
top: 10px;
}

header .menu-inner::after {
bottom: 10px;
}

header .btn:hover {
	background: #FFFFFF;
transition: 1s;
}

header .btn.open {
animation-name: fade-in1;
animation-duration: 1s;
}

header .btn.open:hover {
	background: none;
}

header .open .menu-inner {
transform: rotate(45deg);
}

header .open .menu-inner:before {
top: 0;
opacity: 0;
}

header .open .menu-inner:after {
bottom: 0;
transform: rotate(-90deg);
}


/*　メニュー：ウィンドウ　*/
header .nav-common {
	display: none;
}

header .nav-common.open {
box-shadow: 0 10px 25px 0 rgb(0 0 0 / 50%);
}

header .nav-common.open {
	display: block;
/*	max-width: 335px;*/
	margin: 0 auto 0 auto;
	padding: 10px 10px 20px 10px;
/*	background: rgba(13,71,161,0.25);*/
	background: url(../images/bg_illust01.png) #FFFFFF;
	background-image:
		-webkit-image-set(
		url(../images/bg_illust01.png) 1x,
		url(../images/bg_illust01@1.5x.png) 1.5x,
		url(../images/bg_illust01@2x.png) 2x
		);
	background-repeat: no-repeat;
/*	background-position: center bottom;*/
	background-position: bottom;
	background-size: cover;
/*	background-attachment: fixed;*/
position: fixed;
top: 10px;
right: 10px;
z-index: 100;
border-radius: 5px;
animation-name: fade-in1;
animation-duration: 1s;
}

header .nav-common.open .scroll {
	margin: 20px 0 10px 0;
}


/*　タイトル　*/
.nav-common.open .title {
	margin-left: initial;
}

.nav-common.open .title a {
/*	font-size: 1.1rem;
	padding: 10px 10px 10px 10px;*/
}


/*　ロゴ　*/
header .nav-common .logo {
display: flex;
justify-content: center;
}

header .nav-common .logo {
/*	margin: auto;*/
}

header .logo img {
	width: 50%;
	height: auto;
}

.nav-common .description {
	font-size: 2vw;
	text-align: center;
	margin-left: initial;
	margin-top: 5px;
}

#secondary .logo {
/*	display: none;*/
}


/*　フォント　*/
.nav-common.open h2 {
	font-size: 0.9em !important;
	padding: 0.5rem 1rem 0.5rem 1rem;
}


@media screen and (min-width:1281px) {

header .logo img {
	width: 50%;
}

}


@media screen and (max-width:1000px) {

header .nav-common.open {
/*	max-width: initial;*/
left: 10px;
bottom: 20px;
display: flex;
flex-direction: column;
justify-content: space-between;
}

.nav-common.open .title {
	padding: 5px 10px 5px 10px;
}

header .nav-common .logo {
justify-content: initial;
}

.nav-common .description {
/*	font-size: 0.6rem;*/
	text-align: inherit;
	margin-top: initial;
	padding: 5px 10px 5px 10px;
}

header .nav-common.open .scroll {
	height: 400px;
overflow-y: scroll;
flex-grow: 1;
}

header #searchform {
	margin: 0;
}

}


@media screen and (max-width:767px) {

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

}


@media screen and (max-width:600px) {

header .btn {
/*	background: #FFFFFF;*/
}
.nav-common .logo {
/*	margin: 20px 0 0 0;*/
}

}


@media screen and (max-width:414px) {
}


@media screen and (max-width:360px) {
}
