
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* 메인 컨텐츠 공통영역 */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* 레이아웃 공통 */
.sec-main {position: relative; width: 100%;}
.sec-main .inner {display: flex; flex-wrap: wrap; margin: 0 auto; width: 100%; max-width: var(--max-width);}

/* 메인 컨텐츠별 타이틀 공통 */
.title-common {position: relative; width: 100%; text-align: center;}
.title-common .tit-eng {font-family: "Saira", sans-serif; transform: rotate(-0.03deg); font-size: 2.2rem; color: #000; font-weight: 500; letter-spacing: -0.035rem; line-height: 1.1;}
.title-common h2 {font-family: "SCoreDream", sans-serif; font-size: 5rem; color: #000; font-weight: 500; letter-spacing: -0.025rem; line-height: 1.2; word-break: keep-all; margin-top: 1rem; margin-left: -0.3rem;}
.title-common h2 strong {font-size: 6rem; font-weight: 900; color: var(--default-color); animation: pulse-animation 1s ease-in-out infinite alternate;}
.title-common p {font-family: "SCoreDream", sans-serif; font-size: 2.8rem; color: #000; font-weight: 300; letter-spacing: -0.035rem; line-height: 1.6; word-break: keep-all; margin-top: 3rem;}
.title-common p strong {font-weight: 800;}

@keyframes pulse-animation {
  0% {
    opacity: 0.7; /* 보통 밝기 */
    filter: drop-shadow(0 0 5px rgba(5,117,230,0.2));
  }
  100% {
    opacity: 1; /* 최대 밝기 (강한 빛 번짐) */
    filter: drop-shadow(0 0 20px rgba(5,117,230,0.5))
            drop-shadow(0 0 40px rgba(5,117,230,0.2));
  }
}

/* 메인 컨텐츠별 바로가기 버튼 공통 */
.right-more {position: relative; margin-top: 5rem;}
.right-more .morebtn {display: inline-flex; width: auto;}
.right-more .morebtn a {display: flex; align-items: center; flex-wrap: wrap; width: 100%; padding: 1.2rem 2.4rem; border: 1px solid rgba(255,255,255,0.25); border-radius: 5.8rem; transition: var(--transition1);}
.right-more .morebtn a span {font-size: 1.45rem; color: #fff; font-weight: 500; transition: var(--transition1);}
.right-more .morebtn a i {font-size: 1.85rem; color: #fff; margin-left: 2rem;}

/* 메인 컨텐츠별 바로가기 버튼 공통 - 마우스롤오버 효과 */
.right-more .morebtn a:hover {background-color: var(--default-color); border: 1px solid var(--default-color);}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* 메인 컨텐츠 - 바로가기 상단고정 탭버튼 영역 */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.fixed-gap {position: -webkit-sticky; position: sticky; top: 6.5rem; width: 100%; height: 5rem; background: #fff; border-bottom: 1px solid rgba(0,0,0,0.05); z-index: 100000000;} /* 스크롤시 메뉴 밑으로 상단 고정 */
.fixed-gap .tabs-container {width: 100%;}
.fixed-gap .tabs-container ul {width: 100%; text-align: center;}
.fixed-gap .tabs-container ul li {display: inline-flex; width: auto; padding: 0 2rem;}
.fixed-gap .tabs-container ul li a {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; padding-top: 0.6rem; width: 100%; height: 5rem; font-family: "SCoreDream", sans-serif; font-size: 1.45rem; color: #464646; font-weight: 500; letter-spacing: -0.040rem; border-bottom: 4px solid rgba(255,255,255,0); transition: var(--transition1);}
.fixed-gap .tabs-container ul li a:hover {color: var(--default-color);}
.fixed-gap .tabs-container ul li.on a {color: var(--default-color); border-bottom: 4px solid var(--default-color);}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* 메인 컨텐츠 - 소개 영역 */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.main-overview {width: 100%;}

.overview-wrap {position: relative; width: 100%; padding: 15rem 0 10rem;}
.overview-wrap:before {content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("../images/main_visual_BG.jpg"); background-repeat: no-repeat; background-position: center top; background-size: cover; z-index: -1;}
.overview-wrap .title-common p {font-size: 3.4rem; font-weight: 400; line-height: 1.45;}

.visual-icon {position: relative; width: 100%; padding-top: 8rem;}
.visual-icon .aniico-wrap {position: absolute; top: 0; left: 0; width: 100%;}
.visual-icon .aniico-wrap .left-ico {position: absolute; top: 0; left: 0; width: 32.9rem; height: 25.4rem; margin-top: 38rem; margin-left: 4rem;}
.visual-icon .aniico-wrap .left-ico img {max-width: 100%; animation:mainItem 3s ease-in-out infinite alternate;}
.visual-icon .aniico-wrap .right-ico {position: absolute; top: 0; right: 0; width: 29rem; height: 23.7rem; margin-top: 1.5rem; margin-right: 2rem;}
.visual-icon .aniico-wrap .right-ico img {max-width: 100%; animation:mainItem 4s ease-in-out infinite alternate;}
.visual-icon .centerico-wrap {width: 100%; text-align: center;}
.visual-icon .centerico-wrap img {max-width: 100%;}

@keyframes mainItem{
  0%{transform:translate(0, 10%);}
  100%{transform:translate(0, -10%);}
}

/* 메인 컨텐츠 - 소개 영역 - 메인 영상 영역 */
.mainmedia-wrap {position: relative; width: 100%; margin-top: 8rem; overflow: hidden;}
.mainmedia-wrap .video-container {position: relative; width: 100%; height: 80rem;}
.mainmedia-wrap .video-container video {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover;} /*영상배치, 비율유지*/
/*.mainmedia-wrap .bg-gradient {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: linear-gradient(to left, transparent 0%, #fff 90%); z-index: 2;}*/ /*배경 그라데이션 BG*/

/* 메인 컨텐츠 - 제작안내 영역 */
.productionGuide-wrap {position: relative; width: 100%; padding: 5rem 0 15rem; background: linear-gradient(to bottom, #ffffff, #f9f9f9);}
.sec-title {width: 100%; text-align: center;}
.sec-title2 {margin-top: 10rem;}
.sec-title .tit-ico {display: inline-flex; width: 15rem;}
.sec-title .tit-ico img {width: 100%;}
.sec-title p {font-family: "SCoreDream", sans-serif; font-size: 3.2rem; color: #3c3c3c; font-weight: 500; letter-spacing: -0.035rem; line-height: 1.55;}
.sec-title p strong {color: var(--default-color); font-weight: 800;}

.guidecontent-wrap {width: 100%; margin-top: 5rem;}
.guidecontent-wrap ul {display: flex; justify-content: center; align-items: stretch; /*높이 맞춤*/ width: 100%;}
.guidecontent-wrap li {flex: 1; min-width: 30rem; position: relative; transition: var(--transition1);}
.guidecontent-wrap li:last-child {margin-right: 0;}
.guidecontent-wrap li:hover {z-index: 10; /* 순서 최상위로 */ transform: translateY(-10px); /* 살짝 위로 뜸 */}
.guidecontent-wrap li .item-box {display: flex; flex-direction: column; align-items: center; text-align: center; padding: 10px;}
.guidecontent-wrap li .item-box .circle {display: flex; align-items: center; justify-content: center; width: 20rem; height: 20rem; background: linear-gradient(135deg, #4bb9ff 0%, #2575fc 100%); border-radius: 50%; font-family: "SCoreDream", sans-serif; font-weight: 700; color: #fff; font-size: 2.4rem; line-height: 1.45; box-shadow: 0 5px 15px rgba(37,117,252,0.4); z-index: 2; position: relative; margin-bottom: -4rem;}
.guidecontent-wrap li .item-box .txtbox {background-color: #fff; width: 100%; padding: 7rem 2rem 3rem; border-radius: 2rem; box-shadow: 0 10px 30px rgba(0,0,0,0.1); border: 1px solid rgba(0,0,0,0.05); z-index: 1;}
.guidecontent-wrap li .item-box .txtbox p {font-size: 1.85rem; color: #555; line-height: 1.45; word-break: keep-all;}

/* 메인 컨텐츠 - 제작안내 영역 - AI모델 생성 안내 */
.guidemodel-wrap {width: 100%; margin-top: 5rem;}
.guidemodel-wrap ul {display: flex; justify-content: space-between; align-items: stretch; /*높이 맞춤*/ width: 100%;}
.guidemodel-wrap ul li {width: 48.4375%;}
.guidemodel-wrap ul li .box {width: 100%; box-shadow: 0 10px 30px rgba(0,0,0,0.1); border-radius: 2rem; overflow: hidden;}
.guidemodel-wrap ul li .box .img-box {width: 100%;}
.guidemodel-wrap ul li .box .img-box img {width: 100%;}
.guidemodel-wrap ul li .box .info-txt {width: 100%; padding: 3rem 3rem; border: 1px solid rgba(0,0,0,0.1); border-top: 0;}
.guidemodel-wrap ul li .box .info-txt .tit {font-family: "SCoreDream", sans-serif; font-size: 2.4rem; color: #252525; font-weight: 600; letter-spacing: -0.035rem; line-height: 1.15;}
.guidemodel-wrap ul li .box .info-txt p {font-size: 1.85rem; color: #555; line-height: 1.45; word-break: keep-all; margin-top: 1rem;}

/* 메인 컨텐츠 - 제작과정 프로세스 영역 */
.produceprocess-wrap {position: relative; display: flex; flex-wrap: wrap; width: 100%; padding: 15rem 0; /*background-color: var(--default-bggraycolor);*/ border-top: 1px solid #ddd;}
.produceprocess-wrap .left {width: 40%;}
.produceprocess-wrap .left .titbox {position: -webkit-sticky; position: sticky; top: 15rem; width: 100%; text-align: left;}
.produceprocess-wrap .left .titbox h3 {font-family: "Saira", sans-serif; transform: rotate(-0.03deg); font-size: 5.5rem; color: var(--default-color); font-weight: 700; letter-spacing: -0.035rem; line-height: 1;}
.produceprocess-wrap .left .titbox h3 strong {font-size: 6.5rem; color: #000; font-weight: 800;}
.produceprocess-wrap .left .titbox .tit-ico {display: flex; width: 28rem; margin-top: 5rem;}
.produceprocess-wrap .left .titbox .tit-ico img {width: 100%; animation:titItem 1s ease-in-out infinite alternate;}

@keyframes titItem{
  0%{transform:translate(0, 5%);}
  100%{transform:translate(0, -5%);}
}

.produceprocess-wrap .right {width: 60%;}
.work-list {width: 100%;}
.work-list ul li {width: 100%; margin-bottom: 8rem;}
.work-list ul li:last-child {margin-bottom: 0;}
.work-list ul li .conbox {width: 100%;}
.work-list ul li .conbox .titnum {display: flex; align-items: center; flex-wrap: wrap; font-family: "SCoreDream", sans-serif; font-size: 3rem; color: #000; font-weight: 700; letter-spacing: -0.035rem; line-height: 1.45; word-break: keep-all;}
.work-list ul li .conbox .titnum span {display: inline-flex; justify-content: center; align-items: center; flex-wrap: wrap; margin-right: 1.5rem; width: 4.6rem; height: 4.6rem; background-color: var(--default-color); border-radius: 1rem; font-size: 2.5rem; color: #fff; font-weight: 600;}
.work-list ul li .conbox p {font-size: 1.8rem; color: #696969; font-weight: 400; letter-spacing: -0.035rem; line-height: 1.35; word-break: keep-all; margin-top: 2rem;}
.work-list ul li .conbox .data-img {width: 100%; margin-top: 3rem; box-shadow: 0 10px 30px rgba(0,0,0,0.1); border: 1px solid rgba(0,0,0,0.1); /*border-radius: 1rem;*/ overflow: hidden;}
.work-list ul li .conbox .data-img img {width: 100%;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* 메인 컨텐츠 - 차별화 경쟁력 영역 */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.main-corevalues {width: 100%; padding: 15rem 0; background-color: #f9f9f9;}
.corevalues-wrap {width: 100%;}

.corevalues-list {width: 100%; margin-top: 8rem;}
.corevalues-list ul {display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%;}
.corevalues-list ul li {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; width: 32%; padding: 5rem 4rem; border: 1px solid #ddd; border-radius: 2rem; box-shadow: 5px 8px 16px rgba(0,0,0,0.08);}
.corevalues-list ul li i.ico {border: 1px solid #ccc; border-radius: 50%; overflow: hidden;} 
.corevalues-list ul li i.ico img {max-width: 100%;}
.corevalues-list ul li .info {width: 100%; text-align: center; margin-top: 3rem;}
.corevalues-list ul li .info .tit-txt {font-family: "SCoreDream", sans-serif; transform: rotate(-0.03deg); font-size: 2.5rem; color: #111; font-weight: 700; letter-spacing: -0.08rem; line-height: 1;}
.corevalues-list ul li .info p {transform: rotate(-0.03deg); font-size: 2rem; color: #111; font-weight: 400; letter-spacing: -0.08rem; line-height: 1.35; word-break: keep-all; margin-top: 1.5rem;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* 메인 컨텐츠 - 진행 프로세스 영역 */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.main-process {position: relative; width: 100%; padding: 15rem 0; background-color: rgba(0,0,0,0.75);}
.main-process:before {content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url("../images/process_BG.jpg"); background-repeat: no-repeat; background-position: center top; background-size: cover; z-index: -1;}

.process-wrap {width: 100%;}
.process-wrap .title-common {text-align: center;}
.process-wrap .title-common .tit-eng {color: #fff;}
.process-wrap .title-common h2 {color: #fff;}
.process-wrap .title-common p {color: rgba(255,255,255,0.6);}
.process-wrap .title-common p strong {color: #fff;}

.process-list {width: 100%; margin-top: 8rem;}
.process-list ul {position: relative; display: flex; z-index: 1;}
.process-list ul:before {content: ""; position: absolute; top: 32px; left: 0; width: 100%; height: 1px; background: rgba(255,255,255,0.3); z-index: 0;}
.process-list ul:after {content: ""; position: absolute; top: 32px; left: 0; width: 0; height: 1px; background: var(--default-color); transition: width 1.2s cubic-bezier(0.77, 0, 0.175, 1); box-shadow: 0 0 8px #ff4081; z-index: 1;}

.process-list ul.active-1::after {width: 20%;}
.process-list ul.active-2::after {width: 40%;}
.process-list ul.active-3::after {width: 60%;}
.process-list ul.active-4::after {width: 80%;}
.process-list ul.active-5::after {width: 100%;}

.process-list ul li {position: relative; flex: 1; text-align: left; padding-right: 2rem; z-index: 2;}
.process-list ul li .num {width: 6.5rem; height: 6.5rem; text-align: center; line-height: 6.5rem; background-color: #1e1e1e; border: solid 1px rgba(255,255,255,0.3); border-radius: 50%; transition: var(--transition1);}
.process-list ul li .num span {font-size: 2.8rem; color: #fff; font-weight: 700; letter-spacing: -0.05rem;}
.process-list ul li .icobox {display: inline-flex; width: 100%; margin-top: 3rem;}
.process-list ul li .icobox i {font-size: 3.4rem; color: #fff;}
.process-list ul li .infotxt {margin-top: 1rem;}
.process-list ul li .infotxt h3 {font-family: "SCoreDream", sans-serif; font-size: 2.2rem; color: #fff; font-weight: 600; transition: var(--transition2);}
.process-list ul li .infotxt p {font-size: 1.6rem; color: rgba(255,255,255,0.6); font-weight: 300; letter-spacing: -0.05rem; line-height: 1.5; word-break: keep-all; margin: 18px 0 0; transition: var(--transition2);}

.process-list ul li.active .num {border-color: var(--default-color); background-color: var(--default-color);}
.process-list ul li.active .icobox i {color: var(--default-color);}
.process-list ul li.active .infotxt h3 {color: #28a4fb;}
.process-list ul li.active .infotxt p {color: #fff;}

.notetxt {width: 100%; text-align: left; padding: 3rem 3rem; margin-top: 4rem; background-color: rgba(0,0,0,0.35); border: 2px dotted rgba(255,255,255,0.3); border-radius: 1rem;}
.notetxt ul li {width: 100%; margin-bottom: 0.5rem;}
.notetxt ul li:last-child {margin-bottom: 0;}
.notetxt ul li span {display: inline-block; width: 25px; font-size: 2rem; color: var(--default-color); font-weight: 500; vertical-align: top;}
.notetxt ul li p {display: inline-block; width: 90%; font-size: 1.65rem; color: rgba(255,255,255,0.55); font-weight: 400; letter-spacing: -0.035rem; line-height: 1.5; word-break: keep-all;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* 메인 컨텐츠 - 샘플 제작 영상 영역 */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.main-samplevideo {position: relative; width: 100%; padding: 15rem 0;}
.samplevideo-wrap {width: 100%;}
.samplevideo-wrap .title-common {text-align: center; margin-bottom: 8rem;}

.filter-menu {display: flex; justify-content: center; margin-bottom: 5rem;}
.filter-menu .btn {border: 1px solid rgba(255,255,255,0.1); font-size: 1.75rem; color: #fff; font-weight: 600; padding: 1rem 2.4rem; margin: 0 0.5rem; background-color: #cccccc; border-radius: 5.8rem; cursor: pointer; transition: 0.3s;}
.filter-menu .btn.active {color: #fff; background-color: var(--default-color); border: 1px solid var(--default-color);}
.filter-menu .btn:hover {color: #fff; background-color: #363636; border: 1px solid #363636;}

.portfolio-container {display: grid; grid-template-columns: repeat(4, 1fr); gap: 3rem 2rem;}
.portfolio-container .item {position: relative; overflow: hidden; transition: var(--transition1); cursor: pointer;}
.portfolio-container .item figure {position: relative; width: 100%; padding: 0; margin: 0; overflow: hidden;}
.portfolio-container .item figure img {width: 100%; height: auto; display: block; transform: scale(1); transition: var(--transition1);} 
.portfolio-container .item figure .Bl {position: absolute; top: 0; right: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0); transition: var(--transition1);}
.portfolio-container .item .desc {width: 100%; padding: 2rem 0;}
.portfolio-container .item .desc p {text-align: center; width: 100%; font-size: 1.8rem; color: #252525; font-weight: 600; display: -webkit-box; white-space: break-spaces; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 1;}

.portfolio-container .item .ico-circle {position: absolute; top: 1rem; right: 1rem; display: flex; align-items: center; justify-content: center; width: 4.6rem; height: 4.6rem; background-color: var(--default-color); border-radius: 5.8rem; box-shadow: 6px 6px 12px rgba(0,0,0,0.25);}
.portfolio-container .item .ico-circle2 {background-color: #ff0033;}
.portfolio-container .item .ico-circle i {font-size: 2.5rem; color: #fff;}
.portfolio-container .item.hide {display: none;}

/* 포트폴리오 리스트 - 마우스롤오버 효과 */
.portfolio-container .item:hover img {transform: scale(1.12);}
.portfolio-container .item:hover figure .Bl {background-color: rgba(0,0,0,0.3);}
.portfolio-container .item:hover .desc p {color: var(--default-color); text-decoration: underline;}

/* 모달 팝업 스타일 - 중앙 정렬 & 애니메이션 */
.modal {display: none; /*JS에서 flex로 변경됨*/ position: fixed; z-index: 10000000000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.85); justify-content: center; /*가로 중앙*/ align-items: center; /*세로 중앙*/}
.modal-content {position: relative; background-color: #fff; padding: 3.5rem; width: 90%; max-width: 100rem; box-shadow: 0 10px 25px rgba(0,0,0,0.5); animation-name: slideDown; animation-duration: 0.4s; animation-timing-function: ease-out;}

/* 모달 팝업 스타일 - 위에서 아래로 내려오는 애니메이션 */
@keyframes slideDown {
  from {
	opacity: 0;
	transform: translateY(-50px); /* 위쪽 -50px 위치에서 시작 */
  }
  to {
	opacity: 1;
	transform: translateY(0);     /* 원래 위치로 도착 */
  }
}

/* 모달 팝업 스타일 - 닫기 버튼 및 미디어 스타일 */
.close-inside {position: absolute; top: 1rem; right: 1.5rem; color: #333; font-size: 3.5rem; font-weight: bold; cursor: pointer; z-index: 10; line-height: 1; transition: color 0.2s;}
.close-inside:hover {color: var(--default-color);}

.media-container {margin-top: 2rem; margin-bottom: 2rem;}
#modalImg {width: 100%; height: auto; object-fit: cover; border-radius: 0.6rem;}
#caption {font-size: 1.85rem; color: #333; font-weight: 700;}
#caption .modalpop-tit {font-family: "SCoreDream", sans-serif; font-size: 2.5rem; color: #111; font-weight: 600; letter-spacing: -0.05rem;}
#caption .modalpop-desc {width: 100%; margin-top: 1.5rem; font-size: 1.85rem; color: #111; font-weight: 300; line-height: 1.35; letter-spacing: -0.05rem; word-break: keep-all;}
#caption .modalpop-ex {width: 100%; margin-top: 1rem; font-size: 1.65rem; color: #111; font-weight: 300; line-height: 1.25; letter-spacing: -0.05rem; word-break: keep-all;}

/*
#caption .modalpop-ex .row {width: 100%; margin: 0.5rem 0;}
#caption .modalpop-ex .row p {position: relative; font-size: 1.65rem; color: #111; font-weight: 300; line-height: 1.25; letter-spacing: -0.05rem; word-break: keep-all; padding-left: 1.2rem;}
#caption .modalpop-ex .row p:after {content: ""; position: absolute; top: 0.8rem; left: 0; width: 0.4rem; height: 0.4rem; background-color: #ccc; border-radius: 50%;}
*/

/* 모달 팝업 스타일 - 유튜브 반응형 비율 (16:9) */
.video-wrapper {position: relative; height: 0; padding-bottom: 56.25%; overflow: hidden;}
.video-wrapper iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* 메인 컨텐츠 - 고객센터 정보 및 제작문의하기 영역 */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.main-contentarea {position: relative; width: 100%; padding: 15rem 0; background-image: url("../images/inquiry_BG.jpg"); background-repeat: no-repeat; background-position: center top; background-size: cover;}
.contentarea-wrap {display: flex; flex-wrap: wrap; width: 100%;}

/* 좌측 고객센터 정보 영역 */
.customer-wrap {width: 35%;}
.customer-box {display: flex; /*justify-content: center;*/ flex-direction: column; flex-wrap: wrap; width: 100%; height: 100%; padding-right: 4rem;}
.customer-box .contact-wrap {display: flex; flex-wrap: wrap; width: 100%;}
.customer-box .contact-wrap h4 {position: relative; width: 100%; font-family: "SCoreDream", sans-serif; font-size: 6rem; color: #111; font-weight: 700; letter-spacing: -0.035rem; margin-bottom: 3rem;}
.customer-box .contact-wrap p {width: 100%; font-family: "SCoreDream", sans-serif; font-size: 2.8rem; color: #252525; font-weight: 400; letter-spacing: -0.030rem; line-height: 1.45; word-break: keep-all; margin-bottom: 3rem;}
.customer-box .contact-wrap p strong {font-weight: 700;}
.customer-box .contact-info {display: flex; flex-wrap: wrap; width: 100%; margin-top: 2.5rem;}
.customer-box .contact-info .info-row {display: flex; align-items: center; flex-wrap: wrap; width: 100%;}
.customer-box .contact-info .info-row:nth-of-type(1) {margin-bottom: 1rem;}
.customer-box .contact-info .info-row i {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; width: 4.5rem; height: 4.5rem; font-size: 2rem; color: #111; margin-right: 2rem; border: 1px solid #363636; border-radius: 50%;}
.customer-box .contact-info .info-row span {font-size: 1.75rem; color: #111; font-weight: 500; letter-spacing: -0.020rem; line-height: 1.2;}
.customer-box .contact-info .info-row .col {display: inline-flex; display: flex; align-items: center; flex-wrap: wrap; margin-right: 4rem;}

/* 우측 제작문의하기 폼 영역 */
.counselform-wrap {width: 65%;}
.form-box {width: 100%; padding: 6rem; background-color: rgba(255,255,255,0.65); border-radius: 3rem; box-shadow: 5px 8px 12px rgba(0,0,0,0.08);}
.form-box .guidetxt {font-size: 1.65rem; color: #252525; font-weight: 500; letter-spacing: -0.035rem; margin-bottom: 1rem;}
.form-box .guidetxt span {color: red;}
.form-box h4.tit {display: block; font-family: "SCoreDream", sans-serif; font-size: 5.2rem; color: #8b8b8b; font-weight: 500; letter-spacing: -0.035rem; line-height: 1.3; word-break: keep-all;}
.form-box h4.tit strong.point {color: #fff; font-weight: 800;}

.form-box .form-wrap {width: 100%;}
.form-box .form-wrap .form-group {display: flex; flex-wrap: wrap; width: 100%; margin-bottom: 1rem; z-index: 1;}
.form-box .form-wrap .form-group:last-child {margin-bottom: 0;}
.form-box .form-wrap .form-group-input {justify-content: space-between;} /* 예외처리 */
.form-box .form-wrap .form-group-privacy {justify-content: space-between; align-items: center; margin-top: 2rem;} /* 예외처리 */

.form-box .form-wrap .form-group .basic-input {position: relative; width: 100%; height: 6rem; font-size: 1.8rem; color: #8c8b8b; font-weight: 500; padding: 2rem; background: #fff; border: 1px solid rgba(0,0,0,0.15); z-index: 1;}
.form-box .form-wrap .form-group .basic-input2 {width: 100%;}
.form-box .form-wrap .form-group .basic-textarea {width: 100%; height: 22rem; font-size: 1.8rem; color: #8c8b8b; font-weight: 500; padding: 2rem; background: #fff; border: 1px solid rgba(0,0,0,0.15); resize: none;}
.form-box .form-wrap .form-group .basic-select {width: 100%; height: 6rem; font-family: "Pretendard", sans-serif; font-size: 1.65rem; color: #8c8b8b; font-weight: 400; padding: 2rem; border: 1px solid rgba(0,0,0,0.15); appearance: none; -webkit-appearance: none; -moz-appearance: none; border-radius: 0; background: #fff url("../images/select_arrow.png") no-repeat 98% center;}

/* 필수항목 추가 */
.form-box .form-wrap .form-group .row {position: relative; width: 100%;}
.form-box .form-wrap .form-group-input .row {position: relative; width: 49.2424%;}
.form-box .form-wrap .form-group .row .required:after {content: "*"; position: absolute; top: 0.6rem; left: 0.6rem; width: 1rem; height: 1rem; font-size: 2rem; color: red; font-weight: 700; z-index: 5;}

.form-box .form-wrap .form-group .tit {font-size: 1.95rem; color: #252525; font-weight: 600; letter-spacing: -0.035rem;}
.form-box .form-wrap .form-group .tit2 {margin-top: 1rem;}
.form-box .form-wrap .form-group .type-check {width: 100%; margin-top: 1.5rem;}
.form-box .form-wrap .form-group .type-check .type-row {display: inline-flex; margin: 0 4rem 1rem 0;}
.form-box .form-wrap .form-group .type-check .type-row input.basic-check {opacity: 0; position: absolute;}
.form-box .form-wrap .form-group .type-check .type-row .type-label {position: relative; font-size: 1.7rem; color: #363636; font-weight: 500; letter-spacing: -0.035rem;}
.form-box .form-wrap .form-group .type-check .type-row input.basic-check, .type-label {display: inline-block; vertical-align: middle; cursor: pointer;}
.form-box .form-wrap .form-group .type-check .type-row input.basic-check + .type-label:before {display: inline-block; width: 2rem; height: 2rem; content: ""; padding: 0.2rem; margin-right: 1rem; text-align: center; vertical-align: -0.38rem; background: rgba(255,255,255,0.65); border: 1px solid rgba(0,0,0,0.15);}
.form-box .form-wrap .form-group .type-check .type-row input.basic-check:checked + .type-label:before {background: #fff; border: 2px solid var(--default-color); box-shadow: inset 0px 0px 0px 3px var(--default-color);}

.form-box .form-wrap .form-group .field {width: 100%;}
.form-box .form-wrap .form-group .field:nth-of-type(2) {margin-top: 1rem;}
.form-box .form-wrap .form-group .field input.upload-text {float: left; width: calc(100% - 16rem); height: 6rem; font-size: 1.6rem; color: #858585; padding: 0 2rem; background-color: #fff; border: 1px solid rgba(0,0,0,0.15);}
.form-box .form-wrap .form-group .field div.upload-btn_wrap {position: relative; float: left; width: 15rem; height: 6rem; margin-left: 1rem;}
.form-box .form-wrap .form-group .field div.upload-btn_wrap button {display: block; width: 15rem; height: 6rem; font-size: 1.6rem; color: #fff; font-weight: 500; background: var(--default-gray-color); border: 1px solid var(--default-gray-color);}
.form-box .form-wrap .form-group .field div.upload-btn_wrap input.input-file {position: absolute; top: 0; right: 0; width: 15rem; height: 6rem; cursor: pointer; opacity: 0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; -moz-opacity: 0;}

.form-box .form-wrap .form-group .left input.basic-check {opacity: 0; position: absolute;}
.form-box .form-wrap .form-group .left .agree-label {position: relative; font-size: 1.7rem; color: #646262; font-weight: 500; letter-spacing: -0.035rem;}
.form-box .form-wrap .form-group .left input.basic-check, .agree-label {display: inline-block; vertical-align: middle; cursor: pointer;}
.form-box .form-wrap .form-group .left input.basic-check + .agree-label:before {display: inline-block; width: 2rem; height: 2rem; content: ""; padding: 0.2rem; margin-right: 1rem; text-align: center; vertical-align: -0.38rem; background: rgba(255,255,255,0.65); border: 1px solid rgba(0,0,0,0.15);}
.form-box .form-wrap .form-group .left input.basic-check:checked + .agree-label:before {background: #fff; border: 2px solid var(--default-color); box-shadow: inset 0px 0px 0px 3px var(--default-color);}
.form-box .form-wrap .form-group .right a {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; width: 7.4rem; height: 3rem; font-size: 1.4rem; color: #484848; font-weight: 500; letter-spacing: -0.035rem; background: rgba(255,255,255,0.65); border: 1px solid rgba(0,0,0,0.15); transition: var(--transition1);}
.form-box .form-wrap .form-group .right a:hover {color: #fff; background: var(--default-color); border: 1px solid var(--default-color);}

.form-box .form-wrap .form-group button.counsel-btn {width: 100%; height: 8rem; font-size: 2rem; color: #fff; font-weight: 700; margin-top: 3rem; background: var(--default-gray-color); border: 0; transition: var(--transition2);}
.form-box .form-wrap .form-group button.counsel-btn:hover {background: var(--default-color);}

/* 우측 상담신청하기 폼 스타일 - 인풋박스, 텍스트에리어 포커싱 스타일 적용 */
.form-box .form-wrap .form-group .basic-input:focus {background: rgba(255,255,255,0.8); border: 1px solid var(--default-color); box-shadow: 0 5px 12px rgba(0,0,0,0.08); transition: var(--transition2);}
.form-box .form-wrap .form-group .basic-textarea:focus {background: rgba(255,255,255,0.8); border: 1px solid var(--default-color); box-shadow: 0 5px 12px rgba(0,0,0,0.08); transition: var(--transition2);}

/* 우측 상담신청하기 폼 스타일 - 인풋박스, 텍스트에리어 속성 placeholder 스타일 적용 */
.form-box .form-wrap .form-group .basic-input::-webkit-input-placeholder{font-size: 1.65rem; color:#8c8b8b; font-weight: 400;}
.form-box .form-wrap .form-group .basic-input::-moz-placeholder{font-size: 1.65rem; color:#8c8b8b; font-weight: 400;}
.form-box .form-wrap .form-group .basic-input:-ms-input-placeholder{font-size: 1.65rem; color:#8c8b8b; font-weight: 400;}
.form-box .form-wrap .form-group .basic-input:-moz-placeholder{font-size: 1.65rem; color:#8c8b8b; font-weight: 400;}
.form-box .form-wrap .form-group .basic-textarea::-webkit-input-placeholder{font-size: 1.65rem; color:#8c8b8b; font-weight: 400;}
.form-box .form-wrap .form-group .basic-textarea::-moz-placeholder{font-size: 1.65rem; color:#8c8b8b; font-weight: 400;}
.form-box .form-wrap .form-group .basic-textarea:-ms-input-placeholder{font-size: 1.65rem; color:#8c8b8b; font-weight: 400;}
.form-box .form-wrap .form-group .basic-textarea:-moz-placeholder{font-size: 1.65rem; color:#8c8b8b; font-weight: 400;}

/* 레이어팝업 - 개인정보처리방침 내용 오픈 영역 시작 */
.privacy-popup {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 100000000; display: none;}
.privacy-wrap {position: absolute; width: 100%; height: auto; top: 0; left: 0;}
.privacy-wrap .privacy-popupbox {position: fixed; top: 50%; left: 50%; transform : translate(calc(-50% + 0.5px), calc(-50% + 0.5px)); width: 100%; max-width: 70rem; height: 56%; padding: 4rem; border-radius: 1rem; background: #fff;}
.privacy-wrap .privacy-popupbox .btn-close {position: absolute; right: 4rem; top: 4rem; cursor: pointer;}
.privacy-wrap .privacy-popupbox .btn-close button {width: 2.5rem; height: 2.5rem; background: transparent;}
.privacy-wrap .privacy-popupbox .btn-close button img {max-width: 100%; object-fit: cover;}
.privacy-wrap .privacy-popupbox .privacy-content {width: 100%; height: 100%;}
.privacy-wrap .privacy-popupbox .privacy-content .tit {width: 100%; height: 2.5rem; font-size: 2.4rem; color: #111; font-weight: 700; letter-spacing: -0.035rem; margin-bottom: 2rem;}
.privacy-wrap .privacy-popupbox .privacy-content textarea.pop-textarea {width: 100%; height: calc(100% - 5rem); border: 0; padding: 2rem; font-size: 1.55rem; color: #818283; font-weight: 400; line-height: 140%; letter-spacing: -0.020rem; background: #f7f7f7; resize: none;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** 반응형설정 Mobile 359 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (max-width:359px) {

/* 메인 컨텐츠별 타이틀 공통 */
.title-common {text-align: center;}
.title-common h2 {font-size: 2.2rem; line-height: 1.35;}
.title-common h2 strong {font-size: 3.6rem;}
.title-common p {font-size: 1.85rem; margin-top: 2rem;}
.title-common p br {display: none;}

/* 메인 컨텐츠 - 바로가기 상단고정 탭버튼 영역 */
.fixed-gap {top: 6rem; height: auto; border-bottom: 0;}
.fixed-gap .tabs-container ul {display: flex; flex-wrap: wrap}
.fixed-gap .tabs-container ul li {width: 33.3334%; padding: 0; border-right: 1px solid rgba(0,0,0,0.05); border-bottom: 1px solid rgba(0,0,0,0.05);}
.fixed-gap .tabs-container ul li:nth-of-type(3n+3) {border-right: 0;}
.fixed-gap .tabs-container ul li a {height: auto; font-size: 1.35rem;}
.fixed-gap .tabs-container ul li.on {border-bottom: 1px solid var(--default-color);}
.fixed-gap .tabs-container ul li.on a {color: #fff; padding-top: 0; background-color: var(--default-color); border-bottom: 1px solid var(--default-color);}

/* 메인 컨텐츠 - 소개 영역 */
.overview-wrap {padding: 12rem 2rem 3rem;}
.overview-wrap .title-common {margin-top: 0;}
.overview-wrap .title-common h2 {font-size: 3rem;}
.overview-wrap .title-common p {font-size: 2.5rem;}

.visual-icon .aniico-wrap {z-index: 2;}
.visual-icon .aniico-wrap .left-ico {width: 13rem; height: auto; margin-top: 32rem; margin-left: 0;}
.visual-icon .aniico-wrap .left-ico img {width: 100%;}
.visual-icon .aniico-wrap .right-ico {width: 14rem; height: auto; margin-right: 0;}
.visual-icon .aniico-wrap .right-ico img {width: 100%;}
.visual-icon .centerico-wrap {padding-top: 2rem; padding-bottom: 8rem;}

/* 메인 컨텐츠 - 제작안내 영역 */
.productionGuide-wrap {padding: 1rem 2rem 12rem;}
.sec-title p {font-size: 2.3rem; line-height: 1.45; word-break: keep-all;}
.sec-title p br {display: none;}

.guidecontent-wrap ul {flex-wrap: wrap;}
.guidecontent-wrap li {flex: initial; width: 100%; margin-bottom: 2rem;}
.guidecontent-wrap li:last-child {margin-bottom: 0;}
.guidecontent-wrap li .item-box .circle {width: 18rem; height: 18rem; font-size: 2rem;}
.guidecontent-wrap li .item-box .txtbox {padding: 6rem 2rem 3rem;}

/* 메인 컨텐츠 - 제작안내 영역 - AI모델 생성 안내 */
.guidemodel-wrap ul {justify-content: initial; flex-wrap: wrap;}
.guidemodel-wrap ul li {width: 100%;}
.guidemodel-wrap ul li .box .info-txt .tit {font-size: 2.2rem; line-height: 1.35; word-break: keep-all;}
.guidemodel-wrap ul li .box .info-txt p {font-size: 1.75rem; line-height: 1.35;}

/* 메인 컨텐츠 - 제작과정 프로세스 영역 */
.produceprocess-wrap {padding: 12rem 2rem;}
.produceprocess-wrap .left {width: 100%;}
.produceprocess-wrap .left .titbox {text-align: center;}
.produceprocess-wrap .left .titbox h3 {font-size: 3rem;}
.produceprocess-wrap .left .titbox h3 br:nth-of-type(2) {display: none;}
.produceprocess-wrap .left .titbox .tit-ico {display: inline-flex; width: 20rem; margin-top: 3rem;}
.produceprocess-wrap .right {width: 100%;}

.work-list ul li {margin-bottom: 5rem;}
.work-list ul li .conbox .titnum {font-size: 2.2rem;}
.work-list ul li .conbox .titnum span {width: 4rem; height: 4rem; font-size: 2rem; margin-right: 1rem;}
.work-list ul li .conbox p {font-size: 1.65rem;}

/* 메인 컨텐츠 - 차별화 경쟁력 영역 */
.main-corevalues {padding: 12rem 2rem;}
.corevalues-list ul li {width: 100%; margin-bottom: 3rem;}
.corevalues-list ul li:nth-of-type(3) {margin-bottom: 3rem;}
.corevalues-list ul li:nth-of-type(4) {margin-bottom: 0;}
.corevalues-list ul li .info {padding-left: 1.5rem;}
.corevalues-list ul li .info .tit-txt {font-size: 2.2rem;}
.corevalues-list ul li .info p {font-size: 1.8rem; margin-top: 1rem;}

/* 메인 컨텐츠 - 진행 프로세스 영역 */
.main-process {padding: 12rem 2rem;}
.process-list {margin-top: 4rem;}
.process-list ul {flex-wrap: wrap;}
.process-list ul:before {display: none;}
.process-list ul:after {display: none;}
.process-list ul li {flex: initial; width: 100%; text-align: center; padding-bottom: 4rem; margin-bottom: 4rem; border-bottom: 1px solid rgba(255,255,255,0.15);}
.process-list ul li:last-child {padding-bottom: 0; margin-bottom: 0; border-bottom: 0;}
.process-list ul li .num {display: inline-flex; justify-content: center;}
.process-list ul li .icobox {justify-content: center;}
.process-list ul li .infotxt {margin-top: 1rem;}
.process-list ul li .infotxt h3 {font-size: 2.2rem;}
.notetxt ul li p {width: 88%;}

/* 메인 컨텐츠 - 샘플 제작 영상 영역 */
.main-samplevideo {padding: 12rem 2rem;}
.samplevideo-wrap .title-common {margin-bottom: 4rem;}
.portfolio-container {grid-template-columns: repeat(2, 1fr); gap: 3rem 1rem;}
.filter-menu {display: block; text-align: center; margin-bottom: 3rem;}
.filter-menu .btn {font-size: 1.35rem; padding: 1rem 2rem; margin: 0.4rem 0.2rem;}

/* 모달 팝업 스타일 - 중앙 정렬 & 애니메이션 */
.modal-content {padding: 1.5rem;}
.media-container {margin-top: 3rem;}
.close-inside {top: 0.5rem;}
#caption .modalpop-tit {font-size: 2rem;}
#caption .modalpop-desc {font-size: 1.6rem;}
#caption .modalpop-ex {font-size: 1.35rem;}

/* 메인 컨텐츠 - 고객센터 정보 및 제작문의하기 영역 */
.main-contentarea {padding: 12rem 2rem;}
.customer-wrap {width: 100%;}
.customer-box {padding-right: 0;}
.customer-box .contact-wrap {padding-top: 0;}
.customer-box .contact-wrap h4 {font-size: 3.6rem;}
.customer-box .contact-wrap p {font-size: 2rem; word-break: keep-all; margin-bottom: 1rem;}
.customer-box .contact-wrap p:nth-of-type(2) br:nth-of-type(3) {display: none;}
.customer-box .contact-wrap p br:nth-of-type(2) {display: none;}
.customer-box .contact-info .info-row .col:nth-of-type(1) {margin-bottom: 1rem;}

/* 우측 제작문의하기 폼 영역 */
.counselform-wrap {width: 100%; margin-top: 4rem;}
.form-box {padding: 2rem; border-radius: 1.4rem;}
.form-box .form-wrap .form-group-input .row {width: 100%;}
.form-box .form-wrap .form-group-input .basic-input {width: 100%;}
.form-box .form-wrap .form-group-input .basic-input:nth-of-type(1) {margin-bottom: 1rem;}
.form-box .form-wrap .form-group .basic-input {height: 5rem;}
.form-box .form-wrap .form-group .basic-select {height: 5rem; padding: 0 2rem;}
.form-box .form-wrap .form-group .type-check {margin-bottom: 1rem;}
.form-box .form-wrap .form-group .type-check .type-row {margin: 0 1rem 1rem 0;}
.form-box .form-wrap .form-group-email {margin-bottom: 2rem;}
.form-box .form-wrap .form-group-privacy {margin-top: 1rem;}

.form-box .form-wrap .form-group .field input.upload-text {width: calc(100% - 9rem); height: 5rem;}
.form-box .form-wrap .form-group .field div.upload-btn_wrap {width: 8rem; height: 5rem;}
.form-box .form-wrap .form-group .field div.upload-btn_wrap button {width: 8rem; height: 5rem; font-size: 1.45rem;}
.form-box .form-wrap .form-group button.counsel-btn {height: 7rem;}

/* 레이어팝업 - 개인정보처리방침 내용 오픈 영역 시작 */
.privacy-wrap .privacy-popupbox {width: 90%; padding: 2rem;}
.privacy-wrap .privacy-popupbox .btn-close {right: 2rem; top: 2rem;}
.privacy-wrap .privacy-popupbox .privacy-content .tit {font-size: 2rem;}
.privacy-wrap .privacy-popupbox .privacy-content textarea.pop-textarea {font-size: 1.5rem;}

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** 반응형설정 Mobile 360,719 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:360px) and (max-width:719px) {

/* 메인 컨텐츠별 타이틀 공통 */
.title-common {text-align: center;}
.title-common h2 {font-size: 2.2rem; line-height: 1.35;}
.title-common h2 strong {font-size: 3.6rem;}
.title-common p {font-size: 1.85rem; margin-top: 2rem;}
.title-common p br {display: none;}

/* 메인 컨텐츠 - 바로가기 상단고정 탭버튼 영역 */
.fixed-gap {top: 6rem; height: auto; border-bottom: 0;}
.fixed-gap .tabs-container ul {display: flex; flex-wrap: wrap}
.fixed-gap .tabs-container ul li {width: 33.3334%; padding: 0; border-right: 1px solid rgba(0,0,0,0.05); border-bottom: 1px solid rgba(0,0,0,0.05);}
.fixed-gap .tabs-container ul li:nth-of-type(3n+3) {border-right: 0;}
.fixed-gap .tabs-container ul li a {height: auto; font-size: 1.35rem;}
.fixed-gap .tabs-container ul li.on {border-bottom: 1px solid var(--default-color);}
.fixed-gap .tabs-container ul li.on a {color: #fff; padding-top: 0; background-color: var(--default-color); border-bottom: 1px solid var(--default-color);}

/* 메인 컨텐츠 - 소개 영역 */
.overview-wrap {padding: 12rem 2rem 3rem;}
.overview-wrap .title-common {margin-top: 0;}
.overview-wrap .title-common h2 {font-size: 3rem;}
.overview-wrap .title-common p {font-size: 2.5rem;}

.visual-icon .aniico-wrap {z-index: 2;}
.visual-icon .aniico-wrap .left-ico {width: 13rem; height: auto; margin-top: 32rem; margin-left: 0;}
.visual-icon .aniico-wrap .left-ico img {width: 100%;}
.visual-icon .aniico-wrap .right-ico {width: 14rem; height: auto; margin-right: 0;}
.visual-icon .aniico-wrap .right-ico img {width: 100%;}
.visual-icon .centerico-wrap {padding-top: 2rem; padding-bottom: 8rem;}

/* 메인 컨텐츠 - 제작안내 영역 */
.productionGuide-wrap {padding: 1rem 2rem 12rem;}
.sec-title p {font-size: 2.3rem; line-height: 1.45; word-break: keep-all;}
.sec-title p br {display: none;}

.guidecontent-wrap ul {flex-wrap: wrap;}
.guidecontent-wrap li {flex: initial; width: 100%; margin-bottom: 2rem;}
.guidecontent-wrap li:last-child {margin-bottom: 0;}
.guidecontent-wrap li .item-box .circle {width: 18rem; height: 18rem; font-size: 2rem;}
.guidecontent-wrap li .item-box .txtbox {padding: 6rem 2rem 3rem;}

/* 메인 컨텐츠 - 제작안내 영역 - AI모델 생성 안내 */
.guidemodel-wrap ul {justify-content: initial; flex-wrap: wrap;}
.guidemodel-wrap ul li {width: 100%;}
.guidemodel-wrap ul li .box .info-txt .tit {font-size: 2.2rem; line-height: 1.35; word-break: keep-all;}
.guidemodel-wrap ul li .box .info-txt p {font-size: 1.75rem; line-height: 1.35;}

/* 메인 컨텐츠 - 제작과정 프로세스 영역 */
.produceprocess-wrap {padding: 12rem 2rem;}
.produceprocess-wrap .left {width: 100%;}
.produceprocess-wrap .left .titbox {text-align: center;}
.produceprocess-wrap .left .titbox h3 {font-size: 3rem;}
.produceprocess-wrap .left .titbox h3 br:nth-of-type(2) {display: none;}
.produceprocess-wrap .left .titbox .tit-ico {display: inline-flex; width: 20rem; margin-top: 3rem;}
.produceprocess-wrap .right {width: 100%;}

.work-list ul li {margin-bottom: 5rem;}
.work-list ul li .conbox .titnum {font-size: 2.2rem;}
.work-list ul li .conbox .titnum span {width: 4rem; height: 4rem; font-size: 2rem; margin-right: 1rem;}
.work-list ul li .conbox p {font-size: 1.65rem;}

/* 메인 컨텐츠 - 차별화 경쟁력 영역 */
.main-corevalues {padding: 12rem 2rem;}
.corevalues-list ul li {width: 100%; margin-bottom: 3rem;}
.corevalues-list ul li:nth-of-type(3) {margin-bottom: 3rem;}
.corevalues-list ul li:nth-of-type(4) {margin-bottom: 0;}
.corevalues-list ul li .info {padding-left: 1.5rem;}
.corevalues-list ul li .info .tit-txt {font-size: 2.2rem;}
.corevalues-list ul li .info p {font-size: 1.8rem; margin-top: 1rem;}

/* 메인 컨텐츠 - 진행 프로세스 영역 */
.main-process {padding: 12rem 2rem;}
.process-list {margin-top: 4rem;}
.process-list ul {flex-wrap: wrap;}
.process-list ul:before {display: none;}
.process-list ul:after {display: none;}
.process-list ul li {flex: initial; width: 100%; text-align: center; padding-bottom: 4rem; margin-bottom: 4rem; border-bottom: 1px solid rgba(255,255,255,0.15);}
.process-list ul li:last-child {padding-bottom: 0; margin-bottom: 0; border-bottom: 0;}
.process-list ul li .num {display: inline-flex; justify-content: center;}
.process-list ul li .icobox {justify-content: center;}
.process-list ul li .infotxt {margin-top: 1rem;}
.process-list ul li .infotxt h3 {font-size: 2.2rem;}
.notetxt ul li p {width: 88%;}

/* 메인 컨텐츠 - 샘플 제작 영상 영역 */
.main-samplevideo {padding: 12rem 2rem;}
.samplevideo-wrap .title-common {margin-bottom: 4rem;}
.portfolio-container {grid-template-columns: repeat(2, 1fr); gap: 3rem 1rem;}
.filter-menu {display: block; text-align: center; margin-bottom: 3rem;}
.filter-menu .btn {font-size: 1.35rem; padding: 1rem 2rem; margin: 0.4rem 0.2rem;}

/* 모달 팝업 스타일 - 중앙 정렬 & 애니메이션 */
.modal-content {padding: 1.5rem;}
.media-container {margin-top: 3rem;}
.close-inside {top: 0.5rem;}
#caption .modalpop-tit {font-size: 2rem;}
#caption .modalpop-desc {font-size: 1.6rem;}
#caption .modalpop-ex {font-size: 1.35rem;}

/* 메인 컨텐츠 - 고객센터 정보 및 제작문의하기 영역 */
.main-contentarea {padding: 12rem 2rem;}
.customer-wrap {width: 100%;}
.customer-box {padding-right: 0;}
.customer-box .contact-wrap {padding-top: 0;}
.customer-box .contact-wrap h4 {font-size: 3.6rem;}
.customer-box .contact-wrap p {font-size: 2rem; word-break: keep-all; margin-bottom: 1rem;}
.customer-box .contact-wrap p:nth-of-type(2) br:nth-of-type(3) {display: none;}
.customer-box .contact-wrap p br:nth-of-type(2) {display: none;}
.customer-box .contact-info .info-row .col:nth-of-type(1) {margin-bottom: 1rem;}

/* 우측 제작문의하기 폼 영역 */
.counselform-wrap {width: 100%; margin-top: 4rem;}
.form-box {padding: 2rem; border-radius: 1.4rem;}
.form-box .form-wrap .form-group-input .row {width: 100%;}
.form-box .form-wrap .form-group-input .basic-input {width: 100%;}
.form-box .form-wrap .form-group-input .basic-input:nth-of-type(1) {margin-bottom: 1rem;}
.form-box .form-wrap .form-group .basic-input {height: 5rem;}
.form-box .form-wrap .form-group .basic-select {height: 5rem; padding: 0 2rem;}
.form-box .form-wrap .form-group .type-check {margin-bottom: 1rem;}
.form-box .form-wrap .form-group .type-check .type-row {margin: 0 1rem 1rem 0;}
.form-box .form-wrap .form-group-email {margin-bottom: 2rem;}
.form-box .form-wrap .form-group-privacy {margin-top: 1rem;}

.form-box .form-wrap .form-group .field input.upload-text {width: calc(100% - 9rem); height: 5rem;}
.form-box .form-wrap .form-group .field div.upload-btn_wrap {width: 8rem; height: 5rem;}
.form-box .form-wrap .form-group .field div.upload-btn_wrap button {width: 8rem; height: 5rem; font-size: 1.45rem;}
.form-box .form-wrap .form-group button.counsel-btn {height: 7rem;}

/* 레이어팝업 - 개인정보처리방침 내용 오픈 영역 시작 */
.privacy-wrap .privacy-popupbox {width: 90%; padding: 2rem;}
.privacy-wrap .privacy-popupbox .btn-close {right: 2rem; top: 2rem;}
.privacy-wrap .privacy-popupbox .privacy-content .tit {font-size: 2rem;}
.privacy-wrap .privacy-popupbox .privacy-content textarea.pop-textarea {font-size: 1.5rem;}

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** 반응형설정 Tablet 720,767 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:720px) and (max-width:767px) {



}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** 반응형설정 Tablet 768,1023 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:768px) and (max-width:1023px) {



}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** 반응형설정 PC 1024,1279 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:1024px) and (max-width:1279px) {



}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** 반응형설정 PC 1280,1919 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:1280px) and (max-width:1919px) {



}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** 반응형설정 PC 1920 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:1920px) {



}