@charset "UTF-8";
/*--------------------setting--------------------*/
@import url("https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.css");
@import url("https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400..700;1,400..700&display=swap");
.flex {
  display: flex;
  flex-wrap: wrap;
}

.js-inview {
  opacity: 0;
  transform: translate(0, 0px);
  transition: all 0.8s ease 0.4s;
}

.js-inview.is-inview {
  opacity: 1;
  transform: translate(0, 0);
}

.delay-1 {
  animation-delay: 0.3s;
}
.delay-2 {
  animation-delay: 0.6s;
}
.delay-3 {
  animation-delay: 0.9s;
}
.delay-4 {
  animation-delay: 1.2s;
}
.delay-5 {
  animation-delay: 1.5s;
}

.invisible {
  visibility: hidden;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fadein {
  opacity: 0;
  transform: translate(0, 0px);
  transition: all 0.8s ease;
}
.fadein.scrollin {
  opacity: 1;
  transform: translate(0, 0);
}

/*--------------------共通--------------------*/
section#contentsAll .itmName-forAll {
  font-family: "Libre Baskerville", serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(calc((23 / 1280) * 100vw), 23px);
  line-height: normal;
  font-optical-sizing: auto;
  margin-bottom: min(calc((20 / 1280) * 100vw), 20px);
}
@media screen and (max-width: 768px) {
  section#contentsAll .itmName-forAll {
    font-size: calc(16 / 375 * 100vw);
    margin-bottom: calc(14 / 375 * 100vw);
  }
}
section#contentsAll .look_num {
  position: absolute;
  right: 2%;
  top: -28px;
}
@media screen and (max-width: 768px) {
  section#contentsAll .look_num {
    right: calc(5 / 375 * 100vw);
    top: calc(-29 / 375 * 100vw);
  }
}
section#contentsAll .look_num div.js-inview {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
section#contentsAll .look_num span:first-of-type {
  font-family: "Libre Baskerville", serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(calc((15 / 1280) * 100vw), 15px);
  line-height: normal;
  font-optical-sizing: auto;
  margin-top: min(calc((47 / 1280) * 100vw), 47px);
  padding-right: min(calc((3 / 1280) * 100vw), 3px);
}
@media screen and (max-width: 768px) {
  section#contentsAll .look_num span:first-of-type {
    font-size: calc(11.5 / 375 * 100vw);
    margin-top: calc(40 / 375 * 100vw);
    padding-right: calc(0.5 / 375 * 100vw);
  }
}
section#contentsAll .look_num span:last-of-type {
  font-family: "Libre Baskerville", serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(calc((100 / 1280) * 100vw), 100px);
  line-height: normal;
  font-optical-sizing: auto;
  line-height: min(calc((100 / 1280) * 100vw), 100px);
}
@media screen and (max-width: 768px) {
  section#contentsAll .look_num span:last-of-type {
    font-size: calc(76 / 375 * 100vw);
  }
}
section#contentsAll .creditWrap {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: min(calc((10 / 1280) * 100vw), 10px);
}
@media screen and (max-width: 768px) {
  section#contentsAll .creditWrap {
    gap: calc(7 / 375 * 100vw);
  }
}
section#contentsAll .creditWrap_ttl {
  font-family: "Libre Baskerville", serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(calc((13 / 1280) * 100vw), 13px);
  line-height: normal;
  font-optical-sizing: auto;
}
@media screen and (max-width: 768px) {
  section#contentsAll .creditWrap_ttl {
    font-size: calc(11 / 375 * 100vw);
  }
}
section#contentsAll .creditWrap .credit-each {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: min(calc((15 / 1280) * 100vw), 15px);
}
@media screen and (max-width: 768px) {
  section#contentsAll .creditWrap .credit-each {
    gap: calc(10 / 375 * 100vw);
    align-items: flex-end;
  }
}
section#contentsAll .creditWrap .credit-each_info {
  font-family: "Libre Baskerville", serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(calc((13 / 1280) * 100vw), 13px);
  line-height: normal;
  font-optical-sizing: auto;
}
@media screen and (max-width: 768px) {
  section#contentsAll .creditWrap .credit-each_info {
    font-size: calc(11 / 375 * 100vw);
  }
}
section#contentsAll .creditWrap .credit-each_buy {
  height: -moz-fit-content;
  height: fit-content;
}
section#contentsAll .creditWrap .credit-each_buy a {
  display: block;
  font-family: "Libre Baskerville", serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(calc((11 / 1280) * 100vw), 11px);
  line-height: normal;
  font-optical-sizing: auto;
  border: 1px solid black;
  background-color: black;
  color: white;
  padding: min(calc((1 / 1280) * 100vw), 1px) min(calc((8 / 1280) * 100vw), 8px);
  transition: background-color 0.3s linear;
}
@media screen and (max-width: 768px) {
  section#contentsAll .creditWrap .credit-each_buy a {
    font-size: calc(9 / 375 * 100vw);
    padding: calc(1 / 375 * 100vw) calc(7 / 375 * 100vw);
  }
}
section#contentsAll .creditWrap .credit-each_buy a:hover {
  background-color: white;
  color: black;
  text-decoration: none;
}

/*--------------------container--------------------*/
section#container .kvsec {
  width: min(calc((1042 / 1280) * 100vw), 1042px);
  margin: 0 auto min(calc((90 / 1280) * 100vw), 90px);
}
@media screen and (max-width: 768px) {
  section#container .kvsec {
    width: 100%;
    margin: 0 auto calc(55 / 375 * 100vw);
    flex-direction: column;
  }
}
section#container .kvsec-ttl {
  z-index: 10;
  margin: min(calc((220 / 1280) * 100vw), 220px) min(calc((-120 / 1280) * 100vw), -120px) auto auto;
}
@media screen and (max-width: 768px) {
  section#container .kvsec-ttl {
    margin: calc(-86 / 375 * 100vw) auto auto calc(10 / 375 * 100vw);
    order: 2;
    width: calc(306 / 375 * 100vw);
  }
}
section#container .kvsec-ttl_logo {
  width: min(calc((81 / 1280) * 100vw), 81px);
  margin: 0 auto min(calc((46 / 1280) * 100vw), 46px) 0;
}
@media screen and (max-width: 768px) {
  section#container .kvsec-ttl_logo {
    width: calc(58 / 375 * 100vw);
    margin: 0 auto calc(32 / 375 * 100vw) calc(5 / 375 * 100vw);
  }
}
section#container .kvsec-img {
  margin: auto 0 auto auto;
}
@media screen and (max-width: 768px) {
  section#container .kvsec-img {
    order: 1;
  }
}
section#container .kvsec-img div {
  width: min(calc((363 / 1280) * 100vw), 363px);
}
@media screen and (max-width: 768px) {
  section#container .kvsec-img div {
    width: calc(291 / 375 * 100vw);
    margin: 0 0 0 auto;
  }
}
section#container .lead {
  text-align: center;
  line-height: normal;
  margin: 0 auto min(calc((90 / 1280) * 100vw), 90px);
}
@media screen and (max-width: 768px) {
  section#container .lead {
    margin: 0 auto calc(55 / 375 * 100vw);
  }
}
section#container div[class*=txt] {
  font-family: "Hiragino Mincho ProN", "Hiragino Mincho Pro", "游明朝", "Yu Mincho", "Noto Serif JP", "MS PMincho", "MS Mincho", serif;
  font-weight: 300;
  font-style: normal;
  font-size: min(calc((13 / 1280) * 100vw), 13px);
  line-height: 180%;
}
@media screen and (max-width: 768px) {
  section#container div[class*=txt] {
    font-size: calc(12 / 375 * 100vw);
  }
}
section#container ul.anchorWrap {
  justify-content: center;
  gap: min(calc((10 / 1280) * 100vw), 10px);
  margin: 0 auto min(calc((90 / 1280) * 100vw), 90px);
}
@media screen and (max-width: 768px) {
  section#container ul.anchorWrap {
    gap: calc(20 / 375 * 100vw) calc(10 / 375 * 100vw);
    margin: 0 auto calc(55 / 375 * 100vw);
  }
}
section#container ul.anchorWrap li {
  width: min(calc((190 / 1280) * 100vw), 190px);
}
@media screen and (max-width: 768px) {
  section#container ul.anchorWrap li {
    width: calc(175 / 375 * 100vw);
  }
}
section#container ul.anchorWrap li a {
  display: block;
  transition: opacity 0.3s linear;
}
section#container ul.anchorWrap li a p {
  margin-top: min(calc((5 / 1280) * 100vw), 5px);
  font-family: "Libre Baskerville", serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(calc((12 / 1280) * 100vw), 12px);
  line-height: normal;
  font-optical-sizing: auto;
  line-height: 130%;
}
@media screen and (max-width: 768px) {
  section#container ul.anchorWrap li a p {
    margin-top: calc(5 / 375 * 100vw);
    font-size: calc(10.5 / 375 * 100vw);
    padding-bottom: calc(6 / 375 * 100vw);
  }
}
section#container ul.anchorWrap li a:hover {
  opacity: 0.7;
}
@keyframes infinity-scroll-left {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}
@keyframes infinity-scroll-right {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(0);
  }
}
section#container .loopWrapAll {
  width: 100vw;
  overflow: hidden;
  position: relative;
  margin: 0 auto min(calc((90 / 1280) * 100vw), 90px);
}
@media screen and (max-width: 768px) {
  section#container .loopWrapAll {
    margin: 0 auto calc(55 / 375 * 100vw);
  }
}
section#container .loopWrapAll .loopwrap {
  display: flex;
  overflow: hidden;
  width: 100%;
}
section#container .loopWrapAll .loopwrap .looplist {
  display: flex;
  list-style: none;
}
section#container .loopWrapAll .loopwrap .looplist--left {
  animation: infinity-scroll-left 50s infinite linear 0.5s both;
}
section#container .loopWrapAll .loopwrap .looplist--right {
  animation: infinity-scroll-right 50s infinite linear 0.5s both;
}
section#container .loopWrapAll .loopwrap .looplist-ph {
  width: min(calc((242 / 1280) * 100vw), 242px);
}
@media screen and (max-width: 768px) {
  section#container .loopWrapAll .loopwrap .looplist-ph {
    width: calc(180 / 375 * 100vw);
  }
}
section#container .look {
  margin: 0 auto min(calc((90 / 1280) * 100vw), 90px);
  width: min(calc((760 / 1280) * 100vw), 760px);
  padding-top: min(calc((70 / 1280) * 100vw), 70px);
}
@media screen and (max-width: 768px) {
  section#container .look {
    margin: 0 auto calc(55 / 375 * 100vw);
    padding-top: calc(70 / 375 * 100vw);
    width: calc(355 / 375 * 100vw);
  }
}
section#container .look:nth-of-type(even) .look-sub_img div:last-of-type {
  margin-top: min(calc((122 / 1280) * 100vw), 122px);
}
@media screen and (max-width: 768px) {
  section#container .look:nth-of-type(even) .look-sub_img div:last-of-type {
    margin-top: calc(60 / 375 * 100vw);
  }
}
section#container .look:nth-of-type(odd) .look-sub_img div:first-of-type {
  margin-top: min(calc((122 / 1280) * 100vw), 122px);
}
@media screen and (max-width: 768px) {
  section#container .look:nth-of-type(odd) .look-sub_img div:first-of-type {
    margin-top: calc(60 / 375 * 100vw);
  }
}
section#container .look-main {
  width: min(calc((500 / 1280) * 100vw), 500px);
  margin: 0 auto min(calc((90 / 1280) * 100vw), 90px);
  position: relative;
}
@media screen and (max-width: 768px) {
  section#container .look-main {
    width: 100%;
    margin: 0 auto calc(55 / 375 * 100vw);
  }
}
section#container .look-main_txt {
  margin: min(calc((15 / 1280) * 100vw), 15px) auto min(calc((20 / 1280) * 100vw), 20px) 0;
}
@media screen and (max-width: 768px) {
  section#container .look-main_txt {
    margin: calc(10 / 375 * 100vw) auto calc(15 / 375 * 100vw) 0;
  }
}
section#container .look-sub_img {
  width: 100%;
  justify-content: space-between;
  margin-bottom: min(calc((30 / 1280) * 100vw), 30px);
}
@media screen and (max-width: 768px) {
  section#container .look-sub_img {
    margin-bottom: calc(15 / 375 * 100vw);
  }
}
section#container .look-sub_img div {
  width: min(calc((350 / 1280) * 100vw), 350px);
}
@media screen and (max-width: 768px) {
  section#container .look-sub_img div {
    width: calc(172 / 375 * 100vw);
  }
}
section#container .look-sub_txt {
  margin-bottom: min(calc((30 / 1280) * 100vw), 30px);
}
@media screen and (max-width: 768px) {
  section#container .look-sub_txt {
    margin-bottom: calc(15 / 375 * 100vw);
  }
}
section#container .look-sub .look-credit {
  margin-bottom: min(calc((30 / 1280) * 100vw), 30px);
}
@media screen and (max-width: 768px) {
  section#container .look-sub .look-credit {
    margin-bottom: calc(15 / 375 * 100vw);
  }
}
section#container .look-sub_btn {
  width: -moz-fit-content;
  width: fit-content;
  margin: min(calc((30 / 1280) * 100vw), 30px) min(calc((20 / 1280) * 100vw), 20px) min(calc((50 / 1280) * 100vw), 50px) auto;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  section#container .look-sub_btn {
    margin: calc(25 / 375 * 100vw) calc(20 / 375 * 100vw) calc(25 / 375 * 100vw) auto;
  }
}
section#container .look-sub_btn a {
  display: block;
  cursor: pointer;
}
section#container .look-sub_btn a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}
section#container .look-sub_btn span:first-of-type {
  font-family: "Hiragino Mincho ProN", "Hiragino Mincho Pro", "游明朝", "Yu Mincho", "Noto Serif JP", "MS PMincho", "MS Mincho", serif;
  font-weight: 300;
  font-style: normal;
  font-size: min(calc((12 / 1280) * 100vw), 12px);
  margin-right: min(calc((7 / 1280) * 100vw), 7px);
}
@media screen and (max-width: 768px) {
  section#container .look-sub_btn span:first-of-type {
    font-size: calc(9 / 375 * 100vw);
    margin-right: calc(5 / 375 * 100vw);
  }
}

/*--------------------modal--------------------*/
section#modalWrap {
  padding: 20% 0 10%;
  background-color: #FFF;
  width: 100%;
  height: 100%;
  margin: 0;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 9999;
  overflow: scroll;
  display: none;
  -webkit-overflow-scrolling: touch;
}
@media screen and (max-width: 768px) {
  section#modalWrap {
    box-sizing: border-box;
    padding: calc(190 / 375 * 100vw) 0 calc(30 / 375 * 100vw);
  }
}
section#modalWrap .looks-ttl {
  position: fixed;
  top: min(calc((30 / 1280) * 100vw), 30px);
  left: min(calc((30 / 1280) * 100vw), 30px);
  z-index: 100;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 768px) {
  section#modalWrap .looks-ttl {
    top: calc(10 / 375 * 100vw);
    right: calc(10 / 375 * 100vw);
  }
}
section#modalWrap .looks-ttl_logo {
  width: min(calc((50 / 1280) * 100vw), 50px);
  margin-bottom: min(calc((38 / 1280) * 100vw), 38px);
}
@media screen and (max-width: 768px) {
  section#modalWrap .looks-ttl_logo {
    width: calc(37 / 375 * 100vw);
    margin-bottom: calc(20 / 375 * 100vw);
  }
}
section#modalWrap .looks-ttl_title {
  width: min(calc((264 / 1280) * 100vw), 264px);
}
@media screen and (max-width: 768px) {
  section#modalWrap .looks-ttl_title {
    width: calc(194 / 375 * 100vw);
  }
}
section#modalWrap .btn-close {
  width: min(calc((50 / 1280) * 100vw), 50px);
  height: min(calc((50 / 1280) * 100vw), 50px);
  position: fixed;
  top: min(calc((10 / 1280) * 100vw), 10px);
  right: min(calc((10 / 1280) * 100vw), 10px);
  cursor: pointer;
  z-index: 100;
  display: block;
}
@media screen and (max-width: 768px) {
  section#modalWrap .btn-close {
    width: calc(30 / 375 * 100vw);
    height: calc(30 / 375 * 100vw);
    top: calc(10 / 375 * 100vw);
    right: calc(10 / 375 * 100vw);
  }
}
section#modalWrap .btn-close::before {
  content: "";
  width: min(calc((50 / 1280) * 100vw), 50px);
  height: 1px;
  background-color: #111;
  transform: rotate(-45deg);
  position: absolute;
  left: 0px;
  top: 35px;
  transition: background-color 0.3s linear;
}
@media screen and (max-width: 768px) {
  section#modalWrap .btn-close::before {
    content: "";
    width: calc(30 / 375 * 100vw);
    height: 1px;
    background-color: #111;
    transform: rotate(-45deg);
    position: absolute;
    left: 0px;
    top: 15px;
    transition: background-color 0.3s linear;
  }
}
section#modalWrap .btn-close::after {
  content: "";
  width: min(calc((50 / 1280) * 100vw), 50px);
  height: 1px;
  background-color: #111;
  transform: rotate(45deg);
  position: absolute;
  left: 0px;
  top: 35px;
  transition: background-color 0.3s linear;
}
@media screen and (max-width: 768px) {
  section#modalWrap .btn-close::after {
    content: "";
    width: calc(30 / 375 * 100vw);
    height: 1px;
    background-color: #111;
    transform: rotate(45deg);
    position: absolute;
    left: 0px;
    top: 15px;
    transition: background-color 0.3s linear;
  }
}
section#modalWrap .look_num {
  top: -30px;
}
@media screen and (max-width: 768px) {
  section#modalWrap .look_num {
    top: calc(-25 / 375 * 100vw);
    width: calc(100 / 375 * 100vw);
  }
}
section#modalWrap .look_num .flex {
  align-items: center;
}
section#modalWrap .look_num span:first-of-type {
  margin-top: min(calc((55 / 1280) * 100vw), 55px);
}
@media screen and (max-width: 768px) {
  section#modalWrap .look_num span:first-of-type {
    margin-top: calc(45 / 375 * 100vw);
  }
}
section#modalWrap .look_num .flex {
  align-items: center;
}
section#modalWrap #modal02 .look_num {
  top: -15%;
}
section#modalWrap .modal-look {
  width: min(calc((810 / 1280) * 100vw), 810px);
  margin: 0 auto min(calc((200 / 1280) * 100vw), 200px);
  position: relative;
}
@media screen and (max-width: 768px) {
  section#modalWrap .modal-look {
    width: calc(355 / 375 * 100vw);
    margin: 0 auto calc(150 / 375 * 100vw);
  }
}
section#modalWrap .modal-look_img {
  justify-content: space-between;
  margin-bottom: min(calc((20 / 1280) * 100vw), 20px);
}
@media screen and (max-width: 768px) {
  section#modalWrap .modal-look_img {
    margin-bottom: calc(15 / 375 * 100vw);
    gap: calc(30 / 375 * 100vw);
  }
}
section#modalWrap .modal-look_img div {
  width: min(calc((390 / 1280) * 100vw), 390px);
}
@media screen and (max-width: 768px) {
  section#modalWrap .modal-look_img div {
    width: 100%;
  }
}
section#modalWrap .modal-look .itmName-forAll {
  font-size: min(calc((20 / 1280) * 100vw), 20px);
}
@media screen and (max-width: 768px) {
  section#modalWrap .modal-look .itmName-forAll {
    font-size: calc(16 / 375 * 100vw);
  }
}

body.modal-open {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  overflow: hidden;
}/*# sourceMappingURL=style.css.map */