@charset "UTF-8";
.pc { display:none; }
.tb { display:none; }
.ph { display:inline; }

/*ナビ*/
.btn-trigger {
  position: relative;
  width: 33px;
  height: 28px;
  cursor: pointer;
}
.btn-trigger span {
  position: absolute;
  left: -10px;
  top: -12px;
  width: 100%;
  height: 4px;
  background-color: rgba(230,0,20, 0.6);
  border-radius: 4px;
}
.btn-trigger span:nth-of-type(2) {
  top: 12px;
}

#btn17::after {
  position: absolute;
  top: 70%;
  left: 70%;
  display: block;
  content: '';
  width: 51px;
  height: 50px;
  margin: -45px 0 0 -45px;
  border-radius: 5px;
  border: 2px solid rgba(230,0,20, 0.6);
  transition: all .75s;
}
#btn17.active span:nth-of-type(1) {
  -webkit-transform: translateY(15px) rotate(45deg);
  transform: translateY(0px) rotate(45deg);
  background-color: rgba(200,0,20, 1.0);
}
#btn17.active span:nth-of-type(2) {
  left: 60%;
  opacity: 0;
  -webkit-animation: active-btn17-bar02 .8s forwards;
  animation: active-btn17-bar02 .8s forwards;
}
@-webkit-keyframes active-btn17-bar02 {
  100% {
    height: 0;
  }
}
@keyframes active-btn17-bar02 {
  100% {
    height: 0;
  }
}
#btn17.active span:nth-of-type(3) {
  -webkit-transform: translateY(-15px) rotate(-45deg);
  transform: translateY(12px) rotate(-45deg);
  background-color: rgba(200,0,20, 1.0);
}
#btn17.active::after {
  border: 2px solid rgba(200,0,20, 1.0);
  width: 51px;
  height: 50px;
  top: 70%;
  left: 70%;
}

/*ヘッダー*/
#header{    width:100%;    height:80px;    z-index: 1;	margin-top: 0;	display: flex; border-bottom: solid 5px #eee;}
.header-rogo{	width: 130px;	margin: 20px 15px;}
.header-line{	width:2px;	height:70%;    background-color: #555;	margin:auto 0;}
.header-txt{	font-size:16px;		margin: 30px 10px;}

section{ position: fixed; z-index: 3; right: 15px; bottom: 10px;}
nav .inner ul li a { font-size: 14px;}

/*トップ*/
#top{	margin: 0;	background-color: #fff; display: block;	margin-left: auto;	margin-right: auto;}
.top-img{	width:100%;  padding-bottom: 30px; background-image: repeating-linear-gradient(30.2deg, #ff2906, #ff2906 4px, #ff2906bd 4px, #ff2906bd 7px);}
.top-message{	margin: 20px 25px 0px; padding:10px 0px; }
h0{  margin-left: 8px; margin-bottom: 0px;  font-size: 12px; font-weight: 1000; letter-spacing: 5px;}
h1{  margin-left: 20px; margin-top: -10px; font-size: 48px; letter-spacing: 2px; transform: scaleX(1.1); line-height: 1.2;}
h2{  font-size:12px;  padding: 30px 0px;  line-height: 25px;}

/*コンテンツ*/
.title{  background-image: linear-gradient(47deg, #ff2906 25px, transparent 0); padding-bottom: 5px;}
h3{ padding: 35px 20px 0px 25px;   font-size:24px; white-space: nowrap;}
h4{ border-left: solid 6px #ff2906 ;  transform: rotate(90deg); margin-top:-20px; margin-right: -30px; padding:0px 0px 2px 5px ; float: right; }
h5{ fontsize:14px; width:78%; padding:20px 12% 20px 10%; line-height: 2.3; text-align: justify;　text-justify: inter-ideograph; /* Edge */ }
h6{ fontsize:16px; margin: 5px 5%;}
.content1_img{ width:98%; margin: 0 1%;}
#content1{ margin-bottom: 20px;}


/*目次*/
.menu{margin: 50px 10%;}
h7{font-size:20px;}
a.btn {
	display: block;	vertical-align: middle;	text-decoration: none;	width: 90%;	margin: auto;	padding: 15px 5% 18px;
	font-size: 18px;	font-weight: bold;	border: 2px solid #ff2906;   border-radius: 10px;
	color: #ff2906;	cursor: pointer;	position: relative; 	overflow: hidden; 	z-index: 1; margin-bottom: 18px;  white-space: nowrap; }
a.btn::before {
	content: "";	position: absolute;  left: 0;	top: 0;
	width: 100%;	height: 100%;	background-image: repeating-linear-gradient(30.2deg, #ff2906, #ff2906 4px, #ff2906bd 4px, #ff2906bd 7px);
	transform: translateX(-83%);	transition: all .3s;	z-index: -1;}
a.btn:hover::before {	transform: translateX(0);}
a.btn:hover {	color: #fff;}
h8{ display:block; margin: -10px 0px 15px 80px; font-size:14px; font-weight: bold;}

/*会社紹介*/
h10{ display: block; font-size: 20px; border-left: solid 5px; font-weight: bolder;  width:65%; height: 100%; margin: 50px 0% 10px 10%; padding:0px 0px 0px 10px; }
h11{ display: block; font-size: 12px;  white-space: nowrap;  margin-left: 10%;  padding-top: 15px;}
.slide1img{ width:100%; margin: 0 auto;}

/*１０問*/
.bx-viewport{ margin: 0; padding: 0; }
.bx-wrapper{ margin: 0; padding: 0; border-radius: 10px;}
.slide-items__wrap{ margin: -5px 7% 25px 7%; }
.slide1img{ margin: 20px 0 0 0; width: 95%; }
.slidebg{ position: absolute; margin: 52px 0px 0px 25%; width:140px; height: 100px; z-index: 2; }
.slidebg10{ position: absolute; margin: 52px 0px 0px 25%; width:160px; height: 100px; z-index: 2; }
h16{ position: relative; display: block; margin: 30px 10% 0px 17% ; padding: 130px 22px 15px 25px;  width:155px;   color: #fff; border-radius: 20px; 
	background-image: repeating-linear-gradient(30.2deg, #ff2906, #ff2906 4px, #ff2906bd 4px, #ff2906bd 7px); font-size: 14px; font-weight: bolder; line-height: 1.6;}
h17{ display: block; margin: 30px 15% 0% 17% ; font-size: 13px; }

/*代表挨拶*/
#message{margin-bottom:60px;}
h12{ float:right; font-size: 14px;  white-space: nowrap; margin-top: -5px; margin-right: 15%; }

/*インタビュー*/
.slide2-items__wrap{ display: none; }
.slide2ph-items__wrap{ margin: -5px 7% 5px 7%;  }
.slide2ph-items__item{ margin: 20px 5px 0px 5px }
.slide2img{ margin: 10px auto 0px auto; width: 80%; }
.slide2_2img{ margin: 10px auto 0px auto; width: 70%; }
.slide3img{ margin-top: 30px; width:300px;}
.slide4img{ margin-top: 30px;　padding-left: 20px; width:340px; height: 250px;}
h23{ display: block; margin-left: -20px; width: 700px;}
h18{ display: block; padding: 7px 0px 3px 20px;  width: 65%; height: 25px; background-image: repeating-linear-gradient(30.2deg, #ff2906, #ff2906 4px, #ff2906bd 4px, #ff2906bd 7px); color: #fff; border-radius: 20px; font-size: 14px; white-space: nowrap;}
h19{ display: block; margin: 5px 15px; font-size: 24px; font-weight: bolder; letter-spacing: 2px; white-space: nowrap;}
h22{ display: block; margin: 0px 10% -10px 5%; padding: 7px 0px 7px 20px;  background-image: repeating-linear-gradient(30.2deg, #ff2906, #ff2906 4px, #ff2906bd 4px, #ff2906bd 7px); color: #fff; border-radius: 20px; font-size: 14px; }
h24{ display: block; margin: 0px 10% -10px 5%; padding: 7px 0px 10px 20px;  width: 80%; background-image: repeating-linear-gradient(30.2deg, #ff2906, #ff2906 4px, #ff2906bd 4px, #ff2906bd 7px); color: #fff; border-radius: 20px; font-size: 14px; }

/*キャリア*/
#education{margin-bottom:50px;}
.carrier{ margin-bottom: 15px;}
.carrier1{ margin: 5px 10%; width: 65%; height: 50px; padding: 10px 0px 0px 30px;
	     list-style: none; display: block; background-color: #FFEEDD; color: #ff2906;  border-radius: 5px; font-size: 13px; font-weight: bold;}
.carrier2{ margin: -5px 10% 5px 10%; padding: 20px 10px; border: 1.5px solid #888; line-height: 2;  border-radius: 5px;  font-weight: bold; background-color: rgba(255,255,255,0.8);}
.carrier3{ margin: 5px 10% 30px 10%; padding: 20px 10px; border: 1.5px solid #ff2906; color: #ff2906; line-height: 2;  border-radius: 5px;  font-weight: bold; background-color: rgba(255,255,255,0.8);}
h14{ margin: 0px 10% 0px 10%; display: block; text-align: center; font-weight: bold;}

/*採用情報*/
.info{ margin: 5px 10% -10px 5%; font-weight: bold; font-size: 13px;}
.info1{ height: 55px; padding: 15px 0px 0px 0px; text-align: center;
	    list-style: none; background-color: #eee; border-radius: 5px; }
.info2{ display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: space-between;　}
.arrow{ text-align: center;  width: 50%; color: #ff2906; margin: 5px 0;}
.info3{ text-align: center;  width: 49%; height: 40px; padding: 20px 0px 0px 0px; list-style: none; background-color: #eee; border-radius: 5px; }
.info3_br,.info3_br_ph{ margin-top: -10px;}
.info4{ width: 46%; height: 50px; padding: 20px 0px 0px 0px; list-style: none; background-color: rgba(255,255,255,0); }
#infomation h5 { font-size: 14px;}
h13{ font-size: 12px; white-space: nowrap; }

/*Q&A*/
.qa { margin: 0px 10% 0px 10%; border-bottom: 3px solid #eee; border-radius: 1.5px; }
.qa summary { display: flex; justify-content: space-between; align-items: center; position: relative; 
	  padding: 1.5em 2em 1.2em 3em; font-weight: bold; cursor: pointer; font-size: 14px;}
.qa summary::before,
.qa p::before { position: absolute; left: 1em; font-weight: 600; font-size: 16px;}
.qa summary::before { color: #ff2906; content: "Q.";}
.qa summary::after { transform: translateY(-25%) rotate(45deg); width: 7px; height: 7px; margin-left: 10px; 
	  border-bottom: 3px solid #ff2906; border-right: 3px solid #ff2906; content: ''; transition: transform .5s;}
.qa[open] summary::after {transform: rotate(225deg);}
.qa p { position: relative; transform: translateY(-15px); opacity: 0; margin: 0; padding: 1.2em 5px 1.5em 3em; color: #333; transition: transform .75s, opacity .75s;
	    font-size: 14px;}
.qa[open] p { transform: none; opacity: 1;}
.qa p::before { color: #444; line-height: 1.2; content: "A.";}

/*問い合わせ*/
.link0{margin-top: 30px; }
.link{margin: 50px auto}
.form { text-decoration: none; display: flex; justify-content: center; align-items: center; position: relative; margin: 25px 10% 15px 10%; padding:20px 0px;
    overflow: hidden; border: 2px solid #ff2906; border-radius: 5px; background-color: #fff; color: #ff2906; font-size: 18px; }
.form:hover { background-color: transparent; color: #fff;}
.form::before { position: absolute; top: 0; left: 0; z-index: -1; width: 0; height: 100%; background-image: repeating-linear-gradient(30.2deg, #ff2906, #ff2906 4px, #ff2906bd 4px, #ff2906bd 7px); content: ''; transition: width .5s ease; }
.form:hover::before { width: 100%;}



/*フッター*/
#footer{ width:100%; height:180px; background-color: #fff;	margin: 50px 0 0; border-top: solid 10px #eee;
 display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;}
.footer-rogo{ width: 100px; margin: 40px 10px;}
.footer_txt{ position: relative;　border-left: solid 2px #888 ; margin: 23px -30px; padding-left: 7px; height: 70px; font-size:12px;}
.mynabi{ position: absolute; width: 300px; margin: 105px 0px 0px 10px;}
