@charset "UTF-8";



/*----------------------------------------
完売共通
------------------------------------------*/



/* hero */
.hero{
    position: relative;
    height: 50vw;
	font-family: 'Yu Mincho Pr6N R', Yu Mincho, YuMincho, Hiragino Mincho ProN, 'HG明朝E', serif;
}

.hero__caption{
    position: absolute;
    font-size: 10px;
    bottom: 10px;
    left: 10px;
}

.hero__image{
    width: 100%;
    position: relative;
}

.hero__image-caption{
    font-size: 10px;
    right: 5px;
    top: 5px;
    position: absolute;
    color: #fff;
}

.hero__perth{
    width: 31.5%;
    position: absolute;
    bottom: 0;
    left: 11.5%;
}

.hero__text-1{
    width: 42.25%;
    border-bottom: 1px solid #000;
    position: absolute;
    right: 11.5%;
    top: 24.3vw;
    padding-bottom: 1.5vw;
}

.hero__text-2{
    width: 42.25%;
    position: absolute;
    right: 11.5%;
    top: 35.2vw;
    display: none;
}

/*完売用*/
.hero img {
    max-width: 100%;
}
.soldout__ttl {
  position: absolute;
  width: 100%;
  top: 17%;
  color: #fff;
  font-family: 'Yu Mincho Pr6N R', Yu Mincho, YuMincho, Hiragino Mincho ProN, 'HG明朝E', serif;
  margin: auto;
  text-align: center;
}
.soldout__ttl h2 {
  font-size: 2.4rem;
}
.soldout__ttl .soldout__txt1 {
  width: 50%;
  margin: 20px auto;
  padding: 20px 0;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  font-size: 1.2rem;
  line-height: 1.8;
}
.soldout__ttl p {
  font-size: 1.2rem;
  line-height: 1.8;
}
.soldout__ttl .soldout__tel p {
  font-size: 1.0rem;
  line-height: 2.5;
}
.soldout__telicon {
  font-size: 3.0rem;
  letter-spacing: 0.2rem;
}
.soldout__telicon img {
  height: 45px;
  margin-right: 10px;
  padding-bottom: 10px;
}
@media screen and (max-width: 787px) {
    .soldout__ttl {
        top: 10%;
    }
    .soldout__ttl .soldout__txt1 {
        width: 90%;
        font-size: 1.0rem;
        text-align: left;
    }
    .soldout__telicon {
        font-size: 2.3rem;
    }
}
@media screen and (max-width: 1024px) and (min-width: 1000px) {
  .soldout__ttl {
    top: 10%;
  }
}






@media screen and (max-width: 787px){
    .hero{
        height: 200vw;
    }

    .hero__caption{
        right: 3vw;
        bottom: auto;
        top: 104vw;
        left: auto;
    }

    .hero__perth{
        width: 70vw;
        left: 0;
        top: 16.6vw;
    }

    .hero__text-1{
        width: 32.4vw;
        right: 3vw;
        border: none;
        top: 42.8vw;
    }

    .hero__text-2{
        width: 93vw;
        left: 50%;
        transform: translateX(-50%);
        top: 116vw;
    }

    .hero__border{
        width: 93vw;
        position: absolute;
        transform: translateX(-50%);
        top: 113vw;
        left: 50%;
        border-top: 1px solid #000;
    }
}







