/* ### reset.scss ### */
/*
YUI 3.14.1 (build 63049cb)
Copyright 2013 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, label, textarea, p, blockquote, th, td { margin: 0; padding: 0; box-sizing: border-box; }

table { border-collapse: collapse; border-spacing: 0; }

fieldset, img { border: 0; vertical-align: top; }

address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; }

ol, ul { list-style: none; }

caption, th { text-align: left; }

h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }

q:before, q:after { content: ''; }

abbr, acronym { border: 0; font-variant: normal; }

sup { vertical-align: text-top; }

sub { vertical-align: text-bottom; }

input, textarea, select { font-family: inherit; font-size: inherit; font-weight: inherit; *font-size: 100%; }

legend { color: #000; }

#yui3-css-stamp.cssreset { display: none; }

figure { margin: 0; }

img { max-width: 100%; height: auto; }

/* Custom CSS --------------------------------------- */
/* ### setting.scss ### */
/* ### mixin.scss ### */
/* animation */
@-webkit-keyframes animation { 0% { width: 0; }
  100% { width: 30%; } }
@keyframes animation { 0% { width: 0; }
  100% { width: 30%; } }
@-webkit-keyframes circle { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
@keyframes circle { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
/* echoesCardResult */
.echoesCard { text-align: center; position: fixed; opacity: 0; visibility: hidden; transition: all .3s linear; z-index: 999; }
.echoesCard.active { opacity: 1; visibility: visible; }
.echoesCard.none { display: none; }
.echoesCardCont { padding: calc(40 / 750 * 100vw) calc(40 / 750 * 100vw) calc(30 / 750 * 100vw); width: calc(650 / 750 * 100vw); background: #fff; position: fixed; top: calc(50 / 750 * 100vw); left: calc(50% - 325 / 750 * 100vw); z-index: 1; }
.echoesCardTtl { margin: 0 calc(75 / 750 * 100vw); margin-bottom: calc(60 / 750 * 100vw); display: block; }
.echoesCardLoading { margin: 0 calc(80 / 750 * 100vw); display: none; }
.echoesCardLoadingItem { font-size: 10px; margin: 0 auto 30px; text-indent: -9999em; width: 11em; height: 11em; border-radius: 50%; background: #ffffff; background: -moz-linear-gradient(left, #ffffff 0%, #4f4f4f 70%); background: -webkit-linear-gradient(left, #ffffff 0%, #4f4f4f 70%); background: -o-linear-gradient(left, #ffffff 0%, #4f4f4f 70%); background: -ms-linear-gradient(left, #ffffff 0%, #4f4f4f 70%); background: linear-gradient(to right, #ffffff 0%, #4f4f4f 70%); position: relative; -webkit-animation: circle 1s infinite linear; animation: circle 1s infinite linear; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); }
.echoesCardLoadingItem:before { width: 50%; height: 50%; background: #fff; border-radius: 100% 0 0 0; position: absolute; top: 0; left: 0; content: ''; }
.echoesCardLoadingItem:after { background: #fff; width: 75%; height: 75%; border-radius: 50%; content: ''; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; }
.echoesCardLoadingTxt { margin-bottom: calc(65 / 750 * 100vw); font-size: calc(40 / 750 * 100vw); font-weight: 600; line-height: 1; display: inline-block; white-space: nowrap; }
.echoesCardLoadingTxt span { margin-left: calc(2 / 750 * 100vw); width: calc(20 / 750 * 100vw); height: calc(4 / 750 * 100vw); display: inline-block; vertical-align: middle; background-position: 0 0; background-repeat: repeat-x; background-size: calc(8 / 750 * 100vw) 100%; background-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(0.5, transparent), color-stop(0.5, #000), to(#000)); background-image: -webkit-linear-gradient(left, transparent calc(2 / 750 * 100vw), #000 calc(10 / 750 * 100vw)); background-image: linear-gradient(to right, transparent calc(2 / 750 * 100vw), #000 calc(10 / 750 * 100vw)); -webkit-animation: animation 1.5s linear infinite; animation: animation 1.5s linear infinite; }
.echoesCardLoading.active { display: block; }
.echoesCardWin { margin-bottom: calc(30 / 750 * 100vw); display: none; }
.echoesCardWin.active { display: block; }
.echoesCardLose { margin-bottom: calc(30 / 750 * 100vw); display: none; }
.echoesCardLose.active { display: block; }
.echoesCardOverlay { opacity: 1; visibility: visible; background: rgba(0, 0, 0, 0.5); position: fixed; top: 0; right: 0; left: 0; bottom: 0; }
.echoesCardClose { margin-top: calc(30 / 750 * 100vw); padding-top: calc(25 / 750 * 100vw); border-top: calc(2 / 750 * 100vw) solid #cdcdcd; line-height: 1; display: none; }
.echoesCardClose.active { display: block; }
.echoesCardCloseTxt { font-size: calc(30 / 750 * 100vw); font-weight: 600; letter-spacing: -.02em; cursor: pointer; }
.echoesCardCloseTxt span { position: relative; }
.echoesCardCloseTxt span:before { content: ""; width: calc(32 / 750 * 100vw); height: calc(32 / 750 * 100vw); display: block; background: url(../img/echoesCard/close.png) 0 0/contain no-repeat; position: absolute; top: calc(-2 / 750 * 100vw); left: calc(-50 / 750 * 100vw); }

@media screen and (max-width: 640px) { .echoesCardTtl img { width: calc(418 / 750 * 100vw); } }
@media screen and (min-width: 641px) { .echoesCardCont { padding: 40px 40px 30px; width: 450px; top: 50px; left: calc(50% - 225px); }
  .echoesCardTtl { margin: 0 37px; margin-bottom: 40px; }
  .echoesCardLoading { margin: 0 auto; }
  .echoesCardLoadingItem { font-size: 10px; margin: 0 auto 10px; text-indent: -9999em; width: 11em; height: 11em; border-radius: 50%; position: relative; }
  .echoesCardLoadingTxt { margin-top: 20px; margin-bottom: 50px; font-size: 40px; }
  .echoesCardLoadingTxt span { margin-left: 2px; width: 20px; height: 4px; background-size: 8px 100%; background-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(0.5, transparent), color-stop(0.5, #000), to(#000)); background-image: -webkit-linear-gradient(left, transparent 2px, #000 10px); background-image: linear-gradient(to right, transparent 2px, #000 10px); }
  .echoesCardLoading.active { display: block; }
  .echoesCardWin { margin-bottom: 30px; }
  .echoesCardLose { margin-bottom: 30px; }
  .echoesCardClose { margin-top: 30px; padding-top: 20px; border-top: 2px solid #cdcdcd; }
  .echoesCardCloseTxt { font-size: 26px; }
  .echoesCardCloseTxt span:before { content: ""; width: 26px; height: 26px; top: 1px; left: -40px; } }
/* Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }

.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; }

.slick-list:focus { outline: none; }

.slick-list.dragging { cursor: pointer; cursor: hand; }

.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; }

.slick-track:before, .slick-track:after { display: table; content: ''; }

.slick-track:after { clear: both; }

.slick-loading .slick-track { visibility: hidden; }

.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }

[dir='rtl'] .slick-slide { float: right; }

.slick-slide img { display: block; }

.slick-slide.slick-loading img { display: none; }

.slick-slide.dragging img { pointer-events: none; }

.slick-initialized .slick-slide { display: block; }

.slick-loading .slick-slide { visibility: hidden; }

.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

.slick-arrow.slick-hidden { display: none; }

/* ### parts.scss ### */

/*# sourceMappingURL=echoesCard.css.map */