/* ### mixin.scss ### */
/* echoesLink animation */
@-webkit-keyframes animation { 0% { width: 0; }
  100% { width: 30%; } }
@keyframes animation { 0% { width: 0; }
  100% { width: 30%; } }
@-webkit-keyframes circle { 0%,
  100% { box-shadow: 0em -2.6em 0em 0em #ffffff, 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.5), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7); }
  12.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.7), 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5); }
  25% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.5), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7), 2.5em 0em 0 0em #ffffff, 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
  37.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5), 2.5em 0em 0 0em rgba(255, 255, 255, 0.7), 1.75em 1.75em 0 0em #ffffff, 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
  50% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.5), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.7), 0em 2.5em 0 0em #ffffff, -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
  62.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.5), 0em 2.5em 0 0em rgba(255, 255, 255, 0.7), -1.8em 1.8em 0 0em #ffffff, -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
  75% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.5), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.7), -2.6em 0em 0 0em #ffffff, -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
  87.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5), -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #ffffff; } }
@keyframes circle { 0%,
  100% { box-shadow: 0em -2.6em 0em 0em #ffffff, 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.5), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7); }
  12.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.7), 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5); }
  25% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.5), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7), 2.5em 0em 0 0em #ffffff, 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
  37.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5), 2.5em 0em 0 0em rgba(255, 255, 255, 0.7), 1.75em 1.75em 0 0em #ffffff, 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
  50% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.5), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.7), 0em 2.5em 0 0em #ffffff, -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2), -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
  62.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.5), 0em 2.5em 0 0em rgba(255, 255, 255, 0.7), -1.8em 1.8em 0 0em #ffffff, -2.6em 0em 0 0em rgba(255, 255, 255, 0.2), -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
  75% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.5), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.7), -2.6em 0em 0 0em #ffffff, -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2); }
  87.5% { box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5), -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #ffffff; } }
/* echoesLink */
.echoesLink { font-family: "Hiragino Kaku Gothic ProN", "Helvetica Neue", Arial, "Hiragino Sans", Meiryo, sans-serif; text-align: center; position: fixed; transition: all .3s linear; z-index: 9999999; opacity: 0; visibility: hidden; }
.echoesLink * { margin: 0; padding: 0; font-size: 0; box-sizing: border-box; }
.echoesLink img { max-width: 100%; height: auto; vertical-align: bottom; }
.echoesLink video { width: 100%; }
.echoesLink.active { opacity: 1; visibility: visible; }
.echoesLink.none { display: none; }
.echoesLink.zoomOut { padding: 20px 0; }
.echoesLink.zoomOut .echoesLinkCont { zoom: 60%; max-height: initial; }
.echoesLink.zoomOut .echoesLinkLoadingItem { zoom: 60%; }
.echoesLink.zoomOut .echoesLinkLoadingTxt { zoom: 60%; }
.echoesLink.zoomOut .echoesLinkLoadingNote { zoom: 60%; }
.echoesLinkCont { opacity: 0; visibility: hidden; width: calc(680 / 750 * 100vw); position: fixed; top: 50%; left: 50%; z-index: 10000000; transform: translate(-50%, -50%); transition: all .3s .5s ease; }
.echoesLinkCont.active { opacity: 1; visibility: visible; }
.echoesLinkLoading { opacity: 0; visibility: hidden; width: calc(670 / 750 * 100vw); position: fixed; top: 50%; left: 50%; z-index: 10000000; transform: translate(-50%, -50%); transition: all .3s ease; }
.echoesLinkLoadingItem { margin: calc(200 / 750 * 100vw) auto; font-size: calc(50 / 750 * 100vw); width: 1em; height: 1em; border-radius: 50%; position: relative; text-indent: -9999em; -webkit-animation: circle 1.3s infinite ease; animation: circle 1.3s infinite ease; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); }
.echoesLinkLoadingText { margin-bottom: calc(65 / 750 * 100vw); font-size: calc(40 / 750 * 100vw); font-weight: 600; color: #fff; line-height: 1; display: inline-block; white-space: nowrap; }
.echoesLinkLoadingText 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(10 / 750 * 100vw) 100%; background-image: -webkit-linear-gradient(left, #fff, #fff calc(5 / 750 * 100vw), transparent calc(5 / 750 * 100vw)); background-image: linear-gradient(to right, #fff, #fff calc(5 / 750 * 100vw), transparent calc(5 / 750 * 100vw)); -webkit-animation: animation 1.3s linear infinite; animation: animation 1.3s linear infinite; }
.echoesLinkLoadingVideoNote { margin-top: calc(50 / 750 * 100vw); font-size: calc(32 / 750 * 100vw); color: #fff; line-height: 1; text-align: center; letter-spacing: .05em; }
.echoesLinkLoading.active { opacity: 1; visibility: visible; }
.echoesLinkProgressBar { margin-top: calc(20 / 750 * 100vw); width: 100%; height: calc(5 / 750 * 100vw); border-radius: calc(20 / 750 * 100vw); border: none; background-color: rgba(96, 100, 103, 0.5); -webkit-appearance: none; }
.echoesLinkProgressBar::-webkit-progress-bar { background-color: rgba(96, 100, 103, 0.5); }
.echoesLinkProgressBar::-webkit-progress-value { background-color: #fff; }
.echoesLinkBanner { margin: calc(20 / 750 * 100vw) 0 calc(40 / 750 * 100vw); }
.echoesLinkApp { margin: calc(40 / 750 * 100vw) 0; }
.echoesLinkAppBox { display: flex; justify-content: center; }
.echoesLinkAppTitle { margin-bottom: calc(30 / 750 * 100vw); font-size: calc(38 / 750 * 100vw); font-weight: 600; color: #fff; line-height: 1; letter-spacing: .05em; text-align: center; }
.echoesLinkAppImage:not(:last-of-type) { margin-right: calc(20 / 750 * 100vw); }
.echoesLinkWin, .echoesLinkLose { margin-bottom: calc(50 / 750 * 100vw); }
.echoesLinkOverlay { opacity: 1; visibility: visible; background: rgba(0, 0, 0, 0.8); position: fixed; top: 0; right: 0; left: 0; bottom: 0; z-index: 9999999; }
.echoesLinkClose { padding: calc(30 / 750 * 100vw) calc(70 / 750 * 100vw); font-size: calc(36 / 750 * 100vw); font-weight: 600; color: #737373; line-height: 1; display: inline-block; border-radius: calc(48 / 750 * 100vw); background-color: #fff; cursor: pointer; }

@media screen and (max-width: 599px) { .echoesLinkCont.small { width: calc(600 / 750 * 100vw); } }
@media screen and (min-width: 600px) and (max-width: 1024px) { .echoesLink.horizontal .echoesLink .echoesLinkCont { zoom: 60%; max-height: initial; }
  .echoesLink.horizontal .echoesLink .echoesLinkLoadingItem { zoom: 60%; }
  .echoesLink.horizontal .echoesLink .echoesLinkLoadingTxt { zoom: 60%; }
  .echoesLink.horizontal .echoesLink .echoesLinkLoadingNote { zoom: 60%; }
  .echoesLinkCont { width: calc(500 / 750 * 100vw); }
  .echoesLinkLoading { width: calc(500 / 750 * 100vw); }
  .echoesLinkLoadingItem { margin: calc(140 / 750 * 100vw) auto; font-size: calc(45 / 750 * 100vw); }
  .echoesLinkLoadingText { margin-top: calc(40 / 750 * 100vw); margin-bottom: calc(100 / 750 * 100vw); font-size: calc(36 / 750 * 100vw); }
  .echoesLinkLoadingText span { margin-left: calc(2 / 750 * 100vw); width: calc(20 / 750 * 100vw); height: calc(4 / 750 * 100vw); background-size: calc(10 / 750 * 100vw) 100%; background-image: -webkit-linear-gradient(left, #fff, #fff calc(5 / 750 * 100vw), transparent calc(5 / 750 * 100vw)); background-image: linear-gradient(to right, #fff, #fff calc(5 / 750 * 100vw), transparent calc(5 / 750 * 100vw)); }
  .echoesLinkLoadingVideoNote { margin-top: calc(30 / 750 * 100vw); font-size: calc(24 / 750 * 100vw); }
  .echoesLinkLoading.active { display: block; }
  .echoesLinkProgressBar { margin-top: calc(16 / 750 * 100vw); height: calc(4 / 750 * 100vw); }
  .echoesLinkClose { padding: calc(20 / 750 * 100vw) calc(50 / 750 * 100vw); font-size: calc(28 / 750 * 100vw); } }
@media screen and (min-width: 1025px) { .echoesLinkCont { width: 510px; }
  .echoesLinkLoading { width: 750px; }
  .echoesLinkLoadingItem { margin: 90px auto; font-size: 30px; }
  .echoesLinkLoadingText { margin-top: 20px; margin-bottom: 50px; font-size: 32px; }
  .echoesLinkLoadingText span { margin-left: 5px; width: 20px; height: 4px; background-size: 10px 100%; background-image: -webkit-linear-gradient(left, #fff, #fff 5px, transparent 5px); background-image: linear-gradient(to right, #fff, #fff 5px, transparent 5px); }
  .echoesLinkLoadingVideoNote { margin-top: 25px; font-size: 16px; }
  .echoesLinkLoading.active { display: block; }
  .echoesLinkProgressBar { margin-top: 10px; height: 4px; }
  .echoesLinkBanner { margin: 20px 0 30px; }
  .echoesLinkApp { margin: 30px 0; }
  .echoesLinkAppTitle { margin-bottom: 20px; font-size: 24px; }
  .echoesLinkAppImage:not(:last-of-type) { margin-right: 20px; }
  .echoesLinkAppImage a { display: inline-block; }
  .echoesLinkWin, .echoesLinkLose { margin-bottom: 40px; }
  .echoesLinkClose { padding: 20px 45px; font-size: 24px; border-radius: 48px; } }