@charset "UTF-8";

.secondary {
  font-weight: 700;
}

.secondary .ttl_2 {
  color: #92D6E4;
  text-align: center;
  margin-bottom: 8px;
}


@media not screen and (max-width: 780px) {
  .secondary {
    text-align: center;
  }

  .secondary .ttl_2 {
    font-size: 40px;
  }

}

@media screen and (max-width: 780px) {
  .secondary {
    padding: 0 6.3%;
  }

  .secondary .ttl_2 {
    font-size: 36px;
  }

}




/* section ttl style
----------------------------------------------------*/

.container .ttl_3 {
  writing-mode: vertical-rl;
  color: #fff;
  font-weight: 700;
  line-height: 120%;
  font-feature-settings: 'palt'on, 'vert'on;
}

.container .ttl_4 {
  color: #fff;
  font-weight: 700;
  border-radius: 16px 16px 0px 0px;

}


#section_company.container .ttl_4 {
  background: #75C289;
}

#section_career.container .ttl_4 {
  background: #FA9A65;
}

#section_working.container .ttl_4 {
  background: #FB8C8C;
}

#section_system.container .ttl_4 {
  background: #85A9EF;
}

#section_culture.container .ttl_4 {
  background: #75C2EE;
}


#section_company .color {
  color: #99E4BC;
}

#section_career .color {
  color: #FBC484;
}

#section_working .color {
  color: #F5B0B0;
}

#section_system .color {
  color: #A7BEF7;
}

#section_culture .color {
  color: #92D6E4;
}

@media not screen and (max-width: 780px) {
  .container .ttl_3 {
    font-size: 56px;
    letter-spacing: 11px;
    white-space: nowrap;
  }

  .container .ttl_4 {
    font-size: 24px;
    padding: 9px 16px;
  }
}


@media screen and (max-width: 780px) {
  .container .ttl_3 {
    font-size: 32px;
    margin-bottom: 24px;
    letter-spacing: 6px;
  }

  .container .ttl_4 {
    font-size: 20px;
    padding: 9px 0 8px;
    text-align: center;
  }

}

/* background dot style
----------------------------------------------------*/

#section_company.container {
  background-color: #99E4BC;
}

#section_career.container {
  background: #FBC484;
}

#section_working.container {
  background: #F5B0B0;
}

#section_system.container {
  background: #A7BEF7;
}

#section_culture.container {
  background: #92D6E4;
}


.bg_dot::before,
.bg_dot::after,
.bg_dot2::before {
  border-radius: 50%;
  overflow: hidden;
  content: "";
  position: absolute;
  z-index: -5;

  /* dots-- */
  background-clip: content-box;
  background-image:
    radial-gradient(#ffffffa3 17%, transparent 0%),
    radial-gradient(#ffffffa3 17%, transparent 0%);
  background-size: 20px 20px;
  background-position: 0 0, 10px 10px;
}



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

  #section_company.container .bg_dot::before {
    width: 320px;
    height: 320px;
    top: -40px;
    left: calc(100% - 320px - 38px);
  }

  #section_company.container .bg_dot::after {
    width: 320px;
    height: 320px;
    top: 567px;
    left: calc(100vw - 100%);
  }

  #section_career.container .bg_dot::before {
    width: 320px;
    height: 320px;
    left: calc(50% - 320px/2 + 576px);
    top: -148px;
  }

  #section_career.container .bg_dot::after {
    width: 180px;
    height: 180px;
    left: calc(50% - 180px/2 - 204px);
    top: 38px;
  }

  #section_career.container .bg_dot2::before {
    width: 320px;
    height: 320px;
    left: calc(50% - 320px/2 - 491px);
    top: 468px;
  }

  #section_working.container .bg_dot::before {
    width: 320px;
    height: 320px;
    top: 38px;
    left: calc(50% - 320px/2 + 422px);
  }

  #section_working.container .bg_dot::after {
    width: 560px;
    height: 560px;
    top: 466px;
    left: calc(50% - 560px/2 - 459px);
  }

  #section_system.container .bg_dot::before {
    width: 320px;
    height: 320px;
    top: -108px;
    left: calc(50% - 320px/2 + 176px);
  }

  #section_system.container .bg_dot::after {
    width: 180px;
    height: 180px;
    left: calc(50% - 180px/2 - 544px);
    top: 378px;
  }

  #section_culture.container .bg_dot::before {
    width: 320px;
    height: 320px;
    left: calc(50% - 320px/2 + 422px);
    top: 40px;
  }

  #section_culture.container .bg_dot::after {
    width: 560px;
    height: 560px;
    left: calc(50% - 560px/2 - 459px);
    top: 516px;
  }
}

@media screen and (max-width: 780px) {
  #section_company.container .bg_dot::before {
    width: 320px;
    height: 320px;
    left: calc(50% - 320px/2 - 195.5px);
    top: 30px;
  }

  #section_company.container .bg_dot::after {
    width: 320px;
    height: 320px;
    left: calc(50% - 320px/2 - 15.5px);
    top: 1247px;
  }

  #section_career.container .bg_dot::before {
    width: 320px;
    height: 320px;
    left: calc(50% - 320px/2 + 221.5px);
    top: -148px;
  }

  #section_career.container .bg_dot::after {
    width: 180px;
    height: 180px;
    left: calc(50% - 180px/2 - 163.5px);
    top: 178px;
  }

  #section_career.container .bg_dot2::before {
    width: 320px;
    height: 320px;
    left: calc(50% - 320px/2 + 43.5px);
    top: 978px;
  }

  #section_working.container .bg_dot::before {
    width: 320px;
    height: 320px;
    left: calc(50% - 320px/2 - 187.5px);
    top: 80px;
  }

  #section_working.container .bg_dot::after {
    width: 560px;
    height: 560px;
    left: calc(50% - 560px/2 - 7.5px);
    top: 936px;
  }

  #section_system.container .bg_dot::before {
    width: 320px;
    height: 320px;
    left: calc(50% - 320px/2 + 196.5px);
    top: 62px;
  }

  #section_system.container .bg_dot::after {
    width: 180px;
    height: 180px;
    left: calc(50% - 180px/2 - 148.5px);
    top: 708px;
  }

  #section_culture.container .bg_dot::before {
    width: 320px;
    height: 320px;
    left: calc(50% - 320px/2 - 187.5px);
    top: 30px;
  }

  #section_culture.container .bg_dot::after {
    width: 560px;
    height: 560px;
    left: calc(50% - 560px/2 - 126.5px);
    top: 1895px;
  }
}


/* #contents outline layout
----------------------------------------------*/

.container {
  position: relative;
  overflow: hidden;
  margin-bottom: 80px;
  z-index: 10;
}

#section_company.container.left {
  border-radius: 0 16px 16px 0;
  margin-right: 6.3%;
}

.container.left {
  border-radius: 0 16px 16px 0;
  margin-right: 6.3%;
}

.container.right {
  border-radius: 16px 0 0 16px;
  margin-left: 6.3%;
}

.container .inner {
  display: flex;
  margin: auto;
}

.cont_col {
  text-align: center;
  font-weight: 700;
  color: #666;
  margin-bottom: 24px;
  letter-spacing: normal;
}

.cont_col .detail {
  background: #fff;
  border-radius: 0 0 16px 16px;
  font-size: 14px;
}

.cont_col .detail p {
  margin-bottom: unset;
  letter-spacing: 0.08em;
}

@media not screen and (max-width: 780px) {
  .container.left {
    margin-right: 3%;
    padding: 40px 3% 40px 2%;
  }

  .container.right {
    margin-left: 3%;
    padding: 40px 5% 40px 2%;
  }

  @media screen and (min-width: 1355px) {
    .container.left {
      margin-right: 6.3%;
      padding: 40px 6.3% 40px 14.1%;
    }

    .container.right {
      margin-left: 6.3%;
      padding: 40px 14.1% 40px 6.3%;
    }
  }


  .container .inner {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
  }

  .container:nth-child(odd) .inner {
    flex-direction: row-reverse;
  }

  .container .contents_wrap {
    width: 88.8%;
    margin-top: 80px;
  }

  .cont_col .detail {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  #section_culture .fs_56 {
    line-height: 90%;
  }
}


@media screen and (max-width: 780px) {
  .container {
    padding: 24px 0;
  }

  .container .inner {
    display: flex;
    flex-direction: row;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }


  .contents_wrap {
    width: 100%;
  }

  .container.left {
    margin-right: 6.3%;
    padding: 24px 6.3% 24px 14.1%;
  }

  .container.right {
    margin-left: 6.3%;
    padding: 24px 14.1% 24px 6.3%;
  }

  .cont_col img {
    margin: 0 auto 8px;
  }

  .cont_col .detail {
    padding: 24px 16px;
  }

}

/* font-size style -----------------*/

.fw_400 {
  font-weight: 400;
}

.ff_number {
  font-family: 'Ubuntu', sans-serif;
}

.fs_72 {
  font-size: 72px;
  line-height: 100%;
}

.fs_64 {
  font-size: 64px;
  line-height: 100%;
}

.fs_56 {
  font-size: 56px;
  line-height: 100%;
}

.fs_50 {
  font-size: 50px;
  line-height: 100%;
}

.fs_48 {
  font-size: 48px;
  line-height: 100%;
}

.fs_40 {
  font-size: 40px;
  line-height: 100%;
}

.fs_32 {
  font-size: 32px;
  line-height: 100%;
}

.fs_24 {
  font-size: 24px;
  line-height: 100%;
}

.fs_22 {
  font-size: 22px;
  line-height: 100%;
}

.fs_18 {
  font-size: 18px;
  line-height: 100%;
}

.fs_16 {
  font-size: 16px;
  line-height: 140%;
}

.fs_15 {
  font-size: 15px;
  line-height: 100%;
}

.note {
  font-size: 12px;
  font-weight: 400;
}

@media not screen and (max-width: 920px) {
  .fs_72_pc {
    font-size: 72px;
    line-height: 100%;
    letter-spacing: -3px;
  }

  .fs_48_pc {
    font-size: 48px;
    line-height: 100%;
    letter-spacing: -3px;
  }

  .fs_32_pc {
    font-size: 32px;
    line-height: 100%;
  }
}

/* detail style --------------------------------------*/

.cont_col.short span {
  display: inline-block;
  margin-left: -5px;
}

.cont_col.income span,
.cont_col.support span {
  display: inline-block;
  margin-left: -4px;
}

.dl_row_ranking {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
}


.dl_row_ranking dt {
  margin-right: 12px;
}

.dl_row_ranking dt .fs_32.color {
  margin-right: -3px;
  display: inline-block;
}

.dl_row_ranking dd {
  width: 65%;
  text-align: left;
}

.dl_row_rate {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}

.dl_row_rate dt {
  width: 30%;
  text-align: left;
}

@media screen and (max-width: 1100px) {
  .dl_row_ranking dd {
    width: 100%;
    text-align: center;
    margin: -5px 0 10px
  }

  .dl_row_rate dt {
    width: 100%;
    text-align: center;
  }
}

.dl_row_rate.age {
  margin-bottom: 4px;
}

.dl_row_rate.age .fs_40.ff_number.ml {
  display: inline-block;
  margin-left: -2px;
}

.dl_row_rate.shoes dt {
  width: 41%;
}

.dl_row_rate.clothes .fs_56.ml .dl_row_rate.shoes .fs_56.ml {
  display: inline-block;
  margin-left: -2px;
}

.cont_col.friends .detail {
  padding: 24px;
}

.cont_col.friends span.rate {
  display: inline-block;
  margin-left: -3px;
}

.cont_col.friends .detail p {
  margin-bottom: 16px;
  line-height: 160%;
}

.cont_col.friends .detail .fs_18 {
  display: inline-block;
  margin-top: 8px;
}

.cont_col.like .detail {
  padding: 24px;
}

.cont_col.like_pa .detail dt {
  margin-bottom: 16px;
}

.cont_col.like_pa .detail dd {
  margin-bottom: 16px;
  text-align: left;
}

#section_culture p:last-child {
  text-align: left;
  line-height: 160%;
}

#section_culture p.note {
  margin-top: 4px;
  text-align: center;
}

/*******▽▽780▽▽▽▽**********************************************/
@media not screen and (max-width: 780px) {
  #section_company.container.left {
    border-radius: 0 16px 16px 0;
    margin-right: 3%;
    padding: 40px 3% 40px 5%;
  }

  #section_company .detail {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 0;
    align-items: baseline;
  }

  #section_company .detail li {
    width: 50%;
    height: 322px;
    padding: 40px 0;
  }

  #section_company .detail li:nth-child(1) {
    border-right: 1px solid #99E4BC;
    border-bottom: 1px solid #99E4BC;
  }

  #section_company .detail li:nth-child(2) {
    border-bottom: 1px solid #99E4BC;
  }

  #section_company .detail li:nth-child(3) {
    border-right: 1px solid #99E4BC;
  }

  #section_career .inner {
    flex-direction: row-reverse;
  }

  #section_career .contents_wrap {
    display: flex;
    flex-direction: row;
    justify-content: space-between;

  }

  #section_career .cont_col:nth-child(1) {
    width: 31%;
  }

  #section_career .cont_col:nth-child(2) {
    width: 31%;
    margin-top: 56px;
  }

  #section_career .cont_col:nth-child(3) {
    width: 31%;
    margin-top: 112px;
  }

  @media screen and (max-width: 1100px) {
    #section_career .cont_col:nth-child(1) {
      width: 32%;
    }

    #section_career .cont_col:nth-child(2) {
      width: 32%;
    }

    #section_career .cont_col:nth-child(3) {
      width: 32%;
    }

  }

  #section_career .cont_col .detail {
    height: 290px;
    padding: 0 16px;
  }

  #section_career .cont_col:last-child .detail {
    height: 256px;
  }

  #section_working .contents_wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #section_working .cont_col:nth-child(odd) {
    width: 48%;
    margin-bottom: 56px;
  }

  #section_working .cont_col:nth-child(even) {
    width: 48%;
    margin-top: 56px;
    margin-bottom: 0;
  }

  #section_working .cont_col .detail {
    padding: 16px;

    height: 262px;
  }

  #section_system .contents_wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #section_system .cont_col:nth-child(odd) {
    width: 48%;
    margin-bottom: 56px;
  }

  #section_system .cont_col:nth-child(even) {
    width: 48%;
    margin-top: 56px;
    margin-bottom: 0;
  }

  #section_system .detail {
    height: 268px;
    padding: 0 16px;
  }

  #section_system .detail p:last-child {
    line-height: 160%;
  }

  #section_culture .cont_col {
    margin-bottom: 0;
  }

  #section_culture .contents_wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #section_culture .detail {
    padding: 0 16px;
    display: flex;
    align-items: center;
  }

  #section_culture .cont_col:nth-child(1) {
    width: 31%;
  }

  #section_culture .cont_col:nth-child(1) .detail {
    height: 336px;
  }

  #section_culture .cont_col:nth-child(2) {
    width: 31%;
    margin-top: 56px;
  }

  #section_culture .cont_col:nth-child(2) .detail {
    height: 336px;
  }

  #section_culture .cont_col:nth-child(3) {
    width: 31%;
    margin-top: 112px;
  }

  #section_culture .cont_col:nth-child(3) .detail {
    height: 336px;
  }


  #section_culture .cont_col:nth-child(4) {
    width: 31%;
    margin-top: -56px;
  }

  #section_culture .cont_col:nth-child(4) .detail {
    height: 368px;
  }


  #section_culture .cont_col:nth-child(5) {
    width: 66%;
    margin-top: 56px;

  }

  #section_culture .cont_col:nth-child(5) .detail {
    height: 314px;
    padding: 0 24px;
  }

  #section_culture .cont_col:nth-child(6) {
    width: 100%;
    margin-top: 56px;

  }

  #section_culture .cont_col:nth-child(6) .detail {
    height: 262px;
  }

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

    #section_culture .cont_col:nth-child(1) {
      width: 32%;
    }

    #section_culture .cont_col:nth-child(1) .detail {
      height: 400px;
    }

    #section_culture .cont_col:nth-child(2) {
      width: 32%;
      margin-top: 56px;
    }

    #section_culture .cont_col:nth-child(2) .detail {
      height: 400px;
    }


    #section_culture .cont_col:nth-child(3) {
      width: 32%;
      margin-top: 112px;
    }

    #section_culture .cont_col:nth-child(3) .detail {
      height: 400px;
    }


    #section_culture .cont_col:nth-child(4) {
      width: 32%;
      margin-top: -32px;
    }

    #section_culture .cont_col:nth-child(4) .detail {
      height: 420px;
    }

    .dl_row_rate.shoes dt {
      width: 100%;
    }
  }

  #section_culture .cont_col.like_pa .detail {
    padding: 24px;
  }

  #section_culture .cont_col.like_pa dl {
    display: flex;
    flex-wrap: wrap;
    width: 600px;
    align-items: baseline;
    margin-bottom: 24px;
  }

  #section_culture .cont_col.like_pa dt {
    flex-basis: 100px;
    margin-bottom: 0;
  }

  #section_culture .cont_col.like_pa dd {
    flex-basis: auto;
    width: calc(100% - 100px);
    margin-bottom: 0;
  }
}

@media screen and (min-width: 1355px) {

  #section_career .cont_col:nth-child(1),
  #section_career .cont_col:nth-child(2),
  #section_career .cont_col:nth-child(3) {
    width: 31%;
  }

  #section_culture .cont_col:nth-child(1),
  #section_culture .cont_col:nth-child(2),
  #section_culture .cont_col:nth-child(3),
  #section_culture .cont_col:nth-child(4) {
    width: 31%;
  }

}

@media screen and (max-width: 780px) {
  #section_company.container.left {
    border-radius: 0 16px 16px 0;
    margin-right: 6.3%;
    padding: 24px 6.3% 24px 12.8%;
  }

  #section_company .cont_col .detail {
    padding: 0;
  }

  #section_company li {
    border-bottom: 1px solid #99E4BC;
    padding: 0 16px 24px;
    margin-bottom: 24px;
  }

  #section_company li:first-child {
    padding: 24px 16px;
  }

  #section_career .contents_wrap .cont_col:nth-child(even) {
    margin-left: 10.9%;
    margin-right: -10.9%;
  }

  #section_working .contents_wrap .cont_col:nth-child(odd) {
    margin-left: -10.9%;
    margin-right: 10.9%;
  }

  #section_system .contents_wrap .cont_col:nth-child(even) {
    margin-left: 10.9%;
    margin-right: -10.9%;
  }

  #section_culture .contents_wrap .cont_col:nth-child(odd) {
    margin-left: -10.9%;
    margin-right: 10.9%;
  }

  #section_culture .contents_wrap .cont_col.like_pa {
    margin-left: -10.9%;
  }

}

#section_company .note {
  line-height: 1.2rem;
  margin-top: 1.5rem;
}

.comments {
  margin-bottom: 4rem;
}

.comments p.note {
  margin-bottom: 0;
}