/* common */


#subWrap {}
#sv {width: 100%; height: 695px; position: relative; overflow: hidden;}
#sv .sv-bg {width: 100%; height: 100%; position: relative; animation: bgScale 5s; }
#sv .sv-bg:after {content: ''; position: absolute; left: 0; top: 0; width: 0; height: 100%; background: #fff; opacity: 0.15; transition: 2.3s;}
#sv.on .sv-bg:after {width: 100%; opacity: 0;}

.sv01 {background: url(/img/sub/sv01.jpg) no-repeat center/cover; }
.sv02 {background: url(/img/sub/sv02.jpg) no-repeat center/cover;}
.sv03 {background: url(/img/sub/sv03.jpg) no-repeat center/cover;}
.sv04 {background: url(/img/sub/sv04.jpg) no-repeat center/cover;}
.sv05 {background: url(/img/sub/sv05.jpg) no-repeat center/cover;}
.sv06 {background: url(/img/sub/sv04.jpg) no-repeat center/cover;}
#sv .sv-tit {position: absolute; top: 66.7%; left: 50%; transform: translate(-50%, -50%); display: flex; justify-content: space-between; align-items: flex-end;}
#sv .sv-tit .title {color: #fff;}
#sv .sv-tit .title > span {display: block; font-size: 1.7rem; font-weight: 300;}
#sv .sv-tit .title h2 {font-size: 10.5rem; font-family: 'Urbanist', sans-serif; font-weight: 700; margin-top: 12px; overflow: hidden;} 
#sv .sv-tit .title h2 > span {display: block; }
#sv .sv-nav {}
#sv .sv-nav ul {display: flex; gap: 0 10px;}
#sv .sv-nav ul li {font-size: 1.4rem; font-family: 'Urbanist', sans-serif; color: #fff; padding: 11px 21px; box-sizing: border-box; border: 1px solid #fff; border-radius: 20px; text-transform: uppercase; min-width: 90px; text-align: center;}
#sv .sv-nav ul li.home {color: rgba(255, 255, 255, 0.65); background: var(--color-blue); border: 1px solid var(--color-blue);}

#sv .sv06 + .sv-tit .title h2 {font-size: 8rem;}

#Wrap.search #sv { display:none; }


.sub-content {padding: 116px 0 150px;  box-sizing: border-box; overflow: hidden;}
#Wrap.search .sub-content {padding: 116px 0 0; }

@keyframes bgScale{
	0%{transform:scale(1.2); }
	100%{ transform:scale(1); }
}

/* 공통 */
.subTit {position: relative; margin-bottom: 70px;}
.subTit:before {content: ''; position: absolute; left: 0; top: -31px; width: 11px; height: 11px; border: 3px solid var(--color-blue); box-sizing: border-box; background: transparent;}
.subTit h3 {font-size: 5.5rem; color: #111; font-weight: 500; text-transform: uppercase; overflow: hidden;}
.subTit h3.tit-1 { font-size: 2.8rem;}
.subTit h3 > span {display: block;}<hr>

.greyBox {padding: 150px 0; background: #fbfbfb;}

.df-box {display: flex;}



/* ==================
			service
================== */
#service {padding-bottom: 0;}
#service .circleBox {position: relative; padding: 114px 0 183px; box-sizing: border-box;}
#service .circleBox .img {text-align: center;}
#service .circleBox .listBox {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center;}
#service .circleBox .list {width: 50%; display: flex; flex-direction: column; gap: 65px 0; box-sizing: border-box;}
#service .circleBox .list .item {box-sizing: border-box;}
#service .circleBox .list .item div {font-size: 2.2rem; color: #111; font-weight: 500;}
#service .circleBox .list .item span {font-size: 1.5rem; color: var(--color-blue); font-weight: 500; display: block; margin: 17px 0 15px;}
#service .circleBox .list .item p {font-size: 1.6rem; color: #333; font-weight: 300; line-height: 1.5; margin-top:10px; }

#service .circleBox .list01 {text-align: right; padding-right: 18.3%; }
#service .circleBox .list01 .item02,
#service .circleBox .list01 .item03 {padding-right: 15%;}
/* 22.11.29 원소스*/
#service .circleBox .list02 {padding-left: 18.3%;}
#service .circleBox .list02 .item02,
#service .circleBox .list02 .item03 {padding-left: 15%;}

/* 22.11.29 카피 
#service .circleBox .list02 {padding-left: 18.3%; margin-top:-200px;}
#service .circleBox .list02 .item03 {padding-left: 20%; padding-top:20px; }
#service .circleBox .list02 .item04 {padding-left: 18%; padding-top:20px; }*/


/* ==================
			research
================== */
/* research */
#research .listBox {display: flex; align-items: flex-start; gap:0 50px}
#research .listBox > div { width:calc(100% - 100px) / 3}
#research .list {display: flex; flex-wrap: wrap; width: 50%; box-sizing: border-box; gap: 20px 17px;}
#research .list .tit {width: 100%; font-size: 2.7rem; color: #111; font-weight: 500; margin-bottom: 16px;}
#research .list .item {width: calc(50% - 8.5px);}
#research .list .item > a {display: block;}
#research .list .item .bgBox {position: relative; padding-bottom: 123%;}
#research .list .item .bgBox .bg {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
#research .list .item .bgBox .bg img {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#research .list .item .bgBox button {width: 72px; height: 72px; border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 50%; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: transparent; overflow: hidden;}
#research .list .item .bgBox button:before {content: ''; width: 60%; height: 60%; background: var(--color-blue); position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: 0.4s; border-radius: 50%; opacity: 0;} 
#research .list .item .bgBox button i {font-size: 1.6rem; position: relative;}
#research .list .item .txt {padding: 25px 0 15px; box-sizing: border-box;}
#research .list .item .txt p {font-size: 1.9rem; color: #111; font-weight: 500;}
#research .list .item .txt span {display: block; font-size: 15px; color: #555; font-weight: 300; margin-top: 8px;}

#research .list01 {padding-right: 0;}
#research .list02 {padding-left: 0;}

#research .list01 .subTit,
#research .list02 .subTit { width:100%; }

#research .list .item:hover button {border: none;}
#research .list .item:hover button:before {width: 100%; height: 100%; opacity: 1;} 



/* ==================
			properties
================== */
#properties {}
#properties .cnt1 {box-shadow: 0 0 10px rgba(0, 0, 0, 0.04);}
#properties .bgBox {position: relative; padding: 70px 0; box-sizing: border-box;}
#properties .bgBox .bg {background: url(/img/sub/properties_bgBox_bg.jpg) no-repeat center/cover; width: 100%; position: absolute; top: 0; height: 100%; left: 0;}
#properties .bgBox .list {position: relative; display: flex; justify-content: center; gap: 140px;}
#properties .bgBox .list .item {}
#properties .bgBox .list .item p {font-size: 6rem; color: var(--color-blue); font-weight: 700; display: flex; align-items: center; gap: 0 15px; justify-content: center;}
#properties .bgBox .list .item p img {}
#properties .bgBox .list .item > span {font-size: 1.8rem; color: #111; display: flex; align-items: center; gap: 4px; margin-top: 22px; font-family: 'Pretendard';}
#properties .bgBox .list .item > span b {font-size: 1.9rem; font-weight: 500; display: inline-block; margin-right: 15px;}
#properties .bgBox .list .item > span .spacing {display: block; width: 5px;}
#properties .bgBox .list .item > span .stxt { display:block; margin:0 auto; width:175px; }
#properties .bgBox .list .item > span .stxt span { display: inline-block;   width:90px; }
#properties .bgBox .list .item > span .stxt span:nth-child(2) {  display: inline-block;  width:65px; text-align:right; }
#properties .bgBox .list .item.black p {color: #333;}
#properties .bgBox .s-txt {position: absolute; right: 20px; bottom: 20px; font-size: 1.4rem;  color: #777; font-family: 'Pretendard'; text-align: right; line-height: 1.5; }
#properties .bgBox .s-txt span { display:inline-block; margin-left:20px; }

#properties .mapBox {align-items: center; padding: 60px 0 58px; box-sizing: border-box;}
#properties .mapBox .map {width: 50%; text-align: center;}
#properties .mapBox .txtBox {width: 50%; padding-right: 76px; box-sizing: border-box;}
#properties .mapBox .txtBox .tit {font-size: 3rem; color: #111; font-weight: 500;}
#properties .inputBox {display: flex; flex-direction: column; gap: 10px; margin-top: 43px;}
#properties .inputBox .item {background: #f6f6f6; display: flex; align-items: center; padding: 10px 20px; box-sizing: border-box;}
#properties .inputBox .item p {font-size: 1.8rem; color: #111; font-weight: 300; width: 120px;}
#properties .inputBox .item select,
#properties .inputBox .item input {width: calc(100% - 120px); font-size: 1.8rem; } 
#properties .inputBox .item select {background-image: url('/img/sub/down-arrow_black.png'); background-repeat: no-repeat; background-position: 97% center;}
#properties .inputBox .item input::placeholder {color: #c6c6c6;}
#properties .inputBox .item .form-control:focus {border: none; outline: 0; box-shadow: initial; }
#properties .txtBox .blue-btn {display: block; background: var(--color-blue); color: #fff; font-size: 1.6rem; width: 175px; height: 55px; border-radius: 30px; text-transform: uppercase; font-family: 'Urbanist'; display: flex; align-items: center; gap: 8px; justify-content: center; margin-top: 45px;}
#properties .txtBox .blue-btn  i {font-weight: 300; font-size: 2.3rem;}

#properties .listBox {margin-top: 72px;}
#properties .listBox ul {display: flex; flex-wrap: wrap; gap: 40px 33px;}
#properties .listBox ul li {width: calc(25% - 33px); border: 1px solid #dcdcdc; box-sizing: border-box; position: relative;}
#properties .listBox ul li:before {content: ''; width: 100%; height: calc(100% - 65px); background: var(--color-blue); position: absolute; top: 0; left: 0; opacity: 0; z-index: 1; }
#properties .listBox .info {}
#properties .listBox .info .img {position: relative; padding-bottom: 70%; }
#properties .listBox .info .img img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#properties .listBox .info .img span {position: absolute; right: 12px; top: 15px; font-size: 1.5rem; color: #fff; font-weight: 500; border: 1px solid #fff; border-radius: 25px; display: block; padding: 6px 12px; box-sizing: border-box;}
#properties .listBox .info .txtBox {padding: 35px 30px 25px 30px; height: 242px; box-sizing: border-box; font-family: 'Pretendard';}
#properties .listBox .info .txtBox .tit {font-size: 3rem; color: #111; font-weight: 500; margin-bottom: 17px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; line-height: 1.4;}
#properties .listBox .info .txtBox span {font-size: 1.7rem; color: #777; font-weight: 300;}
#properties .listBox .info .btnBox {display: flex;}
#properties .listBox .info .btnBox a,
#properties .listBox .info .btnBox button {width: 50%; height: 65px; border-top: 1px solid #dcdcdc; box-sizing: border-box; font-size: 1.5rem; color: #333; font-weight: 300; display: flex; align-items: center; justify-content: center; }
#properties .listBox .info .btnBox a {border-right: 1px solid #dcdcdc;}

#properties .hoverCnt {padding: 53px 37px 0 37px; box-sizing: border-box; /* background: var(--color-blue);  */position: absolute; top: 0; left: 0; width: 100%; height: calc(100% - 65px);  z-index: 2; opacity: 0; }
#properties .hoverCnt dl {font-family: 'Pretendard';}
#properties .hoverCnt dt {font-size: 3rem; color: #fff;}
#properties .hoverCnt dd {margin-top: 45px;}
#properties .hoverCnt dd div {font-size: 1.6rem; font-weight: 300; color: #fff; display: flex;  }
#properties .hoverCnt dd div:not(:last-child) {margin-bottom: 16px;}
#properties .hoverCnt dd div span {display: block; font-weight: 500; width: 54px;}
#properties .hoverCnt dd div p { width: calc(100% - 54px); color: #rgba(255, 255, 255, 0.6);}
#properties .hoverCnt dd div p .tel {background: #fff; border-radius: 20px; text-align: center; /* display: flex; align-items: center; justify-content: center; */ width: auto; padding: 2px 14px 0; max-width: 42px; box-sizing: border-box;}
#properties .hoverCnt dd div p.df-box {gap: 0 5px; flex-wrap: wrap; } 

#properties .listBox ul li .info .img span.on {background: var(--color-blue); border: none;}
#properties .listBox ul li.on:before {opacity: 1;}
#properties .listBox ul li.on .info .btnBox a, 
#properties .listBox ul li.on .info .btnBox button {background: var(--color-blue); color: rgba(255, 255, 225, 0.7); border-top: 1px solid rgba(255, 255, 255, 0.15);}
#properties .listBox ul li.on .info .btnBox a {border-right: 1px solid rgba(255, 255, 255, 0.15);}
#properties .listBox ul li.on .hoverCnt {opacity: 1;}

/* properties popup */
.properties_cnt .popupBox {max-width: 400px; width: 100%; background: #1e1e1e; position: absolute;  z-index: 99; padding: 25px 30px 38px; box-sizing: border-box;  opacity: 0; visibility: hidden;}
.properties_cnt .popupBox .closeBtn {color: #797979; font-size: 25px; position: absolute; top: 15px; right: 15px;}
.properties_cnt .popupBox .cnt {color: #fff;}
.properties_cnt .popupBox .cnt .tit {font-size: 2rem; font-weight: 500; text-align: center;}
.properties_cnt .popupBox .inputBox {margin-top: 20px;}
.properties_cnt .popupBox .inputBox input {width: 100%; color: #fff;}
.properties_cnt .popupBox .inputBox input::placeholder {color: rgba(255, 255, 255, 0.6);}
.properties_cnt .popupBox .inputBox .input{ position: relative; }
.properties_cnt .popupBox .inputBox .input input{ padding-right: 70px; }
.properties_cnt .popupBox .inputBox .input button{ height: 100%; background: #fff; border: none; font-family: inherit; font-size: inherit; font-weight: 500; color: #666; padding: 0 15px; position: absolute; top: 0; right: 0; }
.properties_cnt .popupBox .txtBox {margin-top: 10px; background: #171717; color: rgba(255, 255, 255, 0.7);text-align: center; padding: 10px 0; box-sizing: border-box; font-size: 1.4rem; font-weight: 300; line-height: 1.5;}
.properties_cnt .popupBox .ch-box {margin-top: 15px; display: flex; align-items: center; gap: 8px; justify-content: center;  }
.properties_cnt .popupBox .okBtn {width: 146px; height: 43px; color:#fff; font-size: 1.6rem; font-weight: 600; background: var(--color-blue); border-radius: 40px; font-family: 'Pretendard'; display: block; margin: 20px auto 0;}
.properties_cnt .popupBox .captcha_ip {display:flex; align-items: center; background-color: rgba(255, 255, 255, 0.1); font-weight: 300; font-size: 1.4rem; line-height: 1.4; width: 100%; padding: 15px 15px; box-sizing: border-box; margin-top: 10px; }
.properties_cnt .popupBox .captcha_ip * {display:inline-block; vertical-align:middle;}
.properties_cnt .popupBox .captcha_ip strong { font-weight:300; font-size:15px; color:#fff; width:88px; }
.properties_cnt .popupBox .captcha_ip input { background:none !important; outline:none; width:calc(100% - 100px - 95px); height:35px; padding:0 2px; margin:0; margin-left:5px; border:none }
.properties_cnt .ch-button { display:flex; }



/* properties view */
#properties_view .imgBox {width: 100%; }
/* #properties_view .imgBox .img {position: relative; padding-bottom: 7%;}
#properties_view .imgBox .img img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 100%; max-height: 100%;     width: 100%; height: 100%;} */

#properties_view .imgBox .slick-dots {position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 19px;}
#properties_view .imgBox .slick-dots li {}
#properties_view .imgBox .slick-dots li button {width: 9px; height: 9px; text-indent: -9999px; border-radius: 50%; background: rgba(255, 255, 255, 0.7); transition: 0.4s;}
#properties_view .imgBox .slick-dots li.slick-active button {width: 33px; border-radius: 10px; background: #fff; }

#properties_view .infoCnt {flex-wrap: wrap; margin-top: 75px;}
#properties_view .infoCnt .info {width: 50%; padding-right: 35px;  box-sizing: border-box; }
#properties_view .infoCnt .info dl {padding: 27px 0 26px 28px; box-sizing: border-box; border-bottom: 1px solid #ededed; display: flex;  }
#properties_view .infoCnt .info dl:first-child {border-top: 1px solid #686868; }
#properties_view .infoCnt .info dt,
#properties_view .infoCnt .info dd {font-size: 1.8rem; font-family: 'Pretendard';}
#properties_view .infoCnt .info dt {width: 112px; color: #111; font-weight: 500;}
#properties_view .infoCnt .info dd {width: calc(100% - 112px); color: #333; font-weight: 300;}
#properties_view .infoCnt .mapBox {width: 50%; padding-left: 35px;  box-sizing: border-box; }
#properties_view .infoCnt .mapBox > div {width: 100% !important; height: 100% !important; border-bottom: 1px solid #ddd}
#properties_view .infoCnt .mapBox > div > div {width: 100% !important; height: 100% !important;}
#properties_view .btnCnt {display: flex; align-items: center; margin-top: 30px; gap: 20px;}
#properties_view .btnCnt .btn {padding: 25px 33px 24px; box-sizing: border-box; border-radius: 40px; display: flex; align-items: center; gap: 6px; }
#properties_view .btnCnt a {color: #666; font-size: 1.4rem; background: #f2f2f2;}
#properties_view .btnCnt a i {color: var(--color-blue); margin-right: 6px; font-size: 1.7rem;}
#properties_view .btnCnt a b {color: #333; font-size: 1.6rem;}
#properties_view .btnCnt > span {color: #fff; background: var(--color-blue);}
#properties_view .btnCnt > span img {margin-right: 4px; display: inline-block;}

#properties_view .cnt2 {margin-top: 110px;}
#properties_view .cnt2 .tit {font-size: 3.5rem; color: #111; font-weight: 500; line-height: 1.3;}
#properties_view .cnt2 .tit span {display: block; font-size: 1.8rem; color: #555; font-weight: 300;}
#properties_view .cnt2 .list {display: flex; align-items: center; text-align: center; padding: 0 0 110px;  box-sizing: border-box; font-family: 'Pretendard'; border-bottom: 1px solid #dcdcdc; flex-wrap: wrap; }
#properties_view .cnt2 .list p {width: 20%; padding-top:60px; }
#properties_view .cnt2 .list p img {mix-blend-mode: multiply; max-width:100%; }
#properties_view .cnt2 .list p span {display: block; font-size: 1.8rem; color: #333; margin-top: 30px; text-align: center;}
#properties_view .cnt2 .btnBox {margin-top: 138px;}
#properties_view .cnt2 .btnBox a {display: inline-block; width: 181px; height: 67px; border-radius: 35px; background: var(--color-blue); color: #fff; display: flex; align-items: center; justify-content: center; margin: 0 auto;}


/* ==================
			news
================== */
#news .cnt1 {display: flex; align-items: center; justify-content: space-between;}	
#news .cnt1 .tab {}
#news .cnt1 .tab ul {display: flex; }
#news .cnt1 .tab ul li {border-radius: 20px; }
#news .cnt1 .tab ul li a {padding: 8px 15px 9px; box-sizing: border-box; display: block; width: 100%; height: 100%; font-size: 1.7rem; color: #c0c0c0; font-family: 'Pretendard';}
#news .cnt1 .tab ul li.on {background: var(--color-blue);}
#news .cnt1 .tab ul li.on a {color: #fff;}

#news .searchBox {}
#news .searchBox > form {display: flex; align-items: center; }
#news .searchBox select {font-size: 1.7rem; width: 100px; color: #111; background-image: url('/img/sub/down-arrow_black.png'); background-repeat: no-repeat; background-position: 88% center;}
#news .searchBox input {width: 223px; margin: 0 15px; color: #111; font-weight: 400;}
#news .searchBox input::placeholder {font-size: 1.7rem; color: #cecece; font-weight: 300;}
#news .searchBox .search-btn {}
#news .searchBox .form-control:focus {border: none; outline: 0; box-shadow: initial; }

#news .listBox {margin-top: 65px;}
#news .listBox ul {display: flex; flex-wrap: wrap; gap: 50px 33px;}
#news .listBox ul li {width: calc(25% - 25px); position: relative; padding-bottom: 31%;}
#news .listBox ul li > a {display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
#news .listBox ul li .bg {position: relative; width: 100%; height: 100%;}
#news .listBox ul li .bg:before {content: ''; position: absolute; bottom: 0 ; left: 0; background: linear-gradient(0deg, rgb(0 0 0 / 30%) 0%, rgba(8,19,67,0) 100%); width: 100%; height: 70%; z-index: 1; transition: 0.4s;}
#news .listBox ul li .bg img {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#news .listBox ul li .txtBox {position: absolute; top: 0; left: 0; padding: 0 40px 40px 40px; width: 100%; height: 100%; box-sizing: border-box; display: flex; align-items: flex-start; flex-direction: column; justify-content: flex-end; z-index: 2;}
#news .listBox ul li .txtBox .s-txt {font-size: 1.6rem; font-family: 'Pretendard'; color: #fff;}
#news .listBox ul li .txtBox p {font-size: 2.3rem; font-weight: 500; line-height: 1.4; font-family: 'Pretendard'; color: #fff; margin: 14px 0 32px;}
#news .listBox ul li .txtBox .date {font-size: 1.6rem; color: rgba(255, 255, 255, 0.7);}


#news .listBox ul li.no-img .bg:before {opacity: 0;}
#news .listBox ul li.no-img .txtBox .s-txt {color: var(--color-blue);}
#news .listBox ul li.no-img .txtBox p {color: #111;}
#news .listBox ul li.no-img .txtBox .date {color: rgba(51, 51, 51, 0.7);}

#news .listBox ul li.on .bg:before {height: 100%; background: var(--color-blue); opacity: 0.8; }
#news .listBox ul li.on .txtBox .s-txt {color: #fff;}
#news .listBox ul li.on .txtBox p {color: #fff;}
#news .listBox ul li.on .txtBox .date {color: rgba(255, 255, 255, 0.7);}


#news .view-box * {  box-sizing: border-box; }
#news .view-box .title-box { text-align:center; border-top:1px solid #1560ae; background-color:#f6f6f6; padding:52px 20px; }
#news .view-box .title-box p { font-size: 23px; color: #111; font-weight: 600; }
#news .view-box .title-box .date { display:block; margin-top:14px; color:#777777; font-size:16px; font-weight:400;}
#news .view-box .view-cont { min-height:150px; padding:60px 65px 100px 65px; color:#333; font-size:18px; font-weight:300; line-height:1.5; }
#news .view-box .pn-box { border-top:1px solid #ededed; }
#news .view-box .pn-box li { border-bottom:1px solid #ededed; display:flex; }
#news .view-box .pn-box li strong { width:135px; height:65px; text-align:center; font-size: 16px; color: #111; font-weight: 600; background-color:#f6f6f6; display:flex; justify-content:center; align-items:center; }
#news .view-box .pn-box li span { width:calc(100% - 135px); display:flex; align-items:center; padding:0 35px;}
#news .view-box .pn-box li a { color:#555; font-size:16px; font-weight:300; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }
#news .view-box .btnBox {margin-top: 138px;}
#news .view-box .btnBox a {display: inline-block; width: 181px; height: 67px; border-radius: 35px; background: var(--color-blue); color: #fff; display: flex; align-items: center; justify-content: center; margin: 0 auto;}


/* ==================
			about us
================== */
/* 기업이념 */
#philosophy {padding-top: 150px;}
#philosophy .txtBox {padding: 108px 0 185px; position: relative;}
#philosophy .txtBox .txt p {font-size: 6rem; color: var(--color-blue); font-weight: bold;}
#philosophy .txtBox .txt span {display: block; font-size: 4.5rem; color: #111;}
#philosophy .txtBox .txt .s-txt {font-size: 1.8rem; color: #555; margin-top: 40px;}
#philosophy .txtBox .bg {position: absolute; right: 0; bottom: 0;}

#philosophy .list {display: flex; flex-direction: column; gap: 80px 0; margin-top: -27px;}
#philosophy .list .item {display: flex;}
#philosophy .list .item .tit {font-size: 3.5rem; color: var(--color-blue); font-weight: 800; text-transform: uppercase; width: 28.6%;}
#philosophy .list .item .imgBox {width: 71.4%; }
#philosophy .list .item .imgBox .img {}
#philosophy .list .item .imgBox .img img {}
#philosophy .list .item .imgBox p {font-size: 1.8rem; color: #333; line-height: 1.7; margin-top: 28px; font-family: 'Pretendard';}


/* 연혁 */
#history .subTit {margin-bottom: 40px;}
#history .progreeBox {padding: 30px 0; box-sizing: border-box; position: relative;}
#history .progreeBox .yearList {display: flex; }
#history .progreeBox .yearList .item {width: 50%; position: relative;}
#history .progreeBox .yearList .item:after {content: ''; position: absolute; top: -3px; left: 0; width: 8px; height: 8px; border-radius: 50%; background: #e7e7e7;}
#history .progreeBox .yearList .item .bar {width: 100%; height: 1px; position: relative; background: #e7e7e7; opacity: 0.6; }
#history .progreeBox .yearList .item .bar .progress {position: absolute; top: 0; left: 0; width: 0; height: 1px; background: var(--color-blue); transition: 1.5s;}
#history .progreeBox .yearList .item p {font-size: 2.1rem; color: #111; font-weight: 700; font-family: 'Pretendard'; margin-top: 25px;}
#history .progreeBox .yearList .item > span {display: block; font-size: 1.5rem; color: #999; font-weight: 300; margin-top: 13px;}
#history .progreeBox .yearList .item b {font-size: 1.7rem; color: #111;}
#history .progreeBox .yearList .item02 p,
#history .progreeBox .yearList .item02 b {color: var(--color-blue);}

#history .progreeBox .yearList .item.on:after {background: var(--color-blue);}
#history .progreeBox .yearList .item.on .bar .progress {width: 100%; }
#history .progreeBox .yearList .item01.on:after {background: #111;}
#history .progreeBox .yearList .item01.on .bar .progress {background: #111;}

#history .historyCnt {}
#history .historyCnt .listBox { padding-bottom:50px; }
#history .historyCnt .list01 {padding-bottom: 140px; padding-top: 160px; box-sizing: border-box;}
#history .historyCnt .listBox > .inner1500 {overflow: hidden;}
#history .historyCnt .listBox .titBox {width: 50%; font-family: 'Pretendard'; }
#history .historyCnt .listBox .titBox h4 {font-size: 9rem; color: #111; font-weight: bold; overflow: hidden;}
#history .historyCnt .listBox .titBox .img {margin-top: 43px;}
#history .historyCnt .listBox .titBox .img img {}
#history .historyCnt .listBox .content {width: 50%; padding-left: 34px; box-sizing: border-box; margin: 0 0 0 auto;} 
#history .historyCnt .listBox .content .bar {width: 1px; height: calc(100% - 13px); top: 13px; background: #dcdcdc; position: relative; margin-top: 8px; overflow: hidden;}
#history .historyCnt .listBox .content .bar .progress {display: block; position: absolute; width: 1px; height: 0; background: #333; transition: 0.5s;}
#history .historyCnt .listBox .content .list {padding-left: 35px; box-sizing: border-box; display: flex; flex-direction: column; gap: 95px 0;}
#history .historyCnt .listBox .content .list dl {font-family: 'Pretendard'; position: relative;}
#history .historyCnt .listBox .content .list dl:before {content: ''; width: 7px; height: 7px; background: #c3c3c3; border-radius: 50%; position: absolute; left: -39px; top: 20px;}
#history .historyCnt .listBox .content .list dt {font-size: 4rem; color: #111; font-weight: 700; }
#history .historyCnt .listBox .content .list dd {margin-top: 20px;}
#history .historyCnt .listBox .content .list dd p {font-size: 1.8rem; color: #555;}
#history .historyCnt .listBox .content .list dd p:not(:last-child) {margin-bottom: 20px;}

#history .historyCnt .listBox .content .list dl.on:before {background: #333; transition: 0.4s;}
#history .historyCnt .list01 .content .list dl.on:before {background: var(--color-blue); transition: 0.4s;}
#history .historyCnt .list01 .content .bar .progress {background: var(--color-blue);}

#history .historyCnt .list02 .content .bar {height: calc(100% - 126px);}
#history .historyCnt .list01 .content .bar {height: calc(100% - 170px);}

.c-blue {color: var(--color-blue) !important;}


/* Partners 및 Client  */
#partners {}
#partners .cnt1 {margin-bottom: 170px;}
#partners .cnt1 .list {display: flex; flex-wrap: wrap; gap: 25px; }
#partners .cnt1 .list .item {width: calc(25% - 19px); border: 1px solid #dcdcdc; padding: 50px 30px 67px; box-sizing: border-box; position: relative;}
#partners .cnt1 .list .item:before {content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: url(/img/sub/partners_list01_bg.jpg) no-repeat center/ cover; opacity: 0; transition: all 0.5s; z-index: 1;}
#partners .cnt1 .list .item.on:before {opacity: 1;}
#partners .cnt1 .list .item .info {}
#partners .cnt1 .list .item .logo {}
#partners .cnt1 .list .item .info p {font-size: 2.2rem; color: #111; font-weight: 500; margin: 13px 0 32px; }
#partners .cnt1 .list .item .info span {display: block; font-size: 1.7rem; color: #666; font-weight: 300; line-height: 1.8;}
#partners .cnt1 .list .item .hoverCnt {cursor: pointer;position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; display: none; z-index: 1;}
#partners .cnt1 .list .item .hoverCnt .bg {position: relative; width: 100%; height: 100%;}
#partners .cnt1 .list .item .hoverCnt .bg img {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
#partners .cnt1 .list .item .hoverCnt .txtBox {position: absolute; top: 0; left: 0; width: 100%; padding: 40px 0 0 40px; box-sizing: border-box; }
#partners .cnt1 .list .item .hoverCnt .tit {font-size: 3.2rem; color: #fff; font-weight: bold; letter-spacing: -0.25px; }
#partners .cnt1 .list .item .hoverCnt dl {color: #fff; font-family: 'Pretendard';}
#partners .cnt1 .list .item .hoverCnt dt {font-size: 1.8rem; font-weight: 500; text-transform: uppercase; margin: 16px 0; }
#partners .cnt1 .list .item .hoverCnt dd {}
#partners .cnt1 .list .item .hoverCnt dd span {display: block; font-size: 1.6rem; font-weight: 300; padding-left: 9px; box-sizing: border-box; opacity: 0.7; position: relative;}
#partners .cnt1 .list .item .hoverCnt dd span:before {content: ''; width: 3px; height: 3px; background: #fff; border-radius: 50%; position: absolute; left: 0; top: 6px;}
#partners .cnt1 .list .item .hoverCnt dd span:not(:last-child) {margin-bottom: 10px;}

#partners .cnt2 .list ul {display: flex; flex-wrap: wrap; gap: 20px;}
#partners .cnt2 .list ul li {width: calc(25% - 17px); text-align: center; border: 1px solid #dcdcdc; position: relative; padding-bottom: 7.4%; overflow: hidden;}
#partners .cnt2 .list ul li img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 100%;}


/* 위치 */
#location {padding-bottom: 0;}
#location .cnt1 {}
#location .mapCnt {}
#location .mapBox {width: 100%; height: 560px;}
#location .mapBox > iframe {width: 100%; height: 100%;}
#location .cnt1 .list {display: flex; align-items: center; margin: -91px 0 0 37px;     justify-content: space-between;}
#location .cnt1 .list .titBox {width: 299px; height: 299px; background: var(--color-blue); color: #fff; padding: 50px 0 53px 40px; box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between;}
#location .cnt1 .list .titBox > span {font-size: 1.7rem; font-weight: 500;}
#location .cnt1 .list .titBox > div { font-weight: bold; line-height: 1.6;}
#location .cnt1 .list .titBox > div p {font-size: 2.57rem;}
#location .cnt1 .list .titBox > div span {font-size: 2rem; }
#location .cnt1 .list ul {display: flex; align-items: center; box-sizing: border-box; padding-right: 20px; gap: 0 43px; margin-top: 40px;} 
#location .cnt1 .list ul li {display: flex; align-items: center; gap: 0 15px;}
#location .cnt1 .list ul li .circle {width: 70px; height: 70px; border-radius: 50%; background: #f4f4f4; display: flex; align-items: center; justify-content: center;}
#location .cnt1 .list ul .txt {font-size: 1.8rem; color: #333; display: flex; gap: 0 17px; align-items: center; width: calc(100% - 85px );}
#location .cnt1 .list ul .txt .strong {font-size: 2rem; color: var(--color-blue); font-weight: 500; display: inline-block;}

#location .cnt2 {margin-top: 180px;}
#location .cnt2 .subTit {margin-bottom: 30px;}
#location .inputBox {}
#location .inputBox .list {display: flex; flex-wrap: wrap; gap: 26px;}
#location .inputBox .item {width: calc(33.3333% - 17.5px); padding: 20px 30px; box-sizing: border-box; border: 1px solid #dcdcdc; display: flex; flex-wrap: wrap; align-items: center; gap: 0 15px; background: #fff;} 
#location .inputBox .item p {font-size: 1.7rem; color: #333; text-transform: uppercase;}
#location .inputBox .item p span {display: inline-block; color: var(--color-blue);}
#location .inputBox .item input {width: calc(100% - 80px); font-size: 1.6rem;}
#location .inputBox .item .form-control:focus {border: none; outline: 0; box-shadow: initial; }
#location .inputBox .item.w100 {width: 100%; gap: 15px 0; padding: 30px; } 
#location .inputBox .item.w100 p {width: 100%;}
#location .inputBox .item.w100 textarea {width: 100%; height: 268px; border: none; line-height: 1.4;}
#location .inputBox .item.w100 textarea:focus {border: none; outline: 0; box-shadow: initial; }
#location .inputBox .item.w100 textarea::placeholder {font-size: 1.6rem; color: #d2d2d2; font-weight: 300;}
#location .cnt2 .send-btn {width: 178px; height: 55px; border-radius: 35px; font-size: 1.6rem; color: #fff; text-align: center; background: var(--color-blue); text-transform: uppercase; margin: 60px auto 0; display: block;}

/* ci */
#ci {}
#ci > div:not(:last-child) {margin-bottom: 150px;}
#ci .cnt1 {}
#ci .cnt1 .df-box {justify-content: space-between; overflow: hidden;}
#ci .cnt1 .txtBox {}
#ci .cnt1 .txtBox p {font-size: 3rem; color: #111; font-weight: 600; line-height: 1.6;}
#ci .cnt1 .txtBox .down-list {margin-top: 53px; }
#ci .cnt1 .txtBox .down-list a {display: block; width: 225px; height: 74px;  color: #fff; border-radius: 40px; text-transform: uppercase; font-size: 1.6rem; font-weight: 500; border: 1px solid #013e8f; position: relative; overflow: hidden; }
#ci .cnt1 .txtBox .down-list a::before {content: ''; position: absolute; top: 0; bottom: 0; right: 0; height: 100%; width: 100%; background: #013e8f; transition: 0.4s;}
#ci .cnt1 .txtBox .down-list a i {transition: 0.3s;}
#ci .cnt1 .txtBox .down-list a span {z-index: 1; display: flex; align-items: center; justify-content: center;  gap: 0 16px; position: relative; width: 100%; height: 100%;}
#ci .cnt1 .txtBox .down-list a:hover::before {width: 0;}
#ci .cnt1 .txtBox .down-list a:hover span {color: #013e8f;}
/* #ci .cnt1 .txtBox .down-list a:hover {color: var(--color-blue); font-weight: bold;}
#ci .cnt1 .txtBox .down-list a:hover i {padding-right: 0;}  */
#ci .cnt1 .ci-list {width: 50%; display: flex; flex-direction: column; justify-content: space-between; gap: 25px 0;}
#ci .cnt1 .ci-list .img {border: 1px solid #eaeaea; height: 150px; text-align: center; display: flex; align-items: center; justify-content: center;}
#ci .cnt1 .ci-list .img img {}

#ci .cnt2 .subTit {justify-content: space-between;}
#ci .cnt2 .subTit > span {width: 50%; font-size: 1.8rem; color: #333; font-weight: 300; line-height: 1.6;}
#ci .cnt2 .list {gap: 35px 0; display: flex; flex-wrap: wrap; }
#ci .cnt2 .list .item {width: 50%; border: 1px solid #eaeaea; box-sizing: border-box; display: flex; align-items: center; justify-content: center;}
#ci .cnt2 .list .item03 {background: #003e8e; border: none;}
#ci .cnt2 .list .item04 {background: #2c2c2c; border: none;}

#ci .cnt3 .subTit {justify-content: space-between;}
#ci .cnt3 .subTit > span {width: 50%; font-size: 1.8rem; color: #333; font-weight: 300; line-height: 1.6;}
#ci .cnt3 .list {display: flex; flex-wrap: wrap; gap: 30px;}
#ci .cnt3 .list .item {height: 360px; color: #fff; padding: 40px 0 46px 40px; box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between;}
#ci .cnt3 .list .item.w1 {width: 100%;}
#ci .cnt3 .list .item.w3 {width: calc(33.3333% - 20px);}
#ci .cnt3 .list .item.w4 {width: calc(25% - 23px);}
#ci .cnt3 .list .item01 {background: #003e8e;}
#ci .cnt3 .list .item02 {background: #b08f65;}
#ci .cnt3 .list .item03 {background: #bebfc1;}
#ci .cnt3 .list .item04 {background: #140700;}
#ci .cnt3 .list .item05 {background: #0d1d46;}
#ci .cnt3 .list .item06 {background: #571c7e;}
#ci .cnt3 .list .item07 {background: #00a553;}
#ci .cnt3 .list .item08 {background: #f7860c;}
#ci .cnt3 .list .item > p {font-size: 2rem; font-weight: 500; text-transform: uppercase;}
#ci .cnt3 .list .item ul li {font-size: 1.6rem; font-weight: 500; line-height: 1.8; position: relative; padding-left: 9px; box-sizing: border-box;}
#ci .cnt3 .list .item ul li:before {content: ''; position: absolute;  top: 12px; left: 0; width: 1px; height: 1px; background: #fff;}


#search .top-box { padding-top: 175px; text-align: center;}
#search .top-box > p { font-size: 105px; font-weight: 900; color: #111;}
#search .top-box .ipbox { max-width: 1150px; width: 100%; margin:100px auto 0 auto; }
#search .top-box .ipbox input { width: calc(100% - 175px); height: 70px; outline: none; border: none; padding: 0 20px; border-bottom: 1px solid #d5d5d5; font-size: 20px; color: #111;}
#search .top-box .ipbox input::placeholder { color: #111;}
#search .top-box .ipbox button { width: 170px; background: #013e8f; border-radius:50px; height: 70px; color: #fff; font-size: 17px; font-weight: 300; }
#search .top-box .ipbox button img { vertical-align: middle;}
#search .search-list {margin-top: 150px; background-color: #fbfbfb; padding: 95px 0 145px 0;}
#search .search-tab { text-align: center; }
#search .search-tab > ul { display: flex; justify-content: center;}
#search .search-tab > ul > li { margin: 10px;}
#search .search-tab > ul > li a { display: flex; align-items: center; justify-content: center; height: 67px; color: #111; font-size: 20px; font-weight: 600; padding: 0 45px; border-radius: 50px;}
#search .search-tab > ul > li.active a { color: #013e8f; border: 1px solid #013e8f;}
#search .result-list { padding: 100px 0;}
#search .result-list .notxt { margin:20px auto; color:#d4d4d4; font-size:20px; text-align:center; }