/* =============================================
pc
============================================= */

.bg-blk{
    background: #000;
}

.bg-gray{
    background: #f8f8f8
}

.pc-wrap{
    margin: 0 auto;
    max-width: 640px;
}




/* =============================================
common
============================================= */


img {
    width: 100%;
    vertical-align: bottom;
}

.flex-center{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.center-mark{
    margin: 45px auto;
    text-align: center;
}

.center-mark img{
    width: calc(98px / 2);
    height: calc(37px / 2);
}

.fl-menu{
    position: fixed;
    bottom: 0;
    z-index: 999;
    display: flex;
    align-items: flex-end;
}

.mark-trim{
    background: url(../../../img/lp/ninety_ninety_popup_202211/mark-trim.png) no-repeat right;
    background-size: 26px;
    background-position: right 30px center;
}



/* =============================================
#introduction
============================================= */

#introduction .intro-content{
    background: #000;
    color: #fff;
}

#introduction .intro-inner{
    padding: 10px 7% 60px;
}

#introduction h2{
    text-align: center;
    font-weight: bold;
    font-size: 3.6rem;
}

#introduction .popup-txt{
    text-align: center;
    font-size: 1.6rem;
    line-height: 2;
}

#introduction .popup-txt span.marker-white{
    padding: 6px 10px 5px;
    background: #fff;
    color: #000;
    font-weight: bold;
    font-weight: 600;
}

/* =============================================
.content
============================================= */

.content{
    position: relative;
}


.content .sec-head{
    padding: 10px 7% 10px;
}

.content .store-num{
    font-size: 10rem;
    font-weight: bold;
    font-weight: 900;
    text-stroke: 1px #000;
    -webkit-text-stroke: 1px #000;
    color: #fafafa;
    position: relative;
    left: -10px;
    top: 10px;
}

.content .content-title{
    margin-bottom: 20px;
    font-weight: bold;
    font-weight: 600;
    font-size: 3.6rem;
    line-height: 1;
}

.content .sub-title{
    margin-bottom: 20px;
    font-weight: bold;
    font-weight: 600;
    font-size: 2.2rem;
    line-height: 1.3;
}

.content .info{
    margin-bottom: 30px;
    font-size: 1.5rem;
    line-height: 1.8;
}

.content .item-info{
    text-align: center;
}

.content .item-info .item-info-name{
    margin-bottom: 15px;
    font-size: 1.4rem;
    text-decoration: underline;
}

.content .item-info .item-info-color,
.content .item-info .item-info-size,
.content .item-info .item-info-price{
    margin-bottom: 15px;
    font-size: 1.4rem;
    line-height: 1.2;
}

.content .item-info span.sub{
    font-size: 1.3rem;
}

.content .item-info .size-list{
    text-align: center;
}

.content .item-info .size-list img{
    width: calc(445px / 1.5);
    height: calc(162px / 1.5);
}


.content .item-info .item-note{
    margin: 0 7% 20px;
    padding: 6px 10px 5px;
    font-weight: bold;
    font-size: 1.6rem;
    background: #c9c9c9;
}


/* =============================================
#sec-online
============================================= */

#sec-online .online-content{
    padding-bottom: 30px;
    background: #000;
    color: #fff;
}

.title-online{
    margin-bottom: 45px;
}

.online-exclusive-item .sec-head{
    padding: 30px;
    background: url(../../../img/lp/ninety_ninety_popup_202211/item-sewat-gray.png) no-repeat right;
    background-size: 320px;
    background-position: right -65px center;
}

.online-exclusive-item .look{
    margin-bottom: 60px;
}

.online-exclusive-item .buy{
    padding: 0 15px;
}

.online-exclusive-item .buy .before-release{
    margin-bottom: 30px;
}

.online-exclusive-item .buy .before-release .txt-primary{
    margin-bottom: 5px;
    font-weight: bold;
    font-weight: 600;
    font-size: 4.2rem;
    text-align: center;
}

.online-exclusive-item .buy .before-release .txt-primary span.dow{
    font-size: 2.4rem;
}

.online-exclusive-item .buy .before-release .txt-secondary{
    font-weight: bold;
    font-weight: 600;
    font-size: 2.4rem;
    text-align: center;
}

.online-exclusive-item .buy .item-list ul{
    display: flex;
    flex-wrap: wrap;
}

.online-exclusive-item .buy .item-list li{
    box-sizing: border-box;
    width: 50%;
    margin-bottom: 25px;
    padding: 20px;
}

.online-exclusive-item .buy .item-list li .item-image{
    margin-bottom: 15px;
    position: relative;
    }
    
    .online-exclusive-item .buy .item-list li .item-image::after{
    display: block;
    content: "ONLINE\ASOLD OUT";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(0,0,0,0.7);
    width: 100%;
    text-align: center;
    padding: 10px;
    font-size: 2rem;
    font-weight: bold;
    box-sizing: border-box;
    white-space: pre;
    line-height: 1.2;
    }

.online-exclusive-item .buy .item-list li .item-txt{
    margin-bottom: 15px;
}

.online-exclusive-item .buy .item-list li .item-txt .item-color{
    margin-bottom: 10px;
    font-size: 1.4rem;
}

.online-exclusive-item .buy .item-list li .item-txt .item-price{
    font-size: 1.4rem;    
}

.online-exclusive-item .buy .item-list li .buy-btn{
    border: 1px solid #fff;
    padding: 10px;
    text-align: center;
    font-size: 1.4rem;
}

.online-exclusive-item .buy .item-list li .buy-btn a:link  {
	color: #fff;
  transition: 0.3s;
}

.online-exclusive-item .buy .item-list li .buy-btn a:visited  {
	text-decoration: none;
	color: #fff;
}

.online-exclusive-item .buy .item-list li .buy-btn a:hover  {
	text-decoration: none;
	color: #fff;
}





/* =============================================
#sec-store
============================================= */


.store-content{
    padding-top: 30px;
    background: #f8f8f8;
}

.popup-logo-2{
    margin-bottom: 45px;
}

.title-store{
    margin-bottom: 45px;
}

.popup-store-info{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.popup-store-info-title{
    font-weight: 600;
    font-size: 2.6rem;
    line-height: 1.5;

    width: 100%;
    text-align: center;
}

.popup-store-info-title span.dot{
    font-size: 1.8rem;
}

.popup-store-detail{
    margin-top: 15px;

}

.popup-store-detail li{
    font-size: 1.5rem;
    line-height: 1.5;
}


/* =============================================
01 - store-limited-exclusice-item
============================================= */

.store-limited-exclusice-item .sec-head{
    padding: 60px 7% 70px;
    margin-top: -40px;
    background: url(../../../img/lp/ninety_ninety_popup_202211/item-hoodie.png) no-repeat right;
    background-size: 320px;
    background-position: right -60px top;
}


/* =============================================
02 - store-exclusice-item
============================================= */

.store-exclusice-item .sec-head{
    padding: 30px;
    background: url(../../../img/lp/ninety_ninety_popup_202211/item-sewat-black.png) no-repeat right;
    background-size: 320px;
    background-position: right -65px center;
}

.store-exclusice-item .look{
    margin-bottom: 45px;
}

.store-exclusice-item .look-2{
    margin-bottom: 30px;
}

.store-exclusice-item .buy-btn a{
    display: block;
    color: #fff;
    text-decoration: underline;
    background: #000;
    padding: 16px 32px;
    font-size: 1.6rem;
    font-weight: bold;
    font-weight: 600;
}

/* =============================================
03 - store-9090-22aw-collection
============================================= */

.store-9090-22aw-collection .info{
    margin-bottom: 15px;
}

.store-9090-22aw-collection .coming{
    padding: 10px 0 9px;
    font-size: 1.4rem;
    color: #fff;
    background: #c9c9c9;
}

/* =============================================
04 - store-present-campaign
============================================= */

.store-present-campaign{

}

.store-present-campaign .present-cp-list{
    margin: -15px 7% 60px;
    background: #fff;
    padding-bottom: 10px;
}

.store-present-campaign .present-cp-list .list-head{
    margin-bottom: 30px;
    padding: 18px 0 17px;
    background: #000;
    color: #fff;
    font-size: 2.2rem;
    font-weight: bold;
    font-weight: 600;
    text-align: center;
}

.store-present-campaign .present-cp-list .present-img{
    padding-bottom: 45px;
    margin: 45px;
}

.store-present-campaign .present-cp-list .present-3{
    padding-bottom: 0;
}

.store-present-campaign .present-cp-list .pi-line{
    margin-bottom: 45px;
    border-bottom: 1px solid #c9c9c9;
}


.store-present-campaign .present-cp-list .size-m{
    font-weight: bold;
    font-weight: 600;
    font-size: 1.8rem;
    text-align: center;
    line-height: 1.5;
    margin-bottom: 20px;
}

.store-present-campaign .present-cp-list .size-l{
    font-weight: bold;
    font-weight: 600;
    font-size: 2.6rem;
    text-align: center;
    line-height: 1.5;
    margin-bottom: 20px;
}

.store-present-campaign .present-cp-list .size-l span.small{
    font-size: 1.3rem;
}


/* =============================================
05 - store-sneaker-speclalprice-img
============================================= */

.store-sneaker-speclalprice-img{
    margin: auto 7%;
}


/* =============================================
06 - store-coupon 
============================================= */

.store-coupon{

}
.store-coupon .coupon-snkrdunk{
    border-bottom: 1px solid #c9c9c9;
    padding-bottom: 25px;
}

.store-coupon .coupon-img{
    width: calc(677px / 3);
    max-width: 300px;
    margin: 10px 20px 10px 0;
}

.store-coupon .coupon-txt{
    font-size: 1.3rem;
    font-weight: bold;
    font-weight: 600;
    line-height: 1.5;
}


/* =============================================
07 - store-manager
============================================= */

.store-manager-inner{
    position: relative;
    margin-bottom: 45px;
}

.side-hotty .link-instagram{
    position: absolute;
    bottom: 15px;
    left: 57px;
}

.side-hotty .link-tiktok{
    position: absolute;
    bottom: 15px;
    left: 102px;
}

.link-instagram img{
    width: calc(70px / 2);
    height: calc(70px / 2);
}

.link-tiktok img{
    width: calc(177px / 2);
    height: calc(72px / 2);
}

.side-maaya .link-instagram{
    position: absolute;
    bottom: 15px;
    right: 143px;
}

.side-maaya .link-tiktok{
    position: absolute;
    bottom: 15px;
    right: 40px;
}



/* =============================================
#feature-wrap
============================================= */

.feature-wrap{
    background: #f8f8f8;
    padding-top: 30px;
    margin-top: -30px;
    padding-bottom: 100px;
}

.feature-wrap .model-img{
    margin: 10px 7% 30px;
}

.feature-wrap .content{
    margin: 0 7%;
}

.feature-wrap .model-title{
    font-size: 1.6rem;
    font-weight: bold;
    margin-bottom: 15px;
}

.feature-wrap .model-txt{
    font-size: 1.2rem;
    line-height: 2;
    margin-bottom: 15px;
}

.about-9090 .logo-9090 img{
    width: calc(490px / 2);
    height: calc(174px / 2);
    margin-bottom: 30px;
}

.about-9090 p{
    font-size: 1.2rem;
    line-height: 2;
}


/* =============================================
.accordion-area
============================================= */

/*アコーディオン全体*/
.accordion-area{
    list-style: none;
    max-width: 900px;
    width: calc(100% - 14%);
    margin: 0 7% 0;
}

.accordion-area li{
    margin: 10px 0;
}

.accordion-area section {
	border: 1px solid #ccc;
}

/*アコーディオンタイトル*/
.accordion-area .title {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-size:1.3rem;
    font-weight: bold;
    font-weight: 600;
    padding: 12px 20px 9px 50px;
    background: #fff;
    transition: all .5s ease;
}

/*アイコンの＋と×*/
.accordion-area .title::before,
.accordion-area .title::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #333;
    
}
.accordion-area .title::before{
    top:48%;
    left: 15px;
    transform: rotate(0deg);
    
}
.accordion-area .title::after{    
    top:48%;
    left: 15px;
    transform: rotate(90deg);

}
/*　closeというクラスがついたら形状変化　*/
.accordion-area .title.close::before{
	transform: rotate(45deg);
}

.accordion-area .title.close::after{
	transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
.accordion-area .box {
    display: none;/*はじめは非表示*/
    background: #f3f3f3;
    padding: 20px;
}

.accordion-area .box p{
    font-size: 1.2rem;
    line-height: 1.5;
    margin-bottom: 15px;
}

.accordion-area .box p.note-midashi{
    font-weight: bold;
    font-weight: 600;
    font-size: 1.5rem;
    margin-bottom: 10px;
}


.accordion-area .box p.note-midashi::after{
    content: "";
    display: block;
    width: 8px;
    height: 2px;
    background: #000;
    margin: 5px 0 3px;
}

.accordion-area .box p span.txt-bold{
    font-weight: bold;
    font-weight: 600;
}

.accordion-area .box p.sub-midahsi{
    font-weight: bold;
    font-weight: 600;
    font-size: 1.5rem;
}