@charset "UTF-8";
/* MYPAGE */
.mypage_con{display: block;margin: 1rem 0 0 0;position:relative}
.mypage_box{}
.mypage_tab{width:100%;height:auto;position:relative;display:flex;margin-bottom:0.725rem}
.mypage_tab .mypage_tabtit{width:20%;position:relative;background-color:#1b1b1b;text-align:center;border:1px solid #484848;padding: 1rem 0;}
.mypage_tab .mypage_tabtit > h2{font-size:1rem;font-weight:500;color:#e49c12}
.mypage_tab .mypage_tabbox{align-items:center;background-color:#464646;border:1px solid #484848;border-left:0;width: 80%;display: flex;}
.mypage_tab .mypage_tabbox > li{width:calc(100%/2);}
.mypage_tab .mypage_tabbox > li:last-of-type::after{content:none}
.mypage_tab .mypage_tabbox > li > a{width:100%;height:100%;display:block;font-size:0.9375rem;font-weight:400;color:#ccc;text-align: center;}
.mypage_tab .mypage_tabbox > li > a:hover,.mypage_tab .mypage_tabbox > li.active > a{color:#e49c12}
.mypage_usercon{position:relative;background-color:#1b1b1b;border:1px solid #484848;padding:0.9375rem;margin-bottom:1.25rem}
.mypage_usercon .mypage_userbox{display:flex;align-items:center;gap:1.875rem}
.mypage_usercon .mypage_userbox .mypage_user{width:8rem;height:auto;position:relative;background-color:#2e2e2e;border:1px solid #484848}
.mypage_usercon .mypage_userbox .mypage_user .user_thumb{position:relative;padding:0.625rem}
.mypage_usercon .mypage_userbox .mypage_user .user_thumb > img{width:100%;height:100%;border:1px solid #484848;border-radius:5rem}
.mypage_usercon .mypage_userbox .mypage_user > h2{text-align:center;background-color:#e49c12;color:#1b1b1b;padding:0.3125rem 0.625rem;font-size:0.875rem;font-weight:900;border: 1px solid #484848;}
.mypage_usercon .mypage_usertxt{width:calc(100% - 9rem);}
.mypage_usercon .mypage_usertxt .user_txt{width:100%;height:auto;position:relative;display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}
.mypage_usercon .mypage_usertxt .user_txt > p{font-size:0.9375rem;font-weight:500;color:#ccc}
.mypage_usercon .mypage_usertxt .user_txt > p > span{color:#e49c12}
.mypage_usercon .mypage_usertxt .user_txt > span{display:block;width:auto;height:auto;position:relative;padding:0.3125rem 0.9375rem;font-size:0.75rem;font-weight:500;color:#1b1b1b;background-color:#ccc}
.mypage_usercon .mypage_usertxt .user_p{width:100%;height:auto;position:relative}
.mypage_usercon .mypage_usertxt .user_p > p{font-size:0.875rem;font-weight:300;color:#ccc;line-height:1.75rem}
.mypage_usercon .mypage_usertxt .mypage_userflex{width:100%;height:auto;position:relative;display:flex;gap:1.875rem}
.mypage_usercon .mypage_usertxt .mypage_userinfo{width:-webkit-calc((100% - 30px) - 320px);width:-moz-calc((100% - 30px) - 320px);width:calc((100% - 30px) - 320px);height:auto;position:relative}
.mypage_usercon .mypage_usertxt .mypage_userinfo::after{content:'';width:1px;height:100%;background-color:#484848;position:absolute;top:0;right:-15px}
.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_box{width:100%;height:auto;position:relative;padding-bottom:15px;margin-bottom:15px;border-bottom:1px dashed #484848}
.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_box > h2{font-size:1rem;font-weight:400;color:#ccc;margin-bottom:10px}
.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_box > h2 > span{color:#e49c12}
.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_box .more_btn{width:auto;height:auto;position:relative}
.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_box .more_btn > a{display:inline-block;font-size:0.875rem;font-weight:700;padding:0.3125rem 1.25rem;background-color:#e49c12;color:#1b1b1b}
.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_box .more_btn > a:hover{background-color:#f0d15c}
.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_box .info_list{width:100%;height:auto;position:relative;display:flex;align-items:center;gap:1.25rem}
.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_box .info_list > li{display:flex;align-items:center;gap:0.625rem}
.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_box .info_list > li::after{content:'';width:1px;height:10px;position:absolute;background-color:#ccc;top:50%;right:-10px;transform:translateY(-50%)}
.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_box .info_list > li:last-of-type::after{content:none}
.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_box .info_list > li > p{font-size:0.875rem;font-weight:400;color:#ccc}
.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_box .info_list > li > p > span{color:#e49c12}
.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_box .info_list > li > a{display:block;width:auto;height:auto;position:relative;background-color:#e49c12;padding:3px 15px;font-size:0.75rem;font-weight:800;color:#1b1b1b}

.mypage_lvlist{width:100%;height:auto;position:relative;background-color:#1b1b1b;border:1px solid #484848;padding:20px 15px;margin-bottom:20px}
.mypage_lvlist .lvlist_box{width:100%;height:auto;position:relative;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-webkit-justify-content:center;-moz-box-pack:center;-ms-flex-pack:center;justify-content:center;gap:20px}
.mypage_lvlist .lvlist_box .lvlist_item{width:36px;height:auto;position:relative}
.mypage_lvlist .lvlist_box .lvlist_item .lv_rank{width:100%;height:auto;position:relative;text-align:center}
.mypage_lvlist .lvlist_box .lvlist_item .lv_rank .lv_icon{display:block;width:24px;height:24px;position:relative;margin:0 auto;margin-bottom:5px}
.mypage_lvlist .lvlist_box .lvlist_item .lv_rank .lv_icon > img{width:100%;height:100%}
.mypage_lvlist .lvlist_box .lvlist_item .lv_rank > p{font-size:0.8125rem;font-weight:300;color:#ccc}
.mypage_lvlist .lvlist_box .lvlist_item .lv_point{display:inline-block;width:max-content;background-color:#e49c12;border:1px solid #484848;top:-34px;left:50%;transform:translateX(-50%);font-size:0.8125rem;font-weight:600;color:#1b1b1b;padding:6px 10px;text-align:center;display:none}
.mypage_lvlist .lvlist_box .lvlist_item:hover .lv_point{display:block}
.mypage_contents{width:100%;height:auto;}
.mypage_conttitle{width:100%;height:auto;margin-bottom:10px}
.mypage_conttitle > h2{font-size:1rem;font-weight:400;color:#ccc}
.mypage_conttitle > h2 > span{color:#e49c12;font-weight:600}
.mypage_edit{border:1px solid #484848;padding:0.9375rem 0}
.mypage_edit .edit_box{width:100%;}
.mypage_edit .edit_box .edit_item{width:100%;display:flex;margin-bottom:1.25rem;flex-wrap: nowrap;}
.mypage_edit .edit_box .edit_item:last-of-type{margin-bottom:0}
.mypage_edit .edit_box .edit_item .edit_ob{width:calc(100%/2);display:flex;margin: 0;padding: 0;}
.mypage_edit .edit_box .edit_item .edit_fb{width:100%;display:flex;margin: 0;padding: 0;}
.mypage_edit .edit_box .edit_item .edit_fb .edit_th{width:4.75rem;display:flex;align-items:flex-start;padding-top:0.625rem;padding-left: 0.9375rem;padding-right: 0.425rem;}
.mypage_edit .edit_box .edit_item .edit_fb .edit_th > h2{font-size:0.875rem;font-weight:500;color:#e49c12;}
.mypage_edit .edit_box .edit_item .edit_fb .edit_td{width:81.95%;}
.mypage_edit .edit_box .edit_item .edit_ob .edit_th{width:20%;height:auto;position:relative;display:flex;align-items:flex-start;padding-top:0.625rem;padding-left: 0.9375rem;padding-right: 0.425rem;}
.mypage_edit .edit_box .edit_item .edit_ob .edit_th > h2{font-size:0.875rem;font-weight:500;color:#e49c12;}
.mypage_edit .edit_box .edit_item .edit_ob .edit_td{width:80%;}
.mypage_edit .edit_box .edit_item .edit_ob .edit_td .edit_p{width:100%;height:auto;position:relative;margin-top:10px}
.mypage_edit .edit_box .edit_item .edit_ob .edit_td .edit_p > p{font-size:0.875rem;font-weight:300;color:#ccc;line-height:20px;margin-bottom:5px;word-break:keep-all}
.mypage_edit .edit_box .edit_item .edit_ob .edit_td .edit_p > p:last-of-type{margin-bottom:0}
.mypage_edit .edit_box .edit_item .edit_ob .edit_td .edit_p > p > span{color:#ff3c3c}

.mypage_usercon .mypage_usertxt .mypage_userinfo .userinfo_chart{width:100%;height:auto;position:relative}
.user_chartbox{width:100%;height:auto;position:relative;display:flex;border:1px solid #484848}
.user_chartbox .chart_th{width:100px;height:54px;position:relative;display:flex;align-items:center;justify-content:center;border-right:1px solid #484848;background-color:#e49c12}
.user_chartbox .chart_th > h2{font-size:0.875rem;font-weight:900;color:#1b1b1b}
.user_chartbox .chart_td{width:calc(100% - 100px);display:flex;align-items:center}
.user_chartbox .chart_td > li{width:100%;height:100%;display:flex;align-content:center;justify-content:center;flex-wrap:wrap;text-align:center;border-right:1px solid #484848;gap:5px}
.user_chartbox .chart_td > li:last-of-type{border-right:0}
.user_chartbox .chart_td > li > h3{width:100%;font-size:0.725rem;font-weight:300;color:#ccc}
.user_chartbox .chart_td > li > p{width:100%;height:auto;font-size:0.7rem;font-weight:300;color:#ccc}
.exp_bar_area{width:100%;height:auto;display:flex;align-items:center;gap:10px;margin-bottom:36px}
.exp_bar_area > p{width:50px;font-size:0.875rem;color:#ccc;font-weight:300}
.exp_bar_area .exp_bar{width:-webkit-calc((100% - 10px) - 50px);width:-moz-calc((100% - 10px) - 50px);width:calc((100% - 10px) - 50px);height:auto;position:relative;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;gap:7px}
.exp_bar_area .exp_bar .exp_step{width:24px;height:24px;position:relative}
.exp_bar_area .exp_bar .exp_step > img{width:100%;height:100%}
.exp_bar_area .exp_bar .exp_gauge{width:380px;height:30px;position:relative;border-bottom:1px solid #484848}
.exp_bar_area .exp_bar .exp_gauge .exp_gauge_bar{width:100%;height:15px;background-color:#1b1b1b;border:1px solid #484848;border-right:0;margin-top:2px;position:relative;overflow:hidden}
.exp_bar_area .exp_bar .exp_gauge .exp_gauge_bar .gauge_bar_color{width:auto;height:15px;background-color:#e49c12;position:absolute;top:0;left:0}
.exp_bar_area .exp_bar .exp_gauge .gauge_line{position:absolute;width:1px;height:35px;background-color:#484848;z-index:999}
.exp_bar_area .exp_bar .exp_gauge .gauge_line.gauge_line_01{left:0}
.exp_bar_area .exp_bar .exp_gauge .gauge_line.gauge_line_02{left:33.3%}
.exp_bar_area .exp_bar .exp_gauge .gauge_line.gauge_line_03{left:66.6%}
.exp_bar_area .exp_bar .exp_gauge .gauge_line.gauge_line_04{left:100%}
.exp_bar_area .exp_bar .exp_gauge .gauge_line > span{position:absolute;top:39px;left:50%;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);transform:translateX(-50%);font-size:0.8125rem;color:#fff;font-weight:300;text-align:center}
.mypage_usercon .mypage_usertxt .mypage_userstat{width:320px;height:auto;position:relative}
.mypage_usercon .mypage_usertxt .mypage_userstat .userstat_p{width:100%;height:100%;position:relative;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-align-content:center;-ms-flex-line-pack:center;align-content:center;gap:15px}
.mypage_usercon .mypage_usertxt .mypage_userstat .userstat_p > p{font-size:0.875rem;font-weight:400;color:#ccc;word-break:keep-all;line-height:26px}
.mypage_usercon .mypage_usertxt .mypage_userstat .exp_list{width:100%;height:100%;position:relative;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;-webkit-align-content:center;-ms-flex-line-pack:center;align-content:center;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:20px}
.mypage_usercon .mypage_usertxt .mypage_userstat .exp_list > li{width:100%;height:auto;position:relative;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}
.mypage_usercon .mypage_usertxt .mypage_userstat .exp_list > li::after{content:'';width:100%;height:1px;background-color:#484848;position:absolute;bottom:-10px;left:0}
.mypage_usercon .mypage_usertxt .mypage_userstat .exp_list > li:last-of-type::after{content:none}
.mypage_usercon .mypage_usertxt .mypage_userstat .exp_list > li > h4{font-size:0.875rem;font-weight:400;color:#ccc}
.mypage_usercon .mypage_usertxt .mypage_userstat .exp_list > li > p{font-size:0.875rem;font-weight:400;color:#ccc}
/* MYPAGE CONTENTS END */
.login_check input[type='checkbox'] + label,.board_check input[type='checkbox'] + label,.writer_check input[type='checkbox'] + label,.edit_check input[type='checkbox'] + label{display:inline-block;position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-size:0.9375rem;font-weight:400;color:#fff;}
.login_check input[type='checkbox'],.board_check input[type='checkbox'],.writer_check input[type='checkbox'],.edit_check input[type='checkbox']{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.login_check input[type='checkbox'] + label::before,.board_check input[type='checkbox'] + label::before,.writer_check input[type='checkbox'] + label::before,.edit_check input[type='checkbox'] + label::before{content:'';display:inline-block;width:20px;height:20px;line-height:18px;border:1px solid #babdc2;margin:-2px 7px 0 0;text-align:center;vertical-align:middle;background-color:#f5f5f5}
.edit_check input[type='checkbox'] + label::before{width:16px;height:16px}
.edit_input{width:100%;height:40px;position:relative}
.edit_input input{width:85%;height:100%;position:relative;background-color:#1b1b1b;border:1px solid #484848;padding:0 1rem;color: #ccc}
.edit_file{width:100%;height:40px;}
.edit_file > input{width:85%;background-color:#1b1b1b;border:1px solid #484848;padding:0.645rem 0.9375rem;color: #ccc}
.edit_check{justify-content:left;margin-bottom:10px}
.edit_check input[type='checkbox']{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.edit_check input[type='checkbox'] + label{font-size:0.8125rem}
.login_check input[type='checkbox']:checked + label::before,.board_check input[type='checkbox']:checked + label::before,.writer_check input[type='checkbox']:checked + label::before,.edit_check input[type='checkbox']:checked + label::before{content:'';display:inline-block;width:20px;height:20px;background-image:url('img/chk.png');background-position:center;background-repeat:no-repeat;-webkit-background-size:10px 10px;background-size:10px;border:1px solid #2253a2;background-color:#2253a2}
.edit_check input[type='checkbox']:checked + label::before{width:16px;height:16px}

/* TEXTAREA */
.comt_textarea{width:100%;height:80px;position:relative}
.comt_textarea > textarea{width:100%;height:100%;position:relative;background-color:#1b1b1b;border:1px solid #484848;padding:10px;resize:none}
.writer_textarea{width:100%;height:auto;position:relative}
.writer_textarea > textarea{width:100%;height:100%;background-color:#fff;border:1px solid #ccc;resize:none;padding:15px;color:#1b1b1b}
.edit_textarea{width:100%;height:200px;position:relative}
.edit_textarea > textarea{width:100%;height:11rem;position:relative;background-color:#1b1b1b;border:1px solid #484848;position:relative;resize:none;padding:1rem;color: #ccc}
/* TEXTAREA END */

/* BUTTON */
.login_submit{width:100%;height:44px;position:relative}
.login_submit > button{width:100%;height:100%;border:none;background-color:#e49c12;font-size:1rem;font-weight:900;color:#1b1b1b;border-radius:5px}
.login_submit > button:hover{background-color:#ffbf44}
.login_button{width:100%;height:50px;position:relative;margin-bottom:15px}
.login_button > button{width:100%;height:100%;border:none;background-color:#e49c12;font-size:1rem;font-weight:900;color:#1b1b1b;border-radius:5px}
.login_button > button:hover{background-color:#ffbf44}
.join_button{width:100%;height:50px;position:relative;margin-top:20px}
.join_button > button{width:100%;height:100%;border:none;background-color:#e49c12;font-size:1rem;font-weight:900;color:#1b1b1b;border-radius:5px}
.join_button > button:hover{background-color:#ffbf44}
.result_btn{width:100%;height:50px;position:relative;margin-top:20px}
.result_btn > a{display:block;width:100%;height:100%;border:none;background-color:#e49c12;font-size:1rem;font-weight:900;color:#1b1b1b;border-radius:5px;text-align:center;line-height:50px}
.result_btn > a:hover{background-color:#ffbf44}
.sch_button{width:40px;height:40px;position:relative}
.sch_button > button{width:100%;height:100%;background-color:#1b1b1b;border:1px solid #484848;border-left:0;background-image:url(/assets/Pc/img/all_searh_icon.png);background-position:center;background-repeat:no-repeat;-webkit-background-size:auto auto;background-size:auto}
.comt_button{width:108px;height:80px;position:relative}
.comt_button > button{width:100%;height:100%;position:relative;background-color:#e49c12;border:0;font-size:1rem;font-weight:600;color:#1b1b1b}
.comt_button > button:hover{background-color:#ffbf44}
.rwp_submit{width:180px;height:40px;position:relative;margin:0 auto;margin-top:30px}
.rwp_submit > button{width:100%;height:100%;position:relative;background-color:#e49c12;border:0;font-size:1rem;font-weight:600;color:#1b1b1b;border-radius:5px}
.edit_button{width:180px;height:40px;position:relative;margin:0 auto;margin-top:30px}
.edit_button > button{width:100%;height:100%;position:relative;background-color:#e49c12;border:0;font-size:1rem;font-weight:600;color:#1b1b1b;border-radius:5px}
.edit_button > button:hover{background-color:#ffbf44}
/* BUTTON END */

.board_list {width: 100%;height: auto;position: relative;}
.board_listbox {width: 100%;height: auto;position: relative;}
.board_table {width: 100%;height: auto;position: relative;}
.board_table > table {width: 100%;height: auto;position: relative;table-layout: fixed;border-collapse: collapse;}
.board_table > table th {height: 40px;background-color: #1b1b1b;font-size: 0.9375rem;color: #e8a736;padding: 0 10px;border-bottom: 1px solid #e49c12;position: relative;}
.board_table > table th.th_stat{width: 20%}
.board_table > table td{position: relative; text-align: center; font-size: 0.875rem; font-weight: 300; color: #ccc; padding: 15px 10px; border-bottom: 1px solid #484848;}
.board_table > table td .subject_box{width: 100%; text-align: left; display: contents;}
.board_table > table td .subject_box .subject_tit{width: auto; max-width: 90%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center;}
.board_table > table td .subject_box .subject_tit > span{width: 40px; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; color: #e49c12; margin-left: 5px; border: 1px solid #e49c12; background-color: #1b1b1b; border-radius: 5rem; position: relative; margin-left: 15px; font-size: 0.6875rem; padding: 3px 0;}
.board_table > table td .subject_box .subject_tit > span::after{content: ''; width: 10px; height: 1px; background-color: #e49c12; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); left: -10px;}
.board_table > table td .subject_box .subject_tit > a{display: block; width: auto; max-width: 100%; font-size: 0.875rem; font-weight: 500; color: #fff; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.board_table > table td .subject_box .subject_option{width: auto; height: auto; position: relative; margin-left: 8px;}
.board_table > table td .subject_box .subject_option > li{font-family: 'Montserrat'; width: 18px; height: 18px; text-align: center; line-height: 18px; background-color: #ff0000; font-size: 0.75rem; font-weight: 600; padding-right: 1.5px; color: #fff; border-radius: 5rem;}
.board_user {width: 100%;height: auto;position: relative;margin-top: 20px;}
.board_user .user_search {width: 100%;height: auto;position: relative;margin-top: 20px;}
.board_user .user_search > form{width: 100%; height: auto; position: relative; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 5px;}
.board_user .user_search > form .sch_inputbox{width: auto; height: auto; position: relative; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center;}
.th_data2 {width: 15%;}

