@charset "UTF-8";
@import url("layout_respond.css");
@import url("contents_respond.css");
/*-------------------------------------------------
title       : 서브 반응형
Author      : ljh
Create date : 2025-10
-------------------------------------------------*/
@media (max-width: 1452px) {
  #container > .inner {
    padding-left: 1.6rem;
    padding-right: 1.6rem;
  }
  #container.fixed .krds-side-navigation {
    left: 1.6rem;
  }
}
@media (max-width: 1280px) {
  #container .in-between {
    gap: 4rem;
  }
  #container .in-between .krds-side-navigation {
    width: 24rem;
    min-width: 24rem;
  }
  #container .in-between .krds-side-navigation + .contents {
    width: calc(100% - 28rem);
    max-width: none;
  }
  #container.fixed .inner {
    padding-left: 28rem;
  }
  .license-content {
    padding: 2rem;
  }
  .krds-breadcrumb-wrap .breadcrumb > li a.txt {
    font-size: 1.6rem;
  }
  .krds-breadcrumb-wrap .breadcrumb > li .sub_dropdown a {
    font-size: 1.6rem;
  }
}
@media (max-width: 1232px) {
  .contents_util {
    width: calc(100% - 3.2rem);
  }
}
@media (max-width: 1080px) {
  .krds-breadcrumb-wrap .breadcrumb > li {
    width: 17rem;
  }
  .krds-breadcrumb-wrap .breadcrumb > li:first-child:nth-last-child(n+4) ~ li:nth-last-child(4), .krds-breadcrumb-wrap .breadcrumb > li:first-child:nth-last-child(n+4):nth-last-child(4) {
    display: none;
  }
  .krds-breadcrumb-wrap .breadcrumb .sub_dropdown ul {
    padding: 1.6rem;
  }
}
@media (max-width: 1023px) {
  .page-title-wrap .h-tit {
    font-size: 3.2rem;
  }
  #utile {
    top: -0.5rem;
  }
  #utile .btn::after {
    display: none;
  }
  .contents_util {
    padding: 1.9rem 1.6rem;
  }
  .license-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    padding: 1.6rem;
  }
  .license-content .license-logo {
    max-width: 100%;
  }
  .license-content .license-info {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
  .license-content .license-info p {
    font-size: 1.6rem;
  }
}
@media (max-width: 840px) {
  #krds-header + #container {
    padding-bottom: 10rem;
  }
  .depth3_tab ul {
    padding-right: 3rem;
  }
  .depth3_tab ul li:first-child {
    margin-left: 3rem;
  }
  .depth4_tab, .cont_tab_wrap {
    position: relative;
  }
  .depth4_tab .responsive_btn, .cont_tab_wrap .responsive_btn {
    display: block;
  }
  .depth4_tab ul, .cont_tab_wrap ul {
    position: absolute;
    margin-bottom: 0;
    top: 9.2rem;
    width: 100%;
    -webkit-transition: max-height 0.3s;
    transition: max-height 0.3s;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 0;
    border-top: 0 none;
    height: 0;
    max-height: 0;
    overflow: hidden;
    border-radius: 0.8rem;
  }
  .depth4_tab ul li, .cont_tab_wrap ul li {
    width: 100%;
  }
  .depth4_tab ul li a, .cont_tab_wrap ul li a {
    border-radius: 0;
    font-weight: 400;
    padding-left: 1.6rem;
    padding-right: 1.6rem;
  }
  .depth4_tab ul li.active a, .cont_tab_wrap ul li.active a {
    background-color: #dee6ee;
    color: #222;
  }
  .depth4_tab.active ul, .cont_tab_wrap.active ul {
    height: auto;
    max-height: 50rem;
    z-index: 1;
  }
  .cont_tab_wrap {
    margin-bottom: 4rem;
  }
  .cont_tab_wrap ul {
    position: absolute;
    margin-bottom: 0;
    top: calc(100% + 0.5rem);
    width: 100%;
    -webkit-transition: max-height 0.3s;
    transition: max-height 0.3s;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 0;
    border-top: 0 none;
    height: 0;
    max-height: 0;
    overflow: hidden;
    border-radius: 0.8rem;
  }
  .cont_tab_wrap ul li {
    width: 100%;
  }
  .cont_tab_wrap ul li a {
    border-radius: 0;
    font-weight: 400;
    padding-left: 1.6rem;
    padding-right: 1.6rem;
  }
  .cont_tab_wrap ul li.active a {
    background-color: #dee6ee;
    color: #222;
  }
  .contents_util {
    padding-left: 1rem;
    padding-right: 1rem;
    height: 5.5rem;
  }
  .krds-breadcrumb-wrap {
    width: calc(100% - 6rem);
  }
  .krds-breadcrumb-wrap .breadcrumb > li {
    width: 50%;
  }
  .krds-breadcrumb-wrap .breadcrumb > li:not(:nth-last-child(1)):not(:nth-last-child(2)) {
    display: none;
  }
  .krds-breadcrumb-wrap .breadcrumb > li:not(:last-child) {
    margin-right: 1.6rem;
  }
  .krds-breadcrumb-wrap .breadcrumb > li:not(:last-child)::after {
    right: -1rem;
  }
  .krds-breadcrumb-wrap .breadcrumb > li:last-child {
    width: 50%;
  }
  .krds-breadcrumb-wrap .breadcrumb .sub_dropdown {
    width: calc(100% + 1rem);
    left: -0.6rem;
    top: calc(100% + 1.2rem);
  }
}
@media (max-width: 600px) {
  #visual.visual_002020000000000 > i {
    background: url("/resources/images/mps/sub/mo_visual_02.png") no-repeat center center/cover;
  }
  #visual.visual_002020000000000 > i img {
    opacity: 0;
  }
  #visual.visual_002040000000000 > i {
    background: url("/resources/images/mps/sub/mo_visual_03.png") no-repeat center center/cover;
  }
  #visual.visual_002040000000000 > i img {
    opacity: 0;
  }
}
@media (max-width: 480px) {
  .krds-breadcrumb-wrap {
    width: calc(100% - 4.5rem);
  }
  .krds-breadcrumb-wrap .breadcrumb > li {
    width: 100% !important;
  }
  .krds-breadcrumb-wrap .breadcrumb > li:not(:last-child) {
    display: none;
  }
  #container.has-depth4-tab .krds-breadcrumb-wrap .breadcrumb > li:not(:nth-last-child(2)) {
    display: none;
  }
  #container.has-depth4-tab .krds-breadcrumb-wrap .breadcrumb > li:nth-last-child(2) {
    display: list-item;
    width: 100% !important;
  }
  #visual.visual_002040000000000 > i {
    background-position: center right 40%;
  }
}
@media (max-height: 750px) {
  #side_quick .qck_toggle {
    top: 50%;
    -webkit-transform: translateY(-50%) translatex(0);
            transform: translateY(-50%) translatex(0);
  }
  #side_quick.active .qck_toggle {
    -webkit-transform: translateY(-50%) translatex(38rem);
            transform: translateY(-50%) translatex(38rem);
  }
}