@charset "utf-8";

/* 
 * content CSS Document
 *
 */

/* sub-visual */
.area-subVisual {position:relative; overflow:hidden; height:500rem; box-sizing:border-box; text-align: center;}
.area-subVisual > .inr {padding-top:220rem;}
.area-subVisual h2 {font-size: 55rem; font-weight:700; color: #fff;}
.area-subVisual[data-sublayout="about"] .sub-vusla__bg {background-image:url(/images/content/sub-visual01.jpg);}
.area-subVisual[data-sublayout="business"] .sub-vusla__bg {background-image:url(/images/content/sub-visual02.jpg);}
.area-subVisual[data-sublayout="result"] .sub-vusla__bg {background-image:url(/images/content/sub-visual03.jpg);}
.area-subVisual[data-sublayout="esg"] .sub-vusla__bg {background-image:url(/images/content/sub-visual04.jpg);}
.area-subVisual[data-sublayout="recruit"] .sub-vusla__bg {background-image:url(/images/content/sub-visual05.jpg);}
.area-subVisual[data-sublayout="customer"] .sub-vusla__bg {background-image:url(/images/content/sub-visual06.jpg);}
.area-subVisual[data-sublayout="contact"] .sub-vusla__bg {background-image:url(/images/content/sub-visual07.jpg);}
.area-subVisual .sub-vusla__bg{position:absolute;opacity:1 !important;top:0;left:0;z-index:-1;width:100%;height:100%;box-sizing:border-box;background-size: cover;background-position: 50% 50%;}
/* navigation */
.sub-navigation {margin-top:40rem}
.sub-navigation ul {display:flex; align-items: center; gap: 60rem; justify-content: center;  overflow:hidden;}
.sub-navigation ul li{position:relative; line-height:1; font-size: 17rem; font-weight:300; color:#fff;}
.sub-navigation ul li img{height:16rem; vertical-align: top;}
.sub-navigation ul li i{display:none;}
.sub-navigation ul li::after{content:""; position:absolute; top:50%; left:-30rem; transform: translateY(-50%); width:7rem; height:11rem; background:url(/images/common/ic-nav-arrow_w.png) no-repeat; background-size: contain; opacity: 0.7;}
.sub-navigation ul li:first-child{padding:0;}
.sub-navigation ul li:first-child:after{opacity:0;}
.area-subVisual[data-sublayout="result"] .sub-navigation [data-subtitle="depth02"] {display: none;}
/* lnb */
.area-lnb {width: 100%; height: 80rem; white-space: nowrap; background:#1f1f26;}
.area-lnb .lnb {height: 100%;}
.area-lnb .lnb ul {display: flex; height: 100%; align-items: center; justify-content: center;}
.area-lnb .lnb ul li {height: 100%;}
.area-lnb .lnb ul li a {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 0 50rem; font-size: 18rem; font-weight: 500; color: var(--white); opacity: 0.3;}
.area-lnb .lnb ul li a.on {position: relative; opacity: 1;}
.area-lnb .lnb ul li a.on::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 2rem; background: var(--white);}
/* common */
#content {padding: 120rem 0;}
.sub-title {text-align: center; margin-bottom:50rem;}
.sub-title em {font-size: var(--font18); font-weight:700; display:block; margin-bottom: 25rem; text-transform: uppercase; opacity: 0.3;  letter-spacing: -0.01em;}
.sub-title h2 {font-size: var(--font40); font-weight:700;}
.sub-title h3 {font-size: var(--font35); font-weight:700;}
.dot-list dd {padding-left: 16rem; position: relative;}
.dot-list dd::before {content: ''; position: absolute; top: 12rem; left: 0; width: 4rem; height: 4rem; border-radius: 50%; background: #bbb;}
.dot-list dd + dd {margin-top: 7rem;}
.num-list dd {padding-left:30rem; position: relative; counter-increment: list-number;}
.num-list dd::before {content:counter(list-number); position: absolute; top: 3rem; left: 0; width: 18rem; height: 18rem; font-size: 10rem; font-weight: 600; text-align: center; line-height: 18rem; border-radius: 50%; color: #fff; background: #222;}
.num-list dd + dd {margin-top: 7rem;}
.tab-container {overflow: hidden; visibility: hidden; height: 0;}
.tab-container.active {overflow: visible; visibility: visible; height: 100%;}
.tab-menu {display:inline-flex; align-items: center; padding: 8rem; border-radius: 40rem; border: 2rem solid #eee; margin-top: 40rem;}
.tab-menu li {cursor: pointer;  display: inline-flex; align-items:center; justify-content:center; padding: 20rem 30rem; font-size: 17rem; font-weight: 500; box-sizing: border-box; color: #a9a9a9; border-radius: 35rem;}
.tab-menu li.active {background: var(--point); color: var(--white); box-shadow: 3px 3px 10px 0 rgb(0 0 0 / 8%);}
.sub_h4 {font-size: var(--font32); font-weight: 700;}
.sub_h5 {font-size: var(--font25); font-weight: 700;}

@media (max-width: 767px){
    #content {padding: 80rem 0;}
    .area-lnb .lnb ul li a {padding: 0 30rem;}
    .sub-navigation ul {gap: 40rem; padding: 15rem 25rem;}                         
    .sub-navigation ul li::after {left: -20rem;}
    .sub-title {margin-bottom: 30rem;}
    .sub-title em {font-weight: 600; margin-bottom: 20rem;}
    .tab-menu {margin-top: 30rem;}
}
@media (max-width: 480px){
     #content {padding: 60rem 0;}
    .area-subVisual {height: 450rem;}
    .area-subVisual > .inr {padding-top: 200rem;}
    .area-subVisual h2 {font-size: 45rem;}
    .area-lnb {height: 70rem;}
	.area-lnb .lnb{overflow-x: auto;}
    .area-lnb .lnb ul {display: flex; justify-content:center; white-space: nowrap;}
	.area-lnb.full .lnb ul{justify-content:flex-start;}
    .area-lnb .lnb ul li a {padding: 0 20rem; font-size: 15rem; font-weight: 400;}
    .tab-menu {padding: 6rem;}
    .tab-menu li {font-size: 15rem; padding: 15rem 25rem;}
    .dot-list dd {padding-left: 13rem;}
    .num-list dd::before {width: 3rem; height: 3rem; top: 10rem;}
}

/* 인사말 */
[data-sub="about01"] {overflow-x: hidden;}
[data-sub="about01"] .sub-title {text-align: left;}
[data-sub="about01"] .sub-title h2 {line-height: 1.45;}
[data-sub="about01"] .sub-contents {display: flex; align-items: center; justify-content: space-between; gap: 30rem;}
[data-sub="about01"] .ab01_img {width: 38%; position: relative; margin-right:30rem}
[data-sub="about01"] .ab01_img .img {width: 100%;}
[data-sub="about01"] .ab01_img .img.mo {display: none;}
[data-sub="about01"] .ab01_img img.logo {height: 330rem; position: absolute; bottom: 30rem; right:-200rem; z-index: -10; object-fit: contain; opacity: 0.1;}
[data-sub="about01"] .ab01_txt {width: 55%;}
[data-sub="about01"] .ab01_txt .tit {margin-bottom:40rem;}
[data-sub="about01"] .ab01_txt .tit em {font-size: var(--font18); font-weight:700; display:block; margin-bottom: 30rem; text-transform: uppercase; opacity: 0.3}
[data-sub="about01"] .ab01_txt .tit h3 {font-size:var(--font35); font-weight: 400; line-height: 1.5; letter-spacing: -0.015em;}
[data-sub="about01"] .ab01_txt .tit strong {display: block; font-weight: 700;}
[data-sub="about01"] .ab01_txt dd {font-size: var(--font18); color: #555; line-height: 1.7;}
[data-sub="about01"] .ab01_txt dd + dd {margin-top: 25rem; transition-delay: .2s;}
[data-sub="about01"] .ab01_txt .ceo {font-size: var(--font20); margin-top: 40rem; display: flex; align-items: center; font-weight: 600; gap: 15rem; color: var(--black);}
[data-sub="about01"] .ab01_txt .ceo span {font-size: 40rem; font-weight: 500; line-height: 1; margin-top: -2rem; font-family: 'Kanginhan';}

/* 연혁 */
[data-sub="about02"] {}
[data-sub="about02"] .ab02Img {}
[data-sub="about02"] .ab02Img img {width: 100%; max-width: 100%;}
[data-sub="about02"] .hisTop {position: relative; display: flex; flex-direction: column; gap: 5rem; align-items: center; justify-content: center; width: 200rem; height: 200rem; border-radius: 50%; background: -webkit-linear-gradient( -21deg, #28aeff 0%, #0099f8 100%); box-shadow: 0px 8px 25px 4px rgba(40, 174, 255, 0.25); color: var(--white); font-size:35rem; font-weight: 700; margin: 0 auto;}
[data-sub="about02"] .hisTop::before {content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 250rem; height: 250rem; border-radius: 50%; background: rgba(40, 174, 255, 0.1); z-index: -1;  animation: circle 1s infinite alternate;}
[data-sub="about02"] .hisCon {position: relative; display: flex; flex-direction: column; padding-bottom: 40rem;}
[data-sub="about02"] .hisCon::before {content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 1rem; height: 100%; background: #ddd;}
[data-sub="about02"] .hisCon .his-list {position: relative; width: 50%; padding-top: 80rem;}
[data-sub="about02"] .hisCon .his-list:nth-child(n+2) {transition-delay: .5s;}
[data-sub="about02"] .hisCon .his-list:nth-child(1) {padding-top: 100rem;}
[data-sub="about02"] .hisCon .his-list:nth-child(odd) {text-align: right; align-self: flex-start; }
[data-sub="about02"] .hisCon .his-list:nth-child(even) {align-self: flex-end;}
[data-sub="about02"] .hisCon .his-list:nth-child(even) .his-year, .hisCon .his-list:nth-child(even) .his-date {padding-left: 100rem;}
[data-sub="about02"] .hisCon .his-list:nth-child(odd) .his-year, .hisCon .his-list:nth-child(odd) .his-date {padding-right: 100rem;}
[data-sub="about02"] .hisCon .his-year {position: relative; font-size: var(--font40); font-style: italic; font-weight:800; margin-bottom: 25rem;}
[data-sub="about02"] .hisCon .his-year::before {content: ''; position: absolute; top: 50%; transform: translateY(-50%); width: 12rem; height:12rem; border-radius: 50%; background: var(--point);}
[data-sub="about02"] .hisCon .his-list:nth-child(even) .his-year::before {left:-6rem;}
[data-sub="about02"] .hisCon .his-list:nth-child(odd) .his-year::before {right: -6rem; background: #fff; border: 2rem solid var(--point);}
[data-sub="about02"] .hisCon .his-date dd {font-size: var(--font18); line-height: 1.7; color: #555;}
[data-sub="about02"] .hisCon .his-date dd + dd {margin-top: 5rem;}

/* 조직도 */
[data-sub="about03"] {}
[data-sub="about03"] .orgChart {position: relative; text-align: center; font-size:var(--font18); padding: 80rem 50rem; border: 1rem solid #ddd;}
[data-sub="about03"] .orgChart::before {content: ''; position: absolute; top: 80rem;left: 50%; transform: translateX(-50%); width: 1rem; height: 32%; background: #ddd; z-index: -1;}
[data-sub="about03"] .orgChart .org1 {width:30%; max-width: 300rem; margin: 0 auto; border:2rem solid var(--point);}
[data-sub="about03"] .orgChart .org1 h4 {padding: 20rem 0; font-size:var(--font20); font-weight:500; color: var(--white); text-align: center;background: -webkit-linear-gradient( -90deg, #222088 0%, #22216d 100%);}
[data-sub="about03"] .orgChart .org1 p {padding: 20rem 0; font-size:var(--font18); display: flex; justify-content: center; align-items:center; gap: 8rem; background: var(--white);}
[data-sub="about03"] .orgChart .org1 span {font-weight: 600;}
[data-sub="about03"] .orgChart .org2 {display: grid; grid-template-columns: repeat(4,1fr); margin-top: 80rem;}
[data-sub="about03"] .orgChart .org2 span {font-weight: 600; display: flex; align-items: center; justify-content: center; width: 100%; padding: 20rem 0; background: -webkit-linear-gradient( -90deg, #28aeff 0%, #0099f8 100%); color: var(--white);}
[data-sub="about03"] .orgChart .org2 > li {position: relative; padding: 60rem 18rem 0;}
[data-sub="about03"] .orgChart .org2 > li:nth-child(1)::after {display: none;}
[data-sub="about03"] .orgChart .org2 > li::before{position:absolute; content:''; top:0; left:50%; width:1rem; height:60rem; background:#ddd; z-index:-10;}
[data-sub="about03"] .orgChart .org2 > li::after{position:absolute; content:''; top:0; left:0; width:100%; height:1rem; transform:translate(-50%, 0); background:#ddd;}
[data-sub="about03"] .orgChart .org3 {background:var(--white); border:2rem solid #28aeff; border-top: 0; font-size: var(--font16);}
[data-sub="about03"] .orgChart .org3 li {padding: 18rem 0; border-bottom: 1px dashed #ddd;}
[data-sub="about03"] .orgChart .org3 li:last-child {border-bottom: 0;}
[data-sub="about03"] .orgList {margin-top: 80rem;}
[data-sub="about03"] .orgList h5 {font-size: var(--font30); font-weight: 700; margin-bottom: 20rem;}
[data-sub="about03"] .orgList th, [data-sub="about03"] .orgList td {font-size:var(--font17); padding: 20rem 10rem; box-sizing: border-box;}

/* 지명원 */
[data-sub="about04"] .sub-title {}
[data-sub="about04"] .sub-contents {position: relative; padding:0 40rem 80rem; overflow: hidden;}
[data-sub="about04"] .sub-contents::after {content: ''; position: absolute; bottom: -60rem; right: -100rem; width: 380rem; height:380rem; background:  url(/images/content/symbol.png) no-repeat; background-size: contain; z-index: -1; opacity: 0.09;}
[data-sub="about04"] .sub-contents::before {content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height:65%; background: #f8f8f8 url(/images/content/background.jpg) repeat; z-index: -10;}
[data-sub="about04"] .ab04Img {text-align: center;}
[data-sub="about04"] .ab04Img img {object-fit: contain;}
[data-sub="about04"] .ab04Info {text-align: center; margin-top:30rem;}
[data-sub="about04"] .ab04Info dt {font-size: var(--font35); line-height: 1.5; font-weight: 700; letter-spacing: -0.01em; margin-bottom: 30rem;}
[data-sub="about04"] .ab04Info dd {font-size:var(--font18); font-weight: 300; line-height: 1.7; }
[data-sub="about04"] .ab04Btn {display:flex; justify-content: center; align-items: center; gap: 10rem; margin-top: 40rem;}
[data-sub="about04"] .ab04Btn i {font-size: 18rem;}
[data-sub="about04"] .ab04_file {display: flex; justify-content: space-between; align-items: center; width: 220rem; height: 62rem; padding: 0 20rem; box-sizing: border-box; font-weight: 400; background: #aaa; color: var(--white); transition: .3s;}
[data-sub="about04"] .ab04_file:hover {background: var(--point); color: var(--white);}

/* 오시는길 */
[data-sub="about05"] .sub-contents{position: relative; margin-top: 50rem;}
[data-sub="about05"] .mapImg { margin: 0 auto!important;max-width: calc(var(--inr-wide) * 1rem); width: calc(var(--inr-width) * 100%); border-radius: 10rem; overflow: hidden;}
[data-sub="about05"] .root_daum_roughmap {width: 100%; height: 650rem; border: 1rem solid #e5e5e5;}
[data-sub="about05"] .map_border, [data-sub="about05"] .root_daum_roughmap .cont , [data-sub="about05"] .root_daum_roughmap .wrap_controllers {display: none;}
[data-sub="about05"] .mapList {width:470rem; position: absolute; top:50% ; left: 150rem; transform: translateY(-50%); background: #0044ab; z-index: 15; color: var(--white); border-radius: 15rem; overflow: hidden;}
[data-sub="about05"] .mapList p {display: flex; align-items: center; gap: 10rem; height: 80rem; padding: 0 30rem; font-size: var(--font22); background:#003688;}
[data-sub="about05"] .mapList p img {height: 42rem;}
[data-sub="about05"] .mapList ul {overflow: hidden; padding:30rem 30rem; font-size: var(--font18); box-sizing: border-box;}
[data-sub="about05"] .mapList li {}
[data-sub="about05"] .mapList li em {display: flex; align-items: center; gap: 10rem; font-weight: 400; margin-bottom: 15rem;}
[data-sub="about05"] .mapList li em i {font-size: 18rem;}
[data-sub="about05"] .mapList li + li {margin-top: 25rem;}

@media (max-width: 1080px){
    [data-sub="about01"] .sub-contents {align-items: flex-start; gap: 50rem;}
    [data-sub="about01"] .ab01_txt {width: 60%;}
    [data-sub="about01"] .ab01_img {width: 38%; margin-right: 0;}
    [data-sub="about01"] .ab01_img img.logo {bottom: -200rem; right: -50rem;}
    [data-sub="about02"] .hisCon .his-list:nth-child(even) .his-year, .hisCon .his-list:nth-child(even) .his-date {padding-left: 50rem;}
    [data-sub="about02"] .hisCon .his-list:nth-child(odd) .his-year, .hisCon .his-list:nth-child(odd) .his-date {padding-right: 50rem;}
    [data-sub="about03"] .orgChart {padding: 60rem 30rem}
    [data-sub="about03"] .orgChart::before {top: 60rem; height: 30%;}
    [data-sub="about03"] .orgChart .org2 {margin-top:50rem;}
    [data-sub="about03"] .orgChart .org2 > li {padding: 40rem 10rem 0;}
    [data-sub="about05"] .mapImg {}
    [data-sub="about05"] .root_daum_roughmap {height: 500rem; margin-bottom: 30rem;}
    [data-sub="about05"] .mapList {padding: 25rem; background: #f8f8f8; position: relative; left: 0; top: auto; bottom: 0; width: calc(var(--inr-width) * 100%); transform: none; border-radius: 10rem; color: var(--black);}
    [data-sub="about05"] .mapList p {padding: 0; background: var(--white); font-size: 25rem; font-weight: 600; height: 100%; display: none;}
    [data-sub="about05"] .mapList ul {padding: 0;}
    [data-sub="about05"] .mapList li {display: flex; padding: 28rem 20rem;}
    [data-sub="about05"] .mapList li + li {margin-top: 0;  border-top: 1rem dashed #ddd;}
    [data-sub="about05"] .mapList li em {width: 150rem; margin-bottom: 0; font-weight: 600; gap: 15rem;}
    [data-sub="about05"] .mapList li em i {font-size: 22rem; color: #bbb;}
}
@media (max-width: 767px){
    [data-sub="about01"] .sub-contents {flex-direction: column-reverse;}
    [data-sub="about01"] .ab01_txt .tit em {margin-bottom: 20rem; font-size: 14rem; font-weight:600;}
    [data-sub="about01"] .ab01_txt {width: 100%;}
    [data-sub="about01"] .ab01_txt dd {line-height: 1.6;}
    [data-sub="about01"] .ab01_txt dd + dd {margin-top: 15rem;}
    [data-sub="about01"] .ab01_img {width: 100%; height: 350rem;}
    [data-sub="about01"] .ab01_img .img.mo {display: block; height: 100%; object-fit: cover;}
    [data-sub="about01"] .ab01_img .img.pc {display: none;}
    [data-sub="about01"] .ab01_img img.logo {display: none;}

    [data-sub="about02"] .ab02Img {height: 300rem;}
    [data-sub="about02"] .ab02Img img {height: 100%; object-fit: cover;}
    [data-sub="about02"] .hisCon .his-list {padding-top: 40rem;}
    [data-sub="about02"] .hisCon .his-list:nth-child(1) {padding-top: 40rem;}

    [data-sub="about03"] .orgChart .org1 {width: 35%;}
    [data-sub="about03"] .orgChart .org1 h4 {padding: 15rem 0}
    [data-sub="about03"] .orgChart .org1 p {padding: 15rem 0}
    [data-sub="about03"] .orgChart .org2 span {padding: 15rem 0}
    [data-sub="about03"] .orgChart .org3 li {padding: 15rem 0}
    [data-sub="about03"] .orgList {margin-top: 50rem;}
    [data-sub="about03"] .orgList th, [data-sub="about03"] .orgList td {padding: 15rem 5rem;}
    [data-sub="about04"] .ab04Img {margin: 0 auto; width: 88%;}
    [data-sub="about04"] .ab04Info {margin-top:10rem;}
    [data-sub="about04"] .sub-contents::after {bottom: -80rem; right: -80rem; width: 300rem; height:300rem;}
    [data-sub="about05"] .root_daum_roughmap {margin-bottom: 20rem;}
}
@media (max-width: 480px){
    [data-sub="about01"] .sub-contents {gap: 40rem;}
    [data-sub="about01"] .ab01_txt .tit h3 {font-weight: 500;}
    [data-sub="about01"] .ab01_txt .ceo span {font-size: 30rem;}
    [data-sub="about01"] .ab01_txt .ceo {margin-top: 30rem;}
    [data-sub="about01"] .ab01_img {height: auto;}
    [data-sub="about01"] .ab01_img .img.mo {display: none;}
    [data-sub="about01"] .ab01_img .img.pc {display: block;}

    [data-sub="about02"] .ab02Img {height: 200rem;}
    [data-sub="about02"] .hisCon::before {left: 0; transform: translateX(0);}
    [data-sub="about02"] .hisCon .his-list {padding-top: 30rem; width: 100%;}
    [data-sub="about02"] .hisCon .his-list:nth-child(even) .his-year, .hisCon .his-list:nth-child(even) .his-date {padding-left:20rem}
    [data-sub="about02"] .hisCon .his-list:nth-child(odd) .his-year, .hisCon .his-list:nth-child(odd) .his-date {padding-right: 0; padding-left:20rem;}
    [data-sub="about02"] .hisCon .his-list:nth-child(odd) {text-align: left; align-self: flex-start; }
    [data-sub="about02"] .hisCon .his-year {font-size: 20rem; margin-bottom: 10rem;}
    [data-sub="about02"] .hisCon .his-year::before {right: auto; left: 0; width: 8rem; height: 8rem;}
    [data-sub="about02"] .hisCon .his-list:nth-child(odd) .his-year::before {border: 1rem solid var(--point); left: -4rem;}
    [data-sub="about02"] .hisCon .his-list:nth-child(even) .his-year::before {left: -4rem;}
    [data-sub="about02"] .hisCon .his-date dd {line-height: 1.5;}

    [data-sub="about03"] .orgChart {padding: 0; border: 0; margin-top: 30rem;}
    [data-sub="about03"] .orgChart::before {top:0; height:28%;}
    [data-sub="about03"] .orgChart .org1 {width:55%;}
    [data-sub="about03"] .orgChart .org1 h4 {padding: 12rem 0; font-weight: 400;}
    [data-sub="about03"] .orgChart .org2 {grid-template-columns: repeat(2,1fr); margin-top: 30rem;}
    [data-sub="about03"] .orgChart .org2 > li {padding: 30rem 5rem 0;}
    [data-sub="about03"] .orgChart .org2 > li:nth-child(n+3) {padding: 20rem 5rem 0;}
    [data-sub="about03"] .orgChart .org2 > li:nth-child(n+3):before{display: none;}
    [data-sub="about03"] .orgChart .org2 > li:nth-child(n+3)::after{display: none;}
    [data-sub="about03"] .orgChart .org2 span {font-weight: 400; padding: 12rem 0;}
    [data-sub="about03"] .orgChart .org3 li {padding: 10rem 0;}

    [data-sub="about04"] .sub-contents {padding: 0 30rem 60rem;}
    [data-sub="about04"] .sub-contents::before {height: 80%;}
    [data-sub="about04"] .ab04Img {width: 100%;}
    [data-sub="about04"] .ab04Info dt {font-size: 18rem; margin-bottom: 20rem;}
    [data-sub="about04"] .ab04Info dd {font-size: 15rem; line-height: 1.5;}
    [data-sub="about04"] .ab04Btn {gap: 6rem; margin-top: 30rem;}
    [data-sub="about04"] .ab04_file {width: calc(100%/2); height: 48rem; padding: 0 15rem; font-size: 14rem;}
    [data-sub="about04"] .ab04_file i {font-size: 15rem;}
    [data-sub="about05"] .root_daum_roughmap {height:350rem; margin-bottom:10rem;}
    [data-sub="about05"] .mapImg {border-radius: 0;}
    [data-sub="about05"] .mapList {padding: 10rem 20rem; border-radius: 0;}
    [data-sub="about05"] .mapList li {padding: 15rem 0; flex-direction: column;}
    [data-sub="about05"] .mapList li em {width: 100%; margin-bottom: 15rem; gap: 10rem;}
    [data-sub="about05"] .mapList li em i {font-size: 16rem;}
}

/* 사업소개 */
.area_business {}
.area_business .buList {display: grid; grid-template-columns: repeat(3,1fr); gap: 50rem 30rem;}
.area_business .buList li {}
.area_business .buList li a {display: block; border: 1rem solid #e5e5e5;}
.area_business .buList li:hover .img .hover {width:90rem; height:90rem;  opacity: 1;}
.area_business .buList li:hover .img img {filter: brightness(0.5);}
.area_business .buList .img {position: relative; display: flex; align-items: center; justify-content: center; background: #f5f5f5; width: 100%; aspect-ratio : 45/ 30; transition: .3s;}
.area_business .buList .img img {width: 100%; height: 100%; object-fit: contain;}
.area_business .buList .img .hover {display:flex;align-items:center; justify-content:center; position:absolute; width: 0; height: 0; opacity: 0; transition: .3s; top:50%; left:50%;transform:translate(-50%,-50%); border-radius:50%; background:var(--second); color:var(--white); z-index: 5;}
.area_business .buList .img .hover i {font-size: 25rem; font-weight: 300;}
.area_business .buList .info {position: relative; padding: 35rem 30rem; border-top: 1rem dotted #ddd;}
.area_business .buList .info dt {font-size: 22rem; font-weight: 700; margin-bottom: 30rem;}
.area_business .buList .info dd {font-size: var(--font17); display: flex; align-items: center; }
.area_business .buList .info dd p {display: block; width:60rem; font-weight:600;}
.area_business .buList .info dd span {color: #888;}
.area_business .buList .info dd + dd {margin-top: 18rem;}
.area_business .buList .info em {position: absolute; right: 20rem; top: -20rem; display: inline-block; background: var(--point); box-sizing: border-box; padding: 15rem 20rem; color: var(--white);}
.buList-view-img{display:none;}


/* 진행중 현장 팝업 */
.site-popup {display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.6); z-index: 99;}
.site-popup__box {position: absolute; top: 50%; left: 50%; width: 640rem; transform: translate(-50%, -50%); background: var(--white); }
.site-popup__boxImg {aspect-ratio: 16/10; width: 100%; background: #ddd;}
.site-popup__boxImg img {object-fit: cover; width: 100%; height: 100%;}
.site-popup__boxImg .swiper {position: relative;}
.site-popup__boxImg .swiper-slide{height:430rem;}
.site-popup__boxImg .swiper-button-next, .site-popup__boxImg .swiper-button-prev {color: var(--white);}
.site-popup__boxImg .swiper-pagination {width: 100%;}
.site-popup__boxImg .swiper-pagination-bullet {background: var(--white);}
.site-popup__info {position: relative; padding: 50rem 35rem; box-sizing: border-box; overflow: hidden;}
.site-popup__info::before {content: ''; position: absolute; right: -40rem; bottom: 10rem; background: url(/images/content/symbol.png) no-repeat; width: 250rem; height: 250rem; background-size: contain; opacity: 0.08}
.site-popup__info em {font-size: var(--font17); font-weight: 500; display:inline-block; padding: 10rem 22rem; background: var(--second); color:var(--white); margin-bottom: 20rem;}
.site-popup__info h5 {display: block; font-size: var(--font28); line-height: 1.4; font-weight: 700; margin-bottom: 25rem;}
.site-popup__info dd {display: flex; align-items: center; font-size: var(--font18);}
.site-popup__info dd + dd {margin-top: 18rem;}
.site-popup__info dd p {width: 80rem; font-weight:700;}
.site-popup__info dd span {width: calc(100% - 100rem); color: #888; }
.site-popup__close {position: absolute; top: 0; right: -80rem; width:65rem; height:65rem; display: flex; align-items: center; justify-content: center; background: var(--white); border-radius: 50%; color: var(--black);}
.site-popup__close i {font-size: 20rem;}

@media (max-width:1080px){
    .area_business .buList {grid-template-columns: repeat(2,1fr);}
}
@media (max-width:768px){ 
    .area_business .buList {gap: 30rem 20rem;}
    .area_business .buList .info {padding: 30rem 25rem;}
    .area_business .buList .info dt {font-size: 20rem; margin-bottom: 20rem;}
    .area_business .buList .info dd + dd {margin-top: 15rem;}
    .site-popup__close {right: 0; top: -80rem; }
    .site-popup__box {width:88%;}
    .site-popup__boxImg .swiper-button-next:after, 
    .site-popup__boxImg .swiper-button-prev:after {font-size: 35rem;}
}
@media (max-width: 480px){
    .area_business .buList {grid-template-columns: repeat(1,1fr); gap: 20rem;}
    .area_business .buList .info {padding: 30rem 20rem;}
    .area_business .buList .info dt {font-weight: 600; font-size: 18rem;}
    .area_business .buList .info em {padding: 10rem 20rem;}
    .site-popup__info {padding: 30rem 20rem;}
    .site-popup__info::before {width: 180rem; height: 180rem; right: -50rem; }
    .site-popup__info h5 {margin-bottom: 20rem;}
    .site-popup__info em {padding: 8rem 15rem; font-size: 14rem; margin-bottom: 15rem;}
    .site-popup__info li {flex-direction: column; font-size: 15rem;}
    .site-popup__info li p {padding: 10rem 0 0;}
    .site-popup__close {right: 0; top: -60rem; width: 50rem; height: 50rem;}
    .site-popup__boxImg .swiper-button-prev {left: 5rem;}
    .site-popup__boxImg .swiper-button-next {right: 5rem;}
    .site-popup__boxImg .swiper-button-next:after, 
    .site-popup__boxImg .swiper-button-prev:after {font-size: 25rem;}
	.site-popup__boxImg .swiper-slide{height:235rem;}
}

/* 사업실적 */
[data-sub="result01"] .sub-contents {}
[data-sub="result01"] .resultImg {}
[data-sub="result01"] .resultImg {width:580rem; margin: 0 auto;}
[data-sub="result01"] .resultImg img {width: 100%;}
[data-sub="result01"] .resultInfo {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; display: flex; justify-content: space-between; align-items: center;}
[data-sub="result01"] .result_item {pointer-events: none; display: block; position: relative; width: 400rem; margin: 30rem 0; padding: 30rem 30rem; text-align: left; border-radius: 8rem; border: 1px solid #bbb; background: var(--white); box-sizing: border-box;;}
[data-sub="result01"] .result_item h4 {display: flex; line-height: 1; align-items: center; justify-content: space-between; gap: 20rem; margin-bottom: 20rem; font-size: 20rem; font-weight: 700; color: var(--black); margin-bottom: 20rem; padding-bottom: 20rem; border-bottom: 1rem dashed #ddd;}
[data-sub="result01"] .result_item .counter {font-size: 35rem; font-weight: 800; color: var(--point);}
[data-sub="result01"] .result_item h4 em {font-size: 17rem; font-weight: 600; opacity: 0.5; display: inline-block; margin-left: 5rem;}
[data-sub="result01"] .result_item .color {display:block; width: 30rem; height: 30rem; background: #7cbc27;}
[data-sub="result01"] .result_item .dot-list dd {font-size: var(--font17); padding-left: 15rem;}
[data-sub="result01"] .result_item .dot-list dd::before {top: 8rem;}
[data-sub="result01"] .result_item::before {content: ''; position: absolute; top: 50%;transform: translateY(-50%); width: 80%; border-bottom: 2rem dotted #aaa; z-index: -1;}
[data-sub="result01"] .left .result_item::before {left:95%}
[data-sub="result01"] .left .result_item:nth-child(1)::before {}
[data-sub="result01"] .left .result_item:nth-child(2)::before{width: 70%; transform: rotate(-10deg);}
[data-sub="result01"] .right .result_item::before {right:95%}
[data-sub="result01"] .right .result_item:nth-child(2)::before{width:70%; top: 55%; transform: rotate(-10deg);}
[data-sub="result01"] .ss02 {margin-top: 100rem;}
[data-sub="result01"] .tableBox li + li {margin-top: 50rem;}
[data-sub="result01"] .tableBox h5 {font-size: var(--font25); font-weight:700; margin-bottom: 22rem;}
[data-sub="result01"] .tableBox tbody tr:last-child th {border-bottom: 0;}
[data-sub="result01"] .tableBox tbody th {font-weight: 500; border-bottom:1rem dashed #e1e1e1;}
[data-sub="result01"] .result_item:hover {border-color: var(--black);}

@media (max-width: 1720px){
[data-sub="result01"] .result_item {width: 330rem;}
}
@media (max-width: 1400px){
    [data-sub="result01"] .result_item {width: 300rem; padding: 25rem 20rem;}
    [data-sub="result01"] .result_item::before {width: 55%;}
    [data-sub="result01"] .left .result_item:nth-child(2)::before {width: 50%;}
    [data-sub="result01"] .right .result_item:nth-child(2)::before {width: 50%;}

}

@media (max-width: 1080px){
    [data-sub="result01"] .resultImg {width: 45%;}
    [data-sub="result01"] .result_item {width:230rem; padding: 20rem 20rem; border-radius: 6rem;}
    [data-sub="result01"] .result_item h4 {font-size: 18rem; margin-bottom: 15rem; padding-bottom: 15rem;}
    [data-sub="result01"] .result_item .counter {font-size: 25rem;}
    [data-sub="result01"] .result_item h4 em {font-size: 16rem;}
    [data-sub="result01"] .ss02 {margin-top: 80rem;}
}
@media (max-width: 767px){
    [data-sub="result01"] .resultImg {width: 45%;}
    [data-sub="result01"] .result_item {width:175rem; padding: 20rem 15rem; }
    [data-sub="result01"] .result_item h4 {font-size: 16rem; margin-bottom: 10rem; padding-bottom: 10rem;}
    [data-sub="result01"] .result_item .counter {font-size: 20rem;}
    [data-sub="result01"] .result_item h4 em {font-size: 15rem;}
    [data-sub="result01"] .result_item .dot-list dd {font-size: 15rem; padding-left: 10rem;}
    [data-sub="result01"] .right .result_item:nth-child(3)::before {transform:rotate(10deg); top: 40%;}
    [data-sub="result01"] .ss02 {margin-top: 60rem;}
    [data-sub="result01"] .tableBox li + li {margin-top: 30rem;}
}
@media (max-width: 480px){
    [data-sub="result01"] .resultImg {width: 100%;}
    [data-sub="result01"] .resultInfo {position: initial; transform:none; flex-direction: column; gap: 10rem; margin-top: -50rem;}
    [data-sub="result01"] .resultInfo > div {width: 100%; display: grid; grid-template-columns: repeat(1,1fr); gap: 10rem;}
    [data-sub="result01"] .result_item {width: 100%; margin: 0;}
    [data-sub="result01"] .result_item::before {display: none;}
    [data-sub="result01"] .result_item h4 {}
    [data-sub="result01"] .result_item .dot-list dd {padding-left: 0;}
    [data-sub="result01"] .result_item .dot-list dd::before {display: none;}
      [data-sub="result01"] .ss02 {margin-top:40rem;}
}

/* ESG */
.area_esg {}
.area_esg .esgImg {width: 100%; height: 400rem; background: #bbb; margin-bottom: 80rem;}
.area_esg .esgImg img {width: 100%; height: 100%; object-fit: cover;}
.area_esg .esgTit {margin-bottom: 40rem;}
.area_esg .esgTit dt {display: flex; align-items: center; gap:5rem; font-size:var(--font25); font-weight:700; margin-bottom: 25rem;}
.area_esg .esgTit dt i {font-size: 35rem; color: #a9a9a9}
.area_esg .esgTit dd {font-size: var(--font18); line-height: 1.7; color: #555;}
.area_esg .esgBox .box + .box {margin-top: 80rem; padding-top: 80rem; border-top: 10rem solid #f5f5f5;}
.area_esg .esgCon {border: 1rem solid #ddd;}
.area_esg .esgCon.grid {border: 0; display: grid;grid-template-columns: repeat(2,1fr); gap:30rem;}
.area_esg .esgCon.grid .con {border: 1rem solid #ddd;}
.area_esg .esgCon.grid .list {padding: 40rem 30rem;}
.area_esg .esgCon.grid .date {font-size: var(--font18); margin-top:40rem; padding-top: 40rem;}
.area_esg .esgCon.grid .date strong {margin-top:10rem;}
.area_esg .esgCon.grid .date strong span {font-size:30rem;}
.area_esg .esgCon h5 {padding: 20rem 0; font-size: 20rem; font-weight: 600; text-align: center; background: #f5f5f5; border-bottom: 1rem dotted #ddd;}
.area_esg .esgCon p {font-size: var(--font18); line-height: 1.7; color: #555;}
.area_esg .esgCon .cont + .cont {margin-top: 60rem;}
.area_esg .esgCon .list {padding: 50rem 40rem;}
.area_esg .esgCon li + li {margin-top: 30rem;}
.area_esg .esgCon .num {display: flex; align-items: center; gap: 10rem; font-size: 18rem; font-weight: 600; margin-bottom: 20rem;}
.area_esg .esgCon .num em {display:inline-flex; align-items: center; justify-content: center; width: 22rem; height: 22rem; font-size: 13rem; border-radius:50%; background: #222; color: var(--white);}
.area_esg .date {font-size: var(--font18); margin-top:40rem; padding-top: 40rem; border-top: 1px dashed #ddd; font-weight: 500; text-align: center;}
.area_esg .date strong {display: flex; justify-content: center; align-items: center; gap: 15rem; font-weight: 600; margin-top:10rem;}
.area_esg .date strong span {font-size: 40rem; font-weight: 500; line-height: 1; margin-top: -2rem; font-family: 'Kanginhan';}
.area_esg .cerImg {display: flex; gap:30rem; text-align: center;}
.area_esg .cerImg .img {width: 250rem; }
.area_esg .cerImg .img img {width: 100%;  object-fit: contain; border: 1rem solid #ddd;}
.area_esg .cerImg .img .btn span {display: block; font-size: 18rem; margin-top: 20rem; font-weight:600;}
.area_esg .cerImg .img .btn a {display: inline-flex; align-items: center; justify-content: space-between; gap: 10rem; font-size: 15rem; font-weight: 400; padding: 10rem 15rem; border: 1rem solid #e5e5e5; color: #888; transition: .3s; background: #f5f5f5; margin-top: 18rem;}
.area_esg .cerImg .img .btn a:hover {background:#222; border-color: #222; color: var(--white);}
.area_esg .esg-down {margin-top: 10rem; display:inline-flex; align-items: center; justify-content:space-between; width: 250rem; height: 65rem; border-radius: 5rem; padding: 0 28rem; background: #222; color: var(--white); transition: .3s; }
.area_esg .esg-down .name {color: var(--white); font-size: 17rem; letter-spacing: -0.01em;}
.area_esg .esg-down:hover {background: var(--black);}
.area_esg .note {display: block; font-size: var(--font18); line-height: 1.7; color: #555; margin-top: 40rem;}
.area_esg .note i {font-size: 25rem;}

/* 사회공헌 */
[data-sub="esg04"] .box.b1 {display: flex; justify-content: space-between; align-items: center; gap: 50rem;}
[data-sub="esg04"] .box.b1 .img {position: relative;}
[data-sub="esg04"] .box.b1 .img .mark {width: 330rem; max-width: 100%; object-fit: contain; border-radius: 50%;}
[data-sub="esg04"] .box.b1 .img .logo {position: absolute; bottom: -20rem; left: -30rem; width: 120rem; transform: rotate(-15deg); object-fit: contain; z-index: 10;}
[data-sub="esg04"] .text h5 {font-size: var(--font35); line-height: 1.45; font-weight: 700; }
[data-sub="esg04"] .text em {text-transform: uppercase; font-size: var(--font18); font-weight: 700; opacity: 0.3; display: block; margin-bottom:30rem;}
[data-sub="esg04"] .list {display: grid; grid-template-columns: repeat(3,1fr); gap: 30rem;}
[data-sub="esg04"] .list li {border: 3rem solid #f5f5f5; padding: 40rem 40rem;}
[data-sub="esg04"] .list li .icon {display: flex; align-items: center; justify-content: center; width: 80rem; height: 80rem; background: #f8f8f8; border: 1rem dotted #ddd;}
[data-sub="esg04"] .list li .icon img {height: 38rem; object-fit: contain; opacity: 0.8;}
[data-sub="esg04"] .list li p {font-size: var(--font20); font-weight: 700; margin: 30rem 0 20rem;}
[data-sub="esg04"] .list li span {display: block; font-size: var(--font18); line-height: 1.7; color: #555;}

[data-sub="esg04"] .newList {display: grid; grid-template-columns: repeat(2,1fr); gap: 30rem; max-width: 1000rem;}
[data-sub="esg04"] .newList li {border: 1rem solid #ddd;}
[data-sub="esg04"] .newList .img {aspect-ratio: 68 / 40; background:#ddd url(/images/common/footer_logo.png) no-repeat 50% 50%; background-size: 100rem; overflow: hidden;}
[data-sub="esg04"] .newList .img:hover img {transform: scale(1.05);}
[data-sub="esg04"] .newList .img img {width: 100%; height: 100%; object-fit: cover; transition: .3s;}
[data-sub="esg04"] .newList .txt {padding: 35rem;}
[data-sub="esg04"] .newList .txt p {font-size: var(--font22); line-height: 1.8; font-weight: 600; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; white-space: normal; word-break: break-all; }
[data-sub="esg04"] .newList .txt a {display: inline-flex; align-items: center; justify-content: space-between; gap: 10rem; font-weight: 400; width: 180rem; height: 55rem; padding: 0 20rem; border: 1rem solid #e5e5e5; color: #888; transition: .3s; background: #f5f5f5; margin-top:30rem;}
[data-sub="esg04"] .newList .txt a:hover {background:#222; border-color: #222; color: var(--white);}

@media (max-width: 1080px){
    .area_esg .esgTit dd br {display: none;}
    .area_esg .esgCon.grid {gap: 20rem;}
}
@media (max-width: 767px){
    .area_esg .esgImg {height: 320rem; margin-bottom: 50rem;}
    .area_esg .esgTit {margin-bottom: 30rem;}
    .area_esg .esgTit dt {gap: 5rem; margin-bottom: 20rem;}
    .area_esg .esgTit dt i {font-size: 30rem;}
    .area_esg .esgCon h5 {font-size: 18rem; padding: 15rem 0;}
    .area_esg .esgCon li + li {margin-top: 20rem;}
    .area_esg .esgCon .list, .area_esg .esgCon.grid .list {padding: 40rem 30rem;}
    .area_esg .esgCon .num {font-size: 16rem;}
    .area_esg .esgCon.grid {grid-template-columns: repeat(1,1fr);}
    .area_esg .esgBox .box + .box {margin-top:40rem; padding-top:40rem; border-top: 6rem solid #f5f5f5; }
    .area_esg .cerImg {gap: 20rem;}
    .area_esg .cerImg .img .btn span {font-size: 16rem;}
    .area_esg .date {padding-top: 30rem; margin-top: 30rem;}
    .area_esg .date strong span {font-size: 30rem;}
    .area_esg .note {margin-top: 20rem;}
    .area_esg .note i {font-size: 18rem; }
    [data-sub="esg04"] .text h5 br {display: none;}
    [data-sub="esg04"] .box.b1 {padding-bottom: 30rem;}
    [data-sub="esg04"] .box.b1 .img .mark {width: 430rem;}
    [data-sub="esg04"] .box.b1 .img .logo {width: 80rem;}
    [data-sub="esg04"] .newList {gap: 20rem; text-align: center;}
    [data-sub="esg04"] .newList .txt {padding: 25rem 20rem;}
    [data-sub="esg04"] .newList .txt a {width: 150rem; height: 50rem; padding: 0 15rem; font-size: 14rem; margin-top: 20rem;}
    [data-sub="esg04"] .list {gap: 15rem;} 
    [data-sub="esg04"] .list li {border: 2rem solid #f5f5f5; padding: 25rem;}
    [data-sub="esg04"] .list li .icon {width: 70rem; height: 70rem;}
    [data-sub="esg04"] .list li .icon img {height: 35rem;}
    [data-sub="esg04"] .list li p {margin: 20rem 0 15rem;}
}
@media (max-width: 480px){
    .area_esg .esgImg {height:200rem; margin-bottom: 30rem;}
    .area_esg .esgTit dt {gap: 0; margin-bottom: 20rem;}
    .area_esg .esgTit dt i {font-size: 25rem;}
    .area_esg .esgTit {margin-bottom: 20rem;}
    .area_esg .esgCon h5 {font-size: 16rem;}
    .area_esg .esgCon .list, .area_esg .esgCon.grid .list {padding: 30rem 15rem; height: 350rem; overflow-y: auto;}
    .area_esg .esgCon .num {margin-bottom: 15rem;}
    .area_esg .esgCon .num em {font-size: 10rem; width: 18rem; height:18rem;}
    .area_esg .date strong {gap: 10rem; margin-top: 5rem;}
    .area_esg .date {padding-top: 20rem; margin-top: 20rem;}
    .area_esg .date strong span {font-size: 25rem;}
    .area_esg .cerImg {display: grid; grid-template-columns: repeat(2,1fr);gap: 15rem;}
    .area_esg .cerImg .img {width: 100%;}
    .area_esg .cerImg .img .btn a {font-size: 14rem;}
    [data-sub="esg04"] .list {grid-template-columns: repeat(1,1fr);}
    [data-sub="esg04"] .list li span br {display: none;}
    [data-sub="esg04"] .newList {grid-template-columns: repeat(1,1fr);}
    [data-sub="esg04"] .box.b1 {flex-direction: column; gap: 25rem; padding-bottom: 0;}
    [data-sub="esg04"] .text em {margin-bottom: 20rem;}
    [data-sub="esg04"] .box.b1 .img .mark {width: 250rem;}
    [data-sub="esg04"] .box.b1 .img .logo {width: 70rem; bottom: 0; left: -20rem;}
}

/* 인재채용 */
.area_recruit {}
.area_recruit .recBox h4 {font-size:var(--font30); font-weight: 700;} 
.area_recruit .recBox h5 {font-size:var(--font30); font-weight: 700; margin-bottom: 30rem;} 
.area_recruit .recImg {width: 100%; height: 400rem; background: #bbb; margin-bottom: 80rem;}
.area_recruit .recImg img {width: 100%; height: 100%; object-fit: cover;}
.area_recruit .recBox.flex .inr {display: flex; justify-content: space-between;}
.area_recruit .recBox.flex h4 {width:250rem;}
.area_recruit .recBox.flex p {font-size: var(--font18); line-height: 1.7; color: #555;}
.area_recruit .recBox.flex p + p {margin-top: 6rem;}
.area_recruit .recBox.flex .right { width: calc(100% - 250rem)}
.area_recruit .recBox.flex .box.b2 {background: #f8f8f8; padding: 80rem 0; margin: 80rem 0;}
.area_recruit .tit dt {display: flex; align-items: center; gap:5rem; font-size:var(--font32); font-weight:700; margin-bottom: 25rem;}
.area_recruit .tit dt i {font-size: var(--font35); color: #a9a9a9}
.area_recruit .tit dd {font-size: var(--font18); line-height: 1.7; color: #555;}
/* 채용절차 */
[data-sub="recruit01"] .sub-title {}
[data-sub="recruit01"] .sub-title h2 {margin-bottom: 30rem;}
[data-sub="recruit01"] .sub-title em {margin-top: 0; margin-bottom: 25rem; }
[data-sub="recruit01"] .sub-title dd {font-size: var(--font18); font-weight: 400; line-height: 1.8;}
[data-sub="recruit01"] .box + .box {margin-top: 60rem; padding-top: 60rem; border-top:1rem dashed #ddd;}
[data-sub="recruit01"] .recBox h5 {font-size:var(--font32); font-weight: 700; margin-bottom: 40rem;}
[data-sub="recruit01"] .recBox dd {font-size: var(--font18); line-height: 1.7; color: #555;}
[data-sub="recruit01"] .recBox dd + dd {margin-top: 5rem;}
[data-sub="recruit01"] .recList {border-top: 2rem solid #222; border-bottom: 2rem solid #ddd}
[data-sub="recruit01"] .recList li {display: flex; align-items: center; justify-content: space-between; padding: 50rem 30rem;}
[data-sub="recruit01"] .recList li:nth-child(2){flex-direction: row-reverse; border-top: 1rem dotted #ddd; border-bottom:1rem dotted #ddd}
[data-sub="recruit01"] .recList .img {width:280rem; height: 280rem; border-radius: 50%; overflow: hidden;}
[data-sub="recruit01"] .recList .img img {width: 100%; height: 100%; object-fit: cover;}
[data-sub="recruit01"] .recList .txt { width: calc(100% - 320rem)}
[data-sub="recruit01"] .recList .txt p {display: flex; align-items: center; gap: 10rem; font-size: var(--font22); font-weight:600; margin-bottom: 25rem;} 
[data-sub="recruit01"] .recList .txt em {display: flex; align-items: center; justify-content: center; width: 24rem; height: 24rem; border-radius: 50%; font-size: 12rem; background: #222; color: var(--white);}
[data-sub="recruit01"] .recList .txt span {color: #555; font-size: var(--font17); line-height: 1.7;} 
/* 인사제도 */
[data-sub="recruit02"] {}
[data-sub="recruit02"] .re02_process {display: flex; align-items: center; margin-top:50rem;}
[data-sub="recruit02"] .re02_process li {display: flex; align-items: center; justify-content: center; width:140rem; height:140rem; font-size: var(--font18); font-weight: 500; border-radius: 50%; border: 4rem solid #eee;}
[data-sub="recruit02"] .re02_process .arrw {display: inline-block; margin: 0 20rem;}
[data-sub="recruit02"] .re02_process .arrw img {width: 16rem;}
/* 복리후생 */
[data-sub="recruit03"] .re03_list {display: grid; grid-template-columns: repeat(2,1fr); gap: 30rem; margin-top: 80rem} 
[data-sub="recruit03"] .re03_list li {padding:50rem 40rem; background: #f8f8f8;; display:flex; justify-content:space-between; align-items: center; flex-direction: row-reverse; border-top: 1rem solid #222;}
[data-sub="recruit03"] .re03_list li .icon {display: flex; align-items: center; justify-content: center; width: 130rem; height: 130rem; background:var(--white); border-radius: 50%;} 
[data-sub="recruit03"] .re03_list li .icon img {width: 55rem;}
[data-sub="recruit03"] .re03_list li:nth-child(3) .icon img {width:50rem;}
[data-sub="recruit03"] .re03_list li:nth-child(6) .icon img {width:50rem;}
[data-sub="recruit03"] .re03_list .txt {width: calc(100% - 150rem)}
[data-sub="recruit03"] .re03_list .txt h5 {font-size: var(--font22); font-weight:700; margin-bottom:20rem;} 
[data-sub="recruit03"] .re03_list .txt dd + dd {margin-top: 10rem;} 
[data-sub="recruit03"] .re03_list .dot-list dd::before {top: 6rem;}

@media (max-width: 1400px){
    .area_recruit .recBox.flex h4 {width:230rem;}
    .area_recruit .recBox.flex .right { width: calc(100% - 230rem)}
    [data-sub="recruit02"] .re02_process li {width: 120rem; height: 120rem;}
    [data-sub="recruit02"] .re02_process .arrw {margin: 0 15rem;}
}
@media (max-width: 1080px){
    .area_recruit .recImg {margin-bottom: 50rem;}
    .area_recruit .recBox.flex .inr {flex-direction: column; align-items: flex-start;}
    .area_recruit .recBox.flex h4 {width:100%; margin-bottom: 30rem;}
    .area_recruit .recBox.flex .right {width: 100%;}
    [data-sub="recruit03"] .re03_list {gap: 20rem; margin-top: 50rem;}
    [data-sub="recruit03"] .re03_list li {padding: 50rem 30rem;}
    [data-sub="recruit03"] .re03_list li .icon {width: 110rem; height: 110rem;}
    [data-sub="recruit03"] .re03_list li .icon img {width: 50rem;}
}
@media (max-width: 767px){
    .area_recruit .recImg {height:320rem;}
    .area_recruit .recBox.flex h4 {margin-bottom: 20rem;}
    .area_recruit .recBox.flex .box.b2 {padding: 60rem 0; margin: 60rem 0;}
    [data-sub="recruit01"] .recList li, [data-sub="recruit01"] .recList li:nth-child(2) {flex-direction: column;padding: 50rem 0;}
    [data-sub="recruit01"] .recBox h5 {margin-bottom: 30rem;}
    [data-sub="recruit01"] .recList .txt { width: 100%; margin-top: 40rem;}
    [data-sub="recruit02"] .re02_process {margin-top: 30rem; flex-wrap: wrap; gap: 20rem 0;}
    [data-sub="recruit03"] .re03_list li {flex-direction: column; justify-content: center; gap: 30rem; padding: 40rem 20rem;}
    [data-sub="recruit03"] .re03_list .txt {width: 100%;}
    [data-sub="recruit03"] .re03_list .txt h5 {text-align: center;}
    [data-sub="recruit03"] .re03_list dl {display: flex; flex-direction: column; align-items: center;}
}
@media (max-width: 480px){
    .area_recruit .recImg {height:200rem; margin-bottom: 30rem;}
    .area_recruit .recBox.flex .box.b2 {padding: 40rem 0; margin: 40rem 0;}
    [data-sub="recruit01"] .recList li {padding: 40rem 0;}
    [data-sub="recruit01"] .recList .img {width: 260rem; height: 260rem;}
    [data-sub="recruit01"] .recList .txt p {margin-bottom: 20rem;}
    [data-sub="recruit02"] .re02_process li {width: 90rem; height: 90rem; background: #f5f5f5; color: #555; border: 1rem solid #eee;}
    [data-sub="recruit02"] .re02_process .arrw {margin: 0 12rem;}
    [data-sub="recruit02"] .re02_process .arrw img {width: 10rem;}
    [data-sub="recruit02"] .re02_process .arrw.a3 {display:none;}
     [data-sub="recruit03"] .re03_list {margin-top: 50rem; grid-template-columns: repeat(1,1fr);}
     [data-sub="recruit03"] .re03_list li {gap: 20rem;}
     [data-sub="recruit03"] .re03_list .txt h5 {margin-bottom: 15rem;}
}
@keyframes circle {
	0% {transform: translate(-50%,-50%) scale(0);}
	100% {transform: translate(-50%,-50%) scale(1);}
}