@charset "utf-8";

.content_wrap h4{font-family: var(--tit);font-size: 28px;color: var(--tit_black);margin: 40px 0 20px;position: relative;padding-left: 12px;}
.content_wrap h4:before{content: "";width: 10px;height: 10px;border-radius: 100%;background: var(--orange);position: absolute;left: 0;}
.content_wrap h5{font-family: var(--tit);font-size: 24px;color: var(--tit_black);margin: 30px 0 20px;}
.content_wrap h6{font-family: var(--tit);font-size: 20px;color: var(--blue);margin: 20px 0 10px;}
.content_wrap p{margin: 10px 0;font-size: 18px;}

.depth3_tab{padding: 10px;border-radius: 20px;border: var(--line);}
.depth3_tab::-webkit-scrollbar-thumb{background: var(--orange);}
.depth3_tab li a{display: flex;width: 100%;justify-content: center;align-items: center;padding: 10px 0;border-radius: 12px;color: var(--tit_black);}
.depth3_tab li.on a{background: var(--orange);color: var(--white);font-weight: 700;}
.depth4_tab{padding: 20px;border-radius: 20px;border: var(--line);overflow-x: auto;}
.depth4_tab::-webkit-scrollbar-thumb{background: var(--orange);}
.depth4_tab ul{display: flex;gap: 20px;}
.depth4_tab li{flex-shrink: 0;}
.depth4_tab li a{display: block;position: relative;padding: 10px 0;color: var(--tit_black);}
.depth4_tab li.on a{font-weight: 700;}
.depth4_tab li.on a:after{position: absolute;content: "";bottom: 0;left: 0;right: 0;height: 3px;background: var(--tit_black);}

.list_ul{margin: 20px 0 40px;}
.list_ul li{position: relative;padding-left: 20px;margin: 8px 0;font-size: 18px;color: var(--tit_black);}
.list_ul li:before{content: "+";font-size: 20px;font-weight: 900;position: absolute;left: 0;top: 0;}
.list_ul li li{margin: 4px 0;font-size: 17px;padding-left: 15px;}
.list_ul li li:before{content: "-";color: var(--orange);font-size: 16px;}
.list_ul li li li{font-size: 16px;}
.list_ul li li li:before{content: "";width: 6px;height: 6px;background: #d9d9d9;border-radius: 100%;top: 9px;}

.box_basic{padding: 20px;border-radius: 0 20px;background: #FAFAFA;border: var(--line);margin: 30px 0;}
.box_basic h4, .box_basic h5, .box_basic h6{margin: 0 0 20px;}
.box_basic .list_ul{margin: 0;}
.box_point{padding: 20px;border-radius: 0 20px;background: #F3F8FC;border: 1px solid rgba(17, 114, 241, 0.1);margin: 30px 0;}
.box_point h4, .box_point h5, .box_point h6{margin: 0 0 20px;}
.box_point .list_ul{margin: 0;}

.f_blue{color: #0054B4!important;}
.f_red{color: #d91737!important;}
.link_text{display: inline-flex;color: var(--tit_black);text-decoration: underline;align-items: center;gap: 4px;}
.link_text:after{content: "";width: 12px;height: 12px;background: url("../../../../images/common/ico_link.svg") center /cover;}
.link_text:hover, .link_text:focus{color: var(--orange);}
.link_text:active{color: var(--blue);}

.btn_wrap a, .btn_wrap button{display: inline-flex;justify-content: center;align-items: center;margin: 2px;padding: 8px 20px;border: 1px solid #444;background: var(--white);border-radius: 50px;font-size: 16px;color: var(--tit_black);cursor: pointer;transition: .3s;}
.btn_wrap .btn_big{padding: 15px 30px;font-size: 18px;min-width: 120px;}
.btn_wrap .btn_pri{background: var(--blue);color: var(--white);border-color: transparent;}
.btn_wrap .btn_pri.btn_orange{background: var(--orange);}
.btn_wrap .btn_sec{border-color: var(--blue);color: var(--blue);background: var(--white);}
.btn_wrap .btn_sec.btn_orange{border-color: var(--orange);color: var(--orange);}
.btn_wrap a:hover, .btn_wrap button:hover,
.btn_wrap a:focus, .btn_wrap button:focus{background: var(--light_blue);color: inherit;}
.btn_wrap a.btn_pri:hover, .btn_wrap a.btn_pri:focus,
.btn_wrap button.btn_pri:hover, .btn_wrap button.btn_pri:focus{background: var(--tit_black);outline-offset: 3px;color: var(--white);}

.btn_form{margin: 2px;vertical-align: middle;}
.btn_form{display: inline-flex;padding: 0 10px;height: 44px;align-items: center;justify-items: center;border-radius: 4px;background: var(--orange);color: var(--white);}

.table_scroll{overflow-x: auto;}
.table_scroll:before{display: block;content: "좌우로 스크롤하여 내용을 확인하세요.";text-align: center;background: var(--bg_blue);margin: 0 0 10px;border-radius: 8px;padding: 10px 0;font-size: 14px;color: var(--blue);position: sticky;left: 0;}
.base_table{border-top: 2px solid var(--tit_black);min-width: 1000px;width: 100%;}
.base_table th,.base_table td{padding: 12px;text-align: center;border-bottom: var(--line);}
.base_table thead th{font-weight: 700;border-color: var(--text_black);color: var(--tit_black);}
.base_table .point_bg{background: #FFF9ED;}
.base_table tfoot{border-top: 2px solid var(--text_black);}
td.btn_wrap{width: auto;margin: 0;overflow: auto;}

.step_box, .step_box02{margin: 30px 0;}
.step_box ol>li{display: flex;flex-wrap: wrap;border: 1px solid #666;padding: 30px;margin: 20px 0 40px;border-radius: 12px;gap: 30px;align-items: flex-start;position: relative;}
.step_box ol>li:after{content: "↓";position: absolute;bottom: -30px;left: 50%;font-weight: 900;transform: translateX(-50%);}
.step_box ol>li:last-child:after{display: none;}
.step_box ol>li.last{border-color: var(--orange)}
.step_box ol>li em{display: inline-block;font-size: 14px;font-weight: 700;color: var(--white);padding: 4px 16px;border-radius: 20px;background: var(--tit_black);}
.step_box div>strong{display: block;font-size: 20px;margin-bottom: 10px;}
.step_box div li{position: relative;padding-left: 10px;margin: 6px 0;}
.step_box div li:before{content: "";position: absolute;width: 5px;height: 2px;background: var(--orange);left: 0;top: 11px;}

.step_box02{padding: 20px;border-radius: 20px;background: var(--bg_blue);}
.step_box02 ol{display: flex;flex-wrap: wrap;flex-direction: column;gap: 40px;justify-content: center;align-items: center;}
.step_box02 ol>li{border-radius: 12px;background: var(--white);width: 100%;position: relative;display: flex;flex-direction: column;}
.step_box02 ol>li:after{content: "↓";position: absolute;bottom: -30px;left: 50%;transform: translateX(-50%);font-weight: 900;}
.step_box02 ol>li:last-child:after{display: none;}
.step_box02 ol>li strong{width: 100%;text-align: center;padding: 10px;background: var(--blue);color: var(--white);border-radius: 12px 12px 0 0;}
.step_box02 ol>li>div{width: 100%;padding: 10px;border-radius: 0 0 12px 12px;}
.step_box02 div li{position: relative;padding-left: 10px;margin: 6px 0;}
.step_box02 div li:before{content: "";position: absolute;width: 5px;height: 2px;background: var(--orange);left: 0;top: 11px;}

.line_box{display: flex;flex-wrap: wrap;width: 100%;padding: 20px;gap: 10px;border-radius: 12px;border: 1px solid #666;color: var(--tit_black);align-items: center;}
.line_box:before{width: 24px;height: 24px;content: "";background: url("../../../../images/common/check_circle.svg");}

.accordion{margin: 30px 0;display: flex;flex-direction: column;gap: 10px;}
.accordion .acc_box{background: var(--bg_blue);border-radius: 12px;overflow: hidden;}
.accordion .acc_tit{margin: 0;}
.accordion .acc_tit button{display: flex;flex-wrap: wrap;gap: 10px;background: var(--white);border: 1px solid #666;border-radius: 12px;width: 100%;padding: 20px;font-size: 18px;font-weight: 700;align-items: center;color: var(--tit_black);cursor: pointer;}
.accordion .acc_tit button:after{content: "↓";margin: 0 0 0 auto;}
.accordion .acc_tit .num{display: inline-flex;padding: 4px 10px;border-radius: 30px;background: var(--tit_black);color: var(--white);}
.accordion .acc_con{display: none;padding: 20px;}
.accordion .acc_box.on .acc_tit button{border-color: var(--blue);color: var(--blue);}
.accordion .acc_box.on .acc_con{display: block;}
.accordion .on .acc_tit button:after{content: "↑";}
.accordion.line_type{border-top: 2px solid var(--tit_black);gap: 0;}
.accordion.line_type .acc_box{border-radius: 0;}
.accordion.line_type .acc_tit button{border-radius: 0;border-right: none;border-left: none;}

.img_box{border-radius: 12px;border: var(--line);padding: 20px;position: relative;overflow: hidden;}
.img_box a{position: absolute;bottom: 0;right: 0;background: var(--orange);color: var(--white);padding: 4px 10px;border-radius: 8px 0 0;}
.img_scroll{overflow-x: auto;}
.img_scroll:before{display: block;content: "좌우로 스크롤하여 내용을 확인하세요.";text-align: center;background: var(--bg_blue);margin: 0 0 10px;border-radius: 8px;padding: 10px 0;font-size: 14px;color: var(--blue);position: sticky;left: 0;}
.img_scroll img{max-width: none;border-radius: 12px;border: var(--line);padding: 20px;}

.star{color: #d91737;}

.map_area .root_daum_roughmap{width: 100%;}
.map_area .root_daum_roughmap .wrap_controllers,
.map_area .root_daum_roughmap .cont{display: none;}

/* login */
.login_wrap{max-width: 600px;margin: 0 auto;}
.login_box div{margin: 0 0 40px;display: flex;flex-direction: column;}
.login_box div label{font-size: 14px;font-weight: 700;}
.login_box div input{max-width: none;padding: 0;border: none;border-bottom: 2px solid var(--tit_black);border-radius: 0;}
.login_box div span{margin-top: 10px;font-size: 14px;color: #d91737;font-weight: 700;}
.login_box button{width: 240px;margin: 0 auto;}
.login_btm{display: flex;flex-wrap: wrap;justify-content: space-between;}
.login_btm>div{display: flex;align-items: center;gap: 4px;}
.login_btm input{width: 16px;height: 16px;border-radius: 4px;border: 1px solid #ccc;}
.login_btm ul{display: flex;flex-wrap: wrap;justify-content: flex-end;gap: 8px;margin: 0 0 0 auto;}
.login_btm li{display: flex;gap: 8px;align-items: center;}
.login_btm li:after{content: "";width: 1px;height: 10px;background: #ddd;}
.login_btm li:last-child:after{display: none;}
.login_btm li a:hover, .login_btm li a:focus{text-decoration: underline;}

/* modal */
.modal.on{display: block;}
.modal_overlay{position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,0.5);backdrop-filter: blur(3px);}
.modal_box{position: absolute;background: var(--white);width: 90%;max-width: 800px;top: 50%;left: 50%;transform: translate(-50%,-50%);padding: 0 20px 40px;max-height: 90%;border-radius: 12px;}
.modal_box .modal_header{position: relative;padding-top: 60px;}
.modal_box h4{margin-top: 0;font-size: 24px;padding: 0;text-align: center;}
.modal_box h4:before{display: none;}
.modal_box .btn_close{position: absolute;top: 20px;right: 0;width: 24px;height: 24px;padding: 0;margin: 0;font-size: 0;overflow: hidden;background: url("../../../../images/common/common_ico.png") center -216px;cursor: pointer;}
.modal_con{display: flex;flex-direction: column;gap: 10px;max-height: 40vh;overflow-y: auto;}
.modal_con p{text-align: center;}
.modal_con .input_wrap{display: flex;flex-wrap: wrap;flex-direction: column;justify-content: center;}
.modal_con .input_wrap label{font-weight: 700;font-size: 14px;}
.modal_con .input_wrap input{border: none;border-bottom: 2px solid var(--tit_black);height: 40px;max-width: none;padding: 0 10px;border-radius: 0;}
.modal_con .txt_wrap{display: flex;flex-wrap: wrap;justify-content: center;align-items: center;gap: 10px;padding: 20px;border-radius: 8px;background: var(--light_blue);font-size: 20px;flex-direction: column;}
.modal_con .txt_wrap span{font-size: 16px;}
.modal .btn_wrap{display: flex;flex-wrap: wrap;align-items: center;justify-content: center;gap: 4px;}
.modal_list{border-top: 1px solid var(--tit_black);}
.modal_list li{display: flex;flex-wrap: wrap;border-bottom: 1px solid #ddd;padding: 15px 0;}
.modal_list li .tit{width: 30%;}
.modal_list li .con{width: 70%;}

/* join */
.join .agree_box .scroll{height: 240px;overflow-y: auto;padding: 20px;border: var(--line);border-radius: 12px;}
.join .agree_box .ag_check{display: flex;justify-content: flex-end;gap: 4px;align-items: center;}
.join .agree_box .ag_check input{width: 16px;height: 16px;}
.join .agree_box .ag_check label{font-size: 18px;}
.join .ag_all{display: flex;gap: 4px;align-items: center;justify-content: center;padding: 20px;background: var(--bg_blue);border-radius: 8px;text-align: center;font-size: 18px;word-break: keep-all;}
.join .ag_all input{width: 16px;height: 16px;}

.join_form fieldset{border-top: 2px solid var(--tit_black);margin-bottom: 40px;}
.join_form .form_box{display: flex;flex-wrap: wrap;flex-direction: column;gap: 10px;padding: 20px 0;border-bottom: 1px solid #666;}
.join_form .form_box .tit{font-size: 14px;font-weight: 700;}
.join_form .form_box .help{display: flex;gap: 4px;font-size: 14px;margin: 10px 0;}
.join_form .form_box .help:before{display: inline-flex;justify-content: center;align-items: center;content: "!";font-size: 12px;width: 16px;height: 16px;border-radius: 100%;border: 1px solid var(--blue);font-weight: 900;color: var(--blue);flex-shrink: 0;}
.join_form .form_box .error{display: flex;gap: 4px;font-size: 14px;margin: 10px 0;color: #d91737;}
.join_form .form_box .error:before{display: inline-flex;justify-content: center;align-items: center;content: "!";font-size: 12px;width: 16px;height: 16px;border-radius: 100%;border: 1px solid #d91737;font-weight: 900;color: #d91737;flex-shrink: 0;}
.join_form input{width: 100%;max-width: none;border-color: #CECECE;border-radius: 4px;padding: 0 10px;margin: 2px 0;}
.join_form input[type="url"]{height: 44px;border: 1px solid #cecece;}
.join_form select{border-color: #CECECE;border-radius: 4px;position: relative;background: url("../../../../images/common/select_down.png") no-repeat center right 8px;padding: 0 40px 0 10px;}
.join_form .input_tel input, .join_form .input_tel select{width: 30%;}
.join_form .input_mail input{width: calc(100% - 2em);}
.join_form .input_mail select{width: 100%;}
.join_form .input_cal{position: relative;display: inline-block;}
.join_form .input_cal button{position: absolute;top: 12px;right: 10px;width: 24px;height: 24px;background: url("../../../../images/common/icon_cal.png") no-repeat center;font-size: 0;overflow: hidden;cursor: pointer;}
.join_form .input_radio{display: flex;flex-wrap: wrap;gap: 10px;}
.join_form .input_radio span{display: flex;flex-wrap: wrap;gap: 4px;align-items: center;}
.join_form .input_radio input{width: auto;}

/* layer */
.layer_wrap{position: fixed; top: 0; left: 0; z-index: 1060; display: none; width: 100%; height: 100%; overflow: hidden; outline: 0;}
.layer_wrap.on{display: block;}
.layer_overlay{position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,0.5);backdrop-filter: blur(3px);}
.layer_box{position: fixed;bottom: 0;left: 0;right: 0;background: var(--white);border-radius: 12px 12px 0 0;}
.layer_header{display: flex;flex-wrap: wrap;justify-content: space-between;padding: 20px;align-items: center;border-bottom: var(--line);}
.layer_header h4{margin: 0;padding: 0;font-size: 24px;}
.layer_header h4:before{display: none;}
.layer_header .btn_close{width: 24px;height: 24px;padding: 0;margin: 0;font-size: 0;overflow: hidden;background: url("../../../../images/common/common_ico.png") center -216px;cursor: pointer;}
.layer_con{max-height: 45vh;padding: 20px;overflow-y: auto;}
.layer_btn{text-align: center;}
.layer_btn.justify{display: flex;flex-wrap: wrap;margin: 0;padding: 20px;}
.layer_btn.justify button, .layer_btn.justify a{width: 100%;}

/* content bottom */
.content_btm{padding: 0 20px 40px;}
.content_btm .manager{display: flex;flex-wrap: wrap;gap: 10px 20px;flex-direction: column;padding: 20px;border-radius: 8px;background: var(--bg_blue);}
.content_btm .manager dl{display: flex;flex-wrap: wrap;gap: 10px;}
.content_btm .manager dt{font-weight: 700;color: var(--blue);}

/* tablet */
@media (min-width: 768px) {
.content_wrap h4{font-size: 32px;}
.content_wrap h5{font-size: 28px;}
.content_wrap h6{font-size: 24px;}

.depth3_tab{overflow-x: auto;}
.depth3_tab ul{display: flex;gap: 10px;}
.depth3_tab li{flex-shrink: 0;}
.depth3_tab li a{width: auto;padding: 10px;}

.list_ul li{margin: 10px 0;}
.list_ul li li{margin: 8px 0;}
.list_ul li li li{margin: 6px 0;}

.box_basic, .box_point{font-size: 18px;}

.login_wrap{margin: 40px auto 120px;}
.login_wrap h4{margin-bottom: 80px;}
.login_box div{flex-direction: row;flex-wrap: wrap;align-items: center;}
.login_box div label{font-size: 20px;font-family: var(--tit);width: 100px;color: var(--tit_black);}
.login_box div input{width: calc(100% - 100px);}
.login_box div span{width: 100%;padding-left: 100px;}

.modal_box{padding: 0 40px 80px;}
.modal_box .modal_header{padding-top: 80px;}
.modal_box .btn_close{top: 40px;}
.modal_con .input_wrap{flex-direction: row;gap: 20px;align-items: center;}
.modal_con .input_wrap label{font-size: 18px;}
.modal_con .input_wrap input{width: 50%;font-size: 18px;}
.modal .btn_wrap{margin-top: 40px;}

.join_form .form_box{flex-direction: row;gap: 0;align-items: center;}
.join_form .form_box .tit{font-size: 18px;width: 20%;}
.join_form .form_box .con{width: 80%;padding: 0 20px;}
.join_form .form_box .help, .join_form .form_box .error{font-size: 16px;gap: 8px;align-items: center;}
.join_form input{width: auto;margin: 2px;}
.join_form .input_tel input, .join_form .input_tel select{width: 6em;}
.join_form .input_mail input{width: auto;}
.join_form .input_mail select{width: auto;}
.join_form .input_address input, .join_form .input_file input{width: 40%;}
.join_form .input_radio{gap: 10px 20px;}
.join_form .input_radio span{font-size: 18px;}
.join_form .input_radio input{height: auto;}

.layer_btn .mr_auto{margin: 0 auto 0 0;}
.layer_btn.justify button, .layer_btn.justify a{width: auto;}

.content_btm .manager{flex-direction: row;}
}

/* pc */
@media (min-width: 1024px) {
.depth3_tab{padding: 0;overflow: hidden;border-radius: 12px;}
.depth3_tab ul{gap: 0;flex-wrap: wrap;}
.depth3_tab li{width: calc(100%/6);}
.depth3_tab li a{border-radius: 0;font-size: 20px;padding: 20px 0;border-right: var(--line);border-bottom: var(--line);}
.depth3_tab li a:focus{outline-offset: -3px;}
.depth3_tab .col2 li{width: 50%;}
.depth3_tab .col3 li{width: calc(100%/3);}
.depth3_tab .col4 li{width: 25%;}
.depth3_tab .col5 li{width: 20%;}
.depth4_tab{padding: 20px 30px;overflow: hidden;}
.depth4_tab ul{gap: 30px;}
.depth4_tab li a{font-size: 20px;}
.depth3_tab li a:hover, .depth3_tab li a:focus,
.depth4_tab li a:hover, .depth4_tab li a:focus{font-weight: 700;}

.box_basic, .box_point{padding: 40px;}

.table_scroll:before{display: none;}
.base_table{min-width: auto;}

.step_box ol>li{margin: 0 0 60px;}
.step_box ol>li:after{bottom: -40px;}
.step_box ol>li em{font-size: 16px;}
.step_box02{padding: 30px;}
.step_box02 ol{flex-direction: row;gap: 50px;}
.step_box02 ol>li{width: auto;}
.step_box02 ol>li:after{content: "→";bottom: auto;top: 50%;right: -32px;left: auto;transform: translateY(-50%);}
.step_box02 ol.col2>li{width: calc((100% - 50px)/2);}
.step_box02 ol.col3>li{width: calc((100% - 100px)/3);}
.step_box02 ol.col4>li{width: calc((100% - 150px)/4);}
.step_box02 ol.col5>li{width: calc((100% - 200px)/5);}
.step_box02 ol>li strong{font-size: 20px;}
.step_box02 ol>li>div{padding: 15px 20px;}

.accordion .acc_tit button{padding: 30px 40px;font-size: 20px;}
.accordion .acc_tit .num{font-size: 16px;}
.accordion .acc_con{padding: 40px;}

.img_box{display: flex;flex-wrap: wrap;justify-content: center;align-items: center;padding: 30px;border-radius: 20px;}
.img_box a{display: none;}
.img_scroll:before{display: none;}
.img_scroll{display: flex;flex-wrap: wrap;justify-content: center;align-items: center;padding: 30px;border-radius: 20px;border: var(--line);}
.img_scroll img{padding: 0;border: none;border-radius: 0;max-width: 100%;}

.join .agree_box{position: relative;}
.join .agree_box .ag_check{position: absolute;top: 0;right: 0;gap: 10px;}
.join .ag_all{margin: 40px 0;font-size: 20px;gap: 10px;}

.join_form .form_box{padding: 40px 0;}
.join_form .form_box .tit{font-size: 20px;}
.join_form input, .join_form select{font-size: 18px;height: 48px;}
.join_form .input_radio span{font-size: 20px;}

.modal_con{max-height: 52vh;}
.modal_list li{padding: 25px 0;font-size: 18px;}

.layer_box{bottom: auto;left: 50%;right: auto;top: 50%;transform: translate(-50%,-50%);width: 90%;max-width: 1200px;border-radius: 20px;}
.layer_header{padding: 30px 40px;}
.layer_con{padding: 40px;}
.layer_btn{margin-bottom: 40px;}
.layer_btn.justify{padding: 0 40px 40px;}
}

/* wide */
@media (min-width: 1440px) {
.content_btm{padding: 0 80px 80px;}
}
@media (min-width: 1600px) {
.content_btm{max-width: 1600px;margin: 0 auto;padding: 0 0 80px;}
}