/* 공통 */
:root { 
    /* 물류뉴스색상 */
    --news-color:#00253E;
    --news-header-color:#7192A8;
    /* 물류통계포커스색상 */
    --focus-color: #F07169;
    --focus-header-color: #F2A39E;
} 
img { width:100%; }
b,strong { font-weight: 600; }
body { background-color: #eee; color:#333; font-family: 'SUIT Variable', sans-serif; }
a { text-decoration: none; color:#333; }
.link { color:#114bff; text-decoration: underline; text-underline-offset: 2px; }
.fw-300 { font-weight: 300 !important; }
.fw-400 { font-weight: 400 !important; }
.mat5 { margin-top:5px; }
.mat10 { margin-top:10px; }
.pal14 { padding-left: 14px; }
.pal25 { padding-left: 25px !important; }
.hidden { width: 1px; height: 1px; font-size: 0px; line-height: 0px; position: absolute; }
.clear:after { display: block; content: ""; clear: both; height: 0; }

/* 리스트가 있을 시 사용 */
.mark-tit { padding-left: 14px; position: relative; margin-bottom:6px; }
.mark-tit::before { content: ''; width: 5px; height: 5px; border-radius: 50%; border: 1px solid var(--news-color); position: absolute; top:8px; left: 0px; }
.main .mark-tit::before { top:5px; }

.mark-list li { padding-left: 14px; position: relative; margin-bottom: 4px; }
.mark-list li::before { content: ''; width: 6px; height: 1px; background-color: var(--news-color); position: absolute; top: 8px; left: 0px; }

.note { padding-left: 14px; position: relative; color: #666; margin-top: 5px; font-size: 16px; }
.note::before { content: '*'; position: absolute; left: 0px; }
.note.double-note { padding-left: 16px; }
.note.double-note::before { content: '**'; letter-spacing: -1px; }

.sq-tit { padding-left: 14px; position: relative; }
.sq-tit::before { content: ''; width: 6px; height: 6px; border: 1px solid var(--news-color); position: absolute; top: 7px; left: 0px; }



/* 로지스진-메인 */
.logis { width:100%; max-width: 1024px; padding:0px 80px; box-sizing: border-box; margin: 0px auto; background:white; position: relative; }
.logis.news { min-height: 100vh; }

/* 헤더-로고상단 */
header { border-bottom:solid 5px var(--news-color); position: relative; z-index: 1;}
    header .header_wrap { width:100%; position: relative; padding-top: 57px; padding-bottom:27px; border-bottom:solid 2px var(--news-color); }
    header .header_wrap h1 { width:279px; position: absolute; left:50%; transform: translate(-50%); top:51px; }
    header .header_wrap > img:first-child { float:left; width: 118px; }
    header .header_wrap > img:last-child { float:right; width:144px; }

    /* 헤더-info라인 */
    header .header_info {width:100%; height:40px; line-height: 40px; position:relative; right:0px; padding:0px 20px; box-sizing: border-box;}
    header .header_info .view_before a{color:var(--news-color); font:550 17px/40px 'SUIT'; cursor: pointer;}
    header .header_info .subsc {float:left; font:600 17px/40px 'SUIT'; position: relative; }
    header .header_info .info_wrap { float:right; font:600 17px/40px 'SUIT'; position: relative;}
    header .header_info .info_wrap .before_list { visibility: hidden; border:solid 1px #A6C0DA; border-top: solid 0px var(--news-color); position: absolute; z-index: 1; text-align: center; width:80px; font:500 14px 'SUIT'; padding-top: 7px; background: white; transition: 0.3s; opacity: 0; top: 45px;}
    header .header_info .info_wrap .before_list.on {visibility: visible; opacity: 1;}
    header .header_info .info_wrap .before_list li {padding: 3px 0px 5px; cursor: pointer;}
    header .header_info .info_wrap .before_list a{color:var(--news-color);}
    header .header_info .info_wrap span {margin-right: 20px; text-align: end; color:var(--news-color);}
    header .header_info .info_wrap span.info02 {font:300 14px/40px 'SUIT'; margin-right:0px;}

.content { min-height: 88vh; background: white; }
    .content .inner { width:100%; }

/* 푸터 */
footer { border-top: solid 5px var(--news-color);}
    .footer_wrap {padding:0 80px; box-sizing: border-box; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -moz-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;}
    .footer_wrap .footer_logo {width:20%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -moz-align-items: center; -ms-flex-align: center; align-items: center;}
    .footer_txt {width: 68%; padding:23px 0 23px; color:#666; font:300 14px/140% 'SUIT';}
    .footer_txt p:nth-child(1){margin-bottom: 20px;}
    .footer_txt a{font-weight: 500; color:#333;}
    .c_right{text-align: center; border-top: solid 2px var(--news-color); padding:20px 0px 22px; color:#666; font:300 13px 'SUIT';}

/* 메인내부 */
.content.main {min-height: 300px; padding:35px 0px 5px; }
    .con {border: solid 1px #eee; border-top: solid 3px var(--news-header-color); padding:20px; box-sizing: border-box; position: relative; margin-bottom: 30px;}

    /* vertical */
    .con_v{ display: -webkit-box; display: -moz-box;    display: -ms-flexbox;    display: flex;    -webkit-box-pack: justify;    -moz-justify-content: space-between;    -ms-flex-pack: justify;    justify-content: space-between;}
    .con_v .con_img {width:50%;}
    .con_v .con_txt {width:50%;}

    .sec_01 { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -moz-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;} /* 1번, 2번, 3번, 4번 */
    .sec_02 { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -moz-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;} /* 5번, 6번 */
    .flex_01 {width:566px;} /* 1번, 2번, 3번 */
    .flex_02 {width:268px;} /* 4번 */
    .flex_03 { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -moz-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;} /* 5번, 6번 */

    /* con_01 : 1번 */
    .con_01 .con_img,.con_03 .con_img,.con_05 .con_img {height: 225px;}
    .con_01 .con_img img{height: 100%; object-fit: cover;}
    .con_01 .txt { margin-bottom: 20px; }
    .con_01 .con_txt {padding-left: 15px; box-sizing: border-box;}

    /* con_02 : 2번, 3번 공통 */
    .con_02 { width:47.5%; }
    .con_02 .tit { margin-bottom: 20px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex;}
    .con_02 .tit a { display: inline-block; width: calc(100% - 15px); }
    .con_02 .tit::before {display: inline-block; width:5px; height: 20px; margin:0px 7px 0px 0px; position: relative; top: 2px;}
    .con_02 .con_txt {padding:0px; margin-top: 20px;}
    .con_02 .con_img {height:140px;}
    .con_02 .con_img img {height: 100%; object-fit: cover;}

    /* con_03 : 4번 */
    .con_03 .con_img img { height:100%; object-fit: cover;}
    .con_03 .con_txt {padding:0px; margin-top: 20px;}
    .con_03 .txt {-webkit-line-clamp: 8;}

    /* con_04 : 5번 */
    .con_04 {width:268px;}
    .con_04 .con_img {width:100%; height:140px;}
    .con_04 .con_img img{height:100%; object-fit: cover;}
    .con_04 .con_txt {width:100%; margin-top: 20px;}
    .con_04 .tit { margin-bottom: 20px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex;}
    .con_04 .tit a { display: inline-block; width: calc(100% - 15px); }
    .con_04 .tit::before {display: inline-block; width:5px; height: 20px; margin:0px 7px 0px 0px; position: relative; top: 2px;}

    /* con_05 물류통계포커스 : 6번 */
    .con_05 {width:566px; border-top: solid 3px var(--news-header-color);}
    .con_05 .con_txt {width:50%; padding-right: 15px; box-sizing: border-box; position: relative;}
    .con_05 .con_txt > a {right:20px; bottom: 10px;}
    .con_05 .con_txt .tit::before {background-color: var(--news-color);}
    .con_05 .con_txt .txt {-webkit-line-clamp: 4;}
    .con_05 .con_img {width:47%;}
    .con_05 .con_img img{ height: 100%; object-fit: cover;}

    .con_h .con_img {width:100%;}
    .con_txt > a {width:23px; height:8px; display: block; position: absolute; right:20px; bottom:30px;}
    .tit{font:550 17px/140% 'SUIT'; margin-bottom: 10px; word-break: keep-all;}
    .tit::before{content: ""; width:60px; height:8px; display: block; margin-bottom: 12px; background-color: var(--news-color);}
    .tit br { display: none; }
    .txt {font:300 14px/140% 'SUIT'; margin-bottom: 5px;    overflow: hidden;    text-overflow: ellipsis;    display: -webkit-box;    -webkit-line-clamp: 6;    -webkit-box-orient: vertical;    /* text-align: justify; */    word-break: keep-all;}
    .txt p { display: inline; }
    .logis_c {text-align: left;}
    .txt_m {margin-bottom: 5px; text-indent: 0px;}
    .fs-19 { font-size: 19px; }



/* 로지스진-detail : 뉴스내부 */

/* 오른쪽 상단라벨 */
.label_wrap {position: absolute; right: 0px; top:0px; font:500 16px/140% 'SUIT';}
    .label_1 {display: inline-block; padding:7px 17px 8px; background-color: var(--news-color); color: white;}
    .label_2 {display: inline-block; padding:7px 30px 8px; background-color: #3D7194; color: white;}
    .img-wrap { display: flex; }
    .img-wrap img { width:50% !important; }
    
    /* 타이틀 */
    .detail .tit_wrap {padding: 70px 0 20px; position: relative; text-align: center; border-bottom: solid 5px var(--news-color);}
    .detail .tit_wrap h3{font:600 26px 'SUIT'; margin-bottom: 10px;}
    .sub_tit {font:500 20px 'SUIT';}
    .sub_tit > p { display: inline-block; }
    .sub_tit::before {content: "-"; display: inline-block; width:20px;}
    .sub_tit::after {content: "-";  display: inline-block; width:20px;}
    
    /* 물류통계포커스 */
    .logis_c .label_1{background-color: var(--focus-color);}
    .logis_c .label_2{background-color: var(--focus-header-color);}
    .logis_c .tit_wrap {border-bottom: solid 5px var(--focus-color);}

    /* vertical 가로형*/
    .cont_wrap.img_v {width:100%; padding:30px 0 20px;}
    .cont_wrap.img_v .txt_wrap { padding:0px 10px 0px;}
    .cont_wrap .img_v { width:100%;  object-fit: cover; margin-bottom: 30px; }

    /* horizontal 세로형*/
    .cont_wrap.img_h { width:100%; padding:30px 0px 20px; display: -webkit-box;    display: -moz-box;    display: -ms-flexbox;    display: flex;}
    .cont_wrap.img_h .txt_wrap {width:57%; padding:0px 32px 10px 20px;}
    .cont_wrap .img_h {width:52%;}
    .cont_wrap .img_h img { height:100%; object-fit: contain; object-position: top;}

    .cont_wrap .txt_wrap { padding:0px 10px 20px; font:300 18px/140% 'SUIT'; text-align: justify;}
    .cont_wrap .txt_wrap > * {margin-bottom: 15px;}
    .cont_wrap .txt_wrap > *:last-child {margin-bottom: 0px;}

    .detail_view {display: inline-block; padding:8px 27px 8px; border: solid 1px #333; font:500 14px/20px 'SUIT'; border-radius: 50px; color:#333; margin-bottom: 60px; transition: 0.3s;}
    .detail_view:hover {background-color: #333333; color:white;}

    .b_btns {border-top: solid 2px var(--news-color); padding:30px 0 32px;    display: -webkit-box;    display: -moz-box;    display: -ms-flexbox;    display: flex;    -webkit-box-pack: justify;    -moz-justify-content: space-between;    -ms-flex-pack: justify;    justify-content: space-between;}
    .b_btns a {display: inline-block; font:500 16px/140% 'SUIT';}
    .b_btns a.on {color:white; border: solid 1px var(--news-header-color); background: var(--news-header-color);}
    .b_btns a.off {color:#ccc; border: solid 1px #ccc; cursor: default;}
    .b_btns a:nth-child(1) {padding:11px 7.5% 12px; }
    .b_btns a:nth-child(2) {padding:11px 24.5% 12px; color:white; border: solid 1px var(--news-color); background-color: var(--news-color);}
    .b_btns a:nth-child(3) {padding:11px 7.5% 12px; }

@media screen and (max-width:1024px){
    .logis{width:100%;}
    .flex_01 {width:65%;}
    .flex_02 {width:32%;}
    .con_04 {width:31%;}
    .con_05 {width:66%;}
}
@media screen and (max-width:900px){
    .logis{padding:0 30px;}
    header .header_wrap h1{width:240px;}
}
@media screen and (max-width:768px){
    .img-wrap { flex-wrap:wrap; }
    .img-wrap img { width:100% !important; }
    .img-wrap img:first-child { margin-bottom: 0px; }

    .logis{padding:0 14px;}
    header .header_wrap h1{width:160px; top: 33px;}
    header .header_wrap{padding-top:34px;}
    .before_list {width:64px;}
    header .header_info {padding:0px 12px;}
    header .header_info .subsc {font-size: 14px;}
    header .header_info .view_before a{font-size: 14px;}
    header .header_info span {font-size: 14px;}
    header .header_info span.info02 {font-size: 12px;}
    header .header_info span:last-child {font-size:12px ;}
    header .header_info span{margin-right: 10px;}
    .footer_wrap {-webkit-box-lines: multiple; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; padding:14px; }    
    .footer_wrap .footer_logo {width:152px;}
    .footer_txt {width:100%; padding-bottom: 0px;}

    .detail .tit_wrap {padding-top:60px;}

    .sec_01{ -webkit-box-lines: multiple; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
    .sec_02{ -webkit-box-lines: multiple; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
    .con_v{ -webkit-box-lines: multiple; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
    .con_v .con_img,.con_v .con_txt{width:100%;}
    .con_txt{padding:0px; margin-top: 20px;}
    .flex_01,.flex_02{width:100%;}
    .con_01 .con_txt,.con_05 .con_txt {padding:0px;}
    
    .con_04 {width: 100%;}
    .con_04 .con_img {height:225px;}
    .con_05{width:100%; -webkit-box-orient: vertical; -webkit-box-direction: reverse; -moz-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse;}
    .txt,.con_03 .txt {margin-bottom: 20px; -webkit-line-clamp: 3;}

    .detail .tit_wrap h3{font-size: 20px;}
    .sub_tit {font-size: 18px;}
    .cont_wrap .txt_wrap {font-size: 16px;}

    .b_btns a:nth-child(1){padding:8px 6% 8px;}
    .b_btns a:nth-child(2){padding:8px 20% 8px;}
    .b_btns a:nth-child(3){padding:8px 6% 8px;}

    .cont_wrap.img_h{ -webkit-box-lines: multiple; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
    .cont_wrap .img_h{width:100%; height: auto;}
    .cont_wrap.img_h .txt_wrap {width:100%; padding:30px 10px 20px; box-sizing: border-box;}
}
@media screen and (max-width:500px){

    header .header_info .info_wrap {line-height: 38px;}
    header .header_info .info_wrap span {margin-right:6px;}
    header .header_wrap > img:first-child,header .header_wrap > img:last-child{width:70px;}
    header .header_wrap > img:last-child {margin-top: 3px;}
    
    .flex_03{ -webkit-box-lines: multiple; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
    .con_02 {width: 100%;}
    .con_02 .con_img {height: 225px;}
    .con_02 .tit,.con_04 .tit{-webkit-box-lines: multiple; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;}
    .con_02 .tit::before,.con_04 .tit::before {content: ""; width: 60px; height: 8px; display: block; margin-bottom: 12px;}
    
    .txt {margin-bottom: 20px;}

    .footer_txt{font-size: 12px; padding: 14px 0 14px;}
    .c_right{font-size: 12px;padding: 14px 0px 16px;}

    .b_btns a:nth-child(1){padding:8px 6% 8px;}
    .b_btns a:nth-child(2){padding:8px 15% 8px;}
    .b_btns a:nth-child(3){padding:8px 6% 8px;}
}