@charset "UTF-8";



html {font-size: 62.5%;}



main.main-area.lp {

position: relative;

}



#contentsMain {

color: #1c1c1c;

}



/* フェードイン */

#contentsMain .loadFade {

opacity: 0;

transform: translateY(10px);

transition: all 1s;

}

#contentsMain .loadFade.done {

opacity : 1;transform : translate(0, 0);

}

#contentsMain .scrollFade .fade1 {

opacity: 0;

transform: translateY(10px);

transition: all 1s;

}

#contentsMain .scrollFade .fade2 {

opacity: 0;

transform: translateY(10px);

transition: all 1s;

transition-delay: 0.5s;

}

#contentsMain .scrollFade.done .fade1 {

opacity : 1;transform : translate(0, 0);

}

#contentsMain .scrollFade.done .fade2 {

opacity : 1;transform : translate(0, 0);

}



/*==========================

パンくず

==========================*/

.breadcrumbBlock {

background-color: #fff;

}

#breadcrumb {

display: flex;

align-items: center;

width: 100%;

margin: 0 auto;

}

#breadcrumb li {

font-family: 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif !important;

/* color: #CECECE; */

color: #1C1C1C;

letter-spacing: .05em;

}

#breadcrumb li.currentPage {

color: #1C1C1C;

}



/*==========================

LP

==========================*/

#contentsMain {

color: #1C1C1C;

}



#contentsMain .lp_main {

background-color: #fff;

}



#contentsMain .mvBlock {

position: relative;

}



/* MV */

#contentsMain .pageTitle h1 {

font-family: 'museo-sans',sans-serif;

font-weight: 400;

font-style: normal;

letter-spacing: .05em;

}

#contentsMain .pageTitle h2 {

font-family: 'Noto Sans JP', sans-serif;;

font-weight: 400;

font-style: normal;

letter-spacing: .05em;

}

#contentsMain .pageTitle h3 {

font-family: 'Noto Sans JP', sans-serif;;

font-weight: 400;

font-style: normal;

letter-spacing: .05em;

}

.original-border {

font-family: HelveticaNeueLTStd;

display: block;

text-align: center;

vertical-align: middle;

text-decoration: none;

width: 130px;

margin: 2rem auto;

padding: 1rem 2rem;

color: #fff;

background: #141414;

transition: 0.5s;

}

.original-border:hover {

color: #7b836e;

background: #fff;

}



/* アンカーリンク */



/* .btn,

.btn:before {

transition: .3s ease

}



.btn:before {

position: absolute;

display: block;

content: ''

}



.btn:before {

width: 7px;

height: 7px;

border-right: #fff 1px solid;

border-bottom: #fff 1px solid;

transform: rotate(-45deg);

top: calc(50% - 5px);

right: -12px;

}



.btn {

text-align: center;

color: #1C1C1C;

display: block;

border: 1px solid transparent;

width: 280px;

max-width: 280px;

height: 50px;

line-height: 49px;

position: relative;

margin: 0 auto;



} */



.anchor li a {

display: inline-block;

padding: 10px 20px;

background-color: #f0f0f0;

border: 1px solid #ccc;

text-decoration: none;

color: #333;

margin-bottom: 10px;

}



#contentsMain .anchor {

font-family: 'museo-sans','sans-serif'!important;

max-width: 930px;

margin: 1px auto 0;

display: -ms-flexbox;

display: flex;

-ms-flex-align: center;

align-items: center;

-ms-flex-pack: center;

justify-content: center;

}



#contentsMain .anchor li {

position: relative;

margin: 10px 15px !important;

}



#contentsMain .anchor li a {

width: 100%;

font-size: 14px;

}



#contentsMain .anchor li a:before {

transform: rotate(45deg);

}





/* 特集アクセサリー */

#contentsMain .mainTxt {

font-family: 'Helvetica Neue', Arial,'Hiragino Sans' !important;

line-height: 2.25;

letter-spacing: .08em;

text-align: center;

font-size: xx-large;

}

#contentsMain .lpInner h2 {

font-family: 'Noto Sans JP', sans-serif;

line-height: 1.2;

letter-spacing: .05em;

}

#contentsMain .lpInner h3 {

position: relative;

color: #707070;

font-family: 'museo-sans',sans-serif;

font-weight: 400;

font-style: normal;

letter-spacing: .05em;

}

#contentsMain .lpInner .lpTxt {

font-family: 'Helvetica Neue', Arial,'Hiragino Sans', Meiryo, sans-serif !important;

line-height: 1.75;

letter-spacing: .05em;

}

#contentsMain .lpInner .lp_itemCredit {

font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif !important;

line-height: 2.1;

letter-spacing: .05em;

}

#contentsMain .lpInner .lp_itemCredit a {

display: inline-block;

}

#contentsMain .lpInner .lp_itemCredit a span {

text-decoration: underline;

}





/* 特集まとめ */

#contentsMain .lp_ItemAll {

background-color: #EFF6FC;

}



#contentsMain .lp_ItemAll h2 {

font-family: 'Noto Sans JP', sans-serif;

letter-spacing: .05em;

text-align: center;

}

#contentsMain .lp_ItemAll p {

font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif !important;

line-height: 1.75;

letter-spacing: .05em;

text-align: center;

}

#contentsMain .lp_ItemAll .lp_itemList h3 {

font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif !important;

letter-spacing: .05em;

}

#contentsMain .lp_ItemAll .lp_itemList h4 {

color: #575757;

font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN','Hiragino Sans', Meiryo, sans-serif !important;

letter-spacing: .05em;

}



/* コレクション一覧はこちら */

#contentsMain .moreItemBtn a {

display: block;

margin: 0 auto;

color: #0a0a0a;

letter-spacing: .05em;

text-align: center;

background-color: #79836C;

transition: all 0.6s;

}

#contentsMain .moreItemBtn a:hover {

background-color: transparent;

color: #f3f3f3;

opacity: 1;

}



/*************************************SP****************************************/

@media screen and ( max-width:767px ) {



/*==========================

パンくず

==========================*/

#breadcrumb {

padding: calc(28*(100vw/750)) calc(20*(100vw/750));

}

#breadcrumb li {

font-size: calc(22*(100vw/750));

}

#breadcrumb li span {

margin: 0 calc(12*(100vw/750));

}



/*==========================

LP

==========================*/

/* MV */

#contentsMain .mvBlock {

padding: calc(476*(100vw/750)) 0;

}

#contentsMain .mvBlock::before {

content:"";

display:block;

position:fixed;

top:0;

left:0;

z-index:-1;

width:100%;

height:100vh;

background-repeat:no-repeat;

background-position: 0 55px;

background-image: url('../img/mvSp.jpg');

background-size: 100%;

}



#contentsMain .pageTitle {

position: absolute;

top: 42%;

left: 0;

right: 0;

margin: auto;

text-align: center;

}

#contentsMain .pageTitle h1 {

font-size: calc(56*(100vw/750));

}

#contentsMain .pageTitle h2 {

font-size: calc(38*(100vw/750));

}

#contentsMain .pageTitle h3 {

margin-top: calc(16*(100vw/750));

font-size: calc(28*(100vw/750));

}



#contentsMain .lp_main {

padding-bottom: calc(200*(100vw/750));

}



#contentsMain .mainTxt {

padding: calc(80*(100vw/750)) calc(20*(100vw/750)) 0;

font-size: calc(26*(100vw/750));

}



/* アンカーリンク */



#contentsMain .anchor {

max-width: 798px !important;

flex-wrap: wrap !important;

}



#contentsMain .anchor li {

width: 50%;

margin: 10px auto 0 !important;

}





#contentsMain .anchor li a {

font-size: 12px;

}



.btn:before {

right: 40px;

}



/* 特集アクセサリー */

#contentsMain .lpInner {

margin-top: calc(200*(100vw/750));

}

#contentsMain .lpInner .lpContents {

display: flex;

flex-direction: column-reverse;

width: calc(670*(100vw/750));

}



#contentsMain .lpInner .lpContents:nth-of-type(n+2) {

margin-top: calc(160*(100vw/750));

}

#contentsMain .lpInner .lpContents.flexNormal {

margin-left: auto;

}

#contentsMain .lpInner .lpContents.flexReverse .lpLeft {

padding-left: calc(20*(100vw/750));

}

#contentsMain .lpInner .lpContents .lpLeft {

width: calc(640*(100vw/750));

}



#contentsMain .lpInner h2 {

margin-top: calc(80*(50vw/750));

font-size: calc(40*(100vw/750));

}

#contentsMain .lpInner h3 {

margin-top: calc(28*(100vw/750));

padding-left: calc(80*(100vw/750));

font-size: calc(26*(100vw/750));

}

#contentsMain .lpInner h3::before {

/* content: ''; */

display: block;

position: absolute;

top: calc(14*(100vw/750));

/* left: 0; */

width: calc(60*(100vw/750));

height: calc(2*(100vw/750));

background-color: #707070;

}

#contentsMain .lpInner .lpTxt {

margin-top: calc(48*(100vw/750));

font-size: calc(24*(100vw/750));

}

#contentsMain .lpInner .lp_itemCredit {

margin-top: calc(40*(100vw/750));

font-size: calc(20*(100vw/750));

}



/*４℃ 銀座本店*/

#contentsMain .lpInner .lpContents:last-of-type{

padding-left: calc(20*(100vw/750));

}



#contentsMain .lpInner .lpContents.flexReverse.flagship .lpLeft{

padding-left:0;

}



.onlyPc {

display: none !important;

}



/* 特集まとめ */

#contentsMain .lp_ItemAll {

padding: calc(160*(100vw/750)) calc(20*(100vw/750)) calc(160*(100vw/750));

}



#contentsMain .lp_ItemAll h2 {

font-size: calc(44*(100vw/750));

}

#contentsMain .lp_ItemAll p {

margin-top: calc(60*(100vw/750));

font-size: calc(26*(100vw/750));

}

#contentsMain .lp_ItemAll .lp_itemList {

display: flex;

justify-content: space-between;

flex-wrap: wrap;

max-width: calc(710*(100vw/750));

width: 100%;

margin: calc(80*(100vw/750)) auto 0;

}

#contentsMain .lp_ItemAll .lp_itemList li {

width: calc(344*(100vw/750));

}

#contentsMain .lp_ItemAll .lp_itemList li:nth-of-type(n+3) {

margin-top: calc(60*(100vw/750));

}

#contentsMain .lp_ItemAll .lp_itemList h3 {

margin-top: calc(35*(100vw/750));

font-size: calc(26*(100vw/750));

}

#contentsMain .lp_ItemAll .lp_itemList h4 {

margin-top: calc(24*(100vw/750));

font-size: calc(24*(100vw/750));

}



#contentsMain .iframe{

width:100%;

aspect-ratio:1/1;

}





/* コレクション一覧はこちら */

#contentsMain .lp_ItemAll .moreItemBtn a {

width: calc(640*(100vw/750));

height: calc(100*(100vw/750));

margin: calc(70*(100vw/750)) auto 0;

font-size: calc(26*(100vw/750));

line-height: calc(100*(100vw/750));

}



}



/*************************************PC****************************************/

@media screen and (max-width: 1400px) and (min-width: 768px) {

html {font-size: calc(10* (100vw / 1400)) !important;}

}

@media only screen and (min-width: 768px) {



/*==========================

パンくず

==========================*/

#breadcrumb {

max-width: 120rem;

padding: 1.15rem 0;

}

#breadcrumb li {

font-size: 1.1rem;

}

#breadcrumb li span {

margin: 0 .5rem;

}



/*==========================

LP

==========================*/

/* MV */

#contentsMain .mvBlock {

padding: 25.3%;

}

#contentsMain .mvBlock::before {

content:"";

display:block;

position:fixed;

top:0;

left:0;

z-index:-1;

width:100%;

height:100vh;

background-repeat:no-repeat;

background-position: 0 6rem;

background-image: url('../img/mvPc.jpg');

background-size: 100%;

}



#contentsMain .pageTitle {

position: absolute;

top: 20%;

left: 0;

right:50%;

margin: auto;

text-align: center;


}

#contentsMain .pageTitle h1 {

font-size: calc(44*(100vw/1200));

}

#contentsMain .pageTitle h2 {

font-size: calc(30*(100vw/1200));

}

#contentsMain .pageTitle h3 {

margin-top: 1.5rem;

font-size: calc(22*(100vw/1200));

}



#contentsMain .lp_main {

padding-bottom: 10rem;

}



#contentsMain .mainTxt {

margin: 0 auto;

padding-top: 6rem;

font-size: calc(14*(100vw/1200));

}



/* アンカーリンク */



#contentsMain .anchor li {

width: 20%;

}



/* 特集アクセサリー */

#contentsMain .lpInner .lpContents {

width: calc(1200*(100vw/1400));

margin: 10rem auto 0;

}

#contentsMain .lpInner .lpContents.flexNormal {

display: flex;

justify-content: center;

}

#contentsMain .lpInner .lpContents.flexReverse {

display: flex;

flex-direction: row-reverse;

justify-content: center;

}

#contentsMain .lpInner .lpContents.flexNormal .lpLeft {

margin-right: calc(40*(100vw/1400));

padding-left: calc(100*(100vw/1400));

}

#contentsMain .lpInner .lpContents.flexReverse .lpLeft {

margin-left: calc(40*(100vw/1400));

padding-right: calc(100*(100vw/1400));

}



#contentsMain .lpInner h2 {

margin-top: 2rem;

font-size: calc(24*(100vw/1200));

}

#contentsMain .lpInner h3 {

margin-top: 1.4rem;

padding-left: 4rem;

font-size: calc(14*(100vw/1200));

}

#contentsMain .lpInner h3::before {

content: '';

display: block;

position: absolute;

top: .7rem;

left: 0;

width: 3rem;

height: .1rem;

background-color: #707070;

}

#contentsMain .lpInner .lpTxt {

margin-top: 3rem;

font-size: calc(14*(100vw/1200));

}

#contentsMain .lpInner .lp_itemCredit {

margin-top: 3rem;

font-size: calc(12*(100vw/1200));

}



#contentsMain .lpInner .lp_Img {

width: calc(600*(100vw/1400));

}



.onlySmall {

display: none !important;

}



/* 特集まとめ */

#contentsMain .lp_ItemAll {

padding: 12rem 0;

}



#contentsMain .lp_ItemAll h2 {

font-size: calc(26*(100vw/1200));

}

#contentsMain .lp_ItemAll p {

margin-top: 2rem;

font-size: calc(14*(100vw/1200));

}

#contentsMain .lp_ItemAll .lp_itemList {

display: flex;

justify-content: center;

flex-wrap: wrap;

max-width: calc(1200*(100vw/1400));

width: 100%;

margin: 5rem auto 0;

}

#contentsMain .lp_ItemAll .lp_itemList li {

width: calc(270*(100vw/1400));

margin-left: 3.8rem;

margin-bottom: 5rem;

}

#contentsMain .lp_ItemAll .lp_itemList li:nth-of-type(1),

#contentsMain .lp_ItemAll .lp_itemList li:nth-of-type(5),

#contentsMain .lp_ItemAll .lp_itemList li:nth-of-type(9) {

margin-left: 0;

}

#contentsMain .lp_ItemAll .lp_itemList h3 {

margin-top: 1rem;

font-size: calc(12*(100vw/1200));

}

#contentsMain .lp_ItemAll .lp_itemList h4 {

margin-top: 1rem;

font-size: calc(12*(100vw/1200));

}



/* コレクション一覧はこちら */

#contentsMain .moreItemBtn a {

width: calc(318*(100vw/1400));

height: calc(48*(100vw/1400));

margin: calc(70*(100vw/1400)) auto 0;

font-size: calc(15*(100vw/1200));

line-height: calc(48*(100vw/1400));

transition: all 0.6s;

}

#contentsMain .moreItemBtn a:hover {

background-color: transparent;

color: #d071c2;

opacity: 1;

}

}



/*=================================

PC width1200px以上 フォントサイズ固定

=================================*/

@media only screen and (min-width: 1200px) {



/*==========================

LP

==========================*/

/* MV */

#contentsMain .pageTitle h1 {

font-size: 50px;

}

#contentsMain .pageTitle h2 {

font-size: 36px;

}

#contentsMain .pageTitle h3 {

font-size: 32px;

}



#contentsMain .mainTxt {

font-size: 14px;

}



/* アンカーリンク */





/* 特集アクセサリー */

#contentsMain .lpInner h2 {

font-size: 24px;

}

#contentsMain .lpInner h3 {

font-size: 14px;

}

#contentsMain .lpInner .lpTxt {

font-size: 14px;

}

#contentsMain .lpInner .lp_itemCredit {

font-size: 12px;

}



.onlySmall {

display: none !important;

}



/* 特集まとめ */

#contentsMain .lp_ItemAll h2 {

font-size: 26px;

}

#contentsMain .lp_ItemAll p {

font-size: 14px;

}

#contentsMain .lp_ItemAll .lp_itemList h3 {

font-size: 12px;

}

#contentsMain .lp_ItemAll .lp_itemList h4 {

font-size: 12px;

}



/* コレクション一覧はこちら */

#contentsMain .lp_ItemAll .moreItemBtn a {

font-size: 15px;

}



}