/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ¸ÞÀÎ ÄÁÅÙÃ÷ °øÅ뿵¿ª */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* ·¹À̾ƿô °øÅë */
.sec-visualbg {position: relative; top: 0; left: 0; width: 100%; z-index: 1;}
.sec-main {position: relative; width: 100%; background: var(--default-bgcolor);}
.sec-main .inner {margin: 0 auto; width: 100%; max-width: var(--max-width);}

/* ¸ÞÀÎ ÄÁÅÙÃ÷º° ŸÀÌƲ °øÅë */
.title-common {position: relative; width: 100%;}
.title-common .inner {display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; margin: 0 auto; width: 100%; max-width: var(--max-width);}

.title-common h2 {display: flex; align-items: flex-start; flex-wrap: wrap; font-size: 9rem; color: #fff; font-weight: 800; letter-spacing: -0.035rem; line-height: 1; word-break: keep-all; margin-left: -0.3rem;}
.title-common h2 strong.eng {display: inline-flex; width: 100%; transform: rotate(-0.03deg); font-size: 1.25rem; color: var(--default-color); font-weight: 700; letter-spacing: -0.035rem; line-height: 1.1; margin-bottom: 1.5rem;}
.title-common h2 strong.eng span {position: relative; font-size: 1.35rem; padding-right: 6.5rem;}
.title-common h2 strong.eng span:after {content: ""; position: absolute; top: 50%; left: 1.5rem; display: inline-block; width: 5rem; height: 1px; margin: 0 1rem; background: var(--default-color);}
.title-common h3 {font-family: "SCoreDream", sans-serif; font-size: 4.2rem; color: rgba(255,255,255,0.4); font-weight: 500; letter-spacing: -0.035rem; line-height: 1.2; margin-bottom: 2rem;}
.title-common p {font-size: 1.65rem; color: rgba(255,255,255,0.4); font-weight: 300; letter-spacing: -0.035rem; line-height: 1.4; word-break: keep-all; margin-bottom: 1rem;}
.title-common p strong {font-weight: 800;}

/* ¸ÞÀÎ ÄÁÅÙÃ÷º° ¹Ù·Î°¡±â ¹öÆ° °øÅë */
.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.8rem; 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-visual {width: 100%;}
.main-visual .visualmedia-wrap {position: relative; width: 100%; height: 100vh; z-index: 1;}
.main-visual .visualmedia-wrap .video-container {position: relative; width: 100%; height: 100%; overflow: hidden;}
.main-visual .visualmedia-wrap .video-container video {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover;}
.main-visual .visualmedia-wrap .coverbg {position: absolute; top: 0; left: 0; width: 100%; height: 100%; /*background-color: rgba(0,0,0,0.4);*/ background: linear-gradient(to right, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.45) 35%, rgba(0,0,0,0.15) 70%, rgba(0,0,0,0) 100%); z-index: 2;}

.main-visual .visualtitle-wrap {position: absolute; top: 0; left: 0; display: grid; align-items: center; width: 100%; height: 100vh; padding-top: 8rem; z-index: 2}
.main-visual .visualtitle-wrap .inner {margin: 0 auto; width: 100%; max-width: var(--max-width);}
.main-visual .visualtitle-wrap .title-box .eyebrow {font-size: 1.35rem; color: rgba(255,255,255,0.4); font-weight: 700; padding:.8rem 2rem; border: 1px solid rgba(255,255,255,0.2); border-radius: 99px;}

.main-visual-title h2 {margin-top: 2.2rem; font-family: "SCoreDream", sans-serif; font-size: 6rem; color: #fff; font-weight: 900; line-height: 1.25; letter-spacing: -0.02rem; word-break: keep-all;}
.main-title-line {display: block; font-size: 4.5rem; color: rgba(255,255,255,0.7); font-weight: 600;}
.main-title-line strong {color: #fff; font-weight: 800;}
.main-motion-wrap {display: block; height: 1.2em;overflow: hidden;}
.main-motion-text {display: block; opacity: 1; transform: translateY(0); transition: opacity 0.6s ease, transform 0.6s cubic-bezier(.22,.61,.36,1);}
.main-motion-text.is-hide {opacity: 0; transform: translateY(-10px);}
.main-motion-text.is-ready {opacity: 0; transform: translateY(10px);}

.main-visual .visualtitle-wrap .title-box .tit-desc {margin-top: 2.3rem; font-family: "SCoreDream", sans-serif; font-size: 1.75rem; color: rgba(255,255,255,0.6); font-weight: 500; line-height:1.5;}
.main-visual .visualtitle-wrap .title-box .ai-points {display: flex; flex-wrap: wrap; gap:.8rem; margin-top: 2.5rem;}
.main-visual .visualtitle-wrap .title-box .ai-points span {padding:.75rem 1.5rem; border-radius: 99px; background: rgba(255,255,255,0.2); color: rgba(255,255,255,0.7); font-size: 1.02rem; font-weight: 800; letter-spacing: .08em;}

.main-visual .visualtitle-wrap .title-box .buttons {display: flex; gap: 1rem; margin-top: 3rem;}
.main-visual .visualtitle-wrap .title-box .btn {display: inline-flex; align-items: center; justify-content: center; height: 4rem; padding: 0 2.4rem; font-size: 1.45rem; color: rgba(255,255,255,0.8); font-weight: 800; border: 1px solid rgba(255,255,255,0.2); border-top: 0; border-left: 0; transition: var(--transition1);}
.main-visual .visualtitle-wrap .title-box .btn:hover {color: #fff; background: var(--default-color);}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ¸ÞÀÎ ÄÁÅÙÃ÷ - 01 ¿µ»ó Á¦ÀÛ ¿µ¿ª */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.main-overview {position: relative; width: 100%; width: 100%; padding: 10rem 0; overflow: hidden; background: #0a0a0a; color: #fff;}
.overview-wrap {display: grid; grid-template-columns: 90rem 1fr; width: 100%;}

.left-brandfilm {padding-right: 7rem;}
.left-brandfilm .title-common p {margin-top: 2rem;}

.wowService-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; width: 100%; margin-top: 5rem;}
.wowService-item {position: relative; display: block; width: 100%; aspect-ratio: 3 / 3.5; color: #fff; overflow: hidden; background: #000; border-radius: 8px; cursor: unset;}

.wowService-image {position: absolute; left: 50%; transform: translateX(-50%); width: 100%; overflow: hidden;}
.wowService-image img {display: block; width: 100%; height: auto; object-fit: cover; transform: scale(1); filter: brightness(.78) saturate(.88); transition: transform .8s cubic-bezier(.2,.7,.2,1), filter .6s ease;}
.wowService-content {position: absolute; left: 0; top: 0; z-index: 2; width: 100%; height: 100%; padding: 22px 30px 30px; display: flex; flex-direction: column;}
.wowService-number {display: block; font-size: 1.3rem; line-height: 1; font-weight: 500; color: #fff; letter-spacing: .05em;}
.wowService-title {margin-top: auto; transition: transform .45s ease;}
.wowService-eng {display: block; margin-bottom: 7px; font-size: 12px; line-height: 1; font-weight: 600; letter-spacing: .13em; color: var(--default-color);}
.wowService-title h3 {margin: 0; font-size: 1.85rem; line-height: 1.25; font-weight: 600; letter-spacing: -.04em; color: #fff;}

.wowService-desc {width: 100%; max-height: 0; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; overflow: hidden; opacity: 0; transform: translateY(15px); transition: max-height .5s ease, opacity .35s ease, transform .45s ease, margin .45s ease;}
.wowService-desc p {margin: 0; font-size: 1.35rem; line-height: 1.4; font-weight: 500; color: rgba(255,255,255,.5); word-break: keep-all;}

@media (hover: hover) {

.wowService-item:hover .wowService-image img {transform: scale(1.065);}
.wowService-item:hover .wowService-title {transform: translateY(5px);}
.wowService-item:hover .wowService-desc {max-height: 100px; margin-top: 19px; opacity: 1; transform: translateY(0);}

}

/* ¿ìÃø ·Ñ¸µ ½½¶óÀ̵å */
.brandfilm-slide {display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; overflow: hidden;}
.brandFilmMotion {position: relative; width: 100%; height: 1000px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; overflow: hidden;}
.brandFilmMotion:before {content: ""; position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 35%; background: linear-gradient(to bottom, #080808 0%, rgba(8,8,8,0.85) 15%, rgba(8,8,8,0.40) 40%, rgba(8, 8, 8, 0.10) 70%, rgba(8, 8, 8, 0) 100%); z-index: 20; pointer-events: none;}
.brandFilmMotion:after {content: ""; position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 35%; background: linear-gradient(to bottom, rgba(8,8,8,0) 0%, rgba(8,8,8,0.10) 30%, rgba(8, 8, 8, 0.40) 60%, rgba(8, 8, 8, 0.85) 85%, #080808 100%); z-index: 20; pointer-events: none;}

.wowVideoRail {width: 100%; height: 100%; overflow: hidden; transform: translateZ(0); -webkit-transform: translateZ(0); backface-visibility: hidden; -webkit-backface-visibility: hidden;}

/* °¡Àå Áß¿ä Swiper À̵¿¼Óµµ¸¦ ÀÏÁ¤ÇÏ°Ô À¯Áö */
.wowVideoRail .swiper-wrapper {transition-timing-function: linear !important; will-change: transform; backface-visibility: hidden; -webkit-backface-visibility: hidden;}

/* 16:9À̹ǷΠSwiper°¡ ³ôÀ̸¦ °­Á¦·Î °è»êÇÏ¸é ¾È µÊ */
.wowVideoRail_slide {width: 100%; height: auto !important; flex-shrink: 0; box-sizing: border-box; backface-visibility: hidden; -webkit-backface-visibility: hidden;}
.wowVideoCard {position: relative; width: 100%; aspect-ratio: 16 / 9; /* ¡Ú ÇÙ½É */ overflow: hidden; border-radius: 16px; background: #111; transform: translateZ(0); backface-visibility: hidden; -webkit-backface-visibility: hidden;}
/*.wowVideoCard:after {content: ""; position: absolute; inset: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, rgba(0,0,0,0) 35%, rgba(0,0,0,0.25) 65%, rgba(0,0,0,0.8) 100%); pointer-events: none; Z-index: 2;}*/
.wowVideoCard video {position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; /* ¿µ»ó ÀÚü°¡ 16:9¶ó¸é À߸² °ÅÀÇ ¾øÀ½ */ object-fit: cover; transform: translateZ(0); backface-visibility: hidden; -webkit-backface-visibility: hidden; Z-index: 1;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ¸ÞÀÎ ÄÁÅÙÃ÷ - 02 Á¦ÀÛ ¹æ½Ä ¿µ¿ª */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.main-method {position: relative; width: 100%; padding: 10rem 0; border-top: 1px solid rgba(255,255,255,0.1); border-bottom: 1px solid rgba(255,255,255,0.1);}
.method-wrap {width: 100%;}

.productionMethod-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 5rem;}

.methodCard {position: relative; min-height: 690px; padding: 32px; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #262626; border-radius: 24px; background: linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.008)); transition: border-color .4s ease, background .4s ease, transform .5s cubic-bezier(.2,.8,.2,1);}
.methodCard:hover {transform: translateY(-8px); border-color: #4a4a4a; background: linear-gradient(145deg, rgba(255,255,255,.06), rgba(255,255,255,.012));}

.methodCard-point {background: radial-gradient(circle at 75% 20%, rgba(242,13,13,.08), transparent 35%), linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.008));}
.methodCard-top {display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 3;}
.methodCard-num {font-size: 13px; color: #777; font-weight: 600; letter-spacing: .08em;}
.methodCard-type {padding: 7px 11px; border: 1px solid #2d2d2d; border-radius: 30px; font-size: 10px; color: #777; font-weight: 600; letter-spacing: .12em;}
.methodCard-visual {width: 100%; height: 360px; display: flex; align-items: center; justify-content: center;}
.methodCard-visual img {display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 25px 40px rgba(0,0,0,.35)); transition: transform .7s cubic-bezier(.2,.8,.2,1), filter .5s ease;}
.methodCard:hover .methodCard-visual img {transform: translateY(-8px) scale(1.05); filter: drop-shadow(0 30px 50px rgba(0,0,0,.5));}
.methodCard-eng {display: block; margin-bottom: 9px; font-size: 12px; color: var(--default-color); font-weight: 600; letter-spacing: .14em;}
.methodCard h4 {margin: 0; font-family: "SCoreDream", sans-serif; font-size: 2.5rem; color: #fff; font-weight: 600; line-height: 1.3; letter-spacing: -.045em;}
.methodCard-desc {min-height: 60px; margin: 18px 0 0; font-size: 1.55rem; color: rgba(255,255,255,0.5); line-height: 1.4; letter-spacing: -.02em; word-break: keep-all;}

.methodCard-tags {display: flex; flex-wrap: wrap; gap: 7px;}
.methodCard-tags span {padding: 7px 15px; background: #111; border: 1px solid #292929; border-radius: 30px; font-size: 1.25rem; color: #858585;}

.methodCard-process {display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 1rem; margin-top: 25px;}
.methodCard-process span {flex: 0 0 auto; font-size: 1.55rem; letter-spacing: -.01em; color: #777;}
.methodCard-process i {display: block; width: 100%; height: 1px; position: relative; background: #333;}
.methodCard-process i::after {content: ""; position: absolute; right: -1px; top: 50%; width: 5px; height: 5px; border-top: 1px solid #555; border-right: 1px solid #555; transform: translateY(-50%) rotate(45deg);}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ¸ÞÀÎ ÄÁÅÙÃ÷ - 03 ÄÁ¼Á »ùÇà ¿µ»ó ¿µ¿ª */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.main-samplevideo {position: relative; width: 100%; padding: 10rem 0 0;}
.samplevideo-wrap {width: 100%;}

/*
.filter-wrap {width: 100%; margin-top: 5rem;}
.filter-wrap .inner {margin: 0 auto; width: 100%; max-width: var(--max-width);}
.filter-menu {display: flex; margin-bottom: 5rem;}
.filter-menu .btn {border: 1px solid rgba(255,255,255,0.1); font-size: 1.35rem; color: rgba(255,255,255,0.5); font-weight: 600; padding: 0.6rem 2rem; margin: 0 0.5rem; background-color: rgba(255,255,255,0); border: 1px solid rgba(255,255,255,0.15); border-radius: 0.5rem; cursor: pointer; transition: 0.3s;}
.filter-menu .btn:hover {color: #fff; background-color: #363636; border: 1px solid #363636;}
.filter-menu .btn.active {color: #fff; background-color: var(--default-color); border: 1px solid var(--default-color);}
*/

.portfolio-container {display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem 1rem; padding: 0 1rem; margin-top: 5rem;}
.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 {position: absolute; bottom: 0; left: 0; width: 100%; padding: 2rem 2rem; z-index: 3;}
.portfolio-container .item .desc span {font-size: 1.15rem; color: var(--default-color); font-weight: 700;}
.portfolio-container .item .desc p {text-align: left; width: 100%; font-size: 1.85rem; color: #fff; font-weight: 700; display: -webkit-box; white-space: break-spaces; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 1; margin-top: 1rem;}

.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.5);}


/* ¸ð´Þ Æ˾÷ ½ºÅ¸ÀÏ - Áß¾Ó Á¤·Ä & ¾Ö´Ï¸ÞÀÌ¼Ç */
.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: #000; padding: 3.5rem 2rem; width: 90%; max-width: 100rem; border: 1px solid rgba(255,255,255,0.08); 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 i {color: rgba(255,255,255,0.6);}
.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.2rem; color: rgba(255,255,255,0.9); font-weight: 600; letter-spacing: -0.05rem;}
#caption .modalpop-desc {width: 100%; margin-top: 1rem; font-size: 1.65rem; color: rgba(255,255,255,0.4); 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.45rem; color: rgba(255,255,255,0.3); font-weight: 300; line-height: 1.25; letter-spacing: -0.05rem; word-break: keep-all;}

/* ¸ð´Þ Æ˾÷ ½ºÅ¸ÀÏ - À¯Æ©ºê ¹ÝÀÀÇü ºñÀ² (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%;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ¸ÞÀÎ ÄÁÅÙÃ÷ - 04 Á¦ÀÛ ÇÁ·Î¼¼½º ¿µ¿ª */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.main-process {position: relative; width: 100%; padding: 10rem 0; border-bottom: 1px solid rgba(255,255,255,0.1);}
.process-wrap {width: 100%;}
.process-box {width: 100%;}
.process-box .inner {margin: 0 auto; width: 100%; max-width: var(--max-width);}

.process-list {position: relative; margin-top: 2.5rem}
.process-list:before {content: ""; position: absolute; left: 6rem; top: 4rem; bottom: 4rem; width: 1px; background: rgba(255,255,255,0.3);}
.process-row {position: relative; display: grid; grid-template-columns: 15rem 1fr 36rem; gap: 3rem; align-items: center; padding: 2.3rem 0; transition: .4s;}
.process-row .step {position: relative; z-index: 2; display: grid; place-items: center; width: 12rem; height: 12rem; background: var(--default-bgcolor); border-radius: 50%; border: 1px solid rgba(255,255,255,0.3); text-align: center; font-size: 1.3rem; color: var(--default-color); font-weight: 900; line-height: 1.25; transition: .4s;}
.process-main {display: flex; align-items: center; gap: 3rem;}

.process-row h4 {font-family: "SCoreDream", sans-serif; font-size: 2rem; color: #fff; font-weight: 700;}
.process-row p {margin-top: .7rem; color: rgba(255,255,255,0.5); line-height: 1.25; font-size: 1.5rem; word-break: keep-all;}
.process-row .deliver {padding: 1.8rem; border: 1px solid rgba(255,255,255,0.2); border-radius: 0.6rem;}
.process-row .deliver strong {color: rgba(255,255,255,0.8); font-size: 1.35rem; letter-spacing: .1em;}
.process-row .deliver span {display: block; margin-top: .6rem; color: rgba(255,255,255,0.5); font-size: 1.35rem; line-height: 1.5;}

.process-row.is-active .step {background: var(--default-color); border-color: var(--default-color); color: #fff; box-shadow: 0 0 0 9px rgba(29,93,219,.09);}
.process-row.is-active .deliver {border-color: var(--default-color);}
.process-row.is-active .deliver strong {color: var(--default-color);}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ¸ÞÀÎ ÄÁÅÙÃ÷ - 05 ¿Ö ¿Í¿ì½ºÆ©µð¿ÀÀΰ¡ ¿µ¿ª */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.main-whywowstudio {position: relative; width: 100%; padding: 10rem 0;}
.whywowstudio-wrap {width: 100%;}

.whyWow-grid {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 5rem; border-top: 1px solid #292929; border-left: 1px solid #292929;}
.whyWow-item {position: relative; min-height: 360px; padding: 38px 42px 34px; display: flex; flex-direction: column; overflow: hidden; border-right: 1px solid #292929; border-bottom: 1px solid #292929; background: #080808; transition: background .45s ease;}
.whyWow-item:hover {background: #0e0e0e;}
.whyWow-item-point::before {content: ""; position: absolute; right: -130px; bottom: -180px; width: 430px; height: 430px; border-radius: 50%; background: radial-gradient(circle, rgba(210,0,0,.12) 0%, rgba(210,0,0,.04) 35%, transparent 70%); pointer-events: none;}

.whyWow-top {position: relative; z-index: 2; display: flex; align-items: center;justify-content: space-between;}
.whyWow-num {font-size: 13px; font-weight: 600; line-height: 1; letter-spacing: .06em; color: #666;}
.whyWow-small {font-size: 11px; font-weight: 600; line-height: 1; letter-spacing: .15em; color: #666;}

.whyWow-content {position: relative; z-index: 2; margin-top: 5rem;}
.whyWow-content h3 {margin: 0; font-family: "SCoreDream", sans-serif; font-size: 3rem; line-height: 1.35; font-weight: 300; letter-spacing: -.05em; color: #8a8a8a;}
.whyWow-content h3 strong {color: #fff; font-weight: 700;}
.whyWow-content p {max-width: 580px; margin: 2.5rem 0 0; font-size: 1.65rem; color: #777; line-height: 1.4; font-weight: 400; letter-spacing: -.025em; word-break: keep-all;}

.whyWow-keyword {position: relative; z-index: 2; display: flex; align-items: center; gap: 12px; padding-top: 25px; margin-top: 32px; border-top: 1px solid #262626; font-size: 1.1rem; color: #606060; font-weight: 500; line-height: 1; letter-spacing: .12em;}
.whyWow-keyword span {color: #363636;}

.whyWow-item::after {content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 2px; background: #0073cf; transition: width .55s cubic-bezier(.2,.8,.2,1);}
.whyWow-item:hover::after {width: 100%;}
.whyWow-item:hover .whyWow-small {color: #aaa;}
.whyWow-item:hover .whyWow-num {color: #0073cf;}

.whyWow-bottom {position: relative; min-height: 250px; margin-top: 22px; padding: 45px 50px; display: grid; grid-template-columns: 180px 1fr 80px; gap: 50px; align-items: center; overflow: hidden; border: 1px solid #292929; background: radial-gradient( circle at 75% 130%, rgba(214,0,0,.10), transparent 42%), #080808;}
.whyWow-bottom::before {content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: linear-gradient(to right, transparent, rgba(255,255,255,.04), transparent);}
.whyWow-bottomLabel {position: relative; z-index: 2; font-size: 11px; line-height: 1; font-weight: 600; letter-spacing: .18em; color: #666;}
.whyWow-bottomText {position: relative; z-index: 2;}
.whyWow-bottomText p {margin: 0; font-size: clamp(27px, 2.7vw, 45px); line-height: 1.4; font-weight: 300; letter-spacing: -.05em; color: #777;}
.whyWow-bottomText strong {color: #fff; font-weight: 600;}

.whyWow-bottomCircle {position: relative; z-index: 2; width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; justify-self: end; border: 1px solid #333; border-radius: 50%; transition: transform .5s ease, border-color .4s ease, background .4s ease;}
.whyWow-bottomCircle span {font-size: 23px; line-height: 1; font-weight: 200; color: #777;}
.whyWow-bottom:hover .whyWow-bottomCircle {transform: rotate(90deg); border-color: #0073cf; background: #0073cf;}
.whyWow-bottom:hover .whyWow-bottomCircle span {color: #fff;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ¸ÞÀÎ ÄÁÅÙÃ÷ - 06 Á¦ÀÛ ºñ¿ë ¿µ¿ª */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.main-price {position: relative; width: 100%; padding: 10rem 0; background: #000; border-top: 1px solid rgba(255,255,255,0.1);}
.price-wrap {width: 100%;}

.pricingGuide-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 5rem;}

.priceCard {position: relative; min-height: 690px; padding: 35px; display: flex; flex-direction: column; overflow: hidden; background: #0b0b0b; border: 1px solid #292929; border-radius: 22px; transition: transform .45s ease, border-color .4s ease, background .4s ease;}
.priceCard:hover {transform: translateY(-8px); border-color: #555; background: #101010;}

.priceCard-popular {border-color: rgba(0,115,207,.65); background: radial-gradient( circle at 80% 0%, rgba(214,0,0,.11),transparent 32%), #0d0d0d;}
.priceCard_popular {position: absolute; right: 0; top: 0; padding: 10px 19px; background: var(--default-color); border-radius: 0 20px 0 14px; font-size: 9px; line-height: 1; font-weight: 700; letter-spacing: .13em; color: #fff;}

.priceCard-top {display: flex; align-items: center; justify-content: space-between;}
.priceCard-num {font-size: 13px; font-weight: 600; color: #666;}
.priceCard-type {font-size: 10px; font-weight: 600; letter-spacing: .14em; color: #666;}

.priceCard-title {margin-top: 50px;}
.priceCard-eng {display: block; margin-bottom: 10px; font-size: 1.15rem; color: var(--default-color); font-weight: 600; letter-spacing: .14em;}
.priceCard-title h4 {margin: 0; font-family: "SCoreDream", sans-serif; font-size: 3.4rem; line-height: 1.3; font-weight: 600; letter-spacing: -.045em; color: #fff;}
.priceCard-title p {margin: 17px 0 0; font-size: 1.45rem; line-height: 1.55; color: #737373;}

.priceCard-price {margin-top: 3rem;}
.priceCard-from {display: block; margin-bottom: 5px; font-size: 1.15rem; color: var(--default-color); font-weight: 600; letter-spacing: .17em;}
.priceCard-price div {display: flex; align-items: baseline; gap: 7px;}
.priceCard-price strong {font-size: clamp(62px, 5vw, 83px); line-height: 1; font-weight: 500; letter-spacing: -.06em; color: #fff;}
.priceCard-price div span {font-size: 1.95rem; font-weight: 500; letter-spacing: -.04em; color: #aaa;}
.priceCard-line {width: 100%; height: 1px; margin: 20px 0 28px; background: #292929;}
.priceCard-features {margin: 0; padding-bottom: 27px;}
.priceCard-features li {position: relative; margin-top: 1rem; padding-left: 1.9rem; font-size: 1.45rem; line-height: 1.25; color: #858585;}
.priceCard-features li:first-child {margin-top: 0;}
.priceCard-features li::before {content: ""; position: absolute; left: 0; top: 7px; width: 5px; height: 5px; border-radius: 50%; background: #555;}

.priceCard-popular strong {color: var(--default-color);}
.priceCard-popular .priceCard-features li::before {background: var(--default-color);}

.priceCard-recommend {margin-top: auto; padding-top: 27px; border-top: 1px solid #292929;}
.priceCard-recommend span {display: block; margin-bottom: 8px; font-size: 1rem; color: var(--default-color); font-weight: 600; letter-spacing: .15em;}
.priceCard-recommend p {margin: 0; font-size: 1.35rem; line-height: 1.6; color: #777;}

.pricingGuide-notice {margin-top: 20px; padding: 40px 42px; display: grid; grid-template-columns: 260px 1fr; gap: 50px; align-items: start; border: 1px solid #292929; border-radius: 18px; background: #0a0a0a;}
.pricingGuide-noticeTitle {padding-top: 4px; font-size: 10px; font-weight: 600; letter-spacing: .15em; color: var(--default-color);}
.pricingGuide-noticeText strong {display: block; margin-bottom: 12px; font-size: 2rem; line-height: 1.5; font-weight: 500; letter-spacing: -.03em; color: #ddd; word-break: keep-all;}
.pricingGuide-noticeText p {max-width: 900px; margin: 0; font-size: 1.55rem; line-height: 1.4; letter-spacing: -.03em; color: #686868; word-break: keep-all;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ¸ÞÀÎ ÄÁÅÙÃ÷ - 07 ÀÚÁÖÇÏ´ÂÁú¹® ¿µ¿ª */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.main-faq {position: relative; width: 100%; padding: 10rem 0; border-top: 1px solid rgba(255,255,255,0.1);}
.faq-wrap {width: 100%; display: grid; grid-template-columns: 55rem 1fr; gap:6rem;}

.faq-wrap .title-common .inner {justify-content: flex-start;}
.faq-wrap .title-common .ico {display: block; width: 100%; padding-left: 10rem; margin-top: -30px;}
.faq-wrap .title-common .ico img {width: 50%;}
.faq-wrap .title-common p {margin-top: 2rem;}

.faq-list {border-top: 1px solid rgba(255,255,255,0.15);}
.faq-item {border-bottom: 1px solid rgba(255,255,255,0.15); transition: var(--transition1);}
.faq-item > button {display: grid; grid-template-columns: 4rem 1fr 3rem; gap: 1rem; align-items: center; width: 100%; padding: 1.9rem 0; border: 0; background: transparent; text-align: left;}
.faq-item .q {display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; background: rgba(255,255,255,0.2); font-size: 1.35rem; color: #fff; font-weight: 900; transition:.25s;}
.faq-item button strong {font-size: 1.75rem; color: rgba(255,255,255,0.6); font-weight: 600; transition:.25s;}
.faq-item button:hover strong {color: var(--default-color);}
.faq-item button i {display: block; width: 1.5rem; transition:.25s;}
.faq-item button i img {width: 100%; opacity: 0.5;}

.faq-item:hover {background: rgba(255,255,255,0.02);}
.faq-item.open .q {background: var(--default-color); color: #fff;}
.faq-item.open button strong {color: var(--default-color);}
.faq-item.open button i {transform: rotate(180deg);}

.faq-answer {max-height: 0; overflow: hidden; transition: max-height .38s ease;}
.faq-answer > div {padding: 0 4rem 2.2rem 5rem; color: rgba(255,255,255,0.45); font-size: 1.55rem; line-height: 1.4}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ¸ÞÀÎ ÄÁÅÙÃ÷ - 08 °í°´¼¾ÅÍ Á¤º¸ ¹× Á¦ÀÛ¹®ÀÇÇϱ⠿µ¿ª */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

.main-contentarea {position: relative; width: 100%; padding: 10rem 0; background-color: #131313;}
.contentarea-wrap {display: flex; flex-wrap: wrap; width: 100%; margin-top: 5rem;}

/* ÁÂÃø °í°´¼¾ÅÍ Á¤º¸ ¿µ¿ª */
.customer-wrap {width: 50%;}
.customer-box {display: flex; /*justify-content: center;*/ flex-direction: column; flex-wrap: wrap; width: 100%; height: 100%; padding-right: 8rem;}
.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: 5rem; color: rgba(255,255,255,0.8); font-weight: 700; letter-spacing: -0.035rem; margin-bottom: 3rem;}
.customer-box .contact-wrap p {width: 100%; font-size: 2rem; color: rgba(255,255,255,0.4); font-weight: 500; letter-spacing: -0.030rem; line-height: 1.3; word-break: keep-all; margin-bottom: 3rem;}
.customer-box .contact-wrap p strong {font-weight: 700;}

.customer-box .contact-wrap .email-info {width: 100%; margin-top: 7.5rem;}
.customer-box .contact-wrap .email-info h5 {font-size: 1.3rem; color: var(--default-color); font-weight: 600; letter-spacing: -0.020rem; margin-bottom: 2rem;}
.customer-box .contact-wrap .email-info .col {display: flex; align-items: center; flex-wrap: wrap; margin-right: 4rem;}
.customer-box .contact-wrap .email-info .col i {display: flex; justify-content: center; align-items: center; flex-wrap: wrap; width: 4.5rem; height: 4.5rem; font-size: 2rem; color: rgba(255,255,255,0.9); margin-right: 2rem; border: 1px solid rgba(255, 255, 255, 0.40); border-radius: 50%;}
.customer-box .contact-wrap .email-info .col span {font-size: 1.85rem; color: rgba(255,255,255,0.6); font-weight: 600; letter-spacing: -0.020rem; line-height: 1.2;}

.customer-box .contact-wrap .check-info {display: grid; grid-template-columns: 17rem 1fr; align-items: center; width: 100%; gap: 3rem; padding: 1rem 2rem; margin-top: 3rem; border: 1px solid rgba(255,255,255,0.1); border-radius: 10px;}
.customer-box .contact-wrap .check-info .ico {display: inline-block; width: 16rem;}
.customer-box .contact-wrap .check-info .ico img {width: 100%;}
.customer-box .contact-wrap .check-info .infobox {display: inline-block; padding: 3rem 3rem 3rem 0;}
.customer-box .contact-wrap .check-info strong {font-size: 1.65rem; color: rgba(255,255,255,0.8); font-weight: 600; letter-spacing: -0.020rem;}
.customer-box .contact-wrap .check-info strong i {font-size: 1.95rem; font-weight: 500; margin-right: 7px;}
.customer-box .contact-wrap .check-info ul {display: grid; gap: .5rem; margin-top: 1.2rem; padding-left: 1rem;}
.customer-box .contact-wrap .check-info ul li {position: relative; padding-left: 1.2rem; color: rgba(255,255,255,0.5); font-size: 1.55rem;}
.customer-box .contact-wrap .check-info ul li:before {content: ""; position: absolute; top: 8px; left: 0; width: 4px; height: 4px; background: rgba(255,255,255,0.5); border-radius: 50%;}

/* ¿ìÃø Á¦ÀÛ¹®ÀÇÇϱâ Æû ¿µ¿ª */
.counselform-wrap {width: 50%;}
.form-box {width: 100%; border-radius: 3rem;}
.form-box .guidetxt {font-size: 1.65rem; color: rgba(255,255,255,0.5); 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: rgba(255,255,255,0.5); font-weight: 500; padding: 2rem; background: rgba(255,255,255,0.1); border: 1px solid rgba(0,0,0,0.15); border-radius: 6px; 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: rgba(255,255,255,0.1); border: 1px solid rgba(0,0,0,0.15); resize: none; border-radius: 6px;}
.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: 1rem 2rem; border: 1px solid rgba(0,0,0,0.15); appearance: none; -webkit-appearance: none; -moz-appearance: none; border-radius: 0; background: rgba(255,255,255,0.1) 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: rgba(255,255,255,0.5); 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: rgba(255,255,255,0.4); 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.35); 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: rgba(255,255,255,0.1); border: 1px solid rgba(0,0,0,0.15); border-radius: 6px;}
.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: #000; border: 1px solid var(--default-gray-color); border-radius: 6px;}
.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.15); 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.25rem; color: rgba(255,255,255,0.3); font-weight: 500; letter-spacing: -0.035rem; background: rgba(255,255,255,0.1); border: 1px solid rgba(0,0,0,0.15); border-radius: 6px; transition: var(--transition1);}
.form-box .form-wrap .form-group .right a:hover {color: #fff; background: #000; border: 1px solid #000;}

.form-box .form-wrap .form-group button.counsel-btn {width: 100%; max-width: 22rem; height: 7rem; font-size: 1.85rem; color: #fff; font-weight: 700; margin-top: 3rem; background: var(--default-color); border: 1px solid var(--default-color); border-radius: 60px; transition: var(--transition2);}
.form-box .form-wrap .form-group button.counsel-btn:hover {color: #fff; background: #000; border: 1px solid #000;}

/* ¿ìÃø »ó´ã½ÅûÇϱâ Æû ½ºÅ¸ÀÏ - ÀÎDz¹Ú½º, ÅؽºÆ®¿¡¸®¾î Æ÷Ä¿½Ì ½ºÅ¸ÀÏ Àû¿ë */
.form-box .form-wrap .form-group .basic-input:focus {background: rgba(0,0,0,0.8); border: 1px solid var(--default-color); transition: var(--transition2);}
.form-box .form-wrap .form-group .basic-textarea:focus {background: rgba(0,0,0,0.8); border: 1px solid var(--default-color); transition: var(--transition2);}

/* ¿ìÃø »ó´ã½ÅûÇϱâ Æû ½ºÅ¸ÀÏ - ÀÎDz¹Ú½º, ÅؽºÆ®¿¡¸®¾î ¼Ó¼º placeholder ½ºÅ¸ÀÏ Àû¿ë */
.form-box .form-wrap .form-group .basic-input::-webkit-input-placeholder{font-size: 1.65rem; color: rgba(255,255,255,0.35); font-weight: 400;}
.form-box .form-wrap .form-group .basic-input::-moz-placeholder{font-size: 1.65rem; color: rgba(255,255,255,0.35); font-weight: 400;}
.form-box .form-wrap .form-group .basic-input:-ms-input-placeholder{font-size: 1.65rem; color: rgba(255,255,255,0.35); font-weight: 400;}
.form-box .form-wrap .form-group .basic-input:-moz-placeholder{font-size: 1.65rem; color: rgba(255,255,255,0.35); font-weight: 400;}
.form-box .form-wrap .form-group .basic-textarea::-webkit-input-placeholder{font-size: 1.65rem; color: rgba(255,255,255,0.35); font-weight: 400;}
.form-box .form-wrap .form-group .basic-textarea::-moz-placeholder{font-size: 1.65rem; color: rgba(255,255,255,0.35); font-weight: 400;}
.form-box .form-wrap .form-group .basic-textarea:-ms-input-placeholder{font-size: 1.65rem; color: rgba(255,255,255,0.35); font-weight: 400;}
.form-box .form-wrap .form-group .basic-textarea:-moz-placeholder{font-size: 1.65rem; color: rgba(255,255,255,0.35); 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: #202020;}
.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: rgba(255,255,255,0.8); 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: #000; resize: none;}

/* ½ºÅ©·Ñ Ä÷¯ º¯°æ */
.privacy-wrap .privacy-popupbox .privacy-content textarea.pop-textarea {scrollbar-width: thin; scrollbar-color: #a99f92 rgba(255,255,255,0.08);}
.privacy-wrap .privacy-popupbox .privacy-content textarea.pop-textarea::-webkit-scrollbar {width: 6px;}
.privacy-wrap .privacy-popupbox .privacy-content textarea.pop-textarea::-webkit-scrollbar-track {background: rgba(255,255,255,0.05);}
.privacy-wrap .privacy-popupbox .privacy-content textarea.pop-textarea::-webkit-scrollbar-thumb {background: #a99f92; border-radius: 10px;}

/* ·¹À̾îÆ˾÷ - À̸ÞÀÏ ¹«´Ü¼öÁý°ÅºÎ ³»¿ë ¿ÀÇ ¿µ¿ª ½ÃÀÛ */
.emailcoll-popup {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 100000000; display: none;}
.emailcoll-wrap {position: absolute; width: 100%; height: auto; top: 0; left: 0;}
.emailcoll-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: 35%; padding: 4rem; border-radius: 1rem; background: #202020;}
.emailcoll-wrap .privacy-popupbox .btn-close {position: absolute; right: 4rem; top: 4rem; cursor: pointer;}
.emailcoll-wrap .privacy-popupbox .btn-close button {width: 2.5rem; height: 2.5rem; background: transparent;}
.emailcoll-wrap .privacy-popupbox .btn-close button img {max-width: 100%; object-fit: cover;}
.emailcoll-wrap .privacy-popupbox .privacy-content {width: 100%; height: 100%;}
.emailcoll-wrap .privacy-popupbox .privacy-content .tit {width: 100%; height: 2.5rem; font-size: 2.4rem; color: rgba(255,255,255,0.8); font-weight: 700; letter-spacing: -0.035rem; margin-bottom: 2rem;}
.emailcoll-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: #000; resize: none;}

/* ½ºÅ©·Ñ Ä÷¯ º¯°æ */
.emailcoll-wrap .privacy-popupbox .privacy-content textarea.pop-textarea {scrollbar-width: thin; scrollbar-color: #a99f92 rgba(255,255,255,0.08);}
.emailcoll-wrap .privacy-popupbox .privacy-content textarea.pop-textarea::-webkit-scrollbar {width: 6px;}
.emailcoll-wrap .privacy-popupbox .privacy-content textarea.pop-textarea::-webkit-scrollbar-track {background: rgba(255,255,255,0.05);}
.emailcoll-wrap .privacy-popupbox .privacy-content textarea.pop-textarea::-webkit-scrollbar-thumb {background: #a99f92; border-radius: 10px;}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** ¹ÝÀÀÇü¼³Á¤ Mobile 359 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (max-width:359px) {

/* ¸ÞÀÎ °øÅë */
.sec-main .inner, .process-box .inner {max-width: none; padding-left: 2rem; padding-right: 2rem;}

.title-common .inner {display: block;}
.title-common h2 {font-size: 5.2rem; line-height: 1.05; margin-left: 0;}
.title-common h2 strong.eng span {padding-right: 5.5rem;}
.title-common h2 strong.eng span:after {left: 1.2rem; width: 4rem;}
.title-common h3 {font-size: 3rem; line-height: 1.25; margin-bottom: 1.5rem;}
.title-common p {margin-top: 2rem;}
.right-more {margin-top: 3rem;}

/* »ó´Ü°íÁ¤ ÅÇ */
.fixed-gap {top: 6rem; height: 4.8rem; overflow-x: auto; overflow-y: hidden; white-space: nowrap;-webkit-overflow-scrolling: touch;}
.fixed-gap .tabs-container {width: max-content; min-width: 100%;}
.fixed-gap .tabs-container ul {display: flex; width: max-content; min-width: 100%;}
.fixed-gap .tabs-container ul li {flex: 0 0 auto; padding: 0 1.3rem;}
.fixed-gap .tabs-container ul li a {height: 4.8rem; font-size: 1.35rem;}

/* ¸ÞÀÎ ºñÁÖ¾ó */
.main-visual .visualmedia-wrap, .main-visual .visualtitle-wrap {height: 100svh; min-height: 66rem;}
.main-visual .visualmedia-wrap .coverbg {background: linear-gradient(to right, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.58) 70%, rgba(0,0,0,0.32) 100%);}
.main-visual .visualtitle-wrap {padding-top: 6rem;}
.main-visual .visualtitle-wrap .inner {max-width: none; padding: 0 2rem;}
.main-visual .visualtitle-wrap .title-box .eyebrow {font-size: 1.15rem; padding: .7rem 1.4rem;}
.main-visual-title h2 {margin-top: 1.8rem; font-size: 4.2rem; line-height: 1.2;}
.main-title-line {font-size: 3.4rem; line-height: 1.2;}
.main-visual .visualtitle-wrap .title-box .tit-desc {max-width: 46rem; margin-top: 1.8rem; font-size: 1.5rem; line-height: 1.55; word-break: keep-all;}
.main-visual .visualtitle-wrap .title-box .ai-points {gap: .6rem; margin-top: 2rem;}
.main-visual .visualtitle-wrap .title-box .ai-points span {padding: .65rem 1.2rem; font-size: .95rem;}
.main-visual .visualtitle-wrap .title-box .buttons {margin-top: 2.4rem; gap: .8rem;}
.main-visual .visualtitle-wrap .title-box .btn {height: 4.4rem; padding: 0 1.7rem; font-size: 1.3rem;}

/* 01 ¿µ»ó Á¦ÀÛ */
.main-overview {padding: 8rem 0;}
.overview-wrap {grid-template-columns: 1fr;}
.left-brandfilm {padding-right: 0;}
.left-brandfilm .title-common .inner {padding-left: 0; padding-right: 0;}
.left-brandfilm .title-common p {margin-top: 1.5rem;}

.wowService-grid {grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 3.5rem;}
.wowService-item {aspect-ratio: 3 / 4;}
.wowService-content {padding: 1.7rem;}
.wowService-number {font-size: 1.15rem;}
.wowService-eng {font-size: 1rem;}
.wowService-title h3 {font-size: 1.6rem;}
.wowService-desc {/*display: none;*/ max-height: 90px; opacity: 1; transform: translateY(0); margin-top: 1rem;}
.wowService-desc p br {display: none;}

.brandFilmMotion {height: 68rem; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 4rem;}
.brandFilmMotion:before,
.brandFilmMotion:after {height: 22%;}
.wowVideoCard {border-radius: 10px;}

/* 02 Á¦ÀÛ ¹æ½Ä */
.main-method {padding: 8rem 0;}
.method-wrap .inner {padding: 0;}
.productionMethod-grid {grid-template-columns: 1fr; gap: 1.3rem; margin-top: 3.5rem;}
.methodCard {min-height: 0; padding: 2.6rem; border-radius: 1.8rem;}
.methodCard:hover {transform: none;}
.methodCard-visual {height: 25rem;}
.methodCard:hover .methodCard-visual img {transform: none;}
.methodCard h4 {font-size: 2.4rem;}
.methodCard-desc {min-height: 0; margin-top: 1.5rem; font-size: 1.65rem; color: rgba(255,255,255,0.6);}
.methodCard-tags {margin-top: 1.5rem;}
.methodCard-tags span {padding: .6rem 1.2rem; font-size: 1.15rem;}
.methodCard-process {margin-top: 2rem;}
.methodCard-process span {font-size: 1.65rem;}

/* 03 ÄÁ¼Á »ùÇà ¿µ»ó */
.main-samplevideo {padding: 8rem 0 0;}
.filter-wrap {margin-top: 3rem;}
.filter-menu {display: block; text-align: center; margin-bottom: 3rem;}
.filter-menu .btn {font-size: 1.3rem; padding: .9rem 1.5rem; margin: .3rem .15rem;}
.portfolio-container {grid-template-columns: repeat(2, 1fr); gap: 1rem;}
.portfolio-container .item .desc {padding: 1.3rem;}
.portfolio-container .item .desc span {font-size: 1rem;}
.portfolio-container .item .desc p {font-size: 1.5rem; margin-top: .5rem;}
.portfolio-container .item .ico-circle {top: .7rem; right: .7rem; width: 3.6rem; height: 3.6rem;}
.portfolio-container .item .ico-circle i {font-size: 2rem;}

.modal-content {width: calc(100% - 4rem); padding: 1.5rem;}
.media-container {margin-top: 2.5rem;}
.close-inside {top: .5rem; right: 1rem;}
#caption .modalpop-tit {font-size: 1.9rem;}
#caption .modalpop-desc {font-size: 1.45rem;}
#caption .modalpop-ex {font-size: 1.3rem;}

/* 04 Á¦ÀÛ ÇÁ·Î¼¼½º */
.main-process {padding: 8rem 0;}
.process-list {margin-top: 2rem;}
.process-list:before {left: 3.2rem; top: 3rem; bottom: 3rem;}
.process-row {
	grid-template-columns: 6.4rem 1fr;
	gap: 1.6rem;
	align-items: start;
	padding: 1.7rem 0;
}
.process-row .step {width: 6.4rem; height: 6.4rem; font-size: 1.05rem;}
.process-main {display: block; padding-top: .8rem;}
.process-row .deliver {grid-column: 2; padding: 1.4rem; margin-top: -.5rem;}
.process-row .deliver strong,
.process-row .deliver span {font-size: 1.25rem;}

/* 05 WHY WOWSTUDIO */
.main-whywowstudio {padding: 8rem 0;}
.whyWow-grid {grid-template-columns: 1fr; margin-top: 3.5rem;}
.whyWow-item {min-height: 0; padding: 2.8rem 2.4rem;}
.whyWow-content {margin-top: 3rem;}
.whyWow-content p {margin-top: 1.6rem;}
.whyWow-keyword {gap: .8rem; padding-top: 1.8rem; margin-top: 2.2rem; font-size: 1rem;}

.whyWow-bottom {
	min-height: 0;
	margin-top: 1.2rem;
	padding: 2.8rem 2.4rem;
	grid-template-columns: 1fr 4.8rem;
	gap: 1.5rem;
}
.whyWow-bottomLabel {grid-column: 1 / -1;}
.whyWow-bottomText p {font-size: 2.6rem; line-height: 1.45;}
.whyWow-bottomCircle {width: 4.8rem; height: 4.8rem;}
.whyWow-bottomCircle span {font-size: 1.8rem;}

/* 06 Á¦ÀÛ ºñ¿ë */
.main-price {padding: 8rem 0;}
.main-price .title-common p br {display: none;}
.pricingGuide-grid {grid-template-columns: 1fr; gap: 1.3rem; margin-top: 3.5rem;}
.priceCard {min-height: 0; padding: 4rem 2.4rem 2.8rem; border-radius: 1.8rem;}
.priceCard:hover {transform: none;}
.priceCard-title {margin-top: 3rem;}
.priceCard-title p {font-size: 1.65rem; line-height: 1.4;}
.priceCard-price {margin-top: 2.5rem;}
.priceCard-features {padding-bottom: 10px;}
.priceCard-features li {font-size: 1.65rem;}
.priceCard-recommend {margin-top: 2rem;}
.pricingGuide-notice {
	margin-top: 1.3rem;
	padding: 2.5rem 2.4rem;
	grid-template-columns: 1fr;
	gap: 1.5rem;
	border-radius: 1.5rem;
}

/* 07 ÀÚÁÖÇÏ´Â Áú¹® */
.main-faq {padding: 8rem 0;}
.faq-wrap {grid-template-columns: 1fr; gap: 3.5rem;}
.faq-wrap .title-common .inner {padding-left: 0; padding-right: 0;}
.faq-wrap .title-common .ico {width: 15rem; padding-left: 0; margin-left: 8rem;}
.faq-wrap .title-common .ico img {width: 100%;}
.faq-item > button {grid-template-columns: 3.5rem 1fr 2rem; gap: .8rem; padding: 1.8rem 0;}
.faq-item .q {width: 2.8rem; height: 2.8rem; font-size: 1.2rem;}
.faq-item button strong {width: 90%; line-height: 1.4; word-break: keep-all;}
.faq-item button:hover strong {color: rgba(255, 255, 255, 0.6);}
.faq-item.open button strong {color: var(--default-color);}
.faq-answer > div {padding: 0 2rem 2rem 4.3rem;}

/* 08 °í°´¼¾ÅÍ / Á¦ÀÛ¹®ÀÇ */
.main-contentarea {padding: 8rem 0;}
.main-contentarea .title-common .inner {padding: 0;}
.contentarea-wrap {display: block; margin-top: 3.5rem;}
.customer-wrap,
.counselform-wrap {width: 100%;}
.customer-box {padding-right: 0;}
.customer-box .contact-wrap h4 {font-size: 3.7rem; margin-bottom: 2rem;}
.customer-box .contact-wrap p {font-size: 1.6rem; line-height: 1.5; margin-bottom: 2rem;}
.customer-box .contact-wrap .email-info {margin-top: 3rem;}
.customer-box .contact-wrap .email-info .col i {width: 4rem; height: 4rem; margin-right: 1.5rem;}
.customer-box .contact-wrap .email-info .col span {font-size: 1.6rem;}

.customer-box .contact-wrap .check-info {
	grid-template-columns: 10rem 1fr;
	gap: 1.5rem;
	padding: 1.5rem;
	margin-top: 2.5rem;
}
.customer-box .contact-wrap .check-info .ico {width: 10rem;}
.customer-box .contact-wrap .check-info .infobox {padding: 1.5rem 0;}
.customer-box .contact-wrap .check-info strong {font-size: 1.45rem;}
.customer-box .contact-wrap .check-info ul li {font-size: 1.35rem; line-height: 1.45;}

.counselform-wrap {margin-top: 6rem;}
.form-box {border-radius: 1.8rem;}
.form-box .guidetxt {font-size: 1.45rem;}
.form-box h4.tit {font-size: 3.7rem;}
.form-box .form-wrap .form-group-input .row {width: 100%; margin-bottom: 1rem;}
.form-box .form-wrap .form-group-input .row:last-child {margin-bottom: 0;}
.form-box .form-wrap .form-group .basic-input,
.form-box .form-wrap .form-group .basic-select {height: 5.5rem; font-size: 1.55rem;}
.form-box .form-wrap .form-group .basic-textarea {height: 18rem; font-size: 1.55rem;}
.form-box .form-wrap .form-group .tit {font-size: 1.65rem;}
.form-box .form-wrap .form-group .type-check .type-row {margin: 0 2rem 1rem 0;}
.form-box .form-wrap .form-group .type-check .type-row .type-label {font-size: 1.5rem;}

.form-box .form-wrap .form-group .field input.upload-text {width: calc(100% - 12rem); height: 5.5rem; font-size: 1.45rem; padding: 0 1.2rem;}
.form-box .form-wrap .form-group .field div.upload-btn_wrap {width: 11rem; height: 5.5rem; margin-left: 1rem;}
.form-box .form-wrap .form-group .field div.upload-btn_wrap button,
.form-box .form-wrap .form-group .field div.upload-btn_wrap input.input-file {width: 11rem; height: 5.5rem; font-size: 1.4rem;}

.form-box .form-wrap .form-group-privacy {align-items: flex-start; gap: 1rem;}
.form-box .form-wrap .form-group .left {width: calc(100% - 8.5rem);}
.form-box .form-wrap .form-group .left .agree-label {font-size: 1.45rem; line-height: 1.45;}
.form-box .form-wrap .form-group button.counsel-btn {max-width: none; height: 6rem; margin-top: 2rem; font-size: 1.65rem;}

.privacy-wrap .privacy-popupbox,
.emailcoll-wrap .privacy-popupbox {width: 90%; padding: 2rem;}
.privacy-wrap .privacy-popupbox .btn-close,
.emailcoll-wrap .privacy-popupbox .btn-close {right: 2rem; top: 2rem;}

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** ¹ÝÀÀÇü¼³Á¤ Mobile 360,719 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:360px) and (max-width:719px) {

/* ¸ÞÀÎ °øÅë */
.sec-main .inner, .process-box .inner {max-width: none; padding-left: 2rem; padding-right: 2rem;}

.title-common .inner {display: block;}
.title-common h2 {font-size: 5.2rem; line-height: 1.05; margin-left: 0;}
.title-common h2 strong.eng span {padding-right: 5.5rem;}
.title-common h2 strong.eng span:after {left: 1.2rem; width: 4rem;}
.title-common h3 {font-size: 3rem; line-height: 1.25; margin-bottom: 1.5rem;}
.title-common p {margin-top: 2rem;}
.right-more {margin-top: 3rem;}

/* »ó´Ü°íÁ¤ ÅÇ */
.fixed-gap {top: 6rem; height: 4.8rem; overflow-x: auto; overflow-y: hidden; white-space: nowrap;-webkit-overflow-scrolling: touch;}
.fixed-gap .tabs-container {width: max-content; min-width: 100%;}
.fixed-gap .tabs-container ul {display: flex; width: max-content; min-width: 100%;}
.fixed-gap .tabs-container ul li {flex: 0 0 auto; padding: 0 1.3rem;}
.fixed-gap .tabs-container ul li a {height: 4.8rem; font-size: 1.35rem;}

/* ¸ÞÀÎ ºñÁÖ¾ó */
.main-visual .visualmedia-wrap, .main-visual .visualtitle-wrap {height: 100svh; min-height: 66rem;}
.main-visual .visualmedia-wrap .coverbg {background: linear-gradient(to right, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.58) 70%, rgba(0,0,0,0.32) 100%);}
.main-visual .visualtitle-wrap {padding-top: 6rem;}
.main-visual .visualtitle-wrap .inner {max-width: none; padding: 0 2rem;}
.main-visual .visualtitle-wrap .title-box .eyebrow {font-size: 1.15rem; padding: .7rem 1.4rem;}
.main-visual-title h2 {margin-top: 1.8rem; font-size: 4.2rem; line-height: 1.2;}
.main-title-line {font-size: 3.4rem; line-height: 1.2;}
.main-visual .visualtitle-wrap .title-box .tit-desc {max-width: 46rem; margin-top: 1.8rem; font-size: 1.5rem; line-height: 1.55; word-break: keep-all;}
.main-visual .visualtitle-wrap .title-box .ai-points {gap: .6rem; margin-top: 2rem;}
.main-visual .visualtitle-wrap .title-box .ai-points span {padding: .65rem 1.2rem; font-size: .95rem;}
.main-visual .visualtitle-wrap .title-box .buttons {margin-top: 2.4rem; gap: .8rem;}
.main-visual .visualtitle-wrap .title-box .btn {height: 4.4rem; padding: 0 1.7rem; font-size: 1.3rem;}

/* 01 ¿µ»ó Á¦ÀÛ */
.main-overview {padding: 8rem 0;}
.overview-wrap {grid-template-columns: 1fr;}
.left-brandfilm {padding-right: 0;}
.left-brandfilm .title-common .inner {padding-left: 0; padding-right: 0;}
.left-brandfilm .title-common p {margin-top: 1.5rem;}

.wowService-grid {grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 3.5rem;}
.wowService-item {aspect-ratio: 3 / 4;}
.wowService-content {padding: 1.7rem;}
.wowService-number {font-size: 1.15rem;}
.wowService-eng {font-size: 1rem;}
.wowService-title h3 {font-size: 1.6rem;}
.wowService-desc {/*display: none;*/ max-height: 90px; opacity: 1; transform: translateY(0); margin-top: 1rem;}
.wowService-desc p br {display: none;}

.brandFilmMotion {height: 68rem; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 4rem;}
.brandFilmMotion:before,
.brandFilmMotion:after {height: 22%;}
.wowVideoCard {border-radius: 10px;}

/* 02 Á¦ÀÛ ¹æ½Ä */
.main-method {padding: 8rem 0;}
.method-wrap .inner {padding: 0;}
.productionMethod-grid {grid-template-columns: 1fr; gap: 1.3rem; margin-top: 3.5rem;}
.methodCard {min-height: 0; padding: 2.6rem; border-radius: 1.8rem;}
.methodCard:hover {transform: none;}
.methodCard-visual {height: 25rem;}
.methodCard:hover .methodCard-visual img {transform: none;}
.methodCard h4 {font-size: 2.4rem;}
.methodCard-desc {min-height: 0; margin-top: 1.5rem; font-size: 1.65rem; color: rgba(255,255,255,0.6);}
.methodCard-tags {margin-top: 1.5rem;}
.methodCard-tags span {padding: .6rem 1.2rem; font-size: 1.15rem;}
.methodCard-process {margin-top: 2rem;}
.methodCard-process span {font-size: 1.65rem;}

/* 03 ÄÁ¼Á »ùÇà ¿µ»ó */
.main-samplevideo {padding: 8rem 0 0;}
.filter-wrap {margin-top: 3rem;}
.filter-menu {display: block; text-align: center; margin-bottom: 3rem;}
.filter-menu .btn {font-size: 1.3rem; padding: .9rem 1.5rem; margin: .3rem .15rem;}
.portfolio-container {grid-template-columns: repeat(2, 1fr); gap: 1rem;}
.portfolio-container .item .desc {padding: 1.3rem;}
.portfolio-container .item .desc span {font-size: 1rem;}
.portfolio-container .item .desc p {font-size: 1.5rem; margin-top: .5rem;}
.portfolio-container .item .ico-circle {top: .7rem; right: .7rem; width: 3.6rem; height: 3.6rem;}
.portfolio-container .item .ico-circle i {font-size: 2rem;}

.modal-content {width: calc(100% - 4rem); padding: 1.5rem;}
.media-container {margin-top: 2.5rem;}
.close-inside {top: .5rem; right: 1rem;}
#caption .modalpop-tit {font-size: 1.9rem;}
#caption .modalpop-desc {font-size: 1.45rem;}
#caption .modalpop-ex {font-size: 1.3rem;}

/* 04 Á¦ÀÛ ÇÁ·Î¼¼½º */
.main-process {padding: 8rem 0;}
.process-list {margin-top: 2rem;}
.process-list:before {left: 3.2rem; top: 3rem; bottom: 3rem;}
.process-row {
	grid-template-columns: 6.4rem 1fr;
	gap: 1.6rem;
	align-items: start;
	padding: 1.7rem 0;
}
.process-row .step {width: 6.4rem; height: 6.4rem; font-size: 1.05rem;}
.process-main {display: block; padding-top: .8rem;}
.process-row .deliver {grid-column: 2; padding: 1.4rem; margin-top: -.5rem;}
.process-row .deliver strong,
.process-row .deliver span {font-size: 1.25rem;}

/* 05 WHY WOWSTUDIO */
.main-whywowstudio {padding: 8rem 0;}
.whyWow-grid {grid-template-columns: 1fr; margin-top: 3.5rem;}
.whyWow-item {min-height: 0; padding: 2.8rem 2.4rem;}
.whyWow-content {margin-top: 3rem;}
.whyWow-content p {margin-top: 1.6rem;}
.whyWow-keyword {gap: .8rem; padding-top: 1.8rem; margin-top: 2.2rem; font-size: 1rem;}

.whyWow-bottom {
	min-height: 0;
	margin-top: 1.2rem;
	padding: 2.8rem 2.4rem;
	grid-template-columns: 1fr 4.8rem;
	gap: 1.5rem;
}
.whyWow-bottomLabel {grid-column: 1 / -1;}
.whyWow-bottomText p {font-size: 2.6rem; line-height: 1.45;}
.whyWow-bottomCircle {width: 4.8rem; height: 4.8rem;}
.whyWow-bottomCircle span {font-size: 1.8rem;}

/* 06 Á¦ÀÛ ºñ¿ë */
.main-price {padding: 8rem 0;}
.main-price .title-common p br {display: none;}
.pricingGuide-grid {grid-template-columns: 1fr; gap: 1.3rem; margin-top: 3.5rem;}
.priceCard {min-height: 0; padding: 4rem 2.4rem 2.8rem; border-radius: 1.8rem;}
.priceCard:hover {transform: none;}
.priceCard-title {margin-top: 3rem;}
.priceCard-title p {font-size: 1.65rem; line-height: 1.4;}
.priceCard-price {margin-top: 2.5rem;}
.priceCard-features {padding-bottom: 10px;}
.priceCard-features li {font-size: 1.65rem;}
.priceCard-recommend {margin-top: 2rem;}
.pricingGuide-notice {
	margin-top: 1.3rem;
	padding: 2.5rem 2.4rem;
	grid-template-columns: 1fr;
	gap: 1.5rem;
	border-radius: 1.5rem;
}

/* 07 ÀÚÁÖÇÏ´Â Áú¹® */
.main-faq {padding: 8rem 0;}
.faq-wrap {grid-template-columns: 1fr; gap: 3.5rem;}
.faq-wrap .title-common .inner {padding-left: 0; padding-right: 0;}
.faq-wrap .title-common .ico {width: 15rem; padding-left: 0; margin-left: 8rem;}
.faq-wrap .title-common .ico img {width: 100%;}
.faq-item > button {grid-template-columns: 3.5rem 1fr 2rem; gap: .8rem; padding: 1.8rem 0;}
.faq-item .q {width: 2.8rem; height: 2.8rem; font-size: 1.2rem;}
.faq-item button strong {width: 90%; line-height: 1.4; word-break: keep-all;}
.faq-item button:hover strong {color: rgba(255, 255, 255, 0.6);}
.faq-item.open button strong {color: var(--default-color);}
.faq-answer > div {padding: 0 2rem 2rem 4.3rem;}

/* 08 °í°´¼¾ÅÍ / Á¦ÀÛ¹®ÀÇ */
.main-contentarea {padding: 8rem 0;}
.main-contentarea .title-common .inner {padding: 0;}
.contentarea-wrap {display: block; margin-top: 3.5rem;}
.customer-wrap,
.counselform-wrap {width: 100%;}
.customer-box {padding-right: 0;}
.customer-box .contact-wrap h4 {font-size: 3.7rem; margin-bottom: 2rem;}
.customer-box .contact-wrap p {font-size: 1.6rem; line-height: 1.5; margin-bottom: 2rem;}
.customer-box .contact-wrap .email-info {margin-top: 3rem;}
.customer-box .contact-wrap .email-info .col i {width: 4rem; height: 4rem; margin-right: 1.5rem;}
.customer-box .contact-wrap .email-info .col span {font-size: 1.6rem;}

.customer-box .contact-wrap .check-info {
	grid-template-columns: 10rem 1fr;
	gap: 1.5rem;
	padding: 1.5rem;
	margin-top: 2.5rem;
}
.customer-box .contact-wrap .check-info .ico {width: 10rem;}
.customer-box .contact-wrap .check-info .infobox {padding: 1.5rem 0;}
.customer-box .contact-wrap .check-info strong {font-size: 1.45rem;}
.customer-box .contact-wrap .check-info ul li {font-size: 1.35rem; line-height: 1.45;}

.counselform-wrap {margin-top: 6rem;}
.form-box {border-radius: 1.8rem;}
.form-box .guidetxt {font-size: 1.45rem;}
.form-box h4.tit {font-size: 3.7rem;}
.form-box .form-wrap .form-group-input .row {width: 100%; margin-bottom: 1rem;}
.form-box .form-wrap .form-group-input .row:last-child {margin-bottom: 0;}
.form-box .form-wrap .form-group .basic-input,
.form-box .form-wrap .form-group .basic-select {height: 5.5rem; font-size: 1.55rem;}
.form-box .form-wrap .form-group .basic-textarea {height: 18rem; font-size: 1.55rem;}
.form-box .form-wrap .form-group .tit {font-size: 1.65rem;}
.form-box .form-wrap .form-group .type-check .type-row {margin: 0 2rem 1rem 0;}
.form-box .form-wrap .form-group .type-check .type-row .type-label {font-size: 1.5rem;}

.form-box .form-wrap .form-group .field input.upload-text {width: calc(100% - 12rem); height: 5.5rem; font-size: 1.45rem; padding: 0 1.2rem;}
.form-box .form-wrap .form-group .field div.upload-btn_wrap {width: 11rem; height: 5.5rem; margin-left: 1rem;}
.form-box .form-wrap .form-group .field div.upload-btn_wrap button,
.form-box .form-wrap .form-group .field div.upload-btn_wrap input.input-file {width: 11rem; height: 5.5rem; font-size: 1.4rem;}

.form-box .form-wrap .form-group-privacy {align-items: flex-start; gap: 1rem;}
.form-box .form-wrap .form-group .left {width: calc(100% - 8.5rem);}
.form-box .form-wrap .form-group .left .agree-label {font-size: 1.45rem; line-height: 1.45;}
.form-box .form-wrap .form-group button.counsel-btn {max-width: none; height: 6rem; margin-top: 2rem; font-size: 1.65rem;}

.privacy-wrap .privacy-popupbox,
.emailcoll-wrap .privacy-popupbox {width: 90%; padding: 2rem;}
.privacy-wrap .privacy-popupbox .btn-close,
.emailcoll-wrap .privacy-popupbox .btn-close {right: 2rem; top: 2rem;}

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** ¹ÝÀÀÇü¼³Á¤ Tablet 720,767 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:720px) and (max-width:767px) {

/* ¸ÞÀÎ °øÅë */
.sec-main .inner,
.title-common .inner,
.filter-wrap .inner,
.process-box .inner {
	max-width: none;
	padding-left: 3rem;
	padding-right: 3rem;
}
.title-common h2 {font-size: 6rem;}
.title-common h3 {font-size: 3.4rem;}
.title-common p {font-size: 1.55rem;}

/* »ó´Ü°íÁ¤ ÅÇ */
.fixed-gap {top: 6.5rem; overflow-x: auto; white-space: nowrap;}
.fixed-gap .tabs-container {width: max-content; min-width: 100%;}
.fixed-gap .tabs-container ul {display: flex; width: max-content; min-width: 100%;}

/* ¸ÞÀÎ ºñÁÖ¾ó */
.main-visual .visualmedia-wrap,
.main-visual .visualtitle-wrap {height: 100svh; min-height: 68rem;}
.main-visual .visualtitle-wrap {padding-top: 6.5rem;}
.main-visual .visualtitle-wrap .inner {max-width: none; padding: 0 3rem;}
.main-visual-title h2 {font-size: 5.2rem;}
.main-title-line {font-size: 4rem;}

/* 01 ¿µ»ó Á¦ÀÛ */
.main-overview {padding: 8rem 0;}
.overview-wrap {grid-template-columns: 1fr; padding: 0 3rem;}
.left-brandfilm {padding-right: 0;}
.left-brandfilm .title-common .inner {padding: 0;}
.wowService-grid {grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: 4rem;}
.wowService-content {padding: 1.8rem;}
.wowService-desc {display: none;}
.brandFilmMotion {height: 60rem; margin-top: 4rem; gap: 1.2rem;}

/* 02 Á¦ÀÛ ¹æ½Ä */
.main-method {padding: 8rem 0;}
.productionMethod-grid {grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.4rem; margin-top: 4rem;}
.methodCard {min-height: 0; padding: 2.6rem;}
.methodCard-visual {height: 25rem;}
.methodCard-desc {min-height: 0;}

/* 03 »ùÇÃ */
.main-samplevideo {padding-top: 8rem;}
.portfolio-container {grid-template-columns: repeat(3, 1fr); gap: 1rem; padding: 0;}
.filter-menu {flex-wrap: wrap; margin-bottom: 3rem;}

/* 04 ÇÁ·Î¼¼½º */
.main-process {padding: 8rem 0;}
.process-list:before {left: 4rem;}
.process-row {grid-template-columns: 8rem 1fr; gap: 2rem;}
.process-row .step {width: 8rem; height: 8rem;}
.process-row .deliver {grid-column: 2;}

/* 05 WHY */
.main-whywowstudio {padding: 8rem 0;}
.whyWow-item {min-height: 300px; padding: 3rem;}
.whyWow-content h3 {font-size: 2.6rem;}
.whyWow-bottom {grid-template-columns: 130px 1fr 60px; gap: 2.5rem; padding: 3rem;}

/* 06 °¡°Ý */
.main-price {padding: 8rem 0;}
.pricingGuide-grid {grid-template-columns: 1fr; gap: 1.5rem; margin-top: 4rem;}
.priceCard {min-height: 0;}
.pricingGuide-notice {grid-template-columns: 180px 1fr; gap: 3rem; padding: 3rem;}

/* 07 FAQ */
.main-faq {padding: 8rem 0;}
.faq-wrap {grid-template-columns: 1fr; gap: 4rem;}
.faq-wrap .title-common .inner {padding: 0;}
.faq-wrap .title-common .ico {width: 18rem; padding-left: 0; margin-top: 1rem;}
.faq-wrap .title-common .ico img {width: 100%;}

/* 08 ¹®ÀÇ */
.main-contentarea {padding: 8rem 0;}
.contentarea-wrap {display: block; margin-top: 4rem;}
.customer-wrap,
.counselform-wrap {width: 100%;}
.customer-box {padding-right: 0;}
.counselform-wrap {margin-top: 7rem;}
.form-box .form-wrap .form-group-input .row {width: 49%;}
.form-box .form-wrap .form-group button.counsel-btn {max-width: 24rem;}

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** ¹ÝÀÀÇü¼³Á¤ Tablet 768,1023 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (min-width:768px) and (max-width:1023px) {

/* ¸ÞÀÎ °øÅë */
.sec-main .inner,
.title-common .inner,
.filter-wrap .inner,
.process-box .inner {
	max-width: none;
	padding-left: 3rem;
	padding-right: 3rem;
}
.title-common h2 {font-size: 6.4rem;}
.title-common h3 {font-size: 3.6rem;}

/* »ó´Ü°íÁ¤ ÅÇ */
.fixed-gap {top: 7rem;}

/* ¸ÞÀÎ ºñÁÖ¾ó */
.main-visual .visualmedia-wrap,
.main-visual .visualtitle-wrap {height: 100svh; min-height: 70rem;}
.main-visual .visualtitle-wrap {padding-top: 7rem;}
.main-visual .visualtitle-wrap .inner {max-width: none; padding: 0 3rem;}
.main-visual-title h2 {font-size: 5.5rem;}
.main-title-line {font-size: 4.2rem;}

/* 01 ¿µ»ó Á¦ÀÛ */
.main-overview {padding: 9rem 0;}
.overview-wrap {grid-template-columns: 1fr; padding: 0 3rem;}
.left-brandfilm {padding-right: 0;}
.left-brandfilm .title-common .inner {padding: 0;}
.wowService-grid {grid-template-columns: repeat(3, minmax(0, 1fr));}
.brandFilmMotion {height: 68rem; margin-top: 5rem;}

/* 02 Á¦ÀÛ ¹æ½Ä */
.main-method {padding: 9rem 0;}
.productionMethod-grid {grid-template-columns: repeat(2, minmax(0, 1fr));}
.methodCard {min-height: 0;}
.methodCard-visual {height: 28rem;}
.methodCard-desc {min-height: 0;}

/* 03 »ùÇÃ */
.main-samplevideo {padding-top: 9rem;}
.portfolio-container {grid-template-columns: repeat(3, 1fr); padding: 0;}
.filter-menu {flex-wrap: wrap;}

/* 04 ÇÁ·Î¼¼½º */
.main-process {padding: 9rem 0;}
.process-list:before {left: 4.5rem;}
.process-row {grid-template-columns: 9rem 1fr; gap: 2rem;}
.process-row .step {width: 9rem; height: 9rem;}
.process-row .deliver {grid-column: 2;}

/* 05 WHY */
.main-whywowstudio {padding: 9rem 0;}
.whyWow-item {min-height: 320px; padding: 3.2rem;}
.whyWow-bottom {grid-template-columns: 140px 1fr 64px; gap: 3rem; padding: 3.5rem;}

/* 06 °¡°Ý */
.main-price {padding: 9rem 0;}
.pricingGuide-grid {grid-template-columns: repeat(2, minmax(0, 1fr));}
.priceCard {min-height: 0;}
.pricingGuide-notice {grid-template-columns: 200px 1fr; gap: 3rem;}

/* 07 FAQ */
.main-faq {padding: 9rem 0;}
.faq-wrap {grid-template-columns: 1fr; gap: 4rem;}
.faq-wrap .title-common .inner {padding: 0;}
.faq-wrap .title-common .ico {width: 18rem; padding-left: 0; margin-top: 1rem;}
.faq-wrap .title-common .ico img {width: 100%;}

/* 08 ¹®ÀÇ */
.main-contentarea {padding: 9rem 0;}
.contentarea-wrap {display: block; margin-top: 4rem;}
.customer-wrap,
.counselform-wrap {width: 100%;}
.customer-box {padding-right: 0;}
.counselform-wrap {margin-top: 7rem;}

}


/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* *** ¹ÝÀÀÇü¼³Á¤ Tablet 1023 *** */
/* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (max-width:1023px) {

/* ¸ð¹ÙÀÏ ½ºÅ©·Ñ °¡´É¿©ºÎ */
.wowVideoRail {pointer-events: none; touch-action: pan-y !important;}

}