/* コンテンツ
------------------------------------------------------------*/

#content{
	position:absolute;
	width: 100%;
	height: auto !important;
	min-height: 100%;
}

#main{
	width:100%;
	height:auto;
}

#cal{
	z-index:2;
}

#indexVideo{
	width: 100%;
	height: 100%;
	z-index: 9996;
	margin-bottom:-10px;
}

.initialDisplaynone{
	display: none;
}

/* ヘッダー
------------------------------------------------------------*/
#mainnav a{
	color: #fff;
	font-family: 'Modern Antiqua', 'Noto Sans JP',serif;
}

header{
	height:100px;
	}


	footer {
	background-color:#F3F2F0;
}
#footerNav li {
		padding: 10px;
	}

@media screen and (min-width: 768px) {
	.pc_none {
		display:none;
	}
	footer {
	 height: 90px;
	}
	#footerNav {
	width: 980px;
    margin: 0 auto;
	padding-top: 30px;
	}
	#footerNav li {
		 padding: 10px 5px 10px 5px;
	}
	
	.mainmenu {
	width:100%;
}
	.mainmenu ul li {
    float: left;
    list-style: none;
	width:23%;
	margin:20px 3px;
}
.switch.push {
	top:20%;
}
.copyright {
	padding-top: 10px;
}
}
@media screen and (max-width: 767px) {
	.sp_none {
		display:none;
	}
	footer {
		text-align:center;
	}
.switch.push::before {
	content: url(/assets/images/top/waza-push.png);
}
.switch.push {
	top:16%;
}
}

	footer ul li{
		display: inline;
	}

	footer ul li a{
		text-decoration: none;
	}

/* 共通
------------------------------------------------------------*/
img{
	max-width: 100%;
	height: auto;
}

.text-right a{
	color: #222;
}

.husuma {
	width: 100%;
	height: 100%;
}

.husuma::before,
.husuma::after {
	content: '';
	position: fixed;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(/assets/images/top/gateopen.jpg) top center no-repeat;
	background-size: cover;
	-webkit-transition: all 5s;
	transition: all 5s;
	z-index: 9996;
}

.husuma::before {
	left: 0;
	clip: rect(0px 50vw 100vh 0px);
}

.husuma::after {
	right: 0;
	clip: rect(0px 100vw 100vh 50vw);
}

.gatefold {
	width: 100%;
	height: 100%;
}

.gatefold::before,
.gatefold::after {
	content: '';
	position: fixed;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(/assets/images/top/open-waza.png) top center no-repeat;
	background-size: cover;
	z-index: 9997;
}

.gatefold::before {
	left: 0;
	clip: rect(0px 50vw 100vh 0px);
}

.gatefold::after {
	right: 0;
	clip: rect(0px 100vw 100vh 50vw);
}

.check {
	display: none;
}

.switch {
	position: fixed;
	left: 0;
	right: 0;
	width: 300px;
	height: 400px;
	margin: auto;
	font-size: 80px;
	font-weight: bold;
	text-align: center;
	cursor: pointer;
	text-shadow: 5px 5px 10px rgba(0,0,0,.8);
	color: #fff;
	-webkit-transition: all 5s;
	transition: all 5s;
	visibility: visible;
	opacity: 1;
	z-index: 9999;
}


.switch.push::before {
	-webkit-transition: all 5s;
	transition: all 5s;
}

.check.push:checked ~ .switch.push::before {
	content: '';
	opacity: 0;
}

/*  設定　*/
.check.push:checked ~ .husuma::before {
	-webkit-transform: translate3d(-550px,0,0);
	transform: translate3d(-550px,0,0);
	opacity: 0;
}

.check.push:checked ~ .husuma::after {
	-webkit-transform: translate3d(550px,0,0);
	transform: translate3d(550px,0,0);
	opacity: 0;
}

input.check.push:checked + label{
	display: none;
}

.gatefoldVanish,
.gatefoldVanish{
	animation-name: gatefoldVanishAnimation;
	animation-delay: 3s;
	animation-duration: 1.8s;
}

.gatefoldVanish::before,
.gatefoldVanish::after {
	content: '';
	position: fixed;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(/assets/images/top/open-waza.png) top center no-repeat;
	background-size: cover;
	z-index: 9997;
}

@keyframes gatefoldVanishAnimation{
	0%{
		opacity: 1;
	}
	100%{
		opacity: 0;
	}
}

/* RESPONSIVE 設定
------------------------------------------------------------*/
@media only screen and (min-width: 481px){


img.topImageSP{
	display: none;
}


body{
	font-size:14px;
}

div#content{
	width: 100%;
	background:url("/assets/images/top/pc/waza-top.jpg");
	background-size: 100% auto;
}

#main_sp {
	display:none;
}

#main{
		width: 100%;
		margin: 0 auto;
		height: 100%;
		margin-top:500px;
		background-color:#fff;
	}




.mainmenu-omen{
	clear: both;
	width: 100%;
	display:block;
	margin:0 2.5%;
	padding-top:10px;
}

.mainmenu-omen ul{
	width:100%;
	margin: 0 auto;
}

.mainmenu-omen ul li {
    float: left;
    text-align:center;
    list-style: none;
	width: 90%;
	margin:0 auto;
}

.mainmenu-omen ul li a{
	margin: 20px 5px 50px;
	display:block; 
	text-align: center;
}

.mainmenu-four-columns{
	clear: both;
	height:220px;
	width: 100%;
	display:block;
	margin:0 2.5%;
	padding-top:100px;
}

.mainmenu-four-columns ul{
	width:100%;
	margin: 0 auto;
}
.mainmenu-four-columns ul li {
    float: left;
    text-align:center;
    list-style: none;
	width: 90%;
	margin:0 auto;
	
}
.mainmenu-four-columns .bn li {
	margin: 10px 0 100px;
}
	
.mainmenu-four-columns ul li a{

	display:block; 
	text-align: center;
}

.topimageSp{
	display: none;
}

}

@media only screen and (min-width: 641px){
}

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

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

.top-portfolio{
	padding: 0;
	margin-top: -20px;
}

div#content{
	width: 100%;
	background:url("/assets/images/top/sp/waza-top.jpg") no-repeat;
	background-size: 100% auto;
}

header,
#main,
.mainmenu,
.mainmenu-omen,
.mainmenu-four-columns{
	display: none;
}

section.module-hero{
	display: none;
}

.sp_visible_iphoneX,
.sp_visible_iphone6Plus,
.sp_visible_iphone6,
.sp_visible_iphone5{
	display: block !important;
}

.push_iphoneX{
	top:21% !important;
}

.push_iphone6Plus{
	top:20% !important;
}

.push_iphone6{
	top:18% !important;
}

.push_iphone5{
	top:15% !important;
}

#main_sp {
	background-color: rgba( 255, 255, 255, 0.9 );
	background-color:#fff;
	display:block;
}

.mainmenu_sp{
	clear: both;
	width: 95%;
	display:block;
	margin:0 2.5%;
}
.editorsdraw {
	margin-left: 5% !important;
}
ul{
	padding: 0;
}

.mainmenu_sp{
	text-align: center;
}

.mainmenu_sp ul{
	padding: 0;
	display: inline-block;
}

.mainmenu_sp ul li {
	list-style: none;
    float: left;
    width: 50%;
    padding: 1%;
}

.mainmenu_sp ul li a{
	display: block;
}

.mainmenu_sp ul li a img{
	margin-top: 10px;
}

.mainmenu-omen_sp{
	/*clear: both;*/
	width: 100%;
	display:block;
	margin:0 2.5%;
	padding-top: 40px;
	text-align: center;
}

.mainmenu-omen_sp ul{width:100%;}
.mainmenu-omen_sp ul li {
	list-style: none;
    float: left;
	width: 92%;
	margin:10px 5px;
}

.mainmenu-omen_sp ul li a{
	display: block;
}

.mainmenu-omen_sp ul li a img{
	margin-top: 10px;
}

.mainmenu_sp-two-columns{
	/*clear: both;*/
	width: 95%;
	display:block;
	margin:0 2.5%;
	text-align: center;
}

.mainmenu_sp-two-columns ul{width:100%;}
.mainmenu_sp-two-columns ul li {
	list-style: none;
    float: left;
	width: 92%;
	margin:10px 5px;
}

.mainmenu_sp-two-columns ul li a{
	display: block;
}

.mainmenu_sp-two-columns ul li a img{
	margin-top: 10px;
}


}