/* Extracted verbatim from the legacy -win_story.php inline <style> blocks. */
/* =========================================================
   기본
   ========================================================= */

.en .badge{
	font-size:12px;
}

.en .badge:is([class*="type2-"]){
	height:40px;
	max-width:100px;
}


/* =========================================================
   성공사례 카드
   기존 페이지 레이아웃은 건드리지 않고
   카드 내부 디자인만 변경
   ========================================================= */

.sub.win .data-list.col-3 > li > .item.win{
	display:flex;
	flex-direction:column;

	width:100%;
	height:100%;

	padding:32px 30px;
	box-sizing:border-box;

	background:#fff;
	border-radius:10px;

	overflow:hidden;
}


/* =========================================================
   기존 badge 영역 제거
   기존에는 업무분야 + 소송/자문사례 뱃지가 들어가 있었지만
   변경 디자인에서는 사용하지 않음
   ========================================================= */

.sub.win .data-list.col-3 > li > .item.win > .badge-wrap{
	display:none;
}


/* =========================================================
   판결 결과
   기존 카드 하단에 있던 judgment-wrap을
   카드 상단으로 이동
   ========================================================= */

.sub.win .data-list.col-3 > li > .item.win > .judgment-wrap{
	display:block;

	width:100%;

	order:1;

	min-width:0;
}


/* 기존 아이콘 제거 */

.sub.win .data-list.col-3 > li > .item.win > .judgment-wrap .ico{
	display:none;
}


/* 판결 결과 */

.sub.win .data-list.col-3 > li > .item.win > .judgment-wrap span{
	display:inline-flex;
	align-items:center;
	justify-content:center;

	max-width:100%;

	height:32px;
	min-height:32px;

	padding:0 14px;

	box-sizing:border-box;

	background:#172b55;
	border-radius:4px;

	color:#fff;

	font-size:14px;
	font-weight:600;
	line-height:1;

	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;

	vertical-align:top;
}


/* =========================================================
   본문 영역
   ========================================================= */

.sub.win .data-list.col-3 > li > .item.win > .flex-column-both{
	display:flex;
	flex-direction:column;

	width:100%;
	flex:1;

	min-width:0;

	order:2;
}


/* text-wrap */

.sub.win .data-list.col-3 > li > .item.win .text-wrap{
	width:100%;
	min-width:0;
	margin-top:-5px;

	display:flex;
	flex-direction:column;

	flex:1;
}


/* =========================================================
   업무 분야
   cpCate
   ========================================================= */

.sub.win .data-list.col-3 > li > .item.win .text-wrap .category{
	display:block;

	margin:0 0 7px;

	color:#1769ff;

	font-size:15px;
	font-weight:600;
	line-height:1.4;

	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}


/* =========================================================
   제목
   ========================================================= */

.sub.win .data-list.col-3 > li > .item.win .text-wrap .title {
    width: 100%;

    /* 글자 영역은 정확히 2줄 */
    height: calc(2 * 1.4em);
    min-height: 0 !important;
    max-height: calc(2 * 1.4em);

    /* 라인 아래 설명과의 간격 */
    margin: 0 0 14px;

    /* 좌우 패딩 제거 */
    padding: 0;

    box-sizing: border-box;

    color: #111;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: -0.035em;
    word-break: keep-all;

    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;

    overflow: hidden !important;
    text-overflow: ellipsis;

    /* 기존 border 제거 */
    border: 0;

    /* 제목 아래 라인을 별도로 표현 */
    position: relative;
}

/* =========================================================
   설명
   ========================================================= */

.sub.win .data-list.col-3 > li > .item.win .text-wrap .text{
	display:-webkit-box;

	width:100%;

	margin:0;

	color:#333;

	font-size:15px;
	font-weight:400;
	line-height:1.65;

	word-break:keep-all;

	overflow:hidden;
	text-overflow:ellipsis;

	-webkit-box-orient:vertical;
	-webkit-line-clamp:3;
}


.sub.win .data-list.col-3 > li > .item.win .text-wrap .title {
    width: 100%;
    height: calc(2 * 1.4em);
    min-height: 0 !important;
    max-height: calc(2 * 1.4em);

    margin: 0 0 14px;
    padding: 0;

    box-sizing: border-box;

    border: 0;

    font-size: 21px;
    line-height: 1.4;
    font-weight: 700;
    letter-spacing: -0.035em;
    word-break: keep-all;

    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;

    overflow: hidden !important;
    text-overflow: ellipsis;
}


.sub.win .data-list.col-3 > li > .item.win .text-wrap .title + .text {
    padding-top: 10px;
    border-top: 1px solid #c8c8c8;
}


/* =========================================================
   모바일
   기존 반응형 레이아웃 유지
   ========================================================= */

@media all and (max-width:768px){

	.sub.win .data-list.col-3 > li > .item.win{
		padding:30px;
	}

	.sub.win .data-list.col-3 > li > .item.win > .judgment-wrap{
		margin-bottom:0px;
	}

	.sub.win .data-list.col-3 > li > .item.win > .judgment-wrap span{
		height:31px;
		min-height:31px;

		padding:0 13px;

		font-size:14px;
	}

	.sub.win .data-list.col-3 > li > .item.win .text-wrap .category{
		font-size:15px;
	}

	.sub.win .data-list.col-3 > li > .item.win .text-wrap .title{
		font-size:20px;
		line-height:1.4;

		min-height:56px;

		margin-bottom:13px;
		padding-bottom:12px;
	}

	.sub.win .data-list.col-3 > li > .item.win .text-wrap .text{
		font-size:14px;
		line-height:1.65;

	}

}

/* =========================================================
   성공사례 카드 제목 / 결과 뱃지 말줄임
   ========================================================= */

/* =========================================================
   성공사례 리스트 개편
   기존 마크업 기준
   ========================================================= */

/* 카드 */
.sub.win:not(.detail) .data-list.col-3 > li {
    min-width: 0;
}

.sub.win:not(.detail) .data-list.col-3 > li > .item.win {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
    box-sizing: border-box;
}


/* ---------------------------------------------------------
   상단 배지
   --------------------------------------------------------- */

.sub.win:not(.detail) .item.win .badge-wrap {
    display: flex;
    align-items: flex-start;
    gap: 8px;

    width: 100%;
    min-width: 0;
    overflow: hidden;
}

/* 개별 배지 */
.sub.win:not(.detail) .item.win .badge-wrap .badge {
    display: block;

    min-width: 0;
    max-width: 100%;

    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;

    box-sizing: border-box;
}

/* 배지가 2개일 경우 각각 최대 폭 */
.sub.win:not(.detail) .item.win .badge-wrap .badge + .badge {
    max-width: calc(50% - 4px);
}

/* 첫 번째 배지가 하나뿐인 경우 */
.sub.win:not(.detail) .item.win .badge-wrap .badge:first-child:last-child {
    max-width: 100%;
}


/* ---------------------------------------------------------
   본문 영역
   --------------------------------------------------------- */

.sub.win:not(.detail) .item.win .flex-column-both {
    min-width: 0;
    flex: 1;

    display: flex;
    flex-direction: column;
}


/* ---------------------------------------------------------
   제목 / 설명 영역
   --------------------------------------------------------- */

.sub.win:not(.detail) .item.win .text-wrap {
    min-width: 0;
}

/* 제목 - 최대 2줄 */
.sub.win:not(.detail) .item.win .text-wrap .title {
    display: -webkit-box !important;

    width: 100%;
    min-width: 0;

    overflow: hidden !important;

    white-space: normal !important;
    word-break: keep-all;

    text-overflow: ellipsis !important;

    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;

    line-height: 1.45 !important;

    max-height: calc(1.45em * 2) !important;
}


/* 설명 - 최대 3줄 */
.sub.win:not(.detail) .item.win .text-wrap .text {
    display: -webkit-box !important;

    width: 100%;
    min-width: 0;

    overflow: hidden !important;

    white-space: normal !important;
    word-break: keep-all;

    text-overflow: ellipsis !important;

    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;

    line-height: 1.45 !important;

    max-height: calc(1.65em * 3) !important;
}


/* ---------------------------------------------------------
   판결 결과
   --------------------------------------------------------- */

.sub.win:not(.detail) .item.win .judgment-wrap {
    min-width: 0;
}

.sub.win:not(.detail) .item.win .judgment-wrap span {
    display: block;

    min-width: 0;
    max-width: 100%;

    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}


/* =========================================================
   데스크톱
   ========================================================= */

@media all and (min-width: 961px) {

    .sub.win:not(.detail) .data-list.col-3 > li > .item.win {
        min-height: 320px;
    }

    .sub.win:not(.detail) .item.win .badge-wrap {
        height: 22px;
    }


    .sub.win:not(.detail) .item.win .text-wrap .title {
        font-size: 22px;
    }

    .sub.win:not(.detail) .item.win .text-wrap .text {
        margin-top: 18px;
    }
}


/* =========================================================
   태블릿
   ========================================================= */

@media all and (min-width: 769px) and (max-width: 1260px) {

    .sub.win:not(.detail) .data-list.col-3 > li > .item.win {
        min-height: 300px;
    }

    .sub.win:not(.detail) .item.win .badge-wrap {
        height: 34px;
    }



    .sub.win:not(.detail) .item.win .text-wrap .title {
        font-size: 20px;
    }

    .sub.win:not(.detail) .item.win .text-wrap .text {
        margin-top: 16px;
    }
}


/* =========================================================
   모바일
   ========================================================= */

@media all and (max-width: 768px) {

    .sub.win:not(.detail) .data-list.col-3 > li > .item.win {
        min-height: 0;
    }

    .sub.win:not(.detail) .item.win .badge-wrap {
        height: 32px;
    }



    .sub.win:not(.detail) .item.win .text-wrap .title {
        font-size: 20px;
        line-height: 1.45 !important;
        max-height: calc(1.45em * 2) !important;
    }

    .sub.win:not(.detail) .item.win .text-wrap .text {
        margin-top: 14px;
        font-size: 14px;
        line-height: 1.45 !important;

    max-height: calc(1.65em * 3) !important;
    }

    .sub.win:not(.detail) .item.win .judgment-wrap {
        margin-top: 0px;
    }
}


.sub.win .data-list.col-3 > li > .item.win > .judgment-wrap span {
	display: block;

	width: max-content;
	max-width: 100%;
	height: 32px;
	min-height: 32px;

	padding: 0 14px;

	box-sizing: border-box;

	background: #172b55;
	border-radius: 4px;

	color: #fff;
	font-size: 14px;
	font-weight: 600;
	line-height: 32px;

	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}