@charset "UTF-8";
/***********************************************************************
media queries setting
**********************************************************************/
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  /*cursor: none;*/ }

html, body {
  -webkit-text-size-adjust: 100%; }

body {
  color: #2f2f2f;
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  font: 14px source-han-sans-japanese, "ヒラギノ角ゴ W3 JIS2004", Hiragino Kaku Gothic W3 JIS2004, "ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro," メイリオ", Meiryo, Osaka," ＭＳ Ｐゴシック", MS PGothic, sans-serif;
  *font-size: small;
  *font: x-small; }

@media only screen and (max-width: 480px) {
  /*body.home{
  	margin-left: 3px;
  }*/ }
.clearfix:before,
.clearfix:after {
  content: " ";
  display: table; }

.clearfix:after {
  clear: both; }

.clearfix {
  *zoom: 1; }

h1, h2, h3, h4, h5, h6, p, address, ul, ol, li, dl, dt, dd, table, caption, th, td, img, form,
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  margin: 0;
  padding: 0;
  border: none;
  font-style: normal;
  font-weight: normal;
  text-align: left;
  list-style-type: none;
  font-feature-settings: "palt";
  font-display: swap; }

input, select, textarea {
  font-size: 100%; }

img {
  vertical-align: bottom;
  max-width: 100%;
  height: auto;
  outline: none;
  image-rendering: -webkit-optimize-contrast; }

*:focus {
  outline: none; }

hr {
  display: none; }

a {
  text-decoration: none;
  outline: none; }

/* set html5 elements to block */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

.pc {
  display: none !important; }

.sp {
  display: block !important; }

.br-pc {
  display: none; }

.br-sp {
  display: block; }

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

  .sp {
    display: none !important; }

  .br-pc {
    display: block; }

  .br-sp {
    display: none; } }
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box; }

.mb1 {
  margin-bottom: 1em; }

.mb2 {
  margin-bottom: 2em; }

.animsition {
  opacity: 0; }

.fl-builder--layout-has-drafted-changes .animsition {
  opacity: 1 !important; }

.home .slick-prev.slick-arrow
.home .slick-next.slick-arrow {
  display: none; }

.home .main-slider {
  margin: 0 auto 0;
  width: 90%;
  max-width: 1300px; }
  @media only screen and (max-width: 480px) {
    .home .main-slider {
      margin: 0 auto 0; } }
  .home .main-slider li {
    position: relative;
    margin: 0 1px; }
    @media only screen and (max-width: 480px) {
      .home .main-slider li {
        height: 330px; } }
    .home .main-slider li img {
      height: 434px;
      width: 100%;
      object-fit: cover; }
    @media only screen and (max-width: 480px) {
      .home .main-slider li.base-banner img {
        height: inherit; } }
    .home .main-slider li .text {
      background: rgba(0, 0, 0, 0.6);
      color: #fff;
      padding: 3%;
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      line-height: 180%; }
      @media only screen and (max-width: 480px) {
        .home .main-slider li .text {
          padding: 2%; } }
      .home .main-slider li .text .date {
        font-size: 10px; }
      .home .main-slider li .text .work {
        margin-bottom: 6px; }
        @media only screen and (max-width: 480px) {
          .home .main-slider li .text .work {
            margin-bottom: 0; } }
        .home .main-slider li .text .work span {
          background: #fff;
          color: #000;
          display: inline-block;
          font-size: 9px;
          font-family: Verdana,Geneva," sans-serif";
          font-weight: 700;
          padding: 0 8px 1px; }
      .home .main-slider li .text .client {
        font-size: 15px !important; }
        @media only screen and (max-width: 480px) {
          .home .main-slider li .text .client {
            font-size: 14px; } }
  .home .main-slider .slick-prev {
    left: -6%;
    bottom: 39%; }
  .home .main-slider .slick-next {
    right: -6%;
    bottom: 39%; }
.home .project-head {
  font-size: 14px !important;
  margin: 0 !important; }

.wpulike.wpulike-robeen {
  position: fixed;
  left: -1px;
  top: 285px;
  z-index: 999; }
  .wpulike.wpulike-robeen label {
    text-align: center; }
    .wpulike.wpulike-robeen label span {
      margin-top: -22px; }
  .wpulike.wpulike-robeen svg {
    display: block; }

@media (max-width: 980px) {
  .wpulike.wpulike-robeen {
    position: fixed;
    left: 195px;
    top: inherit;
    bottom: -10px; }
    .wpulike.wpulike-robeen label {
      text-align: inherit; }
      .wpulike.wpulike-robeen label span {
        margin-top: 0px;
        margin-left: -8px; }
    .wpulike.wpulike-robeen svg {
      display: inline-block; } }
.power100 {
  max-width: 1200px;
  width: 95%;
  margin: 120px auto 0; }

@media only screen and (max-width: 480px) {
  .power100 {
    margin: 65px auto 0; } }
/******************************************************************
              default
******************************************************************/
#video-background {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -100; }

header {
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(5px);
  padding: 32px 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9; }
  @media (max-width: 480px) {
    header {
      background: none;
      backdrop-filter: blur(0px); } }

.page-template-page-nakamoto100 header,
.term-brandbook header,
.term-novelty header {
  background: #d0121b; }

/*.term-brandbook header,
.term-orizuru header{

}*/
@media only screen and (max-width: 480px) {
  header {
    padding: 21px 0; } }
.logo {
  display: inline-block;
  margin: 0 0 0 4%;
  position: relative;
  z-index: 100; }
  @media only screen and (max-width: 840px) {
    .logo {
      margin-left: 4%; } }
  @media (max-width: 480px) {
    .logo img {
      mix-blend-mode: exclusion; } }

nav {
  position: absolute;
  top: 67%;
  left: 50%;
  width: 100%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%); }
  nav ul {
    /*width: 456px;*/ }
  @media only screen and (max-width: 1300px) {
    nav {
      display: none; } }

nav li {
  margin-left: 32px; }
  @media only screen and (max-width: 820px) {
    nav li {
      margin-left: 12px; } }

nav > ul {
  display: table;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto; }
  nav > ul > li {
    display: table-cell;
    letter-spacing: 2px; }
    nav > ul > li > a {
      color: #2f2f2f; }
    nav > ul > li:hover .sub-menu {
      transition: max-height .5s ease-in;
      max-height: 9999px; }
    nav > ul > li > a {
      display: block;
      padding: 10px 1.75em 38px;
      transition: all .1s ease-in; }
  nav > ul .sub-menu {
    transition: max-height .1s ease-out;
    max-height: 0;
    overflow: hidden;
    width: 100%;
    left: 0;
    text-align: center;
    position: absolute;
    background-color: #fff; }
    nav > ul .sub-menu .menu__second-level {
      position: relative;
      top: 0;
      left: 50%;
      margin-left: -180px;
      padding: 1.5em 0 2em; }
      nav > ul .sub-menu .menu__second-level li {
        margin: 0 0 1em 0;
        position: relative; }
        nav > ul .sub-menu .menu__second-level li:before {
          content: "";
          background: #000;
          display: block;
          position: absolute;
          top: 62%;
          left: -11px;
          height: 1px;
          width: 6px; }
        nav > ul .sub-menu .menu__second-level li:last-child {
          margin-bottom: 0; }
    nav > ul .sub-menu a {
      color: #fff; }

.drawer-menu .blank-link {
  /*margin-top: .7em;
  margin-left: -11px;*/ }
  .drawer-menu .blank-link:hover {
    opacity: .7; }

.drawer-menu .blank-link span {
  padding: 10px 0 13px;
  font-size: 13px; }

.drawer-menu .blank-link a {
  border: 1px solid #757575;
  margin: auto;
  max-width: 230px; }

.drawer-menu .blank-link + .blank-link span {
  padding: 8px 30px 13px; }

#search-form {
  display: flex; }
  #search-form input[type=text] {
    background: #fff;
    border: 1px solid #6f6f6f;
    color: #7f7f7f;
    font-size: 22px;
    padding: 15px 15px 11px; }
    @media only screen and (max-width: 480px) {
      #search-form input[type=text] {
        font-size: 18px;
        padding: 12px 12px 11px; } }
  #search-form button {
    appearance: none;
    background-color: #000;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0 44px; }
    @media only screen and (max-width: 480px) {
      #search-form button {
        padding: 0 25px; } }

#search-modal-drawer {
  font-size: 14px;
  padding: 8px 0px 10px;
  max-width: 230px;
  margin-top: 18px; }
  #search-modal-drawer #search-form input[type=text] {
    font-size: 14px;
    padding: 8px 15px 8px; }
    @media only screen and (max-width: 480px) {
      #search-modal-drawer #search-form input[type=text] {
        font-size: 16px; } }
  #search-modal-drawer #search-form button {
    padding: 0 13px; }

/*search-modal-drawer*/
body.home,
body.term-graphic,
body.term-web,
body.term-ci,
body.term-package,
body.term-other,
body.term-awards,
body.page-template-page-home_renewal {
  /*background:#000;*/ }

.wrapper {
  position: relative;
  max-width: 1700px;
  margin: 0 auto;
  -moz-transition: -moz-opacity 0.3s linear;
  -webkit-transition: -webkit-opacity 0.3s linear;
  -o-transition: -o-opacity 0.3s linear;
  -ms-transition: -ms-opacity 0.3s linear;
  transition: opacity 0.3s linear; }

.home .wrapper {
  max-width: none; }

.container {
  width: 100%;
  margin: 0 auto;
  padding: 140px 0 0;
  position: relative; }
  .container.member {
    padding: 0; }
  .container.member-card {
    padding: 0; }

.crumb {
  display: none; }

.crumb + .container {
  /*padding:50px 0 0;*/
  padding: 150px 0 0; }

@media only screen and (max-width: 480px) {
  .container {
    padding: 70px 0 0; }

  .crumb + .container {
    padding: 70px 0 0; } }
.container.top-margin-none {
  padding: 0; }

.item {
  position: relative; }
  .item .image {
    margin-bottom: 22px; }
    @media (max-width: 480px) {
      .item .image {
        margin-bottom: 12px; } }
  .item .work {
    color: #2f2f2f;
    font-size: 15px;
    margin-bottom: 10px;
    min-height: 50px; }
    @media (max-width: 480px) {
      .item .work {
        font-size: 14px;
        min-height: 40px;
        margin-bottom: 5px; } }
  .item .client {
    color: #757575;
    font-size: 13px;
    position: relative;
    margin-bottom: 10px;
    min-height: 40px; }
    @media (max-width: 480px) {
      .item .client {
        margin: 0 0 5px 0;
        min-height: 0; } }
  .item ul.tags {
    display: flex;
    gap: 5px;
    position: relative;
    z-index: 2;
    flex-wrap: wrap; }
    .item ul.tags li span {
      padding: 3px 7px 5px;
      display: block;
      background-color: #D4D4D4;
      color: #4d4d4d;
      font-size: 12px;
      white-space: nowrap; }
      @media (max-width: 480px) {
        .item ul.tags li span {
          font-size: 10px; } }
  .item:hover {
    cursor: pointer; }
  .item.is-hidden {
    opacity: 0;
    height: 0;
    margin: 0; }
    @media screen and (max-width: 480px) {
      .item.is-hidden {
        display: none; } }

.genres-list {
  margin-bottom: 62px; }
  @media (max-width: 480px) {
    .genres-list {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap; } }
  .genres-list .item-masonry {
    /*min-height: 148px;*/
    min-height: 255px;
    /*height: 370px;*/
    width: 240px;
    margin: 45px;
    position: relative;
    transition: .6s; }
    @media (max-width: 480px) {
      .genres-list .item-masonry {
        min-height: inherit;
        margin: 3%;
        width: 43%;
        /*display: inline-block;*/
        vertical-align: top; } }
    @media (max-width: 480px) {
      .genres-list .item-masonry a {
        display: flex;
        flex-direction: column;
        height: 100%; } }
    .genres-list .item-masonry:hover {
      opacity: .6; }
    .genres-list .item-masonry.web-item-list {
      min-height: 300px; }
      @media (max-width: 480px) {
        .genres-list .item-masonry.web-item-list {
          min-height: inherit; } }
      .genres-list .item-masonry.web-item-list .image {
        margin-bottom: 0; }
        .genres-list .item-masonry.web-item-list .image img {
          height: 225px; }
          @media (max-width: 480px) {
            .genres-list .item-masonry.web-item-list .image img {
              height: 148px; } }
    .genres-list .item-masonry .image {
      margin-bottom: 16px;
      position: relative; }
      @media (max-width: 480px) {
        .genres-list .item-masonry .image {
          margin-bottom: 12px; } }
      .genres-list .item-masonry .image img {
        width: 240px;
        height: 148px;
        object-fit: cover; }
    .genres-list .item-masonry .date {
      color: #757575;
      font-size: 10px;
      letter-spacing: 2px; }
    .genres-list .item-masonry .genres {
      color: #2f2f2f;
      letter-spacing: 2px;
      position: absolute;
      bottom: 0;
      right: 0; }
      .genres-list .item-masonry .genres span {
        background: rgba(255, 255, 255, 0.8);
        display: inline-block;
        font-size: 10px;
        padding: 0 8px 1px; }
    .genres-list .item-masonry .work {
      color: #2f2f2f;
      font-size: 15px;
      margin-bottom: 22px; }
      @media (max-width: 480px) {
        .genres-list .item-masonry .work {
          font-size: 13px;
          margin-bottom: 12px; } }
    .genres-list .item-masonry .client {
      color: #757575;
      font-size: 13px;
      margin-top: auto;
      position: absolute;
      bottom: 0; }
      @media (max-width: 480px) {
        .genres-list .item-masonry .client {
          font-size: 12px;
          position: relative;
          bottom: auto;
          margin-top: auto; } }
    .genres-list .item-masonry:hover {
      cursor: pointer; }
    .genres-list .item-masonry.is-hidden {
      opacity: 0;
      height: 0;
      margin: 0;
      display: none; }
      @media screen and (max-width: 480px) {
        .genres-list .item-masonry.is-hidden {
          display: none; } }

/*genres-list*/
.manga-wrapper {
  /*item-masonry*/ }
  .manga-wrapper .item-masonry {
    margin: 30px;
    width: 180px;
    position: relative;
    overflow: hidden;
    width: 200px;
    height: 216px;
    object-fit: cover; }
    .manga-wrapper .item-masonry img {
      width: 100%;
      width: 100%;
      height: 216px;
      object-fit: cover;
      -moz-transition: -moz-transform 0.3s linear;
      -webkit-transition: -webkit-transform 0.3s linear;
      -o-transition: -o-transform 0.3s linear;
      -ms-transition: -ms-transform 0.3s linear;
      transition: transform 0.3s linear; }
    .manga-wrapper .item-masonry p {
      text-align: right;
      padding: 0 12px 0 0;
      font-size: 12px;
      color: #000;
      line-height: 180%; }
    .manga-wrapper .item-masonry .date {
      font-size: 10px; }
    .manga-wrapper .item-masonry div:not(.hover-parent) {
      background: rgba(255, 255, 255, 0.8);
      position: absolute;
      bottom: 0;
      left: 0;
      padding: 8px 0 6px;
      width: 100%; }
    .manga-wrapper .item-masonry:hover {
      cursor: pointer; }

/*manga-wrapper*/
.item-member {
  margin: 30px;
  width: 180px;
  position: relative;
  overflow: hidden;
  width: 200px;
  height: 200px;
  object-fit: cover; }
  .item-member img {
    width: 100%;
    width: 100%;
    height: 200px;
    object-fit: cover;
    -moz-transition: -moz-transform 0.3s linear;
    -webkit-transition: -webkit-transform 0.3s linear;
    -o-transition: -o-transform 0.3s linear;
    -ms-transition: -ms-transform 0.3s linear;
    transition: transform 0.3s linear; }
  .item-member:hover img {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -o-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05); }
  .item-member:hover .new-mark img, .item-member:hover .award img {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1); }
  .item-member p {
    text-align: right;
    padding: 0 12px 0 0;
    font-size: 12px;
    color: #000;
    line-height: 180%; }
  .item-member .date {
    font-size: 10px; }
  .item-member .work {
    margin-bottom: 1px; }
  .item-member .work span {
    background: #000;
    color: #fff;
    display: inline-block;
    font-size: 9px;
    font-family: Verdana, Geneva," sans-serif";
    font-weight: bold;
    padding: 0 8px 1px; }
  .item-member .client {
    font-size: 12px;
    line-height: 180%; }
  .item-member div:not(.hover-parent) {
    background: rgba(255, 255, 255, 0.8);
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 8px 0 6px;
    width: 100%; }
  .item-member:hover {
    cursor: pointer; }
  .item-member.is-hidden {
    opacity: 0;
    height: 0 !important;
    margin: 0 !important; }
    @media screen and (max-width: 480px) {
      .item-member.is-hidden {
        display: none; } }

#overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  height: 100%;
  display: none;
  background: rgba(0, 0, 0, 0.6); }

.cv-spinner {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center; }

.spinner {
  width: 40px;
  height: 40px;
  border: 4px #ddd solid;
  border-top: 4px #2e93e6 solid;
  border-radius: 50%;
  animation: sp-anime 0.8s infinite linear; }

@keyframes sp-anime {
  100% {
    transform: rotate(360deg); } }
.is-hide {
  display: none; }

.list-more-btn button {
  background: #000;
  border: none;
  color: #fff;
  border-bottom: 1px solid #fff;
  cursor: pointer;
  outline: none;
  padding: 1.7em 0;
  display: block;
  width: 60%;
  margin: 2em auto 7em;
  transition: .2s; }
  @media (max-width: 480px) {
    .list-more-btn button {
      margin: 2em auto 5em; } }
  .list-more-btn button:hover {
    opacity: .7; }
  .list-more-btn button img {
    margin-bottom: 3px;
    margin-left: 10px;
    transform: rotate(90deg);
    width: 16px; }

.list-more-btn.fadeout {
  animation: fadein-keyframes 1s ease 0s 1 forwards; }

@keyframes fadein-keyframes {
  0% {
    opacity: 1;
    height: auto; }
  100% {
    opacity: 0;
    height: 0; } }
.card0 {
  background: #de5d0f; }

.card1 {
  background: #000; }

.card2 {
  background: #ef9aad; }

.card3 {
  background: #ffdd00; }

.card4 {
  background: #e7380d; }

.card5 {
  background: #cc91bd; }

.card6 {
  background: #b29985; }

.card7 {
  background: #0d9b8d; }

.card8 {
  background: #f4af8e; }

.card9 {
  background: #1d2087; }

.card10 {
  background: #22B6C0; }

.card11 {
  background: #ebe7b8; }

.trim {
  display: block;
  overflow: hidden;
  height: 200px;
  position: relative; }
  .trim img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    height: auto; }
    .trim img:hover {
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%); }
  @media screen and (max-width: 480px) {
    .trim {
      height: 190px; } }

.item .award,
.item-member .award,
.item-masonry .award {
  background: #c7a400;
  color: #fff;
  font-size: 10px;
  letter-spacing: 3px;
  padding: 4px 4px 5px 6px;
  position: absolute;
  top: 0;
  left: 0;
  line-height: 100%;
  z-index: 7; }

.item .new-mark,
.item-member .new-mark,
.item-masonry .new-mark {
  background: #fff;
  color: #2f2f2f;
  padding: 4px;
  font-size: 11px;
  letter-spacing: 7px;
  position: absolute;
  top: 0px;
  left: 0px; }

.item .new-mark.member {
  top: 10px;
  left: 0;
  background: #fff;
  padding: 0px 6px 7px 42px;
  width: 38%; }

@media screen and (max-width: 480px) {
  .item .new-mark.member,
  .item-member .new-mark,
  .item-masonry .new-mark {
    /*padding: 6px 27px 14px 45px;
    width: 30%;*/
    font-size: 10px;
    padding: 0px 0px 3px 6px;
    width: auto; }

  .item .new-mark.member img {
    width: 28%;
    top: auto;
    left: auto;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    height: auto; } }
.home .copy-wrapper,
.term-graphic .copy-wrapper,
.term-web .copy-wrapper,
.term-ci .copy-wrapper,
.term-package .copy-wrapper,
.term-other .copy-wrapper,
.term-awards .copy-wrapper,
.search .copy-wrapper {
  background: #000;
  color: #fff; }

.copy-wrapper {
  padding: 3% 0; }
  @media screen and (max-width: 480px) {
    .copy-wrapper {
      padding: 3% 0 15%; } }
  .copy-wrapper h1, .copy-wrapper h2 {
    font-size: 12px;
    letter-spacing: 2px;
    margin-bottom: .5em;
    text-align: center; }
  .copy-wrapper .copy {
    font-size: 9px;
    text-align: center; }

@media screen and (max-width: 900px) {
  .item-member {
    margin: 16px; } }
@media screen and (max-width: 480px) {
  .item-member {
    /*margin: 10px;*/
    margin: 3%;
    width: 43%;
    /*float: left;*/
    display: inline-block;
    vertical-align: middle;
    height: 190px; }
    .item-member img {
      height: auto;
      width: 120%; } }
.item-member {
  -moz-transition: -moz-opacity 0.6s linear;
  -webkit-transition: -webkit-opacity 0.6s linear;
  -o-transition: -o-opacity 0.6s linear;
  -ms-transition: -ms-opacity 0.6s linear;
  transition: opacity 0.6s linear; }

.move {
  opacity: 1.0;
  transform: translate(0, 0);
  -webkit-transform: translate(0, 0); }

/******************************************************************
              実績記事
******************************************************************/
.page-container .inner {
  /*padding: 95px 0 0;*/
  /*padding: 160px 0 0;*/
  padding: 118px 0 0;
  margin: 0 auto 0;
  max-width: 930px;
  width: 90%; }
  @media only screen and (max-width: 480px) {
    .page-container .inner {
      padding: 88px 0 0; } }
  .page-container .inner .main-gra {
    margin-bottom: 4%; }
    .page-container .inner .main-gra img {
      display: block;
      margin: auto;
      height: 610px;
      object-fit: cover; }
      @media only screen and (max-width: 480px) {
        .page-container .inner .main-gra img {
          height: auto; } }
  .page-container .inner .date {
    color: #999899;
    font-size: 10px;
    margin-bottom: .5%; }
  .page-container .inner h1 {
    font-size: 24px;
    margin: 0 0 2%; }
  .page-container .inner .client {
    font-size: 13px !important;
    color: #757575; }
  .page-container .inner .production {
    margin: 4% 0 6%; }
    @media only screen and (max-width: 480px) {
      .page-container .inner .production {
        font-size: 12px; } }
    .page-container .inner .production caption {
      border-bottom: 1px solid #999;
      font-size: 12px;
      padding: 0 0 .5em;
      margin: 0 0 1em; }
    .page-container .inner .production th {
      padding: .15em 2em .15em 0; }
      @media only screen and (max-width: 480px) {
        .page-container .inner .production th {
          padding: .15em 2em .15em 0; } }
    .page-container .inner .production td {
      color: #757575; }
  .page-container .inner article {
    margin-bottom: 10%; }
    .page-container .inner article h2 {
      font-size: 21px;
      margin: 0 0 5% !important; }
      @media only screen and (max-width: 480px) {
        .page-container .inner article h2 {
          font-size: 16px; } }
    .page-container .inner article h3 {
      font-size: 21px;
      margin: 0 0 3% !important; }
    .page-container .inner article p {
      line-height: 220%;
      margin-bottom: 5% !important; }
  .page-container .inner h4,
  .page-container .inner h5 {
    font-size: 21px;
    margin: 10% 0 5% !important;
    text-align: center; }

.manga-template-default .page-container .inner .main-gra img {
  height: inherit; }
.manga-template-default .page-container .inner .item img {
  height: inherit; }

.project-head {
  font-size: 21px;
  margin: 5% 0 3%;
  text-align: center; }

.project-head.margin-none {
  margin: 2% 0 0%; }

.page-template-page-home_renewal .project-head {
  color: #fff; }

.member-list li {
  float: left;
  padding: 2% 0;
  width: 48%;
  -moz-transition: -moz-opacity 0.3s linear;
  -webkit-transition: -webkit-opacity 0.3s linear;
  -o-transition: -o-opacity 0.3s linear;
  -ms-transition: -ms-opacity 0.3s linear;
  transition: opacity 0.3s linear; }
  .member-list li:nth-child(even) {
    float: right; }
  .member-list li:hover {
    cursor: pointer;
    opacity: .9; }
  .member-list li img {
    -webkit-filter: grayscale(0);
    -moz-filter: grayscale(0);
    -ms-filter: grayscale(0);
    -o-filter: grayscale(0);
    filter: grayscale(0); }
  .member-list li:hover img {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%); }
  @media only screen and (max-width: 670px) {
    .member-list li {
      float: none;
      margin: 0 auto;
      padding: 4% 0;
      width: 100%; }
      .member-list li:nth-child(odd) {
        float: none; } }
  .member-list li img {
    float: left;
    margin-right: 3%;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%; }
    @media only screen and (max-width: 480px) {
      .member-list li img {
        width: 25%; } }
  .member-list li .name span {
    color: #999;
    font-size: 10px;
    margin-left: 2em; }
  .member-list li .job {
    font-size: 9px;
    font-family: Verdana, Geneva," sans-serif";
    font-weight: bold;
    margin: 1em 0; }
  .member-list li .comment {
    font-size: 13px;
    line-height: 160%; }
    @media only screen and (max-width: 480px) {
      .member-list li .comment {
        font-size: 12px; } }

.member-list.member li {
  float: none;
  padding: 2% 0 4%; }
  .member-list.member li:hover {
    cursor: auto;
    opacity: 1; }
  .member-list.member li:hover img {
    -webkit-filter: grayscale(0);
    -moz-filter: grayscale(0);
    -ms-filter: grayscale(0);
    -o-filter: grayscale(0);
    filter: grayscale(0); }

.contact-link {
  margin-top: 1.5em; }
  .contact-link p {
    text-align: center; }
  .contact-link a {
    color: #fff;
    display: block;
    font-size: 15px;
    letter-spacing: .08em;
    padding: 24px 32px;
    text-decoration: none;
    text-align: center;
    background: #171a1d;
    margin: 0 auto;
    width: 80%;
    max-width: 312px; }

.hero-image {
  margin: 0 auto;
  margin-top: 86px;
  width: 95%;
  /* スライド アクティブ時 */
  /*swiper-slide*/
  /*recruit-btn*/
  position: relative;
  /*recruit-btn*/ }
  @media (max-width: 480px) {
    .hero-image {
      margin-top: 0;
      width: 100%;
      /*recruit*/
      height: 100svh;
      /*recruit*/ } }
  .hero-image .swiper-slide[class*=-active] .slide-media img {
    transition-delay: 0s;
    transform: scale(1.06); }
  .hero-image .swiper-slide[class*=-active] .slide-title {
    animation: heroimage-fadeIn 2s .5s both; }
  .hero-image .swiper-slide .slide-title {
    position: absolute; }
  .hero-image .swiper-slide .info {
    position: absolute; }
  .hero-image .swiper-slide .item01 .slide-title {
    top: 50%;
    left: 50%;
    margin-left: -62px;
    margin-top: -162px; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item01 .slide-title {
        width: 86px;
        margin-left: -43px;
        margin-top: -114px; } }
  .hero-image .swiper-slide .item01 .info {
    bottom: 3.5%;
    left: 2%; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item01 .info {
        width: 132px; } }
  .hero-image .swiper-slide .item02 .slide-title {
    /*top: 50%;
    left: 50%;
    margin-left: -290px;
    margin-top: -86px;*/
    top: 0;
    left: 0; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item02 .slide-title {
        /*margin-left: -30px;
        margin-top: -143px;*/ } }
    .hero-image .swiper-slide .item02 .slide-title img {
      transform: scale(1.06);
      width: 100%;
      height: 86svh;
      object-fit: cover; }
      @media (max-width: 480px) {
        .hero-image .swiper-slide .item02 .slide-title img {
          height: 100svh; } }
  .hero-image .swiper-slide .item02 .info {
    bottom: 3.5%;
    left: 2%; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item02 .info {
        left: 3.5%; } }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item02 .info img {
        width: 137px; } }
  .hero-image .swiper-slide .item03 .slide-title {
    top: 9%;
    left: 7%; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item03 .slide-title {
        width: 210px; } }
  .hero-image .swiper-slide .item03 .info {
    bottom: 14%;
    right: 9%; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item03 .info {
        bottom: 10%;
        right: 5%;
        width: 88px; } }
  .hero-image .swiper-slide .item04 .slide-title {
    top: 0;
    left: 0; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item04 .slide-title {
        top: auto;
        bottom: 12%;
        left: 0;
        width: 100%; } }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item04 .slide-title img {
        width: 100%; } }
  .hero-image .swiper-slide .item04 .info {
    bottom: 7%;
    left: 5%; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item04 .info {
        width: 250px; } }
  .hero-image .swiper-slide .item05 .slide-title {
    top: 50%;
    left: 15%;
    /*left: 50%;
    margin-left: -650px;*/
    margin-top: -50px; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item05 .slide-title {
        left: 50%;
        margin-left: -112px; } }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item05 .slide-title img {
        width: 225px; } }
  .hero-image .swiper-slide .item05 .info {
    bottom: 3.5%;
    left: 2%; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item05 .info {
        left: auto;
        right: 3%;
        width: 142px; } }
  .hero-image .swiper-slide .item06 .slide-title {
    bottom: 24%;
    right: 10%; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item06 .slide-title {
        bottom: auto;
        right: auto;
        top: 50%;
        left: 50%;
        margin-left: -156px;
        margin-top: -88px; } }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item06 .slide-title img {
        width: 312px; } }
  .hero-image .swiper-slide .item06 .info {
    bottom: 9%;
    right: 8%; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item06 .info {
        bottom: 10%;
        right: auto;
        left: 50%;
        margin-left: -160px; } }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item06 .info img {
        width: 310px; } }
  .hero-image .swiper-slide .item07 .slide-title {
    top: 16%;
    right: 10%; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item07 .slide-title {
        top: 20%;
        left: 50%;
        margin-left: -105px; } }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item07 .slide-title img {
        width: 210px; } }
  .hero-image .swiper-slide .item07 .info {
    bottom: 3.5%;
    left: 2%; }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item07 .info {
        bottom: 8%; } }
    @media (max-width: 480px) {
      .hero-image .swiper-slide .item07 .info img {
        width: 184px; } }
  .hero-image .slide-media {
    height: calc(95svh - 86px);
    position: relative;
    overflow: hidden; }
    @media (max-width: 480px) {
      .hero-image .slide-media {
        height: 100svh;
        /*recruit*/
        height: calc(100svh - 100px);
        /*recruit*/ } }
  .hero-image .slide-media img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: 1.5s 1s ease-in-out;
    transition: 1.5s 1s ease-in-out; }
  .hero-image .recruit-btn {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1; }
    @media (max-width: 480px) {
      .hero-image .recruit-btn {
        top: inherit;
        bottom: 18px;
        text-align: center;
        width: 100%; } }
    .hero-image .recruit-btn a {
      background: #fff;
      display: inline-block;
      padding: 15px 45px 20px 30px;
      position: relative; }
      @media (max-width: 480px) {
        .hero-image .recruit-btn a {
          border: 1px solid #000;
          padding: 15px 55px 20px 40px;
          max-width: 255px;
          width: 90%; } }
      .hero-image .recruit-btn a::before {
        content: "";
        margin-left: 5px;
        width: 7px;
        height: 7px;
        display: block;
        border-top: 1px solid #000;
        border-right: 1px solid #000;
        transform: rotate(45deg);
        transition: right .3s ease;
        position: absolute;
        right: 22px;
        top: calc(50% - 4px); }
        @media (max-width: 480px) {
          .hero-image .recruit-btn a::before {
            right: 27px; } }
      .hero-image .recruit-btn a:hover::before {
        right: 17px; }
        @media (max-width: 480px) {
          .hero-image .recruit-btn a:hover::before {
            right: 27px; } }
    .hero-image .recruit-btn span {
      background: linear-gradient(transparent 0%, transparent 65%, #ff0 65%, #ff0 95%, transparent 95%, transparent 100%);
      color: #000;
      display: inline-block;
      font-size: 17px;
      letter-spacing: .05em; }

/*hero-image*/
@keyframes heroimage-fadeIn {
  0% {
    transform: scale(0.5);
    opacity: 0;
    filter: blur(600px); }
  100% {
    transform: scale(1);
    opacity: 1;
    filter: blur(0); } }
.scroll-container {
  position: absolute;
  width: 24px;
  height: 24px;
  bottom: 10%;
  left: 50%;
  margin-left: -12px;
  z-index: 9; }
  @media (max-width: 480px) {
    .scroll-container {
      bottom: 5%;
      /*recruit*/
      bottom: calc(5% + 100px);
      /*recruit*/ } }
  .scroll-container .chevron {
    position: absolute;
    width: 28px;
    height: 1px;
    opacity: 0;
    transform: scale3d(0.5, 0.5, 0.5);
    animation: move 3s ease-out infinite; }
  .scroll-container .chevron:first-child {
    animation: move 3s ease-out 1s infinite; }
  .scroll-container .chevron:nth-child(2) {
    animation: move 3s ease-out 2s infinite; }
  .scroll-container .chevron:before,
  .scroll-container .chevron:after {
    content: ' ';
    position: absolute;
    top: 0;
    height: 100%;
    width: 51%;
    background: #fff; }
  .scroll-container .chevron:before {
    left: 0;
    transform: skew(0deg, 30deg); }
  .scroll-container .chevron:after {
    right: 0;
    width: 50%;
    transform: skew(0deg, -30deg); }
@keyframes move {
  25% {
    opacity: 1; }
  33% {
    opacity: 1;
    transform: translateY(30px); }
  67% {
    opacity: 1;
    transform: translateY(40px); }
  100% {
    opacity: 0;
    transform: translateY(55px) scale3d(0.5, 0.5, 0.5); } }
  .scroll-container .text {
    display: block;
    margin-top: 75px;
    margin-left: -30px;
    font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
    font-size: 12px;
    color: #fff;
    text-transform: uppercase;
    white-space: nowrap;
    opacity: .25;
    animation: pulse 2s linear alternate infinite; }
    @media (max-width: 480px) {
      .scroll-container .text {
        display: none; } }
@keyframes pulse {
  to {
    opacity: 1; } }
/*scroll-container*/
.top-tobira {
  background-image: url("../images/tobira/door-open.png");
  background-repeat: no-repeat;
  background-size: 75px 60px;
  width: 75px;
  height: 60px;
  margin: 80px auto 0;
  position: relative;
  z-index: 1; }
  .top-tobira a {
    background-image: url("../images/tobira/door.png");
    background-repeat: no-repeat;
    background-size: 75px 60px;
    display: block;
    width: 75px;
    height: 60px; }
    .top-tobira a:hover {
      background-image: url("../images/tobira/door-open.png"); }
  .top-tobira.change a {
    background-image: url("../images/tobira/door-anim.webp");
    background-size: 75px 60px; }

.pulse-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background-color: #e5e5e5;
  box-shadow: 0 0 20px #ccc;
  cursor: pointer;
  z-index: -1; }

.pulse-btn::before, .pulse-btn::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  border: 1px solid #ccc;
  border-radius: 50%;
  box-sizing: border-box;
  pointer-events: none;
  animation: pulsate 2s linear infinite; }

.pulse-btn::after {
  animation-delay: 1s; }

@keyframes pulsate {
  0% {
    transform: scale(1);
    opacity: 1; }
  100% {
    transform: scale(2);
    opacity: 0; } }
.concept-wrapper {
  /*margin-top: 158px;*/
  margin-top: 80px; }
  @media (max-width: 480px) {
    .concept-wrapper {
      margin-top: 48px; } }
  .concept-wrapper .head {
    font-size: 34px;
    letter-spacing: 3px;
    line-height: 180%;
    text-align: center; }
    @media (max-width: 480px) {
      .concept-wrapper .head {
        font-size: 20px; } }
    .concept-wrapper .head + p {
      line-height: 255%;
      margin-top: 35px;
      text-align: center; }

/*concept-wrapper*/
.top-head-wrapper {
  margin: 160px 0 60px; }
  @media (max-width: 480px) {
    .top-head-wrapper {
      margin: 65px 0 24px; } }
  .top-head-wrapper .en {
    font-size: 16px;
    margin-bottom: 23px;
    text-align: center; }
    @media (max-width: 480px) {
      .top-head-wrapper .en {
        font-size: 12px;
        margin-bottom: 9px; } }
  .top-head-wrapper .head {
    font-size: 24px;
    text-align: center; }
    @media (max-width: 480px) {
      .top-head-wrapper .head {
        font-size: 18px; } }
    .top-head-wrapper .head span {
      display: inline-block;
      padding-bottom: 20px;
      position: relative; }
      @media (max-width: 480px) {
        .top-head-wrapper .head span {
          padding-bottom: 16px; } }
      .top-head-wrapper .head span::before {
        content: "";
        background: #757575;
        height: 1px;
        width: 36px;
        position: absolute;
        left: 50%;
        bottom: 0;
        margin-left: -18px; }
  .top-head-wrapper.topics {
    margin-top: 0; }
  .top-head-wrapper.graphic .en span {
    color: #c489b5; }
  .top-head-wrapper.web .en span {
    color: #bbce00; }
  .top-head-wrapper.ci .en span {
    color: #00a170; }
  .top-head-wrapper.package .en span {
    color: #e25f00; }
  .top-head-wrapper.awards .en span {
    color: #aa9180; }

/*top-head-wrapper*/
.single-members .top-head-wrapper {
  margin: 160px 0 60px; }
  @media (max-width: 480px) {
    .single-members .top-head-wrapper {
      margin: 65px 0 24px; } }
.single-members .genres-list .item-masonry .client {
  position: relative;
  margin-bottom: 10px;
  min-height: 40px;
  bottom: auto; }
.single-members .genres-list .item-masonry ul {
  display: flex;
  gap: 5px;
  position: relative;
  z-index: 2;
  flex-wrap: wrap; }
  .single-members .genres-list .item-masonry ul li span {
    padding: 3px 7px 5px;
    display: block;
    background-color: #D4D4D4;
    color: #4D4D40;
    font-size: 12px;
    white-space: nowrap; }
    @media (max-width: 480px) {
      .single-members .genres-list .item-masonry ul li span {
        font-size: 10px; } }

.topics-wrapper {
  background: #e3e4d4;
  padding: 104px 0 94px;
  margin: 115px 0 0;
  /*inner*/ }
  @media (max-width: 480px) {
    .topics-wrapper {
      padding: 47px 0 32px;
      margin: 65px 0 0; } }
  .topics-wrapper .inner {
    margin: 0 auto;
    max-width: 1100px;
    /*topics-list*/ }
    @media (max-width: 480px) {
      .topics-wrapper .inner .top-head-wrapper {
        margin: 0px 0 42px; } }
    .topics-wrapper .inner .topics-list {
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      /*li*/ }
      @media (max-width: 480px) {
        .topics-wrapper .inner .topics-list {
          display: block;
          margin: 0 auto;
          width: 85%; } }
      .topics-wrapper .inner .topics-list li {
        margin-bottom: 52px;
        width: 48%; }
        @media (max-width: 480px) {
          .topics-wrapper .inner .topics-list li {
            margin-bottom: 27px;
            width: 100%; } }
        .topics-wrapper .inner .topics-list li a {
          color: #2f2f2f; }
        .topics-wrapper .inner .topics-list li .flex {
          display: flex; }
          .topics-wrapper .inner .topics-list li .flex .image {
            width: 35%; }
            @media (max-width: 480px) {
              .topics-wrapper .inner .topics-list li .flex .image {
                width: 40%; } }
            .topics-wrapper .inner .topics-list li .flex .image img {
              width: 204px;
              height: 105px;
              object-fit: cover; }
              @media (max-width: 480px) {
                .topics-wrapper .inner .topics-list li .flex .image img {
                  width: 120px; } }
          .topics-wrapper .inner .topics-list li .flex .text {
            margin-left: 5%;
            width: 60%; }
            @media (max-width: 480px) {
              .topics-wrapper .inner .topics-list li .flex .text {
                width: 55%; } }
            .topics-wrapper .inner .topics-list li .flex .text .date {
              color: #757575;
              font-size: 12px;
              margin-bottom: 9px; }
            .topics-wrapper .inner .topics-list li .flex .text .article-title {
              font-size: 15px; }

/*topics-wrapper*/
.article-list .topics-wrapper {
  background: none;
  padding: 0 0 0;
  margin: 115px 0 0; }
  @media (max-width: 480px) {
    .article-list .topics-wrapper {
      margin: 47px 0 0; } }
  .article-list .topics-wrapper .head {
    color: #2f2f2f;
    text-align: center; }
  .article-list .topics-wrapper .inner {
    margin: 0 auto;
    max-width: 1100px;
    padding: 0; }
    .article-list .topics-wrapper .inner .topics-list {
      justify-content: flex-start; }
      .article-list .topics-wrapper .inner .topics-list li {
        width: 32%;
        margin-right: 2%; }
        @media (max-width: 480px) {
          .article-list .topics-wrapper .inner .topics-list li {
            width: 100%; } }
        .article-list .topics-wrapper .inner .topics-list li:nth-child(3n) {
          margin-right: 0; }
        .article-list .topics-wrapper .inner .topics-list li .article-title {
          border: none;
          padding: 0; }
        .article-list .topics-wrapper .inner .topics-list li h4 {
          text-align: left; }

/*article-list*/
.top-gokan {
  margin-top: 160px; }
  @media (max-width: 480px) {
    .top-gokan {
      margin-top: 72px; } }
  .top-gokan div {
    margin: auto;
    max-width: 538px;
    width: 90%; }
    .top-gokan div img {
      display: block;
      margin: auto; }
  .top-gokan p {
    margin: 62px auto 0;
    max-width: 209px;
    width: 80%; }
    @media (max-width: 480px) {
      .top-gokan p {
        margin-top: 24px; } }

/*top-gokan*/
/*.top-slider{ 
	opacity: 0; 
	transition: opacity .3s linear; 
} 
.top-slider.slick-initialized{ 
	opacity: 1;
}*/
.swiper-wrapper {
  transition-timing-function: linear; }

.top-slider .slick-track {
  display: flex;
  flex-direction: column; }
.top-slider .slick-slide {
  min-height: 148px;
  width: 240px; }
.top-slider .swiper-slide {
  height: auto; }
.top-slider .item {
  transition: .4s;
  /*width: 240px;*/
  width: 266px; }
  .top-slider .item .item-inner {
    margin: 13px;
    padding-bottom: 2em;
    height: 100%; }
  .top-slider .item .work {
    margin-bottom: 0; }
  .top-slider .item .image img {
    width: 240px;
    height: 148px;
    object-fit: cover; }
  .top-slider .item .image + div {
    /*display: flex;
    flex-direction: column;*/ }
  .top-slider .item .client {
    /*margin-top: auto;*/
    position: relative;
    bottom: 0; }
  .top-slider .item:hover {
    opacity: .6; }

/*top-slider*/
.top-slider.web .item .image {
  margin-bottom: 0; }
  .top-slider.web .item .image img {
    height: 225px; }

/*top-slider.web*/
.link-page {
  margin-top: 45px;
  text-align: center; }
  @media (max-width: 480px) {
    .link-page {
      margin-top: 24px; } }
  .link-page a {
    /*background: #fff;*/
    border: 1px solid #757575;
    border-radius: 50px;
    color: #2f2f2f;
    display: inline-block;
    font-size: 14px;
    padding: 24px 82px;
    transition: .6s;
    overflow: hidden;
    position: relative; }
    @media (max-width: 480px) {
      .link-page a {
        font-size: 12px;
        padding: 24px 62px; } }
    .link-page a::before {
      content: "";
      width: 120%;
      height: 200%;
      position: absolute;
      top: -50%;
      right: 0;
      z-index: -1;
      background: #757575;
      border-radius: 0 100% 100% 0;
      transform: translateX(-100%);
      transition: transform ease .3s; }
    .link-page a:hover {
      background: #2f2f2f;
      color: #fff; }
    .link-page a:hover::before {
      transform: translateX(10%); }

/*link-page*/
.top-banner {
  display: flex;
  justify-content: space-between;
  margin: 112px auto 0px;
  max-width: 1140px;
  width: 80%; }
  @media (max-width: 480px) {
    .top-banner {
      display: block;
      margin: 24px auto 42px; } }
  .top-banner li {
    width: 48%; }
    @media (max-width: 480px) {
      .top-banner li {
        width: 100%; } }
    @media (max-width: 480px) {
      .top-banner li:first-child {
        margin-bottom: 24px; } }

/*top-banner*/
.top-banner-long {
  display: flex;
  justify-content: space-between;
  margin: 40px auto 128px;
  max-width: 1140px;
  width: 80%; }
  @media (max-width: 480px) {
    .top-banner-long {
      display: block;
      margin: 56px auto 24px; } }
  .top-banner-long li {
    width: 100%; }

/*top-banner*/
.footer-contact-btn {
  text-align: center;
  margin: 0 auto 128px;
  max-width: 640px;
  width: 85%; }
  @media (max-width: 480px) {
    .footer-contact-btn {
      margin: 0 auto 52px; } }
  .footer-contact-btn a {
    border: 1px solid #757575;
    color: #2f2f2f;
    display: block;
    padding: 58px 0;
    transition: .3s;
    overflow: hidden;
    position: relative; }
    @media (max-width: 480px) {
      .footer-contact-btn a {
        padding: 30px 0; } }
    .footer-contact-btn a:hover {
      background: #2f2f2f;
      color: #fff; }
    .footer-contact-btn a::before {
      content: "";
      width: 120%;
      height: 200%;
      position: absolute;
      top: -50%;
      right: 0;
      z-index: -1;
      background: #757575;
      border-radius: 0 45% 45% 0;
      transform: translateX(-100%);
      transition: transform ease .5s; }
    .footer-contact-btn a:hover::before {
      transform: translateX(10%); }
    .footer-contact-btn a:hover span {
      background-image: url("../images/common/icon_mail-white.svg"); }
  .footer-contact-btn span {
    background: url("../images/common/icon_mail.svg") no-repeat 0 8px;
    background-size: 32px 17px;
    font-size: 20px;
    padding-left: 42px;
    transition: .8s; }
    @media (max-width: 480px) {
      .footer-contact-btn span {
        background-position: 0 6px;
        background-size: 20px 13px;
        font-size: 15px;
        padding-left: 28px; } }

.slider.etc-performance .item {
  /*display: flex;
  flex-direction: column;*/
  transition: .4s;
  height: auto;
  width: 240px !important; }
  .slider.etc-performance .item .item-inner {
    margin: 13px; }
  .slider.etc-performance .item .image img {
    width: 240px;
    height: 148px;
    object-fit: cover; }
  .slider.etc-performance .item .client {
    margin-top: auto; }
  .slider.etc-performance .item:hover {
    opacity: .6; }
.slider.etc-performance .slick-prev, .slider.etc-performance .slick-next {
  bottom: auto;
  top: 27%; }

/*slider.etc-performance*/
.slider .item {
  height: 190px;
  width: 287px;
  position: relative;
  overflow: hidden;
  opacity: 1; }

.slick-list {
  margin-right: -12px;
  /* ガター分ネガティブマージン */ }

.slick-slide {
  /*margin-right: 12px;*/
  /* ガター */ }

@media only screen and (max-width: 480px) {
  .slick-list,
  .slick-slide {
    margin: 0; } }
/*.activity-slide.slider .item{
	margin: 30px;
}*/
.slick-slider.menu-slide {
  /*margin-top: 98px;*/
  margin-top: 160px; }

/******************************************************************
              ABOUT US
******************************************************************/
.project-page .page-title {
  margin-bottom: 5%;
  text-align: center; }
  .project-page .page-title img {
    height: 50px; }
  @media screen and (max-width: 480px) {
    .project-page .page-title img {
      height: 24px; } }

.project-page h1,
.project-page p {
  text-align: center; }

#about {
  color: #fff;
  padding-top: 98px;
  line-height: 220%;
  text-align: center; }

.term-brandbook #about,
.term-orizuru #about,
.term-novelty #about {
  margin-top: 108px;
  padding-top: 35%; }

@media screen and (max-width: 850px) {
  .term-brandbook #about,
  .term-orizuru #about {
    padding-top: 45%; }

  .term-novelty #about {
    padding-top: 35%; } }
@media screen and (max-width: 480px) {
  .term-brandbook #about,
  .term-orizuru #about {
    height: 200px;
    margin-top: 70px; }

  .term-novelty #about {
    height: 156px;
    margin-top: 70px; } }
.about-wrapper {
  margin: 0 auto;
  padding: 8% 0;
  max-width: 930px;
  width: 90%; }

.aboutus-logo {
  margin: 8% 0 5%; }
  .aboutus-logo img {
    height: 50px; }
  @media screen and (max-width: 480px) {
    .aboutus-logo img {
      height: 24px; } }

.about-wrapper ul {
  font-size: 0; }

.about-wrapper li {
  float: left;
  margin-bottom: 3%;
  margin-right: 5%;
  width: 16%; }

.about-wrapper li:last-child {
  margin-right: 0; }

@media screen and (max-width: 700px) {
  .about-wrapper li {
    width: 30%; }

  .about-wrapper li:nth-child(3) {
    margin-right: 0; }

  .about-wrapper li:nth-child(4) {
    margin-left: 17.5%; } }
@media screen and (max-width: 480px) {
  #about {
    padding-top: 60px; } }
.hover-parent:hover {
  cursor: pointer; }

.hover-mask {
  line-height: 200%;
  margin: 2% 0 5% 4%; }

/*figure {
	float: left;
	width: 49%;
}
figure:nth-child(even) {
	margin-left: 2%;
}*/
.hover-parent {
  height: auto;
  position: relative;
  margin-bottom: 2%;
  overflow: hidden; }

.hover-mask {
  width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 150, 255, 0.8);
  opacity: 0;
  color: #fff;
  /*display: flex;*/
  align-items: center;
  text-align: left;
  margin: 0;
  padding: 30px;
  line-height: 220%;
  font-size: 22px;
  font-size: 2.86086vw; }

.hover-parent section {
  position: absolute;
  top: 40%;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto; }

.hover-parent .work,
.hover-parent .name {
  display: block;
  padding: 0;
  text-align: center;
  width: 100%; }

.hover-parent .work span {
  line-height: 180%;
  padding: 3px 8px 4px; }

.hover-mask {
  font-size: 22px; }

.hover-mask {
  transition: all 0.6s ease;
  padding-bottom: 0; }

.hover-parent:hover .hover-mask {
  opacity: 1;
  padding-bottom: 30px; }

.hover-parent section.text {
  transition: all 0.6s ease; }

/*.hover-parent:hover section.text {
	zoom: .5;
}*/
figure img {
  width: 100%; }

@media screen and (max-width: 480px) {
  .hover-parent {
    position: static; }
    .hover-parent:hover {
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%); }
    .hover-parent img {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      width: 100%;
      height: auto; }
      .hover-parent img:hover {
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%); }

  .hover-mask:hover {
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); } }
.term-spiceup {
  background: #F5E8D1; }

.term-spiceup #about {
  padding-top: 0px; }

.term-spiceup #about.spice-about {
  padding-top: 50px; }

.term-spiceup .about-wrapper {
  padding: 2% 0 4%; }

.term-spiceup .about-wrapper {
  padding-top: 40px;
  max-width: 620px; }

.term-spiceup h1 {
  margin: 0 auto;
  width: 60%;
  max-width: 360px;
  padding-top: 163px; }

.term-spiceup h2 {
  margin: 0 auto 1.5em;
  text-align: center;
  width: 70%;
  max-width: 380px; }

.term-spiceup .desc {
  margin-bottom: 1em;
  text-align: left; }

.term-spiceup .strong {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 2em;
  text-align: left; }

.term-spiceup #jisseki {
  padding-top: 120px;
  margin-top: -120px; }

.term-spiceup #anchor {
  padding-top: 120px;
  margin-top: -120px; }

.term-spiceup .about-wrapper li {
  margin-right: 5%;
  width: 30%; }
  .term-spiceup .about-wrapper li:last-child {
    margin-right: 0; }

.term-spiceup .container {
  padding: 0; }

.term-spiceup .arrow {
  margin: 5% auto;
  max-width: 76px;
  width: 12%; }

@media screen and (max-width: 680px) {
  .term-spiceup h1 {
    padding-top: 80px; } }
.term-su-ranger .container {
  padding: 0; }

.term-su-ranger #about {
  margin-bottom: 1%;
  /*20210401
  margin-bottom: -4%;
  padding-top: 0;
  
  @media screen and (max-width: 480px){
  	padding-top: 60px;
  }
  
  img{
  	width: 100%;
  }
  20210401*/ }

.term-su-ranger .about-wrapper {
  padding: 2% 0; }
  .term-su-ranger .about-wrapper p {
    margin-top: .5em; }

.term-su-ranger .project-head {
  margin: 3% 0 1%; }

.term-su-ranger .desc {
  color: #000;
  line-height: 220%;
  margin-right: auto;
  margin-left: auto;
  width: 90%;
  text-align: center; }

.term-su-ranger .slick-slider.su-ranger-slide {
  width: 100%; }

.term-su-ranger .slick-slider.su-ranger-slide .slick-list {
  margin: auto;
  width: 90%; }

.term-su-ranger .slick-slider.su-ranger-slide .slick-prev {
  left: 0;
  bottom: 32%; }

.term-su-ranger .slick-slider.su-ranger-slide .slick-next {
  right: 0;
  bottom: 32%; }

.term-su-ranger .manga-wrapper {
  background: url(../images/su-ranger/manga_back.jpg); }
  .term-su-ranger .manga-wrapper .project-head {
    margin: 0;
    padding-top: 2%;
    /*20210401
    padding-top: 8%;
    20210401*/ }

.term-su-ranger .item {
  height: 215px; }
  @media screen and (max-width: 480px) {
    .term-su-ranger .item {
      height: 173px; } }

.term-su-ranger .item img {
  height: 215px; }
  @media screen and (max-width: 480px) {
    .term-su-ranger .item img {
      height: auto; } }

.term-su-ranger .item .new-mark img {
  height: inherit; }

.term-su-ranger h3 {
  font-size: 16px;
  text-align: center; }

.term-su-ranger .character-wrapper {
  margin: 0 auto;
  max-width: 1200px;
  width: 90%; }
  .term-su-ranger .character-wrapper li {
    float: left;
    margin-bottom: 5%;
    width: 33%; }
    .term-su-ranger .character-wrapper li .image-box {
      float: left;
      margin-right: 2%;
      width: 40%; }
    .term-su-ranger .character-wrapper li .desc-box {
      float: left;
      width: 58%; }
    .term-su-ranger .character-wrapper li:nth-child(4) {
      margin-left: 17%; }
  .term-su-ranger .character-wrapper h4 {
    font-size: 32px;
    line-height: 0.8;
    margin-bottom: .6em; }
  .term-su-ranger .character-wrapper span {
    font-size: 18px; }
  .term-su-ranger .character-wrapper .seihon h4 {
    color: #6fab39; }
  .term-su-ranger .character-wrapper .insatsu h4 {
    color: #fe0097; }
  .term-su-ranger .character-wrapper .dansai h4 {
    color: #37456c; }
  .term-su-ranger .character-wrapper .seihan h4 {
    color: #ecaf00; }
  .term-su-ranger .character-wrapper .haisou h4 {
    color: #00a0ff; }

.term-su-ranger .character-btn {
  text-align: center; }
  .term-su-ranger .character-btn a {
    background: #ffd700;
    color: #000;
    display: inline-block;
    padding: 1em 5em;
    transition: 0.5s; }
    .term-su-ranger .character-btn a:hover {
      opacity: 0.8; }

@media screen and (max-width: 676px) {
  .term-su-ranger .about-wrapper {
    padding: 5% 0; }

  .term-su-ranger .about-wrapper h1 {
    margin: auto;
    width: 70%; }

  .term-su-ranger .about-wrapper p {
    margin: auto;
    width: 75%; }

  .su-ranger-slide.slider .item {
    margin: 0 13px; }

  .term-su-ranger .slick-slider.su-ranger-slide {
    overflow: hidden; }

  .term-su-ranger .slick-slider.su-ranger-slide .slick-next {
    right: -5%; }

  .term-su-ranger .project-head {
    margin: 6% 0 2%; }

  .term-su-ranger .manga-wrapper .project-head {
    margin: 3% 0 0;
    padding-top: 5%; }

  .term-su-ranger .character-wrapper li {
    float: inherit;
    width: 100%; }
    .term-su-ranger .character-wrapper li:nth-child(4) {
      margin-left: 0; } }
.nakamoto-wrapper .about-wrapper {
  max-width: 800px;
  padding: 7% 0 5%; }
.nakamoto-wrapper h1.logo {
  float: left;
  margin: -3% 0 0 0;
  width: 32%;
  z-index: 0; }
.nakamoto-wrapper .desc {
  color: #000;
  padding: 0;
  float: right;
  width: 63%; }
.nakamoto-wrapper .arrow {
  margin-bottom: 2.5%;
  text-align: center; }

@media screen and (max-width: 680px) {
  .nakamoto-wrapper h1.logo {
    float: none;
    margin: 0 0 1em;
    width: 100%; }
  .nakamoto-wrapper .desc {
    float: none;
    width: 100%; } }
.term-brandbook .container {
  padding: 0; }

.term-orizuru .container {
  padding: 0; }

.term-novelty .container {
  padding: 0; }

.page-template-page-nakamoto100 .container {
  padding: 0; }

.project-nav ul {
  display: -webkit-flex;
  display: flex; }

.project-nav li {
  background: url(../images/nakamoto100/brandbook.jpg) no-repeat 0 0;
  background-size: cover;
  background-position: center;
  position: relative;
  height: 420px;
  width: 100%;
  -webkit-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
  -webkit-filter: grayscale(1);
  filter: grayscale(1); }
  .project-nav li:before {
    content: "";
    background: rgba(0, 0, 0, 0.6);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0; }
  .project-nav li:nth-child(2) {
    background-image: url(../images/nakamoto100/novelty.jpg); }
  .project-nav li:nth-child(3) {
    background-image: url(../images/nakamoto100/spiceup.jpg); }
  .project-nav li:nth-child(4) {
    background-image: url(../images/nakamoto100/su-ranger.jpg); }
  .project-nav li:nth-child(5) {
    background-image: url(../images/nakamoto100/orizuru.jpg); }
  .project-nav li .text img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    max-width: 140px;
    /*width:50%;*/
    -webkit-transition: 0.5s ease-out;
    transition: 0.5s ease-out; }
  .project-nav li:hover {
    width: 260%;
    -webkit-filter: grayscale(0);
    filter: grayscale(0); }
    .project-nav li:hover .text img {
      opacity: 0; }
    .project-nav li:hover:before {
      content: "";
      background: none; }

.project-nav {
  margin-top: -100px;
  padding-top: 100px; }

.project-nav figure {
  position: relative;
  overflow: hidden;
  /*padding-top: 20%;*/
  height: 420px;
  width: 100%; }

.project-nav figcaption {
  position: absolute;
  bottom: -65px;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 65px;
  background: rgba(255, 255, 255, 0.9);
  -webkit-transition: .5s;
  transition: .5s; }
  .project-nav figcaption table {
    width: 100%; }
  .project-nav figcaption th {
    padding-left: 2%;
    width: 11%;
    max-width: 50px; }
    .project-nav figcaption th img {
      max-width: 50px; }
  .project-nav figcaption td {
    padding: 12px;
    width: 80%; }
  .project-nav figcaption p {
    color: #000; }
  .project-nav figcaption h1 {
    max-width: 230px; }

.project-nav figure:hover figcaption {
  bottom: 0;
  transition-delay: 0.1s; }

.project-nav figure:nth-child(even) {
  margin-left: 0; }

.single-activity .page-container .inner h1 {
  font-size: 21px;
  margin-bottom: 1.5em;
  border-bottom: 1px solid #e5e5e5;
  padding-bottom: 8px; }

.single-activity .page-container .inner article h2 {
  font-size: 18px;
  margin: 0 0 2.5% !important; }

@media screen and (max-width: 480px) {
  .single-activity .page-container .inner h1 {
    font-size: 16px; }

  .single-activity .page-container .inner article h2 {
    font-size: 14px; } }
@media screen and (max-width: 800px) {
  .project-nav {
    margin-bottom: 10%; }

  .project-nav ul {
    display: inherit; }

  .project-nav li {
    height: 200px; }
    .project-nav li:hover {
      width: 100%; }

  .project-nav figure {
    height: 200px; }

  .project-nav figcaption h1 {
    max-width: 180px;
    line-height: 100%; } }
/******************************************************************
              BLOG
******************************************************************/
.article-single .fl-module-content,
.article-list .fl-module-content {
  margin-top: 0px; }
  .article-single .fl-module-content div,
  .article-list .fl-module-content div {
    line-height: 180%;
    margin-bottom: 2.5%; }
.article-single .inner,
.article-list .inner {
  min-width: 820px; }
  @media screen and (max-width: 680px) {
    .article-single .inner,
    .article-list .inner {
      min-width: inherit; } }
.article-single article,
.article-list article {
  max-width: 850px;
  margin: 0 auto; }
.article-single .article-title,
.article-list .article-title {
  /*border-bottom: 1px solid #ccc;*/
  padding-bottom: 24px;
  margin-bottom: 24px; }
  @media screen and (max-width: 680px) {
    .article-single .article-title,
    .article-list .article-title {
      padding-bottom: 12px; } }
  .article-single .article-title .date-circle,
  .article-list .article-title .date-circle {
    background: #45494B;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    padding: 35px;
    float: left;
    margin-right: 1em; }
    .article-single .article-title .date-circle p,
    .article-list .article-title .date-circle p {
      color: #fff;
      position: absolute;
      letter-spacing: 1px; }
    .article-single .article-title .date-circle .year,
    .article-list .article-title .date-circle .year {
      font-size: 12px;
      top: 10px;
      left: 50%;
      -webkit-transform: translateY(0%) translateX(-50%);
      transform: translateY(0%) translateX(-50%); }
    .article-single .article-title .date-circle .month,
    .article-list .article-title .date-circle .month {
      font-size: 13px;
      top: 30px;
      left: 9px; }
    .article-single .article-title .date-circle .day,
    .article-list .article-title .date-circle .day {
      font-size: 20px;
      top: 24px;
      right: 9px; }
  .article-single .article-title .title,
  .article-list .article-title .title {
    font-size: 26px;
    /*float: left;*/
    margin-top: .7em; }
    @media screen and (max-width: 680px) {
      .article-single .article-title .title,
      .article-list .article-title .title {
        font-size: 16px; } }
  .article-single .article-title .comments,
  .article-list .article-title .comments {
    color: #1386bd;
    font-weight: bold; }
.article-single .head,
.article-list .head {
  color: #1386BD;
  font-size: 18px;
  margin-bottom: 1.5em;
  text-align: left; }
.article-single .profile,
.article-list .profile {
  margin-bottom: 2.5em; }
  @media screen and (max-width: 680px) {
    .article-single .profile,
    .article-list .profile {
      display: none; } }
@media screen and (max-width: 680px) {
  .article-single .new-post .head,
  .article-list .new-post .head {
    margin: 0; } }
.article-single .new-post ul li,
.article-list .new-post ul li {
  border-bottom: 1px solid #ccc;
  padding: 12px 0; }
.article-single .new-post ul a,
.article-list .new-post ul a {
  color: #1386BD; }
  .article-single .new-post ul a:hover,
  .article-list .new-post ul a:hover {
    text-decoration: underline; }
.article-single .article-content,
.article-list .article-content {
  font-size: 16px;
  line-height: 180%; }
.article-single .page-link a,
.article-list .page-link a {
  color: #171a1d;
  display: block;
  font-size: 15px;
  letter-spacing: .08em;
  padding: 24px 32px;
  text-decoration: none;
  text-align: center;
  border: 1px solid #171a1d;
  margin: 0 auto;
  width: 80%;
  max-width: 312px; }

.article-list .page-title {
  display: block;
  font-size: 24px !important;
  margin: 0 0 3em !important;
  text-align: center; }
  @media screen and (max-width: 680px) {
    .article-list .page-title {
      margin: 0 0 1em !important; } }
.article-list article .head {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  color: #393E40;
  padding: 24px 0 24px 18px;
  text-align: left !important; }
.article-list article .new-post li {
  font-size: 16px;
  margin-bottom: 1.5em;
  padding-left: 24px; }
  .article-list article .new-post li a {
    background: url(../images/blog/blog-arrow.jpg) no-repeat 0 center;
    color: #393E40;
    padding-left: 1em;
    text-decoration: underline; }
    .article-list article .new-post li a:hover {
      text-decoration: none; }
.article-list article .date-circle {
  background: #45494B;
  border-radius: 50%;
  display: inline-block;
  position: relative;
  padding: 35px;
  float: left;
  margin-right: 1em; }
  .article-list article .date-circle p {
    color: #fff;
    font-weight: bold;
    position: absolute; }
  .article-list article .date-circle .year {
    font-size: 14px;
    top: 10px;
    left: 50%;
    -webkit-transform: translateY(0%) translateX(-50%);
    transform: translateY(0%) translateX(-50%); }
  .article-list article .date-circle .month {
    font-size: 14px;
    top: 30px;
    left: 9px; }
  .article-list article .date-circle .day {
    font-size: 20px;
    top: 24px;
    right: 8px; }
.article-list article .article-title {
  border: none; }
  .article-list article .article-title .title {
    font-size: 20px;
    margin-top: 1em; }
    @media screen and (max-width: 680px) {
      .article-list article .article-title .title {
        font-size: 16px; } }
  .article-list article .article-title + p {
    margin: 0 auto 2em !important;
    width: 570px; }
    @media screen and (max-width: 480px) {
      .article-list article .article-title + p {
        width: 90%; } }
.article-list article .more {
  margin: 0 auto;
  width: 570px; }
  @media screen and (max-width: 480px) {
    .article-list article .more {
      width: 90%; } }
  .article-list article .more a {
    color: #1487BD;
    text-decoration: underline; }

@media screen and (max-width: 480px) {
  .article-single .fl-module-content div, .article-list .fl-module-content div {
    line-height: 160%; } }
/******************************************************************
              ARCHIVE
******************************************************************/
.archive-head {
  padding-top: 142px; }
  @media screen and (max-width: 480px) {
    .archive-head {
      padding-top: 86px; } }

.activity-wrap {
  margin-bottom: 112px; }
  @media screen and (max-width: 480px) {
    .activity-wrap {
      margin-bottom: 82px; } }

.archive-btn {
  position: absolute;
  bottom: -42px;
  left: 50%;
  margin-left: -82px; }

.archive-btn a {
  border: 1px solid #000;
  color: #000;
  padding: 12px 24px; }

/******************************************************************
              CONTACT
******************************************************************/
#contact {
  padding: 200px 0 0; }
  @media screen and (max-width: 480px) {
    #contact {
      padding: 80px 0 0; } }

#contact h1 {
  margin: 0 auto 5%;
  width: 24.5%; }

.page-template-page-contact article {
  margin: 0 auto;
  max-width: 620px;
  width: 90%; }
  .page-template-page-contact article p {
    font-size: 14px;
    line-height: 220%; }

table.form {
  margin: 8% 0 2%; }
  table.form th {
    padding-right: 2em;
    white-space: nowrap; }
    table.form th span {
      color: #9F0003;
      font-size: 12px;
      margin-left: .5em; }
    table.form th.naiyo {
      padding: 14px 0 0 0;
      vertical-align: top; }
  table.form td {
    padding: 8px; }

input[type=text],
input[type=email],
select,
textarea,
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  font-family: inherit;
  border: none;
  box-sizing: border-box; }
  input[type=text]::-webkit-search-decoration,
  input[type=email]::-webkit-search-decoration,
  select::-webkit-search-decoration,
  textarea::-webkit-search-decoration,
  input[type="submit"]::-webkit-search-decoration,
  input[type="button"]::-webkit-search-decoration {
    display: none; }
  input[type=text]::focus,
  input[type=email]::focus,
  select::focus,
  textarea::focus,
  input[type="submit"]::focus,
  input[type="button"]::focus {
    outline-offset: -2px; }

input[type=text],
input[type=email],
select,
textarea {
  font-size: 14px;
  background: #eff0f0;
  padding: 10px;
  line-height: 1.2;
  color: #303336;
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #eff0f0; }
  @media screen and (max-width: 480px) {
    input[type=text],
    input[type=email],
    select,
    textarea {
      font-size: 16px; } }

select {
  background: url(../images/common/icon_arrow.png) 95% 50% no-repeat #eff0f0;
  background-size: 8px; }

.send-btn input {
  display: block;
  height: 80px;
  color: #fff;
  line-height: 80px;
  transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  width: 312px; }

.send-btn {
  box-sizing: border-box;
  position: relative;
  margin: 2em auto 0;
  width: 100%; }

.send-btn input {
  cursor: pointer;
  border: 0;
  font-size: 15px;
  letter-spacing: .08em;
  text-decoration: none;
  text-align: center;
  background: #171a1d;
  margin: 0 auto; }
  .send-btn input:hover {
    opacity: .8; }
  .send-btn input.return {
    background: #fff;
    color: #000;
    border: 1px solid #333;
    margin-top: 1em; }

.error {
  padding: .5em 0 0; }

.error + input[type=text],
.error + input[type=email],
.error + textarea {
  background: #ffcebd;
  border: 1px solid #ffcebd; }

.mw_wp_form_confirm .step1,
.mw_wp_form_confirm th span {
  display: none; }

.step2 {
  display: none; }

.mw_wp_form_confirm .step2 {
  display: block; }

.mw_wp_form_confirm .send-btn span {
  float: right;
  width: 46%; }

.mw_wp_form_confirm .send-btn span + span {
  float: left; }

.mw_wp_form_confirm .privacy-check {
  display: none; }

@media screen and (max-width: 480px) {
  .mw_wp_form_confirm .send-btn span,
  .mw_wp_form_confirm .send-btn span + span {
    float: none; } }
.thanks p {
  text-align: center; }

.thanks a {
  border: 0;
  color: #fff;
  display: block;
  font-size: 15px;
  letter-spacing: .08em;
  text-decoration: none;
  text-align: center;
  background: #171a1d;
  margin: 10% auto 0;
  padding: 24px; }
  .thanks a:hover {
    opacity: .8; }

.privacy-check {
  margin: 0 0 2%;
  text-align: center; }
  .privacy-check a {
    color: red; }

/******************************************************************
              search
******************************************************************/
.search {
  /*background: #000;*/
  display: flex;
  flex-direction: column;
  min-height: 100vh; }
  .search .search-box {
    padding: 160px 0 0; }
    @media screen and (max-width: 480px) {
      .search .search-box {
        padding: 90px 0 0; } }
  .search .copy {
    margin-top: auto; }
  .search.search-no-results .search-box {
    color: #fff;
    font-size: 18px;
    line-height: 1.8;
    padding: 220px 40px 0;
    text-align: center; }
    @media screen and (max-width: 480px) {
      .search.search-no-results .search-box {
        padding: 150px 40px 0; } }

/******************************************************************
              slick
******************************************************************/
.activity-slide.slick-slider {
  margin-left: 0px;
  margin: 0 auto;
  width: 90%; }

@media only screen and (max-width: 600px) {
  .page-template-page-home_renewal .project-head {
    font-size: 16px;
    margin: 5% 0 2%; }

  .page-template-page-home_renewal h2.project-head {
    font-size: 16px;
    margin: 5% 0 0; }

  .activity-slide.slick-slider {
    margin-left: 10px; }

  .slick-slider.menu-slide {
    margin-top: 68px; }

  .activity-slide.slider .item {
    margin: 0 26px 0 0;
    height: 162px; }

  /*.activity-slide.slider .slick-active.item + .slick-active{
  	margin: 0 0 0 0;
  }*/
  /*.activity-slide .slick-active{
  	width:194px;
  }
  .activity-slide .slick-current{
  	margin-right: 31px;
  }*/ }
/******************************************************************
              share
******************************************************************/
.share-btn {
  background: #e2e2e2;
  padding: 10px;
  position: fixed;
  top: 200px;
  left: 0; }
  .share-btn a {
    color: #000;
    display: block;
    text-align: center;
    width: 50px; }
  .share-btn img {
    margin-bottom: 3px; }

@media screen and (max-width: 768px) {
  .share-btn {
    background: none;
    padding: 6px;
    top: 32px;
    right: 175px;
    left: inherit;
    z-index: 104; }
    .share-btn a {
      width: 13px; } }
@media screen and (max-width: 480px) {
  .share-btn {
    top: 14px;
    right: 130px; } }
/******************************************************************
              comment
******************************************************************/
.comment-list .children {
  padding-left: 2em;
  background: #e5e5e5; }
  .comment-list .children .fn {
    color: #007acc; }

.comment-metadata {
  margin-bottom: 1em !important; }

.comment-reply-link {
  margin-top: 1em !important; }

/******************************************************************
              sticker-page
******************************************************************/
.sticker-page {
  background: #F6F2EF; }
  .sticker-page .inner {
    margin: 0 auto;
    max-width: 1200px;
    position: relative;
    width: 90%; }
  .sticker-page .download-btn {
    text-align: center;
    width: 72%; }
    .sticker-page .download-btn a {
      display: inline-block;
      transition: .5s all; }
      .sticker-page .download-btn a:hover {
        transform: scale(1.2); }
        @media only screen and (max-width: 768px) {
          .sticker-page .download-btn a:hover {
            transform: scale(1); } }
  .sticker-page #sticker-main {
    background: url("../images/su-ranger/sticker/back-top.png") no-repeat center top/contain;
    padding-top: 50px;
    position: relative;
    /*&::before{
    	background: url("../images/su-ranger/sticker/illust-other.png") no-repeat left top/contain;
    	content: "";
    	height: 461px;
    	position: absolute;
    	left: 5%;
    	top: 9%;
    	width: 32%;
    }*/ }
    @media only screen and (min-width: 1752px) {
      .sticker-page #sticker-main {
        background: url("../images/su-ranger/sticker/back-top.png") no-repeat center bottom/cover; } }
    @media only screen and (max-width: 768px) {
      .sticker-page #sticker-main {
        background: url("../images/su-ranger/sticker/back-top-sp.png") no-repeat center top/contain;
        padding-bottom: 25px;
        padding-top: 20px; } }
    .sticker-page #sticker-main .head {
      margin: 0 auto;
      width: 58%; }
      @media only screen and (max-width: 768px) {
        .sticker-page #sticker-main .head {
          width: 83%; } }
    .sticker-page #sticker-main h1 {
      margin-bottom: 40px;
      text-align: center; }
      @media only screen and (max-width: 768px) {
        .sticker-page #sticker-main h1 {
          margin-bottom: 13px; } }
    .sticker-page #sticker-main h2 {
      text-align: center; }
    .sticker-page #sticker-main::after {
      background: url("../images/su-ranger/sticker/illust-insatsu.png") no-repeat right top/contain;
      content: "";
      height: 97%;
      position: absolute;
      right: 0;
      top: 10%;
      width: 28%; }
      @media only screen and (max-width: 768px) {
        .sticker-page #sticker-main::after {
          top: 70%; } }
    .sticker-page #sticker-main .download-btn {
      margin: 20px auto; }
  .sticker-page #manga {
    background: url("../images/su-ranger/sticker/manga-back.png") no-repeat center bottom 10px/contain;
    padding-bottom: 165px;
    position: relative;
    text-align: center; }
    @media only screen and (max-width: 768px) {
      .sticker-page #manga {
        background: url("../images/su-ranger/sticker/manga-back-sp.png") no-repeat center bottom 10px/contain;
        padding-bottom: 75px; } }
    .sticker-page #manga .inner {
      width: 74%; }
    .sticker-page #manga::before {
      background: url("../images/su-ranger/sticker/illust-cat.png") no-repeat left top/contain;
      content: "";
      height: 55%;
      position: absolute;
      left: 7%;
      top: -28%;
      width: 24%; }
      @media only screen and (max-width: 768px) {
        .sticker-page #manga::before {
          background: url("../images/su-ranger/sticker/illust-cat.png") no-repeat left bottom/contain;
          height: 18%;
          left: 1%;
          bottom: 3%;
          top: inherit; } }
  .sticker-page #sticker-about {
    background: url("../images/su-ranger/sticker/back-under.png") no-repeat center bottom/contain;
    position: relative; }
    @media only screen and (min-width: 1752px) {
      .sticker-page #sticker-about {
        background: url("../images/su-ranger/sticker/back-under.png") no-repeat center top/cover; } }
    @media only screen and (max-width: 1385px) {
      .sticker-page #sticker-about {
        background: url("../images/su-ranger/sticker/back-under-tab.png") no-repeat center bottom/contain; } }
    @media only screen and (max-width: 1192px) {
      .sticker-page #sticker-about {
        background: url("../images/su-ranger/sticker/back-under-tab2.png") no-repeat center bottom/contain; } }
    @media only screen and (max-width: 990px) {
      .sticker-page #sticker-about {
        background: url("../images/su-ranger/sticker/back-under-tab3.png") no-repeat center bottom/contain; } }
    @media only screen and (max-width: 885px) {
      .sticker-page #sticker-about {
        background: url("../images/su-ranger/sticker/back-under-tab4.png") no-repeat center bottom/contain; } }
    @media only screen and (max-width: 768px) {
      .sticker-page #sticker-about {
        background: url("../images/su-ranger/sticker/back-under-sp.png") no-repeat center bottom/contain; } }
    .sticker-page #sticker-about h3 {
      margin: 0 auto 115px;
      max-width: 797px; }
      @media only screen and (max-width: 768px) {
        .sticker-page #sticker-about h3 {
          margin: 0 auto 40px;
          width: 90%; } }
    .sticker-page #sticker-about .image {
      display: flex;
      flex-wrap: wrap;
      margin-bottom: 140px; }
      @media only screen and (max-width: 768px) {
        .sticker-page #sticker-about .image {
          margin-bottom: 40px; } }
      .sticker-page #sticker-about .image li {
        width: 23.5%; }
        @media only screen and (max-width: 768px) {
          .sticker-page #sticker-about .image li {
            margin-bottom: 10px;
            width: 49%; } }
        .sticker-page #sticker-about .image li:nth-child(2) {
          -webkit-animation-delay: .5s;
          animation-delay: .5s; }
        .sticker-page #sticker-about .image li:nth-child(3) {
          -webkit-animation-delay: 1s;
          animation-delay: 1s; }
        .sticker-page #sticker-about .image li:last-child {
          -webkit-animation-delay: 1.5s;
          animation-delay: 1.5s; }
        .sticker-page #sticker-about .image li:not(:last-child) {
          margin-right: 2%; }
          @media only screen and (max-width: 768px) {
            .sticker-page #sticker-about .image li:not(:last-child) {
              margin-right: 0; } }
        @media only screen and (max-width: 768px) {
          .sticker-page #sticker-about .image li:nth-child(odd) {
            margin-right: 2%; } }
    .sticker-page #sticker-about .desc {
      margin: 0 auto 140px;
      max-width: 815px; }
      @media only screen and (max-width: 768px) {
        .sticker-page #sticker-about .desc {
          margin: 0 auto 40px;
          width: 90%; } }
    .sticker-page #sticker-about .qr-btn {
      margin: 0 auto 15px;
      text-align: center;
      width: 28%; }
      .sticker-page #sticker-about .qr-btn a {
        transition: .5s all; }
        .sticker-page #sticker-about .qr-btn a:hover {
          opacity: 0.7; }
          @media only screen and (max-width: 768px) {
            .sticker-page #sticker-about .qr-btn a:hover {
              opacity: 1; } }
    .sticker-page #sticker-about .download-btn {
      margin: 0 auto 120px; }
      @media only screen and (max-width: 768px) {
        .sticker-page #sticker-about .download-btn {
          margin: 0 auto 35px; } }
    .sticker-page #sticker-about .su-ranger-btn {
      padding-bottom: 55px;
      text-align: center; }
      @media only screen and (max-width: 768px) {
        .sticker-page #sticker-about .su-ranger-btn {
          padding-bottom: 20px; } }
      .sticker-page #sticker-about .su-ranger-btn a {
        transition: .5s all; }
        .sticker-page #sticker-about .su-ranger-btn a:hover {
          opacity: 0.7; }
          @media only screen and (max-width: 768px) {
            .sticker-page #sticker-about .su-ranger-btn a:hover {
              opacity: 1; } }
  .sticker-page #search {
    background: #000;
    padding: 55px 0;
    position: relative; }
    @media only screen and (max-width: 768px) {
      .sticker-page #search {
        padding: 15px 0 55px; } }
    .sticker-page #search p {
      text-align: center; }
    .sticker-page #search::before {
      background: url("../images/su-ranger/sticker/deco-circle.png") no-repeat center/contain;
      content: "";
      height: 100px;
      position: absolute;
      right: 10%;
      top: -50px;
      width: 7%; }
      @media only screen and (max-width: 768px) {
        .sticker-page #search::before {
          content: none; } }
