@font-face {
    font-family: 'BMYEONSUNG';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/BMYEONSUNG.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'yg-jalnan';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/******* sub common CSS*******/
.sub-inner {
    max-width: 920px;
    padding: 0 10px 0;
    margin: 0 auto;
}

.sub-cont {
    padding-bottom: 200px;
}


.sub-wrap p {
    font-size: 17px;
    text-align: justify;
    line-height: 1.7;
}


.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
}

.top-img {
    display: block;
    margin-bottom: 113px;
    text-align: center;
}

.banner_box {
    text-align: center;
}

.img-bd {
    border: 1px solid #e6e6e6;
}

.col-1 {
    width: 100% !important;
    display: grid;
    max-width: none;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    padding: 0;
}

.col-2 {
    width: 100% !important;
    display: grid;
    max-width: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 0;
}

.col-3 {
    width: 100% !important;
    display: grid;
    max-width: none;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 0;
}

.img-fluid {
    max-width: 100%;
}

.show-920 {
    display: none;
}

.show-767 {
    display: none;
}

.mt-10 {
    margin-top: 10px;
}

.mt-20 {
    margin-top: 20px;
}

.mt-30 {
    margin-top: 30px;
}

.mt-40 {
    margin-top: 40px;
}

.mt-60 {
    margin-top: 60px;
}

.mt-80 {
    margin-top: 80px;
}

.mt-100 {
    margin-top: 100px;
}

.h-full{
    height:100%;
}

@media screen and (max-width:920px) {
    .hide-920 {
        display: none;
    }

    .show-920 {
        display: block;
    }
}

@media screen and (max-width:768px) {
    .col-2 {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .col-3 {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .hide-767 {
        display: none;
    }

    .show-767 {
        display: block;
        ;
    }

}


/******** 텍스트만 있음 ********/
.text p:not(:first-child) {
    margin-top: 20px;
}

/******** box-type = 박스 스타일 CSS ********/

/* 202409 g2.html 진드기 매개 감염병 예방수칙 박스 스타일(리스트 스타일 제외)*/

.box-type1>dl>dt {
    display: inline-block;
    padding: 5px 30px;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background: #ddd;
}

.box-type1>dl>dd {
    padding: 15px 25px;
    border: 1px solid #ddd;
}

.box-type1 ul li.title {
    position: relative;
}

/* 202409 a3.html 데이터 수집 및 준비 박스 스타일 */

.box-type2 dt {
    position: relative;
    padding: 5px 0;
    padding-left: 20px;
    color: #fff;
    font-weight: 700;
    width: 100%;
    font-size: 17px;
    background-color: #333;
}

.box-type2 dt::before {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 10px;
    height: 100%;
    border-radius: 0;
    background: inherit;
    filter: brightness(0.75);
    content: '';
}

.box-type2 dd {
    background-color: #f3f2f8;
    padding: 25px;
    font-size: 17px;
    text-align: justify;
    line-height: 1.7;
}

/* 상단 출처표시 박스 (202411 b1.html 참고)*/

.box-type3 {
    background-color: #f5f5f5;
    padding: 10px 40px;
    margin-top: 40px;
    font-size: 17px;
    line-height: 1.5;
    display: flex;
    flex-flow: row wrap;
}

.box-type3:not(:has(span)) {
    justify-content: center;
}

.box-type3 span {
    display: block;
    font-weight: 700;
    width: 70px;
}

.box-type3>div {
    width: calc(100% - 70px);
}

/* 202409 e3.html 유해유인 조사표 스타일링 */

.box-type4,
.box-type5,
.box-type6 {
    margin-inline: 0;
    margin-block: 1rem;
}


.box-type4 ul li,
.box-type5 ul li {
    border: 1px solid #bebebe;
    display: flex;
    align-items: center;
}

.box-type4>*,
.box-type5>* {
    padding-inline: 0;
}

.box-type4 p.caption,
.box-type5 p.caption,
.box-type8 p.caption {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px;
    min-height: 45px;
    color: #fff;
    font-size: 18px;
    text-align: center;
    font-weight: 500;
    width: 100%;
    background-color: #333;
}

.box-type5 ul li {
    flex-direction: column;
}

.box-type5 ul li div {
    height: 90%;
    display: flex;
    align-items: center;
}

.box-type5 p.caption {
    height: 10%;
}


.box-type6 ul.col-2,
.box-type6 ul.col-3 {
    padding-inline: 0;
}

.box-type6 ul li {
    display: flex;
    align-items: center;
}

.box-type6 ul.col-2 li:first-child,
.box-type6 ul.col-3 li:first-child {
    padding-right: 7px;
}

.box-type6 ul.col-2 li:last-child,
.box-type6 ul.col-3 li:last-child {
    padding-left: 7px;
}

.box-type6 ul.col-3 li:nth-child(2) {
    padding-inline: 7px
}

.box-type6 p.caption {
    text-align: center;
    margin-top: 8px;
}


.box-type7 ul {
    margin-top: 19px;
}

.box-type7 ul>li .box {
    height: 100%;
    background: #f5f5f5;
}

.box-type7 ul>li {
    margin-bottom: 14px;
}

.box-type7 ul>li .box .img-box {
    position: relative;
}

.box-type7 ul>li .box .img-box span {
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 0 5px;
    min-width: 95px;
    line-height: 30px;
    color: #fff;
    font-size: 15px;
    text-align: center;
    background: rgba(0, 0, 0, 0.6);
}

.box-type7 ul>li .box p {
    padding: 15px 20px;
    font-size: 16px;
    text-align: center;
    line-height: 1.5;
    word-break: keep-all;
}


.box-type8 > .col-2{
    grid-template-columns: 3.3fr 6.6fr;
}

.box-type8 .col-2 > li > div{
    height:90%;
}

.box-type8 .col-2 > li > div ul{
    height:100%;
}

.box-type8 ul li{
    border: 1px solid #bebebe;
}



/******* tit-type = 제목 스타일 CSS *******/

/* tit-type1 */

.tit-type1 {
    display: flex;
    align-items: flex-start;
    margin-bottom: 12px;
    color: #f69146;
    font-size: 30px;
    font-weight: 700;
    line-height: 1.3;
}


.tit-type1::before {
    display: block;
    width: 5px;
    height: 29px;
    margin-right: 7px;
    background: #f69146;
    background: linear-gradient(to bottom, #f3d1b8 17.2%, #f69146 17.2%);
    content: '';
    transform: translateY(5px);
}

/* tit-type2 */

.tit-type2 {
    position: relative;
    padding-left: 38px;
    margin-bottom: 12px;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.5;
    color: #7459b9;
}

.tit-type2::before {
    display: block;
    position: absolute;
    top: 8px;
    left: 0;
    width: 31px;
    height: 20px;
    background: url(../images/a_ico.png) no-repeat;
    content: '';
}

/* tit-type3 */

.tit-type3 {
    font-weight: 700;
    margin-bottom: 12px;
    position: relative;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 42px;
    font-size: 22px;
    text-align: left;
    word-break: keep-all;
}

.tit-type3 span {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 35px;
    line-height: 33px;
    margin-right: 7px;
    background: #333;
    color: #fff;
    text-align: center;
    border-radius: 5px;
}

/* tit-type4 */

.tit-type4 {
    font-family: 'GmarketSansBold';
    background-color: inherit !important;
    position: relative;
    padding-left: 30px;
    font-size: 40px;
    margin-bottom: 10px;
}

.tit-type4 span {
    display: flex;
    position: absolute;
    font-size: 12px;
    left: 0;
    bottom: 9px;
    width: 22px;
    height: 37px;
    text-align: center;
    color: #fff;
    justify-content: center;
    align-items: flex-end;
    line-height: 19px;
    font-family: 'GmarketSansBold';
    background-color: #666;
}

.tit-type4 span:before {
    content: '';
    position: absolute;
    width: 6px;
    height: 6px;
    border-radius: 3px;
    top: 4px;
    background-color: #000;
}

/* tit-type5 */

.tit-type5 {
    padding-left: 20px;
    position: relative;
    text-indent: 0;
    margin-bottom: 12px;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.5;
}

.tit-type5 span {
    position: absolute;
    left: 0;
    top: 0;
}

.tit-type5:not(:has(span)) {
    padding-left: 0;
}

/* tit-type6 */

.tit-type6 {
    position: relative;
    margin-bottom: 12px;
    padding-left: 20px;
    font-size: 24px;
    font-weight: 900;
    color: #333;
    font-family: 'Noto Serif KR', serif;
}

.tit-type6::before {
    display: block;
    position: absolute;
    top: 10px;
    left: 0;
    width: 10px;
    height: 10px;
    background: #333;
    content: '';
}

/* tit-type7 */
.tit-type7 {
    font-family: 'GmarketSansBold';
    position: relative;
    padding-left: 30px;
    font-size: 40px;
    color: #3870cc;
    margin-bottom: 10px;
}

.tit-type7 span {
    display: flex;
    position: absolute;
    font-size: 12px;
    left: 0;
    bottom: 9px;
    width: 22px;
    height: 37px;
    background: #3870cc;
    text-align: center;
    color: #fff;
    justify-content: center;
    align-items: flex-end;
    line-height: 19px;
}

.tit-type7 span::before {
    content: '';
    position: absolute;
    width: 6px;
    height: 6px;
    background: #144ba5;
    border-radius: 3px;
    top: 4px;
}

/********  title CSS ******** /

/*  title common CSS  */

.tit-container {
    max-width: 920px;
    padding: 0 10px 0;
    margin: 0 auto;
}

.tit-container .name {
    margin-top: 7px;
    color: #f69146;
    font-size: 18px;
    font-weight: 700;
    text-align: right;
    line-height: 1.6;
}

.tit-container .info {
    margin-top: 3px;
    color: #999;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    display: flex;
    flex-wrap: wrap;
}

.tit-container .info>li:last-of-type {
    margin: 0;
}

/* tit-box1 인물사진 있는 경우 */

.tit-box1 {
    padding-top: 115px;
    padding-bottom: 35px;
    text-align: center;
    display: flex;
    justify-content: space-between;
}

.tit-box1 h3 {
    margin-top: 21px;
    color: #333;
    font-size: 46px;
    word-break: keep-all;
    margin-bottom: 1.5rem;
    text-align:left;
}

.tit-box1 .writer-box {
    text-align: right;
}

.tit-box1 .writer-box .info {
    justify-content: flex-end;
}

/* tit-box2 인물사진 없는 경우 */

.tit-box2 {
    padding-top: 115px;
    padding-bottom: 35px;
}

.tit-box2 h3 {
    position: relative;
    margin-top: 0;
    padding-bottom: 35px;
    color: #333;
    font-size: 46px;
    word-break: keep-all;
    text-align: center;
}

.tit-box2 h3 .sub {
    margin-top: 10px;
    font-size: 26px;
    color: #999;
}

.tit-box2 h3::after {
    display: block;
    position: absolute;
    bottom: 0px;
    left: 50%;
    width: 100px;
    height: 4px;
    background: #f69146;
    content: '';
    transform: translateX(-50%);
}

.tit-box2 .name {
    margin-top: 28px;
    text-align: center;
}

.tit-box2 .writer-box .info {
    justify-content: center;
}

/******** list-type 리스트 타입 ********/

/* 202409 g2.html 진드기 매개 감염병 예방수칙 리스트 CSS*/

dl.list-type1 {
    margin-bottom: 0;
}

.list-type1 dt {
    padding-left: 0;
    font-weight: 700;
    position: relative;
    padding-left: 25px;
    margin-bottom: 6px;
}

.list-type1 dt::after {
    position: absolute;
    left: 0;
    top: 0;
    content: "○";
}

.list-type1 dd {
    position: relative;
    padding-left: 15px;
    text-indent: 0;
    margin-left: 20px;
    margin-bottom: 5px;
}

.list-type1 dd:after {
    position: absolute;
    left: 0;
    top: 12px;
    content: "";
    width: 8px;
    height: 1px;
    background-color: #666;
}


.list-type2 {
    padding: 15px 25px;
    background: #f7f6fc;
}

.list-type2 li {
    margin-bottom: 8px;
    position: relative;
    padding-left: 15px;
}

.list-type2>li::before {
    position: absolute;
    top: 12px;
    left: 0;
    width: 8px;
    height: 3px;
    content: '';
    background: #7459b9;
}

.list-dot>li {
    padding-left: 15px;
    position: relative;
}

.list-dot>li::before {
    content: "";
    position: absolute;
    top: 12px;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #7459b9;
}

.list-line>li {
    padding-left: 12px;
    text-indent: -12px;
}

.list-num>li {
    padding-left: 20px;
    text-indent: -20px;
}

/******* 하단 출처 박스 CSS (202411 b1.html 참고) *******/

.source-box {
    margin-bottom: 96px;
    padding-top: 23px;
    font-size: 14px;
    border-top: 1px solid #e2e2e2;
    margin-top: 120px;
}

.source-box h4 {
    margin-bottom: 10px;
    font-size: 15px;
    font-weight: 300;
}

.source-box ul li {
    font-size: 15px;
    line-height: 1.6;
    letter-spacing: normal;
    word-break: keep-all;
    text-align: justify;
}

.source-box a {
    text-decoration: underline;
    color: #3285f6;
}

/*******  상단 배너 *******/

.sub-wrap .sub-top>.tit {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 400px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.sub-wrap .sub-top>.tit h2 {
    color: #fff;
    font-size: 40px;
    font-weight: 400;
}

.sub-wrap .sub-top.a1-tit>.tit {
    background-image: url(../images/a1_top.jpg);
}

.sub-wrap .sub-top.a2-tit>.tit {
    background-image: url(../images/a2_top.jpg);
}

.sub-wrap .sub-top.a3-tit>.tit {
    background-image: url(../images/a3_top.jpg);
}

.sub-wrap .sub-top.a4-tit>.tit {
    background-image: url(../images/a4_top.jpg);
}

.sub-wrap .sub-top.a5-tit>.tit {
    background-image: url(../images/a5_top.jpg);
}

.sub-wrap .sub-top.b1-tit>.tit {
    background-image: url(../images/b1_top.jpg);
}

.sub-wrap .sub-top.b2-tit>.tit {
    background-image: url(../images/b2_top.jpg);
}

.sub-wrap .sub-top.b3-tit>.tit {
    background-image: url(../images/b3_top.jpg);
}

.sub-wrap .sub-top.b4-tit>.tit {
    background-image: url(../images/b4_top.jpg);
}

.sub-wrap .sub-top.c1-tit>.tit {
    background-image: url(../images/c1_top.jpg);
}

.sub-wrap .sub-top.c2-tit>.tit {
    background-image: url(../images/c2_top.jpg);
}

.sub-wrap .sub-top.c3-tit>.tit {
    background-image: url(../images/c3_top.jpg);
}

.sub-wrap .sub-top.c4-tit>.tit {
    background-image: url(../images/c4_top.jpg);
}

.sub-wrap .sub-top.e1-tit>.tit {
    background-image: url(../images/e1_top.jpg);
}

.sub-wrap .sub-top.e2-tit>.tit {
    background-image: url(../images/e2_top.jpg);
}

.sub-wrap .sub-top.e3-tit>.tit {
    background-image: url(../images/e3_top.jpg);
}

.sub-wrap .sub-top.g1-tit>.tit {
    background-image: url(../images/g1_top.jpg);
}

.sub-wrap .sub-top.g2-tit>.tit {
    background-image: url(../images/g2_top.jpg);
}

/******* table 기본 CSS *******/

.sub-cont .table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
}

.sub-cont table {
    width: 100%;
    min-width: 700px;
    text-align: center;
}

.sub-cont table th,
.sub-cont table td {
    padding: .75rem;
    vertical-align: middle;
    border-top: 1px solid #e9ecef;
}

.sub-cont table thead th,
.sub-cont table th {
    border-bottom: 2px solid #e9ecef;
    color: #fff;
}

.sub-cont table.table-bordered,
.sub-cont table.table-bordered td,
.sub-cont table.table-bordered th {
    border: 1px solid #e9ecef;
    vertical-align: middle;
}

.sub-cont table td.td_tit {
    background: #f4f4f4;
}



/******* 이미지/텍스트 레이아웃 *******/
.img-text .img {
    float: left;
    padding-right: 30px;
}

.img-text .img-right {
    float: right;
    padding-right: 0px;
    padding-left: 30px;
}

/******* a *******/
.a-cont .tit-type3,
.a-cont .tit-type6,
.a-cont .color {
    color: #7459b9;
}

.a-cont .tit-type3 span,
.a-cont .tit-type6::before,
.a-cont .box-type1 dt,
.a-cont .box-type2 dt,
.a-cont table thead th,
.a-cont .list-dot li::before,
.a-cont .bg {
    background: #7459b9;
}

.a-cont .box-type1>dl>dd {
    border-color: #7459b9;
}

/******* b *******/
.b-cont .tit-type2::before {
    filter: hue-rotate(325deg);
}

.b-cont .tit-type2,
.b-cont .tit-type3,
.b-cont .tit-type4,
.b-cont .tit-type6 .b-cont .color {
    color: #3870cc;
}

.b-cont .tit-type3 span,
.b-cont .tit-type4 span,
.b-cont .tit-type6::before,
.b-cont .box-type1 dt,
.b-cont .box-type2 dt,
.b-cont table thead th,
.b-cont .list-type2>li::before,
.b-cont .list-dot li::before,
.b-cont .bg {
    background: #3870cc;
}

.b-cont .list-type2 {
    background: #f5f9ff;
}


/******* c *******/
.c-cont .color {
    color: #e4756e;
}

/******* e *******/
.e-cont .tit-type2::before {
    filter: hue-rotate(215deg);
}

.e-cont .tit-type2,
.e-cont .tit-type3,
.e-cont .tit-type5.color,
.e-cont .tit-type6 .e-cont .color {
    color: #7aa880;
}

.e-cont .tit-type3 span,
.e-cont .tit-type6::before,
.e-cont .box-type1 dt,
.e-cont .box-type2 dt,
.e-cont .list-type2>li::before,
.e-cont .list-dot li::before,
.e-cont .bg {
    background: #7aa880;
}

.e-cont table thead th,
.e-cont .box-type4 p.caption,
.e-cont .box-type5 p.caption {
    background: #0f9082;
}

.e-cont .list-type2 {
    background: #f5f9ff;
}

/******* g *******/
.g-cont .tit-type2::before {
    filter: hue-rotate(290deg);
}

.g-cont .tit-type2,
.g-cont .tit-type3,
.g-cont .tit-type5.color,
.g-cont .tit-type6,
.g-cont .color {
    color: #288195;
}

.g-cont .tit-type3 span,
.g-cont .tit-type6::before,
.g-cont .box-type1 dt,
.g-cont .box-type2 dt,
.g-cont .list-type2>li::before,
.g-cont .list-dot li::before,
.g-cont table thead th,
.g-cont .box-type4 p.caption,
.g-cont .box-type5 p.caption,
.g-cont .box-type8 p.caption,
.g-cont .bg {
    background: #288195;
}

.g-cont .list-type2 {
    background: #f5f9ff;
}


/******* a1  *******/

/******* a2  *******/

/******* a3  *******/

/******* a4  *******/

/******* a5  *******/

#a5 .qna-cont .q .txt{
    line-height:1.5;
}

/******* b1  *******/

/******* b2  *******/

#b2 div.mt-40:has(.tit-type5) > div{
    padding-left:20px; 
}

/******* b3  *******/

/******* b4  *******/


/******* c1 = 이달의 직업건강인 css *******/
#c1 {
    padding-top: 115px;
}

.qna-cont {
    padding: 0 40px 33px;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    margin-bottom: 60px;
}

.qna-cont .q {
    display: flex;
    align-items: flex-start;
    margin-bottom: 15px;
}

.qna-cont .q>.ico {
    display: block;
    width: 90px;
    height: 86px;
    padding-top: 25px;
    color: #fff;
    font-family: 'GmarketSansBold';
    font-size: 40px;
    text-align: center;
    transform: translate(-10px, -10px);
    background: url(../images/c1_q_bg.png) top center no-repeat;
}

.qna-cont .q .txt,
.qna-cont .a>.ico,
.point {
    color: #e4756e;
}

.qna-cont .q .txt {
    width: calc(100% - 90px);
    margin-top: 29px;
    font-size: 22px;
    font-weight: 700;
}

.qna-cont .a {
    padding-top: 18px;
    border-top: 1px dashed #d9d9d9;
    display: flex;
}

.qna-cont .a>.ico {
    padding: 0 19px;
    font-family: 'GmarketSansBold';
    font-size: 40px;
}

.qna-cont .a>div p {
    margin-bottom: 10px;
    color: #333;
    word-break: break-all !important;
}

@media (max-width: 767px) {

    .qna-cont .q,
    .qna-cont .a {
        flex-flow: column wrap;
        align-items: center;
    }

    .qna-cont .q .txt {
        width: 100%;
        text-align: center;
    }
}


/******* c2  *******/
#c2 .sub-inner .imgs {
    display: flex;
    flex-flow: column wrap;
    align-items: center;
}

#c2 .sub-inner .imgs li:not(:first-child) {
    margin-top: 15px;
}

/******* e1  *******/
#e1 {
    padding-top: 115px;
}

#e1 .col-2 {
    gap: 15px;
}

/******* e2  *******/
#e2 .col-2 {
    gap: 15px;
}

#e2 .col-3 {
    gap: 10px;
}

/******* e3  *******/

#e3 .tit-box1 h3{
    font-size:36px;
}

#e3 .pl-60{
    padding-left:60px !important;
}

/******* g1  *******/

#g1 .list-num div{
    text-indent:0;
}


/******* g2  *******/


@media screen and (max-width:768px) {
    .tit-box1 {
        flex-flow: column wrap;
    }

    .tit-box1 .writer-box {
        text-align: center;
    }

    .tit-box1 .writer-box .info {
        justify-content: center;
    }

    .tit-box1 h3,
    .tit-box2 h3 {
        font-size: 35px;
    }

    .tit-box1 .name,
    .tit-box2 .name {
        font-size: 16px;
        text-align: center;
    }

    .tit-container .info {
        font-size: 15px;
        text-align: center;
    }

    .sub-wrap p {
        font-size: 16px;
    }
}