@charset "utf-8";

/* webfont */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
* { margin:0; padding:0; box-sizing: border-box; }
li {list-style:none;}
a, a:hover, a:visited { text-decoration: none; color:inherit; }
div,span,p			{margin:0; padding:0;}
img					{border:0; vertical-align:middle;}
button				{margin:0;padding:0;background:none;border:0;}
header,
footer,
section,
article,
aside,
nav,
hgroup,
details,
figure,
figcaption			{display:block;}
img,fieldset {border:0}
caption,legend {display:none;}
ul,ol,li {list-style:none;}
table {border-collapse:collapse;}
body { font-family: 'pretendard'; font-size:15px; font-weight:normal; color:#333; line-height: 1.2; }
.btn_wrap {
    display: flex;
    justify-content: space-between;
    margin-top: 40px;
}

.btn_wrap .left_side {
    width: 120px; /* or whatever width matches your design */
}

.btn_wrap .right_side {
    width: 120px;
    text-align: right;
}

.btn_wrap a {
    display: inline-block;
    min-width: 120px;  /* or whatever width you prefer */
    text-align: center;
}

.diagnosis-container { width: 800px; margin: 0 auto;padding: 80px 0 120px; text-align: center; }
.diagnosis-container .diagnosis-icon { width: 200px; height: 200px; border-radius: 100px; margin: 0 auto 40px; background:#EBEEFC url('/img/result_icon.png') center no-repeat; background-size:contain;}
.diagnosis-container .diagnosis-title { font-size: 44px; font-weight: 700; }
.diagnosis-container .diagnosis-description { margin-top: 20px; font-size: 20px; line-height: 30px; color: #575A62; font-weight: 400; }
.diagnosis-container .diagnosis-result { border: 1px solid #D3D6DF; padding: 85px 60px; border-radius: 4px; margin-top: 60px; text-align: left; }
.diagnosis-container .diagnosis-result .result-box h2 { font-size: 20px; font-weight: 600; line-height: 30px; }
.diagnosis-container .diagnosis-result .result-box p { font-size: 20px; font-weight: 400; color: #575A62; margin-top: 10px; }
.diagnosis-container .diagnosis-actions { margin-top: 90px; display: flex; align-items: center; justify-content: center; gap: 20px; }
.diagnosis-container .diagnosis-actions .btn { height: 48px !important; font-size: 16px; font-weight: 600; color: #fff; border:none !important; border-radius: 4px; cursor: pointer; text-shadow:none !important; background-image: none !important;}
.diagnosis-container .diagnosis-actions .btn-try { width: 140px; }
.diagnosis-container .diagnosis-actions .btn-consultation { width: 188px; }

.btn-secondary { background-color: #979CAB; }
.btn-primary { background-color: #055CF5;}
.btn-try { background-color: #979CAB; }
.btn-consultation { background-color: #055CF5; }

/* 모달 */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.modal-content {
    background: white;
    padding: 20px;
    border-radius: 4px;
    width: 90%;
    max-width: 500px;
}

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.modal-body p {
    background:#F2F8FF;
    color:#055CF5;
    padding:12px 20px;
    margin-bottom:20px;
}

.modal-body input[type="tel"] {
    height:44px !important;
    font-size:15px;
}

.modal-body .input-group {
    margin-bottom:20px;
}

.modal-close {
    cursor: pointer;
}

.input-box {
    display: flex;
    gap: 10px;
    margin-top: 8px;
}

.input-box input {
    flex: 1;
    padding: 8px;
}

.timer {
    width:100px;
    height:44px;
    line-height:44px;
    text-align:center;
    color: #055CF5;
    margin-left: 10px;
}

.modal-footer {
    margin-top: 20px;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.modal-footer .btn {
    color:#fff;
    width:100%;
    height:44px !important;
    font-size:14px;
    border-radius:4px;
}

.modal-footer .btn-cancel {
    background:#575A62;
}

.modal-footer .btn-confirm {
    background:#055CF5;
}

.btn-send-verification {
    width:100px;
    border:1px solid #ccc;
    height:44px;
    border-radius:4px;
}

/* Additional styles for results detail */
.results-detail {
    margin-top: 30px;
}

.category-result {
    margin-bottom: 30px;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 8px;
}

.category-result h3 {
    font-size: 18px;
    color: #055CF5;
    margin-bottom: 10px;
}

.category-result p {
    font-size: 16px;
    color: #575A62;
    margin: 5px 0;
}

/* Ensure the results container takes full width */
.test_cont_wrap .contents_width {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

/* Adjust diagnosis container for test page context */
.test_cont_wrap .diagnosis-container {
    padding: 40px 0;
    width: 100%;
    max-width: 800px;
}