@charset "utf-8";
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 700;
  src: url(https://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot);
  src: url(https://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.eot?#iefix) format('embedded-opentype'),
       url(https://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff2) format('woff2'),
       url(https://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.woff) format('woff'),
       url(https://fonts.gstatic.com/ea/nanumgothic/v5/NanumGothic-Bold.ttf) format('truetype');
}
body {
	background-image: url("../img/back.png");
  font-family: "Nanum Gothic";
  text-align: center;
  font-weight: bold;
}
html, body { height:100%; }
body { min-height:100%; }
.container-fluid { height:100%; padding:0; }
.image-container {
    width: 100%;
    max-width: 640px;
    margin: auto;
    background-size:contain;
    background-position:center;
    background-repeat:no-repeat;
}
.row {
    max-width: 640px;
    min-height: 100%;
    margin: auto;
    background-color: #20140f;
}
p.title {
    font-size: 22px;
}
p.content {
    font-size: 15px;
}

.copyright { color:#656565; font-size:11px; margin:1em 0; }

#loading-cover {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.8);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#cc000000',GradientType=0 );
    visibility: hidden;
}

.loading-icon {
    margin: auto;
}

.loading-message {
    margin: auto;
    text-align: center;
    color: #eeeeee;
    font-size: 22px;
}

#loading-noti {
    position:fixed;
    top: 50%;
    left: 50%;
    margin: auto;
    margin-left: -85px;
    margin-top: -16px;
    cursor: none;
}

#loading-noti-inner {
  width:170px;
}

.prevent-select {
    -webkit-user-select: none; /* Chrome/Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+ */
    -o-user-select: none;
    user-select: none;
}


/* for cookie face background */
.face {
    background-image: url('../img/face_sprite.png');
    background-repeat: no-repeat;
    display: block;
}

.face-ch1 {
    width: 60px;
    height: 60px;
    background-position: 0 0;
}

.face-ch10 {
    width: 60px;
    height: 60px;
    background-position: -60px 0;
}

.face-ch11 {
    width: 60px;
    height: 60px;
    background-position: -120px 0;
}

.face-ch12 {
    width: 60px;
    height: 60px;
    background-position: -180px 0;
}

.face-ch13 {
    width: 60px;
    height: 60px;
    background-position: -240px 0;
}

.face-ch14 {
    width: 60px;
    height: 60px;
    background-position: -300px 0;
}

.face-ch15 {
    width: 60px;
    height: 60px;
    background-position: 0 -60px;
}

.face-ch16 {
    width: 60px;
    height: 60px;
    background-position: -60px -60px;
}

.face-ch18 {
    width: 60px;
    height: 60px;
    background-position: -120px -60px;
}

.face-ch19 {
    width: 60px;
    height: 60px;
    background-position: -180px -60px;
}

.face-ch2 {
    width: 60px;
    height: 60px;
    background-position: -240px -60px;
}

.face-ch20 {
    width: 60px;
    height: 60px;
    background-position: -300px -60px;
}

.face-ch21 {
    width: 60px;
    height: 60px;
    background-position: 0 -120px;
}

.face-ch22 {
    width: 60px;
    height: 60px;
    background-position: -60px -120px;
}

.face-ch23 {
    width: 60px;
    height: 60px;
    background-position: -120px -120px;
}

.face-ch24 {
    width: 60px;
    height: 60px;
    background-position: -180px -120px;
}

.face-ch25 {
    width: 60px;
    height: 60px;
    background-position: -240px -120px;
}

.face-ch26 {
    width: 60px;
    height: 60px;
    background-position: -300px -120px;
}

.face-ch27 {
    width: 60px;
    height: 60px;
    background-position: 0 -180px;
}

.face-ch28 {
    width: 60px;
    height: 60px;
    background-position: -60px -180px;
}

.face-ch29 {
    width: 60px;
    height: 60px;
    background-position: -120px -180px;
}

.face-ch3 {
    width: 60px;
    height: 60px;
    background-position: -180px -180px;
}

.face-ch30 {
    width: 60px;
    height: 60px;
    background-position: -240px -180px;
}

.face-ch31 {
    width: 60px;
    height: 60px;
    background-position: -300px -180px;
}

.face-ch32 {
    width: 60px;
    height: 60px;
    background-position: 0 -240px;
}

.face-ch33 {
    width: 60px;
    height: 60px;
    background-position: -60px -240px;
}

.face-ch34 {
    width: 60px;
    height: 60px;
    background-position: -120px -240px;
}

.face-ch35 {
    width: 60px;
    height: 60px;
    background-position: -180px -240px;
}

.face-ch36 {
    width: 60px;
    height: 60px;
    background-position: -240px -240px;
}

.face-ch37 {
    width: 60px;
    height: 60px;
    background-position: -300px -240px;
}

.face-ch38 {
    width: 60px;
    height: 60px;
    background-position: 0 -300px;
}

.face-ch39 {
    width: 60px;
    height: 60px;
    background-position: -60px -300px;
}

.face-ch4 {
    width: 60px;
    height: 60px;
    background-position: -120px -300px;
}

.face-ch40 {
    width: 60px;
    height: 60px;
    background-position: -180px -300px;
}

.face-ch41 {
    width: 60px;
    height: 60px;
    background-position: -240px -300px;
}

.face-ch42 {
    width: 60px;
    height: 60px;
    background-position: -300px -300px;
}

.face-ch43 {
    width: 60px;
    height: 60px;
    background-position: -360px 0;
}

.face-ch44 {
    width: 60px;
    height: 60px;
    background-position: -360px -60px;
}

.face-ch45 {
    width: 60px;
    height: 60px;
    background-position: -360px -120px;
}

.face-ch46 {
    width: 60px;
    height: 60px;
    background-position: -360px -180px;
}

.face-ch47 {
    width: 60px;
    height: 60px;
    background-position: -360px -240px;
}

.face-ch48 {
    width: 60px;
    height: 60px;
    background-position: -360px -300px;
}

.face-ch49 {
    width: 60px;
    height: 60px;
    background-position: 0 -360px;
}

.face-ch5 {
    width: 60px;
    height: 60px;
    background-position: -60px -360px;
}

.face-ch6 {
    width: 60px;
    height: 60px;
    background-position: -120px -360px;
}

.face-ch7 {
    width: 60px;
    height: 60px;
    background-position: -180px -360px;
}

.face-ch8 {
    width: 60px;
    height: 60px;
    background-position: -240px -360px;
}

.face-ch9 {
    width: 60px;
    height: 60px;
    background-position: -300px -360px;
}