@charset "utf-8"; @import url('https://fonts.googleapis.com/css2?family=Albert+Sans:ital,wght@0,100..900;1,100..900&display=swap'); .content { position: relative; } 

html *{-webkit-tap-highlight-color:  rgba(255, 255, 255, 0);}
header.scrolled{background: #fff;}
.wrap.sub{overflow: auto; overflow-x: hidden;}

/* 서브 탑 */
.svis { width: 100%; height: 100svh; position: relative; display: flex; justify-content: center; align-items: center; overflow: hidden; } 
#svis-trigger { position: absolute; left: 0; width: 100%; top: 0; } 
#svis-trigger2 { position: absolute; left: 0; width: 100%; top: 50%; } 

.svis.sv01 .bg span, .svis.sv01 .svis-title { background-image: url(../images/svis01.jpg); } 
.svis.sv02 .bg span, .svis.sv02 .svis-title { background-image: url(../images/svis02.jpg); } 
.svis.sv03 .bg span, .svis.sv03 .svis-title { background-image: url(../images/svis03.jpg); } 
.svis.sv04 .bg span, .svis.sv04 .svis-title { background-image: url(../images/svis04.jpg); } 
.svis.sv05 .bg span, .svis.sv05 .svis-title { background-image: url(../images/svis05.jpg); } 


.svis .bg { display: block; position: absolute; left: 50%; bottom: 0; width: 1760px; height: 260px; transform: translateX(-50%); background-position: bottom center; overflow: hidden; } 
.svis .bg span { display: block; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 100vw; height: 100vh; height: 100svh; } 
.svis-title { display: flex; flex-direction: column; align-items: center; gap: 45px; background-repeat: no-repeat; background-position: center; background-size: 100vw auto; -webkit-background-clip: text; background-clip: text; text-align: center; position: relative; z-index: 10; } 
.svis-title .sub-title { font-family: 'Albert Sans'; font-size: 32px; font-weight: 700; color: transparent;}
.svis-title .main-title { font-family: 'Pretendard'; font-size: 64px; font-weight: 600; line-height: 84px; color: transparent; letter-spacing: -0.05em;} 
.svis .bg.on { animation: mainBg01 1.5s forwards; transition: 1s; } 
.svis .main-title.active { color: #fff; transition: 1s;transition-delay:0.8s;}
.svis .bg.active { animation: mainBg02 1s 0.8s forwards; transition: 1s;}
.svis .sub-title.active { color: #fff; transition: 1s;transition-delay:0.8s;}
.svis br.__m { display: none; } 

@media all and (min-height: 950px){
 .svis .bg span { background-size: cover; } 
 }

@media all and (min-width: 1025px) { @keyframes mainBg01 { 
 0% { width: 1760px; height: 260px; } 
 100% { width: 1820px; height: 58svh; } 
 }

@keyframes mainBg02 { 
 0% { width: 1760px; height: 260px; } 
 100% { width: 100vw; height: 100svh; } 
 } 
 }
@media all and (max-width: 1239px){
    .svis{background-size: cover;}
    .svis-title { gap: 40px; background-size: cover;} 
}

@media all and (max-width: 768px){
    .svis{background-size: cover;}
 .svis-title { gap: 40px; background-size: cover;} 
 .svis-title .sub-title { font-size: 18px; line-height: 1em;} 
 .svis-title .main-title { font-size: 36px; line-height: 45px;} 
 .svis br.__m { display: block; } 
 .svis .bg { width: calc(100% - 40px); height: 20svh; } 

 @keyframes mainBg01 { 
 0% { width: calc(100% - 40px); height: 20svh; } 
 100% { width: calc(100% - 40px); height: 64svh; } 
 }

@keyframes mainBg02 { 
 0% { width: calc(100% - 40px); height: 20svh; } 
100% { width: 100vw; height: 100svh; } 
 } 
 }

@media (min-width: 769px) and (max-width: 1024px){
 .svis br.__m { display: block; } 

 @keyframes mainBg01 { 
 0% { width: calc(100% - 40px); height: 20svh; } 
 100% { width: calc(100% - 40px); height: 64svh; } 
 }

 @keyframes mainBg02 { 
 0% { width: calc(100% - 40px); height: 20svh; } 
 100% { width: 100vw; height: 100svh; } 
 } 
}

@media (max-width: 768px){
    .svis-title{background-size: auto 100svh;}
    .svis .bg span{background-size: cover;}
    .svis.sv01 .bg span, .svis.sv01 .svis-title { background-image: url(../images/msvis01.jpg); } 
    .svis.sv02 .bg span, .svis.sv02 .svis-title { background-image: url(../images/msvis02.jpg); } 
    .svis.sv03 .bg span, .svis.sv03 .svis-title { background-image: url(../images/msvis03.jpg); } 
    .svis.sv04 .bg span, .svis.sv04 .svis-title { background-image: url(../images/msvis04.jpg); } 
    .svis.sv05 .bg span, .svis.sv05 .svis-title { background-image: url(../images/msvis05.jpg); } 
}

/* 서브메뉴 */
.sub-menu { width: 100%; height: 80px; border-bottom: 1px solid #ddd; } 
.sub-menu * { user-select: none; } 
.sub-menu-wrap { display: flex; justify-content: space-between; width: 100%; max-width: 1440px; height: 100%; margin: 0 auto; } 
.sub-menu .dep1 { position: relative; width: 100%; max-width: 238px; height: 100%; display: flex; justify-content: center; align-items: center; border-right: 1px solid #ddd; cursor: pointer; } 
.sub-menu .now-location { color: #000; font-weight: 700; letter-spacing: -0.05em; display: flex; width: 100%; height: 100%; align-items: center; position: relative; z-index: 15;} 
.sub-menu .dep1::after { content: ''; display: block; width: 15px; height: 15px; background: url(../images/sub-dep1-arr.svg) no-repeat center; background-size: contain; position: absolute; top: 50%; right: 25px; transform: translateY(-50%); z-index: 5;} 
.sub-menu .dep1-menu { position: absolute; top: 79px; left: -39px; width: calc(100% + 40px); display: none; background: #fff; z-index: 15; text-align: center; border: 1px solid #ddd; border-top: none; } 
.sub-menu .dep1-menu.on { display: block; } 
.sub-menu .dep1-menu li { display: block; width: 100%; height: 48px; line-height: 48px; color: #000; letter-spacing: -0.05em; text-align: left; padding-left: 36px; } 
.sub-menu .dep1-menu li a{display: flex; align-items: center; width: 100%; height: 100%;}
.sub-menu .dep1-menu li a:hover{color: #b68639;}
.sub-menu .dep2 { display: flex; gap: 55px; } 
.sub-menu .dep2 a { display: inline-block; width: auto; height: 100%; line-height: 80px; color: #000; letter-spacing: -0.05em; position: relative; z-index: 110; } 
.sub-menu .dep2 li.on a { color: #b68639; font-weight: 700; } 
.sub-menu .dep2 li.on a::after { position: absolute; bottom: -1px; height: 3px; z-index: 5; width: 100%; content: ''; display: block; background: #b68639; } 

#trigger01 { position: absolute; width: 100%; height: 1px; top: 200svh; } 

.ceo-trigger { width: 100%; height: 1px; } 

@media all and (max-width: 768px){
 .sub-menu { height: 100px; } 
 .sub-menu-wrap { flex-direction: column; height: 100px; } 
 .sub-menu .now-location { font-size: 12px; max-width:100%; position: relative; z-index: 20; } 
 .sub-menu .dep1 { width: 100%; height: 50px; box-sizing: border-box; border-right: none; max-width: none; border-bottom: 1px solid #ddd; justify-content: flex-start; } 
 .sub-menu .dep1::after { border-left: 1px solid #ddd; width: 50px; height: 50px; background-size: 15px; right: 0; } 
 .sub-menu .dep2 { gap: 25px; } 
 .sub-menu .dep2 a { font-size: 12px; line-height: 50px; } 
 .sub-menu .dep1, .sub-menu .dep2 { padding-left: 20px; box-sizing: border-box; } 

 .sub-menu .dep1-menu { top: 50px; width: 100%; z-index: 999; left: 0; font-size: 12px; border-left: none; border-right: none; } 
 .sub-menu .dep1-menu li { padding: 0 20px } 
 }

@media (min-width: 769px) and (max-width: 1024px){
 .sub-menu-wrap { padding: 0 20px; } 
 .scene02 .bg { background-size: cover !important; } 
 }

.top-title{opacity: 0; transition: 1s; transform: translateY(60px);}
.top-title.active{transform: none; opacity: 1;}


.scroll-arr{position: absolute; bottom: 70px; right: 90px; width: 130px; height: 130px; display: flex; align-items: center; justify-content: center;}
.scroll-arr::after{content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/scroll-text.png?ver=1) no-repeat center/contain; animation: roll 8s linear infinite;}
.scroll-arr img{width: 16px; height: 31px; object-fit: contain;}

@keyframes roll {
    0% { transform: rotate(0deg);}
    100% { transform: rotate(360deg);}
}

@media (max-width: 767px){
    .scroll-arr{position: absolute; bottom: 5%; right: 50%; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; transform: translateX(50%);}
    .scroll-arr img{width: 8px; height: 16px;}
}

/* ceo인사말 */
.ceo-vis { width: 100vw; height: 100svh; position: relative; display: flex; justify-content: center; align-items: center; overflow: hidden; } 
.scene01 { display: flex; width: 100%; height: 100%; position: absolute; top: 0; left: 0; justify-content: center; align-items: center; text-align: center; } 

.ceo-vis .text-wrap { display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 60px; padding-top: 2vw; } 
.scene02 .text-wrap { position: absolute; top: 50%; left: 50%; text-wrap: nowrap; z-index: 15; } 
.ceo-vis .scene01 .text-wrap { background: url(../images/ceo-bg02.jpg) no-repeat center; -webkit-background-clip: text; background-clip: text; text-align: center; } 
.ceo-vis .text-wrap .top { font-family: 'Pretendard'; font-weight: 500; color: #000; font-size: 32px; letter-spacing: -0.05em; } 
.ceo-vis .text-wrap .bottom { font-family: 'Albert Sans'; font-size: 9.37vw; height: 8.45vw; overflow: hidden; font-weight: 500; } 
.ceo-vis .text-wrap .bottom b { font-family: 'Pretendard'; font-weight: 500; } 
.ceo-vis .scene02 .text-wrap .top { text-shadow: 1px 24px 43px rgba(0, 0, 0, 0.3); } 
.ceo-vis .scene02 .text-wrap .top,
.ceo-vis .scene02 .text-wrap .bottom { color: #fff; } 


.scene02 { position: relative; width: 0px; height: 0px; text-align: center; overflow: hidden; } 
.scene02 .bg { position: absolute; top: 50%; left: 50%; background: url(../images/ceo-bg02.jpg) no-repeat center; width: 450px; height: 450px; z-index: 5; } 
.finish .scene02 .bg { width: 120vw; height: 120svh; } 

.scene02 .text-wrap,
.scene02 .bg { transform: translate(-50%, -50%); } 

.pinhole { width: 100%; height: 100%; position: absolute; z-index: 100; top: 50%; left: 50%; transition: 1s; transform: translate(-50%, -50%) rotate(0deg); } 
.ceo-vis .pinhole::before { content: ''; display: block; width: 100vw; height: 100svh; top: -100svh; left: 50%; background: #fff; position: absolute; transform: translateX(-50%); } 
.ceo-vis .pinhole::after { content: ''; display: block; width: 100vw; height: 100svh; bottom: -100svh; left: 50%; background: #fff; position: absolute; transform: translateX(-50%); } 

.pinhole img { object-fit: cover; display: block; margin: 0 auto; width: 300%; height: 300%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
.scene01 { z-index: 101; } 
.scene01 .text-wrap { background: url(../images/ceo-bg02.jpg) no-repeat center; background-clip: text; -webkit-background-clip: text; transition: 1s; } 
.scene01 .top { color: #000; } 
.scene01 .bottom { color: transparent; } 

@media all and (min-width: 768px){
 .ceo-vis.active .scene01 .text-wrap { gap: 385px; } 
 .ceo-vis.active .scene02 { width: 100vw; height: 100vw; transition: 1s; } 
 .scene02 .bg { width: 450px; height: 450px; } 
 .finish .scene02 .bg { width: 120vw; height: 120svh; } 
 .ceo-vis .pinhole { width: 3%; height: 3%; } 
 .ceo-vis.active .pinhole { width: 150%; height: 50%; } 
 .ceo-vis.finish .pinhole { width: 550%; height: 550%; transform: translate(-50%, -50%) rotate(45deg); } 
 .ceo-vis.finish .scene01 .text-wrap { gap: 60px; } 
 .ceo-vis.finish .scene01 .top { color: #fff; text-shadow: 1px 3px 10px rgba(0, 0, 0, 0.3); } 
 .ceo-vis.finish .scene01 .bottom { color: #fff; } 
 }

.scene02 .bg { background-size: auto 100svh; } 

.finish .scene02 .bg { background-size: cover; } 

@media all and (max-width: 768px){
 .ceo-vis .scene01 .text-wrap { gap: 10vw; } 
 .ceo-vis.active .scene01 .text-wrap { gap: 60vw; } 
 .ceo-vis.active .scene02 { width: 150svh; height: 150svh; transition: 1s; } 
 .scene02 .bg { width: 55vw; height: 55svh; transition: 0.5s; } 
 .ceo-vis.finish .scene02 .bg { width: 100vw; height: 100svh; } 
 .ceo-vis .pinhole { width: 56vw; height: 0svh; } 
 .ceo-vis.active .pinhole { width: 100%; height: 40svh; } 
 .ceo-vis.finish .pinhole { animation: pinhole 1.5s forwards; } 
 @keyframes pinhole { 
 0% { width: 100%; height: 40svh; } 
 100% { width: 450%; height: 450%; transform: translate(-50%, -50%) rotate(45deg); } 
 }
 .ceo-vis.finish .scene01 .text-wrap { gap: 10vw; } 
 .ceo-vis.finish .scene01 .top { color: #fff; text-shadow: 1px 3px 10px rgba(0, 0, 0, 0.3); } 
 .ceo-vis.finish .scene01 .bottom { color: #fff; text-shadow: 1px 3px 10px rgba(0, 0, 0, 0.3); } 
 }
 

@media (min-width: 769px) and (max-width: 1024px){
 .ceo-vis.active .scene02 { width: 100svh; height: 100svh; transition: 1s; } 
 .ceo-vis .pinhole { width: 3%; height: 3%; } 
 .ceo-vis.active .pinhole { width: 100%; height: 50%; } 
 .ceo-vis.finish .pinhole { width: 450%; height: 450%; transform: translate(-50%, -50%) rotate(45deg); } 
 .ceo-vis.finish .scene01 .top { color: #fff; text-shadow: 1px 3px 10px rgba(0, 0, 0, 0.3); } 
 .ceo-vis.finish .scene01 .bottom { color: #fff; text-shadow: 1px 3px 10px rgba(0, 0, 0, 0.3); } 
 }



.ceo-text-wrap { padding: 230px 20px 300px; display: flex; justify-content: space-between; width: 100%; max-width: 1480px; margin: 0 auto; } 
.ceo-text-wrap .lef { width: 50%; flex-shrink: 0; } 
.ceo-text-wrap .lef p { display: block; font-size: 60px; font-weight: 700; letter-spacing: -0.05em; color: #000; } 
.ceo-text-wrap .lef p~p { margin-top: 30px; } 
.ceo-text-wrap .rig { width: 50%; padding-left: 90px; font-size: 20px; font-weight: 400; letter-spacing: -0.05em; color: #000; line-height: 36px; box-sizing: border-box; flex-shrink: 0; } 
.ceo-text-wrap .rig p~p { margin-top: 28px; } 
.ceo-text-wrap .ceo-nametag { display: flex; font-size: 24px; font-weight: 700; letter-spacing: -0.05em; color: #000; margin-top: 80px; gap: 30px; align-items: center; } 
.ceo-text-wrap .ceo-nametag img { width: auto; height: auto; max-width: 100%; } 

/* motion */
.ceo-text-wrap .lef { position: relative; } 
.ceo-text-wrap .front { position: absolute; top: 0; left: 0; height: 100%; width: 100%; color: #000; } 
.ceo-text-wrap .back { opacity: 0.1; color: #000; } 

.ceo-text-wrap .lef .front p { width: 0px; transition: 1s ease-out; overflow: hidden; } 
.ceo-text-wrap.active .lef .front p { width: 100%; text-wrap: nowrap; } 
.ceo-text-wrap.active .lef .front p:first-of-type { transition-delay: 0; } 
.ceo-text-wrap.active .lef .front p:nth-of-type(2) { transition-delay: 0.5s; } 
.ceo-text-wrap.active .lef .front p:nth-of-type(3) { transition-delay: 1s; } 
.ceo-text-wrap .rig { transform: translateY(80px); transition: 1s; opacity: 0; } 
.ceo-text-wrap.active .rig { transform: none; opacity: 1; } 

@media all and (max-width: 768px){
 .scene01 .bg,
 .scene02 .bg { background-size: cover; } 
 }

@media (max-width: 500px){
 .ceo-vis .text-wrap .top { font-size: 5.56vw; line-height: 1em; } 
.ceo-vis .text-wrap .bottom { font-size: 18vw; height: 16.4vw; line-height: 1em; } 
.ceo-text-wrap { flex-direction: column; padding: 140px 20px 160px; } 
.ceo-text-wrap .lef,
.ceo-text-wrap .rig { width: 100%; padding: 0; } 
.ceo-text-wrap .lef p { font-size: 8.885vw; } 
.ceo-text-wrap .lef p ~ p { margin-top: 3.95vw; } 
.ceo-vis .scene02 .text-wrap .top, .ceo-vis .scene02 .text-wrap .bottom { text-shadow: 1px 24px 43px rgba(0, 0, 0, 0.3); } 
.ceo-text-wrap .rig { font-size: 3.85vw; line-height: 1.65; margin-top: 12.5%; } 
.ceo-text-wrap .rig p~p { margin-top: 5vw; } 
.ceo-text-wrap.active .rig { transform: none; opacity: 1; transition-delay: 0s; } 
.ceo-text-wrap .ceo-nametag { font-size: 3.85vw; gap: 5.5vw; height: 6vw; margin-top: 15%; } 
.ceo-text-wrap .ceo-nametag img { width: auto; height: 6vw; max-width: 100%; } 
 }

.ceo-vis .scene02 { transition: transform 1s, width 1s, height 1s; transform-origin: center center; } 

@media (min-width:501px) and (max-width: 1440px){
 .ceo-text-wrap { flex-direction: column; padding: 180px 20px 205px; } 
.ceo-text-wrap .lef,
.ceo-text-wrap .rig { width: 100%; padding: 0; } 
.ceo-text-wrap .lef p { font-size: 48px; } 
.ceo-text-wrap .lef p ~ p { margin-top: 10px; } 
.ceo-vis .scene02 .text-wrap .top, .ceo-vis .scene02 .text-wrap .bottom { text-shadow: 1px 24px 43px rgba(0, 0, 0, 0.3); } 
.ceo-text-wrap .rig { font-size: 24px; line-height: 1.65; margin-top: 12.5%; } 
.ceo-text-wrap .rig p~p { margin-top: 30px; } 
.ceo-text-wrap.active .rig { transform: none; opacity: 1; transition-delay: 0s; } 
.ceo-text-wrap .ceo-nametag { font-size: 24px; gap: 16px; height: 32px; margin-top: 60px; } 
.ceo-text-wrap .ceo-nametag img { width: auto; height: 32px; max-width: 100%; } 
 }




/* 조직도 */
.content { border-bottom: 1px solid #ddd; } 
.content .top-title { color: #000; text-align: center; margin: 200px auto 120px; } 
.content .top-title.detail{margin: 200px auto 80px;}
.content .subpage-title { font-size: 80px; font-weight: 700; margin-bottom: 55px; } 
.content .subpage-subtitle { font-size: 20px; letter-spacing: 0.025em; } 

.organization { padding-bottom: 240px; } 
.organization .body { display: flex; text-align: center; align-items: flex-start; gap: 60px; margin: 0 auto; justify-content: center; width: 100%; max-width: 1480px; padding: 0 20px; position: relative; } 
.organization .body::before { content: ''; display: block; width: 1200px; height: 1px; background: #ccc; position: absolute; top: 1px; left: 50%; z-index: 0; transform: translateX(-50%); } 

.organization .head { display: flex; width: 282px; height: 282px; background: url(../images/organization-tag.png) no-repeat center; background-size: contain; position: relative; z-index: 5; align-items: center; justify-content: center; font-weight: 700; color: #fff; margin: 0 auto 100px; position: relative; font-size: 32px; } 
.organization .head::after { content: ''; display: block; width: 1px; height: 134px; background: rgba(204, 204, 204, 0.8); position: absolute; bottom: -100px; left: 50%; z-index: 0; } 

.organization .item-wrapper { width: 240px; position: relative; } 
.organization .item-wrapper .item { display: flex; justify-content: center; align-items: center; width: 240px; height: 70px; border-radius: 4px; font-size: 22px; margin-top: 60px; position: relative; z-index: 5; } 
.organization .item-wrapper .item.top { background: #4d3001; color: #fff; font-weight: 700; } 
.organization .item-wrapper .item.bot { background: #fff; border: 1px solid #4d3001; color: #000; font-weight: 500; } 
.organization .dot { display: flex; justify-content: center; align-items: center; width: 100%; height: 4px; margin-bottom: 80px; position: relative; } 
.organization .dot span { display: block; width: 4px; height: 4px; background: #4d3001; transform: rotate(45deg); position: relative; z-index: 10; } 
.organization .item-wrapper::after { content: ''; display: block; width: 1px; height: 100%; background: #ccc; position: absolute; top: 0; left: 50%; z-index: 0; } 
.organization .body.__m { display: none; } 
.organization .body.__p { display: flex; } 

@media (min-width:1025px) and (max-width: 1450px){
 .organization { padding: 0 20px 240px; } 
.organization .head { width: 45vw; height: 45vw; font-size: 18px; margin: 0 auto 20px; max-width: 200px; max-height: 200px; } 
.organization .body { width: 100%; gap: 20px; } 
.organization .item-wrapper { width: 100%; position: relative; } 
.organization .item-wrapper .item { display: flex; justify-content: center; align-items: center; width: 100%; height: 70px; border-radius: 4px; font-size: 22px; margin-top: 60px; position: relative; z-index: 5; } 
.organization .item-wrapper .item.top { background: #4d3001; color: #fff; font-weight: 700; } 
.organization .item-wrapper .item.bot { background: #fff; border: 1px solid #4d3001; color: #000; font-weight: 500; } 
.organization .dot { display: flex; justify-content: center; align-items: center; width: 100%; height: 4px; margin-bottom: 80px; position: relative; } 
.organization .dot span { display: block; width: 4px; height: 4px; background: #4d3001; transform: rotate(45deg); position: relative; z-index: 10; } 
.organization .item-wrapper::after { content: ''; display: block; width: 1px; height: 100%; background: #ccc; position: absolute; top: 0; left: 50%; z-index: 0; } 
.organization .body::before { content: ''; display: block; width: calc(82% - 40px); height: 1px; background: #ccc; position: absolute; top: 1px; left: 50%; z-index: 0; transform: translateX(-50%); } 
 }

@media all and (max-width: 1024px){
 .organization { padding: 0 0 100px; } 
.organization .head { width: 45vw; height: 45vw; font-size: 18px; margin: 0 auto 20px; max-width: 200px; max-height: 200px; } 
.organization .body.__p { display: none; } 
.organization .body.__m { display: flex; } 
.organization .bot,
.organization .top { display: flex; justify-content: space-between; align-items: flex-start; width: 100%; gap: 0; position: relative; padding: 0 15px; } 
.organization .body { flex-wrap: wrap; gap:2.5%; justify-content: flex-start; } 
.organization .item-wrapper { width: 31%; } 
.organization .body::before { width: 1px; height: calc(50% + 11px); right: 20px; left: auto; transform: none; } 
.organization .dot { margin-bottom: 24px; } 
.organization .item-wrapper .item { width: 100%; height: 50px; font-size: 13px; margin-top: 16px; } 
.organization .body > div ~ div { margin-top: 20px; } 
.organization .body > div::before { content: ''; display: block; width: calc(83.5% - 5px); height: 1px; background: #ccc; position: absolute; top: 1px; right: 0px; z-index: 0; } 
.organization .head::after { content: ''; display: block; width: 1px; height: 127px; background: rgba(204, 204, 204, 0.8); position: absolute; bottom: -100px; left: 50%; z-index: 0; } 
 }


 .organization .head::after{opacity: 0; transition: 1s;}
 .organization .head{opacity: 0; transition: 1s;}
 .organization .head.active{opacity: 1;}
 .organization .head.active::after{opacity: 1; transition-delay: 0.5s;}

 .organization .body{opacity: 0; transition: 1s;}
 .organization .body.active{opacity: 1;}

/* 오시는 길 */
.location-wrap { max-width: 1480px; width: 100%; padding: 0 20px 200px; margin: 0 auto; } 
.location-wrap .map-wrap { width: 100%; height: 511px; margin-bottom: 110px; border: 1px solid #e0e0e0; overflow: hidden;} 

.location-wrap .title {display: flex; justify-content: space-between;}
.location-wrap .title .lef{font-size: 60px; letter-spacing: -0.05em; color: #000; line-height: 1.4;}
.location-wrap .title .lef b{font-weight: 700;}
.location-wrap .title .rig{display: flex; gap: 20px; margin-top: 10px;}
.location-wrap .title .map-btn{width: 220px; height: 70px; justify-content: center; align-items: center; gap: 9px; color: #fff; font-size: 18px; letter-spacing: -0.05em; font-weight: 700; display: flex;}
.location-wrap .title .map-btn.naver {background: #03c75a;}
.location-wrap .title .map-btn.naver i{width: 16px; height: 15px; background: url(../images/btn-naver.png) no-repeat center/contain;}
.location-wrap .title .map-btn.kakao {background: #5f94ff;}
.location-wrap .title .map-btn.kakao i{width: 16px; height: 15px; background: url(../images/btn-kakao.png) no-repeat center/contain;}


.location-info {margin-top: 80px; width: 100%;}
.location-info .item{display: flex; align-items: center; min-height: 120px; padding: 0 20px; border-bottom: 1px solid #ddd;}
.location-info .item:first-of-type{border-top: 1px solid #ddd;}
.location-info .lef{width: 124px; display: block; flex-shrink: 0;}
.location-info .lef p{font-size: 20px;color: #000;letter-spacing: -0.05em;padding: 0 0 0 30px;position: relative;font-weight: 700;}
.location-info .lef p::before{width: 7px; height: 7px; position: absolute; content: ''; display: block; top: 50%; left: 0; transform: translateY(-50%) rotate(45deg); background: #000;}
.location-info .lef p::after{width: 1px; height: 18px; position: absolute; content: ''; display: block; top: 50%; right: 0; transform: translateY(-50%); background: #000;}
.location-info .rig {width: 100%; padding: 0 80px 0 30px;}
.location-info .rig p{font-size: 20px; letter-spacing: -0.05em; color: #000;}

@media all and (max-width: 768px){
    .location-wrap{padding: 0 20px 100px;}
    .location-wrap .map-wrap{width: 100%; height: 30svh; margin-bottom: 50px;}
    .location-wrap .title{flex-direction: column; gap: 10px;}
    .location-wrap .title .lef{font-size: 28px;}
    .location-wrap .title .rig{gap:16px;}
    .location-wrap .title .map-btn{font-size: 14px; height: 48px; width: 50%;}

    .location-info{margin: 40px auto 0; grid-template-columns: repeat(1, 1fr);}
    .location-info .item{flex-direction: column;align-items: flex-start;gap: 16px;padding: 20px 10px;justify-content: center;min-height: 100px; overflow: hidden;}
    .location-info .item:first-of-type{border-top: 1px solid #ddd;}
    .location-info .item:nth-of-type(2){border-top: none;}
    .location-info .lef,
    .location-info .rig{padding: 0;}
    .location-info .lef p{font-size: 14px;padding-left: 15px;}
    .location-info .lef p::before{width: 5px; height: 5px; left: 2px;}
    .location-info .lef p::after{display: none; left: 4px;}
    .location-info .rig .text{max-width: none;}
    .location-info .rig input{padding: 5px 15px;min-height: 40px; font-size: 14px;}
    .location-info .rig textarea{padding: 15px;min-height: 40px; font-size: 14px;}
    .location-info .rig p{font-size: 14px; line-height: 1.4;}
}

/* 사업영역 */
.business-img-box { max-width: 1760px; margin: 0 auto; padding: 0 20px; } 
.business-img-box img { clip-path: inset(50% 50% 50% 50%); transition: clip-path 2s; } 
.business-img-box.active img { clip-path: inset(0% 0% 0% 0%); } 
.business-info-section { max-width: 1480px; padding: 0 20px; margin: 0 auto; } 
.business-info-section .header { font-size: 60px; font-weight: 700; color: #000; letter-spacing: -0.05em; margin: 120px 0 80px; } 
.desc-wrapper { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid #ddd; } 
.desc-wrapper .item { display: flex; align-items: center; min-height: 120px; padding: 0 20px; border-bottom: 1px solid #ddd; overflow: hidden; } 
.desc-wrapper .text { font-size: 20px; color: #000; letter-spacing: -0.05em; padding: 0 0 0 30px; position: relative; font-weight: 400; } 
.desc-wrapper .text::before { width: 7px; height: 7px; position: absolute; content: ''; display: block; top: 50%; left: 0; transform: translateY(-50%) rotate(45deg); background: #000; } 

@media all and (max-width: 768px){
 .business-info-section .header { font-size: 32px; margin: 60px auto 40px } 
 .desc-wrapper { grid-template-columns: repeat(1, 1fr); } 
 .desc-wrapper .item { padding: 15px 10px; min-height: 73px; } 
 .desc-wrapper .text { font-size: 14px; padding-left: 15px; line-height: 1.5; } 
 .desc-wrapper .text::before { width: 5px; height: 5px; left: 2px; } 
 .desc-wrapper .text::after { display: none; left: 4px; } 
 }

/*도표*/
.business-step ul{display:flex;justify-content:space-between;flex-wrap:wrap;}
.business-step ul li{width:16%;position:relative;border:1px solid #ddd;opacity:0;transform:translate(0,50%);transition:0.8s;}
.business-step ul li:nth-child(1){transition-delay:0.2s;}
.business-step ul li:nth-child(2){transition-delay:0.3s;}
.business-step ul li:nth-child(3){transition-delay:0.4s;}
.business-step ul li:nth-child(4){transition-delay:0.5s;}
.business-step ul li:nth-child(5){transition-delay:0.6s;}
.business-step ul li:nth-child(6){transition-delay:0.7s;}
.business-step ul li::before{content:"";position:absolute;left:0;top:0;width:100%;height:1px;transform-origin: 0 0;transform:scaleX(0);transition:1s;transition-delay:0.2s;}
.business-step ul li:nth-child(odd)::before{background-color:#b68639;}
.business-step ul li:nth-child(even)::before{background-color:#4d3001;}
.business-step ul li .num{width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:600;position:absolute;left:0;top:0;}
.business-step ul li .num::before{content:"";position:absolute;left:0;top:0;width:100%;height:100%;transform-origin: 0 0;transform:scaleY(0);transition:0.8s;transition-delay:0.6s;}
.business-step ul li:nth-child(odd) .num::before{background-color:#b68639;}
.business-step ul li:nth-child(even) .num::before{background-color:#4d3001;}
.business-step ul li .num p{color:#fff;transform: skewX(-15deg);position:relative;z-index:1;overflow:hidden;}
.business-step ul li .num p span{display:block;transform:translate(0,100%);transition:0.8s;transition-delay:0.8s;}
.business-step .box{padding-bottom:100%;}
.business-step .txt{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content: center;}
.business-step .txt p{color:#000;font-size:26px;font-weight:600;letter-spacing:-0.05em;line-height:1.2em;overflow:hidden;}
.business-step .txt p span{display:block;transform:translate(0,100%);transition:0.8s;transition-delay:0.6s;}
.business-step.active ul li,
.business-step.active ul li::before,
.business-step.active ul li .num::before,
.business-step.active ul li .num p span,
.business-step.active .txt p span{opacity:1;transform:none;}

@media all and (max-width: 1200px){
	.business-step ul li .num{width: 30px;height: 30px;font-size:16px;}
	.business-step .txt p{font-size: 22px;}
}
@media all and (max-width: 1024px){
	.business-step ul li{width:32%;}
	.business-step ul li:nth-child(n + 4){margin-top:2%;}
	.business-step ul li .num{width: 40px;height: 40px;font-size:18px;}
	.business-step .txt p{font-size: 26px;}
}
@media all and (max-width: 768px){
	.business-step ul li{width:48%;}
	.business-step ul li:nth-child(n + 3){margin-top:4%;}
	.business-step ul li .num{width: 35px;height: 35px;font-size:15px;}
	.business-step .txt p{font-size: 20px;}
}

/* 사업영역 공통 - 모션 */
.business-info-section .header { opacity: 0; transform: translateY(50px); transition: 1s; } 
.business-info-section .header.active { opacity: 1; transform: none;} 

.desc-wrapper .text{opacity: 0; transition: 1s; transform: translateX(50px); }
.desc-wrapper .text.active { opacity: 1; transform: none; }

.desc-wrapper .text.item:nth-of-type(odd).active { transition-delay: 0s; }
.desc-wrapper .text.item:nth-of-type(even).active { transition-delay: 0.4s; }

@media (max-width: 768px){
    .business-info-section .header.active { transition-delay: 0.5s; }
    .desc-wrapper .text.item:nth-of-type(odd).active { transition-delay: 0s; }
    .desc-wrapper .text.item:nth-of-type(even).active { transition-delay: 0s; } 
}

/* 사업영역 - 분양대행 */
.process-wrap { max-width: 1480px; padding: 0 20px; margin: 0 auto 200px; } 
.process-wrap .item-wrap { width: 100%; display: grid; grid-template-columns: repeat(3, auto); justify-content: space-between; } 
.process-wrap .item-wrap .item { max-width: 440px; width: 100%; position: relative; background: #fff; } 
.process-wrap .desc-box { padding: 40px 50px; border: 1px solid #ddd; border-top: none; min-height: 310px;} 
.process-wrap .item-wrap .num { font-size: 14px; color: #b68639; } 
.process-wrap .item-wrap .header { font-size: 30px; color: #000; letter-spacing: -0.05em; font-weight: 700; margin: 10px 0 30px; } 
.process-wrap .item-wrap .desc { font-size: 20px; color: #000; letter-spacing: -0.05em; font-weight: 400; line-height: 36px; } 
.process-wrap .item-wrap .desc span{display: block;}
.process-wrap .header { display: flex; align-items: flex-end; margin: 200px 0 80px; gap: 20px; } 
.process-wrap .header p { font-size: 60px; color: #101010; font-weight: 700; } 
.process-wrap .header i { display: block; background: url(../images/process-icon.png) no-repeat center/contain; width: 52px; height: 32px; } 
.process-wrap .item-wrap .item:not(:last-of-type)::after { position: absolute; content: ''; display: block; width: 62px; height: 1px; top: 50%; right: -62px; background: repeating-linear-gradient( to right, #ddd, #ddd 3px, transparent 3px, transparent 6px); transform: translateY(-50%); } 
.process-wrap .item-wrap .item:not(:last-of-type)::before { position: absolute; content: ''; display: block; width: 62px; height: 13px; top: 50%; right: -62px; background: url(../images/agency-arr.png) no-repeat center/contain; transform: translateY(-50%); } 
.process-wrap .mid .arr { display: block; width: 65px; height: 32px; background: url(../images/agency-mid-arr.png) no-repeat center/contain; position: relative; z-index: 10; } 
.process-wrap .mid { display: flex; justify-content: space-between; align-items: center; height: 120px; } 
.process-wrap .mid .lef-side,
.process-wrap .mid .rig-side { max-width: 440px; width: 100%; height: 100%; position: relative; } 
.process-wrap .mid .lef-side::before { content: ''; display: block; position: absolute; height: 50%; width: 1px; bottom: 0; left: 50%; background: repeating-linear-gradient( to bottom, #ddd, #ddd 3px, transparent 3px, transparent 6px);} 
.process-wrap .mid .lef-side::after { content: ''; display: block; position: absolute; width: 115%; height: 1px; top: 50%; left: 50%; background: repeating-linear-gradient( to right, #ddd, #ddd 3px, transparent 3px, transparent 6px); transform: translateY(-50%); } 
.process-wrap .mid .rig-side::before { content: ''; display: block; position: absolute; height: 50%; width: 1px; top: 0; left: 50%; background: repeating-linear-gradient(to bottom, #ddd, #ddd 3px, transparent 3px, transparent 6px); } 
.process-wrap .mid .rig-side::after { content: ''; display: block; position: absolute; width: 115%; height: 1px; top: 50%; right: 50%; background: repeating-linear-gradient(to right, #ddd,#ddd 3px, transparent 3px, transparent 6px ); transform: translateY(-50%); } 

@media (min-width: 1201px){
    .process-wrap .process-item.__p{display: block;}
    .process-wrap .process-item.__t,
    .process-wrap .process-item.__m{display: none;}
}

@media (min-width:768px) and (max-width: 1200px){
    .process-wrap{margin: 0 auto 160px;}
    .process-wrap .process-item.__t{display: block;}
    .process-wrap .process-item.__p,
    .process-wrap .process-item.__m{display: none;}

    .business-info-section .header{font-size: 40px;}
    .desc-wrapper .item { padding: 15px 10px; min-height: 73px; } 
    .desc-wrapper .text { font-size: 16px; padding-left: 15px; line-height: 1.5; } 
    .desc-wrapper .text::before { width: 5px; height: 5px; left: 2px; } 
    .desc-wrapper .text::after { display: none; left: 4px; } 

    .process-wrap .mid .lef-side::after,
    .process-wrap .mid .rig-side::after{width: 60%;}
    
    .process-wrap .header{margin: 120px 0 60px;}
    .process-wrap .header p{font-size: 40px;}
    .process-wrap .header i{width: 40px; background: url(../images/process-icon.png) no-repeat center bottom/contain;}

    .process-wrap .desc-box{padding: 28px; min-height: 240px;}
    .process-wrap .item-wrap{grid-template-columns: repeat(2, 1fr); gap: 60px}
    .process-wrap .item-wrap .item{max-width: none;}
    .process-wrap .item-wrap .img-box img{display: block; width: 100%;}
    .process-wrap .item-wrap .num { font-size: 12px; color: #b68639; } 
    .process-wrap .item-wrap .header { font-size: 24px; color: #000; margin: 10px 0 20px; } 
    .process-wrap .item-wrap .desc { font-size: 16px; line-height: 1.8;} 

    .process-wrap .mid{display: grid; grid-template-columns: repeat(2, 1fr); position: relative; gap: 60px}
    .process-wrap .mid .arr{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
}

@media all and (max-width: 768px){
    .process-wrap .item-wrap{grid-template-columns: repeat(1, 1fr); gap: 60px;}
    .process-wrap .desc-box{padding: 16px; min-height: 145px;}
    .process-wrap .item-wrap .item{max-width: none;}
    .process-wrap .item-wrap .item:not(:last-of-type)::after{left: 50%; width: 1px; height: 100%; bottom: -50%; transform: translateY(50%); background:repeating-linear-gradient( to bottom, #ddd, #ddd 3px, transparent 3px, transparent 6px);}
    .process-wrap .item-wrap .item:not(:last-of-type)::before{left: 50%; bottom: -38px;top: auto; right: auto; transform: translate(-50%, -50%); width: 100px; height: 10px; z-index: 10; background: url(../images/agency-arr-m.png) no-repeat center/contain;}
    .process-wrap .item-wrap .num { font-size: 11px; color: #b68639; } 
    .process-wrap .item-wrap .header { font-size: 20px; color: #000; margin: 5px 0 15px; } 
    .process-wrap .item-wrap .desc { font-size: 14px; color: #000; letter-spacing: -0.05em; font-weight: 400; line-height: 1.8; display: grid; grid-template-columns: repeat(2, 1fr);} 
    .process-wrap .header{margin: 100px 0 40px; gap: 10px;}
    .process-wrap .header p{font-size: 32px;}
    .process-wrap .header i{width: 30px; background: url(../images/process-icon.png) no-repeat center bottom/contain;}
    .process-wrap .process-item.__t,
    .process-wrap .process-item.__p{display: none;} 
    .process-wrap .process-item.__m{display: block;} 
}

/* 사업영역 - 입주대행 */
.marketing-text{display: flex; justify-content: center; flex-direction: column; align-items: center; gap: 50px; margin: 200px auto 150px;}
.marketing-text i{display: block; width: 30px; height: 22px;}
.marketing-text span{display: block; font-size: 48px; line-height: 1.5; text-align: center; letter-spacing: -0.05em; color: #000; font-weight: 500;}
.marketing-text b{font-weight: 700; color: #b68639; font-family: 'Noto Sans KR';}

.quotes1{ background: url(../images/marketing-img01.png) no-repeat center/contain;}
.quotes2{ background: url(../images/marketing-img02.png) no-repeat center/contain;}

.marketing-label{display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 15px; margin-bottom: 250px;}
.marketing-label span{display: block; width: 9px; height: 9px; transform: rotate(45deg); background: #b68639;}
.marketing-label .square1{opacity: 0.2;}
.marketing-label .square2{opacity: 0.5;}

.marketing-item{max-width: 1440px; margin: 0 auto;}
.marketing-item~.marketing-item{margin-top: 250px;}
.marketing-item:last-of-type{margin-bottom: 200px;}
.marketing-item .img-box{position: relative;}
.marketing-item .title{position: absolute; z-index: 10; font-family: 'Cormorant Garamond'; font-size: 150px; left: -160px; top: -80px; color: #000;}
.marketing-item .title.bd{color: #b68639;}
.marketing-item .text-wrap{display: flex; margin-top: 100px;}

.marketing-item .lef{font-size: 48px; letter-spacing: -0.05em; color: #000; line-height: 1.5; font-weight: 700; flex-shrink: 0; width: 640px;}
.marketing-item .rig{display: flex;flex-direction: column;width: 100%;}
.marketing-item .rig .desc-wrapper { display: grid; grid-template-columns: repeat(1, 1fr); border-top: 1px solid #ddd; } 
.marketing-item .rig .desc-wrapper .item {  display: flex; align-items: center; min-height: 80px; padding: 0 20px; border-bottom: 1px solid #ddd; overflow: hidden; } 
.marketing-item .rig .desc-wrapper .text { font-size: 20px; color: #000; letter-spacing: -0.05em; padding: 0 0 0 30px; position: relative; font-weight: 400; } 
.marketing-item .rig .desc-wrapper .text::before { width: 7px; height: 7px; position: absolute; content: ''; display: block; top: 50%; left: 0; transform: translateY(-50%) rotate(45deg); background: #000; } 

@media (min-width: 1101px) and (max-width: 1720px){
    .marketing-item{padding: 0 20px; max-width: 1480px;}
    .marketing-item .title{left: 0;}
}

@media (min-width: 681px) and (max-width: 1100px){
    .marketing-text{display: flex;justify-content: center;flex-direction: column;align-items: center;gap: 20px;margin: 60px auto 50px;padding: 0 20px;}
    .marketing-text i{display: block; width: 15px; height: 10px;}
    .marketing-text span{display: block; font-size: 32px; line-height: 1.5; text-align: center; letter-spacing: -0.05em; color: #000; font-weight: 500;}
    .marketing-label{gap: 8px;margin-bottom: 80px;}
    .marketing-label span{width: 6px; height: 6px;}
    .marketing-item{padding: 0 20px;}
    .marketing-item ~ .marketing-item{margin-top: 100px;}
    .marketing-item:last-of-type{margin-bottom: 100px;}
    .marketing-item .title{left: 0; top: -30px; font-size: 56px;}
    .marketing-item .text-wrap{flex-direction: column; margin-top: 40px;}
    .marketing-item .lef{font-size: 32px; width: 100%; margin-bottom: 20px;}
    .marketing-item .rig{display: flex;flex-direction: column;width: 100%;}
    .marketing-item .rig .desc-wrapper { display: grid; grid-template-columns: repeat(1, 1fr); border-top: 1px solid #ddd; } 
    .marketing-item .rig .desc-wrapper .item {min-height: 52px; padding: 15px 10px;} 
    .marketing-item .rig .desc-wrapper .text {font-size: 16px;} 
    .marketing-item .rig .desc-wrapper .text::before { width: 5px; height: 5px; left: 2px; } 
}

@media all and (max-width: 680px){
    .marketing-text{display: flex;justify-content: center;flex-direction: column;align-items: center;gap: 20px;margin: 60px auto 50px;padding: 0 20px;}
    .marketing-text i{display: block; width: 15px; height: 10px;}
    .marketing-text span{display: block; font-size: 24px; line-height: 1.5; text-align: center; letter-spacing: -0.05em; color: #000; font-weight: 500;}
    .marketing-label{gap: 8px;margin-bottom: 80px;}
    .marketing-label span{width: 6px; height: 6px;}
    .marketing-item{padding: 0 20px;}
    .marketing-item ~ .marketing-item{margin-top: 100px;}
    .marketing-item:last-of-type{margin-bottom: 100px;}
    .marketing-item .img-box{height: 180px;}
    .marketing-item .img-box img{display: block; width: 100%; height: 100%; object-fit: cover;}
    .marketing-item .title{left: 0; top: -30px; font-size: 56px;}
    .marketing-item .text-wrap{flex-direction: column; margin-top: 40px;}
    .marketing-item .lef{font-size: 24px; width: 100%; margin-bottom: 20px;}
    .marketing-item .rig{display: flex;flex-direction: column;width: 100%;}
    .marketing-item .rig .desc-wrapper { display: grid; grid-template-columns: repeat(1, 1fr); border-top: 1px solid #ddd; } 
    .marketing-item .rig .desc-wrapper .item {min-height: 52px; padding: 15px 10px;} 
    .marketing-item .rig .desc-wrapper .text {font-size: 14px;} 
    .marketing-item .rig .desc-wrapper .text::before { width: 5px; height: 5px; left: 2px; } 
}

/* 시행 및 개발 */
.develop-item >item-wrapper 
.develop-item .item-wrap{display: grid; grid-template-columns: repeat(4, 1fr);}

/* 컨설팅 */
.process-wrap.consulting .header{margin: 200px auto 0;}
.consult-wrap{width: 100%; height: 0; padding-bottom: 68%; position: relative; display: flex; justify-content: center; align-items: center; }
.consult-wrap .bg{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/consult-bg.png) no-repeat center/contain; z-index: 1;}
.consult-wrap .cunsult-item{position: absolute; top: 50%; left: 0; width: 100%; height: 100%; max-height: 780px; z-index: 5; transform: translateY(-50%);}
.consult-wrap .cen{position: absolute; z-index: 5; height: 100%; display: flex; align-items: center; width: 100%; justify-content: center; left: 0; top: 0;}
.consult-wrap .cen img{max-width: 440px;}

.cunsult-item .item{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center; background-size: contain; background-repeat: no-repeat;}
.cunsult-item .it01{background-image: url(../images/consult-img02.png);}
.cunsult-item .it02{background-image: url(../images/consult-img03.png);}
.cunsult-item .it03{background-image: url(../images/consult-img04.png);}
.cunsult-item .it04{background-image: url(../images/consult-img05.png);}


.cunsult-item .main-header{font-size: 32px;line-height: 1.25;letter-spacing: -0.05em;color: #010000;font-weight: 700;width: 100%;}
.cunsult-item .desc{font-size: 18px;line-height: 1.55;letter-spacing: -0.05em;color: #000;margin-top: 0.5em;width: 100%;}
.cunsult-item .desc span{display: block;}

.cunsult-item .title{width: 19.5%;height: 30%;position: absolute;display: flex;flex-direction: column;align-items: flex-start;justify-content: center; left: 50%; ;}
.cunsult-item .title.title01{top: 4%; transform: translateX(-730px); text-align: right;}
.cunsult-item .title.title02{top: 4%; transform: translateX(440px); text-align: left;}
.cunsult-item .title.title03{bottom: 4%; transform: translateX(-730px); text-align: right;}
.cunsult-item .title.title04{bottom: 4%; transform: translateX(440px); text-align: left;}

@media (min-width: 1100px) and (max-width:1340px){
    .process-wrap.consulting .header{margin: 200px auto 80px;}
    .cunsult-item .title{width: 19.5%;height: 30%;position: absolute;display: flex;flex-direction: column;align-items: flex-start;justify-content: center; left: auto; transform: none !important;}
    .cunsult-item .title.title01{top: -27%; left: 15.25%; text-align: center; justify-content: flex-end;}
    .cunsult-item .title.title02{top: -27%; right: 15.25%; text-align: center; justify-content: flex-end;}
    .cunsult-item .title.title03{bottom: -27%; left: 15.25%; text-align: center; justify-content: flex-start;}
    .cunsult-item .title.title04{bottom: -27%; right: 15.25%; text-align: center; justify-content: flex-start;}
}

@media (min-width: 768px) and (max-width: 1099px){
    .consult-wrap{padding-bottom: 80%;}
    .consult-wrap .cen img{width: 33.5%;}
    .process-wrap.consulting .header{margin: 150px auto 80px;}
    .cunsult-item .title{width: 19.5%;height: 30%;position: absolute;display: flex;flex-direction: column;align-items: flex-start;justify-content: center; left: auto; transform: none !important;}
    .cunsult-item .title.title01{top: -27%; left: 8.5%; text-align: center; justify-content: flex-end;}
    .cunsult-item .title.title02{top: -27%; right: 8.5%; text-align: center; justify-content: flex-end;}
    .cunsult-item .title.title03{bottom: -27%; left: 8.5%; text-align: center; justify-content: flex-start;}
    .cunsult-item .title.title04{bottom: -27%; right: 8.5%; text-align: center; justify-content: flex-start;}
    .cunsult-item .main-header{font-size: 24px;}
    .cunsult-item .desc{font-size: 14px;}
}

@media screen and (max-width: 767px){
    .consult-wrap{padding-bottom: 90%;}
    .consult-wrap .cen img{width: 45.5%;}
    .process-wrap.consulting .header{margin: 80px auto 80px;}
    .cunsult-item .title{width: 50%; height: 30%;position: absolute;display: flex;flex-direction: column;align-items: flex-start;justify-content: center; left: auto; transform: none !important;}
    .cunsult-item .title.title01{top: -27%; left: -10.5%; text-align: center; justify-content: flex-end;}
    .cunsult-item .title.title02{top: -27%; right: -10.5%; text-align: center; justify-content: flex-end;}
    .cunsult-item .title.title03{bottom: -27%; left: -10.5%; text-align: center; justify-content: flex-start;}
    .cunsult-item .title.title04{bottom: -27%; right: -10.5%; text-align: center; justify-content: flex-start;}
    .cunsult-item .main-header{font-size: 16px;}
    .cunsult-item .desc{font-size: 11px;}
}

/* 모션 */
.consult-wrap .bg{opacity: 0; transition: 1s;}
.consult-wrap .cen{opacity: 0; transition: 1s;}
.consult-wrap .cunsult-item .item{opacity: 0; transition: 1s;}

.consult-wrap.active .bg{opacity: 1; transition-delay: 0s;}
.consult-wrap.active .cen{opacity: 1; transition-delay: 01s;}
.consult-wrap.active .cunsult-item .item{opacity: 1; transition-delay: 2s;}

/* 개발/시행 */
.develop-item .item-wrap{display: grid; grid-template-columns: repeat(4, 1fr);}
.process-wrap .develop-item .item:not(:last-of-type)::before{display: none;}
.process-wrap .develop-item .item:not(:last-of-type)::after{display: none;}

.develop-item .item-wrap .item{padding: 50px 70px; max-width: none}
.develop-item .img-box {display: flex; justify-content: center;}
.develop-item .img-box img{max-width: 222px;}
.develop-item .desc-box{text-align: center; border: none; padding: 0;}
.develop-item .item-wrap .header{justify-content: center; margin: 25px 0 20px;}

.develop-item .item-wrap .item:nth-of-type(1),
.develop-item .item-wrap .item:nth-of-type(2),
.develop-item .item-wrap .item:nth-of-type(3),
.develop-item .item-wrap .item:nth-of-type(5),
.develop-item .item-wrap .item:nth-of-type(6),
.develop-item .item-wrap .item:nth-of-type(7) {
    border-right: 1px solid #ddd;
}
.develop-item .item-wrap .item:nth-of-type(-n+4) {
    border-bottom: 1px solid #ddd;
}

@media (min-width: 768px) and (max-width:1200px){
    .develop-item .item-wrap{grid-template-columns: repeat(2, 1fr); gap: 0;}
    .develop-item .item-wrap .item{padding: 20px 0 30px;}
    .develop-item .item-wrap .img-box img{width: 45%;}
    .develop-item .desc-box{min-height: auto;}

    .develop-item .item:nth-of-type(odd){border-right: 1px solid #ddd;}
    .develop-item .item:nth-of-type(even){border-right: none !important;}
    .develop-item .item:nth-of-type(3){border-bottom: 1px solid #ddd;}
    .develop-item .item:nth-of-type(4){border-bottom: 1px solid #ddd;}
    .develop-item .item:nth-of-type(5){border-bottom: 1px solid #ddd;}
    .develop-item .item:nth-of-type(6){border-bottom: 1px solid #ddd;}
    .process-wrap{margin: 0 auto 160px;}
}

@media (max-width: 767px){
    .develop-item .item-wrap{grid-template-columns: repeat(2, 1fr); gap: 0;}
    .develop-item .img-box img{width: 75%;}
    .develop-item .item-wrap .item{padding: 20px 0;}
    .develop-item .desc-box{min-height: auto; border: none;}
    .develop-item .item-wrap .desc{display: block;}
    .develop-item .item-wrap .header{margin: 10px auto;}

    .develop-item .item:nth-of-type(odd){border-right: 1px solid #ddd;}
    .develop-item .item:nth-of-type(even){border-right: none !important;}
    .develop-item .item:nth-of-type(3){border-bottom: 1px solid #ddd;}
    .develop-item .item:nth-of-type(4){border-bottom: 1px solid #ddd;}
    .develop-item .item:nth-of-type(5){border-bottom: 1px solid #ddd;}
    .develop-item .item:nth-of-type(6){border-bottom: 1px solid #ddd;}
    .process-wrap{margin: 0 auto 100px;}
}

/* 사업영역 하단 모션 */
.process-wrap > .header { opacity: 0; transform: translateY(50px); transition: 1s; }
.process-wrap > .header.active { opacity: 1; transform: none; }

/* 분양대행 */
.process-wrap .item-wrap .item{opacity: 0; transition: 1s;}
.process-wrap .item-wrap .item.active { opacity: 1; transform: none; }
.process-wrap .item-wrap .mid{opacity: 0; transition: 1s;}
.process-wrap .item-wrap .mid.active { opacity: 1; transform: none; }

/* 컨설팅 */
@media(min-width: 1240px){
    .process-wrap .item-wrap .item:nth-child(3n+1){transition-delay: 0s;}
    .process-wrap .item-wrap .item:nth-child(3n+2){transition-delay: 0.2s;}
    .process-wrap .item-wrap .item:nth-child(3n+3){transition-delay: 0.4s;}
}

@media(max-width: 1239px){
    .process-wrap .item-wrap .item:nth-child(2n+1){transition-delay: 0s;}
    .process-wrap .item-wrap .item:nth-child(2n+2){transition-delay: 0.3s;}
}

@media(max-width: 767px){
    .process-wrap .item-wrap .item{transition-delay: 0s;}
}

/* 입주대행 모션 */
.marketing-text .quotes1,
.marketing-text .quotes2,
.marketing-text p{opacity: 0; transform: translateY(35px); transition: 1.65s;}
.marketing-text.active .quotes1,
.marketing-text.active .quotes2,
.marketing-text.active p{opacity: 1; transform: none;}
.marketing-label {opacity: 0; transition: 1s;}
.marketing-label.active {opacity: 1;}

.marketing-item .img-box .title{opacity: 0; transform: translateX(35px); transition: 1s;}
.marketing-item.active .img-box .title{opacity: 1; transform: none;}

.marketing-item .img-box img{opacity: 0; transform: translateX(-35px); transition: 1s;}
.marketing-item.active .img-box img{opacity: 1; transform: none;}
.marketing-item .desc-wrapper .text{opacity: 1; transform: none;}

@media all and (min-width: 1240px){
    .marketing-item .text-wrap .lef{opacity: 0; transform: translateY(35px); transition: 1s;}
    .marketing-item .text-wrap.active .lef{opacity: 1; transform: none;}

    .marketing-item .text-wrap .item{opacity: 0; transform: translateX(35px); transition: 1s;}
    .marketing-item .text-wrap.active .item{opacity: 1; transform: none;}
}

@media all and (max-width: 1240px){
    .marketing-item .text-wrap .lef{opacity: 0; transform: translateX(35px); transition: 1s;}
    .marketing-item .text-wrap.active .lef{opacity: 1; transform: none;}

    .marketing-item .text-wrap .item{opacity: 0; transform: translateX(35px); transition: 1s;}
    .marketing-item .text-wrap.active .item{opacity: 1; transform: none;}
}
    .marketing-item .text-wrap.active .item:nth-of-type(1){transition-delay: 0.5s;}
    .marketing-item .text-wrap.active .item:nth-of-type(2){transition-delay: 0.7s;}
    .marketing-item .text-wrap.active .item:nth-of-type(3){transition-delay: 0.9s;}
    .marketing-item .text-wrap.active .item:nth-of-type(4){transition-delay: 1.1s;}
    .marketing-item .text-wrap.active .item:nth-of-type(5){transition-delay: 1.3s}

/* 시행 및 개발 */
@media(min-width: 1240px){
    .develop-item .item-wrap .item:nth-child(4n+1){transition-delay: 0s;}
    .develop-item .item-wrap .item:nth-child(4n+2){transition-delay: 0.2s;}
    .develop-item .item-wrap .item:nth-child(4n+3){transition-delay: 0.4s;}
    .develop-item .item-wrap .item:nth-child(4n+4){transition-delay: 0.6s;}
}


/* 포트폴리오 */
.board-searchbox,
.board-item-wrap { width: 100%; max-width: 1480px; padding: 0 20px; margin: 0 auto; } 

.board-item-wrap .img-box { position: relative; aspect-ratio: 1/0.75;} 
.board-item-wrap .img-box img { display: block; width: 100%; height: 100%; object-fit:  cover;} 
.board-item-wrap .img-box .dim{position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; background: rgba(0, 0, 0, 0.7); justify-content: center; align-items: center; transition: 0.3s; opacity: 0;}
.board-item-wrap .img-box .dim p{font-size: 24px; color: #fff; font-weight: 700;}
.board-item-wrap .img-box .dim .arr{display: block; width: 18px; height: 18px; background: url(../images/viewmore-arr.png) no-repeat center/contain; position: absolute; top: 32px; right: 32px;}

.board-item-wrap .item:hover .img-box .dim{opacity: 1;}

/* 검색 박스 */
.board-searchbox { display: flex; justify-content: center; margin-bottom: 60px; } 
.board-searchbox .btn-wrap { display: flex; justify-content: center; gap: 6px; background: #f7f7f7; width: 100%; height: 100%; padding: 30px 0; } 
.board-searchbox .btn-wrap *:focus { outline: 2px solid #b68639; } 
.select-wrap { position: relative; width: 180px; height: 60px; border: 1px solid #ddd; background: #fff; } 
.select-wrap select { width: 100%; height: 100%; border: none; background: transparent; appearance: none; -webkit-appearance: none; -moz-appearance: none; padding: 0 40px 0 16px; font-size: 16px; color: #000; outline: none; } 
.select-wrap span { position: absolute; width: 9px; height: 5px; background: url(../images/select-arr.png) no-repeat center/contain; top: 50%; right: 20px; transform: translateY(-50%); } 
.board-searchbox .input-wrap { display: flex; } 
.board-searchbox .input-wrap input { width: 360px; height: 60px; border: 1px solid #ddd; background: #fff; } 
.board-searchbox .search-btn { width: 90px; height: 60px; display: flex; justify-content: center; align-items: center; font-size: 16px; color: #fff; font-weight: 700; background: #b68639; border: none; gap: 8px; } 
.board-searchbox .search-btn i { width: 14px; height: 14px; background: url(../images/search-icon.png) no-repeat center/contain; display: block; transform: translateY(-1px); } 

/* 목록 */
.board-item-wrap { display: grid; grid-template-columns: repeat(3, 1fr); justify-content: space-between; gap: 60px;} 

.board-item-wrap .item .info-box{
    padding: 40px; border: 1px solid #ddd;
    border-top: none;
}
.board-item-wrap .name{font-size: 24px; font-weight: 700; letter-spacing: -0.05em; color: #000;}

.board-item-wrap .desc{ margin-top: 30px;}
.board-item-wrap .desc li{display: flex; align-items: center; font-size: 16px; color: #000;}
.board-item-wrap .type{font-size: 16px; line-height: 2.5; font-weight: 600; letter-spacing: -0.05em; color: #b68639; display: block; width: 110px;}

.board-item-wrap .more-btn-wrap{display: flex; align-items: center; justify-content: center; width: 100%; grid-column: 1/4; margin-bottom: 200px;}
.board-item-wrap .more-btn-wrap .more-btn{ display: flex; border:  1px solid #000; background: #fff; justify-content: center; align-items: center; font-size:18px; letter-spacing: -0.05em; color: #000; width: 220px; height: 70px; cursor: pointer;}

.content .subpage-title.detail{font-size: 60px; margin-bottom: 0;}

@media (min-width:1240px) and (max-width:1400px){
    .board-item-wrap{gap: 30px;}
}

@media (min-width:768px) and (max-width:1239px){
    .board-item-wrap{grid-template-columns: repeat(2, 1fr); gap: 30px;}
    .board-searchbox{margin-bottom: 20px;}
    .board-searchbox .btn-wrap{padding: 20px;}
    .board-item-wrap .more-btn-wrap{grid-column: 1/3;}
    .content { border-bottom: 1px solid #ddd; } 
    .content .top-title { color: #000; text-align: center; margin: 120px auto 60px; } 
    .content .subpage-title { font-size: 60px; font-weight: 700; margin-bottom: 30px; } 
    .content .subpage-subtitle { font-size: 14px; letter-spacing: 0.025em; } 
    .content .subpage-title.detail{font-size: 40px;}
}

@media (max-width:767px){
    .content .top-title { color: #000; text-align: center; margin: 100px auto 60px; } 
    .content .top-title.detail{margin: 100px auto 40px; padding: 0 20px;}
    .content .subpage-title {font-size: 40px;font-weight: 700;margin-bottom: 20px;} 
    .content .subpage-subtitle { font-size: 12px; letter-spacing: 0.025em; } 

    /* 검색박스 */
    .board-searchbox{margin-bottom: 20px;}
    .board-searchbox .btn-wrap{display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; padding: 20px;}
    .board-searchbox .input-wrap{grid-column: 1/3;}
    .select-wrap{width: 100%; height: 44px; font-size: 12px;}
    .select-wrap select{font-size: 12px;}

    .board-item-wrap{grid-template-columns: repeat(1, 1fr); gap: 25px;}
    .board-item-wrap .item .info-box{
        padding: 20px;
    }
    .board-searchbox .input-wrap { display: flex; } 
    .board-searchbox .input-wrap input {width: 100%; height: 44px;} 
    .board-searchbox .search-btn {width: 80px; height: 44px; font-size: 12px; gap: 4px;} 
    .board-searchbox .search-btn i {width: 10px; height: 10px; transform: translateY(-1px); } 


    .board-item-wrap .name{font-size: 18px;}
    .board-item-wrap .desc {margin-top: 20px;}
    .board-item-wrap .desc li{font-size: 12px;}
    .board-item-wrap .type{width: 80px; font-size: 12px;}
    .board-item-wrap .more-btn-wrap{grid-column: 1/2;margin-top: 25px;margin-bottom: 120px;}
    .board-item-wrap .more-btn-wrap .more-btn{font-size: 14px; height: 48px; width: 120px;}
    .content .subpage-title.detail{font-size: 28px;}
}

/* 포트폴리오 모션 */
.board-searchbox{opacity: 0; transform: translateY(50px); transition: 1s;}
.board-searchbox.active{opacity: 1; transform: none;}

.board-item-wrap .item{opacity: 0; transition: 1s; min-width: 0;}
.board-item-wrap .item.active{opacity: 1;}

.more-btn-wrap{opacity: 0; transform: translateY(50px); transition: 1s;}
.more-btn-wrap.active{opacity: 1; transform: none;}

@media (min-width: 1240px){
    .board-item-wrap .item:nth-child(3n+2){transition-delay: 0.2s;}
    .board-item-wrap .item:nth-child(3n+3){transition-delay: 0.4s;}
}

@media (min-width: 768px) and (max-width:1239px){
    .board-item-wrap .item:nth-child(even){transition-delay: 0.2s;}
}

/* 사업문의 */
.inquiry-wrap{max-width: 1480px; width: 100%; margin: 0 auto 200px; padding: 0 20px;}
.inquiry-wrap *:focus{outline: 2px solid #b68639;}
.inquiry-wrap .item{display: flex; align-items: center; min-height: 120px; padding: 0 20px; border-bottom: 1px solid #ddd;}
.inquiry-wrap .item:first-of-type{border-top: 1px solid #ddd;}
.inquiry-wrap .lef{width: 156px; display: block; flex-shrink: 0;}
.inquiry-wrap .lef p{font-size: 20px; color: #000; letter-spacing: -0.05em; padding: 0 30px; position: relative; font-weight: 700;}
.inquiry-wrap .lef p::before{width: 7px; height: 7px; position: absolute; content: ''; display: block; top: 50%; left: 0; transform: translateY(-50%) rotate(45deg); background: #000;}
.inquiry-wrap .lef p::after{width: 1px; height: 18px; position: absolute; content: ''; display: block; top: 50%; right: 0; transform: translateY(-50%); background: #000;}
.inquiry-wrap .rig {width: 100%; padding: 0 80px 0 30px;display:flex;}
.inquiry-wrap .rig input,
.inquiry-wrap .rig textarea{border: 1px solid #ddd; border-radius: 4px; min-height: 60px; padding: 20px; width: 100%;}
.inquiry-wrap .rig .text{max-width: 480px;}
.inquiry-wrap .rig textarea{width: 100%; height: 400px; resize: none;}

.inquiry-wrap .item.contents-wrap{ align-items: flex-start; padding: 30px 20px;}
.inquiry-wrap .item.contents-wrap .lef{margin-top: 20px;}

.inquiry-wrap .phone-number-box{display: flex; gap: 8px; align-items: center;}
.inquiry-wrap .phone-number-box input{text-align: center; max-width: 120px;}

.inquiry-wrap .capcha-wrap{display: flex; align-items: center; width: 100%;}
.inquiry-wrap .capcha-number{display: flex;width: 80px; align-items: center; font-weight: 700; color: #b68639;}
.inquiry-wrap .capcha-box{display: flex; align-items: center; gap: 20px;}
.inquiry-wrap .capcha-box input{max-width: 240px;}
.inquiry-wrap .capcha-box span{font-size: 20px; text-wrap: nowrap; color: #000;}

.inquiry-btn-wrap{display: flex; justify-content: center; margin-top: 80px; width: 100%; gap: 20px;}

.inquiry-btn-wrap .btn{width: 220px; height: 70px; font-size: 18px; font-weight: 700; letter-spacing: -0.05em; transition: 0.4s;}
.inquiry-btn-wrap .submit{color: #fff; background: #b68639; border: none;}
.inquiry-btn-wrap .reset{color: #000; background: #fff; border: 1px solid #000;}
.inquiry-btn-wrap .reset:hover{background: #000; color: #fff;}

@media (min-width: 768px) and (max-width:1239px){
    .inquiry-wrap .rig{padding: 0 10px 0 30px;}
    .inquiry-wrap .rig .text{max-width: none;}
}

@media (max-width:767px){
    .inquiry-wrap{margin: 0 auto 100px;}
    .inquiry-wrap .item{flex-direction: column;align-items: flex-start;gap: 10px;padding: 10px;justify-content: center;min-height: 100px;}
    .inquiry-wrap .lef,
    .inquiry-wrap .rig{padding: 0;}
    .inquiry-wrap .lef p{font-size: 16px;padding-left: 15px;}
    .inquiry-wrap .lef p::before{width: 6px; height: 6px; left: 2px;}
    .inquiry-wrap .lef p::after{display: none; left: 4px;}
    .inquiry-wrap .rig .text{max-width: none;}

    .inquiry-wrap .rig input{padding: 5px 15px;min-height: 40px; font-size: 14px;}
    .inquiry-wrap .rig textarea{padding: 15px;min-height: 40px; font-size: 14px;}
    .inquiry-wrap .item.contents-wrap .lef{margin: 0;}
    .inquiry-wrap .item.contents-wrap{padding: 20px 10px;}
    .inquiry-wrap .rig textarea{height: 200px;}
    .inquiry-wrap .capcha-wrap{gap: 5px; padding-bottom: 22px; position: relative; justify-content: space-between;}
    .inquiry-wrap .capcha-box{flex-direction: column; align-items: flex-start; gap: 6px; width: 75%;}
    .inquiry-wrap .capcha-number{font-size: 14px; width: 20%;}
    .inquiry-wrap .capcha-box span{font-size: 12px; position: absolute; left: 0; bottom: 0;}
    .inquiry-wrap .capcha-box input{max-width: none; width: 100%;}
    .inquiry-btn-wrap{gap: 10px; margin-top: 40px;}
    .inquiry-wrap .btn{font-size: 14px; height: 48px; width: 100%;}
}

.inquiry-wrap .item{opacity: 0; transition: 1s;}
.inquiry-wrap.active .item{opacity: 1;}

.inquiry-wrap.active .item:nth-child(1) { transition-delay: 0s; }
.inquiry-wrap.active .item:nth-child(2) { transition-delay: 0.2s; }
.inquiry-wrap.active .item:nth-child(3) { transition-delay: 0.4s; }
.inquiry-wrap.active .item:nth-child(4) { transition-delay: 0.6s; }
.inquiry-wrap.active .item:nth-child(5) { transition-delay: 0.8s; }
.inquiry-wrap.active .item:nth-child(6) { transition-delay: 1s; }
.inquiry-wrap.active .item:nth-child(7) { transition-delay: 1.2s; }

/* 채용안내 */

.recruit-img-box{max-width: 1440px; width: 100%; margin: 0 auto; background: url(../images/recruit-bg.png) no-repeat center/contain; display: flex; align-items: center; justify-content: center;} 
.recruit-img-box img{width: auto; height: auto; max-width: 100%;}

.recruit-txt-box{display: flex; max-width: 1480px; padding: 0 20px; margin: 100px auto 200px; justify-content: space-around; width: 100%; text-align: center;}
.recruit-txt-box > div{padding: 40px 0 35px; width: 100%;}
.recruit-txt-box > div ~ div{border-left: 1px solid #ddd;}
.recruit-txt-box .number{font-weight: 700; color: #b68639; font-size: 14px;}
.recruit-txt-box .title{font-weight: 700; color: #010000; font-size: 36px; letter-spacing: -0.05em; margin: 40px 0 50px;}
.recruit-txt-box .desc{letter-spacing: -0.05em; font-size: 20px; color: #000; line-height: 1.8;} 

.recruit-info-box{width: 100%; max-width: 1480px; padding: 0 20px; margin: 0 auto 200px;}
.recruit-info-box .header{font-size: 60px; font-weight: 700; letter-spacing: -0.05em; margin-bottom: 45px; color: #101010;}
.recruit-info-box .notice{font-size: 20px; font-weight: 400; letter-spacing: -0.05em; margin-bottom: 45px; color: #000; margin-bottom: 75px;}

.recruit-table .item{display: flex; align-items: center; min-height: 120px; padding: 0 20px; border-bottom: 1px solid #ddd;}
.recruit-table .item:first-of-type{border-top: 1px solid #ddd;}
.recruit-table .lef{width: 156px; display: block; flex-shrink: 0;}
.recruit-table .lef p{font-size: 20px; color: #000; letter-spacing: -0.05em; padding: 0 30px; position: relative; font-weight: 700;}
.recruit-table .lef p::before{width: 7px; height: 7px; position: absolute; content: ''; display: block; top: 50%; left: 0; transform: translateY(-50%) rotate(45deg); background: #000;}
.recruit-table .lef p::after{width: 1px; height: 18px; position: absolute; content: ''; display: block; top: 50%; right: 0; transform: translateY(-50%); background: #000;}
.recruit-table .rig {width: 100%; padding: 0 80px 0 30px;}
.recruit-table .rig p{font-size: 20px; letter-spacing: -0.05em; color: #000;}

@media all and (max-width: 1200px){
    .recruit-img-box img{width: 80%;}
    .recruit-txt-box{flex-direction: column; margin: 60px auto;}
    .recruit-txt-box > div{padding: 30px;}
    .recruit-txt-box > div ~ div{border-left: none; border-top: 1px solid #ddd;}

    .recruit-txt-box .number{font-size: 11px;}
    .recruit-txt-box .title{font-size: 26px; margin: 20px 0 15px}
    .recruit-txt-box .desc{font-size: 14px;}

    .recruit-info-box .header{font-size: 30px; margin-bottom: 22px;}
    .recruit-info-box .notice{font-size: 14px; line-height: 1.6; margin-bottom: 40px;}

    .recruit-info-box{margin: 0 auto 100px;}
    .recruit-info-box .item{flex-direction: column;align-items: flex-start;gap: 16px;padding: 10px;justify-content: center;min-height: 100px;}
    .recruit-info-box .lef,
    .recruit-info-box .rig{padding: 0;}
    .recruit-info-box .lef p{font-size: 14px;padding-left: 15px;}
    .recruit-info-box .lef p::before{width: 5px; height: 5px; left: 2px;}
    .recruit-info-box .lef p::after{display: none; left: 4px;}
    .recruit-info-box .rig .text{max-width: none;}

    .recruit-info-box .rig input{padding: 5px 15px;min-height: 40px; font-size: 14px;}
    .recruit-info-box .rig textarea{padding: 15px;min-height: 40px; font-size: 14px;}
    .recruit-table .rig p{font-size: 14px;}
}

.recruit-img-box{opacity: 0; transition: 1s;}
.recruit-img-box.active{opacity: 1;}

.recruit-img-box img{opacity: 0; transition: 1s; display: block; transform: translateY(60px);}
.recruit-img-box.active img{opacity: 1; transform: none; transition-delay: 0.5s;}

@media(min-width: 1200px){
.recruit-txt-box > div{opacity: 0; transform: translateY(60px); transition: 1s;}
.recruit-txt-box .active{opacity: 1; transform: none;}
.recruit-txt-box .lef.active{transition-delay: 0s;}
.recruit-txt-box .cen.active{transition-delay: 0.2s;}
.recruit-txt-box .rig.active{transition-delay: 0.4s;}
}
@media(max-width: 1200px){
.recruit-txt-box .lef{opacity: 0; transform: translateX(60px); transition: 1s;}
.recruit-txt-box .cen{opacity: 0; transform: translateX(-60px); transition: 1s;}
.recruit-txt-box .rig{opacity: 0; transform: translateX(60px); transition: 1s;}
.recruit-txt-box .active{opacity: 1; transform: none;}
.recruit-txt-box .lef.active{transition-delay: 0s;}
.recruit-txt-box .cen.active{transition-delay: 0.2s;}
.recruit-txt-box .rig.active{transition-delay: 0.4s;}
}

.recruit-info-box .header-wrap{opacity: 0; transform: translateY(60px); transition: 1s;}
.recruit-info-box .header-wrap.active{opacity: 1; transform: none;}

.recruit-table .item{opacity: 0; transition: 1s;}
.recruit-table.active .item{opacity: 1;}
.recruit-table.active .item:nth-child(1) { transition-delay: 0.2s; }
.recruit-table.active .item:nth-child(2) { transition-delay: 0.4s; }

/* 게시판 상세보기 */
.board-detail-box{max-width: 1480px; padding: 0 20px; margin: 0 auto 200px;}

.board-detail-box .img-box{opacity: 0; transform: translateY(50px); transition: 1s;}
.board-detail-box .img-box.active{opacity: 1; transform: none;}

.detail-item-wrap {display: grid; grid-template-columns: repeat(2, 1fr); margin-top: 80px;}
.detail-item-wrap .item{display: flex; align-items: center; min-height: 120px; padding: 0 20px; border-bottom: 1px solid #ddd;}
.detail-item-wrap .item:first-of-type{border-top: 1px solid #ddd;}
.detail-item-wrap .item:nth-of-type(2){border-top: 1px solid #ddd;}
.detail-item-wrap .lef{width: 162px; display: block; flex-shrink: 0;}
.detail-item-wrap .lef p{font-size: 20px;color: #000;letter-spacing: -0.05em;padding: 0 0 0 30px;position: relative;font-weight: 700;}
.detail-item-wrap .lef p::before{width: 7px; height: 7px; position: absolute; content: ''; display: block; top: 50%; left: 0; transform: translateY(-50%) rotate(45deg); background: #000;}
.detail-item-wrap .lef p::after{width: 1px; height: 18px; position: absolute; content: ''; display: block; top: 50%; right: 0; transform: translateY(-50%); background: #000;}
.detail-item-wrap .rig {width: 100%; padding: 0 80px 0 30px;}
.detail-item-wrap .rig p{font-size: 20px; letter-spacing: -0.05em; color: #000;}

.detail-btn-wrap{display: flex; justify-content: center; margin-top: 80px; width: 100%; gap: 20px;}
.detail-btn-wrap .btn{width: 220px; height: 70px; font-size: 18px; font-weight: 700; letter-spacing: -0.05em; transition: 0.4s; display: flex; align-items: center; justify-content: center;}
.detail-btn-wrap .list{color: #000; background: #fff; border: 1px solid #000;}
.detail-btn-wrap .list:hover{background: #000; color: #fff;}

@media all and (max-width: 1200px){
    .board-detail-box{margin: 0 auto 100px;}
    .subpage-title.detail{font-size: 32px; line-height: 1.4;}
    .detail-item-wrap{margin: 60px auto 0; grid-template-columns: repeat(1, 1fr);}
    .detail-item-wrap .item{flex-direction: column;align-items: flex-start;gap: 16px;padding: 10px;justify-content: center;min-height: 80px; overflow: hidden;}
    .detail-item-wrap .item:first-of-type{border-top: 1px solid #ddd;}
    .detail-item-wrap .item:nth-of-type(2){border-top: none;}
    .detail-item-wrap .item:last-of-type{display: none;}
    .detail-item-wrap .lef,
    .detail-item-wrap .rig{padding: 0;}
    .detail-item-wrap .lef p{font-size: 14px;padding-left: 15px;}
    .detail-item-wrap .lef p::before{width: 5px; height: 5px; left: 2px;}
    .detail-item-wrap .lef p::after{display: none; left: 4px;}
    .detail-item-wrap .rig .text{max-width: none;}
    .detail-item-wrap .rig input{padding: 5px 15px;min-height: 40px; font-size: 14px;}
    .detail-item-wrap .rig textarea{padding: 15px;min-height: 40px; font-size: 14px;}
    .detail-item-wrap .rig p{font-size: 14px;}
    .detail-btn-wrap{margin-top: 40px;}
    .detail-btn-wrap .btn{font-size: 14px; height: 48px; width: 100%;}
}


.detail-item-wrap .item > div{opacity: 0; transform: translateY(50px); transition: 1s;}
.detail-item-wrap.active .item div{opacity: 1; transform: none;}
.detail-item-wrap.active .item:nth-child(1) > div { transition-delay: 0s; }
.detail-item-wrap.active .item:nth-child(2) > div { transition-delay: 0.2s; }
.detail-item-wrap.active .item:nth-child(3) > div { transition-delay: 0.4s; }
.detail-item-wrap.active .item:nth-child(4) > div { transition-delay: 0.6s; }
.detail-item-wrap.active .item:nth-child(5) > div { transition-delay: 0.8s; }
.detail-item-wrap.active .item:nth-child(6) > div { transition-delay: 1s; }
.detail-item-wrap.active .item:nth-child(7) > div { transition-delay: 1.2s; }
.detail-item-wrap.active .item:nth-child(8) > div { transition-delay: 1.4s; }
.detail-item-wrap.active .item:nth-child(9) > div { transition-delay: 1.6s; }
.detail-item-wrap.active .item:nth-child(10) > div { transition-delay: 1.8s; }
.detail-item-wrap.active .item:nth-child(11) > div { transition-delay: 2s; }