@charset "utf-8";

/* 아코디언 */
.quick05_kotra {overflow:hidden; position: relative; height:230px; margin:40px 0;}
.quick05_kotra .imgbox {overflow: hidden; position: relative; height:100%;}
.quick05_kotra .imgbox img {min-width: 100%; min-height: 100%; position: absolute; top: -999px; bottom: -999px; left: -999px; right: -999px; margin: auto;}

.quick05_kotra .mv_accordion {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);max-width: 1300px;width: 100%;display: flex;}
.quick05_kotra .mv_accordion > li + li {margin-left:3px;}
.quick05_kotra .mv_accordion li .item_box,
.quick05_kotra .mv_accordion li .item_last {overflow:hidden;display: block;float: left;width: 214px;height: 230px;padding: 30px;box-sizing: border-box;color:#fff;transition: all 0.5s;cursor: pointer;}

.quick05_kotra .mv_accordion li .item_box .item_tit,
.quick05_kotra .mv_accordion li .item_last .item_tit {float: left;width: 100%;height: 100%;box-sizing: border-box;text-align: center;display: flex;flex-direction: column;align-items: center;}
.quick05_kotra .mv_accordion li .item_box .item_tit .tit,
.quick05_kotra .mv_accordion li .item_last .item_tit .tit {display:inline-block; font-size: 24px; line-height: 1.2em; color:#fff;}

.quick05_kotra .mv_accordion li .item_box .iconbox,
.quick05_kotra .mv_accordion li .item_last .iconbox {display:inline-block; margin-top:25px; width:100px; height:100px; line-height: 100px; border-radius: 100%; background: rgb(0 0 0 / 40%);}
.quick05_kotra .mv_accordion li .item_box .iconbox img,
.quick05_kotra .mv_accordion li .item_last .iconbox img {vertical-align: middle;}

.quick05_kotra .mv_accordion li .item_box .item_txt {overflow: hidden;height: auto;margin-top: 5px;}
.quick05_kotra .mv_accordion li .item_box .item_txt .item_subtit {overflow:hidden; display: inline-block; text-overflow: ellipsis; white-space: nowrap; width: 98%; font-size:16px;}
.quick05_kotra .mv_accordion li .item_box .item_txt .blt_dot {display: flex; flex-wrap: wrap; justify-content: space-between; gap: 5px; margin-top: 10px; margin-bottom:3px;}
.quick05_kotra .mv_accordion li .item_box .item_txt .blt_dot li {position:relative;padding-left: 15px; width: calc(100% / 2 - 28px);line-height:24px;}
.quick05_kotra .mv_accordion li .item_box .item_txt .blt_dot li:after {content:'';position:absolute;top: 12px;left:0;display:inline-block;width:5px;height:5px;border-radius:100%;background:#fff;}
.quick05_kotra .mv_accordion li .item_box .item_txt .blt_dot li a {overflow: hidden;display: inline-block;text-overflow: ellipsis;white-space: nowrap;max-width: calc(100% - 30px);color:#fff;font-size: 18px;}
.quick05_kotra .mv_accordion li .item_box .item_txt .blt_dot li img {margin-left:10px; vertical-align: 2px;}


/* 활성화시 */
.quick05_kotra .mv_accordion li:not(.item04) .item_box.active {transition: all 0.5s;width: 648px;/* max-width: 650px; */text-align: left;}
.quick05_kotra .mv_accordion li:not(.item04) .item_box.active .item_tit .iconbox {display: none;}
.quick05_kotra .mv_accordion li:not(.item04) .item_box.active .item_tit {float:none;height:auto;text-align: left;align-items: flex-start;}
.quick05_kotra .mv_accordion li:not(.item04) .item_box.active .item_tit .tit {font-size: 30px;}

.quick05_kotra .item01 .item_box {background:#173f92;}
.quick05_kotra .item02 .item_box {background:/* #229ab5 */ #1f8096;}/*2411접근성*/
.quick05_kotra .item03 .item_box {background:/*#dc6e53*/#b75b49;}
.quick05_kotra .item04 .item_last {background:/* #387de0 */#286eca;}

/* 마지막 퀵메뉴 */
.quick05_kotra .mv_accordion li .item_last {width: 215px;height:100%;}



@media(min-width: 799px) {

    /* 활성화시 */
    /*.quick05_kotra .mv_accordion li:not(.item04) .item_box.active {background:rgb(5 51 64 / 65%);}*/
    .quick05_kotra .mv_accordion li:not(.item04) .item_box {visibility: visible!important;}
    
    .quick05_kotra .mv_accordion .item01 .item_box.active {background:rgb(0 37 76 / 65%);}
	.quick05_kotra .mv_accordion .item02 .item_box.active {background:rgb(5 51 64 / 70%);}/*2411접근성*/
	.quick05_kotra .mv_accordion .item03 .item_box.active {background:rgb(91 32 3 / 0.65);}
}

@media(max-width: 799px) {

    .quick05_kotra {height:195px; margin:0;}
    .quick05_kotra .imgbox {display: none;}
    .quick05_kotra .mv_accordion {display: block;top: 0;left: 0;transform: initial;}
    .quick05_kotra .mv_accordion > li + li {margin-left:0;}
    .quick05_kotra .mv_accordion li .item_box,
    .quick05_kotra .mv_accordion li .item_last {width:auto!important;padding:0!important;width: calc(100% / 4)!important;height: auto;margin: 0;}
    .quick05_kotra .mv_accordion li .item_box .iconbox,
    .quick05_kotra .mv_accordion li .item_last .iconbox {display: none!important;}

    .quick05_kotra .mv_accordion li .item_box .item_txt {display:none; position: absolute; top:45px; left:0; width:100%; margin-top:0;}
    .quick05_kotra .mv_accordion li .item_box .item_txt .item_subtit {font-size: 14px;}
    .quick05_kotra .mv_accordion li .item_box .item_txt .blt_dot li a {display:inline-block; font-size:14px;}
    .quick05_kotra .mv_accordion li .item_box .item_txt .blt_dot li a img {width:14px;}
    .quick05_kotra .mv_accordion li .item_box .item_txt .blt_dot li:after {width:3px; height:3px;}

    .quick05_kotra .mv_accordion li .item_box .item_tit,
    .quick05_kotra .mv_accordion li .item_last .item_tit {width: 100%; height:auto; padding-top:0; border-right:1px solid #99b7d6; text-align: center!important;}
    .quick05_kotra .mv_accordion li .item_last .item_tit {border-right:0;}
    .quick05_kotra .mv_accordion li .item_box .item_tit .tit,
    .quick05_kotra .mv_accordion li .item_last .item_tit .tit {display:block; width:100%; height: 45px;line-height: 45px;font-size: 14px!important;}
    
    


    /* 활성화시 */
    .quick05_kotra .mv_accordion li .item_box.active,
    .quick05_kotra .mv_accordion li .item_last.active {visibility: visible!important;transition: all 0.2s;width:50%; padding: 0 30px;text-align: left;}
    .quick05_kotra .mv_accordion li .item_box.active .item_txt {display:block;padding: 15px 20px 17px;box-sizing: border-box;}

    .quick05_kotra .item01 .item_box .item_txt {background:#173f92;}
    .quick05_kotra .item02 .item_box .item_txt {background:/* #229ab5; */ #1f8096;}/*2411접근성 */
    .quick05_kotra .item03 .item_box .item_txt {background:/* #dc6e53; */ #b75b49}/*2411접근성 */
    .quick05_kotra .item04 .item_last .item_txt {background:#387de0;} 
}