@charset "utf-8";
/*-----------------------------------------------
毎月変更要素
-----------------------------------------------*/
/* グローバルメニューPC/SP配色 */  
#header .gnav ul {
	border-top: 2px solid #ba78d1;
}
#header .gnav ul li:hover a::before {
	background-color: #ba78d1;
}
#header .gnav ul li:hover a::after {
	background-color: #ba78d1;
}
#header .gnav ul li.current a::before {
	background-color: #ba78d1;
}
#header .gnav ul li.current a::after {
	background-color: #ba78d1;
}
#header .gnav ul li:nth-child(7) .detail {
	background-color: #ba78d1;
}
@media screen and (max-width:767px) and (min-width: 1px){
#header .gnav-sp .nav-con {
    background-color: #ba78d1;
}
}
/*-----------------------------------------------
 グローバルメニュー
-----------------------------------------------*/
div.fixed{
	position: fixed;
}
#header div.fixed{
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 50;
	border-top: none;
}

div#header div.logo img{
	width: 144px;
}

#header div.menu-open{
	display: none;
}
#header .gnav {
	border-top: 1px solid #000;
	padding-bottom: 5px;
	background: url("../img/bg-gnav.png") repeat-x bottom center #fff;
	margin-bottom: 15px;
}
#header .gnav ul {
	font-size: 0;
	text-align: center;
	/*border-top: 2px solid #ffae00;*/
	border-bottom: 1px solid #000;
}
#header .gnav ul li {
	position: relative;
	display: inline-block;
	width: 80px;
	margin: 0 15px;
	text-align: center;
}
#header .gnav ul li:hover {
	background: url("../img/gnav-hover.png") no-repeat top center;
}
#header .gnav ul li:hover a::before {
	content: "";
	/*background-color: #ffae00;*/
	display: block;
	position: absolute;
	top: 0;
	left: 3px;
	width: 76px;
	height: 2px;
	transform: skewX(-45deg);
	border-radius: 4px;
}
#header .gnav ul li:hover a::after {
	content: "";
	/*background-color: #ffae00;*/
	display: block;
	position: absolute;
	top: 0;
	right: 3px;
	width: 76px;
	height: 2px;
	transform: skewX(45deg);
	border-radius: 4px;
}
#header .gnav ul li.new-nav::after {
	content: "";
	background: url("../img/gnav-icon.png") no-repeat top center;
	display: block;
	position: absolute;
	top: 38px;
	left: 26px;
	width: 24px;
	height: 24px;
	z-index: 5;
}
#header .gnav ul li.new-nav:hover::after {
	transform: none;
}
#header .gnav ul li.current {
	background: url("../img/gnav-hover.png") no-repeat top center;
}
#header .gnav ul li.current a::before {
	content: "";
	/*background-color: #ffae00;*/
	display: block;
	position: absolute;
	top: 0;
	left: 3px;
	width: 76px;
	height: 2px;
	transform: skewX(-45deg);
	border-radius: 4px;
}
#header .gnav ul li.current a::after {
	content: "";
	/*background-color: #ffae00;*/
	display: block;
	position: absolute;
	top: 0;
	right: 3px;
	width: 76px;
	height: 2px;
	transform: skewX(45deg);
	border-radius: 4px;
}
#header .gnav ul li.current.new-nav:hover::after {
	transform: none;
}
#header .gnav ul li:nth-child(7) .detail {
	position: absolute;
	opacity: 0;
	visibility: hidden;
	display: flex;
	top: 60px;
	right: -165px;
	width: 936px;
	/*background-color: #ffae00;*/
	z-index: 50;
	padding: 16px 12px 20px;
	transition: all 0.5s ease;
}
#header .gnav ul li:nth-child(7):hover .detail {
	opacity: 1;
	top: 69px;
	visibility: visible;
}
#header .gnav ul li:nth-child(7) .detail::after {
	content:"";
	background: url("../img/gnav-after.png") top center no-repeat;
	display: block;
	position: absolute;
	top: -30px;
	right: 202px;
	width: 61px;
	height: 61px;
	z-index: -1;
}
#header .gnav ul li:nth-child(7) .detail ul {
	border: none;
}
#header .gnav ul li:nth-child(7) .detail .post {
	position: relative;
	width: 446px;
	font-size: 0;
	border-right: 1px dotted #fff;
}
#header .gnav ul li:nth-child(7) .detail .post p {
	position: absolute;
	top: 0;
	left: 0;
	width: 95px;
}
#header .gnav ul li:nth-child(7) .detail ul {
	display: inline-block;
	width: 240px;
	margin-right: 10px;
}
#header .gnav ul li:nth-child(7) .detail ul li{
	width: 240px;
	margin: 0 0 10px;
}
#header .gnav ul li:nth-child(7) .detail ul li:last-child {
	margin-bottom: 0;
}
#header .gnav ul li:nth-child(7) .detail ul li img {
	width: 100%;
}
#header .gnav ul li:nth-child(7) .detail ul li:hover {
	background: none;
}
#header .gnav ul li:nth-child(7):hover .detail ul li a::before,
#header .gnav ul li:nth-child(7):hover .detail ul li a::after {
	display: none;
}
#header .gnav ul li:nth-child(7) .detail .post .btn03 {
	display: inline-block;
	margin-right: 10px;
}
#header .gnav ul li:nth-child(7) .detail .read {
	width: 240px;
	padding: 0 10px;
	border-right: 1px dotted #fff;
}
#header .gnav ul li:nth-child(7) .detail .read p {
	margin-bottom: 14px;
	text-align: left;
}
#header .gnav ul li:nth-child(7) .detail .other {
	margin-left: 12px;
	padding-top: 30px;
}
#header .gnav ul li:nth-child(7) .detail .other p {
	font-size: 14px;
	margin-bottom: 10px;
	line-height: 1;
	text-align: left;
}
#header .gnav ul li:nth-child(7) .detail .other p a {
	color: #fff;
}
#header .gnav-sp .nav-con {
	display: none;
}
@media screen and (max-width:767px) and (min-width: 1px){
	div#header div.logo {
		padding: 12px 10px 0;
		margin-bottom: 10px;
	}
	div#header div.logo img {
		width: 110px;
	}
	#header .gnav-sp img {
		width: 100%;
	}
	#header .gnav {
		display: none;
	}
	.no-scroll {
		position: fixed;
		width: 100%;
	}
	#header #menu-con02 .gnav-sp,
	#header #menu-con03 .gnav-sp {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 50;
	}
	#header div.menu-open{
		display: block;
		position: fixed;
		width: 11%;
		height: 10.6vw;
		top: 0px;
		right: 20px;
		cursor: pointer;
		background-image: url(../img/gnav-sp/btn-open.png);
		background-size: cover;
		background-repeat: no-repeat;
		z-index: 30;
	}
	#header div.menu-open.active{
		display: block;
		position: fixed;
		width: 11%;
		height: 10.6vw;
		top: 8px;
		right: 20px;
		cursor: pointer;
		background-image: url("../img/gnav-sp/btn-close.png");
		background-size: cover;
		background-repeat: no-repeat;
		z-index: 30;
	}
	#header .gnav-sp .nav-con {
		display: none;
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		width: 92.5%;
		padding: 6% 3.8% 10%;
		text-align: center;
		overflow-y: scroll;
		z-index: 20;
		border-top: 2px solid rgb(0, 0, 0);
       /* background-color: #ffae00;*/
	}
	#header .gnav-sp .nav-con h2 {
		margin: 0 auto 3%;
	}
	#header .gnav-sp .nav-con ul {
		font-size: 0;
		margin-bottom: 3%;
	}
	#header .gnav-sp .nav-con ul li {
		position: relative;
		display: inline-block;
		width: 49.2%;
		margin-bottom: 2%;
		background-color: #fff;
		border: 1px solid #000;
		box-sizing: border-box;
	}
	#header .gnav-sp .nav-con ul li.new-nav::before {
		content: "";
		background: url("../img/gnav-sp/gnav-icon.png") no-repeat top center;
		background-size: contain;
		display: block;
		position: absolute;
		top: -20%;
		left: 5%;
		width: 13.8%;
		height: 48%;
	}
	#header .gnav-sp .nav-con .list01 li:nth-child(3).new-nav::before,
	#header .gnav-sp .nav-con .list02 li:nth-child(1).new-nav::before,
	#header .gnav-sp .nav-con .list03 li:nth-child(3).new-nav::before{
		width: 6.8%;
		left: 2.3%;
	}
	#header .gnav-sp .nav-con .list03 li:nth-child(4).new-nav::before {
		display: none;
	}
	#header .gnav-sp .nav-con ul li.new-nav .acc-btn::before {
		content: "";
		background: url("../img/gnav-sp/gnav-icon.png") no-repeat top center;
		background-size: contain;
		display: block;
		position: absolute;
		top: -20%;
		left: 2.3%;
		width: 6.8%;
		height: 48%;
	}
	#header .gnav-sp .nav-con .list01 li:nth-child(1),
	#header .gnav-sp .nav-con .list02 li:nth-child(2),
	#header .gnav-sp .nav-con .list03 li:nth-child(1),
	#header .gnav-sp .nav-con .list04 li:nth-child(1),
	#header .gnav-sp .nav-con .list04 li:nth-child(2) {
		margin-right: 1.5%;
	} 
	#header .gnav-sp .nav-con .list01 li:nth-child(3) {
		width: 100%;
		margin-right: 0;
	}
	#header .gnav-sp .nav-con .list02 li:nth-child(1) {
		width: 100%;
		margin-right: 0;
	}
	#header .gnav-sp .nav-con .list03 li:nth-child(3),
	#header .gnav-sp .nav-con .list03 li:nth-child(4) {
		width: 100%;
		margin-right: 0;
	}
	#header .gnav-sp .nav-con .list03 li:nth-child(4) .acc-btn {
		position: relative;
		cursor: pointer;
	}
	#header .gnav-sp .nav-con .list03 li:nth-child(4) .acc-btn::after {
		content: "";
		background: url("../img/gnav-sp/gnav-contribute-off.png") no-repeat top center;
		background-size: contain;
		display: block;
		position: absolute;
		top: 27.5%;
		right: 6%;
		width: 6.5%;
		height: 43.5%;
	}
	#header .gnav-sp .nav-con .list03 li:nth-child(4) .acc-btn.active::after {
		content: "";
		background: url("../img/gnav-sp/gnav-contribute-on.png") no-repeat top center;
		background-size: contain;
		display: block;
		position: absolute;
		top: 27.5%;
		right: 6%;
		width: 6.5%;
		height: 43.5%;
	}
	#header .gnav-sp .nav-con .list03 li:nth-child(4) ul {
		padding-top: 2.5%;
		display: none;
	}
	#header .gnav-sp .nav-con .list03 li:nth-child(4) ul li {
		display: block;
		width: 100%;
		padding: 1.5% 0;
		border: none;
	}
	#header .gnav-sp .nav-con .list04 li {
		padding: 0 6.5%;
		border: none;
	}
	#header .gnav-sp .nav-con .list04 li:nth-child(1) {
		width: 22.8%;
	}
	#header .gnav-sp .nav-con .list04 li:nth-child(2) {
		width: 43.4%;
	}
	#header .gnav-sp .nav-con .list04 li:nth-child(3) {
		width: 27.2%;
	}
	#header .gnav-sp .nav-con .sns-con li {
		width: 11.8%;
		margin: 0 4%;
		margin-bottom: 6%;
		background: transparent;
		border: none;
	}
	#header .gnav-sp .nav-con .sns-con li img {
		width: 100%;
	}
	
	#header .gnav-sp .nav-con .list01 li:nth-child(1) img {width: 49.8%;}
	#header .gnav-sp .nav-con .list01 li:nth-child(2) img {width: 39.2%;}
	#header .gnav-sp .nav-con .list01 li:nth-child(3) img {width: 29.2%;}
	#header .gnav-sp .nav-con .list02 li:nth-child(1) img {width: 19.7%;}
	#header .gnav-sp .nav-con .list02 li:nth-child(2) img {width: 54%;}
	#header .gnav-sp .nav-con .list02 li:nth-child(3) img {width: 70.2%;}
	#header .gnav-sp .nav-con .list03 li:nth-child(1) img {width: 62%;}
	#header .gnav-sp .nav-con .list03 li:nth-child(2) img {width: 87.5%;}
	#header .gnav-sp .nav-con .list03 li:nth-child(3) img {width: 50%;}
	#header .gnav-sp .nav-con .list03 li:nth-child(4) img {width: 31.8%;}
	#header .gnav-sp .nav-con .list04 li:nth-child(1) img,
	#header .gnav-sp .nav-con .list04 li:nth-child(2) img,
	#header .gnav-sp .nav-con .list04 li:nth-child(3) img {width: 100%;}
	#header .gnav-sp .nav-con .list03 li:nth-child(4) ul li:nth-child(1) img {width: 51%;}
	#header .gnav-sp .nav-con .list03 li:nth-child(4) ul li:nth-child(2) img {width: 49.2%;}
	#header .gnav-sp .nav-con .list03 li:nth-child(4) ul li:nth-child(3) img {width: 39.7%;}
	#header .gnav-sp .nav-con .list03 li:nth-child(4) ul li:nth-child(4) img {width: 45.8%;}
	#header .gnav-sp .nav-con .top {
		width: 18.6%;
		margin: 0 auto;
	}
	.opa{
		opacity:0;
	}
	
	#header ul.gnav-sp.open{
		top: 0;
	}
	
}