h1{
	float: left;
	
}
h1 img{
	display: block;
	height: 100px;
}

.headbox{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	padding: 70px 90px;
	box-sizing: border-box;
}
header{
	position: relative;
	height: 974px;
	
	background-size: cover;
}
header.hidden{
	overflow: hidden;
}
header .slick-slider{
	z-index: -1;
}
header .mv ul li img{
	width: 100%;
	min-width: 1520px;
	display: block;
	
}
.company header{
	background: url("../images/bg_company.png") no-repeat;
	background-size: cover;
}
.works header{
	background: url("../images/bg_work.png") no-repeat;
	background-size: cover;
}
.recruit header{
	background: url("../images/mv05.png") no-repeat;
	background-size: cover;
}
.works header .sort{
	position: fixed;
	right: 0;
	top: 50%;
	transform: translate(0%, -50%);
    -webkit-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
	background: url("../images/bg02.png") no-repeat;
	padding: 30px;
	z-index: 9;
}
.works header .sort li{
	display: block;
}
.works header .sort li a{
	display: inline-block;
	text-decoration: none;
	color: #8a8a8a;
	font-family: futura-pt, sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 16px;
}
.works header .sort li a.active{
	color: #fff;
}

nav {
	display: inline-block;
	float: right;
}
nav ul{
	display: inline-block;
	vertical-align: middle;
	width: 0;
	height: 23px;
	overflow: hidden!important;
	-webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
}
nav ul.active{
	width: 735px;
}
nav ul li{
	display: inline-block;
	width: 127px;
	margin-left: 20px;
}
nav ul li:first-child{
	margin-left: 0;
}
nav li a{
	font-family: futura-pt, sans-serif;
	font-weight: 300;
	font-style: normal;
	text-decoration: none;
	color: #c8c8c8;
	border-bottom: 1px solid #c8c8c8;
	display: block;
	opacity: .25;
	font-size: 15px;
}
nav li a.active{
	opacity: 1;
}
nav li a:hover{
	opacity: 1;
}
nav li.close{
	display: none!important;
} 
.headbox .ham{
	display: inline-block;
	vertical-align: middle;
	margin-left: 20px;
}
.headbox .ham img{
	display: block;
}
header h2{
	position: absolute;
	top: 60%;
	right: 10%;
}
.mv{
	/*z-index: -1!important;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;*/
	background: url("../images/top.png") no-repeat center;
	background-size: cover;
	width: 100%;
	height: 100%;
	position: relative;
	z-index: -1;
}
.mv.mv04{
	background: url("../images/mv04.png") no-repeat;
}
.mv ul{
	display: none!important;
}
.mv img{
	width: 100%;
	display: block;
}
.contbox{
	max-width: 1200px;
	width: 90%;
	margin: 170px auto 200px;
	font-size: 0;
}
.kaso .contbox{
	font-size: 15px;
}
.txt-box {
	border-top: 1px solid rgba(255,255,255,.15);
	border-bottom: 1px solid rgba(255,255,255,.15);
	width: 510px;
	padding: 40px 30px;
	box-sizing: border-box;
	display: inline-block;
	vertical-align: middle;
}
.txt-box h4,.contact h4{
	font-family: lft-etica, sans-serif;
	font-weight: normal;
	font-weight: 200;
	font-style: normal;
	font-size: 48px;
	text-align: left;
	letter-spacing: 2px;
	text-indent: 2px;
}
.txt-box h4 span,.contact h4 span{
	font-size: 18px;
	display: block;
	margin-bottom: 30px;
}
.txt-box h4 strong,.contact h4 strong{
	font-family: lft-etica, sans-serif;
	font-weight: 400;
	font-style: normal;
}
.txt-box p{
	margin: 40px auto;
	font-size: 17px;
	line-height: 2;
	letter-spacing: 2px;
	text-indent: 2px;
}
.txt-box ul {
	margin-top: 50px;
}
.txt-box ul li{
	display: inline-block;
	margin-right: 20px;
}
.txt-box ul li a{
	font-family: futura-pt, sans-serif;
	font-weight: 300;
	font-style: normal;
	text-decoration: none;
	color: #c8c8c8;
	font-size: 16px;
	letter-spacing: 2px;
}
.txt-box ul li a::before{
	content: "";
	border-bottom: 1px solid #c8c8c8;
	width: 27px;
	display: inline-block;
	opacity: 50%;
	margin-right: 5px;
}
.contbox .img-box{
	display: inline-block;
	vertical-align: middle;
	position: relative;
	width: calc(100% - 530px);
	margin-left: 20px;
}
.contbox .img-box img{
	display: block;
	margin-left: auto;
	margin-right: 0;
	max-width: 100%;
	
}
.about.contbox .img-box img{
	-webkit-transition: 1.5s ease-in-out;
  -moz-transition: 1.5s ease-in-out;
  -o-transition: 1.5s ease-in-out;
  transition: 1.5s ease-in-out;
	position: relative;
	top: -100px;
	opacity: .1;
}
.about.contbox .img-box img.active{
	top: 0;
	opacity: 1;
}
.about.contbox .img-box img.abso{
	position: absolute;
	left: 70px;
	bottom: 240px;
	max-width: 100%;
	top: auto;
	z-index: 3;
}
.about.contbox .img-box img.abso.active{
	position: absolute;
	left: 70px;
	bottom: 40px;
	max-width: 100%;
	top: auto;
}
.contbox .img-box ul {
	text-align: right;
}
.contbox .img-box ul li{
	width: 33.3333333%;
	display: inline-block;
	max-width: 200px;
	border: 1px solid #080808;
	box-sizing: border-box;
}
.contbox .img-box ul li img{
	width: 100%;
	display: block;
}
.slide-box {
	text-align: center;
	background: url("../images/bg_works.png") no-repeat top left;
	margin-bottom: 200px;
	padding-top: 70px;
	overflow: hidden;
	padding-bottom: 100px;
}
.slide-box h4{
	display: inline-block;
	font-family: futura-pt, sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 18px;
	margin-right: 50px;
}
.slide-box ul.nav{
	display: inline-block;
}
.slide-box ul.nav li {
	display: inline-block;
	margin-left: 40px;
}
.slide-box ul li a{
	font-family: futura-pt, sans-serif;
	font-weight: 300;
	font-style: normal;
	text-decoration: none;
	color: #c8c8c8;
	font-size: 14px;
	letter-spacing: 2px;
	text-indent: 2px;
}
.slide-box .slide ul li{
	text-align: left;
}
.slide-box .slide ul li img{
	-webkit-backface-visibility: hidden;
}
.slide-arrow{
	position: absolute;
	bottom: -70px;
	z-index: 4;
}
.prev-arrow{
	left: calc(50% - 100px);
}
.next-arrow{
	right: calc(50% - 100px);
}
.contact{
	position: relative;
}
.contact .bg img{
	display: block;
	width: 100%;
}
.contact .abso{
	position: absolute;
	width: 100%;
	bottom: -70px;
	
}
.contact .abso .contbox{
	max-width: 1200px;
	margin: 0 auto;
	text-align: right;
}
.contact .txt-box{
	display: inline-block;
	text-align: left;
}
.retop {
	margin: 200px auto 0px;
	display: block;
}
.retop a{
	display: block;
	text-align: center;
	background: #1b1b1b;
	padding: 30px 0;
}
.retop a img{
	display: inline-block;
	margin: 0 auto;
}
.foot_bg{
	background: url("../images/footer_bg.jpg") no-repeat;
	background-size: cover;
	padding-top: 90px;
	padding-bottom: 90px;
}
footer {
	max-width: 1200px;
	margin: 0 auto ;
}
footer h2{
	display: block;
	letter-spacing: 2px;
	text-indent: 2px;
	margin-bottom: -25px;
}
footer h2 img{
	display: block;
	margin: 0 auto 60px;
}
footer h2 a{
	display: inline-block;
	font-size: 14px;
	text-decoration: none;
}
footer h2 a span{
	font-size: 18px;
	margin-left: .4rem;
}

footer ul li{
	display: inline-block;
}
footer ul li.link {
	margin-right: 45px;
}
footer ul li:nth-child(4){
	margin-right: 0;
}
footer ul li.link a{
	font-family: futura-pt, sans-serif;
    font-weight: 300;
    font-style: normal;
    text-decoration: none;
    color: #ffffff;
    font-size: 14px;
    letter-spacing: 2px;
}
footer ul li.logo{
	margin: 0 10%;
}
footer ul li.logo a{
	font-size: 14px;
	text-decoration: none;
}
footer ul li.logo a span{
	font-size: 18px;
	margin-left: .4rem;
}
footer ul li.sns{
	vertical-align: middle;
	margin-right: 10px;
}
footer ul li.sns img{
	display: block;
	
}
footer ul li.copy{
	font-family: futura-pt, sans-serif;
    font-weight: 300;
    font-style: normal;
    text-decoration: none;
    color: #ffffff;
    font-size: 12px;
    letter-spacing: 2px;
	
}
footer ul.left{
	width: 45%;
}
footer ul.right{
	width: 45%;
	text-align: right;
}
.slide-box{
	overflow: hidden;
	position: relative;
}
.slide-box .slide{
	
	 padding: 50px 0 0;
}
.slide-box .slide .inner {
  margin: 0 auto;
/*  width: 80%;
  max-width: 1200px;*/
}
.slide-box .slick-list {
  overflow: visible;
}
.lineup {
  position: relative;
}
.lineup.off{
	position: absolute;
	bottom: 0;
	z-index: -1;
	width: 100%;
}
.slide-box .slide ul li {
 box-sizing: border-box;
	display: block;
  padding-right: 10%;
	position: relative;
}
.slide-box .slide ul li.off{
	display: none!important;
}
.slide-box .slide ul li img {
  display: block;
 -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  width: 100%;
	-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
}
.slide-box .slide ul li img:hover{
	-webkit-filter: grayscale(0);
-moz-filter: grayscale(0);
-ms-filter: grayscale(0);
-o-filter: grayscale(0);
filter: grayscale(0);
}

.slide-box .slide ul li::after{
	content: "";
	
}
.kaso header h2{
	top: 50%;
	bottom: auto;
	left: 20%;
	right: auto;
	transform: translate(-20%, -50%);
    -webkit-transform: translate(-20%, -50%);
    -ms-transform: translate(-20%, -50%);
	font-size: 56px;
	font-family: lft-etica, sans-serif;
	font-weight: normal;
	font-weight: 200;
	font-style: normal;
	text-align: left;
}
.kaso header h2 strong{
	font-weight: 400;
}
.kaso header h2 span{
	display: block;
	font-family:"Yu Gothic", "游ゴシック", YuGothic,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	font-size: 25px;
	margin-top:20px;
}
.company table{
	table-layout: fixed;
	width: 100%;
	margin: 90px 0 10px;
	
}
.company table th{
	text-align: left;
	width: 140px;
	vertical-align: top;
	font-size: 14px;
	font-weight: 500;
	text-indent: 2px;
	letter-spacing: 2px;
	color: #e6e6e6;
	padding: 10px 0px;
}
.company table td{
	text-align: left;
	padding: 10px 0px;
	vertical-align: top;
	letter-spacing: 2px;
	text-indent: 2px;
}
.company table td a{
	font-family: futura-pt , sans-serif;
    font-weight: 300;
    font-style: normal;
    text-decoration: none;
	color: rgba(255,255,255,.5);
	margin-top: 10px;
	display: inline-block;
	margin-bottom: 10px;
}
.company table td a::before{
	content: "";
	display: inline-block;
	border-bottom: 1px solid rgba(255,255,255,.5);
	width: 25px;
	margin-right: 5px;
}
.company.recruit table td a{
    color: #fff;
    text-decoration: underline;
}
.company.recruit table td a::before{
   display: none;
}
.company table td span{
	font-size: 15px;
	margin-top: 20px;
	display: block;
}
.company table td ol{
	margin-left: 1.5rem;
}
.company table td strong{
	font-size: 18px;
}
.company h4{
	text-align: left;
	font-size: 18px;
	font-family: futura-pt , sans-serif;
    font-weight: 300;
    font-style: normal;
    text-decoration: none;
    color: #ffffff;
	letter-spacing: 2px;
	text-indent: 2px
}
.company header .abso{
	bottom: -180px;
	left: 50%;
	max-width: 1200px;
	width: 95%;
	transform: translate(-50%, 0%);
    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
}
.company header .abso img{
	display: block;
	margin-right: 0;
	margin-left: auto;
}
.company .mainbox{
	background: url("../images/bg02.png") no-repeat bottom right;
}
.company .contbox{
	margin-bottom: 0px;
}
.company .link_btn{
	text-align: right;
	padding-right: 200px;
	box-sizing: border-box;
}
.company .link_btn a{
	font-family: futura-pt , sans-serif;
    font-weight: 300;
    font-style: normal;
    text-decoration: none;
	color: rgba(255,255,255,.5);
	font-size: 16px;
	letter-spacing: 2px;
}
.company .link_btn a::before{
	content: "";
	width: 25px;
	border-bottom: 1px solid rgba(255,255,255,.5);
	display: inline-block;
	margin-right: 5px;
}
.works .contbox {
	margin-top: -200px;
	position: relative;
	z-index: 3;
	margin-bottom: 0px;
}
.works .contbox ul {
	text-align: center;
}
.works .contbox ul li{
	float: left;
	text-align: left;
	margin:0.6666666%;
	width: 32%;
	margin-bottom: 10px;
	position: relative;
}



.works .contbox ul li img{
	display: block;
	width: 100%;
	-webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  width: 100%;
	-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
}
.works .contbox ul li img:hover{
	-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
-ms-filter: grayscale(0%);
-o-filter: grayscale(0%);
filter: grayscale(0%);
}
.works .contbox ul li span{
	display: block;
	
}
.works .contbox ul li.off{
	display: none!important;
}
.sp{
	display: none!important;
}
.works .retop{
	margin-top: 100px;
}


@media(max-width:1300px){
	.headbox{
		padding: 30px 40px;
	}
	
}
@media(max-width:1200px){
	header h2 {
		width: 68%;
		right: 5%;
	}
	header h2 img{
		width: 100%;
		display: block;
	}
	header{
		height: 700px;
	}
	header .mv ul li img{
		min-width: 1092px;
	}
	.contbox .img-box img{
		width: 71%;
	}
	.contbox .img-box img.abso{
		width: 38%;
		left: 12%;
	}
	footer{
		padding: 0 10px;
		box-sizing: border-box;
	}
}
@media(max-width:1080px){
	nav ul li{
		width: 75px;
	}
	nav ul.active{
		
		width: 473px;
	}
}
@media(max-width:890px){
	.headbox{
		padding: 20px;
	}
	nav ul{
		display: none;
	}
	header{
		height: 400px;
	}
	header .mv ul li img{
		min-width: 624px;
	}
	.txt-box{
		width: 100%;
		display: block;
	}
	.contbox .img-box{
		display: block;
		width: 100%;
		margin-left: auto;
		margin-bottom: 10px;
	}
	.pc{
		display: none!important;
	}
	.sp{
		display: block!important;
	}
	.contact .abso{
		position: static;
	}
	.txt-box h4, .contact h4{
		font-size: 28px;
	}
	.txt-box p{
		font-size: 14px!important;
	}
	.contbox{
		margin: 80px auto;
	}
	.slide-box{
		margin-bottom: 80px;
	}
	.retop{
		margin-top: 80px;
	}
	footer h2{
		margin-bottom: 10px;
	}
	footer h2 img{
		width: 120px;
		margin-bottom: 20px;
	}
	footer ul.left{
		float: none;
		width: 100%;
		text-align: center;
	}
	footer ul.right{
		float: none;
		width: 100%;
		text-align: center;
		margin-top: 20px;
	}
	footer ul li.copy{
		display: block;
		margin-top: 10px;
	}
	.foot_bg{
		padding: 30px 10px;
	}
	.slide-box h4{
		margin-right: 0;
		text-align: left;
		display: block;
		padding: 0 5%;
	}
	.slide-box ul.nav li{
		margin-left: 15px;
	}
	.slide-box ul.nav li:first-child{
		margin-left: 0;
	}
	.slide-box .slide ul li p{
		font-size: 11px;
	}
	.company header .abso{
		display: none;
	}
	.kaso header h2{
		font-size: 36px;
		width: 100%;
		box-sizing: border-box;
		padding: 0 20px;
	}
	.kaso header h2 span{
		font-size: 16px;
		margin-top: 10px;
	}
	.company table td strong{
		font-size: 15px;
	}
	.company table td span{
		font-size: 12px;
	}
	.company table th{
		width: 100px;
	}
	.works .contbox{
		margin-top: 0;
	}
	.works .contbox ul li span{
		font-size: 11px;
	}

	.slide-box ul li a{
		font-size: 11px;
	}
	.slide-box ul li {
		margin-left: 7px;
	}
	nav ul.active{
		width: 100%;
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		height: 100vh;
		background: rgba(0,0,0,.9);
		text-align: right;
		box-sizing: border-box;
		padding: 70px 10px;
		z-index: 99999;
	}
	nav li.close{
		display: block!important;
		position: fixed;
		top: 10px;
		right: 10px;
		z-index: 99999999;
		
	}
	nav li.close a{
		color: #fff;
		line-height: 1;
		font-size: 50px;
		opacity: 1;
		border-bottom: none;
	}
	nav ul.active li{
		display: block;
		margin-left: auto;
		margin-right: 0;
		width: 80%;
		margin-bottom: 20px;
	}
	.works header .sort{
		top: auto;
		bottom: 0;
		left: 0;
		width: 100%;
		 transform: translate(0%, 0%); 
		 -webkit-transform: translate(0%, 0%); 
		-ms-transform: translate(0%, 0%);
		background-repeat: repeat;
		text-align: center;
		box-sizing: border-box;
		padding: 10px;
	}
	.works header .sort li{
		display: inline-block;
		margin:5px;
	}
	.slide-box .slide ul li span{
		font-size: 12px;
	}
	h1 img{
		    height: 71px;
	}
	.headbox .ham img{
		height: 60px;
	}
	.works .mainbox{
		margin-top: 40px;
	}
}
.slick-slider div { transition: none; }


/*load*/
html, body {
  height: 100%;
}
body {
  position: relative;
}
.loading {
    position: relative;
    height: 100%;
    width: 100%;
    background-color: #000;
}
.loader,.loader-inner {
    position: relative;
    height: 100%;
    width: 100%;
}
.ball-scale > div {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
}
.opening {
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.opening img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
}

@media(max-width:680px){
	.opening img {
        width: 100%;
        height: auto;
    }
}
/*load*/




.popup .cont{
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: rgba(0,0,0,.9);
	
	z-index: 999999999999999999;
	box-sizing: border-box;
}
.popup .cont .rela{
	position: relative;
	height: 100vh;
	width: 100%;
	overflow: scroll;
}
.popup .cont .abso{
	padding: 0 10%;
	box-sizing: border-box;
	
	
	width: 100%;
}
.popup .cont ul{
	display: block;
	width: 100%;
}
.popup .cont .close{
	content:"×";
	display: inline-block;
	text-decoration: none;
	position: absolute;
	top: 20px;
	right: 20px;
	font-size: 40px;
	z-index: 99999999999999999999999999999;
}
.popup .cont ul li{
	text-align: center;
	
	display: block;
}
.popup .cont ul li img{
	height: 100%;
	max-height: 600px;
	display: inline-block;
}

.popup .cont h3{
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 20px;
}
@media(max-width:640px){
	.popup .cont ul li img{
		height: auto;
		max-height: none;
		width: 95%;
		margin: 0 auto;
	}
	.works .contbox ul li span{
		font-size: 10px;
	}
}
.caption {
	display: block;
	margin-bottom: 10px;
	margin-top: 50px;
}
.caption span{
	display: block;
}
.works .contbox ul li span{
	display: none;
}