@import url(https://fonts.googleapis.com/css?family=Nunito);
@import url(https://fonts.googleapis.com/css2?family=Rubik&display=swap);
@charset "UTF-8";
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

a {
  text-decoration: none;
  color: #000;
}

ul {
  list-style: none;
}

img {
  vertical-align: middle;
}

html, body {
  -webkit-text-size-adjust: 100%;
     -moz-text-size-adjust: 100%;
          text-size-adjust: 100%;
  font-size: 0.9rem;
  height: 100%;
  font-family: "Noto Sans JP", sans-serif;
}

pre {
  font-family: "Noto Sans JP", sans-serif;
}

.pc-only {
  display: none !important;
}
@media (min-width: 768px) {
  .pc-only {
    display: block !important;
  }
}

.sp-only {
  display: block !important;
}
@media (min-width: 768px) {
  .sp-only {
    display: none !important;
  }
}

.body .gotop {
  position: fixed;
  right: 10px;
  bottom: 10px;
  z-index: 3;
  width: 50px;
  border-radius: 50%;
}
@media (min-width: 768px) {
  .body .gotop {
    right: 20px;
    bottom: 20px;
    width: 70px;
  }
}
.body .gotop img {
  width: 50px;
}
@media (min-width: 768px) {
  .body .gotop img {
    width: 70px;
  }
}
.body .gotop.absolute {
  position: absolute;
}

.loading {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  background-color: #fff;
  z-index: 4;
  display: flex;
  justify-content: center;
  align-items: center;
}
.loading > div {
  display: block;
  border-radius: 50%;
  width: 100px;
  height: 100px;
  margin: 10px auto;
  font-size: 5px;
  position: relative;
  text-indent: -9999em;
  border-top: 10px solid rgba(48, 173, 125, 0.2);
  border-right: 10px solid rgba(48, 173, 125, 0.2);
  border-bottom: 10px solid rgba(48, 173, 125, 0.2);
  border-left: 10px solid #30AD7D;
  transform: translateZ(0);
  -webkit-animation: load 1.1s infinite linear;
  animation: load 1.1s infinite linear;
  padding: 0;
}
.loading > div::after {
  border-radius: 50%;
  width: 40px;
  height: 40px;
}

@-webkit-keyframes loading {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes loading {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes load {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes load {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
a.image:hover {
  opacity: 0.7;
}

.common__wrap {
  max-width: 1083px;
  width: 100%;
  padding: 40px 20px 0;
  margin: 0 auto;
}
@media (min-width: 1100px) {
  .common__wrap {
    padding: 0;
  }
}
.common__wrap.no-pd {
  padding: 10px 0;
}

.content-detail__top, .kankou-keitai__pickup, .kankou-keitai__new-release, .top__visualization-info, .top__all-ranking, .top__new-release, .label, .media-mix, .media-produce, .not-found, .adult-confirm, .news, .to-author, .copyright, .faq, .privacy, .recruit, .company, .author-list, .genre-list, .search-result {
  position: relative;
  overflow: hidden;
}
.content-detail__top::before, .kankou-keitai__pickup::before, .kankou-keitai__new-release::before, .top__visualization-info::before, .top__all-ranking::before, .top__new-release::before, .label::before, .media-mix::before, .media-produce::before, .not-found::before, .adult-confirm::before, .news::before, .to-author::before, .copyright::before, .faq::before, .privacy::before, .recruit::before, .company::before, .author-list::before, .genre-list::before, .search-result::before {
  position: absolute;
  top: 80px;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  content: "";
  background-image: linear-gradient(to top, #ffffff 5%, #e4eded 95%);
  -webkit-clip-path: polygon(0 200px, 100% 0, 100% 100%, 0 100%);
  clip-path: polygon(0 200px, 100% 0, 100% 100%, 0 100%);
}
@media (min-width: 768px) {
  .content-detail__top::before, .kankou-keitai__pickup::before, .kankou-keitai__new-release::before, .top__visualization-info::before, .top__all-ranking::before, .top__new-release::before, .label::before, .media-mix::before, .media-produce::before, .not-found::before, .adult-confirm::before, .news::before, .to-author::before, .copyright::before, .faq::before, .privacy::before, .recruit::before, .company::before, .author-list::before, .genre-list::before, .search-result::before {
    top: 0;
    -webkit-clip-path: polygon(0 250px, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 250px, 100% 0, 100% 100%, 0 100%);
    width: 3000px;
  }
}

.content-detail__try__item .image img, .content-detail__same-author__item .image img, .kankou-keitai__pickup__item .image img, .kankou-keitai__new-release__item .image img, .top__recommend__item .image img, .top__all-ranking__item .image img, .top__new-release__item .image img {
  box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.1);
}

.search-result__inner {
  position: relative;
  z-index: 2;
  display: flex;
  margin-top: 20px;
  flex-direction: column;
}
@media (min-width: 768px) {
  .search-result__inner {
    flex-direction: row;
    align-items: flex-start;
    margin-top: 80px;
  }
}
.search-result__inner .btn-wrap {
  display: flex;
  align-items: center;
}
.search-result__inner .btn-wrap button {
  cursor: pointer;
  border: none;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  width: 70px;
}
.search-result__inner .btn-wrap button img {
  width: 13px;
  margin-right: 5px;
}
.search-result__inner .btn-wrap button img:nth-child(2) {
  display: none;
}
.search-result__inner .btn-wrap button p {
  font-size: 12px;
  color: #989898;
}
.search-result__inner .btn-wrap button.active p {
  color: #30AD7D;
}
.search-result__inner .btn-wrap button.active img:nth-child(1) {
  display: none;
}
.search-result__inner .btn-wrap button.active img:nth-child(2) {
  display: block;
}
.search-result__inner .btn-wrap hr {
  height: 30px;
  background-color: #EFF0F2;
  border: none;
  width: 2px;
}
.search-result__content {
  width: 100%;
  margin-top: 30px;
}
@media (min-width: 768px) {
  .search-result__content {
    margin-top: 0;
  }
}
.search-result__content .btn-area {
  display: flex;
  justify-content: flex-end;
}
.search-result__content .sort-wrap {
  display: flex;
  align-items: center;
  color: #2D313B;
}
@media (min-width: 768px) {
  .search-result__content .sort-wrap {
    margin-right: 20px;
  }
}
.search-result__content .sort-wrap p {
  margin-right: 10px;
}
.search-result__content .sort-wrap select {
  cursor: pointer;
  border: 2px solid #EFF0F2;
  padding: 0 7px;
  width: 152px;
  height: 34px;
}
.search-result__content .sort-wrap select option {
  font-size: 12px;
}
.search-result__content .result-area {
  display: flex;
  flex-direction: column;
  margin-top: 30px;
}
.search-result__content .result-area .content_loading {
  display: block;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  margin: 10px auto;
  font-size: 5px;
  position: relative;
  text-indent: -9999em;
  border-top: 5px solid rgba(48, 173, 125, 0.2);
  border-right: 5px solid rgba(48, 173, 125, 0.2);
  border-bottom: 5px solid rgba(48, 173, 125, 0.2);
  border-left: 5px solid #30AD7D;
  transform: translateZ(0);
  -webkit-animation: load 1.1s infinite linear;
  animation: load 1.1s infinite linear;
  padding: 0;
}
.search-result__content .result-area .content_loading::after {
  border-radius: 50%;
  width: 40px;
  height: 40px;
}
.search-result__content .result-area__list {
  display: none;
  width: 100vw;
  margin-left: -20px;
}
@media (min-width: 768px) {
  .search-result__content .result-area__list {
    width: 100%;
  }
}
.search-result__content .result-area__list.show {
  display: block;
}
.search-result__content .result-area__list-inner {
  display: flex;
  flex-direction: column;
}
.search-result__content .result-area__list-item {
  width: 100%;
  border: 2px solid #EFF0F2;
  display: flex;
  background-color: #fff;
  padding: 20px;
}
@media (min-width: 768px) {
  .search-result__content .result-area__list-item {
    margin-bottom: 20px;
  }
}
.search-result__content .result-area__list-item .image {
  margin-right: 20px;
}
.search-result__content .result-area__list-item .image img {
  width: 130px;
}
.search-result__content .result-area__list-item .links {
  margin-bottom: 10px;
}
.search-result__content .result-area__list-item .text h3 {
  font-size: 16px;
}
@media (min-width: 768px) {
  .search-result__content .result-area__list-item .text h3 {
    font-size: 20px;
  }
}
.search-result__content .result-area__list-item .text > p {
  font-size: 13px;
  line-height: 1.7;
  margin-top: 15px;
}
.search-result__content .result-area__list-item .text span {
  font-size: 12px;
}
.search-result__content .result-area__list-item .text .bottom {
  margin-top: 15px;
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .search-result__content .result-area__list-item .text .bottom {
    flex-direction: row;
  }
}
.search-result__content .result-area__list-item .text .bottom p {
  line-height: 1.7;
  margin-right: 20px;
}
.search-result__content .result-area__list-item .text .introduction400 {
  max-height: 110px;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.search-result__content .result-area__list .result-area__more {
  width: calc(100% - 40px);
  margin: 30px auto;
}
@media (min-width: 768px) {
  .search-result__content .result-area__list .result-area__more {
    width: 100%;
    margin: 0;
  }
}
.search-result__content .result-area__thumb {
  display: none;
}
.search-result__content .result-area__thumb.show {
  display: block;
}
.search-result__content .result-area__thumb-inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .search-result__content .result-area__thumb-inner {
    justify-content: flex-start;
  }
}
.search-result__content .result-area__thumb-item {
  display: flex;
  flex-direction: column;
  width: calc((100% - 30px) / 2);
  margin-bottom: 20px;
}
.search-result__content .result-area__thumb-item:not(:nth-child(2n)) {
  margin-right: 20px;
}
@media (min-width: 992px) {
  .search-result__content .result-area__thumb-item {
    width: calc((100% - 60px) / 4);
    margin-bottom: 40px;
  }
  .search-result__content .result-area__thumb-item:not(:nth-child(2n)) {
    margin-right: 0;
  }
  .search-result__content .result-area__thumb-item:not(:nth-child(4n)) {
    margin-right: 20px;
  }
}
@media (min-width: 1200px) {
  .search-result__content .result-area__thumb-item {
    width: calc((100% - 140px) / 5);
    margin-bottom: 40px;
  }
  .search-result__content .result-area__thumb-item:not(:nth-child(4n)) {
    margin-right: 0;
  }
  .search-result__content .result-area__thumb-item:not(:nth-child(5n)) {
    margin-right: 32px;
  }
}
.search-result__content .result-area__thumb-item .image img {
  width: 100%;
}
.search-result__content .result-area__more {
  width: 100%;
  background-color: #E9F2F2;
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  cursor: pointer;
  height: 50px;
}
.search-result__content .result-area__more p {
  font-size: 16px;
}
.search-result__content .result-area__more img {
  width: 20px;
  margin-right: 10px;
}
.search-result__content .result-area__more:hover p {
  color: #30AD7D;
}
@media (min-width: 768px) {
  .search-result__content .result-area__more {
    height: 60px;
  }
}

.calendar {
  position: relative;
}
.calendar::before {
  position: absolute;
  top: 80px;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  content: "";
  background-image: linear-gradient(to top, #ffffff 5%, #e4eded 95%);
  -webkit-clip-path: polygon(0 200px, 100% 0, 100% 100%, 0 100%);
  clip-path: polygon(0 200px, 100% 0, 100% 100%, 0 100%);
}
@media (min-width: 768px) {
  .calendar::before {
    top: 0;
    -webkit-clip-path: polygon(0 250px, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 250px, 100% 0, 100% 100%, 0 100%);
  }
}
.calendar h2 {
  font-size: 16px;
}
@media (min-width: 768px) {
  .calendar h2 {
    font-size: 20px;
  }
}
.calendar__wrap {
  position: -webkit-sticky;
  position: sticky;
  top: 25px;
  z-index: 3;
  background: #fff;
}
@media (min-width: 768px) {
  .calendar__wrap {
    padding-top: 0;
    position: static;
    background: transparent;
  }
}
.calendar__inner {
  position: relative;
  z-index: 1;
}
@media (min-width: 768px) {
  .calendar__inner {
    flex-direction: row;
    align-items: flex-start;
    margin-top: 40px;
  }
}
.calendar__inner .head {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .calendar__inner .head {
    flex-direction: row;
    justify-content: space-between;
  }
}
.calendar__inner .head .wrap {
  display: flex;
  flex-direction: row;
  width: 100vw;
  background: #fff;
  border-top: 2px solid #EFF0F2;
  border-bottom: 2px solid #EFF0F2;
  margin-top: 20px;
  margin-left: -20px;
}
@media (min-width: 768px) {
  .calendar__inner .head .wrap {
    width: auto;
    flex-direction: column;
    border: none;
    background: transparent;
    margin: 0;
  }
}
.calendar__inner .head .month-area {
  display: flex;
  width: 100%;
}
@media (min-width: 768px) {
  .calendar__inner .head .month-area {
    width: auto;
  }
}
.calendar__inner .head .month-area button {
  width: 100%;
  border: none;
  background: none;
  cursor: pointer;
}
.calendar__inner .head .month-area button:hover {
  background-color: #30AD7D;
}
.calendar__inner .head .month-area button:hover p {
  color: #fff;
}
@media (min-width: 768px) {
  .calendar__inner .head .month-area button {
    border: 2px solid #E9F2F2;
    padding: 15px 35px;
  }
}
.calendar__inner .head .month-area button p {
  font-size: 12px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .calendar__inner .head .month-area button:not(:last-child) {
    margin-right: 10px;
  }
}
.calendar__inner .head .month-area button.active {
  background-color: #30AD7D;
}
.calendar__inner .head .month-area button.active p {
  color: #fff;
}
.calendar__inner .head .btn-area {
  display: flex;
  justify-content: flex-end;
}
@media (min-width: 768px) {
  .calendar__inner .head .btn-area {
    margin-top: 15px;
  }
}
.calendar__inner .head .btn-wrap {
  display: flex;
  align-items: center;
}
.calendar__inner .head .btn-wrap button {
  cursor: pointer;
  border: none;
  background-color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  width: 70px;
}
.calendar__inner .head .btn-wrap button img {
  width: 13px;
  margin-right: 5px;
}
.calendar__inner .head .btn-wrap button img:nth-child(2) {
  display: none;
}
.calendar__inner .head .btn-wrap button p {
  font-size: 12px;
  color: #989898;
}
.calendar__inner .head .btn-wrap button.active p {
  color: #30AD7D;
}
.calendar__inner .head .btn-wrap button.active img:nth-child(1) {
  display: none;
}
.calendar__inner .head .btn-wrap button.active img:nth-child(2) {
  display: block;
}
.calendar__inner .head .btn-wrap hr {
  height: 70%;
  background-color: #EFF0F2;
  border: none;
  width: 2px;
}
.calendar__content {
  width: 100%;
  margin-top: 30px;
  max-width: 1083px;
  width: 100%;
  margin: 40px auto 0;
}
@media (min-width: 768px) {
  .calendar__content {
    padding: 40px 20px 0;
    margin-top: 0;
  }
}
@media (min-width: 1100px) {
  .calendar__content {
    padding: 0;
  }
}
.calendar__content .holiday-name {
  font-size: 14px;
  color: #DD4747;
}
@media (min-width: 768px) {
  .calendar__content .holiday-name {
    font-size: 16px;
  }
}
.calendar__content .result-area {
  margin-top: 0;
}
@media (min-width: 768px) {
  .calendar__content .result-area {
    margin-top: 30px;
  }
}
.calendar__content .result-area .inner {
  background-color: #fff;
}
.calendar__content .result-area .block {
  border-bottom: 1px solid #EFF0F2;
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .calendar__content .result-area .block {
    padding: 20px 15px;
    flex-direction: row;
  }
}
.calendar__content .result-area .date {
  width: 100%;
  position: -webkit-sticky;
  position: sticky;
  top: 150px;
  z-index: 2;
  background: #EFF0F2;
  padding: 8px 0;
}
@media (min-width: 768px) {
  .calendar__content .result-area .date {
    width: 12%;
    position: static;
    top: 0;
    background: transparent;
    padding: 0;
  }
}
.calendar__content .result-area .date p {
  font-size: 12px;
  top: 160px;
  position: -webkit-sticky;
  position: sticky;
  z-index: 2;
  text-align: center;
}
@media (min-width: 768px) {
  .calendar__content .result-area .date p {
    text-align: left;
    font-size: 16px;
    top: 20px;
  }
}
.calendar__content .result-area .date p.blue {
  color: #3180FF;
}
.calendar__content .result-area .date p.red {
  color: #DD4747;
}
.calendar__content .result-area .content {
  display: none;
  width: 100%;
  padding: 15px 20px;
}
@media (min-width: 768px) {
  .calendar__content .result-area .content {
    width: 88%;
    padding: 0;
  }
}
.calendar__content .result-area .content.content_loading {
  display: block;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  margin: 10px auto;
  font-size: 5px;
  position: relative;
  text-indent: -9999em;
  border-top: 5px solid rgba(48, 173, 125, 0.2);
  border-right: 5px solid rgba(48, 173, 125, 0.2);
  border-bottom: 5px solid rgba(48, 173, 125, 0.2);
  border-left: 5px solid #30AD7D;
  transform: translateZ(0);
  -webkit-animation: load 1.1s infinite linear;
  animation: load 1.1s infinite linear;
  padding: 0;
}
.calendar__content .result-area .content.content_loading::after {
  border-radius: 50%;
  width: 40px;
  height: 40px;
}
.calendar__content .result-area .content.show {
  display: block;
}
.calendar__content .result-area .content .flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .calendar__content .result-area .content .flex {
    justify-content: flex-start;
  }
}

.genre-list__inner {
  margin-top: 35px;
  min-height: 400px;
}
.genre-list__inner h2 {
  font-size: 16px;
}
@media (min-width: 768px) {
  .genre-list__inner h2 {
    font-size: 20px;
  }
}
.genre-list .list-area {
  margin-top: 35px;
  display: flex;
  flex-wrap: wrap;
  position: relative;
  z-index: 2;
}
.genre-list .list-area a {
  display: inline-block;
  border: 1px solid #EFF0F2;
  padding: 5px 15px;
  border-radius: 30px;
  background-color: #fff;
  color: #2D313B;
  font-size: 12px;
  margin: 0 10px 10px 0;
}
.genre-list .list-area a:hover {
  border: 1px solid #30AD7D;
  color: #30AD7D;
}

.author-list h2 {
  margin-top: 25px;
  font-size: 16px;
}
@media (min-width: 768px) {
  .author-list h2 {
    margin-top: 35px;
    font-size: 20px;
  }
}
.author-list__inner {
  position: relative;
  z-index: 2;
  display: flex;
  /*margin-top: px;*/
  flex-direction: column;
}
@media (min-width: 768px) {
  .author-list__inner {
    flex-direction: row;
    align-items: flex-start;
    margin-top: 15px;
  }
}
@media (min-width: 768px) {
  .author-list__nav {
    width: 100%;
    max-width: 220px;
    margin-right: 50px;
  }
}
.author-list .filter-content {
  padding: 20px 15px 15px !important;
}
.author-list .filter-content .input {
  width: 100%;
}
.author-list .filter-content > div {
  display: flex;
  margin-top: 8px;
}
.author-list .filter-content > div:first-of-type {
  margin-top: 0;
}
.author-list .filter-content > div button {
  width: calc((100% - 20px) / 5);
  height: 30px;
  margin-right: 5px;
  border: 1px solid #EFF0F2;
  border-radius: 6px;
  background: #fff;
}
@media (min-width: 768px) {
  .author-list .filter-content > div button {
    width: 34px;
  }
}
.author-list .filter-content > div button:last-of-type {
  margin-right: 0;
}
.author-list .filter-content > div button:hover {
  cursor: pointer;
}
.author-list .filter-content > div button.active {
  color: #fff;
  background: #30AD7D;
}
.author-list__content {
  width: 100%;
  min-height: 600px;
  margin-top: 30px;
}
@media (min-width: 768px) {
  .author-list__content {
    min-height: 100%;
    margin-top: 0;
  }
}
.author-list__content > p {
  font-size: 16px;
}
.author-list__content .list-area {
  margin-top: 23px;
}
.author-list__content .list-area__thumb-item {
  display: block;
  width: 100%;
  margin-top: 10px;
  padding-left: 32px;
  line-height: 40px;
  font-size: 14px;
  border-top: 1px solid #EFF0F2;
  border-bottom: 1px solid #EFF0F2;
  background: #fff;
  position: relative;
}
.author-list__content .list-area__thumb-item .slash {
  padding: 0 12px;
}
.author-list__content .list-area__thumb-item:hover {
  color: #30AD7D;
  border-top: 1px solid #30AD7D;
  border-bottom: 1px solid #30AD7D;
}
.author-list__content .list-area__thumb-item:first-of-type {
  margin-top: 0;
}
.author-list__content .list-area__thumb-item::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  position: absolute;
  top: 50%;
  left: 15px;
  transform: translateY(-50%);
  background-image: url(/img/icon/icon_triangle.svg) !important;
}

.company .common__wrap > h2 {
  margin-top: 13px;
  font-size: 16px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .company .common__wrap > h2 {
    margin-top: 35px;
    font-size: 20px;
  }
}
.company__inner {
  position: relative;
  z-index: 2;
  margin-top: 20px;
}
@media (min-width: 768px) {
  .company__inner {
    margin-top: 25px;
  }
}
.company__about p {
  font-size: 13px;
  line-height: 1.85;
  color: #000;
}
@media (min-width: 768px) {
  .company__about p {
    font-size: 14px;
    line-height: 2;
  }
}
.company__about .gmap {
  background-color: #30AD7D;
  padding: 4px 5px;
  margin-left: 10px;
  color: #fff;
  border-radius: 5px;
  font-weight: bold;
  font-size: 14px;
}
.company__about_map {
  margin-top: 30px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 820px;
}
@media (min-width: 768px) {
  .company__about_map {
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-end;
  }
}
@media (min-width: 768px) {
  .company__about_map .image {
    margin-right: 20px;
  }
}
.company__about_map .image img {
  width: 100%;
  height: auto;
}
.company__about_map .link {
  margin-top: 15px;
}
.company__about_map .link a {
  width: 200px;
  display: block;
  margin: 0 auto;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  line-height: 50px;
  background: #30AD7D;
}
@media (min-width: 768px) {
  .company__about_map .link a {
    margin: auto;
  }
}
@media (min-width: 768px) {
  .company__about_map .link {
    margin-top: 0;
    flex: 0 0 auto;
  }
}
.company__about_map .link:nth-child(1) {
  margin-bottom: 15px;
}
.company__about table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 30px;
  border-top: 1px solid #EFF0F2;
}
@media (min-width: 768px) {
  .company__about table {
    max-width: 820px;
    margin-top: 30px;
  }
}
.company__about table tr {
  border-bottom: 1px solid #EFF0F2;
}
.company__about table th {
  width: 30%;
  text-align: left;
  height: 30px;
}
@media (min-width: 768px) {
  .company__about table th {
    height: 40px;
    padding-left: 5px;
  }
}
.company__about table td {
  width: 70%;
  text-align: left;
  height: 30px;
}
@media (min-width: 768px) {
  .company__about table td {
    height: 40px;
  }
}
.company__history {
  margin-top: 60px;
}
@media (min-width: 768px) {
  .company__history {
    margin-top: 80px;
  }
}
.company__history .title {
  font-weight: bold;
  font-size: 16px;
}
@media (min-width: 768px) {
  .company__history .title {
    font-size: 18px;
  }
}
.company__history table {
  border-collapse: collapse;
  margin-top: 30px;
}
@media (min-width: 768px) {
  .company__history table {
    max-width: 820px;
    margin-top: 30px;
  }
}
.company__history table tr {
  display: flex;
  flex-direction: column;
  margin-top: 10px;
}
.company__history table tr:first-of-type {
  margin-top: 0;
}
@media (min-width: 768px) {
  .company__history table tr {
    margin-top: 15px;
    flex-direction: row;
  }
}
.company__history table th {
  width: 100%;
  text-align: left;
}
@media (min-width: 768px) {
  .company__history table th {
    margin-top: 0;
    width: 15%;
    padding-left: 5px;
  }
}
.company__history table td {
  width: 100%;
  text-align: left;
}
@media (min-width: 768px) {
  .company__history table td {
    width: 85%;
  }
}

.recruit .common__wrap > h2 {
  margin-top: 13px;
  font-size: 16px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .recruit .common__wrap > h2 {
    margin-top: 35px;
    font-size: 20px;
  }
}
.recruit__inner {
  position: relative;
  z-index: 2;
  margin-top: 20px;
}
@media (min-width: 768px) {
  .recruit__inner {
    margin-top: 25px;
  }
}
.recruit__guide {
  width: 100%;
  max-width: 820px;
  margin: 30px auto 0;
  padding: 15px;
  background: #fff;
  border: 1px solid #EFF0F2;
}
@media (min-width: 768px) {
  .recruit__guide {
    margin: 60px auto 0;
    padding: 30px;
  }
}
.recruit__guide dl dt {
  font-size: 15px;
  font-weight: bold;
  color: #30AD7D;
  background: #EBF2F2;
  margin-top: 20px;
  padding: 3px 3px 3px 10px;
}
.recruit__guide dl dt:first-of-type {
  margin-top: 0;
}
@media (min-width: 768px) {
  .recruit__guide dl dt {
    margin-top: 30px;
    font-size: 16px;
    padding: 5px 5px 5px 15px;
  }
}
.recruit__guide dl dd {
  padding: 10px 0 0 0;
  font-size: 13px;
  line-height: 1.8;
}
@media (min-width: 768px) {
  .recruit__guide dl dd {
    font-size: 14px;
    padding: 10px 0 0 40px;
  }
}
.recruit__guide dl dd .bold {
  font-size: 14px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .recruit__guide dl dd .bold {
    font-size: 16px;
  }
}
.recruit__list {
  width: 100%;
  max-width: 820px;
  margin: 0 auto;
  list-style: none;
}
.recruit__list li {
  margin-top: 15px;
  padding: 10px;
  display: flex;
  align-items: center;
  border: 1px solid #EFF0F2;
  background: #fff;
}
@media (min-width: 768px) {
  .recruit__list li {
    margin-top: 20px;
    padding: 15px;
  }
}
.recruit__list li:first-of-type {
  margin-top: 0;
}
.recruit__list li:nth-of-type(2) {
  margin-top: 35px;
}
@media (min-width: 768px) {
  .recruit__list li:nth-of-type(2) {
    margin-top: 50px;
  }
}
.recruit__list li a {
  display: block;
  width: 100%;
  height: 100%;
  font-size: 16px;
  font-weight: bold;
  color: #30AD7D;
  text-align: center;
  line-height: 1.3;
}
@media (min-width: 768px) {
  .recruit__list li a {
    font-size: 18px;
  }
}
.recruit__list li a span {
  font-size: 10px;
  font-weight: normal;
  color: #000;
}
@media (min-width: 768px) {
  .recruit__list li a span {
    font-size: 12px;
  }
}

.privacy .common__wrap > h2 {
  margin-top: 13px;
  font-size: 16px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .privacy .common__wrap > h2 {
    margin-top: 35px;
    font-size: 20px;
  }
}
.privacy__inner {
  position: relative;
  z-index: 2;
  margin-top: 20px;
}
@media (min-width: 768px) {
  .privacy__inner {
    margin-top: 25px;
  }
}
.privacy__txt {
  width: 100%;
  margin-top: 30px;
  font-size: 13px;
  line-height: 1.8;
}
@media (min-width: 768px) {
  .privacy__txt {
    margin-top: 40px;
    font-size: 14px;
    line-height: 1.8;
  }
}
.privacy__txt:first-of-type {
  margin-top: 0;
}
.privacy__txt .bold {
  font-size: 15px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .privacy__txt .bold {
    font-size: 14px;
  }
}
.privacy__list {
  padding-left: 18px;
  margin-top: 30px;
}
@media (min-width: 768px) {
  .privacy__list {
    margin-top: 40px;
    padding-left: 30px;
  }
}
.privacy__list li {
  margin-top: 10px;
}
.privacy__list li:first-of-type {
  margin-top: 0;
}

.faq .common__wrap > h2 {
  margin-top: 13px;
  font-size: 16px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .faq .common__wrap > h2 {
    margin-top: 35px;
    font-size: 20px;
  }
}
.faq__inner {
  position: relative;
  z-index: 2;
  margin-top: 20px;
}
@media (min-width: 768px) {
  .faq__inner {
    margin-top: 25px;
  }
}
.faq__list {
  margin-top: 30px;
  padding: 20px;
  border: 1px solid #EFF0F2;
  background: #fff;
}
@media (min-width: 768px) {
  .faq__list {
    margin-top: 40px;
    padding: 25px;
  }
}
.faq__list li {
  display: flex;
  align-items: center;
}
.faq__list li span {
  display: inline-block;
  flex: 0 0 auto;
  width: 6px;
  height: 6px;
  background-image: url(/img/icon/icon_triangle.svg) !important;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 10px;
  flex-shrink: 6px;
}
.faq__list li a {
  width: calc(100% - 16px);
  color: #30AD7D;
  font-size: 13px;
}
@media (min-width: 768px) {
  .faq__list li a {
    font-size: 14px;
  }
}
.faq__answer {
  margin-top: 30px;
}
@media (min-width: 768px) {
  .faq__answer {
    margin-top: 40px;
  }
}
.faq__answer_item {
  padding-top: 30px;
}
@media (min-width: 768px) {
  .faq__answer_item {
    padding-top: 35px;
  }
}
.faq__answer_item .text {
  font-size: 13px;
  line-height: 1.6;
}
@media (min-width: 768px) {
  .faq__answer_item .text {
    font-size: 14px;
  }
}
.faq__answer_item .text .bold {
  font-weight: bold;
}
.faq__answer_item .text a {
  color: #30AD7D;
  text-decoration: underline;
}
.faq__answer_item .text .link {
  width: 200px;
  display: block;
  margin-top: 15px;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  line-height: 50px;
  background-color: #30AD7D;
  text-decoration: none;
}
.faq__answer_item .image {
  display: flex;
  width: 100%;
}
.faq__answer_item .image > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.faq__answer_item .image > div:first-of-type {
  margin-right: 15px;
}
@media (min-width: 768px) {
  .faq__answer_item .image > div:first-of-type {
    margin-right: 20px;
  }
}
.faq__answer_item .image > div a {
  display: block;
  text-decoration: underline;
  color: #30AD7D;
  margin-top: 10px;
  text-align: center;
}
.faq__answer_item .image img {
  width: 100%;
}
@media (min-width: 768px) {
  .faq__answer_item .image img {
    max-width: 100%;
    width: auto;
  }
}
.faq__answer_item .title {
  font-size: 15px;
  font-weight: bold;
  color: #30AD7D;
  padding-bottom: 2px;
}
@media (min-width: 768px) {
  .faq__answer_item .title {
    font-size: 16px;
    padding-bottom: 4px;
  }
}
.faq__answer_item .title::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  background-image: url(/img/icon/icon_triangle.svg) !important;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 5px;
  vertical-align: 1px;
}
@media (min-width: 768px) {
  .faq__answer_item .title::before {
    width: 10px;
    height: 10px;
  }
}

.copyright::before {
  height: 30%;
}
.copyright .common__wrap h2 {
  margin-top: 25px;
  font-size: 16px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .copyright .common__wrap h2 {
    margin-top: 35px;
    font-size: 20px;
  }
}
.copyright__inner {
  position: relative;
  z-index: 2;
  margin-top: 20px;
}
@media (min-width: 768px) {
  .copyright__inner {
    margin-top: 25px;
  }
}
.copyright__about p {
  font-size: 13px;
  line-height: 1.8;
  color: #000;
}
@media (min-width: 768px) {
  .copyright__about p {
    font-size: 14px;
  }
}
.copyright__contact {
  margin-top: 20px;
  padding: 20px;
  background-color: #fff;
  border: 1px solid #30AD7D;
  max-width: 680px;
}
@media (min-width: 768px) {
  .copyright__contact {
    margin-top: 30px;
    padding: 25px 60px;
  }
}
.copyright__contact.bottom {
  margin-top: 50px;
}
@media (min-width: 768px) {
  .copyright__contact.bottom {
    margin-top: 80px;
  }
}
.copyright__contact .title {
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  color: #30AD7D;
}
.copyright__contact .link-list {
  display: flex;
  flex-direction: column;
  margin-top: 16px;
}
@media (min-width: 768px) {
  .copyright__contact .link-list {
    width: 85%;
    flex-direction: row;
    justify-content: space-between;
    margin: 20px auto;
  }
}
.copyright__contact .link-list a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.7;
  text-align: center;
  border: 1px solid #30AD7D;
  background: #30AD7D;
  color: #fff;
}
.copyright__contact .link-list a:first-of-type {
  margin-top: 0;
}
.copyright__contact .link-list a .name {
  color: #30AD7D;
  font-weight: bold;
}
@media (min-width: 768px) {
  .copyright__contact .link-list a {
    margin-top: 0;
    padding: 0 15px;
  }
}
.copyright__contact .text {
  margin-top: 20px;
  font-size: 12px;
  line-height: 1.8;
}
.copyright__contact .text a {
  color: #30AD7D;
  text-decoration: underline;
}
.copyright__contact .text.address {
  text-align: center;
}
@media (min-width: 768px) {
  .copyright__contact .text {
    font-size: 14px;
    line-height: 1.95;
  }
}
.copyright__faq {
  margin-top: 50px;
}
@media (min-width: 768px) {
  .copyright__faq {
    margin-top: 80px;
  }
}
.copyright__faq_list {
  margin-top: 30px;
}
@media (min-width: 768px) {
  .copyright__faq_list {
    margin-top: 40px;
  }
}
.copyright__faq_list .title {
  font-size: 15px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .copyright__faq_list .title {
    font-size: 16px;
  }
}
.copyright__faq_list-item {
  margin-top: 20px;
}
@media (min-width: 768px) {
  .copyright__faq_list-item {
    margin-top: 30px;
  }
}
.copyright__faq_list-item:first-of-type {
  margin-top: 15px;
}
.copyright__faq_list-item .question {
  padding: 8px 30px 8px 35px;
  border: 1px solid #EFF0F2;
  color: #30AD7D;
  font-size: 13px;
  font-weight: bold;
  background: #E9F2F2;
  position: relative;
}
@media (min-width: 768px) {
  .copyright__faq_list-item .question {
    padding: 15px 20px 15px 60px;
    font-size: 14px;
  }
}
.copyright__faq_list-item .question:hover {
  cursor: pointer;
}
.copyright__faq_list-item .question::before {
  content: "Q.";
  font-size: 16px;
  font-weight: bold;
  color: #30AD7D;
  position: absolute;
  top: 50%;
  left: 10px;
  transform: translateY(-50%);
}
@media (min-width: 768px) {
  .copyright__faq_list-item .question::before {
    font-size: 20px;
    left: 20px;
  }
}
.copyright__faq_list-item .question::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 3px solid #A0A5B2;
  border-bottom: 3px solid #A0A5B2;
  position: absolute;
  top: calc(50% - 2px);
  right: 10px;
  transform: translateY(-50%) rotate(45deg);
  transition: 0.3s;
}
@media (min-width: 768px) {
  .copyright__faq_list-item .question::after {
    width: 10px;
    height: 10px;
    top: calc(50% - 2px);
    right: 20px;
  }
}
.copyright__faq_list-item .question.show::after {
  transform: translateY(-50%) rotate(225deg);
  top: calc(50% + 2px);
}
.copyright__faq_list-item .answer {
  display: none;
  padding: 15px 15px 15px 35px;
  font-size: 13px;
  background: #fff;
  border-left: 1px solid #EFF0F2;
  border-right: 1px solid #EFF0F2;
  border-bottom: 1px solid #EFF0F2;
  line-height: 1.85;
  text-align: justify;
  position: relative;
}
@media (min-width: 768px) {
  .copyright__faq_list-item .answer {
    padding: 20px 20px 20px 60px;
    font-size: 14px;
  }
}
.copyright__faq_list-item .answer::before {
  content: "A.";
  font-size: 16px;
  font-weight: bold;
  color: #30AD7D;
  position: absolute;
  top: 15px;
  left: 10px;
}
@media (min-width: 768px) {
  .copyright__faq_list-item .answer::before {
    font-size: 20px;
    top: 20px;
    left: 20px;
  }
}

.to-author::before {
  height: 30%;
}
.to-author .common__wrap h2 {
  margin-top: 25px;
  font-size: 16px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .to-author .common__wrap h2 {
    margin-top: 35px;
    font-size: 20px;
  }
}
.to-author__inner {
  position: relative;
  z-index: 2;
  margin-top: 20px;
  padding-bottom: 100px;
}
@media (min-width: 768px) {
  .to-author__inner {
    margin-top: 25px;
  }
}
.to-author__about h3 {
  color: #30AD7D;
  margin: 20px 0 10px;
  border-bottom: 1px solid #30AD7D;
}
.to-author__about p {
  font-size: 13px;
  line-height: 1.8;
  color: #000;
}
@media (min-width: 768px) {
  .to-author__about p {
    font-size: 14px;
  }
}
.to-author__about a {
  text-decoration: underline;
  color: #30AD7D;
}
.to-author__about ul {
  margin-top: 10px;
}
.to-author__about ul li {
  padding-bottom: 8px;
}
.to-author__about .image {
  margin: 20px 0;
}
.to-author__about .image img {
  max-width: 200px;
  width: 100%;
}
.to-author__about .flex {
  width: 100%;
  display: flex;
  flex-direction: column;
  margin-bottom: 30px;
}
.to-author__about .flex > p {
  width: 80%;
}
.to-author__about .flex .image {
  width: 20%;
}
@media (min-width: 768px) {
  .to-author__about .flex {
    flex-direction: row;
  }
}

.news h2 {
  margin-top: 25px;
  font-size: 16px;
}
@media (min-width: 768px) {
  .news h2 {
    margin-top: 35px;
    font-size: 20px;
  }
}
.news__inner {
  position: relative;
  z-index: 2;
  display: flex;
  margin-top: 18px;
  flex-direction: column;
  margin-bottom: 40px;
}
@media (min-width: 768px) {
  .news__inner {
    flex-direction: row;
    align-items: flex-start;
    margin-top: 25px;
  }
}
.news__nav .filter {
  margin-top: 0 !important;
}
.news__content {
  width: 100%;
  margin-top: 20px;
  /*戻るボタン*/
}
@media (min-width: 768px) {
  .news__content {
    margin-top: 0;
  }
}
.news__content .result-area {
  /*詳細ページ*/
  /*詳細ページ ここまで*/
}
.news__content .result-area__list-item {
  margin-top: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #EFF0F2;
}
.news__content .result-area__list-item:first-of-type {
  margin-top: 0;
}
.news__content .result-area__list-item > div {
  display: flex;
  align-items: self-end;
}
.news__content .result-area__list-item > div .category {
  min-width: 60px;
  display: inline-block;
  margin-right: 10px;
  padding: 2px 8px;
  text-align: center;
  font-size: 11px;
  line-height: 20px;
  border: 1px solid #30AD7D;
}
.news__content .result-area__list-item > div .category.page {
  background: #fff;
  color: #30AD7D;
}
.news__content .result-area__list-item > div .category.tag {
  color: #fff;
  background: #30AD7D;
}
.news__content .result-area__list-item > div .date {
  font-size: 12px;
  line-height: 1.5;
}
.news__content .result-area__list-item .title {
  margin-top: 10px;
  font-size: 14px;
}
.news__content .result-area__list-item .title:hover {
  text-decoration: underline;
}
.news__content .result-area__show .category-list {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
}
.news__content .result-area__show .category-list .category {
  min-width: 60px;
  display: inline-block;
  margin-right: 10px;
  padding: 2px 8px;
  text-align: center;
  font-size: 11px;
  line-height: 20px;
  border: 1px solid #30AD7D;
  margin-bottom: 6px;
}
@media (min-width: 768px) {
  .news__content .result-area__show .category-list .category {
    margin-bottom: 0;
  }
}
.news__content .result-area__show .category-list .category.page {
  background: #fff;
  color: #30AD7D;
}
.news__content .result-area__show .category-list .category.tag {
  color: #fff;
  background: #30AD7D;
}
.news__content .result-area__show .category-list .date {
  font-size: 12px;
  line-height: 1.5;
}
.news__content .result-area__show .title {
  margin-top: 15px;
  padding-bottom: 15px;
  border-bottom: 1px solid #30AD7D;
}
.news__content .result-area__show .title h1 {
  font-size: 16px;
  font-weight: bold;
  color: #30AD7D;
}
@media (min-width: 768px) {
  .news__content .result-area__show .title h1 {
    font-size: 16px;
  }
}
.news__content .result-area__show .content {
  margin-top: 20px;
}
.news__content .result-area__show .content p {
  font-size: 14px;
  color: #2D313B;
  margin-bottom: 40px;
  line-height: 1.9;
}
@media (min-width: 768px) {
  .news__content .result-area__show .content p {
    line-height: 1.85;
  }
}
.news__content .result-area__show .content img {
  width: auto;
  max-width: 100%;
  margin-bottom: 30px;
}
.news__content .result-area__show .content a {
  display: block;
  padding-left: 20px;
  font-size: 14px;
  color: #30AD7D;
  position: relative;
}
.news__content .result-area__show .content a::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  background-image: url(/img/icon/icon_triangle.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  margin-top: -1px;
}
.news__content .btn-back {
  margin-top: 34px;
  width: 100%;
}
@media (min-width: 768px) {
  .news__content .btn-back {
    margin-top: 60px;
  }
}
.news__content .btn-back a {
  display: block;
  width: 100%;
  height: 50px;
  font-size: 16px;
  color: #2D313B;
  line-height: 50px;
  text-align: center;
  border: 2px solid #E9F2F2;
  background: #fff;
}
@media (min-width: 768px) {
  .news__content .btn-back a {
    width: 240px;
    margin: 0 auto;
  }
  .news__content .btn-back a:hover {
    border: 2px solid #30AD7D;
    background: #30AD7D;
    color: #fff;
  }
}
.news__content .pagination {
  margin: 40px auto 0;
  width: 100%;
}
@media (min-width: 768px) {
  .news__content .pagination {
    margin: 60px auto 0;
  }
}
.news__content .pagination__list {
  width: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}
.news__content .pagination__list li {
  width: 32px;
  height: 32px;
  flex: 0 0 auto;
}
.news__content .pagination__list li:not(:last-child) {
  margin-right: 5px;
}
@media (min-width: 768px) {
  .news__content .pagination__list li:not(:last-child) {
    margin-right: 8px;
  }
}
@media (min-width: 768px) {
  .news__content .pagination__list li {
    width: 40px;
    height: 40px;
  }
}
.news__content .pagination__list a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  font-size: 12px;
  text-align: center;
  border: 1px solid #EFF0F2;
  color: #2D313B;
  background: #fff;
  position: relative;
}
@media (min-width: 768px) {
  .news__content .pagination__list a {
    font-size: 14px;
  }
}
.news__content .pagination__list a.active {
  background: #30AD7D;
  color: #fff;
}
.news__content .pagination__list a .next,
.news__content .pagination__list a .prev {
  display: block;
}
.news__content .pagination__list a .next::before,
.news__content .pagination__list a .prev::before {
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: rotate(45deg) translateX(-50%);
}
.news__content .pagination__list a .next::before {
  border-top: 1px solid #2D313B;
  border-right: 1px solid #2D313B;
}
.news__content .pagination__list a .prev::before {
  border-bottom: 1px solid #2D313B;
  border-left: 1px solid #2D313B;
}
.news__content .pagination__list a .first,
.news__content .pagination__list a .last {
  display: block;
}
.news__content .pagination__list a .first::before, .news__content .pagination__list a .first::after,
.news__content .pagination__list a .last::before,
.news__content .pagination__list a .last::after {
  content: "";
  display: block;
  width: 4px;
  height: 4px;
  position: absolute;
  top: 50%;
  transform: rotate(45deg) translateX(-50%);
}
.news__content .pagination__list a .first::before,
.news__content .pagination__list a .last::before {
  left: calc(50% + 2px);
}
.news__content .pagination__list a .first::after,
.news__content .pagination__list a .last::after {
  left: calc(50% - 2px);
}
.news__content .pagination__list a .first::before, .news__content .pagination__list a .first::after {
  border-bottom: 1px solid #2D313B;
  border-left: 1px solid #2D313B;
}
.news__content .pagination__list a .last::before, .news__content .pagination__list a .last::after {
  border-top: 1px solid #2D313B;
  border-right: 1px solid #2D313B;
}
.news__content .pagination__list a.grayout {
  pointer-events: none;
}
.news__content .pagination__list a.grayout .next::before {
  border-top: 1px solid #989898;
  border-right: 1px solid #989898;
}
.news__content .pagination__list a.grayout .prev::before {
  border-bottom: 1px solid #989898;
  border-left: 1px solid #989898;
}
.news__content .pagination__list a.grayout .first::before, .news__content .pagination__list a.grayout .first::after {
  border-bottom: 1px solid #989898;
  border-left: 1px solid #989898;
}
.news__content .pagination__list a.grayout .last::before, .news__content .pagination__list a.grayout .last::after {
  border-top: 1px solid #989898;
  border-right: 1px solid #989898;
}

.adult-confirm::before {
  /*デザインとあわせるため位置微調整*/
  top: 30px;
}
@media (min-width: 768px) {
  .adult-confirm::before {
    top: -66px;
  }
}
.adult-confirm .common__wrap > h2 {
  margin-top: 13px;
  font-size: 16px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .adult-confirm .common__wrap > h2 {
    margin-top: 35px;
    font-size: 20px;
  }
}
.adult-confirm__inner {
  margin-top: 42px;
  position: relative;
  z-index: 2;
}
@media (min-width: 768px) {
  .adult-confirm__inner {
    margin-top: 60px;
  }
}
.adult-confirm__inner .parts__title {
  /*背景の緑とかぶるため背景色を透明に変更*/
}
.adult-confirm__inner .parts__title h2 {
  background: transparent;
}
.adult-confirm__attention {
  width: 100%;
  margin: 30px auto 0;
  padding: 30px 20px 20px;
  border: 1px solid #EFF0F2;
  background: #fff;
}
@media (min-width: 768px) {
  .adult-confirm__attention {
    max-width: 820px;
    margin: 42px auto 0;
    padding: 40px 30px 30px;
  }
}
.adult-confirm__attention > p {
  font-size: 14px;
  font-weight: bold;
  color: #DD4747;
  text-align: center;
  line-height: 1.8;
}
@media (min-width: 768px) {
  .adult-confirm__attention > p {
    font-size: 18px;
    line-height: 1.95;
  }
}
.adult-confirm__attention .select {
  margin: 30px auto 0;
  padding: 20px;
  border: 1px solid #EFF0F2;
  background: #EBF2F2;
}
@media (min-width: 768px) {
  .adult-confirm__attention .select {
    padding: 38px 20px;
  }
}
.adult-confirm__attention .select > p {
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  color: #30AD7D;
}
.adult-confirm__attention .select > div {
  display: flex;
  justify-content: space-between;
  margin: 20px auto 0;
}
@media (min-width: 768px) {
  .adult-confirm__attention .select > div {
    max-width: 420px;
    margin: 28px auto 0;
  }
}
.adult-confirm__attention .select > div a {
  display: block;
  width: 46.938%;
  font-size: 16px;
  font-weight: bold;
  line-height: 50px;
  color: #30AD7D;
  text-align: center;
  border: 1px solid #30AD7D;
  background: #fff;
}
@media (min-width: 768px) {
  .adult-confirm__attention .select > div a {
    width: 200px;
    font-size: 18px;
    line-height: 60px;
  }
}

.not-found::before {
  /*デザインとあわせるため位置微調整*/
  top: 30px;
}
@media (min-width: 768px) {
  .not-found::before {
    top: -66px;
  }
}
.not-found .common__wrap > h2 {
  margin-top: 25px;
  font-size: 16px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .not-found .common__wrap > h2 {
    margin-top: 35px;
    font-size: 20px;
  }
}
.not-found__inner {
  margin: 42px auto 50px;
  position: relative;
  z-index: 2;
}
@media (min-width: 768px) {
  .not-found__inner {
    margin: 60px auto 50px;
  }
}
.not-found__inner .parts__title {
  /*背景の緑とかぶるため背景色を透明に変更*/
}
.not-found__inner .parts__title h2 {
  background: transparent;
  font-size: 18px;
}
@media (min-width: 768px) {
  .not-found__inner .parts__title h2 {
    font-size: 25px;
  }
}
.not-found__massage {
  width: 100%;
  margin: 30px auto 0;
  padding: 30px 20px 30px;
  border: 1px solid #EFF0F2;
  background: #fff;
}
@media (min-width: 768px) {
  .not-found__massage {
    max-width: 820px;
    margin: 42px auto 0;
    padding: 40px 30px 40px;
  }
}
.not-found__massage > p {
  font-size: 14px;
  text-align: center;
  line-height: 1.8;
}
@media (min-width: 768px) {
  .not-found__massage > p {
    font-size: 16px;
    line-height: 1.85;
  }
}
.not-found__massage .link {
  margin: 25px auto 0;
  display: flex;
  justify-content: center;
}
@media (min-width: 768px) {
  .not-found__massage .link {
    margin-top: 37px;
  }
}
.not-found__massage .link a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 200px;
  height: 50px;
  margin: 0 auto;
  color: #30AD7D;
  font-size: 16px;
  font-weight: bold;
  border: 1px solid #30AD7D;
}
@media (min-width: 768px) {
  .not-found__massage .link a {
    width: 280px;
    height: 60px;
    font-size: 18px;
  }
}

.media-produce.kijun::before, .media-produce.attention::before {
  display: none;
}
.media-produce .common__wrap > h2 {
  margin-top: 25px;
  font-size: 16px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .media-produce .common__wrap > h2 {
    margin-top: 35px;
    font-size: 20px;
  }
}
.media-produce .filter {
  margin-top: 0 !important;
}
.media-produce__inner {
  position: relative;
  z-index: 2;
  display: flex;
  margin-top: 20px;
  flex-direction: column;
}
@media (min-width: 768px) {
  .media-produce__inner {
    flex-direction: row;
    align-items: flex-start;
    margin-top: 25px;
  }
}
.media-produce__inner .parts__title > div h2 {
  background-color: transparent;
}
.media-produce__content {
  width: 100%;
  margin-top: 20px;
  /*原稿・お問合せ*/
  /*原稿・お問合せここまで*/
  /*新着情報*/
  /*新着情報ここまで*/
  /*メディア一覧*/
  /*メディア一覧ここまで*/
  /*詳細部分*/
  /*詳細部分ここまで*/
  /*注意*/
  /*注意ここまで*/
}
@media (min-width: 768px) {
  .media-produce__content {
    margin-top: 0;
  }
}
.media-produce__content .info {
  padding: 20px;
  border: 1px solid #EFF0F2;
  background: #fff;
}
@media (min-width: 768px) {
  .media-produce__content .info {
    padding: 30px;
  }
}
.media-produce__content .info__link {
  width: 100%;
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  max-width: 520px;
}
@media (min-width: 768px) {
  .media-produce__content .info__link {
    flex-direction: row;
    justify-content: center;
  }
}
.media-produce__content .info__link a {
  display: block;
  width: 100%;
  margin-top: 10px;
  line-height: 50px;
  text-align: center;
  border: 2px solid #E9F2F2;
  background: #fff;
}
.media-produce__content .info__link a:first-of-type {
  margin-top: 0;
}
@media (min-width: 768px) {
  .media-produce__content .info__link a {
    max-width: 250px;
    width: 48.07%;
    margin-top: 0;
  }
}
.media-produce__content .info__link a span {
  display: inline-block;
  padding-right: 18px;
  font-size: 12px;
  position: relative;
}
@media (min-width: 768px) {
  .media-produce__content .info__link a span {
    font-size: 14px;
  }
}
.media-produce__content .info__link a span::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  background-image: url(/img/icon/icon_triangle.svg) !important;
}
.media-produce__content .info__text {
  margin-top: 20px;
  font-size: 13px;
  line-height: 1.8;
}
.media-produce__content .info__text .title {
  font-weight: bold;
}
@media (min-width: 768px) {
  .media-produce__content .info__text {
    margin-top: 27px;
    font-size: 14px;
    line-height: 1.95;
  }
}
.media-produce__content .info__contact {
  margin-top: 20px;
  padding: 20px;
  background-color: #EBF2F2;
}
@media (min-width: 768px) {
  .media-produce__content .info__contact {
    margin-top: 30px;
    padding: 25px 60px;
  }
}
.media-produce__content .info__contact .title {
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  color: #30AD7D;
}
.media-produce__content .info__contact .tel-list {
  display: flex;
  flex-direction: column;
  margin-top: 16px;
}
@media (min-width: 768px) {
  .media-produce__content .info__contact .tel-list {
    flex-direction: row;
    justify-content: space-between;
    margin-top: 20px;
  }
}
.media-produce__content .info__contact .tel-list div {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 74px;
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.7;
  text-align: center;
  border: 1px solid #30AD7D;
  background: #fff;
}
.media-produce__content .info__contact .tel-list div:first-of-type {
  margin-top: 0;
}
.media-produce__content .info__contact .tel-list div .name {
  color: #30AD7D;
  font-weight: bold;
}
@media (min-width: 768px) {
  .media-produce__content .info__contact .tel-list div {
    max-width: 200px;
    width: 31.25%;
    margin-top: 0;
  }
}
.media-produce__content .info__contact .text {
  margin-top: 20px;
  font-size: 12px;
  line-height: 1.8;
}
.media-produce__content .info__contact .text a {
  color: #30AD7D;
  text-decoration: underline;
}
.media-produce__content .info__contact .text.address {
  text-align: center;
}
@media (min-width: 768px) {
  .media-produce__content .info__contact .text {
    font-size: 14px;
    line-height: 1.95;
  }
}
.media-produce__content .news-list {
  margin-top: 60px;
}
@media (min-width: 768px) {
  .media-produce__content .news-list {
    margin-top: 80px;
  }
}
.media-produce__content .news-list__inner {
  margin-top: 30px;
}
@media (min-width: 768px) {
  .media-produce__content .news-list__inner {
    margin-top: 50px;
  }
}
.media-produce__content .news-list__item {
  display: block;
  margin-top: 28px;
}
@media (min-width: 768px) {
  .media-produce__content .news-list__item {
    margin-top: 22px;
  }
}
.media-produce__content .news-list__item:first-of-type {
  margin-top: 0;
}
.media-produce__content .news-list__item .date {
  font-size: 12px;
}
.media-produce__content .news-list__item .title {
  margin-top: 10px;
  font-size: 14px;
}
.media-produce__content .news-list__item .title a {
  color: #30AD7D;
  text-decoration: underline;
}
.media-produce__content .media-list {
  margin-top: 60px;
}
@media (min-width: 768px) {
  .media-produce__content .media-list {
    margin-top: 80px;
  }
}
.media-produce__content .media-list__inner {
  width: 100%;
  margin-top: 30px;
  padding: 0 16px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .media-produce__content .media-list__inner {
    display: grid;
    grid-template-columns: repeat(3, 28%);
    margin-top: 50px;
    padding: 0;
    flex-wrap: nowrap;
  }
}
@media (min-width: 992px) {
  .media-produce__content .media-list__inner {
    grid-template-columns: repeat(5, 16.162%);
  }
}
.media-produce__content .media-list__item {
  width: 42.904%;
  display: flex;
  flex-direction: column;
}
@media (max-width: 767px) {
  .media-produce__content .media-list__item:nth-child(n+3) {
    margin-top: 27px;
  }
}
@media (min-width: 992px) {
  .media-produce__content .media-list__item {
    width: 100%;
  }
  .media-produce__content .media-list__item:nth-child(n+6) {
    margin-top: 60px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .media-produce__content .media-list__item {
    width: 100%;
  }
  .media-produce__content .media-list__item:nth-child(n+4) {
    margin-top: 60px;
  }
}
.media-produce__content .media-list__item img {
  width: 100%;
  height: auto;
}
.media-produce__content .media-list__item .image {
  display: block;
  margin-top: 20px;
}
.media-produce__content .media-list__item > div {
  margin-top: 18px;
  font-size: 14px;
}
@media (min-width: 768px) {
  .media-produce__content .media-list__item > div {
    margin-top: 18px;
  }
}
.media-produce__content .media-list__item > div .title {
  font-weight: bold;
  color: #30AD7D;
}
.media-produce__content .media-list__item > div .text {
  line-height: 1.8;
}
@media (min-width: 768px) {
  .media-produce__content .media-list__item > div .text {
    line-height: 1.95;
  }
}
.media-produce__content .media-detail {
  margin-top: 24px;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail {
    margin-top: 0;
  }
}
.media-produce__content .media-detail .title {
  margin-top: 40px;
  font-size: 16px;
  font-weight: bold;
}
.media-produce__content .media-detail .title:first-of-type {
  margin-top: 0;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail .title {
    margin-top: 60px;
    font-size: 18px;
  }
}
.media-produce__content .media-detail__info {
  display: flex;
  flex-direction: column;
  margin-top: 20px;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__info {
    flex-direction: row;
    margin-top: 30px;
  }
}
.media-produce__content .media-detail__info-image {
  width: 71.64%;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__info-image {
    max-width: 240px;
    min-width: 240px;
    margin-right: 50px;
  }
}
.media-produce__content .media-detail__info-image .image img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
.media-produce__content .media-detail__info-image .link {
  margin-top: 25px;
  width: 100%;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__info-image .link {
    margin-top: 30px;
  }
}
.media-produce__content .media-detail__info-image .link li {
  margin-top: 15px;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__info-image .link li {
    margin-top: 15px;
  }
}
.media-produce__content .media-detail__info-image .link li:first-of-type {
  margin-top: 0;
}
.media-produce__content .media-detail__info-image .link a {
  display: block;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  line-height: 50px;
  background: #30AD7D;
}
.media-produce__content .media-detail__info-text {
  margin-top: 20px;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__info-text {
    margin-top: 0;
    width: 100%;
  }
}
.media-produce__content .media-detail__info-text .logo {
  text-align: center;
  width: 200px;
  margin: 0 auto;
}
.media-produce__content .media-detail__info-text .logo img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__info-text .logo {
    margin: 0;
    text-align: left;
  }
}
.media-produce__content .media-detail__info-text .link {
  margin-top: 20px;
}
.media-produce__content .media-detail__info-text .link a {
  color: #30AD7D;
  font-size: 13px;
  padding-left: 10px;
  position: relative;
}
.media-produce__content .media-detail__info-text .link a::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  background-image: url(/img/icon/icon_triangle.svg) !important;
  background-size: contain;
  background-repeat: no-repeat;
}
.media-produce__content .media-detail__info-text .data {
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
}
@media (min-width: 576px) {
  .media-produce__content .media-detail__info-text .data {
    display: block;
    flex-wrap: nowrap;
  }
}
.media-produce__content .media-detail__info-text .data p {
  display: inline-block;
  padding-right: 10px;
  font-size: 13px;
  line-height: 2.3;
}
@media (min-width: 576px) {
  .media-produce__content .media-detail__info-text .data p {
    display: block;
  }
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__info-text .data p {
    font-size: 14px;
    font-size: 14px;
    padding-right: 0;
    line-height: 2;
  }
}
.media-produce__content .media-detail__info-text .text {
  margin-top: 20px;
  padding: 20px 0;
  border-top: 1px solid #EFF0F2;
  border-bottom: 1px solid #EFF0F2;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__info-text .text {
    margin-top: 30px;
  }
}
.media-produce__content .media-detail__info-text .text p {
  font-size: 14px;
  line-height: 1.9;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__info-text .text p {
    line-height: 1.85;
  }
}
.media-produce__content .media-detail__graph {
  width: 78.5%;
  margin: 10px auto 0;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__graph {
    width: 100%;
    margin-top: 30px 0 0;
  }
}
.media-produce__content .media-detail__graph img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
.media-produce__content .media-detail__price {
  margin: 10px auto 0;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__price {
    width: 100%;
    margin-top: 30px 0 0;
  }
}
.media-produce__content .media-detail__price table {
  width: 100%;
  border-collapse: collapse;
}
.media-produce__content .media-detail__price table thead th {
  width: 33.3333%;
  height: 40px;
  padding-left: 15px;
  font-size: 12px;
  line-height: 1;
  text-align: left;
  background: #EFF0F2;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__price table thead th {
    height: 50px;
    padding-left: 37px;
    font-size: 16px;
    font-weight: normal;
  }
}
.media-produce__content .media-detail__price table thead th span {
  font-size: 10px;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__price table thead th span {
    font-size: 16px;
  }
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__price table thead th.short {
    width: 145px;
  }
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__price table thead th.long {
    width: calc(100% - 290px);
  }
}
.media-produce__content .media-detail__price table tbody tr:nth-of-type(even) {
  background: #EBF2F2;
}
.media-produce__content .media-detail__price table tbody tr:nth-of-type(odd) {
  background: #fff;
}
.media-produce__content .media-detail__price table tbody td {
  height: 40px;
  padding-left: 15px;
  font-size: 12px;
  text-align: left;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail__price table tbody td {
    height: 50px;
    padding-left: 37px;
    font-size: 14px;
  }
}
.media-produce__content .media-detail .info {
  margin-top: 50px;
}
@media (min-width: 768px) {
  .media-produce__content .media-detail .info {
    margin-top: 80px;
  }
}
.media-produce__content .media-kijun {
  margin-top: 24px;
}
@media (min-width: 768px) {
  .media-produce__content .media-kijun {
    margin-top: 0;
  }
}
.media-produce__content .media-kijun .title {
  margin-top: 40px;
  font-size: 16px;
  font-weight: bold;
}
.media-produce__content .media-kijun .title:first-of-type {
  margin-top: 0;
}
@media (min-width: 768px) {
  .media-produce__content .media-kijun .title {
    margin-top: 60px;
    font-size: 18px;
  }
}
.media-produce__content .media-kijun__wrapper {
  margin-top: 20px;
}
@media (min-width: 768px) {
  .media-produce__content .media-kijun__wrapper {
    margin-top: 30px;
  }
}
.media-produce__content .media-kijun__contents {
  margin-top: 20px;
}
@media (min-width: 768px) {
  .media-produce__content .media-kijun__contents {
    margin-top: 20px;
  }
}
.media-produce__content .media-kijun__contents:first-of-type {
  margin-top: 0;
}
.media-produce__content .media-kijun__contents h3 {
  font-size: 16px;
  color: #30AD7D;
  padding: 5px;
  background: #E9F2F2;
}
@media (min-width: 768px) {
  .media-produce__content .media-kijun__contents h3 {
    padding: 8px;
    font-size: 18px;
  }
}
.media-produce__content .media-kijun__contents .text {
  padding: 8px 0;
  font-size: 13px;
  line-height: 1.8;
}
@media (min-width: 768px) {
  .media-produce__content .media-kijun__contents .text {
    padding: 15px 0;
    font-size: 14px;
    line-height: 1.8;
  }
}
.media-produce__content .media-kijun__contents .text .color {
  color: #55b4e7;
}
.media-produce__content .media-kijun__contents .text ul {
  list-style: none;
}
.media-produce__content .media-kijun__contents .text ul li {
  display: flex;
}
.media-produce__content .media-kijun__contents .text ul li span {
  margin-right: 5px;
}
.media-produce__content .media-kijun__contents .text .flex {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .media-produce__content .media-kijun__contents .text .flex {
    flex-direction: row;
  }
}
.media-produce__content .media-kijun__contents .text .flex .image {
  width: 100%;
  margin-top: 20px;
}
@media (min-width: 768px) {
  .media-produce__content .media-kijun__contents .text .flex .image {
    width: auto;
    margin-top: 0;
  }
}
.media-produce__content .media-kijun__contents .text .flex .image img {
  width: 60%;
  display: block;
  height: auto;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .media-produce__content .media-kijun__contents .text .flex .image img {
    max-width: 100%;
    width: auto;
  }
}
.media-produce__content .media-attention {
  margin-top: 24px;
}
@media (min-width: 768px) {
  .media-produce__content .media-attention {
    margin-top: 0;
  }
}
.media-produce__content .media-attention .title {
  margin-top: 40px;
  font-size: 16px;
  font-weight: bold;
}
.media-produce__content .media-attention .title:first-of-type {
  margin-top: 0;
}
@media (min-width: 768px) {
  .media-produce__content .media-attention .title {
    margin-top: 60px;
    font-size: 18px;
  }
}
.media-produce__content .media-attention__wrapper {
  margin-top: 20px;
}
@media (min-width: 768px) {
  .media-produce__content .media-attention__wrapper {
    margin-top: 30px;
  }
}
.media-produce__content .media-attention__contents {
  margin-top: 20px;
}
@media (min-width: 768px) {
  .media-produce__content .media-attention__contents {
    margin-top: 20px;
  }
}
.media-produce__content .media-attention__contents:first-of-type {
  margin-top: 0;
}
.media-produce__content .media-attention__contents h3 {
  font-size: 16px;
  color: #30AD7D;
  padding: 5px;
  background: #E9F2F2;
}
@media (min-width: 768px) {
  .media-produce__content .media-attention__contents h3 {
    padding: 8px;
    font-size: 18px;
  }
}
.media-produce__content .media-attention__contents .text {
  padding: 8px 0;
  font-size: 13px;
  line-height: 1.8;
}
@media (min-width: 768px) {
  .media-produce__content .media-attention__contents .text {
    padding: 15px 0;
    font-size: 14px;
    line-height: 1.8;
  }
}
.media-produce__content .media-attention__contents .text ul {
  list-style: disc;
  padding-left: 20px;
}
@media (min-width: 768px) {
  .media-produce__content .media-attention__contents .text ul {
    padding-left: 40px;
  }
}
.media-produce__content .media-attention__contents .text ul.flex.row {
  flex-direction: row !important;
}
.media-produce__content .media-attention__contents .text ul.flex li {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .media-produce__content .media-attention__contents .text ul.flex li {
    flex-direction: row;
  }
}
.media-produce__content .media-attention__contents .text ul.style-none {
  list-style: none;
}
.media-produce__content .media-attention__contents .text .space {
  padding-left: 20px;
}
@media (min-width: 768px) {
  .media-produce__content .media-attention__contents .text .space {
    padding-left: 40px;
  }
}
.media-produce__content .media-attention__contents .text .kome {
  font-size: 12px;
  margin-top: 5px;
}
@media (min-width: 768px) {
  .media-produce__content .media-attention__contents .text .kome {
    font-size: 12px;
    margin-top: 8px;
  }
}
.media-produce__content .media-attention__contents .text p.sub_ttl {
  margin-top: 15px;
}
@media (min-width: 768px) {
  .media-produce__content .media-attention__contents .text p.sub_ttl {
    margin-top: 20px;
  }
}
.media-produce__content .media-attention__contents .text p img {
  display: block;
  width: 100%;
  margin-top: 15px;
}
@media (min-width: 768px) {
  .media-produce__content .media-attention__contents .text p img {
    max-width: 100%;
    width: auto;
    margin-top: 20px;
  }
}
.media-produce__content .media-attention__contents .text h4 {
  margin-top: 20px;
  padding: 3px 0;
}
@media (min-width: 768px) {
  .media-produce__content .media-attention__contents .text h4 {
    margin-top: 25px;
    padding: 5px 0;
  }
}
.media-produce__content .media-attention__contents .text a {
  color: #30AD7D;
  text-decoration: underline;
}

.media-mix .common__wrap > h2 {
  margin-top: 13px;
  font-size: 16px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .media-mix .common__wrap > h2 {
    margin-top: 35px;
    font-size: 20px;
  }
}
.media-mix__inner {
  margin-top: 42px;
  position: relative;
  z-index: 2;
}
@media (min-width: 768px) {
  .media-mix__inner {
    margin-top: 60px;
  }
}
.media-mix .category {
  margin-top: 60px;
}
@media (min-width: 768px) {
  .media-mix .category {
    margin-top: 80px;
  }
}
.media-mix .category .parts__title > div h2 {
  background-color: transparent;
}
.media-mix .category__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.media-mix .category__list-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 46.58%;
  margin-top: 20px;
}
@media (min-width: 768px) {
  .media-mix .category__list-item {
    margin-top: 60px;
    flex-direction: row;
    justify-content: space-between;
  }
}
.media-mix .category__list-item .image {
  position: relative;
  width: 100%;
  padding-top: 100%;
  overflow: hidden;
}
@media (min-width: 768px) {
  .media-mix .category__list-item .image {
    width: 47.619%;
    padding-top: 47.619%;
    margin-right: 25px;
  }
}
.media-mix .category__list-item .image.square > img {
  position: absolute;
  -o-object-fit: contain;
     object-fit: contain;
  filter: blur(0);
  width: 100%;
  height: 100%;
  top: 0;
}
.media-mix .category__list-item .image.square .inner {
  display: none;
}
.media-mix .category__list-item .image > img {
  position: absolute;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  top: 0;
  filter: blur(8px);
}
.media-mix .category__list-item .image .inner {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  z-index: 2;
  background-color: rgba(255, 255, 255, 0.2);
}
.media-mix .category__list-item .image .inner > img {
  width: 57%;
}
.media-mix .category__list-item .text {
  position: relative;
  width: 100%;
  margin-top: 10px;
}
@media (min-width: 768px) {
  .media-mix .category__list-item .text {
    margin-top: 0;
    width: 47.619%;
  }
}
.media-mix .category__list-item .text .title {
  font-size: 14px;
  font-weight: bold;
}
.media-mix .category__list-item .text .intro {
  margin-top: 6px;
  font-size: 10px;
}
@media (min-width: 768px) {
  .media-mix .category__list-item .text .intro {
    margin-top: 10px;
    font-size: 13px;
  }
}
.media-mix .category__list-item .text .link-list {
  margin-top: 10px;
}
@media (min-width: 768px) {
  .media-mix .category__list-item .text .link-list {
    margin-top: 20px;
  }
}
.media-mix .category__list-item .text .link {
  display: block;
  padding-left: 10px;
  font-size: 10px;
  color: #30AD7D;
  position: relative;
  margin-top: 2px;
}
.media-mix .category__list-item .text .link:first-of-type {
  margin-top: 0;
}
@media (min-width: 768px) {
  .media-mix .category__list-item .text .link {
    margin-top: 5px;
    font-size: 13px;
  }
}
.media-mix .category__list-item .text .link::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background-image: url(/img/icon/icon_triangle.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  left: 0;
  padding-top: 10px;
}

.label .common__wrap > h2 {
  margin-top: 25px;
  font-size: 16px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .label .common__wrap > h2 {
    margin-top: 35px;
    font-size: 20px;
  }
}
.label__inner {
  margin-top: 42px;
  position: relative;
  z-index: 2;
}
@media (min-width: 768px) {
  .label__inner {
    margin-top: 60px;
  }
}
.label .block {
  margin-top: 60px;
}
@media (min-width: 768px) {
  .label .block {
    margin-top: 80px;
  }
}
.label .block .parts__title > div h2 {
  background-color: transparent;
}
.label .block__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: 25px;
}
@media (min-width: 768px) {
  .label .block__list {
    margin-top: 40px;
  }
}
.label .block__list .item {
  width: 100%;
  border: 2px solid #EFF0F2;
  padding: 15px;
  background-color: #fff;
  margin-bottom: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.label .block__list .item > div {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media (min-width: 768px) {
  .label .block__list .item {
    width: calc((100% - 40px) / 2);
    margin-bottom: 40px;
    padding: 20px;
    min-height: 254px;
    justify-content: space-between;
  }
  .label .block__list .item:not(:nth-child(2n)) {
    margin-right: 40px;
  }
}
@media (min-width: 992px) {
  .label .block__list .item {
    width: calc((100% - 120px) / 4);
  }
  .label .block__list .item:not(:nth-child(2n)) {
    margin-right: 0;
  }
  .label .block__list .item:not(:nth-child(4n)) {
    margin-right: 40px;
  }
}
.label .block__list .item .title {
  width: 100%;
  font-size: 14px;
  margin-bottom: 10px;
}
@media (min-width: 768px) {
  .label .block__list .item .title {
    font-size: 16px;
    margin-bottom: 15px;
  }
}
.label .block__list .item .intro {
  font-size: 14px;
  margin-bottom: 10px;
  line-height: 1.8;
}
@media (min-width: 768px) {
  .label .block__list .item .intro {
    margin-bottom: 15px;
  }
}
.label .block__list .item .link {
  width: 100%;
  display: block;
  padding-left: 10px;
  font-size: 14px;
  color: #30AD7D;
  position: relative;
  margin-bottom: 15px;
}
@media (min-width: 768px) {
  .label .block__list .item .link {
    margin-bottom: 20px;
  }
}
.label .block__list .item .link::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  background-image: url(/img/icon/icon_triangle.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  left: 0;
  top: 15%;
  padding-top: 10px;
}

.sns-account {
  margin-top: 30px;
  padding-bottom: 50px;
}
@media (min-width: 768px) {
  .sns-account {
    margin-top: 50px;
    padding-bottom: 40px;
  }
}
.sns-account h2 {
  font-size: 18px;
}
.sns-account__inner {
  position: relative;
  z-index: 2;
  margin-top: 30px;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}
@media (min-width: 768px) {
  .sns-account__inner {
    flex-wrap: wrap;
    justify-content: flex-start;
    flex-direction: row;
    margin-top: 30px;
  }
}
.sns-account__item {
  display: flex;
  width: 100%;
  margin-bottom: 15px;
  background: #fff;
  padding: 20px;
  border: 2px solid #EFF0F2;
}
@media (min-width: 768px) {
  .sns-account__item {
    width: calc((100% - 70px) / 2);
    margin-bottom: 40px;
  }
  .sns-account__item:nth-child(odd) {
    margin-right: 70px;
  }
}
.sns-account__item .image {
  margin-right: 15px;
}
@media (min-width: 768px) {
  .sns-account__item .image {
    margin-right: 30px;
  }
}
.sns-account__item .image img {
  width: 67px;
}
@media (min-width: 768px) {
  .sns-account__item .image img {
    width: 100%;
    max-width: 130px;
  }
}
.sns-account__item .info h3 {
  font-size: 12px;
  margin-bottom: 10px;
}
@media (min-width: 768px) {
  .sns-account__item .info h3 {
    font-size: 14px;
  }
}
.sns-account__item .info .account__item {
  display: flex;
  align-items: center;
  margin-bottom: 13px;
}
.sns-account__item .info .account__item a {
  color: #A0A5B2;
  font-size: 10px;
}
.sns-account__item .info .account__item a:nth-child(1) {
  margin-right: 10px;
}
@media (min-width: 768px) {
  .sns-account__item .info .account__item a {
    font-size: 13px;
  }
}
.sns-account__item .info .account__item a img {
  width: 15px;
}
@media (min-width: 768px) {
  .sns-account__item .info .account__item a img {
    width: 30px;
  }
}
.sns-account__item .info .account__item a:hover {
  text-decoration: underline;
}
.sns-account__item .info .intro p {
  font-size: 13px;
}
.sns-account__link {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  width: 47%;
}
@media (min-width: 768px) {
  .sns-account__link {
    width: 100%;
    margin-bottom: 40px;
  }
  .sns-account__link:not(:nth-child(3n)) {
    margin-right: 70px;
  }
}

.header {
  width: 100%;
  position: fixed;
  z-index: 10;
  top: 0;
}
@media (min-width: 768px) {
  .header {
    position: relative;
    z-index: 5;
  }
}
.header__inner {
  max-width: 1280px;
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}
.header__head {
  height: 50px;
  padding: 10px;
  background: #fff;
  box-shadow: 0 0px 7px rgba(204, 204, 204, 0.6);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media (min-width: 768px) {
  .header__head {
    padding: 10px 20px;
    height: 74px;
    background: transparent;
    box-shadow: none;
  }
}
.header__head.close {
  position: relative;
  box-shadow: none;
}
.header__head.close::before {
  display: block;
  position: absolute;
  z-index: 4;
  top: 0;
  left: 0;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 80px 240px 0 0;
  border-color: #30AD7D transparent transparent transparent;
}
.header__head-logo img {
  width: 115px;
}
@media (min-width: 768px) {
  .header__head-logo img {
    width: 140px;
  }
}
.header__head-content {
  display: none;
}
.header__head-content.open {
  width: 100%;
  top: 0;
  right: 0;
  position: fixed;
  z-index: 3;
  display: flex;
  flex-direction: column;
  background-color: #fff;
  height: 100vh;
  padding: 85px 40px 0;
}
.header__head-content.open > p {
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 10px;
}
@media (min-width: 768px) {
  .header__head-content {
    margin-left: 10px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
}
.header__head-content a, .header__head-content p, .header__head-content input {
  font-size: 12px;
}
.header__head-search {
  position: relative;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 768px) {
  .header__head-search {
    max-width: 360px;
  }
}
.header__head-search a.search {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.header__head-search > div:first-child {
  width: 100%;
}
@media (min-width: 768px) {
  .header__head-search > div:first-child {
    max-width: 320px;
  }
}
.header__head-search > div:first-child input {
  height: 50px;
  width: 100%;
  border: none;
  background-color: #E9F2F2;
  padding: 10px;
  outline: none;
}
@media (min-width: 768px) {
  .header__head-search > div:first-child input {
    height: 40px;
  }
}
.header__head-search > div:first-child input:focus {
  border: 1px solid #30AD7D;
}
.header__head-search > div:nth-child(2) {
  cursor: pointer;
  width: 60px;
  height: 50px;
  background-color: #30AD7D;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 768px) {
  .header__head-search > div:nth-child(2) {
    width: 40px;
    height: 40px;
  }
}
.header__head-search > div:nth-child(2) img {
  width: 19px;
}
@media (min-width: 768px) {
  .header__head-search > div:nth-child(2) img {
    width: 15px;
  }
}
.header__head-search__list {
  display: none;
  position: absolute;
  z-index: 3;
  top: 55px;
  left: 50px;
  background-color: #fff;
  box-shadow: 2px 2px 5px rgba(204, 204, 204, 0.7);
  padding: 10px;
  min-width: 200px;
}
.header__head-search__list li {
  padding-bottom: 10px;
}
.header__head-search__list li a {
  cursor: pointer;
}
.header__head-search__list.open {
  display: block;
}
.header__head-link {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 120px 0 0;
  flex-wrap: wrap;
}
@media (min-width: 768px) {
  .header__head-link {
    padding: 0 20px;
    justify-content: flex-start;
    max-width: 320px;
    flex-wrap: nowrap;
  }
}
.header__head-link a {
  width: 49%;
  height: 60px;
  position: relative;
  white-space: nowrap;
  border: 2px solid #E9F2F2;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  padding: 0 0 5px;
  margin: 0 0 10px;
  transition: all 0.2s;
}
.header__head-link a:hover {
  text-decoration: underline;
}
@media (min-width: 768px) {
  .header__head-link a {
    width: auto;
    height: auto;
    padding: 0 0 0 15px;
    margin: 0 20px 0 0;
    border: none;
  }
}
.header__head-link a::before {
  display: block;
  content: "";
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  top: 5px;
  left: 0;
  width: 100%;
  height: 22px;
}
.header__head-link a:nth-child(1)::before {
  background-image: url(/img/icon/icon_genre.svg);
}
.header__head-link a:nth-child(2)::before {
  background-image: url(/img/icon/icon_author.svg);
}
.header__head-link a:nth-child(3)::before {
  background-image: url(/img/icon/icon_label.svg);
}
@media (min-width: 768px) {
  .header__head-link a::before {
    top: calc(50% - 5px);
    left: 0;
    width: 10px;
    height: 10px;
    background-image: url(/img/icon/icon_triangle.svg) !important;
  }
}
@media (min-width: 768px) {
  .header__head-contact {
    display: flex;
  }
}
.header__head-contact a {
  background-color: #30AD7D;
  color: #fff !important;
  height: 40px;
  width: 160px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #30AD7D;
  font-weight: bold;
}
.header__head-contact a:hover {
  background-color: #fff;
  color: #30AD7D !important;
}
.header__head-icons {
  display: flex;
}
.header__head-icons a:nth-child(1) {
  width: 50px;
  height: 50px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.header__head-icons a:nth-child(1) img {
  width: 30px;
}
.header__head-icons a:nth-child(2) {
  width: 30px;
  height: 50px;
  position: relative;
  z-index: 4;
}
.header__head-icons a:nth-child(2) span {
  position: absolute;
  display: block;
  content: "";
  height: 3px;
  width: 100%;
  background-color: #A0A5B2;
  transition: all 0.3s;
}
.header__head-icons a:nth-child(2) span:nth-child(1) {
  top: 10px;
}
.header__head-icons a:nth-child(2) span:nth-child(2) {
  top: 22px;
}
.header__head-icons a:nth-child(2) span:nth-child(3) {
  top: 34px;
}
.header__head-icons a:nth-child(2).close span:nth-child(1) {
  transform: rotate(45deg);
  top: 22px;
  transform-origin: center;
}
.header__head-icons a:nth-child(2).close span:nth-child(2) {
  display: none;
}
.header__head-icons a:nth-child(2).close span:nth-child(3) {
  transform: rotate(-45deg);
  top: 22px;
  transform-origin: center;
}
@media (min-width: 768px) {
  .header__head-icons {
    display: none;
  }
}
.header__menu {
  width: 100%;
  display: none;
}
.header__menu.open {
  top: 0;
  right: 0;
  position: fixed;
  z-index: 3;
  display: flex;
  flex-direction: column;
  background-color: #fff;
  height: 100vh;
  padding: 85px 40px 0;
}
@media (min-width: 768px) {
  .header__menu {
    box-shadow: -1px -2px 30px 0 rgba(0, 0, 0, 0.04);
    border-top: 1px solid #E9F2F2;
    border-bottom: 1px solid #E9F2F2;
    display: flex;
    align-items: center;
    height: 44px;
  }
}
.header__menu a {
  margin-bottom: 10px;
  transition: all 0.2s;
}
@media (min-width: 768px) {
  .header__menu a {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    margin-bottom: 0;
    height: 34px;
  }
  .header__menu a:not(:nth-child(7)) {
    border-right: 1px solid #E9F2F2;
  }
}
.header__menu a:nth-child(8) {
  margin-top: 6px;
}
.header__menu a:hover p, .header__menu a:hover span {
  color: #30AD7D;
}
@media (min-width: 768px) {
  .header__menu a:hover {
    background-color: #30AD7D;
    height: 42px;
  }
  .header__menu a:hover p, .header__menu a:hover span {
    color: #fff;
  }
}
.header__menu a p {
  font-size: 14px;
}
@media (min-width: 768px) {
  .header__menu a p {
    font-size: 13px;
  }
}
.header__menu a span {
  font-size: 12px;
  color: #535A6A;
}
@media (min-width: 768px) {
  .header__menu a.active {
    background-color: #30AD7D;
    height: 42px;
  }
  .header__menu a.active p {
    color: #fff;
  }
}

.footer {
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.footer::before {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 1;
  width: 100%;
  height: 450px;
  content: "";
  background-image: linear-gradient(to top, #ffffff 5%, #e4eded 95%);
  -webkit-clip-path: polygon(0 200px, 100% 0, 100% 100%, 0 100%);
  clip-path: polygon(0 200px, 100% 0, 100% 100%, 0 100%);
}
@media (min-width: 768px) {
  .footer::before {
    -webkit-clip-path: polygon(0 50%, 100% 20%, 100% 100%, 0 100%);
    clip-path: polygon(0 50%, 100% 20%, 100% 100%, 0 100%);
    height: 600px;
  }
}
.footer__outlinks {
  max-width: 1083px;
  width: 100%;
  margin: 30px auto 0;
  padding: 0 20px;
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-top: 2px solid #E9F2F2;
  border-bottom: 2px solid #E9F2F2;
}
.footer__outlinks > p {
  font-weight: bold;
  position: relative;
  font-size: 18px;
  padding: 10px 0;
}
@media (min-width: 768px) {
  .footer__outlinks > p {
    padding: 0;
  }
}
.footer__outlinks::before {
  position: absolute;
  top: 15px;
  right: 20px;
  display: block;
  content: "";
  width: 10px;
  height: 10px;
  background-image: url(/img/icon/icon_triangle_below.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: all 0.3s;
}
.footer__outlinks.menuOpen::before {
  transform: rotate(180deg);
}
@media (min-width: 768px) {
  .footer__outlinks {
    margin-top: 100px;
    padding: 0 0 70px;
    border: none;
    background: transparent;
  }
  .footer__outlinks::before {
    display: none;
  }
}
.footer__outlinks-inner {
  margin-top: 10px;
  display: none;
}
@media (min-width: 768px) {
  .footer__outlinks-inner {
    display: flex;
    margin-top: 25px;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
    max-height: 220px;
  }
}
.footer__outlinks-inner li {
  padding-bottom: 10px;
}
@media (min-width: 768px) {
  .footer__outlinks-inner li {
    padding-bottom: 15px;
  }
}
.footer__outlinks-inner li a {
  font-size: 12px;
}
@media (min-width: 768px) {
  .footer__outlinks-inner li a {
    font-size: 13px;
  }
}
.footer__outlinks-inner li a:hover {
  text-decoration: underline;
}
.footer__outlinks-inner.open {
  display: block;
}
.footer__innerlinks-inner {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding-bottom: 40px;
}
@media (min-width: 768px) {
  .footer__innerlinks-inner {
    flex-wrap: nowrap;
    justify-content: center;
    padding-bottom: 70px;
  }
}
.footer__innerlinks-item {
  position: relative;
  z-index: 2;
  cursor: pointer;
  border: 3px solid #E9F2F2;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 49%;
  height: 80px;
  background: #fff;
}
.footer__innerlinks-item.sp-wide {
  width: 100%;
}
@media (min-width: 768px) {
  .footer__innerlinks-item.sp-wide {
    width: 49%;
  }
}
.footer__innerlinks-item:hover {
  background-color: #30AD7D;
}
.footer__innerlinks-item:hover p {
  color: #fff;
}
.footer__innerlinks-item:hover p::before {
  background-image: url(/img/icon/icon_triangle_white.svg);
}
.footer__innerlinks-item:nth-child(3) {
  width: 100%;
  margin-top: 10px;
}
@media (min-width: 768px) {
  .footer__innerlinks-item:nth-child(3) {
    margin-top: 0;
  }
}
@media (min-width: 768px) {
  .footer__innerlinks-item {
    flex: 1;
    max-width: 300px;
    margin: 0 10px;
  }
}
.footer__innerlinks-item p {
  position: relative;
  color: #535A6A;
  font-size: 12px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .footer__innerlinks-item p {
    font-size: 13px;
  }
}
@media (min-width: 992px) {
  .footer__innerlinks-item p {
    font-size: 16px;
  }
}
.footer__innerlinks-item p::before {
  display: block;
  content: "";
  position: absolute;
  width: 100%;
  height: 22px;
  top: calc(50% - 5px);
  right: -20px;
  width: 10px;
  height: 10px;
  background-image: url(/img/icon/icon_triangle.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  transition: all 0.3s;
}
.footer__bottom {
  position: relative;
  z-index: 2;
  padding: 25px 0;
  background-color: #A0A5B2;
}
@media (min-width: 768px) {
  .footer__bottom {
    padding: 50px 0;
  }
}
.footer__bottom-inner p, .footer__bottom-inner a {
  color: #fff;
}
.footer__bottom-inner p {
  font-size: 10px;
  line-height: 1.7;
}
.footer__bottom-inner a {
  font-size: 13px;
  padding: 0 10px;
}
.footer__bottom-inner a:nth-child(2) {
  border-right: 1px solid #fff;
  border-left: 1px solid #fff;
}
.footer__bottom-inner > p {
  text-align: center;
  margin-top: 15px;
}
.footer__bottom .head {
  display: flex;
}
.footer__bottom .head p {
  padding-left: 10px;
}
@media (min-width: 768px) {
  .footer__bottom .head p {
    padding-left: 20px;
  }
}
.footer__bottom .bottom {
  margin-top: 40px;
  display: flex;
  justify-content: center;
}
.footer__bottom .bottom a:hover {
  text-decoration: underline;
}

.parts__title {
  display: flex;
  justify-content: center;
  align-items: center;
}
.parts__title > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.parts__title > div > span {
  position: relative;
  content: "";
  display: block;
  width: 25px;
  height: 40px;
}
@media (min-width: 768px) {
  .parts__title > div > span {
    height: 60px;
    width: 40px;
  }
}
.parts__title > div > span::before, .parts__title > div > span::after {
  position: absolute;
  content: "";
  width: 10px;
  height: 10px;
}
@media (min-width: 768px) {
  .parts__title > div > span::before, .parts__title > div > span::after {
    width: 20px;
    height: 20px;
  }
}
.parts__title > div > span:nth-child(1)::before {
  border-top: 2px solid #000;
  border-left: 2px solid #000;
  top: 0;
  left: 0;
}
.parts__title > div > span:nth-child(1)::after {
  border-bottom: 2px solid #000;
  border-left: 2px solid #000;
  top: auto;
  bottom: 0;
  left: 0;
}
.parts__title > div > span:nth-child(3)::before {
  border-top: 2px solid #000;
  border-right: 2px solid #000;
  top: 0;
  right: 0;
}
.parts__title > div > span:nth-child(3)::after {
  border-bottom: 2px solid #000;
  border-right: 2px solid #000;
  top: auto;
  bottom: 0;
  right: 0;
}
.parts__title > div h2 {
  position: relative;
  background-color: #fff;
  font-size: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 768px) {
  .parts__title > div h2 {
    font-size: 25px;
  }
}

.parts__basic-info h4 {
  font-size: 12px;
  line-height: 24px;
  word-break: break-all;
}
.parts__basic-info h4.omit {
  max-height: 48px;
  overflow: hidden;
}
@media (min-width: 768px) {
  .parts__basic-info h4 {
    font-size: 14px;
  }
}
.parts__basic-info > p {
  margin-top: 6px;
}
.parts__basic-info > p.date {
  font-size: 11px;
  color: #A0A5B2;
}
@media (min-width: 768px) {
  .parts__basic-info > p.date {
    font-size: 12px;
  }
}
.parts__basic-info .author {
  margin-top: 10px;
}
.parts__basic-info .author p {
  font-size: 12px;
  color: #535A6A;
}
@media (min-width: 768px) {
  .parts__basic-info .author p {
    font-size: 13px;
  }
}
.parts__basic-info .author .js-show-all-author {
  cursor: pointer;
  color: #30AD7D;
  text-decoration: underline;
}
.parts__basic-info .title {
  display: flex;
  align-items: flex-end;
}
.parts__basic-info .title .js-show-all-title {
  cursor: pointer;
  color: #30AD7D;
}
.parts__basic-info .links {
  margin-top: 6px;
  display: flex;
}
.parts__basic-info .links.sp-col {
  flex-direction: column;
  align-items: flex-start;
}
.parts__basic-info .links.sp-col a:nth-child(1) {
  margin-bottom: 6px;
}
@media (min-width: 768px) {
  .parts__basic-info .links.sp-col {
    flex-direction: row;
  }
}
.parts__basic-info .links a {
  display: flex;
  align-items: center;
  padding: 2px 5px;
  background-color: #fff;
  border: 1px solid #EFF0F2;
  font-size: 11px;
  color: #30AD7D;
  margin-right: 7px;
  font-weight: bold;
  white-space: nowrap;
}
.parts__basic-info .links a > img {
  width: 17px !important;
  margin-right: 4px;
}
.parts__basic-info .links a.btn {
  font-weight: normal;
  color: #707070;
}
.parts__basic-info .links a.tag {
  color: #707070;
  font-weight: normal;
  margin-right: 8px;
}
.parts__basic-info .links a.category {
  font-weight: normal;
  border: none;
  color: #fff;
}
.parts__basic-info .links a.category.red {
  background-color: #F2605F;
}
.parts__basic-info .links a.category.yellow {
  background-color: #FFC400;
}
.parts__basic-info .links a.category.orange {
  background-color: #EA9400;
}
.parts__basic-info .links a.category.purple {
  background-color: #B285B3;
}
.parts__basic-info .links a.category.blue {
  background-color: #3E4298;
}
.parts__basic-info .links a.category.sky {
  background-color: #2ca8ff;
}
.parts__basic-info .links a.category.pink {
  background-color: #ff8ab8;
}
.parts__basic-info .image {
  position: relative;
  display: flex;
  align-items: flex-start;
}
.parts__basic-info .image img {
  width: 100%;
}
@media (min-width: 768px) {
  .parts__basic-info .image img {
    max-width: 175px !important;
  }
}
.parts__basic-info .comment {
  position: absolute;
  bottom: 0;
  padding: 4px;
  background-color: #30AD7D;
  max-width: 100%;
}
.parts__basic-info .comment p {
  font-weight: bold;
  position: relative;
  color: #fff;
}
.parts__basic-info .comment p::before {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8px 3.5px 0 3.5px;
  border-color: #30ad7d transparent transparent transparent;
  position: absolute;
  bottom: -12px;
  left: 13px;
}

.parts__more-btn {
  cursor: pointer;
  width: 170px;
  height: 40px;
  border: 3px solid #E9F2F2;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
  transition: all 0.2s;
}
.parts__more-btn:hover {
  background-color: #30AD7D;
}
.parts__more-btn:hover p {
  color: #fff;
}
.parts__more-btn:hover p::before {
  background-image: url(/img/icon/icon_triangle_white.svg);
}
.parts__more-btn p {
  position: relative;
  font-size: 12px;
  margin-left: -15px;
  font-weight: bold;
}
.parts__more-btn p::before {
  display: block;
  content: "";
  position: absolute;
  top: calc(50% - 3px);
  right: -15px;
  width: 8px;
  height: 8px;
  background-image: url(/img/icon/icon_triangle.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  transition: all 0.3s;
}

.parts__accordion-btn {
  cursor: pointer;
  width: 170px;
  height: 40px;
  border: 3px solid #E9F2F2;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
}
.parts__accordion-btn p {
  position: relative;
  font-size: 12px;
  margin-left: -15px;
  font-weight: bold;
}
.parts__accordion-btn p::before {
  display: block;
  content: "";
  position: absolute;
  width: 100%;
  height: 22px;
  top: calc(50% - 3px);
  right: -15px;
  width: 8px;
  height: 8px;
  background-image: url(/img/icon/icon_triangle_below.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.parts__accordion-btn.open p::before {
  transform: rotate(180deg);
}
.parts__accordion-btn.jump p::before {
  transform: rotate(0deg);
}
.parts__accordion-btn.jump:hover {
  background-color: #30AD7D;
}
.parts__accordion-btn.jump:hover p {
  color: #fff;
}
.parts__accordion-btn.jump:hover p::before {
  transform: rotate(90deg);
  background-image: url(/img/icon/icon_triangle_white.svg);
}

.book-info-thumb {
  width: 47.5%;
  margin-bottom: 30px;
}
@media (min-width: 768px) {
  .book-info-thumb {
    margin-right: 30px;
    max-width: 130px;
  }
}
.book-info-thumb .image {
  text-align: center;
}
.book-info-thumb .image.noimage {
  border: 2px solid #fff;
}
.book-info-thumb .image img {
  width: 100%;
}
.book-info-thumb .text {
  margin-top: 10px;
}
.book-info-simple-list {
  display: flex;
  flex-direction: column;
  padding-bottom: 15px;
}
@media (min-width: 768px) {
  .book-info-simple-list {
    align-items: flex-start;
    flex-direction: row;
  }
}
@media (min-width: 768px) {
  .book-info-simple-list > p {
    margin-top: 0;
    margin-right: 20px;
  }
}
.book-info-simple-list > a {
  margin-top: 10px;
}
@media (min-width: 768px) {
  .book-info-simple-list > a {
    margin-top: 0;
    margin-right: 20px;
  }
}
.book-info-simple-list .text {
  display: flex;
  flex-direction: column;
  margin-top: 8px;
}
@media (min-width: 768px) {
  .book-info-simple-list .text {
    margin-top: 0;
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
  }
}
.book-info-simple-list .text p.text-author {
  margin: 6px 0 0;
  font-size: 12px;
  color: #535A6A;
}
@media (min-width: 768px) {
  .book-info-simple-list .text p.text-author {
    margin: 0 15px;
  }
}
@media (min-width: 768px) {
  .book-info-simple-list .links {
    margin-top: 0;
  }
}

@media (min-width: 768px) {
  .filter__nav {
    flex: 0 0 auto;
    width: 100%;
    max-width: 225px;
    margin-right: 50px;
  }
}
.filter__nav .info p:nth-child(1) {
  font-size: 16px;
  font-weight: bold;
}
.filter__nav .info p:nth-child(2) {
  margin-top: 10px;
  font-size: 12px;
}
.filter__nav .filter {
  position: relative;
  background-color: #fff;
  box-sizing: content-box;
  margin-top: 20px;
  width: 100vw;
  margin-left: -20px;
}
@media (min-width: 768px) {
  .filter__nav .filter {
    width: 100%;
    margin-left: 0;
  }
}
.filter__nav .filter-title {
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-top: 2px solid #EFF0F2;
  border-bottom: 2px solid #EFF0F2;
  box-sizing: content-box;
}
@media (min-width: 768px) {
  .filter__nav .filter-title {
    height: 36px;
    border: none;
  }
}
.filter__nav .filter-title.open > p {
  background-color: #30AD7D;
  font-weight: bold;
  color: #fff;
}
.filter__nav .filter-title.open > p::before {
  display: block;
  content: "";
}
.filter__nav .filter-title.open > p::after {
  transform: rotate(-45deg);
}
.filter__nav .filter-title > p {
  position: relative;
  width: 100%;
  font-size: 14px;
  text-align: center;
  line-height: 40px;
  border-right: 2px solid #EFF0F2;
}
@media (min-width: 768px) {
  .filter__nav .filter-title > p {
    font-weight: bold;
    color: #fff;
    line-height: 36px;
    background-color: #30AD7D;
  }
  .filter__nav .filter-title > p::before {
    display: block;
    content: "";
  }
  .filter__nav .filter-title > p::after {
    display: none !important;
  }
}
.filter__nav .filter-title > p::before {
  position: absolute;
  z-index: 2;
  bottom: -8px;
  left: calc(50% - 10px);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 10px 0 10px;
  border-color: #30AD7D transparent transparent transparent;
}
.filter__nav .filter-title > p::after {
  display: block;
  content: "";
  position: absolute;
  z-index: 2;
  top: 40%;
  right: 15px;
  width: 7px;
  height: 7px;
  border-top: 1px solid #ccc;
  border-right: 1px solid #ccc;
  transform: rotate(135deg);
  transition: all 0.3s;
}
.filter__nav .filter-content {
  height: 0;
  opacity: 0;
  position: absolute;
  z-index: 1;
  top: 40px;
  left: 0;
  width: 100vw;
  border: 2px solid #EFF0F2;
  padding: 0 15px 20px;
  background-color: #fff;
  transition: all 0.5s;
}
.filter__nav .filter-content.media {
  padding-top: 30px;
}
.filter__nav .filter-content.open {
  height: 100vh;
  opacity: 1;
}
.filter__nav .filter-content.open .input {
  display: block;
}
.filter__nav .filter-content.open .btn {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media (min-width: 768px) {
  .filter__nav .filter-content {
    width: 100%;
    position: static;
    height: auto;
    opacity: 1;
  }
  .filter__nav .filter-content .input {
    display: block !important;
  }
  .filter__nav .filter-content .btn {
    display: flex !important;
    flex-direction: column;
    align-items: center;
  }
}
.filter__nav .filter-content > p {
  margin-top: 20px;
  font-weight: bold;
  color: #30AD7D;
  font-size: 14px;
}
.filter__nav .filter-content .input {
  display: none;
}
.filter__nav .filter-content > div {
  padding-top: 8px;
}
.filter__nav .filter-content > div input {
  display: none;
}
.filter__nav .filter-content > div input:checked + label::before {
  border-color: #30AD7D;
}
.filter__nav .filter-content > div input:checked + label::after {
  display: block;
}
.filter__nav .filter-content > div label {
  position: relative;
  cursor: pointer;
  padding-left: 25px;
}
.filter__nav .filter-content > div label::before {
  display: block;
  position: absolute;
  content: "";
  top: -1px;
  left: -1px;
  width: 13px;
  height: 13px;
  border: 1.5px solid #AFAFAF;
  border-radius: 3px;
}
.filter__nav .filter-content > div label::after {
  display: none;
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 6.5px;
  height: 3px;
  border-left: 1.5px solid #30AD7D;
  border-bottom: 1.5px solid #30AD7D;
  transform: translate(3px, 3px) rotate(-42deg);
}
.filter__nav .filter-content .btn {
  display: none;
}
.filter__nav .filter-content .btn a.js-close {
  display: inline-block;
  position: relative;
  margin-top: 20px;
  color: #2D313B;
  padding-left: 20px;
}
.filter__nav .filter-content .btn a.js-close::before, .filter__nav .filter-content .btn a.js-close::after {
  display: block;
  content: "";
  position: absolute;
  top: 9px;
  left: 0;
  width: 15px;
  height: 1.5px;
  background-color: #2D313B;
}
.filter__nav .filter-content .btn a.js-close::before {
  transform: rotate(45deg);
}
.filter__nav .filter-content .btn a.js-close::after {
  transform: rotate(-45deg);
}
.filter__nav .filter-content .btn button, .filter__nav .filter-content .btn a.button {
  background-color: #30AD7D;
  color: #fff;
  width: 100%;
  max-width: 240px;
  border: none;
  cursor: pointer;
  height: 40px;
  margin-top: 30px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .filter__nav .filter-content .btn button, .filter__nav .filter-content .btn a.button {
    height: 50px;
  }
}
.filter__nav .filter-content .btn a.button {
  display: flex;
  justify-content: center;
  align-items: center;
}
.filter__nav .filter-content a.media {
  display: block;
  color: #000;
  font-size: 12px;
  margin-top: 15px;
  padding-left: 14px;
  position: relative;
}
.filter__nav .filter-content a.media:first-of-type {
  margin-top: 0;
}
.filter__nav .filter-content a.media::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  background-image: url(/img/icon/icon_triangle.svg) !important;
}
.filter__nav .filter-content a.media:hover {
  color: #30AD7D;
}
.filter__nav .filter-content a.media.active {
  color: #30AD7D;
}
@media (min-width: 768px) {
  .filter__nav .filter-content a.media {
    font-size: 14px;
  }
}

.parts__relating-sites {
  margin-top: 40px;
}
@media (min-width: 768px) {
  .parts__relating-sites {
    margin-top: 80px;
  }
}
.parts__relating-sites__inner {
  margin-top: 30px;
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .parts__relating-sites__inner {
    flex-wrap: wrap;
    flex-direction: row;
    margin-top: 50px;
  }
}
.parts__relating-sites__item {
  width: 100%;
  margin-bottom: 15px;
  background: #fff;
  border: 2px solid #E9F2F2;
}
.parts__relating-sites__item.omit:nth-child(n+7) {
  display: none;
}
.parts__relating-sites__item.omit:nth-child(n+7).open {
  display: block;
}
@media (min-width: 768px) {
  .parts__relating-sites__item {
    width: calc((100% - 20px) / 2);
    margin-right: 20px;
  }
  .parts__relating-sites__item:nth-child(2n) {
    margin-right: 0;
  }
}
@media (min-width: 992px) {
  .parts__relating-sites__item {
    width: calc((100% - 40px) / 3);
    margin-right: 20px;
  }
  .parts__relating-sites__item:nth-child(2n) {
    margin-right: 20px;
  }
  .parts__relating-sites__item:nth-child(3n) {
    margin-right: 0;
  }
}
.parts__relating-sites__item img {
  width: 100%;
}
.parts__relating-sites__item:hover {
  opacity: 0.7;
}
.parts__relating-sites__link {
  width: 100%;
  margin-top: 40px;
  display: flex;
  justify-content: center;
}
.parts__relating-sites__link.top {
  margin-top: 0px;
}

.top__slider {
  padding-top: 45px;
}
@media (min-width: 768px) {
  .top__slider {
    padding-top: 0;
    margin-top: 20px;
    position: relative;
    overflow: hidden;
  }
  .top__slider::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 400px;
    content: "";
    background-image: linear-gradient(to top, #ffffff 5%, #e4eded 95%);
    -webkit-clip-path: polygon(0 300px, 100% 0, 100% 100%, 0 100%);
    clip-path: polygon(0 300px, 100% 0, 100% 100%, 0 100%);
  }
}
.top__slider__title {
  max-width: 1400px;
  width: 100%;
  margin: 0 auto;
}
.top__slider__title h1 {
  max-width: 1280px;
  width: 100%;
  padding: 15px;
  font-size: 16px;
}
@media (min-width: 768px) {
  .top__slider__title h1 {
    font-size: 20px;
    padding: 0 15px 20px;
  }
}
@media (min-width: 1400px) {
  .top__slider__title h1 {
    padding: 0 0 20px;
  }
}
.top__slider__inner {
  position: relative;
  max-width: 1400px;
  width: 100%;
  margin: 0 auto;
  padding: 0 0 30px;
  width: 100%;
}
@media (min-width: 768px) {
  .top__slider__inner {
    padding: 0 0 30px;
  }
}
.top__slider__inner .image {
  width: 100%;
}
.top__slider__inner .image .image-inner {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 300px;
}
@media (min-width: 768px) {
  .top__slider__inner .image .image-inner {
    height: 250px;
  }
}
@media (min-width: 1200px) {
  .top__slider__inner .image .image-inner {
    height: 330px;
  }
}
.top__slider__inner .image .image-inner img {
  height: 100%;
  max-width: 100%;
}
.top__slider__inner .pagination-wrap {
  width: 300px;
  position: relative;
  margin: 10px auto 0;
}
.top__slider__inner .swiper-pagination {
  bottom: -30px !important;
}
.top__slider__inner .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #30AD7D !important;
}
.top__slider__inner .swiper-button-next, .top__slider__inner .swiper-button-prev {
  top: auto !important;
  bottom: -45px;
  color: #A0A5B2 !important;
}
.top__slider__inner .swiper-button-next::after, .top__slider__inner .swiper-button-prev::after {
  font-size: 16px;
}
.top__slider__inner .swiper-button-next, .top__slider__inner .swiper-button-prev, .top__slider__inner .swiper-pagination {
  z-index: 2 !important;
}

.top__temporary-news {
  background-color: #30AD7D;
  padding: 5px 0;
  text-align: center;
  margin-top: 20px;
}
.top__temporary-news p {
  display: inline-block;
  position: relative;
  color: #fff;
  font-size: 12px;
}
.top__temporary-news p::before {
  content: "";
  display: block;
  position: absolute;
  top: 5px;
  left: -13px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 3.5px 0 3.5px 6.1px;
  border-color: transparent transparent transparent #fff;
}

.top__calendar-link {
  display: flex;
  justify-content: center;
  margin-top: 25px;
  padding: 0 20px;
}
@media (min-width: 768px) {
  .top__calendar-link {
    margin-top: 40px;
  }
}
.top__calendar-link a {
  cursor: pointer;
  width: 100%;
  max-width: 360px;
  height: 70px;
  border: 3px solid #E9F2F2;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  background: #fff;
  margin: 0 2px;
  transition: all 0.2s;
}
@media (min-width: 768px) {
  .top__calendar-link a {
    align-items: center;
    margin: 0 10px;
  }
}
.top__calendar-link a p {
  position: relative;
  font-size: 14px;
  margin-bottom: 5px;
  font-weight: bold;
}
@media (min-width: 768px) {
  .top__calendar-link a p {
    margin-right: -15px;
    margin-bottom: 0;
  }
}
.top__calendar-link a p::before {
  display: block;
  content: "";
  position: absolute;
  top: -30px;
  left: calc(50% - 14px);
  width: 25px;
  height: 25px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media (min-width: 768px) {
  .top__calendar-link a p::before {
    top: -20%;
    left: -35px;
    width: 30px;
    height: 30px;
  }
}
.top__calendar-link a:nth-child(1) p::before {
  background-image: url(/img/icon/icon_book.svg);
}
.top__calendar-link a:hover {
  background-color: #30AD7D;
}
.top__calendar-link a:hover p {
  color: #fff;
}
.top__calendar-link a:hover:nth-child(1) p::before {
  background-image: url(/img/icon/icon_book_white.svg);
}

.top__new-release {
  margin-top: 30px;
}
@media (min-width: 768px) {
  .top__new-release {
    margin-top: 80px;
  }
}
.top__new-release .content {
  display: none;
  width: 100%;
  padding: 15px 20px;
}
@media (min-width: 768px) {
  .top__new-release .content {
    width: 88%;
    padding: 0;
  }
}
.top__new-release .content.content_loading {
  display: block;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  margin: 10px auto;
  font-size: 5px;
  position: relative;
  text-indent: -9999em;
  border-top: 5px solid rgba(48, 173, 125, 0.2);
  border-right: 5px solid rgba(48, 173, 125, 0.2);
  border-bottom: 5px solid rgba(48, 173, 125, 0.2);
  border-left: 5px solid #30AD7D;
  transform: translateZ(0);
  -webkit-animation: load 1.1s infinite linear;
  animation: load 1.1s infinite linear;
  padding: 0;
}
.top__new-release .content.content_loading::after {
  border-radius: 50%;
  width: 40px;
  height: 40px;
}
.top__new-release__inner {
  position: relative;
  z-index: 2;
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  padding-bottom: 40px;
}
@media (min-width: 768px) {
  .top__new-release__inner {
    justify-content: flex-start;
    margin-top: 40px;
    padding-bottom: 30px;
  }
}
.top__new-release__item {
  width: 47%;
  margin-bottom: 30px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
@media (min-width: 768px) {
  .top__new-release__item {
    width: calc((100% - 110px) / 3);
    margin-bottom: 100px;
  }
  .top__new-release__item:not(:nth-child(3n)) {
    margin-right: 55px;
  }
}
@media (min-width: 992px) {
  .top__new-release__item {
    width: calc((100% - 220px) / 5);
    margin-bottom: 100px;
  }
  .top__new-release__item:not(:nth-child(3n)) {
    margin-right: 0;
  }
  .top__new-release__item:not(:nth-child(5n)) {
    margin-right: 55px;
  }
}
.top__new-release__item .image img {
  width: 100%;
}
@media (min-width: 768px) {
  .top__new-release__item .image img {
    max-width: 327px;
  }
}
.top__new-release__item .text {
  margin-top: 10px;
}
@media (min-width: 768px) {
  .top__new-release__item .text {
    margin-top: 20px;
  }
}
.top__new-release__link {
  display: flex;
  justify-content: flex-end;
}

.top__all-ranking {
  padding-bottom: 70px;
}
@media (min-width: 768px) {
  .top__all-ranking {
    padding-bottom: 200px;
  }
}
.top__all-ranking__head {
  margin: 20px 0 0;
}
.top__all-ranking__head p {
  color: #30AD7D;
  font-size: 10px;
}
@media (min-width: 768px) {
  .top__all-ranking__head p {
    font-size: 14px;
  }
}
.top__all-ranking__inner {
  position: relative;
  z-index: 2;
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .top__all-ranking__inner {
    justify-content: flex-start;
    margin-top: 20px;
  }
}
.top__all-ranking__item {
  width: 100%;
  margin-bottom: 30px;
  display: flex;
  flex-direction: row;
}
@media (min-width: 768px) {
  .top__all-ranking__item {
    width: 47%;
    flex-direction: column;
    width: calc((100% - 110px) / 3);
  }
  .top__all-ranking__item:not(:nth-child(3n)) {
    margin-right: 55px;
  }
}
@media (min-width: 992px) {
  .top__all-ranking__item {
    width: calc((100% - 220px) / 5);
  }
  .top__all-ranking__item:not(:nth-child(3n)) {
    margin-right: 0;
  }
  .top__all-ranking__item:not(:nth-child(5n)) {
    margin-right: 55px;
  }
}
.top__all-ranking__item .no {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-right: 15px;
  width: 30px;
}
@media (min-width: 768px) {
  .top__all-ranking__item .no {
    margin-right: 0;
    flex-direction: row;
    width: auto;
  }
}
.top__all-ranking__item .no p {
  font-family: "Rubik", sans-serif;
  font-size: 50px;
  color: #30AD7D;
  margin-bottom: 10px;
}
@media (min-width: 768px) {
  .top__all-ranking__item .no p {
    margin-right: 15px;
    margin-bottom: 0;
  }
}
.top__all-ranking__item .image {
  width: 30%;
  margin-right: 15px;
}
@media (min-width: 768px) {
  .top__all-ranking__item .image {
    width: 100%;
    margin-right: 0;
    margin-top: 10px;
  }
}
.top__all-ranking__item .image img {
  width: 100%;
  min-width: 100px;
}
@media (min-width: 768px) {
  .top__all-ranking__item .image img {
    max-width: 175px;
  }
}
.top__all-ranking__item .text {
  margin-top: 10px;
}
@media (min-width: 768px) {
  .top__all-ranking__item .text {
    margin-top: 20px;
  }
}
.top__all-ranking__caution {
  text-align: right;
  font-size: 10px;
  color: #A0A5B2;
}
@media (min-width: 768px) {
  .top__all-ranking__caution {
    font-size: 12px;
  }
}

.top__news-list__wrap {
  margin: 0 auto;
  width: 100%;
  max-width: 840px;
  padding: 0 20px 60px;
}
@media (min-width: 768px) {
  .top__news-list__wrap {
    padding: 0 0 200px;
  }
}
.top__news-list__inner {
  margin-top: 40px;
}
@media (min-width: 768px) {
  .top__news-list__inner {
    margin-top: 80px;
  }
}
.top__news-list__list {
  display: flex;
  flex-direction: column;
}
.top__news-list__item {
  margin-bottom: 30px;
}
.top__news-list__item > div:nth-child(1) {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.top__news-list__item > div:nth-child(1) .tag {
  background-color: #30AD7D;
  color: #fff;
  padding: 3px 10px;
  font-size: 11px;
  margin-right: 10px;
  margin-bottom: 6px;
}
@media (min-width: 768px) {
  .top__news-list__item > div:nth-child(1) .tag {
    margin-bottom: 0;
  }
}
.top__news-list__item > div:nth-child(1) p.date {
  color: #2D313B;
  font-size: 12px;
}
.top__news-list__item > div:nth-child(2) {
  margin-top: 10px;
}
.top__news-list__item > div:nth-child(2) a.title {
  font-size: 13px;
  line-height: 1.7;
}
.top__news-list__item > div:nth-child(2) a.title:hover {
  text-decoration: underline;
}
.top__news-list__link {
  display: flex;
  justify-content: flex-end;
}

.top__recommend__inner {
  position: relative;
  z-index: 2;
  margin-top: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding-bottom: 40px;
}
@media (min-width: 768px) {
  .top__recommend__inner {
    justify-content: flex-start;
    margin-top: 100px;
    padding-bottom: 30px;
  }
}
.top__recommend__item {
  width: 47%;
  margin-bottom: 30px;
}
@media (min-width: 768px) {
  .top__recommend__item {
    width: calc((100% - 110px) / 3);
    margin-bottom: 100px;
  }
  .top__recommend__item:not(:nth-child(3n)) {
    margin-right: 55px;
  }
}
@media (min-width: 992px) {
  .top__recommend__item {
    width: calc((100% - 220px) / 5);
    margin-bottom: 100px;
  }
  .top__recommend__item:not(:nth-child(3n)) {
    margin-right: 0;
  }
  .top__recommend__item:not(:nth-child(5n)) {
    margin-right: 55px;
  }
}
.top__recommend__item .image img {
  width: 100%;
  max-width: 327px;
}
.top__recommend__item .text {
  margin-top: 10px;
}
@media (min-width: 768px) {
  .top__recommend__item .text {
    margin-top: 20px;
  }
}

.top__visualization-info {
  padding-bottom: 70px;
}
@media (min-width: 768px) {
  .top__visualization-info {
    padding-bottom: 200px;
  }
}
.top__visualization-info__inner {
  position: relative;
  z-index: 2;
  margin-top: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .top__visualization-info__inner {
    margin-top: 100px;
  }
}
.top__visualization-info__item {
  width: 47%;
  margin-bottom: 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media (min-width: 992px) {
  .top__visualization-info__item {
    justify-content: center;
    flex-direction: row;
    align-items: flex-start;
  }
  .top__visualization-info__item:nth-child(1), .top__visualization-info__item:nth-child(2) {
    margin-bottom: 100px;
  }
}
.top__visualization-info__item .image {
  position: relative;
  width: 150px;
  height: 150px;
  overflow: hidden;
}
@media (min-width: 992px) {
  .top__visualization-info__item .image {
    margin-right: 25px;
    width: 240px;
    height: 240px;
  }
}
.top__visualization-info__item .image.square > img {
  position: absolute;
  -o-object-fit: contain;
     object-fit: contain;
  filter: blur(0);
  width: 150px;
  height: 150px;
}
@media (min-width: 992px) {
  .top__visualization-info__item .image.square > img {
    width: 240px;
    height: 240px;
  }
}
.top__visualization-info__item .image.square .inner {
  display: none;
}
.top__visualization-info__item .image > img {
  position: absolute;
  width: 150px;
  height: 150px;
  -o-object-fit: cover;
     object-fit: cover;
  filter: blur(8px);
}
@media (min-width: 992px) {
  .top__visualization-info__item .image > img {
    width: 240px;
    height: 240px;
  }
}
.top__visualization-info__item .image .inner {
  width: 150px;
  height: 150px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 2;
  background-color: rgba(255, 255, 255, 0.2);
}
@media (min-width: 992px) {
  .top__visualization-info__item .image .inner {
    width: 240px;
    height: 240px;
  }
}
.top__visualization-info__item .image .inner > img {
  width: 80px;
}
@media (min-width: 992px) {
  .top__visualization-info__item .image .inner > img {
    width: 125px;
  }
}
.top__visualization-info__item .text {
  margin-top: 10px;
  flex: 1;
}
@media (min-width: 992px) {
  .top__visualization-info__item .text {
    margin-top: 0;
  }
}
.top__visualization-info__item .text ul {
  margin-top: 10px;
}
.top__visualization-info__item .text ul li {
  position: relative;
  padding-bottom: 4px;
  padding-left: 15px;
}
.top__visualization-info__item .text ul li::before {
  display: block;
  content: "";
  width: 8px;
  height: 8px;
  position: absolute;
  top: 25%;
  left: 0;
  background-image: url(/img/icon/icon_triangle.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.top__visualization-info__item .text ul a {
  color: #30AD7D;
  font-size: 10px;
}
@media (min-width: 768px) {
  .top__visualization-info__item .text ul a {
    font-size: 13px;
  }
}
.top__visualization-info__item .text ul a:hover {
  text-decoration: underline;
}
.top__visualization-info__item .text h3 {
  font-size: 14px;
  margin-top: 6px;
}
.top__visualization-info__item .text p {
  color: #535A6A;
  font-size: 10px;
  margin-top: 6px;
}
@media (min-width: 768px) {
  .top__visualization-info__item .text p {
    font-size: 13px;
  }
}
.top__visualization-info__link {
  display: flex;
  justify-content: flex-end;
  position: relative;
  z-index: 2;
}
@media (min-width: 768px) {
  .top__visualization-info__link {
    margin-top: 60px;
  }
}

.top__relating-sites__inner {
  margin-top: 30px;
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .top__relating-sites__inner {
    flex-wrap: wrap;
    justify-content: space-between;
    flex-direction: row;
    margin-top: 80px;
  }
}
.top__relating-sites__item {
  width: 100%;
  margin-bottom: 15px;
  background: #fff;
}
@media (min-width: 768px) {
  .top__relating-sites__item {
    width: calc(50% - 7.5px);
  }
}
@media (min-width: 992px) {
  .top__relating-sites__item {
    width: calc(33.3333333333% - 7.5px);
  }
}
.top__relating-sites__item img {
  width: 100%;
}
.top__relating-sites__item:hover {
  opacity: 0.7;
}

.top__web-magazine {
  margin-top: 30px;
}
@media (min-width: 768px) {
  .top__web-magazine {
    margin-top: 50px;
  }
}
.top__web-magazine h2 {
  font-size: 18px;
}
.top__web-magazine__inner {
  margin-top: 30px;
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .top__web-magazine__inner {
    flex-wrap: wrap;
    justify-content: flex-start;
    flex-direction: row;
    margin-top: 30px;
  }
}
.top__web-magazine__item {
  width: 100%;
  margin-bottom: 15px;
  background: #fff;
}
@media (min-width: 768px) {
  .top__web-magazine__item {
    width: calc((100% - 45px) / 4);
  }
}
.top__web-magazine__item img {
  width: 100%;
}
.top__web-magazine__item:not(:nth-child(4n)) {
  margin-right: 15px;
}
.top__web-magazine__item:hover {
  opacity: 0.7;
}

.top__sns-account {
  margin-top: 30px;
  padding-bottom: 50px;
}
@media (min-width: 768px) {
  .top__sns-account {
    margin-top: 50px;
    padding-bottom: 40px;
  }
}
.top__sns-account h2 {
  font-size: 18px;
}
.top__sns-account__inner {
  margin-top: 30px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
@media (min-width: 768px) {
  .top__sns-account__inner {
    justify-content: flex-start;
    flex-direction: row;
    margin-top: 30px;
  }
}
.top__sns-account__item {
  display: flex;
  width: 47%;
  margin-bottom: 20px;
  background: #fff;
}
@media (min-width: 992px) {
  .top__sns-account__item {
    width: calc((100% - 140px) / 3);
    margin-bottom: 40px;
  }
  .top__sns-account__item:not(:nth-child(3n)) {
    margin-right: 70px;
  }
}
.top__sns-account__item .image {
  flex: 0 0 auto;
  margin-right: 10px;
}
@media (min-width: 768px) {
  .top__sns-account__item .image {
    margin-right: 30px;
  }
}
.top__sns-account__item .image img {
  width: 100%;
  max-width: 55px;
}
@media (min-width: 768px) {
  .top__sns-account__item .image img {
    max-width: 130px;
  }
}
.top__sns-account__item .info {
  display: flex;
  flex-direction: column;
}
.top__sns-account__item .info h3 {
  font-size: 12px;
  margin-bottom: 10px;
}
@media (min-width: 768px) {
  .top__sns-account__item .info h3 {
    font-size: 14px;
  }
}
.top__sns-account__item .info .account__item {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  margin-bottom: 13px;
}
.top__sns-account__item .info .account__item a {
  color: #A0A5B2;
  font-size: 10px;
}
.top__sns-account__item .info .account__item a p {
  word-break: break-all;
}
.top__sns-account__item .info .account__item a:nth-child(1) {
  margin-right: 10px;
}
@media (min-width: 768px) {
  .top__sns-account__item .info .account__item a {
    font-size: 13px;
  }
}
.top__sns-account__item .info .account__item a img {
  width: 15px;
}
@media (min-width: 768px) {
  .top__sns-account__item .info .account__item a img {
    width: 30px;
  }
}
.top__sns-account__item .info .account__item a:hover {
  text-decoration: underline;
}
.top__sns-account__link {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  width: 47%;
}
@media (min-width: 768px) {
  .top__sns-account__link {
    width: 100%;
    margin-bottom: 40px;
  }
  .top__sns-account__link:not(:nth-child(3n)) {
    margin-right: 70px;
  }
}

.top__banners__inner {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .top__banners__inner {
    justify-content: flex-start;
    flex-wrap: wrap;
    flex-direction: row;
  }
}
.top__banners__item {
  width: 100%;
  margin-bottom: 15px;
  background: #fff;
}
@media (min-width: 768px) {
  .top__banners__item {
    width: calc((100% - 50px) / 3);
  }
  .top__banners__item:not(:last-child) {
    margin-right: 25px;
  }
}
.top__banners__item img {
  width: 100%;
}
.top__banners__item:hover {
  opacity: 0.7;
}

.kankou-keitai__new-release {
  margin-top: 30px;
}
@media (min-width: 768px) {
  .kankou-keitai__new-release {
    margin-top: 80px;
  }
}
.kankou-keitai__new-release__calendar {
  display: none;
}
@media (min-width: 768px) {
  .kankou-keitai__new-release__calendar {
    display: flex;
    justify-content: flex-end;
  }
}
.kankou-keitai__new-release__calendar a {
  cursor: pointer;
  width: 170px;
  height: 40px;
  border: 3px solid #E9F2F2;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
}
.kankou-keitai__new-release__calendar a:hover p {
  color: #30AD7D;
}
.kankou-keitai__new-release__calendar a p {
  position: relative;
  font-size: 12px;
  color: #707070;
  font-weight: bold;
  margin-right: -15px;
}
.kankou-keitai__new-release__calendar a p::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: -25px;
  width: 20px;
  height: 17px;
  background-image: url(/img/icon/icon_calendar.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.kankou-keitai__new-release__inner {
  position: relative;
  z-index: 2;
  margin-top: 30px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}
@media (min-width: 768px) {
  .kankou-keitai__new-release__inner {
    justify-content: flex-start;
    margin-top: 40px;
  }
}
.kankou-keitai__new-release__item {
  width: 47%;
  margin-bottom: 30px;
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .kankou-keitai__new-release__item {
    width: calc((100% - 110px) / 3);
    margin-bottom: 50px;
  }
  .kankou-keitai__new-release__item:not(:nth-child(3n)) {
    margin-right: 55px;
  }
}
@media (min-width: 992px) {
  .kankou-keitai__new-release__item {
    width: calc((100% - 220px) / 5);
    margin-bottom: 50px;
  }
  .kankou-keitai__new-release__item:not(:nth-child(3n)) {
    margin-right: 0;
  }
  .kankou-keitai__new-release__item:not(:nth-child(5n)) {
    margin-right: 55px;
  }
}
.kankou-keitai__new-release__item .magazine_name {
  font-size: 17px;
  margin-bottom: 6px;
}
.kankou-keitai__new-release__item .image img {
  width: 100%;
}
@media (min-width: 768px) {
  .kankou-keitai__new-release__item .image img {
    max-width: 327px;
  }
}
.kankou-keitai__new-release__item .text {
  margin-top: 10px;
}
@media (min-width: 768px) {
  .kankou-keitai__new-release__item .text {
    margin-top: 20px;
  }
}
.kankou-keitai__new-release__link {
  display: flex;
  justify-content: flex-end;
  position: relative;
  z-index: 1;
}

.kankou-keitai__pickup {
  margin-top: 30px;
}
@media (min-width: 768px) {
  .kankou-keitai__pickup {
    margin-top: 80px;
  }
}
.kankou-keitai__pickup h3 {
  position: relative;
  margin-top: 30px;
  font-size: 18px;
  z-index: 2;
}
@media (min-width: 768px) {
  .kankou-keitai__pickup h3 {
    margin-top: 50px;
  }
}
.kankou-keitai__pickup__inner {
  position: relative;
  z-index: 2;
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .kankou-keitai__pickup__inner {
    justify-content: flex-start;
    margin-top: 30px;
  }
}
.kankou-keitai__pickup__item {
  width: 30%;
  margin-bottom: 30px;
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .kankou-keitai__pickup__item {
    width: calc((100% - 80px) / 4);
    margin-bottom: 30px;
  }
  .kankou-keitai__pickup__item:not(:nth-child(4n)) {
    margin-right: 20px;
  }
}
@media (min-width: 992px) {
  .kankou-keitai__pickup__item {
    width: calc((100% - 100px) / 6);
    margin-bottom: 50px;
  }
  .kankou-keitai__pickup__item:not(:nth-child(4n)) {
    margin-right: 0;
  }
  .kankou-keitai__pickup__item:not(:nth-child(6n)) {
    margin-right: 20px;
  }
}
.kankou-keitai__pickup__item .image img {
  width: 100%;
}
@media (min-width: 768px) {
  .kankou-keitai__pickup__item .image img {
    max-width: 327px;
  }
}
.kankou-keitai__pickup__item .text {
  margin-top: 10px;
}
@media (min-width: 768px) {
  .kankou-keitai__pickup__item .text {
    margin-top: 20px;
  }
}
.kankou-keitai__pickup__link {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: flex-end;
}

.kankou-keitai__news-list {
  margin-top: 80px;
}
.kankou-keitai__news-list__wrap {
  margin: 0 auto;
  width: 100%;
  max-width: 840px;
  padding: 0 20px 0;
}
@media (min-width: 768px) {
  .kankou-keitai__news-list__wrap {
    padding: 0;
  }
}
.kankou-keitai__news-list__inner {
  margin-top: 40px;
}
.kankou-keitai__news-list__col {
  display: flex;
  flex-direction: column;
}
.kankou-keitai__news-list__item {
  margin-bottom: 30px;
}
.kankou-keitai__news-list__item > div:nth-child(1) {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.kankou-keitai__news-list__item > div:nth-child(1) a.category {
  border: 1px solid #30AD7D;
  color: #30AD7D;
  padding: 3px 10px;
  font-size: 11px;
  margin-right: 10px;
  margin-bottom: 6px;
}
@media (min-width: 768px) {
  .kankou-keitai__news-list__item > div:nth-child(1) a.category {
    margin-bottom: 0;
  }
}
.kankou-keitai__news-list__item > div:nth-child(1) a.tag {
  background-color: #30AD7D;
  color: #fff;
  padding: 3px 10px;
  font-size: 11px;
  margin-right: 10px;
  margin-bottom: 6px;
}
@media (min-width: 768px) {
  .kankou-keitai__news-list__item > div:nth-child(1) a.tag {
    margin-bottom: 0;
  }
}
.kankou-keitai__news-list__item > div:nth-child(1) p.date {
  color: #2D313B;
  font-size: 12px;
}
.kankou-keitai__news-list__item > div:nth-child(2) {
  margin-top: 10px;
}
.kankou-keitai__news-list__item > div:nth-child(2) a.title {
  font-size: 13px;
  line-height: 1.7;
}
.kankou-keitai__news-list__item > div:nth-child(2) a.title:hover {
  text-decoration: underline;
}
.kankou-keitai__news-list__keyword {
  background: #E9F2F2;
  margin-top: 20px;
  padding: 20px 0;
}
@media (min-width: 768px) {
  .kankou-keitai__news-list__keyword {
    margin-top: 40px;
  }
}
.kankou-keitai__news-list__keyword-title {
  display: flex;
  justify-content: center;
}
.kankou-keitai__news-list__keyword-title img {
  width: 20px;
  margin-right: 10px;
}
.kankou-keitai__news-list__keyword-title p {
  font-size: 14px;
}
.kankou-keitai__news-list__keyword-list {
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
}
@media (min-width: 768px) {
  .kankou-keitai__news-list__keyword-list {
    justify-content: center;
  }
}
.kankou-keitai__news-list__keyword-list p {
  border: 1px solid #fff;
  cursor: pointer;
  padding: 5px 15px;
  border-radius: 30px;
  background-color: #fff;
  color: #2D313B;
  font-size: 12px;
  margin: 0 10px 10px;
}
.kankou-keitai__news-list__keyword-list p:hover {
  color: #30AD7D;
  border-color: #30AD7D;
}

.kankou-keitai__youtube-account h2 {
  font-size: 18px;
}
.kankou-keitai__youtube-account__inner {
  display: flex;
  flex-direction: column;
  margin-top: 30px;
}
@media (min-width: 768px) {
  .kankou-keitai__youtube-account__inner {
    justify-content: flex-start;
    flex-wrap: wrap;
    flex-direction: row;
  }
}
.kankou-keitai__youtube-account__item {
  width: 100%;
  margin-bottom: 15px;
  background: #fff;
}
@media (min-width: 768px) {
  .kankou-keitai__youtube-account__item {
    width: calc((100% - 50px) / 3);
  }
  .kankou-keitai__youtube-account__item:not(:last-child) {
    margin-right: 25px;
  }
}
.kankou-keitai__youtube-account__item img {
  width: 100%;
}
.kankou-keitai__youtube-account__item p {
  font-size: 14px;
  margin-top: 10px;
  color: #2D313B;
}
.kankou-keitai__youtube-account__item:hover {
  opacity: 0.7;
}

.kankou-keitai__relating-movie {
  margin-top: 40px;
}
@media (min-width: 768px) {
  .kankou-keitai__relating-movie {
    margin-top: 80px;
  }
}
.kankou-keitai__relating-movie h2 {
  font-size: 18px;
}
.kankou-keitai__relating-movie__inner {
  display: flex;
  flex-direction: column;
  margin-top: 30px;
}
@media (min-width: 768px) {
  .kankou-keitai__relating-movie__inner {
    justify-content: flex-start;
    flex-wrap: wrap;
    flex-direction: row;
  }
}
.kankou-keitai__relating-movie__item {
  width: 100%;
  margin-bottom: 15px;
  background: #fff;
}
@media (min-width: 768px) {
  .kankou-keitai__relating-movie__item {
    width: calc((100% - 50px) / 3);
  }
  .kankou-keitai__relating-movie__item:not(:nth-child(3n)) {
    margin-right: 25px;
  }
}
.kankou-keitai__relating-movie__item iframe {
  width: 100%;
  height: 200px;
}
.kankou-keitai__relating-movie__item p {
  font-size: 14px;
  margin-top: 10px;
  color: #2D313B;
}

.kankou-keitai__top-relating-movie {
  margin-top: 40px;
}
@media (min-width: 768px) {
  .kankou-keitai__top-relating-movie {
    margin-top: 80px;
  }
}
.kankou-keitai__top-relating-movie h2 {
  font-size: 18px;
}
.kankou-keitai__top-relating-movie__inner {
  display: flex;
  flex-direction: column;
  margin-top: 30px;
}
@media (min-width: 768px) {
  .kankou-keitai__top-relating-movie__inner {
    justify-content: flex-start;
    flex-wrap: wrap;
    flex-direction: row;
  }
}
.kankou-keitai__top-relating-movie__item {
  width: 100%;
  margin-bottom: 15px;
  background: #fff;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .kankou-keitai__top-relating-movie__item {
    flex-direction: column;
    justify-content: center;
    width: calc((100% - 50px) / 3);
    margin-bottom: 40px;
  }
  .kankou-keitai__top-relating-movie__item:not(:nth-child(3n)) {
    margin-right: 25px;
  }
}
.kankou-keitai__top-relating-movie__item > div {
  width: 48%;
}
@media (min-width: 768px) {
  .kankou-keitai__top-relating-movie__item > div {
    width: 100%;
  }
}
.kankou-keitai__top-relating-movie__item img {
  width: 100%;
}
.kankou-keitai__top-relating-movie__item p {
  font-size: 14px;
  margin-top: 10px;
  color: #2D313B;
}
.kankou-keitai__top-relating-movie__item:hover {
  opacity: 0.7;
}

.content-detail__top {
  margin-top: 40px;
}
.content-detail__top.open {
  z-index: 11;
}
.content-detail__top__modal {
  display: block;
}
.content-detail__top__modal.open {
  z-index: 999;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: #000;
}
.content-detail__top__modal.open .pagination-wrap {
  display: block;
}
@media (min-width: 768px) {
  .content-detail__top__modal.open .swiper-slide img {
    max-width: 1000px;
    width: auto;
    max-height: 100vh !important;
  }
}
.content-detail__top__modal .inner {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 11;
}
.content-detail__top__modal .click-area {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.content-detail__top__modal .swiper {
  max-width: 1000px !important;
  width: 100% !important;
  max-height: 100% !important;
  display: flex;
  justify-content: center;
  align-items: center;
}
.content-detail__top__modal .swiper-slide {
  width: 100%;
  max-height: 100%;
  display: flex;
  justify-content: center;
}
.content-detail__top__modal .swiper-slide img {
  max-width: 330px;
  width: 100%;
}
.content-detail__top__modal .close {
  cursor: pointer;
  position: absolute;
  top: 10px;
  right: 10px;
}
@media (min-width: 768px) {
  .content-detail__top__modal .close {
    top: 15px;
    right: 25px;
  }
}
.content-detail__top__modal .close img {
  width: 25px;
}
@media (min-width: 768px) {
  .content-detail__top__modal .close img {
    width: 40px;
  }
}
.content-detail__top__modal .pagination-wrap {
  display: none;
}
.content-detail__top__modal .pagination-wrap .swiper-button-next, .content-detail__top__modal .pagination-wrap .swiper-button-prev {
  color: #fff;
  width: 40px !important;
  height: 40px !important;
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.6);
}
@media (min-width: 768px) {
  .content-detail__top__modal .pagination-wrap .swiper-button-next, .content-detail__top__modal .pagination-wrap .swiper-button-prev {
    width: 70px !important;
    height: 70px !important;
  }
}
.content-detail__top__modal .pagination-wrap .swiper-button-next:after, .content-detail__top__modal .pagination-wrap .swiper-button-prev:after {
  font-size: 20px;
}
@media (min-width: 768px) {
  .content-detail__top__modal .pagination-wrap .swiper-button-next:after, .content-detail__top__modal .pagination-wrap .swiper-button-prev:after {
    font-size: 50px;
  }
}
.content-detail__top__modal .pagination-wrap .swiper-button-next {
  right: -5px;
}
@media (min-width: 768px) {
  .content-detail__top__modal .pagination-wrap .swiper-button-next {
    right: 0;
  }
}
.content-detail__top__modal .pagination-wrap .swiper-button-prev {
  left: -5px;
}
@media (min-width: 768px) {
  .content-detail__top__modal .pagination-wrap .swiper-button-prev {
    left: 0;
  }
}
.content-detail__top__inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .content-detail__top__inner {
    flex-direction: row;
    justify-content: space-between;
  }
}
.content-detail__top__inner .img-loading {
  width: 100%;
  height: 446px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
}
.content-detail__top__inner .img-loading div {
  display: block;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  margin: 10px auto;
  font-size: 5px;
  position: relative;
  text-indent: -9999em;
  border-top: 8px solid rgba(48, 173, 125, 0.2);
  border-right: 8px solid rgba(48, 173, 125, 0.2);
  border-bottom: 8px solid rgba(48, 173, 125, 0.2);
  border-left: 8px solid #30AD7D;
  transform: translateZ(0);
  -webkit-animation: load 1.1s infinite linear;
  animation: load 1.1s infinite linear;
  padding: 0;
}
.content-detail__top__image {
  margin-top: 10px;
  width: 100%;
  text-align: center;
}
@media (min-width: 768px) {
  .content-detail__top__image {
    width: 31%;
    margin-top: 0;
  }
}
.content-detail__top__image .main {
  overflow: hidden;
  position: relative;
  cursor: pointer;
}
.content-detail__top__image .thumbnails-wrap {
  overflow: hidden;
}
.content-detail__top__image-thumb {
  cursor: pointer;
  position: relative;
  width: calc(20% - 10px);
}
.content-detail__top__image-thumb::before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
}
.content-detail__top__image-thumb.swiper-slide-thumb-active::before {
  background-color: transparent;
}
.content-detail__top__image .thumbnails {
  display: flex;
  margin-top: 20px;
}
.content-detail__top__image .buttons {
  width: 80%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  margin-top: 15px;
}
@media (min-width: 768px) {
  .content-detail__top__image .buttons {
    margin-top: 30px;
  }
}
.content-detail__top__image .buttons a:hover {
  opacity: 0.7;
}
.content-detail__top__image .buttons > a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 60px;
  cursor: pointer;
}
.content-detail__top__image .buttons > a img {
  width: 30px;
  margin-right: 10px;
}
.content-detail__top__image .buttons > a p {
  font-weight: bold;
}
.content-detail__top__image .buttons > a.try {
  background-color: #30AD7D;
}
.content-detail__top__image .buttons > a.try p {
  color: #fff;
  font-size: 18px;
}
.content-detail__top__image .buttons > a.backnumber {
  margin-top: 10px;
  background-color: #E9F2F2;
}
.content-detail__top__image .buttons > a.backnumber p {
  font-size: 18px;
}
.content-detail__top__image .buttons > a.backnumber img {
  width: 18px;
}
.content-detail__top__image .buttons > a.copyUrl {
  cursor: pointer;
  border: 3px solid #E9F2F2;
  background-color: #fff;
}
.content-detail__top__image .buttons > a.copyUrl p {
  font-size: 16px;
  color: #2D313B;
}
.content-detail__top__image .buttons > a.copyUrl:hover {
  opacity: 1;
}
.content-detail__top__image .buttons > a.copyUrl:hover p {
  color: #30AD7D;
}
.content-detail__top__image .buttons > a.copyUrl.copied {
  position: relative;
}
.content-detail__top__image .buttons > a.copyUrl.copied::before {
  -webkit-animation: copied 2s forwards;
          animation: copied 2s forwards;
  position: absolute;
  top: auto;
  bottom: -20px;
  right: 0;
  content: "コピーしました";
  display: block;
  background-color: #30AD7D;
  color: #fff;
  font-size: 12px;
  padding: 5px;
  border-radius: 7px;
}
.content-detail__top__image .buttons > a.copyUrl.copied::after {
  -webkit-animation: copied 2s forwards;
          animation: copied 2s forwards;
  position: absolute;
  top: auto;
  bottom: 8px;
  right: calc(3.5em - 5px);
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 3px 10px 3px;
  border-color: transparent transparent #30AD7D transparent;
}
.content-detail__top__image .buttons > div {
  margin: 15px 0;
  display: flex;
  justify-content: space-between;
}
.content-detail__top__image .buttons > div a {
  width: 49%;
}
.content-detail__top__image .buttons input#copy {
  opacity: 0;
}
.content-detail__top__image-noimages {
  width: 100%;
  width: 330px;
  min-height: 456px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.content-detail__top__image-noimages img {
  max-width: 200px;
  border: 2px solid #fff;
}
.content-detail__top__image-main {
  width: 100%;
  width: 330px;
  min-height: 456px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.content-detail__top__image-thumb {
  width: 100%;
  max-width: 55px;
  min-height: 76px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.content-detail__top__text {
  width: 100%;
}
@media (min-width: 768px) {
  .content-detail__top__text {
    width: 65%;
  }
}
.content-detail__top__text a.category {
  color: #fff !important;
}
.content-detail__top__text a.category.red {
  background-color: #F2605F;
  border-color: #F2605F !important;
}
.content-detail__top__text a.category.yellow {
  background-color: #FFC400;
  border-color: #FFC400 !important;
}
.content-detail__top__text a.category.orange {
  background-color: #EA9400;
  border-color: #EA9400 !important;
}
.content-detail__top__text a.category.purple {
  background-color: #B285B3;
  border-color: #B285B3 !important;
}
.content-detail__top__text a.category.blue {
  background-color: #3E4298;
  border-color: #3E4298 !important;
}
.content-detail__top__text a.category.sky {
  background-color: #2ca8ff;
  border-color: #2ca8ff !important;
}
.content-detail__top__text a.category.pink {
  background-color: #ff8ab8;
  border-color: #ff8ab8 !important;
}
.content-detail__top__text .title .type {
  display: flex;
}
.content-detail__top__text .title .type a {
  height: 20px;
  line-height: 20px;
  box-sizing: border-box;
  width: 80px;
  text-align: center;
  color: #707070;
  border: 2px solid #EFF0F2;
  margin-right: 10px;
}
.content-detail__top__text .title .type a.active {
  position: relative;
  background-color: #30AD7D;
  border-color: #30AD7D;
  color: #fff;
}
.content-detail__top__text .title .type a.active::before {
  display: block;
  content: "";
  position: absolute;
  top: 6px;
  right: 6px;
  height: 3px;
  width: 8px;
  border-left: 1px solid #fff;
  border-bottom: 1px solid #fff;
  transform: rotate(-45deg);
}
.content-detail__top__text .title h2 {
  margin-top: 20px;
  font-size: 22px;
}
.content-detail__top__text .title > p {
  margin-top: 6px;
  font-size: 14px;
}
.content-detail__top__text .info {
  display: flex;
  flex-direction: column;
  margin-top: 20px;
}
.content-detail__top__text .info > p.author {
  display: flex;
  font-weight: 16px;
  font-weight: bold;
}
.content-detail__top__text .info > p.author a:nth-child(2) {
  color: #30AD7D;
}
.content-detail__top__text .info > p.author a:hover {
  text-decoration: underline;
}
.content-detail__top__text .info > p.author span {
  margin-right: 10px;
}
.content-detail__top__text .info a.showall {
  margin: 8px 0;
  position: relative;
  color: #30AD7D;
  font-size: 14px;
}
.content-detail__top__text .info a.showall::before {
  content: "";
  display: block;
  position: absolute;
  top: 5px;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 3.5px 0 3.5px 6.1px;
  border-color: transparent transparent transparent #30AD7D;
}
.content-detail__top__text .info a.showall:hover {
  text-decoration: underline;
}
.content-detail__top__text .info a.showall p {
  padding-left: 10px;
}
.content-detail__top__text .info > p {
  display: flex;
  font-size: 14px;
  margin-bottom: 7px;
}
.content-detail__top__text .info > p.genre a:nth-child(n+2) {
  margin: 0 6px;
  background-color: #fff;
  padding: 2px 6px;
}
.content-detail__top__text .info > p.genre a:nth-child(n+2):hover {
  color: #30AD7D;
}
.content-detail__top__text .info > p.label a:nth-child(n+2):hover {
  color: #30AD7D;
  text-decoration: underline;
}
.content-detail__top__text .info > p.series a:nth-child(n+2):hover {
  color: #30AD7D;
  text-decoration: underline;
}
.content-detail__top__text .info > p span:nth-child(1) {
  font-weight: bold;
}
.content-detail__top__text .detail {
  margin-top: 20px;
}
.content-detail__top__text .detail p {
  font-size: 14px;
  line-height: 1.8;
}
.content-detail__top__text .detail .detail-basic p {
  margin-bottom: 7px;
}
.content-detail__top__text .detail .detail-basic p span:first-child {
  font-weight: bold;
}
.content-detail__top__text .detail p.intro {
  padding: 20px 0;
  border-top: 2px solid #EFF0F2;
  border-bottom: 2px solid #EFF0F2;
  white-space: pre-wrap;
}
@media (min-width: 768px) {
  .content-detail__top__text .detail p.intro {
    padding: 25px 0;
  }
}
.content-detail__top__text .finned p {
  font-size: 20px;
  color: red;
  font-weight: bold;
}
@media (min-width: 768px) {
  .content-detail__top__text .finned p {
    font-size: 26px;
  }
}
.content-detail__top__text .goshop {
  margin-top: 70px;
}
.content-detail__top__text .goshop h3 {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  font-size: 18px;
  margin-bottom: 10px;
}
@media (min-width: 768px) {
  .content-detail__top__text .goshop h3 {
    flex-direction: row;
    align-items: flex-end;
  }
}
.content-detail__top__text .goshop h3 > div {
  display: flex;
  align-items: flex-end;
}
.content-detail__top__text .goshop h3 img {
  width: 30px;
  margin-right: 10px;
}
.content-detail__top__text .goshop h3 span {
  font-size: 14px;
  font-weight: normal;
  margin: 10px 0 0;
}
@media (min-width: 768px) {
  .content-detail__top__text .goshop h3 span {
    margin: 0 0 0 20px;
  }
}
.content-detail__top__text .goshop .links {
  margin-top: 25px;
  display: flex;
  flex-wrap: wrap;
}
.content-detail__top__text .goshop .links a {
  width: calc(50% - 10px);
  margin-bottom: 15px;
  border: 2px solid #E9F2F2;
}
.content-detail__top__text .goshop .links a:not(:nth-child(2n)) {
  margin-right: 10px;
}
@media (min-width: 768px) {
  .content-detail__top__text .goshop .links a {
    width: calc((100% - 45px) / 4);
  }
  .content-detail__top__text .goshop .links a:not(:nth-child(2n)) {
    margin-right: 0;
  }
  .content-detail__top__text .goshop .links a:not(:nth-child(4n)) {
    margin-right: 15px;
  }
}
.content-detail__top__text .goshop .links a img {
  width: 100%;
}
.content-detail__top__text .goshop .links a:nth-child(n+9) {
  display: none;
  transition: all 0.3s;
}
.content-detail__top__text .goshop .links a:nth-child(n+9).show {
  display: block;
}
.content-detail__top__text .goshop .more {
  margin-top: 30px;
  display: flex;
  justify-content: center;
}
.content-detail__top__text .goshop .more.show p::before {
  transform: rotate(225deg);
}
.content-detail__top__text .goshop .more p {
  cursor: pointer;
  display: inline-block;
  position: relative;
  font-size: 14px;
}
@media (min-width: 768px) {
  .content-detail__top__text .goshop .more p {
    font-size: 16px;
  }
}
.content-detail__top__text .goshop .more p::before {
  position: absolute;
  top: 5px;
  right: -20px;
  content: "";
  display: block;
  width: 7px;
  height: 7px;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  transform: rotate(45deg);
  transition: all 0.3s;
}

@-webkit-keyframes copied {
  0% {
    opacity: 1;
  }
  99% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes copied {
  0% {
    opacity: 1;
  }
  99% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.content-detail__promotion__inner {
  margin-top: 30px;
}
@media (min-width: 768px) {
  .content-detail__promotion__inner {
    margin-top: 80px;
  }
}
.content-detail__promotion__inner .text-wrap {
  border-top: 2px solid #EFF0F2;
  border-bottom: 2px solid #EFF0F2;
  padding: 20px 0;
  margin: 0 0 20px;
}
@media (min-width: 768px) {
  .content-detail__promotion__inner .text-wrap {
    padding: 40px 0;
    margin: 0 0 40px;
  }
}
.content-detail__promotion__inner .text-wrap iframe, .content-detail__promotion__inner .text-wrap img {
  max-width: 100%;
}
.content-detail__promotion__inner .banner-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.content-detail__promotion__inner .banner-wrap a {
  width: 100%;
  text-align: center;
  margin: 0 0 20px;
}
@media (min-width: 768px) {
  .content-detail__promotion__inner .banner-wrap a {
    margin: 0 0 30px;
  }
}
.content-detail__promotion__inner .banner-wrap img {
  max-width: 100%;
}

.content-detail__list-promotion__inner {
  margin-top: 30px;
}
@media (min-width: 768px) {
  .content-detail__list-promotion__inner {
    margin-top: 80px;
  }
}
.content-detail__list-promotion__inner > div {
  display: flex;
  flex-direction: column;
  margin-bottom: 20px;
}
@media (min-width: 768px) {
  .content-detail__list-promotion__inner > div {
    flex-direction: row;
    margin-bottom: 40px;
  }
}
.content-detail__list-promotion__inner > div .image {
  text-align: center;
  margin-bottom: 20px;
}
@media (min-width: 768px) {
  .content-detail__list-promotion__inner > div .image img {
    width: 100%;
  }
}
@media (min-width: 768px) {
  .content-detail__list-promotion__inner > div .image {
    margin-right: 20px;
    margin-bottom: 0;
  }
}
.content-detail__list-promotion__inner > div .text h3 {
  color: #30AD7D;
  font-size: 14px;
}
.content-detail__list-promotion__inner > div .text p {
  font-size: 14px;
  line-height: 1.7;
}
.content-detail__list-promotion__inner > div .text p:nth-child(2) {
  font-size: 16px;
  margin: 15px 0;
}
.content-detail__list-promotion__inner > div .text p:last-child {
  margin-top: 30px;
}
.content-detail__list-promotion__bnr {
  display: flex;
  justify-content: center;
  margin-top: 50px;
}
@media (min-width: 768px) {
  .content-detail__list-promotion__bnr {
    margin-top: 100px;
  }
}
.content-detail__list-promotion__bnr img {
  width: 100%;
  max-width: 600px;
}

.content-detail__same-author {
  margin-top: 30px;
  margin-bottom: 40px;
}
@media (min-width: 768px) {
  .content-detail__same-author {
    margin-top: 80px;
  }
}
.content-detail__same-author h3 {
  margin-top: 30px;
  font-size: 18px;
}
@media (min-width: 768px) {
  .content-detail__same-author h3 {
    margin-top: 50px;
  }
}
.content-detail__same-author__inner {
  position: relative;
  z-index: 1;
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
}
@media (min-width: 768px) {
  .content-detail__same-author__inner {
    justify-content: flex-start;
    margin-top: 30px;
  }
}
.content-detail__same-author__item {
  width: calc((100% - 40px) / 3);
  margin-bottom: 30px;
  display: flex;
  flex-direction: column;
}
.content-detail__same-author__item:not(:nth-child(3n)) {
  margin-right: 20px;
}
@media (min-width: 768px) {
  .content-detail__same-author__item {
    width: calc((100% - 80px) / 4);
    margin-bottom: 30px;
  }
  .content-detail__same-author__item:not(:nth-child(3n)) {
    margin-right: 0;
  }
  .content-detail__same-author__item:not(:nth-child(4n)) {
    margin-right: 20px;
  }
}
@media (min-width: 992px) {
  .content-detail__same-author__item {
    width: calc((100% - 100px) / 6);
    margin-bottom: 50px;
  }
  .content-detail__same-author__item:not(:nth-child(4n)) {
    margin-right: 0;
  }
  .content-detail__same-author__item:not(:nth-child(6n)) {
    margin-right: 20px;
  }
}
.content-detail__same-author__item .image img {
  width: 100%;
}
@media (min-width: 768px) {
  .content-detail__same-author__item .image img {
    max-width: 327px;
  }
}
.content-detail__same-author__item .text {
  margin-top: 10px;
}
@media (min-width: 768px) {
  .content-detail__same-author__item .text {
    margin-top: 20px;
  }
}
.content-detail__same-author__link {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: flex-end;
}

.content-detail__news-list {
  margin-top: 70px;
}
.content-detail__news-list h2 {
  font-size: 18px;
}
.content-detail__news-list__inner {
  margin-top: 30px;
}
.content-detail__news-list__list {
  display: flex;
  flex-direction: column;
}
.content-detail__news-list__item {
  margin-bottom: 30px;
}
.content-detail__news-list__item > div:nth-child(1) {
  display: flex;
  align-items: center;
}
.content-detail__news-list__item > div:nth-child(1) p.category {
  border: 1px solid #30AD7D;
  color: #30AD7D;
  padding: 3px 10px;
  font-size: 11px;
  margin-right: 10px;
}
.content-detail__news-list__item > div:nth-child(1) p.tag {
  background-color: #30AD7D;
  color: #fff;
  padding: 3px 10px;
  font-size: 11px;
  margin-right: 10px;
}
.content-detail__news-list__item > div:nth-child(1) p.date {
  color: #2D313B;
  font-size: 12px;
}
.content-detail__news-list__item > div:nth-child(2) {
  margin-top: 10px;
}
.content-detail__news-list__item > div:nth-child(2) a:hover {
  text-decoration: underline;
}

.content-detail__relating-sites {
  margin-top: 20px;
}
@media (min-width: 768px) {
  .content-detail__relating-sites {
    margin-top: 70px;
  }
}
.content-detail__relating-sites h2 {
  font-size: 18px;
}
.content-detail__relating-sites__inner {
  margin-top: 30px;
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .content-detail__relating-sites__inner {
    flex-wrap: wrap;
    flex-direction: row;
  }
}
.content-detail__relating-sites__item {
  width: 100%;
  margin-bottom: 15px;
  background: #fff;
}
@media (min-width: 768px) {
  .content-detail__relating-sites__item {
    width: calc((100% - 50px) / 3);
  }
  .content-detail__relating-sites__item:not(:nth-child(3n)) {
    margin-right: 25px;
  }
}
.content-detail__relating-sites__item img {
  width: 100%;
}

.content-detail__relating-author {
  margin-top: 30px;
  margin-bottom: 40px;
}
@media (min-width: 768px) {
  .content-detail__relating-author {
    margin-top: 80px;
  }
}
.content-detail__relating-author h3 {
  margin-top: 30px;
  font-size: 18px;
}
@media (min-width: 768px) {
  .content-detail__relating-author h3 {
    margin-top: 50px;
  }
}
.content-detail__relating-author__inner {
  position: relative;
  z-index: 2;
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .content-detail__relating-author__inner {
    justify-content: flex-start;
    margin-top: 30px;
  }
}
.content-detail__relating-author__item {
  width: 50%;
  margin-bottom: 30px;
  display: flex;
  align-items: center;
}
.content-detail__relating-author__item:nth-child(n+9) {
  display: none;
}
.content-detail__relating-author__item:nth-child(n+9).open {
  display: block;
}
@media (min-width: 768px) {
  .content-detail__relating-author__item {
    width: 25%;
  }
}
.content-detail__relating-author__item img {
  width: 100%;
  max-width: 80px;
  margin-right: 20px;
}
.content-detail__relating-author__item p {
  font-size: 16px;
}
.content-detail__relating-author__link {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
}
.content-detail__relating-author__flex {
  margin-top: 60px;
  display: flex;
  justify-content: center;
}

.content-detail__try {
  margin-top: 30px;
  margin-bottom: 40px;
}
@media (min-width: 768px) {
  .content-detail__try {
    margin-top: 80px;
  }
}
.content-detail__try h3 {
  margin-top: 30px;
  font-size: 18px;
}
@media (min-width: 768px) {
  .content-detail__try h3 {
    margin-top: 50px;
  }
}
.content-detail__try__inner {
  position: relative;
  z-index: 2;
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
}
@media (min-width: 768px) {
  .content-detail__try__inner {
    justify-content: flex-start;
    margin-top: 30px;
  }
}
.content-detail__try__item {
  width: calc((100% - 40px) / 3);
  margin-bottom: 30px;
  display: flex;
  flex-direction: column;
}
.content-detail__try__item:not(:nth-child(3n)) {
  margin-right: 20px;
}
.content-detail__try__item:nth-child(n+7) {
  display: none;
}
.content-detail__try__item:nth-child(n+7).open {
  display: block;
}
@media (min-width: 768px) {
  .content-detail__try__item {
    width: calc((100% - 80px) / 4);
    margin-bottom: 30px;
  }
  .content-detail__try__item:not(:nth-child(3n)) {
    margin-right: 0;
  }
  .content-detail__try__item:not(:nth-child(4n)) {
    margin-right: 20px;
  }
}
@media (min-width: 992px) {
  .content-detail__try__item {
    width: calc((100% - 100px) / 6);
    margin-bottom: 50px;
  }
  .content-detail__try__item:not(:nth-child(4n)) {
    margin-right: 0;
  }
  .content-detail__try__item:not(:nth-child(6n)) {
    margin-right: 20px;
  }
}
.content-detail__try__item .image img {
  width: 100%;
}
@media (min-width: 768px) {
  .content-detail__try__item .image img {
    max-width: 327px;
  }
}
.content-detail__try__item .text {
  margin-top: 10px;
}
@media (min-width: 768px) {
  .content-detail__try__item .text {
    margin-top: 20px;
  }
}
.content-detail__try__link {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: flex-end;
}

.admin-common__list {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 40px;
}
.admin-common__list th {
  word-break: break-all;
  width: 5%;
  padding-right: 30px;
}
.admin-common__list th span {
  width: 40px;
  height: 40px;
  background-color: #30AD7D;
  display: flex;
  justify-content: center;
  align-items: center;
}
.admin-common__list th span p {
  color: #fff;
  font-size: 24px;
  font-weight: bold;
}
.admin-common__list td {
  word-break: break-all;
}
.admin-common__list td:nth-child(2) {
  width: 75%;
  border: 3px solid #30AD7D;
}
.admin-common__list td:nth-child(3) {
  width: 20%;
  padding-left: 30px;
}
.admin-common__list .is-edit td:nth-child(2) {
  background-color: #E9F2F2;
}
.admin-common__simple-list {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 40px;
}
.admin-common__simple-list th {
  word-break: break-all;
  width: 5%;
  padding-right: 30px;
}
.admin-common__simple-list th span {
  width: 40px;
  height: 40px;
  background-color: #30AD7D;
  display: flex;
  justify-content: center;
  align-items: center;
}
.admin-common__simple-list th span p {
  color: #fff;
  font-size: 24px;
  font-weight: bold;
}
.admin-common__simple-list td {
  word-break: break-all;
}
.admin-common__simple-list td:nth-child(1) {
  width: 75%;
  border: 3px solid #30AD7D;
}
.admin-common__simple-list td:nth-child(2) {
  width: 20%;
  padding-left: 30px;
}
.admin-common__btn-wrap {
  display: flex;
}
.admin-common__btn-wrap button, .admin-common__btn-wrap a {
  margin-right: 10px;
}
.admin-common__edit {
  margin-top: 30px;
}
.admin-common__edit .item {
  display: flex;
  flex-direction: column;
  border-radius: 10px;
  margin-bottom: 20px;
}
.admin-common__edit .item > div {
  font-size: 16px;
}
.admin-common__edit .item > div input[type=text], .admin-common__edit .item > div textarea {
  width: 100%;
  padding: 15px;
  font-size: 16px;
}
.admin-common__edit .item > div select {
  font-size: 16px;
  padding: 7px;
}
.admin-common__edit .item > div:nth-child(1) {
  padding: 5px 15px;
  background-color: #30AD7D;
  color: #fff;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.admin-common__edit .item > div:nth-child(2) {
  padding: 15px;
  border: 1px solid #30AD7D;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
.admin-common__edit .btn-area {
  display: flex;
  justify-content: flex-end;
}
.admin-common__edit .temporary {
  border: 3px solid #30AD7D;
  padding: 10px;
  margin-bottom: 30px;
  display: flex;
}
.admin-common__edit .temporary input {
  padding: 3px 5px;
  border: 2px solid #ccc;
  font-size: 16px;
  width: 100%;
}
.admin-common__edit .temporary label {
  white-space: nowrap;
  font-size: 16px;
}
.admin-common__edit .link-input {
  display: flex;
  flex-direction: column;
  color: #30AD7D;
}
.admin-common__edit .link-input label {
  margin-bottom: 6px;
  font-weight: bold;
}
.admin-common__edit .link-input input, .admin-common__edit .link-input select {
  margin-bottom: 15px;
}
.admin-common__edit .link-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.admin-common__edit .link-label a {
  cursor: pointer;
}
.admin-common__edit .link-label a img {
  width: 30px;
}

.admin__login {
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}
.admin__login-inner {
  background-color: #E9F2F2;
  display: flex;
  flex-direction: column;
  padding: 30px;
}
.admin__login-inner label {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
.admin__login-inner label p {
  width: 100px;
  font-size: 16px;
  font-weight: bold;
  color: #30AD7D;
}
.admin__login-inner label input {
  padding: 3px 5px;
  font-size: 16px;
  border: none;
}
.admin__login-inner .btn {
  margin-top: 20px;
  display: flex;
  justify-content: flex-end;
}
.admin__login-inner .btn button {
  cursor: pointer;
  padding: 5px 20px;
  font-size: 16px;
  background-color: #30AD7D;
  color: #fff;
  border: none;
  border-radius: 5px;
}
.admin__login-inner .btn button:hover {
  background-color: #fff;
  color: #30AD7D;
}

.admin__wrap {
  padding: 0 0 0 300px;
}
.admin__nav {
  position: fixed;
  top: 0;
  left: 0;
  max-width: 300px;
  width: 100%;
  min-height: 100vh;
  height: 100%;
  background-color: #30AD7D;
  overflow: scroll;
}
.admin__nav .logout {
  padding: 10px 30px;
}
.admin__nav .logout button {
  cursor: pointer;
  margin-top: 20px;
  display: flex;
  align-items: center;
  background: none;
  border: none;
}
.admin__nav .logout button img {
  width: 45px;
  margin-right: 10px;
}
.admin__nav .logout button p {
  font-size: 18px;
  font-weight: bold;
  color: #fff;
}
.admin__nav .menu-item {
  padding: 20px 30px;
  border-bottom: 1px solid #fff;
}
.admin__nav .menu-item a {
  cursor: pointer;
}
.admin__nav .menu-item p {
  font-size: 18px;
  color: #fff;
  font-weight: bold;
}
.admin__nav .menu-item ul {
  display: none;
  margin-top: 20px;
  margin-left: 10px;
}
.admin__nav .menu-item ul.open {
  display: block;
}
.admin__nav .menu-item ul li {
  padding-bottom: 15px;
}
.admin__nav .menu-item ul a {
  cursor: pointer;
  color: #fff;
  font-size: 16px;
}
.admin__nav .logo {
  padding: 20px 30px 0;
}
.admin__nav .logo img {
  width: 100%;
  max-width: 150px;
}
.admin__nav .js-menu-link.open {
  position: relative;
}
.admin__nav .js-menu-link.open::before {
  position: absolute;
  top: 4px;
  left: -15px;
  display: block;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6.5px 0 6.5px 11.3px;
  border-color: transparent transparent transparent #fff;
}
.admin__body {
  max-width: 1280px;
  width: 100%;
  padding: 40px 50px;
}
.admin__body .error-p {
  color: red;
  font-size: 16px;
}
.admin__body .input-error {
  color: red;
  font-size: 16px;
}
.admin__body .btn {
  cursor: pointer;
  padding: 10px 25px;
  color: #fff;
  font-size: 18px;
  border-radius: 5px;
  border: none;
}
.admin__body .btn.sm {
  padding: 5px 15px;
  font-size: 16px;
}
.admin__body .btn.yellow {
  background-color: #ffa837;
}
.admin__body .btn.red {
  background-color: #c91715;
}
.admin__body .btn.green {
  background-color: #30AD7D;
}
.admin__body .btn.light_green {
  background-color: #E9F2F2;
  color: #30AD7D;
}
.admin__body .btn.gray {
  background-color: #5e5e5e;
}
.admin__body .btn.white_gray {
  color: #5e5e5e;
  background-color: #d8d7d7;
}
.admin__body .btn:hover {
  opacity: 0.7;
}
.admin__body .btn span {
  font-size: 12px;
}
.admin__body .title {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.admin__body .title h2 {
  color: #30AD7D;
  font-size: 30px;
}
.admin__body .btn-area {
  display: flex;
}
.admin__body .btn-area a:not(:last-child) {
  margin-right: 10px;
}
.admin__body .btn-area button:not(:last-child) {
  margin-right: 10px;
}
.admin__body .btn-wrap {
  display: flex;
}
.admin__body .btn-wrap a:not(:last-child) {
  margin-right: 10px;
}
.admin__body .btn-wrap button:not(:last-child) {
  margin-right: 10px;
}
.admin__body .head {
  margin-top: 50px;
  border-left: 6px solid #30AD7D;
  padding-left: 15px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.admin__body .head h3 {
  color: #30AD7D;
  font-size: 24px;
}
.admin__body .message {
  margin-bottom: 30px;
  font-size: 16px;
  color: red;
}

.admin__body-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.admin__body button {
  cursor: pointer;
  padding: 5px 10px;
  border-radius: 5px;
}

.admin-news__table {
  width: 100%;
  margin-top: 30px;
  border-collapse: collapse;
}
.admin-news__table th, .admin-news__table td {
  padding: 5px 15px;
  font-size: 15px;
}
.admin-news__table th {
  color: #fff;
  text-align: left;
}
.admin-news__table th:first-child {
  width: 30px;
  border-left: 2px solid #30AD7D;
}
.admin-news__table th:nth-child(2) {
  width: 110px;
}
.admin-news__table th:nth-child(3) {
  width: 200px;
}
.admin-news__table th:nth-child(4) {
  width: 120px;
}
.admin-news__table th:nth-child(5) {
  width: 120px;
}
.admin-news__table th:nth-child(6) {
  width: 260px;
}
.admin-news__table th:nth-child(7) {
  width: 130px;
}
.admin-news__table th:nth-child(8) {
  white-space: nowrap;
}
.admin-news__table th:not(:last-child) {
  border-bottom: 2px solid #30AD7D;
  border-right: 2px solid #30AD7D;
  background-color: #30AD7D;
  border-top: 2px solid #30AD7D;
}
.admin-news__table th:last-child {
  width: 200px;
}
.admin-news__table td:first-child {
  text-align: center;
  border-left: 2px solid #30AD7D;
}
.admin-news__table td:nth-child(2) {
  text-align: center;
  white-space: nowrap;
}
.admin-news__table td:nth-child(3) {
  text-align: center;
  padding: 5px;
}
.admin-news__table td:nth-child(7) {
  text-align: center;
}
.admin-news__table td:not(:last-child) {
  border-bottom: 2px solid #30AD7D;
  border-right: 2px solid #30AD7D;
}

.admin-slider__item {
  padding: 15px;
  display: flex;
}
.admin-slider__item .image {
  width: 20%;
  margin-right: 20px;
}
.admin-slider__item .image img {
  width: 100%;
  max-width: 200px;
}
.admin-slider__item .text {
  width: 80%;
}
.admin-slider__item .text table {
  width: 100%;
  border-collapse: collapse;
}
.admin-slider__item .text table tr {
  border-bottom: 1px solid #30AD7D;
}
.admin-slider__item .text table th {
  white-space: nowrap;
  text-align: left;
  color: #30AD7D;
}
.admin-slider__item .text table th, .admin-slider__item .text table td {
  border: none !important;
  padding-bottom: 6px;
}
.admin-slider__input-area {
  width: 100%;
  margin-top: 20px;
}
.admin-slider__input-area .wrap {
  display: flex;
  justify-content: space-between;
}
.admin-slider__input-area .item {
  width: 48%;
  border: 3px solid #30AD7D;
  padding: 20px 30px;
}
.admin-slider__input-area .item > div:first-child {
  padding-bottom: 10px;
}
.admin-slider__input-area .item label {
  font-size: 18px;
}
.admin-slider__input-area .item input[type=text] {
  width: 100%;
  height: 100%;
  font-size: 16px;
  padding: 10px;
}
.admin-slider__input-area .item img {
  width: 100%;
}
.admin-slider__input-area .btn-area {
  margin-top: 30px;
  display: flex;
  justify-content: flex-end;
}
.admin-slider__input-area .btn-area button:nth-child(1) {
  margin-right: 15px;
}

.admin-all_ranking__list {
  margin-top: 30px;
}
.admin-all_ranking__list .item {
  border: 1px solid #30AD7D;
  margin-bottom: 20px;
}
.admin-all_ranking__list .item.mb {
  margin-bottom: 60px;
}
.admin-all_ranking__list .item .content {
  display: flex;
  justify-content: space-between;
  padding: 15px 20px;
}
.admin-all_ranking__list .item .content p {
  font-size: 16px;
}
.admin-all_ranking__list .item .content .ranking {
  display: flex;
  align-items: flex-start;
}
.admin-all_ranking__list .item .content .ranking > div:nth-child(1) {
  background-color: #30AD7D;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  padding: 3px 8px;
}
.admin-all_ranking__list .item .content .ranking > div:nth-child(2) {
  margin-left: 20px;
  display: flex;
  flex-direction: column;
}
.admin-all_ranking__list .item .content .ranking > div:nth-child(2) table {
  width: 100%;
}
.admin-all_ranking__list .item .content .ranking > div:nth-child(2) th, .admin-all_ranking__list .item .content .ranking > div:nth-child(2) td {
  font-size: 16px;
}
.admin-all_ranking__list .item .content .ranking > div:nth-child(2) th {
  white-space: nowrap;
  color: #30AD7D;
  width: 100px;
  text-align: left;
}
.admin-all_ranking__list .item .content .btn-area {
  display: flex;
  align-items: flex-end;
}
.admin-all_ranking__list .label {
  background-color: #30AD7D;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  padding: 7px 20px;
}
.admin-all_ranking__edit {
  margin-top: 40px;
}
.admin-all_ranking__edit .wrap {
  display: flex;
  flex-direction: column;
}
.admin-all_ranking__edit .wrap input[type=text] {
  width: 300px;
}
.admin-all_ranking__edit .wrap h3 {
  border-left: 6px solid #30AD7D;
  padding-left: 15px;
  font-size: 24px;
  color: #30AD7D;
  margin-bottom: 15px;
}
.admin-all_ranking__edit .wrap .item {
  border: 3px solid #30AD7D;
  padding: 20px 30px;
  margin-bottom: 25px;
}
.admin-all_ranking__edit .wrap .item label {
  margin-right: 15px;
}
.admin-all_ranking__edit .wrap .item > div {
  margin-bottom: 10px;
}
.admin-all_ranking__edit .wrap .item > div:nth-child(1) p {
  display: inline-block;
  background-color: #30AD7D;
  color: #fff;
  font-size: 18px;
  padding: 3px 10px;
}
.admin-all_ranking__edit .wrap .item > div:nth-child(2), .admin-all_ranking__edit .wrap .item > div:nth-child(3) {
  display: flex;
}
.admin-all_ranking__edit .wrap .item > div label {
  width: 120px;
  font-size: 18px;
}
.admin-all_ranking__edit .wrap .item > div input, .admin-all_ranking__edit .wrap .item > div select {
  padding: 5px 10px;
  font-size: 16px;
  border: 1px solid #ccc;
}
.admin-all_ranking__edit .wrap .item > div select {
  width: 100px;
}
.admin-all_ranking__edit .wrap.mt {
  margin-top: 70px;
}
.admin-all_ranking__edit .btn-area {
  display: flex;
  justify-content: flex-end;
}
.admin-all_ranking__span {
  border: 3px solid #30AD7D;
  padding: 20px 30px;
  display: flex;
  align-items: center;
}
.admin-all_ranking__span p {
  font-size: 14px;
}
.admin-all_ranking__span > div {
  margin-right: 30px;
}
.admin-all_ranking__span input {
  width: 60px;
  height: 40px;
  padding: 3px 5px;
  font-size: 16px;
  border: 1px solid #ccc;
  margin-right: 10px;
}
.admin-all_ranking__span .flex {
  display: flex;
  justify-content: center;
  align-items: center;
}
.admin-all_ranking__span .flex p:not(:last-child) {
  margin-right: 10px;
}
.admin-all_ranking__span .mt {
  margin-top: 20px;
}
.admin-all_ranking__span .mt p {
  font-size: 30px;
}

.admin-visualization__item {
  padding: 30px;
}
.admin-visualization__item .info {
  display: flex;
}
.admin-visualization__item .info .text {
  height: 100%;
  display: flex;
  align-items: center;
}
.admin-visualization__item .info .text table th {
  vertical-align: top;
  text-align: left;
  white-space: nowrap;
  color: #30AD7D;
  padding-bottom: 10px;
}
.admin-visualization__item .info .text table td {
  border: none !important;
  padding-bottom: 10px;
}
.admin-visualization__item .top__visualization-info__item {
  width: auto;
  margin-bottom: 0;
  justify-content: flex-start;
}
.admin-visualization__link {
  display: flex;
  flex-direction: column;
}
.admin-visualization__link > p {
  background-color: #30AD7D;
  color: #fff;
  margin: 15px 0 10px;
  padding: 3px;
  font-weight: bold;
}
.admin-visualization__link table {
  width: 100%;
  border-collapse: collapse;
}
.admin-visualization__link th {
  text-align: left;
  padding: 0 0 5px;
}
.admin-visualization__link td {
  border: none !important;
  padding: 0 0 5px;
}
.admin-visualization__link td:first-child {
  width: 40%;
  color: #30AD7D;
  padding-right: 10px;
}
.admin-visualization__link td:nth-child(2) {
  width: 40%;
  padding-right: 10px;
}
.admin-visualization__link td:nth-child(3) {
  width: 15%;
  padding-left: 0 !important;
}
.admin-visualization__link tr {
  border-bottom: 1px solid #30AD7D;
}

.admin-recommendation__item {
  padding: 20px 30px;
  display: flex;
  flex-direction: column;
}
.admin-recommendation__item > div {
  display: flex;
}
.admin-recommendation__item > div:first-child {
  padding-bottom: 8px;
}
.admin-recommendation__item > div p {
  font-size: 16px;
}
.admin-recommendation__item > div p:nth-child(1) {
  color: #30AD7D;
  width: 100px;
}
.admin-recommendation__edit {
  margin-top: 40px;
  border: 3px solid #30AD7D;
  padding: 20px 30px;
  display: flex;
  flex-direction: column;
}
.admin-recommendation__edit > div {
  display: flex;
}
.admin-recommendation__edit > div:first-child {
  padding-bottom: 8px;
}
.admin-recommendation__edit > div p {
  font-size: 18px;
  color: #30AD7D;
  width: 120px;
}
.admin-recommendation__edit > div input {
  width: 100%;
  font-size: 16px;
  padding: 3px 5px;
  border: 2px solid #ccc;
}
.admin-sns__item {
  padding: 30px;
  display: flex;
}
.admin-sns__item .image {
  margin-right: 20px;
}
.admin-sns__item .image img {
  max-width: 150px;
  width: 100%;
}
.admin-sns__item .info {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.admin-sns__item .info > div {
  width: 100%;
  display: flex;
  padding-bottom: 6px;
  border-bottom: 1px solid #30AD7D;
}
.admin-sns__item .info > div p {
  font-size: 15px;
}
.admin-sns__item .info > div p:nth-child(1) {
  font-weight: bold;
  width: 150px;
  color: #30AD7D;
}

.admin-movie__item {
  padding: 30px;
  display: flex;
}
.admin-movie__item .movie iframe {
  max-width: 300px;
  height: 200px;
}
.admin-movie__item .text {
  margin-left: 30px;
}
.admin-movie__item .text p {
  font-size: 16px;
}
.admin-movie__item .text p:nth-child(1) {
  color: #30AD7D;
  font-weight: bold;
  padding-bottom: 10px;
}

.admin-pickup__list {
  margin-top: 50px;
  display: flex;
  flex-direction: column;
}
.admin-pickup__list .item {
  border: 3px solid #30AD7D;
  margin-bottom: 30px;
}
.admin-pickup__list .item > p:nth-child(1) {
  background-color: #30AD7D;
  color: #fff;
  font-size: 18px;
  padding: 5px 10px;
}
.admin-pickup__list .item .serials {
  padding: 20px;
}
.admin-pickup__list .item .serials p {
  font-size: 16px;
}
.admin-pickup__list .item .btns {
  margin-top: 30px;
}
.admin-pickup__list p {
  word-break: break-all;
}

.admin-keyword__table {
  margin-top: 40px;
  width: 100%;
  border-collapse: collapse;
  border-left: 3px solid #30AD7D;
}
.admin-keyword__table th:first-child {
  width: 92%;
  background-color: #30AD7D;
  color: #fff;
  text-align: left;
}
.admin-keyword__table th, .admin-keyword__table td {
  font-size: 18px;
  padding: 5px 10px;
}
.admin-keyword__table th:first-child, .admin-keyword__table td:first-child {
  border-bottom: 3px solid #30AD7D;
  border-right: 3px solid #30AD7D;
}
.admin-keyword__search {
  display: flex;
  border: 3px solid #30AD7D;
}
.admin-keyword__search input {
  height: 47px;
  border: none;
  width: 200px;
  padding: 5px 10px;
  font-size: 16px;
}
.admin-keyword__search button {
  border: none;
  background-color: #30AD7D;
  width: 60px;
  border-radius: 0px;
}
.admin-keyword__search button img {
  width: 30px;
}

.admin-book__list {
  width: 100%;
  margin-top: 30px;
  border-collapse: collapse;
}
.admin-book__list th, .admin-book__list td {
  padding: 5px 15px;
  font-size: 15px;
}
.admin-book__list th {
  color: #fff;
  text-align: left;
}
.admin-book__list th:first-child {
  width: 30px;
}
.admin-book__list th:nth-child(2) {
  width: 77%;
}
.admin-book__list th:not(:last-child) {
  background-color: #30AD7D;
  border-right: 2px solid #30AD7D;
  border-left: 2px solid #30AD7D;
}
.admin-book__list td:first-child {
  text-align: center;
}
.admin-book__list td:not(:last-child) {
  border-bottom: 2px solid #30AD7D;
  border-right: 2px solid #30AD7D;
  border-left: 2px solid #30AD7D;
}
.admin-book__list .serial {
  padding: 20px;
  font-size: 16px;
}
.admin-book__edit .is-magazine {
  margin-top: 15px;
}
.admin-book__edit .is-magazine input {
  margin-right: 10px;
}
.admin-book__edit .is-magazine label {
  cursor: pointer;
  font-size: 16px;
}
.admin-book__edit .magazine-area {
  display: none;
}
.admin-book__edit .magazine-area.open {
  display: block;
}
.admin-book__edit .magazine-area label span {
  font-size: 12px;
}
.admin-book__edit .magazine-area .registered-image {
  margin-bottom: 10px;
}
.admin-book__edit .magazine-area .registered-image img {
  width: 100px;
}
.admin-book__modal {
  display: none;
}
.admin-book__modal.open {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.4);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.admin-book__modal .button {
  width: 100%;
  max-width: 900px;
  display: flex;
}
.admin-book__modal .button-inner {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  padding: 0 20px 10px;
  transform: translate(0, -60px);
}
.admin-book__modal .button-inner input {
  font-size: 16px;
  margin-right: 5px;
}
.admin-book__modal .button-inner a {
  white-space: nowrap;
  margin: 0 5px;
}
.admin-book__modal .button input {
  width: 100%;
  padding: 15px;
  font-size: 16px;
}
.admin-book__modal-inner {
  width: 100%;
  max-width: 900px;
  background-color: #fff;
  padding: 50px;
  max-height: 400px;
  overflow: scroll;
}
.admin-book__modal-inner li {
  width: 100%;
  margin-bottom: 35px;
}
.admin-book__modal-inner .box {
  display: flex;
  align-items: center;
}
.admin-book__modal-inner .check {
  width: 5%;
}
.admin-book__modal-inner .label {
  width: 95%;
  border: 3px solid #30AD7D;
  padding: 15px;
}
.admin-book__modal-inner .label label {
  display: flex;
  align-items: center;
}
.admin-book__modal-inner .label img {
  width: 200px;
  margin-right: 20px;
}
.admin-book__modal-inner .text {
  width: 100%;
}
.admin-book__modal-inner .text table {
  width: 100%;
  border-collapse: collapse;
}
.admin-book__modal-inner .text table p {
  font-size: 16px;
}
.admin-book__modal-inner .text table tr {
  border-bottom: 1px solid #30AD7D;
}
.admin-book__modal-inner .text table th {
  white-space: nowrap;
  text-align: left;
  color: #30AD7D;
  width: 120px;
  padding-right: 10px;
}
.admin-book__modal-inner .text table th, .admin-book__modal-inner .text table td {
  border: none !important;
  padding-bottom: 6px;
}
.admin-book__selected {
  display: flex;
  flex-wrap: wrap;
}
.admin-book__selected img {
  margin-bottom: 20px;
  max-width: 200px;
  margin-right: 20px;
}
.admin-book__selected li {
  margin-bottom: 20px;
}
.admin-book__selected .input {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 20px;
}
.admin-book__selected .input input {
  margin-right: 20px;
  height: 34px !important;
  width: 170px !important;
}
.admin-book__selected .list li {
  display: flex;
}
.admin-book__selected .list li p {
  margin-right: 10px;
}

.admin-new_release__caution {
  margin-top: 20px;
  display: flex;
}
.admin-new_release__caution p {
  font-size: 18px;
}
.admin-new_release__caution p:nth-child(1) {
  margin-right: 10px;
}
.admin-new_release__caution p:nth-child(2) {
  font-weight: bold;
  color: red;
}
.admin-new_release__list {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  border-collapse: collapse;
  margin-top: 40px;
}
.admin-new_release__list .item {
  position: relative;
  display: flex;
  flex-direction: column;
  width: calc(20% - 20px);
  margin-bottom: 30px;
  padding: 20px;
  background: #E9F2F2;
}
.admin-new_release__list .item:not(:nth-child(5n)) {
  margin-right: 20px;
}
.admin-new_release__list .item .delete-btn {
  position: absolute;
  top: 0;
  right: 0;
  cursor: pointer;
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.admin-new_release__list .item .delete-btn img {
  width: 30px;
}
.admin-new_release__list .item.is-edit {
  background: rgba(255, 168, 55, 0.6) !important;
  cursor: pointer;
}
.admin-new_release__list .item.target {
  background: #ffa837;
}
.admin-new_release__list .item.enter {
  transform: translateY(10px);
}
.admin-new_release__list .item-inner {
  display: flex;
  flex-direction: column;
}
.admin-new_release__list .item-inner img {
  max-width: 175px;
  width: 100%;
}
.admin-new_release__list .item-inner h3 {
  margin-top: 10px;
}
.admin-new_release__mode {
  margin: 30px 0;
  color: #30AD7D;
  display: flex;
}
.admin-new_release__mode p {
  font-size: 20px;
  font-weight: bold;
  margin-right: 20px;
}
.admin-new_release__index {
  margin-top: 40px;
  display: flex;
  flex-wrap: wrap;
}
.admin-new_release__index .item {
  width: calc((100% - 80px) / 5);
  margin: 0 20px 30px 0;
  border: 2px solid #30AD7D;
}
.admin-new_release__index .item:nth-child(5n) {
  margin-right: 0;
}
.admin-new_release__index .item .inner {
  padding: 20px 10px;
}
.admin-new_release__index .item .inner > p {
  margin-top: 5px;
}
.admin-new_release__index .item .serial {
  background-color: #30AD7D;
  color: #fff;
  padding: 3px 10px;
}
.admin-new_release__index .item .image {
  text-align: center;
}
.admin-new_release__index .item .image img {
  width: 150px;
}
.admin-new_release__index .item h3 {
  margin-top: 20px;
  font-size: 16px;
}
.admin-new_release .search {
  margin: 20px 0;
  display: flex;
  align-items: center;
}
.admin-new_release .search p {
  font-size: 16px;
  margin: 0 10px;
}
.admin-new_release .mode-change {
  margin: 30px 0;
  color: #30AD7D;
}
.admin-new_release .mode-change > p {
  font-size: 20px;
  font-weight: bold;
  margin: 0 0 15px;
}
.admin-new_release .mode-change label {
  cursor: pointer;
  font-size: 18px;
  font-weight: bold;
  margin-right: 20px;
}
.admin-new_release .mode-change label input {
  margin-right: 10px;
}
.admin-new_release .mode-change form {
  margin: 30px 0 0;
}
.admin-new_release .auto_fetch-wrap {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
}
.admin-new_release .auto_fetch-wrap label {
  margin: 0 0 20px;
}
.admin-new_release .auto_fetch-wrap input {
  padding: 3px;
  margin: 10px 0 0;
  font-size: 20px;
}

.admin-sitemap__input-area .wrap {
  margin-top: 40px;
}
.admin-sitemap__input-area textarea {
  margin: 10px auto;
  width: 100%;
  padding: 0.5em;
}
.admin-sitemap__input-area label {
  color: #30AD7D;
  font-weight: bold;
  font-size: 20px;
}

.admin__outlink {
  max-width: 1083px;
  width: 100%;
  margin: 30px auto 0;
  padding: 0 20px;
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  background: #fff;
}
.admin__outlink-inner {
  border-top: 2px solid #E9F2F2;
  border-bottom: 2px solid #E9F2F2;
  display: flex;
  margin: 25px 0;
  padding: 25px 0 0;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
  max-height: 400px;
}
.admin__outlink-inner li {
  padding-bottom: 15px;
  margin: 0 20px 20px 0;
  border-radius: 5px;
}
.admin__outlink-inner li.is-edit {
  background: rgba(255, 168, 55, 0.6) !important;
  cursor: pointer;
}
.admin__outlink-inner li.target {
  background: #ffa837;
}
.admin__outlink-inner li.enter {
  transform: translateY(10px);
}
.admin__outlink-inner li a.text {
  font-size: 13px;
  margin-right: 10px;
}
.admin__outlink-inner li a.text:hover {
  text-decoration: underline;
}
.admin__outlink-inner li a.delete-btn {
  cursor: pointer;
}
.admin__outlink-inner li a.delete-btn img {
  width: 15px;
}
.admin__outlink-inner.open {
  display: block;
}
.admin__outlink-add {
  width: 100%;
  margin: 20px 0;
  display: flex;
  align-items: flex-end;
  border: 2px solid #30AD7D;
  padding: 20px;
}
.admin__outlink-add a {
  white-space: nowrap;
}
.admin__outlink-add-inputs {
  width: 100%;
  padding-right: 20px;
}
.admin__outlink-add-inputs label {
  width: 100%;
  display: flex;
}
.admin__outlink-add-inputs label:nth-child(1) {
  padding-bottom: 7px;
}
.admin__outlink-add-inputs label p {
  font-size: 16px;
  width: 100px;
  font-weight: bold;
}
.admin__outlink-add-inputs label input {
  width: 100%;
  padding: 4px;
}

.admin-site__list {
  display: flex;
  flex-wrap: wrap;
  margin: 40px 0 0;
}
.admin-site__list .item {
  position: relative;
  width: calc((100% - 40px) / 3);
  padding: 20px;
  background: #E9F2F2;
}
.admin-site__list .item:nth-child(3n) {
  margin: 0 0 20px 0;
}
.admin-site__list .item:not(:nth-child(3n)) {
  margin: 0 20px 20px 0;
}
.admin-site__list .item.is-edit {
  background: rgba(255, 168, 55, 0.6) !important;
  cursor: pointer;
}
.admin-site__list .item.target {
  background: #ffa837;
}
.admin-site__list .item.enter {
  transform: translateY(10px);
}
.admin-site__list .image img {
  width: 100%;
}
.admin-site__list .text {
  margin: 10px 0 0;
}
.admin-site__list .text li {
  display: flex;
  padding: 0 0 6px;
}
.admin-site__list .text li span {
  color: #30AD7D;
  font-weight: bold;
  margin: 0 10px 0 0;
  white-space: nowrap;
}
.admin-site__list .text li p {
  word-break: break-all;
}
.admin-site__list .delete {
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
}
.admin-site__list .delete img {
  width: 30px;
}