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

/*
menu
------------------------------------------------------------------------------------*/

.menu{
    height: 25px;
    position:fixed;
    right: 20px;
    top: 20px;
    width: 35px;
    z-index: 99;
	cursor:pointer;
	display:none;
}
.menu__line{
    background: #c7c7c7;
    display: block;
    height: 2px;
    position: absolute;
    transition:transform .3s;
    width: 100%;
}
.menu__line--center{
    top: 11px;
}
.menu__line--bottom{
    bottom: 0;
}
.menu__line--top.active{
    top: 8px;
    transform: rotate(45deg);
	background:#fff;
}
.menu__line--center.active{
    transform:scaleX(0);
	background:#fff;
}
.menu__line--bottom.active{
    bottom: 15px;
    transform: rotate(135deg);
	background:#fff;
}
@media only screen and (max-width: 730px) { 
.menu{
	display:block;
}
}


/*gnav*/
.gnav{
    background: rgba(0,0,0,0.8);
    display: none;
    height: 100%;
    position: fixed;
    width: 100%;
    z-index: 98;
	top:0;
}
.gnav__wrap{
    align-items:center;
    display: flex;
	flex-wrap:wrap;
   /*  height: 40vh; */
    position: absolute;
    width: 100%;
    top: 50%;
	padding:5% 0;
    transform: translateY(-50%);
}
.gnav__menu{
    width:90%;
	margin:0 auto;
	text-align:center;
	display:block;
}
.gnav__menu__item{
    margin: 40px 0 40px 100px;
    opacity: 0;
	letter-spacing:6px;
}
.gnav__menu__item a{
	color: #fff;
    font-size: 20px;
    font-weight: bold;
	text-decoration: none;
    transition: .5s;
}
.gnav__menu__item a:hover{
    color: #999;
}

.gnav ol{
	width:90%;
	margin:auto;
	display:block;
	text-align:center;
}
.gnav ol li{
	display:inline-block;
	margin:0 10px;
	color:#fff;
    font-size: 12px;
}

.gnav ol .gnav__menu__item{
	margin:0 0 20px 0;
}

.gnav ol .gnav__menu__item a{
	color: #fff;
    font-size: 12px;
    font-weight:normal;
	margin:0 10px;
}

.gnav ol .gnav__menu__item a:hover{
	color:#999;
}

.gnav ol:last-child li{
	margin-top:30px;
}

.gnav ol:last-child li a{
	font-size:30px;
}



/*
サブページ ヘッダー
------------------------------------------------------------------------------------*/

#header{
	width:100%;
	text-align:center;
	position:relative;
	margin-top:5px;
	height:55px;
	z-index:99;
}

#header #logo{
	text-align:left;
	display:inline-block;
	position:absolute;
	left:3%;
	top:5px;
}

#header #logo img{
	max-width:180px;
}

#header ul{
	position:absolute;
	right:5%;
	padding-top:15px;
}

#header li{
	display:inline-block;
	margin:0 30px;
	font-size:16px;
}

#header li a{
	color:#4F403D;
}

#header li a:hover{
	text-decoration:none;
}

@media only screen and (max-width: 730px) { 
#header ul{
	display:none;
}
}



/*
フッター
------------------------------------------------------------------------------------*/

footer{
	text-align:center;
}


footer #contact{
	background:#979797;
	padding:100px 0;
}


footer #contact p{
	width:90%;
	max-width:350px;
	margin:auto;
	border:1px solid #fff;
	font-weight:bold;
	font-size:25px;
}

footer #contact p a{
	display:block;
	padding:20px 0;
	color:#fff;
}

footer #contact p a:hover{
	background:#8a8a8a;
}

footer #footer{
	background:#333;
	padding:80px 0 30px;
}

footer #footer #f_navi{
	max-width:1000px;
	margin:auto;
}

footer #footer dl{
	width:14%;
	display:inline-block;
	vertical-align:top;
	color:#fff;
	margin:0 0 50px 2%;
	text-align:left;
	font-size:14px;
}

footer #footer dl a{
	color:#fff;
}

footer #footer dt{
	font-weight:bold;
}

footer #footer dd{
	font-size:13px;
	margin-top:8px;
}

footer #footer dd:before{
	content:"－";
	margin-right:5px;
}

footer ol{
	margin-top:50px;
}

footer ol li{
	display:inline-block;
	font-size:30px;
	margin:0 10px;
}

footer ol li a{
	color:#fff;
}



footer #copyright{
	color:#858585;
	margin:25px auto 10px;
	font-size:13px;
	letter-spacing:1px;
	text-align:center;
}


@media only screen and (max-width: 930px) { 
footer #footer{
	text-align:left;
}

footer #footer #f_navi{
	width:92%;
}

footer #footer dl{
	width:30%;
	margin:0 0 50px 2%;
}
footer ol{
	text-align:center;
}

}


@media only screen and (max-width: 540px) { 
footer #footer dl{
	width:45%;
	margin:0 auto 50px 4%;
}
}