html, body {
 height: 100%;
 background: #222;
 color: #fff;
	z-index: 0;
	font-family: Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}
#wrap {
	position: relative;
 width: 100%; height: 100%;
}
.dot {
	display: block;
	position: absolute;
	width: 100%; height: 100%;
	background: url("../img/dot.gif") repeat top left;
	z-index: 999;
}

/*clearfix関係*/
.cf:after{
 content: ".";
 display: block;
 height: 0;
 clear: both;
 visibility: hidden;
}
.cf { min-height: 1px; }

/* main nav */
nav.main {
	position: absolute;
	top: 40px; right: 40px;
	font-size: 12px;
	z-index: 9999;
}
nav.main ul li {
	list-style: none;
	float: left;
	text-align: center;
	margin-left: 5px;
}
nav.main ul li a {
	text-decoration: none;
	color: #fff;
	padding: 8px;
	display: block;
}
/* sub nav */
#subnav {
 position: fixed;
 top:0; right: 0;
	width: 100%; height: 40px;
	z-index: 9998;
	font-size: 12px;
}
#subnav ul {
 text-align: center;
	background: #fff;
 display: none;
	color: #000;
}
#subnav ul li.logo {
	float: left;
	background: url(../img/logo_bk.png) no-repeat;
	width: 150px; height: 16px;
	margin: 12px;
	text-indent: -9999px;
}
#subnav ul li.logo a {
	display: block;
}
#subnav ul li {
	float: right;
	list-style: none;
	height: 40px;
	text-align: center;
	margin-right: 5px;
}
#subnav ul li a {
	color: #000;
	text-decoration: none;
	padding: 0px 8px;
	line-height: 40px;
	display: block;
}

/* コンテンツ */
.fx {
 position: relative;
 min-height: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
 background-size: cover;
 background-repeat: no-repeat;
 background-position: center center;
	z-index: 9;
}
section {
	position: relative;
}
section h3 {
	position: absolute;
 left: 12%;
	padding-left: 8px;
	border-left: solid 3px #fff;
}
.container {
	position: absolute;
	top: 140px;
	width: 100%;
}
.container h4 {
	margin: 0 12% 10px;
	font-size: 14px;
}
.container p {
	margin: 0 12% 10px;
	font-size: 12px;
	line-height: 20px;
}
.company h4 {
	float: left;
	margin: 0 0 10px 12%;
	width: 80px;
}
.company p {
	margin-top: -2px;
	padding-left: 80px;
}

/* バックグラウンドデザイン */
#bg1 { background-image: url("../img/img1.gif"); }
#bg1 h3 { top: 100px; }

#bg2 { background-image: url("../img/img1.jpg"); }
#bg2 h3 { top: 100px; }

#bg3 { }
#bg3 h3 { top: 100px; }

#bg4 { background-image: url("../img/img1.jpg"); }
#bg4 h3 { top: 100px; }

#bg5 { }
#bg5 h3 { top: 100px; }

/* ヘッダー */
header {
	position: absolute;
	left: 40px; top: 40px;
}
header h1 {
 font-size: 1.5em;
 color: #fff;
 letter-spacing: 6px;
 font-family: sans-serif;
	
	padding-bottom: 5px;
	margin-bottom: 10px;
	border-bottom: solid 1px #fff;
	width: 210px; height: 22px;
	text-indent: -9999px;
}
header h2 {
 font-size: 0.8em;
 color: #fff;
 letter-spacing: 2px;
}

/* next button */
.btn {
	position: absolute;
	left: 50%;	bottom: 12%;
	width: 100px;
	margin-left: -50px;
	text-align: center;
	z-index: 999;
}
.btn a {
	display: block;
	margin-left: 26px;
	width: 48px; height: 48px;
	text-indent: -9999px;
}
.btn p {
	margin-top: 5px;
	line-height: 16px;
	font-size: 11px;
}
.back {
	position: absolute;
	bottom: 40px; right: 40px;
	width: 40px; height: 40px;
	z-index: 9999;
	text-indent: -9999px;
	background: url("../img/back_btn.png") no-repeat;
	background-size: 40px;
}
/* SVG */
header h1 {
	background: url("../img/logo.png") no-repeat;
	background-size: 210px 22px;
/*	background: rgba(0,0,0,0) url("../img/logo.svg") no-repeat; */
}
.btn a {
	background: url("../img/next_btn.png") no-repeat;
	background-size: 48px;
/*	background: rgba(0,0,0,0) url("../img/next_btn.svg") no-repeat; */
}

/* グーグルマップ */
#map {
	position: absolute;
	bottom: 0;
	width: 100%; height: 50%;
}
.big {
 position: absolute;
	top: 100px; right: 12%;
	
	display: block;
	text-decoration: none;
	background: #fff;
	padding: 5px 10px;
	font-size: 12px;
	color: #000;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	-ms-border-radius: 3px;
 z-index: 3;
}

/* コンテンツスライダー */
#slides { position: relative; }
#slides .scrollable {
 *zoom: 1;
 position: relative;
 top: 0; left: 0;
 overflow-y: auto;
 -webkit-overflow-scrolling: touch;
 height: 100%;
}
#slides .scrollable:after {
 content: "";
 display: table;
 clear: both;
}

.slides-nav {
 margin: 0 auto;
 position: absolute;
 z-index: 3;
 top: 46%;
 width: 100%;
}
.slides-nav a {
 position: absolute;
 display: block;
 color: #fff;
 text-decoration: none;
}
.slides-nav a.prev { left: 20px; }
.slides-nav a.next { right: 20px; }

.pages {
 position: absolute;
 z-index: 3;
 top: 100px; right: 12%;
}
.pages a {
 border: 1px solid #fff;
 border-radius: 15px;
 width: 10px;
 height: 10px;
 display: -moz-inline-stack;
 display: inline-block;
 vertical-align: middle;
 *vertical-align: auto;
 zoom: 1;
 *display: inline;
 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR4nGP6zwAAAgcBApocMXEAAAAASUVORK5CYII=");
 margin: 2px;
 overflow: hidden;
 text-indent: -100%;
}
.pages a.current {
 background: #fff;
}



@media screen and (max-width: 768px) {
	
section {	padding-bottom: 70px;	}
.container {	top: 90px;	}
	
header {
 position: absolute;
 left: 50%; top: 15%;
	width: 210px;
 margin-left: -105px;
}
header > h1 {
 margin: 0 0 10px 0;
 padding: 0 0 5px 0;
 text-align: center;
}
header > h2 {
 margin-left: -10px;
 text-align: center;
}
#bg1 h3, #bg2 h3, #bg3 h3, #bg4 h3, #bg5 h3 { top: 40px; left: 20px; }

nav.main {	display: none;	}
div#subnav { display: none;	}
.btn {
	bottom: 8%;
	margin-bottom: 70px;
}
.back {
	bottom: 90px; right: 20px;
}
.big {
	top: 36px; right: 20px;
}
.slides-nav a.prev { left: 10px; }
.slides-nav a.next { right: 10px; }
.pages {
 position: absolute;
 z-index: 3;
 top: 36px; right: 20px;
}

.container p {
	font-size: 12px;
	line-height: 18px;
}
/*
#slides-1 h4, #slides-1 p,
#slides-2 h4, #slides-2 p { left: 40px; right: 40px; }
*/
#map {
	height: 40%;
	bottom: 70px;
}

}