@charset "UTF-8";
/*------------------------------
 Layout
------------------------------*/
#hnav_item + div { position: relative; z-index: 2;}
.main-wrapper { color: #000000; font-family: "Noto Sans JP", sans-serif; font-weight: 400; overflow: hidden;}
.main-inner { width: 100%; margin: 0 auto;}

#shipsany .shipsany__menu--footer .shipsany__menu--footer--left > ul > li a,
#shipsany .shipsany__menu--footer .shipsany__menu--footer--right .shipsany__top--link a { text-decoration: none;}

.for-sp { display: none !important;}

/* main-visual
------------------------------*/
.main-visual__title { height: 100%; margin: 30px auto 0; font-size: 0; line-height: 0; text-align: center;}
.main-visual__title img { width: auto; max-width: initial; height: 100%; vertical-align: top;}
.main-visual-caption-title { padding: 90px 0 170px 0; font-family: "Noto Sans JP", sans-serif; font-size: 38px; font-weight: 700; line-height: 1.0; text-align: center; position: relative;}

/* content
------------------------------*/
.content { margin: 0 auto 180px;}
.content__inner     { width: 1120px; margin: 0 auto;}
.content__box       { position: relative; margin: 0 auto;}
.content__image-box { position: relative; font-size: 0; line-height: 0; text-align: center;}
.content__image     { display: inline-block;}
.content__column-item--image { position: relative; z-index: 2;}
.content__column-item--credit { width: 100%; display: flex; align-items: flex-end; gap: 30px; position: relative; z-index: 3; box-sizing: border-box;}
.content__column-item--credit-text { position: absolute; z-index: 3;}
.content__column-item--credit-text p { font-family: "Noto Sans JP", sans-serif; font-size: 14px; font-weight: 500; text-align: justify; line-height: 1.6;}
.content__box .number { position: absolute; z-index: 3;}

#itemset01 { margin: 0 0 190px;}
#itemset01 .number { top: 80px; left: 87px;}
#itemset01 .img01  { padding: 0 0 0 135px; margin: 0 0 35px 0; text-align: left;}
#itemset01 .img02  { position: absolute; top:  33px; left: 533px;}
#itemset01 .img03  { position: absolute; top: 587px; left:   0px;}
#itemset01 .content__column-item--credit-text { width: 260px; top: 395px; left: 845px;}
#itemset01 .content__column-item--credit { padding-left: 323px;}

#itemset02 { padding: 80px 0 0 0; margin: 0 0 130px;}
#itemset02 .number { top: 0; right: 72px;}
#itemset02 .img_m  { padding: 0 0 0 560px; margin: 0 0 35px;}
#itemset02 .img01  { position: absolute; top:  42px; left: 500px;}
#itemset02 .img02  { position: absolute; top:  93px; left:   0px;}
#itemset02 .img03  { position: absolute; top: 605px; left: 490px;}
#itemset02 .content__column-item--credit-text { width: 210px; top: 600px; left: 0;}
#itemset02 .content__column-item--credit { padding-right: 85px; justify-content: flex-end;}

#itemset03 { padding: 330px 85px 0 0; margin: 0 0 200px 0;}
#itemset03 .number { top: 72px; left: 585px;}
#itemset03 .img01  { position: absolute; top: -30px; left: -60px; z-index: 4;}
#itemset03 .img02  { position: absolute; top: 373px; left: 294px; z-index: 4;}
#itemset03 .content__column-item--credit-text { width: 410px; top: 215px; left: 625px;}
#itemset03 .content__column-item--credit { flex-direction: row-reverse;}

#itemset04 { padding: 40px 0 0 0; margin: 0 0 125px;}
#itemset04 .number { top: 0; right: 72px;}
#itemset04 .img_m  { padding: 0 0 120px 80px;}
#itemset04 .img01  { position: absolute; top:  30px; left: 120px;}
#itemset04 .img02  { position: absolute; top: 100px; right:-20px;}
#itemset04 .img03  { position: absolute; top: 160px; left: 680px; z-index: 4;}
#itemset04 .img04  { position: absolute; top: 570px; left: 580px;}
#itemset04 .img05  { position: absolute; top: 635px; left: 825px; z-index: 4;}
#itemset04 .content__column-item--credit-text { width: 470px; top: 775px; left: 80px;}
#itemset04 .content__column-item--credit { padding-left: 80px;}

#itemset05 { padding: 250px 0 0 0; margin: 0 0 190px 0;}
#itemset05 .number { top: 115px; left: 80px;}
#itemset05 .img01  { position: absolute; top:  0; left: 300px; z-index: 4;}
#itemset05 .img02  { margin: 0 0 35px 0;}
#itemset05 .img03  { position: absolute; top: 265px; right:  0px;}
#itemset05 .img04  { position: absolute; top: 610px; left: 660px;}
#itemset05 .content__column-item--credit-text { width: 290px; top: 780px; left: 830px;}
#itemset05 .content__column-item--credit { padding-left: 80px;}

#itemset06 { padding: 96px 0 0 0; margin: 0 0 160px 0;}
#itemset06 .number { top: 0; right: 80px;}
#itemset06 .img01  { position: absolute; top:   0px; left: 150px; z-index: 4;}
#itemset06 .img02  { text-align: right;}
#itemset06 .img03  { position: absolute; top: 425px; left:  40px;}
#itemset06 .content__column-item--credit-text { margin: 30px 0 30px 645px; position: relative;}
#itemset06 .content__column-item--credit { flex-direction: row-reverse;}

#itemset07 { margin: 0 0 190px 0;}
#itemset07 .number { top: 115px; left: 80px;}
#itemset07 .img01  { padding: 0 80px 220px 0; text-align: right;}
#itemset07 .img01 img { position: relative; right: -20px;}
#itemset07 .img02  { position: absolute; top:  95px; left: 390px; z-index: 4;}
#itemset07 .img03  { position: absolute; top:  85px; left: 270px;}
#itemset07 .img04  { position: absolute; top: 310px; left:   0px; z-index: 4;}
#itemset07 .img05  { position: absolute; top: 790px; right:  0px;}
#itemset07 .content__column-item--credit-text { width: 250px; top: 725px; left: 560px;}
#itemset07 .content__column-item--credit { padding-left: 80px;}

#itemset08 { padding: 580px 0 0 0; margin: 0 0 250px 0;}
#itemset08 .number { top: 115px; right: 80px;}
#itemset08 .img01  { position: absolute; top:   0px; left: 390px;}
#itemset08 .img02  { position: absolute; top: 285px; left: 320px; z-index: 4;}
#itemset08 .img03  { position: absolute; top: 585px; left: 620px; z-index: 4;}
#itemset08 .content__column-item--credit-text { width: 260px; top: 725px; right: 70px;}
#itemset08 .content__column-item--credit { padding-left: 80px;}

/* credit
------------------------------*/
.credit--space { width: 100%; margin-bottom: 30px;}
.credit__title { font-size: 18px; line-height: 17px; font-weight: 600; letter-spacing: 1px; text-align: left; margin-bottom: 11px;}
.credit__inner { width: 100%;}
.credit__item-box { width: 100%;}
.credit__item { margin-bottom: 16px;}
.credit__item:last-child { margin-bottom: 0;}
.credit__item-inner { display: flex; flex-flow: row wrap;}
.credit__buy-button { width: 36px; margin: -3px 0 0 15px;}
.credit__buy-link   { width: 38px; height: 23px; border: 1px solid #000000; padding: 0; color: #000000; font-family: "Poppins", sans-serif; font-size: 15px; font-weight: 600; line-height: 21px; letter-spacing: 1px; text-decoration: none; box-sizing: border-box; display: flex; justify-content: center; align-content: center;}
.credit__text { font-family: "Poppins", sans-serif; font-size: 17px; font-weight: 400; font-style: normal; line-height: 17px; letter-spacing: 1px; text-align: left; color: #000000;}
.credit__text--small-gray { margin-top: 2px; font-family: "Poppins", sans-serif; font-size: 14px; font-weight: 500; font-style: normal; display: block; letter-spacing: 1px; color: #656565;}

/* gallery
------------------------------*/
.gallery { width: 100%; margin-bottom: 97px;}
.gallery__inner { width: 100%;}
.gallery__item-box { width: 1120px; margin: 0 auto; display: flex; flex-flow: row wrap;}
.gallery__item { position: relative; font-family: "Roboto Condensed", sans-serif; width: 170px; margin-right: 145px; margin-bottom: 66px;}
.gallery__item:nth-child(4n) { margin-right: 0;}
.gallery__item:nth-child(4n-1) .gallery__credit-item { left: -70px;}
.gallery__item:nth-child(4n) .gallery__credit-item { right: 0; margin: 0 0 0 auto;}
.gallery__date { font-family: "Roboto Condensed", sans-serif; color: #000; font-size: 22px; font-weight: 700; line-height: 36px; margin-bottom: 19px;}
.gallery__link { display: block; cursor: pointer;}
.gallery__image-box { font-size: 0; line-height: 0; margin-bottom: 13px;}
.gallery__image { width: 100%; height: auto;}
.gallery__text { color: #000000; font-size: 16px; font-weight: 700; line-height: 18px; text-align: center; font-family: "Roboto Condensed", sans-serif;}
.gallery__icon { display: inline-block; position: relative; padding-right: 24px;}
.gallery__icon::before { content: ""; position: absolute; right: 0; bottom: 6px; width: 17px; height: 7px; background-image: url(/label/shipsany/images/pc/contents/lookbook/2023fw/icon_arrow_black.png); background-size: 100% auto; background-position: top center; background-repeat: no-repeat;}
.gallery__credit-item { position: absolute; top: calc(100% + 15px); left: 0; width: calc(314% + 20px); height: auto; background-color: #FFFFFF; border: 1px solid #eaeaea; transform: translateY(15px); transition-duration: 0.4s; transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1); padding: 17px 20px 10px; box-sizing: border-box; opacity: 0; z-index: 5; visibility: hidden;}
.is-active .gallery__credit-item { transform: translateY(0); opacity: 1; visibility: visible;}
.gallery__credit-item .credit__item-box { display: flex; flex-wrap: wrap; justify-content: space-between; letter-spacing: 0.08em;}
.gallery__credit-item .credit__item { width: calc(50% - 12px); margin-bottom: 7px;}
.gallery__credit-item .credit__buy-button { width: 28px; height: 14px;}
.gallery__credit-item .credit__buy-link { width: 30px; height: 18px; font-size: 10px; line-height: 12px; transform: scale(0.9); padding: 1px 0 0 0;}
.gallery__credit-item .credit__text { font-size: 11px; line-height: 1.1;}
.gallery__credit-item .credit__text--small-gray { font-size: 10px; transform: scale(0.85); transform-origin: left center;}

/* banner
------------------------------*/
.banner { width: 1120px; margin: 0 auto 200px;}
.banner__inner { width: 100%;}
.banner__item-box { display: flex; flex-flow: row wrap;}
.banner__item { width: 416px; margin-right: 203px;}
.banner__item:last-child { margin-right: 0;}
.banner__title { font-family: "Roboto Condensed", sans-serif; font-size: 37px; line-height: 1; margin-bottom: 26px; font-weight: bold;}
.banner__link  { display: block; font-size: 0; line-height: 0;}
.banner__image { width: 100%; height: auto;}

/* links
------------------------------*/
.links { width: 1120px; margin: 0 auto 140px;}
.links__item-box { display: flex; flex-flow: row wrap;}
.links__item { margin-right: 55px;}
.links__item:last-child { margin-right: 0;}
.links__link { display: inline-block; font-family: "Questrial", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif; font-size: 32px; font-weight: bold; line-height: 59px; text-decoration: none;}

/* slide
------------------------------*/
.slide-box { position: relative; width: auto;}
.slide,
.slide-2-1,
.slide-2-2 { position: absolute; left: 0; top: 0; width: 100%; height: auto; animation-fill-mode: both; animation-timing-function: linear; animation-duration: 9s; animation-iteration-count: infinite;}
.slide-2-1 { position: relative; width: 100%; height: auto; animation-name: slideAnime; animation-delay: 0s;}
.slide-2-2 { animation-name: slideAnime; animation-delay: 4.5s;}

/* keyframes 2枚の時
--------------------*/
@keyframes slideAnime {
	0%   { opacity: 0;}
  25%  { opacity: 1;}
  50%  { opacity: 1;}
  75%  { opacity: 0;}
  100% { opacity: 0;}
}
