@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&display=swap");
/* 色設定 */
/* ============================================ */
/* 共通 */
html {
  font-family: YakuHanJP, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif, "Times New Roman", "Hiragino Mincho ProN";
  overflow-x: hidden;
  font-size: 1px;
}

body {
  overflow-x: hidden;
  font-size: 16rem;
  line-height: 1.6;
  font-weight: 400;
}

p,
td,
th,
li {
  font-size: 15rem;
  line-height: 1.6;
}

body {
  overflow-x: hidden;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 300;
}

.no-scroll {
  overflow: hidden;
}

.viewport-s {
  max-width: 780px;
  width: 100%;
  padding: 0 16px;
  margin: 0 auto;
  box-sizing: content-box;
}

.viewport-m {
  max-width: 1080px;
  width: 100%;
  padding: 0 16px;
  margin: 0 auto;
  box-sizing: content-box;
}

.viewport-l {
  width: 100%;
}

.flex-container {
  display: flex;
}

.is-bold {
  font-weight: 700;
}

.is-underlined {
  text-decoration: underline;
}

img {
  width: 100%;
  height: auto;
  vertical-align: middle;
}

.inline-link {
  text-decoration: underline;
  color: blue;
}

.pc {
  display: block;
}

.sp {
  display: none;
}

.btn {
  background: linear-gradient(to right, #038d31, #61C359);
  background-size: 200% 100%;
  margin: 0 auto;
  padding: 20rem 60rem;
  font-size: 18rem;
  color: white;
  border-radius: 100px;
  font-family: 'Times New Roman';
  font-style: italic;
  letter-spacing: 4rem;
}

.btn:hover {
  transition-duration: .5s;
  background-position: 100% 0;
}

/* ============================================ */
/* ヘッダー */
header {
  box-shadow: 1px 10px 30px 0 rgba(0, 0, 0, 0.05);
  width: 100%;
  position: fixed;
  z-index: 11;
  background-color: white;
}

header nav {
  display: flex;
  height: 80rem;
  align-items: center;
  background-color: #ffffff;
}

header nav h1 {
  color: #61C359;
  font-weight: bold;
  margin-right: 13rem;
  font-size: 20rem;
}

header nav .sub-title {
  font-size: 15rem;
  padding-left: 13rem;
  border-left: 1px solid #DDDDDD;
  font-family: Noto Sans;
  color: #656678;
}

header nav .sub-title span {
  font-family: "Times New Roman";
  font-style: italic;
}

header nav .menu-list {
  margin: 0 20rem 0 auto;
  display: flex;
  align-items: center;
}

header nav .menu-list > li {
  margin-right: 25rem;
  font-weight: 500;
  font-size: 16rem;
}

header nav .menu-list > li:hover {
  color: #61C359;
}

header nav .btn-container {
  display: flex;
  transform: translateX(-20rem);
}

header nav .btn-container .entry-btn {
  background: linear-gradient(to bottom right, #61C359 50%, #038d31);
  width: 100rem;
  height: 100rem;
  position: relative;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  z-index: 1;
  box-shadow: 0 0px 5px 0 rgba(0, 0, 0, 0.4);
  margin-left: 10rem;
}

header nav .btn-container .entry-btn p {
  position: absolute;
  text-align: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 20rem;
  line-height: 1.2;
  color: white;
  font-family: "Times New Roman";
  font-style: italic;
}

header nav .btn-container .entry-btn p span {
  font-family: Noto Sans;
  font-style: normal;
  font-size: 11rem;
  line-height: 1;
}

header nav .btn-container a .darkblue {
  background: linear-gradient(to right bottom, #038d31, #61C359);
}

header nav .btn-container .entry-btn:hover {
  transition-duration: .5s;
  transform: translateY(10rem);
}

/* ============================================ */
main {
  /* セクション mainvisual*/
  /* ============================================ */
  /* ============================================ */
  /* セクション breadcrumb*/
}

main #mainvisual {
  margin-top: 80rem;
  position: relative;
}

main #mainvisual .mainvisual {
  height: 500px;
  width: 90%;
  margin: 0 0 0 15%;
  background-size: contain;
  background-size: cover;
  background-position: center;
  border-bottom-left-radius: 50px;
}

main #mainvisual .main-interview {
  background-image: url(../img/img_main_interview.jpg);
}

main #mainvisual .main-recruit {
  background-image: url(../img/img_main_recruit.jpg);
  height: 600px;
}

main #mainvisual .main-interview1 {
  background-image: url(../img/img_main_interview1.jpg);
}

main #mainvisual .main-interview2 {
  background-image: url(../img/img_main_interview2.jpg);
}

main #mainvisual .main-interview3 {
  background-image: url(../img/img_main_interview3.jpg);
}

main #mainvisual .main-interview4 {
  background-image: url(../img/img_main_interview4.jpg);
}

main #mainvisual .main-index {
  background-image: url(../img/img_main_index.jpg);
}

main #mainvisual figure {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 25%;
  left: 8%;
}

main #mainvisual .figure2 {
  transform: translateY(-10%);
}

main #mainvisual .interview-page .mainvisual {
  height: 600px;
  background-position: top;
}

main #mainvisual .interview-page figure {
  top: 70%;
  width: 50%;
}

main #mainvisual .index .mainvisual {
  height: 600px;
  background-position: top;
}

main #mainvisual .index figure {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40%;
  left: 8%;
}

main #profile {
  margin-top: 100rem;
}

main #profile .name {
  font-size: 50rem;
  line-height: 1;
  font-family: 'Times New Roman';
  font-style: italic;
  letter-spacing: 3.5rem;
  text-align: center;
  margin-bottom: 10rem;
  color: #00021C;
}

main #profile .name span {
  color: #61C359;
}

main #profile .index {
  font-size: 70rem;
}

main #profile .position {
  font-size: 16rem;
  font-family: Noto Sans;
  color: #00021C;
  text-align: center;
  margin-bottom: 50rem;
}

main #profile p {
  text-align: center;
  font-size: 16rem;
  font-family: Noto Sans;
  line-height: 2;
  color: #00021C;
}

main #profile hr {
  border: none;
  border-bottom: 2px solid #DDDDDD;
  margin: 100rem auto;
  width: 80rem;
}

main #breadcrumb {
  background-color: #f0f0f0;
  padding: 14rem 0;
}

main #breadcrumb p span {
  font-weight: bold;
}

main #breadcrumb p .is-blue {
  color: #61C359;
}

/* ============================================ */
/* セクション footer*/
footer {
  background-color: #F4F7FA;
  padding-top: 80rem;
  display: flex;
}

footer .footer-logo {
  width: 250rem;
}

footer .footer-logo p {
  color: #61C359;
  font-weight: bold;
  font-size: 24rem;
}

footer .footer-logo .sub-title {
  margin-top: 10rem;
  font-size: 15rem;
  font-family: Noto Sans;
  color: #656678;
}

footer .footer-logo .sub-title span {
  font-family: "Times New Roman";
  font-style: italic;
}

footer .sitemap-list {
  margin: 0 0 0 auto;
  display: flex;
}

footer .sitemap-list > li {
  font-weight: 500;
  margin-left: 40rem;
}

footer .sitemap-list > li:hover {
  color: #61C359;
}

footer .sitemap-list2 {
  display: flex;
  justify-content: end;
  margin-top: 60rem;
  margin-bottom: 20rem;
  color: #656678;
}

footer .sitemap-list2 > li {
  margin-left: 30rem;
}

footer .sitemap-list2 > li:hover {
  color: #61C359;
}

footer .copy-right {
  text-align: right;
  margin-bottom: 80rem;
  color: #656678;
}

/* ============================================ */
/* SP */
@media screen and (max-width: 1080px) {
  html {
    position: relative;
    font-size: 0.76px;
  }
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
  .viewport-s {
    box-sizing: border-box;
  }
  .viewport-m {
    box-sizing: border-box;
  }
  .hamburger-menu {
    width: 60rem;
    height: 60rem;
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    z-index: 11;
    position: fixed;
  }
  .hamburger-menu span {
    display: block;
    width: 26px;
    height: 2px;
    background-color: #61C359;
    position: absolute;
    transition: all 0.2s linear;
  }
  .hamburger-menu span:nth-child(1) {
    top: 16px;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .hamburger-menu span:nth-child(2) {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .hamburger-menu span:nth-child(3) {
    bottom: 16px;
    left: 50%;
    transform: translate(-50%, 50%);
  }
  .hamburger-menu.is-open span:nth-child(1) {
    transform: translate(-50%, -50%) rotate(45deg);
    top: 50%;
  }
  .hamburger-menu.is-open span:nth-child(2) {
    opacity: 0;
  }
  .hamburger-menu.is-open span:nth-child(3) {
    transform: translate(-50%, 50%) rotate(-45deg);
    bottom: 50%;
  }
  .hamburger-menu-list {
    z-index: 10;
    right: 0;
    left: 0;
    top: 0;
    width: 100vw;
    margin-top: 0rem;
    height: calc(100vh);
    background-color: white;
    position: fixed;
    color: black;
    font-weight: 500;
    flex-direction: column;
    transform: translateX(100%);
    transition: all 0.2s linear;
    padding-top: 70rem;
  }
  .hamburger-menu-list.is-open {
    transform: translateX(0);
  }
  .hamburger-menu-list li {
    width: 100%;
    border-bottom: #cccccc solid 1px;
    font-size: 22rem;
    text-align: center;
    padding: 0;
    margin-right: 0 !important;
  }
  .hamburger-menu-list li > a {
    padding: 22rem;
    width: 100%;
    height: 100%;
    display: block;
  }
  .hamburger-menu-list li:not(:first-child) {
    margin-left: 0;
  }
  .hamburger-menu-list li:first-child {
    border-top: #cccccc solid 1px;
  }
  .hamburger-menu-list li:hover {
    color: #61C359;
  }
  /* ============================================ */
  /* ヘッダー */
  header .viewport-m {
    padding: 0;
  }
  header nav {
    display: flex;
    height: 60rem;
    position: relative;
  }
  header nav h1 {
    margin-right: 0rem;
    font-size: 24rem;
    position: absolute;
    left: 10px;
  }
  header nav .sub-title {
    display: none;
  }
  header nav .menu-list {
    display: none;
  }
  header nav .btn-container {
    position: absolute;
    transform: translate(0px, 100%);
    bottom: 0;
    right: 0;
    z-index: -1;
  }
  header nav .btn-container .entry-btn {
    width: 90rem;
    height: 70rem;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0.4);
    margin-left: 6px;
  }
  header nav .btn-container .entry-btn:hover {
    transition-duration: .5s;
    transform: translateY(0rem);
  }
  /* ============================================ */
  main {
    /* セクション mainvisual*/
    /* ============================================ */
    /* ============================================ */
  }
  main #mainvisual {
    margin-top: 60rem;
  }
  main #mainvisual .mainvisual-img {
    height: 300px;
    width: 90%;
  }
  main #mainvisual figure {
    width: 35%;
  }
  main #mainvisual .main-recruit {
    height: 200px;
  }
  main #mainvisual .interview-page .mainvisual {
    height: 400px;
  }
  main #mainvisual .interview-page figure {
    top: 60%;
    width: 80%;
  }
  main #mainvisual .index .mainvisual {
    height: 400px;
  }
  main #mainvisual .index figure {
    width: 80%;
  }
  /* ============================================ */
  /* セクション footer*/
  footer .flex-container {
    display: block;
  }
  footer .sitemap-list {
    display: block;
    margin-top: 30rem;
  }
  footer .sitemap-list > li {
    margin-left: 0rem;
  }
  footer .sitemap-list2 {
    display: block;
    margin-top: 30rem;
  }
  footer .sitemap-list2 > li {
    margin-left: 0rem;
  }
  footer .copy-right {
    text-align: center;
    margin-bottom: 20rem;
  }
  /* ============================================ */
}

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