@-webkit-keyframes pageOpen {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes pageOpen {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@-webkit-keyframes fadeout {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@keyframes fadeout {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@-webkit-keyframes fadein {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes fadein {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
/*------------------------------------*\
    Imports
\*------------------------------------*/
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

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

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

input,
input:active,
input:focus {
  text-decoration: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: 0; }

img {
  vertical-align: bottom;
  display: block; }

*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box; }

.jp {
  display: none; }

/*------------------------------------*\
    CSS
\*------------------------------------*/
html {
  font-size: 62.5%; }

::selection {
  background: #000000;
  /* Safari */
  color: #fff; }

::-moz-selection {
  background: #000000;
  /* Safari */
  color: #fff; }

/*------------------------------------*\
    Style
\*------------------------------------*/
a {
  text-decoration: none;
  color: #ffffff; }
  a:hover {
    text-decoration: underline; }
  a img {
    outline: none; }

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  background-color: #cac7c8;
  color: #ffffff;
  height: 100%;
  line-height: 28px;
  font-size: 1.3rem;
  font-family: "U8 Light";
  font-weight: normal;
  font-kerning: inherit;
  font-style: normal;
  letter-spacing: 0.2em; }

#bg-overlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 20;
  background: #000000;
  opacity: 0.25;
  overflow: hidden;
  width: 100%;
  height: 100%; }

#wrapper {
  opacity: 0;
  -webkit-animation: pageOpen 1.8s ease 1.8s 1 forwards;
  animation: pageOpen 1.8s ease 1.8s 1 forwards;
  position: absolute;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 30;
  padding: 49px 24px 0px 49px;
  overflow: hidden; }

h1 {
  text-indent: 100%;
  width: 344px;
  height: 40px;
  margin-bottom: 26px;
  background-image: url("../img/png/d-h1.png");
  background-image: -webkit-image-set(url("../img/png/d-h1.png") 1x, url("../img/png/d-h1x2.png") 2x);
  background-repeat: no-repeat;
  overflow: hidden;
  white-space: nowrap; }

.text-first {
  text-indent: 100%;
  width: 344px;
  height: 227px;
  margin-bottom: 0px;
  background-image: url("../img/png/d-p1.png");
  background-image: -webkit-image-set(url("../img/png/d-p1.png") 1x, url("../img/png/d-p1x2.png") 2x);
  background-repeat: no-repeat;
  overflow: hidden;
  white-space: nowrap; }

.a-mail a {
  display: block;
  width: 204px;
  height: 26px;
  margin-bottom: 35px;
  cursor: pointer;
  position: relative;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap; }
  .a-mail a .normal {
    position: absolute;
    display: block;
    width: 204px;
    height: 26px;
    background-image: url("../img/png/a-mail.png");
    background-image: -webkit-image-set(url("../img/png/a-mail.png") 1x, url("../img/png/a-mailx2.png") 2x);
    background-repeat: no-repeat;
    -webkit-animation: fadein 0.1s ease 0s 1 forwards;
    animation: fadein 0.1s ease 0s 1 forwards; }
  .a-mail a .hover {
    position: absolute;
    display: block;
    width: 204px;
    height: 26px;
    background-image: url("../img/png/a-mail.png");
    background-image: -webkit-image-set(url("../img/png/a-mail.png") 1x, url("../img/png/a-mailx2.png") 2x);
    background-repeat: no-repeat;
    background-position-y: -100px;
    -webkit-animation: fadeout 0.45s ease 0s 1 forwards;
    animation: fadeout 0.45s ease 0s 1 forwards; }
  .a-mail a:hover .normal {
    -webkit-animation: fadeout 0.45s ease 0s 1 forwards;
    animation: fadeout 0.45s ease 0s 1 forwards; }
  .a-mail a:hover .hover {
    -webkit-animation: fadein 0.1s ease 0s 1 forwards;
    animation: fadein 0.1s ease 0s 1 forwards; }

.text-follow {
  text-indent: 100%;
  width: 344px;
  height: 26px;
  margin-bottom: 2px;
  background-image: url("../img/png/d-p2.png");
  background-image: -webkit-image-set(url("../img/png/d-p2.png") 1x, url("../img/png/d-p2x2.png") 2x);
  background-repeat: no-repeat;
  overflow: hidden;
  white-space: nowrap; }

.a-insta a {
  display: block;
  width: 106px;
  height: 26px;
  margin-bottom: 35px;
  cursor: pointer;
  position: relative;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap; }
  .a-insta a .normal {
    position: absolute;
    display: block;
    width: 106px;
    height: 26px;
    background-image: url("../img/png/a-insta.png");
    background-image: -webkit-image-set(url("../img/png/a-insta.png") 1x, url("../img/png/a-instax2.png") 2x);
    background-repeat: no-repeat;
    -webkit-animation: fadein 0.1s ease 0s 1 forwards;
    animation: fadein 0.1s ease 0s 1 forwards; }
  .a-insta a .hover {
    position: absolute;
    display: block;
    width: 106px;
    height: 26px;
    background-image: url("../img/png/a-insta.png");
    background-image: -webkit-image-set(url("../img/png/a-insta.png") 1x, url("../img/png/a-instax2.png") 2x);
    background-repeat: no-repeat;
    background-position-y: -100px;
    -webkit-animation: fadeout 0.45s ease 0s 1 forwards;
    animation: fadeout 0.45s ease 0s 1 forwards; }
  .a-insta a:hover .normal {
    -webkit-animation: fadeout 0.45s ease 0s 1 forwards;
    animation: fadeout 0.45s ease 0s 1 forwards; }
  .a-insta a:hover .hover {
    -webkit-animation: fadein 0.1s ease 0s 1 forwards;
    animation: fadein 0.1s ease 0s 1 forwards; }

footer {
  text-indent: 100%;
  width: 344px;
  height: 26px;
  background-image: url("../img/png/footer.png");
  background-image: -webkit-image-set(url("../img/png/footer.png") 1x, url("../img/png/footerx2.png") 2x);
  background-repeat: no-repeat;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  bottom: 2px;
  left: 49px; }

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