ul,li {list-style: none; padding-left:0px;}
button {background-color:#9c5d42; color:#ffffe4;border-color:#9c5d42;}
:checked {accent-color:darkgray}

input[type="date"]::-webkit-calendar-picker-indicator {display: none;}
#top {margin: 10px 10px 10px 10px;padding:30px 0px;background-color:#004c63;color:#F7FAFC;text-align: center}

#title{font-size: 28px;margin:0px 0px;}
#container {width:auto;margin:10px;}
#wrapper {width: 1960px;display: flex;flex-wrap:nowrap;justify-content:center;margin:0px auto;}
/*부분창에서는 width는 마우스를 올렸을 때 나오는 window창의 width보다 작음.  
이때문에 마우스 올렸을 때 나오는 window width 2000을 기준으로 디자인 변경할 때,
wrapper의 width= 2000 - container margin X 2 = 1980으로 하면 wrapper가 화면보다 더 커지게 됨 */  

#upperbar_1 {display:none;}
#aside_1,#aside_2 
{padding:10px;background-color:#F7FAFC;flex-basis:180px;
flex-grow:0;flex-shirink:0;font-size:14px;}

/*#side_menu {
    position:sticky;
    align-self: flex-start;
    top: 0;
    overflow-y: auto;
}*/

#log_info {margin-top: 20px;}
#login_bar {width:100%;margin-bottom: 20px;background-color: #3b8098;border-color: #2b6e86;padding:3px}

#login_bar_title {text-decoration-line:none;color:white;font-size: 15px;font-weight:545;}

#writename {font-size: 15px;margin-bottom:20px;}
.logged_item {font-size: 15px;color: black;text-decoration-line: none;padding-left:6px;font-weight:545;}
button.logged_item {background-color: transparent; color: black; border: none;
padding-left:6px; margin: 0; font-family: inherit; line-height: normal; appearance: none; -webkit-appearance: none; -moz-appearance: none;}

#aside_newmenu_title {display: block; margin-left: 5px;}
.aside_newmenu_hide {
  display: none;list-style: none; margin-left: 10px; padding-left: 0;}

.aside_newmenu_hide.is-open {
  display: block;}

.aside_newmenu_title {
  cursor: pointer; user-select: none; font-weight: bold;}

.aside_newmenu_hide li {
  margin: 4px 0;}

.aside_newmenu_hide li a {
  color: #333;  text-decoration: none;}

.aside_newmenu_hide li a:hover {
  color: #385998;  font-weight: bold;}

#new_growth, #new_vaccination {font-size: 13px;color: black;border:0;outline:0;cursor:pointer;background-color:#F7FAFC;font-weight:545;}
#new_growth:hover, #new_vaccination:hover {font-size: 14px;font-weight:bold}
#aside_newmenu_title, #newdata, #recall, #compare{font-size: 15px;color: black;border:0;outline:0;cursor:pointer;background-color:#F7FAFC;font-weight:545;}
#import,#growth_pct,#sign_up, #id_find, #pw_find,#compare,#boneage, #vaccination
    {font-size: 15px;color: black;text-decoration-line: none;padding-left:6px;font-weight:540;}
.logged_item:hover,#newdata:hover,#recall:hover,#import:hover,#growth_pct:hover,#vaccination:hover,#sign_up:hover, #id_find:hover, #pw_find:hover,#compare:hover,#development_link_title:hover
    {font-size: 16px;font-weight:bold}
#scrolltop {background: #f8d7da; border-color:#f8d7da; color: #721c24; font-size:16px;}
#aside_hr{border:0;height:1px;background:#aaa}
#development_link_title {padding: 1px 6px;font-size: 15px;color: black;border:0;outline:0;cursor:pointer;font-weight:545;}
.development_link_hide {display:none;} 
#KDST,#CDC {cursor:pointer; font-size: 12.5px; padding-left: 6px;color: black;text-decoration-line: none;}
#KDST:hover,#CDC:hover {font-size: 13px;font-weight:bold}
#page_title, #page_title_1,#page_title_2,#report_title {text-align:center; margin-top:10px; font-size: 25px;}
#report_title {display:none}

#vaccination_tab, #growth_tab {
  display: block; margin-left: auto; background-color: #385998;color: white;
  border: none; padding: 6px 12px; border-radius: 6px; cursor: pointer;}

#vaccination_tab:hover,#growth_tab:hover  { background-color: #2d4c7c;}

#calc {width:1520px;background-color:white;
padding:10px;margin:5px 0px 5px 0px;}

#customAlert {display: none;position: fixed;top: 500px;left: 50%;transform: translate(-50%,-50%);
              background: #f8d7da; color: #721c24;padding: 10px 20px; border: 1px solid #f5c6cb;
              border-radius: 5px; font-size: 16px;z-index: 1000;}

#item_select_box *{vertical-align:top;}

/*#column_select_box {margin-top:25px;margin-bottom:10px;}*/
#column_select_box {display: inline-block;}
/*#column_select_box_exe{display: flex;flex-direction:row;}*/
#column_select_box_input, #column_select_box_output, #column_select_box_option{margin-bottom:1px;}
/*#del_sel,#memo_sel {margin-left: 52px;margin-bottom:3px;}*/
.check_one_title {display:inline-block;width:50px;font-size: 14px;font-weight: bold;} 
.check_one, .check_one_HC, .check_one_BMI,.check_one_WFH,.check_one_BA,.check_one_BACA,.check_one_GV,.check_one_PAH, .check_one_title  {font-size: 12px;}
#column_sel,#item_sel,#hide_sel_box,#hide_sel_box_1 {font-size: 12px;}
#show_hide_sel_box {display: inline-block;margin-bottom: 20px;}
#sel_box_button {margin-top: 10px;}

/*id=patient_data 시작*/
#patient_data {margin-bottom:15px;}
#new_name_title,#new_sex_title,#new_bir_title,#new_remark_title,#new_term_title,#new_sel_title, #calculator
{display:inline-block;font-size:15px;font-weight:bold;width:95px}

#MPH {margin-bottom:2px}
#MPH_find {display:inline-block;font-size:15px;font-weight:bold;width:95px}
#father_ht, #mother_ht
{display:inline-block;font-size:14px;font-weight:bold;width:45px;}
#abbr {font-size:15px;margin-top:0px;}

/*#patient_memo {display:flex; align-items:baseline;width:500px;}*/
#new_memo_title {display: inline-block; font-size: 15px; font-weight: bold;width: 95px;vertical-align: top;}
/*#new_memo {resize: both; overflow-y: auto; min-height: 10px;} */


/*#MPH_find{margin-bottom: 5px;}*/


#input_father_ht, #input_mother_ht {text-align:center;width:52px;font-size:13px;}
#input_MPH  {text-align:center;width:62px;font-size:13px;}
/*#patient_memo *{vertical-align: middle; margin-bottom:10px;}*/
/*#patient_memo {vertical-align: middle; margin-bottom:10px;display: flex; width: 800px;}*/
#bir_input {font-size: 12.5px;padding:0px 5px}
#new_name {text-align:center;width:130px}
#new_sex,#new_term {text-align:center;width:138px}
#new_bir {text-align: center;width:132px}
#term_explain {font-size:13px;}
#new_line_1,#new_line_2 {height:25px;vertical-align:bottom}
#preterm_select {margin-bottom:10px;}
#due_date_sel,#GA_sel {margin-left:5px;margin-top:5px;margin-bottom:5px}
#new_due_title,#new_GA_title 
{display:inline-block;font-size:13px;font-weight:bold;width:90px;margin-top:3px;margin-bottom:3px;}
#new_due {font-size:13px}
#new_GA_week, #new_GA_day {text-align:center; width:40px;font-size:12px}
.jaturi {font-size:13px}
#due_add,#GA_add {font-size:13px}
/*id=patient_data 끝*/

/*id=option 시작*/
#option1 {margin-top:20px;margin-bottom: 10px}
#new_line {font-size:14px;padding-top:2px;padding-bottom: 2px;}
#clear_input {margin-right:8px;}
#report {margin-right:8px;}
#day_corr,#toggle_off,#toggle_on { font-size: 14px;}
#clear_input{margin-right:8px;}
#day_corr_element {display:inline-block;margin-top:2px}
.switch {position: relative;display: inline-block;
    width: 45px;height: 20px;vertical-align:middle;}
.switch input { display: none; /* 기본 체크박스 숨기기 */}
.slider {position: absolute;cursor: pointer;top: 0;left: 0;right: 0;bottom: 0;
    background-color: #ccc;transition: 0.1s;border-radius: 34px;}
.slider:before {position: absolute;content: "";height: 16px;width: 16px;
    left: 2px;Right: 2px;bottom: 2px;background-color: white;
    transition: 0.2s;border-radius: 50%;}
input:checked + .slider {background-color: #2196F3;}
input:checked + .slider:before {transform: translateX(26px);}
/*id=option 끝*/        


/*id=inout 시작*/
#inout {display:flex;flex-wrap: wrap;}
#in,#out,#blank_1,#blank_2,#blank_3,#select_1,#select_2{margin-bottom: 15px;}

#input_title {border-bottom: 1px solid;font-size:15px}
#input_item {font-size: 14px;}
.input_row {font-size:14px;height:28px}
.input_date_th {width:127px;text-align:center}
.input_ht_th {width:43px;text-align:center}
.input_wt_th {width:43px;text-align:center}
.input_head_th {width:63px;text-align:center}
.input_bmi_th {width:73px;text-align:center}
.input_ba_th {width:68px;text-align:center}
.input_baca_th {width:50px;text-align:center}
.input_gv_th {width:50px;text-align:center}

.input_date {width:122px;text-align:center;color:black}
.input_ht {width:35px;text-align:center;color:black}
.input_wt {width:35px;text-align:center;color:black}
.input_head {width:55px;text-align:center;color:black}
.input_bmi {width:65px;text-align:center;color:black}
.input_ba {width:60px;text-align:center;color:black}
.input_baca {width:50px;text-align:center;color:black}
.input_gv {width:50px;text-align:center;color:black}

#interval,#interval_1,#interval_2 {font-size:16px;height:16px}

#blank_1,#select_1 {display:none}

#output_title {border-bottom: 1px solid;font-size:15px}
#output_item {font-size:14px;text-align:center;color:black;}
.output_row {font-size:14px;height:28px}
.output_age_th {width:93px;text-align:center}
/*.output_ht_th {width:53px;text-align:center}
.output_wt_th {width:53px;text-align:center}*/
.output_ht_th {width:60px;text-align:center}
.output_wt_th {width:60px;text-align:center}
.output_head_th {width:63px;text-align:center}
.output_wfh_th {width:93px;text-align:center}
.output_lwt_th {width:53px;text-align:center}
.output_owt_th {width:53px;text-align:center}
.output_ob_th {width:53px;text-align:center}
.output_bmi_th {width:73px;text-align:center}
.output_PAH_th {width:73px;text-align:center}

.output_age {width:88px;text-align:center;color:blue}
/*.output_ht {width:45px;text-align:center;color:blue}
.output_wt {width:45px;text-align:center;color:blue}*/
.output_ht {width:50px;text-align:center;color:blue}
.output_wt {width:50px;text-align:center;color:blue}
.output_lwt,.output_owt,.output_ob {width:45px;text-align:center;color:blue}
.output_head {width:55px;text-align:center;color:blue}
.output_wfh {width:85px;text-align:center;color:blue}
.output_bmi {width:65px;text-align:center;color:blue}
.output_PAH {width:55px;text-align:center;color:blue}
/*id=inout 끝*/

/*id=memo 시작*/
#memo_title {border-bottom: 1px solid;font-size:15px; text-align: center;}
#memo_item {font-size: 14px;}
.memo_row {font-size:14px;height:28px}
.memo_content,.remark_content {width:230px;text-align:center;font-weight: 500}
.memo_limit {width:15px;text-align:center;font-size:14px;border:none;font-weight:50;}
.twenty {font-size: 14px;}
#size {font-size:12px;padding-top:0px;padding-bottom:0px;
    margin-top: -2px;background-color:#b22222;border-color:#b22222;}
/*id=memo 끝*/

/*id=select 시작*/
#select_title_1,#select_title_2 {border-bottom: 1px solid;font-size:15px;width:92px;}
#select_item_1,#select_item_2 {font-size: 14px;text-align: center}
.select_row {font-size:14px;height:28px}
.selectbox {border:1px solid black;width:45px;height:20px;}
/*id=select 끝*/

#reference {text-align: center;font-size:15px;font-weight:bold}

/*계산기 관련 CSS 시작*/
/*#calculator {
            width: 10%;
            border: 1px solid black;
            margin-left: auto;
            margin-right: auto;
        }*/
  
        #cal_btn {
            width: 100%;
/*            padding: 20px 40px;*/
            padding: 10px 20px;
            background-color: #004c63;
            color: white;
            font-size: 24px;
            font-weight: bold;
            border: none;
            border-radius: 5px;
        }
  
        .cal_txt {
/*            padding: 20px 30px;*/
            padding: 3px 20px;
            font-size: 15px;
            font-weight: bold;
            border: none;
            border-radius: 5px;
            border: 2px black solid;
        }
/*계산기 관련 CSS 끝*/

#comment {display:none}
#report_comment {display: inline-block; font-size: 15px; font-weight: bold;width: 95px;vertical-align: top;}

#show_hide_sel_box {margin-bottom:20px;}
/*id=graph_checkbox 시작*/
#graph_checkbox {margin-top:20px;font-size:12px;}
#graph_button {margin-bottom:5px;}
#graph_sel,#del_graph {font-size:10px;}
/*id=graph_checkbox 끝*/

/*#unit_change{font-size:13px;margin-top:0px}*/
#unit_change_title,#x_axis_max_title {font-size:13px;margin-top:5px;}
#bottom {margin: 10px;padding: 10px 0;color:#F7FAFC;background-color:#004c63;text-align: center;}

.chart{overflow: hidden;resize: both;}

#chart {display: flex;flex-direction: column;}
#print_chart {display:none}

@media (max-width:2000px) {

    #container {width:auto;margin:10px 10px 10px 10px;}
    #wrapper {width:auto;display: flex;justify-content: center;flex-wrap:nowrap;flex-grow:1;flow-shrink:1} 
    #aside_1,#aside_2 {padding:10px;background-color:#F7FAFC;font-size:14px;flex-basis:160px;flex-grow:0;flex-shrink:0;}
/*    #calc {width:auto;background-color:white;padding:10px;margin:5px 0px 5px 0px;}*/
    #calc {background-color:white;padding:10px;margin:5px 0px 5px 0px;}
/*    #customAlert {display: none;position: fixed;top: 20px;left: 90%;transform: translateX(-50%);
              background: #f8d7da; color: #721c24;padding: 5px 10px; border: 1px solid #f5c6cb;
              border-radius: 3px; font-size: 14px;z-index: 1000;"}*/
    #inout {display: flex;flex-direction:row;flex-wrap: wrap;}
    #column_select_box_exe{display: flex;flex-direction:row;flex-wrap: wrap;}  
    #reference {text-align: right;}
}  


@media (max-width:1000px) {
    #top {padding: 18px 0;}

    #title {font-size: 20px;}
    #container {margin:0px 5px 0px 5px;}
    #wrapper {display: flex;flex-direction:column;}   
    #aside_1 {display:none;}

    #upperbar_1 {display:flex;justify-content:space-around;}   
    #login_bar_small {width:100px;background-color: #3b8098;border-color: #2b6e86;padding:1px;font-size:14px;font-weight:bold}
    #auth_menu_title,#growth_pct{cursor:pointer; font-size: 15px;font-weight:bold}
    #login_bar_small:hover,#auth_menu_title:hover,#growth_pct:hover 
    {font-weight:bold;font-size: 16px;} 

    #sign_up_small,#id_find_small,#pw_find_small {font-size:14px;text-decoration-line: none;} 
    #sign_up_small:hover,#id_find_small:hover,#pw_find_small:hover   
    {font-weight:bold;font-size: 15px;}      
    #auth_form_small {width:150px;text-align:center;}
    .hide {display:none;} 
    #calc {width:auto;}  
/*    #customAlert {display: none;position: fixed;top: 10px;left: 90%;transform: translateX(-50%);
              background: #f8d7da; color: #721c24;padding: 3px 5px; border: 1px solid #f5c6cb;
              border-radius: 2px; font-size: 12px;z-index: 1000;"}*/

    .logged_item,#writename_small {text-decoration-line: none;color:black;} /*logged_item:myinfo,로그아웃으로 연결되는 class  */
    #writename_small,.logged_item,#function_menu_title,#development_link_title {cursor:pointer; font-size: 15px;font-weight:bold}
    #writename_small:hover,.logged_item:hover, #function_menu_title:hover,#development_link_title:hover {font-weight:bold;font-size: 16px;} 
    .function_menu_hide {display:none;}    
    /*#newdata_small,#recall_small,#import_small,#compare_small {font-size:14px;}    
    #newdata_small {cursor:pointer;color:purple}    
    #recall_small,#import_small,#compare_small {text-decoration-line: none;} */
    #newdata_small,#recall_small,#import_small,#compare_small {font-size:14px;text-decoration-line: none;cursor:pointer;color:purple}    
    #newdata_small:hover,#recall_small:hover,#import_small:hover,#compare_small:hover {font-weight:bold;font-size: 15px;}

    #preterm_select {display: flex;flex-direction:row;flex-wrap: wrap;}
    #new_term_title {margin-right:4px;}
    #term_explain {margin-top:2px}    
/*    #day_corr_element{margin-left:10px;}*/

    #new_name_title,#new_sex_title,#new_bir_title,#new_remark_title,#new_term_title,#new_sel_title,#calculator, #new_memo_title
    {display:inline-block;font-size:14px;font-weight:bold;width:75px}

    #MPH_find {display:inline-block;font-size:14px;font-weight:bold;width:75px}
    #father_ht, #mother_ht {display:inline-block;font-size:13px;font-weight:bold;width:40px;}
    #page_title, #page_title_1,#page_title_2  {text-align:center;font-size:20px;} 
    #day_corr,#toggle_off,#toggle_on { font-size: 12px;}
    #column_select_box_exe{display: flex;flex-direction:row;flex-wrap:wrap;}
    #inout{display: flex;flex-direction:row;flex-wrap: wrap;}
    #blank_1,#select_1 {display:block}
    #blank_2,#blank_3,#select_2 {display:none}
    
    .input_date {width:110px;text-align:center;font-size:12px}
    .input_ht  {width:32px;text-align:center;font-size:12px}
    .input_wt {width:32px;text-align:center;font-size:12px}
    .input_head {width:45px;text-align:center;font-size:12px}
    .input_bmi {width:60px;text-align:center;font-size:12px}
    .input_ba {width:55px;text-align:center;font-size:12px}

    .input_date_th {width:115px;text-align:center;font-size:12px}
    .input_ht_th  {width:40px;text-align:center;font-size:12px}
    .input_wt_th {width:40px;text-align:center;font-size:12px}
    .input_head_th {width:53px;text-align:center;font-size:12px}
    .input_bmi_th {width:68px;text-align:center;font-size:12px}
    .input_owt_th {width:40px;text-align:center;font-size:12px}    
    .input_ob_th {width:40px;text-align:center;font-size:12px}
    .input_ba_th {width:63px;text-align:center;font-size:12px}

    .output_age_th {width:88px;text-align:center;color:black;font-size:12px}
    .output_ht_th {width:48px;text-align:center;color:black;font-size:12px}
    .output_wt_th {width:48px;text-align:center;color:black;font-size:12px}
    .output_owt_th {width:48px;text-align:center;color:black;font-size:12px}
    .output_ob_th {width:48px;text-align:center;color:black;font-size:12px}
    .output_head_th {width:58px;text-align:center;color:black;font-size:12px}
    .output_wfh_th {width:88px;text-align:center;color:black;font-size:12px}
    .output_bmi_th {width:73px;text-align:center;color:black;font-size:12px}
    .output_age {width:80px;text-align:center;color:blue;font-size:12px}
    .output_ht {width:40px;text-align:center;color:blue;font-size:12px}
    .output_wt {width:40px;text-align:center;color:blue;font-size:12px}
    .output_head {width:50px;text-align:center;color:blue;font-size:12px}
    .output_wfh {width:80px;text-align:center;color:blue;font-size:12px}
    .output_bmi {width:65px;text-align:center;color:blue;font-size:12px}    
    .output_owt,.output_ob {width:40px;text-align:center;color:red;font-size:12px}

    .yorn {width:40px;font-size:12px;}
    .dele {width:40px;font-size:12px;}
    .selectbox {width:47px;height:20px;font-size:12px;}
    .option_yes,.option_no {font-size:11px;}
    .del_button {font-size: 11px;}
    #graph_sel,#del_graph {font-size:9px;}


    #calc {background-color:white;margin:5px 0px;padding:10px 3px;}    
    #main_part {display:flex;flex-direction:row;justify-content:space-around;}
    #main_part_center {flex-shrink:0;flex-grow:0;}
    #main_part_left,#main_part_right {flex-basis:20px;flex-shrink:1;flex-grow:1;}
    #reference {font-size:14px;}
    #graph_checkbox {margin-top:10px;font-size:11px;}
    #unit_change {display: flex;flex-direction:row;flex-wrap: wrap;}
    #aside_2 {flex-basis:100px;background-color:brown;margin:5px 5px;}
}

@media print {
/*    #print_chart { page-break-inside:avoid; page-break-after:auto }*/
    #print_height_chart { page-break-inside:avoid; page-break-after:auto }
    #print_weight_chart { page-break-inside:avoid; page-break-after:auto }
    #print_HC_chart { page-break-inside:avoid; page-break-after:auto }
    #print_BMI_chart { page-break-inside:avoid; page-break-after:auto }
    #print_WFH_chart { page-break-inside:avoid; page-break-after:auto }

    #upperbar_1{display:none}
    #top{display:none}
    #page_title, #page_title_1, #page_title_2 {display:none}
    #report_title {display:block}
    #aside_1{display:none}
    #aside_2{display:none}
    #term_explain {display:none}
    #abbr {display:none}
    #new_remark_title,#memo_0,#limit_0,.twenty {display:none}
    #new_memo_title,#new_memo {display:none}
    #item_select_box {display:none}
    #option1,#option2 {display:none}
    #reference{display:none}
    input,select,button {border:none}
    #size {display:none;width:0px}
    .memo_limit, .twenty {display:none;width:0px}
    .calculator_div {display: none}
    #graph_checkbox {display: none}

    #unit_change {display: none}
    #bottom {display: none}
    #chart {display:none}
    #report {display:none}
    #toggleModal {display:none}


}