@charset "utf-8";

@import url("../../fonts/Pretendard/Pretendard.css");
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Infant:ital,wght@0,300..700;1,300..700&family=Noto+Color+Emoji&display=swap');

:root{
    --layout-max-width: 800px;

    --main-color: #65083D;
    --accent-color: var(--main-color);
    --point-color: #d2963f;
    --font-color: #161616;

    /* input */
    --input-height: 9rem;
    --input-font-size: 4rem;
    --input-border-radius: 1.2rem;
    --input-border-color: #DDDDDD;
    --input-bg-color: #FFFFFF;
    --input-color: #333;
    --focus-border-color: var(--main-color);

    /* result button */
    --result-btn-height: 12rem;
    --result-btn-font-size: 5.4rem;
    --result-btn-border-radius: 0;
    --result-btn-color: #FFEA00;
    --result-btn-bg-color:#000;
}
body {font-family: "Pretendard";  color: var(--font-color); }
.p_color{color: var(--point-color);}
.mark{background: rgba(246,219,173, .37)}

/* layout */
.landing_container {width: 100%;}
.container_wrap {width: 100%;margin: auto;background: #dcdbd9;font-size: 3.8rem;padding-bottom: 15rem;}
.container {position: relative}

/*  화면 하단에 고정된 버튼 */
.action_btn {position: fixed;bottom: 0;left: 50%;transform: translateX(-50%);z-index: 100;width: 100%; max-width: 80rem;cursor: pointer;}

/* 카드 선택 영역 */
.promotion{padding-inline: 5%;position: relative;letter-spacing: -0.02em}
.promotion_wrap{position: relative;margin-bottom: 2.6rem;background:#fff}
.promotion_card{border-bottom: 1px solid #b4976d;overflow: hidden;letter-spacing: -0.02em;margin-inline: 5%;}
.promotion_wrap:nth-of-type(1) .promotion_card:last-of-type{margin-bottom:0;border: none;}
.promotion_wrap:nth-of-type(2){padding-bottom: 35rem;background-color:#fff;background-image: url(./images/con01_card02_bg.png);background-repeat: no-repeat;background-position: left bottom;background-size: contain;position: relative;}
.promotion_wrap:nth-of-type(2)::after{content:"";width: 100%;height: 30rem;display: block;background: url(./images/con01_card02_content.png) no-repeat center center;background-size: contain;position: absolute;bottom:2.5rem;left: 50%;transform: translateX(-50%);}
.promotion_wrap .sub_title{width:  100%;height: 6rem;font-size: 3rem;background: #dbc49c;color: #fff;margin-bottom: 1rem;display: flex;justify-content: center;align-items: center;}
.promotion_wrap:nth-of-type(2) .sub_title{background: #634b46;}
.card_body{display: flex;justify-content: space-between;align-items:center;padding-block: 4.6rem;}
.card_body .select_area .name{font-size: 3.2rem;font-weight: 600;display: block;margin-bottom: 1rem;}
.card_body .select_area .sub_text{font-size: 2.5rem;font-weight: 500;letter-spacing: -0.08em;}
.card_body .price_area{display: flex;justify-content: flex-start;align-items: center;gap: 8rem;}
.card_body .price_area .strike-through{font-size: 30px;font-weight: 500;text-decoration: line-through;color: #bdbdbd;text-decoration-thickness: 2px;}
.card_body .price{font-size: 2rem;font-weight: 500;line-height: 1;}
.card_body .price strong{font-size: 6.5rem;color: #645549;letter-spacing: -0.08em;font-weight: 800;padding-right: .2rem;}
.card_body input[type=checkbox] {-webkit-appearance: none; /* 사파리/크롬 */-moz-appearance: none;    /* 파이어폭스 */appearance: none;         /* 표준 */border: none;outline: none;background: none;cursor: pointer;}
.card_body input[type="checkbox"] + label::before,.card_body input[type="radio"] + label::before {content: '✓';color: #fff;font-size: 2.4rem;width: 3rem;height: 3rem;border-radius: .4rem;margin-right: 1rem;vertical-align: middle;
    background: #CCCCCC;display: flex;justify-content: center;align-items: center;box-sizing: border-box;transition: all .2s ease;cursor:pointer;
}
.card_body input[type="checkbox"]:checked + label::before,.card_body input[type="radio"]:checked + label::before{background: var(--main-color); color: #fff;}
.card_body input[type="checkbox"] + label{display: flex;justify-content: flex-start;align-items: baseline;cursor: pointer;}

/* popup */
.bg {width: 100%;height: 100%;position: fixed;top: 0;left: 50%;transform: translateX(-50%);background: rgba(0, 0, 0, 0.5);z-index: 99999;}
.popup {position: fixed;top: 50%;left: 50%;z-index: 7;width: 90%;max-width: 70rem;background: rgb(255, 255, 255);box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    bottom: 0;transform: translate(-50%, -50%);height: max-content;z-index: 100000;}
.register_wrap {padding: 8rem 7% 0;overflow-y: auto;max-height: 80rem;margin-bottom: 12rem;}
.close-btn{position: absolute;top: 2.4rem;right: 3.2rem;font-size: 8rem;cursor: pointer;color: #000;width: 5rem;height: 5rem;display: flex;align-items: center;justify-content: center;}
.register_wrap .title {font-size: 7rem;margin-bottom: 2.5rem;letter-spacing: -0.04em;text-align: center;text-underline-position: from-font;text-decoration-skip-ink: none;}
.result_btn {position: fixed;left: 50%;bottom: 0;transform: translateX(-50%); z-index: 9;margin:0;}
.input_wrap li {display: flex;align-items: center;margin-bottom: 1.5rem;}
.input_wrap label {width: 25%;flex-shrink: 0;font-size: 4.5rem;font-weight: bold;color: #333;box-sizing: border-box;}


/* 유의사항 커스텀 */
.bottom_info{font-size: 2.2rem;line-height: 1.5; letter-spacing: -0.02em;background-color:#262626 ;color: #fff;padding: 4rem 5%;width: 100%;}