@charset "utf-8"; /* standard 1920px 54개 */ :root { --w-60: 3.1250vw; --fs-12: clamp(12px, 0.6250vw, 15px); --fs-14: clamp(12px, 0.7292vw, 17px); --fs-16: clamp(13px, 0.8333vw, 19px); --fs-18: clamp(14.6px, 0.9375vw, 21.4px); --fs-20: clamp(16.2px, 1.0416vw, 23.8px); --fs-22: clamp(17.8px, 1.1458vw, 26.2px); --fs-26: clamp(21.1px, 1.3541vw, 30.9px); --fs-30: clamp(24.3px, 1.5625vw, 35.7px); --fs-32: clamp(25.9px, 1.6666vw, 38.1px); --fs-36: clamp(29.1px, 1.875vw, 42.9px); --fs-48: clamp(38.9px, 2.5vw, 57.1px); --fs-62: min(3.2291vw, 73.8px); --fs-68: min(3.5416vw, 80.9px); --fs-82: min(4.2708vw, 97.6px); --fs-110: min(5.7291vw, 130.9px); --fs-115: min(5.9895vw, 136.7px); --fs-150: min(7.8125vw, 178.5px); --fs-240: min(12.5vw, 285.6px); --fs-300: min(15.625vw, 357px); --cl-8: clamp(5px, 0.4167vw, 11px); --cl-9: clamp(6px, 0.4688vw, 12px); --cl-10: clamp(7px, 0.5208vw, 13px); --cl-12: clamp(9px, 0.6250vw, 15px); --cl-13: clamp(10px, 0.6771vw, 16px); --cl-14: clamp(11px, 0.7292vw, 17px); --cl-20: clamp(17px, 1.0417vw, 23px); --cl-28: clamp(23px, 1.4583vw, 33px); --cl-31: clamp(28px, 1.6146vw, 34px); --cl-50: clamp(47px, 2.6042vw, 53px); --cl-64: clamp(61px, 3.3333vw, 67px); --minmax-66: 66px; } .aos-animate .img-animate-2 > img[data-animation-delay="500"] { animation-delay: 0.5s; } .aos-animate .img-animate-2 > img[data-animation-delay="800"] { animation-delay: 0.8s; } .xs { display: none !important; } .md { display: none !important; } .xl { display: block !important; } .xl-none { display: none !important; } .xs-flex { display: none !important; } .md-flex { display: none !important; } .xl-flex { display: flex !important; } .xs-inline { display: none !important; } .md-inline { display: none !important; } .xl-inline { display: inline-block !important; } .inner-wrap { padding-left: var(--w-60); padding-right: var(--w-60); } .xl-center { width: 83.3333vw; margin-left: auto; margin-right: auto; } .xl-inner { padding-left: var(--w-60); padding-right: var(--w-60); } .xl-keep-all { word-break: keep-all; } .d-xl-flex { display: flex !important; } .flex-xl-center { justify-content: center !important; align-items: center !important; } .flex-xl-wrap { flex-wrap: wrap !important; } .flex-xl-ac { align-items: center !important; } .flex-xl-as { align-items: flex-start !important; } .flex-xl-ae { align-items: flex-end !important; } .flex-xl-js { justify-content: flex-start !important; } .flex-xl-je { justify-content: flex-end !important; } .flex-xl-jc { justify-content: center !important; } .flex-xl-jsb { justify-content: space-between !important; } .flex-xl-col { flex-direction: column !important; } .flex-xl-0-0-auto { flex: 0 0 auto !important; } .flex-xl-1-1-auto { flex: 1 1 auto !important; } .flex-xl-0-1-auto { flex: 0 1 auto !important; } .flex-xl-1-0-auto { flex: 1 0 auto !important; } .mx-xl-auto { margin-left: auto !important; margin-right: auto !important; } .ellipsis-xl-1 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; } .ellipsis-xl-2 { overflow: hidden; display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; } .ellipsis-xl-3 { overflow: hidden; display: -webkit-box !important; -webkit-line-clamp: 3; -webkit-box-orient: vertical; text-overflow: ellipsis; } .ellipsis-xl-4 { overflow: hidden; display: -webkit-box !important; -webkit-line-clamp: 4; -webkit-box-orient: vertical; text-overflow: ellipsis; } .ellipsis-xl-5 { overflow: hidden; display: -webkit-box !important; -webkit-line-clamp: 5; -webkit-box-orient: vertical; text-overflow: ellipsis; } .ellipsis-xl-6 { overflow: hidden; display: -webkit-box !important; -webkit-line-clamp: 6; -webkit-box-orient: vertical; text-overflow: ellipsis; } a.btn-custom { display: inline-flex; gap: 0.2083vw; align-items: center; padding: 0.6250vw 0.7292vw; border-radius: var(--static-20); border: var(--static-10) solid #000; font-size: var(--fs-14); font-weight: 700; line-height: normal; } a.btn-custom.shortcut > span { width: 0.6771vw; height: 0.5729vw; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 11' fill='none'%3E%3Cpath d='M7.75 10.5L6.525 9.29167L9.63125 6.33333H0V4.66667H9.63125L6.525 1.70833L7.75 0.5L13 5.5L7.75 10.5Z' fill='black'/%3E%3C/svg%3E") center/100% no-repeat; } a.btn-download { display: inline-block; padding: var(--cl-12) var(--cl-31) var(--cl-12) var(--cl-14); border-radius: var(--static-20); color: #fff; font-size: var(--fs-14); font-weight: 700; max-width: 100%; background: url('../img/icon-download.svg') calc(100% - var(--cl-14)) center/var(--cl-13) var(--cl-12) no-repeat #000; } a.btn-download.white { color: #000; background: url('../img/icon-download-black.svg') calc(100% - var(--cl-14)) center/var(--cl-13) var(--cl-12) no-repeat #fff; border: var(--static-10) solid #000; } a.btn-download > span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; line-height: normal; } #wrap { width: 100%; } #header { width: 100%; background: #fff; position: fixed; top: 0; transition: top .5s ease, background-color .5s ease; z-index: 99; } #header.hide { top: -4.6875vw; } #header.show { background: rgba(255,255,255,0.9); } #header.show.on { background: rgba(255,255,255,1); } #header > div { width: 100%; height: 4.6875vw; display: flex; justify-content: space-between; } #header > div > div:nth-of-type(1) { display: flex; gap: 2.6042vw; } #header > div > div:nth-of-type(1) > p.logo { margin-top: 1.0417vw; width: 9.6875vw; height: 1.8750vw; } #header > div > div:nth-of-type(1) > p.logo > a { display: block; width: 100%; height: 100%; background: url('../img/logo.svg') center/100% no-repeat; } #header > div > div:nth-of-type(1) > ul { display: flex; align-items: center; gap: 1.5625vw; } #header > div > div:nth-of-type(1) > ul > li {} #header > div > div:nth-of-type(1) > ul > li > a { color: var(--text-dark); font-size: var(--fs-22); font-weight: 700; } #header > div > div:nth-of-type(1) > ul > li.on > a, #header > div > div:nth-of-type(1) > ul > li > a:hover { color: var(--text-highlight); } #header > div > div:nth-of-type(2) { display: flex; align-items: center; } #header > div > div:nth-of-type(2) > ul { display: flex; gap: 1.3542vw; } #header > div > div:nth-of-type(2) > ul > li {} #header > div > div:nth-of-type(2) > ul > li > a { color: var(--text-dark); font-weight: 500; font-size: var(--fs-18); } #header > div > div:nth-of-type(2) > ul > li.on > a, #header > div > div:nth-of-type(2) > ul > li > a:hover { color: var(--text-highlight); } #header > div > div:nth-of-type(2) > div { margin-left: 1.2500vw; } #header > div > div:nth-of-type(2) > div > p { display: flex; justify-content: center; align-items: center; padding: var(--cl-10) var(--cl-14); border: var(--static-10) solid rgba(74,73,72,0.4); border-radius: 5.2083vw; cursor: pointer; } #header > div > div:nth-of-type(2) > div > p > span { margin: 0 0.3125vw 0 0.1563vw; font-size: var(--fs-14); font-weight: 700; color: var(--text-dark); display: flex; align-items: center; } #header > div > div:nth-of-type(2) > div > p > span::before { content: ''; width: 0.6771vw; height: 0.6771vw; background: url('../img/icon-earth.svg') center/100% no-repeat; margin-right: 0.1563vw; } #header > div > div:nth-of-type(2) > div > p > span::after { content: ''; width: 0.4167vw; height: 0.2604vw; background: url('../img/icon-arrow-down.svg') center/100% no-repeat; margin-left: 0.3125vw; } #header > div > div:nth-of-type(2) > p.ham { width: var(--cl-28); aspect-ratio: 28/16; margin-left: 1.0417vw; cursor: pointer; background: url('../img/icon-menu.svg') center/100% no-repeat; } #header .menu { position: relative; width: 100%; height: 15.2083vw; background: #fff; padding: 0 3.1250vw; display: none; } #header .menu > li { position: absolute; top: 0; width: calc(100% - 6.2500vw); padding-left: calc(var(--cl-186) + 2.6042vw); padding-top: 2.6042vw; display: none; gap: 2.0833vw 8.3333vw; flex-wrap: wrap; border-top: var(--static-10) solid #DEDDCF; } #header .menu > li.on { display: flex; } #header .menu > li.end { justify-content: flex-end; padding-right: 3.1250vw; } #header .menu > li > dl {} #header .menu > li > dl > dt {} #header .menu > li > dl > dt > a { font-size: var(--fs-22); font-weight: 600; text-transform: uppercase; } #header .menu > li > dl > dt > a:hover { color: var(--text-highlight); } #header .menu > li > dl > dd {} #header .menu > li > dl > dd > a { display: block; margin-top: 1.0417vw; font-size: var(--fs-16); font-weight: 500; color: var(--text-dark); } #header .menu > li > dl > dd > a:hover { color: var(--text-highlight); } #container { width: 100%; margin-top: 4.6875vw; } #container .main-title { font-size: var(--fs-82); font-weight: 800; padding-top: 3.1250vw; } #container .snb { width: 100%; display: flex; gap: 1.5625vw; margin-top: 3.1250vw; } #container .snb > li {} #container .snb > li > a { font-size: var(--fs-18); font-weight: 700; color: var(--text-body); } #container .snb > li > a.on { color: #000; text-decoration: underline var(--static-15); text-underline-offset: 0.1563vw; } #container .contents { width: 100%; padding-bottom: 5.2083vw; } #container .contents .paging { padding-top: 3.1250vw; display: flex; justify-content: center; align-items: center; border-top: var(--static-10) solid #C2BEB8; } #container .contents .paging > p { cursor: pointer; } #container .contents .paging > p.prev { margin-left: 0.7813vw; } #container .contents .paging > p.next { margin-right: 0.7813vw; } #container .contents .paging > p.inactive { opacity: 0.3; } #container .contents .paging > ul { margin: 0 1.2500vw; display: flex; gap: 0.4167vw; } #container .contents .paging > ul > li.dot { display: flex; justify-content: center; align-items: center; padding-bottom: 0.5208vw; } #container .contents .paging > ul > li > a { display: block; width: 2.3958vw; height: 2.3958vw; display: flex; justify-content: center; align-items: center; border: var(--static-10) solid #EFEFE9; border-radius: 5.2083vw; font-size: var(--fs-16); font-weight: 500; color: var(--text-body); } #container .contents .paging > ul > li > a.current { background: #000; border: var(--static-10) solid #000; color: #fff; } #container .contents .sch { width: 100%; height: 2.6042vw; border: var(--static-10) solid #C2BEB8; border-radius: 0.1042vw; display: flex; align-items: center; padding: 0 1.0417vw; } #container .contents .sch > input[type=text] { width: 100%; flex: 0 1 auto; border: 0; font-size: var(--fs-16); padding-right: 1.0417vw; } #container .contents .sch > input[type=text]::placeholder { color: rgba(0,0,0,0.3); } #container .contents .sch > button { flex: 0 0 auto; width: 0.9375vw; height: 0.9375vw; background: url('../img/icon-search.svg') center/100% no-repeat; cursor: pointer; } #container .contents .category > select { width: 100%; height: 2.6042vw; border: var(--static-10) solid #C2BEB8; border-radius: var(--static-20); padding: 0 1.0417vw; font-size: var(--fs-16); font-weight: 500; outline: none; background: url('../img/icon-select-arrow.svg') calc(100% - 1.0417vw) center/0.7292vw 0.4167vw no-repeat; } #container .contents .select-custom { width: 100%; height: 2.6042vw; border: var(--static-10) solid #C2BEB8; border-radius: var(--static-20); padding: 0 1.0417vw; font-size: var(--fs-16); font-weight: 500; outline: none; background: url('../img/icon-select-arrow.svg') calc(100% - 1.0417vw) center/0.7292vw 0.4167vw no-repeat; } #container .contents .input-custom { width: 100%; border: var(--static-10) solid #C2BEB8; font-size: var(--fs-16); padding: 0 1.0417vw; height: 2.6042vw; } #container .contents .input-custom::placeholder { color: rgba(0,0,0,0.3); } #container .contents a.btn-homepage { display: inline-block; padding: 0.6250vw 1.6146vw 0.6250vw 0.7292vw; border-radius: var(--static-20); color: #fff; font-size: var(--fs-14); font-weight: 700; max-width: 100%; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 13' fill='none'%3E%3Cpath d='M1.5 11.5556H3.75V7.22222H8.25V11.5556H10.5V5.05556L6 1.80556L1.5 5.05556V11.5556ZM0 13V4.33333L6 0L12 4.33333V13H6.75V8.66667H5.25V13H0Z' fill='white'/%3E%3C/svg%3E") calc(100% - 0.7292vw) center/0.6250vw 0.6771vw no-repeat #000; } #container .contents a.btn-homepage > span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; line-height: normal; } #container .contents .checkbox > input { display: none; } #container .contents .checkbox > label { display: block; line-height: 1.1458vw; font-size: var(--fs-16); font-weight: 500; color: var(--text-darkest); position: relative; padding-left: 1.5625vw; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal; } #container .contents .checkbox > label::before { content: ''; position: absolute; left: 0; top: 50%; width: 1.1458vw; height: 1.1458vw; border: var(--static-10) solid #C2BEB8; border-radius: 0.2083vw; margin-top: -0.5729vw; box-sizing: border-box; } #container .contents .checkbox > input:checked+label::before { border: 0; background: url('../img/icon-checked.svg') center/0.6250vw 0.4688vw no-repeat #1C1B1B; } #container #map .marker { width: 2.5000vw; height: 2.5000vw; } #container #map .clusterer { width: 2.5000vw; height: 2.5000vw; background: #fff; border: var(--static-20) solid #DEDDCF; border-radius: 5.2083vw; font-size: var(--fs-16); font-weight: 700; display: flex; align-items: center; justify-content: center; } #container #map .clusterer:hover { background: #000; color: #fff; border: var(--static-20) solid var(--text-highlight); } #footer { width: 100%; background: #000; padding: 0 8.3333vw 4.1667vw; position: relative; z-index: 2; } #footer .inner { display: grid; grid-template-columns: repeat(2, auto); justify-content: space-between; } #footer .inner .menu { display: flex; gap: 3.1250vw; align-items: center; } #footer .inner .menu > li {} #footer .inner .menu > li > a { font-size: var(--fs-20); font-weight: 600; color: #fff; } #footer .inner .top-btn { padding: 1.6667vw 0; justify-self: end; } #footer .inner .top-btn > img { width: 100%; cursor: pointer; width: 3.1250vw; height: 3.1250vw; } #footer .inner > hr { width: 100%; height: var(--static-10); background: var(--text-dark); grid-column: 1/3; } #footer .inner .logo { width: 11.6146vw; padding: 3.6458vw 0 0; } #footer .inner .logo > img { width: 100%; } #footer .inner .family-site { padding: 4.1667vw 0 0; width: 13.0208vw; justify-self: end; } #footer .inner .family-site > p { width: 100%; font-size: var(--fs-16); color: #fff; font-weight: 700; position: relative; padding-bottom: 1.0417vw; border-bottom: var(--static-20) solid #fff; cursor: pointer; } #footer .inner .family-site > p::after { content: ''; width: 0.4167vw; height: 0.3125vw; background: url('../img/icon-family-down.svg') center/100% no-repeat; position: absolute; right: 0; top: 0.3125vw; } #footer .privacy { padding-top: 3.6458vw; display: flex; gap: 1.0417vw; flex-wrap: wrap; } #footer .privacy > dd > a { font-size: var(--fs-14); color: var(--text-body); font-weight: 600; } #footer .privacy > dd:nth-of-type(1) > a, #footer .privacy > dd:nth-of-type(2) > a { color: #fff; font-weight: 700; } #footer .privacy > dd:nth-of-type(2) { width: 52.0833vw; } #footer .inner .copyright { margin-top: 1.0417vw; font-size: var(--fs-14); color: var(--text-dark); } #footer .inner .info { padding-top: 3.1250vw; font-size: var(--fs-14); color: var(--text-body); font-weight: 500; line-height: 1.57; text-align: right; } #gnb { position: fixed; top: 0; z-index: 100; width: 100%; height: 100%; background: #1C1B1B; display: none; } #gnb .inner-wrap { width: 100%; height: 100%; padding-bottom: 10.4167vw; overflow-y: auto; } #gnb .head { width: 100%; height: 4.6875vw; display: flex; justify-content: space-between; } #gnb .head > p { width: 9.6875vw; margin-top: 1.0417vw; } #gnb .head > p > a { display: block; width: 100%; } #gnb .head > p > a > img { width: 100%; } #gnb .head > div { cursor: pointer; margin-top: 1.8750vw; } #gnb .menu { width: 100%; border-top: var(--static-10) solid #4A4948; padding-top: 4.1667vw; display: flex; gap: 9.3750vw; flex-wrap: wrap; } #gnb .menu > dl {} #gnb .menu > dl > dt { font-size: var(--fs-26); color: #94918C; font-weight: 800; text-transform: uppercase; } #gnb .menu > dl > dt+dd { margin-top: 3.6458vw; } #gnb .menu > dl > dd { margin-top: 2.0833vw; } #gnb .menu > dl > dd > p > a { font-size: var(--fs-22); color: #fff; font-weight: 600; text-transform: uppercase; } #gnb .menu > dl > dd > p > a:hover { color: var(--text-highlight); } #gnb .menu > dl > dd > ul {} #gnb .menu > dl > dd > ul > li { margin-top: 0.8333vw; } #gnb .menu > dl > dd > ul > li > a { font-size: var(--fs-16); font-weight: 500; color: #94918C; text-transform: uppercase; } #gnb .menu > dl > dd > ul > li > a:hover { color: var(--text-highlight); } #slide-popup-wrap { position: fixed; width: 100%; height: 100vh; top: 0; z-index: 100; } #slide-popup-wrap > p.close { position: absolute; z-index: 10; cursor: pointer; width: 3.1250vw; height: 3.1250vw; top: 1.0417vw; left: 1.5625vw; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60' fill='none'%3E%3Cellipse opacity='0.8' cx='30' cy='30' rx='30' ry='30' transform='rotate(-90 30 30)' fill='black'/%3E%3Cpath d='M36.6875 23.1406L22.7555 37.0726' stroke='white' stroke-width='2'/%3E%3Cpath d='M22.7559 23.1445L36.6879 37.0765' stroke='white' stroke-width='2'/%3E%3C/svg%3E"); background-size: 100%; } #slide-popup-wrap > div { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; position: relative; } #slide-popup-wrap > div > div { width: 62.5000vw; overflow: hidden; } #slide-popup-wrap > div > div .swiper { width: 100%; } #slide-popup-wrap > div > div .swiper .swiper-wrapper { height: auto; } #slide-popup-wrap > div > div .swiper .swiper-wrapper .swiper-slide { width: 100%; height: 39.5833vw; } #slide-popup-wrap > div > div .swiper .swiper-wrapper .swiper-slide img { width: 100%; height: 100%; object-fit: cover; object-position: center; } #slide-popup-wrap > div > p.bg { position: absolute; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.40); backdrop-filter: blur(0.5208vw); } #slide-popup-wrap > div > div > ul { position: relative; z-index: 5; display: flex; gap: 2.0833vw; justify-content: center; width: 100%; height: 1.3542vw; align-items: center; margin-top: 1.0417vw; } #slide-popup-wrap > div > div > ul > li { width: 2.6563vw; height: 1.0417vw; background-size: 100%; cursor: pointer; } #slide-popup-wrap > div > div > ul > li.prev { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='51' height='20' viewBox='0 0 51 20' fill='none'%3E%3Cpath d='M9.82903 1.51521L1.34375 10.0005L9.82903 18.4858' stroke='white' stroke-width='1.6'/%3E%3Cpath d='M1 10.0005H51' stroke='white' stroke-width='1.6'/%3E%3C/svg%3E"); } #slide-popup-wrap > div > div > ul > li.next { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='51' height='20' viewBox='0 0 51 20' fill='none'%3E%3Cpath d='M41.171 1.51411L49.6562 9.99939L41.171 18.4847' stroke='white' stroke-width='1.6'/%3E%3Cpath d='M50 9.99939H0' stroke='white' stroke-width='1.6'/%3E%3C/svg%3E"); position: relative; } #slide-popup-wrap > div > div > ul > li.next::after { content: ''; position: absolute; left: -1.0417vw; top: 50%; width: var(--static-10); height: 1.3542vw; background: #C2BEB8; margin-top: -0.6771vw; } /*=========================== main ===========================*/ #wrap:has(#container.main) #header.top { background: transparent; } #wrap:has(#container.main) #header.top > div > div:nth-of-type(1) > p.logo > a { background: url('../img/logo-white.svg') center/100% no-repeat; } #wrap:has(#container.main) #header.top > div > div:nth-of-type(1) > ul > li > a { color: #fff; } #wrap:has(#container.main) #header.top > div > div:nth-of-type(2) > ul > li > a { color: #fff; } #wrap:has(#container.main) #header.top > div > div:nth-of-type(2) > div > p { border: var(--static-10) solid #fff; } #wrap:has(#container.main) #header.top > div > div:nth-of-type(2) > div > p > span { color: #fff; } #wrap:has(#container.main) #header.top > div > div:nth-of-type(2) > div > p > span::before { background: url('../img/icon-earth-white.svg') center/100% no-repeat; } #wrap:has(#container.main) #header.top > div > div:nth-of-type(2) > div > p > span::after { background: url('../img/icon-arrow-down-white.svg') center/100% no-repeat; } #wrap:has(#container.main) #header.top > div > div:nth-of-type(2) > p.ham { background: url('../img/icon-menu-white.svg') center/100% no-repeat; } #wrap:has(#container.main) #container { margin-top: 0; } #container.main { line-height: normal; } #container.main .ms { position: relative; width: 100%; height: 100vh; } #container.main .ms .video { width: 100%; } #container.main .ms .video > video, #container.main .ms .video > img { width: 100%; height: 100%; object-fit: cover; object-position: center; } #container.main .ms .inner-wrap { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: flex-end; padding-bottom: 2.0833vw; } #container.main .ms .inner-wrap > dl { width: 100%; } #container.main .ms .inner-wrap > dl > dt { position: relative; color: #fff; font-size: var(--fs-36); text-shadow: 0 0.2083vw 0.6250vw rgba(0, 0, 0, 0.55); padding-bottom: 1.0417vw; } #container.main .ms .inner-wrap > dl > dt::after { content: ''; width: 100%; height: var(--static-10); position: absolute; left: 0; bottom: 0; background: rgba(255,2255,255,0.3); transform: scaleX(0); transform-origin: right; transition: transform 1s; } #container.main .ms .inner-wrap > dl > dt.active::after { transform: scaleX(1); } #container.main .ms .inner-wrap > dl > dt > p.masked-element { width: 0; overflow: hidden; transition: width 2.5s, opacity 1.5s; white-space: nowrap; opacity: 0.3; } #container.main .ms .inner-wrap > dl > dt > p.masked-element.show { width: 100%; opacity: 1; } #container.main .ms .inner-wrap > dl > dt > p.masked-element.end { overflow: visible; } #container.main .ms .inner-wrap > dl > dd { width: 100%; margin-top: 21.85vh; display: grid; grid-template-columns: 1fr 46.8750vw; align-items: end; overflow: hidden; } #container.main .ms .inner-wrap > dl > dd > div { overflow: hidden; } #container.main .ms .inner-wrap > dl > dd > div > div { overflow: hidden; } #container.main .ms .inner-wrap > dl > dd > div .swiper-wrap { width: 46.8750vw; transform: translateX(100%); transition: transform 1s; } #container.main .ms .inner-wrap > dl > dd > div .swiper-wrap.active { transform: translateX(0); } /* 슬라이드 순서 헷갈리지 말 것. grid order 참고 */ #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(1) { order: 1; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(1) .swiper-wrap .swiper-pagination { display: none; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(1) .swiper-wrap { width: 46.8750vw; height: 12.5000vw; border-radius: 0.5208vw; background: rgba(0,0,0,0.85); color: #fff; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(1) .swiper-slide { padding: 1.5625vw 0 0 1.5625vw; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(1) .swiper-slide-active { position: relative; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(1) .swiper-slide-active::after { content: ''; position: absolute; right: 0; top: 50%; margin-top: -4.6875vw; width: var(--static-10); height: 9.3750vw; background: rgba(255,255,255,0.2); } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(1) .swiper-slide > p { font-size: var(--fs-20); font-weight: 600; color: #fff; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(1) .swiper-slide > p > span { font-weight: 300; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(1) .swiper-slide > div { margin-top: 1.5625vw; color: #fff; display: flex; align-items: flex-end; gap: 0.3646vw; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(1) .swiper-slide > div > p { letter-spacing: -0.1797vw; font-size: var(--fs-115); font-weight: 400; } /* #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(1) .swiper-slide > div > p > span.period { font-weight: 100; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(1) .swiper-slide > div > p > span.comma { font-size: 7.8125vw; } */ #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(1) .swiper-slide > div > span { font-size: var(--fs-48); font-weight: 500; letter-spacing: 0; padding-bottom: 1.0417vw; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(2) { order: 0; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(2) .swiper-wrap .swiper-pagination { display: none; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(2) .swiper-slide {} #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(2) .swiper-slide > p { font-size: var(--fs-20); font-weight: 800; color: #fff; text-shadow: 0 0.2083vw 0.6250vw rgba(0, 0, 0, 0.55); } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(2) .swiper-slide > p > span { font-weight: 300; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(2) .swiper-slide > div { margin-top: 0.0000vw; color: #fff; display: flex; align-items: baseline; gap: 1.0417vw; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(2) .swiper-slide > div > p { letter-spacing: -1.2500vw; font-size: var(--fs-300); font-weight: 500; text-shadow: 0 0.2083vw 0.6250vw rgba(0, 0, 0, 0.55); line-height: 0.9; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(2) .swiper-slide > div > p > span.period { font-weight: 100; } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(2) .swiper-slide > div > p > span.comma { font-size: var(--fs-150); } #container.main .ms .inner-wrap > dl > dd > div:nth-of-type(2) .swiper-slide > div > span { font-size: var(--fs-82); font-weight: 500; letter-spacing: 0; } #container.main .section .more { display: flex; align-items: center; gap: 0.2083vw; } #container.main .section .more::after { content: ''; width: 0.7292vw; height: 0.5208vw; background-size: 100%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='10' viewBox='0 0 14 10' fill='none'%3E%3Cpath d='M8.75 10L7.525 8.79167L10.6312 5.83333H0V4.16667H10.6312L7.525 1.20833L8.75 0L14 5L8.75 10Z' fill='%23222222'/%3E%3C/svg%3E"); } #container.main .section1 { padding: 4.1667vw 0; } #container.main .section1 .inner {} #container.main .section1 .inner > p { padding-left: 1.5625vw; font-size: var(--fs-36); font-weight: 800; text-transform: uppercase; } #container.main .section1 .inner > ul { margin-top: 2.6042vw; display: grid; transition: all 0.8s ease-in-out; grid-template-rows: max-content 1fr; } #container.main .section1 .inner > ul.reits { grid-template-columns: 41.6667vw 21.6146vw 20.0521vw; } #container.main .section1 .inner > ul.fund { grid-template-columns: 20.8333vw 43.2292vw 19.2708vw; } #container.main .section1 .inner > ul.trust { grid-template-columns: 21.6146vw 21.6146vw 40.1042vw; } #container.main .section1 .inner > ul > li:has(> p) { position: relative; padding: 0 1.5625vw 2.0833vw; overflow: hidden; } #container.main .section1 .inner > ul > li:has(> p) > p:nth-of-type(1) { width: 3.7500vw; } #container.main .section1 .inner > ul > li:has(> p) > p:nth-of-type(1) > img { width: 100%; } #container.main .section1 .inner > ul > li:has(> p) > p:nth-of-type(2) { margin-top: 1.0417vw; font-size: var(--fs-62); font-weight: 500; } #container.main .section1 .inner > ul > li:has(> p) > p:nth-of-type(3) { margin-top: 1.5625vw; font-size: var(--fs-20); font-weight: 600; color: var(--text-darkest); } #container.main .section1 .inner > ul > li:has(> p) > p:nth-of-type(4) { opacity: 0; height: 0; margin-top: 1.0417vw; font-size: var(--fs-16); color: var(--text-body); line-height: 1.48; transition: opacity 0.8s ease-in-out; } #container.main .section1 .inner > ul > li:has(> p).on > p:nth-of-type(4) { opacity: 1; height: auto; } #container.main .section1 .inner > ul > li:has(> p) > a { display: block; position: absolute; right: 1.5625vw; bottom: 2.0833vw; width: 3.1250vw; height: 3.1250vw; border-radius: 5.2083vw; border: var(--static-10) solid #EFEFE9; background-size: 0.7813vw 0.7292vw; background-position: center; background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='14' viewBox='0 0 15 14' fill='none'%3E%3Cpath d='M7.375 1V13' stroke='%234A4948' stroke-width='2' stroke-linecap='square' stroke-linejoin='round'/%3E%3Cpath d='M1.375 7H13.375' stroke='%234A4948' stroke-width='2' stroke-linecap='square' stroke-linejoin='round'/%3E%3C/svg%3E"); } #container.main .section1 .inner > ul > li:has(> p).on > a { border: var(--static-10) solid #EFEFE9; background-size: 0.7813vw 0.7292vw; background-color: #000; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='14' viewBox='0 0 15 14' fill='none'%3E%3Cpath d='M10.55 8H0.375V6H10.55L5.95 1.4L7.375 0L14.375 7L7.375 14L5.95 12.6L10.55 8Z' fill='white'/%3E%3C/svg%3E"); } #container.main .section1 .inner > ul > li:nth-of-type(1) > p:nth-of-type(4) { width: 29.6875vw; } #container.main .section1 .inner > ul > li:nth-of-type(2) > p:nth-of-type(4) { width: 26.3021vw; } #container.main .section1 .inner > ul > li:nth-of-type(3) > p:nth-of-type(4) { width: 28.9063vw; } #container.main .section1 .inner > ul > li:nth-of-type(2) { position: relative; } #container.main .section1 .inner > ul > li:nth-of-type(2)::before { content: ''; position: absolute; left: 0; top: 0; width: var(--static-10); height: 100%; background: #DEDDCF; } #container.main .section1 .inner > ul > li:nth-of-type(2)::after { content: ''; position: absolute; right: 0; top: 0; width: var(--static-10); height: 100%; background: #DEDDCF; } #container.main .section1 .inner > ul > li:nth-of-type(3) > a { right: 0; } #container.main .section1 .inner > ul > li.grid-box { grid-column: 1/span 3; grid-row: 2/3; border-top: var(--static-10) solid #DEDDCF; overflow: hidden; } #container.main .section1 .inner > ul > li.grid-box > div { overflow: hidden; display: flex; width: max-content; transition: all 0.8s ease-in-out; } #container.main .section1 .inner > ul.fund > li.grid-box > div { transform: translateX(-83.3333vw); } #container.main .section1 .inner > ul.trust > li.grid-box > div { transform: translateX(-166.6667vw); } #container.main .section1 .inner > ul > li.grid-box > div > dl { width: 83.3333vw; overflow: hidden; } #container.main .section1 .inner > ul > li.grid-box > div > dl > dt { display: flex; justify-content: space-between; font-size: var(--fs-20); font-weight: 800; padding: 1.5625vw 0 0; } #container.main .section1 .inner > ul > li.grid-box > div > dl > dt > ul { display: flex; gap: 1.9792vw; } #container.main .section1 .inner > ul > li.grid-box > div > dl > dt > ul > li { cursor: pointer; } #container.main .section1 .inner > ul > li.grid-box > div > dl > dt > ul > li:nth-of-type(1) { width: 0.9896vw; height: 0.9375vw; background-size: 100%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='18' viewBox='0 0 19 18' fill='none'%3E%3Cpath d='M5.29286 10.2857H18.375V7.71429H5.29286L11.2071 1.8L9.375 0L0.375 9L9.375 18L11.2071 16.2L5.29286 10.2857Z' fill='%234A4948'/%3E%3C/svg%3E"); } #container.main .section1 .inner > ul > li.grid-box > div > dl > dt > ul > li:nth-of-type(2) { width: 0.9896vw; height: 0.9375vw; background-size: 100%; position: relative; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='18' viewBox='0 0 19 18' fill='none'%3E%3Cpath d='M13.4571 10.2857H0.375V7.71429H13.4571L7.54286 1.8L9.375 0L18.375 9L9.375 18L7.54286 16.2L13.4571 10.2857Z' fill='%234A4948'/%3E%3C/svg%3E"); } #container.main .section1 .inner > ul > li.grid-box > div > dl > dt > ul > li:nth-of-type(2)::after { content: ''; width: 0.0521vw; height: 1.3542vw; background: var(--text-light); position: absolute; left: -1.0417vw; top: 50%; margin-top: -0.6771vw; } #container.main .section1 .inner > ul > li.grid-box > div > dl > dd { margin-top: 1.5625vw; } #container.main .section1 .inner > ul > li.grid-box > div > dl > dd .swiper-slide {} #container.main .section1 .inner > ul > li.grid-box > div > dl > dd .swiper-slide > div { position: relative; border-radius: 0.3125vw; overflow: hidden; height: 22.1354vw; } #container.main .section1 .inner > ul > li.grid-box > div > dl > dd .swiper-slide > div > img { width: 100%; height: 100%; object-fit: cover; object-position: center; } #container.main .section1 .inner > ul > li.grid-box > div > dl > dd .swiper-slide > div > p { position: absolute; top: 0.4167vw; right: 0.4167vw; width: 2.2917vw; } #container.main .section1 .inner > ul > li.grid-box > div > dl > dd .swiper-slide > div > p > img { width: 100%; } #container.main .section1 .inner > ul > li.grid-box > div > dl > dd .swiper-slide > p { margin-top: 1.0417vw; font-size: var(--fs-20); color: var(--text-darkest); } #container.main .section2 { padding: 4.1667vw 0 5.7292vw; border-top: var(--static-10) solid #C2BEB8; } #container.main .section2 .inner { display: grid; grid-template-columns: repeat(2, 1fr); gap: 5.2083vw; } #container.main .section2 .inner .expert { position: relative; display: grid; grid-template-rows: max-content 1fr; } #container.main .section2 .inner .expert::after { content: ''; width: 100%; height: 7.9167vw; left: -8.3333vw; bottom: 0; position: absolute; background: var(--text-highlight); } #container.main .section2 .inner .expert > div:nth-of-type(1) { position: relative; } #container.main .section2 .inner .expert > div:nth-of-type(1) > p { font-size: var(--fs-26); font-weight: 800; text-transform: uppercase; padding-bottom: 4.1146vw; } #container.main .section2 .inner .expert > div:nth-of-type(1) > ul { width: 39.0625vw; position: absolute; left: 0; bottom: 1.0417vw; display: flex; gap: 0 1.1458vw; } #container.main .section2 .inner .expert > div:nth-of-type(1) > ul > li { font-size: 0.8333vw; font-weight: 500; color: var(--text-light); } #container.main .section2 .inner .expert > div:nth-of-type(1) > ul > li~li { position: relative; } #container.main .section2 .inner .expert > div:nth-of-type(1) > ul > li~li::before { content: ''; position: absolute; left: -0.7292vw; top: 50%; width: 0.3125vw; height: var(--static-10); background: #C2BEB8; } #container.main .section2 .inner .expert > div:nth-of-type(1) > ul > li.swiper-pagination-bullet { width: max-content; height: auto; background: none; opacity: 1; } #container.main .section2 .inner .expert > div:nth-of-type(1) > ul > li.swiper-pagination-bullet-active { font-weight: 800; color: #000; } #container.main .section2 .inner .expert > div:nth-of-type(2) { width: 100%; position: relative; overflow: hidden; display: flex; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper { width: 100%; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide { background: #fff; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide::after { content: ''; width: 100%; height: 7.9167vw; left: -8.3333vw; bottom: 0; position: absolute; background: var(--text-highlight); } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide > p:nth-of-type(1) { font-size: var(--fs-36); font-weight: 600; min-height: 6.6667vw; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide > div { margin-top: 3.1250vw; position: relative; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide > div > p { font-size: var(--fs-18); font-weight: 600; color: var(--text-darkest); display: flex; align-items: center; gap: 1.0417vw; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide > div > p > strong { font-weight: 600; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide > div > p > span { font-size: var(-fs-16); font-weight: 500; color: var(--text-body); position: relative; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide > div > p > span::before { content: ''; position: absolute; left: -0.5208vw; top: 50%; width: var(--static-10); height: 1.1458vw; background: #DEDDCF; margin-top: -0.5729vw; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide > div > ul { margin-top: 1.0417vw; min-height: 3.7500vw; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide > div > ul > li { font-size: var(--fs-16); line-height: 1.5; color: var(--text-body); display: flex; gap: 0.5208vw; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide > div > ul > li::before { content: ''; width: 0.1563vw; height: 0.1563vw; border-radius: 0.1563vw; flex: 0 0 auto; background: var(--text-body); margin-top: 0.4688vw; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide > div > a { margin-top: 1.5625vw; font-size: var(--fs-12); font-weight: 900; text-transform: uppercase; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide > p:nth-of-type(2) { z-index: 2; min-width: 5.2083vw; height: 21.9792vw; position: absolute; bottom: 0; right: 0; } #container.main .section2 .inner .expert > div:nth-of-type(2) .swiper-slide > p:nth-of-type(2) > img { height: 100%; object-fit: contain; object-position: right top; filter: grayscale(100%); } #container.main .section2 .inner .expert > div:nth-of-type(2) .navi { position: absolute; left: 0; bottom: 0; z-index: 3; display: flex; align-items: flex-end; gap: 1.0417vw; } #container.main .section2 .inner .expert > div:nth-of-type(2) .navi > div { display: flex; align-items: flex-end; transform: translate(0, 0.2083vw); } #container.main .section2 .inner .expert > div:nth-of-type(2) .navi > div .current { font-size: var(--fs-115); color: #fff; line-height: 0.7;} #container.main .section2 .inner .expert > div:nth-of-type(2) .navi > div > p:nth-of-type(2) { margin-left: 0.8333vw; font-size: var(--fs-48); font-weight: 600; letter-spacing: -0.2604vw; color: #5B3125; line-height: 0.94; } #container.main .section2 .inner .expert > div:nth-of-type(2) .navi > div .total { margin-left: 0.4167vw; font-size: var(--fs-68); font-weight: 600; color: #5B3125; line-height: 0.75; } #container.main .section2 .inner .expert > div:nth-of-type(2) .navi > ul { display: flex; margin-bottom: 1.1458vw; gap: 2.0833vw; } #container.main .section2 .inner .expert > div:nth-of-type(2) .navi > ul > li { position: relative; width: 0.9375vw; height: 0.9375vw; background-size: 100%; cursor: pointer; } #container.main .section2 .inner .expert > div:nth-of-type(2) .navi > ul > li.prev { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M4.91786 10.2857H18V7.71429H4.91786L10.8321 1.8L9 0L0 9L9 18L10.8321 16.2L4.91786 10.2857Z' fill='%235B3125'/%3E%3C/svg%3E"); } #container.main .section2 .inner .expert > div:nth-of-type(2) .navi > ul > li.prev:hover { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M4.91786 10.2857H18V7.71429H4.91786L10.8321 1.8L9 0L0 9L9 18L10.8321 16.2L4.91786 10.2857Z' fill='white'/%3E%3C/svg%3E"); } #container.main .section2 .inner .expert > div:nth-of-type(2) .navi > ul > li.next { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M13.0821 10.2857H0V7.71429H13.0821L7.16786 1.8L9 0L18 9L9 18L7.16786 16.2L13.0821 10.2857Z' fill='%235B3125'/%3E%3C/svg%3E"); } #container.main .section2 .inner .expert > div:nth-of-type(2) .navi > ul > li.next:hover { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M13.0821 10.2857H0V7.71429H13.0821L7.16786 1.8L9 0L18 9L9 18L7.16786 16.2L13.0821 10.2857Z' fill='white'/%3E%3C/svg%3E"); } #container.main .section2 .inner .expert > div:nth-of-type(2) .navi > ul > li.next::before { content: ''; position: absolute; left: -1.0417vw; top: 50%; width: var(--static-10); height: 1.3542vw; margin-top: -0.6771vw; background: #5B3125; } #container.main .section2 .inner .focus { position: relative; } #container.main .section2 .inner .focus::before { content: ''; position: absolute; left: -2.6042vw; top: 0; width: var(--static-10); height: 100%; background: #DEDDCF; } #container.main .section2 .inner .focus > p { font-size: var(--fs-26); font-weight: 800; text-transform: uppercase; padding-bottom: 4.1146vw; } #container.main .section2 .inner .focus > div {} #container.main .section2 .inner .focus > div > p { font-size: var(--fs-36); font-weight: 600; } #container.main .section2 .inner .focus > div > div { margin-top: 3.1250vw; } #container.main .section2 .inner .focus > div > div > div {} #container.main .section2 .inner .focus > div > div > div > p { display: flex; align-items: center; font-size: var(--fs-18); font-weight: 600; color: var(--text-darkest); gap: 1.0417vw; } #container.main .section2 .inner .focus > div > div > div > p > span { position: relative; padding-top: 0.1563vw; font-size: var(--fs-16); font-weight: 500; color: var(--text-body); } #container.main .section2 .inner .focus > div > div > div > p > span::before { content: ''; position: absolute; left: -0.5208vw; top: 50%; width: var(--static-10); height: 1.0417vw; background: #DEDDCF; margin-top: -0.4167vw; } #container.main .section2 .inner .focus > div > div > div > div { font-size: var(--fs-16); line-height: 1.5; color: var(--text-body); margin-top: 0.9375vw; } #container.main .section2 .inner .focus > div > div > div > a { margin-top: 1.4583vw; font-size: var(--fs-12); font-weight: 900; text-transform: uppercase; } #container.main .section2 .inner .focus > div > div > ul { border-top: var(--static-10) solid #4A4948; margin-top: 2.3438vw; } #container.main .section2 .inner .focus > div > div > ul > li { display: flex; justify-content: space-between; align-items: center; gap: 2.0833vw; border-bottom: var(--static-10) solid #C2BEB8; padding: 1.2500vw 0; } #container.main .section2 .inner .focus > div > div > ul > li > p { font-size: var(--fs-16); font-weight: 500; color: var(--text-darkest); } #container.main .section2 .inner .focus > div > div > ul > li > span { flex: 0 0 auto; font-size: var(--fs-14); font-weight: 500; color: var(--text-body); } #container.main .section3 { background: #000; } #container.main .section4 { padding: 4.1667vw 0; } #container.main .section4 .inner { display: grid; grid-template-columns: 55.2083vw 1fr; grid-template-rows: max-content 1fr; gap: 1.5625vw 3.1250vw; } #container.main .section4 .inner > p { font-size: var(--fs-62); font-weight: 800; } #container.main .section4 .inner > div { margin-top: 0.7292vw; } #container.main .section4 .inner > div > p:nth-of-type(1) { font-size: var(--fs-26); font-weight: 800; } #container.main .section4 .inner > div > p:nth-of-type(2) { margin-top: 0.5208vw; font-size: var(--fs-14); font-weight: 500; color: var(--text-light); } #container.main .section4 .inner > ul { border-top: var(--static-10) solid #4A4948; } #container.main .section4 .inner > ul:nth-of-type(1) {} #container.main .section4 .inner > ul:nth-of-type(1) > li { display: flex; gap: 2.0833vw; padding: 1.9792vw 0; } #container.main .section4 .inner > ul:nth-of-type(1) > li~li { border-top: var(--static-10) solid #C2BEB8; } #container.main .section4 .inner > ul:nth-of-type(1) > li > p { flex: 0 0 auto; width: 19.5833vw; height: 11.0417vw; border-radius: 0.3125vw; overflow: hidden; } #container.main .section4 .inner > ul:nth-of-type(1) > li > p > a { display: flex; } #container.main .section4 .inner > ul:nth-of-type(1) > li > p > a > img { width: 100%; } #container.main .section4 .inner > ul:nth-of-type(1) > li > div { padding: 0.1042vw 0; position: relative; flex: 1 1 0; overflow: hidden; } #container.main .section4 .inner > ul:nth-of-type(1) > li > div > div:nth-of-type(1) { display: flex; justify-content: space-between; } #container.main .section4 .inner > ul:nth-of-type(1) > li > div > div:nth-of-type(1) > p { font-size: var(--fs-14); color: var(--text-body); } #container.main .section4 .inner > ul:nth-of-type(1) > li > div > div:nth-of-type(1) > p:nth-of-type(1) { font-weight: 700; } #container.main .section4 .inner > ul:nth-of-type(1) > li > div > div:nth-of-type(1) > p:nth-of-type(2) { font-weight: 500; } #container.main .section4 .inner > ul:nth-of-type(1) > li > div > p { margin-top: 1.0417vw; font-size: var(--fs-26); font-weight: 700; } #container.main .section4 .inner > ul:nth-of-type(1) > li > div > div:nth-of-type(2) { margin-top: 0.5208vw; font-size: var(--fs-16); line-height: 1.48; color: var(--text-body); } #container.main .section4 .inner > ul:nth-of-type(1) > li > div > a { position: absolute; left: 0; bottom: 0; font-size: var(--fs-12); font-weight: 800; text-transform: uppercase; color: var(--text-darkest); } #container.main .section4 .inner > ul:nth-of-type(2) {} #container.main .section4 .inner > ul:nth-of-type(2) > li { display: grid; grid-template-columns: 1fr 15.6250vw; height: 15.0000vw; padding: 2.0833vw 0; } #container.main .section4 .inner > ul:nth-of-type(2) > li~li { border-top: var(--static-10) solid #C2BEB8; } #container.main .section4 .inner > ul:nth-of-type(2) > li > p.logo { order: 0; } #container.main .section4 .inner > ul:nth-of-type(2) > li > p.logo > img { width: 100%; } #container.main .section4 .inner > ul:nth-of-type(2) > li:nth-of-type(1) > p.logo { width: 6.4583vw; } #container.main .section4 .inner > ul:nth-of-type(2) > li:nth-of-type(2) > p.logo { width: 4.8958vw; } #container.main .section4 .inner > ul:nth-of-type(2) > li:nth-of-type(3) > p.logo { width: 7.5000vw; } #container.main .section4 .inner > ul:nth-of-type(2) > li > p.name { font-size: var(--fs-14); font-weight: 700; color: var(--text-body); justify-self: end; padding-bottom: 1.9271vw; } #container.main .section4 .inner > ul:nth-of-type(2) > li > div.price { padding-top: 1.8229vw; } #container.main .section4 .inner > ul:nth-of-type(2) > li > div.price > p:nth-of-type(1) { font-size: var(--fs-32); font-weight: 800; color: var(--text-highlight); } #container.main .section4 .inner > ul:nth-of-type(2) > li > div.price > p:nth-of-type(2) { margin-top: 0.4167vw; font-size: var(--fs-14); font-weight: 700; color: var(--text-body); display: flex; gap: 0.3646vw; align-items: center; } #container.main .section4 .inner > ul:nth-of-type(2) > li > div.price > p:nth-of-type(2)::before { content: ''; width: 0.5208vw; height: 0.4167vw; background-size: 100%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8' fill='none'%3E%3Cpath d='M0 8L4.8 5.72394e-08L9.6 8L0 8Z' fill='%23D03042'/%3E%3C/svg%3E"); } #container.main .section4 .inner > ul:nth-of-type(2) > li > div.graph { grid-column: 2/3; grid-row: 2/span 2; width: 100%; height: 8.0729vw; border: var(--static-10) solid #ccc; } #container.main .section4 .inner > ul:nth-of-type(2) > li > div.graph > img { width: 100%; } #container.main .section4 .inner > ul:nth-of-type(2) > li > a { align-self: end; font-size: var(--fs-12); font-weight: 800; text-transform: uppercase; color: var(--text-darkest); } #container.main .section5 { padding: 4.1667vw 0 5.2083vw; border-top: var(--static-10) solid #C2BEB8; } #container.main .section5 .inner > div:nth-of-type(1) { display: flex; justify-content: space-between; gap: 3.1250vw; } #container.main .section5 .inner > div:nth-of-type(1) > dl { flex: 0 0 auto; } #container.main .section5 .inner > div:nth-of-type(1) > dl > dt { font-size: var(--fs-36); font-weight: 800; } #container.main .section5 .inner > div:nth-of-type(1) > dl > dd { margin-top: 1.5625vw; font-size: var(--fs-48); } #container.main .section5 .inner > div:nth-of-type(1) > ul { display: grid; grid-template-columns: 21.0938vw 17.0313vw 17.0833vw; grid-template-rows: repeat(2, minmax(10.4167vw, auto)); gap: 0.5208vw; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li { display: flex; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div { border-radius: 0.3125vw; position: relative; width: 100%; padding: 1.5625vw 1.5625vw 1.0417vw; display: flex; flex-direction: column; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div .btn { position: absolute; cursor: pointer; bottom: 0.5208vw; right: 0.5208vw; width: 2.6042vw; height: 2.6042vw; border-radius: 5.2083vw; border: var(--static-10) solid #EFEFE9; background-size: 0.7292vw 0.7292vw; background-position: center; background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='14' viewBox='0 0 15 14' fill='none'%3E%3Cpath d='M7.375 1V13' stroke='%234A4948' stroke-width='2' stroke-linecap='square' stroke-linejoin='round'/%3E%3Cpath d='M1.375 7H13.375' stroke='%234A4948' stroke-width='2' stroke-linecap='square' stroke-linejoin='round'/%3E%3C/svg%3E"); } #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.on .btn { border: var(--static-10) solid #ECECEC; background-color: #fff; background-size: 0.6250vw 0.6250vw; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M10.2426 1.75781L1.75733 10.2431M1.75732 1.75781L10.2426 10.2431' stroke='black' stroke-width='2' stroke-linecap='square' stroke-linejoin='round'/%3E%3C/svg%3E"); } #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.off { border: var(--static-10) solid #EFEFE9; gap: 1.1979vw; justify-content: space-between; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.off {} #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.off > div:nth-of-type(1) {} #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.off > div:nth-of-type(1) > .logo { min-height: 1.6146vw; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.off > div:nth-of-type(1) > .logo > img { width: 100%; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.off > div:nth-of-type(1) > p:nth-of-type(2) { margin-top: 0.4688vw; font-size: var(--fs-16); line-height: 1.37; color: var(--text-dark); } #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.off > div:nth-of-type(2) {} #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.off > div:nth-of-type(2) > p:nth-of-type(1) { font-size: var(--fs-14); color: var(--text-body); } #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.off > div:nth-of-type(2) > p:nth-of-type(2) { margin-top: 0.1042vw; font-size: var(--fs-20); font-weight: 700; display: flex; gap: 0.1042vw; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.off > div:nth-of-type(2) > p:nth-of-type(2) > span { font-size: var(--fs-14); margin-top: 0.1563vw; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(1) > div { height: 100%; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(1) > div .btn { bottom: 1.0417vw; right: 1.0417vw; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(1) { grid-row: 1/span 2; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(1) .logo { width: 5.1563vw; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(1) > div.off { justify-content: space-between; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(1) > div.off > div:nth-of-type(1) > p:nth-of-type(2) { font-weight: 600; margin-top: 1.0417vw; font-size: var(--fs-14); color: var(--text-highlight); line-height: 1.7; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(1) > div.off > div:nth-of-type(1) > p:nth-of-type(3) { font-weight: 600; margin-top: 0.1042vw; font-size: var(--fs-18); line-height: 1.33; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(1) > div.off > div:nth-of-type(2) {} #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(1) > div.off > div:nth-of-type(2) > p:nth-of-type(1) { font-size: var(--fs-14); color: var(--text-body); } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(1) > div.off > div:nth-of-type(2) > p:nth-of-type(2) { margin-top: 0; font-size: var(--fs-48); font-weight: 700; display: flex; gap: 0.1042vw; color: var(--text-highlight); } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(1) > div.off > div:nth-of-type(2) > p:nth-of-type(2) > span { font-size: var(--fs-18); margin-top: 0.5208vw; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(2) .logo { width: 5.2604vw; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(3) .logo { width: 5.4688vw; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(4) .logo { width: 7.8125vw; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(5) .logo { width: 5.8854vw; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.on { display: none; border: var(--static-10) solid #C2BEB8; background: #F9F9F9; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.on > dl {} #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.on > dl > dt {} #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.on > dl > dt > img { width: 100%; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li > div.on > dl > dd { margin-top: 0.4688vw; color: var(--text-dark); font-size: var(--fs-14); line-height: 1.57; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(1) > div.on { border: var(--static-10) solid #fff; background: url('../img/main-sec5-1.webp') center/cover no-repeat; } #container.main .section5 .inner > div:nth-of-type(1) > ul > li:nth-of-type(1) > div.on > dl > dd { margin-top: 1.1458vw; color: #fff; font-size: var(--fs-16); line-height: 1.37; font-weight: 500; } #container.main .section5 .inner > div:nth-of-type(2) { margin-top: 2.0833vw; border: var(--static-10) solid #DEDDCF; border-radius: 0.3125vw; } #container.main .section5 .inner > div:nth-of-type(2) > dl { width: 100%; min-height: 9.3750vw; display: flex; align-items: center; } #container.main .section5 .inner > div:nth-of-type(2) > dl > dt { flex: 0 0 auto; position: relative; width: 15.7292vw; text-align: center; font-size: var(--fs-26); font-weight: 800; text-transform: uppercase; } #container.main .section5 .inner > div:nth-of-type(2) > dl > dt::after { content: ''; width: var(--static-10); height: 3.1250vw; background: #817E7A; position: absolute; right: 0; top: 50%; margin-top: -1.5625vw; } #container.main .section5 .inner > div:nth-of-type(2) > dl > dd { width: 67.6042vw; overflow: hidden; padding-left: 1.5625vw; position: relative; } #container.main .section5 .inner > div:nth-of-type(2) > dl > dd::before { content: ''; position: absolute; left: 0; top: 50%; margin-top: -3.5938vw; width: 4.1667vw; height: 7.1875vw; background: linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); z-index: 2; } #container.main .section5 .inner > div:nth-of-type(2) > dl > dd::after { content: ''; position: absolute; right: 0; top: 50%; margin-top: -3.5938vw; width: 4.1667vw; height: 7.1875vw; background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); } #container.main .section5 .inner > div:nth-of-type(2) > dl > dd ul { display: flex; align-items: center; } #container.main .section5 .inner > div:nth-of-type(2) > dl > dd ul > li { filter: grayscale(100%); margin: 0 1.5625vw; } #container.main .section5 .inner > div:nth-of-type(2) > dl > dd ul > li:nth-of-type(1) { padding-top: 1.0417vw; } /*=========================== default list 공통 ===========================*/ #container.default.list {} #container.default.list .contents {} #container.default.list .contents .section1 {} #container.default.list .contents .section1 .inner-wrap { display: flex; justify-content: space-between; gap: 10.6771vw; padding-top: 2.0833vw; } #container.default.list .contents .section1 .inner-wrap .aside { width: 15.6250vw; flex: 0 0 auto; } #container.default.list .contents .section1 .inner-wrap .aside .inner > p { font-size: var(--fs-26); font-weight: 600; } #container.default.list .contents .section1 .inner-wrap .aside .inner > p > span { font-size: var(--fs-68); font-weight: 600; letter-spacing: -0.1042vw; display: inline-block; margin-right: 0.1563vw; } #container.default.list .contents .section1 .inner-wrap .aside .inner .sch, #container.default.list .contents .section1 .inner-wrap .aside .inner .category { margin-top: 1.5625vw; } #container.default.list .contents .section1 .inner-wrap .aside .inner .category + .sch { margin-top: 0.5208vw; } #container.default.list .contents .section1 .inner-wrap .aside.sticky { position: relative; } #container.default.list .contents .section1 .inner-wrap .aside.sticky .inner { position: sticky; top: 0; left: 0; transition: padding 0.2s ease; } #container.default.list .contents .section1 .inner-wrap .aside.sticky .inner.up { padding-top: calc(2.6042vw + 5.2083vw); } #container.default.list .contents .section1 .inner-wrap .aside.sticky .inner.down { padding-top: 2.6042vw; } #container.default.list .contents .section1 .inner-wrap .article { flex: 1 1 0; padding-right: 5.2083vw; } #container.default.list .contents .section1 .inner-wrap .article .list { border-top: var(--static-10) solid #4A4948; } #container.default.list .contents .section1 .inner-wrap .article .list > li {} #container.default.list .contents .section1 .inner-wrap .article .list > li > a { width: 100%; border-bottom: var(--static-10) solid #C2BEB8; display: flex; align-items: center; padding: 1.4063vw 0; } #container.default.list .contents .section1 .inner-wrap .article .list > li > a .num { flex: 0 0 auto; width: 7.0313vw; font-size: var(--fs-16); color: var(--text-dark); font-weight: 500; } #container.default.list .contents .section1 .inner-wrap .article .list > li > a .subject { flex: 1 1 0; font-size: var(--fs-18); line-height: 1.42; padding-right: 1.0417vw; } #container.default.list .contents .section1 .inner-wrap .article .list > li > a .date { flex: 0 0 auto; min-width: 5.2083vw; text-align: right; font-size: var(--fs-16); font-weight: 500; line-height: 1.48; color: var(--text-dark); } /* 카테고리 항목 있을 때 */ #container.default.list .contents .section1 .inner-wrap .article .list > li > a .category { flex: 0 0 auto; width: max(4.1667vw, var(--minmax-66)); display: flex; justify-content: center; } #container.default.list .contents .section1 .inner-wrap .article .list > li > a .category > span { padding: var(--cl-8) var(--cl-14); border-radius: 5.2083vw; border: var(--static-10) solid #DEDDCF; font-size: var(--fs-14); color: var(--text-body); font-weight: 600; } #container.default.list .contents .section1 .inner-wrap .article .list > li > a .category > span.on { color: var(--text-highlight); } #container.default.list .contents .section1 .inner-wrap .article .list > li > a:has(.category) { padding: 1.2500vw 0; } #container.default.list .contents .section1 .inner-wrap .article .list > li > a .category+.subject { padding-left: 0.7292vw; } #container.default.list .contents .section1 .inner-wrap .article .paging { border-top: 0; } /* faq 형식 */ #container .faq-list > dl {} #container .faq-list > dl:nth-of-type(1) { border-top: var(--static-10) solid #4A4948; } #container .faq-list > dl:last-of-type { border-bottom: var(--static-10) solid #C2BEB8; } #container .faq-list > dl > dt { position: relative; display: flex; align-items: center; padding: 1.4063vw 4.2708vw 1.4063vw 0; font-size: var(--fs-16); font-weight: 500; color: var(--text-dark); cursor: pointer; } #container .faq-list > dl~dl > dt { border-top: var(--static-10) solid #C2BEB8; } #container .faq-list > dl > dt::after { content: ''; position: absolute; top: 50%; margin-top: -0.3125vw; right: 0.5208vw; width: 0.6250vw; height: 0.6250vw; background: url('../img/icon-faq-plus.svg') center/100% no-repeat; } #container .faq-list > dl > dt.active::after { background: url('../img/icon-faq-minus.svg') center/100% no-repeat; } #container .faq-list > dl > dt > p { width: 7.0313vw; flex: 0 0 auto; } #container .faq-list > dl > dt > div { flex: 1 1 0; font-size: var(--fs-18); line-height: 1.42; color: #000; word-break: keep-all; } #container .faq-list > dl > dt.active > div { font-weight: 700; } #container .faq-list > dl > dt > span { width: 5.2083vw; text-align: right; flex: 0 0 auto; } #container .faq-list > dl > dd { display: none; border-top: var(--static-10) solid #C2BEB8; padding: 2.0833vw 7.0313vw; background: #f2f2f2; font-size: var(--fs-18); line-height: 1.42; color: var(--text-dark); word-break: keep-all; } #container .faq-list > dl > dd .download { margin-top: 1.0417vw; } #container .faq-list .paging { border-top: 0; } /*=========================== default view 공통 ===========================*/ #container.default.view {} #container.default.view .contents .section1 .inner-wrap { display: grid; grid-template-columns: 15.6250vw auto; gap: 0 10.6771vw; padding-top: 3.1250vw; padding-bottom: 4.1667vw; } #container.default.view .contents:has(div:not(.section2)) .section1 .inner-wrap { padding-bottom: 0; } #container.default.view .contents .section1 .inner-wrap .aside { grid-row: 1/3; position: relative; z-index: 10; } #container.default.view .contents .section1 .inner-wrap .aside .inner {} #container.default.view .contents .section1 .inner-wrap .aside.sticky .inner { position: sticky; top: 0; left: 0; transition: padding 0.2s ease; } #container.default.view .contents .section1 .inner-wrap .aside.sticky .inner.up { padding-top: 5.2083vw; } #container.default.view .contents .section1 .inner-wrap .aside.sticky .inner.down { padding-top: 2.6042vw; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div { width: 100%; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div~div { border-top: var(--static-10) solid #C2BEB8; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div > p { font-size: var(--fs-16); color: var(--text-body); font-weight: 600; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.date { padding-bottom: 1.1458vw; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.date > div { display: flex; justify-content: space-between; align-items: center; margin-top: 0.3125vw; flex-wrap: wrap; gap: 0.3125vw; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.date > div > p { font-size: var(--fs-18); font-weight: 600; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.date > div .copylink { position: relative; display: flex; align-items: center; gap: 0.2083vw; padding: var(--cl-9) var(--cl-14); border-radius: 5.2083vw; border: var(--static-10) solid #DEDDCF; cursor: pointer; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.date > div .copylink > img { width: 0.8854vw; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.date > div .copylink > span { font-size: var(--fs-14); font-weight: 700; color: var(--text-body); } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.date > div .copylink .feedback { position: absolute; left: 0; top: calc(100% + 0.2604vw); width: max-content; background: var(--text-dark); padding: 0.5208vw 0.7813vw; border-radius: 5.2083vw; color: #fff; font-size: var(--fs-14); } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.print { padding: 1.2500vw 0 1.5625vw; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.print > div { margin-top: 0.6771vw; cursor: pointer; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.print > div > img { width: 1.4583vw; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.download { padding: 1.2500vw 0 1.5625vw; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.download > div { margin-top: 0.7292vw; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.download > div > a~a { margin-top: 0.4167vw; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.contributor { padding: 1.2500vw 0 1.5625vw; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.contributor > div { margin-top: 0.7292vw; display: flex; align-items: center; gap: 0.9375vw; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.contributor > div > p:nth-of-type(1) { font-size: var(--fs-18); font-weight: 600; color: var(--text-darkest); } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.contributor > div > p:nth-of-type(2) { font-size: var(--fs-16); font-weight: 500; color: #94918C; position: relative; } #container.default.view .contents .section1 .inner-wrap .aside .inner > div.contributor > div > p:nth-of-type(2)::after { content: ''; position: absolute; left: -0.4688vw; top: 50%; width: var(--static-10); height: 0.6250vw; margin-top: -0.3125vw; background: var(--text-light); } #container.default.view .contents .section1 .inner-wrap .title { font-size: var(--fs-48); font-weight: 800; line-height: normal; padding-right: 5.2083vw; display: flex; align-items: center; gap: 1.2500vw; } #container.default.view .contents .section1 .inner-wrap .title > span { font-size: var(--fs-14); font-weight: 700; background: #000; color: #fff; border-radius: 5.2083vw; width: var(--cl-64); height: var(--cl-64); display: flex; justify-content: center; align-items: center; aspect-ratio: 1; } #container.default.view .contents .section1 .inner-wrap .title > span.on { background: var(--text-highlight); } #container.default.view .contents .section1 .inner-wrap .article { padding: 2.0833vw 5.2083vw 0 0; display: flex; flex-direction: column; align-items: center; } #container.default.view .contents .section1 .inner-wrap .article .textarea { padding-bottom: 4.1667vw; font-size: var(--fs-18); line-height: 1.42; } #container.default.view .contents .section1 .inner-wrap .article .view-nav { display: flex; width: 100%; border-top: var(--static-10) solid #C2BEB8; border-bottom: var(--static-10) solid #C2BEB8; padding: 1.7708vw 0; } #container.default.view .contents .section1 .inner-wrap .article .view-nav > li { width: 50%; } #container.default.view .contents .section1 .inner-wrap .article .view-nav > li > a { display: block; width: 100%; height: 100%; display: flex; gap: 2.0833vw; align-items: center; } #container.default.view .contents .section1 .inner-wrap .article .view-nav > li > a > p { width: 0.4688vw; } #container.default.view .contents .section1 .inner-wrap .article .view-nav > li > a > p > img { width: 100%; } #container.default.view .contents .section1 .inner-wrap .article .view-nav > li > a > div { width: 24.6875vw; height: 100%; } #container.default.view .contents .section1 .inner-wrap .article .view-nav > li > a > div > p { font-size: var(--fs-16); font-weight: 600; color: var(--text-body); } #container.default.view .contents .section1 .inner-wrap .article .view-nav > li > a > div > div { margin-top: 0.5208vw; font-size: var(--fs-20); font-weight: 700; line-height: normal; } #container.default.view .contents .section1 .inner-wrap .article .view-nav > li > a > div > div.empty { color: rgba(0,0,0,0.3); } #container.default.view .contents .section1 .inner-wrap .article .view-nav > li.next { position: relative; } #container.default.view .contents .section1 .inner-wrap .article .view-nav > li.next::after { content: ''; width: var(--static-10); height: 100%; position: absolute; left: 0; top: 0; background: #C2BEB8; } #container.default.view .contents .section1 .inner-wrap .article .view-nav > li.next > a { justify-content: flex-end; text-align: right; } #container.default.view .contents .section1 .inner-wrap .article .view-nav > li.next > a > p { transform: rotate(180deg); } #container.default.view .contents .section1 .inner-wrap .article .toList { margin-top: 3.3854vw; display: block; padding: var(--cl-20) var(--cl-50); border-radius: 5.2083vw; background: #000; color: #fff; font-size: var(--fs-18); font-weight: 600; } /* galley view */ #container.default.gallery.view .contents .section1 .inner-wrap .title { font-size: var(--fs-62); font-weight: 600; } #container.default.gallery.view .contents .section1 .inner-wrap .article .img { width: 100%; border-radius: 0.3125vw; overflow: hidden; aspect-ratio: 1195/674; } #container.default.gallery.view .contents .section1 .inner-wrap .article .img+.textarea { padding-top: 2.6042vw; } #container.gallery.view .contents .section2 { padding: 4.1667vw 5.2083vw 0 26.2500vw; border-top: var(--static-10) solid #C2BEB8; } #container.gallery.view .contents .section2 .inner-wrap {} #container.gallery.view .contents .section2 .inner-wrap > p { font-size: var(--fs-26); font-weight: 700; } #container.gallery.view .contents .section2 .inner-wrap .relation { margin-top: 1.5625vw; display: grid; gap: 3.1250vw 1.0417vw; grid-template-columns: repeat(3, 1fr); } #container.gallery.view .contents .section2 .inner-wrap .relation > li {} #container.gallery.view .contents .section2 .inner-wrap .relation > li > a:nth-of-type(1) { display: block; aspect-ratio: 385/217; border-radius: 0.3125vw; overflow: hidden; } #container.gallery.view .contents .section2 .inner-wrap .relation > li > a:nth-of-type(2) { display: block; margin-top: 1.0417vw; font-size: var(--fs-20); font-weight: 700; width: 17.9688vw; line-height: normal; } #container.gallery.view .contents .section2 .inner-wrap .relation > li > p { margin-top: 1.0417vw; font-size: var(--fs-14); font-weight: 500; color: var(--text-body); } /* 리서치 리포트 */ #container.reportView.view .contents .section2 .inner-wrap .relation > li:has(.tag) > a:nth-of-type(1) { aspect-ratio: 385/425; } #container.reportView.view .contents .section2 .inner-wrap .relation > li .tag { margin-top: 1.0417vw; padding: 0.4167vw 0.7292vw; border: var(--static-10) solid #C2BEB8; border-radius: 5.2083vw; display: inline-block; font-size: var(--fs-14); font-weight: 600; color: var(--text-dark); } #container.reportView.view .contents .section2 .inner-wrap .relation > li .tag+a { margin-top: 0.5208vw; } /* 뉴스 - 회사소식 */ #container.conewsView.view .contents .section2 { margin-top: 4.1667vw; } /*=========================== 갤러리 list 공통 ===========================*/ #container.gallery.list {} #container.gallery.list .contents {} #container.gallery.list .contents .section1 .inner-wrap { display: flex; align-items: flex-start; gap: 3.1250vw; padding-top: 2.0833vw; padding-bottom: 3.1250vw; } #container.gallery.list .contents .section1 .inner-wrap > p { position: relative; } #container.gallery.list .contents .section1 .inner-wrap > p > a.img-fit-cover { display: block; width: 53.3854vw; border-radius: 0.3125vw; aspect-ratio: 1025/578; flex: 0 0 auto; overflow: hidden; } #container.gallery.list .contents .section1 .inner-wrap > p > a.btn-download-icon { display: block; width: 3.1250vw; height: 3.1250vw; border-radius: 3.1250vw; position: absolute; right: 1.5625vw; bottom: 1.5625vw; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M8.73685 9.32383V0.0546872L11.2632 0.0546873V9.32383L14.5474 5.96498L16.3158 7.80588L10 14.2652L3.68422 7.80588L5.45264 5.96497L8.73685 9.32383Z' fill='white'/%3E%3Cpath d='M0.526367 17.4219H19.4737V19.9482H0.526367V17.4219Z' fill='white'/%3E%3C/svg%3E") center/1.0417vw 1.0417vw no-repeat; background-color: var(--text-darkest); } #container.gallery.list .contents .section1 .inner-wrap > div { width: 32.0313vw; padding-top: 1.0417vw; } #container.gallery.list .contents .section1 .inner-wrap > div > a:nth-of-type(1) { display: block; font-size: var(--fs-48); font-weight: 700; line-height: normal; } #container.gallery.list .contents .section1 .inner-wrap > div > a:nth-of-type(2) { display: block; margin-top: 2.6042vw; line-height: 1.42; font-size: var(--fs-18); color: var(--text-dark); } #container.gallery.list .contents .section1 .inner-wrap > div > p { margin-top: 1.0417vw; font-size: var(--fs-14); color: var(--text-body); font-weight: 500; } /* 뉴스 - 언론보도 */ #container.menewsList.list .contents .section1 .inner-wrap > div > div:first-child { display: flex; align-items: center; gap: 0.3125vw; font-size: var(--fs-16); color: var(--text-dark); font-weight: 700; } #container.menewsList.list .contents .section1 .inner-wrap > div > div:first-child > span:nth-of-type(1) { width: 1.0417vw; border-radius: 0.1563vw; overflow: hidden; } #container.menewsList.list .contents .section1 .inner-wrap > div > div:first-child > span:nth-of-type(1) > img { width: 100%; } #container.menewsList.list .contents .section1 .inner-wrap > div > div+a { margin-top: 1.5625vw; } /* 리서치 리포트, 코람코 뷰 */ #container.gallery.list:has(ul:not(.snb)) .contents .section1 { margin-top: 1.0417vw; } /* 코람코 뷰 */ #container.koramcoList.list .contents .section1 .inner-wrap > p > a { display: block; width: 53.3854vw; height: 30.1042vw; text-align: center; position: relative; } #container.koramcoList.list .contents .section1 .inner-wrap > p > a::after { content: ''; width: calc(100% + var(--w-60)); height: 9.4792vw; background: var(--text-highlight); position: absolute; left: -3.1250vw; bottom: 0; z-index: -1; } #container.koramcoList.list .contents .section1 .inner-wrap > p > a > img { object-position: top center; width: 100%; height: 30.1042vw; filter: grayscale(100%); } #container.koramcoList.list .contents .section1 .inner-wrap > div > a+div { display: flex; margin-top: 1.0417vw; gap: 1.0417vw; align-items: center; } #container.koramcoList.list .contents .section1 .inner-wrap > div > a+div > p:nth-of-type(1) { font-size: var(--fs-18); font-weight: 600; color: var(--text-darkest); } #container.koramcoList.list .contents .section1 .inner-wrap > div > a+div > p:nth-of-type(2) { font-size: var(--fs-16); font-weight: 500; color: #94918C; position: relative; } #container.koramcoList.list .contents .section1 .inner-wrap > div > a+div > p:nth-of-type(2)::before { content: ''; position: absolute; left: -0.5208vw; top: 50%; width: var(--static-10); height: 1.1458vw; background: #DEDDCF; margin-top: -0.5729vw; } #container.gallery.list .contents .section2 { border-top: var(--static-10) solid #C2BEB8; } #container.gallery.list .contents .section2 .inner-wrap { display: flex; gap: 10.6771vw; padding-top: 4.1667vw; } #container.gallery.list .contents .section2 .inner-wrap .aside { width: 15.6250vw; flex: 0 0 auto; } #container.gallery.list .contents .section2 .inner-wrap .aside .inner > p { font-size: var(--fs-26); font-weight: 600; } #container.gallery.list .contents .section2 .inner-wrap .aside .inner > p > span { font-size: var(--fs-68); font-weight: 600; letter-spacing: -0.1042vw; margin-right: 0.1563vw; display: inline-block; } #container.gallery.list .contents .section2 .inner-wrap .aside .inner > form { width: 100%; margin-top: 1.3021vw; } #container.gallery.list .contents .section2 .inner-wrap .aside.sticky { position: relative; } #container.gallery.list .contents .section2 .inner-wrap .aside.sticky .inner { position: sticky; top: 0; left: 0; transition: padding 0.2s ease; } #container.gallery.list .contents .section2 .inner-wrap .aside.sticky .inner.up { padding-top: calc(2.6042vw + 5.2083vw); } #container.gallery.list .contents .section2 .inner-wrap .aside.sticky .inner.down { padding-top: 2.6042vw; } #container.gallery.list .contents .section2 .inner-wrap .list { padding-right: 5.2083vw; flex: 1 1 auto; } #container.gallery.list .contents .section2 .inner-wrap .list > ul { display: grid; gap: 3.1250vw 1.0417vw; grid-template-columns: repeat(3, 1fr); padding-bottom: 3.1250vw; } #container.gallery.list .contents .section2 .inner-wrap .list > ul > li {} #container.gallery.list .contents .section2 .inner-wrap .list > ul > li > a:nth-of-type(1) { display: block; aspect-ratio: 385/217; border-radius: 0.3125vw; overflow: hidden; } #container.gallery.list .contents .section2 .inner-wrap .list > ul > li > a:nth-of-type(2) { display: block; margin-top: 1.0417vw; font-size: var(--fs-20); font-weight: 700; width: 17.9688vw; line-height: normal; } #container.gallery.list .contents .section2 .inner-wrap .list > ul > li > p { margin-top: 1.0417vw; font-size: var(--fs-14); font-weight: 500; color: var(--text-body); } #container.gallery.list .contents .section2 .inner-wrap .list > ul:has(.empty) { padding-bottom: 0; } #container.gallery.list .contents .section2 .inner-wrap .list > ul:has(.empty) > li:not(.empty) { display: none; } #container.gallery.list .contents .section2 .inner-wrap .list > ul:has(.empty)+.paging { display: none; } #container.gallery.list .contents .section2 .inner-wrap .list > ul .empty { display: flex; flex-direction: column; align-items: center; grid-column: 1/4; padding: 5.2083vw 0 8.3333vw; border-bottom: var(--static-10) solid #C2BEB8; } #container.gallery.list .contents .section2 .inner-wrap .list > ul .empty > div { margin-top: 0; font-size: var(--fs-48); font-weight: 800; line-height: normal; color: #000; } #container.gallery.list .contents .section2 .inner-wrap .list > ul .empty > p { margin-top: 1.0417vw; font-size: var(--fs-26); font-weight: 500; color: var(--text-dark); } /* 언론보도 */ #container.menewsList.list .contents .section2 .inner-wrap .list > ul > li .media-name { margin-top: 1.0417vw; display: flex; align-items: center; gap: 0.3125vw; font-size: var(--fs-14); color: var(--text-dark); font-weight: 700; } #container.menewsList.list .contents .section2 .inner-wrap .list > ul > li .media-name > span:nth-of-type(1) { width: 1.0417vw; border-radius: 0.1563vw; overflow: hidden; } #container.menewsList.list .contents .section2 .inner-wrap .list > ul > li .media-name > span:nth-of-type(1) > img { width: 100%; } /* 리서치 리포트 */ #container.reportList.list .contents .section2 .inner-wrap .list > ul > li > a.btn-download-icon { display: block; width: 1.9792vw; height: 1.9792vw; border-radius: 1.9792vw; position: absolute; right: 0.8333vw; top: 8.4896vw; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M8.73685 9.32383V0.0546872L11.2632 0.0546873V9.32383L14.5474 5.96498L16.3158 7.80588L10 14.2652L3.68422 7.80588L5.45264 5.96497L8.73685 9.32383Z' fill='white'/%3E%3Cpath d='M0.526367 17.4219H19.4737V19.9482H0.526367V17.4219Z' fill='white'/%3E%3C/svg%3E") center/0.6250vw 0.7292vw no-repeat; background-color: var(--text-darkest); } /* 코람코 뷰 */ #container.koramcoList.list .contents .section2 .inner-wrap .list > ul > li > a:nth-of-type(1) { position: relative; background: #F9F4F0; padding-top: 1.0417vw; text-align: center; } #container.koramcoList.list .contents .section2 .inner-wrap .list > ul > li > a:nth-of-type(1)::after { content: ''; position: absolute; left: 0; bottom: 0; width: calc(100% - var(--w-60)); height: 4.1667vw; background: var(--text-highlight); z-index: 1; } #container.koramcoList.list .contents .section2 .inner-wrap .list > ul > li > a:nth-of-type(1) > img { width: 12.5000vw; object-position: top center; filter: grayscale(100%); position: relative; z-index: 2; } #container.koramcoList.list .contents .section2 .inner-wrap .list > ul > li .name { display: flex; align-items: center; margin-top: 1.0417vw; gap: 0.6250vw; } #container.koramcoList.list .contents .section2 .inner-wrap .list > ul > li .name > p { font-size: var(--fs-14); color: var(--text-body); } #container.koramcoList.list .contents .section2 .inner-wrap .list > ul > li .name > p:nth-of-type(1) { font-weight: 700; } #container.koramcoList.list .contents .section2 .inner-wrap .list > ul > li .name > p:nth-of-type(2) { font-weight: 500; position: relative; } #container.koramcoList.list .contents .section2 .inner-wrap .list > ul > li .name > p:nth-of-type(2)::after { content: ''; position: absolute; left: -0.3125vw; top: 50%; width: var(--static-10); height: 0.8333vw; margin-top: -0.4167vw; background: #DEDDCF; } #container.koramcoList.list .contents .section2 .inner-wrap .list > ul > li .name+p { margin-top: 0.7292vw; } /*=========================== product list 공통 ===========================*/ #container .filter-wrap {} #container .filter-wrap:has(.title) { display: flex; } #container .filter-wrap:has(.title) > p { color: #fff; padding-left: var(--w-60); font-size: var(--fs-20); font-weight: 700; text-transform: uppercase; display: flex; align-items: center; } #container .filter-wrap:has(.title) .category { flex: 1 1 0; padding-left: 1.5625vw; padding-right: 0; } #container .filter-wrap:has(.title) .search { display: flex; justify-content: flex-end; position: relative; border-left: var(--static-10) solid #4A4948; } #container .filter-wrap:has(.title) .search input[type=text] { width: 28.3854vw; padding: 0 4.2708vw 0 1.5625vw; border: 0; background: transparent; color: var(--text-body); font-size: var(--fs-18); } #container .filter-wrap:has(.title) .search input[type=submit] { position: absolute; right: 0; top: 0; width: 4.2708vw; height: 100%; border: 0; text-indent: -52083333333.2813vw; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 26 26' fill='none'%3E%3Cpath d='M11.7777 21.5556C17.1778 21.5556 21.5554 17.1779 21.5554 11.7778C21.5554 6.37768 17.1778 2 11.7777 2C6.37762 2 2 6.37768 2 11.7778C2 17.1779 6.37762 21.5556 11.7777 21.5556Z' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M24 24.0003L18.6833 18.6836' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/1.3542vw 1.3542vw no-repeat; cursor: pointer; } #container .filter-wrap .category { display: flex; justify-content: space-between; padding: 1.1458vw var(--w-60); background: #000; } #container .filter-wrap .category > ul { display: flex; gap: 0.4167vw; } #container .filter-wrap .category > ul > li {} #container .filter-wrap .category > ul > li > input { display: none; } #container .filter-wrap .category > ul > li > label { min-width: 5.1042vw; padding: 0.7292vw 0.8333vw; background: #1C1B1B; border-radius: 0.4167vw; color: var(--text-lighter); text-align: center; display: block; cursor: pointer; font-size: var(--fs-16); font-weight: 500; } #container .filter-wrap .category > ul > li > input:checked+label { background: #fff; color: #000; font-weight: 700; } #container .filter-wrap .category .type {} #container .filter-wrap .category .type > div { height: 100%; display: flex; align-items: center; gap: 1.4583vw; } #container .filter-wrap .category .type > div > a { color: var(--text-body); display: block; padding-left: 1.4583vw; line-height: 1.2500vw; position: relative; font-size: var(--fs-18); } #container .filter-wrap .category .type > div > a.on { color: #fff; } #container .filter-wrap .category .type > div > a.map { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cmask id='mask0_5537_10749' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect x='0.5' y='0.5' width='23' height='23' fill='%23D9D9D9' stroke='%23817E7A'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_5537_10749)'%3E%3Cpath d='M12.0452 21C10.794 21 9.61809 20.7637 8.51759 20.2912C7.41709 19.8187 6.4598 19.1775 5.64573 18.3675C4.83166 17.5575 4.18719 16.605 3.71231 15.51C3.23744 14.415 3 13.245 3 12C3 10.755 3.23744 9.585 3.71231 8.49C4.18719 7.395 4.83166 6.4425 5.64573 5.6325C6.4598 4.8225 7.41709 4.18125 8.51759 3.70875C9.61809 3.23625 10.794 3 12.0452 3C14.3367 3 16.3229 3.735 18.0038 5.205C19.6847 6.675 20.6834 8.505 21 10.695C20.6985 10.545 20.3857 10.4288 20.0616 10.3463C19.7374 10.2638 19.402 10.215 19.0553 10.2C18.7688 9.105 18.2525 8.13 17.5063 7.275C16.7601 6.42 15.8442 5.775 14.7588 5.34V5.7C14.7588 6.195 14.5817 6.61875 14.2274 6.97125C13.8731 7.32375 13.4472 7.5 12.9497 7.5H11.1407V9.3C11.1407 9.555 11.054 9.76875 10.8807 9.94125C10.7073 10.1137 10.4925 10.2 10.2362 10.2H8.42714L9.86307 12H11.1407H13.8543C14.0201 12 14.1746 12.0412 14.3178 12.1237C14.4611 12.2063 14.5704 12.3225 14.6457 12.4725C14.3894 12.8775 14.1935 13.305 14.0578 13.755C13.9221 14.205 13.8543 14.67 13.8543 15.15C13.8543 16.095 14.0992 16.9725 14.5892 17.7825C15.0791 18.5925 15.5804 19.35 16.093 20.055C15.4749 20.355 14.8266 20.5875 14.1482 20.7525C13.4698 20.9175 12.7688 21 12.0452 21ZM11.1407 19.155V17.4C10.6432 17.4 10.2173 17.2238 9.86307 16.8713C9.50879 16.5188 9.33166 16.095 9.33166 15.6V14.7L4.98995 10.38C4.94472 10.65 4.90327 10.92 4.86558 11.19C4.82789 11.46 4.80905 11.73 4.80905 12C4.80905 13.815 5.40829 15.405 6.60678 16.77C7.80528 18.135 9.31658 18.93 11.1407 19.155Z' fill='%23817E7A'/%3E%3Cpath d='M22 16C22 14.8954 21.1046 14 20 14C18.8954 14 18 14.8954 18 16C18 17.1046 18.8954 18 20 18V20C17.7909 20 16 18.2091 16 16C16 13.7909 17.7909 12 20 12C22.2091 12 24 13.7909 24 16C24 18.2091 22.2091 20 20 20V18C21.1046 18 22 17.1046 22 16Z' fill='%23817E7A'/%3E%3C/g%3E%3C/svg%3E") left center/1.2500vw 1.2500vw no-repeat; } #container .filter-wrap .category .type > div > a.map.on { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cmask id='mask0_5537_14718' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect x='0.5' y='0.5' width='23' height='23' fill='%23D9D9D9' stroke='%23817E7A'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_5537_14718)'%3E%3Cpath d='M12.0452 21C10.794 21 9.61809 20.7637 8.51759 20.2912C7.41709 19.8187 6.4598 19.1775 5.64573 18.3675C4.83166 17.5575 4.18719 16.605 3.71231 15.51C3.23744 14.415 3 13.245 3 12C3 10.755 3.23744 9.585 3.71231 8.49C4.18719 7.395 4.83166 6.4425 5.64573 5.6325C6.4598 4.8225 7.41709 4.18125 8.51759 3.70875C9.61809 3.23625 10.794 3 12.0452 3C14.3367 3 16.3229 3.735 18.0038 5.205C19.6847 6.675 20.6834 8.505 21 10.695C20.6985 10.545 20.3857 10.4288 20.0616 10.3463C19.7374 10.2638 19.402 10.215 19.0553 10.2C18.7688 9.105 18.2525 8.13 17.5063 7.275C16.7601 6.42 15.8442 5.775 14.7588 5.34V5.7C14.7588 6.195 14.5817 6.61875 14.2274 6.97125C13.8731 7.32375 13.4472 7.5 12.9497 7.5H11.1407V9.3C11.1407 9.555 11.054 9.76875 10.8807 9.94125C10.7073 10.1137 10.4925 10.2 10.2362 10.2H8.42714L9.86307 12H11.1407H13.8543C14.0201 12 14.1746 12.0412 14.3178 12.1237C14.4611 12.2063 14.5704 12.3225 14.6457 12.4725C14.3894 12.8775 14.1935 13.305 14.0578 13.755C13.9221 14.205 13.8543 14.67 13.8543 15.15C13.8543 16.095 14.0992 16.9725 14.5892 17.7825C15.0791 18.5925 15.5804 19.35 16.093 20.055C15.4749 20.355 14.8266 20.5875 14.1482 20.7525C13.4698 20.9175 12.7688 21 12.0452 21ZM11.1407 19.155V17.4C10.6432 17.4 10.2173 17.2238 9.86307 16.8713C9.50879 16.5188 9.33166 16.095 9.33166 15.6V14.7L4.98995 10.38C4.94472 10.65 4.90327 10.92 4.86558 11.19C4.82789 11.46 4.80905 11.73 4.80905 12C4.80905 13.815 5.40829 15.405 6.60678 16.77C7.80528 18.135 9.31658 18.93 11.1407 19.155Z' fill='white'/%3E%3Cpath d='M22 16C22 14.8954 21.1046 14 20 14C18.8954 14 18 14.8954 18 16C18 17.1046 18.8954 18 20 18V20C17.7909 20 16 18.2091 16 16C16 13.7909 17.7909 12 20 12C22.2091 12 24 13.7909 24 16C24 18.2091 22.2091 20 20 20V18C21.1046 18 22 17.1046 22 16Z' fill='white'/%3E%3C/g%3E%3C/svg%3E") left center/1.2500vw 1.2500vw no-repeat; } #container .filter-wrap .category .type > div > a.list { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cmask id='mask0_5537_14711' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_5537_14711)'%3E%3Cpath d='M5 19L19 19V21L5 21V19Z' fill='%23817E7A'/%3E%3Cpath d='M7 17C6.45 17 5.97917 16.8042 5.5875 16.4125C5.19583 16.0208 5 15.55 5 15V6C5 5.45 5.19583 4.97917 5.5875 4.5875C5.97917 4.19583 6.45 4 7 4H17C17.55 4 18.0208 4.19583 18.4125 4.5875C18.8042 4.97917 19 5.45 19 6V15C19 15.55 18.8042 16.0208 18.4125 16.4125C18.0208 16.8042 17.55 17 17 17H7ZM7 15H17V6H7V15ZM8 13H16L13.4 9.5L11.5 12L10.1 10.15L8 13Z' fill='%23817E7A'/%3E%3C/g%3E%3C/svg%3E") left center/1.2500vw 1.2500vw no-repeat; } #container .filter-wrap .category .type > div > a.list.on { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cmask id='mask0_5537_10736' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_5537_10736)'%3E%3Cpath d='M5 19L19 19V21L5 21V19Z' fill='white'/%3E%3Cpath d='M7 17C6.45 17 5.97917 16.8042 5.5875 16.4125C5.19583 16.0208 5 15.55 5 15V6C5 5.45 5.19583 4.97917 5.5875 4.5875C5.97917 4.19583 6.45 4 7 4H17C17.55 4 18.0208 4.19583 18.4125 4.5875C18.8042 4.97917 19 5.45 19 6V15C19 15.55 18.8042 16.0208 18.4125 16.4125C18.0208 16.8042 17.55 17 17 17H7ZM7 15H17V6H7V15ZM8 13H16L13.4 9.5L11.5 12L10.1 10.15L8 13Z' fill='white'/%3E%3C/g%3E%3C/svg%3E") left center/1.2500vw 1.2500vw no-repeat; } #container .filter-wrap .category .type > div > a.list::before { content: ''; position: absolute; left: -0.7292vw; top: -0.0521vw; width: var(--static-10); height: 1.3542vw; background: #817E7A; } #container .filter-wrap .filter {} #container .filter-wrap .filter .scroll { display: grid; grid-template-columns: auto 6.9271vw; } #container .filter-wrap .filter .scroll > * { border-bottom: var(--static-10) solid #C2BEB8; } #container .filter-wrap .filter .scroll > dl { display: flex; padding: 1.2500vw 0 1.2500vw var(--w-60); } #container .filter-wrap .filter .scroll > dl:nth-of-type(n+3) { grid-column: 1/3; } #container .filter-wrap .filter .scroll > dl > dt { width: 5.2083vw; flex: 0 0 auto; font-size: var(--fs-14); font-weight: 700; color: var(--text-dark); line-height: 1.1458vw; } #container .filter-wrap .filter .scroll > dl > dd { flex: 1 1 0; display: flex; flex-wrap: wrap; gap: 1.0417vw 1.5625vw; } #container .filter-wrap .filter .scroll > dl > dd > div.checkbox { width: 8.8542vw; } #container .filter-wrap .filter .scroll .reset { grid-column: 2/3; grid-row: 1/3; border-left: var(--static-10) solid #C2BEB8; display: flex; align-items: center;justify-content: center; } #container .filter-wrap .filter .scroll .reset > p { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cmask id='mask0_5537_10931' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_5537_10931)'%3E%3Cpath d='M12 20C9.76667 20 7.875 19.225 6.325 17.675C4.775 16.125 4 14.2333 4 12C4 9.76667 4.775 7.875 6.325 6.325C7.875 4.775 9.76667 4 12 4C13.15 4 14.25 4.2375 15.3 4.7125C16.35 5.1875 17.25 5.86667 18 6.75V4H20V11H13V9H17.2C16.6667 8.06667 15.9375 7.33333 15.0125 6.8C14.0875 6.26667 13.0833 6 12 6C10.3333 6 8.91667 6.58333 7.75 7.75C6.58333 8.91667 6 10.3333 6 12C6 13.6667 6.58333 15.0833 7.75 16.25C8.91667 17.4167 10.3333 18 12 18C13.2833 18 14.4417 17.6333 15.475 16.9C16.5083 16.1667 17.2333 15.2 17.65 14H19.75C19.2833 15.7667 18.3333 17.2083 16.9 18.325C15.4667 19.4417 13.8333 20 12 20Z' fill='%234A4948'/%3E%3C/g%3E%3C/svg%3E") left -0.0521vw/1.2500vw 1.2500vw no-repeat; padding-left: 1.4583vw; line-height: 1.2500vw; cursor: pointer; } #container.product.list {} #container.product.list .contents {} #container.product.list .contents .section1 { margin-top: 2.0833vw; } #container.product.list .contents .section2 { padding-top: 3.1250vw; } #container.product.list .contents .section2 .inner-wrap { display: flex; justify-content: space-between; gap: 10.6771vw; } #container.product.list .contents .section2 .inner-wrap .aside { width: 15.6250vw; flex: 0 0 auto; } #container.product.list .contents .section2 .inner-wrap .aside .inner > p { font-size: var(--fs-26); font-weight: 600; } #container.product.list .contents .section2 .inner-wrap .aside .inner > p > span { font-size: var(--fs-68); font-weight: 600; letter-spacing: -0.1042vw; display: inline-block; margin-right: 0.1563vw; } #container.product.list .contents .section2 .inner-wrap .aside.sticky { position: relative; } #container.product.list .contents .section2 .inner-wrap .aside.sticky .inner { position: sticky; top: 0; left: 0; transition: padding 0.2s ease; } #container.product.list .contents .section2 .inner-wrap .aside.sticky .inner.up { padding-top: calc(2.6042vw + 5.2083vw); } #container.product.list .contents .section2 .inner-wrap .aside.sticky .inner.down { padding-top: 2.6042vw; } #container.product.list .contents .section2 .inner-wrap .sch { margin-top: 1.5625vw; } #container.product.list .contents .section2 .inner-wrap .article { flex: 1 1 0; padding-right: 5.2083vw; } #container.product.list .contents .section2 .inner-wrap .article .gallery { display: grid; grid-template-columns: repeat(3, 20.0521vw); gap: 3.1250vw 1.0417vw; padding-bottom: 3.1250vw; } #container.product.list .contents .section2 .inner-wrap .article .gallery > li {} #container.product.list .contents .section2 .inner-wrap .article .gallery > li .img-fit-cover { aspect-ratio: 77/85; border-radius: 0.3125vw; overflow: hidden; } #container.product.list .contents .section2 .inner-wrap .article .gallery > li .tag { margin-top: 1.0417vw; display: flex; gap: 0.2083vw; } #container.product.list .contents .section2 .inner-wrap .article .gallery > li .tag > dd { padding: 0.4167vw 0.7292vw; border: var(--static-10) solid #C2BEB8; border-radius: 5.2083vw; font-size: var(--fs-14); color: var(--text-dark); text-transform: uppercase; font-weight: 600; } #container.product.list .contents .section2 .inner-wrap .article .gallery > li .tag > dd:nth-of-type(1) { color: var(--text-highlight); font-weight: 700; } #container.product.list .contents .section2 .inner-wrap .article .gallery > li .title { margin-top: 0.5208vw; line-height: 1.38; font-weight: 700; font-size: var(--fs-26); word-break:; } #container.product.list .contents .section2 .inner-wrap .article .gallery > li .info { margin-top: 1.0417vw; font-size: var(--fs-16); line-height: 1.48; color: var(--text-dark); } #container.product.list .contents .section2 .inner-wrap .article .gallery > li .info > span { color: var(--text-light); } #container.product.list .contents .section2 .inner-wrap .article .gallery:has(.empty) > li:not(.empty) { display: none; } #container.product.list .contents .section2 .inner-wrap .article .gallery:has(.empty)+.paging { display: none; } #container.product.list .contents .section2 .inner-wrap .article .gallery .empty { display: block; padding: 5.7292vw 0 8.3333vw; text-align: center; grid-column: 1 / span 3; border-bottom: var(--static-10) solid #C2BEB8; } #container.product.list .contents .section2 .inner-wrap .article .gallery .empty > p:nth-of-type(1) { font-size: var(--fs-48); font-weight: 800; } #container.product.list .contents .section2 .inner-wrap .article .gallery .empty > p:nth-of-type(2) { font-size: var(--fs-26); font-weight: 500; margin-top: 1.0417vw; color: var(--text-dark); } /*=========================== product view 공통 ===========================*/ #container.product.view {} #container.product.view .contents {} #container.product.view .contents .section1 {} #container.product.view .contents .section1 .inner-wrap { display: grid; grid-template-columns: 15.6250vw 62.2396vw; gap: 0 10.6771vw; } #container.product.view .contents .section1 .inner-wrap .aside { grid-row: 1/3; position: relative; } #container.product.view .contents .section1 .inner-wrap .aside .inner { position: sticky; top: 0; left: 0; padding-top: 2.6042vw; transition: padding 0.2s ease; } #container.product.view .contents .section1 .inner-wrap .aside .inner.up { padding-top: calc(2.6042vw + 5.2083vw); } #container.product.view .contents .section1 .inner-wrap .aside .inner.down { padding-top: 2.6042vw; } #container.product.view .contents .section1 .inner-wrap .aside .inner > div { width: 100%; border-bottom: var(--static-10) solid #C2BEB8; } #container.product.view .contents .section1 .inner-wrap .aside .inner .tag { display: flex; gap: 0.2083vw; flex-wrap: wrap; } #container.product.view .contents .section1 .inner-wrap .aside .inner .tag > li { padding: 0.4167vw 0.6250vw; border: var(--static-10) solid #C2BEB8; border-radius: 5.2083vw; font-size: var(--fs-14); font-weight: 600; color: var(--text-dark); } #container.product.view .contents .section1 .inner-wrap .aside .inner .tag > li:nth-of-type(1) { font-weight: 700; color: var(--text-highlight); } #container.product.view .contents .section1 .inner-wrap .aside .inner .title { margin-top: 1.0417vw; font-size: var(--fs-36); font-weight: 800; word-break: ; line-height: normal; } #container.product.view .contents .section1 .inner-wrap .aside .inner .sub-title { margin-top: 0.7292vw; font-size: var(--fs-20); font-weight: 700; word-break: ; line-height: normal; } #container.product.view .contents .section1 .inner-wrap .aside .inner .copylink-wrap { margin-top: 1.0417vw; display: flex; align-items: center; gap: 0.6250vw; padding-bottom: 1.0417vw; } #container.product.view .contents .section1 .inner-wrap .aside .inner .copylink-wrap > p { width: 2.2917vw; } #container.product.view .contents .section1 .inner-wrap .aside .inner .copylink-wrap > p > img { width: 100%; } #container.product.view .contents .section1 .inner-wrap .aside .inner .copylink-wrap > div { position: relative; display: flex; align-items: center; gap: 0.2083vw; padding: 0.4688vw 0.7292vw; border-radius: 5.2083vw; border: var(--static-10) solid #DEDDCF; cursor: pointer; } #container.product.view .contents .section1 .inner-wrap .aside .inner .copylink-wrap > div > img { width: 0.8854vw; } #container.product.view .contents .section1 .inner-wrap .aside .inner .copylink-wrap > div > span { font-size: var(--fs-14); font-weight: 700; color: var(--text-body); } #container.product.view .contents .section1 .inner-wrap .aside .inner .copylink-wrap > div .feedback { position: absolute; left: 0; top: calc(100% + 0.2604vw); width: max-content; background: var(--text-dark); padding: 0.5208vw 0.7813vw; border-radius: 5.2083vw; color: #fff; font-size: var(--fs-14); } #container.product.view .contents .section1 .inner-wrap .aside .inner .print { padding: 1.2500vw 0 1.5625vw; font-size: var(--fs-16); color: var(--text-body); font-weight: 600; } #container.product.view .contents .section1 .inner-wrap .aside .inner .print > div { margin-top: 0.6771vw; cursor: pointer; } #container.product.view .contents .section1 .inner-wrap .aside .inner .print > div > img { width: 1.4583vw; } #container.product.view .contents .section1 .inner-wrap .aside .inner .download { padding: 1.2500vw 0 1.5625vw; font-size: var(--fs-16); color: var(--text-body); font-weight: 600; } #container.product.view .contents .section1 .inner-wrap .aside .inner .download > div { margin-top: 0.7292vw; display: flex; flex-direction: column; gap: 0.4167vw; align-items: flex-start; } #container.product.view .contents .section1 .inner-wrap .article { padding-top: 2.6042vw; } #container.product.view .contents .section1 .inner-wrap .article > div {} #container.product.view .contents .section1 .inner-wrap .article > div > p:nth-of-type(1) { font-size: var(--fs-26); font-weight: 800; } #container.product.view .contents .section1 .inner-wrap .article .information { width: 100%; } #container.product.view .contents .section1 .inner-wrap .article .information .slide .swiper { width: 100%; height: auto; overflow: hidden; position: relative; } #container.product.view .contents .section1 .inner-wrap .article .information .slide .swiper .swiper-wrapper { height: 36.4583vw; } #container.product.view .contents .section1 .inner-wrap .article .information .slide .swiper .swiper-slide { width: 100%; height: 36.4583vw; border-radius: 0.3125vw; overflow: hidden; display: flex; justify-content: center; } #container.product.view .contents .section1 .inner-wrap .article .information .slide .swiper .swiper-slide > img { height: 100%; } #container.product.view .contents .section1 .inner-wrap .article .information .slide .swiper .swiper-slide > video, #container.product.view .contents .section1 .inner-wrap .article .information .slide .swiper .swiper-slide.fit > img { width: 100%; height: 100%; object-fit: cover; object-position: center; } #container.product.view .contents .section1 .inner-wrap .article .information .slide .swiper .btn { display: flex; height: 1.3542vw; align-items: center; justify-content: center; gap: 2.0833vw; margin-top: 1.1458vw; } #container.product.view .contents .section1 .inner-wrap .article .information .slide .swiper .btn > div { position: relative; width: 2.6563vw; cursor: pointer; } #container.product.view .contents .section1 .inner-wrap .article .information .slide .swiper .btn > div > img { width: 100%; } #container.product.view .contents .section1 .inner-wrap .article .information .slide .swiper .btn .next::before { content: ''; position: absolute; left: -1.0417vw; top: 50%; width: var(--static-10); height: 1.3542vw; background: #DEDDCF; margin-top: -0.6771vw; } #container.product.view .contents .section1 .inner-wrap .article .information > ul { margin-top: 1.1458vw; display: grid; grid-template-columns: 31.0938vw 31.1458vw; border-bottom: var(--static-10) solid #C2BEB8; } #container.product.view .contents .section1 .inner-wrap .article .information > ul > li { display: flex; padding: 1.4063vw 0; gap: 1.0417vw; border-top: var(--static-10) solid #C2BEB8; } #container.product.view .contents .section1 .inner-wrap .article .information > ul > li:last-child:nth-child(odd) { grid-column: 1 / -1; } #container.product.view .contents .section1 .inner-wrap .article .information > ul > li > p { width: 4.6875vw; flex: 0 0 auto; line-height: 1.6; font-size: var(--fs-16); font-weight: 700; color: var(--text-darkest); } #container.product.view .contents .section1 .inner-wrap .article .information > ul > li > div { padding-right: 3.1250vw; word-break: keep-all; line-height: 1.42; font-size: var(--fs-18); color: var(--text-darkest); } #container.product.view .contents .section1 .inner-wrap .article .information > ul > li > div > a { text-decoration: underline; } #container.product.view .contents .section1 .inner-wrap .article .information .cause { display: flex; margin-top: 1.5625vw; color: var(--text-highlight); font-weight: 500; font-size: var(--fs-14); align-items: center; gap: 0.4167vw; } #container.product.view .contents .section1 .inner-wrap .article .information .cause > img { width: 1.0417vw; } #container.product.view .contents .section1 .inner-wrap .article .portfolio { margin-top: 3.1250vw; } #container.product.view .contents .section1 .inner-wrap .article .portfolio > ul { display: grid; grid-template-columns: repeat(3, 20.0521vw); margin-top: 1.5625vw; gap: 3.1250vw 1.0417vw; } #container.product.view .contents .section1 .inner-wrap .article .portfolio > ul > li {} #container.product.view .contents .section1 .inner-wrap .article .portfolio > ul > li > p:nth-of-type(1) { aspect-ratio: 77/85; border-radius: 0.3125vw; overflow: hidden; } #container.product.view .contents .section1 .inner-wrap .article .portfolio > ul > li > p:nth-of-type(2) { margin-top: 1.0417vw; font-size: var(--fs-26); font-weight: 600; line-height: normal; word-break: keep-all; color: var(--text-darkest); } #container.product.view .contents .section1 .inner-wrap .article .portfolio > ul > li > dl { margin-top: 0.8333vw; display: grid; grid-template-columns: minmax(1.9271vw, auto) auto; gap: 0.1042vw 0.7292vw; justify-content: start; align-items: center; } #container.product.view .contents .section1 .inner-wrap .article .portfolio > ul > li > dl > dt { font-size: var(--fs-14); font-weight: 700; color: var(--text-dark); } #container.product.view .contents .section1 .inner-wrap .article .portfolio > ul > li > dl > dd { line-height: 1.48; font-size: var(--fs-16); color: var(--text-dark); } #container.product.view .contents .section1 .inner-wrap .article .portfolio > ul > li > div { font-size: var(--fs-14); font-weight: 500; line-height: normal; color: var(--text-dark); word-break: keep-all; padding-top: 1.0417vw; margin-top: 1.0417vw; padding-right: 2.0833vw; border-top: var(--static-10) dashed #C2BEB8; } #container.product.view .contents .section1 .inner-wrap .article .location { margin-top: 3.1250vw; border-bottom: var(--static-10) solid #C2BEB8; } #container.product.view .contents .section1 .inner-wrap .article .location #map { margin-top: 1.5625vw; width: 100%; aspect-ratio: 239/128; } #container.product.view .contents .section1 .inner-wrap .article .location > a { margin: 0.6771vw auto; padding: 0.6250vw 1.0417vw; display: flex; align-items: center; justify-content: center; gap: 0.4167vw; font-size: var(--fs-14); font-weight: 700; border: var(--static-10) solid #4A4948; border-radius: 0.4167vw; width: fit-content; } #container.product.view.fundView .contents .section1 .inner-wrap .article .location { border-bottom: 0; } #container.product.view.fundView .contents .section1 .inner-wrap .article .location > a { margin-bottom: 0; } #container.product.view .contents .section1 .inner-wrap .article .list { margin-top: 3.1250vw; } #container.product.view .contents .section1 .inner-wrap .article .list .faq-list { margin-top: 1.5625vw; } #container.product.view .contents .section1 .inner-wrap .article .construction { margin-top: 2.6042vw; } #container.product.view .contents .section1 .inner-wrap .article .construction .title { display: flex; justify-content: space-between; align-items: center; } #container.product.view .contents .section1 .inner-wrap .article .construction .title > p { font-size: var(--fs-26); font-weight: 800; text-transform: uppercase; } #container.product.view .contents .section1 .inner-wrap .article .construction .title > div { width: 10.4167vw; } #container.product.view .contents .section1 .inner-wrap .article .construction .title > div > select {} #container.product.view .contents .section1 .inner-wrap .article .construction .slide { width: 100%; overflow: hidden; margin-top: 1.0417vw; } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .construct { position: relative; border-radius: 0.3125vw; overflow: hidden; } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .construct .swiper-slide { width: 100%; height: 33.3333vw; } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .construct .swiper-slide > img { width: 100%; height: 100%; object-fit: cover; object-fit: center; } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .construct .process { position: absolute; left: 0; bottom: 0; width: 100%; height: 6.8750vw; background: rgba(0,0,0,0.4); z-index: 2; } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .construct .process > p { height: 100%; width: 45%; background: var(--text-highlight); } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .construct .process > div { position: absolute; left: 0; top: 0.6250vw; width: 100%; height: 100%; color: #fff; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .construct .process > div > div { display: flex; gap: 1.4583vw; font-size: var(--fs-20); font-weight: 700; } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .construct .process > div > div > p:nth-of-type(2) { position: relative; } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .construct .process > div > div > p:nth-of-type(2)::after { content: ''; position: absolute; left: -0.7292vw; top: 50%; width: var(--static-10); height: 1.2500vw; background: #817E7A; margin-top: -0.6250vw; } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .construct .process > div > p { margin-top: 1.0417vw; font-size: var(--fs-82); font-weight: 800; } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .btn { display: flex; justify-content: center; height: 1.3542vw; align-items: center; margin-top: 1.0417vw; gap: 2.0833vw; position: relative; } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .btn::after { content: ''; position: absolute; width: var(--static-10); height: 1.3542vw; top: 0; left: calc(50% -var(--static-10)); background: #DEDDCF; opacity: 0.4; } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .btn > div { width: 0.9375vw; cursor: pointer; } #container.product.view .contents .section1 .inner-wrap .article .construction .slide .btn > div > img { width: 100%; } /*=========================== product map 공통 ===========================*/ #container.product.map .contents { padding-bottom: 0; } #container.product.map .contents .section1 { margin-top: 2.0833vw; padding-bottom: 5.2083vw; background: #000; } #container .map-wrap { display: flex; position: relative; width: 100%; height: 42.5625vw; border-top: var(--static-10) solid #4A4948; border-bottom: var(--static-10) solid #4A4948; } #container .map-wrap #map { width: 100%; height: 100%; } #container .map-wrap .popup { flex: 0 0 auto; display: none; position: relative; width: 28.3854vw; height: 100%; background: #000; padding: 1.0417vw; border-left: var(--static-10) solid #4A4948; } #container .map-wrap .popup .close { position: absolute; left: -1.3021vw; top: 50%; width: 1.2500vw; height: 2.5521vw; border-radius: 0.4167vw 0 0 0.4167vw; border: var(--static-10) solid #1C1B1B; border-right: 0; margin-top: -1.3021vw; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='9' viewBox='0 0 5 9' fill='none'%3E%3Cpath d='M0 9L5 4.5L0 0L0 9Z' fill='%23EFEFE9'/%3E%3C/svg%3E") 0.5208vw center/0.2604vw 0.4688vw no-repeat #000; cursor: pointer; z-index: 1; } #container .map-wrap .popup .inner {} #container .map-wrap .popup .inner > div { color: #fff; width: 100%; height: 100%; display: flex; flex-direction: column; } #container .map-wrap .popup .inner > div .img { flex: 0 0 auto; position: relative; width: 100%; aspect-ratio: 505/320; border-radius: 0.2083vw; overflow: hidden; } #container .map-wrap .popup .inner > div .img > img { width: 100%; height: 100%; object-fit: cover; object-position: center; } #container .map-wrap .popup .inner > div .img > p { position: absolute; bottom: 0.5208vw; right: 0.5208vw; display: block; padding: 0.3125vw 0.5208vw; border-radius: 0.3125vw; background: #000; opacity: 0.8; cursor: pointer; } #container .map-wrap .popup .inner > div .img > p > span { color: #fff; display: block; line-height: 1.2500vw; padding-left: 1.4583vw; font-size: var(--fs-12); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cg opacity='0.8'%3E%3Cpath d='M9.3 13.8H18.3L15.195 9.75L13.125 12.45L11.73 10.65L9.3 13.8ZM8.4 17.4C7.905 17.4 7.48125 17.2238 7.12875 16.8713C6.77625 16.5188 6.6 16.095 6.6 15.6V4.8C6.6 4.305 6.77625 3.88125 7.12875 3.52875C7.48125 3.17625 7.905 3 8.4 3H19.2C19.695 3 20.1188 3.17625 20.4713 3.52875C20.8238 3.88125 21 4.305 21 4.8V15.6C21 16.095 20.8238 16.5188 20.4713 16.8713C20.1188 17.2238 19.695 17.4 19.2 17.4H8.4ZM8.4 15.6H19.2V4.8H8.4V15.6ZM4.8 21C4.305 21 3.88125 20.8238 3.52875 20.4713C3.17625 20.1188 3 19.695 3 19.2V6.6H4.8V19.2H17.4V21H4.8Z' fill='white'/%3E%3C/g%3E%3C/svg%3E") left center/1.2500vw 1.2500vw no-repeat; } #container .map-wrap .popup .inner > div .title { flex: 0 0 auto; margin-top: 1.5625vw; display: flex; justify-content: space-between; gap: 1.5625vw; } #container .map-wrap .popup .inner > div .title > div { width: 18.4896vw; padding-left: 0.5208vw; } #container .map-wrap .popup .inner > div .title > div > p:nth-of-type(1) { font-size: var(--fs-30); word-break: keep-all; font-weight: 600; line-height: normal; } #container .map-wrap .popup .inner > div .title > div > p:nth-of-type(2) { margin-top: 0.7292vw; font-size: var(--fs-18); word-break: keep-all; font-weight: 600; line-height: normal; } #container .map-wrap .popup .inner > div .title > ul { display: flex; gap: 1.3542vw; } #container .map-wrap .popup .inner > div .title > ul > li > a { font-size: var(--fs-14); font-weight: 600; color: #fff; display: block; } #container .map-wrap .popup .inner > div .title > ul > li:nth-of-type(1) > a { padding-top: 1.4583vw; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21 22' fill='none'%3E%3Cpath d='M13.1276 2.625C13.1276 1.92881 12.8509 1.26113 12.3586 0.768845C11.8662 0.276562 11.1984 0 10.5021 0C9.80572 0 9.13791 0.276562 8.64553 0.768845C8.15315 1.26113 7.87654 1.92881 7.87654 2.625C7.87654 3.32119 8.15315 3.98887 8.64553 4.48116C9.13791 4.97344 9.80572 5.25 10.5021 5.25C11.1984 5.25 11.8662 4.97344 12.3586 4.48116C12.8509 3.98887 13.1276 3.32119 13.1276 2.625ZM9.18929 6.5625C7.74116 6.5625 6.56378 7.73965 6.56378 9.1875V11.1562C6.56378 11.8822 7.15042 12.4688 7.87654 12.4688H7.95038L8.40574 16.5498C8.47959 17.2143 9.04161 17.7188 9.71029 17.7188H11.2979C11.9666 17.7188 12.5286 17.2143 12.6025 16.5498L13.0537 12.4688H13.1276C13.8537 12.4688 14.4403 11.8822 14.4403 11.1562V9.1875C14.4403 7.73965 13.2629 6.5625 11.8148 6.5625H9.18929ZM5.42743 17.1684C5.96073 17.0699 6.31764 16.5572 6.21918 16.024C6.12073 15.4908 5.60793 15.134 5.07462 15.2324C3.74546 15.4744 2.57628 15.8148 1.71069 16.2496C1.27994 16.467 0.877906 16.7295 0.570229 17.0535C0.262551 17.3857 0 17.8369 0 18.3906C0 19.2684 0.635866 19.8713 1.19379 20.2363C1.79684 20.6301 2.6009 20.9459 3.50752 21.1961C5.34128 21.7006 7.8109 22 10.5021 22C13.1932 22 15.6628 21.7006 17.4925 21.1961C18.3991 20.9459 19.2073 20.6301 19.8062 20.2363C20.3682 19.8713 21 19.2684 21 18.3906C21 17.8369 20.7374 17.3857 20.4257 17.0535C20.118 16.7295 19.716 16.467 19.2852 16.2496C18.4237 15.8148 17.2545 15.4744 15.9213 15.2324C15.388 15.134 14.8752 15.4908 14.7767 16.024C14.6783 16.5572 15.0352 17.0699 15.5685 17.1684C16.8074 17.3939 17.7714 17.6934 18.3991 18.0092C18.5304 18.0748 18.637 18.1363 18.7232 18.1938C18.8709 18.2922 18.8709 18.4891 18.7232 18.5875C18.3622 18.8213 17.7755 19.0715 16.9592 19.2971C15.3551 19.7441 13.066 20.0312 10.5021 20.0312C7.93807 20.0312 5.64896 19.7441 4.03262 19.2971C3.21625 19.0715 2.62962 18.8213 2.26861 18.5875C2.12092 18.4891 2.12092 18.2922 2.26861 18.1938C2.35476 18.1363 2.46552 18.0748 2.59269 18.0092C3.22036 17.6934 4.18441 17.398 5.42333 17.1684H5.42743Z' fill='%23DEDDCF'/%3E%3C/svg%3E") center top/1.0938vw 1.1458vw no-repeat; } #container .map-wrap .popup .inner > div .title > ul > li:nth-of-type(2) > a { position: relative; padding-top: 1.4583vw; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 19 21' fill='none'%3E%3Cpath d='M1 10.8477V17.9787C1 18.5145 1.22388 19.0284 1.6224 19.4073C2.02091 19.7861 2.56141 19.999 3.125 19.999H15.875C16.4386 19.999 16.9791 19.7861 17.3776 19.4073C17.7761 19.0284 18 18.5145 18 17.9787V10.8477' stroke='%23DEDDCF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M13.4211 5.2532L9.21053 1L5 5.2532' stroke='%23DEDDCF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M9.21094 1V13.6963' stroke='%23DEDDCF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center top/0.9896vw 1.0938vw no-repeat; } #container .map-wrap .popup .inner > div .title > ul > li:nth-of-type(2) > a .feedback { position: absolute; right: 0; top: calc(100% + 0.2604vw); width: max-content; background: var(--text-dark); padding: 0.5208vw 0.7813vw; border-radius: 5.2083vw; color: #fff; font-size: var(--fs-14); } #container .map-wrap .popup .inner > div .tag { flex: 0 0 auto; margin-top: 1.8229vw; padding: 0.7292vw 0; border-top: var(--static-10) solid rgba(255,255,255,0.3); border-bottom: var(--static-10) solid rgba(255,255,255,0.3); display: flex; gap: 0.3125vw; } #container .map-wrap .popup .inner > div .tag > li { padding: 0.5208vw 0.7292vw; border-radius: 5.2083vw; background: #1C1B1B; font-size: var(--fs-14); font-weight: 600; text-transform: uppercase; } #container .map-wrap .popup .inner > div .tag > li:nth-of-type(1) { color: var(--text-highlight); font-weight: 700; } #container .map-wrap .popup .inner > div .info { margin-top: 1.5625vw; overflow-y: auto; padding-bottom: 4.1667vw; } #container .map-wrap .popup .inner > div .info > dl { display: grid; grid-template-columns: 4.6875vw auto; gap: 0.5208vw 1.0417vw; justify-content: start; } #container .map-wrap .popup .inner > div .info > dl > dt { font-size: var(--fs-16); font-weight: 700; line-height: 1.48; } #container .map-wrap .popup .inner > div .info > dl > dd { font-size: var(--fs-16); line-height: 1.48; word-break: keep-all; } #container .map-wrap .popup .inner > div .info .cause { margin-top: 1.0417vw; display: flex; align-items: center; gap: 0.4167vw; font-size: var(--fs-14); color: var(--text-highlight); font-weight: 500; line-height: normal; word-break: keep-all; } #container .map-wrap .popup .inner > div .info .cause > img { width: 1.0417vw; } #container .map-wrap .popup > a { position: absolute; bottom: 0; left: 0; width: 100%; background: #1C1B1B; padding: 1.1458vw 0; color: #fff; font-weight: 700; font-size: var(--fs-16); text-align: center; } #container .map-wrap .popup > a > span { padding-right: 1.3542vw; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M10.175 8H0V6H10.175L5.575 1.4L7 0L14 7L7 14L5.575 12.6L10.175 8Z' fill='white'/%3E%3C/svg%3E") right center/0.7292vw 0.7292vw no-repeat; } /*=========================== 서브페이지 공통 ===========================*/ #container.subpage {} #container.subpage .big-banner { margin-top: 2.0833vw; width: 100%; height: 250vh; overflow: hidden; } #container.subpage .big-banner .inner-banner { position: relative; width: 100%; height: 44.2708vw; } #container.subpage .big-banner .inner-banner > .img { display: none; overflow: hidden; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; } #container.subpage .big-banner .inner-banner > .img-dimd { display: none; overflow: hidden; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; background: rgba(0,0,0,0.5); } #container.subpage .big-banner .inner-banner > .img img, #container.subpage .big-banner .inner-banner > .img video { width: 100%; height: 100%; object-fit: cover; } #container.subpage .big-banner .inner-banner .txt-wrap { position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 10.0000vw var(--w-60) 0; z-index: 1; color: #fff; } #container.subpage .big-banner .inner-banner .txt-wrap > p { position: relative; top: 4.1667vw; opacity: 0; transition: top 0.7s ease, opacity 0.7s ease; } #container.subpage .big-banner .inner-banner .txt-wrap > p:nth-of-type(1) { font-size: var(--fs-16); font-weight: 700; line-height: normal; } #container.subpage .big-banner .inner-banner .txt-wrap > p:nth-of-type(2) { font-size: var(--fs-82); font-weight: 600; line-height: normal; margin-top: 0.5208vw; padding-bottom: 1.0417vw; border-bottom: var(--static-10) solid rgba(255,255,255,0.3); } #container.subpage .big-banner .inner-banner.active > .img { display: block; z-index: 1; } #container.subpage .big-banner .inner-banner.active > .img-dimd { display: block; z-index: 1; } #container.subpage .big-banner .inner-banner.active .txt-wrap > p:nth-of-type(1) { top: 0; opacity: 1; } #container.subpage .big-banner .inner-banner.active .txt-wrap > p:nth-of-type(2) { top: 0; opacity: 1; transition-delay: 0.15s; } /* #container.subpage .big-banner .inner-banner.high-index > .img { z-index: 1; } #container.subpage .big-banner .inner-banner.high-index > .img-dimd { z-index: 1; } #container.subpage .big-banner .inner-banner.high-index > .txt-wrap { z-index: 2; } */ #container.subpage .big-banner .fix-banner { position: relative; width: 100%; height: 44.2708vw; overflow: hidden; } #container.subpage .big-banner .fix-banner .motion-banner { overflow: hidden; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 10.4167vw); aspect-ratio: 1920/850; border-radius: 0.5208vw; } #container.subpage .big-banner .fix-banner .motion-banner .img { width: 100%; height: 100%; } #container.subpage .big-banner .fix-banner .motion-banner .img img, #container.subpage .big-banner .fix-banner .motion-banner .img video { width: 100%; height: 100%; object-fit: cover; } #container.subpage .big-banner .fix-banner .motion-banner .img-dimd { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0.2; } #container.subpage .big-banner + .contents { padding-top: 4.1667vw; position: relative; z-index: 2; background: #fff; } #container.subpage .main-title + .contents { padding-top: 3.1250vw; } #container.subpage .contents .section .aside-wrap { display: flex; justify-content: space-between; } #container.subpage .contents .section .aside-wrap .aside { width: 15.6250vw; flex: 0 0 auto; } #container.subpage .contents .section .aside-wrap .aside > p { font-size: var(--fs-36); font-weight: 800; } #container.subpage .contents .section .aside-wrap .aside.sticky .inner { position: sticky; top: 0; left: 0; transition: padding 0.2s ease; } /* #container.subpage .contents .section .aside-wrap .aside.sticky .inner.up { padding-top: calc(5.2083vw + 5.2083vw); } #container.subpage .contents .section .aside-wrap .aside.sticky .inner.down { padding-top: 5.2083vw; } */ #container.subpage .contents .section .aside-wrap .aside.sticky .inner.up { padding-top: 5.2083vw; } #container.subpage .contents .section .aside-wrap .aside.sticky .inner.down { padding-top: 5.2083vw; } #container.subpage .contents .section .aside-wrap .article { width: 67.4479vw; padding-right: 5.2083vw; } /*=========================== 회사개요 about_01 ===========================*/ #container.about_01 .contents .section {} #container.about_01 .contents .section1 {} #container.about_01 .contents .section1 .inner { padding-bottom: 5.7292vw; } #container.about_01 .contents .section1 .inner > .title { font-size: var(--fs-36); font-weight: 800; padding-bottom: 2.0833vw; border-bottom: var(--static-10) solid #4A4948; } #container.about_01 .contents .section1 .inner > .article { padding-top: 2.0833vw; } #container.about_01 .contents .section1 .inner > .article > ul { display: flex; justify-content: space-between; padding-bottom: 5.7292vw; } #container.about_01 .contents .section1 .inner > .article > ul > li {} #container.about_01 .contents .section1 .inner > .article > ul > li:nth-of-type(1) { flex: 1 1 0; font-size: var(--fs-48); font-weight: 800; } #container.about_01 .contents .section1 .inner > .article > ul > li:nth-of-type(2) { width: 47.9167vw; font-size: var(--fs-18); line-height: 1.42; color: var(--text-body); word-break: keep-all; } #container.about_01 .contents .section1 .inner > .article > dl { display: flex; justify-content: flex-end; } #container.about_01 .contents .section1 .inner > .article > dl > dt { font-size: var(--fs-26); font-weight: 700; width: 14.3750vw; } #container.about_01 .contents .section1 .inner > .article > dl > dd { width: 47.9167vw; } #container.about_01 .contents .section1 .inner > .article > dl > dd > video { width: 100%; } #container.about_01 .contents .section1 .inner > .article > dl:nth-of-type(1) { padding-bottom: 4.1667vw; } #container.about_01 .contents .section1 .inner > .article > dl:nth-of-type(1) > dt { padding-top: 4.1667vw; } #container.about_01 .contents .section1 .inner > .article > dl:nth-of-type(1) > dd { padding-top: 4.1667vw; border-top: var(--static-10) solid #C2BEB8; } #container.about_01 .contents .section1 .inner > .article > dl:nth-of-type(1) > dd > p { font-size: var(--fs-82); font-weight: 800; color: var(--text-highlight); display: flex; align-items: baseline; gap: 0.2083vw; margin-bottom: 2.0833vw; } #container.about_01 .contents .section1 .inner > .article > dl:nth-of-type(1) > dd > p > span { font-size: var(--fs-26); font-weight: 600; } #container.about_01 .contents .section1 .inner > .article > dl:nth-of-type(2) {} #container.about_01 .contents .section1 .inner > .article > dl:nth-of-type(2) > dt { padding-top: 4.1667vw; } #container.about_01 .contents .section1 .inner > .article > dl:nth-of-type(2) > dd { border-top: var(--static-10) dashed #C2BEB8; padding-top: 4.1667vw; } #container.about_01 .contents .section2 .inner-wrap { color: #fff; display: grid; grid-template-columns: 1fr 53.1250vw; gap: 3.1250vw; background: var(--text-darkest); padding-top: 4.1667vw; padding-bottom: 4.1667vw; } #container.about_01 .contents .section2 .inner-wrap > p:nth-of-type(1) { font-size: var(--fs-62); font-weight: 600; } #container.about_01 .contents .section2 .inner-wrap > p:nth-of-type(2) { width: 53.1250vw; grid-row: 1 / span 2; grid-column: 2 / 3; } #container.about_01 .contents .section2 .inner-wrap > p:nth-of-type(2) > img { width: 100%; } #container.about_01 .contents .section2 .inner-wrap > ul { align-self: end; width: 26.2500vw; } #container.about_01 .contents .section2 .inner-wrap > ul > li { font-size: var(--fs-16); line-height: 1.48; } #container.about_01 .contents .section2 .inner-wrap > ul > li > strong { font-size: var(--fs-20); line-height: normal; margin-bottom: 1.0417vw; display: block; } #container.about_01 .contents .section2 .inner-wrap > ul > li~li { margin-top: 2.0833vw; padding-top: 2.0833vw; border-top: var(--static-10) dashed #817E7A; } #container.about_01 .contents .section2 .inner-wrap > dl { grid-column: 1/span 2; grid-row: 3/4; padding-top: 2.0833vw; border-top: var(--static-10) solid #817E7A; } #container.about_01 .contents .section2 .inner-wrap > dl > dt { font-size: var(--fs-20); font-weight: 700; } #container.about_01 .contents .section2 .inner-wrap > dl > dd {} #container.about_01 .contents .section2 .inner-wrap > dl > dd > ul { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0 2.0833vw; } #container.about_01 .contents .section2 .inner-wrap > dl > dd > ul > li { padding-top: 2.0833vw; display: flex; flex-direction: column; } #container.about_01 .contents .section2 .inner-wrap > dl > dd > ul > li:nth-child(-n+4) { border-bottom: var(--static-10) dashed #817E7A; padding-bottom: 2.0833vw; } #container.about_01 .contents .section2 .inner-wrap > dl > dd > ul > li > span { order: 1; margin-top: 1.5625vw; font-size: var(--fs-14); font-weight: 700; color: var(--text-highlight); } #container.about_01 .contents .section2 .inner-wrap > dl > dd > ul > li > p { order: 0; width: 6.2500vw; height: 6.2500vw; border-radius: 6.2500vw; background: #fff; font-size: var(--fs-20); font-weight: 700; color: #000; display: flex; justify-content: center; align-items: center; } #container.about_01 .contents .section2 .inner-wrap > dl > dd > ul > li > div { order: 2; margin-top: 0.5208vw; font-size: var(--fs-18); color: var(--text-light); line-height: 1.48; } #container.about_01 .contents .section3 .inner { padding-top: 0; padding-bottom: 5.7292vw; } #container.about_01 .contents .section3 .inner > dl { display: flex; justify-content: flex-end; } #container.about_01 .contents .section3 .inner > dl > dt { width: 14.3750vw; font-size: var(--fs-26); font-weight: 700; } #container.about_01 .contents .section3 .inner > dl > dd { width: 47.9167vw; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(1) { padding-bottom: 4.1667vw; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(1) > dd > table { width: 100%; border-top: var(--static-20) solid #4A4948; border-collapse: collapse; border-spacing: 0; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(1) > dd > table td { color: #000; font-size: var(--fs-16); padding: 1.2500vw 0; text-align: center; word-break: keep-all; line-height: 1.48; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(1) > dd > table td > strong { color: var(--text-dark); } #container.about_01 .contents .section3 .inner > dl:nth-of-type(1) > dd > table thead { border-bottom: var(--static-10) solid #4A4948; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(1) > dd > table thead td { color: #000; font-size: var(--fs-20); font-weight: 700; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(1) > dd > table tbody > tr { border-bottom: var(--static-10) solid #C2BEB8; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(1) > dd > table tbody > tr > td:nth-of-type(1) { width: 8.3333vw; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(1) > dd > table tbody > tr > td:nth-of-type(2) { padding-left: 2.6042vw; padding-right: 2.6042vw; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(1) > dd > table tbody > tr > td:nth-of-type(3) { width: 17.1875vw; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) {} #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dt { padding-top: 4.1667vw; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dd { padding-top: 4.1667vw; border-top: var(--static-10) dashed #C2BEB8; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dd > div { display: flex; align-items: flex-end; gap: 0.3125vw; padding-bottom: 2.6042vw; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dd > div > p { font-size: var(--fs-240); font-weight: 800; line-height: 0.75; background: linear-gradient(129deg, var(--color-case-text-highlight, #D03042) 35.95%, #E2C41C 96.92%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dd > div > div {} #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dd > div > div > p:nth-of-type(1) { font-size: var(--fs-68); font-weight: 700; letter-spacing: -0.1042vw; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dd > div > div > p:nth-of-type(2) { font-size: var(--fs-16); line-height: 1.48; color: var(--text-body); margin-top: 0.5208vw; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dd > ul { border-top: var(--static-10) dashed #C2BEB8; display: flex; padding-bottom: 3.1250vw; border-bottom: var(--static-10) solid #C2BEB8; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dd > ul > li { flex: 1 1 0; min-width: 15.9896vw; padding-top: 2.6042vw; padding-bottom: 0.7813vw; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dd > ul > li~li { border-left: var(--static-10) dashed #C2BEB8; padding-left: 1.5625vw; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dd > ul > li > p { font-size: var(--fs-16); font-weight: 700; color: var(--text-darkest); } #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dd > ul > li > div { margin-top: 1.5625vw; display: flex; align-items: flex-end; color: var(--text-darkest); gap: 0.2083vw; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dd > ul > li > div > p { font-size: var(--fs-68); font-weight: 500; line-height: 0.75; } #container.about_01 .contents .section3 .inner > dl:nth-of-type(2) > dd > ul > li > div > span { font-size: var(--fs-20); font-weight: 700; padding-bottom: 0.1563vw; } #container.about_01 .contents .section4 .inner { display: flex; flex-direction: column; align-items: flex-end; } #container.about_01 .contents .section4 .inner > dl { width: 62.2917vw; padding-top: 4.1667vw; padding-bottom: 5.7292vw; border-top: var(--static-10) solid #4A4948; display: flex; } #container.about_01 .contents .section4 .inner > dl > dt { flex: 1 1 0; font-size: var(--fs-36); font-weight: 800; } #container.about_01 .contents .section4 .inner > dl > dd { width: 47.9167vw; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(1) { padding-bottom: 4.1667vw; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(1) > dd { font-size: var(--fs-18); font-weight: 500; line-height: 1.42; color: var(--text-body); } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) {} #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > div { display: flex; gap: 2.0833vw; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > div > p { width: 23.9583vw; height: 15.6250vw; border-radius: 0.3125vw; overflow: hidden; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > div > div { padding-top: 1.0417vw; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > div > div > p { font-size: var(--fs-48); font-weight: 700; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > div > div > span { margin-top: 0.5208vw; display: block; font-size: var(--fs-16); line-height: 1.48; color: var(--text-body); } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > div > div > a { margin-top: 2.0833vw; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > ul { margin-top: 2.6042vw; display: grid; grid-template-columns: repeat(3, 14.5833vw); gap: 2.0833vw 0; justify-content: space-between; height: 8.5938vw; overflow: hidden; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > ul.active { height: auto; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > ul > li { padding-top: 1.5625vw; display: flex; flex-direction: column; align-items: flex-start; border-top: var(--static-10) solid #4A4948; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > ul > li > p { font-size: var(--fs-26); font-weight: 700; line-height: 1.38; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > ul > li > span { font-size: var(--fs-18); line-height: 1.42; margin-top: 0.2083vw; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > ul > li > a { margin-top: 1.5625vw; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > ul > li > a~a { margin-top: 0.4167vw; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > .more { width: 100%; padding: 1.0417vw 0; text-align: center; border: var(--static-10) solid #000; border-radius: 0.1042vw; margin-top: 2.0833vw; font-weight: 700; font-size: var(--fs-18); cursor: pointer; } #container.about_01 .contents .section4 .inner > dl:nth-of-type(2) > dd > ul.active+.more { display: none; } /*=========================== 연혁 about_02 ===========================*/ #container.about_02 .contents .section~.section { border-top: var(--static-10) solid #C2BEB8; padding-top: 4.6875vw; margin-top: 3.9583vw; } #container.about_02 .contents .section .inner-wrap { display: flex; justify-content: space-between; } #container.about_02 .contents .section .inner-wrap .title { position: relative; width: 25.2604vw; flex: 0 0 auto; word-break: keep-all; background: rgba(0,0,0,0); } #container.about_02 .contents .section .inner-wrap .title .inner { width: 25.2604vw; position: absolute; top: 0; } #container.about_02 .contents .section .inner-wrap .title.fixed .inner { position: fixed; transition: top .5s ease, background-color .5s ease; } #container.about_02 .contents .section .inner-wrap .title.end .inner { position: absolute; top: auto !important; bottom: 0.0000vw; transform: translate(0, 0); } #container.about_02 .contents .section .inner-wrap .title .inner > p { font-size: var(--fs-82); font-weight: 600; line-height: normal; } #container.about_02 .contents .section .inner-wrap .title .inner > div { font-size: var(--fs-26); line-height: 1.38; margin-top: 1.5625vw; color: var(--text-body); } #container.about_02 .contents .section .inner-wrap .article { display: flex; gap: 3.1250vw; flex: 0 0 auto; } #container.about_02 .contents .section .inner-wrap .article .img-wrap { position: relative; width: 25.0000vw; background: rgba(0,0,0,0); flex: 0 0 auto; } #container.about_02 .contents .section .inner-wrap .article .img-wrap .inner { width: 25.0000vw; min-height: 10.4167vw; position: absolute; top: 0; } #container.about_02 .contents .section .inner-wrap .article .img-wrap.fixed .inner { position: fixed; transition: top .5s ease, background-color .5s ease; } #container.about_02 .contents .section .inner-wrap .article .img-wrap.end .inner { position: absolute; top: auto !important; bottom: 0.0000vw; transform: translate(0, 0); } #container.about_02 .contents .section .inner-wrap .article .img-wrap .inner > ul { width: 100%; position: relative; } #container.about_02 .contents .section .inner-wrap .article .img-wrap .inner > ul > li { width: 100%; transform: scale(0.9); opacity: 0; position: absolute; left: 0; top: 0; border-radius: 0.3125vw; overflow: hidden; } #container.about_02 .contents .section .inner-wrap .article .img-wrap .inner > ul > li > img { width: 100%; } #container.about_02 .contents .section .inner-wrap .article .img-wrap .inner > ul > li.active { height: auto; display: block; opacity: 1; position: static; transform: scale(1); transition: all .5s ease; } #container.about_02 .contents .section .inner-wrap .article .history { width: 32.2917vw; flex: 0 0 auto; } #container.about_02 .contents .section .inner-wrap .article .history > div {} #container.about_02 .contents .section .inner-wrap .article .history > div~div { margin-top: 2.0833vw; } #container.about_02 .contents .section .inner-wrap .article .history > div > p { font-size: var(--fs-36); font-weight: 800; line-height: normal; margin-bottom: 1.5625vw; } #container.about_02 .contents .section .inner-wrap .article .history > div > div { padding: 1.5625vw 0; font-size: var(--fs-20); line-height: 1.5; border: var(--static-10) solid #000; border-left: 0; border-right: 0; word-break: keep-all; } #container.about_02 .contents .section .inner-wrap .article .history > div > div > p~p { margin-top: 0.2083vw; } #container.about_02 .contents .section .inner-wrap .article .history > div > ul {} #container.about_02 .contents .section .inner-wrap .article .history > div > ul > li { display: flex; align-items: center; gap: 0.3125vw; padding: 1.0417vw 0; font-size: var(--fs-18); line-height: 1.42; color: var(--text-darkest); word-break: keep-all; } #container.about_02 .contents .section .inner-wrap .article .history > div > ul > li.highlight { font-weight: 700; } #container.about_02 .contents .section .inner-wrap .article .history > div > ul > li:not(.img)::before { content: ''; width: 0.1563vw; height: 0.1563vw; border-radius: 5.2083vw; background: #000; align-self: flex-start; margin-right: 0.2604vw; margin-top: 0.6250vw; } #container.about_02 .contents .section .inner-wrap .article .history > div > ul > li.highlight::before { background: var(--text-highlight); } #container.about_02 .contents .section .inner-wrap .article .history > div > ul > li.bd { padding: 0.9375vw 0; } #container.about_02 .contents .section .inner-wrap .article .history > div > ul > li.bd::after { content: ''; width: 1.5625vw; height: 1.5625vw; border-radius: 5.2083vw; background-color: #F9F4F0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M1.5 14.5H14.5M5.83333 6.07407H6.55556M5.83333 9.92593H6.55556M9.44444 6.07407H10.1667M9.44444 9.92593H10.1667M2.94444 14.5V2.94444C2.94444 2.56135 3.09663 2.19395 3.36751 1.92307C3.6384 1.65218 4.0058 1.5 4.38889 1.5H11.6111C11.9942 1.5 12.3616 1.65218 12.6325 1.92307C12.9034 2.19395 13.0556 2.56135 13.0556 2.94444V14.5' stroke='%235B3125' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-size: 0.8333vw 0.8333vw; background-position: center; background-repeat: no-repeat; } #container.about_02 .contents .section .inner-wrap .article .history > div > ul > li~li { border-top: var(--static-10) solid #DEDDCF; } #container.about_02 .contents .section .inner-wrap .article .history > div > p+ul > li:first-of-type { border-top: var(--static-10) solid #DEDDCF; } #container.about_02 .contents .section .inner-wrap .article .history > div > ul > li.img { display: none; } #container.about_02 .contents .section .inner-wrap.reverse {} #container.about_02 .contents .section .inner-wrap.reverse .title { order: 1; } #container.about_02 .contents .section .inner-wrap.reverse .article { order: 0; } #container.about_02 .contents .section .inner-wrap.reverse .article .img-wrap { order: 1; } #container.about_02 .contents .section .inner-wrap.reverse .article .history { order: 0; } /*=========================== 주요성과 about_03 ===========================*/ #container.about_03 .contents .section {} #container.about_03 .contents .section1 { padding-bottom: 5.2083vw; } #container.about_03 .contents .section1 .inner {} #container.about_03 .contents .section1 .inner > p { font-size: var(--fs-36); font-weight: 800; margin-bottom: 2.0833vw; text-transform: uppercase; } #container.about_03 .contents .section1 .inner > ul { display: flex; gap: 1.0417vw; } #container.about_03 .contents .section1 .inner > ul > li { width: 27.0833vw; min-height: 15.0000vw; background: #F9F4F0; border-radius: 0.5208vw; padding: 1.0417vw 1.0417vw 2.3438vw; } #container.about_03 .contents .section1 .inner > ul > li > p:nth-of-type(1) { font-size: var(--fs-16); font-weight: 700; color: var(--text-darkest); } #container.about_03 .contents .section1 .inner > ul > li > p:nth-of-type(2) { font-size: var(--fs-110); font-weight: 500; letter-spacing: -0.1719vw; display: flex; align-items: flex-end; gap: 0.2083vw; justify-content: center; margin-top: 2.3958vw; } #container.about_03 .contents .section1 .inner > ul > li > p:nth-of-type(2) > span:nth-of-type(2) { font-size: var(--fs-26); font-weight: 600; color: var(--text-darkest); padding-bottom: 0.8854vw; } #container.about_03 .contents .section1 .inner > ul > li > div { text-align: center; margin-top: 0.7813vw; font-size: var(--fs-16); line-height: 1.48; } #container.about_03 .contents .section1 .inner > ul > li > div > span { font-weight: 700; } #container.about_03 .contents .section1 .inner > div { margin-top: 2.0833vw; } #container.about_03 .contents .section1 .inner > div > div { position: relative; } #container.about_03 .contents .section1 .inner > div > div > video { width: 100%; } #container.about_03 .contents .section1 .inner > div > div > p {} #container.about_03 .contents .section1 .inner > div > div > p > img { width: 100%; } #container.about_03 .contents .section1 .inner > div > div > ul { display: none; } #container.about_03 .contents .section2 {} #container.about_03 .contents .section2 .inner-wrap { display: grid; grid-template-columns: 1fr 60.4167vw; gap: 0 3.1250vw; color: #fff; background: #1C1B1B; word-break: keep-all; padding-top: 4.1667vw; padding-bottom: 4.1667vw; } #container.about_03 .contents .section2 .inner-wrap > p:nth-of-type(1) { font-size: var(--fs-62); font-weight: 600; line-height: normal; } #container.about_03 .contents .section2 .inner-wrap > p:nth-of-type(2) { width: 60.4167vw; height: 37.5000vw; grid-column: 2/3; grid-row: 1/span 2; } #container.about_03 .contents .section2 .inner-wrap > div { font-size: var(--fs-16); line-height: 1.48; align-self: end; width: 25.2604vw; } #container.about_03 .contents .section3 { padding: 4.1667vw 0 3.1250vw; } #container.about_03 .contents .section3 .inner-wrap {} #container.about_03 .contents .section3 .inner-wrap > dl {} #container.about_03 .contents .section3 .inner-wrap > dl > dt { font-size: var(--fs-82); font-weight: 600; color: var(--text-darkest); } #container.about_03 .contents .section3 .inner-wrap > dl > dd { margin-top: 3.1250vw; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul { display: grid; grid-template-columns: repeat(2, 1fr); } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(1) { grid-column: 1/2; grid-row: 1/span 2; width: 30.2083vw; aspect-ratio: 580/773; border-radius: 0.3125vw; overflow: hidden; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(2) {} #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(2) > p { font-size: var(--fs-48); font-weight: 500; line-height: normal; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(2) > div { margin-top: 1.4583vw; font-size: var(--fs-18); line-height: 1.42; color: var(--text-darkest); } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(2) > a { margin-top: 1.5625vw; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) {position: relative; display: flex; align-self: end; width: 60.4167vw; min-height: 16.6667vw; background: #F9F4F0; border-radius: 0.5208vw; padding: 1.0417vw 2.0833vw 1.0417vw 1.0417vw; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > p { position: absolute; left: 1.0417vw; top: 1.0417vw; font-size: var(--fs-16); font-weight: 700; color: var(--text-darkest); line-height: 1.42; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(1) { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(1) > p:nth-of-type(1) { font-size: 5.7292vw; font-weight: 500; line-height: 0.75; letter-spacing: -0.1563vw; display: flex; gap: 0.2083vw; align-items: flex-end; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(1) > p:nth-of-type(1) > span:nth-of-type(2) { font-size: var(--fs-26); font-weight: 600; padding-bottom: 0.3646vw; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(1) > p:nth-of-type(2) { margin-top: 1.3021vw; font-size: var(--fs-16); color: var(--text-body); } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(2) { position: relative; flex: 0 0 auto; display: flex; justify-content: flex-end; align-items: center; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(2)::before { content: ''; height: 10.4167vw; border-left: var(--static-10) dashed #C2BEB8; margin-right: 4.1667vw; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(2) > span { position: absolute; left: 1.0417vw; top: 0; font-size: var(--fs-16); font-weight: 700; color: var(--text-darkest); line-height: 1.42; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(2) > p { width: 13.5417vw; align-self: center; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(2) > div { margin-left: 2.0833vw; align-self: end; padding-bottom: 0.5208vw; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(2) > div > ul { width: 14.5833vw; display: grid; grid-template-columns: repeat(2, auto); justify-content: space-between; gap: 0.5208vw 0; padding-bottom: 0.6250vw; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(2) > div > ul > li { font-size: var(--fs-16); color: var(--text-dark); line-height: 1.48; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(2) > div > ul > li:nth-child(2n+1) { font-weight: 500; display: flex; gap: 0.5208vw; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(2) > div > ul > li:nth-child(2n+1)::before { flex: 0 0 auto; content: ''; width: 0.5208vw; height: 0.5208vw; border-radius: 0.5208vw; margin-top: 0.3125vw; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(2) > div > ul > li:nth-child(2n) { justify-self: end; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(3) > div:nth-of-type(2) > div > P { padding-top: 0.7292vw; border-top: var(--static-10) dashed #C2BEB8; text-align: right; font-size: var(--fs-14); font-weight: 500; color: var(--text-body); } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(2) { display: flex; gap: 1.0417vw; justify-content: space-between; align-items: flex-start; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(2) > div {} #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(2) > div > p:nth-of-type(1) {} #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(2) > div > p:nth-of-type(2) { font-size: var(--fs-16); font-weight: 700; color: var(--text-dark); margin-top: 1.0417vw; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(2) > div > p:nth-of-type(3) { font-size: var(--fs-14); font-weight: 500; color: var(--text-body); margin-top: 0.4167vw; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(2) > div:nth-of-type(1) > p:nth-of-type(1) { width: 46.3542vw; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(2) > div:nth-of-type(2) > p:nth-of-type(1) { width: 20.0521vw; } #container.about_03 .contents .section3 .inner-wrap > dl > dd:nth-of-type(2) > div:nth-of-type(3) > p:nth-of-type(1) { width: 25.2604vw; } #container.about_03 .contents .section4 { border-top: var(--static-10) solid #C2BEB8; padding-top: 4.1667vw; padding-bottom: 3.1250vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dt { font-size: var(--fs-82); font-weight: 600; color: var(--text-darkest); } #container.about_03 .contents .section4 .inner-wrap > dl > dd { margin-top: 3.1250vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(1) {} #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(1) > ul { display: flex; gap: 13.0208vw; justify-content: space-between; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(1) {} #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(1) > p { font-size: var(--fs-48); font-weight: 500; line-height: normal; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(1) > div { width: 28.1250vw; margin-top: 1.4583vw; font-size: var(--fs-18); line-height: 1.42; color: var(--text-darkest); } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(1) > a { margin-top: 1.5625vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(1) > ul > li:nth-of-type(2) { flex: 0 0 auto; width: 46.3542vw; border-radius: 0.3125vw; overflow: hidden; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) { display: flex; width: 100%; min-height: 18.7500vw; background: #F9F4F0; border-radius: 0.5208vw; padding: 1.0417vw 2.0833vw 1.0417vw 1.0417vw; position: relative; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > p { position: absolute; left: 1.0417vw; top: 1.0417vw; font-size: var(--fs-16); font-weight: 700; color: var(--text-darkest); } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > ul { flex: 1 1 0; align-self: center; display: flex; flex-direction: column; align-items: center; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > ul > li:nth-of-type(1) { font-size: 5.7292vw; font-weight: 500; line-height: 0.75; letter-spacing: -0.1563vw; display: flex; gap: 0.2083vw; align-items: flex-end; justify-content: center; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > ul > li:nth-of-type(1) > span:nth-of-type(2) { font-size: var(--fs-26); font-weight: 600; padding-bottom: 0.3646vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > ul > li:nth-of-type(2) { margin-top: 1.3021vw; font-size: var(--fs-16); color: var(--text-body); } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div { display: flex; gap: 1.0417vw; justify-content: flex-end; align-items: center; position: relative; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div~div { padding-left: 3.1250vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div::before { content: ''; height: 10.4167vw; border-left: var(--static-10) dashed #C2BEB8; margin-right: 2.0833vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div:nth-of-type(1)::before { margin-right: 3.1250vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div > span { position: absolute; top: 0; left: 1.0417vw; font-size: var(--fs-16); font-weight: 700; color: var(--text-darkest); } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div > p { width: 13.5417vw; align-self: center; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div > div { margin-left: 2.0833vw; align-self: end; padding-bottom: 0.5208vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div > div > ul { width: 14.5833vw; display: grid; grid-template-columns: repeat(2, auto); justify-content: space-between; gap: 0.5208vw 0; padding-bottom: 0.6250vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div > div > ul > li { font-size: var(--fs-16); color: var(--text-dark); line-height: 1.48; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div > div > ul > li.space { letter-spacing: 0.0755vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div > div > ul > li:nth-child(2n+1) { font-weight: 500; display: flex; gap: 0.5208vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div > div > ul > li:nth-child(2n+1)::before { flex: 0 0 auto; content: ''; width: 0.5208vw; height: 0.5208vw; border-radius: 0.5208vw; margin-top: 0.3125vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div > div > ul > li:nth-child(2n) { justify-self: end; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(2) > div > div > P { padding-top: 0.7292vw; border-top: var(--static-10) dashed #C2BEB8; text-align: right; font-size: var(--fs-14); font-weight: 500; color: var(--text-body); } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(3) { display: flex; gap: 1.0417vw; justify-content: space-between; align-items: flex-start; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(3) > div {} #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(3) > div > p:nth-of-type(1) {} #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(3) > div > p:nth-of-type(2) { font-size: var(--fs-16); font-weight: 700; color: var(--text-dark); margin-top: 1.0417vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(3) > div > p:nth-of-type(3) { font-size: var(--fs-14); font-weight: 500; color: var(--text-body); margin-top: 0.4167vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(3) > div:nth-of-type(1) > p:nth-of-type(1) { width: 46.3542vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(3) > div:nth-of-type(2) > p:nth-of-type(1) { width: 20.0521vw; } #container.about_03 .contents .section4 .inner-wrap > dl > dd:nth-of-type(3) > div:nth-of-type(3) > p:nth-of-type(1) { width: 25.2604vw; } #container.about_03 .contents .section5 { border-top: var(--static-10) solid #C2BEB8; padding-bottom: 0; } /*=========================== 리더그룹 - 이사회 및 경영진 about_04-1 ===========================*/ #container.about_04_1 .contents .section1 {} #container.about_04_1 .contents .section1 > ul { display: grid; grid-template-columns: repeat(3, 25.7292vw); gap: 3.1250vw 2.5521vw; justify-content: center; } #container.about_04_1 .contents .section1 > ul > li {} #container.about_04_1 .contents .section1 > ul > li > div.img { position: relative; width: 100%; padding-top: 1.0417vw; border-radius: 0.4167vw; overflow: hidden; background: #F9F4F0; } #container.about_04_1 .contents .section1 > ul > li > div.img::after { content: ''; position: absolute; left: 0; bottom: 0; width: 20.8333vw; height: 8.3333vw; background: var(--text-highlight); z-index: 1; } #container.about_04_1 .contents .section1 > ul > li > div.img > img { position: relative; z-index: 2; width: 100%; height: 26.0417vw; object-fit: contain; object-position: center; } #container.about_04_1 .contents .section1 > ul > li > div.text { margin-top: 1.5625vw; } #container.about_04_1 .contents .section1 > ul > li > div.text .title { display: flex; align-items: center; gap: 1.2500vw; } #container.about_04_1 .contents .section1 > ul > li > div.text .title > strong { font-size: var(--fs-26); line-height: 1.38; flex: 0 0 auto; } #container.about_04_1 .contents .section1 > ul > li > div.text .title > span { font-size: var(--fs-22); font-weight: 500; color: var(--text-body); position: relative; word-break: keep-all; } #container.about_04_1 .contents .section1 > ul > li > div.text .title > span::after { content: ''; position: absolute; left: -0.6250vw; top: 50%; width: var(--static-10); height: 1.8750vw; background: #DEDDCF; margin-top: -0.9375vw; } #container.about_04_1 .contents .section1 > ul > li > div.text .title~div { font-size: var(--fs-16); color: var(--text-body); line-height: 1.48; } #container.about_04_1 .contents .section1 > ul > li > div.text .title~div > p { position: relative; display: flex; gap: 0.5208vw; } #container.about_04_1 .contents .section1 > ul > li > div.text .title~div > p::before { content: ''; position: static; left: 0; top: 0; width: 0.1563vw; height: 0.1563vw; border-radius: 5.2083vw; background: var(--text-body); margin-top: 0.4688vw; flex: 0 0 auto; } #container.about_04_1 .contents .section1 > ul > li > div.text .education { margin-top: 1.0417vw; } #container.about_04_1 .contents .section1 > ul > li > div.text .career { margin-top: 0.7292vw; } /*=========================== 리더그룹 - 업무별 전문인력 about_04-2 ===========================*/ #container.about_04_2 .contents .section1 {} #container.about_04_2 .contents .section1 .aside-wrap {} #container.about_04_2 .contents .section1 .aside-wrap .aside {} #container.about_04_2 .contents .section1 .aside-wrap .aside .inner {} #container.about_04_2 .contents .section1 .aside-wrap .aside .inner > li { cursor: pointer; font-size: var(--fs-18); font-weight:700; line-height: 1.44; color: var(--text-body); padding: 1.0417vw; border-bottom: var(--static-10) solid #C2BEB8; } #container.about_04_2 .contents .section1 .aside-wrap .aside .inner > li:first-of-type { border-top: var(--static-20) solid #4A4948; } #container.about_04_2 .contents .section1 .aside-wrap .aside .inner > li.active { color: #000; text-decoration: underline; text-decoration-thickness: var(--static-20); text-underline-offset: var(--static-20); } #container.about_04_2 .contents .section1 .aside-wrap .article {} #container.about_04_2 .contents .section1 .aside-wrap .article > dl { display: flex; gap: 2.3438vw; padding-bottom: 7.8125vw; } #container.about_04_2 .contents .section1 .aside-wrap .article > dl~dl { padding-top: 3.1250vw; border-top: var(--static-10) solid #4A4948; } #container.about_04_2 .contents .section1 .aside-wrap .article > dl > dt { width: 11.9792vw; flex: 0 0 auto; font-size: var(--fs-36); font-weight: 800; word-break: keep-all; line-height: normal; } #container.about_04_2 .contents .section1 .aside-wrap .article > dl > dd { display: flex; gap: 1.1458vw; } #container.about_04_2 .contents .section1 .aside-wrap .article > dl > dd > div { cursor: pointer; width: 15.2083vw; border-top: var(--static-20) solid #4A4948; border-bottom: var(--static-10) solid #C2BEB8; padding: 1.5625vw 0; } #container.about_04_2 .contents .section1 .aside-wrap .article > dl > dd > div > p:nth-of-type(1) { font-size: var(--fs-26); font-weight: 700; line-height: 1.38; display: flex; gap: 0.5208vw; align-items: center; } #container.about_04_2 .contents .section1 .aside-wrap .article > dl > dd > div > p:nth-of-type(1)::after { content: ''; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 10' fill='none'%3E%3Cpath d='M8.75 10L7.525 8.79167L10.6312 5.83333H0V4.16667H10.6312L7.525 1.20833L8.75 0L14 5L8.75 10Z' fill='%23222222'/%3E%3C/svg%3E"); width: 0.7292vw; height: 0.5208vw; background-size: 100%; } #container.about_04_2 .contents .section1 .aside-wrap .article > dl > dd > div > p:nth-of-type(2) { margin-top: 0.5208vw; font-size: var(--fs-16); line-height: 1.38; color: var(--text-body); } #container.people-pop .pop-layer { position: fixed; left: 0; top: 0; width: 100%; height: 100vh; z-index: 100; display: none; } #container.people-pop .pop-layer .inner { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } #container.people-pop .pop-layer .inner > p.bg { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0,0,0,0.4); cursor: pointer; } #container.people-pop .pop-layer .inner > div.info { width: 62.2917vw; height: 36.4583vw; border-radius: 0.3125vw; overflow: hidden; background: #fff; position: relative; z-index: 2; display: flex; } #container.people-pop .pop-layer .inner > div.info > p.close { position: fixed; left: 1.0417vw; top: 1.0417vw; width: 3.1771vw; height: 3.1771vw; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 61 61' fill='none'%3E%3Cellipse opacity='0.8' cx='30.2812' cy='30.1406' rx='30.1406' ry='30.1406' transform='rotate(-90 30.2812 30.1406)' fill='black'/%3E%3Cpath d='M37 23.25L23.0027 37.2473' stroke='white' stroke-width='2'/%3E%3Cpath d='M23.002 23.2539L36.9993 37.2512' stroke='white' stroke-width='2'/%3E%3C/svg%3E"); background-size: 100%; cursor: pointer; } #container.people-pop .pop-layer .inner > div.info > p.img { width: 31.1458vw; height: 100%; padding-top: 2.0833vw; position: relative; flex: 0 0 auto; } #container.people-pop .pop-layer .inner > div.info > p.img::after { content: ''; position: absolute; left: 0; bottom: 0; width: 28.0208vw; height: 10.4167vw; background: var(--text-highlight); z-index: 1; } #container.people-pop .pop-layer .inner > div.info > p.img > img { width: 100%; height: 100%; object-fit: contain; object-position: center; position: relative; z-index: 2; } #container.people-pop .pop-layer .inner > div.info > div.text { flex: 1 1 0; display: flex; flex-direction: column; align-items: flex-start; padding-left: 2.6042vw; background: var(--text-darkest); padding-top: 5.2083vw; } #container.people-pop .pop-layer .inner > div.info > div.text .area { padding: 0.5729vw 1.0417vw 0.5729vw 6.2500vw; background: var(--text-highlight); font-size: var(--fs-16); font-weight: 800; color: #fff; position: relative; left: -6.2500vw; } #container.people-pop .pop-layer .inner > div.info > div.text .name { font-size: var(--fs-48); font-weight: 500; line-height: normal; color: #fff; margin-top: 3.1250vw; } #container.people-pop .pop-layer .inner > div.info > div.text .position { font-size: var(--fs-18); font-weight: 600; line-height: normal; color: #94918C; margin-top: 1.0417vw; } #container.people-pop .pop-layer .inner > div.info > div.text > div { font-size: var(--fs-18); color: #fff; line-height: 1.42; } #container.people-pop .pop-layer .inner > div.info > div.text > div.education { margin-top: 2.6042vw; } #container.people-pop .pop-layer .inner > div.info > div.text > div.career { margin-top: 1.5625vw; } #container.people-pop .pop-layer .inner > div.info > div.text > div > p { display: flex; gap: 0.5208vw; } #container.people-pop .pop-layer .inner > div.info > div.text > div > p::before { content: ''; width: 0.1563vw; height: 0.1563vw; border-radius: 5.2083vw; background: #fff; margin-top: 0.5208vw; } /*=========================== 리더그룹 - 조직도 about_04-3 ===========================*/ #container.about_04_3 .contents .section {} #container.about_04_3 .contents .section2 { margin-top: 4.1667vw; } #container.about_04_3 .contents .section .inner {} #container.about_04_3 .contents .section .inner .line { background: #C2BEB8; } #container.about_04_3 .contents .section .inner .line.horizontal { height: var(--static-10); } #container.about_04_3 .contents .section .inner .line.vertical { width: var(--static-10); } #container.about_04_3 .contents .section .inner > .title { font-size: var(--fs-36); font-weight: 800; margin-bottom: 2.0833vw; } #container.about_04_3 .contents .section .inner > .article {} #container.about_04_3 .contents .section .inner > .article .title-box { padding: 1.4583vw 1.1979vw; min-width: 11.2500vw; text-align: center; font-size: var(--fs-20); font-weight: 700; border-radius: 0.3125vw; color: var(--text-darkest); border: var(--static-20) solid #4A4948; background: #fff; } #container.about_04_3 .contents .section .inner > .article .title-box.black { background: var(--text-darkest); color: #fff; } #container.about_04_3 .contents .section .inner > .article .box {} #container.about_04_3 .contents .section .inner > .article .box1 { display: flex; align-items: center; } #container.about_04_3 .contents .section .inner > .article .box1~.box1 { margin-top: 3.1250vw; } #container.about_04_3 .contents .section .inner > .article .box1 > p {} #container.about_04_3 .contents .section .inner > .article .box1 > p:nth-of-type(2), #container.about_04_3 .contents .section .inner > .article .box1 > p:nth-of-type(4) { width: 3.1250vw; } #container.about_04_3 .contents .section .inner > .article .box1 > ul { margin-left: 1.0417vw; display: flex; font-size: var(--fs-16); color: #5B3125; font-weight: 700; gap: 2.0833vw; } #container.about_04_3 .contents .section .inner > .article .box1 > ul > li { display: flex; } #container.about_04_3 .contents .section .inner > .article .box1 > ul > li .line { display: none; } #container.about_04_3 .contents .section .inner > .article .box1 > ul > li:nth-of-type(1) { gap: 1.5625vw; } #container.about_04_3 .contents .section .inner > .article .box1 > ul > li > p:nth-of-type(2) > span { font-weight: 500; color: var(--text-body); display: flex; margin-left: 0.5208vw; gap: 0.5208vw; align-items: center; } #container.about_04_3 .contents .section .inner > .article .box1 > ul > li > p:nth-of-type(2) > span::before { content: ''; width: 0.1563vw; height: 0.1563vw; border-radius: 5.2083vw; background: var(--text-body); } #container.about_04_3 .contents .section1 .inner > .article .box1 .title-box:nth-of-type(3) { position: relative; } #container.about_04_3 .contents .section1 .inner > .article .box1 .title-box:nth-of-type(3)::after { content: ''; position: absolute; left: 50%; top: calc(100% + var(--static-20)); width: 21.7708vw; height: 8.3854vw; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 418 161' fill='none'%3E%3Cpath d='M1.5 59.5H417.5V160.5H416.5V60.5H0.5V0H1.5V59.5Z' fill='%23C2BEB8'/%3E%3C/svg%3E"); background-size: 100%; } #container.about_04_3 .contents .section2 .inner > .article .box1 .title-box { position: relative; } #container.about_04_3 .contents .section2 .inner > .article .box1 .title-box::after { content: ''; position: absolute; left: 50%; top: calc(100% + var(--static-20)); width: var(--static-10); height: 3.1250vw; background: #C2BEB8; } #container.about_04_3 .contents .section1 .inner > .article .box2 { padding-top: calc(6.2500vw + var(--static-10)); } #container.about_04_3 .contents .section1 .inner > .article .box2 > ul { display: flex; align-items: center; justify-content: center; } #container.about_04_3 .contents .section1 .inner > .article .box2 > ul > li.line { width: 3.3333vw; } #container.about_04_3 .contents .section1 .inner > .article .box2 > ul > li { width: 40.0000vw; flex: 0 0 auto; display: flex; align-items: center; } #container.about_04_3 .contents .section1 .inner > .article .box2 > ul > li:nth-of-type(1) { justify-content: flex-end; } #container.about_04_3 .contents .section1 .inner > .article .box2 > ul > li .title-box { position: relative; } #container.about_04_3 .contents .section1 .inner > .article .box2 > ul > li .title-box::after { content: ''; position: absolute; left: 50%; top: calc(100% + var(--static-20)); width: var(--static-10); height: 3.1250vw; background: #C2BEB8; } #container.about_04_3 .contents .section1 .inner > .article .box2 > ul > li > p.line { width: 3.1250vw; } #container.about_04_3 .contents .section1 .inner > .article .box2 > ul > li:nth-of-type(1) > p.line { margin-left: 0.4167vw; } #container.about_04_3 .contents .section1 .inner > .article .box2 > ul > li:nth-of-type(3) > p.line { margin-right: 1.0417vw; } #container.about_04_3 .contents .section1 .inner > .article .box2 > ul > li > div { display: flex; font-size: var(--fs-16); color: #5B3125; font-weight: 700; gap: 1.5625vw; } #container.about_04_3 .contents .section .inner > .article .box3 { margin-top: 3.1250vw; } #container.about_04_3 .contents .section .inner > .article .box3 > ul { display: flex; justify-content: space-between; } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li { width: 40.0000vw; flex: 0 0 auto; border-top: var(--static-20) solid #4A4948; } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li > div > p { font-size: var(--fs-20); font-weight: 700; padding: 1.4583vw 0; border-bottom: var(--static-10) solid #000; color: var(--text-darkest); } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li > div > dl { margin-top: 1.5625vw; } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li > div > dl > dt { font-size: var(--fs-16); font-weight: 700; color: var(--text-darkest); } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li > div > dl > dt+dd { margin-top: 0.5208vw; } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li > div > dl > dd > p { font-size: var(--fs-16); font-weight: 500; line-height: 1.48; display: flex; color: var(--text-body); gap: 0.5208vw; align-items: center; } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li > div > dl > dd > p~p { margin-top: 0.5208vw; } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li > div > dl > dd > p::before { content: ''; width: 0.1563vw; height: 0.1563vw; border-radius: 5.2083vw; background: var(--text-body); } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li > div > div { border-top: var(--static-10) dashed #C2BEB8; padding: 1.5625vw 0; margin-top: 1.5625vw; } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li > div > div > p { font-size: var(--fs-16); font-weight: 500; line-height: 1.48; display: flex; color: var(--text-body); gap: 0.5208vw; align-items: center; } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li > div > div > p~p { margin-top: 0.5208vw; } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li > div > div > p::before { content: ''; width: 0.1563vw; height: 0.1563vw; border-radius: 5.2083vw; background: var(--text-body); } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li:nth-of-type(1) { display: flex; gap: 0 3.1250vw; flex-wrap: wrap; } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li:nth-of-type(1) > div { width: 11.2500vw; } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li:nth-of-type(2) {} #container.about_04_3 .contents .section .inner > .article .box3 > ul > li:nth-of-type(2) > div { display: flex; gap: 3.1250vw; } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li:nth-of-type(2) > div~div { margin-top: 1.5625vw; border-top: var(--static-10) dashed #C2BEB8; } #container.about_04_3 .contents .section .inner > .article .box3 > ul > li:nth-of-type(2) > div > dl { width: 11.2500vw; } #container.about_04_3 .contents .section1 .inner > .article .box3 > ul > li:nth-of-type(1) > div:last-of-type { width: 100%; border-top: var(--static-10) dashed #C2BEB8; padding-top: 1.5625vw; font-weight: 700; font-size: var(--fs-16); color: var(--text-dark); } #container.about_04_3 .contents .section2 .inner > .article .box3 > ul > li { width: 100%; border-top: var(--static-20) solid #4A4948; } #container.about_04_3 .contents .section2 .inner > .article .box3 > ul > li > div:not(:has(> p)) > dl~dl { border-top: var(--static-10) dashed #C2BEB8; padding-top: 1.5625vw; } /*=========================== 포트폴리오 portfolio ===========================*/ #container.portfolio .contents { padding-bottom: 0; } #container.portfolio .contents .section1 {} #container.portfolio .contents .section1 .inner { padding-left: 1.5625vw; padding-right: 1.5625vw; border-bottom: var(--static-10) solid #DEDDCF; } #container.portfolio .contents .section1 .inner > .title { font-size: var(--fs-36); font-weight: 800; text-transform: uppercase; } #container.portfolio .contents .section1 .inner > .title+p { font-size: var(--fs-18); color: var(--text-body); margin-top: 1.5625vw; line-height: normal; word-break: keep-all; } #container.portfolio .contents .section1 .inner > ul { margin-top: 2.6042vw; display: flex; gap: 2.9167vw; } #container.portfolio .contents .section1 .inner > ul > li { flex: 1 1 0; min-height: 20.5208vw; display: flex; flex-direction: column; padding-bottom: 1.0417vw; } #container.portfolio .contents .section1 .inner > ul > li~li { position: relative; } #container.portfolio .contents .section1 .inner > ul > li~li::before { content: ''; position: absolute; left: -1.4583vw; top: 0; width: var(--static-10); height: 100%; background: #DEDDCF; } #container.portfolio .contents .section1 .inner > ul > li > p { line-height: normal; } #container.portfolio .contents .section1 .inner > ul > li > p:nth-of-type(1) { width: 3.7500vw; } #container.portfolio .contents .section1 .inner > ul > li > p:nth-of-type(1) > img { width: 100%; } #container.portfolio .contents .section1 .inner > ul > li > p:nth-of-type(2) { margin-top: 1.0417vw; font-size: var(--fs-62); font-weight: 500; } #container.portfolio .contents .section1 .inner > ul > li > p:nth-of-type(3) { flex: 1 1 0; width: 19.5313vw; margin-top: 1.5625vw; font-size: var(--fs-18); font-weight: 500; color: var(--text-darkest); line-height: 1.42; } #container.portfolio .contents .section1 .inner > ul > li > a { margin-top: 1.0417vw; align-self: flex-end; width: 3.1250vw; height: 3.1250vw; border-radius: 5.2083vw; border: var(--static-10) solid #EFEFE9; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M10.175 8H0V6H10.175L5.575 1.4L7 0L14 7L7 14L5.575 12.6L10.175 8Z' fill='%234A4948'/%3E%3C/svg%3E"); background-size: 0.7292vw 0.7292vw; background-position: center; background-repeat: no-repeat; } #container.portfolio .contents .section1 .inner > ul > li > a:hover { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M10.175 8H0V6H10.175L5.575 1.4L7 0L14 7L7 14L5.575 12.6L10.175 8Z' fill='white'/%3E%3C/svg%3E"); background-color: #000; } #container.portfolio .contents .section2 { margin-top: 5.7292vw; padding-bottom: 5.2083vw; background: #000; } /*=========================== 코크랩 reits_01 ===========================*/ #container.reits_01 .contents { padding-bottom: 0 !important; } #container.reits_01 .contents .section1 .inner { display: flex; justify-content: space-between; border-bottom: var(--static-10) solid #4A4948; padding-bottom: 5.7292vw; } #container.reits_01 .contents .section1 .inner > ul { width: 26.3021vw; } #container.reits_01 .contents .section1 .inner > ul > li:nth-of-type(1) { font-size: var(--fs-82); font-weight: 800; line-height: normal; } #container.reits_01 .contents .section1 .inner > ul > li:nth-of-type(2) { font-size: var(--fs-18); line-height: 1.42; color: var(--text-body); } #container.reits_01 .contents .section1 .inner > ul > li:nth-of-type(3) { font-size: var(--fs-18); line-height: 1.42; margin-top: 2.6042vw; color: var(--text-dark); } #container.reits_01 .contents .section1 .inner > dl { flex: 0 0 auto; width: 42.5000vw; border-bottom: var(--static-10) solid #C2BEB8; padding-bottom: 2.0833vw; } #container.reits_01 .contents .section1 .inner > dl > dd {} #container.reits_01 .contents .section1 .inner > dl > dd > ul { display: flex; gap: 1.3021vw; justify-content: center; } #container.reits_01 .contents .section1 .inner > dl > dd > ul > li { flex: 0 0 auto; } #container.reits_01 .contents .section1 .inner > dl > dd > ul > li.dot { width: 0.4167vw; height: 0.4167vw; border-radius: 0.4167vw; background: var(--text-highlight); margin-top: 1.5625vw; } #container.reits_01 .contents .section1 .inner > dl > dd > ul > li > p:nth-of-type(1) { font-weight: 600; font-size: var(--fs-68); letter-spacing: -0.1042vw; color: var(--text-darkest); display: flex; align-items: flex-start; gap: 0.1563vw; justify-content: center; } #container.reits_01 .contents .section1 .inner > dl > dd > ul > li > p:nth-of-type(1) > span { font-size: var(--fs-18); margin-top: 0.5208vw; } #container.reits_01 .contents .section1 .inner > dl > dd > ul > li > p:nth-of-type(2) { font-size: var(--fs-20); font-weight: 500; margin-top: 1.5625vw; color: var(--text-dark); text-align: center; } #container.reits_01 .contents .section1 .inner > dl > dt { font-size: var(--fs-16); line-height: 1.48; color: var(--text-body); margin-top: 3.1250vw; } #container.reits_01 .contents .section2 { padding: 4.1667vw 0 5.7292vw; } #container.reits_01 .contents .section2 .inner {} #container.reits_01 .contents .section2 .inner > dl {} #container.reits_01 .contents .section2 .inner > dl > dt { font-size: var(--fs-36); font-weight: 800; line-height: normal; } #container.reits_01 .contents .section2 .inner > dl > dd { margin-top: 2.6042vw; display: flex; border-bottom: var(--static-10) dashed #C2BEB8; } #container.reits_01 .contents .section2 .inner > dl > dd > div { flex: 1 1 0; display: flex; flex-direction: column; gap: 0.1042vw; padding: 0 1.5625vw 3.6458vw; } #container.reits_01 .contents .section2 .inner > dl > dd > div~div { border-left: var(--static-10) dashed #C2BEB8; } #container.reits_01 .contents .section2 .inner > dl > dd > div > p { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 3.7500vw; height: 3.7500vw; border-radius: 0.8333vw; background: var(--text-darkest); color: #fff; font-size: var(--fs-14); font-weight: 700; line-height: normal; } #container.reits_01 .contents .section2 .inner > dl > dd > div > p > strong { color: var(--text-highlight); font-size: var(--fs-20); line-height: normal; font-weight: 800; } #container.reits_01 .contents .section2 .inner > dl > dd > div > strong { margin-top: 1.5625vw; font-size: var(--fs-26); font-weight: 700; line-height: 1.38; text-align: center; } #container.reits_01 .contents .section2 .inner > dl > dd > div > ul { margin-top: 1.0417vw; } #container.reits_01 .contents .section2 .inner > dl > dd > div > ul > li { font-size: var(--fs-18); line-height: 1.42; color: var(--text-dark); display: flex; gap: 0.7813vw; padding-left: 0.7813vw; } #container.reits_01 .contents .section2 .inner > dl > dd > div > ul > li::before { flex: 0 0 auto; margin-top: 0.5208vw; content: ''; width: 0.1563vw; height: 0.1563vw; border-radius: 0.1563vw; background: var(--text-dark); } #container.reits_01 .contents .section3 { padding: 4.1667vw 0 5.2083vw; background: #000; color: #fff; } #container.reits_01 .contents .section3 .inner > div > ul { display: flex; justify-content: space-between; gap: 0 0.5208vw; } #container.reits_01 .contents .section3 .inner > div > ul > li {} #container.reits_01 .contents .section3 .inner > div > ul > li.arrow { width: 3.1771vw; height: 0.4167vw; padding: 0; align-self: center; margin-bottom: 5.8333vw; border: 0; border-radius: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 61 8' fill='none'%3E%3Cpath d='M0.646442 3.64645C0.451183 3.84171 0.451183 4.15829 0.646442 4.35355L3.82843 7.53553C4.02369 7.7308 4.34027 7.7308 4.53553 7.53553C4.73079 7.34027 4.73079 7.02369 4.53553 6.82843L1.7071 4L4.53553 1.17157C4.73079 0.976311 4.73079 0.659728 4.53553 0.464466C4.34027 0.269204 4.02369 0.269204 3.82843 0.464466L0.646442 3.64645ZM61 4V3.5L0.999996 3.5V4V4.5L61 4.5V4Z' fill='white'/%3E%3C/svg%3E"); background-size: 100%; } #container.reits_01 .contents .section3 .inner > div > ul > li.arrow.reverse { transform: rotate(180deg); } #container.reits_01 .contents .section3 .inner > div > ul > li > div.box { width: 25.0000vw; padding: 2.0833vw 1.5625vw; border: var(--static-10) dashed #4A4948; border-radius: 0.3125vw; } #container.reits_01 .contents .section3 .inner > div > ul > li > div.box > p { font-size: var(--fs-26); font-weight: 700; line-height: 1.38; text-align: center; } #container.reits_01 .contents .section3 .inner > div > ul > li > div.box > ul { margin-top: 1.0417vw; padding-top: 1.5625vw; border-top: var(--static-10) solid #4A4948; } #container.reits_01 .contents .section3 .inner > div > ul > li > div.box > ul > li { font-size: var(--fs-18); font-weight: 500; line-height: 1.42; color: var(--text-body); display: flex; gap: 0.5208vw; } #container.reits_01 .contents .section3 .inner > div > ul > li > div.box > ul > li::before { content: ''; width: 0.1563vw; height: 0.1563vw; border-radius: 0.1563vw; background: var(--text-body); margin-top: 0.5208vw; } #container.reits_01 .contents .section3 .inner > div > ul > li > p { width: 1.9792vw; height: 5.3125vw; margin: 0.5208vw auto 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 38 102' fill='none'%3E%3Cpath d='M3.64644 101.354C3.8417 101.549 4.15829 101.549 4.35355 101.354L7.53553 98.1716C7.73079 97.9763 7.73079 97.6597 7.53553 97.4645C7.34027 97.2692 7.02369 97.2692 6.82842 97.4645L4 100.293L1.17157 97.4645C0.976307 97.2692 0.659724 97.2692 0.464462 97.4645C0.2692 97.6597 0.2692 97.9763 0.464462 98.1716L3.64644 101.354ZM4 1L3.5 1L3.5 101L4 101L4.5 101L4.5 1L4 1Z' fill='white'/%3E%3Cpath d='M33.6464 0.646446C33.8417 0.451187 34.1583 0.451187 34.3535 0.646446L37.5355 3.82843C37.7308 4.02369 37.7308 4.34027 37.5355 4.53554C37.3403 4.7308 37.0237 4.7308 36.8284 4.53554L34 1.70711L31.1716 4.53554C30.9763 4.7308 30.6597 4.7308 30.4645 4.53554C30.2692 4.34027 30.2692 4.02369 30.4645 3.82843L33.6464 0.646446ZM34 101L33.5 101L33.5 1L34 1L34.5 1L34.5 101L34 101Z' fill='white'/%3E%3C/svg%3E"); background-size: 100%; } #container.reits_01 .contents .section3 .inner > div:has(> p) { width: 100%; padding: 2.6042vw 2.0833vw; border: var(--static-10) dashed #D03042; margin-top: 0.5208vw; } #container.reits_01 .contents .section3 .inner > div:has(> p) > p{ font-size: var(--fs-36); font-weight: 800; line-height: normal; text-align: center; } #container.reits_01 .contents .section3 .inner > div:has(> p) > ul { margin-top: 2.0833vw; display: flex; align-items: stretch; justify-content: space-between; } #container.reits_01 .contents .section3 .inner > div:has(> p) > ul > li {} #container.reits_01 .contents .section3 .inner > div:has(> p) > ul > li > div.box { height: 100%; } /*=========================== 상장리츠 reits_02 ===========================*/ #container.reits_02 .contents .section1 .aside-wrap .aside .inner > li { padding: 1.0417vw 0; border-bottom: var(--static-10) solid #C2BEB8; font-size: var(--fs-18); color: var(--text-body); font-weight: 700; line-height: 1.44; cursor: pointer; } #container.reits_02 .contents .section1 .aside-wrap .aside .inner > li:nth-of-type(1) { border-top: var(--static-20) solid #4A4948; } #container.reits_02 .contents .section1 .aside-wrap .aside .inner > li.active { color: #000; text-decoration: underline; text-decoration-thickness: var(--static-20); text-underline-offset: 0.1563vw; } #container.reits_02 .contents .section1 .aside-wrap .article .box {} #container.reits_02 .contents .section1 .aside-wrap .article .box~.box { margin-top: 5.2083vw; padding-top: 5.2083vw; border-top: var(--static-10) solid #4A4948; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul { display: grid; grid-template-columns: 14.3229vw minmax(4.5833vw, auto) 19.3750vw auto; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li {} #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.title { width: 11.9792vw; font-size: var(--fs-36); font-weight: 800; word-break: keep-all; text-transform: uppercase; line-height: normal; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.price { grid-row: auto / span 2; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.price > p { font-size: var(--fs-32); font-weight: 800; line-height: normal; color: var(--text-highlight); } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.price > div { display: flex; margin-top: 0.4167vw; gap: 0.3125vw; padding-left: 0.8333vw; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' fill='none'%3E%3Cpath d='M0 8L4.8 5.72394e-08L9.6 8L0 8Z' fill='%23D03042'/%3E%3C/svg%3E") left center/0.5208vw 0.4167vw no-repeat; font-size: var(--fs-14); font-weight: 700; color: var(--text-body); } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.price > a { margin-top: 2.6042vw; font-size: var(--fs-12); font-weight: 900; line-height: normal; text-transform: uppercase; color: var(--text-darkest); display: inline-block; padding-right: 0.9375vw; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 10' fill='none'%3E%3Cpath d='M8.75 10L7.525 8.79167L10.6312 5.83333H0V4.16667H10.6312L7.525 1.20833L8.75 0L14 5L8.75 10Z' fill='%23222222'/%3E%3C/svg%3E") right center/0.7292vw 0.5208vw no-repeat; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.graph { grid-row: auto / span 2; padding: 0 2.0833vw 2.6042vw 1.6667vw; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.graph > div { width: 15.6250vw; height: 8.0729vw; border: 0.0521vw solid #ccc; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.graph > div > img { width: 100%; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.info { grid-row: auto / span 2; padding-left: 2.0833vw; padding-bottom: 2.6042vw; font-size: var(--fs-18); line-height: 1.42; color: var(--text-body); word-break: keep-all; border-left: var(--static-10) dashed #C2BEB8; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.info > div > strong { font-weight: 600; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.logo { grid-row: auto / span 3; padding-top: 1.5625vw; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.logo > img { width: 100%; } #container.reits_02 .contents .section1 .aside-wrap .article .box1 > ul > li.logo { width: 6.4583vw; } #container.reits_02 .contents .section1 .aside-wrap .article .box2 > ul > li.logo { width: 4.8958vw; } #container.reits_02 .contents .section1 .aside-wrap .article .box3 > ul > li.logo { width: 7.5000vw; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.checkpoint { grid-column: auto / span 3; padding: 2.6042vw 0; border-top: var(--static-10) dashed #C2BEB8; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.checkpoint > dl {} #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.checkpoint > dl > dt { font-size: var(--fs-26); font-weight: 700; line-height: 1.38; text-transform: uppercase; color: var(--text-darkest); } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.checkpoint > dl > dd { margin-top: 2.0833vw; display: flex; gap: 2.0833vw; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.checkpoint > dl > dd > p { width: 10.4167vw; flex: 0 0 auto; border-top: var(--static-10) solid #4A4948; padding-top: 1.5625vw; font-size: var(--fs-16); font-weight: 600; line-height: normal; color: var(--text-darkest); word-break: keep-all; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.slide-wrap { grid-column: auto / span 3; width: 100%; height: 25.0521vw; position: relative; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.slide-wrap .btn { display: flex; justify-content: flex-end; align-item: center; gap: 2.0833vw; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.slide-wrap .btn > p { width: 0.9375vw; position: relative; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.slide-wrap .btn > p:nth-of-type(2)::after { content: ''; position: absolute; left: -1.0417vw; top: 50%; width: var(--static-10); height: 1.3542vw; margin-top: -0.6771vw; background: #DEDDCF; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.slide-wrap .btn > p > img { width: 100%; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.slide-wrap .slide { position: absolute; left: 0; bottom: 0; width: calc(100% + var(--w-60) + 5.2083vw); overflow: hidden; } #container.reits_02 .contents .section1 .aside-wrap .article .box > ul > li.slide-wrap .slide .swiper-slide { width: 20.0521vw; height: 22.1354vw; border-radius: 0.3125vw; overflow: hidden; } /*=========================== 펀드-국내부문 fund_01 ===========================*/ #container.fund_01 .contents { line-height: normal; } #container.fund_01 .contents .section {} #container.fund_01 .contents .section .inner .title { font-size: var(--fs-36); font-weight: 800; padding-bottom: 2.0833vw; border-bottom: var(--static-10) solid #4A4948; } #container.fund_01 .contents .section .inner .title+* { margin-top: 3.1250vw; } #container.fund_01 .contents .section1 {} #container.fund_01 .contents .section1 .inner > ul { display: flex; border-bottom: var(--static-10) dashed #C2BEB8; } #container.fund_01 .contents .section1 .inner > ul > li { flex: 1 1 0; padding-bottom: 3.1250vw; } #container.fund_01 .contents .section1 .inner > ul > li:nth-of-type(2) { padding: 0 1.5625vw; margin: 0 1.5625vw; border-left: var(--static-10) dashed #C2BEB8; border-right: var(--static-10) dashed #C2BEB8; } #container.fund_01 .contents .section1 .inner > ul > li > p { width: 3.7500vw; height: 3.7500vw; border-radius: 0.8333vw; background: #5b3125; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.1042vw; } #container.fund_01 .contents .section1 .inner > ul > li > p > span:nth-of-type(1) { color: #fff; font-size: var(--fs-14); font-weight: 700; text-transform: uppercase; } #container.fund_01 .contents .section1 .inner > ul > li > p > span:nth-of-type(2) { color: #D8BAAD; font-size: var(--fs-20); font-weight: 800; } #container.fund_01 .contents .section1 .inner > ul > li > strong { display: block; text-align: center; margin-top: 1.5625vw; font-size: var(--fs-26); line-height: 1.38; } #container.fund_01 .contents .section1 .inner > ul > li > div { margin-top: 1.0417vw; font-size: var(--fs-18); line-height: 1.42; color: var(--text-dark); } #container.fund_01 .contents .section2 { margin-top: 4.1667vw; } #container.fund_01 .contents .section2 .inner > ul { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.0417vw; } #container.fund_01 .contents .section2 .inner > ul > li {} #container.fund_01 .contents .section2 .inner > ul > li > p { width: 20.0521vw; height: 22.1354vw; border-radius: 0.3125vw; overflow: hidden; } #container.fund_01 .contents .section2 .inner > ul > li > p > img { width: 100%; height: 100%; object-fit: cover; object-position: center; } #container.fund_01 .contents .section2 .inner > ul > li > div { margin-top: 1.0417vw; display: flex; flex-direction: column; align-items: flex-start; } #container.fund_01 .contents .section2 .inner > ul > li > div > p { font-size: var(--fs-14); font-weight: 600; color: var(--text-highlight); padding: 0.4167vw 0.7292vw; border: var(--static-10) solid #C2BEB8; border-radius: 5.2083vw; } #container.fund_01 .contents .section2 .inner > ul > li > div > strong { margin-top: 0.9375vw; font-size: var(--fs-26); font-weight: 700; line-height: 1.38; } #container.fund_01 .contents .section2 .inner > ul > li > div > div { margin-top: 1.0417vw; font-size: var(--fs-16); line-height: 1.48; color: var(--text-dark); } #container.fund_01 .contents .section3 { margin-top: 4.6875vw; } #container.fund_01 .contents .section3 .inner > dl { display: flex; gap: 8.3333vw; } #container.fund_01 .contents .section3 .inner > dl > dt { width: 27.0833vw; flex: 0 0 auto; } #container.fund_01 .contents .section3 .inner > dl > dt > p:nth-of-type(1) { font-size: var(--fs-48); font-weight: 800; } #container.fund_01 .contents .section3 .inner > dl > dt > p:nth-of-type(2) { margin-top: 1.5625vw; font-size: var(--fs-26); line-height: 1.38; color: var(--text-dark); } #container.fund_01 .contents .section3 .inner > dl > dd { flex: 1 1 0; } #container.fund_01 .contents .section3 .inner > dl > dd > div { font-size: var(--fs-18); line-height: 1.42; color: var(--text-dark); } #container.fund_01 .contents .section3 .inner > dl > dd > ul { margin: 2.6042vw 0; padding: 1.0417vw 2.0833vw 1.5625vw 1.5625vw; display: flex; border: var(--static-10) solid #DEDDCF; border-radius: 0.3125vw; background: #F9F4F0; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li { flex: 1 1 0; display: flex; flex-direction: column; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li > p { font-size: var(--fs-16); font-weight: 700; line-height: 1.48; color: var(--text-darkest); margin-bottom: 0.8333vw; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li > div {} #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(1) > div { display: flex; align-items: flex-end; gap: 1.5625vw; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(1) > div > p { width: 11.9792vw; height: 11.9792vw; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(1) > div > p > img { width: 100%; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(1) > div > ul { width: 7.2917vw; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(1) > div > ul > li { font-size: var(--fs-16); line-height: 1.48; color: var(--text-dark); display: flex; justify-content: space-between; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(1) > div > ul > li~li { margin-top: 0.5208vw; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(1) > div > ul > li > p:nth-of-type(1) { position: relative; font-weight: 500; display: flex; gap: 0.5208vw; align-items: center; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(1) > div > ul > li > p:nth-of-type(1)::before { content: ''; width: 0.5208vw; height: 0.5208vw; border-radius: 0.5208vw; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) {} #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > p { flex: 0 0 auto; padding-left: 1.5625vw; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div { flex: 1 1 0; padding-left: 1.5625vw; border-left: var(--static-10) dashed #C2BEB8; display: flex; flex-direction: column; justify-content: space-between; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div { padding-top: 1.2500vw; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div > ul > li { display: flex; gap: 0.7292vw; align-items: center; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div > ul > li > p:nth-of-type(1) { padding: 0.8333vw 0 0.8333vw 1.0417vw; font-size: var(--fs-14); color: #fff; font-weight: 600; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div > ul > li:nth-of-type(1) > p:nth-of-type(1) { width: 17.3438vw; background: #9E7765; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div > ul > li:nth-of-type(2) > p:nth-of-type(1) { width: 14.7917vw; background: #CEB8AC; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div > ul > li > p:nth-of-type(2) { font-size: var(--fs-20); font-weight: 700; color: #9E7765; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div > ul > li:nth-of-type(2) > p:nth-of-type(2) { color: #C6A28E; } #container.fund_01 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div > p { font-size: var(--fs-14); font-weight: 500; color: var(--text-body); text-align: right; } /*=========================== 펀드-해외부문 fund_02 ===========================*/ #container.fund_02 .contents { line-height: normal; } #container.fund_02 .contents .section {} #container.fund_02 .contents .section .inner .title { font-size: var(--fs-36); font-weight: 800; padding-bottom: 2.0833vw; border-bottom: var(--static-10) solid #4A4948; } #container.fund_02 .contents .section .inner .title+* { margin-top: 3.1250vw; } #container.fund_02 .contents .section1 {} #container.fund_02 .contents .section1 .inner > ul { display: flex; border-bottom: var(--static-10) dashed #C2BEB8; } #container.fund_02 .contents .section1 .inner > ul > li { flex: 1 1 0; padding-bottom: 3.1250vw; } #container.fund_02 .contents .section1 .inner > ul > li:nth-of-type(2) { padding: 0 1.5625vw; margin: 0 1.5625vw; border-left: var(--static-10) dashed #C2BEB8; border-right: var(--static-10) dashed #C2BEB8; } #container.fund_02 .contents .section1 .inner > ul > li > p { width: 3.7500vw; height: 3.7500vw; border-radius: 0.8333vw; background: #5b3125; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.1042vw; } #container.fund_02 .contents .section1 .inner > ul > li > p > span:nth-of-type(1) { color: #fff; font-size: var(--fs-14); font-weight: 700; text-transform: uppercase; } #container.fund_02 .contents .section1 .inner > ul > li > p > span:nth-of-type(2) { color: #D8BAAD; font-size: var(--fs-20); font-weight: 800; } #container.fund_02 .contents .section1 .inner > ul > li > strong { display: block; text-align: center; margin-top: 1.5625vw; font-size: var(--fs-26); line-height: 1.38; } #container.fund_02 .contents .section1 .inner > ul > li > div { margin-top: 1.0417vw; font-size: var(--fs-18); line-height: 1.42; color: var(--text-dark); } #container.fund_02 .contents .section2 { margin-top: 4.1667vw; } #container.fund_02 .contents .section2 .inner > ul { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.0417vw; } #container.fund_02 .contents .section2 .inner > ul > li {} #container.fund_02 .contents .section2 .inner > ul > li > p { width: 20.0521vw; height: 22.1354vw; border-radius: 0.3125vw; overflow: hidden; } #container.fund_02 .contents .section2 .inner > ul > li > p > img { width: 100%; height: 100%; object-fit: cover; object-position: center; } #container.fund_02 .contents .section2 .inner > ul > li > div { margin-top: 1.0417vw; display: flex; flex-direction: column; align-items: flex-start; } #container.fund_02 .contents .section2 .inner > ul > li > div > p { font-size: var(--fs-14); font-weight: 600; color: var(--text-highlight); padding: 0.4167vw 0.7292vw; border: var(--static-10) solid #C2BEB8; border-radius: 5.2083vw; } #container.fund_02 .contents .section2 .inner > ul > li > div > strong { margin-top: 0.9375vw; font-size: var(--fs-26); font-weight: 700; line-height: 1.38; } #container.fund_02 .contents .section2 .inner > ul > li > div > div { margin-top: 1.0417vw; font-size: var(--fs-16); line-height: 1.48; color: var(--text-dark); } /*=========================== 부동산신탁-정비사업 trust_01 ===========================*/ #container.trust_01 .contents { line-height: normal; } #container.trust_01 .contents .section {} #container.trust_01 .contents .section .inner .title { font-size: var(--fs-36); font-weight: 800; padding-bottom: 2.0833vw; border-bottom: var(--static-10) solid #4A4948; } #container.trust_01 .contents .section .inner .title+* { margin-top: 3.1250vw; } #container.trust_01 .contents .section .inner .title+dl { display: flex; gap: 8.3333vw; } #container.trust_01 .contents .section .inner .title+dl > dt { width: 27.0833vw; flex: 0 0 auto; } #container.trust_01 .contents .section .inner .title+dl > dt > p:nth-of-type(1) { font-size: var(--fs-48); font-weight: 800; line-height: normal; } #container.trust_01 .contents .section .inner .title+dl > dt > p:nth-of-type(2) { width: 21.8750vw; margin-top: 1.5625vw; font-size: var(--fs-26); line-height: 1.38; color: var(--text-dark); } #container.trust_01 .contents .section .inner .title+dl > dd { flex: 1 1 0; font-size: var(--fs-18); line-height: 1.42; color: var(--text-dark); } #container.trust_01 .contents .section1 .inner > dl > dd {} #container.trust_01 .contents .section1 .inner > dl > dd > p { width: 100%; height: 29.7396vw; border-radius: 0.3125vw; overflow: hidden; margin: 2.6042vw 0; } #container.trust_01 .contents .section1 .inner > dl > dd > p > img { width: 100%; } #container.trust_01 .contents .section1 .inner > dl > dd > div:nth-of-type(2) {} #container.trust_01 .contents .section1 .inner > dl > dd > div:nth-of-type(2) > p:nth-of-type(1) { font-size: var(--fs-26); font-weight: 700; color: #000; } #container.trust_01 .contents .section1 .inner > dl > dd > div:nth-of-type(2) > p:nth-of-type(2) { margin-top: 1.0417vw; font-size: var(--fs-18); color: var(--text-dark); line-height: 1.42; } #container.trust_01 .contents .section1 .inner > dl > dd > div:nth-of-type(2) > ul { border-bottom: var(--static-10) solid #C2BEB8; margin-top: 2.0833vw; } #container.trust_01 .contents .section1 .inner > dl > dd > div:nth-of-type(2) > ul > li { display: flex; gap: 4.1667vw; padding: 1.2500vw 3.2292vw; text-align: center; border-top: var(--static-10) solid #4A4948; } #container.trust_01 .contents .section1 .inner > dl > dd > div:nth-of-type(2) > ul > li > p { flex: 1 1 0; } #container.trust_01 .contents .section1 .inner > dl > dd > div:nth-of-type(2) > ul > li:nth-of-type(1) { font-size: var(--fs-18); font-weight: 700; } #container.trust_01 .contents .section1 .inner > dl > dd > div:nth-of-type(2) > ul > li:nth-of-type(2) { font-size: var(--fs-16); line-height: 1.48; } #container.trust_01 .contents .section2 { margin-top: 5.2083vw; background: #1C1B1B; padding: 4.1667vw 0; color: #fff; } #container.trust_01 .contents .section2 .inner-wrap {} #container.trust_01 .contents .section2 .inner-wrap > ul { display: grid; grid-template-columns: 1fr 60.4167vw; gap: 0 8.0729vw; grid-template-rows: max-content max-content 1fr; } #container.trust_01 .contents .section2 .inner-wrap > ul > li:nth-of-type(1) { font-size: var(--fs-20); font-weight: 700; } #container.trust_01 .contents .section2 .inner-wrap > ul > li:nth-of-type(2) { margin-top: 1.5625vw; font-size: var(--fs-62); font-weight: 600; } #container.trust_01 .contents .section2 .inner-wrap > ul > li:nth-of-type(3) { align-self: end; font-size: var(--fs-16); line-height: 1.48; color: var(--text-lighter); } #container.trust_01 .contents .section2 .inner-wrap > ul > li:nth-of-type(4) { grid-column: 2/3; grid-row: 1/span 4; } #container.trust_01 .contents .section2 .inner-wrap > ul > li:nth-of-type(4) > img { width: 100%; } #container.trust_01 .contents .section2 .inner-wrap > dl { margin-top: 3.1250vw; padding-top: 3.1250vw; border-top: var(--static-10) solid #817E7A; display: flex; gap: 8.0729vw; } #container.trust_01 .contents .section2 .inner-wrap > dl > dt { flex: 0 0 auto; width: 25.2604vw; } #container.trust_01 .contents .section2 .inner-wrap > dl > dt > p:nth-of-type(1) { font-size: var(--fs-26); font-weight: 700; line-height: 1.42; } #container.trust_01 .contents .section2 .inner-wrap > dl > dt > p:nth-of-type(2) { margin-top: 1.0417vw; font-size: var(--fs-18); line-height: 1.42; } #container.trust_01 .contents .section2 .inner-wrap > dl > dd { flex: 1 1 0; } #container.trust_01 .contents .section2 .inner-wrap > dl > dd > ul { display: flex; gap: 1.0417vw; } #container.trust_01 .contents .section2 .inner-wrap > dl > dd > ul > li { display: flex; align-items: center; gap: 0.8333vw; width: 14.3229vw; padding-bottom: 1.5625vw; border-bottom: var(--static-10) dashed #817E7A; } #container.trust_01 .contents .section2 .inner-wrap > dl > dd > ul > li > p:nth-of-type(1) { font-size: var(--fs-18); font-weight: 700; padding: 0.8333vw 1.0417vw; background: #fff; border-radius: 5.2083vw; color: #000; } #container.trust_01 .contents .section2 .inner-wrap > dl > dd > ul > li > p:nth-of-type(2) { font-size: var(--fs-18); font-weight: 500; line-height: 1.42; } #container.trust_01 .contents .section2 .inner-wrap > dl > dd > div { position: relative; margin-top: 1.0417vw; display: flex; justify-content: center; gap: 17.8125vw; } #container.trust_01 .contents .section2 .inner-wrap > dl > dd > div::before { content: ''; position: absolute; left: calc(50% - 23.2292vw); top: calc(50% + 0.5208vw); width: 46.4583vw; height: var(--static-10); background: #C2BEB8; z-index: 1; } #container.trust_01 .contents .section2 .inner-wrap > dl > dd > div > p:nth-of-type(1), #container.trust_01 .contents .section2 .inner-wrap > dl > dd > div > p:nth-of-type(3) { width: 0.4167vw; height: 6.3021vw; background-size: 100%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='121' viewBox='0 0 8 121' fill='none'%3E%3Cpath d='M4.35355 0.646439C4.15829 0.451179 3.8417 0.45118 3.64644 0.646439L0.464461 3.82842C0.269199 4.02368 0.269199 4.34026 0.464461 4.53553C0.659723 4.73079 0.976306 4.73079 1.17157 4.53553L3.99999 1.7071L6.82842 4.53553C7.02368 4.73079 7.34027 4.73079 7.53553 4.53553C7.73079 4.34026 7.73079 4.02368 7.53553 3.82842L4.35355 0.646439ZM4 121L4.5 121L4.49999 0.999992L3.99999 0.999992L3.49999 0.999992L3.5 121L4 121Z' fill='%23C2BEB8'/%3E%3C/svg%3E"); } #container.trust_01 .contents .section2 .inner-wrap > dl > dd > div > p:nth-of-type(2) { margin-top: 1.0417vw; width: 10.4167vw; height: 10.4167vw; border-radius: 10.4167vw; font-size: var(--fs-36); font-weight: 800; border: var(--static-10) solid #fff; display: flex; align-items: center; justify-content: center; background: #1C1B1B; z-index: 2; } #container.trust_01 .contents .section3 { margin-top: 4.1667vw; } #container.trust_01 .contents .section3 .inner > ul { display: flex; border-bottom: var(--static-10) dashed #C2BEB8; } #container.trust_01 .contents .section3 .inner > ul > li { flex: 1 1 0; min-height: 20.0000vw; } #container.trust_01 .contents .section3 .inner > ul > li:nth-of-type(2) { padding: 0 1.5625vw; margin: 0 1.5625vw; border-left: var(--static-10) dashed #C2BEB8; border-right: var(--static-10) dashed #C2BEB8; } #container.trust_01 .contents .section3 .inner > ul > li > p { width: 3.7500vw; height: 3.7500vw; border-radius: 0.8333vw; background: #4A4948; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.1042vw; } #container.trust_01 .contents .section3 .inner > ul > li > p > span:nth-of-type(1) { color: #fff; font-size: var(--fs-14); font-weight: 700; text-transform: uppercase; } #container.trust_01 .contents .section3 .inner > ul > li > p > span:nth-of-type(2) { color: #CA945F; font-size: var(--fs-20); font-weight: 800; } #container.trust_01 .contents .section3 .inner > ul > li > strong { display: block; text-align: center; margin-top: 1.5625vw; font-size: var(--fs-26); line-height: 1.38; } #container.trust_01 .contents .section3 .inner > ul > li > div { margin-top: 1.0417vw; font-size: var(--fs-18); line-height: 1.42; color: var(--text-dark); } #container.trust_01 .contents .section4 { margin-top: 4.1667vw; } #container.trust_01 .contents .section4 .inner > ul { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3.1250vw 1.0417vw; } #container.trust_01 .contents .section4 .inner > ul > li {} #container.trust_01 .contents .section4 .inner > ul > li > p { width: 20.0521vw; height: 22.1354vw; border-radius: 0.3125vw; overflow: hidden; } #container.trust_01 .contents .section4 .inner > ul > li > p > img { width: 100%; height: 100%; object-fit: cover; object-position: center; } #container.trust_01 .contents .section4 .inner > ul > li > div { margin-top: 1.0417vw; display: flex; flex-direction: column; align-items: flex-start; } #container.trust_01 .contents .section4 .inner > ul > li > div > p { font-size: var(--fs-14); font-weight: 600; color: var(--text-highlight); padding: 0.4167vw 0.7292vw; border: var(--static-10) solid #C2BEB8; border-radius: 5.2083vw; } #container.trust_01 .contents .section4 .inner > ul > li > div > strong { margin-top: 0.5208vw; font-size: var(--fs-26); font-weight: 700; line-height: 1.38; } #container.trust_01 .contents .section4 .inner > ul > li > div > div { margin-top: 1.0417vw; font-size: var(--fs-16); line-height: 1.48; color: var(--text-dark); } #container.trust_01 .contents .section5 { margin-top: 4.6875vw; } #container.trust_01 .contents .section6 { margin-top: 4.6875vw; overflow: hidden; } #container.trust_01 .contents .section6 .inner > dl > dd { width: 47.9167vw; } #container.trust_01 .contents .section6 .inner > dl > dd > strong { display: block; font-size: var(--fs-20); line-height: normal; margin-bottom: 1.5625vw; } #container.trust_01 .contents .section6 .inner > dl > dd > div+strong { margin-top: 2.6042vw; } #container.trust_01 .contents .section6 .inner > dl > dd > .slide-wrap { margin-top: 2.6042vw; width: 100%; position: relative; } #container.trust_01 .contents .section6 .inner > dl > dd > .slide-wrap .btn { display: flex; justify-content: flex-end; align-item: center; gap: 2.0833vw; } #container.trust_01 .contents .section6 .inner > dl > dd > .slide-wrap .btn > p { width: 0.9375vw; position: relative; } #container.trust_01 .contents .section6 .inner > dl > dd > .slide-wrap .btn > p:nth-of-type(2)::after { content: ''; position: absolute; left: -1.0417vw; top: 50%; width: var(--static-10); height: 1.3542vw; margin-top: -0.6771vw; background: #DEDDCF; } #container.trust_01 .contents .section6 .inner > dl > dd > .slide-wrap .btn > p > img { width: 100%; } #container.trust_01 .contents .section6 .inner > dl > dd > .slide-wrap .slide { overflow: hidden; width: calc(100% + 8.3333vw); margin-top: 1.5625vw; } #container.trust_01 .contents .section6 .inner > dl > dd > .slide-wrap .slide .swiper-slide { width: 20.0521vw; } #container.trust_01 .contents .section6 .inner > dl > dd > .slide-wrap .slide .swiper-slide > p { width: 100%; height: 22.1354vw; border-radius: 0.3125vw; overflow: hidden; } #container.trust_01 .contents .section6 .inner > dl > dd > .slide-wrap .slide .swiper-slide > div { margin-top: 1.0417vw; display: flex; flex-direction: column; align-items: flex-start; } #container.trust_01 .contents .section6 .inner > dl > dd > .slide-wrap .slide .swiper-slide > div > p { font-size: var(--fs-14); font-weight: 600; color: var(--text-highlight); padding: 0.4167vw 0.7292vw; border: var(--static-10) solid #C2BEB8; border-radius: 5.2083vw; } #container.trust_01 .contents .section6 .inner > dl > dd > .slide-wrap .slide .swiper-slide > div > strong { margin-top: 0.5208vw; font-size: var(--fs-26); font-weight: 700; line-height: 1.38; color: #000; } #container.trust_01 .contents .section6 .inner > dl > dd > .slide-wrap .slide .swiper-slide > div > div { margin-top: 1.0417vw; font-size: var(--fs-16); line-height: 1.48; color: var(--text-dark); } /*=========================== 부동산신탁-신탁서비스 trust_02 ===========================*/ #container.trust_02 .contents { line-height: normal; } #container.trust_02 .contents .section { overflow: hidden; } #container.trust_02 .contents .section~.section { margin-top: 4.1667vw; } #container.trust_02 .contents .section .inner .title { font-size: var(--fs-36); font-weight: 800; padding-bottom: 2.0833vw; border-bottom: var(--static-10) solid #4A4948; } #container.trust_02 .contents .section .inner .title+* { margin-top: 3.1250vw; font-size: var(--fs-18); line-height: 1.42; color: var(--text-dark); } #container.trust_02 .contents .section .inner .title+dl { display: flex; gap: 8.3333vw; } #container.trust_02 .contents .section .inner .title+dl > dt { width: 27.0833vw; flex: 0 0 auto; } #container.trust_02 .contents .section .inner .title+dl > dt > p:nth-of-type(1) { font-size: var(--fs-48); font-weight: 800; line-height: normal; } #container.trust_02 .contents .section .inner .title+dl > dt > p:nth-of-type(2) { width: 21.8750vw; margin-top: 1.5625vw; font-size: var(--fs-26); line-height: 1.38; color: var(--text-dark); } #container.trust_02 .contents .section .inner .title+dl > dd { flex: 1 1 0; font-size: var(--fs-18); line-height: 1.42; color: var(--text-dark); } #container.trust_02 .contents .section .inner > dl > dd { width: 47.9167vw; } #container.trust_02 .contents .section .inner > dl > dd > strong { display: block; font-size: var(--fs-20); line-height: normal; margin-bottom: 1.5625vw; } #container.trust_02 .contents .section .inner > dl > dd > div+strong { margin-top: 2.6042vw; } #container.trust_02 .contents .section .inner > dl > dd .btn-custom { margin-top: 1.5625vw; } #container.trust_02 .contents .section .inner > dl > dd > .slide-wrap { margin-top: 2.6042vw; width: 100%; position: relative; } #container.trust_02 .contents .section .inner > dl > dd > .slide-wrap .btn { display: flex; justify-content: flex-end; align-item: center; gap: 2.0833vw; } #container.trust_02 .contents .section .inner > dl > dd > .slide-wrap .btn > p { width: 0.9375vw; position: relative; } #container.trust_02 .contents .section .inner > dl > dd > .slide-wrap .btn > p:nth-of-type(2)::after { content: ''; position: absolute; left: -1.0417vw; top: 50%; width: var(--static-10); height: 1.3542vw; margin-top: -0.6771vw; background: #DEDDCF; } #container.trust_02 .contents .section .inner > dl > dd > .slide-wrap .btn > p > img { width: 100%; } #container.trust_02 .contents .section .inner > dl > dd > .slide-wrap .slide { overflow: hidden; width: calc(100% + 8.3333vw); margin-top: 1.5625vw; } #container.trust_02 .contents .section .inner > dl > dd > .slide-wrap .slide .swiper-slide { width: 20.0521vw; } #container.trust_02 .contents .section .inner > dl > dd > .slide-wrap .slide .swiper-slide > p { width: 100%; height: 22.1354vw; border-radius: 0.3125vw; overflow: hidden; } #container.trust_02 .contents .section .inner > dl > dd > .slide-wrap .slide .swiper-slide > div { margin-top: 1.0417vw; display: flex; flex-direction: column; align-items: flex-start; } #container.trust_02 .contents .section .inner > dl > dd > .slide-wrap .slide .swiper-slide > div > p { font-size: var(--fs-14); font-weight: 600; color: var(--text-highlight); padding: 0.4167vw 0.7292vw; border: var(--static-10) solid #C2BEB8; border-radius: 5.2083vw; } #container.trust_02 .contents .section .inner > dl > dd > .slide-wrap .slide .swiper-slide > div > strong { margin-top: 0.5208vw; font-size: var(--fs-26); font-weight: 700; line-height: 1.38; color: #000; } #container.trust_02 .contents .section .inner > dl > dd > .slide-wrap .slide .swiper-slide > div > div { margin-top: 1.0417vw; font-size: var(--fs-16); line-height: 1.48; color: var(--text-dark); } #container.trust_02 .contents .section .inner > dl > dd > ul { display: grid; grid-template-columns: repeat(2, 17.9688vw); margin-top: 2.6042vw; gap: 2.6042vw 3.1250vw; } #container.trust_02 .contents .section .inner > dl > dd > ul > li {} #container.trust_02 .contents .section .inner > dl > dd > ul > li > strong { font-size: var(--fs-20); color: #000; } #container.trust_02 .contents .section .inner > dl > dd > ul > li > p { margin-top: 1.0417vw; font-size: var(--fs-16); line-height: 1.48; color: var(--text-dark); } #container.trust_02 .contents .section2 { margin-top: 4.6875vw; } /*=========================== 아카이브 - 공통 ===========================*/ [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .aside .inner {} [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .aside .inner .active { color: #000; text-decoration: underline; text-decoration-thickness: var(--static-10); text-underline-offset: 0.1042vw } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .aside .inner [data-move-target] { cursor: pointer; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .aside .inner > li {} [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .aside .inner > li~li { border-top: var(--static-10) solid #C2BEB8; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .aside .inner > li:nth-of-type(1) { border-top: var(--static-20) solid #4A4948; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .aside .inner > li > p { padding: 1.0417vw 0; font-size: var(--fs-18); font-weight: 700; line-height: 1.44; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .aside .inner > li > ul { border-top: var(--static-10) dashed #C2BEB8; padding: 1.0417vw; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .aside .inner > li > ul > li { font-size: var(--fs-16); font-weight: 700; color: var(--text-body); line-height: 1.48; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .aside .inner > li > ul > li~li { margin-top: 0.5208vw; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .aside .inner > li > ul > li > div { margin-top: 0.8333vw; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .aside .inner > li > ul > li > div > p { font-size: var(--fs-14); font-weight: 600; line-height: normal; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .aside .inner > li > ul > li > div > p~p { margin-top: 0.4688vw; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box { display: flex; gap: 2.3438vw; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box~.box { margin-top: 5.7292vw; padding-top: 4.1667vw; border-top: var(--static-10) solid #4A4948; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box .body { font-size: var(--fs-18); line-height: 1.42; word-break: keep-all; color: var(--text-body); } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box > .title { width: 11.9792vw; word-break: keep-all; flex: 0 0 auto; font-size: var(--fs-36); font-weight: 800; line-height: normal; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box > .inner { flex: 1 1 0; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box > .inner > dl {} [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box > .inner > dl~dl { margin-top: 2.6042vw; padding-top: 2.6042vw; border-top: var(--static-10) solid #C2BEB8; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box > .inner > dl > dt { font-size: var(--fs-26); font-weight: 700; line-height: 1.38; color: var(--text-darkest); margin-bottom: 2.6042vw; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box > .inner > dl > dd > dl { font-size: var(--fs-18); line-height: 1.42; word-break: keep-all; color: var(--text-body); } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box > .inner > dl > dd > dl > dt { font-size: var(--fs-18); font-weight: 700; color: var(--text-darkest); display: block; line-height: normal; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box > .inner > dl > dd > dl > dd+ dt { margin-top: 1.5625vw; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box > .inner > dl > dd > dl > dd { margin-top: 1.0417vw; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box > .inner > dl > dd > h4 { font-size: var(--fs-20); font-weight: 700; line-height: normal; color: var(--text-darkest); margin-bottom: 1.5625vw; } [data-name-depth2="아카이브"] .contents .section1 .aside-wrap .article .box > .inner > dl > dd > .body+dl { margin-top: 1.5625vw; } [data-name-depth2="아카이브"] ul.list-dot {} [data-name-depth2="아카이브"] ul.list-dot > li { padding-left: 1.5625vw; position: relative; } [data-name-depth2="아카이브"] ul.list-dot > li::before { content: ''; position: absolute; left: 0.7813vw; top: 0.5208vw; width: 0.2083vw; height: 0.2083vw; background: var(--text-body); border-radius: 0.2083vw; } [data-name-depth2="아카이브"] ul.list-num { counter-reset: number 0; } [data-name-depth2="아카이브"] ul.list-num > li { display: flex; gap: 0.3125vw; position: relative; } [data-name-depth2="아카이브"] ul.list-num > li::before { counter-increment: number 1; content: counter(number)'.'; } /*=========================== 아카이브 - 리츠 archive_01 ===========================*/ #container.archive_01 .contents .section1 .aside-wrap .article .box2 > .inner > dl > dd > *+h4 { margin-top: 2.6042vw; padding-top: 2.6042vw; border-top: var(--static-10) dashed #C2BEB8; } #container.archive_01 .contents .section1 .aside-wrap .article .box2 > .inner > dl > dd > ul.list-dot { margin-top: 1.5625vw; } #container.archive_01 .contents .section1 .aside-wrap .article .box2 > .inner > dl > dd > ul.type1 { margin-top: 2.0833vw; display: flex; justify-content: space-between; } #container.archive_01 .contents .section1 .aside-wrap .article .box2 > .inner > dl > dd > ul.type1 > li { padding-top: 1.5625vw; border-top: var(--static-10) solid #4A4948; font-size: var(--fs-16); font-weight: 600; line-height: normal; color: var(--text-darkest); width: 10.4167vw; word-break: keep-all; } #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl~dl { border-top-style: dashed; } #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl > dd > .table-wrap table { width: 100%; border-top: var(--static-20) solid #4A4948; border-collapse: collapse; border-spacing: 0; } #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl > dd > .table-wrap table td { color: #000; font-size: var(--fs-16); padding: 1.2500vw 0; text-align: center; word-break: keep-all; line-height: 1.48; } #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl > dd > .table-wrap table td > strong { color: var(--text-dark); } #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl > dd > .table-wrap table thead { border-bottom: var(--static-10) solid #4A4948; color: var(--text-dark); font-weight: 700; } #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl > dd > .table-wrap table tbody > tr { border-bottom: var(--static-10) solid #C2BEB8; } #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl > dd > .table-wrap .table1 td:nth-of-type(1) { width: 9.3750vw; padding-right: 1.3021vw; } #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl > dd > .table-wrap .table1 td:nth-of-type(2) { width: 10.4167vw; padding-left: 1.3021vw; padding-right: 1.3021vw; } #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl > dd > .table-wrap .table1 td:nth-of-type(3) { width: 10.4167vw; padding-left: 1.3021vw; padding-right: 1.3021vw; } #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl > dd > .table-wrap .table1 td:nth-of-type(4) { padding-left: 1.5625vw; padding-right: 0; } #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl > dd > .table-wrap .table2 {} #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl > dd > .table-wrap .table2 td:nth-of-type(1) { width: 8.3333vw; } #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl > dd > .table-wrap .table2 td:nth-of-type(2) { width: 15.7813vw; padding-left: 2.6042vw; padding-right: 2.6042vw; } #container.archive_01 .contents .section1 .aside-wrap .article .box3 > .inner > dl > dd > .table-wrap .table2 td:nth-of-type(3) { width: 13.1771vw; padding-right: 2.6042vw; } #container.archive_01 .contents .section1 .aside-wrap .article .box4 .graph { margin-top: 2.6042vw; } #container.archive_01 .contents .section1 .aside-wrap .article .box4 .graph > img { width: 100%; } /*=========================== 아카이브 - 펀드 archive_02 ===========================*/ #container.archive_02 .contents .section1 .aside-wrap .article .box1 > .inner > dl > dd > h4 { margin-bottom: 2.6042vw; } #container.archive_02 .contents .section1 .aside-wrap .article .box1 > .inner > dl > dd > dl {} #container.archive_02 .contents .section1 .aside-wrap .article .box1 > .inner > dl > dd > dl > dd > p { font-weight: 700; color: var(--text-dark); } #container.archive_02 .contents .section1 .aside-wrap .article .box1 > .inner > dl > dd > dl > dd > ul+p { margin-top: 1.0417vw; } #container.archive_02 .contents .section1 .aside-wrap .article .box1 > .inner > dl > dd > dl > dd > p+ul.list-dot { margin-top: 0.5208vw; } /*=========================== ESG하이라이트 esg_01 ===========================*/ #container.esg_01 .contents { line-height: normal; } #container.esg_01 .contents .section1 { padding-bottom: 5.2083vw; } #container.esg_01 .contents .section1 > p { font-size: var(--fs-36); font-weight: 800; line-height: normal; padding-bottom: 2.0833vw; border-bottom: var(--static-10) solid #4A4948; } #container.esg_01 .contents .section1 > ul { display: grid; grid-template-columns: 26.4063vw 26.4063vw 26.3542vw; gap: 0 2.0833vw; } #container.esg_01 .contents .section1 > ul > li { padding: 2.0833vw; border-bottom: var(--static-10) solid #C2BEB8; display: flex; flex-direction: column; align-items: center; gap: 0.5208vw; } #container.esg_01 .contents .section1 > ul > li > p:nth-of-type(1) { width: 3.1250vw; } #container.esg_01 .contents .section1 > ul > li > p:nth-of-type(1) > img { width: 100%; } #container.esg_01 .contents .section1 > ul > li > p:nth-of-type(2) { font-size: var(--fs-18); line-height: 1.42; color: var(--text-darkest); margin-top: 0.8333vw; } #container.esg_01 .contents .section1 > ul > li > p:nth-of-type(3) { font-size: var(--fs-82); letter-spacing: -0.1250vw; color: #176446; font-weight: 600; } #container.esg_01 .contents .section1 > ul > li > p:nth-of-type(4) { font-size: var(--fs-16); color: var(--text-body); line-height: 1.48; text-align: center; } #container.esg_01 .contents .section2 { padding-top: 4.1667vw; padding-bottom: 3.1250vw; background: #163238; color: #fff; } #container.esg_01 .contents .section2 .inner:nth-of-type(1) { display: grid; grid-template-columns: repeat(2, auto); justify-content: space-between; } #container.esg_01 .contents .section2 .inner:nth-of-type(1) > div { width: 25.2604vw; } #container.esg_01 .contents .section2 .inner:nth-of-type(1) > div > p{ font-size: var(--fs-20); font-weight: 700; } #container.esg_01 .contents .section2 .inner:nth-of-type(1) > div > div { font-size: var(--fs-62); font-weight: 600; margin-top: 1.5625vw; } #container.esg_01 .contents .section2 .inner:nth-of-type(1) > p:nth-of-type(1) { grid-column: 2/3; grid-row: 1/span 2; width: 60.4167vw; border-radius: 0.3125vw; overflow: hidden; } #container.esg_01 .contents .section2 .inner:nth-of-type(1) > p:nth-of-type(1) > img { width: 100%; } #container.esg_01 .contents .section2 .inner:nth-of-type(1) > p:nth-of-type(2) { font-size: var(--fs-16); line-height: 1.48; width: 25.2604vw; align-self: end; color: var(--text-lighter); } #container.esg_01 .contents .section2 .inner:nth-of-type(2) { border-top: var(--static-10) solid #817E7A; border-bottom: var(--static-10) dashed #817E7A; margin-top: 3.1250vw; padding: 1.5625vw 0 2.0833vw; } #container.esg_01 .contents .section2 .inner:nth-of-type(2) > ul { display: flex; gap: 4.6875vw; } #container.esg_01 .contents .section2 .inner:nth-of-type(2) > ul > li { flex: 1 1 0; } #container.esg_01 .contents .section2 .inner:nth-of-type(2) > ul > li > p { font-size: var(--fs-18); font-weight: 700; color: #000; width: 2.8125vw; height: 2.8125vw; border-radius: 2.8125vw; background: #fff; display: flex; align-items: center; justify-content: center; } #container.esg_01 .contents .section2 .inner:nth-of-type(2) > ul > li > div { margin-top: 1.0417vw; font-size: var(--fs-18); font-weight: 500; line-height: 1.42; } #container.esg_01 .contents .section2 .inner:nth-of-type(3) { padding-top: 4.1667vw; display: grid; grid-template-columns: 30.2083vw auto; gap: 0 3.1250vw; } #container.esg_01 .contents .section2 .inner:nth-of-type(3) > p:nth-of-type(1) { grid-row: 1/span 2; width: 30.2083vw; margin-bottom: calc(12.6042vw - 3.1250vw); border-radius: 0.3125vw; overflow: hidden; } #container.esg_01 .contents .section2 .inner:nth-of-type(3) > p:nth-of-type(1) > img { width: 100%; } #container.esg_01 .contents .section2 .inner:nth-of-type(3) > p:nth-of-type(2) { font-size: var(--fs-48); font-weight: 500; } #container.esg_01 .contents .section2 .inner:nth-of-type(3) > div { font-size: var(--fs-18); line-height: 1.42; align-self: end; justify-self: end; } #container.esg_01 .contents .section2 .inner:nth-of-type(3) > div > div { width: 27.0833vw; } #container.esg_01 .contents .section2 .inner:nth-of-type(3) > div > p { width: 32.2917vw; border-radius: 0.3125vw; overflow: hidden; margin-top: 2.0833vw; } #container.esg_01 .contents .section2 .inner:nth-of-type(3) > div > p > img { width: 100%; } #container.esg_01 .contents .section3 { padding-top: 4.1667vw; padding-bottom: 3.1250vw; border-bottom: var(--static-10) solid #C2BEB8; } #container.esg_01 .contents .section3 .inner { display: grid; grid-template-columns: calc(100% - 29.1667vw) 27.0833vw; gap: 0 2.0833vw; justify-content: space-between; padding-bottom: 4.1667vw; border-bottom: var(--static-10) dashed #C2BEB8; } #container.esg_01 .contents .section3 .inner > div:nth-of-type(1) { width: 34.1146vw; } #container.esg_01 .contents .section3 .inner > div:nth-of-type(1) > p { font-size: var(--fs-20); font-weight: 700; } #container.esg_01 .contents .section3 .inner > div:nth-of-type(1) > div { font-size: var(--fs-62); font-weight: 600; margin-top: 1.5625vw; } #container.esg_01 .contents .section3 .inner > p { grid-column: 2/3; grid-row: 1/span 2; width: 27.0833vw; border-radius: 0.3125vw; overflow: hidden; } #container.esg_01 .contents .section3 .inner > p > img { width: 100%; height: 100%; object-fit: cover; object-position: top left; } #container.esg_01 .contents .section3 .inner > div:nth-of-type(2) { width: 26.0417vw; justify-self: end; align-self: end; font-size: var(--fs-18); line-height: 1.42; color: var(--text-dark); } #container.esg_01 .contents .section3 > dl { padding-top: 1.5625vw; } #container.esg_01 .contents .section3 > dl > dt { font-size: var(--fs-26); line-height: 1.38; text-transform: uppercase; } #container.esg_01 .contents .section3 > dl > dd { margin-top: 1.5625vw; } #container.esg_01 .contents .section3 > dl > dd > ul { display: flex; justify-content: space-between; } #container.esg_01 .contents .section3 > dl > dd > ul > li { width: 20.0521vw; } #container.esg_01 .contents .section3 > dl > dd > ul > li > p { width: 20.0521vw; height: 22.1354vw; } #container.esg_01 .contents .section3 > dl > dd > ul > li > p > img { width: 100%; height: 100%; object-fit: cover; object-position: center; } #container.esg_01 .contents .section3 > dl > dd > ul > li > strong { display: block; font-size: var(--fs-20); margin-top: 1.0417vw; font-weight: 700; line-height: 1.8; } #container.esg_01 .contents .section3 > dl > dd > ul > li > div { margin-top: 1.0417vw; } #container.esg_01 .contents .section3 > dl > dd > ul > li > div > p { font-size: var(--fs-16); line-height: 1.48; color: var(--text-dark); display: flex; gap: 0.5208vw; } #container.esg_01 .contents .section3 > dl > dd > ul > li > div > p::before { content: ''; width: 0.1563vw; height: 0.1563vw; border-radius: 0.1563vw; background: var(--text-dark); margin-top: 0.5208vw; } #container.esg_01 .contents .section4 { padding-top: 4.1667vw; } #container.esg_01 .contents .section4 > dl {} #container.esg_01 .contents .section4 > dl > dt { font-size: var(--fs-36); font-weight: 800; padding-bottom: 2.0833vw; border-bottom: var(--static-10) solid #4A4948; } #container.esg_01 .contents .section4 > dl > dd { margin-top: 2.0833vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(1) > dd > ul { display: flex; padding-bottom: 2.6042vw; border-bottom: var(--static-10) dashed #C2BEB8; } #container.esg_01 .contents .section4 > dl:nth-of-type(1) > dd > ul > li { display: flex; flex-direction: column; align-items: center; flex: 1 1 0; } #container.esg_01 .contents .section4 > dl:nth-of-type(1) > dd > ul > li > p:nth-of-type(1) { width: 3.1250vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(1) > dd > ul > li > p:nth-of-type(1) > img { width: 100%; } #container.esg_01 .contents .section4 > dl:nth-of-type(1) > dd > ul > li > strong { font-size: var(--fs-18); color: var(--text-dark); margin-top: 0.8333vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(1) > dd > ul > li > p:nth-of-type(2) { font-size: var(--fs-62); color: #176446; margin-top: 0.5208vw; font-weight: 600; letter-spacing: -0.1042vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(1) > dd > ul > li > a { margin-top: 1.5625vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(1) > dd > ul~* { font-size: var(--fs-18); line-height: 1.50; } #container.esg_01 .contents .section4 > dl:nth-of-type(1) > dd > strong { margin-top: 2.0833vw; display: block; } #container.esg_01 .contents .section4 > dl:nth-of-type(1) > dd > div { margin-top: 1.0417vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(1) > dd > div > p { display: flex; gap: 0.5208vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(1) > dd > div > p::before { content: ''; width: 0.1563vw; height: 0.1563vw; background: #000; border-radius: 0.1563vw; margin-top: 0.5729vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(2) { margin-top: 4.1667vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 3.1250vw 1.0417vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li {} #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li:nth-of-type(1), #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li:nth-of-type(2) { position: relative; padding-bottom: 3.1250vw; border-bottom: var(--static-10) solid #C2BEB8; } #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li:nth-of-type(2)::before { content: ''; position: absolute; left: -50%; bottom: -0.0521vw; width: 100%; height: var(--static-10); background: #C2BEB8; } #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li >.img { position: relative; width: 100%; height: 23.1771vw; border-radius: 0.3125vw; overflow: hidden; } #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li >.img > img { width: 100%; height: 100%; object-fit: cover; object-position: center; } #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li >.img > a { position: absolute; right: 1.5625vw; bottom: 1.5625vw; width: 3.1250vw; height: 3.1250vw; border-radius: 5.2083vw; background-color: var(--text-darkest); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M8.73685 9.32383V0.0546872L11.2632 0.0546873V9.32383L14.5474 5.96498L16.3158 7.80588L10 14.2652L3.68422 7.80588L5.45264 5.96497L8.73685 9.32383Z' fill='white'/%3E%3Cpath d='M0.526306 17.4219H19.4737V19.9482H0.526306V17.4219Z' fill='white'/%3E%3C/svg%3E"); background-size: 1.0417vw 1.0417vw; background-repeat: no-repeat; background-position: center; } #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li >.text { width: 39.0625vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li >.text .tag { display: flex; margin-top: 1.0417vw; gap: 0.2083vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li >.text .tag > p { font-size: var(--fs-14); color: var(--text-dark); font-weight: 600; padding: 0.4167vw 0.7292vw; border: var(--static-10) solid #C2BEB8; border-radius: 5.2083vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li >.text .title { font-size: var(--fs-26); font-weight: 700; margin-top: 0.5208vw; line-height: 1.38; } #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li >.text .content { margin-top: 1.0417vw; } #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li >.text .content > p:nth-of-type(1) { font-size: var(--fs-16); line-height: 1.48; color: var(--text-dark); } #container.esg_01 .contents .section4 > dl:nth-of-type(2) > dd > ul > li >.text .content > p:nth-of-type(2) { font-size: var(--fs-14); color: var(--text-body); font-weight: 500; margin-top: 0.8333vw; } /*=========================== ENVIRONMENTAL esg_02 ===========================*/ #container.esg_02 .contents { line-height: normal; } #container.esg_02 .contents .section1 { padding-bottom: 5.2083vw; } #container.esg_02 .contents .section1 .inner > p:nth-of-type(1) { font-size: var(--fs-18); font-weight: 700; line-height: 1.42; } #container.esg_02 .contents .section1 .inner > div { display: flex; justify-content: center; align-items: center; margin: 2.0833vw 0; padding: 2.0833vw 0; border-top: var(--static-10) solid #C2BEB8; border-bottom: var(--static-10) solid #C2BEB8; } #container.esg_02 .contents .section1 .inner > div > ul { display: flex; border: var(--static-10) solid #4A4948; border-radius: 26.0417vw; padding: 1.5625vw; gap: 0.5208vw; } #container.esg_02 .contents .section1 .inner > div > ul > li { width: 10.4167vw; height: 10.4167vw; border-radius: 10.4167vw; border: var(--static-10) dashed #4A4948; font-size: var(--fs-16); font-weight: 600; color: var(--text-darkest); display: flex; justify-content: center; align-items: center; text-align: center; } #container.esg_02 .contents .section1 .inner > div > div { width: 10.4167vw; font-size: var(--fs-14); font-weight: 600; color: #176446; text-align: center; display: flex; flex-direction: column; gap: 0.7292vw; justify-content: center; } #container.esg_02 .contents .section1 .inner > div > div > p:nth-of-type(2) { position: relative; width: 10.4688vw; height: 0.4167vw; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='201' height='8' viewBox='0 0 201 8' fill='none'%3E%3Cpath d='M200.354 4.35355C200.549 4.15829 200.549 3.84171 200.354 3.64645L197.172 0.464466C196.976 0.269204 196.66 0.269204 196.464 0.464466C196.269 0.659728 196.269 0.976311 196.464 1.17157L199.293 4L196.464 6.82843C196.269 7.02369 196.269 7.34027 196.464 7.53553C196.66 7.7308 196.976 7.7308 197.172 7.53553L200.354 4.35355ZM200 4V3.5L0 3.5V4V4.5L200 4.5V4Z' fill='%234A4948'/%3E%3C/svg%3E"); background-size: 100%; } #container.esg_02 .contents .section1 .inner > div > div > p:nth-of-type(2)::before { content: ''; position: absolute; left: -0.3125vw; top: 50%; margin-top: -0.3125vw; width: 0.6250vw; height: 0.6250vw; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Ccircle cx='6' cy='6' r='5.5' fill='white' stroke='%234A4948'/%3E%3C/svg%3E"); background-size: 100%; } #container.esg_02 .contents .section1 .inner > div > p { margin-left: 1.0417vw; width: 10.4167vw; height: 10.4167vw; border-radius: 10.4167vw; background: var(--text-esg); display: flex; justify-content: center; align-items: center; text-align: center; color: #fff; font-size: var(--fs-20); font-weight: 700; } #container.esg_02 .contents .section1 .inner > p:nth-of-type(2) { font-size: var(--fs-18); line-height: 1.50; color: var(--text-dark); } #container.esg_02 .contents .section2 { background: #163238; padding: 4.1667vw 0; } #container.esg_02 .contents .section2 .inner-wrap { color: #fff; display: grid; grid-template-columns: 25.2604vw 60.4167vw; justify-content: space-between; } #container.esg_02 .contents .section2 .inner-wrap > p:nth-of-type(1) { font-size: var(--fs-62); font-weight: 600; } #container.esg_02 .contents .section2 .inner-wrap > p:nth-of-type(2) { grid-column: 2/3; grid-row: 1/span 2; border-radius: 0.3125vw; overflow: hidden; } #container.esg_02 .contents .section2 .inner-wrap > p:nth-of-type(2) > img {} #container.esg_02 .contents .section2 .inner-wrap > div { font-size: var(--fs-16); line-height: 1.48; align-self: end; padding-top: 3.1250vw; } #container.esg_02 .contents .section3 { padding: 4.1667vw 0; border-bottom: var(--static-10) solid #C2BEB8; } #container.esg_02 .contents .section3 .inner {} #container.esg_02 .contents .section3 .inner > dl {} #container.esg_02 .contents .section3 .inner > dl > dt { font-size: var(--fs-36); font-weight: 800; padding-bottom: 2.0833vw; border-bottom: var(--static-10) solid #4A4948; display: flex; justify-content: space-between; align-items: flex-end; } #container.esg_02 .contents .section3 .inner > dl > dt > span { font-size: var(--fs-14); font-weight: 500; color: var(--text-body); } #container.esg_02 .contents .section3 .inner > dl > dd { display: grid; grid-template-columns: repeat(3, 20.8333vw); justify-content: space-between; border-bottom: var(--static-10) solid #C2BEB8; } #container.esg_02 .contents .section3 .inner > dl > dd > ul { padding: 2.0833vw 0; } #container.esg_02 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(1) { display: flex; flex-direction: column; align-items: center; color: var(--text-dark); } #container.esg_02 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(1) > p:nth-of-type(1) { width: 3.1250vw; } #container.esg_02 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(1) > p:nth-of-type(1) > img { width: 100%; } #container.esg_02 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(1) > p:nth-of-type(2) { margin-top: 0.8333vw; font-size: var(--fs-18); line-height: 1.42; } #container.esg_02 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(1) > p:nth-of-type(3) { margin-top: 1.0417vw; font-size: var(--fs-68); letter-spacing: -0.1042vw; font-weight: 600; line-height: 1; } #container.esg_02 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) { margin-top: 1.5625vw; padding-top: 1.5625vw; border-top: var(--static-10) dashed #C2BEB8; display: flex; } #container.esg_02 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div { flex: 1 1 0; color: var(--text-esg); display: flex; flex-direction: column; align-items: center; text-align: center; } #container.esg_02 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div > p:nth-of-type(1) { font-size: var(--fs-18); font-weight: 700; line-height: 1.42; display: flex; flex-direction: column; align-items: center; gap: 0.5208vw; } #container.esg_02 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div > p:nth-of-type(1)::before { content: ''; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 20' fill='none'%3E%3Cpath d='M5.09069 14.9421L5.09069 -3.40961e-07L7.63614 -2.27307e-07L7.63614 14.9421L10.9452 11.5041L12.7271 13.3884L6.36342 20L-0.000220299 13.3884L1.7816 11.5041L5.09069 14.9421Z' fill='%23176446'/%3E%3C/svg%3E"); width: 0.6771vw; height: 1.0417vw; background-size: 100%; } #container.esg_02 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div > p:nth-of-type(2) { margin-top: 0.4167vw; font-size: var(--fs-48); font-weight: 600; } #container.esg_02 .contents .section3 .inner > dl > dd > ul > li:nth-of-type(2) > div > p:nth-of-type(3) { margin-top: 0.8333vw; padding: 0.4167vw 0.7292vw; border-radius: 5.2083vw; border: var(--static-10) solid #C2BEB8; font-size: var(--fs-16); font-weight: 700; color: #000; } #container.esg_02 .contents .section3 .inner .table { margin-top: 2.6042vw; } #container.esg_02 .contents .section3 .inner .table > strong { display: block; font-size: var(--fs-20); color: var(--text-darkest); } #container.esg_02 .contents .section3 .inner table { margin-top: 1.5625vw; width: 100%; border-top: var(--static-20) solid #4A4948; border-collapse: collapse; border-spacing: 0; } #container.esg_02 .contents .section3 .inner table td { color: #000; font-size: var(--fs-16); padding: 1.2500vw 0; text-align: center; word-break: keep-all; line-height: 1.48; } #container.esg_02 .contents .section3 .inner table td > strong { color: var(--text-dark); } #container.esg_02 .contents .section3 .inner table thead { border-bottom: var(--static-10) solid #4A4948; } #container.esg_02 .contents .section3 .inner table thead td { color: var(--text-dark); font-size: var(--fs-16); font-weight: 700; } #container.esg_02 .contents .section3 .inner table tbody > tr { border-bottom: var(--static-10) solid #C2BEB8; } #container.esg_02 .contents .section3 .inner table tbody > tr > td { width: 7.8125vw; } #container.esg_02 .contents .section3 .inner .table > p { margin-top: 1.5625vw; font-size: var(--fs-14); font-weight: 500; color: var(--text-body); } #container.esg_02 .contents .section4 { padding: 4.1667vw 0 2.0833vw; } #container.esg_02 .contents .section4 .inner { display: grid; grid-template-columns: 26.3021vw 46.3542vw; grid-template-rows: max-content 1fr; justify-content: space-between; align-content: start; gap: 3.1250vw; } #container.esg_02 .contents .section4 .inner > p:nth-of-type(1) { font-size: var(--fs-48); font-weight: 800; } #container.esg_02 .contents .section4 .inner > p:nth-of-type(2) { grid-column: 2/3; grid-row: 1/span 2; height: 27.1354vw; border-radius: 0.3125vw; overflow: hidden; } #container.esg_02 .contents .section4 .inner > div { font-size: var(--fs-18); line-height: 1.42; color: var(--text-dark); } #container.esg_02 .contents .section4 .inner > div > strong { color: #000; } #container.esg_02 .contents .section5 {} #container.esg_02 .contents .section5 .inner {} #container.esg_02 .contents .section5 .inner > p { font-size: var(--fs-26); font-weight: 800; line-height: 1.38; padding-bottom: 1.5625vw; border-bottom: var(--static-10) solid #4A4948; } #container.esg_02 .contents .section5 .inner > ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 2.0833vw; border-bottom: var(--static-10) solid #C2BEB8; } #container.esg_02 .contents .section5 .inner > ul > li { padding: 2.0833vw 0; } #container.esg_02 .contents .section5 .inner > ul > li:nth-child(-n+3) { border-bottom: var(--static-10) dashed #C2BEB8; } #container.esg_02 .contents .section5 .inner > ul > li > p:nth-of-type(1) { height: 5.2083vw; } #container.esg_02 .contents .section5 .inner > ul > li > p:nth-of-type(1) > img { height: 100%; } #container.esg_02 .contents .section5 .inner > ul > li > p:nth-of-type(2) { margin-top: 1.5625vw; font-size: var(--fs-20); font-weight: 700; color: var(--text-esg); } #container.esg_02 .contents .section5 .inner > ul > li > ul { margin-top: 1.0417vw; } #container.esg_02 .contents .section5 .inner > ul > li > ul > li { font-size: var(--fs-16); line-height: 1.48; color: var(--text-dark); display: flex; gap: 0.5208vw; } #container.esg_02 .contents .section5 .inner > ul > li > ul > li::before { content: ''; width: 0.1563vw; height: 0.1563vw; border-radius: 0.1563vw; background: var(--text-dark); margin-top: 0.4688vw; } #container.esg_02 .contents .section6 { border-bottom: var(--static-10) solid #C2BEB8; } #container.esg_02 .contents .section6 .inner { position: relative; padding-top: 2.6042vw; padding-bottom: 2.0833vw; display: flex; justify-content: center; } #container.esg_02 .contents .section6 .inner > div:has(p) { position: absolute; left: 0; top: 2.6042vw; } #container.esg_02 .contents .section6 .inner > div:has(p) > p:nth-of-type(1) { font-size: var(--fs-26); font-weight: 800; line-height: 1.38; } #container.esg_02 .contents .section6 .inner > div:has(p) > p:nth-of-type(2) { margin-top: 0.5208vw; font-size: var(--fs-16); line-height: 1.48; color: var(--text-body); } #container.esg_02 .contents .section6 .inner > div:has(img) { width: 76.4063vw; } #container.esg_02 .contents .section6 .inner > div:has(img) > img { width: 100%; } #container.esg_02 .contents .section7 { padding: 3.1250vw 0 0; } #container.esg_02 .contents .section7 .inner {} #container.esg_02 .contents .section7 .inner > p { font-size: var(--fs-36); font-weight: 800; padding-bottom: 2.0833vw; border-bottom: var(--static-10) solid #4A4948; } #container.esg_02 .contents .section7 .inner > ul { display: flex; justify-content: center; padding: 3.1250vw 0; align-items: center; gap: 8.5417vw; border-bottom: var(--static-10) solid #C2BEB8; } #container.esg_02 .contents .section7 .inner > ul > li:nth-of-type(1) {} #container.esg_02 .contents .section7 .inner > ul > li:nth-of-type(1) > p:nth-of-type(1) { font-size: var(--fs-82); font-weight: 800; color: var(--text-esg); line-height: 0.75; } #container.esg_02 .contents .section7 .inner > ul > li:nth-of-type(1) > p:nth-of-type(1) > span { font-size: var(--fs-26); font-weight: 600; } #container.esg_02 .contents .section7 .inner > ul > li:nth-of-type(1) > p:nth-of-type(2) { margin-top: 0.8333vw; font-size: var(--fs-18); line-height: 1.42; color: var(--text-body); text-align: center; } #container.esg_02 .contents .section7 .inner > ul > li:nth-of-type(2) { position: relative; display: flex; gap: 4.1667vw; } #container.esg_02 .contents .section7 .inner > ul > li:nth-of-type(2)::before { content: ''; position: absolute; left: -5.4167vw; top: 50%; width: var(--static-10); height: 6.4063vw; border-left: var(--static-10) dashed #C2BEB8; margin-top: -3.2292vw; } #container.esg_02 .contents .section7 .inner > ul > li:nth-of-type(2) > div { display: flex; flex-direction: column; align-items: center; width: 2.2396vw; gap: 1.5625vw; } #container.esg_02 .contents .section7 .inner > ul > li:nth-of-type(2) > div > p:nth-of-type(1) { font-size: var(--fs-68); font-weight: 600; letter-spacing: -0.1042vw; color: var(--text-darkest); line-height: 0.75; } #container.esg_02 .contents .section7 .inner > ul > li:nth-of-type(2) > div > p:nth-of-type(2) { width: max-content; font-size: var(--fs-20); font-weight: 500; color: var(--text-dark); } #container.esg_02 .contents .section7 .inner > ul > li:nth-of-type(2) > p { width: 0.4167vw; height: 0.4167vw; border-radius: 0.4167vw; background: var(--text-highlight); margin-top: 1.0417vw; } #container.esg_02 .contents .section7 .inner > dl { display: flex; gap: 1.0417vw; margin-top: 2.6042vw; } #container.esg_02 .contents .section7 .inner > dl > dt { width: 20.0521vw; } #container.esg_02 .contents .section7 .inner > dl~dl > dt { border-top: var(--static-10) solid #C2BEB8; padding-top: 1.5625vw; } #container.esg_02 .contents .section7 .inner > dl > dt > div { display: inline-flex; flex-direction: column; align-items: center; } #container.esg_02 .contents .section7 .inner > dl > dt > div > p:nth-of-type(1) > img { width: 100%; } #container.esg_02 .contents .section7 .inner > dl > dt > div > p:nth-of-type(2) { font-size: var(--fs-14); font-weight: 500; color: var(--text-body); margin-top: 0.6250vw; } #container.esg_02 .contents .section7 .inner > dl:nth-of-type(1) > dt > div > p:nth-of-type(1) { width: 4.6875vw; } #container.esg_02 .contents .section7 .inner > dl:nth-of-type(2) > dt > div > p:nth-of-type(1) { width: 4.7396vw; } #container.esg_02 .contents .section7 .inner > dl:nth-of-type(3) > dt > div > p:nth-of-type(1) { width: 6.3021vw; } #container.esg_02 .contents .section7 .inner > dl > dd { display: grid; grid-template-columns: repeat(3, 20.0521vw); gap: 2.6042vw 1.0417vw; } #container.esg_02 .contents .section7 .inner > dl > dd > div {} #container.esg_02 .contents .section7 .inner > dl > dd > div > p:nth-of-type(1) { width: 20.0521vw; height: 11.7188vw; border-radius: 0.3125vw; overflow: hidden; } #container.esg_02 .contents .section7 .inner > dl > dd > div > p:nth-of-type(1) > img { width: 100%; height: 100%; object-fit: cover; object-position: center; } #container.esg_02 .contents .section7 .inner > dl > dd > div > p:nth-of-type(2) { margin-top: 1.0417vw; font-size: var(--fs-20); font-weight: 500; color: var(--text-dark); } /*=========================== SOCIAL esg_03 ===========================*/ #container.esg_03 .contents { line-height: normal; } #container.esg_03 .contents .section1 { padding: 4.1667vw 0 3.1250vw; } #container.esg_03 .contents .section1 .inner { display: grid; grid-template-columns: max-content 1fr; grid-template-rows: max-content 1fr; gap: 3.1250vw; } #container.esg_03 .contents .section1 .inner > p { width: 27.0833vw; font-size: var(--fs-48); font-weight: 800; } #container.esg_03 .contents .section1 .inner > div:nth-of-type(1) { grid-column: 2/3; grid-row: 1/span 2; justify-self: end; padding-right: 10.4167vw; } #container.esg_03 .contents .section1 .inner > div:nth-of-type(1) > div { width: 27.0833vw; height: 27.0833vw; display: flex; justify-content: center; align-items: center; position: relative; background: url('../img/esg_03-sec1-1.svg'); background-size: 100%; } #container.esg_03 .contents .section1 .inner > div:nth-of-type(1) > div > p { width: 10.4167vw; height: 10.4167vw; border-radius: 10.4167vw; background: var(--text-esg); display: flex; justify-content: center; align-items: center; color: #fff; text-align: center; font-size: var(--fs-20); font-weight: 700; } #container.esg_03 .contents .section1 .inner > div:nth-of-type(1) > div > ul { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: grid; grid-template-columns: repeat(2, 7.2917vw); justify-content: space-between; align-content: space-between; padding: 0.5208vw; } #container.esg_03 .contents .section1 .inner > div:nth-of-type(1) > div > ul > li { width: 7.2917vw; height: 7.2917vw; border-radius: 7.2917vw; border: var(--static-10) solid #4A4948; display: flex; justify-content: center; align-items: center; font-size: var(--fs-16); text-align: center; font-weight: 600; color: var(--text-darkest); background: #fff; } #container.esg_03 .contents .section1 .inner > div:nth-of-type(2) { width: 27.0833vw; font-size: var(--fs-18); line-height: 1.42; color: var(--fs-dark); } #container.esg_03 .contents .section2 {} #container.esg_03 .contents .section2 .inner {} #container.esg_03 .contents .section2 .inner > dl {} #container.esg_03 .contents .section2 .inner > dl > dt { display: flex; justify-content: space-between; align-items: flex-end; font-size: var(--fs-26); font-weight: 800; padding-bottom: 1.5625vw; border-bottom: var(--static-10) solid #4A4948; } #container.esg_03 .contents .section2 .inner > dl > dt > span { font-size: var(--fs-14); font-weight: 500; color: var(--text-body); } #container.esg_03 .contents .section2 .inner > dl > dd { padding: 2.0833vw 0 0; font-size: var(--fs-18); line-height: 1.42; color: var(--text-dark); } #container.esg_03 .contents .section2 .inner > dl > dd~dd { border-top: var(--static-10) solid #C2BEB8; } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) { padding: 2.0833vw 0; } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > p:nth-of-type(1) { font-size: var(--fs-18); font-weight: 500; line-height: 1.42; color: var(--text-body); } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > p:nth-of-type(2) { margin-top: 1.0417vw; font-size: var(--fs-82); font-weight: 800; color: var(--text-esg); line-height: 0.75; } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > p:nth-of-type(2) > span { font-size: var(--fs-26); font-weight: 600; } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > div > ul { margin-top: 2.0833vw; display: flex; gap: 12.7083vw; justify-content: center; } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > div > ul > li { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; width: 2.6042vw; } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > div > ul > li > p:nth-of-type(1) { width: 2.6042vw; border-radius: 0.1563vw; } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > div > ul > li:nth-of-type(1) > p:nth-of-type(1) { height: 6.2500vw; background: linear-gradient(180deg, #53AF87 -66.85%, #FFF 100%); } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > div > ul > li:nth-of-type(2) > p:nth-of-type(1) { height: 13.0208vw; background: linear-gradient(180deg, #53AF87 -20.24%, #FFF 100%); } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > div > ul > li:nth-of-type(3) > p:nth-of-type(1) { height: 17.1875vw; background: linear-gradient(180deg, #53AF87 6.31%, #FFF 100%); } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > div > ul > li:nth-of-type(4) > p:nth-of-type(1) { height: 10.9375vw; background: linear-gradient(180deg, #53AF87 -50.76%, #FFF 100%); } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > div > ul > li:nth-of-type(5) > p:nth-of-type(1) { height: 8.8542vw; background: linear-gradient(180deg, #53AF87 -77.84%, #FFF 100%); } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > div > ul > li:nth-of-type(5) { padding-bottom: 1.7536vw; } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > div > ul > li > p:nth-of-type(2) { width: max-content; margin-top: 1.5625vw; font-size: var(--fs-20); font-weight: 700; color: var(--text-darkest); } #container.esg_03 .contents .section2 .inner > dl > dd:has(ul) > div > ul > li > p:nth-of-type(3) { width: max-content; margin-top: 0.5208vw; font-size: var(--fs-16); font-weight: 500; color: var(--text-body); line-height: 1.48; } /*=========================== SOCIAL esg_04 ===========================*/ #container.esg_04 .contents { line-height: normal; } #container.esg_04 .contents .section1 { padding-bottom: 5.2083vw; } #container.esg_04 .contents .section1 .inner > p:nth-of-type(1) { font-size: var(--fs-18); font-weight: 700; line-height: 1.42; } #container.esg_04 .contents .section1 .inner > div { display: flex; justify-content: center; align-items: center; margin: 2.0833vw 0; padding: 2.0833vw 0; border-top: var(--static-10) solid #C2BEB8; border-bottom: var(--static-10) solid #C2BEB8; } #container.esg_04 .contents .section1 .inner > div > ul { display: flex; border: var(--static-10) solid #4A4948; border-radius: 26.0417vw; padding: 1.5625vw; gap: 0.5208vw; } #container.esg_04 .contents .section1 .inner > div > ul > li { width: 10.4167vw; height: 10.4167vw; border-radius: 10.4167vw; border: var(--static-10) dashed #4A4948; font-size: var(--fs-16); font-weight: 600; color: var(--text-darkest); display: flex; justify-content: center; align-items: center; text-align: center; } #container.esg_04 .contents .section1 .inner > div > div { width: 4.1667vw; } #container.esg_04 .contents .section1 .inner > div > div > p { position: relative; width: 4.1667vw; height: 0.4167vw; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='81' height='8' viewBox='0 0 81 8' fill='none'%3E%3Cpath d='M80.3536 4.35355C80.5488 4.15829 80.5488 3.84171 80.3536 3.64645L77.1716 0.464466C76.9763 0.269204 76.6597 0.269204 76.4645 0.464466C76.2692 0.659728 76.2692 0.976311 76.4645 1.17157L79.2929 4L76.4645 6.82843C76.2692 7.02369 76.2692 7.34027 76.4645 7.53553C76.6597 7.7308 76.9763 7.7308 77.1716 7.53553L80.3536 4.35355ZM80 4V3.5L0 3.5V4V4.5L80 4.5V4Z' fill='%234A4948'/%3E%3C/svg%3E"); background-size: 100%; } #container.esg_04 .contents .section1 .inner > div > div > p::before { content: ''; position: absolute; left: -0.3125vw; top: 50%; margin-top: -0.3125vw; width: 0.6250vw; height: 0.6250vw; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Ccircle cx='6' cy='6' r='5.5' fill='white' stroke='%234A4948'/%3E%3C/svg%3E"); background-size: 100%; } #container.esg_04 .contents .section1 .inner > div > p { margin-left: 1.0417vw; width: 13.5417vw; height: 13.5417vw; border-radius: 13.5417vw; background: var(--text-esg); display: flex; justify-content: center; align-items: center; text-align: center; color: #fff; font-size: var(--fs-20); font-weight: 700; } #container.esg_04 .contents .section1 .inner > p:nth-of-type(2) { font-size: var(--fs-18); line-height: 1.50; color: var(--text-dark); } #container.esg_04 .contents .section2 { padding: 4.1667vw 0; background: #163238; color: #fff; } #container.esg_04 .contents .section2 .inner {} #container.esg_04 .contents .section2 .inner > p { font-size: var(--fs-36); font-weight: 800; } #container.esg_04 .contents .section2 .inner > ul { margin-top: 2.0833vw; display: grid; grid-template-columns: repeat(2, 1fr); gap: 2.0833vw; } #container.esg_04 .contents .section2 .inner > ul > li { padding: 2.0833vw; border: var(--static-10) dashed #817E7A; border-radius: 0.3125vw; } #container.esg_04 .contents .section2 .inner > ul > li > p { font-size: var(--fs-26); font-weight: 700; padding-bottom: 1.0417vw; border-bottom: var(--static-10) solid #817E7A; text-align: center; } #container.esg_04 .contents .section2 .inner > ul > li > strong { display: block; margin-top: 1.5625vw; font-size: var(--fs-18); line-height: 1.42; color: var(--text-light); } #container.esg_04 .contents .section2 .inner > ul > li > strong~strong { margin-top: 1.0417vw; } #container.esg_04 .contents .section2 .inner > ul > li > div { margin-top: 0.5208vw; line-height: 1.42; font-size: var(--fs-18); color: var(--text-body); } #container.esg_04 .contents .section2 .inner > ul > li > div > p { display: flex; gap: 0.5208vw; } #container.esg_04 .contents .section2 .inner > ul > li > div > p::before { content: ''; width: 0.1563vw; height: 0.1563vw; border-radius: 0.1563vw; background: var(--text-body); margin-top: 0.5208vw; } #container.esg_04 .contents .section3 { padding: 4.1667vw 0 2.0833vw; } #container.esg_04 .contents .section3 .inner { display: flex; justify-content: space-between; gap: 3.1250vw; min-height: 27.1354vw; } #container.esg_04 .contents .section3 .inner > div { width: 26.0417vw; } #container.esg_04 .contents .section3 .inner > div > p { font-size: var(--fs-48); font-weight: 800; } #container.esg_04 .contents .section3 .inner > div > div { margin-top: 3.1250vw; font-size: var(--fs-18); line-height: 1.42; color: var(--text-dark); } #container.esg_04 .contents .section3 .inner > p { width: 46.3542vw; border-radius: 0.3125vw; overflow: hidden; } #container.esg_04 .contents .section4 {} #container.esg_04 .contents .section4 .inner {} #container.esg_04 .contents .section4 .inner .title { font-size: var(--fs-26); font-weight: 800; padding-bottom: 1.5625vw; border-bottom: var(--static-10) solid #4A4948; } #container.esg_04 .contents .section4 .inner .article { margin-top: 2.6042vw; } #container.esg_04 .contents .section4 .inner .article > dl {} #container.esg_04 .contents .section4 .inner .article > dl~dl { margin-top: 2.6042vw; } #container.esg_04 .contents .section4 .inner .article > dl > dt { font-size: var(--fs-20); font-weight: 700; color: var(--text-darkest); } #container.esg_04 .contents .section4 .inner .article > dl > dd { margin-top: 1.5625vw; } #container.esg_04 .contents .section4 .inner .article > dl > dd > p { display: flex; gap: 0.2604vw; font-size: var(--fs-16); line-height: 1.48; color: var(--text-dark); } #container.esg_04 .contents .section4 .inner .article > div { margin-top: 2.6042vw; display: flex; padding: 2.6042vw 0; align-items: center; justify-content: space-between; border-top: var(--static-10) solid #C2BEB8; border-bottom: var(--static-10) solid #C2BEB8; font-size: var(--fs-20); font-weight: 700; color: var(--text-esg); } #container.esg_04 .contents .section4 .inner .article > div > a { background-color: var(--text-esg); } /*=========================== 개인정보처리방침 공통 ===========================*/ #container[data-name-group="개인정보처리방침"] {} #container[data-name-group="개인정보처리방침"] .contents { padding-top: 3.1250vw; line-height: normal; padding-right: 5.2083vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap { display: grid; grid-template-columns: 15.6250vw 1fr; gap: 0 10.6771vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside { grid-column: 1/2; grid-row: 1/span 5; position: relative; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner {} #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside.sticky .inner { position: sticky; top: 0; left: 0; transition: padding 0.2s ease; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside.sticky .inner.up { padding-top: 5.2083vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside.sticky .inner.down { padding-top: 2.6042vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div { width: 100%; border-bottom: var(--static-10) solid #C2BEB8; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div > p { font-size: var(--fs-16); color: var(--text-body); font-weight: 600; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div.date { padding-bottom: 1.1458vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div.date > div { display: flex; justify-content: space-between; align-items: center; margin-top: 0.3125vw; flex-wrap: wrap; gap: 0.3125vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div.date > div > p { font-size: var(--fs-18); font-weight: 600; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div.date > div .copylink { position: relative; display: flex; align-items: center; gap: 0.2083vw; padding: var(--cl-9) var(--cl-14); border-radius: 5.2083vw; border: var(--static-10) solid #DEDDCF; cursor: pointer; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div.date > div .copylink > img { width: 0.8854vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div.date > div .copylink > span { font-size: var(--fs-14); font-weight: 700; color: var(--text-body); } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div.date > div .copylink .feedback { position: absolute; left: 0; top: calc(100% + 0.2604vw); width: max-content; background: var(--text-dark); padding: 0.5208vw 0.7813vw; border-radius: 5.2083vw; color: #fff; font-size: var(--fs-14); } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div.print { padding: 1.2500vw 0 1.5625vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div.print > div { margin-top: 0.6771vw; cursor: pointer; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div.print > div > img { width: 1.4583vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div.download { padding: 1.2500vw 0 1.5625vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div.download > div { margin-top: 0.7292vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .aside .inner > div.download > div > a~a { margin-top: 0.4167vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .title { font-size: var(--fs-62); font-weight: 600; line-height: 1; margin-bottom: 2.0833vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .title > span+span { font-size: var(--fs-16); display: block; margin-top: 2.0833vw; color: var(--text-body); font-weight: 400; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .top-grid { display: grid; grid-template-columns: repeat(3, 18.6458vw); gap: 0 3.1250vw; border-top: var(--static-20) solid #4A4948; border-bottom: var(--static-10) solid #4A4948; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .top-grid > li { padding: 1.4583vw 0; font-size: var(--fs-16); font-weight: 700; border-bottom: var(--static-10) dashed #C2BEB8; } #container.terms_01 .contents .inner-wrap > .top-grid > li:nth-last-child(-n+2) { border-bottom: 0; } #container.terms_02 .contents .inner-wrap > .top-grid > li:nth-last-child(-n+2) { border-bottom: 0; } #container.terms_03 .contents .inner-wrap > .top-grid > li:nth-last-child(-n+1) { border-bottom: 0; } #container.terms_04 .contents .inner-wrap > .top-grid > li:nth-last-child(-n+2) { border-bottom: 0; } #container.terms_05 .contents .inner-wrap > .top-grid > li:nth-last-child(-n+2) { border-bottom: 0; } #container.terms_06 .contents .inner-wrap > .top-grid > li:nth-last-child(-n+2) { border-bottom: 0; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .article { margin-top: 4.1667vw; font-size: var(--fs-16); line-height: 1.48; color: var(--text-dark); } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .title+.article { margin-top: 0; } #container.terms_07 .contents .inner-wrap > .title+.article, #container.terms_08 .contents .inner-wrap > .title+.article { border-top: var(--static-10) solid #4A4948; } #container.terms_08 .contents .inner-wrap > .title+.article { padding-top: 4.1667vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .article h3 { font-size: var(--fs-20); font-weight: 700; color: var(--text-darkest); line-height: normal; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .article h3+a { margin-top: 1.0417vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .article h4 { font-size: var(--fs-18); font-weight: 600; color: #000; line-height: normal; margin-bottom: 0.8333vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .article h4~h4 { margin-top: 1.5625vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .article ul.dot { padding-left: 0.5208vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .article ul.dot > li { display: flex; gap: 0.5208vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .article ul.dot > li::before { content: ''; width: 0.1563vw; height: 0.1563vw; border-radius: 5.2083vw; background: var(--text-body); margin-top: 0.5208vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .article dl.list { display: flex; gap: 0.1563vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .article > dl { margin-top: 2.6042vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .article > dl > dt { margin-bottom: 1.5625vw; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap > .article > dl > dd {} #container[data-name-group="개인정보처리방침"] .contents .inner-wrap .table-wrap {} #container[data-name-group="개인정보처리방침"] .contents .inner-wrap table { width: 100%; border-top: var(--static-20) solid #4A4948; border-collapse: collapse; border-spacing: 0; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap table td { color: #000; font-size: var(--fs-16); padding: 1.2500vw 2.8646vw; word-break: keep-all; line-height: 1.48; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap table td:nth-of-type(1) { padding-left: 0; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap table td:last-of-type { padding-right: 0; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap table td > strong { color: var(--text-dark); } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap table thead { border-bottom: var(--static-10) solid #4A4948; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap table thead > tr > td { color: var(--text-dark); font-weight: 700; } #container[data-name-group="개인정보처리방침"] .contents .inner-wrap table tbody > tr { border-bottom: var(--static-10) solid #C2BEB8; } #container.terms_04 .contents .inner-wrap table thead > tr > td:nth-of-type(1) { font-weight: 500; } #container.terms_04 .contents .inner-wrap table tr > td:nth-of-type(1) { width: calc(1.5625vw + 2.8646vw); } #container.terms_04 .contents .inner-wrap table tr > td:nth-of-type(2) { width: calc(10.4167vw + 5.7292vw); } #container.terms_06 .contents .inner-wrap .table-1 tr > td:nth-of-type(1) { width: calc(5.2083vw + 2.8646vw); } #container.terms_06 .contents .inner-wrap .table-wrap+.info { display: none; } #container.terms_06 .contents .inner-wrap .table-2 tr > td { text-align: center; } #container.terms_06 .contents .inner-wrap .table-2 tr > td:nth-of-type(1) { width: calc(7.8125vw + 2.8646vw); } #container.terms_06 .contents .inner-wrap .table-2 tr > td:nth-of-type(2) { width: calc(7.8125vw + 5.7292vw); } #container.terms_06 .contents .inner-wrap .table-2 tr > td:nth-of-type(3) { width: calc(7.8125vw + 5.7292vw); } #container.terms_06 .contents .inner-wrap .table-2 tr > td:nth-of-type(4) { width: calc(7.8125vw + 5.7292vw); } #container.terms_06 .contents .inner-wrap .table-3 tr > td { text-align: center; } #container.terms_06 .contents .inner-wrap .table-3 tr > td:nth-of-type(1) { width: calc(15.6250vw + 2.8646vw); } #container.terms_06 .contents .inner-wrap .table-3 tr > td:nth-of-type(2) { width: calc(15.6250vw + 5.7292vw); } /*=========================== 문의 및 제안 qna ===========================*/ #container.qna .contents .section1 .aside-wrap .article {} #container.qna .contents .section1 .aside-wrap .article form {} #container.qna .contents .section1 .aside-wrap .article form > dl { display: flex; padding: 1.4063vw 0; } #container.qna .contents .section1 .aside-wrap .article form > dl:first-child { border-top: var(--static-10) solid #4A4948; } #container.qna .contents .section1 .aside-wrap .article form > dl~dl { border-top: var(--static-10) solid #C2BEB8; } #container.qna .contents .section1 .aside-wrap .article form > dl > dt { flex: 0 0 auto; width: 10.4167vw; font-size: var(--fs-16); font-weight: 500; line-height: 1.48; color: var(--text-dark); display: flex; align-items: center; } #container.qna .contents .section1 .aside-wrap .article form > dl > dt > span.required { position: relative; } #container.qna .contents .section1 .aside-wrap .article form > dl > dt > span.required::after { content: '*'; font-size: var(--fs-16); font-weight: 500; color: var(--text-highlight); line-height: 1.48; } #container.qna .contents .section1 .aside-wrap .article form > dl:has(textarea) > dt, #container.qna .contents .section1 .aside-wrap .article form > dl:has(.select-file) > dt { align-items: flex-start; padding-top: 0.7292vw; } #container.qna .contents .section1 .aside-wrap .article form > dl > dd {} #container.qna .contents .section1 .aside-wrap .article form > dl > dd > select { width: 15.6250vw; border-radius: var(--static-20); } #container.qna .contents .section1 .aside-wrap .article form > dl > dd > input[type=text] { width: 27.0833vw; border-radius: var(--static-20); } #container.qna .contents .section1 .aside-wrap .article form > dl > dd > div.tel { display: flex; align-items: center; justify-content: space-between; width: 27.0833vw; } #container.qna .contents .section1 .aside-wrap .article form > dl > dd > div.tel > select { width: 7.2917vw; } #container.qna .contents .section1 .aside-wrap .article form > dl > dd > div.tel > input[type=text] { width: 8.4375vw; } #container.qna .contents .section1 .aside-wrap .article form > dl > dd > textarea { padding: 1.0417vw; font-size: var(--fs-16); width: 42.7083vw; height: 12.5000vw; border: var(--static-10) solid #C2BEB8; resize: none; border-radius: var(--static-20); } #container.qna .contents .section1 .aside-wrap .article form > dl > dd > div.select-file { display: flex; align-items: center; gap: 0.5208vw; } #container.qna .contents .section1 .aside-wrap .article form > dl > dd > div.select-file > input[type=text] { width: 15.6250vw; background: #F9F4F0; } #container.qna .contents .section1 .aside-wrap .article form > dl > dd > div.select-file > input[type=file] { display: none; } #container.qna .contents .section1 .aside-wrap .article form > dl > dd > div.select-file > label { border-radius: var(--static-20); height: 2.6042vw; line-height: 2.6042vw; padding: 0 1.0417vw; background: #000; color: #fff; font-size: var(--fs-16); font-weight: 700; cursor: pointer; } #container.qna .contents .section1 .aside-wrap .article form > dl > dd > div.select-file+p { margin-top: 1.0417vw; font-size: var(--fs-14); color: var(--text-body); font-weight: 500; } #container.qna .contents .section1 .aside-wrap .article form > dl:not(:has(dt)) { border-bottom: var(--static-10) solid #C2BEB8; } #container.qna .contents .section1 .aside-wrap .article form > dl:not(:has(dt)) > dd { width: 100%; } #container.qna .contents .section1 .aside-wrap .article form > dl:not(:has(dt)) > dd > p { font-size: var(--fs-18); font-weight: 700; color: #000; line-height: 1.42; } #container.qna .contents .section1 .aside-wrap .article form > dl:not(:has(dt)) > dd > p > span.required { position: relative; } #container.qna .contents .section1 .aside-wrap .article form > dl:not(:has(dt)) > dd > p > span.required::after { content: '*'; font-size: var(--fs-18); font-weight: 500; color: var(--text-highlight); line-height: 1.42; } #container.qna .contents .section1 .aside-wrap .article form > dl:not(:has(dt)) > dd .textarea { margin-top: 1.4063vw; width: 100%; height: 12.5000vw; border: var(--static-10) solid #C2BEB8; background: #F9F4F0; overflow-y: scroll; padding: 1.5625vw; font-size: var(--fs-14); color: var(--text-dark); font-weight: 500; line-height: normal; } #container.qna .contents .section1 .aside-wrap .article form > dl:not(:has(dt)) > dd .agree-wrap { padding: 1.4583vw 0 0; display: flex; align-items: center; gap: 0.4167vw; } #container.qna .contents .section1 .aside-wrap .article form > dl:not(:has(dt)) > dd .agree-wrap > label { font-size: var(--fs-14); color: var(--text-body); font-weight: 500; } #container.qna .contents .section1 .aside-wrap .article form > ul { display: flex; justify-content: center; gap: 0.5208vw; margin-top: 3.1250vw; } #container.qna .contents .section1 .aside-wrap .article form > ul > li {} #container.qna .contents .section1 .aside-wrap .article form > ul > li > a { display: block; padding: 1.0417vw 2.0833vw; min-width: 9.3750vw; border: var(--static-10) solid #C2BEB8; border-radius: 5.2083vw; text-align: center; font-size: var(--fs-18); font-weight: 600; color: var(--text-dark); } #container.qna .contents .section1 .aside-wrap .article form > ul > li+li > a { background: #000; color: #fff; border: var(--static-10) solid #000; } /*=========================== 오시는 길 location ===========================*/ #container.location .contents .section1 .aside-wrap .aside .inner {} #container.location .contents .section1 .aside-wrap .aside .inner > div { padding: 1.2500vw 0 1.5625vw; border-bottom: var(--static-10) solid #C2BEB8; } #container.location .contents .section1 .aside-wrap .aside .inner > div:first-of-type { padding-top: 0; } #container.location .contents .section1 .aside-wrap .aside .inner > div > p { font-size: var(--fs-16); font-weight: 600; color: var(--text-body); } #container.location .contents .section1 .aside-wrap .aside .inner > div > div { font-size: var(--fs-18); font-weight: 600; color: #000; line-height: normal; margin-top: 0.7292vw; word-break: keep-all; } #container.location .contents .section1 .aside-wrap .aside .inner > div > div:has(a) { display: flex; justify-content: space-between; } #container.location .contents .section1 .aside-wrap .aside .inner > div > div:has(a) > a { width: 5.0000vw; height: 2.1354vw; text-align: center; line-height: 2.1354vw; border-radius: 0.4167vw; background: #03C75A; color: #fff; font-size: var(--fs-14); font-weight: 700; } #container.location .contents .section1 .aside-wrap .aside .inner > div > div:has(a) > a:nth-of-type(2) { background: #FFAD00; } #container.location .contents .section1 .aside-wrap .aside .inner > div > div:has(a) > a:nth-of-type(3) { background: #000; } #container.location .contents .section1 .aside-wrap .article {} #container.location .contents .section1 .aside-wrap .article .map { width: 62.2396vw; height: 35.1042vw; overflow: hidden; } #container.location .contents .section1 .aside-wrap .article > dl { display: flex; justify-content: space-between; padding: 2.6042vw 0; } #container.location .contents .section1 .aside-wrap .article > dl:first-of-type { margin-top: 4.1667vw; padding-top: 0; } #container.location .contents .section1 .aside-wrap .article > dl:last-of-type { padding-bottom: 0; } #container.location .contents .section1 .aside-wrap .article > dl~dl { border-top: var(--static-10) solid #4A4948; } #container.location .contents .section1 .aside-wrap .article > dl > dt { font-size: var(--fs-36); font-weight: 800; color: #000; } #container.location .contents .section1 .aside-wrap .article > dl > dd { width: 44.0104vw; } #container.location .contents .section1 .aside-wrap .article > dl > dd > div~div { margin-top: 2.0833vw; padding-top: 2.0833vw; border-top: var(--static-10) dashed #C2BEB8; } #container.location .contents .section1 .aside-wrap .article > dl > dd > div > strong { height: min-content; display: flex; align-items: center; font-size: var(--fs-20); font-weight: 700; color: var(--text-darkest); line-height: normal; } #container.location .contents .section1 .aside-wrap .article > dl > dd > div > strong+p { margin-top: 1.5625vw; } #container.location .contents .section1 .aside-wrap .article > dl > dd > div > strong:has(span)+p { margin-top: 1.3542vw; } #container.location .contents .section1 .aside-wrap .article > dl > dd > div > strong > span { margin-left: 0.5208vw; font-size: var(--fs-14); font-weight: 700; color: #fff; padding: 0.4167vw 0.7292vw; border-radius: 5.2083vw; background: #03C75A; } #container.location .contents .section1 .aside-wrap .article > dl > dd > div > strong > span:nth-of-type(2) { margin-left: 0.2083vw; background: #FFAD00; } #container.location .contents .section1 .aside-wrap .article > dl > dd > div > p { display: flex; font-size: var(--fs-18); color: var(--text-body); line-height: 1.42; word-break: keep-all; } #container.location .contents .section1 .aside-wrap .article > dl > dd > div > p+p { margin-top: 1.0417vw; } #container.location .contents .section1 .aside-wrap .article > dl > dd > div > p > strong { color: var(--text-darkest); } #container.location .contents .section1 .aside-wrap .article > dl > dd > div > p > span { font-weight: 700; margin-right: 1.4583vw; position: relative; } #container.location .contents .section1 .aside-wrap .article > dl > dd > div > p > span::after { content: ''; position: absolute; right: -0.7292vw; width: var(--static-10); height: 1.3542vw; top: 50%; margin-top: -0.6771vw; background: #DEDDCF; }