#header {z-index: 9999}

.pcHeader {border-bottom: 1px solid #E0E0E0; background: #fff;}
.pcHeader .inner {padding: 2.3rem 0;}
.pcHeader .logo {}
.pcHeader .gnb {margin-left: 34rem; gap: 9rem;}
.pcHeader .gnb .lst {}
.pcHeader .gnb .lst span {cursor: pointer}
.pcHeader .util {gap: 2rem;}
.pcHeader .util .item {cursor: pointer;}
.pcHeader .util .lang {}
.pcHeader .util .lang .lst {width: 5.6rem; border: 1px solid #E0E0E0; border-radius: 0.3rem; padding: 0.5rem 0; margin-top: 1rem; display: none; background: #fff; z-index: 999}
.pcHeader .util .lang .lst li {}
.pcHeader .util .lang .lst li .langtxt {display: block; padding: 0.5rem 0; cursor: pointer; width: 100%; text-align: center;}
.pcHeader .util .lang .lst li .langtxt:hover {font-weight: bold;}
.pcHeader .util .login {}
.pcHeader .util .login .lst {width: 6.4rem; border: 1px solid #E0E0E0; border-radius: 0.3rem; padding: 0.5rem 0; margin-top: 1rem; display: none; background: #fff; z-index: 999}
.pcHeader .util .login .lst li {}
.pcHeader .util .login .lst li .txt {display: block; padding: 0.5rem 0; cursor: pointer; width: 100%; text-align: center;}
.pcHeader .util .login .lst li .txt:hover {font-weight: bold;}
.pcHeader .allmenu {padding: 0 10rem; min-height: 53rem; box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.2); display: none;     border-top: 1px solid #E0E0E0; background: #fff;}
.pcHeader .menuLst {}
.pcHeader .menuItem {width: 100%; padding: 4rem 0; border-left: 1px solid #E0E0E0;}
.pcHeader .menuItem:last-child {border-right: 1px solid #E0E0E0;}
.pcHeader .menuItem .tit {margin-bottom: 3rem; padding: 0 3rem;}
.pcHeader .menuItem .lst {}
.pcHeader .menuItem .lst .item {}
.pcHeader .menuItem .lst .item a {display: block; padding: 1.5rem 3rem; transition: 0.4s;}
.pcHeader .menuItem .lst .item a::before {content: ''; display: block; position: absolute; width: 4px; background: var(--fcp); height: 100%; left: 0; top: 0; opacity: 0; transition: 0.4s;}
.pcHeader .menuItem .lst .item a::after {content: ''; display: block; position: absolute; width: 2rem; height: 2rem; background: url('../img/ic_menu_arr.svg') center/contain no-repeat; top: 50%; transform: translateY(-50%); right: 4.5rem; opacity: 0; transition: 0.4s;}
.pcHeader .menuItem .lst .item:hover a {padding: 1.5rem 4.5rem; font-weight: bold; color: var(--fcp); background: #F6F6F6}
.pcHeader .menuItem .lst .item:hover a::before {opacity: 1;}
.pcHeader .menuItem .lst .item:hover a::after {opacity: 1;}

.siteMenu {padding-left: 10rem; background: #fff; display: none; z-index: 9999;}
.siteMenu .menuLst {}
.siteMenu .menuItem {width: 100%; padding: 25rem 0; border-left: 1px solid #E0E0E0; transition: 0.4s; background: #fff; left: -10rem; opacity: 0; transition: 0.4s;}
.siteMenu .menuItem.on {left: 0; opacity: 1;}
.siteMenu .menuItem .tit {margin-bottom: 3rem; padding: 0 3rem; transition: 0.4s;}
.siteMenu .menuItem .tit::before {content: ''; display: block; position: absolute; width: 2.7rem; height: 2.7rem; background: url('../img/ic_logo.svg') center/contain no-repeat; opacity: 0; transition: 0.4s; left: 3rem;}
.siteMenu .menuItem:hover {background: #F4F4F4;}
.siteMenu .menuItem:hover .tit {padding: 0 6.7rem;}
.siteMenu .menuItem:hover .tit::before {opacity: 1;}
.siteMenu .menuItem .lst {}
.siteMenu .menuItem .lst .item {}
.siteMenu .menuItem .lst .item a {display: block; padding: 1.5rem 3rem; transition: 0.4s;}
.siteMenu .menuItem .lst .item a::before {content: ''; display: block; position: absolute; width: 4px; background: var(--fcp); height: 100%; left: 0; top: 0; opacity: 0; transition: 0.4s;}
.siteMenu .menuItem .lst .item:hover a {padding: 1.5rem 4.5rem; font-weight: bold; color: var(--fcp);}
.siteMenu .menuItem .lst .item:hover a::before {opacity: 1;}
.siteMenu .closeBtn {top: 3.2rem; right: 10rem; z-index: 1;}

@media all and (max-width: 880px){
    #header {}

    .moHeader {}
    .moHeader .moHead {z-index: 1; background: #fff; border-bottom: 1px solid #E0E0E0}
    .moHeader .moHead .inner {padding: 2rem 0}
    .moHeader .moHead .logo {width: 33rem;}
    .moHeader .moHead .menuBtn {width: 5.4rem;}
    .moHeader .moArea {background: #fff; padding-top: 10rem; display: none;}
    .moHeader .moArea .inner {height: 100%;}
    .moHeader .moArea .login {border: 1px solid #E0E0E0; border-right: 0; border-left: 0;}
    .moHeader .moArea .login .link {flex: 1; text-align: center; padding: 2.45rem 0;}
    .moHeader .moArea .login .link:last-child {border-left: 1px solid #E0E0E0}
    .moHeader .moArea .gnb {}
    .moHeader .moArea .gnbLst {}
    .moHeader .moArea .gnbLst .tit {padding: 3rem; border-bottom: 1px solid #E0E0E0; transition: 0.4s;}
    .moHeader .moArea .gnbLst .tit::before {content: ''; display: block; position: absolute; width: 3.7rem; height: 3.7rem; background: url('../img/ic_logo.svg') center/contain no-repeat; left: 3rem; opacity: 0; transition: 0.4s;}
    .moHeader .moArea .gnbLst .tit img {width: 3.7rem; transition: 0.4s;}
    .moHeader .moArea .gnbLst .lnb {padding: 2rem 0; background: #F4F4F4; display: none;}
    .moHeader .moArea .gnbLst .lnbLst {}
    .moHeader .moArea .gnbLst .lnbLst a {display: block; padding: 2.6rem 3rem;}
    .moHeader .moArea .lang {margin-top: auto; border-top: 1px solid #E0E0E0}
    .moHeader .moArea .lang .btn {padding: 2.45rem 0; text-align: center; flex: 1;}
    .moHeader .moArea .lang .btn:last-child {border-left: 1px solid #E0E0E0}
    .moHeader .moArea .lang .btn.on {font-weight: bold; color: #212121;}

    .moHeader .moArea .gnbLst .tit.act {padding-left: 7.7rem; color: var(--fcp)}
    .moHeader .moArea .gnbLst .tit.act::before {opacity: 1;}
    .moHeader .moArea .gnbLst .tit.act img {transform: scaleY(-1);}
}

#float {z-index: 999; display: flex; flex-direction: column;}
#float .link {width: 5rem; height: 14rem; display: block;}
#float .link .txt {display: inline-block; position: absolute; width: max-content; top: 5rem; transform: rotate(270deg); transition: 0.4s;}
#float .link .ico {top: 65%; left: 55%; transform: translateX(-50%); position: absolute; transition: 0.4s;}
#float .link:hover .txt {top: 6.2rem;}
#float .link:hover .ico {opacity: 0}
#float .inqLink {background: #CE000C}
#float .locaLink {background: #111111;}
#float .top {background: #555555; width: 5rem; height: 5rem; display: grid; place-items: center;}
#float .top .txt {opacity: 1; transition: 0.4s;}
#float .top .ico {opacity: 0; transition: 0.4s;}
#float .top:hover .txt {opacity: 0}
#float .top:hover .ico {opacity: 1;}

@media all and (max-width: 880px){
    #float {z-index: 999; top: 35%;}
    #float .link {width: 6rem; height: 15rem;}
    #float .link .txt {font-size: 1.8rem;}
    #float .link .ico {width: 2.2rem;}
    #float .inqLink {}
    #float .locaLink {}
    #float .top {width: 6rem; height: 6rem; font-size: 1.8rem;}
    #float .top .ico {}
}

#footer {border-top: 1px solid #E0E0E0; background: #fff}
#footer .inner {padding: 4rem 0;}
#footer .logo {width: 26rem;}
#footer .panel {margin-left: 10rem;}
#footer .panel .btns {margin-bottom: 1rem; gap: 1.5rem;}
#footer .panel .btns li {cursor: pointer;}
#footer .panel .info {}
#footer .panel .info .infoLst {}
#footer .panel .info .infoLst .opt {padding-right: 1rem; margin-right: 1rem;}
#footer .panel .info .infoLst .opt::after {content: '|'; display: block; position: absolute; right: 0; top: 0;}
#footer .panel .info .infoLst .sub {}
#footer .panel .info .infoLst .sub span + span {padding-left: 1rem}
#footer .siteBtn {}
#footer .siteBtn .tit {border: 1px solid #E0E0E0; padding: 1.35rem 2rem; gap: 4.2rem; cursor: pointer; line-height: 1;}
#footer .siteBtn .tit img {transition: 0.4s;}
#footer .siteBtn .tit.act {background: #F1F1F1; border: 1px solid #F1F1F1;}
#footer .siteBtn .tit.act img {transform: scaleY(-1);}
#footer .siteBtn .link {bottom: calc(100% + 5px); display: none;}
#footer .siteBtn .link .lst {background: #fff;}
#footer .siteBtn .link .lst a {border: 1px solid #E0E0E0; padding: 1.4rem 2rem; line-height: 1;}

#footer .panel .info .infoLst.en {flex-direction: column;}
#footer .panel .info .infoLst.en + .infoLst.en {margin-top: 1rem;}
#footer .panel .info .infoLst.en .opt {padding: 0; margin: 0;}
#footer .panel .info .infoLst.en .opt::after {display: none;}

@media all and (max-width: 880px){
    #footer {}
    #footer .inner {flex-direction: column; align-items: center; padding: 8rem 0; gap: 5rem;}
    #footer .logo {width: 31.7rem;}
    #footer .panel {margin: 0;}
    #footer .panel .btns {justify-content: center; margin-bottom: 3rem; font-size: 2.2rem;}
    #footer .panel .btns li {cursor: pointer;}
    #footer .panel .info {font-size: 2rem; display: flex; flex-direction: column; gap: 3rem;}
    #footer .panel .info .infoLst {flex-direction: column; align-items: center; gap: 0.5rem;}
    #footer .panel .info .infoLst .opt {padding: 0; margin: 0;}
    #footer .panel .info .infoLst .opt::before {display: none;}
    #footer .panel .info .infoLst .sub {text-align: center; line-height: 1.4;}
    #footer .panel .info .infoLst .sub span + span {padding-left: 1.5rem;}
    #footer .siteBtn {margin: auto}
    #footer .siteBtn .tit {font-size: 1.8rem; padding: 2rem; gap: 6.5rem;}
    #footer .siteBtn .tit img {width: 1.5rem;}
    #footer .siteBtn .link {}
    #footer .siteBtn .link .lst {}
    #footer .siteBtn .link .lst a {font-size: 1.8rem; padding: 2rem;}
}


/*================
메인
================*/
#main {height: 100vh;}
#main .nav {z-index: 9; height: calc(100% - 9.3rem); bottom: 0;}
#main .navLst {height: 100%; display: flex; flex-direction: column;}
#main .navLst .lst {background: rgba(0,0,0,0.5); flex: 1; width: 27rem; transition: 0.4s;}
#main .navLst .lst + .lst {border-top: 1px solid rgba(255,255,255,0.15);}
#main .navLst .lst a {display: flex; height: 100%; flex-direction: column; justify-content: center; padding-left: 3rem; transition: 0.4s;}
#main .navLst .lst a::before {content: ''; display: block; position: absolute; width: 1.9rem; height: 1.9rem; background: url('../img/ic_main_nav.svg') center/contain; top: 3.2rem; transition: 0.4s; opacity: 0}
#main .navLst .lst .tit {line-height: 1.6}
#main .navLst .lst .wrt {opacity: 0.6; line-height: 1.6}
#main .navLst .lst:hover {background: #CE333C; background: linear-gradient(180deg,rgba(206, 51, 60, 1) 0%, rgba(121, 0, 7, 1) 100%);}
#main .navLst .lst:hover a {padding-top: 2rem;}
#main .navLst .lst:hover a::before {opacity: 1;}
#main .mainSwiper {overflow: hidden; height: 100%; position: relative;}
#main .mainSwiper .progress {top: 35rem; left: 36rem; z-index: 9; gap: 1.4rem;}
#main .mainSwiper .progress .num {font-size: 16px}
#main .mainSwiper .progress .cur {font-size: 16px}
#main .mainSwiper .progress .count {opacity: 0.5;font-size: 16px}
#main .mainSwiper .progress .bar {width: 9rem; height: 2px; background: rgba(255,255,255,0.7); border-radius: 1rem;}
#main .mainSwiper .progress .bar .progBar {background: #CD010C; border-left: 1rem; display: block; height: 100%; transition: 0.4s; transition-property: width; transition-timing-function: linear;}
#main .mainSwiper .slide {position: relative;}
#main .mainSwiper .slide > a {display: block; width: 100%; height: 100%;}
#main .mainSwiper .slide .imgArea {height: 100%;}
#main .mainSwiper .slide .imgArea img {height: 100%; object-fit: cover;}
#main .mainSwiper .slide .txtArea {z-index: 9; left: 36rem; top: 42.5rem; display: block;}
#main .mainSwiper .slide .txtArea .tit {text-shadow: 0 0.5rem 1rem rgba(0,0,0,0.3);}
#main .mainSwiper .slide .txtArea .wrt {padding-top: 2.5rem; opacity: 0.8}
#main .notc {padding: 3rem; background: rgba(255,255,255,0.1); gap: 2.8rem; left: 36rem; bottom: 8rem; z-index: 9; backdrop-filter: blur(50px); -webkit-backdrop-filter: blur(50px); border-radius: 0.5rem; width: 146rem; max-width: 146rem; box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15);}
#main .notc .tit {gap: 0.8rem; flex-shrink: 0}
#main .notc .tit .ico {width: 2.7rem;}
#main .notc .lst {width: 100%; min-width: 0;}
#main .notc .lst .item {flex: 1 1 0; min-width: 0;}
#main .notc .lst .item a {display: block;}
#main .notc .lst .item a  .subj {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; width: 90%; line-height: 1.6;}
#main .notc .lst .item a  .date {opacity: 0.5; line-height: 1.6; padding-top: 0.8rem;}

#main .navLst .lst.tt a::before {top: 2rem;}

@media all and (max-width: 880px){
    #main {}
    #main .nav {width: 100%; height: auto;}
    #main .navLst {width: 100%; flex-direction: row; flex-wrap: wrap;}
    #main .navLst .lst {width: calc(100% / 3); flex: auto;}
    #main .navLst .lst + .lst {border: 0;}
    #main .navLst .lst:nth-child(4),
    #main .navLst .lst:nth-child(5),
    #main .navLst .lst:nth-child(6) {border-top: 1px solid rgba(255,255,255,0.15);}
    #main .navLst .lst a {padding: 3.4rem 2rem 3.4rem 3rem; justify-content: flex-start;}
    #main .navLst .lst a::before {display: none;}
    #main .navLst .lst:hover a {padding: 3.4rem 2rem 3.4rem 3rem;}
    #main .navLst .lst .tit {font-size: 2.4rem;}
    #main .navLst .lst .wrt {font-size: 2rem;}
    #main .mainSwiper {}
    #main .mainSwiper .progress {width: 100%; left: 50%; transform: translateX(-50%); max-width: var(--innerMo); top: auto; bottom: calc(144vw + env(safe-area-inset-bottom));}
    #main .mainSwiper .progress .num {font-size: 2.4rem;}
    #main .mainSwiper .progress .cur {}
    #main .mainSwiper .progress .count {}
    #main .mainSwiper .progress .bar {width: 12rem; height: 4px;}
    #main .mainSwiper .slide {min-height: 60vh; position: relative;}
    #main .mainSwiper .slide .imgArea {position: relative; z-index: 1;}
    #main .mainSwiper .slide .imgArea img {}
    #main .mainSwiper .slide .txtArea {
        position: absolute;
        top: auto;
        bottom: calc(82vw + env(safe-area-inset-bottom));
        left: 50%;
        transform: translateZ(0) translateX(-50%);
        width: 100%;
        max-width: 92%;
        z-index: 99;
        -webkit-font-smoothing: antialiased;
        backface-visibility: hidden;
        will-change: transform;
    }
    #main .mainSwiper .slide .txtArea .tit {font-size: 5.4rem; line-height: 1.4; max-width: 90%; -webkit-transform: translateZ(0); transform: translateZ(0);}
    #main .mainSwiper .slide .txtArea .wrt {font-size: 3rem; line-height: 1.6; padding-top: 4rem; max-width: 90%; -webkit-transform: translateZ(0); transform: translateZ(0);}
    #main .notc {max-width: var(--innerMo); width: var(--innerMo); left: 50%; transform: translateX(-50%); bottom: 41rem; gap: 0;}
    #main .notc .tit {font-size: 3rem;}
    #main .notc .tit .ico {}
    #main .notc .lst {}
    #main .notc .lst .item {}
    #main .notc .lst .item:not(:first-child) {display: none;}
    #main .notc .lst .item a {padding: 0 3rem;}
    #main .notc .lst .item a  .subj {width: 100%; font-size: 2.2rem;}
    #main .notc .lst .item a  .date {font-size: 1.8rem}
}


/*================
서브공통
================*/
#sub {padding-top: 9.3rem; align-items: flex-start;}
#sub .subNav {position: sticky; top: 20rem; flex-shrink: 0; padding: 3.5rem 3rem 4rem 2.5rem; border: 1px solid #E0E0E0; border-radius: 0 0.5rem 0.5rem 0; box-shadow: 0.3rem 0.3rem 1rem rgba(0,0,0,0.06); background: #fff; width: 18rem;}
#sub .subNav .tit {padding-bottom: 1.5rem; margin-bottom: 3rem; border-bottom: 1px solid #E0E0E0;}
#sub .subNav .lst {}
#sub .subNav .lst li {}
#sub .subNav .lst li + li {margin-top: 1.8rem;}
#sub .subNav .lst li a {transition: 0.4s;}
#sub .subNav .lst li a::before {content: ''; display: block; position: absolute; width: 6px; height: 6px; background: #CE000C; border-radius: 50%; left: 0; top: 50%; transform: translateY(-50%); opacity: 0; transition: 0.4s;}
#sub .subNav .lst li a:hover {padding-left: 1.1rem; color: #212121}
#sub .subNav .lst li a:hover::before {opacity: 1;}
#sub .subNav .lst li a.cur {padding-left: 1.1rem; color: #212121}
#sub .subNav .lst li a.cur::before {opacity: 1;}
#sub .content {min-height: 80vh; width: 100%; padding: 10rem 0 15rem;}
#sub .content .contTit {margin-bottom: 4rem; gap: 3rem;}
#sub .content .contTit .tit {line-height: 1;}
#sub .content .contTit .depth {gap: 0.6rem;}
#sub .content .contTit .depth .icoHome {}
#sub .content .contTit .depth .icoArr {}
#sub .content .contVisual {margin-bottom: 10rem;}
#sub .content .contInner {}
#sub .content .pageTit {padding-bottom: 3rem; gap: 2rem; border-bottom: 1px solid #E0E0E0;}
#sub .content .pageTit.mb120 {margin-bottom: 12rem}
#sub .content .pageTit.mb70 {margin-bottom: 7rem}
#sub .content .pageTit.mb50 {margin-bottom: 5rem;}
#sub .content .pageCont {}

@media all and (max-width: 880px){
    #sub {padding-top: 10rem;}
    #sub .subNav {display: none;}
    #sub .content {max-width: 96%;}
    #sub .content .contTit {flex-direction: column; gap: 3rem; align-items: flex-start; margin-bottom: 4.5rem;}
    #sub .content .contTit .tit {}
    #sub .content .contTit .depth {font-size: 1.9rem;}
    #sub .content .contTit .depth .icoHome {width: 2rem;}
    #sub .content .contTit .depth .icoArr {width: 1.2rem;}
    #sub .content .contVisual {margin-bottom: 7rem;}
    #sub .content .contInner {max-width: 95.83%;}
    #sub .content .pageTit {}
    #sub .content .pageTit .ico {width: 3.2rem;}
    #sub .content .pageCont {}
}

/*================
공지사항 & 문의하기
================*/
.board {}
.boardLst {}
.boardLst .util {margin-bottom: 2rem;}
.boardLst .util .count {}
.boardLst .util .searchArea {display: flex; gap: 1rem}
.boardLst .util .searchArea input {width: 28.8rem; box-shadow: none; height: 4.5rem; border: 1px solid #CCCCCC; border-radius: 0.5rem;}
.boardLst .util .searchArea .submitBtn {font-size: 1.6rem; color: #fff; width: 7rem; height: 4.5rem; background: #333333; display: grid; place-items: center; border-radius: 0.5rem;}
.boardLst .boardTable {}
.boardLst .boardTable thead {border-top: 1px solid #AAAAAA; border-bottom: 1px solid #AAAAAA;}
.boardLst .boardTable tbody {}
.boardLst .boardTable tr {height: 5.5rem;}
.boardLst .boardTable th {background: #FAFAFA; font-weight: bold;}
.boardLst .boardTable td {text-align: center; border-bottom: 1px solid #E0E0E0;}
.boardLst .boardBtns {margin-top: 5rem;}
.boardLst .boardBtns .wrtBtn {font-size: 1.4rem; width: 10rem; height: 4rem; border: 1px solid #797979; border-radius: 0.3rem; color: #353535; margin-left: auto}

.boardLst .noteTable td.num_td {width: 10rem}
.boardLst .noteTable td.num_td .note {font-weight: bold; color: #fff; display: inline-block; padding: 0.3rem 1.5rem; background: #CE000C; border-radius: 3rem;}
.boardLst .noteTable td.subj_td {text-align: left; width: auto; padding: 0 2rem;}
.boardLst .noteTable td.subj_td a {display: block; overflow: hidden; text-overflow: ellipsis;}
.boardLst .noteTable td.subj_td.lock a {padding-left: 2.1rem;}
.boardLst .noteTable td.subj_td.lock a::before {content: ''; display: block; position: absolute; width: 1.1rem; height: 1.5rem; background: url('../img/ic_lock.svg') center/contain; left: 0; top: 50%; transform: translateY(-50%);}
.boardLst .noteTable td.file_td {width: 12rem;}
.boardLst .noteTable td.date_td {width: 12rem;}
.boardLst .noteTable td.hit_td {width: 12rem;}

.boardLst .inqTable td.num_td {width: 10rem}
.boardLst .inqTable td.subj_td {text-align: left; width: auto; padding: 0 2rem;}
.boardLst .inqTable td.subj_td a {display: block; overflow: hidden; text-overflow: ellipsis;}
.boardLst .inqTable td.subj_td.lock a {padding-left: 2.1rem;}
.boardLst .inqTable td.subj_td.lock a::before {content: ''; display: block; position: absolute; width: 1.1rem; height: 1.5rem; background: url('../img/ic_lock.svg') center/contain; left: 0; top: 50%; transform: translateY(-50%);}
.boardLst .inqTable td.file_td {width: 12rem;}
.boardLst .inqTable td.user_td {width: 12rem;}
.boardLst .inqTable td.date_td {width: 12rem;}
.boardLst .inqTable td.hit_td {width: 12rem;}

.boardLst .contactBox {background: #F4F4F4; justify-content: center; padding: 3.8rem 0; border-radius: 1rem; margin-top: 10rem; gap: 7rem;}
.boardLst .contactBox .tit {}
.boardLst .contactBox .tit::before {content: ''; display: block; position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--fcp); left: -6px;}
.boardLst .contactBox .lst {gap: 4rem;}
.boardLst .contactBox .lst li {gap: 1rem;}
.boardLst .contactBox .lst li b {}
.boardLst .contactBox .lst li a {}
.boardLst .contactBox .lst li span {}

@media all and (max-width: 880px){
    .board {}
    .boardLst {}
    .boardLst .util {flex-direction: column-reverse; align-items: flex-start; gap: 3rem;}
    .boardLst .util .count {}
    .boardLst .util .searchArea {margin: auto; width: 100%;}
    .boardLst .util .searchArea input {height: 6rem; width: 100%;}
    .boardLst .util .searchArea .submitBtn {width: 8rem; height: 6rem; font-size: 2rem; flex-shrink: 0}
    .boardLst .boardTable {width: 100vw; left: -4.3%;}
    .boardLst .boardTable thead {font-size: 2.2rem;}
    .boardLst .boardTable tbody {font-size: 2.2rem;}
    .boardLst .boardTable tr {height: 7rem;}
    .boardLst .boardTable th {}
    .boardLst .boardTable td {}
    .boardLst .boardBtns {}
    .boardLst .boardBtns .wrtBtn {font-size: 1.8rem; background: #fff;}

    .boardLst .noteTable td.file_td img {width: 2.4rem;}

    .boardLst .inqTable td.num_td {width: 8rem;}
    .boardLst .inqTable td.subj_td {}
    .boardLst .inqTable td.subj_td.lock a::before {}
    .boardLst .inqTable td.file_td {width: 10rem;}
    .boardLst .inqTable td.file_td img {width: 2.4rem;}
    .boardLst .inqTable td.user_td {width: 10rem;}
    .boardLst .inqTable td.date_td {width: 10rem;}
    .boardLst .inqTable td.hit_td {width: 10rem;}

    .boardLst .contactBox {align-items: flex-start; gap: 4rem;}
    .boardLst .contactBox .tit {font-size: 2.8rem;}
    .boardLst .contactBox .tit::before {width: 0.7rem; height: 0.7rem;}
    .boardLst .contactBox .lst {flex-direction: column; gap: 2rem; font-size: 2rem;}
    .boardLst .contactBox .lst li {}
    .boardLst .contactBox .lst li b {}
    .boardLst .contactBox .lst li a {}
    .boardLst .contactBox .lst li span {}
}

.pg_wrap {margin-top: 10rem;}
.pg_wrap .pg {gap: 0.6rem;}
.pg_wrap .pg_page {width: 4.2rem; height: 4.2rem; border-radius: 0.4rem; border: 1px solid #E0E0E0; font-size: 1.6rem; color: #333; display: grid; place-items: center;}
.pg_wrap .pg_current {background: #CE000C; color: #fff; font-weight: bold;}
.pg_wrap .pg_prev {width: 7.6rem;}
.pg_wrap .pg_prev span {gap: 1rem;}
.pg_wrap .pg_next {width: 7.6rem;}
.pg_wrap .pg_next span {gap: 1rem;}

@media all and (max-width: 880px){
    .pg_wrap {}
    .pg_wrap .pg {}
    .pg_wrap .pg_page {width: 5rem; height: 5rem; font-size: 2rem;}
    .pg_wrap .pg_current {}
    .pg_wrap .pg_prev {width: 7.6rem;}
    .pg_wrap .pg_prev img {width: 0.6rem;}
    .pg_wrap .pg_next {width: 7.6rem;}
    .pg_wrap .pg_next img {width: 0.6rem;}
}

.boardView {}
.boardView .titArea {margin-bottom: 4rem; padding: 2.5rem 3rem; background: #FAFAFA; border: 1px solid #CCCCCC; border-right: 0; border-left: 0;}
.boardView .titArea .tit {line-height: 1.6rem; padding-bottom: 2rem;}
.boardView .titArea .util {gap: 3rem;}
.boardView .titArea .util .date {}
.boardView .titArea .util .hit {}
.boardView .contArea {}
.boardView .contArea p {padding-bottom: 2rem; font-size: 1.4rem;}
.boardView .contArea .temp {}
.boardView .fileArea {margin-top: 3rem;}
.boardView .fileArea .fileLst {border: 1px solid #E0E0E0; border-radius: 0.5rem; padding: 1rem 2rem;}
.boardView .fileArea .fileLst + .fileLst {margin-top: 0.5rem;}
.boardView .fileArea .fileLst .tit {gap: 0.8rem; margin-right: 3rem;}
.boardView .fileArea .fileLst .tit img {width: 2rem;}
.boardView .fileArea .fileLst .fileDown {text-decoration: underline;}
.boardView .postArea {margin-top: 10rem; border: 1px solid #212121; border-right: 0; border-left: 0;}
.boardView .postArea .postLst {padding: 1.8rem 2rem;}
.boardView .postArea .postLst+.postLst {border-top: 1px solid #E5E5E5;}
.boardView .postArea .postLst .opt {padding-right: 0rem; min-width: 8rem}
.boardView .postArea .postLst .none {display: block; color: #797979; padding: 0 2rem;}
.boardView .postArea .postLst a {display: block; padding: 0 2rem;}
.boardView .postArea .postLst .date {margin-left: auto;}
.boardView .btnArea {margin-top: 10rem; justify-content: center;}
.boardView .btnArea .linkBtn {width: 14rem; height: 6rem; display: grid; place-items: center; background: #01006A; border-radius: 1rem; font-size: 1.6rem; color: #fff; font-weight: bold;}
.boardView .answerBox {border: 1px solid #D9D9D9; border-radius: 1rem; overflow: hidden; margin-top: 10rem;}
.boardView .answerBox .titPan {background: #444444; padding: 1.5rem 2rem;}
.boardView .answerBox .titPan .tit {}
.boardView .answerBox .titPan .date {}
.boardView .answerBox .contPan {}
.boardView .answerBox .contPan textarea {border: 0; font-size: 1.8rem; width: 100%; font-family: inherit; box-shadow: none; background: none;}
.boardView .answerBox .contPan textarea:focus {outline: 0;}

@media all and (max-width: 880px){
    .boardView {}
    .boardView .titArea {margin-bottom: 2.4rem;}
    .boardView .titArea .tit {font-size: 2.6rem; line-height: normal;}
    .boardView .titArea .util {font-size: 2.2rem;}
    .boardView .titArea .util .date {}
    .boardView .titArea .util .hit {}
    .boardView .contArea {}
    .boardView .contArea p {font-size: 2.2rem;}
    .boardView .contArea .temp {}
    .boardView .fileArea {}
    .boardView .fileArea .fileLst {font-size: 2.2rem;}
    .boardView .fileArea .fileLst .tit {}
    .boardView .fileArea .fileLst .tit img {}
    .boardView .fileArea .fileLst .fileDown {}
    .boardView .postArea {}
    .boardView .postArea .postLst {font-size: 2.2rem; padding: 2.3rem 1.3rem;}
    .boardView .btnArea {}
    .boardView .btnArea .linkBtn {width: 16rem; height: 7rem; font-size: 2rem;}
    .boardView .answerBox {margin-top: 6rem;}
    .boardView .answerBox .titPan {font-size: 2.2rem;}
    .boardView .answerBox .titPan .tit {}
    .boardView .answerBox .titPan .date {}
    .boardView .answerBox .contPan {}
    .boardView .answerBox .contPan textarea {font-size: 2rem;}
}

/*================
ACCOUNT (이용안내)
================*/
.account {}

.loginArea {width: 100%;}
.loginArea .inner {max-width: 48rem; padding: 10rem 0 15rem;}
.loginArea .loginTit {margin-bottom: 7.8rem;}
.loginArea .loginTit .ico {width: 6rem; margin-bottom: 4rem;}
.loginArea .loginForm {background: #F4F5F6; padding: 4rem; display: flex; flex-direction: column;}
.loginArea .loginForm .ipt {height: 5rem; border-radius: 0.4rem; border: 1px solid #AAAAAA; padding: 0 1.5rem;}
.loginArea .loginForm .ipt + .ipt {margin-top: 0.5rem;}
.loginArea .loginForm .submitBtn {font-size: 1.6rem; color: #fff; height: 6.5rem; background: #353535; border-radius: 1rem; margin: 2rem 0;}
.loginArea .loginForm .util {}
.loginArea .loginForm .util a {}
.loginArea .loginForm .util a:last-child {padding-left: 1rem; margin-left: 1rem;}
.loginArea .loginForm .util a:last-child::before {content: ''; width: 1px; height: 1.3rem; background: #E5E5E5; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}

@media all and (max-width: 880px){
    .account {}

    .loginArea {}
    .loginArea .inner {max-width: 55rem; padding: 12rem 0 15rem;}
    .loginArea .loginTit {margin-bottom: 6rem;}
    .loginArea .loginTit .ico {margin-bottom: 3rem;}
    .loginArea .loginForm {}
    .loginArea .loginForm .ipt {font-size: 1.8rem;}
    .loginArea .loginForm .submitBtn {font-size: 1.8rem;}
    .loginArea .loginForm .util {}
    .loginArea .loginForm .util a {font-size: 1.8rem;}
}

.accPanel {}
.accPanel + .accPanel {margin-top: 10rem;}
.accPanel .accTit {margin-bottom: 2rem; padding-left: 1.4rem;}
.accPanel .accTit::before {content: ''; display: block; position: absolute; width: 4px; height: 2.4rem; background: #A80A0C; left: 0; top: 50%; transform: translateY(-50%);}

.accPanel .accTable {}
.accPanel .accTable::after {content: ''; display: block; position: absolute; width: 100%; height: 1px; top: 0; left: 0; background: #aaa}
.accPanel .accTable::before {content: ''; display: block; position: absolute; width: 100%; height: 1px; bottom: 0; left: 0; background: #aaa}
.accPanel .accTable tr {height: 6rem;}
.accPanel .accTable td {border: 1px solid #D9D9D9; border-right: 0; border-left: 0}
.accPanel .accTable .opt {width: 20rem; background: #F5F6F7; font-size: 1.6rem; font-weight: 600; padding-left: 2rem;}
.accPanel .accTable .opt .ess::after {content: '*'; color: #CB171A; padding-left: 0.3rem; position: absolute; bottom: 20%;}
.accPanel .accTable .cont {font-size: 1.4rem; padding: 0 1rem; gap: 0.5rem; align-items: center;}
.accPanel .accTable .cont .ipt {width: 100%; max-width: 45rem;}
.accPanel .accTable .cont .ipt.phone {max-width: 27.5rem;}
.accPanel .accTable .cont .ipt input {height: 4rem; border: 1px solid #D9D9D9; border-radius: 0.4rem; box-shadow: none; padding: 0 1rem; width: 100%; font-size: 1.4rem;}
.accPanel .accTable .cont .ipt .time {position: absolute; right: 1rem; top: 1rem;}
.accPanel .accTable .cont .slc {border: 1px solid #D9D9D9; padding: 1rem; font-size: 1.4rem; width: 17rem; flex-shrink: 0; color: #353535; appearance: none; -webkit-appearance: none; -moz-appearance: none; background: url('../img/ic_nav_arr.svg') right 1rem center / 1.6rem 1.6rem no-repeat;}
.accPanel .accTable .cont .btnW {min-width: 10rem; font-size: 1.4rem; color: #353535; border: 1px solid #797979; border-radius: 0.3rem; flex-shrink: 0; height: 4rem; padding: 0 1rem;}
.accPanel .accTable .cont .btnB {width: 10rem; font-size: 1.4rem; color: #fff; border: 1px solid #353535; border-radius: 0.3rem; background: #353535; flex-shrink: 0; height: 4rem;}

.accPanel .accBox {background: #F4F5F6; padding: 4rem;}
.accPanel .accBox + .accBox {margin-top: 2rem;}
.accPanel .accBox .boxTit {margin-bottom: 2rem;}
.accPanel .accBox .boxCont {padding: 2rem; background: #fff; height: 30rem; overflow-y: auto}
.accPanel .accBox .boxCont .ctit {padding-bottom: 1rem;}
.accPanel .accBox .boxCont .cwrt {line-height: 2.4rem;}

.accPanel .accBox .chkAgree {font-size: 1.6rem; margin-top: 2rem; display: flex; align-items: center; gap: 1rem; justify-content: flex-end;}
.accPanel .accBox .chkAgree input {margin: 0}

.accPanel .btnArea {gap: 0.5rem;}
.accPanel .btnArea.mt100 {margin-top: 10rem;}
.accPanel .btnArea.mt30 {margin-top: 3rem;}
.accPanel .btnArea .btnB {height: 6rem; min-width: 14rem; display: grid; place-items: center; background: #01006A; border-radius: 1rem; padding: 0 2rem;}
.accPanel .btnArea .btnW {height: 6rem; min-width: 14rem; display: grid; place-items: center; border: 1px solid #797979; border-radius: 1rem;}

.accPanel .idResult {padding: 4rem 0; background: #F4F5F6;}
.accPanel .idResult .tit {padding-bottom: 4rem;}
.accPanel .idResult .result {}

@media all and (max-width: 880px){
    .accPanel {}
    .accPanel + .accPanel {}
    .accPanel .accTit {font-size: 2.8rem;}
    .accPanel .accTit::before {}

    .accPanel .accTable {}
    .accPanel .accTable tr {height: 8rem;}
    .accPanel .accTable tr.moMore {height: 12.5rem;}
    .accPanel .accTable td {}
    .accPanel .accTable .opt {font-size: 2rem;}
    .accPanel .accTable .opt .ess {}
    .accPanel .accTable .cont {font-size: 1.8rem;}
    .accPanel .accTable .cont .txt {font-size: 2rem;}
    .accPanel .accTable .cont .ipt {max-width: 100%;}
    .accPanel .accTable .cont .ipt.phone {max-width: 100%;}
    .accPanel .accTable .cont .ipt input {height: 6rem; font-size: 1.8rem;}
    .accPanel .accTable .cont .ipt .time {top: 2rem;}
    .accPanel .accTable .cont .slc {height: 6rem; font-size: 1.8rem;}
    .accPanel .accTable .cont .prg {font-size: 1.8rem;}
    .accPanel .accTable .cont .btnW {font-size: 1.8rem; width: 13rem; height: 6rem;}
    .accPanel .accTable .cont .btnB {font-size: 1.8rem; width: 13rem; height: 6rem;}
    .accPanel .accTable .cont.mocol {flex-direction: column; align-items: flex-start;}
    .accPanel .accTable .cont.phoneCont {}

    .accPanel .accBox {}
    .accPanel .accBox + .accBox {}
    .accPanel .accBox .boxTit {font-size: 2.2rem;}
    .accPanel .accBox .boxCont {}
    .accPanel .accBox .boxCont .ctit {font-size: 1.8rem;}
    .accPanel .accBox .boxCont .cwrt {font-size: 1.6rem;}

    .accPanel .accBox .chkAgree {font-size: 2rem;}
    .accPanel .accBox .chkAgree input {width: 2rem;}

    .accPanel .btnArea {}
    .accPanel .btnArea.mt100 {}
    .accPanel .btnArea .btnB {min-width: 16rem; height: 7rem; font-size: 2rem;}
    .accPanel .btnArea .btnW {min-width: 16rem; height: 7rem; font-size: 2rem;}
    .accPanel .btnArea .btnB.sm {min-width: 14rem; height: 6rem;}
    .accPanel .btnArea .btnW.sm {min-width: 14rem; height: 6rem;}

    .accPanel .idResult {padding: 5rem 0; margin-top: 5rem;}
    .accPanel .idResult .tit {padding-bottom: 3rem; font-size: 2.2rem;}
    .accPanel .idResult .result {font-size: 2.8rem}
}


.accPanel .accTable .adrsCont {padding: 1rem; display: flex; flex-direction: column; align-items: flex-start; gap: 1rem;}
.accPanel .accTable .adrsDiv {gap: 1rem; width: 100%; max-width: 45rem;}
.accPanel .accTable .adrsDiv .adrsBtn {border-radius: 0.5rem;}
.accPanel .accTable .adrsDiv .ipt {}
.accPanel .accTable .slcCont {}
.accPanel .accTable .slcCont select {height: 4rem; width: 100%; max-width: 45rem; appearance: none; -webkit-appearance: none; -moz-appearance: none; background: url('../img/ic_nav_arr.svg') right 1.5rem center / 1.6rem 1.6rem no-repeat; padding: 0 1rem; font-size: 1.4rem; border: 1px solid #D9D9D9; border-radius: 0.3rem;}
.accPanel .accTable .fileCont {display: flex; gap: 1rem;}
.accPanel .accTable .fileCont .fileBtn {width: 10rem; height: 4rem; background: #F0F0F0; border: 1px solid #797979; border-radius: 0.3rem;}
.accPanel .accTable .fileCont .fileName {}
.accPanel .agreeChk {margin-top: 2rem; justify-content: flex-end;}
.accPanel .agreeChk input {}
.accPanel .agreeChk label {padding-left: 1rem; cursor: pointer;}
.accPanel .agreeChk span {cursor: pointer;}

@media all and (max-width: 880px){
    .accPanel .accTable .adrsCont {}
    .accPanel .accTable .adrsDiv {}
    .accPanel .accTable .adrsDiv .adrsBtn {font-size: 2rem !important;}
    .accPanel .accTable .adrsDiv .ipt {}
    .accPanel .accTable .slcCont {}
    .accPanel .accTable .slcCont select {height: 6rem; font-size: 1.8rem; max-width: 100%;}
    .accPanel .accTable .fileCont {}
    .accPanel .accTable .fileCont .fileBtn {width: 12rem; height: 5rem; font-size: 2rem;}
    .accPanel .accTable .fileCont .fileName {font-size: 1.8rem;}
    .accPanel .agreeChk {font-size: 2rem; margin-top: 3rem;}
    .accPanel .agreeChk input {}
    .accPanel .agreeChk label {}
    .accPanel .agreeChk span {}
}

/*================
모달창
================*/
.modal {z-index: 99999; display: none}
.modal .modalBg {background: rgba(0,0,0,0.7)}
.modal .modalBox {background: #fff; border-radius: 0.4rem; min-height: 33rem; min-width: 53rem;}
.modal .modalBox .mainT {padding-top: 2rem;}
.modal .modalBox .subT {padding-top: 1.5rem;}
.modal .modalBox .wrtT {padding: 2rem; border: 1px solid #D9D9D9; border-radius: 0.4rem; max-height: 30rem; overflow-y: auto; max-width: 78rem; margin-top: 5rem; line-height: 2.4rem;}
.modal .modalBox .btns {margin-top: 5rem; gap: 0.5rem;}
.modal .modalBox .btns .mdBtnB {background: #353535; border-radius: 1rem; color: #fff; width: 10rem; height: 4rem; display: grid; place-items: center; border: 1px solid #353535}
.modal .modalBox .btns .mdBtnW {background: #fff; border-radius: 1rem; color: #353535; width: 10rem; height: 4rem; display: grid; place-items: center; border: 1px solid #797979}
.modal .modalBox .passIpt {width: 35rem; height: 4rem; box-shadow: none; border-radius: 0.5rem; margin-top: 2rem;}
.modal .modalBox .closeBtn {right: 2rem; top: 2rem; cursor: pointer;}
.modal .modalBox .closeBtn img {width: 3.4rem;}

.modalsm .modalBox {min-width: 41.2rem;}
.policyModal .modalBox {min-width: 90rem; min-height: 58rem;}

.modalA .modalBox {min-width: 64rem;}
.modalB .modalBox {min-width: 58rem;}

@media all and (max-width: 880px){
    .modal {}
    .modal .modalBg {}
    .modal .modalBox {min-width: 55.6rem; min-height: 37rem;}
    .modal .modalBox .mainT {font-size: 3rem;}
    .modal .modalBox .subT {font-size: 2rem;}
    .modal .modalBox .wrtT {max-height: 62rem; margin-top: 7rem; font-size: 1.8rem;}
    .modal .modalBox .btns {}
    .modal .modalBox .btns .mdBtnB {width: 16rem; height: 7rem; font-size: 1.8rem;}
    .modal .modalBox .btns .mdBtnW {width: 16rem; height: 7rem; font-size: 1.8rem;}
    .modal .modalBox .passIpt {height: 6rem}

    .policyModal .modalBox {min-width: 92%; padding: 0 3rem; min-height: 97rem;}
}



/*================
제품 & 상품
================*/
.prodCont {gap: 2rem;}
.prodCont .contTxt {width: 100%; background: url('../img/prod_bg.jpg') center/cover; padding: 9rem 7rem; border-radius: 1rem; overflow: hidden; display: flex; flex-direction: column; align-items: flex-start; justify-content: center;}
.prodCont .contTxt .tit {line-height: 1; padding-bottom: 4rem;}
.prodCont .contTxt .tit sup {font-size: 2rem; line-height: 1; vertical-align: super;}
.prodCont .contTxt .wrt {line-height: 1.5;opacity: 0.9; margin-bottom: 14.5rem}
.prodCont .contTxt .downBtn {border: 1px solid rgba(255,255,255,0.5); border-radius: 0.3rem; padding: 1.6rem 2rem; gap: 0.8rem; transition: 0.2s; color: #fff}
.prodCont .contTxt .downBtn:hover {background: #D5242E; border: 1px solid #D5242E; color: #fff}
.prodCont .contTxt .downBtn img {}
.prodCont .prodSwiper {width: 50rem; flex-shrink: 0; overflow: hidden; background: #f4f4f4; border-radius: 1rem;}
.prodCont .prodSwiper .slide {display: flex; align-items: center;}
.prodCont .prodSwiper .prodPrev,
.prodCont .prodSwiper .prodNext {width: 2.6rem; height: 2.6rem}
.prodCont .prodSwiper .prodPrev::after,
.prodCont .prodSwiper .prodNext::after {display: none}
.prodCont .prodSwiper .prodPrev {background: url('../img/slide_prev.svg') center/contain no-repeat;}
.prodCont .prodSwiper .prodNext {background: url('../img/slide_next.svg') center/contain no-repeat;}
.prodCont .prodSwiper .prodPg {}
.prodCont .prodSwiper .prodPg .swiper-pagination-bullet {width: 6px; height: 6px; transition: 0.2s; border-radius: 2rem;}
.prodCont .prodSwiper .prodPg .swiper-pagination-bullet-active {width: 15px; height: 6px; background: #CE000C}

.prodPanel {margin-top: 10rem;}
.prodPanel .prodTit {margin-bottom: 3rem; padding-left: 1.4rem;}
.prodPanel .prodTit::before {content: ''; display: block; position: absolute; width: 4px; height: 2.4rem; background: #A80A0C; left: 0; top: 50%; transform: translateY(-50%);}

.prodPanel .prodLst {}
.prodPanel .prodLst .lst {padding: 2.2rem 3rem; border: 1px solid #E0E0E0; border-radius: 0.5rem; gap: 2rem;}
.prodPanel .prodLst .lst + .lst {margin-top: 1rem;}
.prodPanel .prodLst .lst .t1 {}
.prodPanel .prodLst .lst .t1 sub {font-size: 1.4rem;}
.prodPanel .prodLst .lst .t2 {}
.prodPanel .prodLst .lst .t3 {}

.prodPanel .prodLst02 {padding: 3rem; border: 1px solid #E0E0E0; border-radius: 0.5rem;}
.prodPanel .prodLst02 .lst {line-height: 1.8; padding-left: 1.6rem;}
.prodPanel .prodLst02 .lst::before {content: ''; display: block; position: absolute; width: 4px; height: 4px; background: #000; border-radius: 50%; left: 0; top: 1.2rem;}

.prodPanel .prodTable01 {border-collapse: separate; border-spacing: 0.5rem;}
.prodPanel .prodTable01 thead {}
.prodPanel .prodTable01 thead tr {}
.prodPanel .prodTable01 thead th {background: #353535; border-radius: 0.5rem; height: 5rem;}
.prodPanel .prodTable01 tbody {}
.prodPanel .prodTable01 tbody tr {}
.prodPanel .prodTable01 tbody td {border: 1px solid #E0E0E0; border-radius: 0.5rem;}
.prodPanel .prodTable01 tbody td.w200 {width: 20rem;}
.prodPanel .prodTable01 tbody td .tdInn {min-height: 7rem; display: flex; align-items: center; padding: 1.4rem 3rem;}
.prodPanel .prodTable01 tbody td .lst {flex-direction: column; justify-content: center; line-height: 1.6; align-items: flex-start;}
.prodPanel .prodTable01 tbody td .lst li {padding-left: 1.6rem;}
.prodPanel .prodTable01 tbody td .lst li::before {content: ''; display: block; position: absolute; width: 4px; height: 4px; background: #000; border-radius: 50%; left: 0; top: 1rem;}
.prodPanel .prodTable01 tbody td .lst li + li {}
.prodPanel .prodTable01 tbody td .down {justify-content: center;}
.prodPanel .prodTable01 tbody td .down .downBtn {background: #F4F4F4; padding: 1.2rem 2rem; gap: 0.8rem; border-radius: 0.3rem;}
.prodPanel .prodTable01 tbody td .down .downBtn:hover {color: #fff; background: #D5242E;}
.prodPanel .prodTable01 tbody td .down .downBtn:hover img {filter: brightness(100);}

.prodPanel .prodTable02 {border-collapse: separate; border-spacing: 0.5rem;}
.prodPanel .prodTable02 td {padding: 2rem 0;}
.prodPanel .prodTable02 td.opt {width: 25rem; text-align: center; background: #F4F4F4; border-radius: 0.5rem; border: 1px solid #D9D9D9;}
.prodPanel .prodTable02 td.con {border-radius: 0.5rem; border: 1px solid #D9D9D9; padding-left: 3rem; width: 46rem;}

.prodPanel .prodTableTxt {padding-top: 1.4rem;}
.prodPanel .prodTablePrg {padding-top: 1.5rem; margin-top: 1.5rem; border-top: 1px dotted #D9D9D9}
.prodPanel .prodTablePrg .prg {background: #F4F4F4; border-radius: 0.5rem; padding: 2.4rem 3rem;}

.prodItem {margin-top: 10rem;}
.prodItem .prodTit {margin-bottom: 3rem; padding-left: 1.4rem;}
.prodItem .prodTit::before {content: ''; display: block; position: absolute; width: 4px; height: 2.4rem; background: #A80A0C; left: 0; top: 50%; transform: translateY(-50%);}

.prodItem .itemTable {}
.prodItem .itemTable thead {}
.prodItem .itemTable thead tr {}
.prodItem .itemTable thead th {height: 5rem; background: #353535;}
.prodItem .itemTable thead th:first-child {border-radius: 0.5rem 0 0 0.5rem}
.prodItem .itemTable thead th:last-child {border-radius: 0 0.5rem 0.5rem 0}
.prodItem .itemTable tbody {border-bottom: 1px dotted #E0E0E0;}
.prodItem .itemTable tbody tr {border-top: 1px dotted #E0E0E0;}
.prodItem .itemTable tbody td {}
.prodItem .itemTable tbody td.w200 {width: 20rem;}
.prodItem .itemTable tbody td .tdInn {min-height: 7rem; display: flex; align-items: center; padding: 3rem; line-height: 1.6;}
.prodItem .itemTable tbody td .lst {flex-direction: column; justify-content: center; line-height: 1.6; align-items: flex-start;}
.prodItem .itemTable tbody td .lst li {padding-left: 1.6rem;}
.prodItem .itemTable tbody td .lst li::before {content: ''; display: block; position: absolute; width: 4px; height: 4px; background: #000; border-radius: 50%; left: 0; top: 1rem;}
.prodItem .itemTable tbody td .lst li + li {}
.prodItem .itemTable tbody td .down {justify-content: center;}
.prodItem .itemTable tbody td .down .downBtn {background: #F4F4F4; padding: 1.2rem 2rem; gap: 0.8rem; border-radius: 0.3rem; color: #212121}
.prodItem .itemTable tbody td .down .downBtn:hover {color: #fff; background: #D5242E;}
.prodItem .itemTable tbody td .down .downBtn:hover img {filter: brightness(100);}

.inqInfo {margin-top: 10rem; padding: 2rem 4rem; background: #F4F4F4; border-radius: 1rem;}
.inqInfo .infoArea {gap: 4rem;}
.inqInfo .infoArea .tit {gap: 2rem; margin-right: 1rem;}
.inqInfo .infoArea .tit img {}
.inqInfo .infoArea .lst {}
.inqInfo .infoArea .lst .opt {}
.inqInfo .infoArea .lst .cont {}
.inqInfo .inqBtn {margin-left: auto;}
.inqInfo .inqBtn .link {width: 24rem; padding: 1.8rem 2.4rem; background: #fff; border: 1px solid #D9D9D9; border-radius: 1rem; justify-content: space-between;}
.inqInfo .inqBtn .link img {}
.inqInfo .inqBtn .link:hover {background: #E5232F; background: linear-gradient(90deg,rgba(229, 35, 47, 1) 0%, rgba(164, 3, 13, 1) 100%); color: #fff;}
.inqInfo .inqBtn .link:hover img {filter: brightness(100);}

@media all and (max-width: 880px){
    .prodCont {flex-direction: column;}
    .prodCont .contTxt {padding: 7rem 5rem;}
    .prodCont .contTxt .tit {font-size: 3rem;}
    .prodCont .contTxt .wrt {font-size: 2.2rem; margin-bottom: 8rem}
    .prodCont .contTxt .downBtn {font-size: 2rem;}
    .prodCont .contTxt .downBtn img {width: 2rem;}
    .prodCont .prodSwiper {width: 100%; height: 40rem;}
    .prodCont .prodSwiper .slide {}
    .prodCont .prodSwiper .slide img {height: 100%; object-fit: contain;}

    .prodPanel {}
    .prodPanel .prodTit {font-size: 2.8rem;}
    .prodPanel .prodTit::before {width: 0.4rem;}

    .prodPanel .prodLst {}
    .prodPanel .prodLst .lst {}
    .prodPanel .prodLst .lst + .lst {}
    .prodPanel .prodLst .lst .t1 {font-size: 2.2rem;}
    .prodPanel .prodLst .lst .t2 {font-size: 2.2rem;}
    .prodPanel .prodLst .lst .t3 {font-size: 2rem;}

    .prodPanel .prodLst02 {}
    .prodPanel .prodLst02 .lst {font-size: 2.2rem;}
    .prodPanel .prodLst02 .lst::before {width: 2px; height: 2px; top: 1.8rem;}

    .prodPanel .prodTable01 {}
    .prodPanel .prodTable01 thead {}
    .prodPanel .prodTable01 thead tr {}
    .prodPanel .prodTable01 thead th {font-size: 2.2rem;}
    .prodPanel .prodTable01 tbody {}
    .prodPanel .prodTable01 tbody tr {}
    .prodPanel .prodTable01 tbody td {font-size: 1.9rem; }
    .prodPanel .prodTable01 tbody td.w200 {width: auto}
    .prodPanel .prodTable01 tbody td .tdInn {min-height: 7rem; padding: 2rem;}
    .prodPanel .prodTable01 tbody td .tdInn.mh20 {min-height: 20rem;}
    .prodPanel .prodTable01 tbody td .lst {}
    .prodPanel .prodTable01 tbody td .lst li {}
    .prodPanel .prodTable01 tbody td .lst li::before {top: 1.2rem; width: 2px; height: 2px}
    .prodPanel .prodTable01 tbody td .lst li + li {}
    .prodPanel .prodTable01 tbody td .down {}
    .prodPanel .prodTable01 tbody td .down .downBtn {padding: 0; width: 6rem; height: 6rem; display: grid; place-items: center;}
    .prodPanel .prodTable01 tbody td .down .downBtn .txt {display: none;}

    .prodPanel .prodTable01 tbody td.m100 {width: 10rem;}
    .prodPanel .prodTable01 tbody td.m107 {width: 10.7rem;}
    .prodPanel .prodTable01 tbody td.m120 {width: 12rem;}
    .prodPanel .prodTable01 tbody td.m130 {width: 13rem;}
    .prodPanel .prodTable01 tbody td.m155 {width: 15.5rem;}
    .prodPanel .prodTable01 tbody td.m200 {width: 20rem;}

    .prodPanel .prodTable02 {}
    .prodPanel .prodTable02 td {font-size: 2.2rem;}
    .prodPanel .prodTable02 td.opt {width: 16rem; padding: 1.8rem 2rem; text-align: left}
    .prodPanel .prodTable02 td.con {width: 17.6rem; padding: 1.8rem 2rem;}

    .prodPanel .prodTableTxt {font-size: 2rem;}
    .prodPanel .prodTablePrg {}
    .prodPanel .prodTablePrg .prg {font-size: 2.2rem; line-height: 1.8}

    .prodItem .prodTit {font-size: 2.8rem; margin-bottom: 3.8rem;}
    .prodItem .prodTit::before {width: 0.4rem;}

    .prodItem .itemTable thead {font-size: 2.2rem;}
    .prodItem .itemTable thead th {white-space: normal; overflow-wrap: anywhere; word-break: break-word;}
    .prodItem .itemTable tbody {font-size: 2.2rem;}
    .prodItem .itemTable tbody td {width: auto; white-space: normal; overflow-wrap: anywhere; word-break: break-word;}
    .prodItem .itemTable tbody td.m100 {width: 10rem;}
    .prodItem .itemTable tbody td.m195 {width: 19.5rem;}
    .prodItem .itemTable tbody td.aa {width: 5rem;}
    .prodItem .itemTable tbody td .tdInn {padding: 3rem 1rem;}
    .prodItem .itemTable tbody td .down .txt {display: none}

    .inqInfo {padding: 4rem;}
    .inqInfo .infoArea {flex-direction: column; align-items: flex-start; gap: 1.2rem;}
    .inqInfo .infoArea .tit {font-size: 2.4rem; gap: 1.5rem; margin: 0; margin-bottom: 0.8rem;}
    .inqInfo .infoArea .tit img {width: 2.4rem;}
    .inqInfo .infoArea .lst {font-size: 2rem;}
    .inqInfo .infoArea .lst .opt {}
    .inqInfo .infoArea .lst .cont {}
    .inqInfo .inqBtn {}
    .inqInfo .inqBtn .link {font-size: 2rem;}
    .inqInfo .inqBtn .link img {width: 2.4rem;}
}

/*================
CEO 인사말
================*/
.ceo {}
.ceoPage {gap: 6.3rem;}
.ceoPage .imgArea {width: 48rem; flex-shrink: 0; border-radius: 0.5rem; overflow: hidden;}
.ceoPage .txtArea {}
.ceoPage .txtArea .tit {line-height: 1.4}
.ceoPage .txtArea .wrt {line-height: 1.6; padding: 3rem 0;}
.ceoPage .txtArea .name {gap: 1.5rem;}
.ceoBg {color: #F4F4F4; font-size: 15rem; overflow: hidden; white-space: nowrap; width: 100%; bottom: -4%; display: flex;}
.ceoBg .marquee {display: inline-block; white-space: nowrap;}

@media all and (max-width: 880px){
    .ceo {}
    .ceoPage {flex-direction: column; gap: 6rem; align-items: flex-start;}
    .ceoPage .imgArea {width: 100%;}
    .ceoPage .txtArea {}
    .ceoPage .txtArea .tit {font-size: 4rem; line-height: 1.4;}
    .ceoPage .txtArea .wrt {font-size: 2.4rem;}
    .ceoPage .txtArea .name {font-size: 2.2rem;}
    .ceoPage .txtArea .name img {width: 10rem;}
    .ceoBg {font-size: 9rem; bottom: -1%;}
    .ceoBg .marquee {}
}

/*================
연혁
================*/
.histTab {}
.histTab li {flex: 1; padding: 2.3rem 0; border: 1px solid #D9D9D9; border-radius: 1rem 1rem 0 0; transition: 0.2s; cursor: pointer;}
.histTab li:hover {color: #212121}
.histTab li.on {color: #fff; background: #CE000C; background: linear-gradient(90deg,rgba(206, 0, 12, 1) 0%, rgba(139, 0, 8, 1) 100%);}

.hisPanel {margin-top: 9.5rem; --lineH: 0%;}
.hisPanel::before {content: ''; display: block; position: absolute; width: 1px; height: 100%; background: #E0E0E0; left: 39%; top: 0}
.hisPanel::after {content: ''; display: block; position: absolute; width: 1px; background: #01006A; left: 39%; top: 0; height: var(--lineH); transition: height 0.15s linear;}
.hisPanel .panel {gap: 16rem;}
.hisPanel .panel::before {content: ''; display: block; position: absolute; width: 1.4rem; height: 1.4rem; background: url('../img/hist_cir.svg') center/contain no-repeat; left: 38.6%;}
.hisPanel .panel + .panel {margin-top: 10rem}
.hisPanel .panel .imgArea {border-radius: 0.5rem; overflow: hidden; width: 48rem; flex-shrink: 0;}
.hisPanel .panel .lstArea {width: 100%; max-width: 80rem;}
.hisPanel .panel .lstArea .lst {gap: 3rem;}
.hisPanel .panel .lstArea .lst + .lst {padding-top: 2rem; margin-top: 2rem; background: url('../img/hist_line.png') no-repeat;}
.hisPanel .panel .lstArea .lst .year {padding: 1rem 2rem; background: #F4F5F6; border-radius: 10rem;}
.hisPanel .panel .lstArea .lst .detail {}
.hisPanel .panel .lstArea .lst .detail .item {gap: 1rem;}
.hisPanel .panel .lstArea .lst .detail .item + .item {margin-top: 1rem;}
.hisPanel .panel .lstArea .lst .detail .item .month {width: 5.5rem; text-align: center; padding-left: 1.5rem; flex-shrink: 0}
.hisPanel .panel .lstArea .lst .detail .item .month::before {content: ''; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 1rem; height: 0.6rem; background: url('../img/hist_ic.svg') center/contain no-repeat;}
.hisPanel .panel .lstArea .lst .detail .item .cont {}

@media all and (max-width: 880px){
    .histTab {}
    .histTab li {flex: 1; padding: 2.3rem 0;}
    .histTab li.on {}

    .hisPanel {padding-left: 7%;}
    .hisPanel::before {left: 1%;}
    .hisPanel::after {left: 1%;}
    .hisPanel .panel {flex-direction: column; gap: 5rem;}
    .hisPanel .panel::before {width: 1.8rem; height: 1.8rem; left: -7.7%;}
    .hisPanel .panel + .panel {margin-top: 15rem;}
    .hisPanel .panel .imgArea {width: 100%;}
    .hisPanel .panel .lstArea {}
    .hisPanel .panel .lstArea .lst {}
    .hisPanel .panel .lstArea .lst .year {font-size: 2.4rem;}
    .hisPanel .panel .lstArea .lst .detail {}
    .hisPanel .panel .lstArea .lst .detail .item {}
    .hisPanel .panel .lstArea .lst .detail .item + .item {}
    .hisPanel .panel .lstArea .lst .detail .item .month {font-size: 2.2rem;}
    .hisPanel .panel .lstArea .lst .detail .item .month::before {}
    .hisPanel .panel .lstArea .lst .detail .item .cont {font-size: 2.2rem;}
}

/*================
ESG
================*/
.esgBanner {margin-bottom: 10rem;}
.esgBanner .imgArea {}
.esgBanner .txtArea {left: 9rem}
.esgBanner .txtArea .tit {padding-bottom: 1.5rem;}
.esgBanner .txtArea .wrt {line-height: 1.6}
.esgTab {}
.esgTab li {flex: 1; padding: 2.3rem 0; border: 1px solid #D9D9D9; border-radius: 1rem 1rem 0 0; transition: 0.2s; cursor: pointer;}
.esgTab li:hover {color: #212121}
.esgTab li.on {color: #fff; background: #CE000C; background: linear-gradient(90deg,rgba(206, 0, 12, 1) 0%, rgba(139, 0, 8, 1) 100%);}
.esgPanel {}
.esgPanel .panel {display: none}
.esgPanel .panel.act {display: block;}
.esgPanel .cont01 {margin: 10rem 0;}
.esgPanel .cont01.mb70 {margin-bottom: 7rem}
.esgPanel .cont01 .ico {}
.esgPanel .cont01 .tit {padding: 3rem 0 0.8rem; line-height: 1.6;}
.esgPanel .cont01 .wrt {line-height: 1.5; color: #333}
.esgPanel .cont02 {}
.esgPanel .cont02 .tit {padding-left: 1.4rem;}
.esgPanel .cont02 .tit.mb40 {margin-bottom: 4rem;}
.esgPanel .cont02 .tit::before {content: ''; display: block; position: absolute; width: 0.4rem; height: 70%; background: #A80A0C; left: 0; top: 50%; transform: translateY(-50%);}
.esgPanel .cont02 .wrt {padding: 2rem 0 4rem; color: #333;}
.esgPanel .cont02 .lst {padding: 5rem; border: 1px solid #E0E0E0; border-top: 2px solid #212121}
.esgPanel .cont02 .lst li {display: flex; align-items: center; gap: 2rem;}
.esgPanel .cont02 .lst li + li {margin-top: 1.7rem;}
.esgPanel .cont02 .lst li span {font-size: 1.6rem; padding: 0.7rem 2rem; background: #F4F4F4; border-radius: 2rem; display: inline-block; flex-shrink: 0}
.esgPanel .cont03 {margin-top: 10rem}
.esgPanel .cont03 .tit {padding-left: 1.4rem; margin-bottom: 3rem;}
.esgPanel .cont03 .tit::before {content: ''; display: block; position: absolute; width: 0.4rem; height: 70%; background: #A80A0C; left: 0; top: 50%; transform: translateY(-50%);}
.esgPanel .cont03 .boxArea {gap: 4rem}
.esgPanel .cont03 .boxArea .box {padding: 5rem; border: 1px solid #E0E0E0; border-top: 2px solid #212121; width: calc((100% - 4rem) / 2);}
.esgPanel .cont03 .boxArea .btit {margin-bottom: 2rem; display: flex; align-items: center; gap: 1rem; color: #000E6E}
.esgPanel .cont03 .boxArea .btit img {width: 2.2rem;}
.esgPanel .cont03 .boxArea .blst {}
.esgPanel .cont03 .boxArea .blst li {display: flex; align-items: baseline; gap: 0.8rem;}
.esgPanel .cont03 .boxArea .blst li + li {margin-top: 1rem;}
.esgPanel .cont03 .boxArea .blst li i {display: inline-block; width: 0.4rem; height: 0.4rem; background: #212121; border-radius: 50%; top: -0.4rem;}
.esgPanel .cont04 {margin-bottom: 10rem;}
.esgPanel .cont04 .imgArea {max-width: 123.5rem; margin: 0 auto;}

@media all and (max-width: 880px){
    .esgBanner {}
    .esgBanner .txtArea {left: 4rem;}
    .esgBanner .txtArea .tit {}
    .esgBanner .txtArea .wrt {font-size: 2.4rem;}
    .esgTab {}
    .esgTab li {flex: 1; padding: 0.6rem 0; line-height: 1.4;}
    .esgPanel .cont01 {}
    .esgPanel .cont01 .ico {width: 5.8rem;}
    .esgPanel .cont01 .tit {font-size: 3.6rem;}
    .esgPanel .cont01 .wrt {font-size: 2.2rem;}
    .esgPanel .cont02 {}
    .esgPanel .cont02 .tit {font-size: 2.8rem;}
    .esgPanel .cont02 .wrt {font-size: 2.2rem; line-height: 1.5;}
    .esgPanel .cont02 .lst {}
    .esgPanel .cont02 .lst li {font-size: 2.2rem; align-items: flex-start; line-height: 1.6;}
    .esgPanel .cont02 .lst li + li {margin-top: 4rem;}
    .esgPanel .cont02 .lst li span {font-size: 2rem; line-height: 1; top: 0.5rem;}
    .esgPanel .cont03 {}
    .esgPanel .cont03 .tit {font-size: 2.8rem;}
    .esgPanel .cont03 .boxArea {flex-direction: column;}
    .esgPanel .cont03 .boxArea .box {width: 100%; min-height: 37.6rem;}
    .esgPanel .cont03 .boxArea .btit {font-size: 2.4rem;}
    .esgPanel .cont03 .boxArea .blst {font-size: 2.2rem;}
    .esgPanel .cont03 .boxArea .blst li {line-height: 1.8}
    .esgPanel .cont04 {}
    .esgPanel .cont04 .imgArea {}
}


/*================
찾아오시는 길
================*/
.locaBox {}
.locaBox + .locaBox {margin-top: 10rem;}
.locaBox .locaTit {margin-bottom: 2rem; padding-left: 1.4rem;}
.locaBox .locaTit::before {content: ''; display: block; position: absolute; width: 4px; height: 2.4rem; background: #A80A0C; left: 0; top: 50%; transform: translateY(-50%);}
.locaBox .mapArea {}
.locaBox .locaInfo {max-width: 131.7rem; height: 20rem; border-radius: 0.5rem; padding: 0 10rem; left: 50%; transform: translateX(-50%); margin-top: -10rem; z-index: 1;}
.locaBox .locaInfo .tit {gap: 1rem;}
.locaBox .locaInfo .lst {padding-left: 8rem; margin-left: 8rem;}
.locaBox .locaInfo .lst::before {content: ''; display: block; position: absolute; width: 1px; height: 90%; background: rgba(255,255,255,0.2); left: 0;}
.locaBox .locaInfo .lst li {display: flex; gap: 1rem; padding-left: 1.3rem;}
.locaBox .locaInfo .lst li::before {content: ''; display: block; position: absolute; width: 3px; height: 3px; background: #fff; border-radius: 50%; left: 0; left: 0; top: 1.1rem;}
.locaBox .locaInfo .lst li + li {margin-top: 0.8rem;}
.locaBox .locaInfo .lst li .opt {font-weight: bold;}
.locaBox .locaInfo .lst li .con {line-height: 1.6}
.locaBox .locaInfo .link {border: 1px solid rgba(255, 255, 255, 0.5); margin-left: auto; border-radius: 0.3rem; width: 13rem; height: 5rem; display: grid; place-items: center;}
.locaBox .locaInfo .link:hover {background: #D5242E; border: 1px solid #D5242E;}

.locaBox .locaInfo .lst li .opt.ko {width: 3.2rem;}
.locaBox .locaInfo .lst li .opt.en {width: 7.3rem;}

.locaBox01 .locaInfo {background: #E5232F; background: linear-gradient(90deg,rgba(229, 35, 47, 1) 0%, rgba(164, 3, 13, 1) 100%);}
.locaBox02 .locaInfo {background: #253668; background: linear-gradient(90deg,rgba(37, 54, 104, 1) 0%, rgba(22, 30, 54, 1) 100%);}

@media all and (max-width: 880px){
    .locaBox {}
    .locaBox + .locaBox {}
    .locaBox .locaTit {font-size: 2.8rem;}
    .locaBox .locaTit::before {width: 0.4rem;}
    .locaBox .mapArea {}
    .locaBox .locaInfo {max-width: 91.3%; height: auto; flex-direction: column; align-items: flex-start; padding: 4rem;}
    .locaBox .locaInfo .tit {font-size: 3rem;}
    .locaBox .locaInfo .tit img {width: 3.1rem;}
    .locaBox .locaInfo .lst {padding: 0; margin: 0; font-size: 2.2rem; padding: 2rem 0 3rem;}
    .locaBox .locaInfo .lst::before {display: none;}
    .locaBox .locaInfo .lst li {}
    .locaBox .locaInfo .lst li + li {}
    .locaBox .locaInfo .lst li .opt {}
    .locaBox .locaInfo .lst li .con {}
    .locaBox .locaInfo .link {margin: 0; font-size: 2rem;}
    .locaBox .locaInfo .link.en {width: 15rem;}

    .locaBox .locaInfo .lst li .opt.ko {width: 4.2rem;}
    .locaBox .locaInfo .lst li .opt.en {width: 8.3rem;}
}


/*================
사업구조
================*/
.busiCont {padding-left: 8rem; gap: 21.5rem; padding-top: 2rem;}
.busiCont .cirArea {width: 40rem; height: 40rem; border-radius: 50%; background: #CE000C; background: linear-gradient(180deg,rgba(206, 0, 12, 1) 0%, rgba(139, 0, 8, 1) 100%); flex-shrink: 0; z-index: 1;}
.busiCont .cirInn {width: 34.5rem; height: 34.5rem; background: #fff; border-radius: 50%;}
.busiCont .cirInn .txt {}
.busiCont .cirInn .txt .subt {padding-bottom: 0.8rem;}
.busiCont .cirInn .txt .tit {color: #D5242E;}
.busiCont .lstArea {width: 100%;}
.busiCont .lstArea .lst {padding: 5.6rem 5rem 4.6rem; border-radius: 1rem;}
.busiCont .lstArea .lst + .lst {margin-top: 4.5rem;}
.busiCont .lstArea .lst .badge {width: 15.6rem; border-radius: 3rem; padding: 1.4rem 0; text-align: center; top: -2.5rem; left: 5%;}
.busiCont .lstArea .lst .txt {}
.busiCont .lstArea .lst .cir {left: -1rem;}
.busiCont .lstArea .lst1 {border: 2px solid #D5242E;}
.busiCont .lstArea .lst1::before {content: ''; display: block; position: absolute; width: 33rem; height: 1px; background: url('../img/busi_line_1.png') center/contain; right: 100%; top: 50%;}
.busiCont .lstArea .lst1 .badge {background: #D5242E}
.busiCont .lstArea .lst2 {border: 2px solid #212121;}
.busiCont .lstArea .lst2::before {content: ''; display: block; position: absolute; width: 33rem; height: 1px; background: url('../img/busi_line_2.png') center/contain; right: 100%; top: 50%;}
.busiCont .lstArea .lst2 .badge {background: #212121}
.busiCont .lstArea .lst3 {border: 2px solid #010069;}
.busiCont .lstArea .lst3::before {content: ''; display: block; position: absolute; width: 33rem; height: 1px; background: url('../img/busi_line_3.png') center/contain; right: 100%; top: 50%;}
.busiCont .lstArea .lst3 .badge {background: #010069}

.busiCont .lstArea .lst.en {padding: 4rem 5rem 3rem;}

@media all and (max-width: 880px){
    .busiCont {flex-direction: column; padding: 0; gap: 10.5rem;}
    .busiCont .cirArea {}
    .busiCont .cirInn {}
    .busiCont .cirInn .txt {}
    .busiCont .cirInn .txt .subt {font-size: 2rem;}
    .busiCont .cirInn .txt .tit {font-size: 3rem; line-height: 1.4}
    .busiCont .lstArea {}
    .busiCont .lstArea .lst {height: 13rem; display: flex; align-items: center; padding: 0 5rem;}
    .busiCont .lstArea .lst::before {display: none;}
    .busiCont .lstArea .lst + .lst {}
    .busiCont .lstArea .lst .badge {width: 14.6rem; font-size: 2.4rem; padding: 1rem 0;}
    .busiCont .lstArea .lst .badge.en {width: auto; padding: 1rem 2rem;}
    .busiCont .lstArea .lst .txt {font-size: 2.2rem;}
    .busiCont .lstArea .lst .cir {display: none;}

    .busiCont .lstArea .lst1 .cir {display: block; width: 2rem; left: 50%; transform: translateX(-50%); bottom: 95%; top: auto;}
    .busiCont .lstArea .lst1 .cir img {display: block; width: 100%}
    .busiCont .lstArea .lst1::after {content: ''; display: block; position: absolute; left: 50%; bottom: 100%; width: 1px; height: 12rem; background: url('../img/busi_line_1_mo.png') center/contain;}

    .busiCont .lstArea .lst.en {padding: 4rem 4rem 3rem;}
}


/*================
특허 및 인증
================*/
.certificate {}
.certificate::before {content: ''; display: block; position: absolute; width: 100%; height: 54.4%; background: url('../img/cert_bg.jpg') center/cover no-repeat; bottom: 0}
.certCont {}
.certCont .certTit {margin-bottom: 10rem; gap: 5.5rem;}
.certCont .certTit img {}
.certCont .certTit .txt {}
.certCont .certTit .txt .subt {padding-bottom: 2rem; color: #CE000C; letter-spacing: 0.6rem; text-transform: uppercase;}
.certCont .certTit .txt .tit {line-height: 1.5;}
.certCont .certTit .txt .tit span {color: #CE000C;}
.certCont .certArea {margin-top: 10rem}
.certCont .certArea .tit {margin-bottom: 2rem; padding-left: 1.4rem;}
.certCont .certArea .tit::before {content: ''; display: block; position: absolute; width: 0.4rem; height: 2.4rem; background: #A80A0C; left: 0; top: 50%; transform: translateY(-50%);}
.certCont .certArea .lst {gap: 3rem;}
.certCont .certArea .lst li {width: calc((100% - 6rem) / 3); background: #fff; padding: 4rem; min-height: 21rem; transition: 0.2s; border-radius: 1rem; overflow: hidden;}
.certCont .certArea .lst li .date {color: #CE000C; margin-bottom: 1.5rem; transition: 0.4s;}
.certCont .certArea .lst li .date::before {content: ''; display: block; position: absolute; width: 2.1rem; height: 2.7rem; left: 0; background: url('../img/cert_ic.svg') center/contain; top: 50%; transform: translateY(-50%); opacity: 0; transition: 0.4s;}
.certCont .certArea .lst li .wrt {line-height: 1.6}

.certCont .certArea .lst li:hover {background: #A4030D; background: linear-gradient(90deg,rgba(164, 3, 13, 1) 0%, rgba(229, 35, 47, 1) 100%); box-shadow: 0.4rem 0.4rem 1rem rgba(0,0,0,0.3)}
.certCont .certArea .lst li:hover .date {color: #fff; padding-left: 3.4rem;}
.certCont .certArea .lst li:hover .date::before {opacity: 1;}
.certCont .certArea .lst li:hover .wrt {color: #fff;}

@media all and (max-width: 880px){
    .certificate {}
    .certificate::before {height: 67%}
    .certificate.en::before {height: 72%;}
    .certCont {}
    .certCont .certTit {gap: 2rem; margin-bottom: 19rem;}
    .certCont .certTit img {width: 5.3rem;}
    .certCont .certTit .txt {}
    .certCont .certTit .txt .subt {font-size: 1.8rem; padding-bottom: 1.5rem;}
    .certCont .certTit .txt .tit {font-size: 3rem;}
    .certCont .certArea {}
    .certCont .certArea + .certArea {}
    .certCont .certArea .tit {font-size: 2.8rem;}
    .certCont .certArea .tit::before {}
    .certCont .certArea .lst {gap: 2rem;}
    .certCont .certArea .lst li {width: calc((100% - 2rem) / 2); min-height: 30rem;}
    .certCont .certArea .lst li .date {font-size: 2.2rem;}
    .certCont .certArea .lst li .wrt {font-size: 2.2rem;}

    .certCont .certArea .lst.en li {min-height: 44.5rem;}
}


/*================
REACH
================*/
.reachCont {}
.reachCont .tit {line-height: 1.6}
.reachCont .wrt {padding: 2rem 0 4rem; line-height: 1.6;}
.reachCont .box {padding: 6rem; background: #F4F4F4;}
.reachCont .box .btit {padding-bottom: 1rem;}
.reachCont .box .bwrt {line-height: 1.6; margin-bottom: 4rem;}
.reachCont .box .blst {gap: 1rem;}
.reachCont .box .blst li {background: #fff; border-radius: 5rem; padding: 1.3rem 3rem;}
.reachCont .box .blst li .ico {}
.reachCont .box .blst li .opt {}
.reachCont .box .blst li .con {margin-left: 2rem;}
.reachCont .box .bcon {margin-top: 4rem;}
.reachCont .desc {padding: 4rem 0; line-height: 1.6}
.reachCont .name {line-height: 1.6; text-align: right;}

@media all and (max-width: 880px){
    .reachCont {}
    .reachCont .tit {font-size: 3rem; line-height: 1.6}
    .reachCont .wrt {font-size: 2.4rem; padding: 2rem 0 5rem;}
    .reachCont .box {padding: 5rem 3.5rem;}
    .reachCont .box .btit {font-size: 2.8rem;}
    .reachCont .box .bwrt {font-size: 2.2rem;}
    .reachCont .box .blst {flex-direction: column;}
    .reachCont .box .blst li {padding: 1.3rem 2rem;}
    .reachCont .box .blst li .ico {width: 3.5rem;}
    .reachCont .box .blst li .opt {font-size: 2.2rem; flex-shrink: 0;}
    .reachCont .box .blst li .con {font-size: 2.2rem;}
    .reachCont .box .bcon {font-size: 2.2rem;}
    .reachCont .desc {font-size: 2.4rem; padding: 5rem 0;}
    .reachCont .name {font-size: 2.2rem;}
}






..