@charset "utf-8";

@media (max-width: 800px) {
	
	html {
		font-family: sans-serif;
	}
	
	nav.pc_menu {
		display: none;
	}
	
	img {
		width: 90%;
	}
	
	header {
		text-align: left;
		margin: 6px 0 0 0;
		padding-top: 10px;
		padding-bottom: 10px;
	}
	
	h1 img {
		width: 50%;
	}
	
	nav.menu { width:25px; height:30px; top: 26px; right:10px; position:fixed; cursor:pointer; overflow:hidden; z-index:9999; }
	nav .menu1 { width:25px; height:2px; background-color: #000; top:0px; position:absolute; }
	nav .menu2 {width:25px; height:2px; background-color: #000; top:8px; position:absolute; }
	nav .menu3 { width:25px; height:2px; background-color: #000; top:16px; position:absolute; }

	nav .menu1,nav .menu2,nav .menu3
		{ transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; /* Opera */ -moz-transition: all 0.5s ease-out; /* Firefox */
			-webkit-transition: all 0.5s ease-out; /* GoogleChrome, Safari */ -ms-transition: all 0.5s ease-out; /* IE */ }
			
	nav .menuclick1 { top:8px; -o-transform: rotate(405deg); -moz-transform: rotate(405deg); -webkit-transform: rotate(405deg);
			-ms-transform: rotate(405deg); transform: rotate(405deg); }
	nav .menuclick2 { background-color:rgba(255,255,255,0);  }
	nav .menuclick3 { top:8px; -o-transform: rotate(-405deg); -moz-transform: rotate(-405deg);
					-webkit-transform: rotate(-405deg); -ms-transform: rotate(-405deg); transform: rotate(-405deg); }

	#menu{
		position: fixed;
		font-weight: bold;
		display: none;
		right: 15px;
		top: 100px;
		list-style-type: none;
		background-color: rgba(255, 255, 255, 1);
		border: 2px solid #333;
		padding: 20px 20px 20px 20px;
		z-index: 9999;
	}/*by misallychan.com*/
	
	#menu li {
		margin-bottom: 16px;
	}
	
	#menu li:last-child {
		margin-bottom: 0px;
	}
	
	p.btn_contact {
		display: none;
	}
	
	footer {
		margin-top: 60px;
		text-align: center;
		background: #E6002D;
		color: #FFF;
		padding: 10px 0;
		font-size: 0.8em;
	}
	
	#page-top {
		position: fixed;
		bottom: 10px;
		right: 0px;
		width: 15%;
	}

}


@media (min-width: 801px) {
	
	nav.menu, #menu {
		display: none;
	}

	header {
		width: 100%;
		position: relative;
		margin: 0 auto;
		padding: 0 0 0 0;
		position: fixed !important;
		top: 0px;
		background-color: #FFF;
		height: 70px;
		z-index: 1;
	}

	h1 {
		position: fixed;
		top: 10px;
		left: 14px;
	}

	nav {
	  width: 100%;
	}

	nav ul {
		position: fixed;
		top: 24px;
		right: 0px;
		height: 40px;
		background: #FFF;
		z-index: 9999;
		text-align: right;
	}
	
	nav ul li {
		float: left;
		margin-right: 120px;
	}
	
		nav ul li:last-child {
		margin-right: 20px;
	}

	section {
		width: 1280px;
		margin: 0 auto;
		text-align: center;
		z-index: -1;
	}
	
	footer {
		width: 100%;
		text-align: center;
		background: #E6002D;
		padding: 10px 0;
		font-size: 0.8em;
		color: #FFF;
	}
	
	#page-top {
		position: fixed;
		bottom: 20px;
		right: 20px;
		font-size: 77%;
	}
	
	section.main {
		width: 100%;
	}
	
	div.left {
		float: left;
		width: 50%;
		margin-top: 60px;
	}
	
	div.right {
		float: right;
		width: 48%;
		margin-top: 60px;
	}

}

.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}

a {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	text-decoration: none;
	font-weight: bold;
	color: #111;
}

a:hover {
	font-weight: bold;
	color: #E10031;
}

a:hover img {
	opacity: .5;
	filter: alpha(opacity=50);	/* IE lt 8 */
	-ms-filter: "alpha(opacity=50)"; /* IE 8 */
	-webkit-opacity: .5;
	-moz-opacity: .5;
	-webkit-transition: opacity 1s ease-out;
	-moz-transition: opacity 1s ease-out;
	-ms-transition: opacity 1s ease-out;
	transition: opacity 1s ease-out;
}