/*pc*/
@media all and (min-width:1024px) {	   
    
    /*필수*/
    i.required{font-size:24px;color:#003586;margin-right:5px}
    
    /*input*/    
    .s_board input::placeholder{color:#bababa}
    .s_board input[type=text],
    .s_board input[type=password],
    .s_board input[type=submit],
    .s_board input[type=date],
    .s_board select{height:48px;line-height:48px;padding:0 15px;border:1px solid #ddd;border-radius:5px;font-size:16px;color:#777}
    .s_board input[type=submit]{background:#707070;color:#fff;padding:0 25px}
    
    .s_board input[type=text]:focus,
    .s_board input[type=password]:focus,
    .s_board input[type=submit]:focus,
    .s_board input[type=date]:focus,
    .s_board select:focus{outline:none !important;border:1px solid #083D89}

    .s_board input[type=checkbox]{display:none}
    .s_board input[type=checkbox] + label{margin-right:15px}
    .s_board input[type=checkbox] + label:before{display:inline-block;content:'';vertical-align:middle;width:30px;height:30px;border:1px solid #ddd;border-radius:6px;cursor:pointer;margin-right:5px;overflow:hidden}
    .s_board input[type=checkbox]:hover + label:before{border:1px solid #083D89}
    .s_board input[type=checkbox]:checked +label:before{background:url(../images/form/checkbox_on.png) no-repeat center /cover;border:1px solid #083D89}
    
    .s_board input[type=radio]{display:none}
    .s_board input[type=radio] + label{margin-right:15px}
    .s_board input[type=radio] + label:before{display:inline-block;content:'';vertical-align:middle;width:30px;height:30px;border:1px solid #ddd;border-radius:50%;margin-right:5px;cursor:pointer;overflow:hidden}
    .s_board input[type=radio]:hover + label:before{border:1px solid #083D89}
    .s_board input[type=radio]:checked +label:before{background:url(../images/form/radio_on.png) no-repeat center /cover;border:1px solid #083D89}

    
    /*select-custom*/
    .s_board .select-custom {display:inline-block;position:relative;z-index:10;width:140px}
    .s_board .select-custom.on .label:after{transform:rotate(180deg)}
    .s_board .select-custom.on .option{display:block}
    .s_board .select-custom:hover .label{border:1px solid #083D89}
    .s_board  .select-custom .label{display:flex;justify-content: space-between; align-items:center;font-size:16px;width:100%;height:48px;line-height:48px;padding:0 15px;outline:0;border:1px solid #ddd;border-radius:5px;cursor:pointer;text-align:left;background:#fff;color:#777}
    .s_board .select-custom .label:after{display:block;content:'';;width:12px;height:20px;background:url(../images/form/select_arrow.png) no-repeat center;transition:0.3s}
    .s_board .select-custom .option {display:none;position: absolute;left:0;top:48px;width:100%;background:#fff;border:1px solid #ddd;border-top:0;border-radius:0 0 5px 5px;padding:10px 8px;box-shadow:0 5px 5px rgba(0,0,0,0.1)}
    .s_board .select-custom .option li {font-size:16px;color:#777;line-height:38px;padding:0 7px;border-radius:5px;cursor:pointer;white-space:nowrap;text-overflow: ellipsis;overflow: hidden}
    .s_board .select-custom .option li:hover {background:#F5F9FF;color:#083D89}


    
    /*table-style*/
    .table-style01{margin:20px 0}
    .table-style01 table{width:100%;border-collapse: collapse;border-top:1px solid #888;border-left:hidden;border-right:hidden}
    .table-style01 tr:hover{background:#fafafa}
    .table-style01 th,
    .table-style01 td{border-bottom:1px solid #ddd;padding:18px 10px;text-align:center}
    .table-style01 th{background:#f9f9f9}
    .table-style01 .cate{}
    .table-style01 .cate span{display:inline-block;line-height:28px;width:80px;text-align:center;font-size:16px;color:#fff;font-weight:600;background:#ddd}
    .table-style01 .cate .c1{background:#1696F6}
    .table-style01 .cate .c2{background:#0070C4}
    .table-style01 .cate .c3{background:#ddd;color:#333}
    .table-style01 .subject{text-align:left}
    .table-style01 .subject a{color:#333}
    .table-style01 .name{color:#222}
    .table-style01 .date{position:relative;color:#999;letter-spacing: 0}
    .table-style01 .date:before{display:block;content:'';position:absolute;width:1px;height:15px;background:#ddd;left:0;top:50%;transform:translateY(-50%)}
    
    
    .table-style02{margin:20px 0}
    .table-style02 table{width:100%;border-collapse: collapse;border-top:2px solid #888;border-left:hidden;border-right:hidden}
    .table-style02 tr:hover{background:#fafafa}
    .table-style02 th,
    .table-style02 td{border-bottom:1px solid #ddd;padding:25px 10px;text-align:center}
    .table-style02 th{background:#f9f9f9}
    .table-style02 .num{font-size:22px}
    .table-style02 .cont{text-align:left}
    .table-style02 .subject a{font-size:22px;color:#333;line-height:1.5}
    .table-style02 .info{font-size:18px;color:#999;margin-top:20px}
    .table-style02 .more{text-align:right;padding-right:0}
    .table-style02 .more a{display:inline-block;width:160px;line-height:50px;border:1px solid #ddd;border-radius:5px;font-size:16px;text-align:center;background:#fff}
    .table-style02 .more a:hover{border:1px solid var(--base-color)}
    
    .table-style03{margin:20px 0}
    .table-style03 table{width:100%;border-collapse: collapse;border-top:2px solid var(--base-color);border-left:hidden;border-right:hidden}
    .table-style03 tr:hover{background:#fafafa}
    .table-style03 th,
    .table-style03 td{border:1px solid #ddd;padding:18px 10px;text-align:center}
    .table-style03 th{background:#f9f9f9}
    
    .table-style04{position:relative}
    .table-style04:before{display:block;position:absolute;content:'';left:0px;top:0px;width:100%;height:5px;;background:#fff}
    .table-style04:after{display:block;position:absolute;content:'';left:0px;top:0px;width:calc(100% - 2px);height:5px;background:#F9FAFB;border:1px solid #aaa;border-bottom:0;border-radius:5px 5px 0 0}
    .table-style04 table {margin:20px 0;width:100%;border-collapse: collapse;line-height:1.5}    
    .table-style04 thead tr{border:1px solid #aaa;background:#F9FAFB}
    .table-style04 thead th{padding:15px 10px;font-size:17px}
    .table-style04 tbody tr:hover{background:#fafafa}
    .table-style04 tbody td{border-bottom:1px solid #ddd;padding:15px 10px;text-align:center;font-size:16px}
    .table-style04 tbody .cont{text-align:left}
    
    

    .s_board .subscription_area{display:flex;align-items:center; border:2px dashed #ddd;padding:40px 50px;margin:50px 0}
    .s_board .subscription_area .info{flex:1;font-size:20px;color:#111;font-weight:600}
    .s_board .subscription_area a{display:block;width:160px;line-height:48px;background:#03156B;font-size:16px;color:#fff;;border-radius:5px;text-align:center}
    
    .s_board .search_area{display:flex;justify-content: space-between;align-items:center;margin:20px 0}
    .s_board .search_area .info{font-size:20px;color:#777}
    .s_board .search_area .info em{color:#000;}    
    
    
    /*paging-style*/
    .paging-style01{margin:50px 0}
    .paging-style01,
    .paging-style01 > span{display:flex;justify-content:center;align-items:center;gap:3px}
    .paging-style01 .prevG{text-indent:-9999px;background:url(../images/form/prevG.png) no-repeat center} 
    .paging-style01 .prevG:hover{background:url(../images/form/prevG_on.png) no-repeat center} 
    .paging-style01 .prev{text-indent:-9999px;background:url(../images/form/prev.png) no-repeat center} 
    .paging-style01 .prev:hover{background:url(../images/form/prev_on.png) no-repeat center} 
    .paging-style01 .nextG{text-indent:-9999px;background:url(../images/form/nextG.png) no-repeat center} 
    .paging-style01 .nextG:hover{background:url(../images/form/nextG_on.png) no-repeat center} 
    .paging-style01 .next{text-indent:-9999px;background:url(../images/form/next.png) no-repeat center} 
    .paging-style01 .next:hover{background:url(../images/form/next_on.png) no-repeat center} 
    .paging-style01 a{display:inline-block;min-width:32px;height:32px;line-height:30px;border:1px solid #ddd;font-size:13px;color:#999;text-align:center;padding:0 5px}
    .paging-style01 a:hover{border:1px solid #004887;color:#004887}
    .paging-style01 a.on{border:1px solid #004887;background:#004887;color:#fff}
    
    
    /*button style*/
    button{cursor:pointer}
    .btn-large,
    .btn-mid,
    .btn-small{display:inline-block;border:1px solid #ddd;outline:0;background:#fff;cursor:pointer}
    
    .btn-large{min-width:250px;height:70px;line-height:68px;font-size:20px}    
    .btn-mid{min-width:200px;height:56px;line-height:54px;font-size:18px}    
    .btn-small{min-width:160px;height:48px;line-height:46px;font-size:16px}
    .btn-xsmall{min-width:100px;height:48px;line-height:46px;font-size:16px}

    
    .btn-line{border:1px solid #ddd;color:#767676;border-radius:5px;background:#fff;text-align:center}
    .btn-line:hover{border:1px solid #083D89;color:#083D89}
    
    .btn-fill{border:1px solid #083D89;background:#083D89;border-radius:5px;color:#fff;text-align:center}
    .btn-fill:hover{border:1px solid #152C4B;background:#152C4B;}    
    
    .btn-line-fill{border:1px solid #083D89;color:#083D89;border-radius:5px;background:#fff;text-align:center}
    .btn-line-fill:hover{border:1px solid #083D89;color:#fff;background:#083D89}
    
}

    



/*mobile*/
@media all and (max-width:1023px) {
    
    /*필수*/
    i.required{font-size:16px;color:#003586}
    
    
    /*input*/    
    .s_board input::placeholder{color:#bababa}
    .s_board input[type=text],
    .s_board input[type=password],
    .s_board input[type=submit],
    .s_board input[type=date],
    .s_board select{height:30px;line-height:30px;padding:0 10px;border:1px solid #ddd;border-radius:5px;font-size:12px;color:#777}
    .s_board input:focus{border:1px solid #083D89}
    .s_board input[type=submit]{background:#707070;color:#fff;padding:0 15px}
    
    .s_board input[type=text]:focus,
    .s_board input[type=password]:focus,
    .s_board input[type=submit]:focus,
    .s_board input[type=date]:focus,
    .s_board select:focus{outline:none !important;border:1px solid #083D89}
    
    /*check & radio*/
    .s_board input[type=checkbox]{display:none}
    .s_board input[type=checkbox] + label{margin-right:10px}
    .s_board input[type=checkbox] + label:before{display:inline-block;content:'';vertical-align:middle;width:20px;height:20px;border:1px solid #ddd;border-radius:4px;margin-right:5px;cursor:pointer;overflow:hidden}
    .s_board input[type=checkbox]:hover + label:before{border:1px solid #083D89}
    .s_board input[type=checkbox]:checked +label:before{background:url(../images/form/checkbox_on.png) no-repeat center /cover;border:1px solid #083D89}
    
    .s_board input[type=radio]{display:none}
    .s_board input[type=radio] + label{margin-right:10px}
    .s_board input[type=radio] + label:before{display:inline-block;content:'';vertical-align:middle;width:20px;height:20px;border:1px solid #ddd;border-radius:50%;margin-right:5px;cursor:pointer;overflow:hidden}
    .s_board input[type=radio]:hover + label:before{border:1px solid #083D89}
    .s_board input[type=radio]:checked +label:before{background:url(../images/form/radio_on.png) no-repeat center /cover;border:1px solid #083D89}
    
    
    
    /*select-custom*/
    .s_board .select-custom {display:inline-block;position:relative;z-index:10;width:100px}
    .s_board .select-custom.w100{width:80px}
    .s_board .select-custom.w200{width:120px}
    .s_board .select-custom.w300{width:200px}
    .s_board .select-custom.on .label:after{transform:rotate(180deg)}
    .s_board .select-custom.on .option{display:block}
    .s_board .select-custom:hover .label{border:1px solid #083D89}
    .s_board  .select-custom .label{display:flex;justify-content: space-between; align-items:center;font-size:13px;width:100%;height:30px;line-height:30px;padding:0 10px;outline:0;border:1px solid #ddd;border-radius:5px;cursor:pointer;text-align:left;background:#fff;color:#777}
    .s_board .select-custom .label:after{display:block;content:'';;width:12px;height:30px;background:url(../images/form/select_arrow.png) no-repeat center / 8px;transition:0.3s}
    .s_board .select-custom .option {display:none;position: absolute;left:0;top:30px;width:100%;background:#fff;border:1px solid #ddd;border-top:0;border-radius:0 0 5px 5px;padding:10px 5px;box-shadow:0 5px 5px rgba(0,0,0,0.1)}
    .s_board .select-custom .option li {font-size:13px;color:#777;line-height:26px;padding:0 5px;border-radius:5px;cursor:pointer;white-space:nowrap;text-overflow: ellipsis;overflow: hidden}
    .s_board .select-custom .option li:hover {background:#F5F9FF;color:#083D89}


    
    /*table-style*/
    .table-style01{margin:20px 0;}
    .table-style01 table{width:100%;border-collapse: collapse;border-top:2px solid #888;border-left:hidden;border-right:hidden}
    .table-style01 tr:hover{background:#fafafa}
    .table-style01 th,
    .table-style01 td{border-bottom:1px solid #ddd;padding:10px 5px;text-align:center}
    .table-style01 th{background:#f9f9f9}
    .table-style01 .cate{}
    .table-style01 .cate span{display:inline-block;line-height:20px;width:50px;text-align:center;font-size:12px;color:#fff;font-weight:600;background:#ddd}
    .table-style01 .cate .c1{background:#1696F6}
    .table-style01 .cate .c2{background:#0070C4}
    .table-style01 .cate .c3{background:#ddd;color:#333}
    .table-style01 .subject{text-align:left}
    .table-style01 .subject a{color:#333}
    .table-style01 .name{color:#222}
    .table-style01 .date{position:relative;color:#999;letter-spacing: 0}
    .table-style01 .date:before{display:block;content:'';position:absolute;width:1px;height:15px;background:#ddd;left:0;top:50%;transform:translateY(-50%)}
    
    
    .table-style02{margin:20px 0}
    .table-style02 table{width:100%;border-collapse: collapse;border-top:2px solid #888;border-left:hidden;border-right:hidden}
    .table-style02 tr:hover{background:#fafafa}
    .table-style02 th,
    .table-style02 td{border-bottom:1px solid #ddd;padding:15px 5px;text-align:center}
    .table-style02 th{background:#f9f9f9}
    .table-style02 .num{font-size:16px}
    .table-style02 .cont{text-align:left}
    .table-style02 .subject a{font-size:14px;color:#333;line-height:1.5}
    .table-style02 .info{font-size:13px;color:#999;margin-top:10px}
    .table-style02 .more{text-align:right;padding-right:0}
    .table-style02 .more a{display:inline-block;width:100px;line-height:30px;border:1px solid #ddd;border-radius:5px;font-size:13px;text-align:center;background:#fff}
    .table-style02 .more a:hover{border:1px solid var(--base-color)}
    
    
    
    .table-style03{margin:20px 0}
    .table-style03 table{width:100%;border-collapse: collapse;border-top:2px solid var(--base-color);border-left:hidden;border-right:hidden}
    .table-style03 tr:hover{background:#fafafa}
    .table-style03 th,
    .table-style03 td{border:1px solid #ddd;padding:10px 5px;text-align:center}
    .table-style03 th{background:#f9f9f9}
    

    .table-style04 {margin:20px 0}
    .table-style04 table{width:100%;border-collapse: collapse;line-height:1.5}
    .table-style04 thead{border:1px solid #aaa;background:#F9FAFB}
    .table-style04 thead th{padding:10px 5px;font-size:13px}
    .table-style04 tbody tr:hover{background:#fafafa}
    .table-style04 tbody td{border-bottom:1px solid #ddd;padding:10px 5px;text-align:center;font-size:13px}
    .table-style04 tbody .cont{text-align:left}
    
    

    .s_board .subscription_area{display:flex;align-items:center; border:2px dashed #ddd;padding:40px 50px;margin:50px 0}
    .s_board .subscription_area .info{flex:1;font-size:20px;color:#111;font-weight:600}
    .s_board .subscription_area a{display:block;width:160px;line-height:48px;background:#03156B;font-size:16px;color:#fff;border-radius:5px;text-align:center}
    
    .s_board .search_area{display:flex;justify-content: space-between;align-items:center;margin:20px 0}
    .s_board .search_area .info{font-size:20px;color:#777}
    .s_board .search_area .info em{color:#000;}    
    
    
    /*paging-style*/
    .paging-style01{margin:50px 0}
    .paging-style01,
    .paging-style01 > span{display:flex;justify-content:center;align-items:center;gap:3px}
    .paging-style01 .prevG{text-indent:-9999px;background:url(../images/form/prevG.png) no-repeat center} 
    .paging-style01 .prevG:hover{background:url(../images/form/prevG_on.png) no-repeat center} 
    .paging-style01 .prev{text-indent:-9999px;background:url(../images/form/prev.png) no-repeat center} 
    .paging-style01 .prev:hover{background:url(../images/form/prev_on.png) no-repeat center} 
    .paging-style01 .nextG{text-indent:-9999px;background:url(../images/form/nextG.png) no-repeat center} 
    .paging-style01 .nextG:hover{background:url(../images/form/nextG_on.png) no-repeat center} 
    .paging-style01 .next{text-indent:-9999px;background:url(../images/form/next.png) no-repeat center} 
    .paging-style01 .next:hover{background:url(../images/form/next_on.png) no-repeat center} 
    .paging-style01 a{display:inline-block;min-width:32px;height:32px;line-height:30px;border:1px solid #ddd;font-size:13px;color:#999;text-align:center;padding:0 5px}
    .paging-style01 a:hover{border:1px solid #004887;color:#004887}
    .paging-style01 a.on{border:1px solid #004887;background:#004887;color:#fff}
    
    
    /*button style*/
    .btn-large,
    .btn-mid,
    .btn-small{display:inline-block;border:1px solid #ddd;outline:0;border-radius:5px;background:#fff;cursor:pointer}
    
    .btn-large{min-width:180px;height:40px;line-height:40px;font-size:14px;color:#777}
    .btn-large:hover{border-color:#333;color:#111}
    
    .btn-mid{min-width:130px;height:36px;line-height:34px;font-size:13px;color:#777}
    .btn-mid:hover{border-color:#333;color:#111}
    
    .btn-small{min-width:100px;height:30px;line-height:28px;font-size:12px;color:#777}
    .btn-small:hover{border-color:#333;color:#111}
    
    .btn-line-01,
    .btn-line-02,
    .btn-line-03{display:inline-block;min-width:100px;height:30px;line-height:28px;border-radius:5px;background:#fff;font-size:12px;text-align:center}
    
    .btn-line-01{color:#777;border:1px solid #ddd}
    .btn-line-01:hover{background:#707070;color:#fff;border-color:#707070}
    
    .btn-line-02{color:#111;border:1px solid #111}
    .btn-line-02:hover{background:#083D89;color:#fff;border-color:#083D89}
    
    .btn-line-03{color:#03156B;border:1px solid #03156B}
    .btn-line-03:hover{background:#03156B;color:#fff;border-color:#03156B}

}