@charset "utf-8";

/* =========================== SUB */
#subBnr {
    position: relative;
    z-index: 20;
    height: 500px;
    margin: 0 auto;
    color: #fff;
    background: url(https://cep.i-on.net/img/sub/sub_bg.jpg) center no-repeat;
    background-size: cover
}

#subBnr .txt_area {
    position: relative;
    top: 50%;
    opacity: 0;
    padding-top: 30px;
    font-size: 40px;
    line-height: 45px;
    font-weight: 700;
    text-align: center
}

#subBnr .txt_area span {
    display: block;
    font-size: 18px;
    font-weight: 500;
    color: rgba(255, 255, 255, .7)
}

/* 반응형 [s] */
@media (max-width:1024px) {
    #subBnr {
        height: 330px
    }

    #subBnr .txt_area {
        top: 42%;
        font-size: 36px;
        opacity: 1 !important;
        padding-top: 0px !important
    }
}

@media (max-width:480px) {

    /* #subBnr{display:flex;justify-content:center;align-items:center;height:55px;border-bottom:1px solid #e1e1e1;background:none} */
    #subBnr {
        display: flex;
        justify-content: center;
        align-items: center;
        height: fit-content;
        border-bottom: 1px solid #e1e1e1;
        background: none
    }

    #subBnr .txt_area {
        top: 0;
        font-size: 16px;
        color: #000;
        line-height: 3
    }

    #subBnr .txt_area span {
        display: none
    }

    #openModal3Btn {
        display: block;
        margin-bottom: 10px;
    }

    #openModal4Btn {
        display: block;
        margin-bottom: 10px;
    }

    .bo_cont img {
        width: 100% !important;
        height: auto !important;
        max-width: fit-content;
    }

}

/* 반응형 [e] */




/* =========================== SNB */
#sh_aside {
    border-bottom: 1px solid #e1e1e1
}

#sh_snb {
    display: table;
    overflow: hidden;
    margin: 0 auto;
    padding-right: 18px
}

#sh_snb li {
    float: left;
    margin-left: 3px
}

#sh_snb li a {
    display: block;
    position: relative;
    height: 60px;
    padding: 0 28px;
    line-height: 60px;
    color: #222;
    letter-spacing: -.2px;
    font-size: 16px;
    -webkit-transition: all .3s;
    transition: all .3s
}

#sh_snb li a:after {
    display: block;
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 0;
    height: 3px;
    background-color: var(--primary)
}

#sh_snb li.snb_on a {
    color: #222;
    font-weight: 600
}

#sh_snb li.snb_on a:after {
    width: 100%
}

/* 반응형 [s] */
@media (max-width:1024px) {
    #sh_aside {
        /* display:none */
    }
}

/* 반응형 [e] */

/* =========================== PAGE */
#greeting {
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: -.2px;
    color: #777;
    font-family: 'Noto Sans KR'
}

#greeting .tit_area {
    padding: 0 0 40px 5%;
    font-size: 38px;
    font-weight: 100;
    line-height: 1.35;
    letter-spacing: -.5px;
    color: #222
}

#greeting .tit_area p {
    font-weight: 600
}

#greeting .img {
    height: 420px;
    background: url(https://cep.i-on.net/img/sub/greeting_img.jpg) center no-repeat;
    background-size: cover
}

#greeting .cont {
    padding: 40px 0 40px 25%
}

#greeting .cont .pl {
    white-space: pre-line
}

#greeting .cont .sign {
    margin-top: 30px;
    font-weight: 500;
    color: #222
}

#greeting .cont .sign span {
    margin-left: 20px;
    font-size: 17px
}

@media(max-width:1024px) {
    #greeting {
        font-size: 14px;
        line-height: 1.6
    }

    #greeting .tit_area {
        padding: 0;
        font-size: 28px;
        line-height: 1.4;
        color: #222;
        word-break: keep-all
    }

    #greeting .img {
        height: 200px;
        margin: 15px 0
    }

    #greeting .cont {
        padding: 0
    }

    #greeting .cont .sign {
        margin-top: 20px
    }

    #greeting .cont .sign span {
        margin-left: 0;
        font-size: 15px
    }
}

@media(max-width:768px) {
    #greeting .cont .pl {
        white-space: normal
    }
}

@media(max-width:700px) {
  #sh_snb {
    width:100% !important;
    height:60px;
    display:block !important;
    overflow-x:auto !important;
    white-space:nowrap !important;
  }

  #sh_snb li {
    display:inline-block !important;
    float:none;
    height:60px;
  }

  #sh_snb li a:after{
      botton:unset !important;
      top:0;
  }
}




@media(max-width:480px) {
    #greeting .tit_area {
        font-size: 22px
    }
}

/*
:root {
  --primary: #000000;
}
*/
.pagecommon {
    position: relative;
    padding-bottom: 100px;
    font-size: 17px;
    line-height: 1.8;
    color: #555;
    font-family: 'Pretendard';
    letter-spacing: -0.3px;
}

.pagecommon * {
    word-break: keep-all;
}

.pagecommon .pl {
    white-space: pre-line;
}

/* service 1016 added */
.pagecommon .cm_tit {
    font-size: 35px;
    font-weight: 700;
    color: var(--primary);
    font-family: var(--e-font)
}

.pagecommon .s_tit {
    margin-bottom: 10px;
    font-size: 22px;
    font-weight: 700;
    color: var(--primary)
}


#business1002 .tit_area {
    font-size: 20px;
    color: #777;
    text-align: center
}

#business1002 .tit_area span {
    font-size: 15px;
    font-weight: 600;
    color: var(--primary);
    text-transform: uppercase;
    font-family: 'Poppins'
}

#business1002 .tit_area p {
    margin: 5px 0 20px;
    font-size: 42px;
    font-weight: 700;
    color: #111
}

#business1002 .tabs {
    margin: 50px 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap
}

#business1002 .tabs li {
    cursor: pointer;
    width: 230px;
    height: 65px;
    margin-top: -1px;
    border: 1px solid #e1e1e1;
    font-size: 19px;
    font-weight: 500;
    line-height: 63px;
    color: #aaa;
    text-align: center;
    transition: all .2s
}

#business1002 .tabs li+li {
    margin-left: -1px
}

#business1002 .tabs li.on {
    color: #fff;
    border-color: var(--primary);
    background: var(--primary)
}

#business1002 .cont_wrap {
    position: relative;
    height: max-content
}

#business1002 .tab_cont {
    display: none;
    width: 100%
}

#business1002 .tab_cont ul li {
    padding: 50px 20px
}

#business1002 .tab_cont ul li:nth-child(odd) {
    background: #f5f6f8
}

#business1002 .tab_cont ul li .flex {
    display: flex;
    max-width: 1200px;
    margin: 0 auto
}

#business1002 .tab_cont ul li .img {
    width: 50%;
    height: 350px;
    background: center no-repeat;
    background-size: cover
}

#business1002 .tab_cont ul li .img.img01 {
    background-image: url(../img/sub/business1002_img01.jpg)
}

#business1002 .tab_cont ul li .img.img02 {
    background-image: url(../img/sub/business1002_img02.jpg)
}

#business1002 .tab_cont ul li .img.img03 {
    background-image: url(../img/sub/business1002_img03.jpg)
}

#business1002 .tab_cont ul li .img.img04 {
    background-image: url(../img/sub/business1002_img04.jpg)
}

#business1002 .tab_cont ul li .img.img05 {
    background-image: url(../img/sub/business1002_img05.jpg)
}

#business1002 .tab_cont ul li .img.img06 {
    background-image: url(../img/sub/business1002_img06.jpg)
}

#business1002 .tab_cont ul li .img.img07 {
    background-image: url(../img/sub/business1002_img07.jpg)
}

#business1002 .tab_cont ul li .img.img08 {
    background-image: url(../img/sub/business1002_img08.jpg)
}

#business1002 .tab_cont ul li .img.img09 {
    background-image: url(../img/sub/business1002_img09.jpg)
}

#business1002 .tab_cont ul li dl {
    display: flex;
    flex-flow: column;
    justify-content: center;
    width: 50%;
    padding-left: 5%;
    padding-right: 5%
}

#business1002 .tab_cont ul li:nth-child(even) dl {
    order: -1
}

#business1002 .tab_cont ul li dl dt p {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    font-size: 30px;
    font-weight: 700;
    line-height: 1;
    color: #111
}

#business1002 .tab_cont ul li dl dt p:before {
    content: "";
    width: 5px;
    height: 18px;
    margin-right: 15px;
    background: var(--primary)
}

#business1002 .tab_cont ul li dl dt span {
    font-size: 14px;
    font-weight: 500;
    color: #aaa;
    font-family: 'Poppins'
}

#business1002 .tab_cont ul li dl dd {
    margin-top: 35px;
    white-space: pre-line;
    line-height: 1.6;
    word-break: keep-all
}

@media(hover:hover) {
    #business1002 .tabs li:not(.on):hover {
        background: #f5f5f5
    }
}

@media(max-width:1024px) {
    .pagecommon {
        font-size: 16px
    }

    #business1002 .tit_area {
        font-size: 18px
    }

    #business1002 .tit_area p {
        font-size: 36px
    }

    #business1002 .tabs li {
        width: 200px;
        height: 60px;
        font-size: 18px;
        line-height: 58px
    }

    #business1002 .tab_cont ul li .img {
        height: 320px
    }

    #business1002 .tab_cont ul li dl dt p {
        font-size: 28px
    }

    #business1002 .tab_cont ul li dl dd {
        white-space: normal
    }
}

@media(max-width:768px) {
    #business1002 {
        font-size: 15px
    }

    #business1002 .tit_area {
        font-size: 16px
    }

    #business1002 .tit_area span {
        font-size: 13px
    }

    #business1002 .tit_area p {
        font-size: 32px
    }

    #business1002 .tabs {
        margin: 30px 0 50px
    }

    #business1002 .tabs li {
        width: 160px;
        height: 50px;
        font-size: 16px;
        line-height: 48px
    }

    #business1002 .tab_cont ul li .img {
        height: 280px
    }

    #business1002 .tab_cont ul li dl {
        padding-left: 25px
    }

    #business1002 .tab_cont ul li dl dt p {
        font-size: 25px
    }

    #business1002 .tab_cont ul li dl dt p:before {
        height: 15px
    }

    #business1002 .tab_cont ul li dl dd {
        margin-top: 20px
    }
}

@media(max-width:480px) {
    #business1002 .tit_area p {
        margin: 0 0 10px;
        font-size: 30px
    }

    #business1002 .tabs {
        padding: 0 15px;
        margin: 30px 0 40px
    }

    #business1002 .tabs li {
        width: calc(100% / 3);
        font-size: 15px
    }

    #business1002 .tab_cont ul li {
        padding: 40px 15px
    }

    #business1002 .tab_cont ul li .flex {
        display: block
    }

    #business1002 .tab_cont ul li .img {
        width: 100%
    }

    #business1002 .tab_cont ul li dl {
        width: 100%;
        padding: 30px 0 0
    }

    #business1002 .tab_cont ul li dl dt p {
        font-size: 22px
    }

    #business1002 .tab_cont ul li dl dd {
        margin-top: 15px
    }
}


.logo_gal {
    max-width: 220px;
    border: 1px solid #f1f2f4;
    border-radius: 10px;
    width: 100%;
}

.logo_gal2 {
    max-width: 280px;
    max-height: 230px;
    border: 1px solid #f1f2f4;
    border-radius: 10px;
}

.gal_cont ul li {
    float: left;
    padding: 0px 0px 30px 0px;
    line-height: 125px;
    width: 25%;
    text-align:center;
}

#business1015 .tit {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin-bottom: 180px
}

#business1015 .tit .l_cont {
    overflow: hidden;
    border-radius: 20px
}

#business1015 .tit .r_cont {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding: 70px;
    border-radius: 20px;
    background: #f2f2f2
}

#business1015 .tit .r_cont span {
    display: block;
    font-size: 35px;
    font-weight: 700;
    color: var(--primary);
    text-align: right;
    opacity: .2
}

#business1015 .tit .r_cont p {
    font-weight: 500;
    color: #111
}

#business1015 .tit .r_cont h2 {
    font-size: 35px;
    font-weight: 700;
    color: var(--primary)
}

#business1015 .tit .r_cont div {
    margin-top: 20px
}

#business1015 .cont h3 {
    margin-bottom: 30px;
    font-size: 22px;
    font-weight: 700;
    color: #111
}

#business1015 .cont dt {
    font-size: 18px;
    font-weight: 700;
    color: #111
}

#business1015 .cont>div+div {
    margin-top: 150px
}

#business1015 .box1 ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px
}

#business1015 .box1 li {
    display: flex;
    align-items: center;
    gap: 30px
}

#business1015 .box1 li div {
    display: flex;
    ;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 120px;
    border-radius: 100px;
    background: var(--primary);
    min-width: 120px;
}

#business1015 .box2 ul {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    text-align: center
}

#business1015 .box2 ul li div {
    overflow: hidden;
    margin-bottom: 20px;
    border-radius: 20px
}

#business1015 .box2 ul li dt {
    margin-bottom: 10px
}

#business1015 .box3 .num_box {
    display: flex;
    gap: 20px;
    margin-top: 50px
}

#business1015 .box3 .num_box ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    width: 70%
}

#business1015 .box3 .num_box li {
    padding: 40px;
    border-radius: 20px;
    background: #f2f2f2
}

#business1015 .box3 dl {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%
}

#business1015 .box3 dt span {
    display: block;
    font-size: 13px;
    font-weight: normal;
    color: #aaa
}

#business1015 .box3 dd {
    font-size: 18px;
    font-weight: 700;
    color: #111;
    text-align: right;
    line-height: 1
}

#business1015 .box3 dd span {
    font-size: 50px;
    font-weight: 700;
    color: #111
}

#business1015 .box3 a {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    width: 30%;
    height: 520px;
    padding: 50px;
    border-radius: 20px;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.3;
    color: rgba(255, 255, 255, .2);
    text-align: right;
    background: var(--primary) url(../img/sub/business1015_icon05.png) no-repeat -40px -30px
}

@media(hover:hover) {
    #business1015 .box3 a:hover {
        color: #fff
    }
}

@media(max-width:1024px) {
    #business1015 .cont>div+div {
        margin-top: 80px
    }

    #business1015 .tit .l_cont img {
        width: 100%
    }

    #business1015 .box2 ul li div img {
        width: 100%
    }
}

@media(max-width:768px) {

    .gal_cont ul li {
        width: 33%;
    }

    .pagecommon .pl {
        white-space: normal
    }

    #business1015 .tit {
        display: block;
        margin-bottom: 100px
    }

    #business1015 .tit .l_cont {
        height: 270px
    }

    #business1015 .tit .r_cont {
        padding: 45px
    }

    #business1015 .tit .r_cont h2 {
        font-size: 30px
    }

    #business1015 .cont h3 {
        margin-bottom: 20px;
        font-size: 20px
    }

    #business1015 .cont dt {
        font-size: 16px
    }

    #business1015 .box1 li {
        display: block;
        padding: 30px;
        border: 1px solid #e1e1e1;
        border-radius: 20px;
        text-align: center
    }

    #business1015 .box1 div {
        margin: 0 auto
    }
	.level {
      margin: 40px 0 !Important;
    }
    .org_tab {
    position: relative;
    left: 40px !Important;
    }
    #business1015 .box1 dl {
        margin-top: 10px
    }

    #business1015 .box3 .num_box {
        display: block
    }

    #business1015 .box3 .num_box ul {
        width: 100%;
        margin-bottom: 20px
    }

    #business1015 .box3 dd span {
        font-size: 35px
    }

    #business1015 .box3 a {
        width: 100%;
        height: auto;
        font-size: 25px;
        background-size: 25%;
        background-position: 30px center
    }

    #business1015 .box3 a p {
        white-space: pre-line
    }

}

@media(max-width:480px) {
    .gal_cont ul li {
        width: 50%;
    }

    .pagecommon {
        font-size: 14px
    }

    #business1015 .tit .r_cont {
        padding: 30px
    }

    #business1015 .tit .r_cont h2 {
        font-size: 25px
    }

    #business1015 .box2 ul {
        display: block
    }

    #business1015 .box2 ul li+li {
        margin-top: 30px
    }

    #business1015 .box2 ul li dt {
        margin-bottom: 0
    }

    #business1015 .box3 .num_box ul {
        display: block
    }

    #business1015 .box3 .num_box li {
        padding: 30px
    }

    #business1015 .box3 .num_box li+li {
        margin-top: 20px
    }

    #business1015 .box3 dd {
        margin-top: 20px
    }

    #business1015 .box3 dd span {
        font-size: 30px
    }
}

@media(max-width:390px) {
    #business1015 .tit {
        margin-bottom: 50px
    }

    #business1015 .tit .r_cont span {
        font-size: 35px
    }

    #business1015 .tit .r_cont h2 {
        font-size: 22px
    }

    #business1015 .box1 ul {
        display: block
    }

    #business1015 .box1 ul li+li {
        margin-top: 10px
    }

    #business1015 .box3 .num_box li+li {
        margin-top: 10px
    }
}




/* 인사말 */
#history1004 .tit_box {
    text-align: center
}

#history1004 .tit_box .tit {
    font-size: 53px;
    font-weight: 700;
    color: #000;
    font-family: 'Inter'
}

#history1004 .tit_box .tit_txt {
    margin: 13px 0 52px;
    font-size: 20px;
    white-space: pre-line
}

#history1004 .his_wrap .bg_img {
    width: 100%;
    height: 510px;
    background: url('../img/sub/history1004_bg.jpg') no-repeat center;
    background-size: cover
}

#history1004 .his_wrap .scroll {
    position: relative;
    width: 65px;
    height: 65px;
    padding-top: 12px;
    text-align: center;
    margin: -33px auto 0;
    border-radius: 100%;
    background: #f37d1e
}

#history1004 .his_wrap .scroll:before {
    position: absolute;
    left: 50%;
    bottom: -5px;
    transform: translateX(-50%) rotate(45deg);
    content: '';
    width: 15px;
    height: 15px;
    border-radius: 5px;
    background: #f37d1e
}

#history1004 .his_wrap .scroll img {
    animation: scroll 1s infinite linear
}

@keyframes scroll {
    from {
        opacity: 0;
        transform: translateY(0)
    }

    50% {
        opacity: 1;
        transform: translateY(6px)
    }

    100% {
        opacity: 0;
        transform: translateY(12px)
    }
}

#history1004 .his_list {
    position: relative;
    margin-top: 6px;
    padding: 72px 0 94px
}

#history1004 .his_list:before {
    position: absolute;
    left: 50%;
    top: 0;
    content: '';
    width: 1px;
    height: 100%;
    background: #e1e1e1
}

#history1004 .his_list dl {
    position: relative;
    width: 50%;
    margin-left: 50%;
    padding: 0 0 67px 90px
}

#history1004 .his_list dl:nth-child(2n) {
    margin-left: 0;
    margin-right: 50%;
    padding: 0 90px 67px 0;
    text-align: right
}

#history1004 .his_list dl:before {
    position: absolute;
    left: -5px;
    top: 34px;
    content: '';
    width: 11px;
    height: 11px;
    border: 3px solid #888;
    border-radius: 100%;
    background: #fff
}

#history1004 .his_list dl:nth-child(2n):before {
    left: auto;
    right: -6px
}

#history1004 .his_list dl dt {
    font-size: 45px;
    font-weight: 800;
    color: #000;
    font-family: 'Inter'
}

#history1004 .his_list dl dd {
    margin-top: 26px
}

#history1004 .his_list dl dd ul li {
    position: relative;
    padding-left: 16px;
    line-height: 37px
}

#history1004 .his_list dl:nth-child(2n) dd ul li {
    padding-left: 0;
    padding-right: 16px
}

#history1004 .his_list dl dd ul li:before {
    position: absolute;
    left: 0;
    top: 17px;
    content: '';
    width: 3px;
    height: 3px;
    background: #333
}

#history1004 .his_list dl:nth-child(2n) dd ul li:before {
    left: auto;
    right: 0
}

#history1004 .last_year {
    position: relative;
    padding-top: 47px;
    text-align: center
}

#history1004 .last_year:before {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    content: '';
    width: 15px;
    height: 15px;
    border: 5px solid #f37d1e;
    border-radius: 100%;
    background: #fff
}

#history1004 .last_year span {
    display: block;
    font-size: 45px;
    font-weight: 700;
    line-height: 50px;
    color: #000;
    font-family: 'Inter'
}

@media(max-width:1230px) {
    #history1004 .tit_box .tit {
        font-size: 45px
    }

    #history1004 .tit_box .tit_txt {
        font-size: 18px
    }

    #history1004 .his_wrap .bg_img {
        height: 330px
    }

    #history1004 .his_list dl:before {
        top: 26px
    }

    #history1004 .his_list dl dt {
        font-size: 35px
    }

    #history1004 .last_year span {
        font-size: 35px
    }
}

@media(max-width:1024px) {
    .pagecommon {
        font-size: 16px
    }

    #history1004 .tit_box .tit {
        font-size: 40px
    }

    #history1004 .his_list {
        padding: 72px 15px 65px
    }

    #history1004 .his_list dl {
        padding: 0 0 50px 50px
    }

    #history1004 .his_list dl:nth-child(2n) {
        padding: 0 50px 50px 0
    }

    #history1004 .his_list dl dt {
        font-size: 30px
    }

    #history1004 .his_list dl dd {
        margin-top: 15px
    }

    #history1004 .his_list dl dd ul li {
        line-height: 27px
    }

    #history1004 .his_list dl dd ul li+li {
        margin-top: 8px
    }

    #history1004 .his_list dl dd ul li:before {
        top: 11px
    }

    #history1004 .last_year span {
        font-size: 30px
    }
}

@media(max-width:768px) {
    .pagecommon {
        font-size: 14px
    }

    #history1004 .tit_box .tit {
        font-size: 30px
    }

    #history1004 .tit_box .tit_txt {
        margin: 13px 0 45px;
        padding: 0 30px;
        font-size: 16px;
        white-space: normal
    }

    #history1004 .his_wrap .bg_img {
        height: 220px
    }

    #history1004 .his_wrap .scroll {
        width: 45px;
        height: 45px;
        margin: -22.5px 0 0 8px;
        padding-top: 5px
    }

    #history1004 .his_wrap .scroll img {
        width: 12px
    }

    #history1004 .his_list {
        padding: 55px 15px 15px
    }

    #history1004 .his_list:before {
        left: 30px
    }

    #history1004 .his_list dl {
        width: 100%;
        margin: 0 0 0 15px !important;
        padding: 0 0 50px 25px !important;
        text-align: left !important
    }

    #history1004 .his_list dl:before {
        left: -3px !important;
        right: auto !important;
        top: 16px;
        width: 7px;
        height: 7px;
        border: 2px solid #888
    }

    #history1004 .his_list dl dt {
        font-size: 23px
    }

    #history1004 .his_list dl dd ul li {
        padding: 0 0 0 16px !important
    }

    #history1004 .his_list dl dd ul li:before {
        left: 0 !important;
        right: auto !important
    }

    #history1004 .last_year {
        padding: 25px 0 0 25px;
        text-align: left
    }

    #history1004 .last_year:before {
        left: 25px;
        width: 11px;
        height: 11px;
        transform: none;
        border: 3px solid #f37d1e
    }

    #history1004 .last_year span {
        font-size: 23px
    }
}

@media(max-width:480px) {
    #history1004 .tit_box .tit {
        font-size: 25px
    }

    #history1004 .tit_box .tit_txt {
        margin: 13px 0 40px;
        padding: 0 15px;
        font-size: 15px;
        line-height: 26px
    }

    #history1004 .his_wrap .bg_img {
        height: 150px
    }

    #history1004 .his_wrap .scroll {
        width: 35px;
        height: 35px;
        padding: 0
    }

    #history1004 .his_wrap .scroll:before {
        display: none
    }

    #history1004 .his_wrap .scroll img {
        width: 9px
    }

    #history1004 .his_list {
        margin-top: 0
    }

    #history1004 .his_list:before {
        left: 25px
    }

    #history1004 .his_list dl {
        margin-left: 11px !important;
        padding: 0 0 40px 17px !important
    }

    #history1004 .his_list dl:before {
        top: 13px;
        width: 6px;
        height: 6px
    }

    #history1004 .his_list dl dt {
        font-size: 18px
    }

    #history1004 .his_list dl dd ul li+li {
        margin-top: 0
    }

    #history1004 .last_year {
        padding: 20px 0 0 20px
    }

    #history1004 .last_year:before {
        left: 22px;
        width: 7px;
        height: 7px;
        border: 2px solid #f37d1e
    }

    #history1004 .last_year span {
        font-size: 18px;
        line-height: 35px
    }
}


#service1016 .tit .txt {
    margin-bottom: 85px;
    text-align: center
}

#service1016 .tit .cm_tit {
    margin-bottom: 20px
}

#service1016 .tit .img {
    display: grid;
    grid-template-columns: repeat(2, 1fr)
}

#service1016 .tit .b_txt {
    display: flex;
    align-content: space-between;
    flex-wrap: wrap;
    padding: 70px;
    color: #fff;
    background: var(--primary)
}

#service1016 .tit .b_txt p {
    margin-bottom: 15px;
    font-size: 25px;
    font-weight: 300
}

#service1016 .tit .b_txt span {
    opacity: .5
}

#service1016 .tit .b_txt img {
    animation: rotate_image 10s linear infinite
}

#service1016 .cont {
    margin-top: 120px
}

#service1016 .cont .cm_tit {
    width: 300px
}

#service1016 .cont>div {
    display: flex;
    height: auto;
    padding: 100px 50px;
}

#service1016 .it .cm_tit {
    position: sticky;
    top: 50px
}

#service1016 .it>ul {
    width: 75%
}

#service1016 .it>ul>li+li {
    margin-top: 50px;
    padding-top: 50px;
    border-top: 1px solid #e1e1e1
}

#service1016 .it>ul>li {
    display: flex;
    justify-content: space-between;
    padding: 0 50px
}

#service1016 .it>ul>li:nth-child(2) {
    flex-direction: row-reverse
}

#service1016 .it .hash {
    display: flex;
    gap: 8px
}

#service1016 .it .hash li {
    padding: 8px 20px;
    border-radius: 50px;
    font-weight: 700;
    color: var(--primary);
    background: #f2f2f2;
    transition: all .3s
}

#service1016 .it .txt_box {
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

#service1016 .it .txt span {
    font-size: 13px;
    font-weight: 700;
    color: #aaa;
    font-family: var(--e-font)
}

#service1016 .it a {
    overflow: hidden;
    display: block;
    height: 100%;
    transition: all .3s
}

#service1016 .it a:hover {
    border-radius: 50%
}

#service1016 .wwd .arrow {
    display: flex;
    gap: 5px;
    margin-top: 20px
}

#service1016 .wwd .arrow span {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    border-radius: 50px;
    color: var(--primary);
    cursor: pointer;
    background: #f2f2f2;
    transition: all .3s
}

#service1016 .wwd .arrow svg {
    width: 18px
}

#service1016 .wwd_slide div {
    margin-top: 30px
}

#service1016 .wwd_slide img {
    width: 100%;
    border: 1px solid #f1f2f4;
}

@keyframes rotate_image {
    100% {
        transform: rotate(360deg)
    }
}


@media(hover:hover) {
    #service1016 .it .hash li:hover {
        color: #fff;
        cursor: default;
        background: var(--primary)
    }

    #service1016 .wwd .arrow span:hover {
        color: #fff;
        background: var(--primary)
    }
}

/* 반응형 [s] */
@media (max-width:1024px) {
    .pagecommon .cm_tit {
        font-size: 30px
    }

    #service1016 .tit .img_wrap img {
        width: 100%
    }

    #service1016 .tit .b_txt p {
        font-size: 23px
    }

    #service1016 .cont>div {
        padding: 70px 50px
    }

    #service1016 .it>ul>li {
        padding: 0
    }

    #service1016 .it a img {
        width: 100%
    }
}

@media (max-width:768px) {
    .pagecommon .pl {
        white-space: normal
    }

    .pagecommon .cm_tit {
        font-size: 25px
    }

    .pagecommon .s_tit {
        font-size: 18px
    }

    #service1016 .cont {
        margin-top: 50px
    }

    #service1016 .cont .cm_tit {
        width: 100%;
        text-align: center
    }

    #service1016 .cont>div {
        display: block;
        padding: 70px 20px;
        border-top: none
    }

    #service1016 .tit .txt {
        margin-bottom: 40px
    }

    #service1016 .tit .img {
        display: block
    }

    #service1016 .tit .img_wrap {
        overflow: hidden;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 230px
    }

    #service1016 .tit .b_txt {
        padding: 35px;
        text-align: center
    }

    #service1016 .tit .b_txt p {
        margin-top: 50px;
        font-size: 20px
    }

    #service1016 .tit .b_txt img {
        margin: 0 auto
    }

    #service1016 .it .cm_tit {
        height: auto
    }

    #service1016 .it .txt_box {
        width: 50%
    }

    #service1016 .it>ul {
        width: 100%;
        margin-top: 80px
    }

    #service1016 .wwd {
        background: #f2f2f2
    }

    #service1016 .wwd .arrow {
        justify-content: center
    }

    #service1016 .wwd .arrow span {
        background: #fff
    }

    #service1016 .wwd_slide {
        margin-top: 30px
    }

    #service1016 .wwd_slide div {
        text-align: center
    }
}

@media (max-width:580px) {
    #service1016 .it>ul>li {
        gap: 50px
    }

    #service1016 .it a {
        width: 50%
    }

    #service1016 .it .hash {
        flex-direction: column
    }
}

@media (max-width:480px) {
    #service1016 .it>ul {
        margin-top: 40px
    }

    #service1016 .it>ul>li {
        display: block
    }

    #service1016 .it .txt_box {
        width: 100%;
        margin-bottom: 30px;
        text-align: center;
        flex-direction: column-reverse
    }

    #service1016 .it a {
        width: 100%
    }

    #service1016 .it .hash {
        flex-direction: row;
        justify-content: center;
        margin-top: 20px
    }

    #service1016 .it>ul>li+li {
        padding-top: 0;
        border-top: none
    }
}

@media (max-width:380px) {}

/* 반응형 [e] */




.business1002 .tit_area {
    font-size: 20px;
    color: #777;
    text-align: center
}

.business1002 .tit_area span {
    font-size: 15px;
    font-weight: 600;
    color: var(--primary);
    text-transform: uppercase;
    font-family: 'Poppins'
}

.business1002 .tit_area p {
    margin: 5px 0 20px;
    font-size: 42px;
    font-weight: 700;
    color: #111
}

.business1002 .tabs {
    margin: 50px 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap
}

.business1002 .tabs li {
    cursor: pointer;
    /*width: 230px;*/
    width: fit-content;
    padding: 0px 40px;

    height: 65px;
    margin-top: -1px;
    border: 1px solid #e1e1e1;
    font-size: 19px;
    font-weight: 500;
    line-height: 63px;
    color: #aaa;
    text-align: center;
    transition: all .2s
}

.business1002 .tabs li+li {
    margin-left: -1px
}

.business1002 .tabs li.on {
    color: #fff;
    border-color: var(--primary);
    background: var(--primary)
}

.business1002 .cont_wrap {
    position: relative;
    height: max-content
}

.business1002 .tab_cont {
    display: none;
    width: 100%
}

.business1002 .tab_cont ul li {
    padding: 50px 20px
}

.business1002 .tab_cont ul li:nth-child(odd) {
    background: #f5f6f8
}

.business1002 .tab_cont ul li .flex {
    display: flex;
    max-width: 1200px;
    margin: 0 auto
}

.business1002 .tab_cont ul li .img {
    width: 50%;
    height: 350px;
    background: center no-repeat;
    background-size: cover
}

.business1002 .tab_cont ul li .img.img01 {
    background-image: url(../img/sub/business1002_img01.jpg)
}

.business1002 .tab_cont ul li .img.img02 {
    background-image: url(../img/sub/business1002_img02.jpg)
}

.business1002 .tab_cont ul li .img.img03 {
    background-image: url(../img/sub/business1002_img03.jpg)
}

.business1002 .tab_cont ul li .img.img04 {
    background-image: url(../img/sub/business1002_img04.jpg)
}

.business1002 .tab_cont ul li .img.img05 {
    background-image: url(../img/sub/business1002_img05.jpg)
}

.business1002 .tab_cont ul li .img.img06 {
    background-image: url(../img/sub/business1002_img06.jpg)
}

.business1002 .tab_cont ul li .img.img07 {
    background-image: url(../img/sub/business1002_img07.jpg)
}

.business1002 .tab_cont ul li .img.img08 {
    background-image: url(../img/sub/business1002_img08.jpg)
}

.business1002 .tab_cont ul li .img.img09 {
    background-image: url(../img/sub/business1002_img09.jpg)
}

.business1002 .tab_cont ul li dl {
    display: flex;
    flex-flow: column;
    justify-content: center;
    width: 50%;
    padding-left: 5%;
    padding-right: 5%
}

.business1002 .tab_cont ul li:nth-child(even) dl {
    order: -1
}

.business1002 .tab_cont ul li dl dt p {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    font-size: 30px;
    font-weight: 700;
    line-height: 1;
    color: #111
}

.business1002 .tab_cont ul li dl dt p:before {
    content: "";
    width: 5px;
    height: 18px;
    margin-right: 15px;
    background: var(--primary)
}

.business1002 .tab_cont ul li dl dt span {
    font-size: 14px;
    font-weight: 500;
    color: #aaa;
    font-family: 'Poppins'
}

.business1002 .tab_cont ul li dl dd {
    margin-top: 35px;
    /*white-space: pre-line;*/
    line-height: 1.6;
    word-break: keep-all
}

@media(hover:hover) {
    .business1002 .tabs li:not(.on):hover {
        background: #f5f5f5
    }
}

@media(max-width:1024px) {
    .pagecommon {
        font-size: 16px
    }

    .business1002 .tit_area {
        font-size: 18px
    }

    .business1002 .tit_area p {
        font-size: 36px
    }

    .business1002 .tabs li {
        width: 200px;
        height: 60px;
        font-size: 18px;
        line-height: 58px;
		padding: 0px 20px;
    }

    .business1002 .tab_cont ul li .img {
        height: 320px
    }

    .business1002 .tab_cont ul li dl dt p {
        font-size: 28px
    }

    .business1002 .tab_cont ul li dl dd {
        white-space: normal
    }
}

@media(max-width:768px) {
    .business1002 {
        font-size: 15px
    }

    .business1002 .tit_area {
        font-size: 16px
    }

    .business1002 .tit_area span {
        font-size: 13px
    }

    .business1002 .tit_area p {
        font-size: 32px
    }

    .business1002 .tabs {
        margin: 30px 0 50px
    }

    .business1002 .tabs li {
        width: 160px;
        height: 50px;
        font-size: 16px;
        line-height: 48px
    }

    .business1002 .tab_cont ul li .img {
        height: 280px
    }

    .business1002 .tab_cont ul li dl {
        padding-left: 25px
    }

    .business1002 .tab_cont ul li dl dt p {
        font-size: 25px
    }

    .business1002 .tab_cont ul li dl dt p:before {
        height: 15px
    }

    .business1002 .tab_cont ul li dl dd {
        margin-top: 20px
    }
}

@media(max-width:480px) {
    .business1002 .tit_area p {
        margin: 0 0 10px;
        font-size: 30px
    }

    .business1002 .tabs {
        padding: 0 15px;
        margin: 30px 0 40px
    }

    .business1002 .tabs li {
        width: calc(100% / 3);
        font-size: 15px;
		padding:0px !Important;
    }

    .business1002 .tab_cont ul li {
        padding: 40px 15px
    }

    .business1002 .tab_cont ul li .flex {
        display: block
    }

    .business1002 .tab_cont ul li .img {
        width: 100%
    }

    .business1002 .tab_cont ul li dl {
        width: 100%;
        padding: 30px 0 0
    }

    .business1002 .tab_cont ul li dl dt p {
        font-size: 22px
    }

    .business1002 .tab_cont ul li dl dd {
        margin-top: 15px
    }
}




.business1015 .tit {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    /*margin-bottom: 180px */
}

.business1015 .tit .l_cont {
    overflow: hidden;
    border-radius: 20px
}

.business1015 .tit .r_cont {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding: 70px;
    border-radius: 20px;
    background: #f2f2f2
}

.business1015 .tit .r_cont span {
    display: block;
    font-size: 35px;
    font-weight: 700;
    color: var(--primary);
    text-align: right;
    opacity: .2
}

.business1015 .tit .r_cont p {
    font-weight: 500;
    color: #111
}

.business1015 .tit .r_cont h2 {
    font-size: 35px;
    font-weight: 700;
    color: var(--primary)
}

.business1015 .tit .r_cont div {
    margin-top: 20px
}

.business1015 .cont h3 {
    margin-bottom: 30px;
    font-size: 22px;
    font-weight: 700;
    color: #111
}

.business1015 .cont dt {
    font-size: 18px;
    font-weight: 700;
    color: #111
}

.business1015 .cont>div+div {
    margin-top: 150px
}

.business1015 .box1 ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px
}

.business1015 .box1 li {
    display: flex;
    align-items: center;
    gap: 30px
}

.business1015 .box1 li div {
    display: flex;
    ;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 120px;
    border-radius: 100px;
    background: var(--primary);
    min-width: 120px;
}

.business1015 .box2 ul {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    text-align: center
}

.business1015 .box2 ul li div {
    overflow: hidden;
    margin-bottom: 20px;
    border-radius: 20px
}

.business1015 .box2 ul li dt {
    margin-bottom: 10px
}

.business1015 .box3 .num_box {
    display: flex;
    gap: 20px;
    margin-top: 50px
}

.business1015 .box3 .num_box ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    width: 70%
}

.business1015 .box3 .num_box li {
    padding: 40px;
    border-radius: 20px;
    background: #f2f2f2
}

.business1015 .box3 dl {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%
}

.business1015 .box3 dt span {
    display: block;
    font-size: 13px;
    font-weight: normal;
    color: #aaa
}

.business1015 .box3 dd {
    font-size: 18px;
    font-weight: 700;
    color: #111;
    text-align: right;
    line-height: 1
}

.business1015 .box3 dd span {
    font-size: 50px;
    font-weight: 700;
    color: #111
}

.business1015 .box3 a {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    width: 30%;
    height: 520px;
    padding: 50px;
    border-radius: 20px;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.3;
    color: rgba(255, 255, 255, .2);
    text-align: right;
    background: var(--primary) no-repeat 0px;
    /*background: var(--primary) url(../img/sub/business1015_icon05.png) no-repeat -40px -30px*/
}

@media(hover:hover) {
    .business1015 .box3 a:hover {
        color: #fff
    }
}

@media(max-width:1024px) {
    .pagecommon {
        padding: 0 15px 60px 15px;
    }

    .business1015 .cont>div+div {
        margin-top: 80px
    }

    .business1015 .tit .l_cont img {
        width: 100%
    }

    .business1015 .box2 ul li div img {
        width: 100%
    }
}

@media(max-width:768px) {
    .pagecommon .pl {
        white-space: normal
    }

    .business1015 .tit {
        display: block;
        margin-bottom: 100px
    }

    .business1015 .tit .l_cont {
        height: 270px
    }

    .business1015 .tit .r_cont {
        padding: 45px
    }

    .business1015 .tit .r_cont h2 {
        font-size: 30px
    }

    .business1015 .cont h3 {
        margin-bottom: 20px;
        font-size: 20px
    }

    .business1015 .cont dt {
        font-size: 16px
    }

    .business1015 .box1 li {
        display: block;
        padding: 30px;
        border: 1px solid #e1e1e1;
        border-radius: 20px;
        text-align: center
    }

    .business1015 .box1 div {
        margin: 0 auto
    }

    .business1015 .box1 dl {
        margin-top: 10px
    }

    .business1015 .box3 .num_box {
        display: block
    }

    .business1015 .box3 .num_box ul {
        width: 100%;
        margin-bottom: 20px
    }

    .business1015 .box3 dd span {
        font-size: 35px
    }

    .business1015 .box3 a {
        width: 100%;
        height: auto;
        font-size: 25px;
        background-size: 25%;
        background-position: 30px center
    }

    .business1015 .box3 a p {
        white-space: pre-line
    }

}

@media(max-width:480px) {
    .pagecommon {
        font-size: 14px
    }

    .business1015 .tit .r_cont {
        padding: 30px
    }

    .business1015 .tit .r_cont h2 {
        font-size: 25px
    }

    .business1015 .box2 ul {
        display: block
    }

    .business1015 .box2 ul li+li {
        margin-top: 30px
    }

    .business1015 .box2 ul li dt {
        margin-bottom: 0
    }

    .business1015 .box3 .num_box ul {
        display: block
    }

    .business1015 .box3 .num_box li {
        padding: 30px
    }

    .business1015 .box3 .num_box li+li {
        margin-top: 20px
    }

    .business1015 .box3 dd {
        margin-top: 20px
    }

    .business1015 .box3 dd span {
        font-size: 30px
    }
}

@media(max-width:390px) {
    .business1015 .tit {
        margin-bottom: 50px
    }

    .business1015 .tit .r_cont span {
        font-size: 35px
    }

    .business1015 .tit .r_cont h2 {
        font-size: 22px
    }

    .business1015 .box1 ul {
        display: block
    }

    .business1015 .box1 ul li+li {
        margin-top: 10px
    }

    .business1015 .box3 .num_box li+li {
        margin-top: 10px
    }
}




/* 인사말 */
.history1004 .tit_box {
    text-align: center
}

.history1004 .tit_box .tit {
    font-size: 53px;
    font-weight: 700;
    color: #000;
    font-family: 'Inter'
}

.history1004 .tit_box .tit_txt {
    margin: 13px 0 52px;
    font-size: 20px;
    white-space: pre-line
}

.history1004 .his_wrap .bg_img {
    width: 100%;
    height: 510px;
    background: url('../img/sub/history1004_bg.jpg') no-repeat center;
    background-size: cover
}

.history1004 .his_wrap .scroll {
    position: relative;
    width: 65px;
    height: 65px;
    padding-top: 12px;
    text-align: center;
    margin: -33px auto 0;
    border-radius: 100%;
    background: #f37d1e
}

.history1004 .his_wrap .scroll:before {
    position: absolute;
    left: 50%;
    bottom: -5px;
    transform: translateX(-50%) rotate(45deg);
    content: '';
    width: 15px;
    height: 15px;
    border-radius: 5px;
    background: #f37d1e
}

.history1004 .his_wrap .scroll img {
    animation: scroll 1s infinite linear
}

@keyframes scroll {
    from {
        opacity: 0;
        transform: translateY(0)
    }

    50% {
        opacity: 1;
        transform: translateY(6px)
    }

    100% {
        opacity: 0;
        transform: translateY(12px)
    }
}

.history1004 .his_list {
    position: relative;
    margin-top: 6px;
    padding: 72px 0 94px
}

.history1004 .his_list:before {
    position: absolute;
    left: 50%;
    top: 0;
    content: '';
    width: 1px;
    height: 100%;
    background: #e1e1e1
}

.history1004 .his_list dl {
    position: relative;
    width: 50%;
    margin-left: 50%;
    padding: 0 0 67px 90px
}

.history1004 .his_list dl:nth-child(2n) {
    margin-left: 0;
    margin-right: 50%;
    padding: 0 90px 67px 0;
    text-align: right
}

.history1004 .his_list dl:before {
    position: absolute;
    left: -5px;
    top: 34px;
    content: '';
    width: 11px;
    height: 11px;
    border: 3px solid #888;
    border-radius: 100%;
    background: #fff
}

.history1004 .his_list dl:nth-child(2n):before {
    left: auto;
    right: -6px
}

.history1004 .his_list dl dt {
    font-size: 45px;
    font-weight: 800;
    color: #000;
    font-family: 'Inter'
}

.history1004 .his_list dl dd {
    margin-top: 26px
}

.history1004 .his_list dl dd ul li {
    position: relative;
    padding-left: 16px;
    line-height: 37px
}

.history1004 .his_list dl:nth-child(2n) dd ul li {
    padding-left: 0;
    padding-right: 16px
}

.history1004 .his_list dl dd ul li:before {
    position: absolute;
    left: 0;
    top: 17px;
    content: '';
    width: 3px;
    height: 3px;
    background: #333
}

.history1004 .his_list dl:nth-child(2n) dd ul li:before {
    left: auto;
    right: 0
}

.history1004 .last_year {
    position: relative;
    padding-top: 47px;
    text-align: center
}

.history1004 .last_year:before {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    content: '';
    width: 15px;
    height: 15px;
    border: 5px solid #f37d1e;
    border-radius: 100%;
    background: #fff
}

.history1004 .last_year span {
    display: block;
    font-size: 45px;
    font-weight: 700;
    line-height: 50px;
    color: #000;
    font-family: 'Inter'
}

@media(max-width:1230px) {
    .history1004 .tit_box .tit {
        font-size: 45px
    }

    .history1004 .tit_box .tit_txt {
        font-size: 18px
    }

    .history1004 .his_wrap .bg_img {
        height: 330px
    }

    .history1004 .his_list dl:before {
        top: 26px
    }

    .history1004 .his_list dl dt {
        font-size: 35px
    }

    .history1004 .last_year span {
        font-size: 35px
    }
}

@media(max-width:1024px) {
    .pagecommon {
        font-size: 16px
    }

    .history1004 .tit_box .tit {
        font-size: 40px
    }

    .history1004 .his_list {
        padding: 72px 15px 65px
    }

    .history1004 .his_list dl {
        padding: 0 0 50px 50px
    }

    .history1004 .his_list dl:nth-child(2n) {
        padding: 0 50px 50px 0
    }

    .history1004 .his_list dl dt {
        font-size: 30px
    }

    .history1004 .his_list dl dd {
        margin-top: 15px
    }

    .history1004 .his_list dl dd ul li {
        line-height: 27px
    }

    .history1004 .his_list dl dd ul li+li {
        margin-top: 8px
    }

    .history1004 .his_list dl dd ul li:before {
        top: 11px
    }

    .history1004 .last_year span {
        font-size: 30px
    }
}

@media(max-width:768px) {
    .pagecommon {
        font-size: 14px
    }

    .history1004 .tit_box .tit {
        font-size: 30px
    }

    .history1004 .tit_box .tit_txt {
        margin: 13px 0 45px;
        padding: 0 30px;
        font-size: 16px;
        white-space: normal
    }

    .history1004 .his_wrap .bg_img {
        height: 220px
    }

    .history1004 .his_wrap .scroll {
        width: 45px;
        height: 45px;
        margin: -22.5px 0 0 8px;
        padding-top: 5px
    }

    .history1004 .his_wrap .scroll img {
        width: 12px
    }

    .history1004 .his_list {
        padding: 55px 15px 15px
    }

    .history1004 .his_list:before {
        left: 30px
    }

    .history1004 .his_list dl {
        width: 100%;
        margin: 0 0 0 15px !important;
        padding: 0 0 50px 25px !important;
        text-align: left !important
    }

    .history1004 .his_list dl:before {
        left: -3px !important;
        right: auto !important;
        top: 16px;
        width: 7px;
        height: 7px;
        border: 2px solid #888
    }

    .history1004 .his_list dl dt {
        font-size: 23px
    }

    .history1004 .his_list dl dd ul li {
        padding: 0 0 0 16px !important
    }

    .history1004 .his_list dl dd ul li:before {
        left: 0 !important;
        right: auto !important
    }

    .history1004 .last_year {
        padding: 25px 0 0 25px;
        text-align: left
    }

    .history1004 .last_year:before {
        left: 25px;
        width: 11px;
        height: 11px;
        transform: none;
        border: 3px solid #f37d1e
    }

    .history1004 .last_year span {
        font-size: 23px
    }
}

@media(max-width:480px) {
    .history1004 .tit_box .tit {
        font-size: 25px
    }

    .history1004 .tit_box .tit_txt {
        margin: 13px 0 40px;
        padding: 0 15px;
        font-size: 15px;
        line-height: 26px
    }

    .history1004 .his_wrap .bg_img {
        height: 150px
    }

    .history1004 .his_wrap .scroll {
        width: 35px;
        height: 35px;
        padding: 0
    }

    .history1004 .his_wrap .scroll:before {
        display: none
    }

    .history1004 .his_wrap .scroll img {
        width: 9px
    }

    .history1004 .his_list {
        margin-top: 0
    }

    .history1004 .his_list:before {
        left: 25px
    }

    .history1004 .his_list dl {
        margin-left: 11px !important;
        padding: 0 0 40px 17px !important
    }

    .history1004 .his_list dl:before {
        top: 13px;
        width: 6px;
        height: 6px
    }

    .history1004 .his_list dl dt {
        font-size: 18px
    }

    .history1004 .his_list dl dd ul li+li {
        margin-top: 0
    }

    .history1004 .last_year {
        padding: 20px 0 0 20px
    }

    .history1004 .last_year:before {
        left: 22px;
        width: 7px;
        height: 7px;
        border: 2px solid #f37d1e
    }

    .history1004 .last_year span {
        font-size: 18px;
        line-height: 35px
    }
}


.pageNavList {
    width: 100%;
    /* display: block; */
    /* padding:0; */
    margin: 0 auto;
    text-align: center;
    justify-items: center;
    place-items: center;
    padding-top: 30px;
}

.pageNavList ul li {
    float: left;
    width: fit-content;
    padding: 0px 10px;
}

.nav_link:hover {
    background-color: #F1f3f4;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.25), 0 7px 7px rgba(0, 0, 0, 0.22);
    border-radius: 5px;
    padding: 5px 10px;
}

.link_on {
    background-color: var(--primary);
    border: 1px solid var(--primary);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.25), 0 7px 7px rgba(0, 0, 0, 0.22);
    border-radius: 5px;
    padding: 5px 10px;
    color: #FFFFFF;
}

.link_on:hover {
    background-color: var(--primary);
    border: 1px solid var(--primary);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.25), 0 7px 7px rgba(0, 0, 0, 0.22);
    border-radius: 5px;
    padding: 5px 10px;
    color: #FFFFFF;
}

.nav_link {
    /* border:1px solid #c2c2c2; */
    border-radius: 5px;
    padding: 5px 10px;
    transition: all 0.5s;
}

@media (max-width:480px) {
    .pageNavList ul li {
        padding: 0;
    }
}


.service1016 .tit .txt {
    margin-bottom: 85px;
    text-align: center
}

.service1016 .tit .cm_tit {
    margin-bottom: 20px
}

.service1016 .tit .img {
    display: grid;
    grid-template-columns: repeat(2, 1fr)
}

.service1016 .tit .b_txt {
    display: flex;
    align-content: space-between;
    flex-wrap: wrap;
    padding: 70px;
    color: #fff;
    background: var(--primary)
}

.service1016 .tit .b_txt p {
    margin-bottom: 15px;
    font-size: 25px;
    font-weight: 700
}

.service1016 .tit .b_txt span {
    opacity: .5
}

.service1016 .tit .b_txt img {
    animation: rotate_image 10s linear infinite
}

.service1016 .cont {
    /*margin-top:120px*/
}

.service1016 .cont .cm_tit {
    width: 300px
}

.service1016 .cont>div {
    display: flex;
    height: auto;
    padding: 100px 50px;
}

.service1016 .it .cm_tit {
    position: sticky;
    top: 50px
}

.service1016 .it>ul {
    width: 75%
}

.service1016 .it>ul>li+li {
    margin-top: 50px;
    padding-top: 50px;
    border-top: 1px solid #e1e1e1
}

.service1016 .it>ul>li {
    display: flex;
    gap: 50px;
    padding: 0 50px
}

.service1016 .it>ul>li:nth-child(2) {
    flex-direction: row-reverse
}

.service1016 .it>ul>li:nth-child(4) {
    flex-direction: row-reverse
}

.service1016 .it>ul>li:nth-child(6) {
    flex-direction: row-reverse
}

.service1016 .it .hash {
    display: flex;
    gap: 8px
}

.service1016 .it .hash li {
    padding: 8px 20px;
    border-radius: 50px;
    font-weight: 700;
    color: var(--primary);
    background: #f2f2f2;
    transition: all .3s
}

.service1016 .it .txt_box {
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.service1016 .it .txt span {
    font-size: 13px;
    font-weight: 700;
    color: #aaa;
    font-family: var(--e-font)
}

.service1016 .it a {
    /*overflow:hidden;*/
    display: block;
    height: 100%;
    transition: all .3s;
}

.service1016 .it a:hover {
    border-radius: 50%
}

.service1016 .wwd .arrow {
    display: flex;
    gap: 5px;
    margin-top: 20px
}

.service1016 .wwd .arrow span {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    border-radius: 50px;
    color: var(--primary);
    cursor: pointer;
    background: #f2f2f2;
    transition: all .3s
}

.service1016 .wwd .arrow svg {
    width: 18px
}

.service1016 .wwd_slide div {
    margin-top: 30px
}

.service1016 .wwd_slide img {
    width: 100%;
    border: 1px solid #f1f2f4;
}

@keyframes rotate_image {
    100% {
        transform: rotate(360deg)
    }
}


.service1016 .tit .txt_box {
    display: block;
    width: 100%;
    padding: 20px;
}


.service1016 .tit .txt_box ul li {
    width: 50%;
    display: inline-block;
}

.service1016 .tit .txt_box .sub_tit {
    display: block;
    width: 100%;
}

.service1016 .tit .txt_box .sub_tit h4 {
    font-size: 20px;
    font-weight: 700;
}

.service1016 .tit .txt_box .sub_tit .p_desc {
    padding: 25px 0px;
    line-height: 20px;
    font-size: 16px;
}

.service1016 .tit .txt_box ul li .half_box {
    display: flex;
    width: 50%;
}


.case_box {
    display: block;
    text-align: center;
}

.case_box .case_tit {
    font-size: 24px;
    font-weight: 700;
    color: #000;
}

.case_box .case_desc {
    padding-bottom: 40px;
}

.case_slide {
    width: 100%;
    padding: 60px 0px !important;
}

.case_slide img {
    max-height: 110px;
    border: 1px solid #f1f2f4;
    border-radius: 10px;
}

.swiper-pagination {
    position: relative !important;
}

.swiper-pagination span {
    margin-left: 5px;
}

.gallery_box {
    display: block !important;
    text-align: center;
}

.gallery_head {
    display: block;
    width: 100%;
    text-align: center;
}

.gallery_box .gallery_tit {
    font-size: 35px;
    font-weight: 700;
    color: var(--primary);
}

.gallery_desc {
    padding: 40px 0px;
}

.gallery_arrow {

    position: relative;
    top: 135px;
    z-index: 20;
    display: flex;
    justify-content: space-between;

}

.prev_g {
    background-color: rgb(0, 0, 0, 0.5);
    width: 50px;
    height: 50px;
    border-radius: 25px;
    cursor: pointer;
    padding-top: 13px;
    color: #FFF;
}

.next_g {

    background-color: rgb(0, 0, 0, 0.5);
    width: 50px;
    height: 50px;
    border-radius: 25px;
    cursor: pointer;
    padding-top: 13px;
    color: #FFF;
}

.gallery_slide {
    width: 100%;
    padding: 0px;
}

.gallery_slide img {
    max-height: 110px;
}

.gal_slide_div {
    padding-left: 20px;
    width: 100%;
}

.gal_slide_div h4 {
    padding: 20px 0px 10px 0px;
    font-size: 16px;
    font-weight: 700;
    color: #000;
}

.gal_slide_div ul li {
    list-style: disc;
    text-align: left;
}


.awardbox_head {
    text-align: center;
    padding: 20px;
}

.awardbox_head h4 {
    font-size: 35px;
    font-weight: 700;
	padding: 20px;
}

.awardbox_head p {
    font-size: 16px;
	line-height:25px;
}

.awardbox_body ul li {
    width: 25%;
    float: left;
    padding: 20px;
}

.awardbox_body img {
    width: 100%;
    border: 1px solid #e2e2e2;
    border-radius: 10px;
}

.award_desc {
    font-size: 18px;
    padding: 10px 0px;
}

.intro_image {
    max-width: 390px;
}

.header_box {
    text-align: center;
    padding: 30px 0px ! Important;
    display: block !important;
}

.header_box .hd_tit {
    font-size: 35px;
    font-weight: 700;
    color: var(--primary);
    font-family: var(--e-font);
}



.imgdesc_box {
    padding: 20px;
}

.imgdesc_box img {
    width: 100%;
}

.imgdesc_box .im_tit {
    font-size: 35px;
    font-weight: 700;
    color: var(--primary);
    text-align: center;
    margin: 20px 0px;
    line-height: 40px;
}

.imgdesc_box .im_desc {
    padding: 10px 0px 0px 0px;
}

.imglist_box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    /* 또는 flex-start/center 등 */

}

.imglist_box ul li {
    width: 25%;
    float: left;
    padding: 0px 5px;
    min-height:280px;
}

.imglist_box .ib_img {
    width: 100%;
    border-radius: 10px;
    border: 1px solid #e2e2e2;
}

.imglist_box .ib_tit {
    font-size: 18px;
    font-weight: bold;
    margin: 20px 0px 20px 0px;
    line-height:25px;
}

.imglist_box .ib_desc {
    padding: 10p 0px 10px 0px;
}



@media(hover:hover) {
    .service1016 .it .hash li:hover {
        color: #fff;
        cursor: default;
        background: var(--primary)
    }

    .service1016 .wwd .arrow span:hover {
        color: #fff;
        background: var(--primary)
    }
}

/* 반응형 [s] */
@media (max-width:1024px) {
    .pagecommon .cm_tit {
        font-size: 30px
    }

    .service1016 .tit .img_wrap img {
        width: 100%
    }

    .service1016 .tit .b_txt p {
        font-size: 23px
    }

    .service1016 .cont>div {
        padding: 70px 50px
    }

    .service1016 .it>ul>li {
        padding: 0
    }

    .service1016 .it a img {
        width: 100%
    }

    .awardbox_body ul li {
        width: 33%;
    }
}

@media (max-width:768px) {

.venn-container {
top: 0px !Important;
}
    .pagecommon .pl {
        white-space: normal
    }

    .pagecommon .cm_tit {
        font-size: 25px
    }

    .pagecommon .s_tit {
        font-size: 18px
    }

    .service1016 .cont {
        margin-top: 50px
    }

    .service1016 .cont .cm_tit {
        width: 100%;
        text-align: center
    }

    .service1016 .cont>div {
        display: block;
        padding: 70px 20px;
        border-top: none
    }

    .service1016 .tit .txt {
        margin-bottom: 40px
    }

    .service1016 .tit .img {
        display: block
    }

    .service1016 .tit .img_wrap {
        overflow: hidden;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 230px
    }

    .service1016 .tit .b_txt {
        padding: 35px;
        text-align: center
    }

    .service1016 .tit .b_txt p {
        margin-top: 50px;
        font-size: 20px
    }

    .service1016 .tit .b_txt img {
        margin: 0 auto
    }

    .service1016 .it .cm_tit {
        height: auto
    }

    .service1016 .it .txt_box {
        width: 50%
    }

    .service1016 .it>ul {
        width: 100%;
        margin-top: 80px
    }

    .service1016 .wwd {
        background: #f2f2f2
    }

    .service1016 .wwd .arrow {
        justify-content: center
    }

    .service1016 .wwd .arrow span {
        background: #fff
    }

    .service1016 .wwd_slide {
        margin-top: 30px
    }

    .service1016 .wwd_slide div {
        text-align: center
    }

    .awardbox_body ul li {
        width: 50%;
    }
}

@media (max-width:580px) {
    .service1016 .tit .txt_box ul li {
        width: 100%;
    }

    .service1016 .it>ul>li {
        gap: 50px
    }

    .service1016 .it a {
        width: 50%
    }

    .service1016 .it .hash {
        flex-direction: column
    }
}

@media (max-width:480px) {
    .service1016 .it>ul {
        margin-top: 40px
    }

    .service1016 .it>ul>li {
        display: block
    }

    .service1016 .it .txt_box {
        width: 100%;
        margin-bottom: 30px;
        text-align: center;
        flex-direction: column-reverse
    }

    .service1016 .it a {
        width: 100%
    }

    .service1016 .it .hash {
        flex-direction: row;
        justify-content: center;
        margin-top: 20px
    }

    .service1016 .it>ul>li+li {
        padding-top: 0;
        border-top: none
    }

    .gallery_box .gallery_tit {
        font-size: 25px;
    }

    .awardbox_body ul li {
        width: 100%;
    }

    .header_box .hd_tit {
        font-size: 25px;
    }

    .imgdesc_box .im_tit {
        font-size: 25px;
        line-height: 30px;
    }

    .imglist_box ul li {
        width: 50%;
    }
}

@media (max-width:380px) {}

/* 반응형 [e] */

/* Download Center 추가 CSS By Ray */
.download_list {
color:#000;
margin-top:30px;
display:inline-block;
width:100%;
}
.download_list h2 {
font-size:24px;font-weight:700;
padding-bottom:10px;
}
.download_list ul li {
/*width:100%;
 height:30px;
line-height:normal; */
margin-bottom:20px;
}


.download_list2 {
color:#000;
margin-top:30px;
display:block;
width:100%;
}
.download_list2 h2 {
font-size:24px;font-weight:700;
padding-bottom:10px;
}
.download_list2 ul li {
width:12%;
float:left;
line-height:normal;
text-align:-webkit-center;
margin-bottom:20px;
display:inline-block;
}
.download_list2 h3 {
font-size:18px;font-weight:700;
padding-bottom:30px;
}
.download_list3 h2 {
font-size:24px;font-weight:700;
padding-bottom:10px;
}

.download_list3 a {
font-size:22px;
font-weight:700;
color:#1D63EA;
line-height:34px;
}

.download_list3 p {
font-size:14px;
line-height:18px;
}
.download_list3 ul li {
padding-top:20px;
padding-bottom:30px;
border-bottom:1px solid #e2e2e2;
}

.download_list3 ul li:last-child {
padding-bottom:0px;
border-bottom:none;
}
.product_box {
display:block;
width:100%;
}
.product_box li {
width:50%;
display:inline-flex;
}

.sublist {
display:block;
width:100%;
}
.sublist h3 {
color:#1D63EA;
font-size:18px;font-weight:700;
padding-bottom:5px;
}
.sublist li {
width:100%;
list-style:disc;
font-size:16px;font-weight:700;line-height:24px;
display:inline-block;
}

.sublist li a {
color:#1D63EA;
text-align:-webkit-center;
}
.caselist{
width:100%;
display:block
/*float:left;
margin-bottom:20px;
margin-top: 20px;*/
}
.caselist h3 {
font-size:18px;font-weight:700;
padding-bottom:5px;
}
.caselist ul li {
width:12%;
list-style:none;
font-size:13px;
font-weight:300;
/*float:left;*/
line-height:20px;
/*margin-left:5px;*/
display:inline-block;
text-align:-webkit-center;
}

.case_img_logo {
max-width:120px;
}

.logo_box_round {
border:1px solid #e2e2e2;
border-radius:10px;
max-width:160px;
display: flex;
justify-content: center;
height: 60px;
align-items: center;
padding: 15px;
margin: 0px 5px;
}
.download_center {
padding:15px;
}
.line_style {
border:0.5px solid #e2e2e2;
}
@media(max-width:1024px) {

.logo_box_round {
padding: 10px;
}

}
@media(max-width:768px) {

.logo_box_round {
padding: 5px;
}

.product_box li {
width:100%;
}

.sublist {
width:100%;
}
.caselist {
width:100%;
}

.caselist ul li {
	width:12%;
}
.download_list2 ul li {
	width:12%;
}

}
@media(max-width:480px) {

.logo_box_round {
padding: 0px 2px;
}
.caselist ul li {
width:24%;
}
.download_list2 ul li {
width:24%;
}
}



.download_list h3 {
font-size:20px;
font-weight:600;
margin-bottom:20px;
}

.download_list h4 {
font-size:16px;
font-weight:600;
margin-bottom:15px;
}

.product_box h4 {
font-size:16px;
font-weight:600;
}
.txt_blue {
color:#1D63EA;
}
.case_logo_img {
width:100%;
}
.prdbox_1depth {
 /*padding:0px 20px;*/
 margin-top:40px;
}

.prdbox_2depth {
  margin-top:20px;
}

/** body organization css added  by choonzang **/

.org-container {
width: 100%;
max-width: 1200px;
position: relative;
top:50px;
}

.org-box {
background-color: #666;
color: white;
padding: 15px 20px;
border-radius: 12px;
font-weight: bold;
text-align: center;
transition: all 0.3s ease;
}
.org-box-sub {
background-color: #ccc;
color: white;
padding: 15px 20px;
border-radius: 12px;
font-weight: bold;
text-align: center;
transition: all 0.3s ease;
}
.org-box.light {
background-color: #ddd;
color: #000;
}

.org-box:hover {
box-shadow: 0 0 10px #444;
transform: scale(1.03);
cursor: pointer;
}

.org-box-sub:hover {
box-shadow: 0 0 10px #444;
transform: scale(1.03);
cursor: pointer;
}

.level {
display: flex;
justify-content: center;
gap: 20px;
flex-wrap: wrap;
margin: 40px 0;
position: relative;
}

svg.connector {
position: absolute;
top: 0;
left: 0;
pointer-events: none;
z-index: 0;
max-width:1200px;
}

.org_tab {
    position: relative;
    left: 150px;
}



.department-grid {
display: block;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 40px;
margin-bottom: 80px;
z-index: 1;
position: relative;
top:-260px;
}

.department {
/*background: #f9f9f9;*/
padding: 20px;
border-radius: 16px;
/*box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);*/
text-align: center;
width:50%;
float:left;
}

.circle {
width: 60px;
height: 60px;
background-color: #00c8c8;
border-radius: 50%;
margin: 0 auto 10px;
color: white;
font-weight: bold;
font-size: 20px;
display: flex;
align-items: center;
justify-content: center;
}

.title {
font-weight: bold;
font-size: 18px;
margin-bottom: 10px;
}

.desc {
font-size: 14px;
color: #555;
line-height: 1.5;
margin-bottom: 6px;
}

.eng {
font-size: 13px;
color: #00a0a0;
}

.venn-container {
position: relative;
width: 280px;
height: 280px;
margin: 0 auto 0px;
z-index:1;
top:100px;
}

.venn-circle {
width: 140px;
height: 140px;
border-radius: 50%;
position: absolute;
display: flex;
align-items: center;
justify-content: center;
font-size: 28px;
color: #fff;
font-weight: bold;
}

.c1 {
background: #004d5a;
top: 0;
left: 70px;
}

.c2 {
background: #00c8c8;
top: 70px;
left: 0;
}

.c3 {
background: #005a72;
top: 70px;
left: 140px;
}

.c4 {
background: #009cbf;
top: 140px;
left: 70px;
}

@media (max-width: 768px) {
.department-grid {
top:0px;
}
.department {
width:100%;    
}
.venn-container {
transform: scale(0.8);
margin-bottom: 40px;
}

.circle {
width: 50px;
height: 50px;
font-size: 16px;
}

.title {
font-size: 16px;
}

.desc {
font-size: 13px;
}
}



/** 조직도  added by ray 20250604 **//
/* =========================== PAGE */
#organization1004{position:relative;padding-bottom:100px;font-size:14px;letter-spacing:-.3px;line-height:1.5;color:#777}
#organization1004 .pl{white-space:pre-line}
#organization1004 *{word-break:break-all}
#organization1004 .inner{max-width:var(--mainsize);margin:0 auto}
#organization1004 .inner > ul, li{list-style:none}
#organization1004 .inner .tit{text-align:center}
#organization1004 .inner h1{font-size:18px;font-weight:700;font-family:var(--e-font);color:#65259b;}
#organization1004 .inner .tit h2{margin-top:25px;font-size:38px;font-weight:700;color:#000}
#organization1004 .org_wrap h2{position:relative;display:flex;justify-content:center;align-items:center;margin:70px auto 80px;width:170px;height:170px;border-radius:50%;text-align:center;font-size:22px;font-weight:700;color:#fff;background-color:#1465F4;animation:org_name 0.6s ease both;animation-delay:.3s}
#organization1004 .org_wrap h2::before{content:"";position:absolute;z-index:-2;top:0px;left:0px;width:100%;height:100%;border-radius:50%;filter:blur(25px);background-color:#1465F4;}
#organization1004 .org_wrap h2::after{content:"";position:absolute;z-index:-1;top:100%;left:50%;transform:translateX(-50%);width:0.5px;height:80px;background-color:#cccccc;animation:organization_ceo_line 0.8s ease both;animation-delay:.2s}
#organization1004 .org_list_node{position:relative;display:flex;justify-content:center;padding-top:40px}
#organization1004 .org_list_node:after{content:"";position:absolute;top:0px;left:50%;transform:translateX(-50%);width:calc(100% - (100% / 2 - -50px)) !important;height:1px;background-color:#ccc;animation:department_line_x 0.5s ease both;animation-delay:0.9s}
#organization1004 .org_list_node .department{position:relative;width:calc(100% / 2 - 50px)}
#organization1004 .org_list_node .department h3{position:relative;z-index:15;margin:auto;width:200px;height:80px;line-height:80px;border-radius:40px;transform:translateZ(0);text-align:center;font-size:20px;font-weight:700;color:rgb(255, 255, 255, 0.8);background-color:#4B8CFF;animation:org_name 0.7s ease both;animation-delay:1.2s}
#organization1004 .org_list_node .department h3:before{content:"";z-index:-1;position:absolute;top:-60px;left:50%;width:0.5px;height:60px !important;background-color:#ccc;animation:department_line_y 0.3s ease both;animation-delay:1.5s}
#organization1004 .org_list_node .department h3:after{content:"";z-index:-1;position:absolute;top:80px;left:50%;width:0.5px;height:30px;background-color:#ccc;animation:department_line_y_2 0.3s ease both;animation-delay:1.8s}
.no_subline::after {height:0px !important;}
#organization1004 .org_list_node .group{position:relative;display:flex;align-items:flex-start;justify-content:center;width:100%;}
#organization1004 .org_list_node .group:after{content:"";position:absolute;top:30px;left:50%;transform:translateX(-50%);width:calc(100% - ((100% / 5) + 0px)) !important;height:1px;background-color:#ccc;animation:group_line_x 0.6s ease both;animation-delay:2.1s}

#organization1004 .org_list_node .group4{position:relative;display:flex;align-items:flex-start;justify-content:center;width:100%;}
#organization1004 .org_list_node .group4:after{content:"";position:absolute;top:30px;left:50%;transform:translateX(-50%);width:calc(100% - ((100% / 4) + 0px)) !important;height:1px;background-color:#ccc;animation:group_line_x 0.6s ease both;animation-delay:2.1s}

#organization1004 .org_list_node .group5{position:relative;display:flex;align-items:flex-start;justify-content:center;width:100%;}
#organization1004 .org_list_node .group5:after{content:"";position:absolute;top:30px;left:50%;transform:translateX(-50%);width:calc(100% - ((100% / 5) + 0px)) !important;height:1px;background-color:#ccc;animation:group_line_x 0.6s ease both;animation-delay:2.1s}


#organization1004 .org_list_node .team{position:relative;width:calc(100% / 4 - 0px);text-align:center;margin: 0px 3px;}
#organization1004 .org_list_node .team::after{content:"";position:absolute;z-index:-1;top:30px;left:50%;transform:translateX(-50%);width:0.5px;height:calc(100% / 4 - 0px) !Important;background-color:#ccc;animation:group_line_y 0.8s ease both;animation-delay:2.9s}
#organization1004 .org_list_node .section li+li{margin-top:20px}
#organization1004 .org_list_node h4{position:relative;padding:20px 0;margin:60px 0 30px;border:2px solid #4B8CFF;border-radius:15px;font-size:100%;font-weight:700;color:#4B8CFF;background-color:#fff;animation:org_name 0.8s ease both;animation-delay:2.9s}
#organization1004 .org_list_node h4::after{content:"";position:absolute;top:-4px;left:50%;transform:translateX(-50%);width:8px;height:8px;border-radius:50%;background-color:#4B8CFF}
#organization1004 .org_list_node h4::before{content:"";opacity:0.3;position:absolute;top:-12px;left:50%;transform:translateX(-50%);width:24px;height:24px;border-radius:50%;background-color:#4B8CFF}


#organization1004 .org_list_node .bg_gray_h4 h4{position:relative;padding:20px 0;border:2px solid #b0b0b0;border-radius:15px;font-size:100%;font-weight:700;color:#b0b0b0;background-color:#fff;animation:org_name 0.8s ease both;animation-delay:2.9s}
#organization1004 .org_list_node .bg_gray_h4 h4::after{content:"";position:absolute;top:-4px;left:50%;transform:translateX(-50%);width:8px;height:8px;border-radius:50%;background-color:#b0b0b0}
#organization1004 .org_list_node .bg_gray_h4 h4::before{content:"";opacity:0.3;position:absolute;top:-12px;left:50%;transform:translateX(-50%);width:24px;height:24px;border-radius:50%;background-color:#b0b0b0}

#organization1004 .org_list_node .section li:first-child h5{position:relative;animation-delay:3s}
#organization1004 .org_list_node .section li:first-child h5:after{content:"";position:absolute;top:-2px;left:50%;transform:translateX(-50%);width:7px;height:7px;border-radius:50%;background-color:#ccc}
#organization1004 .org_list_node .section li:nth-child(2) h5{animation-delay:3.1s}
#organization1004 .org_list_node .section li:nth-child(3) h5{animation-delay:3.2s}
#organization1004 .org_list_node h5{padding:20px 0;border-radius:15px;font-size:18px;font-weight:500;color:#222;background-color:#f5f5f5;animation:org_name 0.8s ease both}

.orgbox2 {
    margin: 0 auto;
    line-height: normal;
    font-size: 16px;
    position: relative;
    top: 25%;
}

@keyframes org_name {0% {opacity:0;transform:scale(.8)} 100% {opacity:1;transform:none}}
@keyframes organization_ceo_line {0% {height:0px} 100% {height:80px}}
@keyframes department_line_x {0% {width:0px} 100% {width:calc(100% - (100% / 3 - 50px))}}
@keyframes department_line_x_1024 {0% {width:0px} 100% {width:calc(100% - (100% / 3 - 30px))}}
@keyframes department_line_y {0% {height:0px} 100% {height:40px}}
@keyframes department_line_y_2 {0% {height:0px} 100% {height:30px}}
@keyframes group_line_x {0% {width:0px} 100% {width:calc(100% - (100% / 3 - 10px))}}
@keyframes group_line_x_480 {0% {width:0px} 100% {width:100%}}
@keyframes group_line_y {0% {height:0px} 100% {height:calc(100% - 30px)}}
@keyframes border_line {0% {height:0px} 100% {height:315px}}
@keyframes border_line_390 {0% {height:0px} 100% {height:280px}}



@media(max-width:1024px){
#organization1004 .inner{margin:auto;width:95%}
#organization1004 .inner h1{font-size:16px}
#organization1004 .inner .tit h2{margin-top:20px;font-size:30px}
#organization1004 .org_list_node .group {
    width: 100%;
}
#organization1004 .org_wrap h2{width:150px;height:150px;font-size:19px}
#organization1004 .org_list_node:after{width:calc(100% - (100% / 2 - -50px)) !important;animation:department_line_x_1024 0.5s ease both;animation-delay:0.9s}
/**
#organization1004 .org_list_node .department{width:calc(100% / 3 - 30px)}
#organization1004 .org_list_node .department h3{width:150px;height:60px;line-height:60px;font-size:17px}
#organization1004 .org_list_node .department h3:after{top:60px}
**/

#organization1004 .org_list_node .department h3{width:145px;height:55px;line-height:55px;font-size:16px}
#organization1004 .org_list_node .department h3:before{ }
#organization1004 .org_list_node .department h3:after{top:55px;width:1px}


#organization1004 .org_list_node h4{padding:12px 0;font-size:70%;border-radius:10px}
#organization1004 .org_list_node .bg_gray_h4 h4{font-size:70%;}
#organization1004 .org_list_node h4::before{top:-10px;width:20px;height:20px}
#organization1004 .org_list_node h4::after{width:7px;height:7px}
#organization1004 .org_list_node h5{padding:12px 0;font-size:14px;border-radius:10px}
.orgbox2 {
    font-size:12px;
}

}
@media(max-width:768px){
#organization1004 .inner h1{font-size:15px}
#organization1004 .inner .tit h2{margin-top:15px;font-size:26px}
#organization1004 .org_wrap h2{margin:50px auto 70px;width:140px;height:140px;font-size:18px}
#organization1004 .org_wrap h2::after{display:none}
#organization1004 .org_list_node:after{display:none}
#organization1004 .org_list_node{flex-direction:column;padding-top:0px}
#organization1004 .org_list_node > li+li{margin-top:80px}
#organization1004 .org_list_node .department{width:100%}
#organization1004 .org_list_node .department h3{width:145px;height:55px;line-height:55px;font-size:16px}
#organization1004 .org_list_node .department h3:before{display:none}
#organization1004 .org_list_node .department h3:after{top:55px;width:1px}
#organization1004 .org_list_node h4 {
font-size:100%;
}
#organization1004 .org_list_node .bg_gray_h4 h4{
font-size:100%;
}
.orgbox2 {
    font-size:12px;
}
}
@media(max-width:480px){
#organization1004 .inner h1{font-size:14px}
#organization1004 .inner .tit h2{margin-top:12px;font-size:23px}
#organization1004 .org_wrap h2{margin:40px auto 60px;width:130px;height:130px;font-size:16px;animation-delay:0.2s}
#organization1004 .org_list_node > li+li{margin-top:10px}
#organization1004 .org_list_node .department {
padding:5px !Important;
}
#organization1004 .org_list_node .department:after{content:"";position:absolute;top:83px;left:0px;width:0px;height:315px;background-color:#ccc;animation:border_line 0.8s ease both;animation-delay:1.8s}
#organization1004 .org_list_node .department:before{content:"";position:absolute;top:83px;right:0px;width:0px;height:315px;background-color:#ccc;animation:border_line 0.8s ease both;animation-delay:1.8s}
#organization1004 .org_list_node .department h3{width:140px;height:53px;line-height:53px;font-size:15px;animation-delay:0.6s}
#organization1004 .org_list_node .department h3:after{left:50%;top:53px;animation-delay:1s}
#organization1004 .org_list_node h4 {
font-size:70%;word-break:break-all;
}
#organization1004 .org_list_node .bg_gray_h4 h4{
font-size:70%;word-break:break-all;
}

#organization1004 .org_list_node .group4{padding:25px;margin-top:30px;}
#organization1004 .org_list_node .group4:after{top:0px;width:calc(100% - ((100% / 4) + 37px)) !important;animation:group_line_x_480 0.6s ease both;animation-delay:1.3s}
#organization1004 .org_list_node .group4:before{content:"";position:absolute;bottom:0px;left:50%;transform:translateX(-50%);width:100%;height:1px;background-color:#ccc;animation:group_line_x_480 0.6s ease both;animation-delay:2.3s}

#organization1004 .org_list_node .group5{padding:25px 0px;margin-top:30px;}
#organization1004 .org_list_node .group5:after{top:0px;width:calc(100% - ((100% / 5) + 0px)) !important;animation:group_line_x_480 0.6s ease both;animation-delay:1.3s}
#organization1004 .org_list_node .group5:before{content:"";position:absolute;bottom:0px;left:50%;transform:translateX(-50%);width:100%;height:1px;background-color:#ccc;animation:group_line_x_480 0.6s ease both;animation-delay:2.3s}

#organization1004 .org_list_node .team{/*position:relative;padding-top:10px;overflow:hidden*/}
#organization1004 .org_list_node .team::after{ top: -24px;}
#organization1004 .org_list_node h4{margin:0 auto 30px}
}
@media(max-width:390px){
/***
#organization1004 .inner h1{font-size:13px}
#organization1004 .inner .tit h2{margin-top:10px;font-size:21px}
#organization1004 .org_wrap h2{margin:40px auto 60px;width:120px;height:120px;font-size:15px}
#organization1004 .org_list_node .department:after{top:78px;animation:border_line_390 0.8s ease both;animation-delay:1.8s}
#organization1004 .org_list_node .department:before{top:78px;animation:border_line_390 0.8s ease both;animation-delay:1.8s}
#organization1004 .org_list_node .department h3{width:120px;height:48px;line-height:48px;font-size:14px}
#organization1004 .org_list_node .department h3:after{top:48px}
#organization1004 .org_list_node .group{padding:18px;}
#organization1004 .org_list_node .team{width:calc(100% / 3 - 7px)}
#organization1004 .org_list_node h4{padding:10px 0;margin-bottom:25px;border-radius:8px;font-size:14px}
#organization1004 .org_list_node h5{padding:10px 0;border-radius:8px;font-size:13px}
***/
}




/** 본부소개  added by ray 20250604 **/

/* =========================== PAGE */
#organization1002{position:relative;font-size:14px;line-height:1.5;color:#777}
#organization1002 .pl{white-space:pre-line}
#organization1002 *{word-break:keep-all}
#organization1002 .inner{position:relative;max-width:var(--mainsize);margin:0 auto}

#organization1002 .list_cont{display:grid;grid-template-columns:repeat(2, 1fr);gap:200px}
#organization1002 .list_cont .number{display:flex;justify-content:center;align-items:center;width:55px;height:55px;font-size:15px;font-weight:900;border-radius:50%;color:#fff}
#organization1002 .list_cont li{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:0px 100px;}
#organization1002 .list_cont li:nth-child(1) .number{background-color:var(--color01)}
#organization1002 .list_cont li:nth-child(2) .number{background-color:var(--color02)}
#organization1002 .list_cont li:nth-child(3) .number{background-color:var(--color03)}
#organization1002 .list_cont li:nth-child(4) .number{background-color:var(--color04)}
#organization1002 .list_cont h2{margin-top:30px;font-size:24px;font-weight:800;color:#000}
#organization1002 .list_cont p{margin-top:5px;font-size:16px;font-weight:600}
#organization1002 .list_cont .cate{margin-top:30px;font-size:16px;font-weight:600}
#organization1002 .list_cont li:nth-child(1) .cate{color:var(--color01)}
#organization1002 .list_cont li:nth-child(2) .cate{color:var(--color02)}
#organization1002 .list_cont li:nth-child(3) .cate{color:var(--color03)}
#organization1002 .list_cont li:nth-child(4) .cate{color:var(--color04)}

#organization1002 .center_circle{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:380px;height:380px}
#organization1002 .center_circle div{position:absolute;width:190px;height:190px;border-radius:50%}
#organization1002 .circle01{z-index:3;top:0px;right:50%;transform:translateX(50%);}
#organization1002 .circle02{z-index:2;top:50%;right:0px;transform:translateY(-50%);}
#organization1002 .circle03{z-index:1;bottom:0px;left:50%;transform:translateX(-50%);}
#organization1002 .circle04{z-index:4;bottom:50%;left:0px;transform:translateY(50%);}
#organization1002 .circle04:after{content:"";position:absolute;z-index:-1;bottom:0px;right:0px;width:95px;height:95px;border-top-left-radius:95px;border-bottom-right-radius:95px;background-color:var(--color04);}


@media(max-width:1024px){
#organization1002 .inner{max-width:unset;width:95%}
#organization1002 .list_cont .number{width:50px;height:50px;font-size:14px}
#organization1002 .list_cont h2{margin-top:25px;font-size:21px}
#organization1002 .list_cont p{margin-top:15px;font-size:15px}
#organization1002 .list_cont .cate{margin-top:25px;font-size:15px}
#organization1002 .center_circle{width:300px;height:300px}
#organization1002 .center_circle div{width:150px;height:150px;background-size:42px 42px}
#organization1002 .circle04:after{width:75px;height:75px;border-top-left-radius:75px;border-bottom-right-radius:75px}
}
@media(max-width:768px){
#organization1002 .pl{white-space:normal}
#organization1002 .list_cont{gap:60px}
#organization1002 .list_cont .number{width:48px;height:48px}
#organization1002 .list_cont h2{margin-top:21px;font-size:19px}
#organization1002 .list_cont p{margin:15px auto 0;width:85%;font-size:14px}
#organization1002 .list_cont .cate{font-size:14px}
#organization1002 .center_circle{display:flex;justify-content:center;align-items:center;gap:45px;position:relative;top:unset;left:unset;transform:none;margin-top:100px;width:auto;height:auto}
#organization1002 .center_circle div{position:relative;top:unset;left:unset;right:unset;transform:none;width:120px;height:120px;background-size:40px 40px}
#organization1002 .center_circle div:nth-last-child(-n+3):after{content:"";position:absolute;top:50%;left:-22px;transform:translateX(-50%);width:6px;height:6px;border-radius:50%;background-color:rgb(0, 0, 0, 0.2)}
#organization1002 .circle03{order:4}
#organization1002 .list_cont li {
padding:0px !important;
}
}
@media(max-width:650px){

#organization1002 .center_circle{gap:40px}
#organization1002 .center_circle div{width:100px;height:100px;background-size:38px 38px}
#organization1002 .center_circle div:nth-last-child(-n+3):after{left:-20px}
}
@media(max-width:540px){
#organization1002 .center_circle{gap:30px}
#organization1002 .center_circle div{width:90px;height:90px;background-size:36px 36px}
#organization1002 .center_circle div:nth-last-child(-n+3):after{left:-15px;width:5px;height:5px}
}
@media(max-width:480px){
#organization1002 .list_cont{grid-template-columns:repeat(1, 1fr);gap:60px}
#organization1002 .list_cont h2{margin-top:25px}
#organization1002 .list_cont p{margin-top:5px;width:90%}
#organization1002 .list_cont .cate{margin-top:30px}
#organization1002 .center_circle{margin:90px auto 0;width:280px;height:280px}
#organization1002 .center_circle div{position:absolute;width:140px;height:140px;border-radius:50%;background-size:38px 38px}
#organization1002 .circle01{z-index:3;top:0px !important;right:50% !important;transform:translateX(50%) !important}
#organization1002 .circle02{z-index:2;top:50% !important;right:0px !important;transform:translateY(-50%) !important}
#organization1002 .circle03{z-index:1;bottom:0px !important;left:50% !important;transform:translateX(-50%) !important;order:3}
#organization1002 .circle04{z-index:4;bottom:50% !important;left:0px !important;transform:translateY(50%) !important}
#organization1002 .center_circle div:nth-last-child(-n+3):after{display:none}
#organization1002 .circle04:before{content:"";position:absolute;z-index:-1;bottom:0px;right:0px;width:70px;height:70px;border-top-left-radius:70px;border-bottom-right-radius:70px;background-color:var(--color04)}
}
@media(max-width:390px){
#organization1002 .list_cont{gap:50px}
#organization1002 .list_cont .number{width:43px;height:43px;line-height:43px;font-size:13px}
#organization1002 .list_cont h2{margin-top:20px;font-size:17px}
#organization1002 .list_cont p{margin-top:5px;width:95%;font-size:13px}
#organization1002 .list_cont .cate{margin-top:25px}
#organization1002 .center_circle{margin-top:70px;width:260px;height:260px}
#organization1002 .center_circle div{width:130px;height:130px;background-size:35px 35px}
#organization1002 .circle04:before{width:65px;height:65px;border-top-left-radius:65px;border-bottom-right-radius:65px}
}

.bg_gray_ {
background-color:#b0b0b0 !important;
}