/*나눔고딕*/
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap');

body {font-family: 'Nanum Gothic',dotum,sans-serif;}
h1, h2, h3, h4, h5, h6 {font-family: 'Nanum Gothic',dotum,sans-serif;}
input, button {font-family: 'Nanum Gothic',dotum,sans-serif;}
input::placeholder {font-family: 'Nanum Gothic',dotum,sans-serif;font-size: 1em;}
textarea {resize: none;}
#hd {position:relative;height: 90px;}
/*#hd {display:none;}*/
.frm_input {border-color: #888888;color:#888888;border-radius: 5px;height: 50px;font-size: 1.35em;}

.container{flex:1 auto;padding:50px 0;}

/* 테이블 그리드 */
.grid_1 {width:20px !important;padding:0 !important;}

#ft {display:flex;background:#2a2d30;width:100%;position: relative;}
#ft.bottom {position: absolute;bottom: 0;left: 0;width: 100%;padding: 0 ;border-bottom: 1px solid rgba(255, 255, 255, 0.4);z-index: 1000;transition: all .4s ease;}
#ft #ft_copy {width:100%;border-top:0;}
#ft #ft_copy b {font-size: 1.2em;}
#ft #ft_language {width: 15%;display:flex;justify-content:flex-end;align-items: center;position:absolute;top:50%;transform:translateY(-50%);right:0;}
#ft #ft_language select {height: 100%;}

#ft #ft_language ul {border: 1px solid #ffffff;border-radius: 10px;width:155px;height:40px;display: flex;justify-content: center;align-items: center;cursor:pointer;}
#ft #ft_language ul li {width:100%;display: flex;justify-content: center;align-items: center;gap:10px;cursor:pointer;position:relative;}
#ft #ft_language ul li span {color: #FFFFFF;font-weight: bold;}
#ft #ft_language ul li ul.sub {display:none;background: #2a2d30;position:absolute;top: -140px;height: auto;border:1px solid #2a2d30;border-radius: 10px;overflow: hidden;}
#ft #ft_language ul li ul.sub.on {display: block;}
#ft #ft_language ul li ul.sub li {padding: 10px;border-bottom: 1px solid #FFFFFF;justify-content: flex-start;gap:0;display: flex;}
#ft #ft_language ul li ul.sub li > span{margin-left:15px;}
#ft #ft_language ul li ul.sub li:hover {background-color: #FFFFFF;}
#ft #ft_language ul li ul.sub li:hover span {color: #000;font-weight: bold;}
#ft #ft_language ul li ul.sub li:last-child {border-bottom:0;}

/*로그인화면*/
.item {height: 100vh;}
#main {display:flex;}
#main .item {width: 50%;position: relative;}
#main .item .logo {position:absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}
#main .item .logo img {width:550px;}
#main .item #flogin {width:50%;position:absolute;left: 50%;top: 50%;transform: translate(-50%, -65%);}
#main .item #ft_language .lang_box {width: 25px;height: 25px;border-radius: 70%;overflow: hidden;}
#main .item #ft_language .lang_box img {width: 100%;height: 100%;object-fit: cover;}

#main .mbskin_box {}
#main .mbskin_box h1 {font-size: 3.4em;font-weight: bold;color: #202f4b;margin-bottom:25px;}
#main .mbskin_box #login_fs {display:flex;flex-direction: column;}
#main .mbskin_box #login_fs .frm_input {box-shadow: none;border: 1px solid #888888;margin-bottom:15px;color: #888888;font-size: 1.3em;padding: 10px;}
#main .mbskin_box #login_fs .frm_input:hover {/*border: 2px solid #202f4b;*/}
#main .mbskin_box #login_fs .btn_submit {background: #202f4b;font-size: 1.3em;font-weight: bold;padding: 15px 0;}
#main .mbskin_box #login_fs #login_info {display:flex;justify-content: space-between;align-items: center;font-size: 1.1em;color:#888888;margin-top: 10px;padding-right:2px;}
#main .mbskin_box #login_fs #login_info a {color:#888888;}
#main .mbskin_box #login_fs #login_info a:hover {color:#202f4b;font-weight: bold}


.selec_chk {position: absolute;top: 0;left: 0;width: 0;height: 0;opacity: 0;outline: 0;z-index: -1;overflow: hidden;}
.chk_box input[type="checkbox"] + label {position:relative;padding-left:20px;color:#676e70}
.chk_box input[type="checkbox"] + label:hover {color:#202f4b;font-weight: bold;}
.chk_box input[type="checkbox"] + label span {position:absolute;top:0;left:0;width:15px;height:15px;display:block;margin:0;background:#fff;border:1px solid #d0d4df;border-radius:3px}
.chk_box input[type="checkbox"]:checked + label {color:#202f4b;font-weight: bold;}
.chk_box input[type="checkbox"]:checked + label span {background:url('../img/chk.png') no-repeat 50% 50% #202f4b;border-color:#202f4b;border-radius:3px}


.fregister_agree {position:absolute;top:0;right:0}
.fregister_agree input[type="checkbox"] + label {color:#676e70}
.fregister_agree input[type="checkbox"] + label:hover {color:#202f4b}
.fregister_agree input[type="checkbox"] + label span {position:absolute;top:20px;right:15px;width:17px;height:17px;display:block;background:#fff;border:1px solid #999;border-radius:3px}
.fregister_agree input[type="checkbox"]:checked + label {color:#202f4b}
.fregister_agree input[type="checkbox"]:checked + label span {background:url('../img/chk.png') no-repeat 50% 50% #202f4b;border-color:#202f4b;border-radius:3px}


/*메뉴*/
#gnb {background: none;}
#gnb .gnb_wrap {height: 90px;}
#gnb #gnb_1dul {border-bottom: 0;padding: 15px 0;}
#gnb .gnb_logo {float: left;padding: 0;display:flex;align-items: center;}
#gnb .gnb_logo > img:last-child {margin-left:10px;max-width:300px;max-height: 50px;}
#gnb .gnb_menu_btn {background: transparent;font-size: 35px;}
#gnb .gnb_close_btn {background: #363738;top: 10px;right: 30px;}
.gnb_close_btn > .bar1 {top: 24px;transform: rotate(135deg);}
.gnb_close_btn > .bar3 {top: 24px;transform: rotate(-135deg);}
.gnb_close_btn > span {display: block;position: absolute;left: 50%;width: 30px;height: 3px;margin-left: -15px;background: #999999;transition: all .3s ease-in-out;transform: rotate(0deg);opacity: 1;border-radius: 20px;}

#gnb_all {position: fixed;top: 0;right: 0;width: 35%;height: 100%;background: #363738;box-shadow: none;border: 0;}
#gnb_all h2 {border-bottom: 0}
#gnb_all .gnb_al_ul {display:flex;flex-direction: column;margin-top: 75px;}
#gnb_all .gnb_al_ul .gnb_al_li {border-left: 0;float: none;width: 100%;padding:15px 30px;min-height:0;}
#gnb_all .gnb_al_ul .gnb_al_li .gnb_al_a {font-size: 2.5em;color: #888888;}
#gnb_all .gnb_al_ul .gnb_al_li .gnb_al_a:hover {color: #FFFFFF;text-decoration: underline;text-underline-offset : 10px;}
#gnb_all .logout {padding:40px 0 0 30px;display:flex;justify-content:flex-start;align-items: center;cursor: pointer;}
#gnb_all .logout:hover span {color: #FFFFFF;}
#gnb_all .logout span {font-size: 2em;color:#888888;font-weight: bold;margin-left: 10px;}

/*회원가입*/
#fregister p {background:#B5BAC3;}
#fregister p:before {background:#202f4b;}
.fregister_agree input[type="checkbox"] + label:hover {color:#202f4b;font-weight: bold;}
#fregister_private table th {background: #DADCE1;}
#fregister_chkall {background: #DADCE1;}
.register {margin:40px auto;width: 1320px;position: relative;height: 100%;}
.register .register_img {text-align: center;padding: 50px 0 30px 0;}
.register_form_inner {background: #FFFFFF;border:0;border-radius:0;}
.register_form_inner ul {padding: 0}
.register_form_inner .frm_input {padding-left: 10px;}
.register_form_inner select {font-size: 1.35em;}
.register_form_inner .form_01 li {margin-bottom: 14px;}
.register #fregisterform {margin-bottom: 120px;padding: 0 400px;}
.register #fregisterform .form_01 div {margin: 0;}
.register_form_inner .chk_li {font-size: 1.35em;padding-left: 30px;}
.register_form_inner .chk_li strong {font-weight: bold;color:#202f4b; text-decoration : underline;text-underline-offset:5px;text-decoration-color:#202f4b;cursor: pointer}
.register_form_inner .chk_box input[type="checkbox"] + label span {width:20px;height:20px;}

/*버튼*/
.btn_close {border: 1px solid #202f4b;color:#202f4b;font-size:1.7em !important;font-weight: bold;}
.btn_submit {background:#202f4b;font-size:1.7em !important;font-weight: bold;}
.btn_submit:hover {background: #202f4b;}

/* 모달 */
.modal {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.7);opacity: 0;z-index:-1;-webkit-transition: all .5s ease-in-out;-moz-transition: all .5s ease-in-out;-ms-transition: all .5s ease-in-out;-o-transition: all .5s ease-in-out;transition: all .5s ease-in-out;}
.modal.active {opacity: 1;z-index:10000;}
.modal > div {background:#fff;width:800px;position:absolute;left:50%;top:50%;transform: translate(-50%,-50%);max-height:100%;}
.modal > div#view {width:550px;}
.modal > div#view.long {width:600px;}
.modal > div .modal_top{padding: 5px 5px 0 5px;}
.modal > div .modal_top h2{font-size:24px;border: 2px solid #ddd;padding: 10px;background:#DADCE1;color:#000;text-align: center;}
.modal > div .modal_top h2 div{position:absolute;right:0;top:50%;transform: translateY(-50%);font-size:15px;}
.modal > div .modal_con {margin: 5px;}
.modal > div .modal_con .modal_content {width:100%;min-height: 200px;border: 2px solid #ddd;overflow-y: auto;padding:15px;text-align: initial}
.modal > div .modal_con .modal_content textarea {width:100%;height:100%;min-height: 200px;border:1px solid #ddd;padding:10px;font-size:1.3em;resize:none;}
.modal > div .modal_btn {width:100%;padding: 5px;display:flex;gap:10px;}
.modal > div .modal_btn input[type=button] {width:100%;border:0;background:#202f4b;height: 45px;font-size: 1.35em;font-weight: bold;color: #FFFFFF;cursor: pointer}
.modal > div .modal_btn input[type=submit] {width:100%;border:0;background:#202f4b;height: 45px;font-size: 1.35em;font-weight: bold;color: #FFFFFF;cursor: pointer}
.modal > div .find_modal {text-align: center;}
.modal > div .find_modal input {margin:10px 0;}
.modal > div .find_modal #info_fs p{font-size:16px;}
.modal > div .find_modal .win_btn{margin-top:30px;}
.modal > div .find_modal .win_btn .btn_submit{font-size:16px !important;}

.modal > div .sel_print{display:grid;grid-template-columns: 1fr 1fr 1fr;gap:10px;}
.modal > div .sel_print.depth4{grid-template-columns: 1fr 1fr 1fr 1fr;}
.modal > div .sel_print > div{border:1px solid #ddd;padding:30px 10px;display:flex;align-items: center;justify-content: center;word-break: keep-all;height:150px;font-size:18px;text-align: center;cursor: pointer;transition:all .4s;font-weight:bold;}
.modal > div .sel_print > div:hover{background:#202f4b;color:#fff;border:1px solid #202f4b;}
.modal > div .sel_print > div.active{background:#202f4b;color:#fff;border:1px solid #202f4b;}

/*옵션 팝업*/
#op_modal {border: 1px solid #eeeeee;}


/*메인*/
/*조건페이지*/
.width-fixed {width: 1200px;margin: 0 auto;position: relative;height: 100%;}
#mypage .width-fixed{width:780px;}
.sub_title {width:100%;position: relative;padding: 5px 0;border-bottom: 1px solid #dddddd;}
.sub_title h2 {width: 100%;margin: 0 auto;font-family: "Noto Sans CJK KR", sans-serif !important;position:relative;padding-left: 15px;font-size:2.5em;}
.sub_title h2:before {content:"";position: absolute;left: 0;top: 50%;transform: translateY(-50%);width:5px;height:60%;border-radius: 50px;background-color:#1d236d;}
.sub_title .top_btn_area{position:absolute;right:0;top:50%;transform:translateY(-50%);display:flex;justify-content: flex-end;align-items: center;gap:5px;}
.sub_title .top_btn_area button{font-size: 1.35em;background: #FFFFFF;border:2px solid #202f4b;color:#202f4b;padding:5px 15px;font-weight:bold;border-radius: 5px;}
.sub_title .top_btn_area button{font-size: 1.35em;background: #FFFFFF;border:2px solid #202f4b;color:#202f4b;padding:5px 15px;font-weight:bold;border-radius: 5px;}


#operating {}
#operating #conditionForm {margin-top: 20px;}
#operating .content table input[type=text] {width:250px;height: 30px;font-size: 1em;}
#operating .content table tr th {font-size: 1.7em;text-align: left;padding: 0 10px 10px 0;}
#operating .content table tr td {font-size: 1.35em;padding-bottom: 10px;}

#operating .conditions_top {width: 100%;display: flex;justify-content: space-between;align-items: center;margin-top: 10px;margin-bottom: 5px;}
#operating .conditions_top h2{float:left;font-size: 1.7em;font-weight:bold;}
#operating .conditions_top button{float:right;font-size: 1.35em;background: #FFFFFF;border:2px solid #202f4b;color:#202f4b;padding:5px 15px;font-weight:bold;border-radius: 5px;}

#operating .conditions {width: 100%;}
#operating .conditions #conditions_table {width:100%;border-collapse: collapse;}
#operating .conditions #conditions_table tr th {border-left:1px solid #d0d0d0;}
#operating .conditions #conditions_table tr th:first-child {border-left:1px solid #202F4BFF;}
#operating .conditions #conditions_table tr th .chk_input {position: relative;display: flex;align-items: center;justify-content: center;}
#operating .conditions #conditions_table tr th .chk_input input[type="radio"] {position: absolute;visibility: hidden; /* 라디오 버튼 숨김 */}
#operating .conditions #conditions_table tr th .chk_input label {position: relative;padding-left: 20px;color: #676e70;cursor: pointer;}
#operating .conditions #conditions_table tr th .chk_input label span {position: absolute;left: 0;top: 50%;transform: translateY(-50%);width: 18px;height: 18px;display: block;background: #fff;border: 1px solid #d0d4df;border-radius: 3px;}
#operating .conditions #conditions_table tr th .chk_input input[type="radio"]:checked + label span {background: url('../img/chk.png') no-repeat 50% 50%, #202f4b;border-color: #202f4b;}
#operating .conditions #conditions_table tr th .chk_input input[type="radio"]:checked + label {color: #202f4b;font-weight: bold;}

#operating .conditions #conditions_table tr:first-child th {border-top:3px solid #202f4b;background:#eeeeee;padding:10px;font-size: 1.1em;}
#operating .conditions #conditions_table tr:first-child th:first-child {width: 80px;border-left:none;}
#operating .conditions #conditions_table tr:first-child th:nth-child(2) {border-left:none;}
#operating .conditions #conditions_table tr:nth-child(2) th {background:#202f4b;padding:6px 10px;}
#operating .conditions #conditions_table tr:nth-child(2) th:nth-child(2) {border-left:none;}
#operating .conditions #conditions_table tr select {width:100%;border-radius: 3px;height: 27px;padding:0 5px;border: 1px solid #d0d0d0;}
#operating .conditions #conditions_table tr select:disabled {background:#aaaaaa;}
#operating .conditions #conditions_table tr input:read-only {background:#aaaaaa;}

#operating .conditions #conditions_table tr td {padding:10px;border-top: 1px solid #d0d0d0;font-size: 1.1em;position: relative;}
#operating .conditions #conditions_table tr:not(.add_row):last-child td {border-bottom: 1px solid #202f4b;}
#operating .conditions #conditions_table tr:not(.add_row) td:first-child {background: #202f4b;text-align: center;font-size: 1.1em;font-weight:bold;color:#FFFFFF;}
#operating .conditions #conditions_table tr.add_row td {border-top: 1px solid #202f4b;background:#eeeeee;text-align: center;font-weight:bold;padding:12px 0;}
#operating .conditions #conditions_table tr td input[type='text'] {width:100%;font-size: 1.1em;height: 27px;border: 1px solid #d0d0d0; border-radius: 3px;padding:5px 7px;}
#operating .conditions #conditions_table tr td.not_active {background: #dddddd;}
#operating .conditions #conditions_table tr td div.del_btn {display: none;}
#operating .conditions #conditions_table tr td div.del_btn.del {position: absolute;top: 0;left: 0;opacity: 0.4;width: 100%;background: #14c5c3;height: 100%;text-align: center;margin:0 auto;display: flex;justify-content: center;align-items: center;}
#operating .conditions #conditions_table tr td div.del_chk {display: none;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: #14C5C3FF;opacity: 0.2;}
#operating .conditions #conditions_table tr td div.del:hover + div.del_chk {display: none;}
#operating .conditions #conditions_table tr.del_td:hover .del {opacity: 1;}
/*#operating .conditions #conditions_table tr.del_td:hover .del_chk {display: block;}*/


#operating .conditions_top .top_btn_area {display:flex;justify-content: center;align-content: center;gap:5px;}
#operating .result_info #info_table table {width:100%;border-collapse: collapse;}
#operating .result_info #info_table table tr:first-child {border-top: 3px solid #202F4BFF;}
#operating .result_info #info_table table tr td {padding:10px;color:#202f4b;font-size:1.1em;font-weight:bold;border-bottom: 1px solid #d0d0d0;width:calc(50% - 135px);}
#operating .result_info #info_table table tr td.title {background:#eeeeee;color:#000000;width: 135px;text-align: left;}
#operating .result_info #info_table table tr td.inner {padding:10px 20px;}
#operating .result_info #info_table table tr td input {width: 50%;font-size: 1.1em;border: 1px solid #d0d0d0;border-radius: 3px;padding: 7px 10px;height: initial;}

#operating .result_data {margin-top:60px;}
#operating .result_data #data_table table {width:100%;border-collapse: collapse;}
#operating .result_data #data_table table tr th {font-size:1.1em;background:#202f4b;padding:7px 0;text-align: center;color: #FFFFFF;}
#operating .result_data #data_table table tr th.th_col {width: 120px;}
#operating .result_data #data_table table tr td {font-size:1.1em;font-weight:bold;padding:10px;text-align: center;border-bottom: 1px solid #d0d0d0;}
#operating .result_data #data_table table tr td input[type='text'] {width: 100%;font-size: 1.1em;height: 27px;border: 1px solid #d0d0d0;border-radius: 3px;padding: 5px 7px;}
#operating .result_data #data_table table tr .col {background: #eeeeee;}
#operating .result_data #data_table table tr .td_left {text-align: left;}
#operating .result_data #data_table table tr .chk_input {position: relative;display: flex;align-items: center;justify-content: center;gap: 5px;}
#operating .result_data #data_table table tr .chk_input input[type="checkbox"] {position: absolute;visibility: hidden; /* 라디오 버튼 숨김 */ }
#operating .result_data #data_table table tr .chk_input label {position: relative;padding-left: 20px;color: #676e70;cursor: pointer;}
#operating .result_data #data_table table tr .chk_input label span {position: absolute;left: 0;top: 50%;transform: translateY(-50%);width: 18px;height: 18px;display: block;background: #fff;border: 1px solid #fff;border-radius: 3px;font-size: 1.1em;}
#operating .result_data #data_table table tr .chk_input input[type="checkbox"]:checked + label span {background: url('../img/chk_nav.png') no-repeat 50% 50%, #fff;border-color: #202f4b;}
#operating .result_data #data_table table tr .chk_input input[type="checkbox"]:checked + label {color: #202f4b;font-weight: bold;}
#operating .result_data #data_table table tr .chk_input.chk_col {gap:0px;}
#operating .result_data #data_table table tr .chk_input.chk_col input[type="checkbox"]:checked + label span {background: url('../img/chk.png') no-repeat 50% 50%, #202f4b;border-color: #202f4b;}
#operating .result_data #data_table table tr .chk_input.chk_col input[type="checkbox"]:checked + label {color: #202f4b;font-weight: bold;}
#operating .result_data #data_table table tr td.td_pad_5 {padding: 5px;}
#operating .result_data #data_table table tr td select {border-radius: 3px;height: 25px;border: 1px solid #d0d0d0;padding: 0 5px;width: 105px;font-size: 1em;}
#operating .result_data #data_table table tr td.red {color: red;}

#operating .result_data #data_table table tr.graph_area th{padding: 8px 10px;}
.chk_input1 {background: #0bc1c0;width: 92px;height: auto;padding: 7px 0;border-radius: 5px;box-shadow: 1px 2px 1px 2px #000;}
.chk_input1 input[type="checkbox"]{
    display: none;
}
.chk_input1 input[type="checkbox"] + label{
    display: inline-block;
    position: relative;
    padding-left:25px;
}
.chk_input1 input[type="checkbox"] + label::before{
    display:block;
    content:'';
    /*font-size: 20px;*/
    /*line-height:20px;*/
    /*text-align: center;*/
    /*border: 1px solid #fff;*/
    border-radius: 3px;
    font-size: 1.1em;
    position: absolute;
    left: 0;top: 50%;transform: translateY(-50%);width: 18px;height: 18px;
    /*border:1px solid #ddd;*/
    background: #FFFFFF;
}

.chk_input1  input[type="checkbox"]:checked + label::before{
    background: url('../img/chk_nav.png') no-repeat 50% 50%, #fff;border-color: #202f4b;
}

.chk_input1:hover,
.chk_input1:focus {
    border-color: rgba(0, 0, 0, 0.15);
    color: #202f4b;
    font-weight: bold;
}

.chk_input1:hover {
    transform: translateY(-1px);
}

.op_btns{display:flex;align-items: center;justify-content: center;margin: 50px 0;}

#operating .result_data_point {display: flex;justify-content: center;align-items: center;gap: 10px;}
#operating .result_data_point > div  {padding: 15px 18px;font-size: 1.2em;font-weight: bold;background: #eeeeee;text-align: center;border-radius: 10px;height: 100%;cursor: pointer}
#operating .result_data_point select  {height: 45px;border: 1px solid #eeeeee;border-radius:10px;font-size: 1.2em;font-weight: bold;font-family: 'Nanum Gothic', dotum, sans-serif !important;padding: 0px 10px;}
#operating .result_data_point > div:hover {background:#202f4b;color:#FFFFFF;}
#operating .result_data_point > div.active {background:#202f4b;color:#FFFFFF;}
#operating .result_data_point div#Bind_graph:hover {background:#00AABBFF;color:#FFFFFF;}
#operating .result_data_point div#Bind_graph.active {background:#00AABBFF;color:#FFFFFF;}
#operating .core_point{display:flex;align-items: center;margin-left:20px;gap:10px;}
#operating .core_point > div{padding: 15px 18px;font-size: 1.2em;font-weight: bold;background: #eeeeee;text-align: center;border-radius: 10px;height: 100%;cursor: pointer}
#operating .core_point > div:hover{background:#202f4b;color:#FFFFFF;}
#operating .core_point > div.active{background:#202f4b;color:#FFFFFF;}

.container {display: flex;flex-direction: column;gap: 20px;}

.result_graph{}
.result_graph > div > div {margin-top: 50px;min-height:660px;}
.result_graph > div > div > div{display:flex;justify-content: center;}

.operation_table {width:100%;margin: 5px 0;display:flex;}
.operation_table table.op_table {width:70%;border-collapse: collapse;}
.operation_table table.op_table tr td select {border-radius: 3px;height: 30px;border: 1px solid #d0d0d0;padding:0 5px;width: 105px;font-size: 1.1em;}
.operation_table table.op_table tr td {padding: 10px;border:1px solid #d0d0d0;}
.operation_table table.op_table tr td.ontd {background: #def0ff !important;}
.operation_table table.op_table tr td input[type=text] {width: 100%;font-size: 1.1em;height: 27px;border: 1px solid #d0d0d0;border-radius: 3px;padding: 5px 7px;}
.operation_table table.op_table tr:first-child td {background: #eeeeee !important;padding: 10px 10px 10px 10px;border-top:3px solid #202f4b;position:relative;}
.operation_table table.op_table tr td .chk_input {position: relative;display: flex;align-items: center;justify-content: flex-start;gap:5px;}
.operation_table table.op_table tr td .chk_input input[type="radio"] {position: absolute;visibility: hidden; /* 라디오 버튼 숨김 */}
.operation_table table.op_table tr td .chk_input label {position: relative;padding-left: 20px;color: #676e70;cursor: pointer;}
.operation_table table.op_table tr td .chk_input label span {position: absolute;left: 0;top: 50%;transform: translateY(-50%);width: 18px;height: 18px;display: block;background: #fff;border: 1px solid #d0d4df;border-radius: 3px;}
.operation_table table.op_table tr td .chk_input input[type="radio"]:checked + label span {background: url('../img/chk.png') no-repeat 50% 50%, #455269;border-color: #455269;}
.operation_table table.op_table tr td .chk_input input[type="radio"]:checked + label {color: #202f4b;font-weight: bold;}
.operation_table table.op_table tr td.bg .chk_input span {color:#000000;font-size: 1.1em;font-weight: bold;}
.operation_table table.op_table tr td.bg .chk_input .opt_btn{width:12px;height:12px;display:block;position:absolute;right:0;top:50%;transform: translateY(-50%);cursor: pointer;background:#fff;border:1px solid #333;padding:2px;border-radius: 2px;}
.operation_table table.op_table tr td.bg .chk_input .opt_btn:hover{background:#202f4b}
.operation_table table.op_table tr td.bg .chk_input .opt_btn:after{content:"";width:calc(100% - 4px);height:1px;background:#000;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);}
.operation_table table.op_table tr td.bg .chk_input .opt_btn:before{content:"";width:calc(100% - 4px);height:1px;background:#000;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(90deg);}
.operation_table table.op_table tr td.bg .chk_input .opt_btn:hover:after {background:#fff}
.operation_table table.op_table tr td.bg .chk_input .opt_btn:hover:before {background:#fff}
.operation_table table.op_table tr td.bg .chk_input .opt_btn.active:before{opacity: 0;}
.operation_table table.op_table tr td.bg .chk_input input[type="radio"]:checked + label span {background: url('../img/chk.png') no-repeat 50% 50%, #202f4b;border-color: #202f4b;}
.operation_table table.op_table tr td.bg .chk_input input[type="radio"]:checked + label {color: #202f4b;font-weight: bold;}
.operation_table table.op_table tr td.bg .chk_input input[type="checkbox"] {display: none;}
.operation_table table.op_table tr td.bg .chk_input input[type="checkbox"]:checked + label span {background: url('../img/chk.png') no-repeat 50% 50%, #455269;border-color: #455269;}
.operation_table table.op_table tr td.bg .chk_input input[type="checkbox"]:checked + label {color: #202f4b;font-weight: bold;}
.operation_table table.op_table tr td:first-child:not(.empty) {background: #202f4b;color: #FFFFFF;font-size: 1.1em;font-weight: bold;width: 20%;}
.operation_table table.op_table tr td:first-child div {justify-content: flex-start;}
.operation_table table.op_table tr td:nth-child(2) {background: #eeeeee;}
.operation_table table.op_table tr td.empty {border-right:0;background: #202f4b !important;padding: 10px 3px !important;}
.operation_table table.op_table tr td.row {background: #202f4b !important;border-left: 0 !important;}
.operation_table table.op_table tr td.row div {color: #FFFFFF;font-weight: bold;}
.operation_table table.op_table tr select:disabled {background:#aaaaaa;}
.operation_table table.op_table tr input:read-only {background:#aaaaaa;color:#6d6d6d;}
.operation_table table.op_table tr td.not_active {background: #dddddd;}

.operation_table table.op_depth_table {width:20%;border-collapse: collapse;}
.operation_table table.op_depth_table tr th {background: #eeeeee;padding: 5px;border-bottom: 1px solid #d0d0d0;border-right: 1px solid #d0d0d0;}
.operation_table table.op_depth_table tr:first-child th {background: #eeeeee !important;border-top: 3px solid #202f4b;padding: 17.5px 5px;}
.operation_table table.op_depth_table tr td {padding: 5px;border-bottom: 1px solid #d0d0d0;border-right: 1px solid #d0d0d0;}
.operation_table table.op_depth_table tr td input[type=text] {width: 100%;font-size: 1.1em;height: 27px;border: 1px solid #d0d0d0;border-radius: 3px;padding: 5px 7px;color:#000000;}
.operation_table table.op_depth_table tr td div {display: flex;gap:5px;align-items: center;justify-content:center;}
.operation_table table.op_depth_table tr td select {border-radius: 3px;height: 27px;border: 1px solid #d0d0d0;padding: 0 5px;width: 100%;font-size: 1.1em;}
.operation_table table.op_depth_table tr input:read-only {background: #aaaaaa;}
.operation_table table.op_depth_table tr select:disabled {background: #aaaaaa;}
.operation_table table.op_depth_table tr td.not_active {background: #dddddd;}

.table_sort{cursor: pointer}


#operating #conditionForm .btn_wrap {width: 100%;text-align: center;}
#operating #conditionForm .btn_wrap button {padding: 15px 40px;font-weight: bold;font-size: 1.4em;background: #202f4b;border-radius: 5px;border: 0;color: #ffffff;margin-top: 30px;}

.op_depth{width:calc(30%);margin-left:15px;padding:15px;position:relative;border:1px solid #ddd;background:#eee;}

.op_depth h3{font-size:20px;margin-bottom:10px;font-family: "Nanum Gothic",dotum,sans-serif;font-weight: 800}
.op_depth ul {width:100%;}
.op_depth ul li strong{font-size:15px;margin-bottom:10px;display:block;}
.op_depth ul li div input{width: 100%;font-size: 1.1em;border: 1px solid #d0d0d0;border-radius: 3px;padding:7px 10px;height:initial;}
.op_depth ul li div input:read-only{background: #aaaaaa;}
.op_depth ul li div input:disabled{background: #aaaaaa;}
.op_depth ul li div select{width: 100%;font-size: 1.1em;border: 1px solid #d0d0d0;border-radius: 3px;padding:5px 10px;height:initial;}
.op_depth ul li div select:disabled{background: #aaaaaa;}
.op_depth ul li div span{font-size:12px;margin:5px 0;display:block;}
.op_depth ul li div > div > div{display:flex;gap:5px;align-items: center;}
.op_depth ul li div.qa > div > div > div{display:flex;flex-direction: column}
.op_depth ul li + li{margin-top:20px;}
.op_depth ul li.dual > div {grid-template-columns: 1fr 1fr;display:grid;gap:5px;}

.max_table table {width: 100%;border-collapse: collapse;margin-top: 40px;}
.max_table table tr th {padding: 20px 10px;font-size: 1.1em;border-top: 3px solid #202f4b;border-left: 1px solid #d0d0d0;background:#eeeeee;}
.max_table table tr th:first-child {border-left:none;}
.max_table table tr td {padding:10px;font-size: 1em;cursor: pointer}


.max_table table tr th a{color:#000000;}
.max_table table tr th a:after{content:"▼";margin-left:5px;}

.max_table table tr th a[id*='asc']:after{content:"▲";color:red}
.max_table table tr th a[id*='desc']:after{content:"▼";color:blue}

.search_area{margin:50px 0 10px ;text-align: right;}
.search_area select{border-radius: 3px;height: 33px;border: 1px solid #d0d0d0;padding:0 5px;font-size: 1.2em;}
.search_area input{border-radius: 3px;height: 33px;border: 1px solid #d0d0d0;padding:0 5px;font-size: 1.2em;width:200px;}
.search_area button{border-radius: 3px;height: 33px;border: 1px solid #202f4b;padding:0 15px;font-size: 1.2em;background: #202f4b;color:#fff;}
.product_table table{border-spacing: 0;width:100%;margin:20px 0 10px ;}
.product_table table tr th{padding:15px 0;font-size:1.1em;color:#fff;background: #202f4b;border-left:1px solid #fff;}
.product_table table tr th:first-child{border-left:0;}
.product_table table tr.row_tr th{border-top:1px solid #fff;}
.product_table table tr.row_tr th:first-child{border-left:1px solid #fff;}
.product_table table tr td{border-left:1px solid #fff;padding:10px 2px;text-align: center;font-size:1.1em;position:relative;border-bottom:1px solid #eee;}
.product_table table tr th a{color:#fff;}
.product_table table tr th a:after{content:"▼";margin-left:5px;}
.product_table table tr td.del{color: #d21d1d;}
.product_table table tr td.act{color: #35a8d3;}
.product_table table tr.pd_tr{cursor: pointer}
.product_table table tr.pd_tr:hover td{font-weight:bold;}
.product_table table tr.pd_tr:hover td:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background: rgb(201, 224, 223);display:block;z-index:-1;}


.product_table.detail {margin-top:30px;}
.product_table.detail > div.info{display:grid;grid-template-columns: 1fr 1fr;gap:20px;}
.product_table.detail h3{font-size: 1.3em;font-weight:bold;margin-top:0;}
.product_table.detail table + h3{margin-top:30px;}
.product_table.detail h3 + table{margin-top:10px;}
.product_table.detail table{table-layout: fixed}
.product_table.detail table tr th {background:#eee;color:#202f4b;border-bottom:1px solid #ddd;font-weight:bold;font-size:1em;text-align: left;padding:10px 5px;width:22%;}
.product_table.detail table tr td {border-bottom:1px solid #ddd;font-size:1em;text-align: left;padding:5px;}
.product_table.detail table + table.point {margin-top:20px;}
.product_table.detail table.point tr th{color:#fff;background: #202f4b;text-align: center}
.product_table.detail table.point tr td{text-align: center}
.product_table.detail table.point tr td select{border-radius: 3px;height: 25px;border: 1px solid #d0d0d0;padding:0 5px;font-size: 1em;width:100%;}
.product_table.detail table tr:first-child th {border-top:2px solid #202f4b}
.product_table.detail table tr:first-child td {border-top:2px solid #202f4b}
.product_table.detail table.point tr:first-child th{border-top:none;}
.product_table.detail table.point tr:first-child td{border-top:none;}
.product_table.detail table.point.border tr:first-child td{border-top:2px solid #202f4b}
.product_table.detail table.point.border tr:first-child td{border-top:2px solid #202f4b}
.product_table.detail .chartsResult{margin-top:50px;height:600px;text-align: center;}
.product_table.detail .chartsResult > div{margin:0 auto;display:flex;justify-content: center;}

.operation_change{position:absolute;top:0px;left:50%;transform:translateX(-50%);z-index: 3;animation: upDown 2s infinite ease-in-out}
.operation_change #change_move{width:50px;height:50px;border:1px solid #202f4b;background:#FFF;border-radius: 50% 50%;cursor: pointer;transition: all .4s}
.operation_change #change_move:hover{background:#202f4b;}
.operation_change #change_move i{color:#202f4b;font-size:20px;font-weight:normal;transition: all .4s}
.operation_change #change_move:hover i{color:#fff;}

@keyframes upDown {
    0%{
        top:0px;
    }
    50%{
        top:-10px;
    }
    100%{
        top:0px;
    }
}


.mypage_table table{width:100%;border-spacing: 0;margin-top:30px;table-layout: fixed}
.mypage_table table tr:first-child th{border-top: 3px solid #202f4b;}
.mypage_table table tr:first-child td{border-top: 3px solid #202f4b;}
.mypage_table table tr th{padding: 15px 10px;font-size: 1.1em;border-right: 1px solid #d0d0d0;background: #eeeeee;border-bottom:1px solid #d0d0d0;}
.mypage_table table tr td{padding: 10px 10px;font-size: 1.1em;background: #fff;border-bottom:1px solid #d0d0d0;position:relative;}
.mypage_table table tr td input{width: 100%;font-size: 1.1em;border: 1px solid #d0d0d0;border-radius: 3px;padding:7px 10px;height:initial;}
.mypage_table table tr td select{font-size: 1.1em;border: 1px solid #d0d0d0;border-radius: 3px;padding:4px 10px;height:initial;}
.mypage_table table tr td.tel select{width: auto;}
.mypage_table table tr td.tel input{width: auto;}
.mypage_table table tr td a{background: #202f4b;border:2px solid #202f4b;color:#fff;border-radius: 3px;padding:4px 10px;position:absolute;top:50%;right:10px;transform:translateY(-50%);}
.mypage_table .edit_btn{margin-top:30px;text-align: center;}
.mypage_table .edit_btn button{font-size: 1.35em;background: #FFFFFF;border:2px solid #202f4b;color:#202f4b;padding:5px 55px;font-weight:bold;border-radius: 5px;}
.mypage_table .edit_btn button:last-child{font-size: 1.35em;background: #202f4b;border:2px solid #202f4b;color:#fff;padding:5px 55px;font-weight:bold;border-radius: 5px;}

.data_copy{position:absolute;bottom:-15px;left:0;background:#fff;padding:2px;border-radius: 4px;border:1px solid #ddd;display:flex;align-items: center;justify-content: space-between;width:100%;margin-top:5px;gap:2px;}
.data_copy.active{display:flex !important;}
.data_copy > div{padding:2px;border-radius: 10px;background:#000;color:#fff;cursor: pointer;width:50%;text-align: center;}
.data_copy > div:last-child{background:#202f4b;}

.op_con_nm{margin-top:5px}
.op_con_nm input[type=text]{height:23px;}

.warning{background:#0bc1c0;color:#fff;margin:10px 0;font-size:16px;text-align: center;padding:7px ;border-radius: 5px;width:100%;font-weight:bold;}

.index_top {display:flex;justify-content: center;align-items: center;gap:5px;}
.index_top button{height:33px;float:right;font-size: 1.35em;background: #FFFFFF;border:2px solid #202f4b;color:#202f4b;padding:5px 15px;font-weight:bold;border-radius: 5px;word-break:auto-phrase}

/* toggle */
.toggle-button-cover {position: relative;display: flex;justify-content: center;align-items: center;margin-bottom: 5px;}
.button-cover {height: 100px;margin: 20px;background-color: #fff;box-shadow: 0 10px 20px -8px #c5d6d6;border-radius: 4px;}
.button-cover:before {counter-increment: button-counter;content: counter(button-counter);position: absolute;right: 0;bottom: 0;color: #d7e3e3;font-size: 12px;line-height: 1;padding: 5px;}
.button-cover, .knobs, .layer {position: absolute;top: 0;right: 0;bottom: 0;left: 0;}
.button {position: relative;text-align: center;width: 35px;height: 19px;overflow: hidden;}
.checkbox {position: relative;width: 100%;height: 100%;padding: 0;margin: 0;opacity: 0;cursor: pointer;z-index: 3;}
.knobs {z-index: 2;}
.layer {width: 100%;background-color: #ebf7fc;transition: 0.3s ease all;z-index: 1;}
.button.r, .button.r .layer {border-radius: 100px;}
#button-3 .knobs:before {content: "S";position: absolute;top: 2px;left: 2px;width: 15px;height: 15px;color: #D5F1FD;font-size: 10px;font-weight: bold;text-align: center;line-height: 1;padding:2px 5px;background-color: #03a9f4;border-radius: 50%;transition: 0.3s ease all, left 0.3s cubic-bezier(0.18, 0.89, 0.35, 1.15);}
#button-3 .checkbox:active + .knobs:before {width: 25px;border-radius: 100px;}
#button-3 .checkbox:checked:active + .knobs:before {margin-left: -10px;}
#button-3 .checkbox:checked + .knobs:before {content: "D";left: 18px;background-color: #202f4b;}
#button-3 .checkbox:checked ~ .layer {background-color: #B5BAC3;}
/* toggle */


.prd_txt{padding-top:40px;}
.prd_txt p{font-size:1.2em;line-height: 1.5}

.prd_tab {display:flex;align-items: center;gap:5px;margin-top:20px;}
.prd_tab a{padding:5px 20px;border-radius: 20px;background:#eee;font-size:18px;color:#000;}
.prd_tab a.active{background:#03a9f4;color:#fff;}