@font-face {
    font-family:fontR;
    src:url('inc/LG_Smart_UI-Regular.woff')
}
* {
    box-sizing: border-box;
    overflow: unset;
}
html, body {
    width:100%; height:100%;
    overflow-y:scroll;
}
body {
    position:relative;
    margin:0; padding:0; border:0;
    overflow:hidden;
    font-family:fontR, sans-serif;
    -webkit-user-select:none;
    -webkit-text-size-adjust:none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.context_tiptalk {
    display: none;
    width: 100%;
    height: 100%;
}

.bottom_info {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    margin-top: 50px;
}
.app_name {
    color: #000;
    font-weight: bold;
    font-size: 19px;
    margin-bottom: 30px;
}
.app_description {
    color: #555555;
    font-size: 16px;
    margin-bottom: 17px;
    text-align: center;
}
.spliter_line {
    width: 100%;
    height: 3px;
    background: linear-gradient(to bottom, rgb(255, 82, 157) -60%, rgb(254, 122, 114) 100%);
}
#appleicon {
    width: 50%;
    object-fit: contain;
    padding: 5%;
}
#appleicon.solo {
    width: 100%;
    padding: 0;
}
#googleicon {
    width: 50%;
    object-fit: contain;
}

.context_scroll_box {
    position:absolute;
    left:0;
    width:100%;
    overflow-x:hidden;
    overflow-y:scroll;
    -webkit-overflow-scrolling:touch;
    -ms-overflow-style: none;
}
.context_scroll_box::-webkit-scrollbar {
    display: none;
}
.context_scroll_box .context {
    position: relative;
    width: 100%;
    height: 100%;
}

@keyframes zoom {
    0% {transform: translateX(-50%) scale(0); opacity: 0;}
    100% {transform: translateX(-50%) scale(1); opacity: 1;}
}
@keyframes zoom1 {
    0% {transform: translate(-50%, -50%) scale(0); opacity: 0;}
    70% {transform: translate(-50%, -50%) scale(1); opacity: 1;}
    100% {transform: translate(-50%, -50%) scale(.6); opacity: .8;}
}
@keyframes zoom2 {
    0% {transform: translate(-50%, -50%) scale(0); opacity: 0;}
    100% {transform: translate(-50%, -50%) scale(1); opacity: 1;}
}
@keyframes show {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
@keyframes rotate {
    0% {transform: translate(-50%, -50%) rotate(0)}
    100% {transform: translate(-50%, -50%) rotate(365deg)}
}
@keyframes guide {
    0%, 60% {opacity: 1;}
    90% {opacity: 0;}
    100% {opacity: 0; display: none; z-index: 0;}
}

.loading_survey {
    display: none;
    position: relative;
    left:25vw;
    width: 50vw;
    height: 50vw;
    margin: 10vw 10vw;
    background: rgb(255, 255, 255);
    border-radius: 50%;
    border: none;
    animation: zoom .7s forwards;
    animation-delay: .5s;
    opacity: 0;
    outline: none;
}
.loading_survey:before,
.loading_survey:after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
}
.loading_survey:before {
    background: #FFF9F6;
    width: 100%; height: 100%;
    opacity: 0;
    animation: .7s ease 4.1s 1 normal forwards running zoom1;
}
.loading_survey:after {
    width: 16%; height: 16%;
    opacity: 1;
    animation: rotate .7s;
    animation-delay: 4.1s;
    background: url('img/check_icon.svg') no-repeat;
    background-size: contain;
}
.loading_survey div {
    display: inline-block;
    border-radius: 50px;
    color: rgb(255, 255, 255);
    font-size: .5em;
    line-height: 9vw;
    text-align: center;	
    position: absolute;
    width: 9vw;	
    height: 9vw;
    left: 50%;
    top: 50%;
    margin: -4.5vw;
}
.loading_survey div, 
.loading_survey div span {
    opacity: 0;
    animation: show .3s;
    animation-fill-mode: forwards;
}
.loading_survey div:nth-child(1) {
    background: #FCD25C;
    transform: rotate(270deg) translate(25vw) rotate(-270deg);
}
.loading_survey div:nth-child(2) {
    background: #F8BD01;
    transform: rotate(292.5deg) translate(25vw) rotate(-292.5deg);
}
.loading_survey div:nth-child(3) {
    background: #F18964;
    transform: rotate(315deg) translate(25vw) rotate(-315deg);
}
.loading_survey div:nth-child(4) {
    background: #F69993;
    transform: rotate(337.5deg) translate(25vw) rotate(-337.5deg);
}
.loading_survey div:nth-child(5) {
    background: #EE9BB7;
    transform: translate(25vw);
}
.loading_survey div:nth-child(6) {
    background: #D1E4AA;
    transform: rotate(22.5deg) translate(25vw) rotate(-22.5deg);
}
.loading_survey div:nth-child(7) {
    background: #78C49D;
    transform: rotate(45deg) translate(25vw) rotate(-45deg);
}
.loading_survey div:nth-child(8) {
    background: #A7CE5A;
    transform: rotate(67.5deg) translate(25vw) rotate(-67.5deg);
}
.loading_survey div:nth-child(9) {
    background: #89CECB;
    transform: rotate(90deg) translate(25vw) rotate(-90deg);
}
.loading_survey div:nth-child(10) {
    background: #96B6E0;
    transform: rotate(112.5deg) translate(25vw) rotate(-112.5deg);
}
.loading_survey div:nth-child(11) {
    background: #42A8D9;
    transform: rotate(135deg) translate(25vw) rotate(-135deg);
}
.loading_survey div:nth-child(12) {
    background: #B1B5DB;
    transform: rotate(157.5deg) translate(25vw) rotate(-157.5deg);
}
.loading_survey div:nth-child(13) {
    background: #7C86C1;
    transform: translate(-25vw);
}
.loading_survey div:nth-child(14) {
    background: #E85881;
    transform: rotate(202.5deg) translate(25vw) rotate(-200.5deg);
}
.loading_survey div:nth-child(15) {
    background: #EC7102;
    transform: rotate(225deg) translate(25vw) rotate(-225deg);
}
.loading_survey div:nth-child(16) {
    background: #F9BD01;
    transform: rotate(247.5deg) translate(25vw) rotate(-247.5deg);
}

.loading_survey div:nth-child(1),
.loading_survey div:nth-child(1) span,
.loading_survey div:nth-child(9),
.loading_survey div:nth-child(9) span {
    animation-delay: 2s;
}
.loading_survey div:nth-child(2),
.loading_survey div:nth-child(2) span,
.loading_survey div:nth-child(10),
.loading_survey div:nth-child(10) span {
    animation-delay: 2.2s;
}
.loading_survey div:nth-child(3),
.loading_survey div:nth-child(3) span,
.loading_survey div:nth-child(11),
.loading_survey div:nth-child(11) span {
    animation-delay: 2.4s;
}
.loading_survey div:nth-child(4),
.loading_survey div:nth-child(4) span,
.loading_survey div:nth-child(12),
.loading_survey div:nth-child(12) span {
    animation-delay: 2.6s;
}
.loading_survey div:nth-child(5),
.loading_survey div:nth-child(5) span,
.loading_survey div:nth-child(13),
.loading_survey div:nth-child(13) span {
    animation-delay: 2.8s;
} 
.loading_survey div:nth-child(6),
.loading_survey div:nth-child(6) span,
.loading_survey div:nth-child(14),
.loading_survey div:nth-child(14) span {
    animation-delay: 3s;
} 
.loading_survey div:nth-child(7),
.loading_survey div:nth-child(7) span,
.loading_survey div:nth-child(15),
.loading_survey div:nth-child(15) span {
    animation-delay: 3.2s;
} 
.loading_survey div:nth-child(8),
.loading_survey div:nth-child(8) span,
.loading_survey div:nth-child(16),
.loading_survey div:nth-child(16) span {
    animation-delay: 3.4s;
}