/* ============================================================================================================================== */
/* ======================================================= custom common 코드 ==================================================== */
/* ============================================================================================================================== */


.zoom-wrap {position: relative; overflow: hidden;}
.zoom-mask{
  position: absolute;
  inset: 0;
  overflow: hidden;   /* 배경만 잘라냄 */
  z-index: 0;
  pointer-events: none;
}
.zoom {transform: scale(1.12); transition: transform 0.8s ease-in-out; width: 100%;}
.zoom.active {transform: scale(1); transition: transform 2.4s ease-in-out;}

.line{width: 30px;height: 5px;background: #000;margin-top: 20px;margin-bottom: 20px;}

.bg-animation {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}


/* 타이틀 밑 바 스타일 */
.bar {margin: 20px auto;width: 30px;height: 4px;background: #fff;}



.progress-ring-circle {transition: 2.4s stroke-dashoffset; transform: rotate(-90deg); transform-origin: 50% 50%;}

.pc-layout {display: block;}
.mobile-layout {display: none;}

.fade {opacity: 1; transition: opacity 0.5s;}
.fade.out {opacity: 0.6; transition: opacity 3s; /* 페이드 효과 시간 조정 */}

.btn-hover {position: relative; transition: all 0.5s ease-in-out; overflow: hidden;}
.btn-hover::before {position: absolute; content: ''; left: 0; top: 0; width: 0; height: 100%; transition: all 0.5s ease-in-out; z-index: -1;}
.btn-hover:hover::before {width: 100%;}

.process-tit{position: relative;display: inline-block;}
.process-tit:before{content:"";width: 97px;height: 68px;background: url(../img/custom/quot_left.png);position: absolute;top:0;left: -100px;}
.process-tit:after{content:"";width: 97px;height: 68px;background: url(../img/custom/quot_right.png);position: absolute;top:0;right:-100px;}


/*================================================================ 1500px 이하 ================================================================= */
@media screen and (max-width:1500px) {

}

/*================================================================ 1200px 이하 ================================================================= */
@media screen and (max-width:1200px) {

}

/*================================================================ 1025px 이하 ================================================================= */
@media screen and (max-width:1025px) {

}

/*================================================================ 900px 이하 ================================================================= */
@media screen and (max-width:900px) {

}

/*================================================================ 769px 이하 ================================================================= */
@media screen and (max-width:769px) {

}

/*================================================================ 600px 이하 ================================================================= */
@media screen and (max-width:600px) {

}

/*================================================================ 425px 이하 ================================================================= */
@media screen and (max-width:425px) {
.pc-layout {display: none !important;}
.mobile-layout {display: block !important;}
}


/* ============================================================================================================================== */
/* ======================================================= custom common 코드 ==================================================== */
/* ============================================================================================================================== */