﻿@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto+Slab:wght@100..900&display=swap');

*{margin:0; padding:0; box-sizing:border-box;}
li{list-style:none;}

html,body{}
table, th, td{font-family:'Noto Sans KR', sans-serif;}
body{font-size:15px; font-family:'Noto Sans KR', sans-serif; line-height:1; color:#000; text-align:justify; background-color: rgba(255,255,255,0.5);
  background-blend-mode: lighten;}
iframe, input, select, textarea{border:0; outline:0; font-family:'Noto Sans KR', sans-serif;}
a{text-decoration:none; color:inherit;}
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder{color:transparent;}
input:focus:-moz-placeholder, textarea:focus:-moz-placeholder{color:transparent;}
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder{color:transparent;}
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder{color:transparent;}

.radio_input{display:none;}
.radio_label{cursor:pointer; display:flex; align-items:center; position:relative; line-height:1.4;}
.radio_bullet{width:20px; height:20px; border:2px solid #333; border-radius:4px; margin-right:10px;}
.radio_input:checked + .radio_bullet{background-image:url(../images/check.png); background-size:cover;}

.check_input{display:none;}
.check_label{cursor:pointer; display:flex; align-items:center; position:relative; line-height:1.4;}
.check_bullet{width:20px; height:20px; border:2px solid #333; border-radius:4px; margin-right:10px;}
.check_input:checked + .check_bullet{background-image:url(../images/check.png); background-size:cover;}

.re_btn_1{display:flex; justify-content:center; align-items:center; height:52px; background-color:#002a65; color:#fff; font-size:16px; border-radius:10px; font-weight:500;}
.re_btn_2{display:flex; justify-content:center; align-items:center; height:52px; background-color:#fff; color:#001b40; border:2px solid #002a65; font-size:16px; border-radius:10px; font-weight:500;}
.re_btn_3{display:flex; justify-content:center; align-items:center; height:32px; background-color:#fff; color:#000; border:1px solid #000; border-radius:4px; font-size:15px; font-weight:500; padding-bottom:1px;}
.re_btn_4{display:flex; justify-content:center; align-items:center; height:50px; background-color:#fff; color:#000; border:1px solid #000; border-radius:10px; font-size:14px; font-weight:500; padding-bottom:1px;}
.re_btn_5{display:flex; justify-content:center; align-items:center; height:52px; background-color:#cccccc; color:#999999; border:2px solid #888888; font-size:16px; border-radius:10px; font-weight:500; margin-top:10px;}

.re_btn_3.off_2{background-color:#ccc; color:#fff; border-color:#ccc;}

.re_container{max-width:640px; margin:0 auto; padding:80px 3% 0 3%;}

header{display:flex; justify-content:center; align-items:center; width:100%; height:50px; background-color:#002a65; position:fixed; left:0; top:0; padding:0 15px; box-shadow:0 1px 4px 2px rgba(0,0,0,0.05); max-width:640px; color:#fff;}
header h1{color:#fff; font-size:19px; font-weight:500;}

.re_header_logo{height:28px;}
.re_header_back{position:absolute; height:28px; left:3%; top:50%; transform:translateY(-50%); cursor:pointer;}
.re_header_out{position:absolute; right:3%;}
.re_header_out img{height:28px;}

/* 1 */
.re_guide{text-align:center; line-height:1.6; padding:10px 0 40px 0;}
.re_guide h2{color:#002a65; font-weight:500; line-height:1.3; margin-bottom:10px;}
.re_input_1{display:block; width:100%; height:50px; line-height:50px; background-color:#fff; border:1px solid #111; font-size:16px; border-radius:10px; font-weight:500; padding:0 15px;}
.re_input_1::placeholder{color:#333;}

.re_between{display:flex; justify-content:space-between;}

.re_between .re_input_1{width:calc(100% - 130px);}
.re_between .re_btn_4{width:120px;}

/* 2 */
.re_wel{text-align:center; font-size:22px; padding:10px 0 30px 0; font-weight:300;}
.re_wel b{font-weight:500;}

.re_my{width:100%; border-collapse:collapse; border-top:2px solid #002a65; background-color:#fff;}
.re_my th{font-weight:400; padding:16px 20px; text-align:left; border-bottom:1px solid #e5ebf0;}
.re_my td{padding:16px 20px; text-align:right; border-bottom:1px solid #e5ebf0;}
.re_my b{font-size:1.2em; font-weight:500;}
.re_chart_bg{background-color:#c6d3de; border-radius:10px; height:4px; margin-bottom:12px; position:relative;}
.re_chart_bar{position:absolute; left:0; top:-2px; bottom:-2px; border-radius:10px; background-color:#fed400;}

.re_my_btn{padding-top:35px;}
.re_my_btn.off{opacity:0.4; pointer-events:none;}

/* 3 */
.re_title{display:flex; justify-content:space-between; align-items:center; padding-bottom:15px; font-weight:600;}
.re_title small{color:#002965;}
.re_select, .re_input{display:block; width:100%; height:50px; line-height:50px; border:2px solid #ddd; background-color:#fff; border-radius:10px; text-align:center; text-align-last: center; font-size:17px;}

.re_section{padding:20px 0;}
section.re_section:first-of-type{padding-top:0;}
section.re_section:last-of-type{padding-bottom:0;}

.re_section.off{opacity:0.4; pointer-events:none;}

.re_time_wrap{display:flex; flex-wrap:wrap;}
.re_time{display:flex; justify-content:center; align-items:center; width:31%; height:44px; border:2px solid #ddd; background-color:#fff; border-radius:10px; font-size:16px; margin-bottom:3.5%; margin-right:3.5%; cursor:pointer;}
.re_time:nth-child(3n){margin-right:0;}
.re_time.active{border-color:#002965; background-color:#002965; color:#fff;}
.re_time.off{pointer-events:none; opacity:0.4;}

.re_text{padding:10px 15px; background-color:#e5ebf0; border-radius:10px; font-size:14px; line-height:1.6;}

/* 4 */
.re_table{width:100%; border-collapse:collapse; border-top:2px solid #002a65; text-align:center; font-size:16px;}
.re_table th{height:48px; font-weight:500; border-bottom:1px solid #ddd; background-color:#e5ebf0;}
.re_table td{height:54px; border-bottom:1px solid #ddd;}
.re_table .re_btn_3{width:84%; margin:0 auto;}
.re_table .off{opacity:0.4; pointer-events:none;}

.re_no{text-align:center; opacity:0.6; padding-top:30px; font-size:16px;}

.bbs_page{display:flex; justify-content:center; align-items:center; flex-wrap:wrap; width:100%; padding:25px 0;}
.bbs_page img{display:block;}
.bbs_page img.prev{margin-right:10px;}
.bbs_page img.next{margin-left:10px;}
.bbs_page a, .bbs_page span{margin:0 5px;}
.bbs_num{font-size:14px; color:#333; transition:0.2s; width:28px; height:28px; border:1px solid #ddd; border-radius:50%; display:flex; justify-content:center; align-items:center; font-weight:500;}
.bbs_num:hover{color:#fff; background-color:#002a65; border-color:#002a65; font-weight:500; opacity:0.9;}
.bbs_num.active{color:#fff; background-color:#002a65; border-color:#002a65; font-weight:500;}


@media all and (min-width:640px){
    .re_container{padding:90px 2% 0 2%;}
    
    header{left:calc(50% - 320px);}
    
    .re_time{width:23%; margin-bottom:2.66%; margin-right:2.66%;}
    .re_time:nth-child(3n){margin-right:2.66%;}
    .re_time:nth-child(4n){margin-right:0;}
    
    .bbs_page{padding:30px 0;}
    .bbs_num{font-size:15px; width:32px; height:32px;}
    .bbs_page a, .bbs_page span{margin:0 6px;}
}



