@charset "utf-8";
/* CSS Document */
* {
  scroll-behavior: smooth;
  margin: 0;
  padding: 0;
}
body {
  font-family: 'DotGothic16', ‘メイリオ‘, Meiryo, ‘ＭＳ Ｐゴシック’, sans-serif;
  background: url("../img/bg_sogen.png") top;
}
a {
  text-decoration: none;
  color: #000000;
}
a:hover { color: #FFFD00!important; }
/* header */
header#morning { background: url("../img/main_bg_morning.png") bottom repeat-x; }
header#daytime { background: url("../img/main_bg_daytime.png") bottom repeat-x; }
header#evening { background: url("../img/main_bg_evening.png") bottom repeat-x; }
header#night { background: url("../img/main_bg_night.png") bottom repeat-x; }
/* 鳥、カラス */
#bird { visibility: hidden; }
.bird ,
.raven {
  position: absolute;
  width: 7px;
  height: 7px;
  transform: rotate(45deg);
  animation-fill-mode: forwards;
  opacity: 0;
}
.bird { animation: birdmoving 16s linear infinite; }
.raven { animation: ravenmoving 16s linear infinite; }
.bird.type_2 ,
.raven.type_2 { animation-delay: 1s; }
.bird.type_2:before ,
.bird.type_2:after ,
.raven.type_2:before ,
.raven.type_2:after { animation-delay: -2s; }
.bird.type_3 ,
.raven.type_3 { animation-delay: 3s; }
@keyframes birdmoving {
  0% {
    top: 50px;
    right: 1vw;
    opacity: 1;
  }
  25% {
    top: 100px;
    right: 23vw;
    opacity: 1;
  }
  99% { opacity: 1; }
  100% {
    top: 50px;
    right: 101vw;
  }
}
@keyframes birdmoving-sp {
  0% {
    top: 20px;
    right: 1vw;
    opacity: 1;
  }
  25% {
    top: 80px;
    right: 23vw;
    opacity: 1;
  }
  99% { opacity: 1; }
  100% {
    top: 20px;
    right: 101vw;
  }
}
@keyframes ravenmoving {
  0% {
    top: 350px;
    right: 1vw;
    opacity: 1;
  }
  25% {
    top: 420px;
    right: 23vw;
    opacity: 1;
  }
  99% { opacity: 1; }
  100% {
    top: 400px;
    right: 101vw;
  }
}
@keyframes ravenmoving-sp {
  0% {
    top: 220px;
    right: 1vw;
    opacity: 1;
  }
  25% {
    top: 300px;
    right: 23vw;
    opacity: 1;
  }
  99% { opacity: 1; }
  100% {
    top: 280px;
    right: 101vw;
  }
}
.bird:before, .bird:after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  transform: rotate(-30deg);
  transform-origin: right bottom;
  background-color: #FFE600;
}
.raven:before, .raven:after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  transform: rotate(-30deg);
  transform-origin: right bottom;
  background-color: #7B7B7B;
}
.bird:before ,
.raven:before {
  width: 100%;
  height: 1px;
  animation: leftWing 8s linear infinite;
}
.bird:after ,
.raven:after {
  width: 1px;
  height: 100%;
  animation: rightWing 8s linear infinite;
}
@keyframes leftWing {
  0%   { transform: rotate(-30deg); }
  2%   { transform: rotate(-110deg); }
  4%   { transform: rotate(-30deg); }
  6%   { transform: rotate(-110deg); }
  8%   { transform: rotate(-30deg); }
  10%  { transform: rotate(-110deg); }
  12%  { transform: rotate(-30deg); }
  30%  { transform: rotate(-30deg); }
  42%  { transform: rotate(-35deg); }
  72%  { transform: rotate(-35deg); }
  74%  { transform: rotate(10deg); }
  76%  { transform: rotate(-30deg); }
  78%  { transform: rotate(-110deg); }
  80%  { transform: rotate(-30deg); }
  82%  { transform: rotate(-110deg); }
  84%  { transform: rotate(-30deg); }
  86%  { transform: rotate(-110deg); }
  88%  { transform: rotate(-30deg); }
  90%  { transform: rotate(-110deg); }
  92%  { transform: rotate(-30deg); }
  94%  { transform: rotate(-110deg); }
  96%  { transform: rotate(-30deg); }
  98%  { transform: rotate(-110deg); }
  100% { transform: rotate(-30deg); }
}
@keyframes rightWing {
  0%   { transform: rotate(30deg); }
  2%   { transform: rotate(110deg); }
  4%   { transform: rotate(30deg); }
  6%   { transform: rotate(110deg); }
  8%   { transform: rotate(30deg); }
  10%  { transform: rotate(110deg); }
  12%  { transform: rotate(30deg); }
  30%  { transform: rotate(30deg); }
  42%  { transform: rotate(35deg); }
  72%  { transform: rotate(35deg); }
  74%  { transform: rotate(0deg); }
  76%  { transform: rotate(30deg); }
  78%  { transform: rotate(110deg); }
  80%  { transform: rotate(30deg); }
  82%  { transform: rotate(110deg); }
  84%  { transform: rotate(30deg); }
  86%  { transform: rotate(110deg); }
  88%  { transform: rotate(30deg); }
  90%  { transform: rotate(110deg); }
  92%  { transform: rotate(30deg); }
  94%  { transform: rotate(110deg); }
  96%  { transform: rotate(30deg); }
  98%  { transform: rotate(110deg); }
  100% { transform: rotate(30deg); }
}
/* 雲 */
header#morning #kumo {
  background: url("../img/kumo_morning.png") top repeat-x;
  animation: kumo 80s linear infinite;
}
header#daytime #kumo {
  background: url("../img/kumo_daytime.png") top repeat-x;
  animation: kumo 40s linear infinite;
}
header#evening #kumo {
  background: url("../img/kumo_evening.png") top repeat-x;
  animation: kumo 40s linear infinite;
}
@-webkit-keyframes kumo {
  0% {background-position: 0 0;}
  100% {background-position: 2500px 0;}
 }
@keyframes kumo {
  0% {background-position: 0 0;}
  100% {background-position: 2500px 0;}
 }
/* 飛空艇 */
header #hikuutei {
  background: url("../img/hikuutei.png") top repeat-x;
  animation: hikuutei 25s linear infinite;
}
@-webkit-keyframes hikuutei {
  0% {background-position: 2500px 0;}
  100% {background-position: 0 0;}
 }
@keyframes hikuutei {
  0% {background-position: 2500px 0;}
  100% {background-position: 0 0;}
 }
/* 星空 */
header#night { position: relative; }
header #starrysky {
  display: none;
  position: absolute;
  top: 0;
  width: 100%;
  min-height: 500px;
}
header#night #starrysky {
  background: url("../img/starrysky.png");
  animation: blink 1.5s ease-in-out infinite alternate;
}
@keyframes blink {
  0% { opacity: 0; }
  100% { opacity: 1; }
}
header #starrysky_after {
  display: none;
  position: absolute;
  top: 0;
  width: 100%;
  min-height: 500px;
}
header #starrysky_after {
  background: url("../img/starrysky_after.png");
  animation: blinkafter 1.5s ease-in-out infinite alternate;
}
@keyframes blinkafter {
  0% { opacity: 1; }
  100% { opacity: 0; }
}
/* moon */
header #moon {
  display: none;
  position: absolute;
  top: 20px;
  left: calc(50% - 400px);
  width: 70px;
  height: 70px;
  background: url("../img/moon.png") no-repeat;
  animation: moon 3s ease-in-out infinite;
}
@keyframes moon {
  0% { transform: scale(1); }
  50% { transform: scale(0.9); }
  100% { transform: scale(1); }
}
header #header_contents {
  position: relative;
  width: 1000px;
  min-height: 390px;
  margin: 0 auto;
  padding: 110px 0 60px 0;
  background-image: url("../img/shiro.png"), url("../img/tori.png");
  background-position: left bottom 57px, right bottom 57px;
  background-repeat: no-repeat, no-repeat;
  color: #FFFFFF;
  text-align: center;
}
header #header_contents p#question {
  margin: 15px 0 30px 0;
  font-size: 26px;
  text-align: center;
}
header #header_contents p#answer {
  width: 3em;
  margin: 0 auto;
  padding-left: 25px;
  background: url("../img/icon_white_right_arrow.png") left top 10px no-repeat;
  font-size: 22px;
  text-align: left;
}
#answer a { color: #FFFFFF; }
header #header_contents #heros_party {
  position: absolute;
  left: 20%;
  bottom: 70px;
  /* アニメーションの名前 */
  animation-name:UpDown;
  /* アニメーションの１回分の長さ */
  animation-duration: 0.5s;
  /* アニメーションの回数 */
  animation-iteration-count: infinite;
  /* アニメーションの進行具合 */
  animation-timing-function: steps(2, end);
  /* アニメーション再生の向き */
  animation-direction: alternate;
  }
  /* アニメーションの設定 */
  @keyframes UpDown {
  /* 開始地点 */
  0% {
  /* Y軸10px */
  transform: translateY(10px);
  }
  /* 終了地点 */
  100% {
  /* Y軸0px */
  transform: translateY(0px);
  }
}
/* メインコンテンツ */
/* 共通 */
.contents {
  width: 1000px;
  margin: 0 auto;
  padding: 90px 30px 20px 30px;
  box-sizing: border-box;
  border: 3px solid #000000;
  border-radius: 10px;background: #FFFFFF;
  box-shadow: 2px 2px 0px #FFFFFF;
}
.contents h2 {
  margin-bottom: 40px;
  padding: 55px 0 0 0;
  color: #AAAAAA;
  font-weight: normal;
  text-align: center;
}
#message #message_contents h3 ,
#environment #environment_contents h3 {
  margin: 0 0 20px 0;
  padding: 3px;
  background: #000000;
  border-radius: 10px;
  font-weight: normal;
  text-align: center;
  color: #FFFFFF;
  clear: both;
}
#message #message_contents h3 span ,
#environment #environment_contents h3 span {
  display: block;
  padding: 13px;
  border: 2px solid #FFFFFF;
  border-radius: 8px;
  color: #FFFFFF;
}
#message #message_contents h4 ,
#environment #environment_contents h4 {
  margin-bottom: 30px;
  font-size: 20px;
  font-weight: normal;
}
.txt_area {
  overflow: hidden;
  margin-bottom: 30px;
}
.txt_area .txt_left_areaA {
  width: 700px;
  float: left;
}
.txt_area .txt_right_img_areaA {
  width: 210px;
  padding: 0 10px;
  float: right;
  text-align: center;
}
.txt_area .txt_left_areaB {
  width: 620px;
  float: left;
}
.txt_area .txt_right_img_areaB {
  width: 260px;
  float: right;
  text-align: center;
}
.txt_area .txt_left_areaC {
  width: 580px;
  float: left;
}
.txt_area .txt_right_img_areaC {
  width: 300px;
  padding: 0 20px;
  float: right;
  text-align: center;
}
.contents p.next {
  display: block;
  padding: 20px 0 0 0;
  text-align: right;
  clear: both;
}
/* スライダー共通 */
.swiper_black_area ,
.swiper_white_area {
  position: relative;
  width: 100%;
  margin-inline: auto;
  margin-bottom: 50px;
}
.swiper-pagination-bullet {
  width: 5px!important;
  height: 5px!important;
  margin: 0 8px!important;
}
.swiper-pagination-bullet-active { background: #000000!important; }
.swiper-pagination-bullets.swiper-pagination-horizontal { bottom: -30px!important; }
.swiper_contents {
  display: flex!important;
  align-items: stretch;
}
/* スライダー黒 */
.swiper_black {
  padding: 20px!important;
  background: #000000;
  border-radius: 10px;
  color: #FFFFFF;
}
.swiper_black .swiper_contents .swiper_data { width: 300px; }
.swiper_black .swiper_contents section {
  padding: 15px 0;
  border: 3px solid #FFFFFF;
  border-radius: 8px;
}
.swiper_black .swiper_contents .swiper_data section:first-child { margin-bottom: 20px; }
.swiper_black .swiper_contents .swiper_message_txt {
  display: flex;
  width: 580px;
  margin-left: 20px;
}
.swiper_black .swiper_contents section h3 {
  margin-bottom: 15px;
  padding: 0 20px 15px 20px;
  border-bottom: 3px solid #FFFFFF;
  font-weight: normal;
  text-align: center;
  line-height: 1;
}
.swiper_black .swiper_contents section p { padding: 0 15px 5px 15px; }
/* スライダー白 */
.swiper_white {
  margin-bottom: 70px;
  padding: 20px!important;
  border: 3px solid #000000;
  border-radius: 10px;
}
.swiper_white .swiper_contents .swiper_txt {
  width: 450px;
  margin: 0 15px 0 10px;
}
.swiper_white .swiper_contents .swiper_txt h3 { padding: 15px!important; }
.swiper_white .swiper_contents .swiper_photo { margin: 0 10px; }
.swiper_white .swiper_contents .swiper_photo img { width: 100%; }
/* スライダー カードタイプ */
.swiper_card {
  position: relative;
  width: min(100%, 800px);
  margin-top: 50px;
  margin-inline: auto;
}
.swiper-3d { perspective: 840px!important; }
.swiper-button-prev,
.swiper-button-next {
    width: 44px!important;
    height: 26px!important;
}
.swiper-button-prev::after,
.swiper-button-next::after {
    content: ""!important;
    background-size: contain;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
}
.swiper-button-prev::after { background-image: url("../img/position/recruit_swiper_left.png");}
.swiper-button-next::after { background-image: url("../img/position/recruit_swiper_right.png");}
.swiper_card .swiper-slide {
  background-image:
    url("../img/position/recruit_swiper_bg_left_top.png"),
    url("../img/position/recruit_swiper_bg_right_top.png"),
    url("../img/position/recruit_swiper_bg_left_bottom.png"),
    url("../img/position/recruit_swiper_bg_right_bottom.png"),
    url("../img/position/recruit_swiper_bg.png") ;
  background-repeat: no-repeat no-repeat, no-repeat, no-repeat;
  background-position: left 10px top 10px, right 10px top 10px, left 10px bottom 10px, right 10px bottom 10px, left top;
  height: 400px;
  padding: 10px;
  box-sizing: border-box;
}
.swiper_card .swiper-slide .swiper_card_contents { padding: 20px 70px; }
.swiper_card .swiper-slide .swiper_card_contents h4 {
  margin-bottom: 20px;
  font-size: 20px;
  font-weight: normal;
  text-align: center;
}
.swiper_card .swiper-slide .swiper_card_contents p { padding-bottom: 20px; }
.swiper_card .swiper-slide .swiper_card_contents .swiper_card_contents_2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 10px;
}
/* 事業紹介 */
#business {
  padding: 50px 0 30px 0;
  background:
    url("../img/bg_renga_gray.png") top repeat-x,
    url("../img/bg_dairiseki_black.png") top;
}
#business .contents {
  background-image: url("../img/business/icon_business.png");
  background-position: center 30px;
  background-repeat: no-repeat; 
}
#business h2 { background: url("../img/business/h2_title_business.png") top center no-repeat; }
#business #business_contents {
  display: grid;
  grid-template-columns: 300px 1fr 300px;
}
#business #business_contents section:nth-child(2) { margin: 0 17px; }
#business #business_contents h3 {
  width: 300px;
  padding: 3px;
  background: #000000;
  border-radius: 10px;
  font-weight: normal;
  text-align: center;
  box-sizing: border-box;
}
#business #business_contents h3 span {
  display: block;
  padding: 13px;
  border: 2px solid #FFFFFF;
  border-radius: 8px;
  color: #FFFFFF;
}
#business #business_contents div {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px;
}
/* メッセージ */
#message {
  padding: 30px 0;
  background: url("../img/bg_jutan.png");
}
#message .contents {
  background-image: url("../img/message/icon_message.png");
  background-position: center 30px;
  background-repeat: no-repeat; 
}
#message h2 { background: url("../img/message/h2_title_message.png") top center no-repeat; }
/* 先輩からのメッセージ */
#seniors_message {
  padding: 30px 0 50px 0;
  background:
    url("../img/bg_renga_gray.png") bottom repeat-x,
    url("../img/bg_dairiseki_white.png") top;
}
#seniors_message .contents {
  background-image: url("../img/seniors_message/icon_seniors_message.png");
  background-position: center 30px;
  background-repeat: no-repeat; 
}
#seniors_message h2 { background: url("../img/seniors_message/h2_title_seniors_message.png") top center no-repeat; }
/* 環境 */
#environment {
  padding: 30px 0;
  background: url("../img/bg_hana.png") top;
}
#environment .contents {
  background-image: url("../img/environment/icon_environment.png");
  background-position: center 30px;
  background-repeat: no-repeat; 
}
#environment h2 { background: url("../img/environment/h2_title_environment.png") top center no-repeat; }
#environment #environment_contents h3 { padding: 3px; }
#environment #environment_contents #sdgs_declaration section {
  margin-bottom: 20px;
  border: 3px solid #000000;
  border-radius: 10px;
}
#environment #environment_contents #sdgs_declaration section h3 {
  margin-bottom: 0;
  padding: 20px 0 20px 50px;
  background: url("../img/icon_black_bottom_arrow.png") left 20px center no-repeat;
  background-color: none;
  border-radius: 0;
  color: #000000;
  text-align: left;
  line-height: 1;
}
#environment #environment_contents #sdgs_declaration section h3.active {
  background: url("../img/icon_black_top_arrow.png") left 20px center no-repeat;
}
#environment #environment_contents #sdgs_declaration section .txt_area {
  display: none;
  margin: 0;
  padding: 20px;
  border-top: 3px solid #000000;
}
#environment #environment_contents #sdgs_declaration section .initiatives {
  margin-top: 15px;
  font-size: 14px;
}
#environment #environment_contents #sdgs_declaration section .initiatives ul {
  margin: 0;
  padding: 0;
  list-style: inside;
}
/* その他 */
#our_data {
  padding: 30px 0;
  background:
    url("../img/bg_sabaku_01.png") top repeat-x,
    url("../img/bg_sabaku_02.png") top;
}
#our_data .contents {
  background-image: url("../img/our_data/icon_our_data.png");
  background-position: center 30px;
  background-repeat: no-repeat; 
}
#our_data h2 { background: url("../img/our_data/h2_title_our_data.png") top center no-repeat; }
#our_data #our_data_contents {
  display: grid;
  grid-template-columns: 300px 1fr 300px;
  margin-top: 30px;
}
#our_data #our_data_contents section {
  margin-bottom: 17px;
  padding: 0 0 20px 0;
  border: 3px solid #000000;
  border-radius: 10px;
}
#our_data #our_data_contents section:nth-child(2) ,
#our_data #our_data_contents section:nth-child(5) { margin: 0 17px 17px 17px; }
#our_data #our_data_contents section h3 {
  margin-bottom: 20px;
  padding: 10px 20px;
  border-bottom: 3px solid #000000;
  font-size: 22px;
  font-weight: normal;
  text-align: center;
}
#our_data #our_data_contents section p {
  padding: 0 20px 20px 20px;
  font-size: 20px;
}
#our_data #our_data_contents section p:last-child { padding: 0 20px; }
#our_data #our_data_contents section p img { margin-left: 55px; }
#our_data #our_data_contents section div {
  margin: 0 20px 20px 20px;
  text-align: center;
}
#our_data #our_data_contents section div.our_data_img2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 10px 20px 0 20px;
}
#our_data #our_data_contents section div.our_data_img2col section {
  margin: 0!important;
  padding: 0;
  border: none;
  text-align: center;
}
#our_data #our_data_contents section div.our_data_img2col section p { padding: 0; }
/* 募集中のポジション */
#position {
  padding: 30px 0;
  background:
    url("../img/bg_umi_01.png") top repeat-x,
    url("../img/bg_umi_02.png") top;
}
#position .contents {
  background-image: url("../img/position/icon_position.png");
  background-position: center 30px;
  background-repeat: no-repeat; 
}
#position h2 { background: url("../img/position/h2_title_position.png") top center no-repeat; }
#position #position_contents {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  margin-top: 30px;
  padding: 10px;
  background: #000000;
  border-radius: 10px;
}
#position #position_contents section {
  position: relative;
  margin: 8px;
  padding: 0;
  background: #FFFFFF;
  border: 3px solid #FFFFFF;
  border-radius: 10px;
}
#position #position_contents section div.not_recruiting {
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: url("../img/position/img_not_recruiting.png");
  background-color: rgba(0,0,0,0.4);
  background-position: center bottom 50px;
  background-repeat: no-repeat;
  border-radius: 10px;
}
#position #position_contents section h3 {
  padding: 10px;
  background: #000000;
  border-radius: 10px 10px 0 0;
  color: #FFFFFF;
  text-align: center;
  font-size: 20px;
  font-weight: normal;
}
#position #position_contents section div {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 160px;
}
#position #position_contents section a { display: block; }
#position #position_contents section a { display: block; }
#position #position_contents section a p {
  position: relative;
  margin: 10px;
  padding: 18px 35px 18px 15px;
  border-radius: 10px;
  background: #000000 url("../img/icon_white_right_arrow.png") right 15px center no-repeat;
  color: #FFFFFF;
  text-decoration: none;
  line-height: 1;
  box-sizing: border-box;
}
#position #position_contents section a p::after {
  position: absolute;
  content: "";
  top: 2px;
  bottom: 2px;
  left: 2px;
  right: 2px;
  border: 2px solid #FFFFFF;
  border-radius: 8px;
}
#position #position_contents section a:hover p { color: #FFFD00; }
/* 選考フロー */
#selection_flow {
  padding: 30px 0 40px 0;
  background:
    url("../img/bg_mori_01.png") top repeat-x,
    url("../img/bg_mori_03.png") bottom repeat-x,
    url("../img/bg_mori_02.png") top;
}
#selection_flow .contents {
  background-image: url("../img/selection_flow/icon_selection_flow.png");
  background-position: center 30px;
  background-repeat: no-repeat; 
}
#selection_flow h2 { background: url("../img/selection_flow/h2_title_selection_flow.png") top center no-repeat; }
#selection_flow #selection_flow_contents {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}
#selection_flow #selection_flow_contents h3 {
  width: 290px;
  padding: 3px;
  background: #000000;
  border-radius: 10px;
  font-weight: normal;
  text-align: center;
  box-sizing: border-box;
}
#selection_flow #selection_flow_contents h3 span {
  display: block;
  padding: 13px;
  border: 2px solid #FFFFFF;
  border-radius: 8px;
  color: #FFFFFF;
}
#selection_flow #selection_flow_contents div {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100px;
  padding: 20px 40px 20px 20px;
}
#selection_flow #selection_flow_contents section div { background: url("../img/icon_black_right_arrow.png") right center no-repeat; }
#selection_flow #selection_flow_contents section:last-child div { background: none; }
/* リンク */
ul#link_area {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 1000px;
  margin: 0 auto;
  padding: 60px 0;
  list-style: none;
}
ul#link_area li {
  margin: 10px;
  box-sizing: border-box;
  border: 3px solid #000000;
  border-radius: 10px;
  background: url("../img/link_icon_kaidan.png") #FFFFFF right 20px center no-repeat;
  box-shadow: 2px 2px 0px #FFFFFF;
  font-size: 22px;
}
ul#link_area li:hover {
  background: url("../img/link_icon_kaidan.png") #FFFD00 right 20px center no-repeat!important;
  border-radius: 10px;
  color: #000000!important;
}
ul#link_area li#corporate_link { background: url("../img/link_icon_shiro.png") #FFFFFF right 20px center no-repeat; }
ul#link_area li#corporate_link:hover { background: url("../img/link_icon_shiro.png") #FFFD00 right 20px center no-repeat!important; }
ul#link_area li a {
  display: block;
  padding: 30px 90px 30px 30px;
}
ul#link_area li:hover a { color: #000000!important; }
/* 採用共通 */
header#recruit h1 ,
header#recruit_list h1 ,
header#recruit_entry h1 {
  display: block;
  padding: 60px 0 0 0;
  font-size: 24px;
  font-weight: normal;
  text-align: center;
}
#recruit_list_area h2 ,
#recruit_entry h2 {
  margin-bottom: 40px;
  text-align: center;
  font-size: 28px;
  font-weight: normal;
}
/* 採用詳細 */
header#recruit {
  background-image: url("../img/bg_renga_gray2.png") , url("../img/bg_renga_white.png") , url("../img/bg_renga_gray2.png") , url("../img/bg_renga_white2.png") ;
  background-position: top, 0 30px, bottom, 0 60px;
  background-repeat: repeat-x, repeat-x, repeat-x, repeat;
}
header#recruit #recruit_pg {
  align-content: center;
  width: 1000px;
  height: 330px;
  margin: 0 auto;
  background-image: url("../img/position/main_img_pg.png") , url("../img/position/recruit_bg_img.png") ;
  background-position: left 40px center, right bottom 30px;
  background-repeat: no-repeat, no-repeat;  
}
header#recruit #recruit_se {
  align-content: center;
  width: 1000px;
  height: 330px;
  margin: 0 auto;
  background-image: url("../img/position/main_img_se.png") , url("../img/position/recruit_bg_img.png") ;
  background-position: left 40px center, right bottom 30px;
  background-repeat: no-repeat, no-repeat;  
}
header#recruit #recruit_pg h1 { background: url(../img/position/h1_title_programmer.png) top center no-repeat; }
header#recruit #recruit_se h1 { background: url(../img/position/h1_title_systems_engineer.png) top center no-repeat; }
#recruit_main_contents {
  padding: 30px 0 60px 0;
  background-image: url("../img/bg_renga_gray2.png") ;
  background-position: bottom;
  background-repeat: repeat-x;
  background-color: #000000;
}
#recruit_contents {
  width: 1000px;
  margin: 0 auto;
  padding: 30px 30px;
  box-sizing: border-box;
  background-image: url("../img/position/recruit_contents_bg_top.png") , url("../img/position/recruit_contents_bg_bottom.png") , url("../img/position/recruit_contents_bg_center.png") ;
  background-position: top, bottom, 0 144px;
  background-repeat: no-repeat, no-repeat, repeat;
  border-radius: 8px 8px 0px 0px;
}
#recruit_contents #favorable_conditions {
  margin-bottom: 50px;
  padding: 10px;
  background: #FFFFFF;
  border-radius: 8px;
}
#recruit_contents #favorable_conditions div {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
#recruit_contents #favorable_conditions div section {
  display: grid;
  grid-template-columns: 50px 1fr;
	align-items: center;
  background-position: left center;
  background-repeat: no-repeat;
}
#recruit_contents #favorable_conditions #point {
  margin-top: 30px;
  padding-left: 150px;
  background: url("../img/position/icon_point.png") no-repeat; 
}
#recruit_contents #about_us {
  width: 920px;
  margin: 0 auto;
  padding: 10px;
  background: url("../img/position/ai_field_bg.png") no-repeat;
  background-size: cover;
  box-sizing: border-box;
}
#recruit_contents #about_us div {
  padding: 20px 30px;
  background-color:  rgba(255,255,255,0.8);
}
#recruit_contents #about_us div h2 {
	background: none;
  color: #000000;
	font-size: 20px;
}
#recruit_contents #aptitude {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 50px 0;
}
#recruit_contents #aptitude section {
  margin: 0 10px;
  padding: 20px;
  box-sizing: border-box;
  position: relative;
}
#recruit_contents #aptitude #severity {
  background: url("../img/position/ai_shop01_bg.png") no-repeat;
  background-size: cover;
  background-position: center;
}
#recruit_contents #aptitude #fitness {
  background: url("../img/position/ai_shop02_bg.png") no-repeat;
  background-size: cover;
  background-position: center;
}
#recruit_contents #aptitude section::after {
  position: absolute;
  content: "";
  top: 20px;
  bottom: 20px;
  left: 20px;
  right: 20px;
  background: rgba(0,0,0,0.6);
  border: 5px solid rgba(255,255,255,0.6);
}
#recruit_contents #aptitude section div {
  position: relative;
  z-index: 10;
  padding: 10px;
  box-sizing: border-box;
  color: #FFFFFF;
}
#recruit_contents #aptitude section div h3 {
  margin-bottom: 20px;
  padding: 0 10px 10px 10px;
  text-align: center;
  font-size: 20px;
  font-weight: normal;
  border-bottom: 1px solid #FFFFFF;
}
#recruit_contents #aptitude section div p {
  margin-bottom: 20px;
  font-size: 14px;
}
#recruit_contents .category_area {
  margin: 50px 0;
  padding: 50px 0 0 0;
  border-top: 2px dashed #876A49;
}
#recruit_contents h2 {
  margin-bottom: 40px;
  padding: 10px;
  background-image: url("../img/position/img_categoryh2_left.png"), url("../img/position/img_categoryh2_right.png") ,linear-gradient(90deg, rgba(42,29,7,1) 0%, rgba(71,50,13,1) 30%, rgba(71,50,13,1) 70%, rgba(42,29,7,1) 100%);
  background-repeat: no-repeat, no-repeat;
  background-position: left bottom, right bottom;
  font-size: 22px;
  font-weight: normal;
  text-align: center;
  line-height: 1.6;
  color: #FFFFFF;
}
#recruit_contents h2#catchphrase {
  margin-bottom: 40px;
  text-align: center;
  font-size: 28px;
  font-weight: normal;
	background: none;
	color: #000000;
}
#recruit_contents .category_area h3 {
  margin: 30px 0;
  padding: 10px 10px 30px 10px;
  background-image: url("../img/position/category_h3_bg_left.png"), url("../img/position/category_h3_bg_right.png");
  background-repeat: no-repeat, no-repeat;
  background-position: left bottom, right bottom;
  font-size: 22px;
  font-weight: normal;
  text-align: center;
  position: relative;
}
#recruit_contents .category_area h3::after {
  position: absolute;
  border-bottom: 2px solid #78664f;
  content: "";
  bottom: 10px;
  left: 14px;
  right: 14px;
}
#recruit_contents .category_area .category_area_contents_2col {
  display: grid;
  grid-template-columns: 520px 1fr;
}
#recruit_contents .category_area .category_area_contents_2col section { padding: 0 15px; }
#recruit_contents .category_area .category_area_contents_2col section#step article {
  margin-bottom: 40px;
  box-sizing: border-box;
}
#recruit_contents .category_area .category_area_contents_2col section#step article p {
  width: 310px;
  height: 140px;
  padding-top: 65px;
  text-align: center;
  box-sizing: border-box;
}
#recruit_contents .category_area .category_area_contents_2col section#step article#step1 {
  background: url("../img/position/step1_icon_img.png") no-repeat bottom right 80px;
}
#recruit_contents .category_area .category_area_contents_2col section#step article#step1 p {
  background: url("../img/position/step1_bg.png") no-repeat center;
}
#recruit_contents .category_area .category_area_contents_2col section#step article#step2 {
  background: url("../img/position/step2_icon_img.png") no-repeat bottom left 80px;
}
#recruit_contents .category_area .category_area_contents_2col section#step article#step2 p {
  margin-left: auto;
  background: url("../img/position/step2_bg.png") no-repeat center;
}
#recruit_contents .category_area .category_area_contents_2col section#step article#step3 {
  background: url("../img/position/step3_icon_img.png") no-repeat bottom right 80px;
}
#recruit_contents .category_area .category_area_contents_2col section#step article#step3 p {
  background: url("../img/position/step3_bg.png") no-repeat center;
}
#recruit_contents .category_area .category_area_contents_2col section#naitei {
  padding: 270px 0 0 0;
  background: url("../img/position/step4_icon_img.png") no-repeat top center;
}
#recruit_contents .category_area .category_area_contents_2col section#naitei article {
  padding: 20px;
  background-color: rgba(175,162,147,0.2);
}
#recruit_contents .category_area .category_area_contents_2col section#naitei article p {
  padding-bottom: 20px;
  font-size: 14px;
  line-height: 1.8;
}
#recruit_contents #apply_link {
  width: 400px;
  margin: 60px auto;
  box-sizing: border-box;
  border: 3px solid #000000;
  border-radius: 10px;
  box-shadow: 2px 2px 0px #FFFFFF;
  font-size: 22px;
}
#recruit_contents #apply_link a {
  display: block;
  padding: 20px 90px 20px 20px;
  background: url(../img/position/recruit_link_btn.png) #FFFFFF right 20px center no-repeat;
  border-radius: 10px;
}
#recruit_contents #apply_link a:hover {
  background: url("../img/position/recruit_link_btn.png") #FFFD00 right 20px center no-repeat!important;
  border-radius: 10px;
  color: #000000!important;
}
/* 採用一覧 */
header#recruit_list {
  background-image: url("../img/bg_sogen.png") , url("../img/bg_ground.png") , url("../img/bg_sky_wall.png");
  background-position: 0 270px, bottom, top;
  background-repeat: repeat-x, repeat-x, repeat-x;
}
header#recruit_list #recruit_pg {
  align-content: center;
  width: 1000px;
  height: 330px;
  margin: 0 auto;
  background-image: url("../img/position/main_img_pg.png") ;
  background-position: left 40px center;
  background-repeat: no-repeat;  
}
header#recruit_list #recruit_se {
  align-content: center;
  width: 1000px;
  height: 330px;
  margin: 0 auto;
  background-image: url("../img/position/main_img_se.png") ;
  background-position: left 40px center;
  background-repeat: no-repeat;  
}
header#recruit_list #recruit_pg h1 { background: url(../img/position/h1_title_programmer.png) top center no-repeat; }
header#recruit_list #recruit_se h1 { background: url(../img/position/h1_title_systems_engineer.png) top center no-repeat; }
#recruit_list_contents {
  padding: 30px 0 60px 0;
  background: url("../img/bg_umi_01.png") top repeat-x,
    url("../img/bg_umi_02.png") top;
}
#recruit_list_area {
  width: 1000px;
  margin: 0 auto;
  padding: 30px 30px;
  box-sizing: border-box;
	background: #FFFFFF;
	border: 3px solid #000000;
  border-radius: 8px;
  box-shadow: 2px 2px 0px #FFFFFF;
}
#recruit_list_data {
	display: grid;
	grid-template-columns: 1fr 1fr;
}
#recruit_list_data section {
	position: relative;
	margin: 10px;
	padding: 10px 10px 80px 10px;
	border: 3px solid #000000;
	border-radius: 10px;
}
#recruit_list_data section h3 {
	margin-bottom: 20px;
	padding-bottom: 10px;
	border-bottom: 2px solid #000000;
  font-size: 18px;	
	font-weight: normal;
}
#recruit_list_data section a {
	display: block;
	position: absolute;
	right: 10px;
	bottom: 10px;
	width: 160px;
	color: #FFFFFF;
}
#recruit_list_data section a:hover { color: #FFFD00!important; }
#recruit_list_data section a p {
	position: relative;
	padding: 13px 35px 13px 15px;
	border-radius: 10px;
	background: #000000 url(../img/icon_white_right_arrow.png) right 15px center no-repeat;
	text-decoration: none;
	line-height: 1;
	box-sizing: border-box;
}
#recruit_list_data section a p::after {
  position: absolute;
  content: "";
  top: 2px;
  bottom: 2px;
  left: 2px;
  right: 2px;
  border: 2px solid #FFFFFF;
  border-radius: 8px;
}
/* 採用エントリーフォーム */
header#recruit_entry {
  background-image: url("../img/bg_sogen.png") , url("../img/bg_renga_gray2.png") , url("../img/bg_sky_wall.png");
  background-position: 0 270px, bottom, top;
  background-repeat: repeat-x, repeat-x, repeat-x;
}
header#recruit_entry #recruit_entry_form {
  align-content: center;
  width: 1000px;
  height: 330px;
  margin: 0 auto;
  background-image: url("../img/position/img_entry_man.png") , url("../img/position/img_entry_castle.png") ;
  background-position: left 20px bottom 55px, right 20px bottom 55px;
  background-repeat: no-repeat, no-repeat;  
}
header#recruit_entry #recruit_entry_form h1 { background: url(../img/position/h1_title_entryform.png) top center no-repeat; }
#recruit_contents #privacy_policy_txt_area { padding: 60px 0; }
#recruit_contents #privacy_policy_txt_area p#privacy_policy_title { padding-bottom: 20px; }

#recruit_contents form {
	display: flex;
	flex-direction: column;
}
#recruit_contents #entry_form_area dl {
	margin: 60px 0 30px 0;
	border-top: 1px dotted #BDAC9A;
}
#recruit_contents #entry_form_area dl dt {
	float: left;
	width: 260px;
	padding: 20px 0;
}
#recruit_contents #entry_form_area dl dt strong {
	color: #D20101;
	font-weight: normal;
}
#recruit_contents #entry_form_area dl dd {
	min-height: 65px;
  box-sizing: border-box;
	padding: 20px 0 20px 260px;
	border-bottom: 1px dotted #BDAC9A;
}
#recruit_contents #entry_form_area dl dd div { padding-top: 10px; }
#recruit_contents #entry_form_area dl dd input[type="text"] ,
#recruit_contents #entry_form_area dl dd input[type="email"] ,
#recruit_contents #entry_form_area dl dd select ,
#recruit_contents #entry_form_area dl dd textarea {
	width: 100%;
	padding: 10px;
	box-sizing: border-box;
	border: 1px solid #CCCCCC;
	border-radius: 6px;
	font-size: 16px;
}
#recruit_contents #entry_form_area dl dd input[type="radio"] { accent-color: #707070; }
#recruit_contents #entry_form_area dl dd .wpcf7-list-item {
	display: block;
	margin: 0 0 5px 0;
}
#recruit_contents #entry_form_area dl dd input[name="your-birthday"] { width: 200px!important; }
#recruit_contents #entry_form_area dl dd input[name="your-age"] ,
#recruit_contents #entry_form_area dl dd div#tel_area input ,
#recruit_contents #entry_form_area dl dd div#postal_code_area input ,
#recruit_contents #entry_form_area dl dd input[name="graduation-year"] {
	width: 80px!important;
}
#recruit_contents #entry_form_area dl dd .select_area select {
	-webkit-appearance: none;
	appearance: none;
	padding-right: 2em;
}
#recruit_contents #entry_form_area dl dd .select_area select::-ms-expand { display: none; }
#recruit_contents #entry_form_area dl dd .select_area {
	position: relative;
  display: block;
	padding-top: 0;
}
#recruit_contents #entry_form_area dl dd .select_area:has(select)::after {
  content: '▼';
  position: absolute;
  right: 10px;
  top: 20px;
  transform: translateY(-50%);
  pointer-events: none;
  color: #707070;
	font-size: 12px;
}
#recruit_contents #entry_form_btn_area {
	order: 2;
	margin: 60px 0;
	text-align: center;
}
#recruit_contents #entry_form_btn_area input[type="submit"] {
	width: 400px;
  padding: 15px 35px 18px 25px;
  border-radius: 10px;
  background: #000000 url(../img/icon_white_right_arrow.png) right 25px center no-repeat;
  text-decoration: none;
  line-height: 1;
  box-sizing: border-box;
	border: none;
	outline: 2px solid #ffffff;
  outline-offset: -4px;
  font: inherit;
	font-size: 22px;
	text-align: left;
	color: #FFFFFF;
}
#recruit_contents #entry_form_btn_area button::after {
  position: absolute;
  content: "";
  top: 2px;
  bottom: 2px;
  left: 2px;
  right: 2px;
  border: 2px solid #FFFFFF;
  border-radius: 8px;
}
#recruit_contents #entry_form_area span.error { padding-top: 10px; }
/* Contact Form 7のフォーム下表示メッセージ */
.wpcf7 form .wpcf7-response-output {
	border-color: #df2a4a!important;
  background: #FFFFFF;
	margin: 1em 0.5em;
	padding: 10px;
	color: #df2a4a;
}
/* Contact Form 7のフォーム下　送信完了メッセージの非表示 */
.wpcf7 form.sent .wpcf7-response-output { display: none; }
/* CF7のsubmit押下時のloading画像非表示 */
.wpcf7-spinner { display: none; }
/* footer */
footer {
  padding: 20px 0;
  text-align: center;
}
.textSplitLoad { display: none; }
.split { visibility: hidden; }
/* ふっかつのじゅもん */
#jumon {
  position: fixed;
  right: 20px;
  bottom: 20px;
  padding: 2px;
  background: #000000;
  border-radius: 10px;
  z-index: 10;
}
#jumon a {
  display: block;
  padding: 5px 35px 5px 10px;
  background: url("../img/icon_white_top_arrow.png") right 10px center no-repeat;
  border: 2px solid #FFFFFF;
  border-radius: 8px;
  color: #FFFFFF;
  text-decoration: none;
}
/* 共通クラス */
.txt_r { text-align: right; }
.clear { clear: both; }
.pc { display: inherit; }
.sp { display: none; }