@charset "utf-8";





/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

 Reset CSS

　━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/

html,body{overflow:auto; }

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{	margin:0; padding:0; max-height:100%;}

table{	border-collapse:collapse;	border-spacing:0;}

fieldset,img{border:0;}

address,caption,cite,code,dfn,em,strong,th,var{	font-style:normal;	font-weight:normal;	}

ul,ol,li{list-style:none;}

caption,th{	text-align:left;}

h1,h2,h3,h4,h5,h6{	font-size:100%;	font-weight:normal;}

q:before,q:after{content:'';}

abbr,acronym {	border:0;font-variant:normal;}

sup {vertical-align:text-top;}

sub {vertical-align:text-bottom;}

hr {display:none;}



img{vertical-align: bottom;}



/* clearfix

----------------------------------------------------------*/

.clearfix:after {

    content: "."; 

    display: block; 

    height: 0; 

    clear: both; 

    visibility: hidden;

}

.clearfix {display: inline-block;}/*IE7用*/



/* Hides from IE-mac \*/

* html .clearfix { height:1%;}

.clearfix { display:block;}

/* End hide from IE-mac */



/* Androidでpタグの横幅が狭まるバグ対策 */

p {background-image:url(image);}



/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

 全般設定

　━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━*/

body {

	padding : 0 0 0 0;

	font-family : "メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic","MS P Gothic",sans-serif, Arial,Helvetica;

	font-size:16px;

	line-height: 1.7em;

	color:#5b5b5b;

	-webkit-text-size-adjust: 100%;

}



#wrapper {

	width : 100%;

	margin:auto;

	overflow:hidden;

}



a {

	color:#5b5b5b;

	text-decoration: none;

}

a:hover {

	color:#15317c;

	text-decoration: underline;

}

.alpha a:hover img {

  opacity: 0.7;

  filter: alpha(opacity=70);

  -ms-filter: "alpha(opacity=70)";

  transition: 0.5s ease-in-out;



}





/* ヘッダー

------------------------------------------*/

#header{

	width:100%;

	background-color:#000;

	padding:8px 0;

	position:fixed;

	top:0;

	z-index:999;

}

#header .inner{

	width:1100px;

	margin:0 auto;

	color:#fff;

}

#header .inner:after {

    content: "."; 

    height:  0; 

    clear: both; 

    visibility: hidden;

}

#header .inner a{ color:#fff;}

h1{

	font-size:14px;

	line-height:1.2em;

	margin-bottom:5px;

}

.h_logo{

	font-size:14px;

	float:left;

}

#navi{

	float:right;

	padding-top:10px;

	height:36px;

}



#navi li{

	display:inline-block;

	margin-left:30px;

}







/* フッター

------------------------------------------*/

#footer{

	width:100%;

	padding-top:20px;

	background-color:#5e5e5e;

	text-align:center;

	color:#fff;

}

#footer a{ color:#fff;}

#footer .inner{

	width:1100px;

	margin:auto;

	text-align:center;

}

ul.f_navi{margin-bottom:20px;}

ul.f_navi li{

	display:inline-block;

	width:15%;

}



.copy {

	width:100%;

	background-color:#000;

	font-size:12px;

	padding:8px 0;

	margin-top:20px;

}



/*  ページトップへ */

#pageTop{

	position:fixed;

	bottom:20px;

	right:20px;

	}



#pageTop:hover{

	cursor:pointer;

}





/* 共通

------------------------------------------*/

.box_title{

	width:100%;

	margin-top:80px;

	padding-top:115px;

	height:220px;

}

.bg_works{background:url(../img/works/back_works.jpg) center top no-repeat;}

.bg_facility{background:url(../img/facility/back_facility.jpg) center top no-repeat;}

.bg_company{background:url(../img/company/back_company_b.jpg) center top no-repeat;}

.bg_recruit{background:url(../img/recruit/back_recruit.jpg) center top no-repeat;}

.bg_contact{background:url(../img/company/back_contact.jpg) center top no-repeat;}



.box_title div{

	width:1100px;

	margin:auto;

	text-align:center;

}



.title01{

	width:1100px;

	margin:60px auto;

	text-align:center;

}

.title02{

	text-align:center;

	margin-bottom:40px;

}



.contents{

	width:100%;

	margin:0;

	padding:60px 0;

}

.bg_gray{ background-color:#f2f2f2;}

.contents .inner{

	width:1100px;

	margin:auto;

}







/* トップページ

------------------------------------------*/



.bg_top{

	background-size: auto 100%;

	background-attachment: fixed;

	z-index:-1;

	position: relative;

}



.bg_slide {

	position: fixed;

	background-size: auto 100%;

	z-index: 1;

	height: 100%;

	width: 100%;

	overflow: hidden;

}



.bg_slide>div{

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background-position: center center;

  background-size: cover;

  background-repeat: no-repeat;

  z-index: 10;

  /* 追記 */

  opacity: 0;

  animation-name: fade;

  animation-duration: 12s;

  animation-iteration-count: infinite;

}

@keyframes fade {

  0%{

    opacity: 0;

  }

  20%{

    opacity: 1;

  }

  80%{

    opacity: 0;

    transform: scale(1.2);

  }

  100%{

    opacity: 0;

    z-index: 0;

  }

}

/* 1枚目のスライド */

.bg_slide>div:first-of-type{

  background-image: url("../img/top/bg_slide01.jpg");

}



/* 2枚目のスライド */

.bg_slide>div:nth-of-type(2){

  background-image: url("../img/top/bg_slide02.jpg");

	animation-delay: 4s;

}



/* 3枚目のスライド */

.bg_slide>div:last-of-type{

  background-image: url("../img/top/bg_slide03.jpg");

	animation-delay: 8s;

}





.box_top_lead{

	width:1100px;

	height:100vh;

	max-height:1100px;

	margin:auto;

	text-align:center;

	padding-top:250px;

	position: relative;

	z-index: 3;

}

.top_arrow{

	margin-top:200px;

}

.top_arrow .scroll{

	margin:auto;

	width: 100px;

	height: 100px;

	background-color: rgba(255,255,255,0.8);

	border-radius: 50%;

	background-image: url(../img/top/arrow_down_g.png);

	background-repeat: no-repeat;

	background-position: center 50%;

	margin-top: 5px;

	animation: roll 1.5s infinite alternate ease-in-out;

}



@keyframes roll {

 0% { background-position: center 50%;}

  50% { background-position: center 70%;}

 100% {background-position: center 50%;}

}



.bg_kei_knit{

	background-image:url(../img/top/back_top02.jpg);

	background-position:top center;

	background-repeat:repeat-x;

	background-color:#fff;

	padding-top:55px;

}



.bg_top_w{

	background:url(../img/top/back_top02.png) center top no-repeat;

	text-align:center;

	font-size:100%;

	line-height:2em;

}

.bg_slider{

	background:url(../img/top/back_top04.jpg) center  repeat-x;

	background-size: auto 100%;

}

.bg_slider02{

	background:url(../img/top/back_top04_02.jpg) center  repeat-x;

	background-size: auto 100%;

}

    .slider {

        width: 100%;

        margin: auto;

    }



    .slick-slide {

      margin: 0px;

    }



    .slick-slide img {

      width: 100%;

    }



    .slick-prev:before,

    .slick-next:before {

      color: black;

    }



    .slick-slide {

      transition: all ease-in-out .3s;

    }

    

.slider img.prev-arrow{

	position:absolute;

	top:40%;

	left:10%;

	z-index:999999;

	cursor:pointer;

}

.slider img.next-arrow{

	position:absolute;

	top:40%;

	left:88%;

	z-index:999999;

	cursor:pointer;

}

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

		.slider img.prev-arrow,

		.slider img.next-arrow{

			width:1px;

			height:1px;

			z-index:-1;

		}

	}





.waku_top_r{

	width:100%;

	background:url(../img/top/back_top05.jpg) top center repeat-x;

	padding-bottom:80px;

}

.waku_top_r .inner{

	width:1280px;

	margin:auto;

}

.top_r_img{

	float:right;

	box-shadow: -40px 40px #fff;

}



.top_r_txt{

	width:500px;

	padding-top:150px;

	margin-left:90px;

}

.bg_top_r{

	padding-top:50px;

	background:url(../img/top/back_top03.png)  center left no-repeat;

	text-align:center;

}













.fadein{

  transition: opacity 1s;

  -moz-transition: opacity 0.7s;

  -webkit-transition: opacity 0.7s;

  -o-transition: opacity 0.7s;



  transition: transform 1s;

  -moz-transition: transform 0.7s;

  -webkit-transition: transform 0.7s;

  -o-transition: transform 0.7s;



 }





.top_bana {

	margin: 68px auto 0;

	text-align: center;

}

.mrt20 {

	margin-top: 20px;

}





@keyframes infinity-scroll-left {

from {

  transform: translateX(0);

}

  to {

  transform: translateX(-100%);

}

}

.scroll-infinity__wrap {

  display: flex;

  overflow: hidden;

}

.scroll-infinity__list {

  display: flex;

  list-style: none;

  padding: 0

}

.scroll-infinity__list--left {

  animation: infinity-scroll-left 80s infinite linear 0.5s both;

}

.scroll-infinity__item {

  width: calc(120vw / 5);

}

.scroll-infinity__item>img {

  width: 100%;

}





@keyframes infinity-scroll-right {

from {

  transform: translateX(-100%);

}

  to {

  transform: translateX(0%);

}

}

.scroll-infinity__list--right{

  animation :infinity-scroll-right 80s infinite linear 0.5s both;

}











/* 業務案内

------------------------------------------*/

.box_txt_l{

	float:left;

	width:520px;

}

.box_txt_r{

	float:right;

	width:520px;

}

.box_oem{

	float:left;

	width:240px;

	height:345px;

	border:solid 1px #999;

	box-sizing:border-box;

	padding:10px 10px 0 10px;

	font-size:95%;

	line-height:1.4em;

	text-align:justify;

	text-justify: inter-ideograph;

}

.box_oem .img{

	text-align:center;

}

.box_oem p{

	margin-top:10px;

	padding-top:10px;

	border-top:solid 1px #999;

}



.arrow_next{

	float:left;

	width:46px;

	text-align:center;

	padding-top:150px;

}



ul.btnx2 li{

	float:left;

	width:50%;

	text-align:center;

}



/* 設備紹介

------------------------------------------*/

.faci_img{

	margin-bottom:15px;

}

.box_faci_l{

	float:left;

	width:500px;

}

.box_faci_r{

	float:right;

	width:500px;

}

table.other_list{

	width:100%;

	border-top:solid 1px #000;

}

table.other_list tr{

	border-bottom:solid 1px #000;

}

table.other_list th{

	width:50%;

	text-align:left;

	padding:25px 0 20px 15%;

}

table.other_list td{

	width:50%;

	padding:25px 0;

}





table.faci_tdb{

	width:100%;

	border-top:solid 1px #000;

}

table.faci_tdb tr{

	border-bottom:solid 1px #000;

}

table.faci_tdb th{

	text-align:center;

	font-weight:bold;

}

table.faci_tdb td{

	padding:25px 0;

	text-align:center;

}











/* 会社案内

------------------------------------------*/

.ttl_greet{

	width:1100px;

	margin:60px auto 40px;

	text-align:center;

}



.waku_greet{

	width:100%;

	background:url(../img/company/back_company02.jpg) top center repeat-x;

}

.waku_greet .inner{

	width:1280px;

	margin:auto;

}

.geet_img{

	float:right;

	box-shadow: -40px 40px #fff;

}



.greet_txt{

	width:540px;

	padding-top:120px;

	margin-left:90px;

	margin-bottom:40px;

}



table.gaiyou{

	width:100%;

	border-top:solid 1px #000;

}

table.gaiyou tr{

	border-bottom:solid 1px #000;

}



table.gaiyou th{

	width:40%;

	font-weight:bold;

	text-align: center;

	padding:25px 0;

}

table.gaiyou td{

	width:60%;

	padding:25px 0;

}



/* 採用情報

------------------------------------------*/

.bg_illust{

	background:url(../img/recruit/back_recruit02.png) top center no-repeat;

	text-align:center;

	line-height:2.5em;

	padding-top:20px;

	padding-bottom:50px;

}

ul.voice li{

	float:left;

	width:50%;

	text-align:center;

}



table.bosyu{

	width:100%;

	border-top:solid 1px #000;

}

table.bosyu thead{

	background-color:#f2f2f2;

	text-align:center;

}

table.bosyu thead td{

	padding:25px 0;

	text-align:center;

}

table.bosyu tr{

	border-bottom:solid 1px #000;

}

table.bosyu th{

	width:25%;

	text-align:center;

	font-weight:bold;

	padding:25px 0;

}

table.bosyu td{

	width:75%;

	padding:25px 0;

}



/* 先輩社員の声 */

.box_voice{

	width:1040px;

	margin: auto;

}

.qa_l{

	width:48%;

	float:left;

}

.qa_r{

	width:48%;

	float:right;

}

.box_voice dt{

	font-size:20px;

	line-height:1.4em;

	border-bottom:solid 1px #999;

	margin-bottom:8px;

}

.box_voice dd{margin-bottom:30px;}















/* お問い合わせ

------------------------------------------*/

.mailform{

	width:100%;

	border-top:solid 1px #999;

	margin-bottom:30px;

}

.mailform tr{

	border-bottom:solid 1px #999;

}

.mailform th{

	width:35%;

	font-weight:bold;

	padding:10px 0 10px 80px;

}

.mailform td{

	width:65%;

	padding:10px 0;

}

.length_l{

	width:95%;

	padding:10px;

}

.length_m{

	width:60%;

	padding:10px;

}

.naiyou{

	width:80%;

	height:250px;

	padding:10px;

}

.sousin{

	background: url(../img/company/btn_sousin.jpg);

	width:221px;

	height:63px;

	border:0px solid;

	cursor:pointer;

}



.sousin:hover{

	background: url(../img/company/btn_sousin_over.jpg);

}

.check {text-align:center; font-weight:bold;}

.check label:hover{ cursor:pointer;}