@charset "UTF-8";
:root {
    --gothic  : "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
    --f-color : #444444;
    --i-right : url("data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAACD0lEQVQ4jbWVwYsScRTHP4pkgRF2SjCwiECQLu5Z9rZ2CPTmhnjzf2j7J/RvUClPChFktxVvCw60ihJEYG5IF0UQZER88WSUdppRt6UvDMzvzXufmd+b93vPIyK4KAicAi+BF8AjYAFcAd+AT8B7YOIYrWDbdVdEzkRkIvulPm9F5J6dY4dGRKRzANCujhXrCA6LyPAfoBsNLcY1sG7/4hbQjS42admA37h5NptNMQzjJnD9P2hVPAS+Aw/sP7bX61GpVFitVhwfH3NycoLH43Groo2mwFOvVVJ/QfWt5+fna6hK78vlMovFYh9YWaf6xR+AV04epmlSrVbp9/tbWygUIpfLEQwGd8E/KvgH8NjNQ7+80WjQbDa3tkAgQDabJRKJuIUNFWwCd/btzzAMarUay+Vyvfb5fKRSKY6OjpzcF5pjcx9UFYvFCIfD27W+oNVqrdPlJB8wAu7vgk4mE0qlEqPRaGuLRqNkMhn8fr9TyC8FfwWeu0EHg8G6Gmaz2daWSCRIJpN4vV63sC8K/uxWFe12m3q9fi2v6XSaeDy+a4OqhtdqfVP7E62Gbre7hWol5PP5Q6DTNdM60mdOZ3M+n0uhUJBisSjj8fhGR3oD1sZx6eSlQNM0D4V27E1Ir2ci8vNQgoOuLIZjo3/yPxr9n2nRcXOr0bRvmL4GktYwDVl2PSWXWlLAO8dhCvwGmte4Kkdq0KQAAAAASUVORK5CYII=");
    --i-window: url("data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAOCAYAAAAmL5yKAAAAS0lEQVQokWN0cXFhgIL/DKSDaBY0LYwkGLEURDCRYSsKoIoBHxgYGPgH1AWjBlAI0FMiqcl5K7IBpCRjDC+AEhPIdkK4HUU3AwMDANf8EBAMgCC0AAAAAElFTkSuQmCC");
    --i-down  : url("data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAACoAAAASCAYAAAAt6kybAAABLklEQVRIic3WzyoFUQDH8c+VsmBhz84jKEpix8LKn42lKKWsvcLNA1wklqJ4AUuxsVEewM5eYWFFp87U7Tb3ujNzjPtbzszi25lP0zSazeY4VnCBb4O3CUwPxax9XGJswDLn8YjJEPqGRbzjAVMDEBi2h2tsoZWd6Bd2cBxjl/8xcARn2MUcbsPFoY6HjrAeHzxAo+bI4PEOozHyJbvRGSqe6CxWa3abebzBJj7bb+aFhr3W7Lbd42He16dbqJrc5nrMW6/QbMHtBs4Tu+3qsWxo2D1msJbIbU+PVUJFtwv4qOj2V49VQ0W32zgp4bZvjylCs7UKui3kMWWoAm4Le0wdqg+3pTz+Ragct0tVPeZtOEFotuD2GVfxhJ9iZKlX3bmUoWGZ2/AjfprsRxw/+vBUSs1PGZwAAAAASUVORK5CYII=");
    --i-up    : url("data:img/png;base64,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");
}
html {
    font-family: var(--gothic);
}
[data-ff="mincho"]{font-family: var(--mincho);}

.lp-contents {
    max-width: 1920px;
    min-width: 1100px;
    margin-inline: auto;
    background-color: #f7f7f7;
    color: var(--f-color);
}

/* =====================
  MV
===================== */
.mv{
    position: relative;
    z-index: 1;
    padding-top: 1.3em;
    padding-bottom: 12.4em;
    overflow: hidden;
}
.mv .logo svg{
    width: 200px;
    height: 47px;
}
.mv .mv-ttl{
    margin-top: 2.9em;
}
.mv-deco{
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}
.mv-deco .item{
    position: absolute;
    content: "";
    background-repeat: no-repeat;
}
.mv-deco .item[data-id="1"]{
    width: 100%;
    height: 100%;
    background-position: center top;
    background-image: url(../img/mv/deco01.png);
    left: 0;
    top: 0;
}
.mv-deco .item[data-id="2"]{
    width: 431px;
    height: 772px;
    background-image: url(../img/mv/deco02.png);
    right: 50%;
    margin-right: 10.5em;
    bottom: -8.5em;
}
.mv-deco .item[data-id="3"]{
    width: 953px;
    height: 596px;
    background-image: url(../img/mv/deco03.png);
    top: 0;
    left: 50%;
    margin-left: 0.5em;
}
.mv-deco .item[data-id="4"]{
    width: 100%;
    height: 100%;
    background-position: center bottom;
    background-image: url(../img/mv/deco04.png);
    left: 0;
    top: 0;
}

/* ==== Grid処理 ==== */
.mv {
    display: grid;
    justify-content: center;
    justify-items: center;
}

/* =====================
  コンセプト
===================== */
.unit01{
    padding-top: 26px;
    position: relative;
    z-index: 1;
}
.unit01::before{
    position: absolute;
    content: "";
    width: 289px;
    height: 311px;
    left: 50%;
    top: -11em;
    margin-left: 17em;
    background-repeat: no-repeat;
    background-image: url(../img/unit01/deco01.png);
}
.unit01::after{
    position: absolute;
    content: "";
    width: 908px;
    height: 118px;
    background-repeat: no-repeat;
    background-image: url(../img/unit01/deco03.png);
    bottom: 2em;
    left: 50%;
    margin-left: 3.7em;
    z-index: 2;
}
.unit01 .inner{
    margin-bottom: -3em;
    padding-bottom: 18.5em;
    background-repeat: no-repeat;
    background-position: calc(50% + 1em) bottom;
    background-image: url(../img/unit01/deco02.png);
    position: relative;
    z-index: 2;
}
.unit01 .text {
    font-size: 24px;
    font-weight: bold;
    margin-top: 1.7em;
    line-height: 2.3;
}

/* =====================
  厳選
===================== */
.unit02{
    padding-top: 10em;
    padding-bottom: 5em;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center top;
    background-image: url(../img/unit02/deco01.png);
    position: relative;
}
.unit02::before,
.unit02::after {
    position: absolute;
    content: "";
    background-repeat: no-repeat;
    height: 635px;
    z-index: 1;
}
.unit02::before{
    width: 613px;
    right: 50%;
    margin-right: 347px;
    top: -280px;
    background-image: url(../img/unit02/deco02.png);
}
.unit02::after{
    width: 631px;
    left: 50%;
    margin-left: 329px;
    bottom: -150px;
    background-image: url(../img/unit02/deco03.png);
}
.unit02 .img-wrapper{
    display: flex;
    justify-content: center;
    margin-top: 5em;
    gap: 2.5em;
    position: relative;
}
.unit02 .img-wrapper::before {
    position: absolute;
    content: "";
    background-repeat: no-repeat;
    background-image: url(../img/unit02/deco04.png);
    width: 671px;
    height: 937px;
    right: 100%;
    margin-right: -6.5em;
    top: 50%;
    margin-top: -390px;
}
.unit02 .text{
    font-size: 24px;
    font-weight: bold;
    margin-top: 2.7em;
    line-height: 2.3;
}

/* ==== Grid処理 ==== */
.unit02 .inner{
    display: grid;
    justify-content: center;
}

/* =====================
  ピックアップ
===================== */
.unit03{
    padding-top: 11.7em;
    padding-bottom: 4.7em;
    background-image: url(../img/unit03/deco01.png);
    background-repeat: no-repeat;
    background-position: center top;
}
.unit03 .inner{
    width: 1100px;
    margin-inline: auto;
}
.unit03 .title-wrapper .text{
    font-size: 24px;
    font-weight: bold;
    margin-top: 1em;
}
.unit03 .list{
    margin-top: 4em;
}
.unit03 .list .item {
    background-color: #fff;
    position: relative;
    padding: 3.7em 3em 3.2em;
}
.unit03 .list .item::after {
    position: absolute;
    content: "";
    width: calc(100% - 8px);
    height: calc(100% - 8px);
    pointer-events: none;
    border: 6px solid #f7f7f7;
    left: 4px;
    top: 4px;
}
.unit03 .list .item + .item{
    margin-top: 6em;
}
.unit03 .list .item .head3{
    font-size: 28px;
    font-weight: bold;
    line-height: 2;
}
.unit03 .list .item .head3.new::before {
    display: block;
    content: "NEW";
    color: #fff;
    background-color: #cc0000;
    line-height: 1;
    width: min-content;
    padding: 0.2em 1.4em 0.2em 0.7em;
    clip-path: polygon(0% 100%,0% 0%,100% 0%,calc(100% - 0.7em) 50%,100% 100%);
    margin-bottom: 0.85em;
}
.unit03 .list .item .text{
    font-size: 18px;
    font-weight: bold;
    line-height: 2.5;
    margin-top: 1.7em;
}
.unit03 .list .item .link-list{
    margin-top: 2.1em;
}
.unit03 .list .item .link-item{
    counter-reset: alpha;
}
.unit03 .list .item .link-item + .link-item{
    margin-top: 2em;
}
.unit03 .list .item .link-box{
    align-items: center;
}
.unit03 .list .item .link-box + .link-box{
    margin-top: 1.7em;
}
.unit03 .list .item .df > * + *{
    margin-left: 1em;
}
.unit03 .list .item :not(.link-box) .button{
    margin-top: 0.35em;
}
.unit03 .list .item .link-box > .price::before{
    counter-increment: alpha;
    content: counter(alpha,upper-alpha);
    background-color: #777777;
    color: #fff;
    line-height: 1;
    display: inline-block;
    border-radius: 3px;
    padding: 0.05em 0.2em;
    margin-right: 0.3em;
    vertical-align: 0.1em;
}
.unit03 .list .item .link-box > * + .price::before{
    display: none;
}
.unit03 .list .item .type{
    font-size: 18px;
    line-height: 2.5;
    font-weight: bold;
}
.unit03 .list .item .price {
    font-size: 20px;
    font-weight: bold;
}
.unit03 .list .item .price strong {
    font-size: 24px;
    margin-right: 0.3em;
}
.unit03 .list .item .button .btn{
    color: #fff;
    background-color: #777777;
    font-weight: bold;
    font-size: 18px;
    border-radius: 8px;
    padding: 0.5em 0.8em;
    display: inline-flex;
    align-items: center;
}
.unit03 .list .item .button .btn::after{
    display: inline-block;
    content: "";
    width: 22px;
    height: 22px;
    margin-left: 0.6em;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-image: var(--i-right);
}
.unit03 .list .item .link{
    display: inline-block;
    font-size: 14px;
    margin-top: 2.6em;
}
.unit03 .list .item .link::before{
    display: inline-block;
    content: "";
    width: 0.6em;
    height: 0.8em;
    background-color: currentColor;
    clip-path: polygon(0% 100% ,0% 0%,100% 50%);
    margin-right: 0.4em;
}
.unit03 .foot{
    margin-top: 4.7em;
}
.unit03 .foot .text{
    font-size: 24px;
    font-weight: bold;
}
.unit03 .foot .text::after{
    display: block;
    content: "";
    width: 42px;
    height: 18px;
    background-image: var(--i-down);
    margin-inline: auto;
    margin-top: 1.2em;
    animation: arrow 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s infinite alternate;
    position: relative;
}
.unit03 .foot .more-button{
    margin-top: 2.5em;
}
.unit03 .foot .more-button .btn{
    border: 1px solid currentColor;
    display: inline-flex;
    align-items: center;
    padding: 0.5em 1.2em;
    transition: all 0.3s;
}
.unit03 .foot .more-button .btn::before{
    display: inline-block;
    content: "";
    width: 1em;
    height: 1em;
    background-image: var(--i-window);
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 1em;
}
.unit03 .foot .more-button .btn::after{
    display: inline-block;
    content: "";
    width: 0.55em;
    height: 0.55em;
    border-right: 1px solid;
    border-top: 1px solid;
    transform: rotate(45deg);
    margin-top: -0.15em;
    margin-left: 1em;
}
.unit03 .foot .more-button .btn:hover {
    transform: scale(1.1);
}

@keyframes arrow {
    0% {
        opacity: 1;
        top: 0;
    }
    100% {
        opacity: 0.5;
        top: -8px;
    }
}

/* ==== Grid処理 ==== */
.unit03 .list .item {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 2.7em;
    align-items: start;
}
.unit03 .list .item .img-wrapper {
    display: grid;
    grid-template-columns: repeat(2, auto);
    gap: 2.5em;
}
.unit03 .list .item .img-wrapper .img[data-id="1"] {
    grid-column: 1/3;
}

/* =====================
  リボン掛け
===================== */
.unit04 {
    position: relative;
    overflow: hidden;
    padding-top: 21.3em;
    padding-bottom: 9em;
    background-image: url(../img/unit04/deco01.png);
    background-repeat: no-repeat;
    background-position: center top;
    background-color: #fff;
}
.unit04::after {
    position: absolute;
    content: "";
    width: 1920px;
    height: 164px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    background-image: url(../img/footer/bg.png);
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
}
.unit04 .head2 {
    font-size: 40px;
    font-weight: bold;
    text-align: center;
}
.unit04 .head2::before,
.unit04 .head2::after{
    display: inline-block;
    content: "";
    width: 2px;
    height: 1.5em;
    background-color: currentColor;
    vertical-align: text-bottom;
}
.unit04 .head2::before {
    transform: rotate(-40deg);
    margin-right: 1.5em;
}
.unit04 .head2::after {
    transform: rotate(40deg);
    margin-left: 1.5em;
}
.unit04 .text {
    font-weight: bold;
    font-size: 26px;
    line-height: 2;
    margin-top: 1em;
}
.unit04 .text::after {
    display: block;
    content: "";
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url(../img/unit04/deco02.png);
    width: 189px;
    height: 155px;
    margin-top: -0.5em;
}

/* ==== Grid処理 ==== */
.unit04 .text {
    display: grid;
    justify-content: center;
    align-items: center;
}
.unit04 .text::after {
    grid-column: 2/3;
}

/* =====================
  フッター
===================== */
.footer {
    background-color: var(--f-color);
    padding-top: 4.7em;
    padding-bottom: 6.5em;
    position: relative;
}
.footer .logo .main-logo path {
    fill: #fff;
}
.footer .logo a {
    display: inline-block;
}
.footer .logo svg {
    width: 351px;
    height: 82px;
}
.footer small {
    color: #fff;
    font-size: 16px;
    margin-top: 1.6em;
}

/* =====================
  ページトップ
===================== */
.lp-contents .to-top {
    position: absolute;
    bottom: inherit;
    top: -1.5em;
    left: 50%;
    right: inherit;
    margin-left: 17em;
    background-color: #c161bc;
    font-size: 24px;
    border-radius: 30px;
    width: 150px;
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #fff;
    font-weight: bold;
}
.lp-contents .to-top::after {
    background-image: var(--i-up);
    width: 35px;
    height: 22px;
    position: static;
    display: block;
    transform: none;
    margin-top: 0.3em;
}
.lp-contents .to-top:hover {
    filter: brightness(1.2);
}

/* =====================
  アニメーション
===================== */
/* ==== keyframes ==== */
@keyframes bound-state {
    0% {
        opacity: 0;
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        -ms-transform: scale(0);
        -o-transform: scale(0);
        transform: scale(0);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
    }
}
@keyframes Rotate {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* ==== 共通 ==== */
.js-scroll[data-parallax="top"] {
    opacity: 0;
    transition: all 1000ms cubic-bezier(0.22, 1, 0.36, 1);
    transform: translateY(30px);
}
.js-scroll[data-parallax="top"].inview {
    transform: translateY(0);
    opacity: 1;
}

/* ==== MV ==== */
.mv .logo ,
.mv .mv-deco .item {
    transition-property: all;
    transition-duration: 1200ms;
    transition-timing-function: var(--easeOutExpo);
    opacity: 0;
}
.mv .logo{
    transition-delay: 1400ms;
}
.mv .mv-deco .item[data-id="1"] {
    transition-delay: 600ms;
    transition-duration: 1400ms;
    -webkit-clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
    clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
}
.mv .mv-deco .item[data-id="2"] {
    transition-delay: 0ms;
}
.mv .mv-deco .item[data-id="3"] {
    transition-delay: 200ms;
}
.mv .mv-deco .item[data-id="4"] {
    transition-delay: 500ms;
}
.mv.inview .logo ,
.mv.inview .mv-deco .item {
    opacity: 1;
    transform: none;
}
.mv.inview .mv-deco .item[data-id="1"] {
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
.mv .mv-ttl{
    opacity: 0;
    animation-timing-function: ease-out;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: forwards;
    animation-delay: 1500ms;
    animation-duration: 800ms;
}
.mv.inview .mv-ttl{
    animation-name: bound-state;
}

/* ==== コンセプト ==== */
.unit01::before{
    animation-name: Rotate;
    animation-delay: 2000ms;
    animation-duration: 1800ms;
    animation-timing-function: var(--easeInOutBack);
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: none;
    animation-play-state: running;
    transition: opacity 500ms;
    transition-delay: 1700ms;
    opacity: 0;
}
.unit01.inview::before{
    opacity: 1;
}

/* ==== 厳選 ==== */
.unit02::before,
.unit02::after{
    transition-property: all;
    transition-duration: 1800ms;
    transition-timing-function: var(--easeOutExpo);
    opacity: 0;
}
.unit02::before{
    -webkit-clip-path: polygon(0% 100%, 0% 100%,100% 100%, 100% 100%);
    clip-path: polygon(0% 100%, 0% 100%, 100% 100%, 100% 100%);
}
.unit02::after{
    transition-delay: 1000ms;
    -webkit-clip-path: polygon(0% 0%, 0% 0%,100% 0%, 100% 0%);
    clip-path: polygon(0% 0%, 0% 0%, 100% 0%, 100% 0%);
}
.unit02 .img-wrapper::before{
    transition-property: all;
    transition-duration: 1200ms;
    transition-timing-function: var(--easeOutExpo);
    opacity: 0;
    transition-delay: 800ms;
}
.unit02.inview::before,
.unit02.inview::after {
    opacity: 1;
}
.unit02.inview::before {
    -webkit-clip-path: polygon(0% 100%,0% 0%, 100% 0%, 100% 100%);
    clip-path: polygon(0% 100%, 0% 0%, 100% 0%, 100% 100%);
}
.unit02.inview::after {
    -webkit-clip-path: polygon(0% 0%,0% 100%, 100% 100%, 100% 0%);
    clip-path: polygon(0% 0%, 0% 100%, 100% 100%, 100% 0%);
}
.unit02.inview .img-wrapper::before{
    opacity: 1;
}

/* ==== リボン掛け ==== */
.unit04{
    transition-property: all;
    transition-duration: 1200ms;
    transition-timing-function: var(--easeOutExpo);
    opacity: 0;
}
.unit04.inview {
    opacity: 1;
}