@charset 'utf-8';
/* 모바일 Tiny ~ 359px */
@media screen and (max-width: 356px) {
    html {font-size: 6px;}
}

/* 모바일까지 ~767px */
@media screen and (max-width: 767px) {
    .mo-only, .mo-tb-only {display: block;}
    .hd-menu {min-width:300px;}
    /* 푸터 */
    .ft-info dt {clear: both;}
    .ft-info dd:nth-of-type(2) {clear:both}
    .ft-info dd:after {display: none;}
}

/* 태블릿부터 768px~ */
@media screen and (min-width: 768px) {
    .depth1 > a {line-height: 7rem;}
    .aa252f-menu a {padding: 0 1.5rem;}
    /* 푸터 */
    .ft-nav1 {float: left;}
    .ft-nav2 {float: right;}
}

/* 태블릿만 768px~1024px */
@media screen and (min-width: 768px) and (max-width: 1279px) {
    .tb-only, .mo-tb-only, .tb-pc-only {display: block;}
}

/* PC부터 1025px~ */
@media screen and (min-width: 1280px) {
    html {font-size: 10px;}
    .pc-only, .tb-pc-only {display: block;}  
    #ka-hd, #ka-hd * {transition: 0.4s linear;}
    #ka-hd a {transition: none;}
    #ka-hd.bg-change {background-color: #fff !important;}
    #ka-hd.bg-change:before {/*회색라인*/ position: absolute; left: 0; top: 8.9rem;  content: ''; display: block; width: 100%; height: 0.1rem; background-color: #ccc;}
    #ka-hd a:hover {color: #aa252f !important;}
    .ka-logo {width: 13rem; height: 9rem; margin-left: 0.5rem;  margin-right: 1.5rem;}
    #ka-hd.bg-change .ka-logo {background-image: url('../images/kaps_logo_color.png');}
    #ka-gnb {position: static; float: left; width: auto; height: auto; background-color: transparent; overflow: inherit; }
    #ka-gnb a {color: #fff;}
    #ka-hd.bg-change #ka-gnb a {color: #222;}
    #ka-gnb ol {}
    .depth1 {float: left;}
    .depth1 a {padding: 0;}
    .depth1 > a {position: relative; padding: 0 7.5rem 0 1.5rem; line-height: 9rem;  overflow: hidden;}
    .depth1.on > a {color: #aa252f !important;}
    .depth1 > a:before {display: none;}
    .depth1 > a:after {/*빨간색 라인*/content: ''; display: block; position: absolute; left: 0; bottom: 0rem; width: 100%; height: 0.3rem; background-color: #aa252f; transform: scaleX(0); transform-origin: left center; transition: 0.4s;}
    .depth1.on > a:after {transform: scaleX(1);}
    .depth2 {padding: 1rem 0 3rem 1.5rem; background-color: transparent;}
    .depth2 li {}
    .hd-menu {position: static; float: right; width: auto; margin-top: 0.9rem; background-color: transparent;}
    #ka-hd.bg-change .hd-menu a {color: #222;}
    .call-menu a {border: 0;}
    .side-gnb-btn {top: -9999rem;}
}


/* PC부터 1441px~ */
@media screen and (min-width: 1600px) {
    .ka-logo {margin-left: 15rem;}
    #ka-gnb {margin-left: 15rem;}
    .hd-menu {margin-right: 4rem;}   
}