@charset "utf-8"; 
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100; 0,200; 0,300; 0,400; 0,500; 0,600; 0,700; 0,800; 0,900; 1,100; 1,200; 1,300; 1,400; 1,500; 1,600; 1,700; 1,800; 1,900&display=swap'); 
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css"); 
@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css'); 
@import url('https://fonts.googleapis.com/css2?family=Ubuntu+Sans:ital,wght@0,100..800; 1,100..800&display=swap'); 

* { box-sizing: border-box; padding: 0; margin: 0; font-family: "Poppins", "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif !important; 
/*font-family:'Pretendard Variable' !important; */ } 
.fa { font: normal normal normal 14px / 1 FontAwesome !important; } 
a { text-decoration: none; } 
ul { list-style: none; } 
button { background-color: transparent; cursor: pointer; border: none; outline: none; } 
img { border:0; display:block; } 
h1, h2, h3, h4, h5, h6 { padding:0; margin:0 } 
p { padding:0; margin:0; } 
input { border: none; box-shadow: none; } 
input:focus { outline: none; } 
#theme-controller .fixed-top { z-index: 999999; } 
.modal { z-index: 999999; } 
.nt-container { max-width: unset !important; width: 100%; } 
/* head 시작 */
#nt_header { background: unset; position: fixed; top: 0; left: 0; width: 100%; height: fit-content; z-index: 999998; background-color: transparent!important; } 
#nt_menu { box-shadow: none !important; } 
#nt_menu .nt-container { padding:20px 40px; } 
#nt_menu .me-li.on .me-a, #nt_menu .me-li:hover .me-a { background: unset !important; } 
#nt_menu .nt-container>div { align-items: center; justify-content: space-between; } 
#nt_menu .nt-container>div .me-list { display: none; position: absolute; width: 100%; max-width: unset; height: 100vh; top: 0; left: 0; background: #0b0b12 !important; padding-top: 100px; } 
#nt_menu .nt-container>div .me-list ul { justify-content: space-between; } 
#nt_menu .nt-container>div .me-list ul li { width: 100%; flex-grow: unset; flex-basis:unset; display: flex; justify-content: center; align-items: center; flex-flow: row wrap; } 
#nt_menu .nt-container>div .me-list ul li>b { height: 15vh; line-height: 15vh; font-size: 100px; font-weight: bold; padding: 0 !important; opacity: 0.5; transition: 0.3s; color: #fff; display: block; text-align: center; cursor: pointer; width: fit-content; margin: 0; } 
#nt_menu .nt-container>div .me-list ul li .toggle_btn { display: block; color: #fff; height: 15vh; line-height: 15vh; width: 100px; text-align: center; font-size: 40px; opacity: 0.5; cursor: pointer; } 
/* #nt_menu .nt-container>div .me-list ul li .sub_menu { display: none; height: calc(15vh * 4.7); width: 100%; } */
#nt_menu .nt-container>div .me-list ul li .sub_menu { display: none; width: 100%; margin-bottom:5vh } 
#nt_menu .nt-container>div .me-list ul li .sub_menu p { font-size: 70px; line-height: unset; font-weight: 600; opacity: 0.5; transition: 0.3s; color: #fff; cursor: pointer; height: 16.666666%; display: flex; align-items: center; justify-items: center; width: 100%; text-align: center; justify-content: center; } 
#nt_menu .nt-container>div .me-list ul li .sub_menu p img { display: block; height: 50%; } 
/* #nt_menu .nt-container>div .me-icon { width: fit-content; height: fit-content; } */
#nt_menu .nt-container>div .me-icon a img#logo_img { width: 170px; } 

/* #nt_menu .nt-container>div .me-icon.menu_bars { display: block; } */
/* #nt_menu .nt-container>div .me-icon.menu_bars a { height: 60px; width: 60px; line-height: 25px; padding: 20px; position: relative; top: 0; left: 0; display: block; } */
/* #nt_menu .nt-container>div .me-icon.menu_bars a { line-height: 25px; padding: 20px; position: relative; top: 0; left: 0; display: block; } */
#nt_menu .nt-container>div .me-icon.menu_bars a i { font-size: 35px !important; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: 0.1s; } 
#nt_menu .nt-container>div .me-icon.menu_bars a i.fa-bars { opacity: 1; } 
#nt_menu .nt-container>div .me-icon.menu_bars a i.fa-close { opacity: 0; } 
#nt_menu .nt-container>div .me-icon.menu_bars a.atv i.fa-bars { opacity: 0; } 
#nt_menu .nt-container>div .me-icon.menu_bars a.atv i.fa-close { opacity: 1;; } 
#nt_menu .nt-container>div .me-list ul li.down_menu { margin-top: 10vh; } 
#nt_menu .nt-container>div .me-list ul li.down_menu a { height: 10vh; line-height: 10vh; } 
#nt_menu .nt-container>div .me-list ul li.down_menu a span { width: fit-content; margin: 0 auto; text-align: center; padding:0 140px 0 50px !important; position: relative; top: 0; left: 0; border-radius: 200px; border: 1px solid #fff; font-size: 40px; font-weight: bold; opacity: 0.5; transition: 0.3s; color: #fff; } 
#nt_menu .nt-container>div .me-list ul li.down_menu a:hover span { opacity: 1; } 
#nt_menu .nt-container>div .me-list ul li.down_menu a span img { position: absolute; right: 50px; top: 50%; transform: translateY(-50%); height: 40px; } 
html.atv { overflow: hidden; } 
@media screen and (max-width:1100px) { 
 #nt_menu .nt-container>div .me-list ul li .sub_menu p { font-size: 60px; } 
 } 

@media screen and (max-width:900px) { 
 #nt_menu .nt-container { padding: 0 !important; } 
 #nt_menu .nt-container>div .me-icon a { padding: 20px; } 
 #nt_menu .nt-container>div .me-icon.menu_bars a i { font-size: 20px !important; } 
 #nt_menu .nt-container>div .me-list { padding-top: 76px; } 
 #nt_menu .nt-container>div .me-list ul li>b { font-size: 70px; } 
 #nt_menu .nt-container>div .me-list ul li .sub_menu p { font-size: 50px; } 
 #nt_menu .nt-container>div .me-list ul li .sub_menu p img { height: 40%; } 
 #nt_menu .nt-container>div .me-icon a img#logo_img { width: 100px; } 
 #nt_menu .nt-container>div .me-list ul li.down_menu a span { padding:0 100px 0 30px !important; font-size: 25px } 
 #nt_menu .nt-container>div .me-list ul li.down_menu a span img { right: 30px; height: 30px; } 
 } 
@media screen and (max-width:800px) { 
 #nt_menu .nt-container>div .me-list ul li .sub_menu p { font-size: 40px; } 
 } 
@media screen and (max-width:650px) { 
 #nt_menu .nt-container>div .me-list ul li>b { font-size: 50px } 
 #nt_menu .nt-container>div .me-list ul li .sub_menu p { font-size: 36px; word-break: keep-all; line-height: 35px; } 
 #nt_menu .nt-container>div .me-list ul li .sub_menu p img { height: 30%; } 
 #nt_menu .nt-container>div .me-list ul li.down_menu a span { font-size: 17px; font-weight: normal; padding: 0 70px 0 30px !important; } 
 #nt_menu .nt-container>div .me-list ul li.down_menu a span img { height: 20px; } 
 } 
@media screen and (min-width:501px) { 
 #nt_menu .nt-container>div .me-list ul li>b:hover { opacity: 1; } 
 #nt_menu .nt-container>div .me-list ul li>b:hover ~.toggle_btn { opacity: 1; } 
 #nt_menu .nt-container>div .me-list ul li .sub_menu p:hover { opacity: 1; } 
 #nt_menu .nt-container>div .me-list ul li>b.toggle:hover ~.sub_menu { display: block; } 
 #nt_menu .nt-container>div .me-list ul li>.toggle_btn:hover ~.sub_menu { display: block; } 
 #nt_menu .nt-container>div .me-list ul li .sub_menu:hover { display: block; } 
 #nt_menu .nt-container>div .me-list ul li.sub_wrap:hover b { opacity: 1; } 
 #nt_menu .nt-container>div .me-list ul li.sub_wrap:hover .toggle_btn { opacity: 1; } 
 } 
@media screen and (max-width:500px) { 
 #nt_menu .nt-container>div .me-list ul li { justify-content: space-between; } 
 #nt_menu .nt-container>div .me-list ul li .toggle_btn { font-size: 20px; } 
 #nt_menu .nt-container>div .me-list ul li.down_menu { display: block; } 
 #nt_menu .nt-container>div .me-list ul li>b { width: 100%; text-align: left; padding-left: 20px !important; } 
 #nt_menu .nt-container>div .me-list ul li.sub_wrap>b { width: calc(100% - 100px); } 
 #nt_menu .nt-container>div .me-list ul li .sub_menu p { justify-content: flex-start; padding-left: 20px; text-align: left; } 
 #nt_menu .nt-container>div .me-list ul li.hid.nn { opacity: 0; pointer-events: none; transition: 0.5s; } 
 } 
/* head 끝 */


/* footer 시작 */
#nt_footer { } 
#nt_footer .wrap { width: calc(100% - 40px); max-width: 1600px; margin: 0 auto; padding: 50px 0 175px; } 
#nt_footer .wrap>p { color: #fff; font-size: 90px; font-weight: 600; line-height: 100px; border-bottom: 2px solid #fff; word-break: keep-all; } 
#nt_footer .wrap>p span { color: #0034cf; display: block; } 
#nt_footer .wrap>div { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; } 
#nt_footer .wrap>div span { color: #fff; font-size: 15px; font-weight: 500; } 
#nt_footer .wrap>div span i { } 
#nt_footer .wrap>div span.privacy_btn { margin-left: 20px; cursor: pointer; } 
#nt_footer .wrap>div p { color: #fff; display: flex; justify-content: space-between; align-items: center; font-size: 15px; line-height: 50px; width: fit-content; cursor: pointer; } 
#nt_footer .wrap>div p img { height: 12px; margin-left: 10px; } 
#nt_footer .wrap>ul { flex-flow: row wrap; max-width: 550px; } 
#nt_footer .wrap>ul li { position: relative; top: 0; left: 0; padding-right: 15px; margin-right: 15px; } 
#nt_footer .wrap>ul li:nth-child(4),
#nt_footer .wrap>ul li:nth-child(5),
#nt_footer .wrap>ul li:last-child { width: 100%; } 
#nt_footer .wrap>ul li:nth-child(3)::before,
#nt_footer .wrap>ul li:nth-child(4)::before,
#nt_footer .wrap>ul li:nth-child(5)::before,
#nt_footer .wrap>ul li:nth-child(6)::before,
#nt_footer .wrap>ul li:last-child::before { display: none; } 
#nt_footer .wrap>ul li::before { content:""; width: 1px; height: 50%; background: #818181; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } 
#nt_footer .wrap>ul li p { color: #818181; } 
#nt_footer .wrap>ul li p b { } 
#tail_floating { position: fixed; bottom: 50px; right: 50px; z-index: 999998; cursor: pointer; } 
#tail_floating::after { position: absolute; content: "→"; display: block; color: #fff; font-size: 30px; left: 50%; top: 50%; font-weight: 200; transform: translate(-50%, -50%) rotate(0deg); transition: 0.5s; } 
#tail_floating:hover::after { transform: translate(-50%, -50%) rotate(360deg); } 
#tail_floating .rounded-text { width: 150px; height: 150px; text-transform: uppercase; transform: rotate(360deg); color: #fff; font-weight: bold; z-index: -1; } 
@keyframes floating_rotating { 
 from { 
 transform: rotate(-360deg); 
 } 
 to { 
 transform: rotate(0deg); 
 } 
 } 
#tail_floating .rotating { animation: floating_rotating 15s linear infinite; } 
textPath.coloring { fill: #fff; font-size: 27px; font-weight: 200; } 
.privacy_con { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 40px); max-width: 1200px; height: calc(100% - 40px); max-height: 600px; z-index: 999999; background: #fff; } 
.privacy_con .top { height: 70px; width: 100%; background: #0034cf; text-align: center; position: relative; top: 0; left: 0; } 
.privacy_con .top p { line-height: 70px; color: #fff; font-size: 20px; font-weight: bold; } 
.privacy_con .top span { position: absolute; top: 0; right: 0; height: 100%; width: auto; aspect-ratio: auto 1 / 1; cursor: pointer; } 
.privacy_con .top span::after { width: 2px; height:50%; content:""; display: block; background: #fff; transform: translate(-50%, -50%) rotate(45deg); top: 50%; left: 50%; position: absolute; } 
.privacy_con .top span::before { width: 2px; height:50%; content:""; display: block; background: #fff; transform: translate(-50%, -50%) rotate(-45deg); top: 50%; left: 50%; position: absolute; } 
.privacy_con #privacy { border: 1px solid #eeeeee; width: calc(100% - 140px); height: calc(100% - 210px); overflow-y: auto; margin: 70px auto 0; padding: 20px; } 
.privacy_con #privacy>b { display: block; margin-bottom: 20px; word-break: keep-all; font-size: 17px; color: #000000; } 
.privacy_con #privacy>.list { } 
.privacy_con #privacy>.list li { display: flex; align-items: flex-start; line-height: 22px; margin-bottom: 10px; } 
.privacy_con #privacy>.list li span { display: block; word-break: keep-all; margin-right: 10px; color: #666666; font-size: 17px; } 
.privacy_con #privacy>.list li p { display: block; word-break: keep-all; color: #666666; font-size: 17px; } 
.privacy_con #privacy>.list_con { margin-top: 100px; } 
.privacy_con #privacy>.list_con li { margin-bottom: 50px; } 
.privacy_con #privacy>.list_con li:last-child { margin-bottom:0px; } 
.privacy_con #privacy>.list_con li>b { word-break: keep-all; display: flex; align-items: flex-start; line-height: 22px; margin-bottom: 10px; font-size: 20px; } 
.privacy_con #privacy>.list_con li>b span { display: block; word-break: keep-all; margin-right: 10px; } 
.privacy_con #privacy>.list_con li p { display: block; word-break: keep-all; color: #000; font-weight: 500; font-size: 17px; margin-bottom: 10px; line-height: 20px; } 
.privacy_con #privacy>.list_con li>span { display: block; word-break: keep-all; color: #666666; font-size: 15px; margin-bottom: 10px; } 
.privacy_con #privacy .date_wrap { margin-top: 100px; } 
.privacy_con #privacy .date_wrap p { display: block; word-break: keep-all; font-size: 15px; font-size: 500; color: #000; } 


@media screen and (max-width:1200px) { 
 #nt_footer .wrap>p { font-size: 70px; line-height: 80px; } 
 #nt_footer .wrap>div { margin-bottom: 20px; } 
 .privacy_con #privacy { width: calc(100% - 70px); height: calc(100% - 140px); margin: 35px auto 0; } 
 } 
@media screen and (max-width:900px) { 
 #nt_footer .wrap { padding: 50px 0; } 
 #nt_footer .wrap>p { font-size: 50px; line-height: 60px; padding-bottom: 10px; } 
 #tail_floating { bottom: 20px; right: 20px; } 
 #tail_floating::after { font-size: 20px; } 
 #tail_floating .rounded-text { width: 70px; height: 70px; } 
 .privacy_con .top { height: 50px; } 
 .privacy_con .top p { line-height: 50px; font-size: 17px; } 
 .privacy_con #privacy>b { font-size: 15px; } 
 .privacy_con #privacy>.list li span { font-size: 15px; } 
 .privacy_con #privacy>.list li p { font-size: 15px; } 
 .privacy_con #privacy>.list_con li>b { font-size: 17px; } 
 .privacy_con #privacy>.list_con li p { font-size: 15px; } 
 .privacy_con #privacy>.list_con li>span { font-size: 13px; } 
 } 
@media screen and (max-width:600px) { 
 #nt_footer .wrap>p { font-size: 40px; line-height: 45px; } 
 #nt_footer .wrap>ul { max-width: unset; } 
 #nt_footer .wrap>ul li { width: 100%; padding-right: 0; margin-right: 0; margin-bottom: 10px; } 
 #nt_footer .wrap>ul li:nth-child(1)::before,
 #nt_footer .wrap>ul li:nth-child(2)::before,
 #nt_footer .wrap>ul li:nth-child(5)::before,
 #nt_footer .wrap>ul li:nth-child(7)::before { display: none; } 
 #nt_footer .wrap>ul li:last-child { padding-right: 0; margin-right: 0; width: 100%; text-align: center; margin-top: 50px; } 
 #nt_footer .wrap>ul li:last-child::before { display: none; } 
 #nt_footer .wrap>ul li p { line-height: 20px; word-break: keep-all; } 
 #nt_footer .wrap>div { margin-top: 10px; align-items: flex-start; } 
 #nt_footer .wrap>div>div { display: flex; flex-flow: column; justify-content: flex-start; } 
 #nt_footer .wrap>div span { line-height: 30px; } 
 #nt_footer .wrap>div span.privacy_btn { margin-left: 0; } 
 .privacy_con #privacy { width: 100%; height: calc(100% - 40px); margin: 0 auto; border: unset; } 
 } 
@media screen and (max-width:500px) { 
 #nt_footer .wrap>p { font-size: 30px; line-height: 35px; } 
 } 

/* footer 끝 */



/* 메인 시작 */
#main_index { overflow:hidden; } 
#main_index .main_movie { width: 100%; height: 100vh; position: relative; top: 0; left: 0; overflow: hidden; } 
#main_index .main_movie video { height: 120%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
#main_index .main_movie .text { color: #fff; width: calc(100% - 40px); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; } 
#main_index .main_movie .text b { font-size: 100px; display: block; } 
#main_index .main_movie .text p { font-size: 20px; } 
#main_index .we_are { margin-top: 200px; } 
#main_index .we_are p { font-size: 8vw; color: #fff; width: 100%; text-align: center; animation: neon1 1.5s ease-in-out infinite alternate; font-weight: 500; } 

@keyframes neon1 { 
 from { 
 text-shadow: 0 0 4px #fff, 0 0 8px #fff, 0 0 10px #fff, 0 0 15px #0034cf,
 0 0 30px #0034cf, 0 0 40px #0034cf, 0 0 50px #0034cf, 0 0 60px #0034cf; 
 } 
 to { 
 text-shadow: 0 0 2px #fff, 0 0 4px #fff, 0 0 5px #fff, 0 0 7.5px #0034cf,
 0 0 15px #0034cf, 0 0 20px #0034cf, 0 0 25px #0034cf, 0 0 30px #0034cf; 
 } 
 } 

#main_index .main_business { position: relative; top: 0; left: 0; width: 100%; } 
#main_index .main_business::after { content: ""; width: 80%; height: 125%; background-image: url(/../../img/main_bg3.png); background-size: cover; background-repeat: no-repeat; position: absolute; display: block; background-position: center; top: 35%; left: 0; z-index: 0; } 
#main_index .main_business .wrap { width:100%; max-width: 1600px; margin: 200px auto; padding: 0 20px; transform-origin: top right; position: relative; z-index: 2; } 
#main_index .main_business .wrap>b { color: #fff; font-size: 65px; display: block; text-align: center; font-weight: 500; margin-bottom: 50px; } 
#main_index .main_business .wrap ul { justify-content: space-evenly; align-items: flex-start; flex-flow: row wrap; } 
#main_index .main_business .wrap ul li { width: 33.333333%; } 
#main_index .main_business .wrap ul li:nth-child(2) { padding-top: 70px; } 
#main_index .main_business .wrap ul li img { width: 150px; margin: 0 auto 50px; animation: floating_rotating 15s linear infinite; } 
#main_index .main_business .wrap ul li b { color: #fff; font-size: 40px; display: block; text-align: center; line-height: 50px; max-width: 300px; margin: 0 auto 20px; word-break: keep-all; } 
#main_index .main_business .wrap ul li span { color: rgb(255 255 255 / 50%); font-size: 20px; text-align: center; display: block; width: 100%; word-break: keep-all; margin: 0 auto; font-weight: 300; } 
#main_index .main_business .wrap ul li span.mo { display: none; } 
#main_index .main_business .wrap ul li>a { display: block; width: 100%; max-width: 160px; margin: 20px auto 0; font-size: 22px; height: 42px; line-height: 40px; } 
#main_index .main_portfolio { } 
#main_index .main_portfolio .wrap { width: calc(100% - 40px); max-width: 1600px; margin: 200px auto 0; } 
#main_index .main_portfolio .wrap>b { color: #fff; font-size: 65px; display: block; text-align: center; font-weight: 500; margin-bottom: 50px; } 
#main_index .main_portfolio .wrap .ul_wrap { justify-content: space-between; gap: 80px; flex-flow: row wrap; align-items: center; } 
#main_index .main_portfolio .wrap .ul_wrap ul { width: calc(50% - 40px); flex-flow: column; } 
#main_index .main_portfolio .wrap .ul_wrap ul li { margin-bottom: 150px; height: fit-content; } 
#main_index .main_portfolio .wrap .ul_wrap ul li:last-child { margin-bottom: 0px; } 
#main_index .main_portfolio .wrap .ul_wrap ul li img { width: 100%; filter: brightness(0.5) grayscale(1); transition: 0.5s; } 
#main_index .main_portfolio .wrap .ul_wrap ul li:hover img { filter: unset; } 
#main_index .main_portfolio .wrap .ul_wrap ul li:hover a { color: #000; } 
#main_index .main_portfolio .wrap .ul_wrap ul li b { color: #fff; display: block; text-align: left; font-size: 30px; margin-top: 20px; font-weight: 400; } 
#main_index .main_portfolio .wrap .ul_wrap ul li a { color: #fff; position: absolute; bottom: 20px; left: 20px; font-size: 60px; transition: 0.3s; line-height: 70px; font-weight: 500; } 
#main_index .main_portfolio .wrap .ul_wrap ul li a.mo { display: none; } 
#main_index .main_portfolio .wrap .ul_wrap ul.left { } 
#main_index .main_portfolio .wrap .ul_wrap ul.left b { text-align: right; } 
#main_index .main_portfolio .wrap .ul_wrap ul.right li:last-child { position: relative; top: 0; left: 0; } 
#main_index .main_portfolio .wrap .ul_wrap ul.right li:last-child:hover img { filter: blur(3px) opacity(0.5); } 
#main_index .together { width: 100%; height:fit-content; margin: 200px auto 0; max-width: 1600px; z-index: 1; position: relative; } 
#main_index .together .text { padding: 125px; width: 100%; background-image: url(/../../img/together_bg.png); background-size: cover; background-repeat: no-repeat; background-position: center; } 
#main_index .together .text b { display: block; color: #fff; font-size: 80px; font-weight: 500; max-width: 880px; margin: 0 0 50px; line-height: 90px; } 
#main_index .together .text a { display: block; max-width: 240px; margin: 0; font-size: 22px; } 
@media screen and (max-width:1600px) { 
 #main_index .main_business::after { display: none; } 
 #main_index .main_portfolio .wrap .ul_wrap { gap: 20px; } 
 #main_index .main_portfolio .wrap .ul_wrap ul { width: calc(50% - 10px); } 
 } 
@media screen and (max-width:1530px) { 
 #main_index .main_business .wrap ul li span.pc { display: none; } 
 #main_index .main_business .wrap ul li span.mo { display: block; width: 100%; } 
 } 
@media screen and (max-width:1400px) { 
 #main_index .main_business .wrap>b { font-size: 55px; margin-bottom: 50px; } 
 #main_index .main_business .wrap ul li b { font-size: 30px; line-height: 40px; max-width: 222px; } 
 #main_index .main_business .wrap ul li span { font-size: 17px; max-width: 377px; } 
 #main_index .main_portfolio .wrap>b { font-size: 55px; margin-bottom: 50px; } 
 } 
@media screen and (max-width:1200px) { 
 #main_index .we_are p { font-size: 60px } 
 #main_index .main_business .wrap { scale: 1; } 
 #main_index .main_business .wrap ul li img { margin: 0 auto 30px; } 
 #main_index .main_business .wrap ul li b { font-size: 25px; line-height: 35px; max-width: 185px; } 
 #main_index .main_business .wrap ul li span { font-size: 17px; max-width: 321px; } 
 #main_index .main_portfolio .wrap { margin: 100px auto 0; } 
 #main_index .main_portfolio .wrap .ul_wrap ul li img { filter: unset !important; } 
 #main_index .main_portfolio .wrap .ul_wrap ul li a.pc { display: none; } 
 #main_index .main_portfolio .wrap .ul_wrap ul li a.mo { display: flex; justify-content: center; align-items: center; position: unset; font-size: 22px !important; line-height: unset; margin-top: 20px; } 
 #main_index .main_portfolio .wrap .ul_wrap ul li:hover a { color: #fff; } 
 #main_index .together .text { padding: 80px; } 
 #main_index .together .text b { font-size: 50px; max-width: 550px; line-height: 50px; opacity: 1 !important; } 
 } 
@media screen and (max-width:900px) { 
 #main_index .main_business::after { width: 200%; height: 120%; top: -195px; } 
 #main_index .main_business .wrap>b { font-size: 40px; margin-bottom: 50px; } 
 #main_index .main_business .wrap ul li { width: 100%; width: 100%; display: flex; justify-content: flex-start; flex-flow: row wrap; margin-bottom: 100px; } 
 #main_index .main_business .wrap ul li:last-child { margin-bottom:50px; } 
 #main_index .main_business .wrap ul li img { margin: 0 auto 10px; width: 100px; } 
 #main_index .main_business .wrap ul li b { font-size: 20px; line-height: 25px; max-width: unset; width: 100%; text-align: center; margin: 20px 0 20px; } 
 #main_index .main_business .wrap ul li span { font-size: 17px; max-width: 377px; line-height: 22px; max-width: unset; width: 70%; text-align: center; } 
 #main_index .main_business .wrap ul li:nth-child(2) { padding-top: 0; } 
 #main_index .main_business .wrap ul li>a { font-size: 17px; } 
 #main_index .main_portfolio .wrap>b { font-size: 40px; margin-bottom: 50px; } 
 #main_index .main_portfolio .wrap .ul_wrap ul { width: 100%; justify-content: center; flex-flow: row wrap; } 
 #main_index .main_portfolio .wrap .ul_wrap ul.right { margin-top: 100px; } 
 #main_index .main_portfolio .wrap .ul_wrap ul li { width: 100%; max-width: 600px; margin-bottom: 100px; } 
 } 
@media screen and (max-width:800px) { 
 #main_index .we_are p { font-size: 50px; } 
 #main_index .main_movie .text b { font-size: 80px; } 
 #main_index .together .text { padding: 50px 20px; } 
 #main_index .together .text b { font-size: 40px; line-height: 40px; max-width: 450px; } 
 } 
@media screen and (max-width:600px) { 
 #main_index .main_movie .text b { font-size: 60px; } 
 #main_index .main_portfolio .wrap .ul_wrap ul.right { margin-top: 50px; } 
 #main_index .main_portfolio .wrap .ul_wrap ul li { margin-bottom: 50px; } 
 #main_index .main_portfolio .wrap .ul_wrap ul li b { font-size: 20px; text-align: right; } 
 #main_index .main_portfolio .wrap .ul_wrap ul li a { font-size: 20px !important; } 
 } 
@media screen and (max-width:500px) { 
 #main_index .we_are p { font-size: 40px; } 
 #main_index .main_movie .text b { font-size: 50px; } 
 #main_index .main_business .wrap>b { font-size: 35px; } 
 #main_index .main_business .wrap ul li { margin-bottom: 50px; } 
 #main_index .main_business .wrap ul li span { width: 100%; } 
 #main_index .main_business .wrap ul li img { margin: 0 auto 0; width: 70px; } 
 #main_index .main_portfolio .wrap { margin:50px auto 0; } 
 #main_index .main_portfolio .wrap>b { font-size: 35px; } 
 #main_index .together .text { padding: 40px 20px; } 
 #main_index .together .text b { font-size: 30px; margin: 0 auto 30px; line-height: 30px; max-width: 330px; text-align: center; } 
 #main_index .together .text a { margin: 0 auto; } 
 } 
@media screen and (max-width:390px) { 
 #main_index .we_are p { font-size: 30px; } 
 } 

/* 메인 끝 */



/* business 시작 */
#business { } 
#business.business_pc { display: block; } 
#business.business_mo { display: none; } 
#business .visual { } 
#business .visual li { justify-content: space-between; align-items: center; margin-top: 250px; } 
#business .visual li:first-child { margin-top: 80px; } 
#business .visual li:nth-child(2n) { flex-flow:row-reverse } 
#business .visual li img { width: 57%; } 
#business .visual li .text { width: 38%; justify-content: space-between; align-items: center; flex-flow: row wrap; padding: 0 20px 0 0; } 
.ani_wrap { overflow: hidden; } 
.ani_wrap.b_tag { margin-bottom: 200px; } 
#business .visual li .text b { color: #fff; display: block; font-size: 50px; font-weight: 500; opacity: 0; transform: translateY(100%); } 
#business .visual li .text p { color: #fff; display: block; font-size: 30px; font-weight: 600; opacity: 0; transform: translateY(100%); } 
#business .visual li .text b.atv { animation:text-active-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both; } 
#business .visual li .text p.atv { animation:text-active-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both; } 
#business .visual li .text p span { display: block; font-size: 18px; color: rgb(255 255 255 / 50%); font-weight: 400; margin-top: 20px; width: 100%; max-width: 463px; word-break: keep-all; } 
#business .visual li:nth-child(2n) .text { justify-content:end; padding: 0 0 0 20px; } 
#business .visual li:nth-child(2n) b { text-align: right; } 
#business .visual li:nth-child(2n) p { text-align: right; } 
@-webkit-keyframes text-active-animation { 
 0% { 
 opacity: 0; 
 filter: Alpha(opacity = 0); 
 transform: translateY(100%); 
 } 
 100% { 
 opacity: 1.0; 
 filter: Alpha(opacity = 100); 
 transform: translateY(0); 
 } 
 } 
#business .subscription { width: calc(100% - 40px); margin: 340px auto 0; } 
#business .subscription .sub_title b.one { color: #fff; word-break: keep-all; font-size: 50px; display: block; text-align: center; margin-bottom: 50px; font-weight: 600; } 
#business .subscription .sub_title p.one { color: #fff; word-break: keep-all; font-size: 20px; display: block; text-align: center; line-height: 40px; font-weight: 300; } 
#business .subscription .sub_title b.two { color: #fff; word-break: keep-all; font-size: 30px; display: block; text-align: center; margin-bottom: 30px; font-weight: 600; } 
#business .subscription .sub_title p.two { color: #fff; word-break: keep-all; font-size: 18px; display: block; text-align: center; line-height: 40px; font-weight: 300; } 
#business .subscription .sub_title .line { margin: 100px auto; width: 1px; height: 70px; background: #fff; } 
#business .subscription .text_blind { filter: blur(7px); opacity: 0.1; } 
#business .subscription .text_blind.atv { animation:text-blind 1s both; } 
#business .subscription>ul { justify-content: space-between; flex-flow: row wrap; width: 100%; max-width: 1400px; margin: 120px auto 0; } 
#business .subscription>ul li { width: 49%; max-width: 600px; margin-bottom: 170px; } 
#business .subscription>ul li:nth-child(3),
#business .subscription>ul li:nth-child(4) { margin-bottom: 0px; } 
#business .subscription>ul li .img_wrap { width: 100%; margin-bottom: 60px; overflow: hidden; } 
#business .subscription>ul li .img_wrap img { width: 100%; transition: 0.7s; } 
#business .subscription>ul li .img_wrap img:hover { scale: 1.1; } 
/* transform-origin: top right; */
#business .subscription>ul li p { color: #fff; display: block; word-break: keep-all; font-size: 30px; text-align: center; font-weight: 600; } 
#business .subscription>ul li span { color: #fff; display: block; word-break: keep-all; font-size: 22px; text-align: center; font-weight: 300; } 
#business .advantage { width: calc(100% - 40px); margin: 420px auto 0; max-width: 1600px; } 
#business .advantage .text_blind { filter: blur(7px); opacity: 0.1; } 
#business .advantage b.text_blind.atv { animation:text-blind 1s both; } 
#business .advantage div.text_blind.atv { animation:text-blind 1s both; } 
@-webkit-keyframes text-blind { 
 0% { 
 filter: blur(7px); 
 opacity: 0.1; 
 } 
 100% { 
 filter: blur(0px); 
 opacity: 1; 
 } 
 } 
#business .advantage>b { color: #fff; word-break: keep-all; font-size: 50px; display: block; text-align: center; margin-bottom: 150px; font-weight: 600; } 
#business .advantage>div { margin-bottom: 80px; } 
#business .advantage>div:last-child { margin-bottom: 0px; } 
#business .advantage>div span { word-break: keep-all; font-size: 35px; color: #3874FF; width: 65px; font-weight: 600; } 
#business .advantage>div b { color: #fff; word-break: keep-all; font-size: 35px; display: block; width: calc(100% - 65px); font-weight: 500; } 
#business .advantage>div b p { color: #fff; word-break: keep-all; font-size: 22px; display: block; font-weight: 300; margin-top: 20px; line-height: 40px; word-break: keep-all; } 
#business .table { width: calc(100% - 40px); max-width: 1600px; margin: 300px auto 0; } 
#business .table>p { color: #fff; display: block; word-break: keep-all; font-size: 30px; font-weight: 300; text-align: center; margin-bottom: 50px; } 
#business .table>b { color: #fff; word-break: keep-all; font-size: 50px; display: block; text-align: center; font-weight: 600; margin-bottom: 50px; } 
#business .table>ul { } 
#business .table>ul li { border-bottom: 1px solid rgb(217 217 217 / 20%); } 
#business .table>ul li:nth-child(1) { width: 17%; } 
#business .table>ul li:nth-child(2) { width: 25%; } 
#business .table>ul li:nth-child(3) { width: 33%; } 
#business .table>ul li:nth-child(4) { width: 25%; } 
#business .table>ul li:first-child p:first-child { border-top: 1px solid rgb(217 217 217 / 20%); } 
#business .table>ul li p { color: #fff; word-break: keep-all; font-size: 22px; border-bottom: 1px solid rgb(217 217 217 / 20%); text-align: center; height: 70px; line-height: 70px; font-weight: 300; } 
#business .table>ul li p:first-child { height: 100px; line-height: 97px; } 
#business .table>ul li p:last-child { height: 76px; line-height: 76px; } 
#business .table>ul li p.black { color: rgb(217 217 217 / 50%); } 
#business .table>ul li p.black:last-child { border-bottom: 5px solid #0b0b12; } 
#business .table>ul li p.black_gray { background: #15151c } 
#business .table>ul li p.black_gray:last-child { border-bottom: 5px solid #15151c; } 
#business .table>ul li p.gray { background: #29292f; word-break: keep-all; font-size: 30px; border-top: 5px solid #29292f; font-weight: 600; } 
#business .table>ul li.point { border: 5px solid #FFF; } 
#business .table>ul li.point p { color: #fff; font-weight: 500; } 
#business .table>ul li.point p:first-child { height:95px; } 
#business .table>ul li.point p.black:last-child { border-bottom: none; } 
#business .table>ul li.point p.gray { border-top: none; } 
#business .table>ul li.point p:last-child { height: 70px; line-height: 70px; } 
@media screen and (max-width:1660px) { 
 #business .visual li img { width: 50%; } 
 #business .visual li .text { width: 46%; } 
 .ani_wrap.b_tag { margin-bottom: 100px; } 
 } 
@media screen and (max-width:1400px) { 
 #business .visual li .text b { font-size: 40px; line-height: 50px; } 
 #business .visual li .text p { font-size: 25px; } 
 #business .visual li .text p span { font-size: 18px; /*margin-top: 20px; *//*max-width: 450px; */ } 
 #business .subscription { margin: 240px auto 0; } 
 #business .subscription .sub_title b.one { font-size: 40px; margin-bottom: 40px; } 
 #business .subscription .sub_title p.one { font-size: 18px; line-height: 36px; } 
 #business .subscription .sub_title b.two { font-size: 25px; margin-bottom: 25px; } 
 #business .subscription .sub_title p.two { font-size: 18px; line-height: 36px; } 
 #business .subscription>ul li { margin-bottom: 130px; } 
 #business .subscription>ul li .img_wrap { margin-bottom: 50px } 
 #business .subscription>ul li p { font-size: 25px; } 
 #business .subscription>ul li span { font-size: 20px; } 
 #business .advantage { margin: 320px auto 0; } 
 #business .advantage>b { font-size: 40px; margin-bottom: 130px; } 
 #business .advantage>div span { font-size: 30px; width: 50px; } 
 #business .advantage>div b { font-size: 30px; width: calc(100% - 50px); } 
 #business .advantage>div b p { font-size: 20px; margin-top: 15px; line-height: 36px; } 
 #business .table>p { font-size: 25px; margin-bottom: 40px; } 
 #business .table>b { font-size: 40px; margin-bottom: 40px; } 
 #business .table>ul li p { font-size: 20px; } 
 #business .table>ul li p.gray { font-size: 25px; } 
 } 

@media screen and (max-width:1200px) { 
 #business { } 
 #business.business_pc { display: none; } 
 #business.business_mo { display: block; } 
 #business .visual li .text b { opacity: 1; transform: translateY(0); } 
 #business .visual li .text p { opacity: 1; transform: translateY(0); } 
 #business .visual li .text b.atv { animation:unset; } 
 #business .visual li .text p.atv { animation:unset; } 
 #business .subscription>ul li .img_wrap img:hover { scale: 1; } 
 #business .subscription .text_blind { filter: unset; opacity: 1; } 
 #business .subscription .text_blind.atv { animation:unset; } 
 #business .subscription .sub_title .line { margin: 50px auto; height: 30px; } 
 #business .advantage { margin: 200px auto 0; } 
 #business .advantage .text_blind { filter: unset; opacity: 1; } 
 #business .advantage b.text_blind.atv { animation:unset; } 
 #business .advantage div.text_blind.atv { animation:unset; } 
 #business .table { margin: 200px auto 0; } 
 #business .table .ul_title { height: 95px; text-align: center; line-height: 95px; color: #fff; font-weight: 500; font-size: 25px; margin-top: 100px; background: #29292f; border-top:1px solid rgb(217 217 217 / 20%); } 
 #business .table>ul li:nth-child(1) { width: 40%; } 
 #business .table>ul li:nth-child(2) { width: 60%; } 
 #business .table>ul li p.black:nth-child(1) { border-top: 1px solid rgb(217 217 217 / 20%); height: 75px; line-height: 73px; } 
 #business .table>ul li.point p:first-child { height: 70px; line-height: 68px; } 
 #business .table>ul li p:first-child { height: 75px; line-height: 73px; } 
 } 
@media screen and (max-width:1110px) { 
 #business .visual li .text b { font-size: 35px; line-height: 45px; } 
 #business .visual li .text p { font-size: 20px; } 
 #business .visual li .text p span { font-size: 15px; } 
 .ani_wrap.b_tag { margin-bottom: 50px; } 
 #business .subscription .sub_title b.one { font-size: 35px; margin-bottom: 30px; } 
 #business .subscription .sub_title p.one { font-size: 15px; line-height: 30px; } 
 #business .subscription .sub_title b.two { font-size: 20px; margin-bottom: 20px; } 
 #business .subscription .sub_title p.two { font-size: 15px; line-height: 30px; } 
 #business .subscription>ul li p { font-size: 20px; } 
 #business .subscription>ul li span { font-size: 15px; } 
 #business .advantage>b { font-size: 35px; margin-bottom: 100px; } 
 #business .advantage>div b p { font-size: 15px; margin-top: 10px; line-height: 30px; } 
 #business .table>p { font-size: 20px; margin-bottom: 30px; } 
 #business .table>b { font-size: 35px; margin-bottom: 30px; } 
 #business .table>ul li p { font-size: 15px; } 
 #business .table>ul li p.gray { font-size: 20px; } 
 #business .table .ul_title { font-size: 20px; height: 70px; line-height: 68px; } 
 } 
@media screen and (max-width:950px) { 
 #business .visual li { flex-flow: row wrap !important; margin-top: 100px; } 
 #business .visual li:first-child { margin-top: 0px; } 
 #business .visual li img { width: 100%; } 
 #business .visual li .text { width: 100%; padding: 20px 20px 0 !important; } 
 .ani_wrap.b_tag { margin-bottom: 30px; } 
 #business .visual li .text p span { margin-top: 5px; } 
 #business .subscription .sub_title b.one { margin-bottom: 10; } 
 #business .subscription .sub_title p.one { line-height: 25px; } 
 #business .subscription .sub_title b.two { margin-bottom: 10px; } 
 #business .subscription .sub_title p.two { line-height: 25px; } 
 #business .subscription .sub_title .line { margin: 20px auto; } 
 #business .subscription>ul { margin: 50px auto 0; } 
 #business .subscription>ul li { width: 100%; margin: 0 auto 50px; } 
 #business .subscription>ul li:nth-child(3) { margin-bottom: 50px; } 
 #business .subscription>ul li .img_wrap { margin-bottom: 20px; } 
 } 
@media screen and (max-width:900px) { 
 #business .visual li { flex-flow: row wrap !important; margin-top: 100px; } 
 #business .visual li:first-child { margin-top: 0px; } 
 #business .visual li img { width: 100%; } 
 #business .visual li .text { width: 100%; padding: 20px 20px 0 !important; } 
 .ani_wrap.b_tag { margin-bottom: 30px; } 
 #business .visual li .text p span { margin-top: 5px; } 
 } 
@media screen and (max-width:500px) { 
 #business { } 
 #business .visual li .text b { font-size: 30px; line-height: 40px; } 
 #business .subscription .sub_title b.one { font-size: 30px; margin-bottom: 20px; line-height: 31px; } 
 #business .subscription .sub_title b.two { font-size: 18px; margin-bottom: 20px; } 
 #business .subscription .sub_title .line { height: 20px; } 
 #business .advantage { margin: 150px auto 0; } 
 #business .advantage>div span { line-height: 31px; } 
 #business .advantage>b { font-size: 30px; margin-bottom: 50px; line-height: 31px; } 
 #business .advantage>div b { font-size: 20px; } 
 #business .table { margin: 150px auto 0; } 
 #business .table>p { font-size: 15px; } 
 #business .table>b { font-size: 30px; margin-bottom: 20px; line-height: 31px; } 
 #business .table .ul_title { font-size: 17px; font-weight: 700; } 
 } 
/* business 끝 */


/* business 하위메뉴 공통 */
.sub_bnr { background: linear-gradient(200deg, rgba(17, 52, 133, 0.6) 35%, rgba(0, 0, 0, 0.9) 65%); height: 100vh; overflow-x: hidden; } 
.sub_bnr .title { position: relative; top: 50%; left: 0; transform: translateY(-50%); z-index: 2; padding-left: 160px; } 
.sub_bnr .title h1 { font-size: 100px; font-weight: 700; color: #fff; background: url('/img/solution_bg01.png')no-repeat center left; background-size: inherit; padding-top: 200px; line-height: 1; } 
.sub_bnr .title h1 span { display: block; font-size: 35px; word-break: keep-all; margin-top: 30px; } 
.sub_bnr .title p { font-size: 26px; font-weight: 400; color: #fff; line-height: 1.4; margin-top: 60px; } 
.sub_bnr .shapeBox { position: absolute; top:0; left:0; width: 100%; height: 100vh; z-index: 1; overflow: hidden; } 
.sub_bnr .shapeBox>div { position: absolute; background-size: contain; background-repeat: no-repeat; } 
.sub_bnr .shapeBox .cube { background-image: url('/img/solution_img01.png'); animation: float 6s ease-in-out infinite; left:70%; top:50%; width:600px; height: 700px; } 
.sub_bnr .shapeBox .cube_top { background-image: url('/img/solution_img04.png'); animation: float 6s ease-in-out infinite; left:20%; top:10%; width:75px; height: 90px; filter: blur(10px); } 
.sub_bnr .shapeBox .cube_bot { background-image: url('/img/solution_img05.png'); animation: float 6s ease-in-out infinite; left:10%; top:85%; width:120px; height: 140px; filter: blur(20px); } 
.sub_bnr .shapeBox .circle_left { background-image: url('/img/solution_img02.png'); left:30%; top:-25%; animation : spring_top 5s infinite linear; transform-style: preserve-3d; width:700px; height: 700px; } 
.sub_bnr .shapeBox .circle_right { background-image: url('/img/solution_img03.png'); left:95%; top:75%; animation : spring_bot 5s infinite linear; transform-style: preserve-3d; width:700px; height: 700px; } 
.contact_btn { text-align: center; color: #fff; width: calc(100% - 40px); max-width: 300px; margin:130px auto; display: block; height: 60px; line-height: 58px; font-size: 25px; font-weight: bold; box-shadow: unset; border: 1px solid rgb(255 255 255 / 60%) !important; background-color: rgb(0 0 0 / 10%) !important; border-radius: 50px; cursor: pointer; } 
#business .contact_btn { margin:150px auto 0; } 


/* seo */
#seo .sub_bnr .title h1 { background: url('/img/seo_bg01.png')no-repeat top left; background-size: inherit; padding-top: 80px; } 
#seo .sub_bnr .shapeBox .cube { background-image: url('/img/seo_img01.png'); animation: float 6s ease-in-out infinite; left:75%; top:60%; width:800px; height: 930px; } 
#seo .sub_bnr .shapeBox .cube_top { background-image: url('/img/seo_img02.png'); animation: float 6s ease-in-out infinite; left:30%; top:5%; width:420px; height: 320px; filter: blur(20px); } 
#seo .sub_bnr .shapeBox .cube_bot { background-image: url('/img/seo_img03.png'); animation: float 6s ease-in-out infinite; left:10%; top:85%; width:180px; height: 250px; } 


/* marketing */
#marketing .sub_bnr .title h1 { background: url('/img/marketing_bg01.png')no-repeat top left; background-size: inherit; padding-top: 80px; } 
#marketing .sub_bnr .shapeBox .cube { background-image: url('/img/marketing_img01.png'); background-size: 100%; animation: float 6s ease-in-out infinite; left:75%; top:60%; width:645px; height: 950px; z-index: 2; } 
#marketing .sub_bnr .shapeBox .circle_right { background-image: url('/img/marketing_img03.png'); left:93%; top:80%; animation : spring_bot 5s infinite linear; transform-style: preserve-3d; width:180px; height: 590px; } 
#marketing .sub_bnr .shapeBox .cube_top { background-image: url('/img/marketing_img02.png'); animation: float 6s ease-in-out infinite; left:35%; top:0%; width:1000px; height: 300px; filter: blur(10px); } 
#marketing .sub_bnr .shapeBox .cube_bot { background-image: url('/img/marketing_img04.png'); animation: float 6s ease-in-out infinite; left:15%; top:85%; width:210px; height: 250px; filter: none; } 


/* design */
#design .sub_bnr .title h1 { background: url('/img/design_bg01.png')no-repeat top left; background-size: inherit; padding-top: 80px; } 
#design .sub_bnr .shapeBox .cube { background-image: url('/img/design_img01.png'); background-size: 100%; animation: float 6s ease-in-out infinite; left:85%; top:50%; width:970px; height: 800px; z-index: 2; } 
#design .sub_bnr .shapeBox .circle_right { background-image: url('/img/design_img02.png'); left:65%; top:80%; animation : spring_bot 5s infinite linear; transform-style: preserve-3d; width:360px; height: 360px; z-index: 1; } 
#design .sub_bnr .shapeBox .circle_left { background-image: url('/img/design_img03.png'); background-size: 100%; left:30%; top:-10%; animation : spring_top 5s infinite linear; transform-style: preserve-3d; width:735px; height: 670px; } 
#design .sub_bnr .shapeBox .cube_top { background-image: url('/img/design_img04.png'); animation: float 6s ease-in-out infinite; left:5%; top:25%; width:50px; height: 50px; filter: none; } 
#design .sub_bnr .shapeBox .cube_bot { background-image: url('/img/design_img05.png'); animation: float 6s ease-in-out infinite; left:10%; top:85%; width:130px; height: 130px; filter: none; } 


/* website */
#website .sub_bnr .title h1 { background: url('/img/website_bg01.png')no-repeat top left; background-size: inherit; padding-top: 80px; } 
#website .sub_bnr .shapeBox .cube { background-image: url('/img/website_img01.png'); background-size: 100%; animation: float 6s ease-in-out infinite; left:75%; top:50%; width:670px; height: 670px; z-index: 2; } 
#website .sub_bnr .shapeBox .circle_right { background-image: url('/img/website_img02.png'); left:85%; top:55%; animation : spring_bot 5s infinite linear; transform-style: preserve-3d; width:410px; height: 540px; z-index: 1; } 
#website .sub_bnr .shapeBox .cube_top { background-image: url('/img/website_img03.png'); animation: float 6s ease-in-out infinite; left:10%; top:25%; width:200px; height: 155px; filter: none; } 
#website .sub_bnr .shapeBox .cube_bot { background-image: url('/img/website_img04.png'); animation: float 6s ease-in-out infinite; left:15%; top:85%; width:70px; height: 70px; filter: none; } 



@keyframes float { 
 0% { 
 transform: translate(-50%, -50%) translateY(0); 
 } 
 50% { 
 transform: translate(-50%, -50%) translateY(20px); /* 아래로 약간 이동 */
 } 
 100% { 
 transform: translate(-50%, -50%) translateY(0); /* 원래 위치로 돌아옴 */
 } 
 } 
.sub_bnr .shapeBox .spring_top { background-image: url('/img/subbnr_img02.png'); animation: spring_top 6s ease-in-out infinite; left:95%; top:-15%; width:800px; height: 800px; } 
.sub_bnr .shapeBox .spring_bot { background-image: url('/img/subbnr_img01.png'); animation: spring_bot 8s ease-in-out infinite; left:5%; top:95%; width:800px; height: 800px; } 
@keyframes spring_top { 
 0% { 
 transform: translate(-50%, -50%) translateY(50px); 
 } 
 50% { 
 transform: translate(-50%, -50%) translateY(20px); /* 아래로 약간 이동 */
 } 
 100% { 
 transform: translate(-50%, -50%) translateY(50px); /* 원래 위치로 돌아옴 */
 } 
 } 
@keyframes spring_bot { 
 0% { 
 transform: translate(-50%, -50%) translateY(20px); 
 } 
 50% { 
 transform: translate(-50%, -50%) translateY(70px); /* 아래로 약간 이동 */
 } 
 100% { 
 transform: translate(-50%, -50%) translateY(20px); /* 원래 위치로 돌아옴 */
 } 
 } 




.service { padding: 150px 0; max-width:1200px; margin: 0 auto; overflow-x: hidden; } 
.service .title { text-align: center; color: #fff; margin-bottom: 130px; } 
.service .title h2 { font-size: 70px; font-weight: 600; } 
.service ul li { gap: 55px; align-items: center; margin-bottom: 150px; } 
.service ul li:last-child { margin-bottom: 0; } 
.service ul li.right { flex-direction: row-reverse; } 
.service ul li.right .text { text-align: right; } 
.service ul li .text .b_tag h3 { font-size: 60px; font-weight: 600; color: #fff; margin-bottom: 40px; line-height: 1.2; } 
.service ul li .text .p_tag { font-size: 30px; font-weight: 500; color: rgba(255, 255, 255, 0.5); line-height: 1.3; } 
.service>span { font-size: 60px; font-weight: 600; color: #fff; margin-bottom: 40px; line-height: 1.2; margin-top: 150px; display: block; width: 100%; text-align: center; } 


.process { padding: 150px 0; max-width: 1640px; margin:0 auto; overflow-x: hidden; } 
.process .title { text-align: center; color: #fff; margin-bottom: 130px; } 
.process .title h2 { font-size: 70px; font-weight: 600; } 
.process ul { justify-content: center; align-items: center; } 
.process ul li { position: relative; flex-direction: column; justify-content: center; align-items: center; border: 1px solid #B5B5B5; border-radius: 50%; width:25%; aspect-ratio: 1 / 1; margin-left: -40px; } 
.process ul li:nth-child(1) { margin-left: 0; } 
.process ul li .num { margin-bottom: 20px; } 
.process ul li .num p { font-size: 30px; color: #fff; font-weight: 600; background: #3874FF; width: 50px; height: 50px; text-align: center; line-height: 50px; border-radius: 50px; } 
.process ul li .icon { text-align: center; } 
.process ul li .icon img { max-width: 100%; } 
.process ul li:nth-child(1) .icon img { animation: process 2s linear infinite 0.2s; } 
.process ul li:nth-child(2) .icon img { animation: process 2s linear infinite 0.4s; } 
.process ul li:nth-child(3) .icon img { animation: process 2s linear infinite 0.6s; } 
.process ul li:nth-child(4) .icon img { animation: process 2s linear infinite 0.8s; } 
.process ul li::after { content: ''; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 16px; height: 32px; background: url('/img/process_img05.png') no-repeat; background-size: 100%; } 
.process ul li:last-child::after { width: 0; } 
.process ul li .text { text-align: center; } 
.process ul li .text .b_tag h3 { font-size: 36px; color: #fff; font-weight: 500; } 

@keyframes process { 
 0% { 
 transform: translateY(0px); 
 } 
 50% { 
 transform: translateY(-10px); 
 } 
 100% { 
 transform: translateY(0px); 
 } 
 } 



@media all and (max-width:1800px) { 
 .sub_bnr .title { padding-left: 120px; } 
 .sub_bnr .title h1 { font-size: 90px; padding-top: 180px; } 
 .sub_bnr .title h1 span { font-size: 30px; } 
 .sub_bnr .shapeBox .cube { width: 550px; height: 550px; left: 75%; } 
 .sub_bnr .shapeBox .circle_left { width: 600px; height: 600px; } 
 .sub_bnr .shapeBox .circle_right { width: 600px; height: 600px; } 
 .sub_bnr .shapeBox .spring_top { width: 750px; height: 750px; } 
 .sub_bnr .shapeBox .spring_bot { width: 750px; height: 750px; } 

 /* website */
 #website .sub_bnr .shapeBox .cube { width: 600px; height: 600px; } 
 #website .sub_bnr .shapeBox .circle_right { width: 350px; height: 480px; } 
 #website .sub_bnr .shapeBox .cube_top { width: 180px; height: 135px; } 

 /* design */
 #design .sub_bnr .shapeBox .cube { width: 850px; height: 710px; } 
 #design .sub_bnr .shapeBox .circle_left { width: 635px; height: 570px; } 
 #design .sub_bnr .shapeBox .circle_right { width: 300px; height: 300px; } 

 /* marketing */
 #marketing .sub_bnr .shapeBox .cube { width: 550px; height: 750px; } 
 #marketing .sub_bnr .shapeBox .cube_top { width: 850px; height: 250px; } 
 #marketing .sub_bnr .shapeBox .circle_right { width: 150px; height: 500px; } 

 /* seo */
 #seo .sub_bnr .shapeBox .cube { width: 700px; height: 850px; } 
 #seo .sub_bnr .shapeBox .cube_top { width: 380px; height: 290px; } 


 .process { width: 90%; } 
 .process ul li { width:calc(100% - 40px); } 
 .process ul li .text .b_tag h3 { font-size: 32px; } 
 .process ul li .icon { width: 180px; } 
 .process ul li:nth-child(3) .icon { width: 160px; } 
 } 

@media all and (max-width:1600px) { 
 .sub_bnr .title { padding-left: 100px; } 
 .sub_bnr .title h1 { font-size: 80px; } 
 .sub_bnr .title h1 span { font-size: 25px; } 
 .sub_bnr .title p { font-size: 24px; } 
 .sub_bnr .shapeBox .cube { width: 500px; height: 500px; left: 80%; } 
 .sub_bnr .shapeBox .circle_left { width: 500px; height: 500px; top: -20%; } 
 .sub_bnr .shapeBox .circle_right { width: 500px; height: 500px; } 
 .sub_bnr .shapeBox .spring_top { width: 700px; height: 700px; } 
 .sub_bnr .shapeBox .spring_bot { width: 700px; height: 700px; } 

 /* website */
 #website .sub_bnr .title h1 { background-size: 50%; } 
 #website .sub_bnr .shapeBox .cube { width: 500px; height: 500px; } 
 #website .sub_bnr .shapeBox .circle_right { width: 300px; height: 430px; } 
 #website .sub_bnr .shapeBox .cube_top { width: 160px; height: 115px; } 

 /* design */
 #design .sub_bnr .title h1 { background-size: 60%; padding-top: 60px; } 
 #design .sub_bnr .shapeBox .cube { width: 750px; height: 620px; } 
 #design .sub_bnr .shapeBox .circle_left { width: 535px; height: 470px; top: -5%; } 
 #design .sub_bnr .shapeBox .circle_right { width: 250px; height: 250px; } 


 /* marketing */
 #marketing .sub_bnr .shapeBox .cube { width: 450px; height: 700px; left: 80%; } 
 #marketing .sub_bnr .shapeBox .cube_top { width: 750px; height: 200px; } 
 #marketing .sub_bnr .shapeBox .circle_right { width: 120px; height: 400px; left: 95%; } 
 #marketing .sub_bnr .shapeBox .cube_bot { width: 180px; height: 200px; } 

 /* seo */
 #seo .sub_bnr .shapeBox .cube { width: 600px; height: 700px; } 
 #seo .sub_bnr .shapeBox .cube_top { width: 350px; height: 260px; } 


 .service .title h2 { font-size: 60px; } 
 .service ul li .text .b_tag h3 { font-size: 50px; } 
 .service>span { font-size: 50px } 


 .process { width: 90%; } 
 .process .title h2 { font-size: 60px; } 
 .process ul li .num p { font-size: 24px; } 
 .process ul li .text .b_tag h3 { font-size: 30px; } 
 } 

@media all and (max-width:1400px) { 
 .sub_bnr .title h1 { font-size: 70px; padding-top: 140px; } 
 .sub_bnr .title p { font-size: 22px; } 
 .sub_bnr .shapeBox .cube { width: 450px; height: 450px; } 
 .sub_bnr .shapeBox .circle_left { width: 450px; height: 450px; } 
 .sub_bnr .shapeBox .circle_right { width: 450px; height: 450px; left: 97%; } 
 .sub_bnr .shapeBox .spring_top { width: 600px; height: 600px; } 
 .sub_bnr .shapeBox .spring_bot { width: 600px; height: 600px; } 


 /* website */
 #website .sub_bnr .shapeBox .cube { width: 400px; height: 400px; } 
 #website .sub_bnr .shapeBox .circle_right { width: 250px; height: 380px; } 
 #website .sub_bnr .shapeBox .cube_top { width: 140px; height: 95px; } 
 #website .sub_bnr .shapeBox .cube_bot { width: 60px; height: 60px; } 
 
 /* design */
 #design .sub_bnr .title h1 { padding-top: 40px; } 
 #design .sub_bnr .shapeBox .cube { width: 650px; height: 540px; left: 80%; } 
 #design .sub_bnr .shapeBox .circle_left { width: 435px; height: 380px; } 
 #design .sub_bnr .shapeBox .circle_right { width: 200px; height: 200px; top: 70%; } 
 #design .sub_bnr .shapeBox .cube_bot { width: 100px; height: 100px; } 

 /* marketing */
 #marketing .sub_bnr .title h1 { background-size: 50%; padding-top: 60px; } 
 #marketing .sub_bnr .shapeBox .cube { width: 400px; height: 700px; } 
 #marketing .sub_bnr .shapeBox .cube_top { width: 600px; height: 180px; } 
 #marketing .sub_bnr .shapeBox .circle_right { width: 100px; height: 350px; } 
 #marketing .sub_bnr .shapeBox .cube_bot { width: 150px; height: 185px; } 

 /* seo */
 #seo .sub_bnr .title h1 { padding-top: 60px; } 
 #seo .sub_bnr .shapeBox .cube { width: 500px; height: 600px; } 
 #seo .sub_bnr .shapeBox .cube_top { width: 300px; height: 210px; } 

 .service { width: 90%; } 
 .service .title h2 { font-size: 55px; } 
 .service ul li .text .b_tag h3 { font-size: 44px; } 
 .service>span { font-size:44px } 
 .service ul li .text .p_tag { font-size:26px; } 
 
 .process .title h2 { font-size: 55px; } 
 .process ul li .num p { font-size: 22px; } 
 .process ul li .text .b_tag h3 { font-size: 26px; } 
 .process ul li .icon { width: 150px; } 
 .process ul li:nth-child(3) .icon { width: 120px; } 
 } 

@media all and (max-width:1200px) { 
 .sub_bnr .title { padding-left: 60px; } 
 .sub_bnr .title h1 { font-size: 60px; padding-top: 100px; } 
 .sub_bnr .title h1 span { font-size: 22px; } 
 .sub_bnr .title p { font-size: 20px; } 

 .sub_bnr .shapeBox .cube { width: 400px; height: 400px; } 
 .sub_bnr .shapeBox .circle_left { width: 400px; height: 400px; top: -15%; } 
 .sub_bnr .shapeBox .circle_right { width: 400px; height: 400px; top: 80%; } 
 .sub_bnr .shapeBox .spring_top { width: 550px; height: 550px; } 
 .sub_bnr .shapeBox .spring_bot { width: 550px; height: 550px; } 

 /* website */
 #website .sub_bnr .title h1 { padding-top: 60px; } 
 #website .sub_bnr .shapeBox .cube { width: 300px; height: 300px; } 
 #website .sub_bnr .shapeBox .circle_right { width: 200px; height: 330px; } 
 #website .sub_bnr .shapeBox .cube_top { width: 120px; height: 75px; } 
 #website .sub_bnr .shapeBox .cube_bot { width: 50px; height: 50px; } 

 /* design */
 #design .sub_bnr .shapeBox .cube { width: 550px; height: 460px; } 
 #design .sub_bnr .shapeBox .circle_left { width: 335px; height: 300px; top: 0; } 
 #design .sub_bnr .shapeBox .circle_right { width: 150px; height: 150px; } 
 #design .sub_bnr .shapeBox .cube_bot { width: 80px; height: 80px; } 
 
 /* marketing */
 #marketing .sub_bnr .title h1 { padding-top: 40px; } 
 #marketing .sub_bnr .shapeBox .cube { width: 350px; height: 650px; } 
 #marketing .sub_bnr .shapeBox .cube_top { width: 500px; height: 150px; } 

 /* seo */
 #seo .sub_bnr .shapeBox .cube { width: 400px; height: 500px; } 
 #seo .sub_bnr .shapeBox .cube_top { width: 235px; height: 180px; } 
 #seo .sub_bnr .shapeBox .cube_bot { width: 150px; height: 210px; } 


 .service .title h2 { font-size: 50px; } 
 .service ul li .text .b_tag h3 { font-size: 40px; } 
 .service>span { font-size: 40px } 

 .service ul li .text .p_tag { font-size:22px; } 
 
 .process .title h2 { font-size: 50px; } 
 .process ul li .num p { font-size: 20px; width: 40px; height: 40px; line-height: 40px; } 
 .process ul li .text .b_tag h3 { font-size: 22px; } 
 .contact_btn { font-size: 20px; } 
 } 

@media all and (max-width:1024px) { 
 .sub_bnr .title h1 { font-size: 60px; padding-top: 80px; } 
 .sub_bnr .title p { font-size: 18px; } 
 .sub_bnr .shapeBox .cube { width: 350px; height: 350px; } 
 .sub_bnr .shapeBox .circle_left { width: 350px; height: 350px; top: -15%; } 
 .sub_bnr .shapeBox .circle_right { width: 350px; height: 350px; } 
 .sub_bnr .shapeBox .spring_top { width: 500px; height: 500px; top: -10%; } 
 .sub_bnr .shapeBox .spring_bot { width: 500px; height: 500px; } 

 /* website */
 #website .sub_bnr .title h1 { padding-top: 40px; } 
 #website .sub_bnr .shapeBox .cube { width: 250px; height: 250px; top: 80%; left: 80%; } 
 #website .sub_bnr .shapeBox .circle_right { width: 150px; height: 280px; top: 25%; left: 70%; } 
 #website .sub_bnr .shapeBox .cube_top { width: 100px; height: 55px; top: 20%; } 


 /* design */
 #design .sub_bnr .shapeBox .cube { width: 450px; height: 375px; top: 35%; } 
 #design .sub_bnr .shapeBox .circle_left { width: 280px; height: 250px; } 
 #design .sub_bnr .shapeBox .circle_right { width: 100px; height: 100px; left: 75%; } 
 #design .sub_bnr .shapeBox .cube_top { width: 30px; height: 30px; left: 10%; } 
 #design .sub_bnr .shapeBox .cube_bot { width: 60px; height: 60px; left: 15%; } 


 /* marketing */
 #marketing .sub_bnr .shapeBox .cube { width: 300px; height: 600px; top: 80%; left: 75%; } 
 #marketing .sub_bnr .shapeBox .circle_right { width: 80px; height: 200px; top: 45%; left: 92%; } 
 #marketing .sub_bnr .shapeBox .cube_bot { width: 100px; height: 130px; } 


 /* seo */
 #seo .sub_bnr .title h1 { padding-top: 40px; } 
 #seo .sub_bnr .shapeBox .cube { width: 350px; height: 450px; } 
 #seo .sub_bnr .shapeBox .cube_top { width: 195px; height: 150px; } 
 #seo .sub_bnr .shapeBox .cube_bot { width: 120px; height: 165px; } 


 .service { padding: 100px 0; } 
 .service .title { margin-bottom:70px; } 
 .service .title h2 { font-size: 44px; } 
 .service ul li .text .p_tag { font-size: 19px; } 
 

 
 .process { padding: 100px 0; } 
 .process .title { margin-bottom:70px; } 
 .process .title h2 { font-size: 44px; } 
 .process ul li { margin-left: -30px; } 
 .process ul li::after { width: 12px; height: 24px; right: 5px; } 
 .process ul li .num p { font-size: 18px; width: 35px; height: 35px; line-height: 35px; } 
 .process ul li .text .b_tag h3 { font-size: 18px; } 
 .process ul li .icon { width: 120px; } 
 .process ul li:nth-child(3) .icon { width: 100px; } 
 .contact_btn { margin: 80px auto; } 
 #business .contact_btn { margin:100px auto 0; } 
 } 


@media all and (max-width:900px) { 
 .sub_bnr .title h1 { font-size: 50px; padding-top: 60px; } 
 .sub_bnr .title h1 span { font-size: 20px; } 
 .sub_bnr .shapeBox .cube { width: 300px; height: 300px; top: 35%; } 
 .sub_bnr .shapeBox .cube_bot { width: 100px; height: 120px; } 
 .sub_bnr .shapeBox .circle_left { width: 300px; height: 300px; top: -13%; } 
 .sub_bnr .shapeBox .circle_right { width: 300px; height: 300px; top: 85%; } 
 .sub_bnr .shapeBox .spring_top { width: 450px; height: 450px; } 
 .sub_bnr .shapeBox .spring_bot { width: 450px; height: 450px; } 
 

 .service { padding: 120px 0 100px 0; } 
 .service ul li { margin-bottom: 100px; flex-direction: column; gap: 40px; } 
 .service ul li.right { flex-direction: column; } 
 .service ul li .text,
 .service ul li.right .text { text-align: center; } 
 .service ul li .text .b_tag h3 { font-size: 32px; margin-bottom: 20px; } 
 .service>span { font-size: 32px; } 

 .service ul li .text .p_tag { font-size:20px; } 
 .service ul li .text .p_tag span.mb { display: block; } 
 .service ul li>img { width: 150px; } 

 .process { padding: 20px 0 100px 0; } 
 .process ul { flex-direction: column; gap: 40px; } 
 .process ul li { width: auto; padding: 40px; margin-left: 0; } 
 .process ul li::after { top: inherit; right:inherit; bottom: -32px; left: 50%; transform: translateX(-50%) rotate(90deg); } 
 } 




@media all and (max-width:768px) { 
 .sub_bnr .title { padding-left: 0px; width: 90%; margin: 0 auto; } 
 .sub_bnr .title h1 { font-size: 50px; padding-top: 60px; line-height: 1.2; } 
 .sub_bnr .title h1 span { margin-top: 20px; } 
 .sub_bnr .title p { margin-top: 40px; font-size: 18px; } 
 .sub_bnr .title p span.mb { display: block; padding-top: 10px; } 
 .sub_bnr .shapeBox .cube { width: 150px; height: 150px; top: 25%; left: 85%; } 
 .sub_bnr .shapeBox .circle_left { width: 200px; height: 200px; } 
 .sub_bnr .shapeBox .circle_right { width: 250px; height: 250px; } 
 .sub_bnr .shapeBox .spring_top { width: 350px; height: 350px; top: -15%; } 
 .sub_bnr .shapeBox .spring_bot { width: 300px; height: 300px; } 


 #solution .sub_bnr .title h1 { background-size: 50%; } 
 /* website */
 #website .sub_bnr .title h1 { background-size: contain; } 
 #website .sub_bnr .shapeBox .cube { width: 200px; height: 200px; } 
 #website .sub_bnr .shapeBox .circle_right { width: 100px; height: 230px; top: 20%; left: 70%; } 
 #website .sub_bnr .shapeBox .cube_top { width: 80px; height: 35px; top: 20%; } 
 #website .sub_bnr .shapeBox .cube_bot { width: 40px; height: 40px; } 


 /* design */
 #design .sub_bnr .title h1 { background-size: contain; } 
 #design .sub_bnr .shapeBox .cube { width: 250px; height: 210px; top: 25%; } 
 #design .sub_bnr .shapeBox .circle_left { width: 200px; height: 175px; } 
 #design .sub_bnr .shapeBox .circle_right { width: 80px; height: 80px; left: 80%; } 

 /* marketing */
 #marketing .sub_bnr .title h1 { background-size: contain; } 
 #marketing .sub_bnr .shapeBox .cube { width: 250px; height: 400px; } 
 #marketing .sub_bnr .shapeBox .circle_right { width: 100px; height: 160px; top: 15%; left: 80%; background-image: url('/img/marketing_img03_m.png'); } 
 #marketing .sub_bnr .shapeBox .cube_bot { width: 80px; height: 100px; } 
 #marketing .sub_bnr .shapeBox .cube_top { width: 400px; } 

 /* seo */
 #seo .sub_bnr .title h1 { padding-top: 60px; line-height: 1; } 
 #seo .sub_bnr .shapeBox .cube { width: 250px; height: 350px; top: 75%; } 
 #seo .sub_bnr .shapeBox .cube_bot { width: 100px; height: 135px; left: 15%; } 


 .service .title h2 { font-size: 38px; } 
 .service ul li .text .b_tag h3 { font-size: 28px; } 
 .service>span { font-size: 20px; } 
 .service ul li .text .p_tag { font-size:18px; } 
 .service ul li .text .p_tag br { display: none; } 
 .service ul li>img { width: 100px; } 
 
 .process .title h2 { font-size: 38px; } 
 .process .title h2 span.mb { display: block; } 
 .process ul li { width: 300px; height: 100%; padding: 30px; } 
 } 

@media all and (max-width:600px) { 
 .sub_bnr .title p br { display: none; } 
 } 

@media all and (max-width:500px) { 
 .sub_bnr .title h1 { font-size: 44px; padding-top: 100px; } 
 .sub_bnr .shapeBox .cube { width: 80px; height: 80px; top: 20%; left: 75%; } 
 .sub_bnr .shapeBox .circle_right { width: 200px; height: 200px; } 
 .sub_bnr .shapeBox .spring_top { width: 300px; height: 300px; top: -10%; } 
 .sub_bnr .shapeBox .spring_bot { width: 200px; height: 200px; top: 90%; } 

 /* website */
 #website .sub_bnr .title h1 { padding-top: 20px; } 
 #website .sub_bnr .shapeBox .cube { width: 150px; height: 150px; } 
 #website .sub_bnr .shapeBox .circle_right { width: 80px; height: 210px; top: 20%; left: 70%; } 
 #website .sub_bnr .shapeBox .cube_top { top: 15%; } 
 #website .sub_bnr .shapeBox .cube_bot { width: 40px; height: 40px; } 


 /* design */
 #design .sub_bnr .title h1 { padding-top: 15px; } 
 #design .sub_bnr .shapeBox .cube { width: 200px; height: 165px; top: 25%; } 
 #design .sub_bnr .shapeBox .cube_bot { width: 50px; height: 50px; top: 80%; } 
 #design .sub_bnr .shapeBox .circle_left { width: 100px; height: 85px; } 
 #design .sub_bnr .shapeBox .circle_right { width: 60px; height: 60px; left: 75%; } 

 /* marketing */
 #marketing .sub_bnr .title h1 { padding-top: 20px; } 
 #marketing .sub_bnr .shapeBox .cube { width: 150px; height: 300px; top: 90%; } 
 #marketing .sub_bnr .shapeBox .circle_right { width: 50px; height: 80px; } 
 #marketing .sub_bnr .shapeBox .cube_bot { width: 50px; height: 65px; top: 75%; } 
 #marketing .sub_bnr .shapeBox .cube_top { width: 200px; top: 10%; } 

 /* seo */
 #seo .sub_bnr .shapeBox .cube { width: 180px; height: 210px; } 
 #seo .sub_bnr .shapeBox .cube_bot { width: 70px; height: 100px; left: 15%; } 


 .service .title h2 { font-size: 30px; } 
 .service ul li .text .b_tag h3 { font-size: 24px; } 
 .process .title h2 { font-size: 30px; } 
 .process ul li { width: 250px; } 
 .process ul li .icon { width: 100px; } 
 .process ul li:nth-child(3) .icon { width: 80px; } 

 .contact_btn { width: calc(100% - 40px); max-width: unset; } 
 } 

@media all and (max-width:380px) { 
 .sub_bnr .title p { font-size: 16px; } 

 .service ul li .text .p_tag { font-size:16px; } 
 } 

/* business 하위메뉴 끝 */




/* portlio 시작 */
#portfolio { overflow-x: hidden; } 
#portfolio .portfolio_admin { width: 200px; display: block; position: fixed; bottom: 220px; right: 20px; z-index: 999998; cursor: pointer; font-size: 15px; } 
#portfolio .visual { } 
#portfolio .visual ul { position: relative; top: 0; left: 0; overflow: hidden; height: 150vh; } 
#portfolio .visual ul li { position: absolute; width: 16.666666%; overflow: hidden; display: flex; flex-flow: column; padding-right: 10px; } 
#portfolio .visual ul li:first-child { padding-left: 10px; } 
#portfolio .visual ul li:nth-child(1) { left: 0; } 
#portfolio .visual ul li:nth-child(2) { left: 16.666666%; } 
#portfolio .visual ul li:nth-child(3) { left: 33.333332%; } 
#portfolio .visual ul li:nth-child(4) { left: 49.999998%; } 
#portfolio .visual ul li:nth-child(5) { left: 66.666664%; } 
#portfolio .visual ul li:nth-child(6) { left: 83.33333%; } 
#portfolio .visual ul li:nth-child(2n-1) { top: -30%; } 
#portfolio .visual ul li:nth-child(2n) { top: 0%; } 
#portfolio .visual ul li img { width: 100%; margin-bottom: 10px; } 
#portfolio .text_visual { } 
#portfolio .text_visual.pc { display: block; } 
#portfolio .text_visual.mo { display: none; } 
#portfolio .left_text { position: relative; top: 0; left:-60%; font-size: 100px; color: #fff; font-weight: 400; width: fit-content; } 
#portfolio .center_1 { opacity: 0; font-size: 60px; color: #fff; text-align: center; line-height: 30vh; font-weight: 600; } 
#portfolio .center_2 { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 150px; width: 15px; background: #fff; opacity: 0; } 
#portfolio .right_text { position: relative; bottom: 0; left: 120%; font-size: 100px; color: #fff; font-weight: 400; width: fit-content; } 
#portfolio .list { width: calc(100% - 40px); max-width: 1600px; margin: 0 auto; } 
#portfolio .list .content { } 
#portfolio .list .content2 { display: none; } 
#portfolio .list .content ul { } 
#portfolio .list .content ul li { padding: 50px; } 
#portfolio .list .content ul li .wrap { } 
#portfolio .list .content ul li .wrap img { } 
#portfolio .list .content ul li .wrap>b { color: #fff; font-size: 30px; font-weight: 500; line-height: 30px; margin-bottom: 20px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 
#portfolio .list .content ul li .wrap>p { color: #fff; font-weight: 300; line-height: 22px; margin-top: 25px; justify-content: space-between; align-items: center; } 
#portfolio .list .content ul li .wrap>p span:nth-child(1) { font-size: 22px; display: block; width: calc(100% - 190px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 
#portfolio .list .content ul li .wrap>p span:nth-child(2) { font-size: 20px; } 
#portfolio .list .btn_wrap { width: 100%; } 
#portfolio .list .btn_wrap ul { width: calc(100% - 40px); max-width: 585px; justify-content: space-between; margin: 0 auto 50px; } 
#portfolio .list .btn_wrap ul li { width: calc(50% - 10px); font-size: 20px; background: #0b0b126b; } 
#portfolio .list .btn_wrap ul li.atv { background:#fff !important; color: #000 !important; font-weight: 600; } 
#portfolio .list>p { display: block; width: calc(100% - 40px); max-width: 585px; font-size: 20px; background: #0b0b126b; margin: 0 auto; } 
#portfolio #ajaxBox { display: none; position: fixed; top:0; left: 0; width: 100%; height: 100%; z-index: 999999; } 
#portfolio #ajaxBox::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #00000073; backdrop-filter: blur(2px); display: block; } 
#portfolio #ajaxBox .wrap { position: absolute; right:calc(-100% + 33.33333%); width: calc(100% - 33.33333%); min-width: 300px; top: 0; height: 100%; background: #fff; justify-content: space-between; } 
#portfolio #ajaxBox .wrap.atv { animation:right 0.3s both; } 
#portfolio #ajaxBox .wrap .close_btn { position: absolute; top: 50px; right: 50px; width: 35px; height: 35px; cursor: pointer; } 
#portfolio #ajaxBox .wrap .close_btn span { width: 3px; height: 35px; background: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
#portfolio #ajaxBox .wrap .close_btn span:nth-child(1) { transform: translate(-50%, -50%) rotate(45deg); } 
#portfolio #ajaxBox .wrap .close_btn span:nth-child(2) { transform: translate(-50%, -50%) rotate(-45deg); } 
#portfolio #ajaxBox .wrap .left { width: 50%; max-height: 100%; overflow-y: auto; } 
#portfolio #ajaxBox .wrap .left::-webkit-scrollbar { width: 10px; } 
#portfolio #ajaxBox .wrap .left::-webkit-scrollbar-thumb { background-color: #2f3542; } 
#portfolio #ajaxBox .wrap .left::-webkit-scrollbar-track { background-color: grey; } 
#portfolio #ajaxBox .wrap .left img { width: 100%; cursor: pointer; } 
#portfolio #ajaxBox .wrap .right { width: 50%; padding: 70px; max-height: 100%; overflow-y: auto; background: #111111; } 
#portfolio #ajaxBox .wrap .right::-webkit-scrollbar { width: 10px; } 
#portfolio #ajaxBox .wrap .right::-webkit-scrollbar-thumb { background-color: #2f3542; } 
#portfolio #ajaxBox .wrap .right::-webkit-scrollbar-track { background-color: grey; } 
#portfolio #ajaxBox .wrap .right>p { color: #fff !important; font-size: 18px; line-height: 18px; margin-bottom: 30px; } 
#portfolio #ajaxBox .wrap .right>b { color: #fff !important; font-size: 40px; line-height: 40px; margin-bottom: 25px; display: block; } 
#portfolio #ajaxBox .wrap .right>span { color: #fff !important; font-size: 20px; } 
#portfolio #ajaxBox .wrap .right>div { color: #fff !important; margin-top: 50px; padding-top: 50px; border-top: 1px solid #D9D9D9; } 
#portfolio #ajaxBox .wrap .right>div p,
#portfolio #ajaxBox .wrap .right>div span,
#portfolio #ajaxBox .wrap .right>div h1,
#portfolio #ajaxBox .wrap .right>div h2,
#portfolio #ajaxBox .wrap .right>div h3,
#portfolio #ajaxBox .wrap .right>div h4,
#portfolio #ajaxBox .wrap .right>div h5,
#portfolio #ajaxBox .wrap .right>div h6,
#portfolio #ajaxBox .wrap .right>div b,
#portfolio #ajaxBox .wrap .right>div a { word-break: keep-all !important; } 
#portfolio #ajaxBox .wrap .right>a { color: #fff !important; font-size: 16px; margin-top: 50px; display: block; text-align: right; height: 50px; line-height: 50px; } 
@-webkit-keyframes right { 
 0% { 
 right:calc(-100% + 33.33333%)
 } 
 100% { 
 right: 0; 
 } 
 } 
#portfolio .btnBox { width: calc(100% - 40px); max-width: 585px; justify-content: space-between; margin: 50px auto 0px; display: flex; } 
#portfolio .btnBox p { width: calc(50% - 10px); font-size: 20px; background: #0b0b126b; } 
#portfolio .btnBox p.atv { background:#fff !important; color: #000 !important; font-weight: 600; } 

@media screen and (max-width:1200px) { 
 #portfolio { } 
 #portfolio .text_visual { padding: 200px 0 50px; } 
 #portfolio .text_visual.pc { display: none; } 
 #portfolio .text_visual.mo { display: block; } 
 #portfolio .visual ul { height: 80vh; } 
 #portfolio .visual ul li { width: 20%; } 
 #portfolio .visual ul li:nth-child(2) { left: 20%; } 
 #portfolio .visual ul li:nth-child(3) { left: 40%; } 
 #portfolio .visual ul li:nth-child(4) { left: 60%; } 
 #portfolio .visual ul li:nth-child(5) { left: 80%; } 
 #portfolio .visual ul li:nth-child(6) { display: none !important; } 
 #portfolio .left_text { left: 0; position: unset; width: 100%; text-align: center; font-size: 60px; line-height: 60px; } 
 #portfolio .center_1 { opacity: 1; font-size: 30px; line-height: unset; padding: 20px 0 15px; font-weight: 300; } 
 #portfolio .right_text { left: 0; position: unset; width: 100%; text-align: center; font-size: 60px; line-height: 60px; } 
 #portfolio .list .content ul li .wrap>b { font-size: 25px; line-height: 25px; } 
 #portfolio .list .content ul li .wrap>p span:nth-child(1) { font-size: 20px; width: calc(100% - 180px); } 
 #portfolio .list .content ul li .wrap>p span:nth-child(2) { font-size: 18px; } 
 #portfolio #ajaxBox .wrap { width: 100%; right: -100%; } 
 #portfolio #ajaxBox .wrap .right { padding: 50px; } 
 #portfolio #ajaxBox .wrap .right>b { font-size: 30px; line-height: 30px; margin-bottom: 10px; } 
 #portfolio #ajaxBox .wrap .right>span { font-size: 20px; } 
 #portfolio #ajaxBox .wrap .right>a { margin-top: 30px; } 
 } 
@media screen and (max-width:1000px) { 
 #portfolio { } 
 #portfolio .list .content ul li { padding: 30px; } 
 #portfolio .list .content ul li .wrap>b { font-size: 20px; line-height: 20px; margin-bottom: 15px; } 
 #portfolio .list .content ul li .wrap>p { margin-top: 15px; } 
 #portfolio .list .content ul li .wrap>p span:nth-child(1) { font-size: 17px; } 
 #portfolio .list .content ul li .wrap>p span:nth-child(2) { font-size: 15px; } 
 } 
@media screen and (max-width:900px) { 
 #portfolio { } 
 #portfolio .portfolio_admin { width: 150px; bottom: 120px; } 
 #portfolio .visual ul { height: 60vh; } 
 #portfolio .visual ul li { width: 25%; } 
 #portfolio .visual ul li:nth-child(2) { left: 25%; } 
 #portfolio .visual ul li:nth-child(3) { left: 50%; } 
 #portfolio .visual ul li:nth-child(4) { left: 75%; } 
 #portfolio .visual ul li:nth-child(5) { display: none !important; } 
 #portfolio .left_text { font-size: 40px; line-height: 40px; padding: 0 20px; } 
 #portfolio .center_1 { font-size: 20px; padding: 10px 20px 10px; } 
 #portfolio .right_text { font-size: 40px; line-height: 40px; padding: 0 20px; } 
 #portfolio .list .content ul li { width: 100% !important; flex:unset !important; max-width: unset !important; } 
 #portfolio .list .content ul li .wrap>b { font-size: 20px; line-height: 20px; margin-bottom: 15px; } 
 #portfolio .list .content ul li .wrap>p { margin-top: 15px; } 
 #portfolio .list .content ul li .wrap>p span:nth-child(1) { font-size: 17px; width: calc(100% - 150px); } 
 #portfolio .list .content ul li .wrap>p span:nth-child(2) { font-size: 15px; } 
 #portfolio .list .btn_wrap ul { max-width: 500px; } 
 #portfolio .btnBox { max-width: 500px; } 
 #portfolio #ajaxBox .wrap .right { padding: 20px; } 
 #portfolio #ajaxBox .wrap .close_btn { top: 10px; right: 10px; } 
 #portfolio #ajaxBox .wrap .close_btn span { height: 20PX; } 
 #portfolio #ajaxBox .wrap .right>p { font-size: 15px; margin-bottom: 20px; } 
 #portfolio #ajaxBox .wrap .right>b { font-size: 20px; line-height: 20px; } 
 #portfolio #ajaxBox .wrap .right>span { font-size: 15px; } 
 #portfolio #ajaxBox .wrap .right>div { margin-top: 30px; padding-top: 30px; } 
 #portfolio #ajaxBox .wrap .right>a { font-size: 15px; } 
 
 
 } 
@media screen and (max-width:700px) { 
 #portfolio .text_visual { padding: 100px 0 50px; } 
 #portfolio .left_text { font-size: 30px; line-height: 30px; } 
 #portfolio .center_1 { font-size: 17px; } 
 #portfolio .right_text { font-size: 30px; line-height: 30px; } 
 #portfolio #ajaxBox .wrap { flex-flow: row wrap; } 
 #portfolio #ajaxBox .wrap .left { width: 100% !important; height: 40%; } 
 #portfolio #ajaxBox .wrap .right { width: 100%; height: 60%; } 
 #portfolio .list .btn_wrap ul { max-width: 400px; } 
 #portfolio .btnBox { max-width: 400px; } 
 } 
@media screen and (max-width:500px) { 
 #portfolio .visual ul li { width: 33.333333%; } 
 #portfolio .visual ul li:nth-child(2) { left: 33.333333%; } 
 #portfolio .visual ul li:nth-child(3) { left: 66.666666%; } 
 #portfolio .visual ul li:nth-child(4) { display: none !important; } 
 #portfolio .text_visual { padding: 50px 0 50px; } 
 #portfolio .left_text { font-size: 20px; line-height: 20px; } 
 #portfolio .center_1 { font-size: 15px; } 
 #portfolio .right_text { font-size: 20px; line-height: 20px; } 
 #portfolio .list .content ul li { padding: 20px 10px; } 
 #portfolio .list .content ul li .wrap>p span:nth-child(1) { opacity: 0; } 
 #portfolio { padding-bottom: 0px; } 
 } 
/* portlio 끝 */







/* about 시작 */
#about { } 
#about .visual.pc { width: 100%; padding: 30px 0; display: block; } 
#about .visual.mo { display: none; } 
#about .visual .left_text { font-size: 70px; color: #fff; position: absolute; top: -25px; left: 0; z-index: 1; } 
#about .visual .right_text { font-size: 70px; color: #fff; position: absolute; bottom: -22px; right: 0; } 
#about .visual .img { width: 100%; height: 700px; position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%); background-image: url(/../../img/about_bg_main.png); background-size: cover; background-repeat: no-repeat; background-position: center bottom; } 
#about .bg_change { margin-top: 100px; } 
#about .bg_change .content { } 
#about .bg_change .content ul { position: relative; width: 100vw; height: 100vh; background-image: url(/../../img/about_bg.png); background-size: cover; background-repeat: no-repeat; background-position: center; } 
#about .bg_change .content ul li { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 220px); height: calc(100% - 220px); max-width: 1000px; opacity: 0; } 
#about .bg_change .content ul li:nth-child(1) { background-image: url(/../../img/about_bg1.png); background-size: cover; background-repeat: no-repeat; background-position: center; } 
#about .bg_change .content ul li:nth-child(2) { background-image: url(/../../img/about_bg2.png); background-size: cover; background-repeat: no-repeat; background-position: center; } 
#about .bg_change .content ul li:nth-child(3) { background-image: url(/../../img/about_bg3.png); background-size: cover; background-repeat: no-repeat; background-position: center; } 
#about .bg_change .content ul li:nth-child(4) { background-image: url(/../../img/about_bg4.png); background-size: cover; background-repeat: no-repeat; background-position: center; } 
#about .bg_change .content ul li b { font-size: 60px; color: #fff; text-align: center; position: absolute; top: 50%; left: calc(50% - 50px); transform: translate(-50%, -50%); width: 100%; word-break: keep-all; font-weight: 500; } 
#about .bg_change .content ul li b.pc { display: block; } 
#about .bg_change .content ul li b.mo { display: none; } 
.select_title { font-size: 70px; color: #fff; font-weight: 400; margin-top: 180px; margin-bottom: 100px; display: block; } 
#about .org { width: calc(100% - 40px); max-width: 1600px; margin: 0 auto; } 
#about .org .wrap { width: 100%; max-width: 1500px; } 
#about .org .main { position: relative; top: 0; left: 0; } 
#about .org .main .part { color: #fff; font-weight: 500; border: 1px solid #ffffff73; background: #3c3c41 !important; font-size: 25px; width: 250px; display: block; text-align: center; height: 80px; line-height: 78px; } 
#about .org .main li { margin-bottom: 80px; } 
#about .org .main li:last-child { margin-bottom: 0px; } 
#about .org .main li b { position: relative; top: 0; left: 0; } 
#about .org .main li b.point { font-size: 30px; border-radius: 50px; font-weight: 600; border: none; background: #2929AA !important; } 
#about .org .main li b::after { content:""; position: absolute; bottom: -80px; width: 1px; height: 80px; background: #ffffff73; left: 50%; transform: translateX(-50%); } 
#about .org .main li:nth-child(2) b::after,
#about .org .main li:nth-child(4) b::after { display: none; } 
#about .org .main li:nth-child(4) { position: relative; top: 0; left: 0; } 
#about .org .main li:nth-child(4)::before { content: ""; position: absolute; width: calc(100% - 75px); height: 1px; background: #ffffff73; top: 50%; left: 0; transform: translateY(-50%); } 
#about .org .main li.add { position: absolute; top: 80px; left: 364px; } 
#about .org .main li.add b { background: unset !important; } 
#about .org .main li.add b::before { content: ""; position: absolute; width: calc(100% - 10px); height: 1px; background: #ffffff73; top: 50%; left: -96%; transform: translateY(-50%); } 
#about .org .main li.add b::after { background-image: url(/../../img/about_icon1.png); content: ""; position: absolute; left: 50%; transform: translateX(-50%); width: 30%; height: auto; top: -50px; aspect-ratio: auto 1 / 1; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 1; display: block; background-color: unset; bottom: unset; } 
#about .org .sub { width: 100%; justify-content: space-between; align-items: center; padding-left: 330px; padding-top: 41px; } 
#about .org .sub .part { color: #fff; font-weight: 500; border: 1px solid #ffffff73; font-size: 22px; width: 150px; height: 150px; display: block; position: relative; top: 0; left: 0; border-radius: 80px; } 
#about .org .sub .part span { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; text-align: center; width: 100%; } 
#about .org .sub li { } 
#about .org .sub li b { position: relative; top: 0; left: 0; margin-bottom: 30px; } 
#about .org .sub li b::after { content:""; position: absolute; top: -81px; width: 1px; height: 80px; background: #ffffff73; left: 50%; transform: translateX(-50%); } 
#about .org .sub li:nth-child(1) b::before { background-image:url(/../../img/about_icon2.png); content: ""; position: absolute; left: 50%; transform: translateX(-50%); width: 50%; height: auto; top: -30px; aspect-ratio: auto 1 / 1; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 1; } 
#about .org .sub li:nth-child(2) b::before { background-image:url(/../../img/about_icon3.png); content: ""; position: absolute; left: 50%; transform: translateX(-50%); width: 50%; height: auto; top: -30px; aspect-ratio: auto 1 / 1; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 1; } 
#about .org .sub li:nth-child(3) b::before { background-image:url(/../../img/about_icon4.png); content: ""; position: absolute; left: 50%; transform: translateX(-50%); width: 50%; height: auto; top: -30px; aspect-ratio: auto 1 / 1; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 1; } 
#about .org .sub li:nth-child(4) b::before { background-image:url(/../../img/about_icon5.png); content: ""; position: absolute; left: 50%; transform: translateX(-50%); width: 50%; height: auto; top: -30px; aspect-ratio: auto 1 / 1; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 1; } 
#about .org .sub li:nth-child(5) b::before { background-image:url(/../../img/about_icon6.png); content: ""; position: absolute; left: 50%; transform: translateX(-50%); width: 50%; height: auto; top: -30px; aspect-ratio: auto 1 / 1; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 1; } 
#about .org .sub li>p { font-size: 18px; color: #fff; align-items: center; font-weight: 200; word-break: keep-all; } 
#about .org .sub li>p>span { width: 5px; height: 5px; border-radius: 5px; background: #fff; margin-right: 12px; } 
#about .office { width: calc(100% - 40px); max-width: 1600px; margin: 0 auto; } 
#about .office ul { flex-flow: column; height: 600px; } 
#about .office ul li { width: 100%; height: 50%; position: relative; top: 0; left: 0; } 
#about .office ul li iframe { width: 100%; height: 100%; } 
#about .office ul li>div.text_wrap { position: absolute; top: 0; right: 0; width: 40%; height: 100%; background: #000000a6; display: flex; padding: 0 80px; } 
#about .office ul li:nth-child(1) div.text_wrap { border-bottom: 1px solid #ffffff8a; padding-bottom: 50px; align-items: flex-end; } 
#about .office ul li:nth-child(2) div.text_wrap { padding-top: 50px; align-items:flex-start } 
#about .office ul li>div.text_wrap div { } 
#about .office ul li>div.text_wrap b { font-size: 25px; color: #fff; font-weight: 600; margin-bottom: 20px; display: block; line-height: 25px; } 
#about .office ul li>div.text_wrap p { font-size: 20px; color: #fff; font-weight: 300; line-height: 20px; margin-bottom: 15px; word-break: keep-all; display: flex; } 
#about .office ul li>div.text_wrap p:last-child { margin-bottom: 0px; } 
#about .office ul li>div.text_wrap span { padding-right: 25px; } 
@media screen and (max-width:1600px) { 
 #about { } 
 #about .visual.pc { display: none; } 
 #about .visual.mo { display: block; } 
 #about .visual { position: relative; top: 0; left: 0; height: 500px; } 
 #about .visual .img { height: 100%; } 
 #about .visual .left_text { font-size: 60px; top: 130px; left: 50%; transform: translateX(-50%); width: 100%; text-align: center; } 
 #about .visual .right_text { font-size: 60px; bottom: 200px; left: 50%; transform: translateX(-50%); width: 100%; text-align: center; } 
 #about .bg_change { margin-top: 0; } 
 #about .bg_change .content { } 
 #about .bg_change .content ul { position: unset; display: flex; justify-content: space-between; align-items: center; flex-flow: row wrap; height: fit-content !important; } 
 #about .bg_change .content ul li { opacity: 1; position: unset; width: 100%; transform:unset; max-width: unset; height: 500px; display: flex; justify-content: center; align-items: center; } 
 #about .bg_change .content ul li b { font-size: 50px; position: unset; transform: translate(0, 0); } 
 #about .bg_change .content ul li b.pc { display: none; } 
 #about .bg_change .content ul li b.mo { display: block; } 
 .select_title { font-size: 60px; margin-bottom: 50px; } 
 #about .org .main li { margin-bottom: 50px; } 
 #about .org .main .part { font-size: 18px; width:180px; height: 60px; line-height: 58px; } 
 #about .org .main li.add { top: 54px; left: 258px; } 
 #about .org .main li.add b::before { left: -95%; } 
 #about .org .main li.add b::after { top: -40px; } 
 #about .org .main li b.point { font-size: 20px; } 
 #about .org .main li b::after { height: 50px; bottom: -51px; } 
 #about .org .sub { padding-top: 20px; padding-left: 230px; } 
 #about .org .sub .part { font-size: 16px; width: 100px; height: 100px; } 
 #about .org .sub .part span { line-height: 19px; } 
 #about .org .sub li { width:20%; } 
 #about .org .sub li b { margin-bottom: 15px; } 
 #about .org .sub li b::after { height: 50px; top: -50px; } 
 #about .org .sub li>p { font-size: 15px; } 
 #about .office ul li>div.text_wrap b { font-size: 20px; } 
 #about .office ul li>div.text_wrap p { font-size: 17px; margin-bottom: 5px; } 
 } 
@media screen and (max-width:1000px) { 
 #about .visual { height: 300px; } 
 #about .visual .img { width: 100%; height: 500px; position: absolute; top: 19%; } 
 #about .visual .left_text { font-size: 50px; top: 30px; } 
 #about .visual .right_text { font-size: 50px; bottom: 130px; } 
 #about .bg_change .content ul li { height: 300px; } 
 #about .bg_change .content ul li b { font-size: 35px; line-height: 45px; } 
 .select_title { margin-top: 100px; font-size: 50px; } 
 #about .org .main li:nth-child(4)::before { width: 281px; } 
 #about .org .sub { flex-flow: row wrap; padding-top: 0; } 
 #about .org .sub li { width: 100%; position: relative; top: 0; left: 0; } 
 #about .org .sub .part { margin-bottom: 30px; } 
 #about .org .sub li b::after { height: 28px; top: -30px; } 
 #about .org .main li.add b::after { top: -20px; width: 20%; } 
 #about .org .sub li:nth-child(1) b::before { width: 40%; top: -10px; transform: unset; left: unset; right: 0; } 
 #about .org .sub li:nth-child(2) b::before { width: 40%; top: -10px; transform: unset; left: unset; right: 0; } 
 #about .org .sub li:nth-child(3) b::before { width: 40%; top: -10px; transform: unset; left: unset; right: 0; } 
 #about .org .sub li:nth-child(4) b::before { width: 40%; top: -10px; transform: unset; left: unset; right: 0; } 
 #about .org .sub li:nth-child(5) b::before { width: 40%; top: -10px; transform: unset; left: unset; right: 0; } 
 #about .org .sub li>p { position: absolute; left: 120px; top: 30px; } 
 #about .org .sub li>p:last-child { top: 50px; } 
 #about .office ul { height: 800px; gap: 20px; } 
 #about .office ul li>div.text_wrap { width: 100%; height: fit-content; padding: 20px !important; border: unset !important; align-items:unset !important; top: unset; bottom: 0; } 
 #about .office ul li>div.text_wrap b { font-size: 17px; } 
 #about .office ul li>div.text_wrap p { font-size: 15px; display: flex; } 
 #about .office ul li>div.text_wrap span { width: 55px; } 
 } 
@media screen and (max-width:700px) { 
 #about .visual .left_text { font-size: 40px; top: 40px; } 
 #about .visual .right_text { font-size: 40px; bottom: 150px; } 
 #about .bg_change .content ul li { height: 200px; } 
 #about .bg_change .content ul li b { font-size: 25px; line-height: 34px; } 
 .select_title { margin-top: 70px; font-size: 40px; margin-bottom: 30px; } 

 } 
@media screen and (max-width:500px) { 
 #about { } 
 #about .visual .left_text { font-size: 30px; top: 70px; } 
 #about .visual .right_text { font-size: 30px; } 
 #about .bg_change .content ul li b { font-size: 20px; line-height: 30px; } 
 .select_title { margin-top: 50px; margin-bottom: 20px; font-size: 25px; } 
 #about .org .main li b.point { font-size: 18px; } 
 #about .org .main .part { font-size: 16px; width: 120px; } 
 #about .org .main li.add { left: 169px; } 
 #about .org .main li.add b::before { left: -92%; } 
 #about .org .main li.add b::after { width: 30%; } 
 #about .org .sub { padding-left: 135px; } 
 #about .org .main li:nth-child(4)::before { width: 176px; } 
 #about .org .sub .part { font-size: 15px; width: 80px; height: 80px; } 
 #about .org .sub li>p { left: 93px; top: 20px; } 
 #about .org .sub li>p:last-child { top: 40px; } 
 } 
@media screen and (max-width:410px) { 
 #about .org .sub li>p { font-size: 13px; } 
 } 
/* about 끝 */

.ajax_wr4 p { font-size:20px; } 






/* 기본 커서 숨기기 */
body { cursor: none; }

/* 커스텀 커서 */
.custom-cursor { position: fixed; top: 0; left: 0; width: 20px; height: 20px; border-radius: 50%; background: rgba(255, 255, 255, 1); pointer-events: none; z-index: 9999; transform: translate(-50%, -50%); transition: width 0.35s ease, height 0.35s ease, background 0.35s ease, opacity 0.3s ease; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 14px; opacity: 0.9; mix-blend-mode: difference; } 
.custom-cursor span { opacity: 0; transition: opacity 0.25s ease; pointer-events: none; } 
.custom-cursor.active { width: 120px; height: 120px; background: rgba(255, 255, 255, 1); color: #000; } 
.custom-cursor.active span { opacity: 1; } 
.custom-cursor .cursor-dot { width: 20px; height: 20px; background: #000; border-radius: 50%; position: absolute; opacity: 1; transition: opacity 0.2s ease; } 
.custom-cursor .cursor-arrow { width: 5em; opacity: 0; transform: scale(0.6); transition: opacity 0.2s ease, transform 0.3s ease; filter: invert(1); position: absolute; } 
.custom-cursor.show-arrow .cursor-dot { opacity: 0; } 
.custom-cursor.show-arrow .cursor-arrow { opacity: 1; transform: scale(1); } 
.custom-cursor.no-blend.show-arrow .cursor-arrow { filter: invert(0) !important; } 
.custom-cursor.no-blend { mix-blend-mode: normal; }


/* 인트로 */
#introOverlay { position: fixed; inset: 0; background: #000; display: flex; justify-content: center; align-items: center; z-index: 999999999; } 
#introTitle { display: flex; gap: 0 3px; padding: 0; margin: 0; justify-content: center; align-items: flex-end; } 
#introTitle img { display: inline-block; opacity: 0; transform: translateY(-150px); } 



/* 헤더 */
.header { position:fixed; top:0; left:0; z-index:1000; background:transparent; width:100%; box-sizing:border-box; display: flex; align-items: center; justify-content: center; } 
.header-inner { display: flex; justify-content: space-between; align-items: center; padding:20px 40px; width:100% } 
.header-inner .logo { display: flex; align-items: center; justify-content: center; height: 25px; } 
.header-inner .logo a { display:block; height:100% } 
.header-inner .logo a img { height:100% } 

.nav-toggle { display: flex; align-items: center; gap: 10px;width:auto!important } 
.nav-toggle span { color:#fff; font-size:.8em; font-weight:500 ; z-index:10} 
.nav-toggle:hover .dot-wrap { transform: rotate(180deg); transition:.5s } 
.nav-toggle a { display: flex; align-items: center; gap: 5px; } 
.nav-toggle .dot-wrap { width:1em; position:relative; aspect-ratio: 1 / 1; transition:.5s } 
.nav-toggle .dot-wrap span.dot { background:#fff; width:5px; aspect-ratio: 1/1; border-radius:50%; position:absolute; } 
.nav-toggle .dot-wrap span.dot:nth-child(1) { left:0; top:0 } 
.nav-toggle .dot-wrap span.dot:nth-child(2) { right:0; top:0 } 
.nav-toggle .dot-wrap span.dot:nth-child(3) { left:0; bottom:0 } 
.nav-toggle .dot-wrap span.dot:nth-child(4) { right:0; bottom:0 } 

.overlay-nav { position:fixed; top:0; left:0; width:100%; height:100vh; background:#000; color:#fff; display:flex; justify-content:center; align-items:center; transform:translateY(-100%); transition:.4s ease; z-index:900; } 
.overlay-nav.show { transform:translateY(0); } 
.overlay-nav ul { list-style:none; padding:0; margin:0; text-align:center; } 
.overlay-nav li { margin:40px 0; } 
.overlay-nav li a { position:relative } 
.overlay-nav li a:before { position:absolute; width:0; height:5px; left:0; bottom:-20px; content:''; background:#fff; transition:.5s } 
.overlay-nav li a:hover:before { width:100%; transition:.5s; } 
.overlay-nav a { color:#fff; font-size:80px; font-weight:600; text-decoration:none; } 

/* 푸터 */
#footer { position:relative; background:#000; z-index: 101; } 
#footer .footer_info { width: 92%; max-width: 1600px; margin: 0 auto; padding: 200px 0 100px; position: relative; z-index: 2; background: #000; } 
#footer .footer_info .info_top { border-bottom: 2px solid #fff; padding-bottom: 30px; position:relative; } 
#footer .footer_info .info_top p { color: #fff; font-size: 5em; line-height: 1.3; } 
#footer .footer_info .info_top p span { color: #005dff; display: block; font-weight: 900; } 
#footer .footer_info .info_bottom { display: flex; justify-content: flex-end; padding-top:75px; } 
#footer .footer_info .info_bottom > div { display: flex; flex-direction: column; margin-left: 120px; } 
#footer .footer_info .info_bottom > div.color_w { margin-left: 60px; } 
#footer .footer_info .info_bottom > div span { font-size: 15px; color: #919191; margin-bottom: 10px; } 
#footer .footer_info .info_bottom > div span.title { font-size:20px; font-weight:bold; color:#fff; margin-bottom:30px; } 
#footer .footer_info .info_bottom > div.color_w span { color:#fff } 
#footer .footer_logo { display: flex; flex-direction: column; align-items: flex-start; margin: 0 auto; max-width: 1600px; width: 92%; position: sticky; bottom: 0; z-index: 1; padding-top: 100px; } 
#footer .footer_logo img { width:100% } 
#footer .footer_logo .bottom_wrap { display:flex; margin:100px 0; justify-content: space-between; align-items: center; width:100% } 
#footer .footer_logo span { font-size: 1em; color: #fff; opacity: .5; display: block; } 

.fixed_floation_wrap { width:92%; max-width:1600px; position:fixed; left:50%; bottom:50px; transform: translateX(-50%); z-index:100 } 

.tail_floating::after { position: absolute; content: "→"; display: block; color: #fff; font-size: 30px; left: 50%; top: 50%; font-weight: 200; transform: translate(-50%, -50%) rotate(0deg); transition: 0.5s; } 
.tail_floating:hover::after { transform: translate(-50%, -50%) rotate(360deg); } 
@keyframes floating_rotating { 
 from { transform: rotate(-360deg); } 
 to { transform: rotate(0deg); } 
 } 
.tail_floating { position: fixed; bottom: 0; right: 0; z-index: 100; cursor: pointer; z-index: 9999; will-change: transform; } 
.tail_floating .rotating { animation: floating_rotating 15s linear infinite; } 
.tail_floating .rounded-text { width: 120px; height: 120px; text-transform: uppercase; transform: rotate(360deg); color: #fff; font-weight: bold; z-index: -1; } 
textPath.coloring { fill: #fff; font-size: 27px; font-weight: 200; } 
.tail_floating.is-stop { position: absolute; } 

#footer .footer_info .info_top .tail_floating { position:absolute; right:0; bottom:50px; } 


@media(max-width:1024px) { 
.tail_floating .rounded-text { width:100px; height:100px; } 
#footer .footer_info .info_top .tail_floating { bottom:unset; top:0; } 
 } 
@media(max-width:768px) { 
body { font-size:18px; } 
#introTitle { transform: scale(.5); } 
.header-inner { padding:20px 0; width:92% } 
.overlay-nav a { font-size:60px; } 
#footer .footer_info .info_top .tail_floating { top:-50% } 
#footer .footer_info .info_top p { font-size: 3em; } 
#footer .footer_info .info_bottom { flex-direction: column-reverse; align-items: flex-end; text-align: right; } #footer .footer_info { padding:100px 0 } 
 } 

@media(max-width:640px) { body { font-size:16px; } 
.custom-cursor { display:none!important } 
#footer .footer_info { padding: 50px 0; } 
#footer .footer_info .info_top p { font-size: 2.3em; } 
.fixed_floation_wrap { bottom:30px } 
.tail_floating .rounded-text { width:80px; height:80px; } 
#footer .footer_logo { padding-top:60px } 

 } 
@media(max-width:460px) { 
#footer .footer_info .info_top p { font-size:1.8em } 
#footer .footer_logo .bottom_wrap { flex-direction: column; gap:30px; margin:50px 0 100px; } 
#footer .footer_logo .bottom_wrap .motion_top { display: flex; align-items: center; justify-content: center; } 
#footer .footer_logo .bottom_wrap .motion_top img { width:70% } 
 }