@charset "utf-8";

 /* doc.css는 디자인페이지 스타일을 정의합니다. */
 .root_daum_roughmap {
     width: 100% !important;
     height: 540px !important;
 }

 .root_daum_roughmap .wrap_map {
     height: 540px !important;
 }

 .roughmap_lebel_text {
     line-height: 0 !important;
     font-size: 0 !important;
 }

 .roughmap_lebel_text:after {
     content: "테바인베스트먼트";
     font-size: 12px;
     line-height: 15px;
 }

 .en-map iframe {
     width: 100% !important;
     height: 540px !important;
 }

 .doc-tit {
     position: relative;
     padding-left: 12px;
     color: #000022;
     font-size: var(--font-size-25-20);
     font-weight: 500;
     line-height: 1em;
     letter-spacing: -.03em;
     margin-bottom: var(--margin-30-16);
     font-family: 'NEXON Lv2 Gothic';
 }

 .doc-tit:before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 2px;
     height: 25px;
     background-color: #000022;
 }

 .doc-cnt {
     margin-bottom: var(--margin-150-70);
 }

 .doc-cnt:last-child {
     margin-bottom: 0;
 }

 .doc-cnt.bg-grey {
     background-color: #f4f4f4;
 }

 .doc-sub-cnt {
     padding: var(--padding-100-60);
 }

 .doc-sub-cnt:last-child {
     padding-bottom: 0;
 }

 .doc-sub-cnt.bg-grey {
     background-color: #f9f9f9;
 }

 .mb150 {
     margin-bottom: var(--margin-150-70);
 }

 .mb20 {
     margin-bottom: var(--margin-20-10);
 }

 .pt0 {
     padding-top: 0 !important;
 }

 .pb0 {
     padding-bottom: 0 !important;
 }

 .pb100 {
     padding-bottom: var(--padding-100-60) !important;
 }

 .txt-blue {
     color: #293C4E !important;
 }

 .txt-grey {
     color: #888888 !important;
 }

 .txt-yellow {
     color: #dab837 !important;
 }

 .bg-grey {
     background-color: #f9f9f9;
 }

 .flex-wrap {
     display: flex;
 }

 /* 회사소개 */
 .company-overview {
     font-size: var(--font-size-18);
     line-height: 1.67em;
 }

 .company-overview .heading {
     margin-bottom: clamp(40px, calc(100 / var(--inner) * 100vw), 100px);
     text-align: center;
 }

 .company-overview .heading .img {
     background: #E7E9EB;
     width: fit-content;
     margin: 0 auto;
     padding: 60px 45px;
     border-radius: 50%;
     zoom: 0.6;
 }

 .heading-txt {
     display: flex;
     align-items: center;
     text-align: center;
     justify-content: center;
     margin-top: 30px;
     flex-direction: column;
     word-break: keep-all;
 }

 .company-overview .heading h2 {
     font-family: 'Roboto', sans-serif;
     font-size: var(--font-size-48-24);
     color: var(--color-primary);
     margin-bottom: 30px;
 }

 .company-overview .info {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     border-top: 2px solid var(--color-primary);
     border-bottom: 1px solid #ddd;
 }

 .company-overview .info dl {
     display: flex;
     margin-bottom: -1px;
     border-bottom: 1px solid #ddd;
     align-items: center;
 }

 .company-overview .info dt {
     width: 26.6666%;
     padding: var(--space-25-15) var(--space-20-10);
     font-weight: 600;
     color: var(--color-dark);
 }

 .company-overview .info dd {
     flex: 1 1 auto;
     min-width: 0;
     width: 1%;
     padding: var(--space-25-15) var(--space-20-10);
     padding-left: 0;
 }

 .company-overview.en .info {
     display: flex;
     flex-wrap: wrap;
 }

 .company-overview.en .info dl {
     width: 50%;
 }

 .company-overview.en .info dl:last-child {
     width: 100%;
 }

 .company-overview.en .info dt {
     width: 225px;
 }


 .history {
     position: relative;
     background: url('../images/sub/history-bg.png') 50% 0 no-repeat;
 }

 .history:before {
     content: '';
     position: absolute;
     top: 0;
     left: 50%;
     width: 1px;
     height: 100%;
     background: #ddd;
 }

 .history .group {
     display: flex;
     align-items: center;
     position: relative;
     min-height: clamp(80px, calc(150 / 1200 * 100vw), 150px);
 }

 .history .group:not(:last-child) {
     margin-bottom: var(--margin-80-40);
 }

 .history .group h2 {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     display: flex;
     justify-content: center;
     align-items: center;
     width: clamp(80px, calc(150 / 1200 * 100vw), 150px);
     height: clamp(80px, calc(150 / 1200 * 100vw), 150px);
     border-radius: 100%;
     background: var(--color-primary);
     font-size: var(--font-size-28-20);
     font-weight: 700;
     line-height: 1.3em;
     color: #fff;
 }

 .history .group ul {
     display: grid;
     gap: 6px;
     width: calc(50% - 105px);
     font-size: var(--font-size-18);
     line-height: 1.67em;
 }

 .history .group ul li {
     display: flex;
     align-items: flex-start;
     gap: 10px;
 }

 .history .group ul li:before {
     content: '';
     display: block;
     margin-top: .6em;
     min-width: 6px;
     min-height: 6px;
     background: #ccc;
     border-radius: 100%;
 }

 .history .group:nth-child(odd) {
     justify-content: flex-end;
 }

 .history .group:nth-child(even) ul li {
     flex-direction: row-reverse;
     text-align: right;
 }

 .directions {
     display: flex;
     flex-wrap: wrap;
     justify-content: space-between;
     gap: 30px 40px;
     border-bottom: 2px solid #ddd;
     padding-bottom: var(--margin-80-40);
     margin-bottom: var(--margin-80-40);
 }

 .directions .text-area {
     font-size: var(--font-size-40);
     line-height: 1.3em;
     letter-spacing: -.03em;
     color: var(--color-dark);
 }

 .directions .info-area {
     width: 100%;
     max-width: 600px;
 }

 .directions .info-area h3 {
     margin-bottom: .7em;
     font-size: var(--font-size-24);
     line-height: 1.3em;
     letter-spacing: -.03em;
     color: var(--color-dark);
 }

 .directions .info-area h3:before {
     content: '';
     display: block;
     margin-bottom: var(--margin-15-10);
     width: 40px;
     height: 4px;
     background: var(--color-dark);
 }

 .directions .info-area .addr {
     margin-bottom: 1.1em;
     font-size: var(--font-size-20);
     font-weight: 600;
     line-height: 1.5em;
     letter-spacing: -.03em;
     color: var(--color-dark);
 }

 .directions .info-area .info {
     display: flex;
     flex-wrap: wrap;
     gap: 15px 25px;
     font-size: var(--font-size-18);
     line-height: 1.5em;
 }

 .directions .info-area .info img {
     width: 30px;
     margin: -.2em 10px 0 0;
     vertical-align: middle;
 }

 .directions .info-area .info .item {
     min-width: 208px;
 }

 /* 조직도 */
 .org {
     margin-top: 100px;
     text-align: center;
 }

 .org h1 {
     margin-bottom: 20px;
 }

 .org p {
     color: var(--body-color) !important;
     word-break: keep-all;
     font-size: var(--font-size-20);
     background: #e9e9e9;
     padding: 30px;
 }

 .people>ul>li {
     display: flex;
     margin-bottom: var(--margin-80-40);
 }

 .name {
     margin-right: 30px;
     min-width: 315px;
 }

 .about h2 {
     font-size: var(--font-size-24);
     color: var(--color-primary);
     padding-bottom: 20px;
 }

 .about h2::after {
     content: "";
     display: block;
     width: 50px;
     height: 4px;
     background-color: var(--color-primary);
     margin-top: 10px;
 }

 .about .g {
     color: #898989;
     font-size: var(--font-size-16);
     font-weight: 400;
     margin-left: 5px;
 }

 .about p {
     padding-top: 10px;
     margin-bottom: 20px;
     line-height: 1.5;
 }

 ul.com {
     display: flex;
 }

 ul.com li {
     border: 1px solid #ddd;
     padding: 2px 16px;
     margin-right: 8px;
     font-size: var(--font-size-16);
     color: var(--body-color);
     border-radius: 50px;
     color: #878787;
 }

 /* 투자정보 */
 .investment {
     font-size: var(--font-size-18);
     line-height: 1.67em;
 }

 .investment .group {
     display: flex;
     gap: clamp(20px, calc(100 / var(--inner) * 100vw), 60px)
 }

 .investment .group:not(:last-child) {
     margin-bottom: clamp(40px, calc(100 / var(--inner) * 100vw), 100px);
 }

 .investment .group:nth-child(even) {
     flex-direction: row-reverse;
 }

 .investment .img {
     width: 50%;
 }

 .investment .cnt {
     flex: 1 1 auto;
     min-width: 0;
     width: 1%;
 }

 .investment .num {
     margin-bottom: var(--margin-20-10);
     font-size: var(--font-size-60-30);
     line-height: 1.2em;
     color: var(--color-primary);
 }

 .investment h2 {
     margin-bottom: var(--margin-30-16);
     font-size: var(--font-size-28-20);
     line-height: 1.3em;
     letter-spacing: -.03em;
     color: var(--color-dark);
 }

 .investment ul {
     display: flex;
     flex-wrap: wrap;
     flex-direction: row;
     margin-top: 20px;
 }

 .investment ul li {
     display: flex;
     align-items: flex-start;
     gap: 10px;
     flex-direction: row;
     width: 150px;
 }

 .investment ul li:before {
     content: '';
     display: block;
     margin-top: .6em;
     min-width: 6px;
     min-height: 6px;
     background: #ccc;
     border-radius: 100%;
 }

 /* 채용정보 */
 .recruit-guide {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: var(--padding-40-16);
 }

 .recruit-guide .box {
     display: flex;
     flex-direction: column;
     justify-content: space-between;
     min-height: 316px;
     padding: var(--padding-50-20) var(--padding-40-20);
     border: 1px solid #ddd;
 }

 .recruit-guide .box:nth-child(even) {
     background: #fafafa;
 }

 .recruit-guide h2 {
     margin-bottom: .8em;
     color: var(--color-dark);
     font-size: var(--font-size-24);
     line-height: 1.3em;
     letter-spacing: -.03em;
 }

 .recruit-guide p {
     font-size: var(--font-size-16);
     line-height: 1.63em;
     letter-spacing: -.03em;
 }

 .recruit-guide p strong {
     color: var(--color-dark);
 }

 .recruit-guide a {
     color: var(--color-primary);
 }

 .recruit-guide .num {
     color: var(--color-primary);
     margin-right: .5em;
 }

 .recruit-guide .ico {
     text-align: right;
 }

 .recruit-guide .ico img {
     width: clamp(48px, calc(64 / 1200 * 100vw), 64px);
 }