@media screen and (max-width: 1199px) {
    .content_box .historyBox .h_pic {
        width:40%
    }

    .content_box .historyBox .h_pic img {
        width: 100%
    }

    .content_box .historyBox .h_his {
        width: 60%;
        padding-left: 30px;
        padding-top: 75px
    }

    .content_box .historyBox .h_his .tit_box::before {
        left: -33px
    }

    .content_box .historyBox .h_his .tit_box::after {
        width: 60vw;
        left: -30px
    }

    .content_box .historyBox .h_his .list_box {
        margin-top: 3rem;
        min-height: initial;
        padding-bottom: 5rem
    }

    .content_box .historyBox .h_his .list_box ol li {
        font-size: 1.2rem;
        margin-bottom: 0.8em
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .left {
        width: 40%
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .right {
        width: calc(60% - 30px)
    }

    .loginInfoBox .sec1 .bottom .btnLi button {
        height: calc(3.8rem + 2px)
    }

    .loginInfoBox .sec1 .bottom .btnLi button a {
        font-size: 1.3rem;
        line-height: 3.8rem
    }

    .loginInfoBox .sec1 .bottom .btnLi button:hover a {
        line-height: calc(3.8rem - 4px)
    }

    .loginInfoBox .sec1 .bottom .btnLi .info_p {
        font-size: 1.1rem
    }

    .loginInfoBox .sec2 .left,.loginInfoBox .sec3 .left,.loginInfoBox .sec4 .left {
        width: 35%;
        margin-right: 25px
    }

    .loginInfoBox .sec2 .right,.loginInfoBox .sec3 .right,.loginInfoBox .sec4 .right {
        width: calc(65% - 25px)
    }

    .loginInfoBox .part .type_name p {
        font-size: 1.4rem;
        margin-bottom: 0.3em
    }

    .loginInfoBox .part .type_name h5 {
        font-size: 2.2rem;
        margin-bottom: 0.8em
    }

    .loginInfoBox .part .type_des {
        font-size: 1.1rem
    }

    .loginInfoBox .part .type_des p.strong {
        margin-top: 0.3em
    }
}

@media screen and (max-width: 1119px) {
    .content_box .introduceBox .textWrap h5 {
        font-size:36px
    }

    .content_box .introduceBox .textWrap .g_txt {
        font-size: 18px
    }

    .content_box .ci_intro_Box .sec_des h5 {
        font-size: 2.2rem;
        margin: 10px 0 24px
    }

    .content_box .ci_intro_Box .sec_des p {
        font-size: 1.1rem
    }

    .content_box .ci_intro_Box .sec1,.content_box .ci_intro_Box .sec2 {
        padding-left: 40px
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .right p {
        font-size: 1.1rem
    }
}

@media screen and (max-width: 1023px) {
    .content_box .ci_intro_Box .sec_des::before {
        display:none
    }

    .content_box .ci_intro_Box .sec1,.content_box .ci_intro_Box .sec2 {
        padding-left: 0px
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .right {
        margin-left: 20px;
        width: calc(60% - 20px)
    }

    .loginInfoBox .sec1 .bottom .btnLi button {
        height: calc(3.2rem + 2px)
    }

    .loginInfoBox .sec1 .bottom .btnLi button a {
        font-size: 1.2rem;
        line-height: 3.2rem
    }

    .loginInfoBox .sec1 .bottom .btnLi button:hover a {
        line-height: calc(3.2rem - 4px)
    }

    .loginInfoBox .sec1 .bottom .btnLi .info_ p {
        margin-top: 10px
    }

    .loginInfoBox .sec1 .bottom .btnLi .info_ p::before {
        margin-right: 10px
    }
}

@media screen and (max-width: 989px) {
    .introduce_con .part1 {
        text-align:center
    }

    .introduce_con .part1 h5 {
        font-size: 1.5rem
    }

    .introduce_con .part1 h5::after {
        margin: 24px auto 20px
    }

    .introduce_con .part1 p {
        font-size: 1.1rem
    }

    .content_box .introduceBox .textWrap h5 {
        font-size: 2rem;
        padding: 0;
        background: none
    }

    .content_box .introduceBox .textWrap .g_pic {
        padding-top: 40px;
        width: 200px
    }

    .content_box .introduceBox .textWrap .g_pic img {
        width: 100%
    }

    .content_box .introduceBox .textWrap .g_txt {
        font-size: 1rem;
        padding: 40px 0 0 20px
    }

    .content_box .introduceBox .textWrap .g_txt .last .pointName {
        font-size: 2rem
    }

    .content_box .historyBox .h_pic {
        display: none
    }

    .content_box .historyBox .h_his {
        padding-top: 40px;
        padding-left: 24px;
        width: 100%
    }

    .content_box .historyBox .h_his .tit_box {
        padding-bottom: 20px
    }

    .content_box .historyBox .h_his .tit_box::before {
        left: -27px
    }

    .content_box .historyBox .h_his .tit_box::after {
        width: 95vw;
        left: -24px
    }

    .content_box .historyBox .h_his .tit_box h4 {
        font-size: 1.8rem;
        margin-bottom: 0.5rem
    }

    .content_box .historyBox .h_his .tit_box p {
        font-size: 1rem
    }

    .content_box .historyBox .h_his .list_box {
        margin-top: 25px;
        padding-bottom: 3rem
    }

    .content_box .historyBox .h_his .list_box ol li {
        font-size: 1.1rem;
        margin-bottom: 10px
    }

    .content_box .committeeBox .tit_box h4 {
        font-size: 1.8rem
    }

    .content_box .ci_intro_Box .tit_box {
        margin-bottom: 4rem
    }

    .content_box .ci_intro_Box .tit_box h4 {
        font-size: 2rem;
        margin-bottom: 0.5rem
    }

    .content_box .ci_intro_Box .tit_box p {
        font-size: 1.2rem
    }

    .content_box .ci_intro_Box .logoBox1 {
        height: 220px
    }

    .content_box .ci_intro_Box .logoBox1 img {
        width: 220px
    }

    .content_box .ci_intro_Box .buttonBox .ciDownBtn {
        width: auto;
        padding: 0 20px;
        height: auto
    }

    .content_box .ci_intro_Box .buttonBox .ciDownBtn a {
        line-height: 47px;
        font-size: 1rem
    }

    .content_box .ci_intro_Box .sec_des p {
        font-size: 1rem
    }

    .content_box .ci_intro_Box .sec1 {
        margin-bottom: 100px
    }

    .content_box .ci_intro_Box .sec1 .sec_cont {
        display: block
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .left,.content_box .ci_intro_Box .sec1 .sec_cont .right {
        width: 100%
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .left {
        margin-bottom: 10px;
        height: auto;
        padding: 24px 0
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .left .innerBox {
        width: 250px
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .left .innerBox img:first-child {
        margin-bottom: 20px
    }
    .content_box .ci_intro_Box .sec1 .sec_cont .left .innerBox img:nth-child(2) {
        margin-bottom: 20px
    }
    .content_box .ci_intro_Box .sec1 .sec_cont .left .innerBox img:last-child {
        margin-top: 20px
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .right {
        margin-left: 0
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .right p {
        font-size: 1rem
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .right p.en {
        font-size: 1.3rem;
        margin-bottom: 8px
    }

    .loginInfoBox .sec1 {
        margin-bottom: 80px
    }

    .loginInfoBox .sec1 .top {
        margin-bottom: 40px
    }

    .loginInfoBox .sec1 .top .info_p {
        font-size: 1rem
    }

    .loginInfoBox .sec1 .bottom .btnLi {
        width: calc(25% - 6px);
        margin-left: 8px
    }

    .loginInfoBox .sec1 .bottom .btnLi button {
        height: calc(2.8rem + 2px)
    }

    .loginInfoBox .sec1 .bottom .btnLi button a {
        font-size: 16px;
        line-height: 2.8rem
    }

    .loginInfoBox .sec1 .bottom .btnLi button:hover {
        line-height: calc(2.8rem - 4px)
    }

    .loginInfoBox .sec1 .bottom .btnLi .info_p {
        font-size: 12px;
        margin-top: 8px;
        -ms-flex-pack: distribute;
        justify-content: space-around
    }

    .loginInfoBox .sec1 .bottom .btnLi .info_p::before {
        width: 3px;
        margin-right: 5px
    }

    .loginInfoBox .sec1 .bottom .btnLi .info_p a {
        margin-left: 8px
    }

    .loginInfoBox .sec2,.loginInfoBox .sec3,.loginInfoBox .sec4 {
        margin-bottom: 0
    }

    .loginInfoBox .sec2 .left,.loginInfoBox .sec3 .left,.loginInfoBox .sec4 .left {
        display: none
    }

    .loginInfoBox .sec2 .right,.loginInfoBox .sec3 .right,.loginInfoBox .sec4 .right {
        width: 100%
    }

    .loginInfoBox .sec2 .part::before,.loginInfoBox .sec3 .part::before,.loginInfoBox .sec4 .part::before {
        height: calc(50% + 20px)
    }

    .loginInfoBox .sec4 .part::before {
        height: 100%
    }

    .loginInfoBox .part {
        display: block;
        height: auto;
        padding: 20px 0
    }

    .loginInfoBox .part .type_name p {
        font-size: 1.1rem
    }

    .loginInfoBox .part .type_name h5 {
        font-size: 1.8rem
    }

    .loginInfoBox .part .type_des {
        font-size: 14px
    }
}

@media screen and (max-width: 767px) {
    .introduce_con .part1 p {
        font-size:1rem
    }

    .content_box .introduceBox .textWrap h5 {
        font-size: 1.5rem;
        text-align: center
    }

    .content_box .introduceBox .textWrap .g_pic {
        display: none
    }

    .content_box .introduceBox .textWrap .g_txt {
        font-size: 14px;
        padding: 30px 0 0 0
    }

    .content_box .introduceBox .textWrap .g_txt .last {
        margin-top: 20px
    }

    .content_box .introduceBox .textWrap .g_txt .last .pointName {
        font-size: 25px
    }

    .content_box .introduceBox .bottomBanner {
        height: 250px
    }

    .content_box .introduceBox .bottomBanner .logoBox {
        width: 100px
    }

    .content_box .introduceBox .bottomBanner .logoBox img {
        width: 100%
    }

    .content_box .historyBox {
        padding-bottom: 150px
    }

    .content_box .historyBox .h_his .tit_box h4 {
        font-size: 1.5rem
    }

    .content_box .historyBox .h_his .list_box ol li {
        font-size: 1rem;
        margin-bottom: 8px
    }

    .content_box .committeeBox .tit_box h4 {
        font-size: 1.5rem
    }

    .content_box .ci_intro_Box .tit_box {
        display: none
    }

    .content_box .ci_intro_Box .logoBox1 {
        display: none
    }

    .content_box .ci_intro_Box .buttonBox {
        display: none
    }

    .content_box .sec_des .sec_type {
        font-size: 1.2rem
    }

    .content_box .sec_des h5 {
        font-size: 1.8rem;
        margin: 6px 0 14px
    }

    .content_box .sec_des p {
        font-size: 14px
    }

    .content_box .sec_des .sec1 .sec_cont .right p {
        font-size: 14px
    }

    .loginInfoBox .sec1 {
        margin-bottom: 50px
    }

    .loginInfoBox .sec1 .bottom ul {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .loginInfoBox .sec1 .bottom .btnLi {
        width: calc(50% - 5px);
        margin-left: 10px;
        margin-bottom: 14px
    }

    .loginInfoBox .sec1 .bottom .btnLi:nth-child(2n+1) {
        margin-left: 0
    }

    .loginInfoBox .sec1 .bottom .btnLi .info_p {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        font-size: 13px
    }

    .loginInfoBox .sec1 .bottom .btnLi .info_p::before {
        margin-right: 8px
    }

    .loginInfoBox .sec2 .part::before,.loginInfoBox .sec3 .part::before {
        height: calc(50% + 30px)
    }

    .loginInfoBox .part {
        padding: 30px 0
    }

    .loginInfoBox .part .type_name p {
        font-size: 1rem
    }

    .loginInfoBox .part .type_name h5 {
        font-size: 1.5rem
    }
}

@media screen and (max-width: 619px) {
    .content_box .ci_intro_Box .sec1 {
        margin-bottom:90px
    }
}

@media screen and (max-width: 579px) {
    .content_box .ci_intro_Box .sec_des .sec_type {
        font-size:1rem
    }

    .content_box .ci_intro_Box .sec_des h5 {
        font-size: 1.5rem;
        margin: 3px 0 14px
    }

    .content_box .ci_intro_Box .sec_des p br {
        display: none
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .left .innerBox {
        width: 260px
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .left .innerBox img:first-child {
        width: 200px;
        margin: 0 auto 20px
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .right p.en {
        font-size: 16px;
        margin-bottom: 0
    }

    .content_box .ci_intro_Box .sec2 .sec_cont .mark_wrap {
        -ms-flex-pack: distribute;
        justify-content: space-around;
        margin-bottom: 20px
    }

    .content_box .ci_intro_Box .sec2 .sec_cont .mark_wrap img {
        width: 130px
    }
}

@media screen and (max-width: 479px) {
    .content_box .introduceBox .textWrap {
        margin-bottom:80px
    }

    .content_box .introduceBox .textWrap .g_txt {
        text-align: center
    }

    .content_box .introduceBox .textWrap .g_txt p br {
        display: none
    }

    .content_box .introduceBox .textWrap .g_txt .last {
        text-align: center
    }

    .content_box .introduceBox .textWrap .g_txt .last .pointName {
        font-size: 22px;
        letter-spacing: 10px
    }

    .content_box .introduceBox .bottomBanner {
        height: 200px
    }

    .content_box .introduceBox .bottomBanner .logoBox {
        width: 80px
    }

    .content_box .historyBox .h_his {
        padding-top: 30px;
        padding-left: 16px
    }

    .content_box .historyBox .h_his .tit_box::before {
        left: -19px
    }

    .content_box .historyBox .h_his .tit_box::after {
        left: -16px
    }

    .content_box .historyBox .h_his .tit_box h4 {
        font-size: 1.2rem;
        margin-bottom: 0
    }

    .content_box .historyBox .h_his .tit_box p {
        display: none
    }

    .content_box .historyBox .h_his .list_box {
        margin-top: 18px
    }

    .content_box .historyBox .h_his .list_box ol li {
        font-size: 14px
    }

    .content_box .committeeBox .tit_box h4 {
        font-size: 1.2rem
    }

    .content_box .ci_intro_Box .sec1 {
        margin-bottom: 70px
    }

    .loginInfoBox .part .type_name p {
        display: none
    }

    .loginInfoBox .part .type_des p.strong br {
        display: none
    }
}

@media screen and (max-width: 419px) {
    .content_box .introduceBox .textWrap h5 br {
        display:none
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .left .innerBox img:first-child {
        width: 160px;
        margin: 0 auto
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .left .innerBox img:nth-child(2) {
        display: none
    }

    .content_box .ci_intro_Box .sec1 .sec_cont .left .innerBox img:nth-child(3) {
        display: none
    }

    .content_box .ci_intro_Box .sec2 .sec_cont .mark_wrap img {
        width: 100px
    }

    .loginInfoBox .sec1 .top {
        margin-bottom: 35px
    }

    .loginInfoBox .sec1 .top .homeBtn {
        margin-bottom: 10px
    }

    .loginInfoBox .sec1 .top .info_p {
        font-size: 14px
    }

    .loginInfoBox .sec1 .bottom .btnLi {
        width: calc(50% - 4px);
        margin-left: 8px
    }

    .loginInfoBox .sec1 .bottom .btnLi button {
        height: auto
    }

    .loginInfoBox .sec1 .bottom .btnLi button a {
        font-size: 15px;
        line-height: 1em;
        padding: 10px 0
    }

    .loginInfoBox .sec1 .bottom .btnLi button:hover {
        border: 1px solid #184fa1
    }

    .loginInfoBox .sec1 .bottom .btnLi button:hover a {
        line-height: 1em
    }

    .loginInfoBox .sec1 .bottom .btnLi .info_p {
        font-size: 0
    }

    .loginInfoBox .sec1 .bottom .btnLi .info_p strong {
        font-size: 13px
    }

    .loginInfoBox .sec1 .bottom .btnLi .info_p strong::after {
        content: "란?";
        display: inline-block;
        font-weight: normal
    }
}

@media screen and (max-width: 359px) {
    .content_box .ci_intro_Box .sec2 .sec_cont .mark_wrap img {
        width:80px
    }

    .loginInfoBox .sec1 .bottom .btnLi button a {
        font-size: 14px
    }
}
