@charset "UTF-8";
html {
  font-size: 18px; }
  @media screen and (max-width: 700px) {
    html {
      font-size: 15px; } }
.body {
  font-family: 'Yomogi', sans-serif;
  display: grid;
  grid-template: "header header              header  " auto ".      main                .       " auto "footer footer              footer  " auto/1fr minmax(0, 1000px) 1fr; }
  .body:before {
    content: '';
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: url(static/img/bg.jpg) center/cover no-repeat, #fff8;
    background-blend-mode: overlay;
    z-index: -10; }
  .body-likeness {
    display: block;
    position: fixed;
    width: 100vw;
    height: 100vh;
    z-index: -5;
    opacity: 0.5; }
  .body-likeness_img {
    display: block;
    opacity: 1;
    position: absolute;
    border-radius: 100%;
    width: 50px;
    height: 50px;
    animation: likeness_loop 5s ease-in-out infinite;
    transition: opacity 0.5s; }

@keyframes likeness_loop {
  0% {
    transform: translateY(0); }
  50% {
    transform: translateY(-20px); }
  100% {
    transform: translateY(0); } }
    .body-likeness_img-ready {
      opacity: 0; }

.header {
  grid-area: header;
  position: relative;
  padding: 1rem;
  display: grid; }
  .header--top {
    height: 100vh;
    grid-template: "title      .       " auto "caption    .       " auto ".          .       " 1fr "catch      catch   " auto ".          .       " 1fr "down       down    " auto /500px      1fr; }
    @media screen and (max-width: 700px) {
      .header--top {
        grid-template: "title      " auto "caption    " auto ".          " 1fr "catch      " auto ".          " 1fr "down       " auto /1fr; } }
    .header--top:before {
      color: var(--sub-color);
      grid-area: down;
      display: block;
      content: '';
      background: currentColor;
      mask: url("static/img/top/down.svg") center/contain no-repeat;
      -webkit-mask: url("static/img/top/down.svg") center/contain no-repeat;
      width: 3rem;
      height: 3rem;
      border: solid var(--sub-color) 1px;
      border-radius: 100%;
      margin: auto; }
  .header--news, .header--office {
    grid-template: "title              catch       " auto "caption            catch       " auto "breadcrumb         breadcrumb  "/minmax(0, 650px) 1fr; }
    @media screen and (max-width: 1200px) {
      .header--news, .header--office {
        grid-template: "title              .           " auto "caption            .           " auto "catch              catch       " auto "breadcrumb         breadcrumb  "/minmax(0, 650px) 1fr; } }
  .header--office {
    grid-template: ".          title           .           " auto ".          caption         .           " auto "breadcrumb breadcrumb      breadcrumb  "/1fr minmax(0, 650px) 1fr;
    max-width: 1200px;
    width: 100%;
    margin: auto; }
    .header--office h1 {
      display: none; }
  .header-catch {
    grid-area: catch;
    font-weight: bold;
    font-size: 3rem;
    color: var(--sub-color);
    text-shadow: 2px 2px 5px #FFFFFF;
    text-stroke: 3px var(--sub-color);
    -webkit-text-stroke: 3px var(--sub-color);
    text-align: right;
    text-align: center;
    animation: fadeIn 4s ease-in-out; }
    @media screen and (max-width: 1200px) {
      .header-catch {
        font-size: 2.5rem;
        text-stroke: 2.5px var(--sub-color);
        -webkit-text-stroke: 2.5px var(--sub-color); } }
    @media screen and (max-width: 700px) {
      .header-catch {
        font-size: 6.1vw;
        text-stroke: 0.5vw var(--sub-color);
        -webkit-text-stroke: 0.5vw var(--sub-color); } }
@keyframes fadeIn {
  0% {
    opacity: 0; }
  25% {
    opacity: 0; }
  100% {
    opacity: 1; } }
  .header-title {
    grid-area: title; }
  .header-caption {
    grid-area: caption;
    text-align: right;
    font-size: 0.9rem; }
  .header-philosophy {
    grid-area: philosophy;
    font-size: 1.1rem;
    font-weight: bold;
    color: var(--sub-color);
    text-shadow: 2px 2px 10px #FFFFFF;
    text-align: right;
    display: none; }
  .header-philosophy_line {
    font-weight: unset; }
  .header-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: white; }
    .header-bg:after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(255, 255, 255, 0.5); }
  .header-bg_img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    animation-iteration-count: infinite;
    animation-timing-function: ease;
    opacity: 0; }
  .header-breadcrumb {
    grid-area: breadcrumb;
    list-style: none;
    width: 100%;
    padding: 0 1rem; }
  .header-breadcrumb_item:not(:last-child) {
    float: left;
    padding-right: 0.5rem; }
    .header-breadcrumb_item:not(:last-child):after {
      padding-left: 0.5rem;
      content: '>'; }

.footer {
  grid-area: footer;
  background: linear-gradient(to bottom, #fff0 0%, var(--main-color) 25%, var(--main-color) 100%);
  display: flex;
  padding: 4rem 2rem 2rem;
  justify-content: space-between;
  color: white;
  font-weight: bold;
  position: relative;
  margin-top: 100px; }
  @media screen and (max-width: 700px) {
    .footer {
      flex-flow: column; } }
  .footer-copyright {
    text-align: right;
    align-self: end; }

.threads_iframe {
  border: none;
  width: 100%; }

main {
  grid-area: main;
  padding: 1rem; }

/***************
  Common Style
 ***************/
.section-frame {
  background: url("static/img/note-middle.png") center/contain repeat-y;
  background-clip: padding-box;
  padding: 2rem 4rem;
  position: relative;
  border-top: calc(90 / 1487 * 100cqw) solid transparent;
  border-bottom: calc(58 / 1487 * 100cqw) solid transparent;
  margin: 3rem 0; }
  @media screen and (max-width: 700px) {
    .section-frame {
      margin: 80px 20px;
      padding: 2rem 2rem; } }
  .section-frame:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-90%);
    width: 100%;
    background: url("static/img/note-top.png") center/contain no-repeat;
    aspect-ratio: 1487/90; }
  .section-frame:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    transform: translateY(90%);
    width: 100%;
    background: url("static/img/note-bottom.png") center/contain no-repeat;
    aspect-ratio: 1487/58; }

.section-main_heading {
  position: relative;
  font-size: 2.5rem;
  font-weight: bold;
  line-height: 3rem;
  padding-left: 1em;
  margin: 5rem 0 0.5rem;
  text-stroke: 3px black;
  -webkit-text-stroke: 3px black; }
  .section-main_heading:before {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    display: block;
    width: 3rem;
    height: 3rem;
    background-color: var(--main-color);
    border-radius: 100%;
    filter: blur(1rem);
    z-index: -1; }

.section-sub_heading {
  font-size: 1.5rem;
  font-weight: bold;
  color: var(--main-color);
  display: flex;
  gap: 0.5em;
  justify-content: center;
  margin-bottom: 1rem; }
  .section-sub_heading:before {
    content: 'ー'; }
  .section-sub_heading:after {
    content: 'ー'; }

.section-indent_text {
  text-indent: 1em; }

/***************
  Pages Style
 ***************/
.top_page {
  margin: 0 auto 0; }
  .top_page .nav {
    grid-area: nav;
    border-bottom: 5px dashed var(--main-color);
    font-size: 1.3rem;
    color: #007240; }
    .top_page .nav-list {
      display: flex;
      list-style: none;
      gap: 1em;
      flex-wrap: wrap; }
    .top_page .nav-link {
      all: unset;
      cursor: pointer;
      font-weight: bold; }
  .top_page .about {
    grid-area: about; }
    .top_page .about h4 {
      margin-top: 1rem;
      font-size: 1.2rem;
      text-stroke: 1.5px black;
      -webkit-text-stroke: 1.5px black; }
  .top_page .study {
    grid-area: study; }
    .top_page .study-content {
      display: grid;
      grid-template: "about  sns     " 1fr "about  links   " auto /1fr    300px; }
      @media screen and (max-width: 700px) {
        .top_page .study-content {
          display: block; } }
    .top_page .study-about {
      grid-area: about; }
      .top_page .study-about h4 {
        font-size: 1.2rem;
        text-stroke: 1.5px black;
        -webkit-text-stroke: 1.5px black; }
    .top_page .study-sns {
      grid-area: sns; }
    .top_page .study-links {
      grid-area: links; }
  .top_page .episode {
    grid-area: episode; }
    .top_page .episode-select_list {
      display: flex;
      justify-content: center;
      list-style: none;
      flex-wrap: wrap; }
    .top_page .episode-select_item {
      display: flex;
      flex-flow: column;
      justify-content: center;
      align-items: center;
      padding: 0.5rem;
      border: solid #00000000 3px;
      border-radius: 1rem; }
      .top_page .episode-select_item-a:before {
        content: '';
        background: url("static/img/top/episode-a.png") center/contain no-repeat;
        display: block;
        width: 5rem;
        height: 5rem;
        filter: grayscale(100%); }
      .top_page .episode-select_item-b:before {
        content: '';
        background: url("static/img/top/episode-b.png") center/contain no-repeat;
        display: block;
        width: 5rem;
        height: 5rem;
        filter: grayscale(100%); }
      .top_page .episode-select_item-c:before {
        content: '';
        background: url("static/img/top/episode-c.png") center/contain no-repeat;
        display: block;
        width: 5rem;
        height: 5rem;
        filter: grayscale(100%); }
      .top_page .episode-select_item-d:before {
        content: '';
        background: url("static/img/top/episode-d.png") center/contain no-repeat;
        display: block;
        width: 5rem;
        height: 5rem;
        filter: grayscale(100%); }
      .top_page .episode-select_item:has(*:checked) {
        color: var(--sub-color);
        border: solid var(--sub-color) 3px;
        border-radius: 1rem; }
        .top_page .episode-select_item:has(*:checked):before {
          filter: unset; }
    .top_page .episode-select_checkbox {
      display: none; }
    .top_page .episode-item_list {
      margin-left: 1rem;
      border-left: solid #007340 0.3rem; }
    .top_page .episode-item_term {
      padding-left: 1rem;
      padding-top: 1rem;
      font-weight: bold;
      font-size: 1.2rem;
      position: relative; }
    .top_page .episode-item_term::before {
      content: '';
      width: 1rem;
      height: 1rem;
      background: white;
      position: absolute;
      left: -0.6rem;
      top: 1.4rem;
      border-radius: 100%;
      border: solid #007340 5px; }
    .top_page .episode-item_term-turning:before {
      background: #007340; }
    .top_page .episode-item_data {
      padding-left: 1rem; }
  .top_page .offices {
    grid-area: offices; }
    .top_page .offices-category {
      padding-bottom: 2rem; }
    .top_page .offices-list {
      display: flex;
      list-style: none; }
      @media screen and (max-width: 700px) {
        .top_page .offices-list {
          flex-flow: column; } }
    .top_page .offices-link {
      all: unset;
      cursor: pointer;
      display: flex;
      flex-flow: column;
      align-items: center; }
    .top_page .offices-name {
      display: none; }
    .top_page .offices-caption {
      font-size: 0.8rem; }
  .top_page .recruit {
    grid-area: recruit; }
    .top_page .recruit-select_list {
      display: flex;
      justify-content: start;
      list-style: none;
      gap: 0.5rem; }
    .top_page .recruit-select_item {
      display: flex;
      flex-flow: column;
      justify-content: center;
      align-items: center;
      padding: 0.5rem;
      border: solid #00000000 3px;
      border-radius: 1rem;
      font-size: 1.2rem;
      cursor: pointer; }
      .top_page .recruit-select_item:has(*:checked) {
        color: var(--sub-color);
        border: solid var(--sub-color) 3px;
        border-radius: 1rem; }
    .top_page .recruit-select_checkbox {
      display: none; }
    .top_page .recruit-body {
      list-style: none; }
    .top_page .recruit-item {
      padding: 0.5rem; }
      .top_page .recruit-item-wanted {
        cursor: pointer; }
        .top_page .recruit-item-wanted summary:after {
          font-size: 1rem;
          padding: 0.2rem 0.4rem;
          border-radius: 10px;
          border: solid var(--sub-color) 2px;
          content: '開く';
          background: var(--sub-color);
          color: white; }
        .top_page .recruit-item-wanted[open] summary:after {
          content: '閉じる';
          background: none;
          color: var(--sub-color); }
    .top_page .recruit-title {
      list-style: none;
      font-size: 1.2rem;
      display: flex;
      gap: 0.5rem;
      align-items: center; }
    .top_page .recruit-status {
      font-size: 1rem;
      background: gray;
      color: white;
      border-radius: 10px;
      padding: 0.3rem 0.5rem; }
      .top_page .recruit-status-wanted {
        background: var(--main-color); }
      .top_page .recruit-status-stopped {
        background: gray; }
    .top_page .recruit-data_list {
      display: grid;
      grid-template-columns: 10em 1fr;
      gap: 0.5em 1em;
      padding-left: 1rem; }
    .top_page .recruit-term {
      font-weight: bold;
      grid-column: 1; }
    .top_page .recruit-data {
      grid-column: 2; }
    .top_page .recruit-images {
      list-style: none;
      display: flex; }
  .top_page .news-link {
    all: unset;
    cursor: pointer;
    display: flex;
    width: 100%;
    min-width: 0; }
    @media screen and (max-width: 700px) {
      .top_page .news-link {
        flex-flow: column; } }
  .top_page .news-figure {
    max-width: 250px;
    margin: auto; }
  .top_page .news-info {
    min-width: 0;
    max-width: 100%;
    flex: 1; }
  .top_page .news-title {
    font-size: 1.5rem;
    font-weight: bold;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    overflow: hidden;
    overflow-wrap: anywhere;
    word-break: break-all; }
  .top_page .news-body {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    line-clamp: 5;
    overflow: hidden;
    overflow-wrap: anywhere;
    word-break: break-all; }

.eddy_page {
  margin: 0 auto 0;
  display: grid;
  grid-gap: 1rem;
  grid-template: "about      about       video       " auto "map        summary     summary     " auto "instagram  instagram   instagram   " auto /2fr        1fr         2fr; }
  @media screen and (max-width: 700px) {
    .eddy_page {
      grid-template: "eye_catch  " auto "video      " auto "about      " auto "map        " auto "summary    " auto "instagram  " auto /1fr; } }
  .eddy_page .eye_catch {
    grid-area: eye_catch; }
    .eddy_page .eye_catch-img {
      width: 100%; }
  .eddy_page .video {
    grid-area: video; }
  .eddy_page .about {
    grid-area: about; }
  .eddy_page .instagram {
    grid-area: instagram;
    align-content: center; }
    .eddy_page .instagram-list {
      list-style: none; }
    .eddy_page .instagram-item {
      display: flex;
      align-items: center; }
      .eddy_page .instagram-item:nth-child(even) {
        flex-flow: row-reverse; }
    .eddy_page .instagram-qr {
      flex: 1 1 0;
      min-width: 0; }
      @media screen and (max-width: 700px) {
        .eddy_page .instagram-qr {
          display: none; } }
    .eddy_page .instagram-img {
      width: 100%; }
    .eddy_page .instagram-iframe {
      flex: 2 2 0;
      max-width: 598px; }
      .eddy_page .instagram-iframe iframe {
        width: 100% !important; }
  .eddy_page .summary {
    grid-area: summary; }
    .eddy_page .summary-term {
      font-weight: bold;
      float: left; }
      .eddy_page .summary-term:after {
        content: '：'; }
    .eddy_page .summary-data {
      padding-bottom: 0.5em; }
  .eddy_page .use {
    grid-area: use; }
    .eddy_page .use-term {
      font-weight: bold; }
      .eddy_page .use-term:after {
        content: '：'; }
    .eddy_page .use-data {
      padding-bottom: 0.5em; }
  .eddy_page .map {
    grid-area: map; }
    .eddy_page .map-iframe {
      width: 100%;
      height: 100%; }

.group_page {
  margin: 0 auto 0;
  display: grid;
  grid-gap: 1rem;
  grid-template: "eye_catch  eye_catch   eye_catch   " auto "about      about       instagram   " auto "map        map         instagram   " auto "summary    use         use         " auto /3fr        1fr         2fr; }
  @media screen and (max-width: 700px) {
    .group_page {
      grid-template: "eye_catch  " auto "about      " auto "map        " auto "summary    " auto "use        " auto "instagram  " auto /1fr; } }
  .group_page .eye_catch {
    grid-area: eye_catch; }
    .group_page .eye_catch-img {
      width: 100%;
      max-width: 500px;
      margin: auto; }
  .group_page .video {
    grid-area: video; }
  .group_page .about {
    grid-area: about; }
  .group_page .summary {
    grid-area: summary; }
    .group_page .summary-term {
      font-weight: bold;
      float: left; }
      .group_page .summary-term:after {
        content: '：'; }
    .group_page .summary-data {
      padding-bottom: 0.5em; }
  .group_page .use {
    grid-area: use; }
    .group_page .use-term {
      font-weight: bold; }
      .group_page .use-term:after {
        content: '：'; }
    .group_page .use-data {
      padding-bottom: 0.5em; }
  .group_page .map {
    grid-area: map; }
    .group_page .map-iframe {
      width: 100%;
      height: 100%; }
  .group_page .instagram {
    grid-area: instagram; }

.short_page {
  margin: 0 auto 0;
  display: grid;
  grid-gap: 1rem;
  grid-template: "eye_catch  eye_catch   eye_catch   " auto "about      about       instagram   " auto "map        map         instagram   " auto "summary    use         use         " auto /3fr        1fr         2fr; }
  @media screen and (max-width: 700px) {
    .short_page {
      grid-template: "eye_catch  " auto "about      " auto "map        " auto "summary    " auto "use        " auto "instagram  " auto /1fr; } }
  .short_page .eye_catch {
    grid-area: eye_catch; }
    .short_page .eye_catch-img {
      width: 100%;
      max-width: 500px;
      margin: auto; }
  .short_page .video {
    grid-area: video; }
  .short_page .about {
    grid-area: about; }
  .short_page .summary {
    grid-area: summary; }
    .short_page .summary-term {
      font-weight: bold;
      float: left; }
      .short_page .summary-term:after {
        content: '：'; }
    .short_page .summary-data {
      padding-bottom: 0.5em; }
  .short_page .use {
    grid-area: use; }
    .short_page .use-term {
      font-weight: bold; }
      .short_page .use-term:after {
        content: '：'; }
    .short_page .use-data {
      padding-bottom: 0.5em; }
  .short_page .map {
    grid-area: map; }
    .short_page .map-iframe {
      width: 100%;
      height: 100%; }
  .short_page .instagram {
    grid-area: instagram; }

.news_page {
  display: grid;
  margin: 0 auto 0; }
  .news_page .meta {
    text-align: right; }
  .news_page .eye_catch-img {
    margin: auto; }
  .news_page .news_body img {
    height: 100%; }