@charset "UTF-8";

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

  common parts

==================================================================*/
html {
  font-size               : 62.5%;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust   : 100%;
  -ms-text-size-adjust    : 100%;
  text-size-adjust        : 100%;
  /* font-feature-settings:"palt"; */
}

body {
  font-family: 'Noto Sans JP', sans-serif;
  color      : #231815;
  background : #F1E2CD;
}

body.noscroll {
  overflow: hidden;
}

a {
  display: block;
}

img {
  width    : 100%;
  max-width: 100%;
  display  : block;
}

.wrap {
  overflow: hidden;
}

.page-top_bg {
  position  : relative;
  margin-top: 64px;
  max-width : 1500px;
  margin    : 0 auto;
}

.ly_container {
  width          : 100%;
  height         : 100%;
  margin         : 0 auto;
  background-size: cover;
  position       : relative;
  margin-top     : 64px;
}

.ly_container::before {
  content        : "";
  display        : block;
  width          : 100%;
  height         : 100%;
  background     : url(/admissions/career/entrysheet/img/body_bg.png) no-repeat top;
  background-size: cover;
  position       : absolute;
  top            : 0;
  left           : 0;
  z-index        : -1;
  padding-top    : 100%;
}

.txt {
  font-size: 1.6rem;
}

.sec_container {
  max-width: 1700px;
  margin   : 0 auto;
  padding  : 0 14%;
}

/* ----------------------------------------------------------------
  レスポンシブ
------------------------------------------------------------------*/
@media screen and (max-width: 1080px) {
  .sec_container {
    padding: 0 80px;
  }
}

@media screen and (max-width: 768px) {
  .ly_container {
    margin-top: -50px;
  }

  .ly_container:before {
    background     : url(/admissions/career/entrysheet/img/body_bg_sp.png) no-repeat top;
    background-size: cover;
  }
}

@media screen and (max-width: 767px) {
  .sec_container {
    padding: 0 20px;
  }
}

@media screen and (max-width: 500px) {
  .ly_container {
    margin-top: 15px;
  }

  .txt {
    font-size: 1.5rem;
  }
}



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

  header

==================================================================*/
.header {
  width     : 100%;
  height    : 62px;
  background: #B7193F;
  position  : absolute;
  top       : 0;
  z-index   : 1000;
}

.logo {
  width  : 334px;
  margin : 0 auto;
  padding: 5px 0;
}

/* ----------------------------------------------------------------
  レスポンシブ
------------------------------------------------------------------*/
@media screen and (max-width: 767px) {
  .header {
    height: 46px;
  }

  .logo {
    width: 223px;
  }
}


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

  nav

==================================================================*/
.nav {
  width     : 100%;
  height    : 100vh;
  position  : fixed;
  top       : 0;
  left      : 0;
  opacity   : 0;
  transition: all .6s;
  visibility: hidden;
  z-index   : 2;
  background: #D14E4B;
}

.nav.active {
  position  : fixed;
  top       : 0;
  left      : 0;
  opacity   : 1;
  visibility: visible;
  height    : 100vh;
  z-index   : 100;
  transition: all .6s;
  background: #D14E4B;
}

.nav ul {
  width          : 100%;
  display        : flex;
  flex-direction : column;
  align-items    : center;
  justify-content: center;
  position       : absolute;
  top            : 40%;
  left           : 50%;
  transform      : translate(-50%, -50%);
}

.nav ul li {
  margin-bottom: 50px;
}

.nav ul li a {
  font-size  : 2.1rem;
  color      : #fff;
  font-weight: 500;
}


/* toggle */
.toggle_container {
  width          : 100%;
  max-width      : 1100px;
  margin         : 0 auto;
  padding        : 0 20px;
  display        : flex;
  justify-content: flex-end;
  position       : fixed;
  top            : 7.5%;
  right          : 0;
  left           : 0;
  z-index        : 100;
}

.toggle {
  width          : 54px;
  height         : 54px;
  background     : #D14E4B;
  border-radius  : 50%;
  display        : flex;
  flex-direction : column;
  align-items    : center;
  justify-content: center;
  cursor         : pointer;
  z-index        : 100;
}

.toggle span {
  width     : 35px;
  height    : 4px;
  background: #fff;
  display   : block;
  transition: all .3s
}

.toggle span:nth-child(2) {
  margin: 5.5px 0 6px;
}

.toggle.active span:nth-child(1) {
  transform : translateY(10px) rotate(-45deg);
  transition: all 0.3s;
}

.toggle.active span:nth-child(2) {
  transform       : scaleX(0);
  transform-origin: right top;
  transition      : transform .3s;
}

.toggle.active span:nth-child(3) {
  transform : translateY(-10px) rotate(45deg);
  transition: all 0.3s;
}

/* ----------------------------------------------------------------
  レスポンシブ
------------------------------------------------------------------*/
@media screen and (max-width: 767px) {
  .toggle_container {
    top    : 7%;
    padding: 0 5px;
  }

  .toggle {
    width : 45px;
    height: 45px;
  }

  .toggle span {
    width : 29px;
    height: 3.3px;
  }

  .toggle span:nth-child(2) {
    margin: 4.5px 0;
  }

  .toggle.active span:nth-child(1) {
    transform: translateY(5px) rotate(-45deg);
  }

  .nav ul li a {
    font-size: 1.9rem;
  }
}



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

  top

==================================================================*/
.top {
  padding : 5% 0 76%;
  position: relative;
}

.top_catch {
  width    : 40%;
  /* max-width: 592px; */
  /* max-width: 750px; */
  margin   : 0 auto;
  position : absolute;
  top      : 39%;
  /* left     : 54%; */
  left     : 52%;
  /* transform: translate(-54%, -39%); */
  transform: translate(-50%, -39%);
}


/* ----------------------------------------------------------------
  レスポンシブ
------------------------------------------------------------------*/
@media screen and (min-width: 1700px) {
  .top_catch {
    top: 35%;
    transform: translate(-50%, -50%);
  }
}

@media screen and (max-width: 1080px) {
  .top {
    padding: 8% 0 95%;
  }

  .top_catch {
    width: 50%;
    top  : 41%
  }
}

@media screen and (max-width: 768px) {
  .top {
    padding      : 8% 0 115%;
    margin-bottom: 78%;
  }

  .top_catch {
    width: 65%;
    top  : 60%;
  }
}

@media screen and (max-width: 500px) {
  .top_catch {
    width: 65%;
    top  : 63%;
  }
}



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

  concept

==================================================================*/
.concept {
  padding : 2% 0 10%;
  position: relative;
}

.concept_ttl_wrap {
  margin-bottom: 3%;
  position     : relative;
}

.concept_ttl_wrap::before {
  content     : "";
  display     : block;
  background  : #D14E4B;
  width       : 72%;
  margin-right: auto;
  height      : 2.5px;
  position    : absolute;
  top         : 38%;
  left        : -2%;
}

.concept_ttl_wrap::after {
  content    : "";
  display    : block;
  background : #D14E4B;
  width      : 67%;
  margin-left: auto;
  height     : 2.5px;
  position   : absolute;
  top        : 105%;
  right      : -2%;
}

.concept_ttl {
  width    : 38%;
  max-width: 513px;
  margin   : 0 auto;
  min-width: 263px;
}

.concept p {
  line-height: 4;
  text-align : center;
  font-weight: 500;
  padding    : 0 20px;
}

.br_500 {
  display: none;
}

.br_415 {
  display: none;
}

.br_395 {
  display: none;
}

/* ----------------------------------------------------------------
  レスポンシブ
------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  .concept_ttl_wrap {
    margin-bottom: 30px;
  }

  .concept_ttl {
    width: 80%;
  }
}

@media screen and (max-width: 500px) {
  .concept {
    padding: 2% 0 45%;
  }

  .concept p {
    line-height: 2.8;
  }

  .br_500 {
    display: block;
  }
}

@media screen and (max-width: 415px) {
  .br_415 {
    display: block;
  }
}



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

  about_es

==================================================================*/
.about_es {
  padding: 2% 0 15%;
}

.about_es_faq {
  display        : flex;
  justify-content: space-between;
  margin-bottom  : 10%;
}

.about_es_faq_item_ttl {
  font-size    : min(1.7vw, 2.5rem);
  font-weight  : 570;
  margin-bottom: 10px;
}

.about_es_faq_item .txt {
  line-height: 2;
  font-weight: 500;
}

.faq_item_01 {
  width: 50%;
}

.faq_item_02 {
  width: 40%;
}

.about_es_flow_ttl {
  width    : 50%;
  max-width: 318px;
  margin   : 0 auto 10px;
}

.about_es_flow_sub_ttl {
  font-size : 1.4rem;
  display   : block;
  text-align: center;
  margin-top: 10px;
}

.about_flow_desc {
  position: relative;
}

.about_flow_desc::before {
  content        : "";
  display        : block;
  width          : 4.5%;
  max-width      : 49px;
  height         : 3.5vw;
  max-height     : 53px;
  background     : url(/admissions/career/entrysheet/img/about_flow_img04-01.png)no-repeat;
  background-size: 100%;
  position       : absolute;
  top            : 57%;
  right          : 19%;
}


/* ----------------------------------------------------------------
  レスポンシブ
------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  .about_es_faq {
    flex-direction: column;
  }

  .faq_item_01,
  .faq_item_02 {
    width : 80%;
    margin: 0 auto;
  }

  .faq_item_01 {
    margin-bottom: 30px;
  }

  .about_flow_desc {
    width : 80%;
    margin: 0 auto;
  }

  .about_flow_desc::before {
    content        : "";
    display        : block;
    width          : 11.5%;
    max-width      : 100%;
    height         : 11.5vw;
    max-height     : 100%;
    background     : url(/admissions/career/entrysheet/img/about_flow_img04-01_sp.png)no-repeat;
    background-size: 100%;
    position       : absolute;
    top            : auto;
    bottom         : 14%;
    right          : -1%;
  }
}


@media screen and (max-width: 500px) {
  .about_es {
    padding: 2% 0 28%;
  }

  .faq_item_01,
  .faq_item_02 {
    width: 100%;
  }

  .about_flow_desc {
    width: 100%;
  }

  .about_es_flow_ttl {
    width        : 80%;
    margin-bottom: 30px;
  }

  .about_flow_desc::before {
    bottom: 15%;
  }
}


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

  es

==================================================================*/
.es {
  padding: 2% 0 21%;
}

.es_ttl {
  width    : 70%;
  max-width: 835px;
  margin   : 0 auto 10%;
}

.es_item {
  background   : #fff;
  padding      : 0 2%;
  border       : 2.5px solid #000;
  border-radius: 25px;
  margin-bottom: 5.4%;
  position     : relative;
  transition   : all .2s;
}

.es_item:hover {
  background: #D14E4B;
  color     : #fff;
  transition: all .2s;
}

.es_item:last-of-type {
  margin-bottom: 0;
}

.es_item_inner {
  display    : flex;
  align-items: center;
}

.es_item_num {
  width       : 13%;
  max-width   : 127px;
  margin-top  : -8px;
  margin-right: 3%;
}

.es_item p {
  font-size  : min(1.7vw, 2.5rem);
  line-height: 1.4;
  font-weight: 700;
}

.br_sp {
  display: none;
}

.es_item_01::after {
  content        : "";
  display        : inline-block;
  width          : 15%;
  max-width      : 155px;
  padding-top    : 20%;
  background     : url(/admissions/career/entrysheet/img/es_item_img_01.svg) no-repeat;
  background-size: 100%;
  position       : absolute;
  top            : -16%;
  right          : 2%;
}

.es_item_02::after {
  content        : "";
  display        : inline-block;
  width          : 18%;
  max-width      : 186px;
  padding-top    : 20%;
  background     : url(/admissions/career/entrysheet/img/es_item_img_02.svg) no-repeat;
  background-size: 100%;
  position       : absolute;
  top            : -25%;
  right          : 2%;
}

.es_item_03::after {
  content        : "";
  display        : inline-block;
  width          : 15%;
  max-width      : 154px;
  padding-top    : 20%;
  background     : url(/admissions/career/entrysheet/img/es_item_img_03.svg) no-repeat;
  background-size: 100%;
  position       : absolute;
  top            : -9%;
  right          : 2%;
}

.es_item_04::after {
  content        : "";
  display        : inline-block;
  width          : 18%;
  max-width      : 178px;
  height         : 9vw;
  max-height     : 157px;
  background     : url(/admissions/career/entrysheet/img/es_item_img_04.svg) no-repeat;
  background-size: 100%;
  position       : absolute;
  top            : 5%;
  right          : -1%;
  padding-top    : 16%;
}

/* ----------------------------------------------------------------
  レスポンシブ
------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  .es_item {
    padding      : 10px 2%;
    border       : 2px solid #000;
    border-radius: 10px;
  }

  .es_item_num {
    margin-top: -18px;
  }

  .es_item p {
    font-size  : min(2.5vw, 1.7rem);
    line-height: 1.6;
  }
}

@media screen and (max-width: 767px) {
  .es_item p {
    font-size: 1.3rem;
  }

  .br_pc {
    display: none;
  }

  .br_sp {
    display: block;
  }
}

@media screen and (max-width: 500px) {
  .es_item {
    border: 1px solid #000;
  }

  .es_ttl {
    width: 95%;
  }

  .es_item_num {
    margin-top: -35px
  }

  .es_item_01::after {
    width: 18%;
    /* top  : -7%; */
    top: 54%;
    transform: translate(0, -50%);
  }

  .es_item_02::after {
    /* width: 22%;
    top  : -6%; */
    width: 19%;
    top: 60%;
    transform: translate(0, -50%);
  }

  .es_item_03::after {
    /* width: 17%;
    top  : 10%; */
    width: 17%;
    top: 61%;
    transform: translate(0, -50%);
  }

  .es_item_04::after {
    width: 20%;
    padding-top: 18%;
    top: 50%;
    right: 2%;
    transform: translate(0, -50%);
  }

  .es_item_04  .es_item_num {
    margin-top: -55px
  }
}

@media screen and (max-width: 430px) {
  .es_item_num {
    margin-top: -43px
  }

  .es_item_04  .es_item_num {
    margin-top: -63px
  }
}



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

  employment_rate

==================================================================*/
.support {
  padding-top: 2%;
}

.support_container {
  max-width: 1700px;
  margin: 0 auto;
  padding: 0 250px;
}

.support_ttl {
  width    : 70%;
  max-width: 816px;
  margin   : 0 auto 8.7%;
  position : relative;
  left     : -15%;
}

.support_ttl::before {
  content        : "";
  display        : block;
  width          : 200%;
  height         : 100%;
  background     : url(/admissions/career/entrysheet/img/support_ttl_bg.png)no-repeat center;
  background-size: 100%;
  position       : absolute;
  top            : 10%;
  left           : -62%;
  z-index        : -1;
}

.support_desc {
  display        : flex;
  justify-content: space-between;
}

.support_desc_left {
  width: 60%;
}

.support_desc_left .txt {
  line-height: 2;
}

.support_desc_right {
  width   : 450px;
  position: relative;
}

.support_desc_right .ttl {
  width      : 45%;
  max-width  : 148px;
  min-width  : 105px;
  position   : relative;
  z-index    : 20;
}

.support_desc_right .txt {
  font-size    : 1.5rem;
  line-height  : 1.8;
  color        : #fff;
  background   : #3E5B8F;
  padding      : 16px 16px 16px 100px;
  border-radius: 15px;
  position     : absolute;
  top          : 0;
  right        : 1%;
  z-index      : 10;
  width        : 85%;
}

.support_chart {
  display        : flex;
  justify-content: center;
  margin         : 5% auto 2.5%;
}

.support_chart .chart_01 {
  width       : 43%;
  max-width   : 450px;
  margin-right: 4.5%;
}

.support_chart .chart_02 {
  width      : 46%;
  max-width  : 490px;
  margin-left: 4.5%;
}

.support .notes {
  width      : 75%;
  margin     : 0 auto;
  display    : flex;
  font-size  : 1.25rem;
  line-height: 2;
}

.support .notes span {
  margin     : 0 15px 0 0;
}

.attractive {
  padding: 5% 0 6.5%;
}

.attractive_ttl {
  width    : 65%;
  max-width: 618px;
  margin   : 0 auto 10px;
}

.attractive_items {
  display        : flex;
  flex-wrap      : wrap;
  justify-content: center;
  position       : relative;
}

.attractive_items li {
  width   : 48%;
  padding : 2% 3%;
  margin  : 4px;
  position: relative;
}

.attractive_items li:nth-child(3) img {
  padding: 15px 0 0;
}

.attractive_items li:nth-child(2n-1) {
  position: relative;
}

.attractive_items li:nth-child(1)::before {
  content   : "";
  display   : inline-block;
  width     : 100%;
  height    : 2px;
  background: #231815;
  position  : absolute;
  right     : 2px;
  bottom    : 0;
}

.attractive_items li:nth-child(2)::before {
  content   : "";
  display   : inline-block;
  width     : 100%;
  height    : 2px;
  background: #231815;
  position  : absolute;
  right     : -2px;
  bottom    : 0;
}

.attractive_items li:nth-child(2n-1)::after {
  content   : "";
  display   : inline-block;
  width     : 2px;
  height    : 100%;
  background: #231815;
  position  : absolute;
  right     : -4px;
  top       : -4px;
}

.attractive_items li span {
  font-size : min(0.8vw, 1.25rem);
  display   : block;
  margin-top: 5px;
}

.companies {
  padding-bottom: 80%;
}

.companies_ttl {
  width    : 30%;
  max-width: 225px;
  min-width: 215px;
  margin   : 0 auto 15px;
}

.companies_list {
  font-size  : 1.5rem;
  line-height: 1.8;
}

.companies_list span {
  font-size      : 1.25rem;
  display        : flex;
  justify-content: flex-end;
}

/* ----------------------------------------------------------------
  レスポンシブ
------------------------------------------------------------------*/
@media screen and (max-width: 1300px) {
  .companies {
    padding-bottom: 53vmax;
  }
}

@media screen and (max-width: 1080px) {
  .support_container {
    padding: 0 80px;
  }

  .support_desc {
    flex-direction: column;
    margin-bottom : 10%;
  }

  .support_desc_left {
    width: 100%;
  }

  .support_desc_left .txt {
    margin-bottom: 5%;
  }

  .support_desc_right {
    width  : 100%;
    display: flex;
  }

  .support_desc_right .txt {
    height     : 175px;
    display    : flex;
    align-items: center;
    top        : -9%;
    right      : 8%;
  }

  .attractive_ttl {
    width    : 100%;
    max-width: 100%;
  }

  .attractive_items li {
    width: 100%;
  }

.attractive_items li:nth-child(3) img {
  padding: 0;
}

  .attractive_items li:nth-child(1)::before {
    display: none;
  }

  .attractive_items li:nth-child(2)::before {
    display: none;
  }

  .attractive_items li:nth-child(2n-1)::after {
    display: none;
  }

  .attractive_items li span {
    font-size  : 1.2rem;
    line-height: 1.4;
  }

  .companies {
    padding-bottom: 70vmax;
  }
}


@media screen and (max-width: 767px) {
  .support_container {
    padding: 0 20px;
  }

  .support_desc_right .txt {
    font-size: 1.4rem;
    right    : 5%;
  }

  .support .notes {
    width: 90%;
  }
}

@media screen and (max-width: 500px) {
  .companies {
    padding-bottom: 40vmax;
  }

  .support_desc {
    margin-bottom: 80px;
  }

  .support_desc_left .txt {
    margin-bottom: 10%;
  }

  .support_desc_right .txt {
    padding-left: 120px;
  }

  .support_chart {
    flex-direction: column;
    margin        : 5% auto 40px;
  }

  .support_chart .chart_01 {
    width : 80%;
    margin: 0 auto 50px;
  }

  .support_chart .chart_02 {
    width : 90%;
    margin: 0 auto;
  }

  .companies_list {
    font-size: 1.3rem;
  }
}



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

  footer

==================================================================*/
#page_top .footer {
  margin-top: -7%;
}

.footer {
  /* height: 150px; */
  padding   : 33px 0 37px;
  background: #D14E4B;
  position: relative;
  z-index: 100;
}

.footer_logo {
  width    : 35%;
  max-width: 253px;
  min-width: 180px;
  margin   : 0 auto;
  position: relative;
  z-index: 100;
}


/* ----------------------------------------------------------------
  レスポンシブ
------------------------------------------------------------------*/
@media screen and (max-width: 767px) {
  .footer {
    padding: 44px 0 40px;
  }
}