@charset "UTF-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url("https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+Antique:wght@500&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500&display=swap");
@import url("https://use.fontawesome.com/releases/v5.6.3/css/all.css");
@import url("https://use.fontawesome.com/releases/v6.4.2/css/all.css");
.zasshi {
  background: #000;
  color: #000;
}
.zasshi .wrap {
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS Pゴシック", "MS PGothic", sans-serif;
}
.zasshi__content {
  display: flex;
  flex-direction: column;
}
@media only screen and (min-width: 768px) {
  .zasshi__content {
    max-width: 1200px;
    width: calc(100% - 40px);
    margin: 0 auto;
  }
}
.zasshi__hero {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .zasshi__hero {
    order: 1;
    margin: 13px 8px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__hero {
    margin: 20px 0;
  }
}
.zasshi__hero h1 {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .zasshi__bg {
    order: 2;
  }
}
.zasshi__mainlong {
  box-sizing: border-box;
  display: grid;
  background: #fff;
  grid-template-rows: 1fr;
  padding: 8px 13px;
}
@media only screen and (max-width: 767px) {
  .zasshi__mainlong {
    order: 3;
    grid-template-columns: 55px 1fr;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__mainlong {
    grid-template-columns: 1fr 200px 1fr;
  }
}
.zasshi__main {
  box-sizing: border-box;
  display: grid;
  background: #fff;
}
@media only screen and (max-width: 767px) {
  .zasshi__main {
    order: 3;
    grid-template-columns: 55px 1fr;
    grid-template-rows: 1fr;
    padding: 10px 10px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__main {
    grid-template-columns: 1fr 200px 1fr;
    grid-template-rows: 1fr;
    padding: 8px 13px;
  }
}
@media only screen and (max-width: 767px) {
  .zasshi__nav {
    grid-area: 1/1/3/2;
    margin: 0 10px 0 0;
    position: sticky;
    top: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    width: 45px;
    background: #000;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__nav {
    grid-area: 1/2/2/3;
    margin: 0 13px;
  }
}
.zasshi__nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .zasshi__nav ul {
    width: 45px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__nav ul {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 5px 0;
    height: 100%;
  }
}
.zasshi__nav ul li {
  background: #000;
  background-repeat: no-repeat;
  background-position: top right;
  background-size: cover;
  font-weight: 700;
  position: relative;
  box-sizing: border-box;
  text-shadow: 1px 1px 0 #000, -1px -1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, 0px 1px 0 #000, -1px 0 #000, -1px 0 0 #000, 1px 0 0 #000;
}
@media only screen and (max-width: 767px) {
  .zasshi__nav ul li {
    width: 45px;
    height: 110px;
    font-size: 0.9rem;
    line-height: 1.15rem;
    padding: 5px;
    writing-mode: vertical-rl;
    text-orientation: upright;
    box-sizing: border-box;
  }
  .zasshi__nav ul li::after {
    content: "";
    background: #fff;
    width: 100%;
    height: 5px;
    position: absolute;
    bottom: -2px;
    left: 0;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__nav ul li {
    height: 10%;
    font-size: 1.4rem;
    line-height: 1.8rem;
    letter-spacing: 0.1rem;
    padding: 7px 12px;
    cursor: pointer;
    transition: 0.3s;
  }
  .zasshi__nav ul li:hover {
    background: #333;
    background-size: cover;
    background-repeat: no-repeat;
  }
}
.zasshi__nav ul li.nav-top {
  background-image: url(../img/zasshi/nav/bg-top.png?v2);
}
.zasshi__nav ul li.nav-shop {
  background-image: url(../img/zasshi/nav/bg-shop.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__nav ul li.nav-shop {
    background-position: top 10px left -43px;
  }
}
.zasshi__nav ul li.nav-artist {
  background-image: url(../img/zasshi/nav/bg-artist.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__nav ul li.nav-artist {
    background-position: top left -45px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__nav ul li.nav-artist {
    background-position: center right;
  }
}
.zasshi__nav ul li.nav-comic {
  background-image: url(../img/zasshi/nav/bg-comic.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__nav ul li.nav-comic {
    background-position: top 5px left -65px;
  }
}
.zasshi__nav ul li.nav-tameshi {
  background-image: url(../img/zasshi/nav/bg-tamehsi.png);
}
@media only screen and (max-width: 767px) {
  .zasshi__nav ul li.nav-tameshi {
    background-position: top 5px left -65px;
  }
}
.zasshi__nav ul li.nav-article {
  background-image: url(../img/zasshi/nav/bg-article.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__nav ul li.nav-article {
    background-position: top right -30px;
  }
}
.zasshi__nav ul li.nav-info {
  background-image: url(../img/zasshi/nav/bg-info.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__nav ul li.nav-info {
    background-position: top 30px right;
  }
}
.zasshi__nav ul li.nav-comment {
  background-image: url(../img/zasshi/nav/bg-comment.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__nav ul li.nav-comment {
    background-position: top left -35px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__nav ul li.nav-comment {
    background-position: center;
  }
}
.zasshi__nav ul li.nav-contact {
  background-image: url(../img/zasshi/nav/bg-contact.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__nav ul li.nav-contact {
    background-position: top 33px right -17px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__nav ul li.nav-contact {
    background-position: top right -21px;
  }
}
.zasshi__nav ul li.nav-about {
  background-image: url(../img/zasshi/nav/bg-about.png);
}
.zasshi__nav ul li.nav-shinjin {
  background-image: url(../img/zasshi/nav/bg-shinjin.png);
}
.zasshi__nav ul li a:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.zasshi__navlong ul {
  list-style: none;
  position: relative;
  justify-content: space-between;
  height: 100%;
  padding: 0;
  display: flex;
}
@media only screen and (min-width: 768px) {
  .zasshi__navlong ul {
    max-width: calc(100vw - 70px);
  }
}
@media only screen and (min-width: 1250px) {
  .zasshi__navlong ul {
    max-width: 1174px;
  }
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul {
    width: calc(100vw - 26px);
    margin: 0;
    height: 100px;
  }
}
.zasshi__navlong ul li {
  background: #000;
  background-repeat: no-repeat;
  background-position: top right;
  background-size: cover;
  font-weight: 700;
  position: relative;
  box-sizing: border-box;
  text-shadow: rgb(0, 0, 0) 4px 0px 0px, rgb(0, 0, 0) 3.87565px 0.989616px 0px, rgb(0, 0, 0) 3.51033px 1.9177px 0px, rgb(0, 0, 0) 2.92676px 2.72656px 0px, rgb(0, 0, 0) 2.16121px 3.36588px 0px, rgb(0, 0, 0) 1.26129px 3.79594px 0px, rgb(0, 0, 0) 0.282949px 3.98998px 0px, rgb(0, 0, 0) -0.712984px 3.93594px 0px, rgb(0, 0, 0) -1.66459px 3.63719px 0px, rgb(0, 0, 0) -2.51269px 3.11229px 0px, rgb(0, 0, 0) -3.20457px 2.39389px 0px, rgb(0, 0, 0) -3.69721px 1.52664px 0px, rgb(0, 0, 0) -3.95997px 0.56448px 0px, rgb(0, 0, 0) -3.97652px -0.432781px 0px, rgb(0, 0, 0) -3.74583px -1.40313px 0px, rgb(0, 0, 0) -3.28224px -2.28625px 0px, rgb(0, 0, 0) -2.61457px -3.02721px 0px, rgb(0, 0, 0) -1.78435px -3.57996px 0px, rgb(0, 0, 0) -0.843183px -3.91012px 0px, rgb(0, 0, 0) 0.150409px -3.99717px 0px, rgb(0, 0, 0) 1.13465px -3.8357px 0px, rgb(0, 0, 0) 2.04834px -3.43574px 0px, rgb(0, 0, 0) 2.83468px -2.82216px 0px, rgb(0, 0, 0) 3.44477px -2.03312px 0px, rgb(0, 0, 0) 3.84068px -1.11766px 0px, rgb(0, 0, 0) 3.9978px -0.132717px 0px;
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li {
    width: calc(14.2857142857vw - 5px) !important;
    margin: 0 auto;
    padding-left: 5px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__navlong ul li {
    width: calc((100vw - 70px) / 7);
    height: 75px;
    flex: 1;
    margin: 2px;
    padding: 0;
    color: white;
    text-align: left;
    padding: 7px 12px;
    cursor: pointer;
    transition: 0.3s;
  }
  .zasshi__navlong ul li:hover {
    background: #333;
    background-size: cover;
    background-repeat: no-repeat;
  }
}
@media only screen and (min-width: 1250px) {
  .zasshi__navlong ul li {
    width: 164px;
    margin-right: 2px;
    font-size: 1.4rem;
    line-height: 1.8rem;
    letter-spacing: 0.1rem;
    padding: 7px 12px;
    cursor: pointer;
    transition: 0.3s;
  }
  .zasshi__navlong ul li:hover {
    background: #333;
    background-size: cover;
    background-repeat: no-repeat;
  }
}
.zasshi__navlong ul li.nav-top {
  background-image: url(../img/zasshi/nav/bg-top.png?v2);
}
.zasshi__navlong ul li.nav-shop {
  background-image: url(../img/zasshi/nav/bg-shop.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.nav-shop {
    background-position: top 10px left -43px;
  }
}
.zasshi__navlong ul li.nav-artist {
  background-image: url(../img/zasshi/nav/bg-artist.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.nav-artist {
    background-position: top left -45px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__navlong ul li.nav-artist {
    background-position: center right;
  }
}
.zasshi__navlong ul li.nav-comic {
  background-image: url(../img/zasshi/nav/bg-comic.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.nav-comic {
    background-position: top 5px left -65px;
  }
}
.zasshi__navlong ul li.nav-tameshi {
  background-image: url(../img/zasshi/nav/bg-tamehsi.png);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.nav-tameshi {
    background-position: top 5px left -65px;
  }
}
.zasshi__navlong ul li.nav-article {
  background-image: url(../img/zasshi/nav/bg-article.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.nav-article {
    background-position: top right -30px;
  }
}
.zasshi__navlong ul li.nav-info {
  background-image: url(../img/zasshi/nav/bg-info.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.nav-info {
    background-position: top 30px right;
  }
}
.zasshi__navlong ul li.nav-comment {
  background-image: url(../img/zasshi/nav/bg-comment.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.nav-comment {
    background-position: top left -35px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__navlong ul li.nav-comment {
    background-position: center;
  }
}
.zasshi__navlong ul li.nav-contact {
  background-image: url(../img/zasshi/nav/bg-contact.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.nav-contact {
    background-position: top 33px right -17px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__navlong ul li.nav-contact {
    background-position: top right -21px;
  }
}
.zasshi__navlong ul li.nav-about {
  background-image: url(../img/zasshi/nav/bg-about.png);
}
.zasshi__navlong ul li.nav-shinjin {
  background-image: url(../img/zasshi/nav/bg-shinjin.png);
}
.zasshi__navlong ul li.navlong-top {
  background-image: url(../img/zasshi/nav/bg-top.png?v2);
}
@media only screen and (min-width: 1250px) {
  .zasshi__navlong ul li.navlong-top {
    background-position: top -15px right 0;
  }
}
.zasshi__navlong ul li.navlong-shop {
  background-image: url(../img/zasshi/nav/bg-shop.png?v2);
}
@media only screen and (min-width: 1250px) {
  .zasshi__navlong ul li.navlong-shop {
    background-position: top -10px right -25px;
  }
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.navlong-shop {
    background-position: top 10px left 0px;
  }
}
.zasshi__navlong ul li.navlong-artist {
  background-image: url(../img/zasshi/nav/bg-artist.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.navlong-artist {
    background-position: top right 0;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__navlong ul li.navlong-artist {
    background-position: center right;
  }
}
.zasshi__navlong ul li.navlong-comic {
  background-image: url(../img/zasshi/nav/bg-comic.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.navlong-comic {
    background-position: top 15px left -10px;
  }
}
.zasshi__navlong ul li.navlong-tameshi {
  background-image: url(../img/zasshi/nav/bg-tamehsi.png);
}
@media only screen and (min-width: 1250px) {
  .zasshi__navlong ul li.navlong-tameshi {
    background-position: top -25px right -10px;
  }
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.navlong-tameshi {
    background-position: top 10px left 0;
  }
}
.zasshi__navlong ul li.navlong-article {
  background-image: url(../img/zasshi/nav/bg-article.png?v2);
}
@media only screen and (min-width: 1250px) {
  .zasshi__navlong ul li.navlong-article {
    background-position: top -15px right -10px;
  }
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.navlong-article {
    background-position: top 10px right -10px;
  }
}
.zasshi__navlong ul li.navlong-info {
  background-image: url(../img/zasshi/nav/bg-info.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.navlong-info {
    background-position: top 30px right;
  }
}
.zasshi__navlong ul li.navlong-comment {
  background-image: url(../img/zasshi/nav/bg-comment.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.navlong-comment {
    background-position: top left -35px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__navlong ul li.navlong-comment {
    background-position: center;
  }
}
.zasshi__navlong ul li.navlong-contact {
  background-image: url(../img/zasshi/nav/bg-contact.png?v2);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.navlong-contact {
    background-position: top 33px right -17px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__navlong ul li.navlong-contact {
    background-position: top right -21px;
  }
}
.zasshi__navlong ul li.navlong-about {
  background-image: url(../img/zasshi/nav/bg-about.png);
}
.zasshi__navlong ul li.navlong-shinjin {
  background-image: url(../img/zasshi/nav/bg-shinjin.png);
}
@media only screen and (max-width: 767px) {
  .zasshi__navlong ul li.navlong-shinjin {
    background-position: top 15px right 5px;
  }
}
.zasshi__navlong ul li a:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.zasshi__list ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.zasshi__list ul li {
  display: flex;
  position: relative;
  border-top: 4px solid #000;
  border-right: 4px solid #000;
  border-left: 4px solid #000;
}
.zasshi__list ul li:last-child {
  border-bottom: 4px solid #000;
}
@media only screen and (max-width: 767px) {
  .zasshi__list.list-left {
    grid-area: 1/2/2/3;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__list.list-left {
    grid-area: 1/1/2/2;
  }
}
@media only screen and (max-width: 767px) {
  .zasshi__list.list-right {
    grid-area: 2/2/3/3;
  }
}
@media only screen and (max-width: 767px) and (max-width: 767px) {
  .zasshi__list.list-right ul li:first-child {
    border-top: none;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__list.list-right {
    grid-area: 1/3/2/4;
  }
}
.zasshi__icon figure {
  margin: 0;
  padding: 0;
  position: relative;
  background: #000;
  height: 100%;
}
@media only screen and (max-width: 767px) {
  .zasshi__icon figure {
    width: 100px;
    min-height: 100px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__icon figure {
    width: 200px;
    min-height: 200px;
  }
}
.zasshi__icon figure img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.zasshi__icon a {
  display: block;
  width: 100%;
  height: 100%;
}
.zasshi__icon a:hover {
  transition: 0.3s;
}
.zasshi__icon a:hover::after {
  background-color: rgba(255, 255, 255, 0.4);
}
.zasshi__icon a::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transition: 0.3s;
}
.zasshi__text {
  box-sizing: border-box;
  border-left: 4px solid #000;
  display: flex;
  flex-direction: column;
}
@media only screen and (max-width: 767px) {
  .zasshi__text {
    width: calc(100% - 100px);
    padding: 6px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__text {
    width: calc(100% - 110px);
    padding: 8px;
  }
}
.zasshi__text a {
  color: #000;
}
@media only screen and (min-width: 768px) {
  .zasshi__text a {
    transition: 0.3s;
  }
  .zasshi__text a:hover {
    color: #999;
  }
}
.zasshi__listlong ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.zasshi__listlong ul li {
  display: flex;
  position: relative;
  border-top: 4px solid #000;
}
.zasshi__listlong ul li:last-child {
  border-bottom: 4px solid #000;
}
@media only screen and (min-width: 768px) {
  .zasshi__iconlong {
    max-width: 16%;
  }
}
@media only screen and (max-width: 767px) {
  .zasshi__iconlong {
    max-width: 16%;
  }
}
.zasshi__iconlong figure {
  overflow: hidden;
  width: 100%;
  margin: 0;
}
.zasshi__iconlong figure img {
  overflow: hidden;
  max-width: 108%;
  width: 110%;
}
.zasshi__iconlong a {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
}
.zasshi__iconlong a:hover {
  transition: 0.3s;
}
.zasshi__iconlong a:hover::after {
  background-color: rgba(255, 255, 255, 0.4);
}
.zasshi__iconlong a::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transition: 0.3s;
}
.zasshi__textlong {
  box-sizing: border-box;
  border-left: 4px solid #000;
}
@media only screen and (max-width: 767px) {
  .zasshi__textlong {
    width: 100%;
    height: auto;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__textlong {
    width: 100%;
    height: auto;
  }
}
.zasshi__textlong figure {
  width: 100%;
  margin: 0;
}
.zasshi__textlong a {
  color: #000;
}
@media only screen and (min-width: 768px) {
  .zasshi__textlong a {
    transition: 0.3s;
  }
  .zasshi__textlong a:hover {
    color: #999;
  }
}
.zasshi__ttl {
  word-break: break-all;
  font-feature-settings: "palt";
  transition: 0.3s;
}
@media only screen and (max-width: 767px) {
  .zasshi__ttl {
    margin: 0 0 7px;
    font-size: 1.05rem;
    line-height: 1.2rem;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__ttl {
    margin: 0 0 10px;
    font-size: 1.4rem;
    line-height: 1.5rem;
  }
}
.zasshi__ttl.ttl-l {
  text-align: left;
  letter-spacing: -0.05em;
}
@media only screen and (max-width: 767px) {
  .zasshi__ttl.ttl-l {
    font-size: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__ttl.ttl-l {
    font-size: 1.3rem;
  }
}
.zasshi__ttllong {
  word-break: break-all;
  font-feature-settings: "palt";
  transition: 0.3s;
}
@media only screen and (max-width: 767px) {
  .zasshi__ttllong {
    margin: 0 0 7px;
    font-size: 1.05rem;
    line-height: 1.2rem;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__ttllong {
    margin: 0 0 10px;
    font-size: 1.75rem;
    line-height: 1.5rem;
  }
}
.zasshi__ttllong.ttl-l {
  text-align: left;
  letter-spacing: -0.05em;
}
@media only screen and (max-width: 767px) {
  .zasshi__ttllong.ttl-l {
    font-size: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__ttllong.ttl-l {
    font-size: 1.3rem;
  }
}
.zasshi__author {
  line-height: 100%;
  font-weight: 600;
  display: flex;
  align-items: center;
  transition: 0.3s;
}
@media only screen and (max-width: 767px) {
  .zasshi__author {
    margin: 0 0 7px;
    font-size: 0.85rem;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__author {
    font-size: 1rem;
    margin: 0 0 7px;
  }
}
@media only screen and (max-width: 767px) {
  .zasshi__author span {
    margin: 0 0 0 10px;
    font-size: 0.8rem;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__author span {
    margin: 0 0 0 10px;
    font-size: 0.8rem;
    font-size: 0.85rem;
  }
}
.zasshi__authorlong {
  padding-top: 20px;
  line-height: 100%;
  font-weight: 600;
  display: flex;
  align-items: center;
  transition: 0.3s;
}
@media only screen and (max-width: 767px) {
  .zasshi__authorlong {
    margin: 0 0 7px;
    font-size: 0.85rem;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__authorlong {
    font-size: 1.25rem;
    margin: 0 0 7px;
  }
}
@media only screen and (max-width: 767px) {
  .zasshi__authorlong span {
    margin: 0 0 0 10px;
    font-size: 0.8rem;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__authorlong span {
    margin: 0 0 0 10px;
    font-size: 0.8rem;
    font-size: 0.85rem;
  }
}
.zasshi__caption {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: auto 0 0;
}
@media only screen and (max-width: 767px) {
  .zasshi__caption {
    font-size: 0.8rem;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__caption {
    font-size: 0.9rem;
  }
}
.zasshi__caption p {
  margin: 0;
  font-weight: 600;
  position: relative;
  z-index: 1;
  width: calc(100% - 90px);
}
@media only screen and (max-width: 767px) {
  .zasshi__caption p {
    line-height: 1rem;
  }
}
.zasshi__caption .share {
  background: #c72626;
  border-radius: 50px;
  width: 90px;
  height: 27px;
  line-height: 27px;
  text-align: center;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 768px) {
  .zasshi__caption .share {
    transition: 0.3s;
  }
  .zasshi__caption .share:hover {
    background: #dc4b4b;
  }
}
.zasshi__caption .share a {
  color: #fff;
  font-size: 0.7rem;
  display: block;
  width: 100%;
}
.zasshi__caption .share a::before {
  font-family: "Font Awesome 6 Brands";
  font-weight: 900;
  color: #fff;
  content: "\e61b";
  font-size: 0.7rem;
  margin: 0 4px 0 0;
}
.zasshi .youtube {
  position: absolute;
  width: 75px;
  right: 20px;
  top: 20px;
  transition: 0.3s;
}
.zasshi .youtube:hover {
  opacity: 0.5;
}
.zasshi__summary {
  margin: 5px 0 0;
  font-feature-settings: "palt";
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .zasshi__summary {
    font-size: 0.8rem;
    line-height: 1.1rem;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__summary {
    font-size: 0.85rem;
    line-height: 1.15rem;
  }
}
@media only screen and (max-width: 767px) {
  .zasshi__backnumber {
    order: 3;
    background: #fff;
    padding: 7px 0;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi__backnumber {
    margin: 20px 0;
  }
}
.zasshi__backnumber img {
  box-sizing: border-box;
}
@media only screen and (min-width: 768px) {
  .zasshi__backnumber img {
    transition: 0.3s;
  }
  .zasshi__backnumber img:hover {
    opacity: 0.8;
  }
}

@media only screen and (min-width: 768px) {
  .zasshi-yokoku__content {
    max-width: 1200px;
    margin: 0 auto;
  }
}
.zasshi-yokoku__main {
  background: #fff;
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .zasshi-yokoku__main {
    padding: 30px 10px;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi-yokoku__main {
    padding: 80px 0;
  }
}
.zasshi-yokoku__main__pic {
  margin: 0 auto;
}
@media only screen and (min-width: 768px) {
  .zasshi-yokoku__main__pic {
    max-width: 800px;
  }
}
.zasshi-yokoku__back {
  background-color: rgba(43, 44, 63, 0.8);
  text-align: center;
  border-radius: 3px;
}
@media only screen and (max-width: 767px) {
  .zasshi-yokoku__back {
    margin: 30px auto 0;
    width: 180px;
    height: 48px;
    line-height: 48px;
    font-size: 0.95rem;
  }
}
@media only screen and (min-width: 768px) {
  .zasshi-yokoku__back {
    margin: 60px auto 0;
    width: 220px;
    height: 50px;
    line-height: 50px;
    transition: 0.3s;
  }
  .zasshi-yokoku__back:hover {
    opacity: 0.7;
  }
}
.zasshi-yokoku__back a {
  display: block;
  width: 100%;
}

:root {
  --active-color: #26a422;
  --inactive-color: #d54141;
  --bar-width: 100%;
  --bar-max-width: 1200px;
  --bar-height: 20px;
  --font-family: "Noto Sans JP", sans-serif;
  --title-font-size: 1.3rem;
  --label-font-size: 0.75rem;
}

.bar-div {
  max-width: var(--bar-max-width);
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: var(--font-family);
}

.bar-div > h3 {
  color: #ffffff;
  margin: 0 0 15px;
  text-align: center;
  font-size: var(--title-font-size);
}

.bar-container {
  width: 100%;
  display: flex;
  flex-direction: row;
  gap: 0;
}

.month-bar {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  position: relative;
}

.bar-fill {
  width: 100%;
  height: var(--bar-height);
  border-left: 1px solid #ccc;
}

.bar-fill.membertrue {
  background-color: var(--active-color);
}

.bar-fill.memberfalse {
  background-color: var(--inactive-color);
}

.month-bar::before {
  content: "";
  position: absolute;
  top: -5px;
  left: 0;
  width: 1px;
  height: calc(var(--bar-height) + 10px);
  background-color: #ccc;
}

.month-bar:first-child::before {
  display: none;
}

.month-label {
  font-size: var(--label-font-size);
  font-weight: bold;
  color: #eee;
  text-align: center;
}

@media (max-width: 768px) {
  :root {
    --bar-max-width: 90%;
    --bar-height: 18px;
    --title-font-size: 1.1rem;
    --label-font-size: 0.65rem;
  }
}
@media (max-width: 480px) {
  :root {
    --bar-max-width: 95%;
    --bar-height: 15px;
    --title-font-size: 1rem;
    --label-font-size: 0.55rem;
  }
}
.yuryo {
  display: none;
}

.purchased {
  display: none;
}

@supports (-webkit-touch-callout: none) {
  html {
    height: -webkit-fill-available;
  }
  .zasshi__nav {
    min-height: 100vh;
    min-height: -webkit-fill-available;
  }
}
body {
  margin: 0;
  padding: 0;
  color: #fff;
  background: #000;
}

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

a {
  text-decoration: none;
  color: #fff;
  word-break: break-all;
}

.common .head {
  position: relative;
}
@media only screen and (max-width: 767px) {
  .common .head {
    background: url(../img/head.png?0729) no-repeat center right -50px/cover;
    width: 100%;
    padding: 7px 10px;
    box-sizing: border-box;
    z-index: 990;
  }
}
@media only screen and (min-width: 768px) {
  .common .head {
    height: 80px;
    background: url(../img/head.png?0729) no-repeat center right/cover;
  }
}
@media only screen and (min-width: 1000px) {
  .common .head {
    height: 100px;
    background: url(../img/head.png?0729) no-repeat center right/cover;
  }
}
.common .head__content {
  position: relative;
  z-index: 99;
}
@media only screen and (min-width: 768px) {
  .common .head__content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: calc(100% - 60px);
    margin: 0 auto;
    height: 100px;
  }
}
.common .head__logo {
  display: flex;
  align-items: center;
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .common .head__logo {
    justify-content: center;
  }
}
@media only screen and (max-width: 767px) {
  .common .head__logo-img {
    width: 95px;
  }
}
@media only screen and (min-width: 768px) {
  .common .head__logo-img {
    width: 150px;
    margin-right: 25px;
  }
}
.common .head__logo p {
  font-family: "Zen Kaku Gothic Antique", sans-serif;
  text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5);
  color: #fff;
  font-weight: 600;
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .common .head__logo p {
    font-size: 0.75rem;
    letter-spacing: 0.1rem;
    width: calc(100% - 110px);
    display: none;
  }
}
@media only screen and (min-width: 768px) {
  .common .head__logo p {
    font-size: 0.95rem;
    letter-spacing: 0.2rem;
  }
}
.common .head__login {
  background: #111;
  border: #999 solid 1px;
  text-align: center;
  letter-spacing: 0.1rem;
  display: none;
}
@media only screen and (min-width: 768px) {
  .common .head__login {
    width: 120px;
    height: 40px;
    line-height: 40px;
    font-size: 0.9rem;
  }
}
@media only screen and (max-width: 767px) {
  .common .head__sns {
    display: none;
  }
}
@media only screen and (min-width: 768px) {
  .common .head__sns {
    display: flex;
  }
}
.common .head__sns__item {
  background: #111;
  border: #999 solid 1px;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  margin: 0 0 0 10px;
  transition: 0.3s;
}
.common .head__sns__item:hover {
  background: #333;
}
.common .head__sns__item a {
  width: 100%;
  display: block;
}
.common .head__sns__item.head-sns-twitter span::before, .common .head__sns__item.head-sns-instagram span::before {
  font-family: "Font Awesome 6 Brands";
  font-weight: 900;
  color: #fff;
  font-size: 1rem;
}
.common .head__sns__item.head-sns-twitter span::before {
  content: "\e61b";
}
.common .head__sns__item.head-sns-instagram span::before {
  content: "\f16d";
}
@media only screen and (max-width: 767px) {
  .common .head .head-icon {
    display: block;
    position: absolute;
    z-index: 999;
    top: 8px;
    left: 14px;
    cursor: pointer;
    text-align: center;
    background: #000;
    width: 40px;
    height: 40px;
  }
}
@media only screen and (min-width: 768px) {
  .common .head .head-icon {
    display: block;
    position: absolute;
    z-index: 999;
    top: 8px;
    left: 14px;
    cursor: pointer;
    text-align: center;
    background: #000;
    width: 40px;
    height: 40px;
  }
}
@media only screen and (min-width: 1000px) {
  .common .head .head-icon {
    display: none;
  }
}
.common .head .head-icon span {
  display: block;
  position: absolute;
  width: 21px;
  height: 2px;
  right: 9px;
  background: #fff;
  transition: 0.3s ease-in-out;
}
.common .head .head-icon span:nth-child(1) {
  top: 11px;
}
.common .head .head-icon span:nth-child(2) {
  top: 19px;
}
.common .head .head-icon span:nth-child(3) {
  top: 27px;
}
.common .head .head-icon.active span:nth-child(1) {
  top: 19px;
  right: 9px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}
.common .head .head-icon.active span:nth-child(2) {
  opacity: 0;
}
.common .head .head-icon.active span:nth-child(3) {
  top: 19px;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
@media only screen and (max-width: 767px) {
  .common .head.head-fixed {
    position: fixed;
    top: 0;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
  }
}
.common .wrap {
  position: relative;
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS Pゴシック", "MS PGothic", sans-serif;
}
@media only screen and (max-width: 767px) {
  .common .wrap {
    overflow: hidden;
  }
}
.common .content {
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .common .content {
    margin: 0 20px;
    padding: 35px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .common .content {
    display: flex;
    justify-content: space-between;
    max-width: 1200px;
    width: calc(100% - 40px);
    margin: 0 auto;
    padding: 50px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .common .content .local-nav {
    position: fixed;
    top: -120%;
    left: 0;
    z-index: 980;
    transition: 0.6s;
  }
}
@media only screen and (min-width: 768px) {
  .common .content .local-nav {
    position: fixed;
    top: -120%;
    left: 0;
    z-index: 980;
    transition: 0.6s;
  }
}
@media only screen and (min-width: 1000px) {
  .common .content .local-nav {
    position: static;
    width: 200px;
  }
}
@media only screen and (max-width: 767px) {
  .common .content .local-nav.active {
    top: 56px;
  }
}
@media only screen and (min-width: 768px) {
  .common .content .local-nav__container {
    height: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .common .content .local-nav__content {
    background: #000;
    color: #333;
    transition: all 0.4s ease-out;
    width: 100%;
    height: 100vh;
    box-sizing: border-box;
    pointer-events: none;
    padding: 62px 25px 20px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }
}
@media only screen and (min-width: 1000px) {
  .common .content .local-nav__content {
    position: sticky;
    top: 30px;
    left: 0;
  }
}
.common .content .local-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
@media only screen and (max-width: 767px) {
  .common .content .local-nav ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
.common .content .local-nav ul li {
  box-sizing: border-box;
  pointer-events: auto;
}
@media only screen and (max-width: 767px) {
  .common .content .local-nav ul li {
    width: 48%;
    height: 45px;
    font-size: 0.85rem;
    margin: 0 0 10px;
    padding: 0 7px;
    display: flex;
    align-items: center;
    border-bottom: #999 solid 1px;
    position: relative;
  }
  .common .content .local-nav ul li:nth-of-type(1) {
    width: 100%;
    text-align: center;
  }
  .common .content .local-nav ul li:nth-of-type(3) {
    display: none;
  }
}
@media only screen and (min-width: 768px) {
  .common .content .local-nav ul li {
    text-align: center;
    height: 40px;
    line-height: 40px;
    border: #999 solid 1px;
    margin: 0 0 10px;
  }
  .common .content .local-nav ul li:hover {
    background: #333;
    transition: 0.3s;
  }
  .common .content .local-nav ul li:last-child {
    margin: 0;
  }
}
.common .content .local-nav ul li a {
  width: 100%;
  display: block;
}
@media only screen and (max-width: 767px) {
  .common .content .local-nav ul li a::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
  }
}
.common .content .local-nav__sns {
  display: flex;
  justify-content: center;
  border: none !important;
}
@media only screen and (max-width: 767px) {
  .common .content .local-nav__sns {
    width: 100% !important;
    margin: 15px 0 0 !important;
    height: auto !important;
  }
}
@media only screen and (min-width: 768px) {
  .common .content .local-nav__sns {
    margin: 20px 0 0;
  }
}
.common .content .local-nav__sns:hover {
  background-color: transparent !important;
}
.common .content .local-nav__sns-text {
  margin: 0 10px 0 0;
  color: #fff;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.2rem;
}
.common .content .local-nav__sns-item {
  margin: 0 10px;
}
.common .content .local-nav__sns-item:hover {
  opacity: 0.8;
}
.common .content .local-nav__sns .sns-twitter::before {
  font-family: "Font Awesome 6 Brands";
  font-weight: 900;
  color: #fff;
  font-size: 1.3rem;
  content: "\e61b";
}
.common .content .local-nav__sns .sns-instagram::before {
  font-family: "Font Awesome 6 Brands";
  font-weight: 900;
  color: #fff;
  font-size: 1.3rem;
  content: "\f16d";
}
.common .content .main {
  text-align: center;
  box-sizing: border-box;
}
@media only screen and (min-width: 768px) {
  .common .content .main {
    width: 100%;
  }
}
@media only screen and (min-width: 1000px) {
  .common .content .main {
    width: calc(100% - 200px);
    padding: 0 0 0 4.5%;
  }
}
.common .content .main h1 {
  font-family: "Zen Kaku Gothic Antique", sans-serif;
  border: #999 solid 1px;
  display: inline-block;
  text-align: center;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .common .content .main h1 {
    letter-spacing: 0.2rem;
    font-size: 1.1rem;
    margin: 0 0 30px;
    padding: 7px 30px;
  }
}
@media only screen and (min-width: 768px) {
  .common .content .main h1 {
    letter-spacing: 0.3rem;
    font-size: 1.3rem;
    margin: 30px 0 50px;
    padding: 8px 40px;
  }
}
.common .content .main h1 a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.common .content .main .section {
  text-align: left;
}

@media only screen and (max-width: 767px) {
  .author__content {
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 768px) {
  .author__content {
    margin: 0 0 70px;
  }
}
.author__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media only screen and (min-width: 768px) {
  .author__list::after {
    content: "";
    width: 17%;
  }
}
.author__item {
  position: relative;
}
@media only screen and (max-width: 767px) {
  .author__item {
    width: 29%;
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 768px) {
  .author__item {
    width: 17%;
    margin: 0 0 60px;
  }
}
.author__item:hover .author__pic {
  opacity: 0.8;
}
.author__pic {
  transition: 0.3s;
}
@media only screen and (max-width: 767px) {
  .author__pic {
    margin: 0 0 13px;
  }
}
@media only screen and (min-width: 768px) {
  .author__pic {
    margin: 0 0 20px;
  }
}
.author__pic img {
  border-radius: 50%;
  overflow: hidden;
}
.author__pic figure {
  background: #ccc;
  color: #777;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}
@media only screen and (min-width: 768px) {
  .author__pic figure {
    min-height: 158px;
  }
}
.author__name {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .author__name {
    font-size: 0.85rem;
  }
}
.author__name a {
  transition: 0.3s;
}
@media only screen and (min-width: 768px) {
  .author__name a:hover {
    opacity: 0.8;
  }
}
.author__name a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.author-single {
  position: relative;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
}
.author-single .content {
  background-color: rgba(0, 0, 0, 0.4);
}
@media only screen and (max-width: 767px) {
  .author-single .content {
    padding: 35px 17px 60px;
    margin: 0 10px;
  }
}
@media only screen and (min-width: 1000px) {
  .author-single .content {
    padding: 50px 30px 0;
  }
}
@media only screen and (max-width: 767px) {
  .author-single .content .local-nav ul li {
    border-bottom: #fff solid 1px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .content .local-nav ul li {
    border: #fff solid 1px;
  }
  .author-single .content .local-nav ul li:hover {
    background-color: rgba(0, 0, 0, 0.2);
    transition: 0.3s;
  }
}
.author-single .wrap {
  position: relative;
  z-index: 500 !important;
}
.author-single .profile {
  display: flex;
  justify-content: space-between;
}
@media only screen and (max-width: 767px) {
  .author-single .profile {
    margin: 0 0 25px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .profile {
    margin: 0 0 50px;
  }
}
.author-single .profile__img {
  border-radius: 50%;
}
@media only screen and (max-width: 767px) {
  .author-single .profile__img {
    width: 90px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .profile__img {
    width: 180px;
  }
}
.author-single .profile__img img {
  border-radius: 50%;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .author-single .profile__text {
    width: calc(100% - 110px);
  }
}
@media only screen and (min-width: 768px) {
  .author-single .profile__text {
    width: calc(100% - 220px);
  }
}
@media only screen and (max-width: 767px) {
  .author-single .profile__text-name {
    font-size: 1rem;
    margin: 0 0 13px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .profile__text-name {
    font-size: 1.1rem;
    margin: 0 0 15px;
  }
}
.author-single .profile__text-desctipction p {
  margin: 0 0 15px;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .author-single .profile__text-desctipction p {
    font-size: 0.9rem;
    line-height: 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .profile__text-desctipction p {
    font-size: 0.95rem;
    line-height: 1.7rem;
  }
}
.author-single .profile__text-desctipction p:last-child {
  margin: 0;
}
.author-single .profile__text-desctipction a {
  text-decoration: underline;
}
.author-single .profile__text .interview-link {
  font-weight: 600;
  border: 2px solid #fff;
  box-sizing: border-box;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .author-single .profile__text .interview-link {
    padding: 13px 0 14px;
    text-align: center;
    font-size: 0.8rem;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .profile__text .interview-link {
    display: inline-block;
    margin: 10px 0 0;
    padding: 12px 35px 13px;
    transition: 0.3s;
  }
  .author-single .profile__text .interview-link:hover {
    background-color: rgba(0, 0, 0, 0.3);
  }
}
.author-single .profile__text .interview-link a {
  text-decoration: none;
}
.author-single .profile__text .interview-link a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
@media only screen and (max-width: 767px) {
  .author-single .list {
    margin: 0 0 25px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .list {
    margin: 0 0 50px;
  }
}
.author-single .list__item {
  border-top: #fff solid 1px;
}
@media only screen and (max-width: 767px) {
  .author-single .list__item {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: 130px auto;
    grid-template-rows: 270px 1fr;
    padding: 20px 0;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .list__item {
    display: flex;
    justify-content: space-between;
    padding: 25px 15px;
  }
}
.author-single .list__item:last-child {
  border-bottom: #ccc solid 1px;
}
.author-single .list__item.new {
  background-color: rgba(54, 64, 74, 0.6);
}
.author-single .list__item.new .list__date::after {
  content: "最新話";
  color: #fff;
  font-size: 0.7rem;
  border: 1px solid #fff;
  margin: 0 0 0 10px;
  padding: 2px 10px;
  position: relative;
  top: -1px;
}
.author-single .list__item.new-en {
  background-color: rgba(54, 64, 74, 0.6);
}
.author-single .list__item.new-en .list__date::after {
  content: "NEW";
  color: #fff;
  font-size: 0.7rem;
  border: 1px solid #fff;
  margin: 0 0 0 10px;
  padding: 2px 10px;
  position: relative;
  top: -1px;
}
@media only screen and (max-width: 767px) {
  .author-single .list__thumb {
    grid-area: 1/1/2/2;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .list__thumb {
    width: 24%;
  }
}
.author-single .list__thumb_pic {
  background: #EAEAEA;
  color: #707070;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 25px;
}
.author-single .list__text {
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .author-single .list__text {
    grid-area: 1/2/3/2;
    padding: 0 0 0 15px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .list__text {
    width: 35%;
    padding: 10px 0 0;
  }
}
.author-single .list__date {
  color: #ccc;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-weight: 500;
  letter-spacing: 0.05rem;
  line-height: 100%;
}
@media only screen and (max-width: 767px) {
  .author-single .list__date {
    font-size: 0.9rem;
    margin: 0 0 8px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .list__date {
    font-size: 0.95rem;
    margin: 0 0 10px;
  }
}
.author-single .list__ttl {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .author-single .list__ttl {
    font-size: 0.95rem;
  }
}
.author-single .list__btn {
  background: #9B2B2A;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .author-single .list__btn {
    width: 80%;
    height: 40px;
    line-height: 40px;
    margin: 10px auto 0;
    font-size: 0.85rem;
  }
  .author-single .list__btn:first-of-type {
    margin: 20px auto 0;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .list__btn {
    max-width: 180px;
    height: 43px;
    line-height: 43px;
    margin: 10px 0 0;
    font-size: 0.9rem;
  }
  .author-single .list__btn:first-of-type {
    margin: 20px 0 0;
  }
  .author-single .list__btn:hover {
    opacity: 0.8;
    transition: 0.3s;
  }
}
.author-single .list__btn.btn-free {
  border: #fff solid 1px;
  background: transparent;
  box-sizing: border-box;
}
@media only screen and (min-width: 768px) {
  .author-single .list__btn.btn-free:hover {
    background-color: rgba(0, 0, 0, 0.2);
  }
}
.author-single .list__btn.btn-otameshi {
  border: #9b2b2a solid 1px;
  background: #9b2b2a;
  box-sizing: border-box;
}
.author-single .list__btn.btn-otameshi a {
  color: #fff !important;
}
@media only screen and (min-width: 768px) {
  .author-single .list__btn.btn-otameshi:hover {
    background-color: rgba(131, 41, 41, 0.4862745098);
  }
}
.author-single .list__btn a {
  width: 100%;
  display: block;
}
@media only screen and (max-width: 767px) {
  .author-single .list__sub {
    grid-area: 2/1/3/3;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .list__sub {
    width: 36%;
  }
}
.author-single .list__sub .share-area {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
@media only screen and (max-width: 767px) {
  .author-single .list__sub .share-area {
    margin: 0 0 10px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .list__sub .share-area {
    margin: 0 0 13px;
  }
}
.author-single .list__sub .share-area p {
  font-weight: 500;
  position: relative;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .author-single .list__sub .share-area p {
    font-size: 0.7rem;
    margin: 0 15px 0 0;
    width: 122px;
    height: 20px;
    line-height: 19px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .list__sub .share-area p {
    font-size: 0.8rem;
    margin: 0 20px 0 0;
    width: 135px;
    height: 21px;
  }
}
.author-single .list__sub .share-area p::after {
  content: "";
  background: url(../img/author/share-fukidashi.png) no-repeat top left/contain;
  position: absolute;
  top: 0;
  left: 0;
}
@media only screen and (max-width: 767px) {
  .author-single .list__sub .share-area p::after {
    width: 122px;
    height: 20px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .list__sub .share-area p::after {
    width: 135px;
    height: 22px;
  }
}
.author-single .list__sub .share-area .share {
  background: #c72626;
  border-radius: 50px;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .author-single .list__sub .share-area .share {
    width: 90px;
    height: 27px;
    line-height: 27px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .list__sub .share-area .share {
    width: 90px;
    height: 27px;
    line-height: 27px;
    transition: 0.3s;
  }
  .author-single .list__sub .share-area .share:hover {
    background: #dc4b4b;
  }
}
.author-single .list__sub .share-area .share a {
  color: #fff;
  font-size: 0.7rem;
  display: block;
  width: 100%;
}
.author-single .list__sub .share-area .share a::before {
  font-family: "Font Awesome 6 Brands";
  font-weight: 900;
  color: #fff;
  content: "\e61b";
  font-size: 0.7rem;
  margin: 0 4px 0 0;
}
.author-single .comment {
  background: #222;
}
.author-single .comment__ttl {
  font-weight: 600;
  padding: 17px 17px 0;
  font-size: 0.9rem;
  text-align: center;
}
.author-single .comment__form {
  padding: 13px 20px 17px;
  border-bottom: #666 solid 1px;
}
.author-single .comment__form input[type=text],
.author-single .comment__form textarea {
  width: 100%;
  padding: 8px;
  box-sizing: border-box;
  font-size: 0.9rem;
}
.author-single .comment__form input[type=text] {
  margin: 0 0 10px;
}
.author-single .comment__form textarea {
  height: 70px;
}
.author-single .comment__submit {
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
}
.author-single .comment input[type=submit] {
  appearance: none;
  -webkit-appearance: none;
  width: 110px;
  height: 35px;
  border: none;
  margin: 10px 10px 0;
  text-align: center;
  display: block;
  border-radius: 0;
}
.author-single .comment input[type=submit]:first-child {
  background: #9b2b2a;
  color: #fff;
}
@media only screen and (min-width: 768px) {
  .author-single .comment input[type=submit]:hover {
    opacity: 0.8;
    transition: 0.3s;
  }
}
.author-single .comment__content {
  padding: 15px;
}
.author-single .comment__list {
  margin: 0;
  padding: 0;
  list-style: none;
  height: 90px;
  overflow: auto;
}
.author-single .comment__list li {
  border-bottom: #999 solid 1px;
  padding: 12px 12px 12px 0;
  margin-right: 5px;
}
.author-single .comment__list li:last-of-type {
  border: none;
}
@media only screen and (max-width: 767px) {
  .author-single .comment__list::-webkit-scrollbar {
    width: 7px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .comment__list::-webkit-scrollbar {
    width: 8px;
  }
}
.author-single .comment__list::-webkit-scrollbar-track {
  background-color: #333;
  border-radius: 100px;
}
.author-single .comment__list::-webkit-scrollbar-thumb {
  background-color: #666;
  border-radius: 100px;
}
.author-single .comment__text {
  margin: 0 0 10px;
}
@media only screen and (max-width: 767px) {
  .author-single .comment__text {
    font-size: 0.9rem;
    line-height: 1.3rem;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .comment__text {
    font-size: 0.95rem;
    line-height: 1.4rem;
  }
}
.author-single .comment__date {
  font-size: 0.9rem;
  text-align: right;
  color: #999;
  display: block;
}
.author-single .comment__username {
  font-size: 0.9rem;
  margin: 0 0 7px;
  display: block;
}
.author-single .comment__more {
  font-size: 0.8rem;
  text-align: center;
  border-top: #999 solid 1px;
  padding: 13px 0;
  position: relative;
}
.author-single .comment__more::before {
  content: "";
  width: 5px;
  height: 5px;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  position: absolute;
  top: 16px;
  right: 180px;
}
.author-single .author-comic {
  border-bottom: #fff solid 1px;
}
@media only screen and (max-width: 767px) {
  .author-single .author-comic {
    margin: 0 0 25px;
    padding: 0 0 25px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-comic {
    margin: 0 0 50px;
    padding: 0 0 50px;
  }
}
.author-single .author-comic__item {
  position: relative;
}
@media only screen and (max-width: 767px) {
  .author-single .author-comic__item {
    margin: 0 8px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-comic__item {
    margin: 0 23px 0 0;
    transition: 0.3s;
  }
  .author-single .author-comic__item:hover {
    opacity: 0.8;
  }
}
@media only screen and (max-width: 767px) {
  .author-single .author-comic__pic {
    margin: 0 0 9px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-comic__pic {
    margin: 0 0 12px;
  }
}
@media only screen and (max-width: 767px) {
  .author-single .author-comic__ttl {
    font-size: 0.85rem;
    margin: 0 0 3px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-comic__ttl {
    font-size: 0.9rem;
    margin: 0 0 5px;
  }
}
.author-single .author-comic__ttl a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.author-single .author-comic__author {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .author-single .author-comic__author {
    font-size: 0.8rem;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-comic__author {
    font-size: 0.85rem;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop {
    margin: 0 0 130px;
  }
}
.author-single .author-shop .splide__arrow {
  background: #fff;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .splide__arrow {
    width: 35px;
    height: 35px;
  }
}
@media only screen and (min-width: 1000px) {
  .author-single .author-shop .splide__arrow {
    width: 40px;
    height: 40px;
  }
}
.author-single .author-shop .splide__arrow svg {
  display: none;
}
.author-single .author-shop .splide__arrow--prev,
.author-single .author-shop .splide__arrow--next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 99;
}
.author-single .author-shop .splide__arrow--prev::before,
.author-single .author-shop .splide__arrow--next::before {
  content: "";
  border-top: solid 3px #363030;
  border-right: solid 3px #363030;
  position: absolute;
  border-radius: 2px;
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .splide__arrow--prev::before,
  .author-single .author-shop .splide__arrow--next::before {
    width: 7px;
    height: 7px;
    top: 12.5px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop .splide__arrow--prev::before,
  .author-single .author-shop .splide__arrow--next::before {
    width: 8px;
    height: 8px;
    top: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .splide__arrow--prev {
    left: 0;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop .splide__arrow--prev {
    left: 10px;
  }
}
.author-single .author-shop .splide__arrow--prev::before {
  transform: rotate(225deg);
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .splide__arrow--prev::before {
    left: 14px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop .splide__arrow--prev::before {
    left: 16px;
  }
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .splide__arrow--next {
    right: 0;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop .splide__arrow--next {
    right: 10px;
  }
}
.author-single .author-shop .splide__arrow--next::before {
  transform: rotate(45deg);
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .splide__arrow--next::before {
    right: 14px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop .splide__arrow--next::before {
    right: 16px;
  }
}
.author-single .author-shop .prod-list {
  margin: 0 auto;
  padding: 0;
  list-style: none;
}
.author-single .author-shop .prod-list__item {
  position: relative;
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .prod-list__item {
    margin: 0 8px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop .prod-list__item {
    transition: 0.3s;
  }
  .author-single .author-shop .prod-list__item:hover {
    opacity: 0.8;
  }
}
.author-single .author-shop .prod-list__item a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.author-single .author-shop .prod-list .thumb {
  padding: 0;
  position: relative;
  overflow: hidden;
  background: #222;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .prod-list .thumb {
    height: 120px;
    margin: 0 0 15px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop .prod-list .thumb {
    height: 200px;
    margin: 0 0 18px;
  }
}
.author-single .author-shop .prod-list .thumb img {
  max-width: 100%;
  max-height: 100%;
  transition: 0.4s;
  object-fit: contain;
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .prod-list .thumb img {
    height: 126px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop .prod-list .thumb img {
    height: 200px;
  }
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .prod-list .caption {
    max-width: 130px;
  }
}
@media only screen and (min-width: 1000px) {
  .author-single .author-shop .prod-list .caption {
    max-width: 160px;
  }
}
.author-single .author-shop .prod-list .caption .title {
  font-weight: 600;
  line-height: 100%;
  margin: 0 0 3px;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .prod-list .caption .title {
    font-size: 0.85rem;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop .prod-list .caption .title {
    font-size: 0.9rem;
  }
}
.author-single .author-shop .prod-list .caption .artist-name {
  color: #d1d1d1;
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .prod-list .caption .artist-name {
    font-size: 0.75rem;
    margin: 0 0 5px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop .prod-list .caption .artist-name {
    font-size: 0.85rem;
    margin: 0 0 7px;
  }
}
.author-single .author-shop .prod-list .caption .price {
  font-weight: 500;
  margin: 0;
  font-family: "Poppins";
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .prod-list .caption .price {
    font-size: 0.85rem;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop .prod-list .caption .price {
    font-size: 1rem;
  }
}
.author-single .author-shop .prod-list .caption .price span {
  margin: 0 0 0 3px;
  position: relative;
  top: -1px;
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .prod-list .caption .price span {
    font-size: 0.6rem;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop .prod-list .caption .price span {
    font-size: 0.7rem;
  }
}
.author-single .author-shop .prod-list .caption .price.soldout::after {
  content: "売り切れ";
  color: #ff0000;
  font-weight: 500;
}
@media only screen and (max-width: 767px) {
  .author-single .author-shop .prod-list .caption .price.soldout::after {
    display: block;
    font-size: 0.75rem;
    margin: 2px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .author-single .author-shop .prod-list .caption .price.soldout::after {
    font-size: 0.85rem;
    position: relative;
    top: -1px;
    margin: 0 0 0 5px;
  }
}
.author-single .author-shop .prod-list .caption .size {
  display: none;
}
.author-single .author-shop .prod-list .slick-prev {
  left: -38px !important;
}
.author-single .author-shop .prod-list .slick-next {
  right: -38px !important;
}
.author-single h3 {
  border: #fff solid 1px;
  display: inline-block;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .author-single h3 {
    letter-spacing: 0.3rem;
    font-size: 1.05rem;
    margin: 0 0 30px;
    padding: 8px 20px 5px;
  }
}
@media only screen and (min-width: 768px) {
  .author-single h3 {
    letter-spacing: 0.3rem;
    font-size: 1.1rem;
    margin: 0 0 30px;
    padding: 8px 30px;
  }
}

@media only screen and (max-width: 767px) {
  .comic__content {
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 768px) {
  .comic__content {
    margin: 0 0 130px;
  }
}
@media only screen and (max-width: 767px) {
  .comic__item {
    margin: 0 0 50px;
  }
}
@media only screen and (min-width: 768px) {
  .comic__item {
    display: flex;
    justify-content: space-between;
    margin: 0 0 80px;
  }
}
.comic__item:last-of-type {
  margin: 0;
}
.comic__pic {
  cursor: pointer;
  transition: 0.2s;
}
@media only screen and (max-width: 767px) {
  .comic__pic {
    width: 65%;
    margin: 0 auto 30px;
  }
}
@media only screen and (min-width: 768px) {
  .comic__pic {
    width: 200px;
  }
}
.comic__pic:hover {
  opacity: 0.8;
}
@media only screen and (min-width: 768px) {
  .comic__text {
    width: calc(100% - 240px);
    display: flex;
  }
}
.comic__detail {
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .comic__detail {
    border-bottom: #999 solid 1px;
    margin: 0 0 30px;
    padding: 0 0 30px;
  }
}
@media only screen and (min-width: 768px) {
  .comic__detail {
    border-right: #999 solid 1px;
    margin: 0 30px 0 0;
    padding: 0 30px 0 0;
  }
}
.comic__head {
  display: flex;
  margin: 0 0 15px;
  letter-spacing: 0.1rem;
}
.comic__ttl {
  margin: 0 20px 0 0;
  font-size: 1.1rem;
}
.comic__description {
  margin: 0 0 30px;
}
.comic__description p {
  font-size: 0.9rem;
  line-height: 1.8rem;
  letter-spacing: 0.1rem;
  margin: 0;
}
.comic__description ul {
  font-size: 0.9rem;
  line-height: 1.8rem;
  letter-spacing: 0.1rem;
  margin: 0;
}
.comic__description35 {
  max-height: 250px;
  max-width: 425px;
  overflow-y: scroll;
  margin: 0 -3vw 30px 0;
}
.comic__description35 p {
  font-size: 0.9rem;
  line-height: 1.8rem;
  letter-spacing: 0.1rem;
  margin: 0;
}
.comic__description35::-webkit-scrollbar {
  width: 5px;
}
.comic__description35::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0);
}
.comic__description35::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.7607843137);
  border-radius: 10px;
  border: 3px solid rgba(255, 255, 255, 0);
}
.comic__description35 ul {
  font-size: 0.9rem;
  line-height: 1.8rem;
  letter-spacing: 0.1rem;
  margin: 0;
}
.comic__description35 .numb li {
  list-style-type: decimal;
  font-size: 0.9rem;
  line-height: 1.8rem;
  letter-spacing: 0.1rem;
  margin: 0;
}
.comic__description35 .numb p {
  font-size: 0.8rem;
}
.comic__descriptionscroll {
  max-height: 150px;
  max-width: 425px;
  overflow-y: scroll;
  margin: 0 -3vw 30px 0;
}
.comic__descriptionscroll p {
  font-size: 0.9rem;
  line-height: 1.8rem;
  letter-spacing: 0.1rem;
  margin: 0;
}
.comic__descriptionscroll::-webkit-scrollbar {
  width: 5px;
}
.comic__descriptionscroll::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0);
}
.comic__descriptionscroll::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.7607843137);
  border-radius: 10px;
  border: 3px solid rgba(255, 255, 255, 0);
}
.comic__descriptionscroll ul {
  font-size: 0.9rem;
  line-height: 1.8rem;
  letter-spacing: 0.1rem;
  margin: 0;
}
.comic__descriptionscroll .numb li {
  list-style-type: decimal;
  font-size: 0.9rem;
  line-height: 1.8rem;
  letter-spacing: 0.1rem;
  margin: 0;
}
.comic__descriptionscroll .numb p {
  font-size: 0.8rem;
}
.comic__order {
  display: flex;
}
.comic__btn {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .comic__btn {
    width: 200px;
    height: 43px;
    line-height: 43px;
  }
}
@media only screen and (min-width: 768px) {
  .comic__btn {
    width: 150px;
    height: 38px;
    line-height: 38px;
    margin: 0 30px 0 0;
  }
}
.comic__btn a {
  font-size: 0.9rem;
  letter-spacing: 0.1rem;
  display: block;
  width: 100%;
}
.comic__btn.btn-buy {
  background: #9B2B2A;
}
.comic__btn.btn-free {
  border: #fff solid 1px;
  box-sizing: border-box;
}
.comic__info {
  width: 400px;
  font-family: "Helvetica Neue", Arial, sans-serif;
}
.comic__info dl {
  display: flex;
  margin: 0 0 7px;
  letter-spacing: 0.1rem;
}
.comic__info dl dt {
  margin: 0;
  width: 40%;
}
.comic__info dl dd {
  margin: 0;
  width: 60%;
}

@media only screen and (max-width: 767px) {
  .shop__content {
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 768px) {
  .shop__content {
    margin: 0 0 130px;
    display: flex;
  }
}
.shop__main {
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .shop__main {
    margin: 0 0 50px;
  }
}
@media only screen and (min-width: 768px) {
  .shop__main {
    width: 78%;
    padding: 0 30px 0 0;
    border-right: #999 solid 1px;
  }
}
.shop__sub {
  letter-spacing: 0.05rem;
  box-sizing: border-box;
}
@media only screen and (min-width: 768px) {
  .shop__sub {
    width: 22%;
    padding: 0 0 0 30px;
  }
}
.shop h3 {
  letter-spacing: 0.1rem;
  text-align: center;
}
@media only screen and (min-width: 768px) {
  .shop h3 {
    margin: 0 0 15px;
  }
}
.shop__link {
  background: #fff;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .shop__link {
    margin: 0 0 25px;
    padding: 10px 20px 13px;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
}
@media only screen and (min-width: 768px) {
  .shop__link {
    text-align: center;
    padding: 5px 0 9px;
    margin: 0 0 20px;
    transition: 0.3s;
    cursor: pointer;
  }
  .shop__link:hover {
    opacity: 0.8;
  }
}
@media only screen and (max-width: 767px) {
  .shop__link p {
    font-size: 0.9rem;
    line-height: 1.15rem;
    margin: 0;
    width: 170px;
  }
}
@media only screen and (min-width: 768px) {
  .shop__link p {
    font-size: 0.8rem;
    line-height: 1.05rem;
    margin: 0 0 5px;
  }
}
.shop__link a {
  color: #000;
}
.shop__link a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.shop__link__logo {
  text-align: center;
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .shop__link__logo {
    width: calc(100% - 170px);
    padding: 0 0 0 10px;
  }
}
@media only screen and (max-width: 767px) {
  .shop__link__logo img {
    width: 90px;
    position: relative;
    top: 3px;
  }
}
@media only screen and (min-width: 768px) {
  .shop__link__logo img {
    width: 55%;
  }
}
.shop .prod-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.shop .prod-list__item {
  position: relative;
}
@media only screen and (max-width: 767px) {
  .shop .prod-list__item {
    margin: 0 7px;
  }
}
@media only screen and (min-width: 768px) {
  .shop .prod-list__item {
    margin: 25px 0 0;
    transition: 0.3s;
  }
  .shop .prod-list__item:hover {
    opacity: 0.8;
  }
}
.shop .prod-list__item a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.shop .prod-list__item .thumb {
  background: #222;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media only screen and (max-width: 767px) {
  .shop .prod-list__item .thumb {
    margin: 0 0 15px;
  }
}
@media only screen and (min-width: 768px) {
  .shop .prod-list__item .thumb {
    margin: 0 0 16px;
  }
}
.shop .prod-list__item .thumb img {
  object-fit: contain;
}
@media only screen and (max-width: 767px) {
  .shop .prod-list__item .thumb img {
    height: 125px;
  }
}
@media only screen and (min-width: 768px) {
  .shop .prod-list__item .thumb img {
    height: 130px;
  }
}
.shop .prod-list__item .caption .title {
  font-size: 0.9rem;
  margin: 0 0 2px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
@media only screen and (max-width: 767px) {
  .shop .prod-list__item .caption .title {
    font-size: 0.9rem;
  }
}
.shop .prod-list__item .caption .artist-name {
  color: #ccc;
  font-size: 0.8rem;
  margin: 0 0 6px;
}
.shop .prod-list__item .caption .price {
  font-size: 0.85rem;
  margin: 0;
}
.shop .prod-list__item .caption .price span {
  margin: 0 0 0 4px;
  font-size: 0.6rem;
  position: relative;
  top: -1px;
}
.shop .prod-list__item .caption .size {
  display: none;
}
.shop .prod-list__item.soldout .price::after {
  content: "売り切れ";
  color: #ff0000;
  font-weight: 500;
}
@media only screen and (max-width: 767px) {
  .shop .prod-list__item.soldout .price::after {
    display: block;
    font-size: 0.75rem;
    margin: 2px 0 0;
  }
}
@media only screen and (min-width: 1000px) {
  .shop .prod-list__item.soldout .price::after {
    font-size: 0.75rem;
    position: relative;
    top: 0;
    margin: 0 0 0 5px;
  }
}
@media only screen and (max-width: 767px) {
  .shop .shop-comic {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
@media only screen and (max-width: 767px) {
  .shop .shop-comic__item {
    width: 47.5%;
    margin: 0 0 35px;
  }
}
@media only screen and (min-width: 768px) {
  .shop .shop-comic__item {
    display: flex;
    justify-content: space-between;
    margin: 0 0 80px;
  }
}
.shop .shop-comic__item:last-of-type {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .shop .shop-comic__pic {
    width: 95%;
    margin: 0 auto 20px;
  }
}
@media only screen and (min-width: 768px) {
  .shop .shop-comic__pic {
    width: 200px;
  }
}
@media only screen and (min-width: 768px) {
  .shop .shop-comic__text {
    width: calc(100% - 240px);
    display: flex;
  }
}
.shop .shop-comic__detail {
  width: 100%;
}
.shop .shop-comic__head {
  margin: 0 0 15px;
  letter-spacing: 0.1rem;
}
@media only screen and (min-width: 768px) {
  .shop .shop-comic__head {
    display: flex;
  }
}
.shop .shop-comic__ttl {
  font-weight: 500;
}
@media only screen and (max-width: 767px) {
  .shop .shop-comic__ttl {
    font-size: 0.9rem;
    margin: 0 0 3px;
  }
}
@media only screen and (min-width: 768px) {
  .shop .shop-comic__ttl {
    font-size: 1.1rem;
    margin: 0 20px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .shop .shop-comic__author {
    font-size: 0.85rem;
  }
}
.shop .shop-comic__info {
  font-family: "Helvetica Neue", Arial, sans-serif;
}
@media only screen and (max-width: 767px) {
  .shop .shop-comic__info {
    margin: 0 0 13px;
  }
}
@media only screen and (min-width: 768px) {
  .shop .shop-comic__info {
    margin: 20px 0 27px;
  }
}
.shop .shop-comic__info dl {
  display: flex;
  margin: 0 0 7px;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .shop .shop-comic__info dl {
    font-size: 0.8rem;
    flex-direction: column;
  }
}
@media only screen and (min-width: 768px) {
  .shop .shop-comic__info dl {
    font-size: 0.95rem;
  }
}
.shop .shop-comic__info dl dt {
  margin: 0;
}
@media only screen and (min-width: 768px) {
  .shop .shop-comic__info dl dt {
    width: 90px;
  }
}
.shop .shop-comic__info dl dd {
  margin: 0;
}
@media only screen and (min-width: 768px) {
  .shop .shop-comic__info dl dd {
    width: calc(100% - 90px);
  }
}
@media only screen and (max-width: 767px) {
  .shop .shop-comic__description {
    margin: 0 0 23px;
  }
}
@media only screen and (min-width: 768px) {
  .shop .shop-comic__description {
    margin: 0 0 30px;
  }
}
.shop .shop-comic__description p {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .shop .shop-comic__description p {
    font-size: 0.8rem;
    line-height: 1.4rem;
    letter-spacing: 0.05rem;
  }
}
@media only screen and (min-width: 768px) {
  .shop .shop-comic__description p {
    font-size: 0.9rem;
    line-height: 1.8rem;
    letter-spacing: 0.1rem;
  }
}
.shop .shop-comic__descriptionscroll {
  max-height: 150px;
  max-width: 425px;
  overflow-y: scroll;
  margin: 0 -3vw 30px 0;
}
.shop .shop-comic__descriptionscroll p {
  font-size: 0.9rem;
  line-height: 1.8rem;
  letter-spacing: 0.1rem;
  margin: 0;
}
.shop .shop-comic__descriptionscroll::-webkit-scrollbar {
  width: 5px;
}
.shop .shop-comic__descriptionscroll::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0);
}
.shop .shop-comic__descriptionscroll::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.7607843137);
  border-radius: 10px;
  border: 3px solid rgba(255, 255, 255, 0);
}
.shop .shop-comic__descriptionscroll ul {
  font-size: 0.9rem;
  line-height: 1.8rem;
  letter-spacing: 0.1rem;
  margin: 0;
}
.shop .shop-comic__descriptionscroll .numb li {
  list-style-type: decimal;
  font-size: 0.9rem;
  line-height: 1.8rem;
  letter-spacing: 0.1rem;
  margin: 0;
}
.shop .shop-comic__descriptionscroll .numb p {
  font-size: 0.8rem;
}
.shop .shop-comic__order {
  display: flex;
}
.shop .shop-comic__btn {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .shop .shop-comic__btn {
    width: 100%;
    height: 42px;
    line-height: 42px;
  }
}
@media only screen and (min-width: 768px) {
  .shop .shop-comic__btn {
    width: 200px;
    height: 43px;
    line-height: 43px;
    margin: 0 30px 0 0;
    transition: 0.3s;
  }
  .shop .shop-comic__btn:hover {
    opacity: 0.8;
  }
}
.shop .shop-comic__btn a {
  letter-spacing: 0.1rem;
  display: block;
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .shop .shop-comic__btn a {
    font-size: 0.85rem;
  }
}
@media only screen and (min-width: 768px) {
  .shop .shop-comic__btn a {
    font-size: 0.9rem;
  }
}
.shop .shop-comic__btn.btn-buy {
  background: #9B2B2A;
}
.shop .shop-comic__btn.btn-free {
  border: #fff solid 1px;
  box-sizing: border-box;
}

@media only screen and (max-width: 767px) {
  .shinjin .wrap {
    overflow: hidden;
  }
}
.shinjin .shinjin-nav ul {
  list-style: none;
  padding: 0;
  display: flex;
  justify-content: center;
}
@media only screen and (max-width: 767px) {
  .shinjin .shinjin-nav ul {
    margin: 0 0 30px;
    flex-wrap: wrap;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin .shinjin-nav ul {
    margin: 0 0 85px;
  }
}
.shinjin .shinjin-nav ul li {
  border-left: 1px solid #ccc;
  text-align: center;
  font-weight: 500;
}
@media only screen and (max-width: 767px) {
  .shinjin .shinjin-nav ul li:nth-child(3) {
    border-right: 1px solid #ccc;
  }
}
.shinjin .shinjin-nav ul li:last-child {
  border-right: 1px solid #ccc;
}
@media only screen and (max-width: 767px) {
  .shinjin .shinjin-nav ul li {
    width: 100px;
    height: 38px;
    line-height: 38px;
    margin: 0 0 13px;
    font-size: 0.85rem;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin .shinjin-nav ul li {
    width: 150px;
    height: 43px;
    line-height: 43px;
    cursor: pointer;
    font-size: 0.95rem;
  }
}
.shinjin .shinjin-nav ul li a {
  width: 100%;
  display: block;
  position: relative;
  z-index: 99;
}
.shinjin__content {
  color: #fff;
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .shinjin__content {
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__content {
    margin: 0 0 130px;
  }
}
@media only screen and (min-width: 1755px) {
  .shinjin__inner {
    position: relative;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin__inner {
    margin: 0 0 40px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__inner {
    margin: 0 0 60px;
  }
}
.shinjin__inner:first-child {
  border: 1px solid #9b2b2a;
}
@media only screen and (min-width: 768px) {
  .shinjin__main {
    width: calc(100% - 15px);
    margin: 0 auto;
    overflow: hidden;
  }
}
.shinjin__head {
  text-align: center;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .shinjin__head {
    margin: 40px 0 40px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__head {
    margin: 80px 0 80px;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin__head img {
    width: 80%;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__head img {
    width: 68%;
  }
}
.shinjin__catch {
  box-sizing: border-box;
  font-weight: 500;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .shinjin__catch {
    margin: 0 0 50px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__catch {
    margin: 0 0 108px;
  }
}
.shinjin__catch p {
  font-family: "Zen Kaku Gothic Antique", sans-serif;
  text-align: center;
  position: relative;
  z-index: 99;
}
@media only screen and (max-width: 767px) {
  .shinjin__catch p {
    font-size: 0.95rem;
    line-height: 1.8rem;
    margin: 0 0 20px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__catch p {
    font-size: 1.05rem;
    line-height: 1.8rem;
    letter-spacing: 0.2rem;
    margin: 0 0 40px;
  }
}
.shinjin__catch p:last-child {
  margin: 0;
}
.shinjin__concept {
  box-sizing: border-box;
  font-weight: 500;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .shinjin__concept {
    margin: 0 0 45px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__concept {
    margin: 0 0 88px;
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
  }
}
.shinjin__concept p {
  font-family: "Zen Kaku Gothic Antique", sans-serif;
  text-align: center;
  position: relative;
  z-index: 99;
}
@media only screen and (max-width: 767px) {
  .shinjin__concept p {
    font-size: 0.9rem;
    line-height: 1.8rem;
    margin: 0 0 20px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__concept p {
    font-size: 1.05rem;
    line-height: 1.8rem;
    letter-spacing: 0.2rem;
    margin: 0 0 40px;
  }
}
.shinjin__concept p:last-child {
  margin: 0;
}
.shinjin__block {
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .shinjin__block {
    margin: 0 0 40px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__block {
    margin: 0 0 60px;
  }
}
.shinjin__block:last-child {
  margin: 0;
}
.shinjin__block p {
  margin: 0 0 30px;
}
@media only screen and (max-width: 767px) {
  .shinjin__block p {
    font-size: 0.95rem;
    line-height: 1.75rem;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__block p {
    font-size: 1rem;
    line-height: 1.75rem;
  }
}
.shinjin__block p:last-child {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .shinjin__item {
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__item {
    margin: 0 0 35px;
  }
}
.shinjin__item:last-child {
  margin: 0;
}
.shinjin h3 {
  color: #fff;
  letter-spacing: 0.05rem;
  line-height: 100%;
  border-bottom: 5px double #fff;
}
@media only screen and (max-width: 767px) {
  .shinjin h3 {
    font-size: 1.3rem;
    margin: 0 0 25px;
    padding: 0 0 13px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin h3 {
    font-size: 1.5rem;
    margin: 0 0 35px;
    padding: 0 0 18px;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin h3.text-l {
    font-size: 1.1rem;
  }
}
.shinjin h4 {
  margin: 0 0 20px;
  border-left: 4px solid #fff;
}
@media only screen and (max-width: 767px) {
  .shinjin h4 {
    font-size: 1.05rem;
    padding: 0 0 0 15px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin h4 {
    font-size: 1.1rem;
    padding: 0 0 0 20px;
  }
}
.shinjin__link {
  background: #df1525;
  text-align: center;
  font-weight: 600;
  letter-spacing: 0.1rem;
  border-radius: 5px;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .shinjin__link {
    height: 52px;
    line-height: 52px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__link {
    width: 450px;
    height: 60px;
    line-height: 60px;
    font-size: 1.1rem;
  }
}
.shinjin__link::before {
  content: "";
  display: block;
  border-top: solid 3px #fff;
  border-right: solid 3px #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  right: 25px;
}
@media only screen and (max-width: 767px) {
  .shinjin__link::before {
    top: 22px;
    width: 6px;
    height: 6px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__link::before {
    top: 23px;
    width: 8px;
    height: 8px;
  }
}
.shinjin__link a {
  display: block;
  width: 100%;
}
.shinjin__pic-item {
  position: absolute;
}
@media only screen and (max-width: 767px) {
  .shinjin__pic-item {
    opacity: 0.5;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin__pic-item.pic-top {
    top: 10px;
    right: -41px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__pic-item.pic-top {
    top: -200px;
    right: -60px;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin__pic-item.pic-top img {
    width: 151px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__pic-item.pic-top img {
    width: 290px;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin__pic-item.pic-left {
    top: 250px;
    left: -10px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__pic-item.pic-left {
    top: 230px;
    left: 23px;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin__pic-item.pic-left img {
    width: 156px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__pic-item.pic-left img {
    width: 300px;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin__pic-item.pic-right {
    top: 250px;
    right: -20px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__pic-item.pic-right {
    top: 230px;
    right: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin__pic-item.pic-right img {
    width: 151px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__pic-item.pic-right img {
    width: 290px;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin__pic-item.pic-bottom {
    bottom: 10px;
    left: -20px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__pic-item.pic-bottom {
    bottom: -150px;
    left: -50px;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin__pic-item.pic-bottom img {
    width: 151px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__pic-item.pic-bottom img {
    width: 290px;
  }
}
.shinjin__progress {
  border-top: 1px solid #9b2b2a;
  padding: 5px;
}
@media only screen and (min-width: 1755px) {
  .shinjin__progress {
    border: 1px solid #9b2b2a;
  }
}
@media only screen and (min-width: 1755px) {
  .shinjin__progress {
    position: absolute;
    top: 0px;
    right: -270px;
  }
}
.shinjin__progress-text {
  display: grid;
}
.shinjin__progress-ttl {
  text-align: center;
  border-bottom: 1px solid #fff;
  padding: 5px 0 10px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 767px) {
  .shinjin__progress-ttl {
    font-size: 15px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__progress-ttl {
    font-size: 20px;
  }
}
@media only screen and (min-width: 1755px) {
  .shinjin__progress-ttl {
    font-size: 15px;
  }
}
.shinjin__progress table tr {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .shinjin__progress table tr {
    font-size: 14px;
    margin: 0 0 10px;
  }
  .shinjin__progress table tr:last-child {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__progress table tr {
    font-size: 15px;
  }
}
@media only screen and (min-width: 1755px) {
  .shinjin__progress table tr {
    font-size: 10px;
  }
}
.shinjin__progress table tr:nth-child(odd) {
  background-color: #222222;
}
.shinjin__progress table tr:nth-child(even) {
  background-color: #535353;
}
@media only screen and (max-width: 767px) {
  .shinjin__progress table td {
    padding: 3px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin__progress table td {
    padding: 8px 0;
  }
}
@media only screen and (min-width: 1755px) {
  .shinjin__progress table td {
    padding: 3px 0;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin .shinjin__pic-item-bottom {
    padding: 15px 20px 0;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin .shinjin__pic-item-bottom {
    padding: 30px 50px 0;
  }
}
.shinjin .saiyo {
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .shinjin .saiyo {
    margin: 0 0 10px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin .saiyo {
    margin: 0 0 50px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin .saiyo__icon-sp {
    display: none;
  }
}
.shinjin .saiyo__icon-sp .text {
  margin: 0 0 30px;
  font-size: 0.8rem;
  text-align: center;
}
.shinjin .saiyo__icon-sp__container {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
}
.shinjin .saiyo__icon-sp__container::after {
  content: "";
  width: 30%;
  height: 0;
}
.shinjin .saiyo__icon-sp__item {
  width: 30%;
  text-align: center;
  margin: 0 0 30px;
  position: relative;
}
.shinjin .saiyo__icon-sp__item img {
  border-radius: 50%;
  overflow: hidden;
}
.shinjin .saiyo__icon-sp__item .name {
  margin: 10px 0 0;
  font-size: 0.85rem;
}
.shinjin .saiyo__icon-sp__item .name a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.shinjin .saiyo__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.shinjin .saiyo__item {
  border-bottom: 1px solid #fff;
}
@media only screen and (min-width: 768px) {
  .shinjin .saiyo__item:first-child .saiyo__item__inner {
    padding: 0 0 30px;
  }
}
.shinjin .saiyo__item:last-child {
  border-bottom: none;
}
@media only screen and (min-width: 768px) {
  .shinjin .saiyo__item:last-child .saiyo__item__inner {
    padding: 30px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin .saiyo__item__inner {
    display: flex;
    justify-content: space-between;
    padding: 30px 0;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin .saiyo__item__pic {
    margin: 0 auto 25px;
    width: 160px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin .saiyo__item__pic {
    width: 180px;
  }
}
.shinjin .saiyo__item__pic img {
  border: 2px solid #fff;
}
@media only screen and (min-width: 768px) {
  .shinjin .saiyo__item__text {
    width: calc(100% - 215px);
  }
}
.shinjin .saiyo__item__text p {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .shinjin .saiyo__item__text p {
    font-size: 0.9rem;
    line-height: 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin .saiyo__item__text p {
    font-size: 0.95rem;
    line-height: 1.6rem;
  }
}
.shinjin .saiyo__item__text a {
  text-decoration: underline;
}
.shinjin .saiyo__item__name {
  font-weight: 600;
  line-height: 100%;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .shinjin .saiyo__item__name {
    font-size: 1.05rem;
    line-height: 1.5rem;
    margin: 0 0 15px;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin .saiyo__item__name {
    font-size: 1.2rem;
    margin: 0 0 18px;
  }
}
.shinjin .saiyo__item__profile p {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .shinjin .saiyo__item__profile p {
    font-size: 0.9rem;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin .saiyo__item__profile p {
    font-size: 0.95rem;
  }
}
.shinjin .saiyo__item__date {
  line-height: 100%;
  letter-spacing: 0.05rem;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-weight: 500;
}
@media only screen and (max-width: 767px) {
  .shinjin .saiyo__item__date {
    margin: 10px 0 0;
    font-size: 0.85rem;
    line-height: 1.3rem;
    text-align: center;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin .saiyo__item__date {
    margin: 10px 0 0;
    font-size: 0.9rem;
    line-height: 1.5rem;
  }
}
.shinjin .saiyo__item__date span {
  display: block;
  letter-spacing: 0.1rem;
  color: #ccc;
}
@media only screen and (max-width: 767px) {
  .shinjin .saiyo .modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 9999;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin .saiyo .modal__bg, .shinjin .saiyo .modal__close {
    display: none;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin .saiyo .modal__bg {
    position: absolute;
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.7);
  }
}
@media only screen and (max-width: 767px) {
  .shinjin .saiyo .modal__body {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 85%;
    box-sizing: border-box;
    padding: 25px 13px 25px 0;
    background: #000;
    border: 2px solid #fff;
    z-index: 9999;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin .saiyo .modal__inner {
    box-sizing: border-box;
    max-height: 68vh;
    overflow: auto;
    padding: 30px 20px 30px 30px;
  }
  .shinjin .saiyo .modal__inner::-webkit-scrollbar {
    width: 6px;
  }
  .shinjin .saiyo .modal__inner::-webkit-scrollbar-thumb {
    background-color: #666;
    border-radius: 100px;
  }
}
@media only screen and (max-width: 767px) {
  .shinjin .saiyo .modal__close-btn {
    background: #000;
    border: 2px solid #fff;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    position: absolute;
    top: -21px;
    right: -20px;
    z-index: 9999;
  }
}
@media only screen and (min-width: 768px) {
  .shinjin .saiyo .modal__close-btn {
    display: none;
  }
}
.shinjin .saiyo .modal__close-btn span::before, .shinjin .saiyo .modal__close-btn span::after {
  content: "";
  display: block;
  width: 17px;
  height: 3px;
  background: #fff;
  position: absolute;
  top: 16px;
}
.shinjin .saiyo .modal__close-btn span::before {
  transform: rotate(45deg);
  left: 9px;
}
.shinjin .saiyo .modal__close-btn span::after {
  transform: rotate(-45deg);
  right: 9px;
}

.info {
  /*
  &__list {
  	background: #222;
  	position: relative;
  	&::after {
  		content: "";
  		background: #222;
  		width: 100%;
  		height: 1px;
  		position: absolute;
  		bottom: 0;
  		left: 0;
  	}
  	ul {
  		list-style: none;
  		margin: 0;
  		padding: 0;
  		li {
  			padding: 30px 50px;
  			border-bottom: #999 solid 1px;
  			position: relative;
  			&:hover {
  				background: #444;
  				transition: 0.3s;
  			}
  		}
  	}
  	&-date {
  		display: block;
  		margin: 0 0 10px;
  		letter-spacing: 0.05rem;
  		font-size: 0.95rem;
  		color: #999;
  	}
  	&-ttl {
  		margin: 0;
  		letter-spacing: 0.1rem;
  		a {
  			font-weight: 600;
  			&::after {
  				content: "";
  				width: 100%;
  				height: 100%;
  				position: absolute;
  				top: 0;
  				left: 0;
  			}
  			&:hover {
  				text-decoration: none;
  			}
  		}
  	}
  }
  */
}
@media only screen and (max-width: 767px) {
  .info__list-content {
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 768px) {
  .info__list-content {
    margin: 0 0 130px;
  }
}
.info__list ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
@media only screen and (min-width: 768px) {
  .info__list ul::after {
    content: "";
    width: 31.5%;
  }
}
.info__list ul li {
  position: relative;
}
@media only screen and (max-width: 767px) {
  .info__list ul li {
    width: 47%;
    margin: 0 0 25px;
  }
}
@media only screen and (min-width: 768px) {
  .info__list ul li {
    width: 31.5%;
    margin: 0 0 40px;
    cursor: pointer;
    transition: 0.4s;
  }
  .info__list ul li:hover {
    opacity: 0.8;
  }
}
@media only screen and (max-width: 767px) {
  .info__list ul li img {
    width: 180px;
  }
}
.info__list ul li p {
  font-weight: 500;
}
@media only screen and (max-width: 767px) {
  .info__list ul li p {
    font-size: 0.9rem;
    letter-spacing: 0.05rem;
    line-height: 1.4rem;
    margin: 13px 0 0;
    padding: 3px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .info__list ul li p {
    font-size: 0.95rem;
    letter-spacing: 0.1rem;
    margin: 13px 0 0;
  }
}
.info__list ul li p a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.info__content {
  background: #222;
  box-sizing: border-box;
}
@media only screen and (min-width: 768px) {
  .info__content {
    margin: 0 0 130px;
    padding: 45px;
  }
}
.info__content-date {
  margin: 0 0 20px;
  letter-spacing: 0.05rem;
  font-size: 0.95rem;
  color: #999;
}
.info__content-ttl {
  margin: 0 0 35px;
  letter-spacing: 0.1rem;
  font-weight: 600;
}
@media only screen and (min-width: 768px) {
  .info__content-ttl {
    font-size: 1.1rem;
  }
}
.info__content-text p {
  margin: 0 0 30px;
  letter-spacing: 0.05rem;
}
@media only screen and (min-width: 768px) {
  .info__content-text p {
    font-size: 1rem;
    line-height: 2.1rem;
  }
}
.info__content-text p:last-of-type {
  margin: 0;
}

@media only screen and (max-width: 767px) {
  .comment-hiroba__content {
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba__content {
    margin: 0 0 130px;
  }
}
@media only screen and (max-width: 767px) {
  .comment-hiroba__form {
    margin: 0 0 40px;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba__form {
    margin: 0 auto 60px;
    width: 70%;
  }
}
.comment-hiroba__form input[type=text],
.comment-hiroba__form input[type=email],
.comment-hiroba__form textarea {
  width: 100%;
  box-sizing: border-box;
  font-size: 0.95rem;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba__form input[type=text],
  .comment-hiroba__form input[type=email],
  .comment-hiroba__form textarea {
    padding: 13px 15px;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba__form input[type=text],
  .comment-hiroba__form input[type=email],
  .comment-hiroba__form textarea {
    padding: 15px 15px;
  }
}
.comment-hiroba__form textarea {
  height: 120px;
}
.comment-hiroba__form dl {
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba__form dl {
    margin: 0 0 15px;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba__form dl {
    display: flex;
    align-items: center;
    margin: 0 0 17px;
  }
}
.comment-hiroba__form dl dt {
  font-size: 0.9rem;
  font-weight: 500;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba__form dl dt {
    margin: 0 0 5px;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba__form dl dt {
    margin: 0;
    width: 150px;
  }
}
.comment-hiroba__form dl dd {
  margin: 0;
}
@media only screen and (min-width: 768px) {
  .comment-hiroba__form dl dd {
    width: calc(100% - 150px);
  }
}
.comment-hiroba__submit {
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba__submit {
    margin: 30px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba__submit {
    margin: 35px 0 0;
  }
}
.comment-hiroba input[type=submit] {
  appearance: none;
  -webkit-appearance: none;
  height: 40px;
  border: none;
  text-align: center;
  display: block;
  background: #efefef;
  color: #000;
  border-radius: 0;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba input[type=submit] {
    width: 150px;
    margin: 0 8px;
    font-size: 0.85rem;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba input[type=submit] {
    width: 170px;
    margin: 0 13px;
    font-size: 0.9rem;
  }
}
.comment-hiroba__block {
  background: #f6f6f6;
  color: #000;
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba__block {
    margin: 0 0 20px;
    padding: 30px 25px 33px;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba__block {
    margin: 0 0 25px;
    padding: 35px;
  }
}
.comment-hiroba__block:last-of-type {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba__block img {
    width: 80%;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba__block img {
    max-width: 350px;
  }
}
@media only screen and (max-width: 767px) {
  .comment-hiroba__head {
    margin: 0 0 15px;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba__head {
    margin: 0 0 20px;
  }
}
.comment-hiroba__name {
  font-weight: 600;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba__name {
    margin: 0 0 7px;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba__name {
    margin: 0 0 7px;
    font-size: 1.05rem;
  }
}
.comment-hiroba__date {
  color: #bbb;
  letter-spacing: 0.05rem;
  font-size: 0.9rem;
  text-align: right;
  display: block;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-weight: 500;
}
.comment-hiroba__text {
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba__text {
    font-size: 0.9rem;
    line-height: 1.6rem;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba__text {
    font-size: 0.95rem;
    line-height: 1.6rem;
  }
}
.comment-hiroba__text p {
  margin: 0;
}
.comment-hiroba__reply-btn {
  font-size: 0.9rem;
}
.comment-hiroba__reply-btn span::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  color: #fff;
  font-size: 0.8rem;
  content: "\f27a";
  margin-right: 8px;
}
.comment-hiroba .comment-reply__block {
  border: 1px solid #999;
  box-sizing: border-box;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba .comment-reply__block {
    margin: 20px 0 0;
    padding: 20px;
    font-size: 0.9rem;
    line-height: 1.6rem;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba .comment-reply__block {
    width: 88%;
    margin: 30px 0 0 auto;
    padding: 30px;
    font-size: 0.95rem;
    line-height: 1.6rem;
  }
}
.comment-hiroba .comment-reply__block p {
  margin: 0;
}
.comment-hiroba .comment-reply__block blockquote {
  margin: 0 !important;
  border: 1px solid #999 !important;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba .comment-reply__block blockquote {
    padding: 15px 18px !important;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba .comment-reply__block blockquote {
    padding: 18px !important;
  }
}
.comment-hiroba .pager {
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-weight: 500;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba .pager {
    margin: 110px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba .pager {
    margin: 70px 0 0;
  }
}
.comment-hiroba .pager ul {
  list-style: none;
  display: flex;
  justify-content: center;
  margin: 0;
  padding: 0;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba .pager ul {
    flex-wrap: wrap;
  }
}
.comment-hiroba .pager ul li {
  height: 38px;
  border: #fff solid 2px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba .pager ul li {
    margin: 0 0 10px;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba .pager ul li {
    cursor: pointer !important;
  }
  .comment-hiroba .pager ul li:hover {
    background-color: rgba(255, 255, 255, 0.1);
  }
}
.comment-hiroba .pager ul li.num {
  width: 38px;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba .pager ul li.num {
    margin: 0 6px 13px;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba .pager ul li.num {
    margin: 0 8px;
  }
}
.comment-hiroba .pager ul li.current {
  background: #fff;
  color: #000;
}
.comment-hiroba .pager ul li.prev, .comment-hiroba .pager ul li.next {
  max-width: 120px;
  border-radius: 50px;
}
@media only screen and (max-width: 767px) {
  .comment-hiroba .pager ul li.prev, .comment-hiroba .pager ul li.next {
    position: absolute;
    top: -60px;
    width: 100%;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba .pager ul li.prev, .comment-hiroba .pager ul li.next {
    width: 13%;
  }
}
@media only screen and (max-width: 767px) {
  .comment-hiroba .pager ul li.prev {
    left: 0;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba .pager ul li.prev {
    margin-right: auto;
  }
}
@media only screen and (max-width: 767px) {
  .comment-hiroba .pager ul li.next {
    right: 0;
  }
}
@media only screen and (min-width: 768px) {
  .comment-hiroba .pager ul li.next {
    margin-left: auto;
  }
}
.comment-hiroba .pager ul li.disable {
  opacity: 0.2;
  pointer-events: none;
}

.contact {
  font-family: "Zen Kaku Gothic Antique", sans-serif;
}
@media only screen and (max-width: 767px) {
  .contact__content {
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 768px) {
  .contact__content {
    margin: 0 0 130px;
  }
}
@media only screen and (min-width: 768px) {
  .contact h3 {
    font-size: 2.3rem;
    margin: 20px 0 30px;
  }
}
.contact h4 {
  text-align: center;
  letter-spacing: 0.2rem;
}
@media only screen and (max-width: 767px) {
  .contact h4 {
    font-size: 1.2rem;
    margin: 0 0 20px;
  }
}
@media only screen and (min-width: 768px) {
  .contact h4 {
    font-size: 1.5rem;
    margin: 0 0 30px;
  }
}
@media only screen and (max-width: 767px) {
  .contact__block {
    margin: 0 0 40px;
  }
}
@media only screen and (min-width: 768px) {
  .contact__block {
    margin: 0 0 70px;
  }
}
.contact__block::last-of-type {
  margin: 0;
}
.contact__block p {
  text-align: center;
  letter-spacing: 0.1rem;
}
@media only screen and (max-width: 767px) {
  .contact__block p {
    font-size: 0.95rem;
    line-height: 1.8rem;
    margin: 0 0 20px;
  }
}
@media only screen and (min-width: 768px) {
  .contact__block p {
    font-size: 1.1rem;
    line-height: 1.9rem;
  }
}
.contact__intro p {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .contact__intro p {
    font-size: 0.9rem;
    line-height: 1.8rem;
    margin: 0 0 20px;
  }
}
@media only screen and (min-width: 768px) {
  .contact__intro p {
    font-size: 1.05rem;
    line-height: 2.3rem;
    letter-spacing: 0.2rem;
    margin: 0 0 30px;
  }
}
.contact__intro p:last-child {
  margin: 0;
}
.contact__link-works {
  background: #9b2c2a;
  text-align: center;
  font-weight: 600;
  letter-spacing: 0.1rem;
  border-radius: 5px;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .contact__link-works {
    width: 90%;
    height: 52px;
    line-height: 52px;
    font-size: 0.95rem;
    margin: 30px auto 0;
  }
}
@media only screen and (min-width: 768px) {
  .contact__link-works {
    width: 450px;
    height: 60px;
    line-height: 60px;
    font-size: 1.1rem;
    margin: 40px auto 0;
  }
}
.contact__link-works::before {
  content: "";
  display: block;
  border-top: solid 3px #fff;
  border-right: solid 3px #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  right: 25px;
}
@media only screen and (max-width: 767px) {
  .contact__link-works::before {
    top: 22px;
    width: 6px;
    height: 6px;
  }
}
@media only screen and (min-width: 768px) {
  .contact__link-works::before {
    top: 24px;
    width: 8px;
    height: 8px;
  }
}
.contact__link-works a {
  display: block;
  width: 100%;
}
.contact__form form {
  box-sizing: border-box;
}
.contact__form dl {
  margin: 0 auto 30px;
}
@media only screen and (min-width: 768px) {
  .contact__form dl {
    width: 75%;
  }
}
.contact__form dl:last-child {
  margin: 0;
}
.contact__form dl dt {
  margin: 0 0 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.contact__form dl dd {
  margin: 0;
}
.contact__form input[type=text],
.contact__form input[type=mail],
.contact__form textarea {
  -webkit-appearance: none;
  background-color: #F6F6F6;
  border: none;
  font-size: 15px;
  box-sizing: border-box;
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .contact__form input[type=text],
  .contact__form input[type=mail],
  .contact__form textarea {
    padding: 13px 15px;
  }
}
@media only screen and (min-width: 768px) {
  .contact__form input[type=text],
  .contact__form input[type=mail],
  .contact__form textarea {
    padding: 15px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .contact__form textarea {
    height: 180px;
  }
}
@media only screen and (min-width: 768px) {
  .contact__form textarea {
    height: 160px;
  }
}
.contact__form .required {
  background: #9c2b2a;
  color: #fff;
  font-size: 0.75rem;
  line-height: 100%;
  padding: 3px 8px;
}
@media only screen and (max-width: 767px) {
  .contact__submit {
    margin: 35px auto 0;
  }
}
@media only screen and (min-width: 768px) {
  .contact__submit {
    margin: 55px auto 0;
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
  }
}
.contact__submit input[type=submit] {
  appearance: none;
  -webkit-appearance: none;
  border: none;
  cursor: pointer;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #e3e3e3;
  color: #333;
  font-weight: 600;
  font-size: 0.95rem;
  letter-spacing: 0.1em;
  height: 45px;
  line-height: 45px;
  border-radius: 3px;
}
@media only screen and (max-width: 767px) {
  .contact__submit input[type=submit] {
    width: 100%;
  }
}
@media only screen and (min-width: 768px) {
  .contact__submit input[type=submit] {
    width: 300px;
    margin: 0 10px;
  }
}
.contact__submit input[type=submit]:hover {
  background: #c7c7c7;
  transition: 0.2s;
}
.contact__submit input[type=submit]:first-child {
  background: #999;
  color: #fff;
}
@media only screen and (max-width: 767px) {
  .contact__submit input[type=submit]:first-child {
    margin: 0 0 15px;
  }
}
.contact__submit input[type=submit]:first-child:hover {
  background: #666;
}
.contact__present-pic {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .contact__present-pic img {
    width: 250px;
  }
}
@media only screen and (min-width: 768px) {
  .contact__present-pic img {
    width: 280px;
  }
}
.contact__present-note {
  text-align: center;
  margin: 10px 0 0 !important;
}
@media only screen and (max-width: 767px) {
  .contact__present-note {
    font-size: 0.7rem !important;
    line-height: 1.2rem !important;
    margin: 10px 0 0 !important;
  }
}
@media only screen and (min-width: 768px) {
  .contact__present-note {
    font-size: 0.8rem !important;
    line-height: 1.2rem !important;
    margin: 15px 0 0 !important;
  }
}

.contact-works__intro {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .contact-works__intro {
    font-size: 0.95rem;
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 768px) {
  .contact-works__intro {
    margin: 0 0 50px;
  }
}
.contact-works__list {
  list-style: none;
  margin: 0;
  padding: 0;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media only screen and (min-width: 1000px) {
  .contact-works__list {
    display: flex;
  }
}
.contact-works__list__item {
  background: #222;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .contact-works__list__item {
    width: 50%;
    height: 180px;
    margin: 0 auto 17px;
  }
}
@media only screen and (min-width: 768px) {
  .contact-works__list__item {
    width: 22.5%;
    height: 200px;
  }
}
.contact-works__list__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 3px;
  overflow: hidden;
}
.contact-works__entry {
  background: #111;
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .contact-works__entry {
    padding: 30px 20px;
  }
}
@media only screen and (min-width: 768px) {
  .contact-works__entry {
    padding: 60px 50px;
  }
}
.contact-works__entry__pic {
  text-align: center;
  background: #161616;
}
@media only screen and (max-width: 767px) {
  .contact-works__entry__pic {
    margin: 0 auto 30px;
  }
}
@media only screen and (min-width: 768px) {
  .contact-works__entry__pic {
    margin: 0 0 50px;
  }
}
@media only screen and (max-width: 767px) {
  .contact-works__entry__pic img {
    width: 80%;
  }
}
@media only screen and (min-width: 768px) {
  .contact-works__entry__pic img {
    width: 400px;
  }
}
@media only screen and (max-width: 767px) {
  .contact-works__entry__text .comment {
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 768px) {
  .contact-works__entry__text .comment {
    margin: 0 0 40px;
  }
}
.contact-works__entry__text .comment p {
  letter-spacing: 0.05rem;
  margin: 0 0 20px;
}
@media only screen and (max-width: 767px) {
  .contact-works__entry__text .comment p {
    font-size: 0.9rem;
    line-height: 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .contact-works__entry__text .comment p {
    font-size: 0.95rem;
    line-height: 1.55rem;
  }
}
.contact-works__entry__text .comment p:last-child {
  margin: 0;
}
.contact-works__entry__text .name {
  letter-spacing: 0.05rem;
  margin: 0 0 5px;
}
@media only screen and (max-width: 767px) {
  .contact-works__entry__text .name {
    font-size: 0.9rem;
  }
}
@media only screen and (min-width: 768px) {
  .contact-works__entry__text .name {
    font-size: 0.95rem;
  }
}
.contact-works__entry__text .date {
  font-family: "Helvetica Neue", Arial, sans-serif;
  color: #bbb;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .contact-works__entry__text .date {
    font-size: 0.85rem;
  }
}
@media only screen and (min-width: 768px) {
  .contact-works__entry__text .date {
    font-size: 0.9rem;
  }
}

.about__content {
  box-sizing: border-box;
  position: relative;
  font-family: "Zen Kaku Gothic Antique", sans-serif;
}
@media only screen and (max-width: 767px) {
  .about__content {
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 768px) {
  .about__content {
    margin: 0 0 130px;
  }
}
.about__ttl {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .about__ttl {
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 768px) {
  .about__ttl {
    margin: 0 0 60px;
  }
}
@media only screen and (max-width: 767px) {
  .about__ttl img {
    width: 55%;
  }
}
@media only screen and (min-width: 768px) {
  .about__ttl img {
    width: 34%;
  }
}
.about__ttl-text {
  letter-spacing: 0.1rem;
}
@media only screen and (min-width: 768px) {
  .about__ttl-text {
    font-size: 2.3rem;
    margin: 20px 0 0;
  }
}
.about__text p {
  text-align: center;
  position: relative;
  z-index: 99;
  text-shadow: -1px -1px 0 #000, -1px 0 0 #000, -1px 1px 0 #000, 0 -1px 0 #000, 0 1px 0 #000, 1px -1px 0 #000, 1px 0 0 #000, 1px 1px 0 #000;
}
@media only screen and (max-width: 767px) {
  .about__text p {
    font-size: 0.9rem;
    line-height: 1.8rem;
    margin: 0 0 20px;
  }
}
@media only screen and (min-width: 768px) {
  .about__text p {
    font-size: 1.05rem;
    line-height: 2.3rem;
    letter-spacing: 0.2rem;
    margin: 0 0 50px;
  }
}
.about__text p:last-child {
  margin: 0;
}
.about__name {
  text-align: center;
  letter-spacing: 0.1rem;
}
@media only screen and (max-width: 767px) {
  .about__name {
    margin: 40px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .about__name {
    font-size: 1.05rem;
    margin: 80px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .about__pic {
    opacity: 0.7;
  }
}
.about__pic-item {
  position: absolute;
}
.about__pic-item.pic-kawakatsu {
  z-index: 2;
}
@media only screen and (max-width: 767px) {
  .about__pic-item.pic-kawakatsu {
    top: 420px;
    left: -40px;
  }
}
@media only screen and (min-width: 768px) {
  .about__pic-item.pic-kawakatsu {
    top: 500px;
    left: 100px;
  }
}
@media only screen and (max-width: 767px) {
  .about__pic-item.pic-kawakatsu img {
    width: 130px;
  }
}
@media only screen and (min-width: 768px) {
  .about__pic-item.pic-kawakatsu img {
    width: 170px;
  }
}
.about__pic-item.pic-aran {
  z-index: 1;
}
@media only screen and (max-width: 767px) {
  .about__pic-item.pic-aran {
    bottom: 130px;
    right: -45px;
  }
}
@media only screen and (min-width: 768px) {
  .about__pic-item.pic-aran {
    bottom: 150px;
    right: 110px;
  }
}
@media only screen and (max-width: 767px) {
  .about__pic-item.pic-aran img {
    width: 100px;
  }
}
@media only screen and (min-width: 768px) {
  .about__pic-item.pic-aran img {
    width: 120px;
  }
}
@media only screen and (max-width: 767px) {
  .about__pic-item.pic-rei {
    bottom: 30px;
    left: -80px;
  }
}
@media only screen and (min-width: 768px) {
  .about__pic-item.pic-rei {
    bottom: 40px;
    left: 100px;
  }
}
@media only screen and (max-width: 767px) {
  .about__pic-item.pic-rei img {
    width: 180px;
  }
}
@media only screen and (min-width: 768px) {
  .about__pic-item.pic-rei img {
    width: 200px;
  }
}

@media only screen and (max-width: 767px) {
  .article__content {
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 768px) {
  .article__content {
    margin: 0 0 130px;
  }
}
.article .cat-list {
  display: flex;
  justify-content: center;
  list-style: none;
  padding: 0;
  font-family: "Poppins";
}
@media only screen and (max-width: 767px) {
  .article .cat-list {
    flex-wrap: wrap;
    margin: 0 0 25px;
    gap: 0 25px;
  }
}
@media only screen and (min-width: 768px) {
  .article .cat-list {
    margin: 0 0 55px;
    gap: 0 40px;
  }
}
.article .cat-list__item {
  cursor: pointer;
  position: relative;
  line-height: 100%;
  box-sizing: border-box;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .article .cat-list__item {
    font-size: 0.85rem;
    margin: 0 0 12px;
  }
}
@media only screen and (min-width: 768px) {
  .article .cat-list__item:hover::after {
    transform: scale(1, 1);
  }
}
.article .cat-list__item::before {
  content: "";
  background: #fff;
  width: 1px;
  position: absolute;
}
@media only screen and (max-width: 767px) {
  .article .cat-list__item::before {
    height: 8px;
    top: 2.5px;
    right: -13px;
  }
}
@media only screen and (min-width: 768px) {
  .article .cat-list__item::before {
    height: 10px;
    top: 3px;
    right: -20px;
  }
}
.article .cat-list__item::after {
  content: "";
  background: #fff;
  width: 100%;
  height: 1px;
  position: absolute;
  left: 0;
  bottom: 0;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: transform 0.3s;
}
@media only screen and (max-width: 767px) {
  .article .cat-list__item:nth-child(4)::before {
    background-color: transparent;
  }
}
.article .cat-list__item:last-child::before {
  background-color: transparent;
}
.article .cat-list__item.is-select {
  border-bottom: 1px solid #fff;
}
@media only screen and (min-width: 768px) {
  .article .article-list {
    min-height: 1000px;
  }
}
.article .article-list__item {
  position: relative;
  cursor: pointer;
}
@media only screen and (max-width: 767px) {
  .article .article-list__item {
    margin: 0 0 45px;
  }
}
@media only screen and (min-width: 768px) {
  .article .article-list__item {
    margin: 0 0 35px;
  }
  .article .article-list__item:hover .article-list__pic img {
    transform: scale(1.05);
  }
  .article .article-list__item:hover .article-list__detail {
    opacity: 0.8;
  }
}
.article .article-list__item:last-child {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .article .article-list__item[data-group=review] .article-list__ttl {
    display: none;
  }
}
@media only screen and (min-width: 768px) {
  .article .article-list__inner {
    display: flex;
  }
}
.article .article-list__pic {
  overflow: hidden;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .article .article-list__pic {
    margin: 0 0 20px;
  }
}
@media only screen and (min-width: 768px) {
  .article .article-list__pic {
    width: 48%;
  }
}
.article .article-list__pic img {
  transition: 0.4s;
}
.article .article-list__detail {
  box-sizing: border-box;
}
@media only screen and (min-width: 768px) {
  .article .article-list__detail {
    width: 52%;
    padding: 3px 0 5px 30px;
    transition: 0.4s;
    display: flex;
    flex-direction: column;
  }
}
.article .article-list__ttl {
  font-weight: 500;
  letter-spacing: 0.1rem;
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .article .article-list__ttl {
    font-size: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .article .article-list__ttl {
    font-size: 1.15rem;
  }
}
.article .article-list__ttl a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.article .article-list__text p {
  letter-spacing: 0.05rem;
  margin: 0;
  color: #c6c6c6;
}
@media only screen and (max-width: 767px) {
  .article .article-list__text p {
    font-size: 0.85rem;
    line-height: 1.45rem;
    margin: 8px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .article .article-list__text p {
    font-size: 0.95rem;
    line-height: 1.7rem;
    margin: 15px 0 0;
  }
}
.article .article-list .state {
  font-family: "Poppins";
  color: #bbb;
  display: flex;
  justify-content: flex-end;
  letter-spacing: 0.1rem;
}
@media only screen and (max-width: 767px) {
  .article .article-list .state {
    margin: 25px 0 0;
    font-size: 0.75rem;
  }
}
@media only screen and (min-width: 768px) {
  .article .article-list .state {
    margin: auto 0 0;
    font-size: 0.8rem;
  }
}
.article .article-list .state .category::after {
  content: "";
  width: 1px;
  height: 10px;
  background-color: #999;
  display: inline-block;
}
@media only screen and (max-width: 767px) {
  .article .article-list .state .category::after {
    margin: 0 11px 0 9px;
  }
}
@media only screen and (min-width: 768px) {
  .article .article-list .state .category::after {
    margin: 0 14px;
  }
}
.article .is-hide {
  display: none !important;
}
.article .pager {
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-weight: 500;
  list-style: none;
  display: flex;
  justify-content: center;
  padding: 0;
  position: relative;
  color: #fff;
}
@media only screen and (max-width: 767px) {
  .article .pager {
    margin: 140px 0 0;
    font-size: 0.9rem;
  }
}
@media only screen and (min-width: 768px) {
  .article .pager {
    margin: 90px 0 0;
  }
}
.article .pager a {
  width: 38px;
  height: 38px;
  line-height: 38px;
  border: #fff solid 2px;
  border-radius: 50%;
  text-align: center;
  transition: 0.3s;
  display: block;
}
@media only screen and (max-width: 767px) {
  .article .pager a {
    margin: 0 6px 13px;
  }
}
@media only screen and (min-width: 768px) {
  .article .pager a {
    cursor: pointer !important;
    margin: 0 8px;
  }
  .article .pager a:hover {
    background-color: rgba(255, 255, 255, 0.1);
  }
}
.article .pager a.jp-current {
  background: #fff;
  color: #000;
}
.article .pager a.ellipsis {
  border: none;
  pointer-events: none;
}
.article .pager a.jp-previous, .article .pager a.jp-next {
  max-width: 120px;
  border-radius: 50px;
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .article .pager a.jp-previous, .article .pager a.jp-next {
    position: absolute;
    top: -60px;
    width: 100%;
  }
}
@media only screen and (min-width: 768px) {
  .article .pager a.jp-previous, .article .pager a.jp-next {
    width: 13%;
  }
}
@media only screen and (max-width: 767px) {
  .article .pager a.jp-previous {
    left: 0;
  }
}
@media only screen and (min-width: 768px) {
  .article .pager a.jp-previous {
    margin-right: auto;
  }
}
@media only screen and (max-width: 767px) {
  .article .pager a.jp-next {
    right: 0;
  }
}
@media only screen and (min-width: 768px) {
  .article .pager a.jp-next {
    margin-left: auto;
  }
}
.article .pager a.jp-disabled {
  opacity: 0.2;
  pointer-events: none;
}
.article .pager span {
  margin: 0 10px;
  display: block;
  height: 38px;
  line-height: 34px;
}

@media only screen and (max-width: 767px) {
  .article-single .content {
    margin: 0;
  }
}
.article-single__content {
  background: #fff;
  color: #000;
}
@media only screen and (max-width: 767px) {
  .article-single__content {
    margin: 0 0 40px;
    padding: 40px 0 50px;
  }
}
@media only screen and (min-width: 768px) {
  .article-single__content {
    margin: 0 0 100px;
    padding: 50px 0 60px;
  }
}
@media only screen and (max-width: 767px) {
  .article-single__head {
    margin: 0 0 30px;
    padding: 0 20px;
  }
}
@media only screen and (min-width: 768px) {
  .article-single__head {
    margin: 0 0 40px;
    padding: 0 45px;
  }
}
.article-single__head .article-ttl {
  font-weight: 500;
}
@media only screen and (max-width: 767px) {
  .article-single__head .article-ttl {
    font-size: 1.3rem;
    letter-spacing: 0.1rem;
    margin: 0 0 10px;
  }
}
@media only screen and (min-width: 768px) {
  .article-single__head .article-ttl {
    font-size: 1.8rem;
    letter-spacing: 0.15rem;
    margin: 0 0 12px;
  }
}
.article-single__head .state {
  font-family: "Poppins";
  color: #666;
  display: flex;
  letter-spacing: 0.1rem;
  font-weight: 500;
}
@media only screen and (max-width: 767px) {
  .article-single__head .state {
    margin: 0 0 8px;
    font-size: 0.8rem;
  }
}
@media only screen and (min-width: 768px) {
  .article-single__head .state {
    margin: 0 0 10px;
    font-size: 0.9rem;
  }
}
.article-single__head .state .category::after {
  margin: 0 14px;
  content: "";
  width: 1px;
  height: 10px;
  background-color: #999;
  display: inline-block;
}
@media only screen and (max-width: 767px) {
  .article-single__hero {
    margin: 0 0 45px;
  }
}
@media only screen and (min-width: 768px) {
  .article-single__hero {
    margin: 0 0 70px;
  }
}
.article-single__body {
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .article-single__body {
    padding: 0 20px;
  }
}
@media only screen and (min-width: 768px) {
  .article-single__body {
    padding: 0 50px;
  }
}
.article-single section:last-child {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .article-single__text {
    padding: 20px 17px 35px;
  }
}
@media only screen and (min-width: 768px) {
  .article-single__text {
    padding: 20px 30px 40px;
  }
}
.article-single__text p {
  letter-spacing: 0.03rem;
}
@media only screen and (max-width: 767px) {
  .article-single__text p {
    font-size: 0.9rem;
    line-height: 1.7rem;
    margin: 0 0 18px;
  }
}
@media only screen and (min-width: 768px) {
  .article-single__text p {
    font-size: 1rem;
    line-height: 1.8rem;
    margin: 0 0 20px;
  }
}
.article-single__text p:last-child {
  margin: 0;
}
.article-single__back {
  border: #000 solid 1px;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .article-single__back {
    margin: 40px auto 0;
    width: 180px;
    height: 48px;
    line-height: 48px;
    font-size: 0.9rem;
  }
}
@media only screen and (min-width: 768px) {
  .article-single__back {
    margin: 50px auto 0;
    width: 230px;
    height: 50px;
    line-height: 50px;
    font-size: 0.95rem;
    transition: 0.3s;
  }
  .article-single__back:hover {
    background: #000;
  }
  .article-single__back:hover a {
    color: #fff;
  }
}
.article-single__back a {
  display: block;
  width: 100%;
  color: #000;
}

.tada .article-single__body {
  padding: 0;
}

@media only screen and (max-width: 767px) {
  .interview section dl {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) {
  .interview section dl {
    margin: 0 50px;
  }
}
.interview section dl a {
  font-weight: 500;
  border-bottom: 1px dotted #000;
  color: #000;
}
@media only screen and (max-width: 767px) {
  .interview section dl a {
    font-size: 0.9rem;
  }
}
@media only screen and (min-width: 768px) {
  .interview section dl a {
    position: relative;
    font-size: 0.95rem;
  }
  .interview section dl a::after {
    content: "";
    background: #000000;
    width: 100%;
    height: 0.1rem;
    position: absolute;
    left: 0;
    bottom: -1px;
    transform: scale(0, 1);
    transform-origin: left top;
    transition: transform 0.3s;
  }
  .interview section dl a:hover::after {
    transform: scale(1, 1);
  }
}
.interview section dt {
  font-weight: 600;
  display: block;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .interview section dt {
    line-height: 1.8rem;
    margin: 0 0 18px;
  }
}
@media only screen and (min-width: 768px) {
  .interview section dt {
    font-size: 1.1rem;
    line-height: 1.8em;
    margin: 0 0 25px;
  }
}
.interview section dt::before {
  content: "--";
  letter-spacing: -0.2em;
  margin-right: 7px;
}
.interview section dd {
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .interview section dd {
    line-height: 1.85rem;
    margin: 0 0 35px;
  }
}
@media only screen and (min-width: 768px) {
  .interview section dd {
    font-size: 1.1rem;
    line-height: 1.95rem;
    margin: 0 0 40px;
  }
}
.interview section dd span {
  margin: 0 15px 0 0;
}
.interview section h4 {
  font-weight: 500;
  letter-spacing: 0.1rem;
}
@media only screen and (max-width: 767px) {
  .interview section h4 {
    font-size: 1.3rem;
    margin: 0 0 20px;
  }
}
@media only screen and (min-width: 768px) {
  .interview section h4 {
    font-size: 2rem;
    margin: 0 50px 25px;
  }
}
.interview__img {
  text-align: center;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media only screen and (max-width: 767px) {
  .interview__img {
    margin: 55px 0;
  }
}
@media only screen and (min-width: 768px) {
  .interview__img {
    margin: 60px 0;
  }
  .interview__img:hover a img {
    transition: 0.3s;
    opacity: 0.8;
  }
  .interview__img:hover .caption span::after {
    transform: scale(1, 1);
  }
}
.interview__img a {
  border-bottom: none !important;
}
.interview__img a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.interview__img .img-l {
  width: 500px;
  margin: 0 auto;
}
.interview__img .caption {
  margin: 10px 0 0;
}
@media only screen and (max-width: 767px) {
  .interview__img .caption {
    text-align: left;
    font-size: 0.8rem;
  }
}
@media only screen and (min-width: 768px) {
  .interview__img .caption {
    font-size: 0.9rem;
  }
}
.interview__img .caption span {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted #000;
}
.interview__img .caption span::after {
  content: "";
  background: #000000;
  width: 100%;
  height: 0.1rem;
  position: absolute;
  left: 0;
  bottom: -1px;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: transform 0.3s;
}
.interview__img .twitter .twitter-tweet {
  margin: 0 auto !important;
}
.interview__profile {
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .interview__profile {
    margin: 55px 0;
    padding: 35px 25px;
  }
}
@media only screen and (min-width: 768px) {
  .interview__profile {
    display: flex;
    justify-content: space-between;
    margin: 60px 0;
    padding: 35px;
  }
}
.interview__profile__img {
  overflow: hidden;
  border-radius: 50%;
  background: #fff;
}
@media only screen and (max-width: 767px) {
  .interview__profile__img {
    width: 140px;
    width: 140px;
    margin: 0 auto 25px;
  }
}
@media only screen and (min-width: 768px) {
  .interview__profile__img {
    width: 150px;
    height: 150px;
  }
}
.interview__profile__text {
  font-size: 0.9rem;
}
@media only screen and (min-width: 768px) {
  .interview__profile__text {
    width: calc(100% - 180px);
    padding: 15px 0 0;
  }
}
.interview__profile__text .profile-ttl {
  font-weight: 600;
  margin: 0 0 10px;
}
@media only screen and (max-width: 767px) {
  .interview__profile__text .profile-ttl {
    font-size: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .interview__profile__text .profile-ttl {
    font-size: 1.1rem;
  }
}
@media only screen and (max-width: 767px) {
  .interview__profile__text p {
    line-height: 1.4rem;
    margin: 0 0 10px;
  }
}
@media only screen and (min-width: 768px) {
  .interview__profile__text p {
    line-height: 1.6rem;
    margin: 0 0 13px;
  }
}
.interview__profile__text p:last-child {
  margin: 0;
}
.interview__profile__text a {
  font-weight: 500;
  border-bottom: 1px dotted #000;
  color: #000;
  font-size: 0.9rem;
}
@media only screen and (min-width: 768px) {
  .interview__profile__text a {
    position: relative;
  }
  .interview__profile__text a::after {
    content: "";
    background: #000000;
    width: 100%;
    height: 0.1rem;
    position: absolute;
    left: 0;
    bottom: -1px;
    transform: scale(0, 1);
    transform-origin: left top;
    transition: transform 0.3s;
  }
  .interview__profile__text a:hover::after {
    transform: scale(1, 1);
  }
}
@media only screen and (max-width: 767px) {
  .interview__skip {
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 768px) {
  .interview__skip {
    margin: 0 0 60px;
  }
}
@media only screen and (max-width: 767px) {
  .interview__comic {
    margin: 55px 0;
  }
}
@media only screen and (min-width: 768px) {
  .interview__comic {
    margin: 60px 0;
  }
}
@media only screen and (max-width: 767px) {
  .interview__comic__link {
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 768px) {
  .interview__comic__link {
    margin: 0 0 25px;
  }
}
.interview__comic__link a::after {
  content: "";
  background: url(../img/article/interview/icon-link.png) no-repeat top left/contain;
  display: inline-block;
  position: relative;
  top: 0.8%;
  margin: 0 0 0 7px;
}
@media only screen and (max-width: 767px) {
  .interview__comic__link a::after {
    width: 13px;
    height: 13px;
  }
}
@media only screen and (min-width: 768px) {
  .interview__comic__link a::after {
    width: 15px;
    height: 15px;
  }
}
.interview__comic .note ul {
  margin: 0 0 10px 18px;
  padding: 0;
  letter-spacing: 0.05rem;
  font-size: 0.9rem;
}
.interview__comic .note ul li {
  margin: 0 0 5px;
}
.interview__comic .note ul li:last-child {
  margin: 0;
}
.interview__comic .note a {
  color: #000;
  border-bottom: 1px dotted #000;
  font-size: 0.9rem;
}
@media only screen and (min-width: 768px) {
  .interview__comic .note a {
    position: relative;
  }
  .interview__comic .note a::after {
    content: "";
    background: #000000;
    width: 100%;
    height: 0.1rem;
    position: absolute;
    left: 0;
    bottom: -1px;
    transform: scale(0, 1);
    transform-origin: left top;
    transition: transform 0.3s;
  }
  .interview__comic .note a:hover::after {
    transform: scale(1, 1);
  }
}
.interview .link {
  border: 1px solid #999;
  text-align: center;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .interview .link {
    height: 70px;
  }
}
@media only screen and (min-width: 768px) {
  .interview .link {
    height: 65px;
    transition: 0.3s;
  }
  .interview .link:hover {
    background: #f5f5f5;
  }
}
.interview .link a {
  color: #000;
  font-weight: 600;
  display: block;
  width: 100%;
  letter-spacing: 0.05rem;
}
@media only screen and (min-width: 768px) {
  .interview .link a {
    font-size: 1.15rem;
  }
}
.interview .link a::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.review__head {
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .review__head {
    margin: 0 0 30px;
    padding: 35px 25px;
  }
}
@media only screen and (min-width: 768px) {
  .review__head {
    margin: 0 0 40px;
    padding: 35px;
  }
}
.review__head .lead {
  background: #f5f5f5;
  margin: 0 0 33px;
  text-align: center;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .review__head .lead {
    font-size: 0.85rem;
    line-height: 1.2rem;
    padding: 12px 13px 13px;
  }
}
@media only screen and (min-width: 768px) {
  .review__head .lead {
    font-size: 0.9rem;
    padding: 15px;
  }
}
@media only screen and (min-width: 768px) {
  .review__head__inner {
    display: flex;
    justify-content: space-between;
  }
}
@media only screen and (max-width: 767px) {
  .review__head__img {
    width: 55%;
    margin: 0 auto 33px;
  }
}
@media only screen and (min-width: 768px) {
  .review__head__img {
    width: 200px;
  }
}
@media only screen and (min-width: 768px) {
  .review__head__text {
    width: calc(100% - 240px);
    padding: 5px 0 0;
  }
}
.review__head__text .catch {
  margin: 0 0 17px;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .review__head__text .catch {
    font-size: 0.95rem;
  }
}
.review__head__detail {
  border-left: 4px solid #000;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .review__head__detail {
    margin: 0 0 30px;
    padding: 0 0 5px 15px;
  }
}
@media only screen and (min-width: 768px) {
  .review__head__detail {
    margin: 0 0 40px;
    padding: 0 0 5px 20px;
  }
}
.review__head__detail .title {
  font-weight: 600;
  margin: 0 0 10px;
}
@media only screen and (max-width: 767px) {
  .review__head__detail .title {
    font-size: 1.1rem;
  }
}
@media only screen and (min-width: 768px) {
  .review__head__detail .title {
    font-size: 1.4rem;
  }
}
.review__head__detail .author {
  margin: 0;
  line-height: 100%;
}
@media only screen and (max-width: 767px) {
  .review__head__detail .author {
    font-size: 0.9rem;
  }
}
.review__head__detail .author a {
  color: #000;
}
@media only screen and (min-width: 768px) {
  .review__head__detail .author a {
    transition: 0.3s;
  }
  .review__head__detail .author a:hover {
    opacity: 0.6;
  }
}
.review__head__link .button {
  border: 1px solid #999;
  text-align: center;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .review__head__link .button {
    margin: 0 0 20px;
    height: 60px;
  }
}
@media only screen and (min-width: 768px) {
  .review__head__link .button {
    margin: 0 0 25px;
    height: 65px;
    transition: 0.3s;
  }
  .review__head__link .button:hover {
    background: #f5f5f5;
  }
}
.review__head__link .button a {
  color: #000;
  font-weight: 600;
  display: block;
  width: 100%;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .review__head__link .button a {
    font-size: 0.9rem;
  }
}
@media only screen and (min-width: 768px) {
  .review__head__link .button a {
    font-size: 1rem;
  }
}
.review__head__link .button a::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.review__head__link .button a::after {
  content: "";
  background: url(../img/article/interview/icon-link.png) no-repeat top left/contain;
  display: inline-block;
  position: relative;
  top: 0.8%;
  margin: 0 0 0 7px;
}
@media only screen and (max-width: 767px) {
  .review__head__link .button a::after {
    width: 13px;
    height: 13px;
  }
}
@media only screen and (min-width: 768px) {
  .review__head__link .button a::after {
    width: 15px;
    height: 15px;
  }
}
.review__head__link .note ul {
  margin: 0 0 10px 18px;
  padding: 0;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .review__head__link .note ul {
    font-size: 0.85rem;
  }
}
@media only screen and (min-width: 768px) {
  .review__head__link .note ul {
    font-size: 0.9rem;
  }
}
.review__head__link .note ul li {
  margin: 0 0 5px;
}
.review__head__link .note ul li:last-child {
  margin: 0;
}
.review__head__link .note a {
  color: #000;
  border-bottom: 1px dotted #000;
  font-size: 0.85rem;
}
@media only screen and (min-width: 768px) {
  .review__head__link .note a {
    position: relative;
  }
  .review__head__link .note a::after {
    content: "";
    background: #000000;
    width: 100%;
    height: 0.1rem;
    position: absolute;
    left: 0;
    bottom: -1px;
    transform: scale(0, 1);
    transform-origin: left top;
    transition: transform 0.3s;
  }
  .review__head__link .note a:hover::after {
    transform: scale(1, 1);
  }
}
@media only screen and (min-width: 768px) {
  .review section {
    max-width: 620px;
    margin: 0 auto;
  }
}
.review section:last-child {
  margin: 0 auto;
}
.review section .reviewer {
  display: flex;
  align-items: center;
}
@media only screen and (max-width: 767px) {
  .review section .reviewer {
    margin: 0 0 35px;
  }
}
@media only screen and (min-width: 768px) {
  .review section .reviewer {
    margin: 0 0 40px;
  }
}
.review section .reviewer__img {
  border-radius: 50%;
  margin: 0 10px 0 0;
}
@media only screen and (max-width: 767px) {
  .review section .reviewer__img {
    width: 35px;
  }
}
@media only screen and (min-width: 768px) {
  .review section .reviewer__img {
    width: 37px;
  }
}
.review section .reviewer__img img {
  border-radius: 50%;
}
.review section .reviewer p {
  margin: 0;
  font-weight: 500;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .review section .reviewer p {
    font-size: 0.9rem;
  }
}
.review__text p {
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .review__text p {
    line-height: 1.85rem;
    margin: 0 0 25px;
  }
}
@media only screen and (min-width: 768px) {
  .review__text p {
    font-size: 1.1rem;
    line-height: 1.95rem;
    margin: 0 0 30px;
  }
}
.review__text p:last-child {
  margin: 0;
}
.review__text .text-m,
.review__text .text-l {
  font-weight: 700;
}
@media only screen and (max-width: 767px) {
  .review__text .text-m {
    font-size: 1.6rem;
    line-height: 2.4rem;
  }
}
@media only screen and (min-width: 768px) {
  .review__text .text-m {
    font-size: 2rem;
    line-height: 2.7rem;
  }
}
.review__text .text-l {
  color: #e00000;
}
@media only screen and (max-width: 767px) {
  .review__text .text-l {
    font-size: 2.3rem;
    line-height: 3.1rem;
  }
}
@media only screen and (min-width: 768px) {
  .review__text .text-l {
    font-size: 2.7rem;
    line-height: 3.6rem;
  }
}
.review__text a {
  font-weight: 500;
  border-bottom: 1px dotted #000;
  color: #000;
}
@media only screen and (max-width: 767px) {
  .review__text a {
    font-size: 0.9rem;
  }
}
@media only screen and (min-width: 768px) {
  .review__text a {
    position: relative;
    font-size: 0.95rem;
  }
  .review__text a::after {
    content: "";
    background: #000000;
    width: 100%;
    height: 0.1rem;
    position: absolute;
    left: 0;
    bottom: -1px;
    transform: scale(0, 1);
    transform-origin: left top;
    transition: transform 0.3s;
  }
  .review__text a:hover::after {
    transform: scale(1, 1);
  }
}
.review__img {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .review__img {
    margin: 55px 0;
  }
}
@media only screen and (min-width: 768px) {
  .review__img {
    margin: 60px 0;
  }
}
.review__img .img-l {
  width: 500px;
  margin: 0 auto;
}

@media only screen and (max-width: 767px) {
  .backnumber__list-content {
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 768px) {
  .backnumber__list-content {
    margin: 0 0 130px;
  }
}
.backnumber__list ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
@media only screen and (min-width: 768px) {
  .backnumber__list ul::after {
    content: "";
    width: 31%;
  }
}
.backnumber__list ul li {
  position: relative;
}
@media only screen and (max-width: 767px) {
  .backnumber__list ul li {
    width: 47.3%;
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 768px) {
  .backnumber__list ul li {
    width: 31%;
    margin: 0 0 40px;
    cursor: pointer;
    transition: 0.4s;
  }
  .backnumber__list ul li:hover {
    opacity: 0.8;
  }
}
.backnumber__list ul li p {
  font-weight: 600;
  font-family: "Helvetica Neue", Arial, sans-serif;
}
@media only screen and (max-width: 767px) {
  .backnumber__list ul li p {
    font-size: 1.2rem;
    letter-spacing: 0.05rem;
    margin: 10px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .backnumber__list ul li p {
    font-size: 1.4rem;
    letter-spacing: 0.1rem;
    margin: 13px 0 0;
  }
}
.backnumber__list ul li p a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.backnumber__list ul li p .date {
  display: block;
  font-weight: 500;
}
@media only screen and (max-width: 767px) {
  .backnumber__list ul li p .date {
    font-size: 0.9rem;
    margin: 2px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .backnumber__list ul li p .date {
    font-size: 0.95rem;
    margin: 3px 0 0;
  }
}

@media only screen and (max-width: 767px) {
  .cowork .wrap {
    overflow: hidden;
  }
}
.cowork .cowork-nav ul {
  list-style: none;
  padding: 0;
  display: flex;
  justify-content: center;
}
@media only screen and (max-width: 767px) {
  .cowork .cowork-nav ul {
    margin: 0 0 30px;
    flex-wrap: wrap;
  }
}
@media only screen and (min-width: 768px) {
  .cowork .cowork-nav ul {
    margin: 0 0 85px;
  }
}
.cowork .cowork-nav ul li {
  border-left: 1px solid #ccc;
  text-align: center;
  font-weight: 500;
}
@media only screen and (max-width: 767px) {
  .cowork .cowork-nav ul li:nth-child(3) {
    border-right: 1px solid #ccc;
  }
}
.cowork .cowork-nav ul li:last-child {
  border-right: 1px solid #ccc;
}
@media only screen and (max-width: 767px) {
  .cowork .cowork-nav ul li {
    width: 100px;
    height: 38px;
    line-height: 38px;
    margin: 0 0 13px;
    font-size: 0.85rem;
  }
}
@media only screen and (min-width: 768px) {
  .cowork .cowork-nav ul li {
    width: 150px;
    height: 43px;
    line-height: 43px;
    cursor: pointer;
    font-size: 0.95rem;
  }
}
.cowork .cowork-nav ul li a {
  width: 100%;
  display: block;
  position: relative;
  z-index: 99;
}
.cowork__top {
  text-align: center;
}
@media only screen and (min-width: 1000px) {
  .cowork__top {
    margin-bottom: 75px;
  }
}
@media only screen and (max-width: 767px) {
  .cowork__top {
    margin-bottom: 50px;
  }
}
.cowork__imgbox {
  border: white solid 5px;
  justify-content: center;
}
@media only screen and (min-width: 1000px) {
  .cowork__imgbox {
    height: 300px;
  }
}
@media only screen and (max-width: 767px) {
  .cowork__imgbox {
    height: 100px;
  }
}
.cowork__authorbox {
  margin: 0 auto;
  margin-bottom: 50px;
}
.cowork__authorbox p {
  margin: 0;
  text-align: right;
}
@media only screen and (min-width: 1000px) {
  .cowork__authorbox p {
    font-size: 1.5rem;
  }
}
@media only screen and (max-width: 767px) {
  .cowork__authorbox p {
    font-size: 0.8rem;
  }
}
.cowork__content {
  color: #fff;
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .cowork__content {
    margin: 0 0 60px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__content {
    margin: 0 0 130px;
  }
}
@media only screen and (min-width: 1755px) {
  .cowork__inner {
    position: relative;
  }
}
@media only screen and (max-width: 767px) {
  .cowork__inner {
    margin: 0 0 40px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__inner {
    margin: 0 0 60px;
  }
}
.cowork__inner:first-child {
  border: 1px solid #9b2b2a;
}
@media only screen and (min-width: 768px) {
  .cowork__main {
    width: calc(100% - 15px);
    margin: 0 auto;
    overflow: hidden;
  }
}
.cowork__head {
  text-align: center;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .cowork__head {
    margin: 40px 0 40px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__head {
    margin: 80px 0 80px;
  }
}
@media only screen and (max-width: 767px) {
  .cowork__head img {
    width: 80%;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__head img {
    width: 68%;
  }
}
.cowork__catch {
  box-sizing: border-box;
  font-weight: 500;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .cowork__catch {
    margin: 0 0 50px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__catch {
    margin: 0 0 108px;
  }
}
.cowork__catch p {
  font-family: "Zen Kaku Gothic Antique", sans-serif;
  text-align: center;
  position: relative;
  z-index: 99;
}
@media only screen and (max-width: 767px) {
  .cowork__catch p {
    font-size: 0.95rem;
    line-height: 1.8rem;
    margin: 0 0 20px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__catch p {
    font-size: 1.05rem;
    line-height: 1.8rem;
    letter-spacing: 0.2rem;
    margin: 0 0 40px;
  }
}
.cowork__catch p:last-child {
  margin: 0;
}
.cowork__concept {
  box-sizing: border-box;
  font-weight: 500;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .cowork__concept {
    margin: 0 0 45px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__concept {
    margin: 0 0 88px;
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
  }
}
.cowork__concept p {
  font-family: "Zen Kaku Gothic Antique", sans-serif;
  text-align: center;
  position: relative;
  z-index: 99;
}
@media only screen and (max-width: 767px) {
  .cowork__concept p {
    font-size: 0.9rem;
    line-height: 1.8rem;
    margin: 0 0 20px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__concept p {
    font-size: 1.05rem;
    line-height: 1.8rem;
    letter-spacing: 0.2rem;
    margin: 0 0 40px;
  }
}
.cowork__concept p:last-child {
  margin: 0;
}
.cowork__block {
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .cowork__block {
    margin: 0 0 40px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__block {
    margin: 0 0 60px;
  }
}
.cowork__block:last-child {
  margin: 0;
}
.cowork__block p {
  margin: 0 0 30px;
}
@media only screen and (max-width: 767px) {
  .cowork__block p {
    font-size: 0.95rem;
    line-height: 1.75rem;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__block p {
    font-size: 1rem;
    line-height: 1.75rem;
  }
}
.cowork__block p:last-child {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .cowork__item {
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__item {
    margin: 0 0 35px;
  }
}
.cowork__item:last-child {
  margin: 0;
}
.cowork h3 {
  color: #fff;
  letter-spacing: 0.05rem;
  line-height: 100%;
  border-bottom: 5px double #fff;
}
@media only screen and (max-width: 767px) {
  .cowork h3 {
    font-size: 1.3rem;
    margin: 0 0 25px;
    padding: 0 0 13px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork h3 {
    font-size: 1.5rem;
    margin: 0 0 35px;
    padding: 0 0 18px;
  }
}
@media only screen and (max-width: 767px) {
  .cowork h3.text-l {
    font-size: 1.1rem;
  }
}
.cowork h4 {
  margin: 0 0 20px;
  border-left: 4px solid #fff;
}
@media only screen and (max-width: 767px) {
  .cowork h4 {
    font-size: 1.05rem;
    padding: 0 0 0 15px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork h4 {
    font-size: 1.1rem;
    padding: 0 0 0 20px;
  }
}
.cowork h5 {
  margin: 0 0 5px;
}
@media only screen and (max-width: 767px) {
  .cowork h5 {
    font-size: 1.05rem;
  }
}
@media only screen and (min-width: 768px) {
  .cowork h5 {
    font-size: 2rem;
  }
}
.cowork__link {
  background: #df1525;
  text-align: center;
  font-weight: 600;
  letter-spacing: 0.1rem;
  border-radius: 5px;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .cowork__link {
    height: 52px;
    line-height: 52px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__link {
    width: 450px;
    height: 60px;
    line-height: 60px;
    font-size: 1.1rem;
  }
}
.cowork__link::before {
  content: "";
  display: block;
  border-top: solid 3px #fff;
  border-right: solid 3px #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  right: 25px;
}
@media only screen and (max-width: 767px) {
  .cowork__link::before {
    top: 22px;
    width: 6px;
    height: 6px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__link::before {
    top: 23px;
    width: 8px;
    height: 8px;
  }
}
.cowork__link a {
  display: block;
  width: 100%;
}
.cowork__pic-item {
  position: absolute;
}
@media only screen and (max-width: 767px) {
  .cowork__pic-item {
    opacity: 0.5;
  }
}
@media only screen and (max-width: 767px) {
  .cowork__pic-item.pic-top {
    top: 10px;
    right: -41px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__pic-item.pic-top {
    top: -200px;
    right: -60px;
  }
}
@media only screen and (max-width: 767px) {
  .cowork__pic-item.pic-top img {
    width: 151px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__pic-item.pic-top img {
    width: 290px;
  }
}
@media only screen and (max-width: 767px) {
  .cowork__pic-item.pic-left {
    top: 250px;
    left: -10px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__pic-item.pic-left {
    top: 230px;
    left: 23px;
  }
}
@media only screen and (max-width: 767px) {
  .cowork__pic-item.pic-left img {
    width: 156px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__pic-item.pic-left img {
    width: 300px;
  }
}
@media only screen and (max-width: 767px) {
  .cowork__pic-item.pic-right {
    top: 250px;
    right: -20px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__pic-item.pic-right {
    top: 230px;
    right: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .cowork__pic-item.pic-right img {
    width: 151px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__pic-item.pic-right img {
    width: 290px;
  }
}
@media only screen and (max-width: 767px) {
  .cowork__pic-item.pic-bottom {
    bottom: 10px;
    left: -20px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__pic-item.pic-bottom {
    bottom: -150px;
    left: -50px;
  }
}
@media only screen and (max-width: 767px) {
  .cowork__pic-item.pic-bottom img {
    width: 151px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__pic-item.pic-bottom img {
    width: 290px;
  }
}
.cowork__progress {
  border-top: 1px solid #9b2b2a;
  padding: 5px;
}
@media only screen and (min-width: 1755px) {
  .cowork__progress {
    border: 1px solid #9b2b2a;
  }
}
@media only screen and (min-width: 1755px) {
  .cowork__progress {
    position: absolute;
    top: 0px;
    right: -270px;
  }
}
.cowork__progress-text {
  display: grid;
}
.cowork__progress-ttl {
  text-align: center;
  border-bottom: 1px solid #fff;
  padding: 5px 0 10px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 767px) {
  .cowork__progress-ttl {
    font-size: 15px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__progress-ttl {
    font-size: 20px;
  }
}
@media only screen and (min-width: 1755px) {
  .cowork__progress-ttl {
    font-size: 15px;
  }
}
.cowork__progress table tr {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .cowork__progress table tr {
    font-size: 14px;
    margin: 0 0 10px;
  }
  .cowork__progress table tr:last-child {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__progress table tr {
    font-size: 15px;
  }
}
@media only screen and (min-width: 1755px) {
  .cowork__progress table tr {
    font-size: 10px;
  }
}
.cowork__progress table tr:nth-child(odd) {
  background-color: #222222;
}
.cowork__progress table tr:nth-child(even) {
  background-color: #535353;
}
@media only screen and (max-width: 767px) {
  .cowork__progress table td {
    padding: 3px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork__progress table td {
    padding: 8px 0;
  }
}
@media only screen and (min-width: 1755px) {
  .cowork__progress table td {
    padding: 3px 0;
  }
}
@media only screen and (max-width: 767px) {
  .cowork .cowork__pic-item-bottom {
    padding: 15px 20px 0;
  }
}
@media only screen and (min-width: 768px) {
  .cowork .cowork__pic-item-bottom {
    padding: 30px 50px 0;
  }
}
.cowork .saiyo {
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .cowork .saiyo {
    margin: 0 0 10px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork .saiyo {
    margin: 0 0 50px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork .saiyo__icon-sp {
    display: none;
  }
}
.cowork .saiyo__icon-sp .text {
  margin: 0 0 30px;
  font-size: 0.8rem;
  text-align: center;
}
.cowork .saiyo__icon-sp__container {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
}
.cowork .saiyo__icon-sp__container::after {
  content: "";
  width: 30%;
  height: 0;
}
.cowork .saiyo__icon-sp__item {
  width: 30%;
  text-align: center;
  margin: 0 0 30px;
  position: relative;
}
.cowork .saiyo__icon-sp__item img {
  border-radius: 50%;
  overflow: hidden;
}
.cowork .saiyo__icon-sp__item .name {
  margin: 10px 0 0;
  font-size: 0.85rem;
}
.cowork .saiyo__icon-sp__item .name a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.cowork .saiyo__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.cowork .saiyo__item {
  border-bottom: 1px solid #fff;
}
@media only screen and (min-width: 768px) {
  .cowork .saiyo__item:first-child .saiyo__item__inner {
    padding: 0 0 30px;
  }
}
.cowork .saiyo__item:last-child {
  border-bottom: none;
}
@media only screen and (min-width: 768px) {
  .cowork .saiyo__item:last-child .saiyo__item__inner {
    padding: 30px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .cowork .saiyo__item__inner {
    display: flex;
    justify-content: space-between;
    padding: 30px 0;
  }
}
@media only screen and (max-width: 767px) {
  .cowork .saiyo__item__pic {
    margin: 0 auto 25px;
    width: 160px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork .saiyo__item__pic {
    width: 180px;
  }
}
.cowork .saiyo__item__pic img {
  border: 2px solid #fff;
}
@media only screen and (min-width: 768px) {
  .cowork .saiyo__item__text {
    width: calc(100% - 215px);
  }
}
.cowork .saiyo__item__text p {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .cowork .saiyo__item__text p {
    font-size: 0.9rem;
    line-height: 1.5rem;
  }
}
@media only screen and (min-width: 768px) {
  .cowork .saiyo__item__text p {
    font-size: 0.95rem;
    line-height: 1.6rem;
  }
}
.cowork .saiyo__item__text a {
  text-decoration: underline;
}
.cowork .saiyo__item__name {
  font-weight: 600;
  line-height: 100%;
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .cowork .saiyo__item__name {
    font-size: 1.05rem;
    line-height: 1.5rem;
    margin: 0 0 15px;
  }
}
@media only screen and (min-width: 768px) {
  .cowork .saiyo__item__name {
    font-size: 1.2rem;
    margin: 0 0 18px;
  }
}
.cowork .saiyo__item__profile p {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .cowork .saiyo__item__profile p {
    font-size: 0.9rem;
  }
}
@media only screen and (min-width: 768px) {
  .cowork .saiyo__item__profile p {
    font-size: 0.95rem;
  }
}
.cowork .saiyo__item__date {
  line-height: 100%;
  letter-spacing: 0.05rem;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-weight: 500;
}
@media only screen and (max-width: 767px) {
  .cowork .saiyo__item__date {
    margin: 10px 0 0;
    font-size: 0.85rem;
    line-height: 1.3rem;
    text-align: center;
  }
}
@media only screen and (min-width: 768px) {
  .cowork .saiyo__item__date {
    margin: 10px 0 0;
    font-size: 0.9rem;
    line-height: 1.5rem;
  }
}
.cowork .saiyo__item__date span {
  display: block;
  letter-spacing: 0.1rem;
  color: #ccc;
}
@media only screen and (max-width: 767px) {
  .cowork .saiyo .modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 9999;
  }
}
@media only screen and (min-width: 768px) {
  .cowork .saiyo .modal__bg, .cowork .saiyo .modal__close {
    display: none;
  }
}
@media only screen and (max-width: 767px) {
  .cowork .saiyo .modal__bg {
    position: absolute;
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.7);
  }
}
@media only screen and (max-width: 767px) {
  .cowork .saiyo .modal__body {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 85%;
    box-sizing: border-box;
    padding: 25px 13px 25px 0;
    background: #000;
    border: 2px solid #fff;
    z-index: 9999;
  }
}
@media only screen and (max-width: 767px) {
  .cowork .saiyo .modal__inner {
    box-sizing: border-box;
    max-height: 68vh;
    overflow: auto;
    padding: 30px 20px 30px 30px;
  }
  .cowork .saiyo .modal__inner::-webkit-scrollbar {
    width: 6px;
  }
  .cowork .saiyo .modal__inner::-webkit-scrollbar-thumb {
    background-color: #666;
    border-radius: 100px;
  }
}
@media only screen and (max-width: 767px) {
  .cowork .saiyo .modal__close-btn {
    background: #000;
    border: 2px solid #fff;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    position: absolute;
    top: -21px;
    right: -20px;
    z-index: 9999;
  }
}
@media only screen and (min-width: 768px) {
  .cowork .saiyo .modal__close-btn {
    display: none;
  }
}
.cowork .saiyo .modal__close-btn span::before, .cowork .saiyo .modal__close-btn span::after {
  content: "";
  display: block;
  width: 17px;
  height: 3px;
  background: #fff;
  position: absolute;
  top: 16px;
}
.cowork .saiyo .modal__close-btn span::before {
  transform: rotate(45deg);
  left: 9px;
}
.cowork .saiyo .modal__close-btn span::after {
  transform: rotate(-45deg);
  right: 9px;
}

@media only screen and (max-width: 767px) {
  .tameshiyomi h2 {
    margin: 0;
  }
}
.tameshiyomi__flex {
  display: flex;
}
@media only screen and (min-width: 1000px) {
  .tameshiyomi__flex img {
    width: 425px;
  }
}
@media only screen and (max-width: 767px) {
  .tameshiyomi__flex img {
    width: 185px;
  }
}

@media only screen and (min-width: 768px) {
  .tameshiyomi-list {
    min-height: 1000px;
  }
}
@media only screen and (max-width: 767px) {
  .tameshiyomi-list__sptitle h2 {
    font-size: 1em;
  }
}
@media only screen and (min-width: 768px) {
  .tameshiyomi-list__sptitle h2 {
    display: none;
  }
}
@media only screen and (max-width: 767px) {
  .tameshiyomi-list__pctitle h2 {
    display: none;
  }
  .tameshiyomi-list__pctitle h3 {
    text-align: right;
    font-size: 0.9em;
  }
}
.tameshiyomi-list__item {
  position: relative;
  cursor: pointer;
}
@media only screen and (max-width: 767px) {
  .tameshiyomi-list__item {
    margin: 0 0 50px;
  }
  .tameshiyomi-list__item:first-child {
    margin: 50px 0;
  }
}
@media only screen and (min-width: 768px) {
  .tameshiyomi-list__item {
    margin: 0 0 35px;
  }
  .tameshiyomi-list__item:hover .tameshiyomi-list__pic img {
    transform: scale(1.05);
  }
  .tameshiyomi-list__item:hover .tameshiyomi-list__detail {
    opacity: 0.8;
  }
}
.tameshiyomi-list__item:last-child {
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .tameshiyomi-list__item[data-group=review] .tameshiyomi-list__ttl {
    display: none;
  }
}
@media only screen and (min-width: 768px) {
  .tameshiyomi-list__inner {
    display: flex;
  }
}
.tameshiyomi-list__pic {
  overflow: hidden;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .tameshiyomi-list__pic {
    margin: 0;
  }
}
@media only screen and (min-width: 768px) {
  .tameshiyomi-list__pic {
    width: 48%;
  }
}
.tameshiyomi-list__pic img {
  transition: 0.4s;
}
.tameshiyomi-list__detail {
  box-sizing: border-box;
}
@media only screen and (min-width: 768px) {
  .tameshiyomi-list__detail {
    width: 52%;
    padding: 3px 0 5px 30px;
    transition: 0.4s;
    display: flex;
    flex-direction: column;
  }
}
.tameshiyomi-list__ttl {
  font-weight: 500;
  letter-spacing: 0.1rem;
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .tameshiyomi-list__ttl {
    font-size: 1rem;
  }
}
@media only screen and (min-width: 768px) {
  .tameshiyomi-list__ttl {
    font-size: 1.15rem;
  }
}
.tameshiyomi-list__ttl a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.tameshiyomi-list__text p {
  letter-spacing: 0.05rem;
  margin: 0;
  color: #c6c6c6;
}
@media only screen and (max-width: 767px) {
  .tameshiyomi-list__text p {
    font-size: 0.85rem;
    line-height: 1.45rem;
    margin: 8px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .tameshiyomi-list__text p {
    font-size: 0.95rem;
    line-height: 1.7rem;
    margin: 15px 0 0;
  }
}
.tameshiyomi-list .state {
  font-family: "Poppins";
  color: #bbb;
  display: flex;
  justify-content: flex-end;
  letter-spacing: 0.1rem;
}
@media only screen and (max-width: 767px) {
  .tameshiyomi-list .state {
    margin: 25px 0 0;
    font-size: 0.75rem;
  }
}
@media only screen and (min-width: 768px) {
  .tameshiyomi-list .state {
    margin: auto 0 0;
    font-size: 0.8rem;
  }
}
.tameshiyomi-list .state .category::after {
  content: "";
  width: 1px;
  height: 10px;
  background-color: #999;
  display: inline-block;
}
@media only screen and (max-width: 767px) {
  .tameshiyomi-list .state .category::after {
    margin: 0 11px 0 9px;
  }
}
@media only screen and (min-width: 768px) {
  .tameshiyomi-list .state .category::after {
    margin: 0 14px;
  }
}

.sakkaouen {
  padding: 25px 0;
  margin: 50px auto;
  border-radius: 5px;
  background-position: top;
  background-size: cover;
  color: black;
  transition: 0.2s;
  position: relative;
}
.sakkaouen::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #ffffff;
  transition: 0.3s;
}
.sakkaouen:hover {
  color: #ffffff;
}
.sakkaouen:hover::after {
  background-color: rgba(212, 212, 212, 0);
}
.sakkaouen a {
  color: #000;
  transition: 0.2s;
}
.sakkaouen a:hover {
  color: #ffffff;
}
.sakkaouen__flex {
  position: relative;
  z-index: 10;
  max-width: fit-content;
  margin: 0 auto;
}
@media only screen and (min-width: 1000px) {
  .sakkaouen__flex {
    display: flex;
  }
}
.sakkaouen__prof {
  margin: auto 50px;
}
@media only screen and (max-width: 767px) {
  .sakkaouen__icon {
    text-align: center;
  }
}
.sakkaouen__icon img {
  border-radius: 50%;
  max-width: 200px;
}
.sakkaouen__bottom {
  text-align: center;
  max-width: fit-content;
  margin: 10px auto;
}

@media only screen and (max-width: 767px) {
  .ouen__comic__link {
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 768px) {
  .ouen__comic__link {
    margin: 50px auto;
  }
}
.ouen__comic__link img {
  transition: 0.2s;
}
.ouen__comic__link img:hover {
  opacity: 0.5;
}
.ouen .link {
  border: 1px solid #999;
  text-align: center;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .ouen .link {
    height: 70px;
  }
}
@media only screen and (min-width: 768px) {
  .ouen .link {
    height: 65px;
    transition: 0.3s;
  }
  .ouen .link:hover {
    background: #f5f5f5;
  }
}
.ouen .link a {
  color: #000;
  font-weight: 600;
  display: block;
  width: 100%;
  letter-spacing: 0.05rem;
}
@media only screen and (min-width: 768px) {
  .ouen .link a {
    font-size: 1.15rem;
  }
}
.ouen .link a::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.share-area {
  max-width: fit-content;
}
@media only screen and (max-width: 767px) {
  .share-area {
    margin: 0 auto;
  }
}
@media only screen and (min-width: 768px) {
  .share-area {
    margin: 0 auto;
  }
}
.share-area p {
  font-weight: 500;
  position: relative;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .share-area p {
    font-size: 0.7rem;
    margin: 0 15px 0 0;
    width: 122px;
    height: 20px;
    line-height: 19px;
  }
}
@media only screen and (min-width: 768px) {
  .share-area p {
    font-size: 2em;
    margin: 0 20px 0 0;
    width: 250px;
    height: 21px;
  }
}
.share-area .share {
  background: #c72626;
  border-radius: 50px;
  text-align: center;
  padding: 0 10px;
}
@media only screen and (max-width: 767px) {
  .share-area .share {
    width: fit-content;
    height: 38px;
    line-height: 38px;
  }
}
@media only screen and (min-width: 768px) {
  .share-area .share {
    width: fit-content;
    height: 38px;
    line-height: 38px;
    transition: 0.3s;
  }
  .share-area .share:hover {
    background: #dc4b4b;
  }
}
.share-area .share a {
  color: #fff;
  font-size: 1.5rem;
  display: block;
  width: 100%;
}
.share-area .share a::before {
  font-family: "Font Awesome 6 Brands";
  font-weight: 900;
  color: #fff;
  content: "\e61b";
  margin: 0 4px 0 0;
}

.member_bonus {
  text-align: center;
  margin: 30px 0 0 0;
  padding: 0 0 30px 0;
}
.member_bonus__title {
  margin: 0 0 0 0;
  font-weight: bold;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 11px 0 8px;
}
@media only screen and (min-width: 1000px) {
  .member_bonus__title {
    font-size: 1rem;
  }
}
@media only screen and (max-width: 767px) {
  .member_bonus__title {
    font-size: 0.9rem;
  }
}
.member_bonus__leed {
  margin: 7px 0 0 0;
  font-size: 0.85rem;
  line-height: 150%;
}
.member_bonus__info {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
  align-content: flex-start;
}
.member_bonus__info li {
  width: calc(33.3333333333% - 10px);
  border: 1px solid #eee;
  box-shadow: 0 0 8px #eee;
  padding: 5px;
  box-sizing: border-box;
  margin: 15px 0 0 0;
  font-size: 0.85rem;
  line-height: 150%;
}
.member_bonus__info li p {
  margin: 5px 10px;
}
.member_bonus__info li img {
  width: 100%;
  max-width: 100%;
}

.douga__list {
  margin: 25px auto 0;
  width: 100%;
  max-width: fit-content;
  position: relative;
  overflow: hidden;
}
.douga__block {
  width: 100%;
  max-width: 200px;
  margin: auto;
  border: 10px solid #2e271f;
  padding: 5px;
}
.douga__block video {
  width: 100%;
  height: auto;
  background: #000;
  margin: 0;
  padding: 0;
  display: block;
}
.douga__block iframe {
  width: 100%;
  height: 100%;
  vertical-align: bottom;
}

.bohemiapro {
  background-color: #fff;
  margin: 0 auto;
  max-width: fit-content;
  padding: 10px 1px;
  border-radius: 10px;
  transition: 0.2s;
}
.bohemiapro:hover {
  background-color: #e0e0e0;
}
.bohemiapro a {
  padding: 30px 10px 10px;
}

.bohemiaproshinjin {
  width: 450px;
  height: 60px;
  line-height: 60px;
  font-size: 1.1rem;
  background-color: #fff;
  margin-bottom: 25px;
  text-align: center;
  font-weight: 600;
  letter-spacing: 0.1rem;
  border-radius: 5px;
  position: relative;
  transition: 0.2s;
}
.bohemiaproshinjin:hover {
  background-color: #e0e0e0;
}
.bohemiaproshinjin a {
  padding: 30px 10px 10px;
}
.bohemiaproshinjin img {
  margin-bottom: 5px;
}

.bohemiaprotext {
  position: relative;
  z-index: 50;
}
.bohemiaprotext p {
  text-align: left;
  font-size: 0.8rem;
}

.tameshimodal {
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0);
  z-index: 1500;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tameshimodal video {
  max-width: 100%;
  max-height: 100%;
  margin: auto;
  display: block;
  position: relative;
  z-index: 5000;
}
@media only screen and (max-width: 767px) {
  .tameshimodal video {
    top: 50px;
  }
}

@media only screen and (min-width: 1000px) {
  .close-btn {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.781);
    transition: 0.2s;
    cursor: pointer;
  }
  .close-btn:hover {
    background-color: rgba(0, 0, 0, 0.623);
  }
}
@media only screen and (max-width: 767px) {
  .close-btn {
    position: absolute;
    text-align: right;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    color: #fff;
    text-shadow: rgb(0, 0, 0) 3px 0px 0px, rgb(0, 0, 0) 2.83487px 0.981584px 0px, rgb(0, 0, 0) 2.35766px 1.85511px 0px, rgb(0, 0, 0) 1.62091px 2.52441px 0px, rgb(0, 0, 0) 0.705713px 2.91581px 0px, rgb(0, 0, 0) -0.287171px 2.98622px 0px, rgb(0, 0, 0) -1.24844px 2.72789px 0px, rgb(0, 0, 0) -2.07227px 2.16926px 0px, rgb(0, 0, 0) -2.66798px 1.37182px 0px, rgb(0, 0, 0) -2.96998px 0.42336px 0px, rgb(0, 0, 0) -2.94502px -0.571704px 0px, rgb(0, 0, 0) -2.59586px -1.50383px 0px, rgb(0, 0, 0) -1.96093px -2.27041px 0px, rgb(0, 0, 0) -1.11013px -2.78704px 0px, rgb(0, 0, 0) -0.137119px -2.99686px 0px, rgb(0, 0, 0) 0.850987px -2.87677px 0px, rgb(0, 0, 0) 1.74541px -2.43999px 0px, rgb(0, 0, 0) 2.44769px -1.73459px 0px, rgb(0, 0, 0) 2.88051px -0.838247px 0px;
    background-color: rgba(0, 0, 0, 0.781);
    cursor: pointer;
  }
  .close-btn P {
    font-size: 30px;
    margin: 0;
  }
}

.foot {
  background: #0A1945;
}
@media only screen and (max-width: 767px) {
  .foot {
    padding: 50px 30px;
  }
}
@media only screen and (min-width: 768px) {
  .foot {
    padding: 60px 0;
  }
}
@media only screen and (min-width: 768px) {
  .foot__content {
    max-width: 1200px;
    width: calc(100% - 40px);
    margin: 0 auto;
  }
}
.foot__nav ul {
  list-style: none;
  padding: 0;
  display: flex;
  justify-content: center;
}
@media only screen and (max-width: 767px) {
  .foot__nav ul {
    font-size: 0.8rem;
    margin: 0 0 20px;
    flex-wrap: wrap;
  }
}
@media only screen and (min-width: 768px) {
  .foot__nav ul {
    font-size: 0.85rem;
    margin: 0 0 30px;
  }
}
.foot__nav ul li {
  font-weight: 500;
}
@media only screen and (max-width: 767px) {
  .foot__nav ul li {
    margin: 0 10px 7px;
  }
}
@media only screen and (min-width: 768px) {
  .foot__nav ul li {
    margin: 0 20px;
  }
}
.foot__logo {
  text-align: center;
  margin: 0 0 20px;
}
@media only screen and (max-width: 767px) {
  .foot__logo img {
    width: 150px;
  }
}
@media only screen and (min-width: 768px) {
  .foot__logo img {
    width: 170px;
  }
  .foot__logo img:hover {
    transition: 0.3s;
    opacity: 0.8;
  }
}
.foot__copyright {
  text-align: center;
  margin: 0;
  color: #fff;
}
@media only screen and (max-width: 767px) {
  .foot__copyright {
    font-size: 0.65rem;
    line-height: 0.75rem;
  }
}
@media only screen and (min-width: 768px) {
  .foot__copyright {
    font-size: 0.7rem;
    line-height: 0.8rem;
  }
}
.foot__copyright span {
  display: block;
  margin: 0 0 5px;
}

.fixed {
  overflow-y: hidden;
}

.is-hide {
  display: none;
}

@media only screen and (min-width: 768px) {
  .sponly {
    display: none;
  }
}

@media only screen and (max-width: 767px) {
  .pconly {
    display: none;
  }
}

@media only screen and (max-width: 767px) {
  .pc17only {
    display: none;
  }
}
@media only screen and (min-width: 768px) {
  .pc17only {
    display: none;
  }
}
@media only screen and (min-width: 1755px) {
  .pc17only {
    display: block;
  }
}

.global_head {
  margin: 0;
  position: relative;
  z-index: 990;
}

footer {
  position: relative;
  z-index: 99;
}

.hidden {
  position: fixed;
  z-index: 100000;
  top: 0;
  text-align: center;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.hidden__bg {
  animation-name: bgzoom;
  animation-duration: 0.6s;
  background-color: rgba(46, 46, 46, 0.925);
  height: 100vh;
  width: auto;
}
.hidden img {
  animation-name: zoom;
  animation-duration: 0.6s;
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
@media only screen and (min-width: 1000px) {
  .hidden img {
    max-height: fit-content;
    height: 90%;
    width: auto;
  }
}
@keyframes zoom {
  from {
    transform: scale(0.1);
  }
  to {
    transform: scale(1);
  }
}
@keyframes zoomout {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(0.1);
  }
}
@keyframes bgzoom {
  from {
    background-color: rgba(255, 255, 255, 0);
  }
  to {
    background-color: rgba(46, 46, 46, 0.925);
  }
}
.yuryo {
  color: #fff;
  background: #111;
}
@media only screen and (max-width: 767px) {
  .yuryo {
    order: 1;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo {
    max-width: 1200px;
    margin: 0 auto;
  }
}
.yuryo__content {
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .yuryo__content {
    padding: 20px 10px 10px;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__content {
    padding: 45px 40px;
    line-height: 1.8rem;
  }
}
.yuryo__content h1 {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .yuryo__content h1 {
    font-size: 26px;
    margin: 0 0 30px;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__content h1 {
    margin: 0 0 40px;
    letter-spacing: 0.2rem;
  }
}
.yuryo__content h1 p {
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .yuryo__content h1 p {
    font-size: 16px;
    margin: 3px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__content h1 p {
    font-size: 20px;
    margin: 15px 0 0;
  }
}
.yuryo__content .text {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .yuryo__content .text {
    letter-spacing: 0.05rem;
    line-height: 1.7;
    margin: 0;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__content .text {
    font-size: 19px;
    line-height: 1.7;
    letter-spacing: 0.08rem;
  }
}
.yuryo__content .text span {
  color: #df1525;
  font-weight: 600;
}
.yuryo__content .price {
  gap: 0 30px;
}
@media only screen and (max-width: 767px) {
  .yuryo__content .price {
    margin: 20px 0;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__content .price {
    display: flex;
    margin: 40px 0;
  }
}
.yuryo__content .price__item {
  border: 1px solid #555;
  position: relative;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}
@media only screen and (max-width: 767px) {
  .yuryo__content .price__item {
    padding: 20px 20px 18px;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__content .price__item {
    width: 49%;
    padding: 30px 40px;
  }
}
@media only screen and (max-width: 767px) {
  .yuryo__content .price__item:first-child {
    margin: 0 0 15px;
  }
}
.yuryo__content .price h2 {
  text-align: center;
  background-color: #333;
  box-sizing: border-box;
}
@media only screen and (max-width: 767px) {
  .yuryo__content .price h2 {
    font-size: 18px;
    margin: 0 0 17px;
    padding: 6px 10px;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__content .price h2 {
    font-size: 20px;
    margin: 0 0 20px;
    padding: 10px 15px;
  }
}
@media only screen and (min-width: 1000px) {
  .yuryo__content .price h2 {
    font-size: 23px;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__content .price .price__item-text {
    min-height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
.yuryo__content .price p {
  margin: 0;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .yuryo__content .price p {
    line-height: 1.7;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__content .price p {
    font-size: 17px;
    letter-spacing: 0.08rem;
    line-height: 1.7;
  }
}
@media only screen and (min-width: 1000px) {
  .yuryo__content .price p {
    font-size: 19px;
  }
}
.yuryo__content .price p span {
  color: #df1525;
  font-weight: 600;
}
.yuryo__content .matome-gentei {
  position: absolute;
  top: 0;
  right: 0;
  overflow: hidden;
  line-height: 1.2rem;
}
@media only screen and (max-width: 767px) {
  .yuryo__content .matome-gentei {
    width: 160px;
    height: 91px;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__content .matome-gentei {
    width: 90px;
    height: 91px;
  }
}
.yuryo__content .matome-gentei span {
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  background-color: #ce8285;
  color: #fefefe;
  font-weight: 700;
  text-align: center;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .yuryo__content .matome-gentei span {
    font-size: 13px;
    width: 160px;
    height: 20px;
    transform: translate(55px, 17px) rotate(45deg);
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__content .matome-gentei span {
    font-size: 15px;
    width: 200px;
    height: 20px;
    transform: translate(65px, 25px) rotate(45deg);
  }
}
.yuryo__order {
  background-color: #222;
}
@media only screen and (max-width: 767px) {
  .yuryo__order {
    margin: 20px 0 0;
    padding: 30px 15px;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__order {
    display: flex;
    justify-content: center;
    gap: 0 30px;
    margin: 50px 0 0;
    padding: 3%;
  }
}
.yuryo__order .order-btn {
  text-align: center;
  font-weight: 900;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1.3;
  transition: 0.3s;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .yuryo__order .order-btn {
    width: 100%;
    height: 100px;
    font-size: 25px;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__order .order-btn {
    width: 49%;
    height: 140px;
    font-size: 24px;
    padding: 0 15px;
  }
}
@media only screen and (min-width: 1000px) {
  .yuryo__order .order-btn {
    font-size: 33px;
  }
}
.yuryo__order .order-btn a {
  display: block;
}
.yuryo__order .order-btn a::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  content: "";
}
.yuryo__order .order-btn span {
  display: block;
  letter-spacing: 0.1rem;
  font-weight: 600;
}
@media only screen and (max-width: 767px) {
  .yuryo__order .order-btn span {
    font-size: 16px;
    margin: 3px 0 0;
  }
}
@media only screen and (min-width: 768px) {
  .yuryo__order .order-btn span {
    font-size: 20px;
    margin: 5px 0 0;
  }
}
.yuryo__order .order-btn.btn-tantai {
  background-color: #063664;
}
@media only screen and (max-width: 767px) {
  .yuryo__order .order-btn.btn-tantai {
    margin: 0 0 15px;
  }
}
.yuryo__order .order-btn.btn-matome {
  background-color: #6c0706;
}
.yuryo__order .order-btn:hover {
  opacity: 0.7;
}

@media only screen and (max-width: 767px) {
  .purchased {
    order: 1;
  }
}
.purchased__content {
  color: #4eb5da;
  border: 2px solid rgba(78, 181, 218, 0.3);
  background: #252d39;
  box-sizing: border-box;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .purchased__content {
    width: 95%;
    margin: 10px auto 15px;
    padding: 8px 0;
  }
}
@media only screen and (min-width: 768px) {
  .purchased__content {
    width: 100%;
    margin: 20px 0;
    padding: 12px 0;
  }
}
.purchased__content .text {
  font-weight: 600;
  margin: 0;
  letter-spacing: 0.1rem;
  display: inline-block;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .purchased__content .text {
    font-size: 0.9rem;
  }
}
@media only screen and (min-width: 768px) {
  .purchased__content .text {
    font-size: 1rem;
  }
}
.purchased__content .text::before, .purchased__content .text::after {
  content: "";
}
.purchased__content .text::before {
  display: inline-block;
  border-left: 2px solid #4eb5da;
  border-bottom: 2px solid #4eb5da;
  width: 6px;
  height: 3px;
  transform: rotate(-45deg);
  position: relative;
  margin-right: 6px;
}
@media only screen and (max-width: 767px) {
  .purchased__content .text::before {
    top: -3.5px;
  }
}
@media only screen and (min-width: 768px) {
  .purchased__content .text::before {
    top: -4px;
  }
}
.purchased__content .text::after {
  border: 2px solid #4eb5da;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  position: absolute;
  left: -4px;
}
@media only screen and (max-width: 767px) {
  .purchased__content .text::after {
    top: 3px;
  }
}
@media only screen and (min-width: 768px) {
  .purchased__content .text::after {
    top: 4.5px;
  }
}
.purchased__content .text span {
  color: #df1525;
  font-weight: 600;
}/*# sourceMappingURL=style.css.map */