/* CSS Document */
@media screen and (max-width: 770px) {
	body_770 {}

	.main h2 {
		background-size:90% auto;
	}
}

@media screen and (min-width: 660px) {
	body_min_660 {}
	
	.main .hp_header .menu ul {
		display:block !important;
	}
	
	.main .menu ul {
		display:inline-block !important;
	}
}

@media screen and (max-width: 660px) {
	body_660 {}
	
	body {
		background-size:300px auto, 300px auto, auto auto;
	}
	
	.m_hide {
		display:none;
	}
	
	.main {
		margin-left:20px;
		margin-right:20px;
	}
	
	.main .header {
		text-align: left;
	    padding-left: 30px;
	    padding-top: 20px;
	}
	
	.main .menu {
		padding-top:0;
		height:80px;
	}
	
	.main .hp_header .menu {
		padding-top:0;
	}
	
	body:not(.hp) .main .menu {
		margin-top: -130px;
	}
	
	.main .menu .mobile_menu_icon {
		display:block;
	}
	
	.main .hp_header .menu ul,	
	.main .menu ul {
		display:none;
		position:absolute;
		background:url('/design/bg_darker.png'), url('/design/bg_body.jpg');
		width:calc(100% + 40px);
		float:none;
		padding-top:100px;
		padding-bottom:40px;
		margin-left:-20px;
		
		-webkit-box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.2);
		-moz-box-shadow:    0px 3px 8px 0px rgba(0, 0, 0, 0.2);
		box-shadow:         0px 3px 8px 0px rgba(0, 0, 0, 0.2);
	}
	
	body:not(.hp) .main .menu ul {
		top:-20px;
	}
	
	.main .menu ul li {
		float:none;
		line-height:60px;
		height:60px;
		padding-right:0;
	}
	
	.main .menu ul li a span {
		display:inline-block;
	}
	
	.for_footer {
		margin-top:60px;
	}
}

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

	.clear.m_h_40 {height:40px;}	
}

/*@media screen and (max-width: 460px) {
	body_460 {}

	.main .menu ul {
		margin-left:calc(-(50vw - 210px));
		width:100vw;
	}
}

@media screen and (max-width: 420px) {
	body_420 {}
	
	.main .menu ul {
		margin-left:0;
		width:420px;
	}
}*/