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


/*===============================

    common
    
      sales:#47b5c7
      creator:#ee8d3f
      designer:#e0394c
      engineer:#a5ce5f
      ai:#d75299
      seminar:#5d5ca7
      
================================*/
:root { font-size: 62.5%;}/* 1(r)em = 10px */

:root.index { height: 100%; }

body {
  color: #3E3A39;
  font-family:YuGothic , '游ゴシック' , 'Hiragino Kaku Gothic ProN' , 'ヒラギノ角ゴ ProN' , Meiryo , 'メイリオ' , sans-serif;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1;
  height: 100%;
  text-align: left;
  width: 100%;
}


li { list-style-type: none; }

.fl { float: left; }
.fr { float: right; }
.mb30 { margin-bottom: 30px; }
.fb { font-weight: 700; }
.ac { text-align: center; }

#wrapper {
  height: 100%;
  width: 100%;
  position: relative;
  /*z-index: 1;*/
}

.section {
  background-repeat: no-repeat;
  background-size: contain;
  position: relative;
  height: 100vh;
  width: 100vw;
}

.section.last { height: auto; }

.normalTtl {
  color: #4b93d8;
  font-size: 25px;
  letter-spacing: 15px;
  font-weight: 700;
  margin: 30px 0 110px;
  text-align: center;
}

/*
    animation
================================*/
@keyframes show{
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}

/* トップページ */
@keyframes coverW {
  from { transform:  scaleX(0);opacity: 1; }
  to {  transform: scaleX(1);opacity: 1; }
}

@keyframes moveUp {
  from { transform: translateY(20px);opacity: 0; }
  to { transform: translateY(0px);opacity: 1; }
}

@keyframes moveDown {
  from { transform: translateY(-20px);opacity: 0; }
  to { transform: translateY(0px);opacity: 1; }
}


/* ふわっと */
.fuwatAnime {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1.5s;
 -ms-animation-duration:1.5s;
 animation-duration:1.5s;
 -webkit-animation-name: fuwatAnime;
 -ms-animation-name: fuwatAnime;
 animation-name: fuwatAnime;
 visibility: visible !important;
}
@-webkit-keyframes fuwatAnime {
 0% { opacity: 0; -webkit-transform: translateY(20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fuwatAnime {
 0% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}


/* 点滅 */
.blinking{
  -webkit-animation:blink 1.3s ease-in-out infinite alternate;
    -moz-animation:blink 1.3s ease-in-out infinite alternate;
    animation:blink 1.3s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}


/*===============================

    ヘッダー

================================*/
/*
    グローバルナビ
================================*/
.header {
  align-items: center;
  background-color: rgba(255,255,255,0.8);
  box-sizing: border-box;
  display: flex;
  height: 80px;
  justify-content: flex-start;
  padding: 0 15px;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9999;
  /*transform: translate3d(0,0,-1px);
  -webkit-transform: translate3d(0,0,-1px);*/
}


nav { width: 100%; }

.gnavi {
  align-items: center;
  display: flex;
  flex-flow: row;
  font-size: 18px;
  font-weight: 700;
  justify-content: space-between;
  margin: auto;
  width: 100%;
  max-width: 1485px;
}

.gnavi > li {
  /*flex: 200px 1 1;*/
  line-height: 1;
  text-align: center;
}

.gnavi > li > a {
  color: #3e3a39;
  display: block;
  text-decoration: none;
  transition: .3s;
}

.gnavi > li > a:hover {
  color: #4b93d8;
}


.gnavi > li  span {
  display: block;
  font-size: 1.2rem;
  margin-top: 8px;
}

/* 赤いボタン */
.gnavi > li > a.addLink {
  background-color: crimson;
  color: #fff;
  padding: 10px 5px;
  transition: .3s;
  width: 135px;
}

.gnavi > li > a.addLink:hover { opacity: 0.6; }





/*===============================

    トップページ

================================*/
/* 追加ココカラ */
.section.topPage {
  height: 100%;
  width: 100%;
}

.fixedBg {
  background-image:url("../../img/recruit/topimg_new-recruit-2019.jpg");
  background-attachment: fixed;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 100%;
  position: relative;
}

.fixedBg_icon {
  margin: auto;
  position: absolute;
  right: 0;
  bottom: 5%;
  left: 0;
  width: 53px;
}

@media screen and (min-width:768px){
.fixedBg_icon.pc { display: block; }
.fixedBg_icon.mobile { display: none; }
}

@media screen and (max-width:768px){
.fixedBg_icon.pc { display: none; }
.fixedBg_icon.mobile { display: block; }
}


.scrollBg {
  background-color: #fff;
  height: auto;
}

.keyMsg {
  font-size: 32px;
  font-weight: 530;
  letter-spacing: 17px;
  line-height: 2.7;
  margin: 100px 0;
  text-align: center;
}

.topMenuBox { width: 100%; }

.topMenu {
font-size: 0;
margin: 0 auto 80px;
width: 1200px;
}

.topMenu > li {
  background-repeat: no-repeat;
  background-position: left top;
  font-size: 25px;
  font-weight: 700;
  height: 277px;
  width: 1200px;
}

.topMenu > .topMenu_aboutUs { background-image: url("../../img/recruit/top_about-us.jpg"); }
.topMenu > .topMenu_insData { background-image: url("../../img/recruit/top_insource-data.jpg"); }
.topMenu > .topMenu_msg { background-image: url("../../img/recruit/top_message.jpg"); }
.topMenu > .topMenu_interview { background-image: url("../../img/recruit/top_interview_04.jpg"); }
.topMenu > .topMenu_recruit { background-image: url("../../img/recruit/top_recruit.jpg"); }

.topMenu > li > a {
  display: block;
  height: 100%;
  position: relative;
  transition: .3s;
  width: 100%;
}

.topMenu > li > a:hover {
  background-color: rgba(255, 255, 255, .5);
  opacity: .6;
}

.topMenu > li > a > span {
  color: #3e3a39;
  display: block;
  line-height: 1.3;
  position: absolute;
  text-align: center;
}
.topMenu > li > a > span > span {
display: block;
font-size: 18px;
}

.topMenu > li.topMenu_aboutUs > a > span {
  top: 40%;
  right: 11%;
}

.topMenu > li.topMenu_insData > a > span {
  top: 40%;
  left: 5%;
}

.topMenu > li.topMenu_msg > a > span {
  top: 40%;
  right: 14%;
}

.topMenu > li.topMenu_interview > a > span {
  top: 40%;
  left: 11%;
}

.topMenu > li.topMenu_recruit > a > span {
  top: 40%;
  right: 7%;
}
/* 追加ココマデ */



/* タイトル */
.typeOfJob {
  color: #3e3a39;
  font-size: 68px;
  letter-spacing: 10px;
  opacity: 0;
  text-align: center;
  transition: all 3s .1s;
  transform: translateX(-100%);
}

.typeOfJob.reverse { transform: translateX(100%); }

.typeOfJob.slideIn {
  opacity: 1;
  transform: translateX(0);
}

.typeOfJob br { display: none; }

@media screen and (max-width:1300px){
  .typeOfJob {
    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff;
  }
}

.typeOfJob > span:first-of-type {
  display: block;
  font-size: 23px;
  font-weight: 500;
  letter-spacing: 5px;
  margin-bottom: 20px;
}

.typeOfJob > span:nth-of-type(2) {
  font-family: 'Lato', sans-serif;
  font-weight: 700;
}

.exampleSche {
  padding: 200px 80px 0 30px;
  width: 40vw;
}

@media screen and (max-width:1300px){
.exampleSche { width: 60vw; }

}/* @media */

/* 名前 */
.personal {
  font-size: 1.8rem;
  margin: 10% auto;
  text-align: center;
  width: 77px;
}

.personal > span {
  animation-play-state:paused;
  display: block;
  opacity: 0;
}

/* animation */
.personal.running > span:nth-of-type(1) {
  opacity: 0;
  animation: moveUp 1s ease 1.5s alternate forwards;
  animation-play-state: running;
}

.personal.running > span:nth-of-type(3) {
  opacity: 0;
  animation: moveDown 1s ease 1.5s alternate forwards;
  animation-play-state: running;
}

.personal.running > span:nth-of-type(2) {
  border-top: 3px solid #ccc;
  margin: 10px 0;
  /*opacity: 1;*/
  animation: coverW .5s ease 1s alternate forwards;
  animation-play-state: running;
}


/*
    スケジュール
================================*/
.timeSchedule {
  align-items: center;
  background-color: rgba(255,255,255,0.5);
  display: flex;
  justify-content: space-between;
  margin: auto;
  padding: 10px;
  width: 40vw;
}

/* 時間軸 */
.timeAxis {
  display: flex;
  flex-flow: column wrap;
  justify-content: space-between;
  position: relative;
  z-index: 1;
}

.timeAxis::before {
  border-right: 2px solid #3e3a39;
  content: "";
  height: 98%;
  position: absolute;
  top: 2px;
  left: 5%;
  width: 2px;
  z-index: -1;
}


.timeBtn {
  cursor: pointer;
  padding-left: 1.3em;
  position: relative;
  text-indent: -1.3em;
}

.timeBtn + .timeBtn { margin-top: 33px; }

.timeBtn::before {
  background-color: #fff;
  border: 2px solid #3e3a39;
  border-radius: 100%;
  content: "";
  display: inline-block;
  height: 10px;
  margin-right: 5px;
  vertical-align: middle;
  width: 10px;
}

.timeBtn.is-on::before { 
  background-color: #3e3a39;
  border-color: #3e3a39;
}

.timeSchedule .timeBtn::after {
  position: absolute;
  top: 0;
  /*left: -55%;*/
  left: -20%
}

.timeBtn.time0530::after { content: "05:30"; }
.timeBtn.time0545::after { content: "05:45"; }
.timeBtn.time0550::after { content: "05:50"; }
.timeBtn.time0600::after { content: "06:00"; }
.timeBtn.time0620::after { content: "06:20"; }
.timeBtn.time0630::after { content: "06:30"; }
.timeBtn.time0650::after { content: "06:50"; }
.timeBtn.time0700::after { content: "07:00"; }
.timeBtn.time0725::after { content: "07:25"; }
.timeBtn.time0735::after { content: "07:35"; }
.timeBtn.time0800::after { content: "08:00"; }
.timeBtn.time0810::after { content: "08:10"; }
.timeBtn.time0815::after { content: "08:15"; }
.timeBtn.time0820::after { content: "08:20"; }
.timeBtn.time0830::after { content: "08:30"; }
.timeBtn.time0900::after { content: "09:00"; }
.timeBtn.time0930::after { content: "09:30"; }
.timeBtn.time1000::after { content: "10:00"; }
.timeBtn.time1100::after { content: "11:00"; }
.timeBtn.time1200::after { content: "12:00"; }
.timeBtn.time1230::after { content: "12:30"; }
.timeBtn.time1300::after { content: "13:00"; }
.timeBtn.time1330::after { content: "13:30"; }
.timeBtn.time1400::after { content: "14:00"; }
.timeBtn.time1500::after { content: "15:00"; }
.timeBtn.time1600::after { content: "16:00"; }
.timeBtn.time1630::after { content: "16:30"; }
.timeBtn.time1700::after { content: "17:00"; }
.timeBtn.time1730::after { content: "17:30"; }
.timeBtn.time1800::after { content: "18:00"; }
.timeBtn.time1830::after { content: "18:30"; }
.timeBtn.time1900::after { content: "19:00"; }
.timeBtn.time1930::after { content: "19:30"; }
.timeBtn.time2000::after { content: "20:00"; }


/* 文章 */
.timeScheduleBox {
  width: 65%;
}

.timeSchedule_content {
  animation: show .8s linear 0s;
  display: none;
  font-size: 1.6rem;
  line-height: 1.3;
  padding: 10px;
}

.timeSchedule_content > p:first-of-type {
  font-size: 1.8rem;

}

.timeSchedule_content > p:first-of-type > img {
  vertical-align: -6px;
  margin-right: 10px;
}

.timeSchedule_content > p + p { margin-top: 33px; }

/* インタビューへのリンク */
.intvwLink {
  color: #3e3a39;
  border: 1px solid #333;
  border-radius: 8px;
  display: inline-block;
  padding: 5px;
  text-decoration: none;
  transition: .3s;
  vertical-align: 9px;
}

.intvwLink:hover {
  color: #3e3a39;
  opacity: 0.6;
  text-decoration: none;
}

.sales .intvwLink { border-color: #47b5c7; }
.creator .intvwLink { border-color: #ee8d3f; }
.designer .intvwLink { border-color: #e0394c; }
.engineer .intvwLink { border-color: #a5ce5f; }
.ai .intvwLink { border-color: #d75299; }


.rashikuIntvwLink {
  margin-right: 5px;
  transition: .3s;
  vertical-align: bottom;
}

.rashikuIntvwLink:hover { opacity: 0.6; }

.rashikuIntvwLink img[src*="rashiku_icon_e.svg"] {
  height: auto;
  margin-right: 5px;
  width: 20px;
}



/*
    スライダー
================================*/
.section.slider { position: relative; }

.sliderBox {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.topSlider {
  display: none;
}

.topSlider.slick-initialized {
  display: block;
}

.topSlider_l {
  width: 50%;
}

.topSlider_r {
width: 50%;
}

.keyTxt {
  color: #fff;
  font-size: 84px;
  font-weight: 700;
  letter-spacing: 20px;
  line-height: 1.3;
  position: absolute;
  bottom: 0;
  left: 0;
}

@media screen and (max-width:1300px){
.keyTxt { font-size: 126px; }
}

@media screen and (min-width:1300px){
.keyTxt { font-size: 160px; }
}

.keyTxt_s {
  color: #fff;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: normal;
  line-height: 1.3;
  position: absolute;
  right: 10px;
  bottom: 20px;
  width: 43%;
}

.slick-slide img {
  height: 100vh;
  width: 100%;
}

.ofi {
  object-fit: cover;
  object-position: top;
  font-family: 'object-fit: cover; object-position: top;'
}


/*
    営業
================================*/
.section.sales {
  background-image: url("../../img/recruit/topimg_eigyo.jpg");
  background-position: right top;
}

.sales .personal > span:nth-of-type(2) {
  display: block;
  border-top: 2px solid #47b5c7;
  margin: 10px 0;
}

.timeSchedule.sales  { flex-direction: row-reverse; }

.timeSchedule.sales .timeAxis::before { border-right-color: #47b5c7; }
.timeSchedule.sales .timeBtn::before { border-color: #47b5c7; }
.timeSchedule.sales .timeBtn.is-on::before { background-color: #47b5c7; }

.timeSchedule.sales .timeBtn::after { left: -33%; }



/*
    クリエーター
================================*/
.section.creator {
  background-image: url("../../img/recruit/topimg_creator.jpg");
  background-position: left top;
  display: flex;
  flex-direction: row-reverse;
}

.creator .personal > span:nth-of-type(2) {
  display: block;
  border-top: 2px solid #ee8d3f;
  margin: 10px 0;
}


.timeSchedule.creator  {
flex-direction: row;
padding-left: 55px;
}

.timeSchedule.creator .timeAxis::before {
border-right-color: #ee8d3f;
left: 3%;
}

.timeSchedule.creator .timeBtn::before { border-color: #ee8d3f; }
.timeSchedule.creator .timeBtn.is-on::before { background-color: #ee8d3f; }

/*.timeSchedule.creator .timeBtn::after { left: -30%; }*/


/*
    デザイナー
================================*/
.section.designer {
  background-image: url("../../img/recruit/topimg_designer.jpg");
  background-position: right top;
  display: flex;
  flex-direction: row;
}

.designer .personal > span:nth-of-type(2) {
  display: block;
  border-top: 2px solid #e0394c;
  margin: 10px 0;
}


.timeSchedule.designer  {
flex-direction: row-reverse;
/*padding-left: 55px;*/
}

.timeSchedule.designer .timeAxis::before {
  border-right-color: #e0394c;
  left: 3%;
}

.timeSchedule.designer .timeBtn::before { border-color: #e0394c; }
.timeSchedule.designer .timeBtn.is-on::before { background-color: #e0394c; }

/*.timeSchedule.designer .timeBtn::after { left: -33%; }*/


/*
    エンジニア
================================*/
.section.engineer {
  background-image: url("../../img/recruit/topimg_engineer.jpg");
  background-position: left top;
  display: flex;
  flex-direction: row-reverse;
}

.engineer .personal > span:nth-of-type(2) {
  display: block;
  border-top: 2px solid #a5ce5f;
  margin: 10px 0;
}


.timeSchedule.engineer  {
flex-direction: row;
padding-left: 55px;
}

.timeSchedule.engineer .timeAxis::before {
  border-right-color: #a5ce5f;
  left: 3%;
}

.timeSchedule.engineer .timeBtn::before { border-color: #a5ce5f; }
.timeSchedule.engineer .timeBtn.is-on::before { background-color: #a5ce5f; }

/*.timeSchedule.engineer .timeBtn::after { left: -30%; }*/


/*
    AI担当
================================*/
.section.ai {
  background-image: url("../../img/recruit/topimg_ai.jpg");
  background-position: right top;
  display: flex;
  flex-direction: row;
}

.ai .personal > span:nth-of-type(2) {
  display: block;
  border-top: 2px solid #d75299;
  margin: 10px 0;
}


.timeSchedule.ai  {
flex-direction: row-reverse;
/*padding-left: 55px;*/
}

.timeSchedule.ai .timeAxis::before {
  border-right-color: #d75299;
  left: 3%;
}

.timeSchedule.ai .timeBtn::before { border-color: #d75299; }
.timeSchedule.ai .timeBtn.is-on::before { background-color: #d75299; }

/*.timeSchedule.ai .timeBtn::after { left: -38%; }*/


/*
    公開講座担当
================================*/
.timeSchedule.seminar  {
flex-direction: row-reverse;
/*padding-left: 55px;*/
}

.timeSchedule.seminar .timeAxis::before {
  border-right-color: #5d5ca7;
  left: 3%;
}

.timeSchedule.seminar .timeBtn::before { border-color: #5d5ca7; }
.timeSchedule.seminar .timeBtn.is-on::before { background-color: #5d5ca7; }

/*.timeSchedule.semianr .timeBtn::after { left: -38%; }*/



/*===============================

    ABOUTO US

================================*/
.section.aboutUs {
  height: auto;
  width: 1200px;
  margin: 0 auto;
}

.contentsBox {
  background-repeat: no-repeat;
  /*background-size: contain;*/
  /*min-height: calc(100vh * 1.1);*/
  position: relative;
  z-index: 1;
}

.contentsBox.box1 {
  background-image: url("../../img/recruit/about-us_img01.jpg");
  background-position: top right;
  padding-top: 100%;
}

.contentsBox.box2 {
  background-image: url("../../img/recruit/about-us_img02.jpg");
  background-position: top left;
  padding-top: 85%;
  z-index: -1;
}

.contentsBox.box3 { margin: 140px 0 4%; }

.contentsBox.box4 {
  margin: 150px 0 4%;
  text-align: center;
}


.imgBox { position: absolute; }

.transparencyBox {
  background-color: rgba(255,255,255,0.8);
  box-sizing: border-box;
  font-size: 1.5rem;
  height: auto;
  padding: 58px 39px;
  position: absolute;
  width: 40%;
}

.transparencyBox > p {
  line-height: 1.5;
}

.transparencyBox > .tbTtl {
  font-size: 25px;
  font-weight: 700;
}

.transparencyBox > p + p { margin-top: 35px; }

/* 画像 */
.imgBox.box1 {
 top: 78%;
 left: 30%;
 z-index: 3;
}

.imgBox.box2 {
 top: 31.1%;
 left: 50.4%;
 z-index: 3;
}

.transparencyBox.box1 {
  top: 22%;
  left: 0;
  z-index: 2;
}

.transparencyBox.box2 {
  top: 61%;
  right: 5%;
  z-index: 2;
}

.transparencyBox.box3 {
  top: 29%;
  left: 0;
  width: 35%;
  z-index: 2;
}

.transparencyBox.box4 {
  top: 70%;
  right: 5%;
  z-index: 2;
}

.transparencyBox.box2::before {
  border: 27px solid transparent;
  border-top: 27px solid #F9E426;
  border-left: 27px solid #F9E426;
  content: "";
  display: block;
  height: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
}/* 黄色い三角 */

.transparencyBox.box4::before {
  background-color: #F9E426;
  content: "";
  display: block;
  height: 40px;
  position: absolute;
  top: 0;
  left: -36px;
  width: 20px;
}/* 黄色い三角 */

.transparencyBox.box4::after {
  border: 2px solid #F9E426;
  content: "";
  display: block;
  height: 21px;
  position: absolute;
  top: 9%;
  left: -9%;
  width: 15px;
}/* 黄色い三角 */


.step { display: table; }

.step2 { padding-left: 40%; }

.step3 { padding:  2% 0 0 3.4%; }

.step4 {
  padding-top: 10%;
  position: relative;
  text-align: center;
}

.step4 > img:nth-of-type(1) {
  position: absolute;
  top: 16%;
  left: 2%;
}

.step4 > img:nth-of-type(2) {
  position: absolute;
  top: 0;
  right: 3%;
}


.step > img {
  display: table-cell;
  padding-right: 10px;
  vertical-align: top;
}

.step > span {
  display: table-cell;
  padding: 5px;
  vertical-align: top;
}

/*
    研修以外のサービス
================================*/

.otherService {
  align-items: stretch;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between
}

.otherService_logo { margin-bottom: 20px; }

.otherService_dl {
  font-size: 1.6rem;
  line-height: 1.5;
  margin-left: 10%;
}

.otherService_inner {
  width: 48%;
}

.otherService_name {
  font-size: 1.8rem;
  font-weight: 700;
}

.otherService_detail {
  margin: 10px 0 80px;
}


.contentsBox.box4 > p:nth-last-of-type(1) { margin-top: 40px; }





/*===============================

    INSOURCE DATA

================================*/
.section.insNum {
  height: auto;
  margin: auto;
  width: 1200px;
}

.section.insNum > p {

  font-size: 1.8rem;
  line-height: 1.6;
  margin-bottom: 40px;
  text-align: center;
}

.tileFlex {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
}

.tileFlex_inner {
  cursor: pointer;
  overflow: hidden;
  position: relative;
}

.tileImg > img { display: block; }

.tileTxt {
  color: #fff;
  font-size: 3.5rem;
  font-weight: 700;
  height: 100%;
  letter-spacing: 3px;
  margin: auto;
  opacity: 1;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  text-align: center;
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
  transition: .3s;
  width: 100%;
}

.tileFlex_inner:hover .tileTxt {
  opacity: 1;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

.tileTxt > span {
  display: block;
  height: 3.5rem;/* font-size */
  margin: auto;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
}

.tileTxt.double > span { height: calc(3.5rem * 2); }/* 2行の場合 */


.tileTxt.red { background-color: rgba(224,54,76,0.7); }
.tileTxt.green { background-color: rgba(204,226,163,0.7); }
.tileTxt.pink { background-color: rgba(215,106,166,0.7); }
.tileTxt.blue { background-color: rgba(62,181,199,0.7); }
.tileTxt.orange { background-color: rgba(238,141,63,0.7); }


.section.insNum > .comments{margin-top:3rem;    text-align: right;    font-size: 1.4rem;}




/*===============================

    MESSAGE

================================*/
.section.message {
height: auto;
width: 100%;
max-width: 1200px;
margin: 0 auto;
}

.contentsBox_msg {
  background-repeat: no-repeat;
  position: relative;
}

.contentsBox_msg.box1 {
  background-image: url("../../img/recruit/messeage_img01.jpg");
  background-position: top center;
  padding-top: 100%
}

.contentsBox_msg.box2 {
  background-image: url("../../img/recruit/messeage_img02.jpg");
  background-position: top right;
  padding-top: 72%;
}

.contentsBox_msg.box3 {
  background-image: url("../../img/recruit/messeage_img03.jpg");
  background-position: 40% top;
  padding-top: 74%;
}

.contentsBox_msg.box4 {
  margin: 40px 0 4%;
  text-align: center;
}


.imgBox_msg { position: absolute; }

.transparencyBox_msg {
  background-color: rgba(255,255,255,0.8);
  box-sizing: border-box;
  font-size: 1.5rem;
  height: auto;
  padding: 58px 39px;
  position: absolute;
  width: 40%;
}

.transparencyBox_msg > p {
  line-height: 1.5;
}

.transparencyBox_msg > .tbTtl {
  font-size: 25px;
  font-weight: 700;
}

.transparencyBox_msg > p + p { margin-top: 35px; }

/* 画像 */
.imgBox_msg.box1 {
 top: 55%;
 left: 58%;
 z-index: 3;
}

.imgBox_msg.box2 {

 top: 86%;
 left: 29%;
 z-index: 3;
}

.imgBox_msg.box3 {
 top: 72%;
 left: 71%;
 z-index: 3;
}

.imgBox_msg.box4 {
 top: 24%;
 left: 15.5%;
 z-index: 3;
}

.transparencyBox_msg.box1 {
  top: 34%;
  left: 8.3%;
  z-index: 2;
}

.transparencyBox_msg.box2 {
  top: 70%;
  right: 5%;
  z-index: 2;
}

.transparencyBox_msg.box3 {
  top: 11%;
  left: 10%;
  width: 38%;
  z-index: 2;
}

.transparencyBox_msg.box4 {
  top: 9%;
  right: 0;
  width: 45%;
  z-index: 2;
}

.transparencyBox_msg.box5 {
  margin: 0 auto;
  right: 0;
  bottom: 0;
  left: 0;
  width: 80%;
  z-index: 2;
}

.transparencyBox_msg.box2::before {
  border: 3px solid #F9E426;
  content: "";
  display: block;
  height: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}/* 黄色い線 */

.presSign { text-align: right; }





/*===============================

    INTERVIEW

================================*/
.section.interviewTop {
  box-sizing: border-box;
  height: auto;
  width: 1200px;
  margin: 0 auto;
}

/* 新規ココカラ */
.intvwList {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
}

.intvwList_inner {
  font-size: 0;
  margin-bottom: 65px;
  transition: .5s;
}

.intvwList_img > a {
  display: block;
  height: auto;
  position: relative;
  width: 290px;
}

.intvwList_img > a::before {
  content: "";
  display: block;
  padding-top: 100%; 
}

.intvwList_img img {
  position: absolute;
  top: 0;
  left: 0;
}

.listImg_off {
  opacity: 1;
  transition: .5s;
  z-index: 2;
}

.listImg_off {
  z-index: 1;
}

a:hover > .listImg_off { opacity: 0; }

/* flex box左揃え用 */
.intvwList_inner-last {
  height: 0;
  padding: 0;
  margin: 0;
  visibility: hidden;
  width: 290px;
}

.intvwList_inner-last p { line-height: 0; }


/* 新規ココマデ */






.intvwMenu {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
}

.intvwMenu_inner {
  flex: calc(100% / 5) 0 0;
  font-size: 0;
  height: 100vh;
  margin-bottom: 65px;
  min-width: 303px;
  width: calc(100% / 5);
  transition: .5s;
}

.intvwMenu_inner a:hover .sales { background-color: #47b5c7; }
.intvwMenu_inner a:hover .creator { background-color: #ee8d3f; }
.intvwMenu_inner a:hover .designer { background-color: #e0394c; }
.intvwMenu_inner a:hover .engineer { background-color: #a5ce5f; }
.intvwMenu_inner a:hover .ai { background-color: #d75299; }
.intvwMenu_inner a:hover .seminar { background-color: #5d5ca7; }

.intvwMenu_inner > a {
  display: block;
  margin: auto;
/*  width: 303px;*/
}

/* flex box左揃え用 */
.intvwMenu_inner-last {
  height: 0;
  padding: 0;
  margin: 0;
  visibility: hidden;
}

.intvwMenu_inner-last p { line-height: 0; }


/* 写真 */
.menuImg {
height: 703px;
position: relative;
width: 303px;
}

.menuImg > img {
  position: absolute;
  top: 0;
  transition: .5s;
}

.menuImg_off {
  opacity: 1;
  z-index: 2;
}

a:hover .menuImg_off {
  opacity: 0;
}

.menuImg_on {
  z-index: 1;
}

/* 名前と職種 */
.personalIntvw {
  background-color: #111;
  color: #fff;
  font-size: 2.3rem;
  height: calc(100vh - 703px);
  position: relative;
  transition: .5s;
  width: 303px;
}

.personalIntvw_inner {
  height: calc(2.3rem * 2.5);
  margin: auto;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  text-align: center;
  width: 55%;
font-size: 1.8rem;
}

.personalIntvw_inner > p:first-of-type {
  border-bottom: 1px solid #fff;
  font-family:Georgia, "Times New Roman", Times, "serif";
  letter-spacing: 3px;
  padding-bottom: 10px;
  margin-bottom: 10px;
}

/* 座談会 */
.intvwMenu_roundTbl {
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-start;
}

.roundTblLink { position: relative; }

.roundTblLink + .roundTblLink { margin-left: 20px; }

.roundTblLink > a { transition: .3s; }

.roundTblLink > a:hover { opacity: 0.6; }


.roundTblLink > a >span {
background-color: crimson;
border-radius: 2px;
color: #fff;
display: block;
font-size: 1.6rem;
margin: auto;
padding: 5px;
position: absolute;
top: auto;
right: 0;
bottom: 15px;
left: 0;
text-align: center;
width: 80%;
}

/*
    個別ページ
================================*/
.section.interview {
  box-sizing: border-box;
  height: auto;
  width: 100%;
}

.section.interview + .section {
  margin: 180px auto 0;
  width: 1200px;
}

.section.interview + .section.mtL { margin-top: 316px; }

.intvwTopImg { position: relative; }

.intvwTopImg > img {
  height: 100vh;
  width: 100%
}

.catchCopyBox {
  background-color: rgba(255,255,255,0.5);
  font-size: 3.5rem;
  font-weight: 500;
  line-height: 1.7;
  padding: 25px;
  position: absolute;
  top: 60%;
  left: 6%;
  width: 30%;
}

@media screen and (max-width:1300px){
.catchCopyBox { width: 40%; }

}

.catchCopyBox.right {
  right: 10%;
  left: auto;
}

.catchCopyBox::before {
  border: 40px solid transparent;
  border-top: 40px solid #333;
  border-left: 40px solid #333;
  content: "";
  display: block;
  height: 0;
  position: absolute;
  top: -15px;
  left: -15px;
  width: 0;
}

.catchCopy {
  color: #000;
  font-weight: 500;
}

.intvwName {
  color: #000;
  font-size: 1.8rem;
  text-align: right;
}

.catchCopyBox.sales::before {
  border-top-color: #47b5c7;
  border-left-color: #47b5c7;
}

.catchCopyBox.salescolumn::before {
  border-top-color: #F86359;
  border-left-color: #F86359;
}

.catchCopyBox.creator::before {
  border-top-color: #ee8d3f;
  border-left-color: #ee8d3f;
}

.catchCopyBox.designer::before {
  border-top-color: #e0394c;
  border-left-color: #e0394c;
}

.catchCopyBox.engineer::before {
  border-top-color: #a5ce5f;
  border-left-color: #a5ce5f;
}

.catchCopyBox.ai::before {
  border-top-color: #d75299;
  border-left-color: #d75299;
}

.catchCopyBox.seminar::before {
  border-top-color: #5d5ca7;
  border-left-color: #5d5ca7;
}

.catchCopyBox.roundTbl::before {
  border-top-color: #F9E426;
  border-left-color: #F9E426;
}

/* 項目 */
.intvwQuestion {
  -ms-align-items: center;
  align-items: center;
  background-image: url("../../img/recruit/interview/interview_q01.png");
  background-position: left top;
  background-repeat: no-repeat;
  color: #479dff;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  font-size: 2.5rem;
  min-height: 211px;
  line-height: 2;
  margin-bottom: 52px;
  padding-left: 160px;
}

.intvwQuestion.second { background-image: url("../../img/recruit/interview/interview_q02.png"); }
.intvwQuestion.third { background-image: url("../../img/recruit/interview/interview_q03.png"); }

.intvwMsg {
  color: #479dff;
  font-size: 2.5rem;
  margin-bottom: 20px;
}

.intvwBox {
  font-size: 1.7rem;
  line-height: 1.6;
  margin: auto;
  width: 1200px;
}

.intvwBox::after{
  content: "";
  display: table;
  clear: both;
}

.intvwBoxTxt .firstLine {
  display: block;
  font-size: 2.8rem;
  margin-bottom: 10px;
}

.intvwBoxImg { position: relative; }

.intvwBoxImg > img:nth-of-type(2) {
  height: auto;
  position: absolute;
  left: 35%;
  top: 70%;
  width: auto;
}

/* ===== 写真一覧 ===== */
.intvwBox__inner {}
.intvwBox__photoBox {
  display: flex;
  flex-wrap: wrap;
  margin: -10px;
}

.intvwBox__photoBoxItem {
  box-sizing: border-box;
  padding: 10px;
}

.intvwBox__photoBoxItem > img {
  height: auto;
  vertical-align: bottom;
  width: 100%;
}

.intvwBox .intvwBox__inner .intvwBox__photoBoxItem + .intvwBox__photoBoxItem { margin-top:0 }

@media screen and (max-width:1300px){
.intvwBoxTxt  { width: 45%; }
.intvwBoxImg  { width: 45%; }
.intvwBoxImg > img {
  display: block;
  height: auto;
  width: 100%;
}
}/* @media */

@media screen and (min-width:1300px){
.intvwBoxTxt  { width: 45%; }
.intvwBoxImg  { width: 50%; }
.intvwBoxImg > img {
  display: block;
  height: auto;
  max-width: 100%;
  width: auto;
}

}/* @media */

.intvwBoxTxt-fullWidth  { width: 100%; }

/* 座談会 */
.section.interview + .section.roundTbl { margin-top: 50px; }

.intvwBoxTxt_roundTbl {
  width: 100%;
}

.intvwSubTtl {
  font-size: 2.5rem;
  font-weight: 500;
  margin: 80px 0 30px;
}

.roundTblTxt {
padding-left: 130px;
}

.intvwBoxTxt_roundTbl {}

.intvwBoxImg_roundTbl.fr { margin: 0  0 30px 30px }

.roundTblTxt.facilitator {
font-weight: 700;
}

.roundTblTxt + p { margin-top: 30px; }


.nameTag {
background-color: #797979;
border-radius: 5px;
color: #fff;
float: left;
font-size: 1.4rem;
padding: 5px;
margin-left: -130px;
text-align: center;
width: 100px;
}

.nameTag_1st { background-color: limegreen; }
.nameTag_2nd { background-color: royalblue; }
.nameTag_3rd { background-color: red; }
.nameTag_4th { background-color: #FFA500; }


.section.interview .timeScheduleBox { width: 45%; }

.section.interview .timeSchedule {
  flex-direction: row;
  margin: auto;
  padding-left: 0;
  position: relative;
  width: 90%;
}

.section.interview .timeSchedule::before {
  content: url("/resource/img/recruit/interview/interview_click.png");
  position: absolute;
  left: 44%;
  top: -13%;
}

.intvwScheImgBox { width: 40%; }

.intvwScheImg {
    animation: show .8s linear 0s;
    display: none;
    font-size: 1.6rem;
    line-height: 1.3;
    padding: 10px;
}

.intvwScheImg > img {
  height: auto;
  width: 85%;

}


.backlinkIntvw {
  text-align: center;
}

.backlinkIntvw a {
  border: 2px solid #333;
  border-radius: 5px;
  color: #333;
  display: inline-block;
  font-size: 1.8rem;
  margin: 50px 0;
  padding: 10px;
  text-decoration: none;
  transition: .3s;
}

.backlinkIntvw a:hover { opacity: 0.6; }


/*
    プロジェクトストーリー
================================*/
.section.pjStory {
  box-sizing: border-box;
  height: auto;
  width: 100%;
}

.section.pjStory + .section {
    margin: 180px auto 0;
  width: 1200px;
}

.catchCopyBox.pjStory {
  background-color: inherit;
  top: 50%;
  left: 0;
  width: 50%;
}

@media screen and (max-width:1300px){
.catchCopyBox.pjStory {width: 60%;}
}

.catchCopyBox.pjStory::before { content: none; }

.catchCopy span {
  display: inline-block;
  background-color: rgba(255,255,255,.8);
  padding: 0 16px;
}

.p_heading-image {
  margin-bottom: 50px;
  text-align: center;
}

.p_heading-image > span {
  display: block;
  margin-top: 10px;
}

.intvwQuestion.pjStory { color: #ff970b; }
  
.c_txt-normal {
  font-size: 1.7rem;
  line-height: 1.6;
}

/* 大きい写真 */
.intvwBox_img-wide {
  margin: 30px 0;
}

/* 横並び */
.intvwBox_img-sideBySide {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: space-between;
  margin: 30px 0;
}

.intvwBoxImg.right > img:nth-of-type(2) { left: auto; right: 35%; }

/* 最後の真ん中寄せ画像 */
.intvwBoxImg-center {
  margin: auto;
  max-width: 700px;
  width: 100%;
}

/* MEMBER */
.memberBox {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -o-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: space-between;
}

.memberBox_inner {}

.memberBox_img {}

.memberBox_name {
  line-height: 1.5;
  margin-top: 10px;
  text-align: center;
}

/* カラムボックス */
.p_columnBox {
  column-count: 2;
  column-width: 45%;
  width: 100%;
}

.colorBoard {
  -ms-align-items: center;
  align-items: center;
  background-color: #ccc;
  border: 1px solid #fff;
  box-shadow: 0px 0px 0px 10px #ccc;
  box-sizing: border-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  margin: 80px auto;
  padding: 20px;
  width: calc(100% - 20px);
}

.colorBoard-orange {
  background-color: #ff970b;
  box-shadow: 0px 0px 0px 10px #ff970b;
  color: #fff;
}

/* 写真が二枚の時 */
.colorBoard.mt-dbl { margin-top: 160px; }


.colorBoard_icon {
  text-align: center;
  width: 200px;
}

.colorBoard_txtBox { flex: 1 1 0%; }

.colorBoard_txt {
  font-size: 1.7rem;
  line-height: 1.6;
  margin-left: 20px;
}

.colorBoard_txt + .colorBoard_txt { margin-top: 10px; }

.colorBoard_txt.ttl {
  font-weight: bold;
}

.intvwBox p + p { margin-top: 50px; }

.intvwBoxTxt-center {
  margin: 30px auto;
  width: 700px;
}

@media screen and (max-width: 768px) {
  .colorBoard_icon { margin-bottom: 20px; }
}

/*===============================

    RECRUIT

================================*/
.section.recruit {
height: auto;
width: 100%;
max-width: 960px;
margin: 0 auto;
}

.normalTtl.sub {
  color: #3E3A39;
  font-size: 2.3rem;
  margin-bottom: 50px;
}

.guideline {
  font-size: 1.8rem;
  line-height: 1.5;
  margin-bottom: 80px;
  overflow: hidden;
}

.guideline > dt {
  float: left;
  font-weight: 700;
  padding: 15px;
}

.guideline > dd {
  padding: 15px 0 15px 170px;
}

.guideline.result > dt { text-align: center; }

/* 採用の流れ */
.guideline.flow > dd { position: relative; }

.guideline.flow > dd::after {
  content: "\f175";
  font-family: FontAwesome;
  position: absolute;
  top: 41px;
  left: 38px;
  right: 0;
}

.guideline.flow > dd:nth-of-type(2)::after { top: 56px; }

.guideline.flow > dd:nth-of-type(3)::after { top: 71px; }

.guideline.flow > dd:last-child::after { content:""; }

/* 求める人物像 */
.ideal_person {
  font-size: 0;
  margin: 0 auto 110px;
  width: 65%;
}

.ideal_person >li {
  font-size: 1.8rem;
  line-height: 1.5;
  text-align: center;
}

.ideal_person >li + li { margin-top: 20px; }



/*===============================

    SEMINAR

================================*/
.section.seminar {
  height: auto;
  width: 1200px;
  margin: 0 auto;
}

.contentsBox_smnr {
  background-repeat: no-repeat;
  /*background-size: contain;*/
  /*min-height: calc(100vh * 1.1);*/
  position: relative;
  z-index: 1;
}

.contentsBox_smnr.box1 {
  background-image: url("../../img/recruit/seminar_img01.jpg");
  background-position: top right;
  padding-top: 100%;
}

.contentsBox_smnr.box2 {
margin: 0 0 4%;
}

.imgBox_smnr { position: absolute; }

.transparencyBox_smnr {
  background-color: rgba(255,255,255,0.8);
  box-sizing: border-box;
  font-size: 1.5rem;
  height: auto;
  padding: 58px 39px;
  position: absolute;
  width: 40%;
}

.transparencyBox_smnr > .tbTtl {
  font-size: 25px;
  font-weight: 700;
}

.transparencyBox_smnr > p {
  line-height: 1.5;
}

.transparencyBox_smnr > p + p { margin-top: 35px; }

.transparencyBox_smnr.box1 {
  top: 20.5%;
  left: 12%;
  z-index: 2;
}

.transparencyBox_smnr.box2 {
  top: 64%;
  right: 4%;
  z-index: 2;
}

/* 画像 */
.imgBox_smnr.box1 {
 top: 56%;
 left: 44%;
 z-index: 3;
}

.seminarSchedule {
  display: flex;
  justify-content: space-between;
  margin-bottom: 80px;
}

.seminarSchedule > li {
  border-bottom: 2px solid #F9E426;
  margin: 0 2px;
  text-align: center;
  width: 100%;
}

.seminarSchedule > li >a {
  color: #3E3A39;
  display: block;
  font-size: 1.8rem;
  padding-bottom: 5px;
  text-decoration: none;
  transition: .3s;
}

.seminarSchedule > li >a:hover { opacity: .6; }

.seminarSchedule_caption {
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 10px;
  text-align: center;
}

.seminarScheduleFrame {
  display: block;
  height: 500px;
  margin: 0 auto 50px;
  width: 80%;
}


/*===============================

    フッターナビ

================================*/
/*
    メイン
================================*/

.footerNavBox {
  height: auto;
  margin-top: 50px;
  width: 100%;
}

.footerNav {
  display: flex;
  font-size: 0;
  justify-content: space-between;
  margin: auto;
  width: 1080px;
}

.footerNav a {
  color: #fff;
  position: relative;
  text-decoration: none;
}


.footerNav > li {
  font-size: 1.4rem;
  width: auto;
}

.footerNav > li .innerTxt {
  display: block;
  font-size: calc(1.8rem * 0.6);
  font-weight: 500;
  margin-top: 8px
}

.footerNav > li > .addLink {
  background-color: crimson;
  box-sizing: border-box;
  color: #fff;
  display: block;
  font-size: 1.8rem;
  font-weight: 700;
  /*height: 50px;*/
  padding: 10px 5px;
  text-align: center;
  transition: .3s;
  width: 290px;
}

.footerNav > li > .addLink:hover {
  background-color: #fff;
  color: #3e3a39;
}

/* 擬似要素の共通スタイル */
.addLink_ft::after,
.addLink_ft::before,
.addLink_ft_inner::after,
.addLink_ft_inner::before {
  background-color: #3e3a39;
  content: '';
  display: block;
  position: absolute;
  z-index: 10;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}
/* 左上へ配置 */
.addLink_ft::after {
    height: 1px;
    left: 0px;
    top: 0px;
    width: 0px;
}
/* 右下へ配置 */
.addLink_ft::before {
  bottom: 0px;
  height: 1px;
  right: 0px;
  width: 0px;
}
/* 左下へ配置 */
.addLink_ft_inner::after {
  bottom: 0px;
  height: 0px;
  left: 0px;
  width: 1px;
}
/* 右下へ配置 */
.addLink_ft_inner::before {
  height: 0px;
  right: 0px;
  top: 0px;
  width: 1px;
}

/* hover */
.addLink_ft:hover::after,
.addLink_ft:hover::before {
  width: 100%;
  /*width: calc(100% + 1px);*/
}
.addLink_ft:hover .addLink_ft_inner::after,
.addLink_ft:hover .addLink_ft_inner::before {
  height: 100%;
  /*height: calc(100% + 1px);*/
}

.snsIcn {
display: block;
transition: .3s;
}

.snsIcn:hover {
  opacity: 0.6;
}

.snsIcn.fb {
border-radius: 2px;
background-color: #005580;
}

.snsIcn.tw {
border-radius: 2px;
background-color: #479dff;
}

.snsIcn > img {
display: block;
}


/*
    サブ
================================*/
.footerNavBox_sub {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin: 20px auto 0;
  width: 1080px;
}


.footerNav_sub {
display: flex;
justify-content: space-between;
width: 60%;
}

.footerNav_sub > li {
  border-right: 1px solid #3e3a39;

}

.footerNav_sub > li > a {
  color: #3e3a39;
  display: inline-block;
  padding-right: 8px;
  text-decoration: none;
  transition: .3s;
  vertical-align: middle;
}

.footerNav_sub > li > a:hover { opacity: 0.6; }


.footerNav_sub > li:last-of-type { border: none; }

.rashikuLink a {
  transition: .3s;
}

.rashikuLink a:hover {
  opacity: 0.6;
}

#footer #bc_footer #inquire_footer .footerTel a {
  padding: 5px 6px;
  height: auto;
}

/* 共通フッター部分 */
#last_line_footer #fnavi a { box-sizing: border-box; }


/*===============================

    Utility

================================*/
/* color */
.u_color-coral { color: #ff7f50 !important; }
.u_color-rouge { color: #ec2c43 !important; }
.u_color-crimson { color: #e6002d !important; }

/* display */
.u_d-b { display: block !important; }
.u_d-fx { display: flex !important; }

/* float */
.u_fl-n { float: none !important; }
.u_fl-l { float: left !important; }
.u_fl-r { float: right !important; }

/* font-size */
.u_fz-xs { font-size: .75em !important; }
.u_fz-sm { font-size: .875em !important; }
.u_fz-md { font-size: 1em !important; }
.u_fz-lg { font-size: 1.25em !important; }
.u_fz-xl { font-size: 1.5em !important; }
.u_fz-sr { font-size: smaller !important; }
.u_fz-lr { font-size: larger !important; }

.u_fz10 { font-size: 10px !important; }
.u_fz11 { font-size: 11px !important; }
.u_fz12 { font-size: 12px !important; }
.u_fz13 { font-size: 13px !important; }
.u_fz14 { font-size: 14px !important; }
.u_fz15 { font-size: 15px !important; }
.u_fz16 { font-size: 16px !important; }
.u_fz17 { font-size: 17px !important; }
.u_fz18 { font-size: 18px !important; }
.u_fz19 { font-size: 19px !important; }
.u_fz20 { font-size: 20px !important; }

/* font-weigth */
.u_fw-b { font-weight: bold !important; }
.u_fw-n { font-weight: normal !important; }

/* line-height */
.u_lh-nm { line-height: normal !important; }
.u_lh-ih { line-height: inherit !important; }
.u_lh0 { line-height: 0 !important; }
.u_lh1 { line-height: 1 !important; }
.u_lh2 { line-height: 2 !important; }
.u_lh3 { line-height: 3 !important; }
.u_lh4 { line-height: 4 !important; }
.u_lh5 { line-height: 5 !important; }
.u_lh6 { line-height: 6 !important; }
.u_lh-xs { line-height: 1.25 !important; }
.u_lh-sm { line-height: 1.33 !important; }
.u_lh-md { line-height: 1.5 !important; }
.u_lh-lg { line-height: 1.75 !important; }
.u_lh-xl { line-height: 2 !important; }

/* padding */
.u_py0 { padding-top: 0 !important; padding-bottom: 0 !important; }

/* margin */
.u_mt0 { margin-top: 0 !important; }
.u_mt-xs { margin-top: 0.2rem !important; }
.u_mt-sm { margin-top: 0.5rem !important; }
.u_mt-md { margin-top: 1rem !important; }
.u_mt-lg { margin-top: 1.5rem !important; }
.u_mt-xl { margin-top: 3rem !important; }

.u_ml0 { margin-left: 0 !important; }
.u_ml-xs { margin-left: 0.2rem !important; }
.u_ml-sm { margin-left: 0.5rem !important; }
.u_ml-md { margin-left: 1rem !important; }
.u_ml-lg { margin-left: 1.5rem !important; }
.u_ml-xl { margin-left: 3rem !important; }

.u_mb0 { margin-bottom: 0 !important; }
.u_mb-xs { margin-bottom: 0.2rem !important; }
.u_mb-sm { margin-bottom: 0.5rem !important; }
.u_mb-md { margin-bottom: 1rem !important; }
.u_mb-lg { margin-bottom: 1.5rem !important; }
.u_mb-xl { margin-bottom: 3rem !important; }

.u_mr0 { margin-right: 0 !important; }
.u_mr-xs { margin-right: 0.2rem !important; }
.u_mr-sm { margin-right: 0.5rem !important; }
.u_mr-md { margin-right: 1rem !important; }
.u_mr-lg { margin-right: 1.5rem !important; }
.u_mr-xl { margin-right: 3rem !important; }

.u_my0 { margin-top: 0 !important; margin-bottom: 0 !important; }
.u_my10 { margin-top: 10px !important; margin-bottom: 10px !important; }
.u_my20 { margin-top: 20px !important; margin-bottom: 20px !important; }
.u_my30 { margin-top: 30px !important; margin-bottom: 30px !important; }

.u_mt5 { margin-top: 5px !important; }
.u_mt10 { margin-top: 10px !important; }
.u_mt15 { margin-top: 15px !important; }
.u_mt20 { margin-top: 20px !important; }
.u_mt30 { margin-top: 30px !important; }
.u_mt50 { margin-top: 50px !important; }
.u_mt100 { margin-top: 100px !important; }

.u_mt-5 { margin-top: -5px !important; }
.u_mt-10 { margin-top: -10px !important; }
.u_mt-15 { margin-top: -15px !important; }
.u_mt-20 { margin-top: -20px !important; }
.u_mt-30 { margin-top: -30px !important; }
.u_mt-50 { margin-top: -50px !important; }
.u_mt-100 { margin-top: -100px !important; }

.u_mr5 { margin-right: 5px !important; }
.u_mr10 { margin-right: 10px !important; }
.u_mr15 { margin-right: 15px !important; }
.u_mr20 { margin-right: 20px !important; }
.u_mr30 { margin-right: 30px !important; }
.u_mr50 { margin-right: 50px !important; }
.u_mr100 { margin-right: 100px !important; }

.u_mb5 { margin-bottom: 5px !important; }
.u_mb10 { margin-bottom: 10px !important; }
.u_mb15 { margin-bottom: 15px !important; }
.u_mb20 { margin-bottom: 20px !important; }
.u_mb30 { margin-bottom: 30px !important; }
.u_mb50 { margin-bottom: 50px !important; }
.u_mb100 { margin-bottom: 100px !important; }

.u_mb-5 { margin-bottom: -5px !important; }
.u_mb-10 { margin-bottom: -10px !important; }
.u_mb-15 { margin-bottom: -15px !important; }
.u_mb-20 { margin-bottom: -20px !important; }
.u_mb-30 { margin-bottom: -30px !important; }
.u_mb-50 { margin-bottom: -50px !important; }
.u_mb-100 { margin-bottom: -100px !important; }

.u_ml5 { margin-left: 5px !important; }
.u_ml10 { margin-left: 10px !important; }
.u_ml15 { margin-left: 15px !important; }
.u_ml20 { margin-left: 20px !important; }
.u_ml30 { margin-left: 30px !important; }
.u_ml50 { margin-left: 50px !important; }
.u_ml100 { margin-left: 100px !important; }

.u_ml-5 { margin-left: -5px !important; }
.u_ml-10 { margin-left: -10px !important; }
.u_ml-15 { margin-left: -15px !important; }
.u_ml-20 { margin-left: -20px !important; }
.u_ml-30 { margin-left: -30px !important; }
.u_ml-50 { margin-left: -50px !important; }
.u_ml-100 { margin-left: -100px !important; }

/* position */
.u_pos-r { position: relative !important; }
.u_pos-a { position: absolute !important; }

/* text-align */
.u_ta-c { text-align: center !important; }
.u_ta-r { text-align: right !important; }
.u_ta-l { text-align: left !important; }

/* text-indent */
.u_ti--1 { text-indent: -1em !important; padding-left: 1em !important; }
.u_ti-0 { text-indent: 0em !important; padding-left: 0em !important; }

/* text-decoration */
.u_td-n { text-decoration: none !important; }
.u_td-u { text-decoration: underline !important; }
.u_td-o { text-decoration: overline !important; }
.u_td-l { text-decoration: line-through !important; }

/* vertical-align */
.u_va-sup { vertical-align: super !important; }
.u_va-t { vertical-align: top !important; }
.u_va-tt { vertical-align: text-top !important; }
.u_va-m { vertical-align: middle !important; }
.u_va-bl { vertical-align: baseline !important; }
.u_va-b { vertical-align: bottom !important; }
.u_va-tb { vertical-align: text-bottom !important; }
.u_va-sub { vertical-align: sub !important; }

/* flexbox */
.u_ac-fs { align-content: flex-start !important; }
.u_ac-fe { align-content: flex-end !important; }
.u_ac-c { align-content: center !important; }
.u_ac-sb { align-content: space-between !important; }
.u_ac-sa { align-content: space-around !important; }
.u_ac-s { align-content: stretch !important; }
.u_ai-fs { align-items: flex-start !important; }
.u_ai-fe { align-items: flex-end !important; }
.u_ai-c { align-items: center !important; }
.u_ai-b { align-items: baseline !important; }
.u_ai-s { align-items: stretch !important; }
.u_as-a { align-self: auto !important; }
.u_as-fs { align-self: flex-start !important; }
.u_as-fe { align-self: flex-end !important; }
.u_as-c { align-self: center !important; }
.u_as-b { align-self: baseline !important; }
.u_as-s { align-self: stretch !important; }
.u_jc-fs { justify-content: flex-start !important; }
.u_jc-fe { justify-content: flex-end !important; }
.u_jc-c { justify-content: center !important; }
.u_jc-sb { justify-content: space-between !important; }
.u_jc-sa { justify-content: space-around !important; }
.u_fx0-1-a { flex: 0 1 auto !important; }
.u_fx1-0-a { flex: 1 0 auto !important; }
.u_fx1-1-a { flex: 1 1 auto !important; }
.u_fx0-0-a { flex: 0 0 auto !important; }
.u_fx1-0-0 { flex: 1 0 0% !important; }

.u_fxb-c { flex-basis: content !important; }

.u_fxd-r { flex-direction: row !important; }
.u_fxd-rr { flex-direction: row-reverse !important; }
.u_fxd-c { flex-direction: column !important; }


.u_fxd-cr { flex-direction: column-reverse !important; }

/* order */
.u_ord0 { order: 0 !important; }
.u_ord1 { order: 1 !important; }
.u_ord2 { order: 2 !important; }
.u_ord3 { order: 3 !important; }
.u_ord4 { order: 4 !important; }
.u_ord5 { order: 5 !important; }
.u_ord6 { order: 6 !important; }
.u_ord9999 { order: 9999 !important; }
.u_ord-1 { order: -1 !important; }

/* table-layout */
.u_tbl-a { table-layout: auto !important; }
.u_tbl-f { table-layout: fixed !important; }

/* width */
.u_w350 { width: 350px !important; }
.u_w400 { width: 400px !important; }

.u_w40p { width: 40% !important; }
.u_w45p { width: 45% !important; }
.u_w50p { width: 50% !important; }
.u_w100p { width: 100% !important; }

.u_maW70p { max-width: 70% !important; }
.u_maW75p { max-width: 75% !important; }
.u_maW80p { max-width: 80% !important; }

/*横幅*/
.u_col1{width:8.333%;}
.u_col2{width:16.667%;}
.u_col3{width:25%;}
.u_col4{width:33.333%;}
.u_col5{width:41.666%;}
.u_col6{width:50%;}
.u_col7{width:58.333%;}
.u_col8{width:66.666%;}
.u_col9{width:75%;}
.u_col10{width:83.33%;}
.u_col11{width:91.666%;}
.u_col12{width:100%;}
@media screen and (max-width:768px){
  .u_resMdCol1{width:8.333%;}
  .u_resMdCol2{width:16.667%;}
  .u_resMdCol3{width:25%;}
  .u_resMdCol4{width:33.333%;}
  .u_resMdCol5{width:41.666%;}
  .u_resMdCol6{width:50%;}
  .u_resMdCol7{width:58.333%;}
  .u_resMdCol8{width:66.666%;}
  .u_resMdCol9{width:75%;}
  .u_resMdCol10{width:83.33%;}
  .u_resMdCol11{width:91.666%;}
  .u_resMdCol12{width:100%;}
}
@media screen and (max-width:599px){
  .u_resSmCol1{width:8.333%;}
  .u_resSmCol2{width:16.667%;}
  .u_resSmCol3{width:25%;}
  .u_resSmCol4{width:33.333%;}
  .u_resSmCol5{width:41.666%;}
  .u_resSmCol6{width:50%;}
  .u_resSmCol7{width:58.333%;}
  .u_resSmCol8{width:66.666%;}
  .u_resSmCol9{width:75%;}
  .u_resSmCol10{width:83.33%;}
  .u_resSmCol11{width:91.666%;}
  .u_resSmCol12{width:100%;}
}


@media screen and (max-width:768px) {
  .u_res_mr0 { margin-right: 0 !important; }
  .u_res_mb30 { margin-bottom: 30px !important; }
  .u_res_w100p { width: 100% !important; }
}



/*===============================

    ★★レスポンシブ

================================*/
@media screen and (max-width:768px) {

body { width: 100%; }

/*
    トップページ
================================*/
/* override */
.fp-tableCell { width: 100%; }

.onepage-pagination { display: none; }

.header {
  box-sizing: border-box;
  height: auto;
  padding: 0;
}

.gnavi {
  display: block;
  font-size: 1.8rem;
}



.gnavi > li {
  display: inline-block;
  padding: 0 5px;
  width: auto;
}

.gnavi > li > a { line-height: 1.7; }
.gnavi > li span { display: none; }

.gnavi > li > a.addLink { display: none; }

/* リニューアル分ココカラ */
.keyMsg { font-size: 16px; }

.topMenu { width :100%; }

.topMenu > li {
  background-size: cover;
  height: auto;
  width :100%;
}

.topMenu > li a::before {
  content: "";
  display: block;
  padding-top: 23%;
}

.topMenu > li > a > span { text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff; }

.topMenu > li.topMenu_aboutUs > a > span {
top: 24%;
right: 7%;
}

.topMenu > li.topMenu_insData > a > span { top: 24%; }

.topMenu > li.topMenu_msg > a > span {
top: 24%;
right: 7%;
}

.topMenu > li.topMenu_interview > a > span {
  top: 24%;
  left: 5%;
}

.topMenu > li.topMenu_recruit > a > span { top: 24%; }
/* リニューアル分ココマデ */


.slick-slide img { height: 100vh; }

.keyTxt {
  font-size: 2.5rem;
  margin: auto;
  right: 0;
  left: 0;
  text-shadow: 1px 1px 0 #3E3A39, -1px 1px 0 #3E3A39, -1px -1px 0 #3E3A39, 1px -1px 0 #3E3A39;
  width: 95%;
}

.keyTxt_s {
  margin: auto;
  right: 0;
  left: 0;
  width: 95%;
}

.typeOfJob {
  font-size: 2.5rem;
  width: 60vw;
}

.typeOfJob > span:first-of-type { font-size: 1.5rem; }

.typeOfJob br { display: block; }

.personal {
  font-size: 1.6rem;
  margin-left: 11%;
  width: 30vw;
}

/* 右寄せ */
.section.engineer.stageBase .typeOfJob {
  position: relative;
  right: -46%
}

.section.engineer.stageBase .personal {
  position: relative;
  right: -49%
}


.section { background-size: cover; }
.section.sales {
  background-image: url("../../img/recruit/responsive_top_sales.jpg");
  background-position: 0 top;
  z-index: 1000;
}

.section.creator {
  background-image: url("../../img/recruit/responsive_top_creator.jpg");
  background-position: 0 top;
}

.section.designer {
  background-image: url("../../img/recruit/responsive_top_designer.jpg");
  background-position: 0 top;
}

.section.engineer {
  background-image: url("../../img/recruit/responsive_top_engineer.jpg");
  background-position: 0 top;
}

.section.ai {
  background-image: url("../../img/recruit/responsive_top_ai.jpg");
  background-position: 0 top;
}

.exampleSche {
  padding: 136px 0 0;
  width: 100%;
}

.intvwLink { width: 74%; }



.timeSchedule {
  /*align-items: start;*/
  box-sizing: border-box;
  max-height: 50vh;
  padding-left: 55px;
  position: absolute;
  bottom: 0;
  width: 100%;
}

.timeAxis {
  align-self: stretch;
  font-size: 1.3rem;
}

.timeBtn + .timeBtn { margin-top: 0; }

.timeSchedule_content {
  font-size: 1.3rem;
  height: 35vh;
}

.timeSchedule.sales,
.timeSchedule.designer,
.timeSchedule.ai{ flex-direction: row; }

.timeSchedule_content > p:first-of-type { font-size: 1.5rem; }
.timeSchedule_content > p + p { margin-top: 10px; }

/*
    ABOUT US
================================*/
.section.aboutUs { width: 100%; }

.contentsBox {
  background-size: contain;
}

.contentsBox.box1 { padding-top: 57%; }
.contentsBox.box2 { padding-top: 39%; }

.transparencyBox,
.transparencyBox.box3{
  position: static;
  width: 100%;
}

.imgBox { position: static; }

.imgBox img {
  height: auto;
  width: auto;
  max-width: 100%;
}

.step4 > img:nth-of-type(2) {
  top: 60%;
  right: -14%;
}

.otherService { flex-direction: column; }

.otherService_inner {
  box-sizing: border-box;
  margin: auto;
  width: 95%;
}

.otherService_dl { margin-left: 0; }

.otherService_logo { text-align: center; }

.otherService_logo img {
  height: auto;
  width: auto;
  max-width: 100%;
}

img[src*="about-us_mitemo.png"] {
  height: auto;
  width: 100%;
}

/*
    INSOURCE DATA
================================*/
.section.insNum { width: 100%; }



/*
    MESSAGE
================================*/
.section.message { width: 100%; }

.contentsBox_msg { background-size: contain; }

.contentsBox_msg.box1 { padding-top: 50%; }


.contentsBox_msg.box2 { padding-top: 65%; }

.contentsBox_msg.box3 { padding-top: 39%; }

.transparencyBox_msg,
.transparencyBox_msg.box3,
.transparencyBox_msg.box4 {
  position: static;
  width: 100%;
}

.transparencyBox_msg.box5 { width: 100%; }

.imgBox_msg { position: static; }

.imgBox_msg img {
  height: auto;
  width: auto;
  max-width: 100%;
}


/*
    INTERVIEW
================================*/
/* リニューアル分ココカラ */
.section.interviewTop { width: 100%; }

.intvwList_inner { margin: 0 auto 65px; }

/* リニューアル分ココマデ */

.section.interview .timeSchedule {
  flex-wrap: wrap;
  height: auto;
  max-height: none;
  padding-left: 10%;
  position: static;
}

.section.interview .timeSchedule::before { content: ""; }


.intvwMenu_inner {
  flex: none;
  margin: 0 auto 65px;
  min-width: auto;
  width: 100%;
}

.intvwMenu_inner > a { width: 100%; }

.menuImg {
  height: 80vh;
  width: 100%;
}

.menuImg > img {
  object-fit: contain;
  height: 80vh;
  width: 100%;
}

.personalIntvw {
  height: 20vh;
  width: 100%;
}

.roundTblLink + .roundTblLink { margin-left: 0; }

/*
    INTERVIEW - 個々の記事
================================*/
.section.interview { padding-top: 80px; }

.intvwTopImg { font-size: 0; }

.intvwTopImg > img { height: auto; }

.catchCopyBox,
.catchCopyBox.right {
  box-sizing: border-box;
  font-size: 2.8rem;
  position: relative;
  right: auto;
  left: auto;
  width: 100%;
}

.catchCopyBox::before {
  border: 20px solid transparent;
  border-top: 20px solid #333;
  border-left: 20px solid #333;
  top: 0;
  left: 0;
}

.section.interview + .section {
  margin: 30px auto 0;
  width: 95%;
}

.fl,
.fr { float: none; }

.intvwBox { width: 100%; }

.intvwBoxTxt { width: 100%; }

.intvwBoxTxt p { font-size: 1.6rem; }

.intvwBoxImg { width: 100%; }

.intvwBoxImg > img:nth-of-type(2) { display: none; }

.section.interview + .section.mtL { margin-top: 180px; }

.intvwQuestion {
background-blend-mode: lighten;
background-color: rgba(255,255,255,.8);
background-size: contain;
font-size: 1.8rem;
height: 100px;
line-height: 2;
padding-left: 95px;
}

.intvwScheImgBox { width: 100%; }

.section.interview .timeScheduleBox { width: 60%; }
.section.interview .timeAxis { width: 35%; }

/* 座談会 */
.roundTblTxt {
  font-size: 1.6rem;
  padding-left: 0;
}

.nameTag {

  display: block;
  float: none;
  margin: 0 0 10px 0;
}

.intvwBoxImg_roundTbl img {
  height: 100%;
  width: auto;
  max-width: 100%;
}



/*
    RECRUIT
================================*/
.ideal_person { width: 90%; }


/*
    SEMINAR
================================*/
.section.seminar { width: 100%; }

.contentsBox_smnr { background-size: contain; }

.contentsBox_smnr.box1 { padding-top: 69%; }

.contentsBox_smnr.box2 {  }

.imgBox_smnr { position: static; }


.transparencyBox_smnr{
  position: static;
  width: 100%;
}

.seminarSchedule {
  flex-flow: wrap row;
  justify-content: space-around;
}

.seminarSchedule > li {
  margin-bottom: 10px;
  width: 45%;
}

.seminarScheduleFrame { width: 95%; }


/*
    footer
================================*/
.footerNavBox { display: none; }

.tileImg > img {
  height: auto;
  width: auto;
  max-width: 100%;
}

}/* @media */


/*
    responsive 2
================================*/
@media screen and (max-width:360px){
.gnavi { font-size: 1.5rem; }
}

@media screen and (max-width: 375px){
.exampleSche { padding: 80px 0 0; }
.timeSchedule_content img[src*="rashiku_icon_e.svg"] { width: 15px; }
}/* @media */

@media screen and (max-width:360px){
.typeOfJob { font-size: 1.5rem; }
.typeOfJob > span:first-of-type {font-size: 1.2rem;}
}/* @media */

@media screen and (max-width:415px){
.fixedBg {
  background-image:url("../../img/recruit/topimg-responsive_new-recruit-2019.jpg");
}
}/* @media */

@media screen and (max-width:415px){
  .personal.running > span:nth-of-type(1),
  .personal.running > span:nth-of-type(3) {
    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff;
  }
}/* @media */

@media screen and (max-width:415px){
.step4 > img:nth-of-type(1) {
  top: 52%;
  left: -14%;
}
}/* @media */

@media screen and (max-width:768px){
  .section.pjStory { width: 100%; }
  .section.pjStory + .section { margin-top: 30px; width: 100%; }
  .catchCopy.pjStory {
    box-sizing: border-box;
    font-size: 2.8rem;
    position: relative;
    right: auto;
    left: auto;
    width: 100%;
  }
  .catchCopy.pjStory span {
    background-color: transparent;
    display: inline;
  }
  .catchCopyBox.pjStory { width: 100%; }
  .catchCopyBox.pjStory span { display: inline; }
  .intvwBox_img-wide img { width: 100%; height: auto; }
  .intvwBox_img-sideBySide { flex-direction: column; }
  .intvwBox_img-sideBySide img { width: 100%; height: auto; }
  .colorBoard { flex-direction: column; }
  .p_columnBox { column-count: 1; }
}