/*** 공통 :: 서브 타이틀 ***/
.cm-sub-tit-box {text-align: center; margin-bottom: 9rem;}
.cm-sub-tit-box .cm-sub-tit {font-size: 3rem; font-weight: 700; letter-spacing: -0.05em; line-height: 1.4; color: #000;}
.cm-sub-tit-box .cm-sub-txt {margin-top: 1rem; font-size: 1.7rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.76; color: #666;}

/* ****************** 서비스 소개 :: 공통 ********************** */
/*** 공통 레이아웃 ***/
.service-cm-content-con {display: flex; margin-top: 12rem;}
.service-cm-content-con .tit-wrap {width: 21.429%; padding-right: 5.715%; box-sizing: border-box;}
.service-cm-content-con .tit-wrap .cm-content-tit {font-size: 4rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.25; color: #000;}
.service-cm-content-con .tit-wrap .cm-content-txt {margin-top: 1rem; font-size: 1.2rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.25; color: #aaa;}

.service-cm-content-con .content-wrap {box-sizing: border-box; width: 78.572%; background-color: #f9f9f9; border-radius: 2rem;}
.service-cm-content-con .content-wrap .sub-tab-con {width: 100%; height: 100%;}

/*** 공통 화살표 ***/
.service-circle {position: absolute; content: ""; left: 50%; bottom: -2rem; display: flex; align-items: center; justify-content: center; width: 4rem; height: 4rem; border-radius: 50%; background-color: var(--main-color); font-size: 2.5rem; color: #fff; box-shadow: 0 1rem 2rem 0 rgba(228, 0, 70, 0.3); transform: translateX(-50%); z-index: 2;}
.service-circle::before {position: absolute; content: ""; left: 50%; top: 50%; width: 5rem; height: 5rem; border-radius: 50%; background-color: rgba(228, 0, 70, 0.1); transform: translate(-50%, -50%);}

/*** 공통 보더 액티브 리스트 ***/
.border-active-list {position: relative; display: flex; flex-direction: column; gap: 1rem 0;}
.border-active-list .list-item {position: relative; display: flex; border-radius: 1rem; overflow: hidden;}
.border-active-list .list-item::before {position: absolute; content: ""; top: 0; left: 0; width: 100%; height: 100%; border: 2px solid #eee; border-radius: 1rem; box-sizing: border-box; z-index: 1; pointer-events: none; transition: var(--transition-custom);}
.border-active-list .list-item .icon-box {position: relative; display: flex; align-items: center; justify-content: center; box-sizing: border-box; background-color: #f9f9f9; transition: var(--transition-custom);}
.border-active-list .list-item .icon-box img {position: absolute; max-width: 100%; max-height: 100%; transition: var(--transition-custom);}
.border-active-list .list-item .icon-box .active-icon {opacity: 0; visibility: hidden;}
.border-active-list .list-item .txt-box {display: flex; align-items: center; background-color: #fff; padding: 2rem; box-sizing: border-box;}
.border-active-list .list-item .txt-box .border-active-list-txt {font-size: 2rem; font-weight: 600; letter-spacing: -0.05em; line-height: 1.3; color: #000;}

.border-active-list .list-item.active::before {border-color: var(--main-color);}
.border-active-list .list-item.active .icon-box {background-color: var(--main-color);}
.border-active-list .list-item.active .icon-box .default-icon {opacity: 0; visibility: hidden;}
.border-active-list .list-item.active .icon-box .active-icon {opacity: 1; visibility: visible;}

/*** 탭 ***/
@media all and (min-width: 801px) {
	.service-page-tab-style {height: auto; margin-top: 4rem;}
	.service-page-tab-style .sub-tab-list-style ul {display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; padding: 2rem;}
	.service-page-tab-style .sub-tab-list-style ul li {display: block; min-width: auto; width: 100%;}
	.service-page-tab-style .sub-tab-list-style ul li a {height: 5rem;}	
}

/* ****************** 서비스 소개 :: 공통 ********************** */
@media all and (max-width: 800px) {
	/*** 공통 레이아웃 ***/
	.service-cm-content-con .content-wrap {padding: 3rem !important;}

	/*** 공통 보더 액티브 리스트 ***/
	.border-active-list .list-item .txt-box .border-active-list-txt {font-size: 1.6rem;}
}

@media all and (max-width: 480px) {
	/*** 공통 보더 액티브 리스트 ***/
	.border-active-list .list-item {display: block;}
	.border-active-list .list-item .icon-box, .border-active-list .list-item .txt-box {width: 100% !important;}
	.border-active-list .list-item .icon-box img {max-width: 50%; max-height: 50%;}
}

/* ****************** 서비스 소개 :: HT POST ********************** */
.post-content {padding-bottom: 15rem;}

/*** 매체 개요 & 매체 특징 ***/
.ht-post-con01{display: flex; align-items: center; justify-content: center; width: 100%; height: 76rem; background: center / cover no-repeat url("/images/content/ht_post_con01_bg.jpg");}
.ht-post-con01 .area{width: 100%; box-sizing: border-box;}
.ht-post-con01-list{margin: 0 -1rem; display: flex; flex-wrap:wrap;}
.ht-post-con01-item{margin: 0 1rem; width: calc(50% - 2rem); background-color: #fff; border: 2px solid var(--main-color); border-radius: 1rem; box-sizing: border-box; overflow: hidden;}
.ht-post-con01-item-tit{width: 100%; height: 8rem; font-size: 2.5rem; line-height: 1.3; letter-spacing: -0.05em; font-weight: 600; color: #fff; background-color: var(--main-color); display: flex; align-items: center; justify-content: center;}
.ht-post-con01-item-tit i{font-weight: 400; margin-right: 1rem;}
.ht-post-con01-item-inner{padding: 0 7.2%; width: 100%; height: calc(100% - 8rem); display: flex; flex-direction: column; justify-content: center; box-sizing: border-box;}
.ht-post-con01-item-box{padding: 2rem 0; display: flex; flex-wrap:wrap; align-items: center;}
.ht-post-con01-item-box + .ht-post-con01-item-box{border-top: 1px solid #eee;}
.ht-post-con01-item-box .icon{width: 10rem;}
.ht-post-con01-item-box .icon img{width: 100%;}
.ht-post-con01-item-box .txt{width: calc(100% - 10rem); padding-left: 3rem; box-sizing: border-box;}
.ht-post-con01-item-box .txt p{font-size: 1.7rem; line-height: 1.76; letter-spacing: -0.05em; font-weight: 500; color: #000;}
.ht-post-con01-item-inner .dot-txt{position: relative; padding-left: 2rem; font-size: 1.7rem; line-height: 1.76; letter-spacing: -0.05em; font-weight: 600; color: #000;}
.ht-post-con01-item-inner .dot-txt + .dot-txt{margin-top: 1rem;}
.ht-post-con01-item-inner .dot-txt:before{position: absolute; top: 0; left: 0; color: rgba(0,0,0,0.6); font-weight: 400; content: "\e929"; font-family: xeicon;}

@media all and (max-width: 800px) {
	/*** 매체 개요 & 매체 특징 ***/
	.ht-post-con01{padding: 6rem 0; height: auto;}
	.ht-post-con01-list{margin: -1rem;}
	.ht-post-con01-item{margin: 1rem; width: calc(100% - 2rem); border-radius: 1rem;}
	.ht-post-con01-item-tit{height: 6rem; font-size: 2.2rem; line-height: 1.3;}
	.ht-post-con01-item-tit i{margin-right: 1rem;}
	.ht-post-con01-item-inner{padding: 3rem; height: auto;}
	.ht-post-con01-item-box{padding: 0 0 2rem;}
	.ht-post-con01-item-box + .ht-post-con01-item-box{padding-top: 2rem; padding-bottom: 0;}
	.ht-post-con01-item-box .icon{width: 10rem; max-width: 100px;}
	.ht-post-con01-item-box .txt{width: calc(100% - 10rem); padding-left: 3rem;}
	.ht-post-con01-item-box .txt p{font-size: 1.7rem; line-height: 1.76;}
	.ht-post-con01-item-inner .dot-txt{padding-left: 2rem; font-size: 1.7rem; line-height: 1.76;}
	.ht-post-con01-item-inner .dot-txt + .dot-txt{margin-top: 1rem;}
}


/*** HT POST 설치 효과 ***/
.post-effect-con {display: flex; align-items: center; justify-content: center; position: relative; width: 100%; height: 76rem; background: center / cover no-repeat url("/images/content/ht_post_effect_bg.jpg");}
.post-effect-con.no-img{background: #f9f9f9;}
.effect-item-wrap {position: relative; width: 100%;}
.effect-item-wrap .effect-item-circle {position: absolute; top: 50%; left: 50%; display: flex; align-items: center; justify-content: center; width: 32rem; height: 32rem; border-radius: 50%; background: center / cover no-repeat url("/images/content/effect_item_circle.png"); transform: translate(-50%, -50%);}
.no-img .effect-item-wrap .effect-item-circle{background: center / cover no-repeat url("/images/content/effect_item_circle_gr.png");}
.effect-item-wrap .effect-item-circle .inner-circle {display: flex; align-items: center; justify-content: center; width: 26rem; height: 26rem; border-radius: 50%; border: 1rem solid var(--main-color); background-color: #fff; box-sizing: border-box; box-shadow: 0 1.8rem 3rem 0 rgba(0, 0, 0, 0.2);}
.effect-item-wrap .effect-item-circle .inner-circle p {font-size: 3rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.16; color: #000; text-align: center;}
.effect-item-wrap .effect-item-circle .inner-circle p strong {color: var(--main-color);}
.effect-item-list-box {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 2rem;}
.effect-item-list-box .effect-item-list {position: relative; display: flex; align-items: center; min-height: 22rem; border-radius: 1rem; background-color: #fff; padding: 3rem 5rem; box-sizing: border-box; overflow: hidden;}
.effect-item-list-box .effect-item-list::before {position: absolute; left: 0; top: 0; content: ""; width: 100%; height: 100%; background: center / cover no-repeat url("/images/content/effect_item_list_bg.jpg"); z-index: 0; transition: var(--transition-custom); opacity: 0; visibility: hidden;}
.effect-item-list-box .effect-item-list {width: 100%; height: 100%;}
.effect-item-list-box .effect-item-list .inner {position: relative; width: 85%; z-index: 1;}
.effect-item-list-box .effect-item-list:nth-child(even) {justify-content: flex-end; text-align: right;}
.effect-item-list-box .effect-item-list .effect-list-num {display: inline-block; border-bottom: 2px solid var(--main-color); font-size: 1.5rem; font-weight: 600; letter-spacing: -0.02em; line-height: 1.4; color: var(--main-color); transition: var(--transition-custom);}
.effect-item-list-box .effect-item-list .effect-list-tit {margin-top: 2.7rem; font-size: 2.5rem; font-weight: 700; letter-spacing: -0.05em; line-height: 1.2; color: #000; transition: var(--transition-custom);}
.effect-item-list-box .effect-item-list .effect-list-txt {margin-top: 1.5rem; font-size: 1.7rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.76; color: rgba(0, 0, 0, 0.6); transition: var(--transition-custom);}
.effect-item-list-box .effect-item-list .effect-list-ps-txt {margin-top: 0.7rem; font-size: 1.5rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.66; color: rgba(0, 0, 0, 0.4); transition: var(--transition-custom);}
.effect-item-list-box .effect-item-list.active::before {opacity: 1; visibility: visible;}
.effect-item-list-box .effect-item-list.active .effect-list-num {color: #fff; border-color: #fff;}
.effect-item-list-box .effect-item-list.active .effect-list-tit {color: #fff;}
.effect-item-list-box .effect-item-list.active .effect-list-txt {color: rgba(255, 255, 255, 0.6);}
.effect-item-list-box .effect-item-list.active .effect-list-ps-txt {color: rgba(255, 255, 255, 0.4);}

/*** HT POST 콘텐츠 구성 ***/
.post-content-img-box {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 10.6rem 6rem; box-sizing: border-box;}
.post-content-img-box img {max-width: 100%; max-height: 100%;}

/*** HT POST 현장 사례 ***/
.post-case-inner {padding: 6rem 6rem 8rem 6rem; box-sizing: border-box;}
.post-case-list {display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 4.5rem 2.2rem;}
.post-case-list .list-item .img-box {position: relative; border-radius: 2rem; overflow: hidden;}
.post-case-list .list-item .img-box .img-over-thum {display: flex; align-items: center; justify-content: center; position: absolute; content: ""; width: 100%; height: 100%; top: 0; left: 0; border: 5px solid var(--main-color); border-radius: 2rem; box-sizing: border-box; transition: all 0.3s; opacity: 0;}
.post-case-list .list-item .img-box .img-over-thum i {font-size: 48px; color: #fff; transition: transform 0.4s;}
@media all and (min-width: 801px) {
	.post-case-list .list-item:hover .img-box .img-over-thum {opacity: 1;}
	.post-case-list .list-item:hover .img-box .img-over-thum i {transform: rotateZ(180deg)}
}
/* .post-case-list .list-item .img-box::before {position: absolute; content: ""; top: 0; left: 0; width: 100%; height: 100%; border: 5px solid var(--main-color); border-radius: 2rem; box-sizing: border-box; transition: all 0.3s;} */
.post-case-list .list-item .img-box img {max-width: 100%;}
.post-case-list .list-item .txt-box {margin-top: 2.5rem;}
.post-case-list .list-item .txt-box .post-case-list-tit {font-size: 2rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.4; color: #000;}
.post-case-list .list-item .txt-box .post-case-list-txt {margin-top: 1rem; font-size: 1.5rem; font-weight: 500; letter-spacing: -0.02em; line-height: 1.4; color: #aaa;}
.post-case-inner .case-list-btn {display: flex; align-items: center; justify-content: center; margin: 4.5rem auto 0; width: 18rem; height: 5rem; border: 2px solid var(--main-color); box-sizing: border-box; border-radius: 2.5rem; font-size: 1.5rem; font-weight: 500; letter-spacing: -0.02em; color: var(--main-color); transition: var(--transition-custom);}
.post-case-inner .case-list-btn:hover {background-color: var(--main-color); color: #fff;}

/* ****************** 서비스 소개 :: 공통 ********************** */
@media all and (max-width: 800px) {
	/*** 공통 서브 타이틀 ***/
	.cm-sub-tit-box {margin-bottom: 4.5rem;}
	.cm-sub-tit-box .cm-sub-tit {font-size: 2.4rem;}
	.cm-sub-tit-box .cm-sub-txt br {display: none;}

	/*** 공통 레이아웃 ***/
	.service-cm-content-con {display: block; margin-top: 6rem;}
	.service-cm-content-con .tit-wrap {width: 100%; padding-right: 0; margin-bottom: 3rem;}
	.service-cm-content-con .tit-wrap .cm-content-tit {font-size: 3rem;}
	.service-cm-content-con .content-wrap {width: 100%;}

	/*** 탭 ***/
	.service-page-tab-style {margin-top: 2rem;}
	.service-page-tab-style .sub-drop-open-btn-style {background-color: var(--main-color);}
}

/* ****************** 서비스 소개 :: HT POST ********************** */
@media all and (max-width: 800px) {
	.post-content {padding-bottom: 7rem;}

	/*** HT POST 설치 효과 ***/
	.effect-item-wrap {display: flex; flex-direction: column-reverse;}
	.post-effect-con {height: auto; padding: 6rem 0;}
	.effect-item-list-box {grid-template-columns: repeat(1, 1fr); margin-top: 3rem;}
	.effect-item-list-box .effect-item-list {padding: 3rem;}
	.effect-item-list-box .effect-item-list:nth-child(even) {justify-content: initial; text-align: initial;}
	.effect-item-list-box .effect-item-list .effect-list-tit {margin-top: 1.5rem; font-size: 2.2rem;}
	.effect-item-list-box .effect-item-list .effect-list-txt {margin-top: 1rem;}
	.effect-item-wrap .effect-item-circle {position: static; transform: translate(0,0); margin: 0 auto;}


	/*** HT POST 콘텐츠 구성 ***/
	.post-content-img-box {padding: 2rem;}
	
	/*** HT POST 현장 사례 ***/
	.post-case-inner {padding: 0;}
	.post-case-list {grid-template-columns: repeat(2, 1fr);}
	.post-case-list .list-item .img-box .img-over-thum i {font-size: 32px;}
}

@media all and (max-width: 480px) {
	/*** HT POST 현장 사례 ***/
	.post-case-list {grid-template-columns: repeat(1, 1fr);}
	.post-case-list .list-item .img-box img {max-width: auto; width: 100%; height: 100%;}
}

/* ****************** 서비스 소개 :: HT PLUS ********************** */
/*** 공통 ***/
.plus-content {padding-bottom: 15rem;}
.plus-content .top-banner-con {position: relative; width: 100%; height: 0; padding-top: 41.995%;}
.plus-content .top-banner-con > .area {position: relative;}
.plus-content .top-banner-con .inner {display: flex; flex-direction: column; align-items: center; text-align: center; position: absolute; bottom: 11rem; width: 100%;}
.plus-content .top-banner-con .inner .square-box {display: flex; gap: 0.8rem;}
.plus-content .top-banner-con .inner .square-box .square {width: 0.8rem; height: 0.8rem; background-color: #fff;}

.border-active-list-inner {position: relative;}

.dot-falling {position: relative; left: -9999px; width: 0.8rem; height: 0.8rem; background-color: #fff; color: #9880ff; box-shadow: 9999px 0 0 0 #fff; animation: dot-falling 1s infinite linear; animation-delay: 0.1s;}
.dot-falling::before, .dot-falling::after {content: ""; display: inline-block; position: absolute; top: 0;}
.dot-falling::before {width: 0.8rem; height: 0.8rem; background-color: #fff; color: #9880ff; animation: dot-falling-before 1s infinite linear; animation-delay: 0s;}
.dot-falling::after {width: 0.8rem; height: 0.8rem; background-color: #fff; color: #9880ff; animation: dot-falling-after 1s infinite linear; animation-delay: 0.2s;}

@keyframes dot-falling {
  0% {
    box-shadow: 9999px -15px 0 0 rgba(255, 255, 255, 0);
  }
  25%, 50%, 75% {
    box-shadow: 9999px 0 0 0 #fff;
  }
  100% {
    box-shadow: 9999px 15px 0 0 rgba(255, 255, 255, 0);
  }
}
@keyframes dot-falling-before {
  0% {
    box-shadow: 9984px -15px 0 0 rgba(255, 255, 255, 0);
  }
  25%, 50%, 75% {
    box-shadow: 9984px 0 0 0 #fff;
  }
  100% {
    box-shadow: 9984px 15px 0 0 rgba(255, 255, 255, 0);
  }
}
@keyframes dot-falling-after {
  0% {
    box-shadow: 10014px -15px 0 0 rgba(255, 255, 255, 0);
  }
  25%, 50%, 75% {
    box-shadow: 10014px 0 0 0 #fff;
  }
  100% {
    box-shadow: 10014px 15px 0 0 rgba(255, 255, 255, 0);
  }
}

.plus-content .check-txt-box {margin-bottom: 3rem;}
.plus-content .check-txt-box .check-tit {display: flex; font-size: 2.5rem; font-weight: 700; letter-spacing: -0.05em; line-height: 1.2; color: #000;}
.plus-content .check-txt-box .check-tit i {padding-right: 1rem; line-height: 1.2em;}
.plus-content .check-txt-box .txt {margin-top: 1.2rem; font-size: 1.7rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.76; color: #666;}

.plus-content .top-banner-con .inner .ht-plus-top-banner-tit {margin-top: 2rem; font-size: 5.5rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.4; color: #fff;}
.plus-content .top-banner-con .inner .ht-plus-top-banner-st {font-size: 2rem; font-weight: 700; letter-spacing: -0.075em; line-height: 1.4; color: #fff;}
.plus-content .top-banner-con .inner .ht-plus-top-banner-txt {margin-top: 4rem; font-size: 1.7rem; font-weight: 500; letter-spacing: -0.075em; line-height: 1.76; color: rgba(255, 255, 255, 0.8);}
/* .plus-content .top-banner-con .inner .square-box .square.square01 {background-color: } */

/********** 1번 탭 **********/
.plus-content .top-banner-con.tab01-banner {background: center / cover no-repeat url("/images/content/ht_plus_tab01_top_banner.jpg");}

/* 공통 */
.cm-plus-tab-con .border-active-list .list-item .txt-box .txt-box-inner {position: relative; width: 50%; margin-right: 4rem; padding-right: 4rem; border-right: 2px dotted #eee; box-sizing: border-box;}
.cm-plus-tab-con .border-active-list .list-item .txt-box .txt-box-inner:last-child {margin-right: 0; padding-right: 0; border-right: 0;}
.cm-plus-tab-con .border-active-list .list-item .txt-box .txt-box-inner.border-none {border: none;}
.cm-plus-tab-con .border-active-list .list-item .txt-box .txt-box-inner .inner-list-tit {margin-bottom: 1.7rem; font-size: 2rem; font-weight: 700; letter-spacing: -0.05em; line-height: 1.3; color: #000;}
.cm-plus-tab-con .border-active-list .list-item .txt-box .txt-box-inner .inner-list-box .inner-list {position: relative; padding-left: 1rem; margin-bottom: 0.5rem; font-size: 1.5rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.5; color: #666;}
.cm-plus-tab-con .border-active-list .list-item .txt-box .txt-box-inner .inner-list-box .inner-list::before {position: absolute; content: ""; top: 1.025rem; left: 0; width: 5px; height: 2px; background-color: #666;}
.cm-plus-tab-con .border-active-list .list-item .txt-box .txt-box-inner .inner-list-box .inner-list:last-child {margin-bottom: 0;}

/* 유지관리 서비스 구성 */
.maintenance-service-con .content-wrap {padding: 5rem 5rem 4.5rem 5rem;}
.maintenance-service-con .border-active-list .list-item .icon-box {flex-direction: column; width: 25rem; min-height: 25rem;}
.maintenance-service-con .border-active-list .list-item .icon-box p {padding-top: 2.5rem; font-size: 2.2rem; font-weight: 700; letter-spacing: -0.05em; line-height: 1.36; color: #fff;}
.maintenance-service-con .border-active-list .list-item .icon-box img {position: static;}
.maintenance-service-con .border-active-list .list-item .txt-box {align-items: stretch; width: calc(100% - 25rem); min-height: 25rem; padding: 4.5rem 4rem;}

.maintenance-service-con .check-list-txt-box {margin-top: 3.5rem;}
.maintenance-service-con .check-list-txt-box .check-list-txt {position: relative; padding-left: 2.5rem; margin-bottom: 1rem; font-size: 1.7rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.5; color: #666;}
.maintenance-service-con .check-list-txt-box .check-list-txt:last-child {margin-bottom: 0;}
.maintenance-service-con .check-list-txt-box .check-list-txt::before {position: absolute; font-family: "xeicon"; content: "\e929"; left: 0;}

/* 수행절차 */
.performance-con .content-wrap {padding: 6rem 5rem;}
.performance-con .border-active-list .list-item {display: block;}
.performance-con .border-active-list .list-item .icon-box {width: 100%; min-height: 7rem;}
.performance-con .border-active-list .list-item .icon-box span {display: inline-block; width: 1.9rem; height: 2rem;}
.performance-con .border-active-list .list-item .icon-box span img {max-width: 100%; max-height: 100%;}
.performance-con .border-active-list .list-item .icon-box p {padding-left: 1rem; font-size: 2rem; font-weight: 700; letter-spacing: -0.05em; line-height: 1.5; color: #fff;}
.performance-con .border-active-list .list-item .txt-box {align-items: stretch; padding: 2.5rem;}
.performance-con .border-active-list .list-item .txt-box .txt-box-inner {width: 33.333%;}
.performance-con .border-active-list .list-item .txt-box .txt-box-inner:first-child, .performance-con .border-active-list .list-item .txt-box .txt-box-inner:nth-child(2) {margin-right: 3rem; padding-right: 3rem; border-right: 2px dotted #eee; box-sizing: border-box;}

.performance-system-list-inner {margin-top: 6rem;}
.performance-system-list-inner .system-list-tit {text-align: center; font-size: 2rem; font-weight: 600; letter-spacing: -0.05em; line-height: 1.25; color: #000;}
.performance-system-list-inner .system-list-tit span {color: var(--main-color);}
.performance-system-list-inner .performance-system-list {display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 0 0.5rem; margin-top: 2rem;}
.performance-system-list-inner .performance-system-list .list-item {display: flex; align-items: center; border-radius: 1rem; background-color: #fff; padding: 1.85rem 2rem; box-sizing: border-box;}
.performance-system-list-inner .performance-system-list .list-item .icon-box {width: 4.8rem; height: 4.8rem;}
.performance-system-list-inner .performance-system-list .list-item .icon-box img {max-width: 100%; max-height: 100%;}
.performance-system-list-inner .performance-system-list .list-item .system-list-txt {padding-left: 1.5rem; font-size: 1.7rem; font-weight: 700; letter-spacing: -0.05em; line-height: 1.5; color: #000; box-sizing: border-box;}
.performance-system-list-inner .performance-system-list .list-item .system-list-txt02 {padding-left: 1.5rem; font-size: 1.5rem; font-weight: 500; letter-spacing: -0.06em; line-height: 1.5; color: #666; box-sizing: border-box;}

/* 기대효과 */
.effect-con .content-wrap {padding: 6rem 5rem;}
.plus-tab01-sub-con .performance-con .border-active-list .list-item .txt-box .txt-box-inner .inner-list-tit {font-size: 1.7rem;}
.effect-network-list {border-top: 2px solid #000; box-sizing: border-box;}
.effect-network-list .list-item {display: flex; align-items: center; padding: 3rem 0; border-bottom: 2px dotted #eee; box-sizing: border-box;}
.effect-network-list .list-item:last-child {padding-bottom: 0; border-bottom: none;}
.effect-network-list .list-item .icon-box {display: flex; align-items: center; justify-content: center; width: 14rem; height: 14rem; padding: 3rem; border-radius: 2rem; background-color: #fff; box-sizing: border-box;}
.effect-network-list .list-item .icon-box img {max-width: 100%; max-height: 100%;}
.effect-network-list .list-item .txt-box {width: calc(100% - 14rem); padding-left: 3.5rem; box-sizing: border-box;}
.effect-network-list .list-item .txt-box .network-list-tit {margin-bottom: 1rem; font-size: 2rem; font-weight: 600; letter-spacing: -0.05em; line-height: 1.5; color: #000;}
.effect-network-list .list-item .txt-box .network-list-txt {position: relative; margin-bottom: 0.5rem; padding-left: 1rem; font-size: 1.5rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.5; color: #666;}
.effect-network-list .list-item .txt-box .network-list-txt:last-child {margin-bottom: 0;}
.effect-network-list .list-item .txt-box .network-list-txt::before {position: absolute; top: 1.025rem; left: 0; content: ""; width: 5px; height: 2px; background-color: #666;}

/********** 2번 탭 **********/
.plus-content .top-banner-con.tab02-banner {background: center / cover no-repeat url("/images/content/ht_plus_tab02_top_banner.jpg");}

/* 창고 규격정보 */
.storage-schema-box {padding: 7.15rem;}
.storage-schema-box img {display: block; margin: auto; max-width: 100%; max-height: 100%;}

/* 세대 공간을 활용 극대화 */
.optimizing-space-con .content-wrap {padding: 5.5rem 5rem 6rem 5rem; box-sizing: border-box;}
.optimizing-space-con .border-active-list {padding-bottom: 6.5rem; border-bottom: 2px dotted #eee;}
.optimizing-space-con .service-circle {left: 50%; bottom: -2rem; transform: translateX(-50%);}
.optimizing-space-con .border-active-list .list-item .icon-box {width: 13.5rem; min-height: 13.5rem;}
.optimizing-space-con .border-active-list .list-item .txt-box {flex-direction: column; align-items: initial; justify-content: center; width: calc(100% - 13.5rem); padding: 2rem 4rem; min-height: 13.5rem;}
.optimizing-space-con .border-active-list .list-item .txt-box .border-active-list-tit {margin-bottom: 0.5rem; font-size: 2.2rem; font-weight: 700; letter-spacing: -0.05em; line-height: 1.36; color: #000;}
.optimizing-space-con .border-active-list .list-item .txt-box .border-active-list-tit span {padding-left: 0.5rem; font-size: 1.2rem; letter-spacing: -0.02em; color: #aaa;}
.optimizing-space-con .border-active-list .list-item .txt-box .border-active-list-txt {font-size: 1.5rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.73; color: #666;}

.optimizing-space-img-box {position: relative; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 8rem; margin-top: 6.5rem;}
.optimizing-space-img-box::before {position: absolute; content: ""; width: 18.2rem; height: 100%; left: 50%; top: 50%; background: center / cover no-repeat url("/images/content/optimizing_space_gradient.png"); transform: translate(-50%, -50%); z-index: 0;}
.optimizing-space-img-box::after {position: absolute; content: ""; width: 3.4rem; height: 1rem; left: 50%; top: 50%; background: center / cover no-repeat url("/images/content/optimizing_space_arrow.png"); transform: translate(-50%, -50%); z-index: 0;}
.optimizing-space-img-box .img-list {position: relative; z-index: 1; border-radius: 1rem; overflow: hidden;}
.optimizing-space-img-box .img-list.after {box-shadow: 0 1.5rem 3rem 0 rgba(0, 0, 0, 0.3);}
.optimizing-space-img-box .img-list.after::before {position: absolute; content: ""; top: 0; left: 0; width: 100%; height: 100%; border: 4px solid var(--main-color); border-radius: 1rem; box-sizing: border-box;}
.optimizing-space-img-box img {max-width: 100%;}

/********** 3번 탭 **********/
.plus-content .top-banner-con.tab03-banner {background: center / cover no-repeat url("/images/content/ht_plus_tab03_top_banner.jpg");}

/* 원패스 출입 */
.one-pass-img-box {padding: 9.45rem 4.7rem; box-sizing: border-box;}
.one-pass-img-box img {display: block; margin: auto; max-width: 100%; max-height: 100%; padding-top: 1.5rem;}

/* 블루투스 문열림 */
.bluetooth-door-con .content-wrap {padding: 6rem 5rem 5rem 5rem;}
.bluetooth-door-con .bluetooth-door-img-box {border-radius: 1rem; overflow: hidden;}
.bluetooth-door-con .bluetooth-door-img-box img {max-width: 100%;}
.bluetooth-door-con .bluetooth-door-list {display: grid; grid-template-columns: repeat(4, 1fr); padding: 2rem 0 4.5rem 0;}
.bluetooth-door-con .bluetooth-door-list .list-item {display: flex; flex-direction: column; align-items: center; justify-content: center; border-right: 2px dotted #eee;}
.bluetooth-door-con .bluetooth-door-list .list-item:last-child {border-right: none;}
.bluetooth-door-con .bluetooth-door-list .icon-box {position: relative; width: 48.39%; height: 0; padding-top: 48.39%; border-radius: 50%; background-color: #fff; box-shadow: 0 1rem 2rem 0 rgba(228, 0, 70, 0.1);}
.bluetooth-door-con .bluetooth-door-list .icon-box .inner {display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 2px solid var(--main-color); border-radius: 50%; box-sizing: border-box;}
.bluetooth-door-con .bluetooth-door-list .txt-box {margin-top: 2.5rem; min-height: 8.6rem; text-align: center;}
.bluetooth-door-con .bluetooth-door-list .txt-box h5 {margin-bottom: 0.4rem; font-size: 2.2rem; font-weight: 700; letter-spacing: -0.05em; line-height: 1.36; color: #000;}
.bluetooth-door-con .bluetooth-door-list .txt-box p {font-size: 1.5rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.73; color: #666;}

/* 블루투스 출입장치 */
.bluetooth-access-con .content-wrap {padding: 6rem 5rem;}
.bluetooth-access-list {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 1rem;}
.bluetooth-access-list .list-item {display: flex; align-items: center; border: 1px solid #eee; border-radius: 0.5rem; background-color: #fff; padding: 1.626rem 3rem; box-sizing: border-box;}
.bluetooth-access-list .list-item p {padding-left: 0.7rem; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.5; color: #666;}
.bluetooth-access-list .list-item i {font-size: 1.7rem; font-weight: 400; letter-spacing: -0.05em; line-height: 1.5; color: #aaa;}

.bluetooth-access-table {width: 100%; border-top: 2px solid #000; margin: 6rem 0 0 0;}
.bluetooth-access-table tr {border-bottom: 1px solid rgba(0, 0, 0, 0.1);}
.bluetooth-access-table tr td {padding: 1.25rem 3rem; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.5; color: #666;}
.bluetooth-access-table tr td:first-child {text-align: center; background-color: #fff; color: #000;}

/* ****************** 서비스 소개 :: HT PLUS ********************** */
@media all and (max-width: 1280px) {
	/*** 공통 ***/
	.plus-content .top-banner-con .inner {bottom: 8rem;}
	.plus-content .check-txt-box .check-tit {font-size: 2.2rem;}

	/********** 3번 탭 **********/
	/* 원패스 출입 */
	.one-pass-img-box {padding: 1rem;}

	/* 블루투스 문열림 */
	.bluetooth-door-con .bluetooth-door-list {grid-template-columns: repeat(2, 1fr); grid-gap: 4rem 0;}
	.bluetooth-door-con .bluetooth-door-list .list-item:nth-child(2) {border-right: 0;}
}

@media all and (max-width: 800px) {
	/*** 공통 ***/
	.plus-content {padding-bottom: 7rem;}
	.plus-content .check-txt-box {margin-bottom: 2rem;}
	.plus-content .top-banner-con {padding-top: 55%;}
	.plus-content .top-banner-con > .area {width: calc(100% - var(--area-padding) * 2); padding: 0;}
	.plus-content .top-banner-con .inner {bottom: 4rem;}
	.plus-content .top-banner-con .inner .ht-plus-top-banner-tit {font-size: 3.2rem;}
	.plus-content .top-banner-con .inner .ht-plus-top-banner-txt {margin-top: 2rem;}

	/********** 1번 탭 **********/
	/* 유지관리 서비스 구성 */
	.maintenance-service-con .border-active-list .list-item {display: block;}
	.maintenance-service-con .border-active-list .list-item .icon-box {flex-direction: initial; width: 100%; min-height: 11rem;}
	.maintenance-service-con .border-active-list .list-item .icon-box p {padding: 0 0 0 2rem; font-size: 1.8rem;}
	.maintenance-service-con .border-active-list .list-item .icon-box img {max-width: 15%; max-height: 15%;}
	.maintenance-service-con .border-active-list .list-item .txt-box {display: block; width: 100%; min-height: auto; padding: 2rem;}
	.plus-tab01-sub-con .border-active-list .list-item .txt-box {display: block;}
	.plus-tab01-sub-con .border-active-list .list-item .txt-box .txt-box-inner {width: 100%; padding: 0 0 1.5rem 0; margin: 0 0 1.5rem 0;}
	.plus-tab01-sub-con .border-active-list .list-item .txt-box .txt-box-inner {border-right: 0; border-bottom: 2px dotted #eee;}
	.plus-tab01-sub-con .border-active-list .list-item .txt-box .txt-box-inner:last-child {border-bottom: 0; padding-bottom: 0; margin-bottom: 0;}
	.plus-tab01-sub-con .border-active-list .list-item .txt-box .txt-box-inner .inner-list-tit {margin-bottom: 1rem;}

	/* 수행절차 */
	.performance-system-list-inner .performance-system-list {grid-template-columns: repeat(1, 1fr); grid-gap: 1rem 0;}

	/* 기대효과 */
	.effect-network-list .list-item .icon-box img {max-width: 70%; max-height: 70%;}

	/********** 2번 탭 **********/
	/* 창고 규격정보 */
	.storage-schema-box {padding: 1rem;}

	/* 세대 공간을 활용 극대화 */
	.optimizing-space-con .content-wrap {padding: 3rem;}
	.optimizing-space-con .check-txt-box .check-tit {font-size: 2rem;}
	.optimizing-space-con .check-txt-box .check-tit i {padding-right: 0.5rem;}
	.optimizing-space-con .check-txt-box .txt {font-size: 1.5rem;}
	.optimizing-space-con .border-active-list .list-item .txt-box {padding: 2rem;}
	.optimizing-space-con .border-active-list .list-item .icon-box {min-height: 11rem;}

	/********** 3번 탭 **********/
	/* 블루투스 출입장치 */
	.bluetooth-access-list {grid-template-columns: repeat(1, 1fr);}
	.bluetooth-access-table {margin-top: 3rem;}
	.bluetooth-access-table colgroup col:first-child {width: 30% !important;}
	.bluetooth-access-table colgroup col:last-child {width: 70% !important;}

	.bluetooth-access-table tr td {padding: 1.25rem 1.5rem;}
}

@media all and (max-width: 480px) {
	/* 공통 */
	.plus-content .top-banner-con {padding-top: 85%;}

	/********** 1번 탭 **********/
	/* 기대효과 */
	.effect-network-list .list-item {display: block;}
	.effect-network-list .list-item .txt-box {width: 100%; margin-top: 2rem; padding-left: 0;}
	.effect-network-list .list-item .icon-box {width: 100%;}

	/********** 2번 탭 **********/
	/* 세대 공간을 활용 극대화 */
	.optimizing-space-img-box {grid-template-columns: repeat(1, 1fr);}
	.optimizing-space-img-box::before {width: 50%; height: 68.5%; transform: translate(-50%, -50%) rotateZ(90deg);}
	.optimizing-space-img-box::after {transform: translate(calc(-50% + 0.3px), calc(-50% + 0.3px)) rotateZ(90deg);}

	/********** 3번 탭 **********/
	/* 블루투스 문열림 */
	.bluetooth-door-con .bluetooth-door-list {grid-template-columns: repeat(2, 1fr); grid-gap: 4rem 0;}
	.bluetooth-door-con .bluetooth-door-list .list-item {padding: 0 1rem;}
	.bluetooth-door-con .bluetooth-door-list .icon-box {width: 65.82%; padding-top: 65.82%;}

	/* 블루투스 출입장치 */
	.bluetooth-access-list {grid-template-columns: repeat(1, 1fr);}
	.bluetooth-access-table colgroup col:first-child {width: 40% !important;}
	.bluetooth-access-table colgroup col:last-child {width: 60% !important;}
}

/* ****************** 서비스 소개 :: 자동문 제어 시스템 ********************** */
.automatic-system-con {display: flex; align-items: center; justify-content: center; position: relative; width: 100%; height: 104rem; background: center / cover no-repeat url("/images/content/automatic_door_bg.jpg");}
.automatic-system-con .system-wrap {position: relative; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 2rem; width: 100%;}
.automatic-system-con .system-wrap .left-inner, .automatic-system-con .system-wrap .right-inner {background-color: rgba(255, 255, 255, 0.8); border-radius: 1rem;}
.automatic-system-con .system-wrap .left-inner {position: relative; padding: 6.45rem 3rem; box-sizing: border-box;}
.automatic-system-con .system-wrap .left-inner .schema-box {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;}
.automatic-system-con .system-wrap .left-inner .schema-box img {display: block; max-width: 100%; max-height: 100%;}
.automatic-system-con .system-wrap .left-inner .circle {position: absolute; content: ""; top: 50%; right: -6.5rem; display: flex; align-items: center; justify-content: center; width: 5.6rem; height: 5.6rem; border-radius: 50%; background-color: var(--main-color); font-size: 2.5rem; color: #fff; box-shadow: 0 1rem 2rem 0 rgba(228, 0, 70, 0.3); transform: translate(-50%, -50%);}
.automatic-system-con .system-wrap .left-inner .circle::before {position: absolute; content: ""; width: 7rem; height: 7rem; border-radius: 50%; background-color: rgba(228, 0, 70, 0.1);}

.automatic-system-con .system-wrap .right-inner {padding: 4.5rem; box-sizing: border-box;}

/*** 공통 보더 액티브 리스트 ***/
.automatic-door-content .border-active-list .list-item .icon-box {width: 10rem; min-height: 10rem;}
.automatic-door-content .border-active-list .list-item .txt-box {width: calc(100% - 10rem); min-height: 10rem;}

/* ****************** 서비스 소개 :: 자동문 제어 시스템 ********************** */
@media all and (max-width: 800px) {
	.automatic-system-con {height: auto; padding: 6rem 0;}
	.automatic-system-con .system-wrap {grid-template-columns: repeat(1, 1fr);}
	.automatic-system-con .system-wrap .left-inner {padding: 4rem 3rem;}
	.automatic-system-con .system-wrap .left-inner .circle {right: auto; left: 50%; top: auto; bottom: -6.5rem; transform: translate(-50%, -50%) rotateZ(90deg);}
	.automatic-system-con .system-wrap .left-inner .circle i {padding-top: 0.4rem;}

	.automatic-system-con .system-wrap .right-inner {padding: 4.5rem 3rem;}
}