
main{
    background-color:#fff;
    font-family: "Noto Serif JP", serif;
    padding-bottom:140px;
}
main img{
    width: 100%;
}
.main_area{
    text-align: center;
}

.main_area p{
    text-align: center;
    font-size: clamp(14px,2vw,40px);
    font-weight:500;
    line-height: 2;
    margin-bottom: 110px;
}

.main_area h3{
    font-size: clamp(16px,2vw,60px);
    line-height:1.2;
    margin-bottom: 110px;
    font-family: "helvetica-neue-lt-pro", sans-serif;
}

.main_area h1{
    width: 20%;
    margin:50px auto;
}


.content_area{
    width:94%;
    margin:0 auto;
}

.twoclm{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.twoclm img{
    width:50%;
}

.twoclm dl{
    width:50%;
    padding:0 60px;
}

.twoclm dl dt{
    font-size: clamp(20px,2vw,40px);
  margin-bottom: 60px;
}


.twoclm dl dd{
    font-size: clamp(14px,2vw,24px);
    font-weight:500;
    margin:0;
    letter-spacing:-0.04em;
    line-height: 2;
}

.twoclm dl dt small{
  display: block;
  font-size: clamp(12px,2vw,26px);
  margin-bottom: 40px;
}

.about_area{
    width:94%;
    margin:0 auto;
}


.about_area h3{
  width: 28%;
  margin: 0 auto;
}


.about_area h4{
    text-align: center;
    font-size: clamp(20px,2vw,60px);
    line-height: 2;
    margin:40px 0 20px;
}


.about_area p{
    text-align: center;
    font-size: clamp(16px,2vw,40px);
    line-height: 2;
    margin-bottom: 40px;
}

.collabo_area{
    width:94%;
    margin:0 auto;
}


.collabo_area h3{
    text-align: center;
    font-size: clamp(20px,2vw,60px);
    line-height: 2;
    margin:50px auto;
}

.collabo_area ul{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin:0;
    list-style: none;
    padding:0;
}

.collabo_area ul li{
    width:calc(100%/2 - 20px);
}

.collabo_area ul li p{
    text-align: center;
    font-size: clamp(28px,2vw,40px);
    line-height:1;
    margin: 20px 0 60px;
}

.collection_area h3{
    text-align: center;
    font-size: clamp(16px,2vw,60px);
    letter-spacing:0.1em;
    line-height:2;

}

.collection_area h4{
    text-align: center;
    font-size: clamp(16px,2vw,40px);
    font-weight:500;
}

.collection_area{
    width:94%;
    margin:0 auto;
}

.collection_area ul{
    display: flex;
    justify-content: space-between;
    list-style: none;

}

.collection_area ul li p{
    text-align: center;
    font-size: clamp(22px,2vw,30px);
    font-weight:500;
}


@media (max-width:768px){

.main_area h1{
    width: 70%;
    margin:50px auto;
}


.collection_list{
  display:flex;
  overflow:hidden;
}

.collection_list li{
  min-width:100%;
}


.about_area h3{
  width: 70%;
  margin: 0 auto;
}

.twoclm{
    flex-wrap: wrap;
}

.twoclm img{
    width: 100%;
}

.twoclm dl{
    width: 100%;
    padding: 0;
    margin-bottom: 60px;
}

.twoclm dl dt small {
  display: block;
  font-size: clamp(18px,2vw,26px);
  margin-bottom: 20px;
  text-align: center;
}
.twoclm dl dt {
  margin-bottom: 40px;
  text-align: center;
}

.collabo_area ul li{
    width:calc(100%/2 - 10px);
}
.collabo_area ul li p {
  text-align: center;
  font-size: clamp(18px,2vw,40px);
  line-height: 1;
  margin: 10px 0 30px;
}

.main_area h3{
    margin-bottom:40px;
}

.main_area p{
    margin-bottom:40px;
}

.about_area p{
    margin-bottom: 50px;
}
}

.collection_area{
    width:94%;
    margin:0 auto;
}

.swiper-wrapper{
    display: flex;
    justify-content: space-between;
    list-style: none;
}

.swiper-slide{
    text-align: center;
    font-size: clamp(14px,2vw,30px);
    font-weight:500;
}

.collection_area .swiper-slide{
    width:calc(100%/5 - 10px);
}

.collection_area .swiper-slide a{
    color: #000;
    text-decoration: none;
}

@media (max-width:768px){
  .collection_slider .swiper-container {
    overflow: hidden;
  }

  .collection_slider .swiper-wrapper {
    display: flex;
    width: 100%;
  }
  .collection_area .swiper-slide{
    width: 100%;
}


  .collection_slider .swiper-slide {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 70px;
    margin-bottom: 100px;
  }

  .collection_slider .swiper-slide img {
    width: 100%;
    height: auto;
    object-fit: contain;
  }

  .collection_slider .swiper-slide p {
    text-align: center;
    font-size: clamp(22px, 4vw, 30px);
    font-weight: 500;
    margin-top: 8px;
  }

  .swiper-pagination-bullet {
    width: 37px;
    height: 37px;
    background: #ccc;
    border-radius: 0;
    opacity: 1;
  }

  .swiper-pagination-bullet-active {
    background: #555;
  }

  
.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
  width: 37px;
  height: 37px;
  border-radius: inherit;
  background-color: #797979;
  margin-top: 100px;
}

.swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom{
    top: inherit !important;
    bottom: 100px !important;
}
.swiper-pagination{
    top: inherit;
    bottom:70px;
}

}

