*{margin:0; padding:0; box-sizing: border-box; -webkit-tap-highlight-color: transparent;}
html, body{font-family: 'SUIT', 'pretendard', sans-serif; font-size: 16px; font-weight: normal;}
button, input, textarea, select, option, optgroup {font-family: inherit;}
body.on{overflow: hidden;}
button{border: 0;}
li{list-style: none;}
a{text-decoration: none;}

br.mo{display: none;}
.tit_wrap{padding-top: 6rem;}
.tit{text-align: center; margin-bottom: 4.5rem;}
.tit h2{font-size: 2.5rem; color:#000000; margin: 2.1875rem 0 1.25rem; line-height: 1.3; font-weight: 800;}
.tit h2 strong{color:#6647BE; font-weight: 800;}
.tit p{font-size: 1.125rem; color:#595959; letter-spacing: 0; line-height: 1.5;}
.tit p strong{font-weight: 700; color:#000000; font-size: 1.15rem;}
.tit .logo{width:4rem; height: 4.25rem;}
.app_tit p::before{content: "QR코드를 찍어 앱을 다운로드하세요"; display: block; font-size: 1.125rem; letter-spacing: 0; line-height: 1.5; word-break: keep-all; white-space: pre-line;}

.orai_app{background: url(../images/orai/app_bg.jpg) center / cover no-repeat; }
.orai_app .app_tit h2{font-size: 2.375rem; color:#ffffff; font-weight: 800;}
.orai_app .app_tit p{font-size: 1.125rem; color:#ffffff; margin-top: .5rem;}
.orai_app .app_cont{display: flex; flex-direction: column; align-items: center; justify-content: center; gap:3rem; height: 34.375rem;}
.orai_app .app_cont .app_tit{text-align: center;}
.orai_app .app_cont .appimg1{display: flex; gap:1.875rem;}
.orai_app .app_cont .appimg1 > div{background-color:#ffffff; border-radius:1.25rem; padding:1.25rem 1.5rem;}
.orai_app .app_cont .appimg1 > div p{font-size: 1rem; text-align: center; color:#000000; font-weight: 700;}
.orai_app .app_cont .appimg1 img{width:10.625rem;}
.orai_app .app_cont .appimg2{display: none; width: 75%; max-width: 25rem; flex-direction: column; gap:1rem;}
.orai_app .app_cont .appimg2 > div{position: relative; display: flex; align-items: center; justify-content: center; background-color:#ffffff; border-radius: 100px; height:5.3125rem; cursor: pointer;}
.orai_app .app_cont .appimg2 > div img{position: absolute; top:50%; left:10%; transform: translateY(-50%);}
.orai_app .app_cont .appimg2 > div p{font-size: 1.5rem; color:#303030; font-weight: 800; letter-spacing: -.01rem; padding-left: .5rem;}

.popup{display: none; position: fixed; top:0; left:0; width:100%; height:100%; z-index: 1000; background: rgba(0, 0, 0, 0.5);}
.popup-wrap {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%; max-width: 40rem;
     background: #fff; border-radius: 15px; overflow: hidden; z-index: 1;}
.popup-cont{overflow-y: auto; padding: 1.5rem 1.875rem 1.5rem; max-height:70vh; font-family: 'pretendard';}
.popup-cont h2{font-size: 1.2rem; font-weight: 700; margin-bottom: 2rem;}
.popup-cont h3{font-size: 1rem; font-weight: 600; color:#000000; margin-bottom: .5rem;}
.popup-cont p{font-size: .9rem; line-height: 1.3; color:#3d3d3d; font-weight: 300;}
.popup-cont strong{color:#6647BE; font-weight: 500;}
.popup-cont ul, .popup-cont ol{font-size: .9rem; font-size: .9rem; line-height: 1.3; color:#3d3d3d; font-weight: 300;}
.popup-cont .policy-meta{font-size: .8rem; font-weight: 300; color:#999999; margin-top: 2rem;}

.popup-cont::-webkit-scrollbar {width: 4px;}
.popup-cont::-webkit-scrollbar-track {background: #e9e7ec;}
.popup-cont::-webkit-scrollbar-thumb {background: #6647BE; border-radius: 5px;}
.popup-close{position: absolute; top:1rem; right:1.5rem; width:2.5rem; height:2.5rem; z-index: 1; cursor: pointer; background-color: #ffffffe3; border-radius: 100%;}
.popup-close span{position: absolute; left:15%; top:45%; background:#000000; width:75%; height:2px; border-radius: 50px; background-color:#000000; transform: rotate(45deg);}
.popup-close span:last-of-type{transform: rotate(-45deg);}


footer{padding:4.5rem 0; background: #ffffff; text-align: center; font-size: 1rem;}
footer .info{display: flex; flex-direction: column; justify-content: center; gap: .3rem; color: #4E4E4E;}
footer .info > div{display: flex; justify-content: center; align-items: center; line-height: 1.3;}
footer .info b{font-weight: 800; margin-right: .2rem; color:#222222;}
footer .line{width:1px; height:.9rem; background-color: #c0c0c0; margin:0 .5rem;}
footer .agree1{display: flex; justify-content: center; align-items: center; margin-bottom: 1rem; color: #818181;}
footer .agree1 > div{cursor: pointer;}
footer .copy{color:#A8A8A8; margin-top: 1rem;}

@media (max-width: 900px) {
    html{font-size: 13px;}
    .orai_app .app_cont {flex-direction: column; gap: 2.5rem;}
    .orai_app .app_cont .appimg1{display: none;}
    .orai_app .app_cont .appimg2{display: flex;}
    .app_tit p::before {content: "아래 버튼을 눌러 앱을 다운로드하세요";}
}


@media (max-height: 1000px) {
    html{font-size: 13px;}
    .tit{margin-bottom: 3rem;}
    .tit_wrap{padding-top: 4rem;}
    .orai_app .app_cont{gap: 2.5rem; height: 32rem;}
    footer{padding:3.5rem 0;}
}


@media (max-width: 600px) {
    html{font-size: 12px;}
    br.mo{display: block;}
    .tit h2{font-size: 2.2rem; line-height: 1.2;}
    .orai_app .app_tit h2{font-size: 2rem;}
}
/*
@media (max-height: 950px) {
    .tit{margin-bottom: 2rem;}
    .tit_wrap{padding-top: 4rem;}
    .tit h2{font-size: 2.2rem; margin: 1.5rem 0 1rem;}
    .tit p, .app_tit p::before{font-size: 1rem;}
    .orai_app .app_tit h2{font-size: 1.8rem;}
    .orai_app .app_tit p{margin-top: .2rem;}
    .tit .logo{width:3.5625rem; height: 3.75rem;}
    .orai_app .app_cont{gap: 1.8rem; height: 26.5rem;}
    .orai_app .app_cont .appimg1 > div{padding: 1rem 1.2rem;}
    footer{padding:2rem 0;}
    footer .agree1{margin-bottom: .8rem;}
    footer .copy{margin-top: .8rem;}

}
*/