/* ----------------------------------------------------------
BASE
---------------------------------------------------------- */
div.mainContents.migration { overflow: visible; }

.page-cafe { min-width: 1260px; }

.page-cafe .mainContents.notExNav.migration article { width: 100%; padding-bottom: 0; }

.page-cafe .mainContents.notExNav.migration article .mainContentsIn .ContentsBox { position: relative; }

.page-cafe article a.js--hover:hover { opacity: 1; }

/* ----------------------------------------------------------
SNS
---------------------------------------------------------- */
.page-cafe ul.sns { position: absolute; right: 2%; top: 0.5vw; z-index: 15; }

.page-cafe ul.sns.footer { position: absolute; right: 3%; bottom: 5; top: auto; }

.page-cafe ul.sns.footer li { padding: 10px 0 0 20px; }

.page-cafe ul.sns.footer li a { width: auto; }

.page-cafe ul.sns li { display: table-cell; vertical-align: middle; padding: 10px 0 0 10px; }

.page-cafe ul.sns li a { display: block; width: 33px; text-align: center; margin: 0 auto; }

.page-cafe ul.sns li.forSp { display: none; }

.mainContentsIn ._btn { display: inline-block; position: relative; padding-right: 1em; }

.mainContentsIn ._btn._next:before { position: absolute; top: 50%; right: 0; display: block; content: ''; height: 0.65vw; width: 0.65vw; border: 0.09vw solid #fff; border-left-width: 0; border-top-width: 0; transform: translate(0, -50%) rotate(-45deg) skew(-7deg, -7deg); }

.mainContents a { color: #fff; text-decoration: none; }

.mainContents a.mod-btn { border-radius: 5em; font-size: 1.09375vw; line-height: 1.2; background: #db3752; padding: 0.78125vw 0.52083vw 0.78125vw 0.52083vw; display: flex; justify-content: center; align-items: center; text-align: center; font-weight: bold; color: #fff; }

.mainContents a.mod-btn.is-small { font-size: 0.88542vw; padding: 0.625vw 0.52083vw 0.625vw 0.52083vw; }

.mainContents a.mod-btn.is-large { font-size: 1.40625vw; line-height: calc(34/28); padding: 1.04167vw 0.52083vw 1.04167vw 0.52083vw; }

.mainContents sup { font-size: 50%; }

.mainContents ._more a { font-weight: normal; }

.mainContents h2 { margin: 0; }

.mainContents h3 { margin: 0; }

.mainContents h4 { margin: 0; }

.mainContents h5 { margin: 0; }

.mainContents ._bold { font-weight: bold; }

/* ----------------------------------------------------------
.block-main
---------------------------------------------------------- */
.block-main { position: relative; background: url(/cafe/melty_chocolate/images/bg-01_v2.jpg); background-size: 100% 100%; }

.block-main img { width: 100%; }

.block-main:after { display: block; content: ""; padding-top: 77.61111%; }

.block-main ._title01 { position: absolute; top: 28.13171%; left: 38.5%; width: 27.5%; }

.block-order-pay { position: relative; background: #d7b68b; color: #500f00; }

.block-order-pay img { width: 100%; }

.block-order-pay sup { font-size: 0.5em; }

.block-order-pay ._inner { width: 71.11111%; margin: 0 auto; padding: 4.6875vw 3.90625% 2.08333vw; box-sizing: border-box; }

.block-order-pay ._inner > ._listNote li { line-height: calc(40/24); }

.block-order-pay .c-col2 { display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 1.5625vw; }

.block-order-pay .c-col2 ._item { flex-basis: 45.76271%; margin-bottom: 1.5625vw; }

.block-order-pay .c-col2 ._item > ._ttl { margin-bottom: 1.04167vw; font-size: 1.66667vw; font-weight: bold; line-height: 1.2; }

.block-order-pay .c-col2 ._item > ._copy { font-size: 1.45833vw; line-height: calc(40/28); }

.block-order-pay .c-col2 ._item > ._btnWrap { margin-bottom: 1.5625vw; }

.block-order-pay .c-col2 ._item ._ttl-ico { display: flex; margin-bottom: 1.5625vw; }

.block-order-pay .c-col2 ._item ._ttl-ico ._ico { flex-basis: 20.37037%; flex-shrink: 0; margin-right: 7.03704%; }

.block-order-pay .c-col2 ._item ._ttl-ico ._text ._ttl { font-size: 1.45833vw; font-weight: bold; line-height: calc(40/28); }

.block-order-pay .c-col2 ._item ._ttl-ico ._text ._copy { font-size: 1.35417vw; line-height: calc(40/26); }

.block-order-pay ._listNote li { font-size: 1.25vw; line-height: calc(36/24); }

.block-order-pay ._title { margin-bottom: 2.60417vw; font-size: 1.45833vw; font-weight: bold; line-height: calc(40/28); text-align: center; }

.block-order-pay ._link { display: block; margin-bottom: 2.60417vw; font-size: 1.45833vw; font-weight: bold; line-height: calc(40/28); text-align: center; color: #500f00; }

.block-order-pay ._btn { display: block; background: #006e44; border: 2px solid #006e44; border-radius: 10vw; color: #fff; text-align: center; padding: 0.67708vw 0.78125vw; font-size: 1.45833vw; font-weight: bold; }

.block-melty { position: relative; background: url(/cafe/melty_chocolate/images/bg-02_v2.jpg); background-size: 100% 100%; color: #ffffff; }

.block-melty img { width: 100%; }

.block-melty sup { font-size: 0.5em; }

.block-melty a { color: #ffffff; }

.block-melty:after { display: block; content: ""; padding-top: 232.66667%; }

.block-melty ._title { position: absolute; top: 7.68863%; left: 34.38889%; width: 33.66667%; }

.block-melty ._lead01 { position: absolute; top: 13.18052%; left: 0; width: 100%; }

.block-melty ._lead02 { position: absolute; top: 56.23209%; left: 19.11111%; }

.block-melty ._t1 { position: absolute; top: 17.66953%; left: 33.33333%; }

.block-melty ._t2 { position: absolute; top: 19.46036%; left: 33.33333%; }

.block-melty ._t3 { position: absolute; top: 25.4298%; left: 43.44444%; }

.block-melty ._t4 { position: absolute; top: 27.22063%; left: 43.44444%; }

.block-melty ._p1 { position: absolute; top: 35.31519%; left: 49.72222%; width: 24.44444%; }

.block-melty ._p2 { position: absolute; top: 59.766%; left: 21.44444%; width: 26.44444%; }

.block-melty ._item01 { position: absolute; top: 39.63706%; left: 18.72222%; }

.block-melty ._item02 { position: absolute; top: 60.17192%; left: 51.38889%; }

.block-melty ._btn01 { position: absolute; top: 49.18816%; left: 18.61111%; width: 21.77778%; }

.block-melty ._btn02 { position: absolute; top: 69.3171%; left: 51.38889%; width: 21.77778%; }

.block-melty ._note01 { position: absolute; top: 73.78223%; left: 18.72222%; }

.block-melty ._youtubeEmb { position: absolute; top: 86.81948%; left: 30.88889%; width: 39.38889%; }

.block-melty ._youtubeEmb:hover { cursor: pointer; }

.block-melty ._listNote li { font-size: 1.25vw; line-height: calc(36/24); }

.block-melty ._listNote li a { border-bottom: 1px solid #3d3935; }

.block-melty ._lead01 { font-size: 1.82292vw; color: #e96a96; font-weight: bold; line-height: calc(48/36); text-align: center; padding-left: 1em; }

.block-melty ._lead02 { font-size: 1.66667vw; color: #cfb58f; font-weight: bold; line-height: calc(48/32); }

.block-melty ._large { font-size: 1.82292vw; font-weight: bold; line-height: calc(48/36); color: #f4d6ab; }

.block-melty ._medium { font-size: 1.45833vw; line-height: calc(53/29); }

.block-melty ._name { margin-bottom: 1.5625vw; font-size: 1.875vw; font-weight: bold; line-height: calc(53/38); color: #f8aa3d; }

.block-melty ._copy { margin-bottom: 2.08333vw; font-size: 1.45833vw; line-height: calc(46/29); }

.block-melty ._more { font-size: 1.25vw; line-height: calc(44/24); font-weight: bold; }

.block-melty .videoWrapper { position: relative; padding-bottom: 63.5%; /* 16:9 */ height: 0; }

.block-melty .videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.block-chocolate { position: relative; background: url(/cafe/melty_chocolate/images/bg-03_v2.jpg); background-size: cover; color: #ffffff; }

.block-chocolate img { width: 100%; }

.block-chocolate sup { font-size: 0.5em; }

.block-chocolate a { color: #ffffff; }

.block-chocolate:after { display: block; content: ""; padding-top: 139.5%; }

.block-chocolate ._title { position: absolute; top: 3.34528%; left: 29.66667%; width: 43.5%; }

.block-chocolate ._lead01 { position: absolute; top: 19.11589%; left: 0; width: 100%; }

.block-chocolate ._t1 { position: absolute; top: 31.26245%; left: 43.61111%; }

.block-chocolate ._t2 { position: absolute; top: 36.43967%; left: 43.61111%; z-index: 2; }

.block-chocolate ._p1 { position: absolute; top: 39.62565%; left: 36.38889%; width: 63.61111%; z-index: 1; }

.block-chocolate ._item01 { position: absolute; top: 58.54241%; left: 24.44444%; z-index: 2; }

.block-chocolate ._btn01 { position: absolute; top: 74.7511%; left: 24.44444%; width: 21.77778%; z-index: 2; }

.block-chocolate ._lead01 { font-size: 1.82292vw; color: #d9ab48; font-weight: bold; line-height: calc(48/36); text-align: center; padding-left: 1em; }

.block-chocolate ._large { font-size: 1.92708vw; font-weight: bold; line-height: calc(53/37); color: #e72267; }

.block-chocolate ._medium { font-size: 1.45833vw; line-height: calc(46/29); }

.block-chocolate ._name { margin-bottom: 1.5625vw; font-size: 1.82292vw; font-weight: bold; line-height: calc(53/38); color: #e72267; }

.block-chocolate ._copy { margin-bottom: 2.08333vw; font-size: 1.45833vw; line-height: calc(46/29); }

.block-chocolate ._more { font-size: 1.25vw; line-height: calc(44/24); font-weight: bold; }

.block-chocolate ._btn01 .mod-btn { background: #d47d16; }

.block-andmore { position: relative; background: #e9dee1; color: #ffffff; }

.block-andmore img { width: 100%; }

.block-andmore sup { font-size: 0.5em; }

.block-andmore a { color: #48210e; }

.block-andmore:after { display: block; content: ""; padding-top: 139.5%; }

.block-andmore #enjoy { position: absolute; top: 70.92792%; left: 0; width: 0; }

.block-andmore ._title01 { position: absolute; top: 5.69494%; left: 31.22222%; width: 39.44444%; }

.block-andmore ._ico01 { position: absolute; top: 72.16249%; left: 43.16667%; width: 25.11111%; z-index: 4; }

.block-andmore ._ico02 { position: absolute; top: 80.60534%; left: 72.55556%; width: 8.55556%; }

.block-andmore ._p01 { position: absolute; top: 22.42135%; left: 15.83333%; width: 28.66667%; z-index: 3; }

.block-andmore ._p02 { position: absolute; top: 47.19235%; left: 58.05556%; width: 28.66667%; z-index: 3; }

.block-andmore ._p03 { position: absolute; top: 76.54321%; left: 11.61111%; width: 36.66667%; }

.block-andmore ._bg01 { position: absolute; top: 20.70888%; right: 0; width: 68.16667%; }

.block-andmore ._bg02 { position: absolute; top: 45.40024%; left: 0; width: 63.61111%; }

.block-andmore ._lead01 { position: absolute; top: 15.53166%; left: 0; width: 100%; }

.block-andmore ._item01 { position: absolute; top: 25.8861%; left: 48.72222%; z-index: 3; }

.block-andmore ._item02 { position: absolute; top: 51.17483%; left: 18.88889%; z-index: 3; }

.block-andmore ._item03 { position: absolute; top: 84.42851%; left: 50.55556%; z-index: 3; }

.block-andmore ._t1 { position: absolute; top: 31.26245%; left: 43.61111%; }

.block-andmore ._bg01 { background: #b57a4f; height: 23.49661%; z-index: 2; }

.block-andmore ._bg02 { background: #b55476; height: 23.49661%; z-index: 2; }

.block-andmore ._lead01 { font-size: 1.82292vw; color: #1e1009; font-weight: bold; line-height: calc(48/36); text-align: center; padding-left: 0.5em; }

.block-andmore ._name { margin-bottom: 1.5625vw; font-size: 2.34375vw; font-weight: bold; line-height: calc(60/48); color: #48210e; }

.block-andmore ._copy { margin-bottom: 2.60417vw; font-size: 1.45833vw; line-height: calc(46/29); color: #48210e; }

.block-andmore ._more { font-size: 1.25vw; line-height: calc(44/24); font-weight: bold; color: #48210e; }

.block-andmore ._item02 ._copy { margin-bottom: 3.64583vw; }

.block-andmore ._item03 ._more { color: #330033; }

.block-anytime { position: relative; background: url(/cafe/melty_chocolate/images/bg-04.jpg); background-size: 100% 100%; color: #000000; }

.block-anytime img { width: 100%; }

.block-anytime sup { font-size: 0.5em; }

.block-anytime a { color: #450a04; }

.block-anytime:after { display: block; content: ""; padding-top: 216.11111%; }

.block-anytime #way1 { position: absolute; top: 18.74036%; left: 0; width: 0; }

.block-anytime #way2 { position: absolute; top: 39.79434%; left: 0; width: 0; }

.block-anytime #way3 { position: absolute; top: 59.51157%; left: 0; width: 0; }

.block-anytime ._title01 { position: absolute; top: 5.70694%; left: 23.66667%; width: 51.22222%; }

.block-anytime ._way01 { position: absolute; top: 19.76864%; left: 18.88889%; width: 30.38889%; }

.block-anytime ._way02 { position: absolute; top: 40.56555%; left: 18.88889%; width: 31.61111%; }

.block-anytime ._way03 { position: absolute; top: 60.12853%; left: 19.33333%; width: 47.55556%; }

.block-anytime ._p01 { position: absolute; top: 21.51671%; left: 52%; width: 18.27778%; }

.block-anytime ._p02 { position: absolute; top: 27.45501%; left: 64.33333%; width: 17.22222%; }

.block-anytime ._p03 { position: absolute; top: 68.86889%; left: 23.16667%; width: 15.11111%; }

.block-anytime ._p04 { position: absolute; top: 68.97172%; left: 43.16667%; width: 15.11111%; }

.block-anytime ._p05 { position: absolute; top: 69.12596%; left: 63.38889%; width: 15.11111%; }

.block-anytime ._p06 { position: absolute; top: 80.79692%; left: 32.88889%; width: 15.11111%; }

.block-anytime ._p07 { position: absolute; top: 80.92545%; left: 53.16667%; width: 15.11111%; }

.block-anytime ._lead01 { position: absolute; top: 12.33933%; left: 0; width: 100%; }

.block-anytime ._lead02 { position: absolute; top: 66.45244%; left: 0; width: 100%; }

.block-anytime ._item01 { position: absolute; top: 20.56555%; left: 69.16667%; }

.block-anytime ._item02 { position: absolute; top: 33.29049%; left: 50.27778%; }

.block-anytime ._item03 { position: absolute; top: 76.34961%; left: 23.16667%; width: 15.11111%; text-align: center; }

.block-anytime ._item04 { position: absolute; top: 76.45244%; left: 43.16667%; width: 15.11111%; text-align: center; }

.block-anytime ._item05 { position: absolute; top: 76.60668%; left: 63.38889%; width: 15.11111%; text-align: center; }

.block-anytime ._item06 { position: absolute; top: 88.38046%; left: 32.88889%; width: 15.11111%; text-align: center; }

.block-anytime ._item07 { position: absolute; top: 88.509%; left: 53.16667%; width: 15.11111%; text-align: center; }

.block-anytime ._copy01 { position: absolute; top: 25.06427%; left: 19.33333%; }

.block-anytime ._copy02 { position: absolute; top: 45.24422%; left: 18.88889%; width: 29.44444%; }

.block-anytime ._listNote { position: absolute; top: 93.98458%; left: 18.88889%; }

.block-anytime ._lead01 { font-size: 1.82292vw; color: #e72267; font-weight: bold; line-height: calc(48/36); text-align: center; padding-left: 1em; }

.block-anytime ._lead02 { font-size: 1.51042vw; color: #000000; line-height: calc(38/30); text-align: center; padding-left: 0.5em; }

.block-anytime ._name { margin-bottom: 0.26042vw; font-size: 1.35417vw; font-weight: bold; line-height: calc(36/27); color: #450a04; }

.block-anytime ._more { font-size: 1.35417vw; line-height: calc(44/26); font-weight: bold; color: #450a04; }

.block-anytime ._listNote li { font-size: 1.09375vw; line-height: calc(44/21); text-indent: -1em; padding-left: 1em; }

.block-anytime ._copy01, .block-anytime ._copy02 { font-size: 1.45833vw; line-height: calc(46/29); }

.block-anytime ._item01 ._name, .block-anytime ._item02 ._name { font-size: 1.51042vw; font-weight: bold; line-height: calc(43/29); color: #450a04; }

.block-anytime ._item01 ._name span, .block-anytime ._item02 ._name span { font-weight: bold; color: #e72267; }

.block-anytime ._item01 ._more, .block-anytime ._item02 ._more { font-size: 1.25vw; line-height: calc(44/24); }

.block-anytime ._item05 ._name, .block-anytime ._item06 ._name, .block-anytime ._item07 ._name { margin-bottom: 1.875vw; }

.block-anytime ._item04 { white-space: nowrap; }

/* ----------------------------------------------------------
.block-banner
---------------------------------------------------------- */
.block-banner { background: url(/cafe/melty_chocolate/images/bg-banner.jpg); background-size: 100% auto; position: relative; padding: 0 0 5vw 0; }

.block-banner img { width: 100%; }

.block-banner ._banners { display: flex; flex-wrap: wrap; justify-content: center; }

.block-banner ._banners > * { width: 43.33%; box-sizing: border-box; }

.block-banner ._banners > *:nth-child(even) { margin-left: 3%; }

.block-banner ._banners > *:nth-child(n+3) { margin-top: 3%; }

.block-banner ._banner-last { margin-top: 3vw; }

.block-banner ._note { position: absolute; left: 5%; bottom: 1vw; color: #835306; font-size: 0.94vw; font-weight: normal; }