@import "https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700&display=swap";:root{--primary-color:#c47135;--accent-color:#ff7d4d;--text-light:#f7f9f9;--text-dark:#000;--background-overlay:#000c}@font-face{font-family:IBMPlexSansKR-Regular;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-07@1.0/IBMPlexSansKR-Regular.woff)format("woff");font-weight:400;font-style:normal}@font-face{font-family:IBMPlexSansKR-SemiBold;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-07@1.0/IBMPlexSansKR-SemiBold.woff)format("woff");font-weight:400;font-style:normal}@font-face{font-family:IBMPlexSansKR-Bold;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-07@1.0/IBMPlexSansKR-Bold.woff)format("woff");font-weight:400;font-style:normal}@font-face{font-family:ROKABold;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2104@1.1/ROKABold.woff)format("woff");font-weight:400;font-style:normal}@font-face{font-family:ROKAMedium;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2104@1.1/ROKAMedium.woff)format("woff");font-weight:400;font-style:normal}@font-face{font-family:NanumBarunGothic;font-style:normal;font-weight:400;src:url(//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.eot);src:url(//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.eot?#iefix)format("embedded-opentype"),url(//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.woff)format("woff"),url(//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.ttf)format("truetype")}@font-face{font-family:NanumBarunGothic;font-style:normal;font-weight:700;src:url(//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.eot);src:url(//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.eot?#iefix)format("embedded-opentype"),url(//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.woff)format("woff"),url(//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.ttf)format("truetype")}@font-face{font-family:NanumBarunGothic;font-style:normal;font-weight:300;src:url(//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.eot);src:url(//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.eot?#iefix)format("embedded-opentype"),url(//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.woff)format("woff"),url(//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.ttf)format("truetype")}*{box-sizing:border-box;margin:0;padding:0}body{background:url(/static/mbti/images/ring.png) 50%/cover no-repeat fixed;width:100%;height:100%;font-family:Noto Sans KR,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.5}button{cursor:pointer;background:0 0;border:none;font-family:inherit}a{color:inherit;text-decoration:none}ul,ol{list-style:none}li{padding-bottom:15px;list-style-type:none}i{padding:5px}img{max-width:100%;height:auto}input,textarea,select{font-family:inherit;font-size:inherit;line-height:inherit}.noselect{-webkit-user-select:none;user-select:none}.adsense-box{width:200px;height:200px}.container{text-align:center;flex-direction:column;justify-content:space-around;align-items:center;width:100%;height:100%;display:flex;position:relative;padding:0!important}.wrapper{text-align:center;width:100%;padding:20px 0}.wrapper-top{text-align:center;width:100%;padding:40px 0 10px}.wrapper-explaination{text-align:center;width:100%;padding:20px 0}.wrapper-loading{text-align:center;width:100%;height:100%;padding:20px 0}.partner-wrapper{justify-content:space-evenly;display:flex}.wrapper-question{text-align:center;flex-direction:column;justify-content:space-between;width:100%;height:calc(100vh - 200px);padding:20px 0 0;display:flex}.layout-container{flex-direction:column;width:100vw;height:100vh;display:flex}.layout-main{flex:1;align-items:center;width:100%;max-width:475px;margin:0 auto;padding:20px 20px 0;display:flex}.layout-footer{text-align:center;color:#666;padding:20px;font-size:14px}.footer{text-align:center;width:100%;padding:15px 0;position:absolute;bottom:0}.footer-result{text-align:center;width:100%;padding:15px 0;position:relative;bottom:0}.footer__text{color:#373737;display:block}.fade-in--quick{animation:.5s fadein}.fade-in{animation:1s fadein}@keyframes fadein{0%{opacity:0}to{opacity:1}}@media (hover:none) and (pointer:coarse){.btn-fade:active{background:#ff7d4d;transition:all .2s ease-in}}@media (hover:hover) and (pointer:fine){.btn-fade:hover{background:#ff7d4d;transition:all .3s ease-in}}.start-btn{color:#fff;cursor:pointer;text-transform:uppercase;background-color:#c47135;border:none;outline:none;width:230px;margin:15px 40px;padding:12px 40px 10px;font-family:IBMPlexSansKR-Bold;font-size:28px;font-weight:700;line-height:1.5em;display:inline-block;position:relative}.start-btn:before,.start-btn:after{content:"";border:0 solid #0000;width:24px;height:24px;transition:all .25s;position:absolute}.start-btn:before{border-color:#c47135;border-top-width:2px;border-right-width:2px;top:-5px;right:-5px}.start-btn:after{border-color:#c47135;border-bottom-width:2px;border-left-width:2px;bottom:-5px;left:-5px}.start-btn:hover,start-btn.hover{background-color:#c47135}.start-btn:hover:before,start-btn.hover:before,.start-btn:hover:after,.start-btn.hover:after{width:100%;height:100%}.question-btns{margin-top:40px}.question-btns button{color:#f7f9f9;border:2px solid #ff8c00;border-radius:15px;outline:none;width:100%;margin-bottom:15px;padding:35px 20px;font-size:18px;font-family:NanumBarunGothic!important}.retest-btn{background:#fff;border:2px solid gray;border-radius:15px;outline:none;width:80%;height:60px;margin:20px 0;font-family:ROKAMedium;font-size:24px;font-weight:700}.btn-fade{background:#000c}.btn-overlay{background:#7ba428;position:relative;overflow:hidden}.btn-overlay:after{content:"";background:#9acd32;width:115%;height:200px;transition:all .2s ease-in-out;position:absolute;left:-5%;transform:translateY(-45%)skew(25deg)scale(0)}.btn-overlay:hover:after{transform:translateY(-45%)skew(25deg)scale(1)}.btn-overlay span{z-index:1;position:relative}.btn-collection{padding:10px}.folder-button{margin-left:auto;margin-right:auto;font-size:16px;font-weight:700;display:block}.folder{margin-top:10px}.folder-content{display:none}.folder-content ul{margin-top:10px}.folder-footer{margin-top:10px;display:none}.folder-button-down{margin-left:auto;margin-right:auto;font-size:16px;font-weight:700;display:block}.start-img{width:120%;max-width:250px;margin:0}.start-title-wrapper{margin:30px 0}.start-title{letter-spacing:-2px;color:#f7f9f9;font-family:ROKAMedium;font-size:42px;line-height:45px;display:inline-block}.start-title.line-break{display:block}.start-title-bold{letter-spacing:-5px;color:#fff;margin:-10px 6px;font-family:ROKABold;font-size:72px;display:inline-block}.question-title{color:#f7f9f9;margin-top:70px;padding:20px;font-size:28px;font-weight:700;line-height:40px;font-family:NanumBarunGothic!important}.result-title{color:#f5f5f5;text-align:center;margin:0;font-family:ROKABold;font-size:68px;display:block}.result-sub-title{color:#f5f5f5;text-align:center;margin:5px 0 0;font-family:ROKABold;font-size:32px;display:block}.result-title-black{color:#000;text-align:center;margin:5px 0 30px;font-family:ROKABold;font-size:38px;line-height:1.1;display:block}.result-img{-o-object-fit:cover;object-fit:cover;width:300px;height:300px;margin:10px 0}.result-partner-img{-o-object-fit:cover;object-fit:cover;width:150px;height:150px;margin:-10px 5px 10px}.result-subtitle{text-align:center;color:#f7f9f9;background:#880701e6;border-radius:0;margin:0 10px 20px;padding:10px 0;font-family:ROKAMedium;font-size:22px;line-height:1.5;display:block}.result-quote{padding:0 30px}.result-share-text{text-align:center;color:#fff;margin:10px 0;font-family:ROKABold;font-size:28px}.result-text{text-align:center;color:#fff;text-shadow:-.5px .5px #000,.5px .5px #000,.5px -.5px #000,-.5px -.5px #000;margin:10px;font-size:16px;font-family:NanumBarunGothic!important}.result-text-white{text-align:center;color:#fff;margin:0 0 -10px;font-size:16px;font-family:NanumBarunGothic!important}.result-text-left{text-align:left;color:#000;margin:10px;font-size:16px;font-family:NanumBarunGothic!important}.result-text-black-best{text-align:center;color:#fff;background:#006809;border-radius:.27em;margin:10px 0;padding:5px;font-size:24px;font-weight:700;font-family:IBMPlexSansKR-SemiBol!important}.result-text-black-worst{text-align:center;color:#fff;background:#9b0000;border-radius:.27em;margin:10px 0;padding:5px;font-size:24px;font-weight:700;font-family:IBMPlexSansKR-SemiBol!important}.result-rank{color:#f7f9f9;background:#d46600cc;border-radius:.27em;margin:5px 10px 10px;padding:10px;font-family:ROKAMedium;font-size:22px;line-height:30px}.result-rank-ment{display:inline!important}.result-explanation{color:#000;background:#ffffffd9;border-radius:.27em;margin:20px 10px 10px;padding:15px;font-family:ROKAMedium;font-size:16px;line-height:1.3}.best-partner,.worst-partner,.best-partner *,.worst-partner *{text-decoration:none!important}.result-char-wrapper{cursor:pointer;background:#ffffffcb;border-radius:.5em;padding:5px;transition:transform .3s cubic-bezier(.4,0,.2,1),box-shadow .3s cubic-bezier(.4,0,.2,1),background .3s cubic-bezier(.4,0,.2,1)}.best-partner:hover .result-char-wrapper,.worst-partner:hover .result-char-wrapper{background:#fffffff2;transform:translateY(-8px)scale(1.02);box-shadow:0 20px 40px #0000004d}.best-partner:active .result-char-wrapper,.worst-partner:active .result-char-wrapper{transform:translateY(-4px)scale(1.01);box-shadow:0 10px 20px #00000040}.icon-quote{justify-content:space-between;margin:0 5px -30px;display:flex;font-size:18px!important}.wrapper-progress{text-align:center;width:100%;margin:0 auto;position:absolute;top:20px;left:0;right:0}.progress-page-num{color:#fff;text-align:center;padding-bottom:7px}::-webkit-scrollbar{display:none}.percentage{color:#f4c91b;font-size:28px}.loading-title{color:#f7f9f9;margin-top:20px;padding:20px;font-size:28px;font-weight:700;line-height:40px}.eye{background-color:#f0dcdc;border-radius:0 0 20px 20px;width:20px;height:8px;position:relative;top:40px;left:10px;box-shadow:40px 0 #f0dcdc}.loading-head{background-color:#111;border-radius:50px;width:80px;height:80px;margin:-250px auto;animation:1.5s infinite alternate headAnim;position:relative;box-shadow:inset -4px 2px #f0dcdc}.loading-body{background-color:#111;border-radius:50px/25px;width:140px;height:120px;margin:90px auto;animation:1.5s infinite alternate bodyAnim;position:relative;box-shadow:inset -5px 2px #f0dcdc}.circ{z-index:-1;border-radius:0 0 50px 50px;width:180px;height:180px;margin:60px auto;position:relative;top:20%;left:0%;overflow:hidden}.loading-hands{z-index:1;background-color:#111;border-radius:20px;width:120px;height:120px;margin-top:140px;animation:1.5s infinite alternate bodyAnim;position:absolute;top:75%;left:16%;box-shadow:-1px -4px #f0dcdc}@keyframes headAnim{0%{top:0}50%{top:10px}to{top:0}}@keyframes bodyAnim{0%{top:-5px}50%{top:10px}to{top:-5px}}button:focus-visible,a:focus-visible{outline:2px solid var(--accent-color);outline-offset:2px}