@charset "UTF-8";
@media screen and (max-width: 767px) {
  /* wrapper */
  #wrapper {
    min-width: 300px;
  }
  /* home header */
  .home header {
    width: 100%;
    height: 100vh;
    min-height: -webkit-fill-available;
    min-height: 700px;
    margin-bottom: 0;
  }
  @supports (-webkit-touch-callout: none) {
    .home header {
      height: -webkit-fill-available;
    }
  }
  .home header nav {
    display: none;
  }
  /* fv */
  .home header #fv #title_en {
    position: absolute;
    bottom: 27px;
    left: 4.5%;
    min-width: auto;
    max-width: 330px;
    width: 55%;
  }
  .home header #fv #title_jp {
    position: absolute;
    top: 0;
    right: 3%;
    -webkit-transform: translate(0%, 0%);
    -moz-transform: translate(0%, 0%);
    -ms-transform: translate(0%, 0%);
    -o-transform: translate(0%, 0%);
    transform: translate(0%, 0%);
    height: 100%;
    padding: 22px 0;
    min-height: auto;
  }
  .home header #fv #mainphoto {
    display: none;
  }
  #mainphoto_sp {
    width: 100%;
    padding: 10px 4% 0;
    animation: .9s fadein .4s forwards;
    -webkit-animation: .9s fadein .4s forwards;
    opacity: 0;
  }
  /* home header about_text */
  .home header #about_text {
    position: absolute;
    top: 20px;
    left: 4.5%;
    display: block;
    width: 75%;
  }
  .home header #about_text .text_jp {
    width: 100%;
    font-size: 1.1em;
    line-height: 1.45;
    margin-bottom: 1em;
  }
  .home header #about_text .text_en {
    width: 100%;
    font-size: 1.05em;
    line-height: 1.25;
  }
  /* main */
  main .block {
    display: block;
  }
  main .block .midashi {
    display: none;
  }
  main .block .contents {
    width: 100%;
    padding: 3.5em 4% 4em;
    text-align: left;
  }
  main .block .contents h2 {
    text-align: left;
    font-size: 1.6em;
    margin-bottom: 1.5em;
  }
  main .block .contents .flex {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  /* works */
  #works .contents {
    padding-right: 0;
    padding-left: 0;
    padding-bottom: 0;
  }
  #works .contents h2 {
    padding-right: 4%;
    padding-left: 4%;
  }
  #works .contents .flex {
    padding-right: 4%;
    padding-left: 4%;
  }
  /* works slide */
  #works #slider {
    width: 100%;
    padding: 4em 0;
  }
  #works #slider .swiper-wrapper {
    width: auto;
    margin: 0 auto;
  }
  #works #slider .swiper-slide {
    width: 100%;
    overflow: hidden;
  }
  #works #slider .swiper-slide figure figcaption {
    margin-top: 1em;
    font-size: 0.7em;
    line-height: 1.5;
  }
  /* about */
  #about .contents .text_jp {
    text-align: justify;
    width: 100%;
    font-size: 1.15em;
    line-height: 1.5;
  }
  #about .contents .text_en {
    width: 100%;
    margin-top: 2em;
    font-size: 1.1em;
    line-height: 1.3;
  }
  /* biography */
  #biography .contents .text_jp {
    text-align: justify;
    width: 100%;
  }
  #biography .contents .text_en {
    width: 100%;
    margin-top: 4em;
  }
  #biography .contents .flex .text_jp h4 {
    font-size: 1.4em;
    line-height: 1;
    margin-bottom: 1em;
  }
  #biography .contents .flex .text_jp h4 span {
    font-size: 0.7em;
  }
  #biography .contents .flex .text_en h4 {
    font-size: 1.4em;
    line-height: 1;
    margin-bottom: 1em;
  }
  #biography .contents .flex .text_en h4 span {
    text-align: right;
    display: inline-block;
    margin-left: auto;
    font-size: 0.7em;
  }
  #biography .contents .flex .text_jp p {
    font-size: 1.15em;
    line-height: 1.5;
  }
  #biography .contents .flex .text_en p {
    font-size: 1.1em;
    line-height: 1.3;
  }
  #biography .contents #portrait {
    width: 100%;
    margin-top: 3em;
    margin-left: auto;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
  }
  #biography .contents #portrait figure {
    width: 60%;
  }
  #biography .contents #portrait p {
    width: 25%;
  }
  /* books */
  #books .contents {
    padding: 3.5em 4% 2em;
  }
  #books .contents .flex {
    justify-content: space-between;
  }
  #books .contents .flex .item {
    width: 47%;
    display: flex;
    flex-direction: column;
    margin-bottom: 2em;
  }
  #books .contents .flex .item h4 {
    margin-bottom: 0.5em;
    font-size: 1em;
  }
  #books .contents .flex .item p {
    font-size: 0.85em;
    line-height: 1.6;
  }
  #books .contents .flex .item a {
    margin-top: auto;
  }
  #books .contents .flex .item .button {
    width: 100%;
    padding: 0.2em 0;
    font-size: 1em;
    margin-top: 1.2em;
    margin-bottom: 0;
  }
  /* news */
  #news .contents {}
  #news .contents .flex {
    width: 100%;
    display: block;
  }
  #news .contents .flex ul li a {
    padding-bottom: 1em;
    margin-bottom: 1.25em;
    display: block;
    align-items: center;
  }
  #news .contents .flex ul li .date {
    margin-right: 0;
    margin-bottom: 0.5em;
    font-size: 1.15em;
    line-height: 1;
  }
  #news .contents .flex ul li .title {
    font-size: 1.2em;
    line-height: 1.9;
  }
  /* footer */
  footer {
    width: 100%;
    padding: 2.75em 4% 30px;
    position: relative;
    display: block;
  }
  footer #left {
    display: flex;
    flex-direction: column;
  }
  footer #left nav {
    display: none;
  }
  footer #left #info {
    text-align: left;
    margin-top: 0;
    display: block;
  }
  footer #left #info #contact {
    font-size: 0.9em;
    margin-right: 0;
    margin-bottom: 1em;
  }
  footer #left #info #policy {
    font-size: 0.9em;
  }
  footer #right {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin-top: 2.5em;
  }
  footer #right #ft_logo {
    margin-top: auto;
    margin-right: 0;
    margin-left: auto;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
  }
  footer #right #ft_logo #sakana {
    margin-top: auto;
    width: 35px;
    margin-right: auto;
  }
  footer #right #ft_logo #gallery5610 {
    margin-top: auto;
    width: 95px;
    margin-left: 1.5em;
  }
  /* layer header */
  .layer header {
    width: 100%;
    position: relative;
    overflow: hidden;
    padding: 25px 4% 4em;
  }
  .layer header nav {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .layer header nav h1 {
    width: 210px;
    min-width: auto;
    margin-right: auto;
    order: 1;
  }
  .layer header nav ul {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    text-align: left;
    order: 2;
  }
  .layer header nav ul li {
    margin-left: 0;
    font-size: 1.15em;
    margin-bottom: 0.35em;
  }
  /* layer news */
  .layer #news .contents {
    padding-top: 0;
  }
  .layer main .block .midashi {}
  .layer #news .contents .flex #other_midashi {
    margin-bottom: 2em;
    font-size: 1em;
    line-height: 1;
  }
  .layer #news .contents .flex #single {
    margin-bottom: 1.5em;
    padding-bottom: 3em;
  }
  .layer #news .contents .flex #single .date {
    font-size: 1.15em;
  }
  .layer #news .contents .flex #single .title {
    margin-bottom: 1.5em;
    font-size: 1.6em;
      line-height: 1.5;
  }
  .layer #news .contents .flex #single .entrybody p {
    font-size: 1.2em;
    line-height: 1.75;
    margin-bottom: 1em;
  }
  .layer #news .contents .flex #single .entrybody img {
    max-width: auto;
    width: 100%;
  }
}