@charset "utf-8";

/* 전체 레이아웃 */
#wrap {}
#header {position:absolute; top:0; left:0; width:100%; height:auto; background:#f9f9f9; box-shadow:0 1px 2px 0 rgba(0,0,0,0.08); z-index:100}
#footer {clear:both; padding:50px 0; background:#333}
.topMenu {
    position: relative;max-width: 1400px;height: 40px;margin: 0 auto;padding: 0 50px;padding-top:13px;text-align:right;font-size:14px;font-weight:600;
}
/* 상단 영역 */
#header.scroll {position:fixed; left:0; width:100%; background:rgba(255,255,255,.8)}
#header .inner {position:relative; max-width:1400px; height:80px; margin:0 auto; padding:0 50px}
#header .inner:after {clear:both; display:block; content:''}
#header h1 {float:left; width:130px; padding-top:18px}
#header h1 img {display:block; width:100%}
#gnb_wrap {height:100%}
#gnb_wrap:after {clear:both; display:block; content:''}
#gnb_wrap a.gnb_top {display:none}
#gnb_wrap button {display:none}
#gnb {float:right; height:100%}
#gnb > li {position:relative; float:left; height:100%}
#gnb > li > a > span {position:relative; padding-bottom:10px}
#gnb > li > a > span:before {position:absolute; bottom:0; left:0; width:0; height:2px; content:''; background:#000; transition:all .4s ease}
#gnb > li:hover > a > span:before {width:100%}
/* 2023.01.18 #gnb > li > a {display:block; position:relative; padding:25px 25px 0 25px; height:100%; font-family:'Montserrat'; color:#444; transition:all .4s ease; z-index:50} */
#gnb > li > a {display:block; position:relative; padding:25px 15px 0 15px; height:100%; font-family:'Montserrat'; color:#444; transition:all .4s ease; z-index:50}
#gnb > li > ul.submnu {display:none; position:absolute; top:80px; left:0; min-width:160px; padding:20px 15px 30px 15px; background:#fff; box-shadow:0 2px 3px 0 rgba(0,0,0,.12); opacity:0; filter:alpha(opacity='0'); z-index:110}
#gnb > li.on > ul.submnu {display:block}
#gnb > li > ul.submnu li {position:relative; padding:5px 0; border-bottom:1px solid #eee}
#gnb > li > ul.submnu li:before {position:absolute; bottom:0; left:0; width:0; height:1px; content:''; background:#aaa; transition:all .3s ease}
#gnb > li > ul.submnu li:hover:before {width:100%}
#gnb > li > ul.submnu li:hover a{color:#333}
#gnb > li > ul.submnu li a {display:block; width:100%; height:100%; color:#888}
#btnNav {display:none; position:absolute; top:20px; right:50px; width:40px; height:40px; border:none; border-radius:2px; background:#333; cursor:pointer; z-index:1000}
#btnNav span {position:absolute; display:block; left:10px; width:20px; height:2px; background:#fff; transition:all .4s ease}
#btnNav span.bar1 {top:12px}
#btnNav span.bar2 {top:18px}
#btnNav span.bar3 {top:24px}
#btnNav.active span.bar1 {top:18px; transform:rotate(45deg)}
#btnNav.active span.bar2 {display:none}
#btnNav.active span.bar3 {top:18px; transform:rotate(-45deg)}
/* 상단 스크롤 버튼 */
#scrollTop {display:none; position:fixed; bottom:30px; /*left:0; width:100%; 2021.09.14*/ right:0; height:50px; z-index:100}
#scrollTop .inner {max-width:1400px; margin:0 auto; padding:0 30px; text-align:right}
#scrollTop .inner a {position:relative; display:inline-block; width:45px; height:45px; text-align:center; color:#fff; line-height:45px; border-radius:50%; background:#555}
#scrollTop .inner a img {position:absolute; top:35%; left:35%; transition:all .4s ease}
#scrollTop .inner a span {position:absolute; width:100%; top:0; left:50%; font-size:13px; font-weight:600; margin-left:-22px; line-height:45px; opacity:0; filter:alpha(opacity='0'); transform:rotate(-360deg); transition:all .4s ease}
#scrollTop .inner a.on img {opacity:0; transform:rotate(360deg)}
#scrollTop .inner a.on span {display:block; opacity:1; filter:alpha(opacity='100'); transform:rotate(0deg)}
/* 하단 영역 */
#footer .inner {max-width:1400px; margin:0 auto; padding:0 50px}
#footer .inner:after {clear:both; display:block; content:''}
#footer .logo {float:left; padding-top:10px; width:120px}
#footer .logo img {display:block; width:100%}
#footer .info {float:left; margin-left:50px; color:#aaa}
#footer .info address {color:#aaa}
#footer .info ul li {display:inline-block; margin-right:10px; color:#aaa}
#footer .info ul li span {color:#ddd}
#footer .info p.copyright {color:#aaa}
#footer a {color:#aaa !important}

.btn {display:inline-block; height:40px; margin:0 1px; padding:0 10px !important; font:inherit !important; color:#666; line-height:38px !important; text-decoration:none !important; border:1px solid #d8d8d8; background:#fff; cursor:pointer; vertical-align:middle}
.btn-default {border-color:#ddd}
.btn-default:hover {color:inherit !important; border-color:#cdcdcd; background:#f4f4f4}

.btn-primary {color:#fff !important; border-color:#93bd93; background:#92bd92}
.btn-primary:hover {border-color:#86b186 !important; background:#86b886 !important}

.btn-gray {color:#000 !important; border-color:#ccc; background:#ccc;}
.btn-gray:hover {color:#fff !important; border-color:#777; background:#555;}

.btn-black {color:#fff !important; border-color:#333; background:#111;}
.btn-black:hover {border-color:#333 !important; background:#666 !important}

.btn-blue {color:#fff !important; border-color:#3e52ac; background:#5866a7}
.btn-blue:hover {border-color:#5866a7 !important; background:#455081 !important}

.btn-danger {color:#fff !important; border-color:#c14646; background:#cc4a4a}
.btn-danger:hover {border-color:#ad4444 !important; background:#b44b4b !important}
.btn i {margin-right:10px; vertical-align:-1px}
.btn i.right {margin:0 0 0 10px}
.btn-sm {height:35px; padding:0 10px !important; margin-bottom: 3px; line-height:33px !important}
.btn-lg {height:50px; line-height:48px !important}
.btn-max {height:105px; line-height:95px  !important}
.btn-sx {height:25px; padding:0 10px !important; margin-bottom: 3px; line-height:20px !important}
.btn-round {border-radius:5px;  }

.tbl_td span{padding: 5px 0 5px 0px; font-size:1.2em; font-weight: 700;}
.this_table{border: 0.28pt solid rgb(0, 0, 0); border-collapse: collapse; }
.thin_board{border: 0.28pt solid rgb(0, 0, 0); height:35px; line-height: 35px; text-align:center; font-weight: 500;}
.thin_board_th{border: 0.28pt solid rgb(0, 0, 0); height:35px; line-height: 35px; text-align:center; background-color:#eee;}

.webzine_type2 {
    width: 100%;
    margin-top: 30px
}

#webzine_type2 dd,
#webzine_type2 dt,
.webzine_type2 dl {
    margin: 0;
    padding: 0
}

.webzine_type2 dl {
    float: left;
    clear: both;
    width: 100%;
    padding: 0 0 16px;
    margin-bottom: 0
}

.webzine_type2 .webzine_type_img_td {
    vertical-align: top;
    padding-top: 1px
}

.webzine_type2 .webzine_type_img img {
    border: 1px solid #f7f7f7;
    width: 400px;
    height: 270px;
    margin-bottom: 10px
}

.webzine_type2 .webzine_type_img img:hover {
    border: 1px solid #00b3f0
}

.webzine_type2 .webzine_type2_table_line,
.webzine_type2 dd {
    width: 100%;
    border-top: 1px solid #eee
}

.webzine_type2 dd {
    width: 100%;
    float: left;
    clear: both;
    padding: 3px 0
}

.webzine_type2 .obj_name {
    display: inline-block;
    width: 17%;
    /* padding: 5px 0 5px 12px; 2022.05.03 주석 */
    /* padding: 5px 5px 5px 5px; */
    line-height: 33px;
    font-weight: 700
}

dd:last-child span.obj_name {
    display: none
}

.webzine_type2 .obj_value {
    display: inline-block;
    /* padding: 5px 0 5px 12px; 2022.05.03 주석 */
    /* padding: 5px 5px 5px 5px; */
    line-height: 33px;
    margin-left: 0
}

.webzine_type2 span.obj_value:before {
    padding-right: 10px
}

dd:last-child span.obj_value:before {
    content: "";
    padding-right: 0
}

dd:last-child span.obj_value {
    padding-top: 5px
}

span.obj_value span:hover {
    color: #00b3f0
}

.webzine_type2 .webzine_type_text_td_left {
    width: 100%;
    padding: 0 0 0 8px;
    vertical-align: top
}

.webzine_type2 .webzine_type_text_td_right {
    width: 100%;
    padding: 0 9px 0 0
}

.input_name_div{
    float:left;width:12%;height:45px; font-size:13px; font-weight:600;padding:8px;/* 2022.12.26 padding:5px;*/ padding-left:15px; margin-bottom:10px;border-left:2px solid #eee;
}
.input_value_div{
    float:left;width:38%;height:45px; padding:8px; margin-bottom:10px;
}

/**
* 2022.12.15 추가
*/
.join_input_name_div{
    float:left;
    width:12%;
    height:45px; 
    /* line-height:45px;  */
    font-size:13px; 
    font-weight:600;
    padding:8px;
    padding:5px; 
    padding-left:15px; 
    margin-bottom:10px;
    border-left:2px solid #eee;
}
.join_input_value_div{
    float:left;width:38%;height:45px; padding:8px; margin-bottom:10px;
}
.join_input_name_div.detail_addr_title{
    width: 24%;
}
.join_input_value_div.detail_addr_value{
    width: 70%;
}
.addr_div {
    width: 50%;
    display: inline-block;
}

.modal-open {
    overflow: hidden;
}

.modal-open .modal {
    overflow-x: hidden;
    overflow-y: auto;
}

.modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1050;
    display: none;
    width: 100%;
    height: 100%;
    overflow: hidden;
    outline: 0;
    background-color: rgba( 150, 150, 150, 0.5 );
}

.modal-content {
    background-color: #fefefe;
    margin: 7% auto;
    margin-top : 15%;
    padding: 20px;
    border: 1px solid #888;
    width: 60%;
}

.modal.fade .modal-dialog {
    -webkit-transition: -webkit-transform 0.3s ease-out;
    transition: -webkit-transform 0.3s ease-out;
    transition: transform 0.3s ease-out;
    transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
    -webkit-transform: translate(0, -50px);
    transform: translate(0, -50px);
}

/**
 * 2024.07.08
 * footer 아래 고정
 */
#container {
    min-height: calc(100vh - 19rem);
}
div#footer {
    height: 12rem;
}

/**
 * 2024.07.16 검색 화면
 */
 .course_tbook_img {
    text-align: center;
    font-size: 18px;
    width: 10%;
}
.course_tbook_info {
    padding-left: 50px;
}
.course_tbook_value {
    padding-left: 100px;
}
.course_tbook_name {
    width: 10%;
    font-weight: bold;
}








#cafe_bbs_list_table {
    border-top: 2px solid #999;
    width: 100%;
}

#cafe_bbs_list_table .list_cell_titles {
    padding: 10px 0;
    border-bottom: 1px solid #777;
    font-weight: 700
}

#cafe_blt_titleWrap .titleWrap_cell_admin {
    width: 30px;
    text-align: center !important
}

#cafe_blt_titleWrap .titleWrap_group1 {
    width: 50px;
    text-align: center !important
}

#cafe_blt_titleWrap .titleWrap_group3,
#cafe_blt_titleWrap .titleWrap_group4,
#cafe_blt_titleWrap .titleWrap_group5,
#cafe_blt_titleWrap .titleWrap_group6 {
    width: 100px
}



.char_cmt_num {
    color: #00b3f0;
    font-size: 10px !important;
    font-weight: 700;
    font-family: Arial, sans-serif;
    padding: 2px 0 2px 15px;
    background:url({{$SKIN_IMG_URL}}icon_cmt.gif) 1% 50% no-repeat
}

.char_hit,
.char_image,
.char_new {
    color: #00b3f0;
    font-size: 10px !important;
    font-weight: 700;
    font-family: Arial, sans-serif
}

#ext_search #search_table .est_cate_cell .cateform,
#ext_search #search_table .keywordform,
.infor_table .inline {
    font-family: "돋움", Dotum, sans-serif;
    font-size: 12px
}

.trover {
    background-color: #f7f7f7;
    color: #00b3f0
}

.item_group2:hover {
    text-decoration: underline
}

#ext_paging {
    width: 100%
}

#ext_paging #paing_table {
    width: 94%;
    margin-left: 6%
}

#ext_paging #paing_table tr {
    height: 27px
}

#ext_paging #paing_table .ept_link_area {
    width: 95%
}

#ext_paging #paing_table .ept_btn_cell {
    width: 5%
}

#ext_paging #paing_table .ept_link_cell {
    text-align: center
}

#search_table {
    text-align:right;
    margin: 20px auto;
    padding: 10px;
}

#search_table .est_cate_cell .cateform {
    height: 28px;
    margin-top: 1px;
    vertical-align: top
}

#search_table .keywordform {
    height: 28px;
    width: 128px;
    margin-right: -1px;
    margin-top: 1px;
    padding: 2px 6px 0 4px;
    background: #fff
}

#ext_admin #admin_table,
.general_item_table,
.infor_table {
    width: 100%
}

#category_sel {
    height: 30px;
    margin-bottom: 80px
}

#category_navi select,
#category_sel select {
    border-radius: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 100%;
    min-width: 270px;
    padding: 12px;
    margin-top: 12px;
    margin-bottom: 40px;
    font-weight: 700;
    background:url({{$SKIN_IMG_URL}}icon_arrow.gif) 97% 50% no-repeat
}

#category_navi {
    height: 30px;
    text-indent: 12px;
    overflow: visible
}

.summ_item_table_split tr,
.web_item_table_split tr {
    height: 1px;
    overflow: hidden
}

#category_navi div {
    float: left;
    cursor: pointer;
    padding: 7px
}

#ext_admin #admin_table .item_content {
    padding: 5px
}

.general_item_table td {
    padding: 7px 0;
    border-bottom: 1px solid #eee
}

.general_item_table .item_cell_admin {
    width: 30px;
    text-align: center !important
}

.general_item_table .item_group1 {
    width: 50px;
    text-align: center !important
}

.general_item_table .item_group3,
.general_item_table .item_group4,
.general_item_table .item_group5,
.general_item_table .item_group6 {
    width: 100px
}

.general_item_table .item_group4 img {
    margin-left: auto;
    margin-right: auto;
    display: block
}

.web_item_table {
    width: 100%
}

.web_item_table .item_cell_media {
    width: 20%;
    text-align: center
}

.web_item_table .item_cell_main {
    width: 80%
}

.web_item_table .wit_item_table,
.web_item_table_split {
    width: 100%
}

.web_item_table .wit_item_table .item_cell_content {
    color: #AAA;
    font: .7em Arial sans-serif
}

.web_item_table .wit_item_table .item_cell_infor {
    text-align: right
}

.web_item_table.item-line-0 {
    background-color: #f7f7f7
}

.web_item_table.item-line-1 {
    background-color: #fff
}

.web_item_table_split .cell_left {
    width: 1%
}

.web_item_table_split .cell_center {
    width: 98%;
    background-color: #f7f7f7
}

.web_item_table_split .cell_right {
    width: 1%
}

.inner_tbl {
    padding-left:30px;
    margin-bottom: 35px;
}

.under_line{
    border-bottom: 1px solid #e0e0e0;
    line-height: 33px;
}
.under_line_dot{
    border-bottom : 2px dotted #e0e0e0;
}

.under_line_dot2:hover{
    border-bottom : 1px dotted #e0e0e0;
    cursor:pointer;
}

.top_line{
    border-top: 1px solid #e0e0e0;
}

/*별점표시*/
.star_graph {
    float: left;
    width: 68px;
    background: url(../../img/graph_brand_off.gif) left top no-repeat;
    background-position:0px 10px;
}
.star_graph li {
    height: 12px;
    background: url(../../img/graph_brand_on.gif) left top no-repeat;
    display:inline-block; margin-right:10px; color:#aaa
}

.progress {
    display: -ms-flexbox;
    display: flex;
    height: 1rem;
    overflow: hidden;
    font-size: .75rem;
    background-color: #e9ecef;
    border-radius: .25rem;
}

.progress-bar {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-color: #007bff;
    transition: width .6s ease;
}

.progress-bar-animated {
    -webkit-animation: progress-bar-stripes 1s linear infinite;
    animation: progress-bar-stripes 1s linear infinite;
}

.progress-bar-striped {
    background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
    background-size: 1rem 1rem;
}

.bg-success {
    background-color: #28a745!important;
}

.bg-warning {
    background-color: #ffc107!important;
}

.bg-danger {
    background-color: #dc3545!important;
}

.right_quick {
    text-align: center;
    position:absolute;
    right: 0;
    bottom: 0;
    top: 550px;
    z-index: 1;
    background: #fff;
    width: 300px;
    /*border-left: 1px solid #c7c7c7;*/
    padding-top: 20px;
}

/*Tab 시작*/
.tab {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    padding-top: 20px;
}
/* Float the list items side by side */
.tab li {
    float: left;
    display: inline-block;
    background-color: #fff !important;
    color: #000;
    text-align: center;
    text-decoration: none;
    /*padding: 14px 16px;*/
    width:180px;
    height:38px;
    font-size: 17px;
    transition:0.3s;
    border-top: 1px solid #888;
    border-left: 1px solid #888;
    border-right: 1px solid #888;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    margin-right : 1px;
    line-height: 2.2;
}

/* 2022.12.27
.tab li:nth-child(1){
    margin-left : 30px;
} */

.tab li:hover {
    background-color: #e5effa;
    font-weight: 600;
}

/* Style the links inside the list items */

/* Style the tab content */
.tabcontent {
    display: none;
    background-color:#fff;
    /* padding: 6px 12px; */
    padding: 6px 0px;
    color:#fff;
    border-top: 1px solid #888;
}
.tab li.current{
    background-color:rgb(184, 204, 212);
    color: #222;
    font-weight: 600;
}

.tabcontent2 {
    display: none;
    background-color:#fff;
    padding: 0px 12px;
    color:#fff;

}
.tabcontent.current {
    display: block;
}
.tabcontent2.current {
    display: block;
}
/*Tab 완료*/

.tab2 {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    padding-top: 20px;
}
.tab2 li {
    float: left;
    display: inline-block;
    background-color: #fff;
    color: #000;
    text-align: center;
    text-decoration: none;
    /*padding: 14px 16px;*/
    width:180px;
    height:38px;
    font-size: 17px;
    transition:0.3s;
    border-top: 1px solid #888;
    border-left: 1px solid #888;
    border-right: 1px solid #888;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    margin-right : 1px;
    line-height: 2.2;
}

.tab2 li:nth-child(1){
    margin-left : 30px;
}

.tab2 li:hover {
    background-color: #e5effa;
    font-weight: 600;
}

.tab2 li.current{
    background-color:#5866a7;
    color: #fff;
    font-size:14px;
    line-height:37px;
}

.faq_tab {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    padding-top: 20px;
    padding-bottom: 1px;
}

.faq_tab li {
    float: left;
    display: inline-block;
    background-color: #fff;
    color: #000;
    text-align: center;
    text-decoration: none;
    /*padding: 14px 16px;*/
    width:140px;
    height:38px;
    font-size: 16px;
    transition:0.3s;
    border-top: 1px solid #888;
    border-left: 1px solid #888;
    border-right: 1px solid #888;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    margin-right : 1px;
    line-height: 2.2;
    cursor:pointer;
}

.faq_tab li:hover {
    background-color: #e5effa;
}

.faq_tab li.current{
    background-color:#5866a7;
    color: #fff;
    line-height:37px;
}


#event_div{
    z-index:9999;position:fixed;top:30%;left:30%;width:40%;height:60%;background-color:#fff;border:2px solid #333;border-radius:5px;padding:20px;overflow-y:auto;
    display:none;
}



.alert_div{
    z-index:8888;position:fixed;top:30%;left:30%;width:40%;height:60%;background-color:#fff;border:2px solid #333;border-radius:5px;padding:20px;overflow-y:auto;
    display:none;
}

.alert_div #alert_title{
    font-size:18px;
    font-weight: 600;
}

.alert_div #alert_info{
    font-size:18px;
}

.learn_div{
    z-index:8888;position:fixed;top:30%;left:30%;width:40%;height:60%;background-color:#fff;border:2px solid #333;border-radius:5px;padding:20px;overflow-y:auto;
    display:none;
}

.learn_div #learn_title{
    font-size:20px;
    font-weight: 600;
}

.learn_div #learn_info{
    font-size:18px;
}


.input_form{
    border-color: #d8d8d8;
    height: 40px;
    border-radius: 3px;
    border: 1px solid #ced4da;
    /* 2022.12.16 text-align:center; */
}

/**
* 2022.12.16
* 회원가입 시 type이 number인 것에 보이는 화살표 감추기
*/
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/**
* 2023.01.18
* 상단 배너 영역
*/
#topBannerDiv {
    height: 80px;
    background-size: unset; 
    background-position: center;
}

/**
* 2023.04.26
* 상단 배너 영역 - 가스산업기사
*/
#topBannerDivGas {
    height: 80px;
    background-size: unset; 
    background-position: center;
}



/* 2024.07.24 헤더-검색란 PC에서는 CLOSE 버튼 안 보이게 처리 */
.wrap .Srch_box .input_item #btn_search_close { top: 10px; position: fixed; padding-left: 10px; font-size: 20px; height: 40px; line-height: 40px; display: none; }

























/*모바일 : -479px*/
@media all and (max-width:479px){
    
/* @media screen and (max-width:640px) { */
    #header .inner {padding:0 30px}
    #header h1 {width:100px; padding-top:25px}
    #btnNav {right:30px}
    #gnb_wrap a.gnb_top {position:relative; display:block !important; padding:0 0 0 25px; height:40px; font-size:16px; color:#fff; line-height:40px; background:#555}
    #gnb_wrap a.gnb_top > span.nav-home {display:inline-block; width:17px; height:16px; margin-right:10px; background:url(../../img/scroll_top.png) 0 0 no-repeat; vertical-align:-4px}
    #gnb_wrap button {right:30px}
    #gnb > li > a {height:auto; padding:7px 25px; font-size:14px; border-bottom:1px solid #dedede}
    #footer {padding:30px 0}
    #footer .inner {padding:0 30px}
    #footer .logo {width:95px}
    #footer .info address, #footer .info p {font-size:12px}
    .right_quick {display:none;}
    .tab li:nth-child(1){ margin-left : 0px; }
    .tab2 li { width:110px; font-size:14px; line-height: 40px; }
    .tab2 li:nth-child(1){ margin-left : 20px; }
    .tab2 li:nth-child(3){ margin-left : 20px; }
    
    .alert_div{ left:10%;width:80%;height:45%;border-radius:5px;padding:10px; }
    .alert_div #alert_title{ font-size:13px; font-weight: 600; }
    .alert_div #alert_info{ font-size:13px;  }
    .learn_div{ left:10%;top:15%;width:80%;height:70%;border-radius:5px;padding:10px; }
    .learn_div #alert_title{ font-size:13px; font-weight: 600; }
    .learn_div #alert_info{ font-size:13px;  }
    .topMenu { padding-right: 20px; padding-left: 20px; text-align:center; }
    /** * 2022.12.13 * 학습목록 */
    .input_name_div{ float:left; width:15%; /* padding-left:15px; */
     border-left: none !important; text-align: unset !important }
    .input_value_div{ float:left; width:85%; }
    /** * 2022.12.15 * 추가 */
    .join_input_name_div{ float:left; width:30%; /* padding-left:15px; */
     border-left: none !important; text-align: unset !important }
    .join_input_value_div{ float:left; width:70%; }
    .join_input_name_div.detail_addr_title{ width: 40%; }
    .join_input_value_div.detail_addr_value{ width: 60%; }
    .addr_div { width: 100%; display: inline-block; }
    .modal-content {   width: 90%; margin-top:10px;  }
    /** * 2022.12.13 * 모바일에서만 학습시간 영역 조절 */
    .webzine_type2 .obj_name.learn_time { width: 20%; }
    .tbl_td span{padding: 5px 0 5px 5px; font-size:1.2em; font-weight: 700;}
    #book_link_img { text-align: center; }
    /** * 2022.12.20 * 미리보기/관심강의 모바일 */
    .webzine_type2 .obj_value { 
        display: inline-block; /* padding: 5px 0 5px 12px; 2022.05.03 주석 */
        padding: unset !important; margin-left: 0; width: 60%; line-height: 45px; 
    }
    /** * 2024.04.02 * 과정상세보기 페이지 할인율 영역 */
    .webzine_type2 .obj_value.m1{ display: inline-block; padding: unset !important; margin-left: 0; width: 12%; vertical-align: middle; line-height: 40px; }
    .webzine_type2 .obj_value.m2{ display: inline-block; padding: unset !important; margin-left: 0; width: 15%; vertical-align: middle; line-height: 40px; }
    .webzine_type2 .obj_value.m3{ display: inline-block; padding: unset !important; float: right; line-height: 20px; font-size: 12px; width: 34%; vertical-align: middle; line-height: 40px; white-space: nowrap; }
    /** * 2022.12.27 */
    .join_input_name_div.m_detail_title { width: 40%; }
    .join_input_value_div.m_detail_value { width: 60%; }
    .webzine_type2 .obj_name { 
        display: inline-block; width: 36%; /* padding: 5px 5px 5px 5px; */
        padding: unset !important; font-weight: 700; vertical-align: top; line-height: 45px; 
    }
    .tab li:nth-child(1) { margin-left: unset !important; }
     /** * 2022.12.30 */
    #join_input_ok_btn { width: 50%; }
    /** * 2023.01.18 * 상단 배너 영역 */
    #topBannerDiv { width:100%; height: 3em !important; background-color:#023a74;  text-align: center;  object-fit: cover;  background-image: url('/img/banner/careWorker_topBanner.jpeg');  background-size: cover; background-repeat: no-repeat;  background-position: center; }
    /** * 2023.04.26 * 상단 배너 영역 - 가스산업기사 */
    #topBannerDivGas { width:100%; height: 3em !important; background-color:#FAF8BB;  text-align: center;  object-fit: cover;  background-image: url('/img/banner/gas_topBanner.jpg');  background-size: cover; background-repeat: no-repeat;  background-position: center; }
    .star_graph { float: left; width: 68px; background: url(../../img/graph_brand_off.gif) left top no-repeat; background-position:0px 15px; }
    /**  * 2024.07.08  * footer 아래 고정  */
    #container { min-height: unset; }
    div#footer { height: unset; }
    /**  * 2024.07.15  * 리뷰 영역  */
    #review_obj_name { padding: 10px !important; }
    #review_obj_value { padding: 20px !important; font-size: 13px !important; line-height: 30px !important; }
    .course_tbook_img { width: 25%; }
    .course_tbook_info { padding-left: 20px !important; }
    .course_tbook_value { padding-left: unset !important; }
    .course_tbook_name { width: 30%; font-weight: bold; }

    
    /* 2024.07.18 강의 리스트 페이지 */
    #webzine_type2_mobile .webzine_type_img img {width: 90%; height: auto; margin-bottom: 5px;}
    #webzine_type2_mobile .webzine_type_text_td_left { padding: unset; width: 60%; }
    #webzine_type2_mobile .obj_value {width: 60%; line-height: 25px;}
    #webzine_type2_mobile td {display: block;}
    #webzine_type2_mobile .webzine_type_text_td_left .inner_tbl .under_line { line-height: unset; }
    #webzine_type2_mobile .tbl_td span { font-size: 0.9em; padding: unset; }
    #webzine_type2_mobile .inner_tbl { padding-left: unset; margin-bottom: unset;}

    /* 2024.07.22 - 반응형 */
    #webzine_type2_mobile .webzine_type_text_td_left td.thin_board_th { display: table-cell; }
    #webzine_type2_mobile .webzine_type_text_td_left td.thin_board { display: table-cell; }
    #webzine_type2_mobile .webzine_type_text_td_left.mobile { width: 50%; }

    /* 2024.07.22 - 반응형 전(추후 실서버 최종 반영되면 걷어내야 하는 소스) */
    .webzine_type2 .webzine_type_img img { width: 100%; }
    .webzine_type2 .webzine_type_text_td_left { width: 100%; }
    .star_graph { /* background-position: 0 5px;  */ }
    .webzine_type2 td { display: block; }
    .webzine_type2 .obj_value { line-height: 45px; }
    /* .webzine_type2 .tbl_td span { padding: 5px 0 5px 5px !important; font-size: 1.2em !important; font-weight: 700 !important; } */

    /* 2024.07.23 */
    .inner_tbl { padding-left: unset; margin-bottom: unset;}
    #webzine_type2_mobile { padding-top: 10px; width: 100%; }
    #webzine_type2_mobile .webzine_type_text_td_left.mobile {
        vertical-align: top;
    }
    #webzine_type2_mobile td.tbl_td {
        vertical-align: top; 
        height: 20px;
    }

    /* 2024.07.24 헤더-검색란 모바일에서는 CLOSE 버튼 보이게 처리 */
    .wrap .Srch_box .input_item #btn_search_close { display: unset !important; }
    .btn_search #btn_search_icon { display: none; }

    /* 2024.07.25 */
    .star_graph {
        background-position: 0px 15px;
    }
}




/*모바일 가로 & 태블릿 세로 : 480px-767px*/
@media all and (min-width:480px) and (max-width:767px){

/* @media screen and (max-width:768px) { */
    .webzine_type2 td { display: block; }
    /* 2024.07.18 주석 .webzine_type2 .webzine_type_img img { width: 100%; height: 100% } */
    .webzine_type2 .obj_name { width: 40%; padding: 5px; /* 2022.05.03 추가 */ }
    dd:nth-child(2), dd:nth-child(3) { border-top: 0 }
    .webzine_type2 span.obj_value:before,
    dd:nth-child(2) span.obj_name,
    dd:nth-child(2) span.obj_value,
    dd:nth-child(3) span.obj_name,
    dd:nth-child(3) span.obj_value { display: none }
    .modal-content {  width: 80%; }

    /**
    * 2022.05.02
    * 간호조무사 학습목표 이미지 반응형
    */
    .nourseGoal img { width: 100%; height: auto; }

    /**
    * 2024.07.08
    * footer 아래 고정
    */
    #container { min-height: unset; }
    div#footer { height: unset;
    }

    /**
    * 2024.07.11
    * 모바일에서만 css 수정
    */
    .thin_board{border: 0.28pt solid rgb(0, 0, 0); height:70px; width: 33.3%; float: left; line-height: 35px; text-align:center; font-weight: 500; display: table !important;}
    .thin_board div {display: table-cell; vertical-align: middle;}
    .thin_board_th{border: 0.28pt solid rgb(0, 0, 0); height:35px; width: 33.3%; float: left; line-height: 35px; text-align:center; background-color:#eee;}

    /**
    * 2024.07.15
    * 리뷰 영역
    */ 
    #review_obj_name { }
    #review_obj_value { padding: 30px !important; font-size: 13px !important;}
    .general_item_table .item_group1 { width: 50px !important }
    .general_item_table .item_group3,
    .general_item_table .item_group4,
    .general_item_table .item_group5,
    .general_item_table .item_group6 { display: none }


    /**
    * 2024.07.08
    * footer 아래 고정
    */
    #container { min-height: unset; }
    div#footer { height: unset;}

    /**
    * 2024.07.11
    * 모바일에서만 css 수정
    */
    .thin_board{border: 0.28pt solid rgb(0, 0, 0); height:70px; width: 33.3%; float: left; line-height: 35px; text-align:center; font-weight: 500; display: table !important;}
    .thin_board div {display: table-cell; vertical-align: middle;}
    .thin_board_th{border: 0.28pt solid rgb(0, 0, 0); height:35px; width: 33.3%; float: left; line-height: 35px; text-align:center; background-color:#eee;}
    
    #cafe_blt_titleWrap .titleWrap_group3,
    #cafe_blt_titleWrap .titleWrap_group4,
    #cafe_blt_titleWrap .titleWrap_group5,
    #cafe_blt_titleWrap .titleWrap_group6 { display: none }


    /**
    * 2024.07.08
    * footer 아래 고정
    */
    #container { min-height: unset; }
    div#footer { height: unset; }

    /**
    * 2024.07.11
    * 모바일에서만 css 수정
    */
    .thin_board{border: 0.28pt solid rgb(0, 0, 0); height:70px; width: 33.3%; float: left; line-height: 35px; text-align:center; font-weight: 500; display: table !important;}
    .thin_board div {display: table-cell; vertical-align: middle;}
    .thin_board_th{border: 0.28pt solid rgb(0, 0, 0); height:35px; width: 33.3%; float: left; line-height: 35px; text-align:center; background-color:#eee;}
    
    /* 2024.07.18 강의 리스트 페이지 */
    #webzine_type2_mobile .webzine_type_img img {width: 90%; height: auto; margin-bottom: 5px;}
    #webzine_type2_mobile .webzine_type_text_td_left { padding: unset; width: 60%; }
    #webzine_type2_mobile .obj_value {width: 60%; line-height: 25px;}
    #webzine_type2_mobile td {display: block;}
    #webzine_type2_mobile .webzine_type_text_td_left .inner_tbl .under_line { line-height: unset; }
    #webzine_type2_mobile .tbl_td span { font-size: 0.9em; padding: unset; }
    #webzine_type2_mobile .inner_tbl { padding-left: unset; margin-bottom: unset;}

    /* 2024.07.22 - 반응형 */
    #webzine_type2_mobile .webzine_type_text_td_left td.thin_board_th { display: table-cell; }
    #webzine_type2_mobile .webzine_type_text_td_left td.thin_board { display: table-cell; }
    #webzine_type2_mobile .webzine_type_text_td_left.mobile { width: 50%; }

    /* 2024.07.22 - 반응형 전(추후 실서버 최종 반영되면 걷어내야 하는 소스) */
    /* .webzine_type2 .webzine_type_img img { width: 100%; } */
    .webzine_type2 .webzine_type_text_td_left { width: 100%; }
    .star_graph { /* background-position: 0 5px;  */ }
    .webzine_type2 td { display: block; }
    .webzine_type2 .obj_value { line-height: 45px; }
    /* .webzine_type2 .tbl_td span { padding: 5px 0 5px 5px !important; font-size: 1.2em !important; font-weight: 700 !important; } */

    /* 2024.07.23 */
    .inner_tbl { padding-left: unset; margin-bottom: unset;}
    #webzine_type2_mobile { padding-top: 10px; width: 100%; }
    #webzine_type2_mobile .webzine_type_text_td_left.mobile {
        vertical-align: top;
    }
    #webzine_type2_mobile td.tbl_td {
        vertical-align: top; 
        height: 20px;
    }

    /* 2024.07.24 헤더-검색란 모바일에서는 CLOSE 버튼 보이게 처리 */
    .wrap .Srch_box .input_item #btn_search_close { display: unset !important; }
    .btn_search #btn_search_icon { display: none; }

    /* 2024.07.25 */
    .star_graph {
        background-position: 0px 15px;
    }
}



/*태블릿 가로 : 769px-1023px*/
@media all and (min-width:768px) and (max-width:1023px){
    
/* @media screen and (max-width:1024px) { */
    #header h1 {width:120px; padding-top:20px}
    #gnb_wrap {position:fixed; top:0; right:-270px; width:250px; height:100%; background:#fff; box-shadow:-2px 0 6px 0 rgba(0,0,0,.3); z-index:990}
    #gnb_wrap a.gnb_top {position:relative; display:block !important; padding:0 0 0 25px; height:80px; font-size:16px; color:#fff; line-height:80px; background:#555}
    #gnb_wrap a.gnb_top > span.nav-home {display:inline-block; width:17px; height:16px; margin-right:10px; background:url(../../img/scroll_top.png) 0 0 no-repeat; vertical-align:-2px}
    #gnb_wrap button {display:block; position:absolute; top:20px; right:50px; width:40px; height:40px; border:none; border-radius:2px; background:#333; cursor:pointer}
    #gnb_wrap button span {position:absolute; display:block; left:10px; width:20px; height:2px; background:#fff; transition:all .4s ease}
    #gnb_wrap button span.bar1 {top:12px}
    #gnb_wrap button span.bar2 {top:18px}
    #gnb_wrap button span.bar3 {top:24px}
    #gnb_wrap button.active span.bar1 {top:18px; transform:rotate(45deg)}
    #gnb_wrap button.active span.bar2 {display:none}
    #gnb_wrap button.active span.bar3 {top:18px; transform:rotate(-45deg)}
    #gnb {float:none}
    #gnb > li {float:none; height:auto}
    #gnb > li > a {height:auto; padding:7px 25px; font-size:16px; border-bottom:1px solid #dedede}
    #gnb > li > a > span {padding:0}
    #gnb > li > a > span:before {display:none}
    #gnb > li > ul.submnu li:before {display:none}
    #gnb > li.dropdown > a:before {position:absolute; display:block; width:2px; height:14px; right:31px; top:50%; margin-top:-7px; content:''; background:#aaa; transition:all .3s ease}
    #gnb > li.dropdown > a:after {position:absolute; display:block; width:14px; height:2px; right:25px; top:50%; margin-top:-1px; content:''; background:#aaa}
    #gnb > li.open > a:before {transform:rotate(90deg)}
    #gnb > li > ul.submnu {display:none; position:static; width:100%; padding:0; background:#f6f6f6; opacity:1 !important; filter:alpha(opacity='100') !important; box-shadow:none}
    #gnb > li > ul.submnu li {padding:0; border-color:#dedede}
    #gnb > li > ul.submnu li a {font-size:13px; padding:5px 25px}
    #gnb_mask {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:.6; filter:alpha(opacity='60'); z-index:200}
    #btnNav {display:block}
    #footer .logo {float:none; margin:0 auto 30px auto; padding:0; text-align:center}
    #footer .info {float:none; margin:0; text-align:center}
    .right_quick {display:none;}
    .tab2 li { width:140px;  }
    .tab2 li:nth-child(1){ margin-left : 20px; }
    .inner_tbl { padding-left:10px; }

    .alert_div{ left:20%;width:60%;height:40%;border-radius:5px;padding:10px; }
    .alert_div #alert_title{ font-size:14px; font-weight: 600; }
    .alert_div #alert_info{ font-size:14px;  }

    .learn_div{ left:20%;width:60%;height:40%;border-radius:5px;padding:10px; }
    .learn_div #learn_title{ font-size:14px; font-weight: 600; }
    .learn_div #learn_info{ font-size:14px;  }
    .topMenu { text-align:right; }

    /**
    * 2022.12.13
    * 모바일에서만 학습시간 영역 조절
    */
    .webzine_type2 .obj_name.learn_time { width: 20%; }
    #book_link_img {text-align: center;}
    .tbl_td span{padding: 5px 0 5px 5px; font-size:1.2em; font-weight: 700;}

    /**
    * 2022.12.27
    */
    .webzine_type2 .obj_name { display: inline-block; width: 35%; padding: 5px 5px 5px 5px; font-weight: 700; vertical-align: top; }
    .webzine_type2 .obj_value { display: inline-block; padding: 5px 5px 5px 5px; margin-left: 0; /* width: 50%; */ }
    .tab li:nth-child(1) { margin-left: unset !important; }

    /**
    * 2023.01.18
    * 상단 배너 영역
    */
    #topBannerDiv { width:100%; /* height: 3em !important; */ background-color:#023a74; text-align: center; object-fit: cover; background-image: url('/img/banner/careWorker_topBanner.jpeg'); /* background-size: cover; */ background-repeat: no-repeat; background-position: center; }

    /**
    * 2023.04.26
    * 상단 배너 영역 - 가스산업기사
    */
    #topBannerDivGas { width:100%; background-color:#FAF8BB; text-align: center; object-fit: cover; background-image: url('/img/banner/gas_topBanner.jpg'); background-repeat: no-repeat; background-position: center; }

    
    /* 2024.07.18 강의 리스트 페이지 */
    #webzine_type2_mobile .webzine_type_img img {width: 90%; height: auto; margin-bottom: 5px;}
    #webzine_type2_mobile .webzine_type_text_td_left { padding: unset; width: 60%; }
    #webzine_type2_mobile .obj_value {width: 60%; line-height: 25px;}
    #webzine_type2_mobile td {display: block;}
    #webzine_type2_mobile .webzine_type_text_td_left .inner_tbl .under_line { line-height: unset; }
    #webzine_type2_mobile .tbl_td span { font-size: 0.9em; padding: unset; }
    #webzine_type2_mobile .inner_tbl { padding-left: unset; margin-bottom: unset;}

    /* 2024.07.22 - 반응형 */
    #webzine_type2_mobile .webzine_type_text_td_left td.thin_board_th { display: table-cell; }
    #webzine_type2_mobile .webzine_type_text_td_left td.thin_board { display: table-cell; }
    #webzine_type2_mobile .webzine_type_text_td_left.mobile { width: 50%; }

    /* 2024.07.22 - 반응형 전(추후 실서버 최종 반영되면 걷어내야 하는 소스) */
    /* .webzine_type2 .webzine_type_img img { width: 100%; height: auto; } */
    .webzine_type2 .webzine_type_text_td_left { width: 100%; }
    .star_graph { background-position: 0 15px;  }
    .webzine_type2 td { display: block; }
    .webzine_type2 .obj_value { line-height: 45px; }
    /* .webzine_type2 .tbl_td span { padding: 5px 0 5px 5px !important; font-size: 1.2em !important; font-weight: 700 !important; } */

    /* 2024.07.23 */
    .inner_tbl { padding-left: unset; margin-bottom: unset;}
    #webzine_type2_mobile { padding-top: 10px; width: 100%; }
    #webzine_type2_mobile .webzine_type_text_td_left.mobile {
        vertical-align: top;
    }
    #webzine_type2_mobile td.tbl_td {
        vertical-align: top; 
        height: 20px;
    }
    
    /* 2024.07.24 헤더-검색란 모바일에서는 CLOSE 버튼 보이게 처리 */
    .wrap .Srch_box .input_item #btn_search_close { display: unset !important; }
    .btn_search #btn_search_icon { display: none; }
}

/* 미디어 쿼리 */
/* @media screen and (max-width:1919px) {
    .right_quick {display:none;} */

    
    /**
     * 2024.07.08
     * footer 아래 고정
     */
     /* #container {
        min-height: unset;
    }
    div#footer {
        height: unset;
    } */
/* } */




/*노트북 & 태블릿 가로 : 1024px-1279px*/
@media all and (min-width:1024px) and (max-width:1279px){
    
/* @media screen and (min-width:1280px) { */

    .right_quick {display:none;}

    #gnb {margin-right:-25px}

    .alert_div{ width:40%;height:50%;border-radius:5px;padding:15px; }
    .alert_div #alert_title{ font-size:16px; font-weight: 600; }
    .alert_div #alert_info{ font-size:16px; font-weight: 600; }

    .learn_div{ width:40%;height:50%;border-radius:5px;padding:15px; }
    .learn_div #learn_title{ font-size:16px; font-weight: 600; }
    .learn_div #learn_info{ font-size:14px; font-weight: 600; }

    .modal-content {  width: 70%; }

    /**
    * 2023.01.18
    * 상단 배너 영역
    */
    #topBannerDiv { width:100%; /* height: 3em !important; */ background-color:#023a74; text-align: center; object-fit: cover; background-image: url('/img/banner/careWorker_topBanner.jpeg'); /* background-size: cover; */ background-repeat: no-repeat; background-position: center; }

    /**
    * 2023.04.26
    * 상단 배너 영역 - 가스산업기사
    */
    #topBannerDivGas { width:100%; background-color:#FAF8BB; text-align: center; object-fit: cover; background-image: url('/img/banner/gas_topBanner.jpg'); background-repeat: no-repeat; background-position: center; }


    /* 2024.07.18 강의 리스트 페이지 */
    #webzine_type2_mobile .webzine_type_img img {width: 90%; height: auto; margin-bottom: 10px;}
    #webzine_type2_mobile .webzine_type_text_td_left { padding: unset; width: 60%; }
    #webzine_type2_mobile .obj_value {width: 60%; line-height: 25px;}
    #webzine_type2_mobile td {display: block;}
    #webzine_type2_mobile .webzine_type_text_td_left .inner_tbl .under_line { line-height: unset; }
    #webzine_type2_mobile .tbl_td span { font-size: 0.9em; padding: unset; }
    #webzine_type2_mobile .inner_tbl { padding-left: unset; margin-bottom: unset;}

    

    /* 2024.07.19 */
    .webzine_type2 img.webzine_img { width : 90%; }
    #webzine_type2_mobile { padding-top: 10px; width: 100%; }


     /* 2024.07.24 헤더-검색란 PC에서 CLOSE 버튼 안 보이게 처리 */
     .wrap .Srch_box .input_item #btn_search_close { top: 10px; position: fixed; padding-left: 10px; font-size: 20px; height: 40px; line-height: 40px; display: none; }

    /**
     * 2024.07.08
     * footer 아래 고정
     */
     /* #container {
        min-height: unset;
    }
    div#footer {
        height: unset;
    } */

}