@charset "UTF-8";

/*
 main_visual
--------------------------------------------------- */
.p-main_visual {
  position: relative;
  width: 100%;
}
.p-main_visual img {
  width: 100%;
}
.p-main_visual__text {
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  letter-spacing: 0.3rem;
  color: #ffffff;
  font-size: 2.4rem;
}

/* slide */
.c-slide_item {
  position: relative;
}
.c-slide_item--1 {
  background: url(/domestic/promotions/art_com/index/images/image-main_visual-nagano.jpg) center center no-repeat;
  background-size: cover;
}
.c-slide_item--2 {
  background: url(/domestic/promotions/art_com/index/images/image-main_visual-tottori.jpg) center center no-repeat;
  background-size: cover;
}
.c-slide_item--3 {
  background: url(/domestic/promotions/art_com/index/images/image-main_visual-hiroshima.jpg) center center no-repeat;
  background-size: cover;
}

.js-slide_container {
  height: calc( 100vh - 92px);
  overflow: hidden;
  position: relative;
}
.c-slide_item {
  z-index:10;
  opacity: 0;
  width: 100%;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  left: 0;
  top: 0;
  -webkit-animation: slideIn 21s 0s infinite;
  animation: slideIn 21s 0s infinite;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
  overflow:hidden
}
.c-slide_item:nth-of-type(2) {
  -webkit-animation-delay: 7s;
  animation-delay: 7s;
}
.c-slide_item:nth-of-type(3) {
  -webkit-animation-delay: 14s;
  animation-delay: 14s;
}

@keyframes slideIn {
 0% {
    opacity: 0;
    transform: scale(1);
  }
  17% {
    opacity: 1;
    transform: scale(1);
  }
  33% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0;
    z-index:9;
    transform: scale(1);
  }
  100% { opacity: 0 }
}
@media (min-width: 769px) and (max-width: 1024px) {
  .js-slide_container {
    height: calc( 100vh - 77px);
    overflow: hidden;
    position: relative;
  }
}
@media (max-width: 768px) {
  .js-slide_container {
    height: 100vh;
  }
  .c-slide_item--1 {
    background: url(/domestic/promotions/art_com/index/images/image-main_visual-nagano-sp.jpg) center center no-repeat;
    background-size: cover;
  }
  .c-slide_i1tem--2 {
    background: url(/domestic/promotions/art_com/index/images/image-main_visual-tottori-sp.jpg) center center no-repeat;
    background-size: cover;
  }
  .c-slide_item--3 {
    background: url(/domestic/promotions/art_com/index/images/image-main_visual-hiroshima-sp.jpg) center center no-repeat;
    background-size: cover;
  }

  .p-main_visual__text {
    font-size: calc(0.0625rem + ((1vw - 0.01px) * 4.0417));
      min-height: 0vw;
  }
  .c-button--border {
    font-size: 4.5vw;
  }
}
/* --------------------------------------------------- */

/*
 project
--------------------------------------------------- */
.p-project {
  padding-bottom: 25px;
}
.p-project__text_container {
  margin: 40px 0 55px;
}
.p-project__introduction {
  text-align: center;
}
.p-project__introduction_item {
  margin: 0 0 20px;
  padding: 30px 0;
  background: #d6e7e8;
}
.p-project__introduction_item_heading {
  margin-bottom: 10px;
  font-size: 2.4rem;
}
.p-project__introduction_item:nth-child(2) p {
  text-align: center;
}
.p-project__introduction_item p {
  padding: 0 75px;
  text-align: left;
  font-size: 1.3rem;
}

@media (max-width: 768px) {
  .p-project {
    padding-bottom: 0;
}
  .p-project__introduction {
    width: auto;
    margin-right: calc( ((100vw - 100%) / 2) * -1 );
    margin-left: calc( ((100vw - 100%) / 2) * -1 );
    text-align: left;
  }
  .p-project__introduction_item {
    width: 100%;
    margin: 0 0 10px 0;
    padding: 20px calc( 100 / 750 * 100% ) 25px;
  }
  .p-project__introduction_item_heading {
    font-size: calc(0.0625rem + ((1vw - 0.01px) * 5.3455));
    min-height: 0vw;
  }
  .p-project__introduction_item p {
    padding: 0;
    font-size: calc(0.0625rem + ((1vw - 0.01px) * 3.2595));
    min-height: 0vw;
  }
  .p-project__introduction_item:nth-child(2) p {
    text-align: left;
  }
  .p-project__supplement {
    padding: 0 calc( 65 / 750 * 100% );
  }
}
/* --------------------------------------------------- */

/*
 news
--------------------------------------------------- */
.p-news .c-section__inner {
  padding-bottom: 60px;
}
.p-news__hashtag_container {
  margin: -10px 0 10px;
  white-space: nowrap;
}
.p-news__hashtag_container .p-news__hashtag {
  font-size: 1.6rem;
}
.p-news__hashtag {
  margin: 0 10px 5px 0;
  display: inline-block;
}
.p-news__hashtag:last-of-type {
  margin-right: 0;
}
.p-slider_outer {
  position: relative;
  width: calc( 100% + 15px );
  margin-left: -15px;
}
.p-news__card_container {
  width: 100%;
  margin-left: 7.5px;
}

/* IE11 */
_:-ms-lang(x)::-ms-backdrop, button {
  overflow: visible;
}


.p-news__card_outer a {
  position: relative;
  display: block;
  color: #000000;
  text-decoration: none;
}
.p-news__card_outer a:active, .p-news__card_outer a:link, .p-news__card_outer a:visited {
  color: #000000;
}
.p-news__card_outer a:focus {
  outline: 2px solid var(--color-light) !important;
}
.p-news__card {
  position: relative;
  margin: 7px;
  background: #ffffff;
  box-shadow: 0 0 8px gray;
}
.p-news__card p {
  margin-bottom: 10px;
}
.p-news__card__hashtag_container {
  width: 100%;
  display: flex;
  align-items: flex-end;
  align-content: flex-end;
  flex-wrap: wrap;
  margin-top: 5px;
}
.p-news__card__hashtag_container .p-news__hashtag {
  font-size: 1.4rem;
}
.p-news__card .c-card__text p {
  width: 100%;
}
.p-news__card .c-card__text {
  padding: 10px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between;
}
.p-news__card .c-card__image {
  position: relative;
  overflow: hidden;
  height: 186px;
}
.c-card__image span {
  display: block;
  width: 100%;
  height: 100%;
  background-size: auto 100%;
  background-position: center center;
  background-repeat: no-repeat;
  transition: all 1s ease-in-out;
}
.news-1 .c-card__image span {
  background-image: url(/domestic/promotions/art_com/index/images/image-news_card-1.png)
}
.news-2 .c-card__image span {
  background-image: url(/domestic/promotions/art_com/index/images/image-news-2.jpg)
}
.news-3 .c-card__image span {
  background-image: url(/domestic/promotions/art_com/index/images/image-news-3.jpg)
}
.news-4 .c-card__image span {
  background-image: url(/domestic/promotions/art_com/index/images/image-news-4.jpg)
}
.news-5 .c-card__image span {
  background-image: url(/domestic/promotions/art_com/index/images/image-news-5.jpg)
}
@media (min-width: 1800px) {
  .c-card__image span {
    background-size: cover;
  }
}
@media (min-width: 1014px) and (max-width: 1280px) {
  .c-card__image span {
    background-size: cover;
  }
}
@media (max-width: 768px) {
  .p-news__card .c-card__image {
    height: 23vw;
  }
  .p-news__card .c-card__text {
    height: 160px;
  }
  .p-news__card p {
    margin-bottom: 5px;
  }
  .c-card__image span {
    background-size: auto 100%;
  }
  .p-news__card_container {
    width: 90%;
    margin: auto;
    position: relative;
    left: 1.3vw;
  }
  .p-news__hashtag_container .p-news__hashtag {
    margin: 0 0.8vw 5px;
    font-size: 3vw;
  }
  .p-news__card__hashtag_container .p-news__hashtag {
    margin-bottom: 3px;
    margin-right: 3px;
    font-size: 2.8vw;
  }
}

.p-slider_outer.is-hidden {
  opacity: 0;
}
.p-slider_outer {
  opacity: 1;
  transition: all .3s ease-in-out;
  width: 100%;
}
.js-hashtag-trigger .c-hashtag--dark:not(.js-no-trigger).is-current {
  background: #ffffff;
  color: #849493;
}

@media (min-width: 769px) {
  .js-hashtag-trigger .c-hashtag--dark:not(.js-no-trigger):hover {
    background: #ffffff;
    color: #849493;
  }
  .p-news__card_outer .c-card__image span:hover {
    transform:scale(1.1, 1.1);
  }
}
@media (max-width: 805px) {
  .p-slider_outer {
    width: 100%;
  }
}


.slick-slide img {
  width: 100%;
}
.slick-arrow {
  z-index: 0;
  top: 42%;
}
.slick-arrow.is-hidden {
  opacity: 0;
  z-index: -1;
}
.slick-next {
  width: 0;
  height: 0;
  right: -1000px;
  outline: #d6e7e8;
  transform: translateY(-50%);
}
.slick-next:before {
  content: '';
  position: absolute;
  right: 950px;
  width: 55px;
  height: 55px;
  border: 0px;
  border-top: solid 2px #849493;
  border-right: solid 2px #849493;
  transform: rotate(45deg);
  outline: #d6e7e8;
}
.slick-prev {
  width: 0;
  height: 0;
  left: 15px;
  outline: #d6e7e8;
  transform: translateY(50%);
}
.slick-prev:before {
  content: '';
  position: absolute;
  left: -65px;
  width: 55px;
  height: 55px;
  border: 0px;
  border-top: solid 2px #849493;
  border-right: solid 2px #849493;
  transform: rotate(225deg);
  outline: #d6e7e8;
}
.slick-prev:focus:before, .slick-next:focus:before {
  opacity: .75;
}
@media (max-width: 1280px) {
  .slick-next:before {
    right: 970px;
    width: 45px;
    height: 45px;
  }
}
@media (max-width: 768px) {
  .slick-next:before {
    right: 970px;
    width: 8vw;
    height: 8vw;
  }
  .slick-next:before {
    right: 970px;
    width: 8vw;
    height: 8vw;
  }
  .slick-prev:before {
    left: -45px;
    width: 8vw;
    height: 8vw;
  }
}

/*
  coming soon
--------------------------------------------------- */
.p-micro_biennale {
  background: #849493;
}
/* --------------------------------------------------- */

/*
  art_workation
--------------------------------------------------- */
.p-art_workation__detail {
  line-height: 2;
}
/* --------------------------------------------------- */
