@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,500,600');
body {
	font-size: 12px;
font-family: 'Montserrat',YuGothic,'Yu Gothic','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'ＭＳ ゴシック',sans-serif;
	line-height: 1.8;
	letter-spacing:0;
	color: #000;
	background: #FFF;
	font-weight:400;
}
a {
	text-decoration: none;
	color: #000;
}
a:hover {
	opacity: 0.5;
}
img {
	vertical-align: top;
}
.pc {
	display: block ;
}
.sp {
	display: none  ;
}
.onlysp{ display:none;}
#wrapper {
	width: 100%;
	overflow: hidden;
}
/* header */


#header .cp{ position: fixed; left:25px; top:25px; z-index:100; letter-spacing:0.08em;}
.sideleftMiddle{ position:fixed; left:-57px; top:50%; font-weight:600; transform: rotate(90deg); letter-spacing:0.08em;}
.url{ position:fixed; left:25px; bottom:20px; font-size:9px; z-index:100; letter-spacing:0.08em;}
#menu-btn_sp{ position:fixed; right:28px; top:28px; width:24px; z-index:100; cursor:pointer;}
.menu{ position:fixed; right:28px; top:50%; width:24px; transform: rotate(90deg); font-size:11px; letter-spacing:0.08em;}

@media screen and (min-width:901px) {
.headerWrap{ height:100vh; width:80px; position:fixed; top:0; right:0; display:block; z-index:1000; cursor:pointer; letter-spacing:0.08em;}
}

.scroll {
	position: fixed;
	z-index: 1;
	bottom:20px;
	right: 40px;
	overflow: hidden;
	width: 1px;
	height: 70px;
	letter-spacing:0.08em;
}

.scrolltext{ position:fixed; font-size:11px; bottom:100px; right:27px;  transform: rotate(90deg);}

.scroll:after, .scroll:before {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 1px;
	height: 100%;
	content: ''
}
.scroll:before {
	z-index: 10;
	-webkit-animation: scroll 2.4s infinite normal;
	animation: scroll 2.4s infinite normal;
	background: #333
}
.scroll:after {
	background: #cacaca
}
@-webkit-keyframes scroll {
0% {
-webkit-transform:translate3d(0, -100%, 0)
}
15% {
-webkit-transform:translate3d(0, -98%, 0)
}
85% {
-webkit-transform:translate3d(0, 98%, 0)
}
100% {
-webkit-transform:translate3d(0, 100%, 0)
}
}
@keyframes scroll {
0% {
transform:translate3d(0, -100%, 0)
}
15% {
transform:translate3d(0, -98%, 0)
}
85% {
transform:translate3d(0, 98%, 0)
}
100% {
transform:translate3d(0, 100%, 0)
}
}


/* contents */
.contents {
	width:100%; padding:0 80px; box-sizing:border-box;
}






/* footer */
footer {
	width: 100%;
	text-align: left;
}
.menu-trigger, .menu-trigger span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}
.menu-trigger {
	position: relative;
	width: 20px;
	height: 20px;
}
.menu-trigger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #000;
	border-radius: 2px;
}
.menu-trigger.close span{ background-color:#fff;}
.menu-trigger span:nth-of-type(1) {
	top: 0;
}
.menu-trigger span:nth-of-type(2) {
	top: 9px;
}
.menu-trigger span:nth-of-type(3) {
	bottom: 0;
}
.menu-trigger.close span:nth-of-type(1) {
	-webkit-transform: translateY(13px) rotate(-45deg);
	transform: translateY(13px) rotate(-45deg);
}
.menu-trigger.close span:nth-of-type(2) {
	opacity: 0;
}
.menu-trigger.close span:nth-of-type(3) {
	-webkit-transform: translateY(-4px) rotate(45deg);
	transform: translateY(-4px) rotate(45deg);
}
.contents {
	padding-top: 0;
}


.menuWrapp{  position:fixed; position:fixed; right:-340px; top:0; z-index:90; width:340px; background:#000;
height:100vh;
transition: all 0.3s ease;
}

.menuWrapp.on{ position:fixed; position:fixed; right:0; top:0; z-index:90; width:340px; background:#000;
height:100vh;
}
.close{ color:#fff; position:absolute;}


.sp_menu {
	height: 100%;
	background-color: #000;
	padding-left:50px;
	
	display:table;
}
.sp_menuWrap{
	
	display:table-cell;
	vertical-align:middle;
	
	}
 .sp_menu ul li {
	font-size: 11px;
	text-align: left;
	font-weight: 600;
	margin-bottom:30px;
	letter-spacing:0.08em;
}
.sp_menu ul li a {
	display: block;
	text-decoration: none;
	color:#fff;
}
.textcontentW.footer h3{ font-weight:400;}



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

body {
	font-size: 10px;
}
.pc {
	display: none ;
}
.sp {
	display: block ;
}
a:hover {
	opacity: 1;
}
img {
	max-width: 100%;
	height: auto
}
/* header */
.contents{ padding:0 5.6%;}
.scrolltext{ position: absolute; font-size:11px; bottom:100px; right:2.66%;  transform: rotate(90deg);}
.scroll {
    position: absolute;
    z-index: 1;
    bottom: 20px;
    right: 6.5%;
    overflow: hidden;
    width: 1px;
    height: 70px;
}
#menu-btn_sp{ right:5.3333%;}
.url{ position:absolute;}
.menuWrapp{  position:fixed; position:fixed; right:-50%; top:0; z-index:90; width:50%; background:#000;
height:100vh;
transition: all 0.3s ease;
}

.menuWrapp.on{ position:fixed; position:fixed; right:0; top:0; z-index:90; width:50%; background:#000;
height:100vh;
}
.sp_menu{ padding-left:13.82%;}

}

@media screen and (max-width:900px) {
	body {
		font-weight:500;
}
.onlysp{ display:block;}
.sp_menu ul li{ font-size:12px; margin-bottom:15px;}
}
/* =================
clearfix
================= */
.clearfix:after, .cfx:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/* =================
