@charset "utf-8";
/* CSS Document */

/*------------------------------------------------------------
common.css カスタマイズ
------------------------------------------------------------*/

a, a:visited {
  color:#7dbd02;
}
table a, table a:visited {
  color:#7dbd02;
}

.to-entry a{
color:#ffffff;
}

#header-wrapper h1 img{
width:100%;
max-width: 360px;
height:auto;	
}
#jobs-mv{
width: 100%;
margin: 0 auto;
height:500px;
background: url("/design/img/jobs_mv_pc.jpg") no-repeat center;
background-size:auto 500px;
display:none;
}
#job-detail h3, #company h3 {
border-left: 2px solid #7ebd02;
}

#appeal-message {
  background: url("https://saiyou.neko-system.com/img/appeal_message.png") no-repeat top center;
   background-size: 100%;
}


#appeal #appeal-btn input {
   background: url("https://saiyou.neko-system.com/img/appeal_btn.png") no-repeat center #004492;
 background-size: 80%;
}


@media screen and (max-width:922px) {
#jobs-mv{
background: url("/design/img/jobs_mv_mb.jpg") no-repeat center top;
background-size:contain;
height:65.189048vw;
}
}

/*----------------求人毎に変わるスタイル--------------------------*/
#contents-wrapper[data-occupation="技術者（正社員）"]  #job-detail-mv,
#contents-wrapper[data-occupation="技術者（アルバイト）"]  #job-detail-mv{
background-image: url("/design/img/mv_engineer.jpg");
}
#contents-wrapper[data-occupation="デザイナ（正社員）"]  #job-detail-mv,
#contents-wrapper[data-occupation="デザイナ（アルバイト）"]  #job-detail-mv{
background-image: url("/design/img/mv_designer.jpg");
}


/*------------------------------------------------------------
募集していない時
------------------------------------------------------------*/
#appeal-wrapper section.list-nondisplay{
border: solid 2px #7ebd02;
margin-bottom:50px;
width: calc(100vw - 40px);
}
.nondisplay-img {
  padding-top: 50%;
}

.detail-nondisplay{
border:solid 3px #7ebd02;
}

/*------------------------------------------------------------
appeal.css カスタマイズ
------------------------------------------------------------*/
html,body{
font-family: "Noto Sans JP", "ヒラギノ角ゴ W6", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
}

#appeal-wrapper section {
padding: 80px 20px;
}
#appeal-wrapper section h2::after {
background:#7ebd02;
}
#appeal-wrapper #about-wrapper{
box-shadow: 1px 1px 40px 0px rgba(167,189,125,0.3);
}

#appeal-wrapper  #about-wrapper section p {
font-size:17px;
}

#appeal-wrapper #about-wrapper .about-img {
background-size: cover;
}

#appeal-wrapper .weak {
display: block;
line-height:1.4;
color:#555;
}

#appeal-wrapper #message-wrapper #message h2{
font-size:39px;
text-align:left;
line-height:2;
}

#appeal-wrapper #message-wrapper #message h2 span{
color:#7dbd02;
}

#appeal-wrapper #message-wrapper #message h2:after{
display:none;
}

#appeal-wrapper #message-wrapper #message p{
font-size:20px;
margin-bottom:50px;
line-height:2;
}

#appeal-wrapper #message-wrapper section#message{
width: 100%;
max-width:100%;
padding: 60px 0;
}
#appeal-wrapper #message-wrapper .message-box{
position: relative;
display: flex;
flex-direction: row-reverse;

}
#appeal-wrapper #message-wrapper .message-text{
padding: 30px 0 0 30px;
width: 58vw;
max-width: 760px;
margin: 0
}
#appeal-wrapper #message-wrapper .message-img{
 min-width: 40vw;
 font-size: 0;
 overflow: hidden;
 position: relative;
 background: url( "/design/img/message_bg.jpg") no-repeat left center;
 background-size: auto 100%;
 z-index: 1;
 margin: 0
}

#appeal-wrapper #message-wrapper .message-img:before {
 content: "";
 display: block;
 padding-top: 800px;
}


#appeal-wrapper #strengths-wrapper{
background:#7ebd02;
background-image: -webkit-linear-gradient( -90deg, rgb(125,189,2) 0%, rgb(169,203,3) 100%);
}

/*
#appeal-wrapper .work-detail .work-text {
  width: 50%;
  padding-right: 40px;
  padding-left: 10px;
}*/

#appeal-wrapper .work-detail .work-text h3 span.work-number:before{
color:#7ebd02;
}
#appeal-wrapper .work-detail .work-text h3 span.work-title{
color: #7ebd02;
font-size: 30px;
}
#appeal-wrapper #voice-wrapper{
background:#7ebd02;
background-image: -webkit-linear-gradient( -90deg, rgb(125,189,2) 0%, rgb(169,203,3) 100%);
}

#appeal-wrapper #voice-wrapper section h2 {
color:#fff;
}
#appeal-wrapper #voice-wrapper section h2::after {
background:#fff;
}

#appeal-wrapper #voice-wrapper section p {
color:#fff;
}
#appeal-wrapper #data li#danjo dd,
#appeal-wrapper #data li#nenrei dd {
text-align: left;
}

#appeal-wrapper #data li > span img {
filter:invert(75%) sepia(53%) saturate(5172%) hue-rotate(41deg) brightness(99%) contrast(105%);
}

#appeal-wrapper #data li#nenrei dd span {
font-size: 50px;
}

#appeal-wrapper #data li#gakureki dd span {
font-size: 40px;
}

#appeal-wrapper #data li#gakureki dd:nth-child(3n) {
margin-top: -10px;
}

#appeal-wrapper #data li#gakureki dd:last-of-type {
margin-top: -10px;
padding-left: 44px;
}

#appeal-wrapper #data ul + p{
text-align:right;
}

#appeal-wrapper #office-wrapper{
box-shadow:1px 1px 100px 0px rgba(139,202,0,0.95);

}

#appeal-wrapper #office{
counter-reset:office;
padding-bottom: 0;
}

#appeal-wrapper section#office h2 + p {
font-size: 20px;
text-align:center;
margin-bottom:50px;
}
#appeal-wrapper .office-detail{
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom:120px;
}
#appeal-wrapper .office-detail.office-detail-odd{
flex-direction: row-reverse
}
#appeal-wrapper .office-detail .office-text{
width: 50%;
padding-right: 50px;
}
#appeal-wrapper .office-detail.office-detail-odd .office-text{
padding-right: 0;
padding-left: 50px;
}

#appeal-wrapper .office-detail .office-img{
width: 50%
}
#appeal-wrapper .office-detail .office-img img{
width: 100%;
max-width: 580px;
height: auto
}
#appeal-wrapper .office-detail .office-text h3{
font-size:35px;
margin-bottom: 40px;
margin-top: 0;
display: flex;
justify-content: flex-start;
align-items: center;
}
#appeal-wrapper .office-detail .office-text h3 span.office-number{
display: block;
position: relative;
width: 100px;
height: 64px;
}
#appeal-wrapper .office-detail .office-text h3 span.office-number:before{
position: absolute;
font-size:60px;
width: 100%;
height: 100%;
counter-increment: office;
content: "0" counter(office);
top: 0;
left: 0;
color:#7dbd02;
line-height: 1
}
#appeal-wrapper .office-detail .office-text h3 span.office-title{
font-size:24px;
color: #333;
font-weight: bold;
flex: 1
}
#appeal-wrapper .office-detail .office-text p{
margin-bottom: 10px;
}

#appeal-wrapper .office-detail .office-text a{
display:flex;
justify-content:flex-start;
align-items: center;
font-size:18px;
font-weight:bold;
margin:50px auto 0;
}

#appeal-wrapper .office-detail .office-text a img{
margin-right:10px;
}



#appeal-wrapper #history-wrapper{
background: url("/design/img/history_bg.jpg") no-repeat top center;
background-size:cover;
background-attachment: fixed 
}

#appeal-wrapper section#history {
max-width:100%;
padding: 80px 0;
}


#appeal-wrapper #history-content{
background:#fff;
width: 100% ;
max-width:1560px;
margin: 0 auto;
padding:60px 20px 100px;
}

#appeal-wrapper #history .history-start{
text-align: center;
margin: 0 auto;
}

#appeal-wrapper #history-content ul{
position: relative;
width: 100%;
max-width: 1140px;
margin: 0 auto;
padding: 50px 0;
}

#appeal-wrapper #history-content ul:before{
position: absolute;
content:"";
width: 15px;
height: 15px;
background:#7dbd02;
border-radius: 50%;
left:50%;
top:0;
transform:translate(-50% , -50%);
z-index: 1
}

#appeal-wrapper #history-content ul:after {
position: absolute;
background: #616161;
content: "";
height: 100%;
left: 50%;
top: 0;
width: 1px;
}

#appeal-wrapper #history-content li{
width: 50%;
margin-top: -50px
}

#appeal-wrapper #history-content li#sougyou,
#appeal-wrapper #history-content li#genzai{
display:none;
}

#appeal-wrapper #history-content li:nth-of-type(even){
margin-left: 50%
}

#appeal-wrapper #history h3{
position: relative;
border-bottom:solid 2px #7dbd02;
color: #7dbd02;
font-size:30px;
margin-bottom: 20px;
line-height: 1.2
}

#appeal-wrapper #history .history-start h3{
border-bottom:none;
}

#appeal-wrapper #history li:nth-of-type(even) h3{
padding-left: 100px
}

#appeal-wrapper #history h3:after{
position: absolute;
content:"";
width: 15px;
height: 15px;
background:#7dbd02;
border-radius: 50%;
right:0;
bottom:0;
transform:translate(50% , 50%);
z-index: 1;
}

#appeal-wrapper #history .history-start h3:after{
display: none
}

#appeal-wrapper #history li:nth-of-type(even) h3:after{
left:0;
bottom:0;
transform:translate(-50% , 50%)
}

#appeal-wrapper .history-y{
font-size:60px;
}

#appeal-wrapper .history-m{
margin-left: 10px;
}

#appeal-wrapper #history .history-detail{
margin-right: 100px;
}

#appeal-wrapper #history .history-img{
width:100%;
max-width:470px;
height:auto;
}
#appeal-wrapper #history .history-img p{
display:none;
}

#appeal-wrapper #history .history-img iframe{
width:100%;
}

#appeal-wrapper #history .history-img img{
width:100%;
height:auto;
}

#appeal-wrapper #history .history-img a img{
transition: transform 0.2s linear;
transform-origin: left top 0;
}

#appeal-wrapper #history .history-img a img:hover{
transform: scale(1.1);
}


#appeal-wrapper #history .history-start .history-detail{
margin-right:auto;
}

#appeal-wrapper #history li:nth-of-type(even) .history-detail{
margin-right: 0;
margin-left:100px 
}

#appeal-wrapper #history h4{
font-size:20px;
margin-bottom: 20px;
}

#appeal-wrapper #history h4 span{
font-size:26px;
}

#appeal-wrapper #history .korekara{
font-size:40px;
font-weight:bold;
line-height: 2.0;
color:#7dbd02;
text-align: center;
position: relative;
margin-top: 0;
padding-top: 50px;
}

#appeal-wrapper #history .korekara:before{
position: absolute;
content:"";
width: 15px;
height: 15px;
background:#7dbd02;
border-radius: 50%;
right:50%;
top:-10px;
transform:translateX(50%);
z-index: 1;
}

#appeal-wrapper #history .mission{
text-align: center
}

#appeal-wrapper #history .mission h3{
height: 152px;
background: url("/design/img/mission_bg.gif") no-repeat center;
background-size:822px auto;
padding:60px 0;
font-size:30px;
color:#333;
text-align: center;
border: none
}

#appeal-wrapper #history .mission h3:after{
display: none
}

#appeal-wrapper #history .mission p{
font-size: 27px;
line-height: 2.0;
font-weight: bold;
text-align: center;
margin: 100px auto 60px;
}

#appeal-wrapper #history .mission p.mission-copy{
font-size:50px;

}

#appeal-wrapper #history .mission .mission-copy span{
color:#7dbd02;
}


#appeal-wrapper #flow-wrapper {
background:#7ebd02;
background-image: -webkit-linear-gradient( -90deg, rgb(125,189,2) 0%, rgb(169,203,3) 100%);
}
#appeal-wrapper section#flow h2 {
color:#fff;
}

#appeal-wrapper section#flow h2:after {
background:#fff;
}

#appeal-wrapper #flow ul li {
border:none;
}
#appeal-wrapper #flow ul li span.step {
background: #e0f4b7;
}
#appeal-wrapper #flow ul li span.step::before,
#appeal-wrapper #flow ul li span.step::after {
  color: #7ebd02;
}
#appeal-wrapper #flow ul li::after {
background:#fff;
}
#appeal-wrapper #copy {
background-image: url("/design/img/copy_pc.jpg");
background-repeat: repeat-x,no-repeat;
background-position:center top;
padding-top:618px
}

@media screen and (max-width:1000px) {
#appeal-wrapper .work-detail .work-text h3 span.work-number {
width: 45px;
height: 30px;
}
#appeal-wrapper .work-detail .work-text h3 span.work-number::before {
font-size: 30px;
}

#appeal-wrapper #message-wrapper #message h2{
font-size:25px;
text-align:center;
margin-bottom: 0;
}

#appeal-wrapper #message-wrapper #message p{
text-align:center;
font-size:16px;
}

#appeal-wrapper #message-wrapper .message-box{
flex-direction:column-reverse;

}
#appeal-wrapper #message-wrapper .message-text{
padding: 0;
width:100%;
max-width:100%;
}
#appeal-wrapper #message-wrapper .message-img{
min-width: 100%;
background: url( "/design/img/message_bg_sp.jpg") no-repeat bottom center;
background-size:100% auto;
padding-top:83%;
}

#appeal-wrapper #message-wrapper .message-img:before {
display:none;
}
#appeal-wrapper #data li#gakureki dd:last-of-type {
padding-left: 48px;
}


#appeal-wrapper section#office h2 + p {
font-size: 18px;
text-align:left;
}
#appeal-wrapper .office-detail{
display: block;
margin-bottom: 50px;
}

#appeal-wrapper .office-detail .office-text{
width: 100%;
padding-right:0;
}
#appeal-wrapper .office-detail.office-detail-odd .office-text{
padding-right: 0;
padding-left: 0;
margin: 0 auto 50px
}


#appeal-wrapper .office-detail .office-img{
margin:0 auto;
width: 100%;
text-align: center;
}
#appeal-wrapper .office-detail .office-text h3{
font-size: 27px;
}

#appeal-wrapper .office-detail .office-text h3 span.office-number{
width: 45px;
height: 30px;
}
#appeal-wrapper .office-detail .office-text h3 span.office-number:before{
font-size:30px;
}
#appeal-wrapper .office-detail .office-text h3 span.office-title{
font-size:18px;
}
#appeal-wrapper .office-detail .office-text p{
margin-bottom: 10px;
}

#appeal-wrapper .office-detail .office-text a{
font-size:16px;
}
#appeal-wrapper #history-wrapper{
background-size:cover;
}

#appeal-wrapper #history li:nth-of-type(2n) h3 {
padding-left:calc(100vw * 100 / 1000);
}
#appeal-wrapper #history .history-detail {
margin-right:calc(100vw * 100 / 1000);
}
#appeal-wrapper #history li:nth-of-type(2n) .history-detail {
margin-left:calc(100vw * 100 / 1000);
}

#appeal-wrapper #history .mission h3 {
position:relative;
height: auto;
background: url("/design/img/mission_bg.gif") no-repeat center;
background-size: auto;
background-size: 100% auto;
padding: 9% 0;
font-size: 30px;
color: #333;
text-align: center;
border: none;
margin-left: auto;
}
#appeal-wrapper #history .mission h3:before {
position:absolute;
padding-top:18.4914%;
}
}


@media screen and (max-width:800px) {
#appeal-wrapper #history .mission p.mission-copy {
font-size:calc(100vw * 40 / 700);
margin: 70px auto;

}
}

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

#appeal-wrapper .pc_only{
display:none;
}


#appeal-wrapper #message-wrapper .message-text{
padding-left:20px;
padding-right:20px;
}

#appeal-wrapper #message-wrapper #message h2{
text-align:left;
}

#appeal-wrapper #message-wrapper #message p{
text-align:left;
}

#appeal-wrapper section#history {
padding: 50px 0;
}

#appeal-wrapper #history-content{
padding: 50px 20px;
}

#appeal-wrapper #history .history-start{
display:none;
}

#appeal-wrapper #history-content li#sougyou,
#appeal-wrapper #history-content li#genzai{
display:block;
}

#appeal-wrapper #history-content li#genzai p{
font-size:16px;
font-weight:bold;
margin-bottom:40px;
}


#appeal-wrapper #history-content ul{
padding:0;
}

#appeal-wrapper #history-content ul:after {
left:0;
top: 20px;
background:#7dbd02;
}

#appeal-wrapper #history-content ul:before{
display:none;
}


#appeal-wrapper #history-content li{
width: 100%;
margin-top:50px
}

#appeal-wrapper #history-content li:nth-of-type(even){
margin-left:auto
}

#appeal-wrapper #history h3,
#appeal-wrapper #history li:nth-of-type(2n) h3{
font-size:24px;
color:#fff;
background:#7dbd02;
border-radius:5px;
padding: 5px 10px;
margin-left:50px;
line-height:1.0;
}


#appeal-wrapper #history h3:after,
#appeal-wrapper #history li:nth-of-type(even) h3:after{
left:-50px;
bottom:50%;
transform:translate(-50% , 50%)
}

#appeal-wrapper #history h3:before{
position:absolute;
content:"";
width:50px;
height:2px;
left:-50px;
bottom:50%;
background:#7dbd02;
transform:translate(0 , 50%)
}
#appeal-wrapper #history .history-start h3:after{
display: none
}

#appeal-wrapper #history li#genzai h3{
padding:20px 10px;
}

#appeal-wrapper #history-content li#genzai .history-y{
font-size:30px;
}

#appeal-wrapper #history .history-detail{
margin-right:auto;
}

#appeal-wrapper #history .history-img{
margin: 0 auto;
}
#appeal-wrapper #history .history-img a img:hover{
transform:none;
}


#appeal-wrapper #history .history-img img,
#appeal-wrapper #history .history-img iframe{
margin:0 auto;
}

#appeal-wrapper #history .history-img p{
display:block;
text-align:center;
font-weight:bold;
}




#appeal-wrapper #history .history-detail {
margin-right:auto;
margin-left:50px;
}

#appeal-wrapper #history li:nth-of-type(2n) .history-detail {
margin-left:50px;
}


#appeal-wrapper #history h4{
font-size:16px;
margin-bottom: 20px;
}

#appeal-wrapper #history h4 span{
font-size:20px;
}

#appeal-wrapper #history .korekara{
display:none;
}

#appeal-wrapper #history .korekara:before{
display:none;
}

#appeal-wrapper #history .mission{
text-align: center;
margin-top: 100px;
}



#appeal-wrapper #history .mission h3:after,
#appeal-wrapper #history .mission h3:before{
display: none
}

#appeal-wrapper #history .mission p{
font-size:16px;
}

#appeal-wrapper #history .mission .mission-copy span{
color:#7dbd02;
}
}



@media screen and (max-width: 680px) {
#appeal-wrapper #copy {
background-image: url("/design/img/copy_mb.jpg");
background-size: 100%;
height:auto;
padding-top:100%
}
#appeal-wrapper .office-description{
background-size:100% auto;
}

}

@media screen and (max-width: 500px) {
 #appeal-wrapper #history .mission h3{
font-size:calc(100vw * 25 / 500);
}
}