/* --------------------------------------------------- °øÅë --------------------------------------------------- */
* {box-sizing:border-box;}
body {color:#000;}
html.no-scroll,body.no-scroll{overflow:hidden;}
a {display:inline-block;}
section {padding:200px 0 0;}
section:last-of-type {padding:200px 0;}
.inner {width:1600px; margin:0 auto;}
.sub-container {padding-top:57px;}
.t-red {color:#CB2527;}
.m-title {text-align:center; margin-bottom:70px;}
.m-title h3 {font-size:80px; font-weight:700;}
.m-title p {font-size:25px;}
.img-swap {position:relative;}
.img-swap img {display:block; transition:0.3s all ease;}
.img-swap .img-b {position:absolute; top:0; left:0; opacity:0; pointer-events:none;}
.swiper {width:100%; height:100%;}
.swiper-slide {display:flex; justify-content:center; align-items:center;}
.swiper-slide img {display:block; width:100%;}
.more-btn {margin-top:70px; display:flex; justify-content:center;}
.more-btn a {width:300px; padding:30px; border-radius:50px; border:1px solid #000; color:#000; font-size:20px; font-weight:500; background:url('/img2/icon-right03.png') no-repeat; background-position:right 40px top 50%; transition:background-position 0.2s ease-in-out, box-shadow 0.2s ease-in-out;}
.more-btn a:hover {background-position:right 30px top 50%; box-shadow:0 5px 10px 0 rgba(0, 0, 0, 0.2);}

/* --------------------------------------------------- Çì´õ --------------------------------------------------- */
header a:link, header a:visited {color:#fff;}
header nav div > ul {display:flex;}
header {position:fixed; width:100%; z-index:99; background-color:transparent; box-shadow:none; transition:0.3s all ease;}
header nav {display:flex; justify-content:space-between; align-items:center;}
header nav div.logo {width:20%;}
header nav div.logo a img {height:40px;}
header nav div.menu {width:50%;}
header nav div.menu > ul {display:flex; width:100%;}
header nav div.menu > ul > li {flex:1; position:relative;}
header nav div.menu > ul > li > a {font-size:20px; font-weight:600; width:100%; text-align:center; padding:35px 0; transition:0.3s all;}
header nav div.menu > ul > li > a:hover {color:#CB2527;}
header nav div.menu > ul > li.on a {color:#CB2527;}
header nav div.menu > ul > li > .depth2 {position:absolute; top:100%; left:50%; transform:translateX(-50%); width:85%; background-color:#fff; box-shadow:0 0 8px 1px rgba(0, 0, 0, 0.25); padding:10px 0; display:none;}
header nav div.menu > ul > li > .depth2 li {display:flex; justify-content:center;}
header nav div.menu > ul > li > .depth2 li a {width:100%; padding:8px 0; text-align:center;}
header nav div.menu > ul > li > .depth2 li a span{position:relative; color:#555; transition:0.2s all;}
header nav div.menu > ul > li > .depth2 li a span::before {display:inline-block; content:''; position:absolute; top:100%; left:0; width:0; height:1px; background-color:#000; transition:0.2s all;}
header nav div.menu > ul > li > .depth2 li a:hover span{color:#000;}
header nav div.menu > ul > li > .depth2 li a:hover span::before {width:100%;}
header nav div.btn {width:20%; cursor:auto;}
header nav div.btn:focus {outline:0;}
header nav div.btn:active {box-shadow:none;}
header nav div.btn ul {justify-content:flex-end; gap:30px; align-items:center;}
header nav div.btn ul li:nth-child(1) a {width:160px; padding:15px 0; border-radius:20px; background:linear-gradient(90deg, #D81E25 0%, #993682 33%, #614989 66%, #354D77 100%); font-size:20px; font-weight:500; display:flex; align-items:center; justify-content:center; gap:10px; transition:0.2s all;}
header nav div.btn ul li:nth-child(1) a:hover {box-shadow:0 0 8px 1px rgba(255, 255, 255, 0.50);} 
header nav div.btn ul li.all-btn {cursor:pointer;}


header.on {background:rgba(255, 255, 255, 0.50); backdrop-filter: blur(7.5px);}
header:not(.on) .img-swap .img-w {opacity:1;}
header:not(.on) .img-swap .img-b {opacity:0;}
header.on .img-swap .img-w {opacity:0;}
header.on .img-swap .img-b {opacity:1;}
header.on nav div.menu > ul > li > a {color:#000;}
header.on nav div.menu > ul > li > a:hover {color:#CB2527;}
header.on nav div.menu > ul > li.on a {color:#CB2527;}

/* .all-menu {display:flex; align-items:center; width:100%; height:100vh; position:absolute; z-index:100; background-color:rgba(0,0,0,0.9); top:0; left:0; backdrop-filter: blur(20px); transform:translateX(100%); opacity:0; visibility:hidden; transition:transform 0.5s ease, opacity 0.4s ease;}
.all-menu.on {transform: translateX(0); opacity:1; visibility:visible;} */
.all-menu {display:flex; align-items:center; width:100%; height:100vh; position:fixed; z-index:100; background-color:rgba(0,0,0,0.9); top:0; left:0; backdrop-filter:blur(20px); transform:translateX(100%); opacity:0; visibility:hidden; transition:transform 0.5s ease, opacity 0s ease;}
.all-menu.on {transform:translateX(0); opacity:1; visibility:visible;}
.all-menu > div:first-child {position:absolute; top:32.5px; left:50%; transform:translateX(-50%);}
.all-menu > div:first-child .close-btn {position:absolute; right:5px; width:35px; heighT:35px; cursor:pointer; transition:0.2s all; opacity:0.8;}
.all-menu > div:first-child .close-btn:hover {transform:rotate(90deg); opacity:1;}
.all-menu > div:first-child .close-btn::before {content:""; display:block; position:absolute; left:17.5px; width:3px; height:35px; background-color:#fff; transform:rotate(45deg);}
.all-menu > div:first-child .close-btn::after {content:""; display:block; position:absolute; left:17.5px; width:3px; height:35px; background-color:#fff; transform:rotate(-45deg) ;}
.all-menu > div:last-child {display:flex; align-items:center;}
.all-menu > div > ul {width:100%;}
.all-menu > div > ul > li {display:flex; justify-content:space-between; align-items:center; margin-bottom:3%;}
.all-menu > div > ul > li:last-child {margin-bottom:0;}
.all-menu > div > ul > li > div {width:20%;}
.all-menu > div > ul > li > div a {font-size:45px; font-weight:500; transition:0.2s all;}
.all-menu > div > ul > li > div a:hover {color:#CB2527;}
.all-menu > div > ul > li > ul {width:70%; display:flex; gap:4%; align-items:center;}
.all-menu > div > ul > li > ul a {font-size:25px; transition:0.2s all; color:#bbb;}
.all-menu > div > ul > li > ul a:hover {color:#fff;}
.all-menu > div > ul > li:last-child {padding-top:5%; border-top:1px solid #555;}
.all-menu > div > ul > li:last-child img {width:200px;}
.all-menu > div > ul > li:last-child ul {position:relative; width:100%; height:fit-content;}
.all-menu > div > ul > li:last-child ul li {color:#bbb; position:absolute; top:50%; transform:translateY(-50%);}
.all-menu > div > ul > li:last-child ul li:nth-child(1) {left:0;}
.all-menu > div > ul > li:last-child ul li:nth-child(2) {left:50%; transform:translate(-50%,-50%);}
.all-menu > div > ul > li:last-child ul li:nth-child(3) {right:0;}
.all-menu > div > ul > li:last-child ul li a {padding:20px 0; width:250px; text-align:center; border-radius:50px; background:linear-gradient(90deg, #D81E25 0%, #993682 33%, #614989 66%, #354D77 100%); font-size:25px; font-weight:600; color:#fff;}
.all-menu > div > ul > li:last-child ul li a:hover {box-shadow:0 0 8px 1px rgba(255, 255, 255, 0.50);}

/* --------------------------------------------------- ¸ÞÀÎ - ºñÁê¾ó --------------------------------------------------- */
#sec1 {padding:0;}
#sec1 .main-banner {height:100vh; /* background:url('/img2/main-visual-bg.jpg') no-repeat left 50% top 0/cover; display:flex; align-items:center; justify-content:center; */ position:relative;}
#sec1 .main-banner .video-bg {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%;}
#sec1 .main-banner .video-bg video {width:100%; height:100%; object-fit:cover;}
#sec1 .main-banner .inner {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
#sec1 .main-banner .inner div {color:#fff;}
#sec1 .main-banner .inner div h2 {font-size:100px; text-align:center; font-weight:600; line-height:1.2; text-shadow:0 4px 8px rgba(0, 0, 0, 0.25);}
#sec1 .main-banner .inner div p {font-size:25px; text-align:center; margin-top:30px;}
#sec1 .main-banner .inner div ul {display:flex; justify-content:center; gap:5%; margin-top:100px;}
#sec1 .main-banner .inner div ul li a {padding:20px 30px; width:250px; display:flex; align-items:center; justify-content:space-between; border:1px solid #fff; border-radius:50px; font-size:20px; color:#fff;}
#sec1 .main-banner .inner div ul li a:hover {color:#fff; background-color:rgba(255,255,255,0.2);}
#sec1 .main-banner .inner div ul li a div.right-btn {background-color:rgba(255,255,255,0.2); border-radius:50%; width:35px; height:35px; background-image:url('/img2/icon-right01.png'); background-repeat:no-repeat; background-position:center;}

/* --------------------------------------------------- ¸ÞÀÎ - ÄÁÅÙÃ÷ --------------------------------------------------- */
#sec2 .service-box > ul {display:flex; justify-content:space-between;} 
#sec2 .service-box > ul > li {width:calc((67.5% - 120px)/6); height:570px; border-radius:20px; display:flex; align-items:center; justify-content:center; padding:100px 55px; transition:width .2s ease; min-width:0; position:relative; overflow:hidden;} 
#sec2 .service-box > ul > li:nth-child(1) {background:linear-gradient(rgba(0,0,0,.7), rgba(0,0,0,.7)), url('/img2/content-01.jpg') no-repeat center/cover;} 
#sec2 .service-box > ul > li:nth-child(2) {background:linear-gradient(rgba(0,0,0,.7), rgba(0,0,0,.7)), url('/img2/content-02.jpg') no-repeat center/cover;} 
#sec2 .service-box > ul > li:nth-child(3) {background:linear-gradient(rgba(0,0,0,.7), rgba(0,0,0,.7)), url('/img2/content-03.jpg') no-repeat center/cover;} 
#sec2 .service-box > ul > li:nth-child(4) {background:linear-gradient(rgba(0,0,0,.7), rgba(0,0,0,.7)), url('/img2/content-04.jpg') no-repeat center/cover;} 
#sec2 .service-box > ul > li:nth-child(5) {background:linear-gradient(rgba(0,0,0,.7), rgba(0,0,0,.7)), url('/img2/content-05.jpg') no-repeat center/cover;} 
#sec2 .service-box > ul > li:nth-child(6) {background:linear-gradient(rgba(0,0,0,.7), rgba(0,0,0,.7)), url('/img2/content-06.jpg') no-repeat center/cover;} 
#sec2 .service-box > ul > li:nth-child(7) {background:linear-gradient(rgba(0,0,0,.7), rgba(0,0,0,.7)), url('/img2/content-07.jpg') no-repeat center/cover;} 
#sec2 .service-box > ul > li > h4 {text-align:center; color:#fff;} 
#sec2 .service-box > ul > li .service-txt {height:100%; position:absolute; inset:0; opacity:0; padding:100px 55px; transform:translateY(14px); pointer-events:none; visibility:hidden;} 
#sec2 .service-box > ul > li .service-txt.is-ready {display:block; opacity:0; transform:translateY(12px);}
#sec2 .service-box > ul > li .service-txt.is-show {opacity:1; transform:translateY(0); transition: opacity .25s ease, transform .25s ease;}
#sec2 .service-box > ul > li .service-txt ul {display:flex; flex-direction:column; justify-content:space-between; height:100%;} 
#sec2 .service-box > ul > li .service-txt ul li h4 {margin-bottom:20px; font-size:40px; font-weight:600;} 
#sec2 .service-box > ul > li .service-txt ul li p {font-size:20px;} 
#sec2 .service-box > ul > li .service-txt ul li div {display:flex; justify-content:flex-end;} 
#sec2 .service-box > ul > li .service-txt ul li div a {width:180px; padding:15px 20px; border-radius:50px; box-shadow:0 0 0 1px inset #fff; transition:0.2s box-shadow ease-in-out; position:relative; overflow:hidden; z-index:1;} 
#sec2 .service-box > ul > li .service-txt ul li div a span {position:relative; z-index:1; color:#fff; font-size:20px;} 
#sec2 .service-box > ul > li .service-txt ul li div a::before {position:absolute; content:''; inset:0; background:linear-gradient(90deg, #D81E25 0%, #993682 33%, #614989 66%, #354D77 100%); opacity:0; transition:0.2s opacity ease-in-out; z-index:0;} 
#sec2 .service-box > ul > li .service-txt ul li div a::after {content:url('/img2/icon-right02.png'); display:inline-block; position:absolute; right:25px; top:50%; transform:translateY(-50%); height:30px; transition:0.2s right ease-in-out;} 
#sec2 .service-box > ul > li .service-txt ul li div a:hover {box-shadow:0 0 0 1px inset transparent;} 
#sec2 .service-box > ul > li .service-txt ul li div a:hover::before {opacity:1;} 
#sec2 .service-box > ul > li .service-txt ul li div a:hover::after {right:20px;} 
#sec2 .service-box > ul > li.on {width:32.5%;} 
#sec2 .service-box > ul > li.on > h4 {display:none;} 
#sec2 .service-box > ul > li.on .service-txt {display:block; visibility:visible; pointer-events:auto; animation: sec2TxtIn .25s ease .2s both;} 
#sec2 .service-box > ul > li .service-txt ul li {color:#fff;} 
#sec2 .service-box > ul > li .service-txt ul li h4 {color:#fff;}
@keyframes sec2TxtIn{
  from { opacity:0; transform:translateY(14px); }
  to   { opacity:1; transform:translateY(0); }
}

#sec3 .works-box ul {display:flex; flex-wrap:wrap;}
#sec3 .works-box ul li {width:50%; height:70vh; position:relative; overflow:hidden;}
#sec3 .works-box ul li::before {content:''; position:absolute; inset:0; transform:scale(1); transition:transform 0.4s ease-in-out; z-index:0;}
#sec3 .works-box ul li::after {content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(255, 255, 255, 0) 30%, rgba(0, 0, 0, 1) 100%); z-index:1; transition:opacity 0.4s ease-in-out;}
#sec3 .works-box ul li:hover::before {transform:scale(1.1); opacity:1;}
#sec3 .works-box ul li:hover::after {opacity:0;}
#sec3 .works-box ul li:nth-child(1)::before {background:url('/img2/works03.jpg') no-repeat center/cover;}
#sec3 .works-box ul li:nth-child(2)::before {background:url('/img2/works04.jpg') no-repeat center/cover;}
#sec3 .works-box ul li:nth-child(3)::before {background:url('/img2/works05.jpg') no-repeat center/cover;}
#sec3 .works-box ul li:nth-child(4)::before {background:url('/img2/works06.jpg') no-repeat center/cover;}
#sec3 .works-box ul li a {padding:100px; display:flex; align-items:flex-end; height:100%; position:relative; z-index:2;}
#sec3 .works-box ul li a::before {content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(255, 255, 255, 0) 30%, rgba(0, 0, 0, 0.5) 100%); transform:translateY(40%); opacity:0; transition:transform 0.4s ease-in-out, opacity 0.4s ease-in-out; z-index:0; pointer-event:none;}
#sec3 .works-box ul li:hover a::before {transform:translateY(0); opacity:1;}
#sec3 .works-box ul li a .works-txt {color:#fff; position:relative; z-index:2; transform:translateY(0); transition:transform 0.4s ease-in-out;}
#sec3 .works-box ul li:hover a .works-txt {transform:translateY(-20%);}
#sec3 .works-box ul li a .works-txt h4 {color:#fff; font-size:25px;}
#sec3 .works-box ul li a .works-txt p {font-size:18px;}

#sec4 .ai-box ul {display:flex; justify-content:space-between;}
#sec4 .ai-box ul li {width:calc(92%/4); box-shadow:0 0 20px 1px rgba(76, 58, 58, 0.15); border-radius:20px; padding:30px 20px; text-align:center;}
#sec4 .ai-box ul li div:first-child {margin-bottom:25px;}
#sec4 .ai-box ul li div img {height:150px;}
#sec4 .ai-box ul li div h4 {font-size:25px; font-weight:600;}
#sec4 .ai-box ul li div p {font-size:18px;}

#sec5 .inner {display:flex; justify-content:space-between;}
#sec5 .m-title {text-align:left;}
#sec5 .m-title h3 {line-height:1.2; margin-bottom:10px;}
#sec5 .client-box {width:60%; background-color:#f4f4f4; border-radius:20px; padding:50px;}
#sec5 .client-box .swiper {padding-bottom:50px;}
#sec5 .client-box ul {display:flex; flex-wrap:wrap; gap:5%; align-items:center;}
#sec5 .client-box ul li {width:calc(85%/4); margin-top:5%;}
#sec5 .client-box ul li:nth-child(-n+4) {margin-top:0;}

.flow-box {white-space:nowrap; overflow:hidden; position:relative; top:16px; left:0;}
.flow-box p {display:inline-block; animation:flow-txt 100s linear infinite; font-size:250px; font-weight:700; line-height:1;}
@keyframes flow-txt {
	0% { transform:translateX(-50%); }
	100% { transform:translateX(0%); }
}

/* --------------------------------------------------- ǪÅÍ --------------------------------------------------- */
footer {padding:120px 0 80px; background-color:#000;}
footer .f-contact {border-bottom:1px solid #666;}
footer .f-contact h3 {color:#fff; font-size:80px; text-align:center;} 
footer .f-contact .f-contact-btn {display:flex; justify-content:center; margin:70px;}
footer .f-contact .f-contact-btn a {text-transform:uppercase; padding:30px 0; width:400px; text-align:center; color:#fff; font-size:35px; border-radius:100px; position:relative; overflow:hidden; z-index:1; box-shadow:0 0 30px 5px rgba(255, 255, 255, 0.25); transition:box-shadow 0.2s ease-in-out, transform 0.2s ease-in-out;}
footer .f-contact .f-contact-btn a:hover {box-shadow:0 0 40px 5px rgba(255, 255, 255, 0.45); transform:scale(1.1);}
footer .f-contact .f-contact-btn a span {position:relative; z-index:2;}
footer .f-contact .f-contact-btn a:before {position:absolute; content:''; inset:0; z-index:1; background:linear-gradient(90deg, #D81E25 0%, #993682 25%, #614989 50%, #993682 75%, #D81E25 100%); background-size:200% 100%; transition:background-position 0.2s ease-in-out;}
footer .f-contact .f-contact-btn a:hover::before {background-position: 100% 0;} 
footer .f-info {margin-top:30px;}
footer .f-info .f-page {display:flex; align-items:center; gap:30px; margin-bottom:50px;}
footer .f-info .f-page p a {color:#aaa;}
footer .f-info .f-page p:nth-child(1) a {color:#CB2527; font-weight:500;}
footer .f-info > ul {display:flex; justify-content:space-between; align-items:center;}
footer .f-info > ul > li h1 img {width:200px;}
footer .f-info > ul > li div.f-info-txt {margin-top:30px;}
footer .f-info > ul > li div.f-info-txt p {color:#aaa; font-size:15px;}
footer .f-info > ul > li div.f-info-txt p:first-child {margin-bottom:10px;}
footer .f-info > ul > li div.f-info-txt p span {position:relative; padding:0 15px;}
footer .f-info > ul > li div.f-info-txt p span::before {content:''; display:inline-block; position:absolute; top:20%; left:0; width:1px; height:15px; background-color:#aaa;}
footer .f-info > ul > li div.f-info-txt p span:first-child {padding-left:0;}
footer .f-info > ul > li div.f-info-txt p span:first-child::before {display:none;}
footer .f-info > ul > li div.f-sns {margin-top:30px;}
footer .f-info > ul > li div.f-sns a {margin-right:15px;}
footer .f-info > ul > li.f-name-server {padding:25px; background-color:rgba(255,255,255,0.1); border-radius:20px; color:#aaa; text-align:center;}
footer .f-info > ul > li.f-name-server > p {font-size:18px; font-weight:600;}
footer .f-info > ul > li.f-name-server ul li {display:flex; align-items:center; margin-top:15px;}
footer .f-info > ul > li.f-name-server ul li p:nth-child(1) {color:#fff; padding:5px 16px; border-radius:50px; background-color:#354D77; margin-right:15px; font-size:14px; font-weight:600;}
footer .f-info > ul > li.f-name-server ul li p:nth-child(2) {font-size:15px;}
footer .f-copy {color:#aaa; display:flex; align-items:center; justify-content:space-between; font-size:13px; margin-top:50px;}
footer .f-copy div:last-child a {display:flex; align-items:center; color:#aaa;}
footer .f-copy div p {margin-left:20px; text-align:center; line-height:1.2;}
footer .f-copy div p span {font-size:18px; font-weight:500;}

/* --------------------------------------------------- »çÀ̵å Äü ¹öÆ° --------------------------------------------------- */
.quick-box {position:fixed; right:0; top:0; height:100%; z-index:98;}
.quick-box .q-contact {position:absolute; top:50%; right:0; transform:translateY(-50%); --q-panel-w:260px;}
.quick-box .q-contact ul {display:flex; position:relative; transform:translateX(0); transition:transform .35s ease; will-change: transform;}
.quick-box .q-contact ul.on{transform:translateX(calc(-1 * var(--q-panel-w)));}
.quick-box .q-contact ul li.q-contact-btn {position:relative; z-index:2; padding:20px; height:fit-content; background:linear-gradient(180deg, #D81E25 0%, #993682 100%); color:#fff; font-size:20px; font-weight:600; cursor:pointer; border-top-left-radius:10px; border-bottom-left-radius:10px;}
.quick-box .q-contact ul li.q-contact-btn.on img {transform:rotate(0deg);}
.quick-box .q-contact ul li.q-contact-btn img {display:block; margin:15px auto 0; transform:rotate(180deg);}
.quick-box .q-contact ul li.q-contact-cont {position:absolute; left:100%; width:var(--q-panel-w); visibility:hidden; pointer-events:none; transition:visibility 0s linear .35s;padding:20px; background-color:#fff; box-shadow:0 0 5px 0 rgba(0, 0, 0, 0.25); position: absolute;}
.quick-box .q-contact ul.on li.q-contact-cont{visibility:visible; pointer-events:auto; transition:opacity .2s ease,visibility 0s;}
.quick-box .q-contact ul li.q-contact-cont > div h5 {font-size:20px; text-align:center;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form {margin-top:15px;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div {margin-top:10px;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div:nth-child(1) {margin-top:0;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div:nth-child(3) {margin-top:0;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div label {margin-bottom:5px; cursor:default; font-weight:500; color:#555;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div label[for="q-check"] {font-size:14px; font-weight:400;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div input::placeholder, .quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div textarea::placeholder {color:#aaa; font-size:13px}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div input[type="text"], .quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div textarea {width:220px; border-radius:5px; border:1px solid #ccc; color:#000; font-size:15px; margin:0; text-indent:0;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div input[type="text"] {height:35px; padding:8px;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div input[type="text"]:focus-visible, .quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div textarea:focus-visible {outline:1px; outline-color:#ffdedf;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div textarea {padding:8px 8px 18px; height:100px; overflow-Y:auto;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div .area-box {width:100%; display:flex; justify-content:space-between; align-items:center;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div .area-box .count {color:#555; font-size:13px;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div button {position:relative; border:none; overflow:hidden; width:80%; display:block; margin:0 auto; text-align:center; font-size:16px; border-radius:50px; padding:15px 0; background:linear-gradient(315deg, #ff989c 0%, #CB2527 70%); color:#fff;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div button::after {content:''; position:absolute; z-index:1; bottom:0; left:0; width:100%; height:0; background:linear-gradient(90deg, #ffcccd 0%, #e75859 100%); transition:transform 0.3s ease-in-out; box-shadow: -7px -7px 20px 0px #fff9, -4px -4px 5px 0px #fff9, 7px 7px 20px 0px #0002, 4px 4px 5px 0px #0001; transition: all 0.3s ease;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div button:hover::after {top:0; height:100%;}
.quick-box .q-contact ul li.q-contact-cont > div .q-contact-form > div button span {position:relative; z-index:2;}
.quick-box .q-top {position:absolute; bottom:50px; right:0; cursor:pointer; width:60px; height:60px; display:flex; align-items:center; justify-content:center; background-color:#ddd;}

/* --------------------------------------------------- ¼­ºê - ºñÁê¾ó, ¸Þ´º --------------------------------------------------- */
.sub-visual-wrap {width:100%; height:50vh; display:flex; align-items:center; justify-content:center; position:relative;}
.sub-visual-wrap.one {background:linear-gradient(180deg,rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 0%), url('/img2/sub-bg01.jpg') no-repeat center/cover;}
.sub-visual-wrap h2 {font-size:80px; color:#fff;}
.sub-visual-wrap .sub-menu {position:absolute; top:100%; left:0; width:100%;}
.sub-visual-wrap .sub-menu ul {width:100%; display:flex; border-bottom:1px solid #ccc;}
.sub-visual-wrap .sub-menu ul li {width:calc(100%/7); border-right:1px solid #ccc;}
.sub-visual-wrap .sub-menu ul li:last-child {border-right:0;}
.sub-visual-wrap .sub-menu ul li a {padding:15px 0; color:#000; text-align:center; width:100%; font-size:18px; font-weight:500; transition:background-color 0.2s ease-in-out;}
.sub-visual-wrap .sub-menu ul li:hover a {background-color:#e5e5e5;}
.sub-visual-wrap .sub-menu ul li.on a {background-color:#000; color:#fff;}

/* --------------------------------------------------- ¼­ºê - ai ¼­ºñ½º --------------------------------------------------- */
.bg-gray {background-color:#f9f9f9;}
.triangle {position:relative;}
.triangle::before {content:''; background:url('/img2/icon-triangle.png') no-repeat center/100%; display:inline-block; position:absolute; top:45px; left:-21px; width:21px; height:15px;}
.ai-wrap {background:linear-gradient(rgba(255, 255, 255, 0.5),rgba(255, 255, 255, 0.5)), url('/img2/ai-cont-bg.png') no-repeat left 50% top -100px/100%;}
.ai-wrap .ai-sec .inner {display:flex; align-items:center; gap:100px; justify-content:space-between;} 
.ai-wrap .ai-sec .title-box h4 {font-size:40px; font-weight:600; margin-bottom:20px;}
.ai-wrap .ai-sec .title-box p {font-size:20px; margin-bottom:50px;}
.ai-wrap .ai-sec .title-box ul {display:flex; flex-wrap:wrap; gap:20px;}
.ai-wrap .ai-sec .title-box ul li {padding:15px 25px; color:#354D77; border:1px solid #354D77; border-radius:50px; font-size:20px; background-color:#fff;}
.ai-wrap .ai-sec .image-box {min-width:900px; padding:45px 55px; border-radius:20px; height:480px; display:flex; flex-direction:column; justify-content:space-between;}
.ai-wrap .ai-sec {padding:100px 0;}
.ai-wrap .ai-sec1 {padding:200px 0;}
.ai-wrap .ai-sec1 h3 {font-size:60px; text-align:center; margin-bottom:30px;}
.ai-wrap .ai-sec1 p {font-size:25px; text-align:center;}
.ai-wrap .ai-sec2 .image-box {background-color:#FFEDED;}
.ai-wrap .ai-sec2 .image-box .chat-top {display:flex; justify-content:space-between;}
.ai-wrap .ai-sec2 .image-box .chat-top .chat-txt {background-color:#fff; padding:35px; width:620px; border-radius:20px;}
.ai-wrap .ai-sec2 .image-box .chat-top .chat-txt p {font-size:25px;}
.ai-wrap .ai-sec2 .image-box .chat-top .chat-txt p span {font-weight:600; color:#B26E72;}
.ai-wrap .ai-sec2 .image-box .chat-top .chat-txt ul {display:flex; flex-wrap:wrap; gap:15px; margin-top:30px;}
.ai-wrap .ai-sec2 .image-box .chat-top .chat-txt ul li {color:#777; border:1px solid #777; border-radius:50px; padding:8px 25px;}
.ai-wrap .ai-sec2 .image-box .chat-bot ul {display:flex; justify-content:space-between; background-color:#fff; border-radius:50px; padding:7px 7px 7px 25px; align-items:center;}
.ai-wrap .ai-sec2 .image-box .chat-bot ul li {display:flex; align-items:center;}
.ai-wrap .ai-sec2 .image-box .chat-bot ul li div {display:flex; algin-items:center; margin-right:25px;}
.ai-wrap .ai-sec2 .image-box .chat-bot ul li p {color:#777;}
.ai-wrap .ai-sec2 .image-box .chat-bot ul li:last-child {width:50px; height:50px; background-color:#FFC74E; border-radius:50%; justify-content:center;}
.ai-wrap .ai-sec3 .image-box {background-color:#FFEBFA;}