@charset "utf-8";

/*------Top------*/
.p-top_mv {
  position: relative;
  margin: 68px 0 80px;
  padding: 64px 0 0;
}

.p-top_mv__main-copy {
  position: absolute;
  top: 24px;
  left: 6.4%;
  width: 98px;
  height: auto;
  z-index: 1;
}

.p-top_mv__img {
  position: relative;
  overflow: hidden;
}

.p-top_mv__img__inner {
  height: 416px;
  position: relative;
}

.p-top_mv__img__inner:before {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  width: 100%;
  height: 8px;
  background: url(../images/top/mv-border_top.png) bottom center;
  background-size: 2560px 8px;
}

.p-top_mv__img__inner:after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 8px;
  background: url(../images/top/mv-border_bottom.png) bottom center;
  background-size: 2560px 8px;
}

@media (min-width: 600px) {
  .p-top_mv__main-copy {
    width: 130px;
  }

  .p-top_mv__img__inner {
    height: 544px;
  }
}

@media (min-width: 1024px) {
  .p-top_mv {
    margin: 100px 0 144px;
    padding: 0;
  }

  .p-top_mv__main-copy {
    top: 0;
    left: 8%;
  }

  .p-top_mv__img__inner {
    height: 664px;
  }
}

@media (min-width: 1366px) {
  .p-top_mv {
    margin: 64px 0 144px 0;
  }

  .p-top_mv__main-copy {
    top: -24px;
  }
}

@media (min-width: 1600px) {
  .p-top_mv__img__inner {
    height: 760px;
  }
}

/*------Intro------*/
.p-top_intro {
  margin-bottom: 80px;
}

.p-top_intro__img img {
  width: 100%;
  height: auto;
  max-height: 400px;
  margin-bottom: 40px;
  object-fit: cover;
}

.p-top_intro__text {
  padding: 0 8.56%;
}

.p-top_intro__intro-copy {
  width: 242px;
  height: auto;
}

.p-top_intro__description {
  padding-top: 40px;
}

.p-top_intro__description p {
  padding-bottom: 32px;
}

.more-btn {
  width: 202px;
  height: 32px;
  margin: 0 0 0 auto;
  padding-bottom: 8px;
  text-align: left;
  background: url(../images/common/btn-line_01.png) no-repeat;
  background-size: 202px 2px;
  background-position: 100% 100%;
  transition-property: all;
  transition-duration: .3s;
  transition-timing-function: cubic-bezier(.14, 1.2, .81, .99);
}

.more-btn a {
  display: block;
  color: #430e04;
  font-size: 1.4rem;
  position: relative;
}

.more-btn a::after {
  position: absolute;
  content: '';
  width: 6px;
  height: 6px;
  border-top: solid 1px #430e04;
  border-right: solid 1px #430e04;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 50%;
  right: 8px;
  margin-top: -3px;
  transition-property: all;
  transition-duration: .3s;
  transition-timing-function: cubic-bezier(.14, 1.2, .81, .99);
}

.more-btn:hover {
  background-position: 100% 85%;
}

.more-btn:hover a::after {
  right: 0;
}

@media (min-width: 768px) {
  .p-top_intro {
    width: 100%;
    margin: 0 auto 80px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
  }

  .p-top_intro__img {
    width: 46%;
    padding-left: 8.56%;
    box-sizing: border-box;
  }

  .p-top_intro__text {
    width: 46%;
    padding: 0 8.56% 0 0;
    box-sizing: border-box;
  }
}

@media (min-width: 1024px) {
  .p-top_intro {
    max-width: 969px;
    margin: 0 auto 144px;
  }

  .p-top_intro__img {
    width: 51.18%;
    padding-left: 0;
  }

  .p-top_intro__intro-copy {
    width: 325px;
    padding: 0 0 40px 88px;
  }

  .p-top_intro__text {
    width: 48.82%;
    padding: 0;
  }

  .p-top_intro__description {
    padding: 0 0 24px 88px;
  }

  .more-btn a {
    font-size: 1.6rem;
  }
}

@media (min-width: 1366px) {
  .p-top_intro {
    max-width: 1256px;
    padding: 0 5vw;
    box-sizing: border-box;
  }
}

/*------Order------*/
.p-top_order {
  margin-bottom: 80px;
  padding: 0 8.56%;
  position: relative;
}

.p-top_order__ttl-wrap {
  position: relative;
}

.p-top_order__ttl {
  width: 200px;
  height: auto;
}

.p-top_order__illust {
  position: absolute;
  top: -16px;
  right: 8%;
  width: 45%;
  height: auto;
}

.p-top_order__tel-info {
  margin: 24px 0;
}

.p-top_order__icon {
  width: 20px;
  height: auto;
  padding-right: 10px;
  vertical-align: bottom;
}

.p-top_order__tel {
  font-size: 2.4rem;
}

.p-top_order__shop-btn {
  position: relative;
  width: 256px;
  height: 50px;
  margin: 0 auto 0 0;
  display: block;
  overflow: hidden;
  cursor: pointer;
}

.p-top_order__shop-btn img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  display: block;
  transition-property: all;
  transition-duration: .8s;
  transition-timing-function: cubic-bezier(.28, .78, .43, .86);
}

.p-top_order__shop-btn img:nth-of-type(2) {
  opacity: 0;
}

.p-top_order__shop-btn:hover img:nth-of-type(1) {
  opacity: 0;
}

.p-top_order__shop-btn:hover img:nth-of-type(2) {
  opacity: 1;
}

@media (min-width: 1024px) {
  .p-top_order {
    margin: 0 auto 120px;
    padding: 0%;
    width: 843px;
  }

  .p-top_order__ttl {
    width: 267px;
  }

  .p-top_order__illust {
    right: 16px;
    width: 464px;
  }
}

@media (min-width: 1366px) {
  .p-top_order {
    width: 896px;
  }
}

/*------Products------*/
.p-top_products {
  background-color: #fff;
  padding: 0 8.56% 80px;
}

.p-top_products::before {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 8px;
  background: url(../images/common/sec-border_be.png) bottom center;
  background-size: 4000px 8px;
}

.p-top_products h2 img {
  width: 75px;
  height: auto;
  margin-top: -24px;
}

.p-top_products ul {
  margin-top: 40px;
  list-style: none;
}

.p-top_products ul li {
  margin-bottom: 64px;
}

.p-top_products ul li img {
  width: 100%;
  height: auto;
  margin-bottom: 24px;
  cursor: pointer;
  transition-property: transform;
  transition-duration: 1s;
  transition-timing-function: cubic-bezier(.28, .78, .43, .86);
}

.p-top_products ul li img:hover {
  transform: scale(1.1);
  transform-origin: center;
}

.p-top_products ul li:last-child {
  margin-bottom: 0px;
}

.p-top_products ul li h3 {
  text-align: center;
  margin-bottom: 16px;
}

.p-top_products ul li p {
  margin-bottom: 40px;
}

.p-top_products__more-btn {
  width: 202px;
  height: 32px;
  margin: 0 0 0 auto;
  text-align: left;
  background: url(../images/common/btn-line_01.png) no-repeat;
  background-size: 202px 2px;
  background-position: 100% 100%;
}

.p-top_products__more-btn a {
  color: #430e04;
  font-size: 1.4rem;
  padding-bottom: 16px;
}

@media (min-width: 768px) {
  .p-top_products ul li {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
  }

  .p-top_products ul li:nth-child(even) {
    flex-direction: row-reverse;
  }

  .p-top_products ul li img {
    margin-bottom: 0;
  }

  .p-top_products__img {
    width: 46%;
  }

  .p-top_products__img a {
    display: block;
  }

  .p-top_products__text {
    width: 46%;
  }

  .p-top_products ul li h3 {
    text-align: left;
    margin-bottom: 40px;
  }
}

@media (min-width:1024px) {
  .p-top_products {
    padding: 0 40px 144px;
  }

  .p-top_products h2 img {
    width: 100px;
    margin-top: -40px;
  }

  .p-top_productus__description {
    width: 560px;
    margin: 0 auto;
  }

  .p-top_products ul li {
    width: 918px;
    margin-bottom: 96px;
    align-items: center;
  }

  .p-top_products ul li:nth-child(even) {
    flex-direction: row-reverse;
    margin: 0 0 96px auto;
  }

  .p-top_products ul li img {
    width: 536px;
  }

  .p-top_products__img {
    width: auto;
  }

  .p-top_products__text {
    width: 297px;
  }

  .p-top_products__text span {
    font-size: 1.6rem;
    letter-spacing: 0.08em;
  }
}

@media (min-width: 1366px) {
  .p-top_products {
    padding: 0 40px 144px 24vw;
  }
}

/*------Wholesale------*/
.p-top_wholesale {
  padding: 48px 8.56%;
  background: url(../images/top/bg_or.jpg) repeat;
  text-align: center;
}

.p-top_wholesale h2 img {
  width: 100%;
  height: auto;
  max-height: 24px;
}

.p-top_wholesale__description {
  color: #fff;
  max-width: 448px;
  margin: 0 auto 40px;
  text-align: left;
}

.p-top_wholesale__contact-btn {
  color: #fff;
  display: block;
  height: 52px;
  line-height: 52px;
  margin: 0 auto;
  width: 100%;
  max-width: 296px;
  opacity: 1;
  position: relative;
}

.p-top_wholesale__contact-btn:before {
  background: #fff;
  content: "";
  display: block;
  position: absolute;
  height: 2px;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  width: calc(100% - 16px);
  transition-property: all;
  transition-duration: .4s;
  transition-timing-function: cubic-bezier(.28, .78, .43, .86);
}

.p-top_wholesale__contact-btn:after {
  background: #fff;
  content: "";
  display: block;
  position: absolute;
  height: 2px;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  width: calc(100% - 16px);
  transition-property: all;
  transition-duration: .4s;
  transition-timing-function: cubic-bezier(.28, .78, .43, .86);
}

.p-top_wholesale__contact-btn span {
  display: block;
  position: relative;
}

.p-top_wholesale__contact-btn span::before {
  background: #fff;
  content: "";
  display: block;
  position: absolute;
  height: 52px;
  top: 50%;
  left: 0;
  transform: translatey(-50%);
  width: 2px;
  transition-property: all;
  transition-duration: .4s;
  transition-timing-function: cubic-bezier(.28, .78, .43, .86);
}

.p-top_wholesale__contact-btn span::after {
  background: #fff;
  content: "";
  display: block;
  position: absolute;
  height: 52px;
  top: 50%;
  right: 0;
  transform: translatey(-50%);
  width: 2px;
  transition-property: all;
  transition-duration: .4s;
  transition-timing-function: cubic-bezier(.28, .78, .43, .86);
}

.p-top_wholesale__contact-btn:hover:before,
.p-top_wholesale__contact-btn:hover:after {
  width: 240px;
}

.p-top_wholesale__contact-btn span:hover:before,
.p-top_wholesale__contact-btn span:hover:after {
  height: 30px;
}

@media (min-width: 1024px) {
  .p-top_wholesale {
    padding: 96px 0;
  }

  .p-top_wholesale h2 {
    margin-bottom: 48px;
  }
}

@media (min-width: 1366px) {
  .p-top_wholesale {
    padding: 96px 0 96px 24vw;
  }
}

/*------News------*/
.p-top_news {
  padding: 80px 8.56% 24px;
}

.p-top_news h2 img {
  width: 100px;
  height: auto;
}

.p-top_news li {
  list-style: none;
  background-color: #fff;
  padding: 24px;
  margin-bottom: 40px;
  border-radius: 4px;
}

.p-top_news li time {
  font-size: 1.4rem;
  margin-bottom: 16px;
}

.p-top_news__title {
  color: #ba4f2b;
  font-size: 1em;
  line-height: 1.7;
  letter-spacing: 0.1em;
  padding-bottom: 24px;
}

.p-top_news li p {
  padding-bottom: 24px;
}

.p-top_news li p:last-child {
  padding-bottom: 0;
}

.p-top_news li p a {
  font-weight: 500;
  color: #ba4f2b;
  margin-bottom: 8px;
  border-bottom: 1px solid #ba4f2b;
  position: relative;
  cursor: pointer;
  text-decoration: none;
  transition-property: all;
  transition-duration: .4s;
  transition-timing-function: cubic-bezier(0.15, 0.99, 0.43, 0.86);
}

.p-top_news li p a:hover {
  color: #de9e89;
  border-bottom: 1px solid #de9e89;
}

.p-top_news li span {
  font-weight: 500;
  color: #ba4f2b;
}

@media (min-width: 1024px) {
  .p-top_news {
    width: 100%;
    max-width: 969px;
    margin: 0 auto 96px;
    padding: 0;
  }

  .p-top_news h2 {
    text-align: left;
    margin-top: -40px;
  }

  .p-top_news h2 img {
    width: 134px;
  }

  .p-top_news ul {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }

  .p-top_news li {
    width: 288px;
    padding: 32px;
    box-sizing: border-box;
    margin-bottom: 0;
  }

  .p-top_news li:nth-child(even) {
    margin-top: 40px;
  }
}

@media (min-width: 1366px) {
  .p-top_news {
    max-width: 1296px;
    padding: 0 5vw;
    box-sizing: border-box;
  }

  .p-top_news li {
    width: 30%;
  }
}

/*------media------*/
.p-top_media {
  padding: 0 8.56%;
  margin-bottom: 80px;
}

.p-top_media h2 img {
  width: 134px;
  height: auto;
}

.p-top_media li {
  list-style: none;
  background-color: #fff;
  padding: 24px;
  margin-bottom: 40px;
  border-radius: 4px;
}

.p-top_media li:last-child {
  margin-bottom: 0px;
}

.p-top_media__title {
  color: #ba4f2b;
  font-size: 1em;
  line-height: 1.7;
  letter-spacing: 0.1em;
  padding-bottom: 24px;
}

.p-top_media li p a {
  font-weight: 500;
  color: #430e04;
  padding-bottom: 2px;
  border-bottom: 1px solid #430e04;
  transition-property: all;
  transition-duration: .4s;
  transition-timing-function: cubic-bezier(0.15, 0.99, 0.43, 0.86);
}

.p-top_media li p a:hover {
  color: #de9e89;
  border-bottom: 1px solid #de9e89;
}

@media (min-width: 1024px) {
  .p-top_media {
    width: 100%;
    max-width: 969px;
    margin: 0 auto 144px;
    padding: 0;
  }

  .p-top_media h2 {
    text-align: right;
    margin-bottom: 0;
  }

  .p-top_media h2 img {
    width: 178px;
  }

  .p-top_media ul {
    width: 664px;
    margin: 0 auto 0 0;
  }

  .p-top_media li {
    padding: 32px;
    margin-top: -144px;
    margin-bottom: 64px;
  }
}

@media (min-width: 1366px) {
  .p-top_media {
    max-width: 1296px;
    padding: 0 5vw;
    box-sizing: border-box;
  }

  .p-top_media ul {
    width: 70%;
  }
}