body {background-color: #f9d77f;}
#wrap {max-width: 1000px;min-height: 100vh;width: 100%;margin: 0 auto;background-color: #fffce0;padding: 2rem 3rem 10rem 3rem;}



/* index */
#wrap.index {padding-top: 30vh;display: flex;justify-content: center;align-items: start;background: url('../img/background.png') no-repeat center / cover;}
.index img {width: 70%;display: block;}



/* home */
#wrap.home {display: flex;justify-content: center;align-items: center;flex-direction: column;padding-left: 0;padding-right: 0;padding-bottom: 0;}
.home a img {width: 100%;}
.home a img.logo {width: 13rem;}
.logo {width: 13rem;margin-bottom: 6rem;}
.home .desc {width: 85%;margin-bottom: 8rem;}
.home .gotest {width:50%;max-width: 500px;margin-bottom: 2rem;}
.home .sharetest {width:50%;max-width: 500px;margin-bottom: 4rem;}
.home .threecat {width: 100%;}



/* gotest */
#wrap.gotest {}
.logo {width: 13rem;margin-bottom: 6rem;margin: 0 auto;display: block;margin-bottom: 7rem;}
.btn_wrap {display: flex;justify-content: space-between;margin-top: 4rem;}
.btn_wrap div {width: 35%;max-width: 500px;background-color: #f9d77f;color: #000;text-align: center;font-weight: 900;padding: 1.3rem 2rem;font-size: 1.6rem;border-radius: 1rem;}
.btn_wrap div.gray {background-color: #e9e9e8;color: #b5afaf;}


/* result 페이지 */
#wrap.result {padding-bottom: 5rem;display: flex;justify-content: space-between;align-items: center;flex-direction: column;}
#wrap.result .logo {margin-bottom: 0;}
.result .point_wrap h2 {
    font-size: 3rem;
    font-weight: 800;
    display: flex;align-items: end;
    margin-bottom: 2rem;
    width: fit-content;

    white-space: nowrap;
}
.result .point_wrap h2 span {
    font-size: inherit;
    font-weight: inherit;
}
.result .point_wrap h2 img {
    width: 50%;
    margin-left: 1rem;

    max-height: 100%;
    max-width: 100%;
}
.result .point_wrap h2 .result_a {color: #e2dcb1;}
.result .point_wrap h2 .result_b {color: #e2c799;}
.result .point_wrap h2 .result_c {color: #c08261;}
.result .point_wrap h2 .result_d {color: #9a3b3b;}
.result .point_wrap h3 {
    font-size: 1.8rem;
    line-height: 1.4;
    color: #000;
    height: 8rem;
}
.result .point_wrap .warn {
    line-height: 1.4;
    font-size: 1.2rem;
    color: #aaa;
}
.result .re {display: flex;justify-content: space-between;}
.result .re a {display: block;}
.result .re .share {width: 45%;max-width: 200px;}
.result .re .other {width: 45%;max-width: 200px;}
.result .re .other img {width: 100%;}


/* check 영역 */
.test {margin-bottom: 10rem;display: flex;flex-direction: column;}
.test h2 {margin-bottom: 2rem;font-size: 2rem;line-height: 1.3;font-weight: 600;text-align: center;}
.radio_wrap {display: flex;justify-content: space-between;}
.radio_wrap li {
    list-style: none;
    text-align: center;
    display: flex;flex-direction: column;justify-content: center;align-items: center;
    width: 25%;
    position: relative;
}
.radio_wrap li input {
    /* border: 2px solid #aaa; */
    position: absolute;
}
.radio_wrap li div {
    font-size: 1.2rem;line-height: 1.2;color: #878686;
    position: absolute;
    left: 50%;
    top:3.2rem;
    width: 100%;
    transform: translateX(-50%);
}
.radio_wrap label {display: block;background-color: #e2e2e2;border-radius: 50%;cursor: pointer;}
.radio_wrap input[type="radio"]:checked + .circle1 {background-color: #e2dcb1;}
.radio_wrap input[type="radio"]:checked + .circle2 {background-color: #e2c799;}
.radio_wrap input[type="radio"]:checked + .circle3 {background-color: #c08261;}
.radio_wrap input[type="radio"]:checked + .circle4 {background-color: #9a3b3b;}
.radio_wrap input[type="radio"]:checked + label div {color: #000;font-weight: bold;}
.radio_wrap .circle1 {width: 1.2rem;height: 1.2rem;}
.radio_wrap .circle2 {width: 1.55rem;height: 1.6rem;}
.radio_wrap .circle3 {width: 1.95rem;height: 1.9rem;}
.radio_wrap .circle4 {width: 2.35rem;height: 2.35rem;}
/* .radio_wrap .circle1 {width: 12px;height: 12px;}
.radio_wrap .circle2 {width: 15px;height: 15px;}
.radio_wrap .circle3 {width: 18px;height: 18px;}
.radio_wrap .circle4 {width: 22px;height: 22px;} */





/* 광고모달 */
* {-webkit-tap-highlight-color: transparent}
.coopang_wrap {position:fixed;height: 100%;width: 100%;left: 0;top: 0;background-color: #fff;z-index: 1000;display: flex;justify-content: center;align-items: center; flex-direction: column;overflow-y: scroll;}
.coopang_wrap img {width: 40%;max-width: 700px;margin-top:5rem;}
.coopang_wrap .p1 {font-size:1.8rem;text-align:center;margin:3rem 0;line-height:1.4;font-weight:bold;color:#111;}
.coopang_wrap .p2 {text-align: center;font-size: 1.4rem;line-height: 1.2;color:#666;margin-bottom:2rem;}
.coopang_wrap .p3 {text-align: center;font-size: 1.2rem;line-height: 1.2;color:#aaa;margin-bottom:1rem;}
.coopang_wrap .cancel {width:3rem;height:3rem;position:absolute;right:1rem;top:50%;transform:translateY(-50%);background-color:#fff;border-radius:10rem;}
.coopang_wrap .cancel span {width: 60%;height: 2px;left:20%;top:50%;background-color: #9ac67d;transform-origin: center;position: absolute;display: none;}
.coopang_wrap .cancel span:nth-of-type(1){transform: rotate(45deg);}
.coopang_wrap .cancel span:nth-of-type(2){transform: rotate(-45deg);}
.coopang_wrap .link {width: calc(100% - 6rem);max-width: 700px;border-radius: 10rem;background-color: #9ac67d;margin-bottom: 1.5rem;box-shadow: 2px 2px 10px rgba(0, 0, 0, .2);border:none;position:relative;}
.coopang_wrap .link p {color: #fff;font-size: 1.6rem;font-weight:600;width:calc(100% - 8rem);margin:0 auto;padding:1.5rem 0;}
.coopang_wrap .link .cancel p {color:#9ac67d;padding: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;}


/* 전면광고 */
.fullAd_wrap {position: fixed;left: 0;top: 0;width: 100%;height:100vh;display: flex;align-items: center;flex-direction: column;justify-content: center;background-color: rgba(0, 0, 0, .4);backdrop-filter: blur(3px);z-index: 1000;}
.fullAd_wrap .cancel {position: absolute;top:1.5rem;right: 1.5rem;width: 2.5rem;height: 2.5rem;display: flex;align-items: center;justify-content: center;background-color: #111;box-shadow: 0 0 .3rem rgba(0, 0, 0, .2);border-radius: 50%;display: none;z-index: 100000;}
.fullAd_wrap .cancel span {position: fixed;width: 60%;height: 1.5px;transform-origin: center;background-color: #fff;}
.fullAd_wrap .cancel span:nth-of-type(1) {transform: rotate(45deg);}
.fullAd_wrap .cancel span:nth-of-type(2) {transform: rotate(-45deg);}
.ins_wrap {position: absolute;top: 50%;left: 50%;width: 100%;transform: translate(-50%, -50%);height: fit-content;}
.time {position: absolute;transform: translateX(-50%);left: 50%;top: 1.5rem;padding: 1rem 3rem;color: #666;z-index: 1000;font-weight: 500;border-radius: 10rem;background-color: #fff;box-shadow: 0 0 .5rem rgba(0, 0, 0, .2);font-size: 1.6rem;}
.fullAd_wrap .info {font-size: 1.6rem;line-height: 1.4;color:#fff;}

.bottomText {
    margin-top: 2rem;
    line-height: 1.4;
}