@charset "UTF-8";

@media (min-width: 768px) {
  .under_ttl_img {
    position: relative;
    z-index: 6;
    margin-top: -10.5vw;
    margin-bottom: 0vw;
  }
  .wlb {
  }
  .wlb .ttl_cell {
    margin: 0 auto 3.125vw;
  }
  .wlb .ttl_cell h2 {
    width: max-content;
    height: 5.2vw;
    background: #fff;
    font-size: 5.0vw;
    font-weight: 600;
    line-height: 5.6vw;
    border: 1px solid #000;
    font-family: "Roboto Condensed", sans-serif;
    transform: rotate(-2.98deg);
    margin: 0 auto 1.38vw;
    padding: 0 1.0vw;
  }
  .wlb .ttl_cell p {
    text-align: center;
    line-height: 1;
    font-size: 1.38vw;
    color: #fff;
    font-weight: 500;
  }
  .wlb .event .ttl_cell p {
    color: #000;
  }
  .wlb .bg_blu {
    position: relative;
    z-index: 2;
    margin-top: -0.5vw;
    background: url(../img/work-life-balance/bg_blu.png) no-repeat center;
    background-size: cover;
    padding: 5.2vw 0 9.16vw;
  }
  .wlb .bg_blu ul {
    width: 83.75vw;
    margin: 0 auto 8.3vw;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .wlb .bg_blu .cell:last-of-type ul {
    margin: 0 auto;
  }
  .wlb .bg_blu ul li {
    position: relative;
    width: 24.8%;
    height: 22.3vw;
    margin: 0 0 1.38vw;
    padding: 2.25vw 0 0;
    background: url(../img/work-life-balance/list_bg.png) no-repeat center;
    background-size: 100% 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
  }
  .wlb .bg_blu .cell:last-of-type ul li {
    width: 19.8%;
    /*
    height: 22.5vw;
    */
    height: 24.5vw;
  }
  .wlb .bg_blu ul li .num {
    position: absolute;
    top: 1.0vw;
    left: 1.0vw;
    font-family: "Roboto Condensed", sans-serif;
    transform: rotate(-2.98deg);
    font-size: 1.94vw;
    font-weight: 600;
    color: #1AAEFA;
    margin: 0;
  }
  .wlb .bg_blu ul li .img {
    width: 4.8vw;
    margin: 0 auto 0.7vw;
  }
  .wlb .bg_blu .cell:last-of-type ul li .img {
    margin-bottom: 0;
  }
  .wlb .bg_blu .cell:last-of-type ul li:last-child .img {
    width: 7.9vw;
  }
  .wlb .bg_blu ul li .ttl {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 3.5vw;
    font-size: 1.25vw;
    font-weight: bold;
    line-height: 1.4;
    margin: 0 auto 1.0vw;
  }
  .wlb .bg_blu .cell:last-of-type ul li .ttl {
    /*
    height: auto;
    */
    margin-bottom: 0.6vw;
  }
  .wlb .bg_blu ul li .ttl span {
    font-size: 0.97vw;
    color: #838383;
  }
  .wlb .bg_blu ul li:nth-child(6) .ttl {
    font-size: 1.11vw;
    line-height: 1.5;
  }
  .wlb .bg_blu ul li .detail {
    width: 16.6vw;
    font-size: 0.97vw;
    font-weight: 500;
    line-height: 1.75;
    margin: 0 auto 0vw;
  }
  .wlb .bg_blu .cell:last-of-type ul li .detail {
    width: 13.3vw;
    margin: 0 0 0 0.8vw;
  }
  .wlb .bg_blu ul li .detail span {
    font-size: 0.90vw;
    color: #6D6D6D;
  }
  .wlb .bg_blu ul li .attention {
    width: 16.6vw;
    font-size: 0.76vw;
    font-weight: 500;
    line-height: 1.75;
    margin: 0.7vw auto 0vw;
    color: #6D6D6D;
  }
  .wlb .bg_blu .cell:last-of-type ul li .attention {
    width: 13.3vw;
    margin: 0.3vw 0 0 0.8vw;
  }

  .wlb .event {
    margin: 0 0 3.8vw;
  }
  .wlb .event .ttl_cell {
    margin-top: -3.125vw;
  }
  .wlb .event .ttl_cell h2 {
    border: 2px solid #000;
  }
  .wlb .event .lead {
    font-size: 1.25vw;
    font-weight: bold;
    line-height: 2.0;
    width: 43.8vw;
    margin: 0 auto 5.9vw;
  }
  .wlb .event ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 87vw;
    margin: 0 auto;
  }
  .wlb .event ul li {
    margin: 0 0 0;
    background: #F8F8F8;
  }
  .wlb .event ul li:nth-child(1) {
    width: calc(100% - 9vw);
    margin: 0 0 1.7vw;
    padding: 3.75vw 2.9vw 3.4vw 6.1vw;
    display: flex;
  }
  .wlb .event ul li:nth-child(2) {
    width: calc(100% - 9vw);
    margin: 0 0 1.7vw;
    padding: 2.1vw 2.9vw 3.4vw 6.1vw;
    display: flex;
    align-items: center;
  }
  .wlb .event ul li:nth-child(3) {
    width: calc(32.2% - 5.4vw);
    margin: 0 0 0vw;
    padding: 4.5vw 2.7vw 2.7vw 2.7vw;
  }
  .wlb .event ul li:nth-child(4) {
    width: calc(65.7% - 4.8vw);
    margin: 0 0 0vw;
    padding: 4.5vw 2.1vw 2.7vw 2.7vw;
    display: flex;
  }
  .wlb .event ul li h3 {
    font-size: 1.80vw;
    font-weight: bold;
    margin: 0 0 1.38vw;
    line-height: 1;
    color: #1AAEFA;
  }
  .wlb .event ul li .detail {
    font-size: 1.11vw;
    font-weight: bold;
    margin: 0 0 0vw;
    line-height: 2.0;
  }
  .wlb .event ul li .attention {
    font-size: 1.04vw;
    font-weight: 500;
    margin: 1.38vw 0 0vw;
    line-height: 2.0;
    color: #696969;
  }
  .wlb .event ul li .img_s {
    margin: 10px 0 0;
  }
  .wlb .event ul li .txt_cell {
    width: 33.6vw;
    margin-right: 3.3vw;
  }
  .wlb .event ul li:nth-child(3) .txt_cell {
    width: 100%;
    margin-right: 0vw;
  }
  .wlb .event ul li:nth-child(4) .txt_cell {
    width: 28.8vw;
    margin-right: 2.7vw;
  }
  .wlb .event ul li .img {
    width: calc(100% - 36.9vw);
  }
  .wlb .event ul li:nth-child(2) .img {
    width: calc(100% - 38.8vw);
  }
  .wlb .event ul li:nth-child(4) .img {
    width: calc(100% - 31.5vw);
  }

  .wlb .morebetter {
    background: url(../img/work-life-balance/morebetter_bg.jpg) no-repeat center;
    background-size: cover;
    padding: 9.375vw 0 7.7vw;
  }
  .wlb .morebetter h2 {
    font-size: 1.94vw;
    font-weight: bold;
    text-align: center;
    color: #fff;
    line-height: 1;
    margin: 0 auto 3.3vw;
  }
  .wlb .morebetter .lead {
    font-size: 1.17vw;
    font-weight: bold;
    line-height: 2.0;
    width: 42.1vw;
    margin: 0 auto 5.2vw;
    color: #fff;
  }
  .wlb .morebetter a {
    position: relative;
    display: block;
    width: 67.7vw;
    margin: 0 auto;
  }
  .wlb .morebetter a img {
    transition: all 0.2s;
  }
  .wlb .morebetter a:hover img {
    opacity: 0.7;
  }
  /*
  .wlb .morebetter a::after {
    display: block;
    position: absolute;
    content: "";
    bottom: 2.14vw;
    right: 2.43vw;
    width: 2.56vw;
    height: 2.56vw;
    background: url(../img/interview/icon_arrow.png) no-repeat center;
    background-size: 100% 100%;
    transition: all 0.2s;
  }
  .wlb .morebetter a:hover::after {
    right: 1.43vw;
  }
  */
}

@media (max-width: 767px) {
  .under_ttl h1 {
    line-height: 1.0;
  }
  .under_ttl h1 span {
    line-height: 0.8;
    margin-bottom: 2.0vw;
    display: block;
    margin-bottom: 0;
  }
  .under_ttl_img {
    position: relative;
    z-index: 6;
    margin-top: -32vw;
    margin-bottom: 0vw;
  }
  .wlb {
  }
  .wlb .ttl_cell {
    margin: 0 auto 8.0vw;
  }
  .wlb .ttl_cell h2 {
    width: max-content;
    height: 12.3vw;
    background: #fff;
    font-size: 11.7vw;
    font-weight: 600;
    line-height: 12.3vw;
    border: 1px solid #000;
    font-family: "Roboto Condensed", sans-serif;
    transform: rotate(-2.98deg);
    margin: 0 auto 4.0vw;
    padding: 0 3.3vw;
  }
  .wlb .ttl_cell p {
    text-align: center;
    line-height: 1;
    font-size: 4.26vw;
    color: #fff;
    font-weight: 500;
  }
  .wlb .event .ttl_cell p {
    color: #000;
  }
  .wlb .bg_blu {
    position: relative;
    z-index: 2;
    margin-top: -0.5vw;
    background: url(../img/work-life-balance/bg_blu.png) no-repeat center;
    background-size: cover;
    padding: 16vw 0 9.16vw;
  }
  .wlb .bg_blu ul {
    width: 80vw;
    margin: 0 auto 24vw;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
  }
  .wlb .bg_blu .cell:last-of-type ul {
    margin: 0 auto;
  }
  .wlb .bg_blu ul li {
    position: relative;
    width: 100%;
    height: auto;
    margin: 0 0 2.0vw;
    padding: 7.3vw 0 12vw;
    background: url(../img/work-life-balance/list_bg.png) no-repeat center;
    background-size: 100% 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
  }
  .wlb .bg_blu ul li .num {
    position: absolute;
    top: 3.2vw;
    left: 3.8vw;
    font-family: "Roboto Condensed", sans-serif;
    transform: rotate(-2.98deg);
    font-size: 7.46vw;
    font-weight: 600;
    color: #1AAEFA;
    margin: 0;
  }
  .wlb .bg_blu ul li .img {
    width: 17.6vw;
    margin: 0 auto 2.6vw;
  }
  .wlb .bg_blu .cell:last-of-type ul li:last-child .img {
    width: 30.6vw;
  }
  .wlb .bg_blu ul li .ttl {
    text-align: center;
    display: flex;
    align-items: center;
    flex-direction: column;
    font-size: 4.26vw;
    font-weight: bold;
    line-height: 1.4;
    margin: 0 auto 6.6vw;
  }
  .wlb .bg_blu ul li .ttl span {
    font-size: 3.73vw;
    color: #838383;
  }
  .wlb .bg_blu ul li .detail {
    width: 64.2vw;
    font-size: 3.73vw;
    font-weight: 500;
    line-height: 1.75;
    margin: 0 auto 0vw;
  }
  .wlb .bg_blu ul li .detail span {
    font-size: 3.46vw;
    color: #6D6D6D;
  }
  .wlb .bg_blu ul li .attention {
    width: 64.2vw;
    font-size: 3.2vw;
    font-weight: 500;
    line-height: 1.75;
    margin: 5.3vw auto 0vw;
    color: #6D6D6D;
  }
  .wlb .event {
    margin: 0 0 10.1vw;
  }
  .wlb .event .ttl_cell {
    margin-top: -8.125vw;
  }
  .wlb .event .ttl_cell h2 {
    border: 2px solid #000;
  }
  .wlb .event .lead {
    font-size: 4.8vw;
    font-weight: 500;
    line-height: 2.0;
    width: 83.2vw;
    margin: 0 auto 14.6vw;
  }
  .wlb .event ul {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    width: 82.4vw;
    margin: 0 auto;
  }
  .wlb .event ul li {
    margin: 0 0 0;
    background: #F8F8F8;
  }
  .wlb .event ul li:nth-child(1) {
    width: calc(100% - 13.2vw);
    margin: 0 0 5.3vw;
    padding: 12vw 6.6vw 12vw 6.6vw;
    display: flex;
    flex-direction: column;
  }
  .wlb .event ul li:nth-child(2) {
    width: calc(100% - 13.2vw);
    margin: 0 0 5.3vw;
    padding: 12vw 6.6vw 12vw 6.6vw;
    display: flex;
    flex-direction: column;
  }
  .wlb .event ul li:nth-child(3) {
    width: calc(100% - 13.2vw);
    margin: 0 0 5.3vw;
    padding: 12vw 6.6vw 12vw 6.6vw;
  }
  .wlb .event ul li:nth-child(4) {
    width: calc(100% - 13.2vw);
    margin: 0 0 0vw;
    padding: 12vw 6.6vw 12vw 6.6vw;
    display: flex;
    flex-direction: column;
  }
  .wlb .event ul li h3 {
    font-size: 5.33vw;
    font-weight: bold;
    margin: 0 0 10.1vw;
    line-height: 1;
    color: #1AAEFA;
  }
  .wlb .event ul li .detail {
    font-size: 3.73vw;
    font-weight: bold;
    margin: 0 0 0vw;
    line-height: 2.0;
  }
  .wlb .event ul li .attention {
    font-size: 3.2vw;
    font-weight: 500;
    margin: 5.8vw 0 0vw;
    line-height: 1.68;
    color: #696969;
  }
  .wlb .event ul li .img_s {
    margin: 20px 0 0;
  }
  .wlb .event ul li .txt_cell {
    width: 100%;
    margin-bottom: 9.3vw;
  }
  .wlb .event ul li:nth-child(3) .txt_cell {
    margin-bottom: 0vw;
  }
  .wlb .event ul li .img {
    width: 92.5vw;
    margin-left: -11.3vw;
  }
  .wlb .event ul li:nth-child(2) .img {
    width: 91.4vw;
    margin-left: -6.6vw;
  }
  .wlb .event ul li:nth-child(4) .img {
    width: 94.4vw;
    margin-left: -9.6vw;
  }

  .wlb .morebetter {
    background: url(../img/work-life-balance/morebetter_bg_sp.jpg) no-repeat center;
    background-size: cover;
    padding: 13.3vw 0 12vw;
  }
  .wlb .morebetter h2 {
    font-size: 5.33vw;
    font-weight: bold;
    text-align: center;
    color: #fff;
    line-height: 1;
    margin: 0 auto 8.8vw;
  }
  .wlb .morebetter .lead {
    font-size: 3.73vw;
    font-weight: bold;
    line-height: 2.0;
    width: 82.6vw;
    margin: 0 auto 8vw;
    color: #fff;
  }
  .wlb .morebetter a {
    display: block;
    width: 82.6vw;
    margin: 0 auto;
  }
}
