@charset "utf-8"; 
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css); 
@font-face { 
font-family:'Nanum Gothic'; 
src:url(fonts/NanumGothic.eot); 
src:local("NanumGothic"), url(fonts/NanumGothic.woff) format('woff'); 
 } 
 .xs-visible { display:none } 
.xs-visible-inline { display:none } 
@media (max-width: 768px) { 
.xs-visible { display:block } 
.xs-visible-inline { display:inline-block } 
.xs-hidden { display:none } 
 } 
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css"); /*pretendard*/



button { border: 0; background-color: unset; padding: 0; } 
a:focus, button:focus { outline: none !important; } 



/* CONTACT US */

.quick_contact { position:fixed; bottom:0; right:0; z-index:15; border-radius: 20px 0px 0px 0px; overflow: hidden; width: 140px; padding: 0 8px; background-color: #fff; } 
.quick_contact * { font-family: "Pretendard"; } 
.quick_contact .tel { color: #FFF; text-align: center; font-size: 16px; font-weight: 700; line-height: 24px; padding: 8px 0; background: #393939; } 
.quick_contact .bttn-txt--circle { overflow: hidden; margin: 0 auto; display: flex; min-height: 56px; justify-content: center; align-items: center; gap: 4px; } 
.quick_contact .bttn-txt--circle .txt { transition: all .34s ease-in-out; color: #2D2D2D; font-size: 16px; line-height: 24px; } 
.quick_contact .bttn-txt--circle .txt:after { content: attr(data-txt); position: absolute; top: 150%; left: 0 } 
.quick_contact .bttn-txt--circle .icon { display: block; width: 20px; height: 20px; overflow: hidden; position: relative; } 
.quick_contact .bttn-txt--circle .icon:before,.quick_contact .bttn-txt--circle .icon:after { width: 20px; height: 20px; content: ""; position: absolute; top: 50%; left: 50%; transition: all .34s ease-in-out; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M3.9585 10L16.0418 10' stroke='%23444444' stroke-linecap='round'/%3E%3Cpath d='M11.3276 14.7139L16.0417 9.99982' stroke='%23444444' stroke-linecap='round'/%3E%3Cpath d='M11.3276 5.28613L16.0417 10.0002' stroke='%23444444' stroke-linecap='round'/%3E%3C/svg%3E") transparent 50% 50%/cover no-repeat } 
.quick_contact .bttn-txt--circle .icon:before { transform: translate(-50%,-50%) } 
.quick_contact .bttn-txt--circle .icon:after { transform: translate(-250%,-50%) } 
.quick_contact .bttn-txt--circle:hover .txt { transform: translateY(-150%) } 
.quick_contact .bttn-txt--circle:hover .icon:before { transform: translate(150%,-50%) } 
.quick_contact .bttn-txt--circle:hover .icon:after { transform: translate(-50%,-50%) } 

.quick_contact.black_style { background-color:#363636; } 
.quick_contact.black_style .tel { color: #393939; background-color: #fff; } 
.quick_contact.black_style .bttn-txt--circle .txt { color: #fff; } 
.quick_contact.black_style .bttn-txt--circle .icon:before,
.quick_contact.black_style .bttn-txt--circle .icon:after { background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M3.9585 10L16.0418 10' stroke='%23fff' stroke-linecap='round'/%3E%3Cpath d='M11.3276 14.7139L16.0417 9.99982' stroke='%23fff' stroke-linecap='round'/%3E%3Cpath d='M11.3276 5.28613L16.0417 10.0002' stroke='%23fff' stroke-linecap='round'/%3E%3C/svg%3E") transparent 50% 50%/cover no-repeat } 





#contact_view { position: fixed; top: 0; bottom: 0; z-index: 1045; display: flex; flex-direction: column; max-width: 100%; background: #363636; background-clip: padding-box; outline: 0; visibility: hidden; transition: transform .3s ease-in-out, visibility 0s linear .3s; right: 0; width: 100%; max-width: 850px; transform: translateX(100%); } 
#contact_view.show { transform: none; visibility: visible; transition: transform .3s ease-in-out; } 
#contact_view .contact_view_box { height:100%; overflow-y:auto; padding: 0 68px; } 
#contact_view .contact_view_box input { outline:0 none; } 
#contact_view .contact_view_box h2 { font-size:52px; line-height:42px; color:#fff; text-align:center; font-family: 'Noto Sans KR', sans-serif; padding-top:40px; margin-top: 0; } 
#contact_view .contact_view_box .contact_close { position:absolute; top:40px; right:30px; cursor:pointer; background: transparent; border: 0; } 
#contact_view .contact_view_box .contact_txt ul::after { content: ''; display: block; visibility: hidden; clear: both; } 
#contact_view .contact_view_box .contact_txt { margin-top:40px; } 
#contact_view .contact_view_box .contact_txt .info_txt { list-style:none; padding:0; height:160px; } 
#contact_view .contact_view_box .contact_txt .info_txt li { position:relative; padding-left:65px; } 
#contact_view .contact_view_box .contact_txt .info_txt li label { width:65px; font-size:16px; line-height:42px; height:42px; color:#8d8d8d; border-bottom:1px solid #5a5a5a; font-family: 'Noto Sans KR', sans-serif; position:absolute; top:0; left:0; } 
#contact_view .contact_view_box .contact_txt .info_txt li .it_file { box-sizing:border-box; font-size:16px; line-height:42px; height:42px; color:#8d8d8d; background:url("../images/contact_view_file_icon.jpg") right 14px no-repeat; background-color:transparent; border:0 none; border-bottom:1px solid #5a5a5a; width:100%; margin-bottom:10px; font-family: 'Noto Sans KR', sans-serif; position:relative; cursor:pointer; } 
#contact_view .contact_view_box .contact_txt .info_txt li .it_file_del { position:absolute; right: 3px; top: 12px; color: #8d8d8d; font-size: 16px; width: 100%; display: none; text-align: right; cursor: pointer; height: 30px; line-height: 30px; } 
#contact_view .contact_view_box .contact_txt .info_txt .size_50 { width:49%; } 
#contact_view .contact_view_box .contact_txt .info_txt .size_file { padding-left:0; } 
#contact_view .contact_view_box .contact_txt .info_txt .size_100 { width:100%; padding-left:0; } 
#contact_view .contact_view_box .contact_txt .it_txt { box-sizing:border-box; font-size:16px; line-height:42px; height:42px; color:#8d8d8d; background-color:transparent; border:0 none; border-bottom:1px solid #5a5a5a; width:100%; margin-bottom:10px; font-family: 'Noto Sans KR', sans-serif; } 
#contact_view .contact_view_box .contact_txt .it_area { box-sizing:border-box; font-size:16px; line-height:24px; height:60px; color:#8d8d8d; background-color:transparent; border:1px solid #5a5a5a; width:100%; margin-bottom:20px; font-family: 'Noto Sans KR', sans-serif; resize:none; } 
#contact_view .contact_view_box .contact_txt input.it_file_txt { display:none; } 
#contact_view .contact_view_box .contact_txt input#file_route { font-size:16px; line-height:24px; color:#8d8d8d; position:absolute; top:13px; left:0; border:0 none; background-color:transparent; box-sizing:border-box; padding-left:67px; width:80%; } 

#contact_view .contact_view_box .contact_txt .column { display: flex; flex-direction: column; gap: 12px; } 
#contact_view .contact_view_box .contact_txt .column *::before,#contact_view .contact_view_box .contact_txt .column *::after { display:none; } 
#contact_view .contact_view_box .contact_txt .row { display: flex; margin: 0; } 
#contact_view .contact_view_box .contact_txt .row h3 { min-height: 38px; font-size:15px; line-height: 22px; color:#c4c4c4; background-color:#212121; min-width: 16%; max-width:16%; text-align:center; font-family: 'Noto Sans KR', sans-serif; font-weight:normal; margin:0; display: flex; align-items: center; justify-content: center; height: auto; } 
#contact_view .contact_view_box .contact_txt .row [type=checkbox],
#contact_view .contact_view_box .contact_txt .row [type=radio] { display: none; } 
#contact_view .contact_view_box .contact_txt .chklist { display: flex; width: 100%; } 
#contact_view .contact_view_box .contact_txt .rdolist { display: flex; align-items: center; flex-wrap: wrap; gap: 5px 14px; width: 100%; padding: 0 12px; } 
#contact_view .contact_view_box .contact_txt .chklist .chk { width: 100%; margin: 0; justify-content: center; border:1px solid #5a5a5a; border-right: 0; font-size:14px; line-height:20px; color:#8d8d8d; display: flex; align-items: center; text-align:center; font-family: 'Noto Sans KR', sans-serif; cursor:pointer; font-weight: 400; } 
#contact_view .contact_view_box .contact_txt .chklist .chk:last-of-type { border-right:1px solid #5a5a5a;; } 
#contact_view .contact_view_box .contact_txt .chklist input[type=checkbox]:checked + .chk { color:#c4c4c4; background-color:#5a5a5a; } 
#contact_view .contact_view_box .contact_txt .rdolist .rdo { background:url("../images/cons_chk_off.jpg") 0 2px no-repeat; background-size:19px auto; font-size:14px; line-height:22px; color:#8d8d8d; font-family: 'Noto Sans KR', sans-serif; padding-left:27px; font-weight:bold; cursor:pointer; margin: 0; } 
#contact_view .contact_view_box .contact_txt .rdolist input:checked + .rdo { background:url("../images/cons_chk_on.jpg") 0 2px no-repeat; background-size:19px auto; } 


#contact_view .contact_view_box .contact_txt .ps_txt { font-size:14px; line-height:22px; color:#8d8d8d; font-family: 'Noto Sans KR', sans-serif; margin-top:20px; } 
#contact_view .contact_view_box .contact_txt .file_txt { font-size:14px; line-height:22px; color:#8d8d8d; font-family: 'Noto Sans KR', sans-serif; clear:both; } 
#contact_view .contact_view_box .contact_txt .inq_box { text-align:center; } 
#contact_view .contact_view_box .contact_txt .inq_box .inq_btn { box-sizing:border-box; font-size:16px; line-height:16px; padding:15px 0; color:#8d8d8d; background-color:transparent; border:1px solid #8d8d8d; width:120px; font-family: 'Noto Sans KR', sans-serif; border-radius:25px; } 

/* 221104 S */
#contact_view .contact_view_box .contact_txt .inq_box_new { text-align:center; display: table; margin: 5px auto 35px; display: flex; justify-content: center; } 
#contact_view .contact_view_box .contact_txt .inq_box_new::after { content:''; display: block; visibility: hidden; clear: both; } 
#contact_view .contact_view_box .contact_txt .inq_box_new .cau { float: left; border:0; display: block; width: 320px; border-radius: 50px; background: #5a5a5a; margin-right: 45px; } 
#contact_view .contact_view_box .contact_txt .inq_box_new .cau span { font-family: 'Noto Sans KR', sans-serif; display:inline-block; padding-left: 25px; background: url('../images/ico_cau_new.png')no-repeat left center; background-size: 17px; font-size: 15px; line-height: 48px; color: #fff; } 
#contact_view .contact_view_box .contact_txt .inq_box_new .inq_btn { font-family: 'Noto Sans KR', sans-serif; float: left; border:0; display: inline-block; font-size: 15px; line-height: 48px; width: 320px; border-radius: 50px; color: #fff; background: #f26824; } 
#contact_view .contact_view_box .contact_txt .info_box { background: #333 url('../images/contact_bg_pc.png')no-repeat right top; background-size:contain; padding:30px; } 
#contact_view .contact_view_box .contact_txt .info_box .white_p { font-family: 'Noto Sans KR', sans-serif; font-size: 23px; line-height: 33px; color:#fff; font-weight: 600; margin-bottom: 20px; } 
#contact_view .contact_view_box .contact_txt .info_box .white_p span { display: inline-block; border-bottom: 1px solid #fff; line-height: 1; } 
#contact_view .contact_view_box .contact_txt .info_box .white_p span em { font-style: italic; } 
#contact_view .contact_view_box .contact_txt .info_box .white_p strong { display: inline-block; font-weight: 900; color:#f36823; } 
#contact_view .contact_view_box .contact_txt .info_box .gray_p { font-family: 'Noto Sans KR', sans-serif; color:#989898; font-size: 15px; line-height: 22px; margin: 0; padding-right: 30px; word-break: keep-all; } 

#contact_view .contact_view_box .company_down { margin-top:20px; } 
#contact_view .contact_view_box .company_down a.down_btn { display:flex; align-items: center; justify-content: space-between; height: 60px; background-color:#212121; font-size:20px; color:#c4c4c4; text-align:center; text-decoration:none; position:relative; padding: 0 20px; } 
#contact_view .contact_view_box .company_down a.down_btn::before { content: ''; display: block; width: 24px; } 
#contact_view .contact_view_box .contact_footer { margin-top:30px; padding-bottom:20px; } 
#contact_view .contact_view_box .contact_footer .adr { text-align:center; font-size:14px; line-height:16px; color:#696969; } 
#contact_view .contact_view_box .contact_footer .tel { text-align:center; font-size:14px; line-height:14px; color:#c4c4c4; } 
 




/* 마케팅문의-OFFCANVAS */
#marketing_view *::before, #marketing_view *::after { display: none; } 
#marketing_view { position: fixed; top: 0; bottom: 0; z-index: 1045; display: flex; flex-direction: column; max-width: 100%; background: #363636; background-clip: padding-box; outline: 0; visibility: hidden; transition: transform .3s ease-in-out, visibility 0s linear .3s; right: 0; width: 100%; max-width: 850px; transform: translateX(100%); } 
#marketing_view.show { transform: none; visibility: visible; transition: transform .3s ease-in-out; } 
#marketing_view .offcanvas-body { overflow-y: auto; display: flex; height: 100%; padding: 100px 40px; flex-direction: column; align-items: center; gap: 80px; } 
#marketing_view .btn1 { position: absolute; right: 30px; top: 40px; border: 0; background: transparent; } 
#marketing_view .form { display: flex; flex-direction: column; align-items: flex-start; gap: 36px; width: 100%; max-width: 476px; } 
#marketing_view .txt1 { color: #fff; font-size: 48px; font-weight: 700; line-height: 48px; } 
#marketing_view .txt2 { color: #fff; font-size: 16px; font-weight: 500; line-height: 24px; white-space:nowrap } 
#marketing_view .row { display: flex; padding-bottom: 12px; align-items: center; gap: 16px; border-bottom: 1px solid #666; width: 100%; margin: 0; } 
#marketing_view .col { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 16px; width:100%; } 
#marketing_view input[type="text"] { color: #fff; font-size: 16px; line-height: 24px; background: transparent; border: 0; width: 100%; } 
#marketing_view input[type="text"]::placeholder { color: #fff; opacity: 0.3; } 
#marketing_view textarea { display: block; width:100%; resize:none; height: 280px; padding: 12px; align-items: flex-start; gap: 10px; align-self: stretch; border: 1px solid #666; color: #fff; font-size: 16px; line-height: 24px; background: transparent; } 
#marketing_view textarea::placeholder { color: #fff; opacity: 0.3; } 
#marketing_view input[type="checkbox"] { display:none; } 
#marketing_view .txt3 { display: flex; align-items: center; } 
#marketing_view .txt3 label { color: #FFF; font-size: 15px; line-height: 22px; display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 400; } 
#marketing_view .btn2 { color: #FFF; font-size: 15px; border:0; background:unset; } 
#marketing_view .txt3 .active { display: block; transition: .15s; width: 24px; height: 24px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Crect x='3' y='3' width='18' height='18' rx='5' stroke='%23E0E0E0' stroke-width='2'/%3E%3C/svg%3E"); } 
#marketing_view .txt3 input:checked + .active { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Crect x='2' y='2' width='20' height='20' rx='6' fill='%23898989'/%3E%3Cpath d='M9.60003 14.6043L16.656 7.54827C17.124 7.08027 17.892 7.08027 18.36 7.54827C18.828 8.01627 18.828 8.77227 18.36 9.24027L10.452 17.1483C9.98403 17.6163 9.22803 17.6163 8.76003 17.1483L5.65203 14.0403C5.18403 13.5723 5.18403 12.8163 5.65203 12.3483C6.12003 11.8803 6.87603 11.8803 7.34403 12.3483L9.60003 14.6043Z' fill='white'/%3E%3C/svg%3E"); } 
#marketing_view .btn3 { color: #FFF; font-size: 16px; font-weight: 500; line-height: 24px; display: flex; width: 176px; padding: 10px 40px; justify-content: center; align-items: center; border-radius: 4px; background: #EB5E11; border: 0; } 

.offcanvas-backdrop { opacity: 0; position: fixed; top: 0; left: 0; z-index: 1040; width: 100vw; height: 100vh; background-color: #000; transition: opacity 0.3s ease; pointer-events: none; } 
.offcanvas-backdrop.show { opacity: 0.5; pointer-events: auto; } 

.modal-backdrop { opacity: 0; position: fixed; top: 0; left: 0; z-index: 1040; width: 100vw; height: 100vh; background-color: #000; transition: opacity 0.3s ease; pointer-events: none; } 
.modal-backdrop.show { opacity: 0.5; pointer-events: auto; } 


/* 마케팅문의-OFFCANVAS 전문보기-MODAL*/
#termsModal { position: fixed; top: 0; left: 0; z-index: 1050; display: none; width: 100%; height: 100%; overflow: hidden; outline: 0; } 
#termsModal .btn1 { border: 0; background: transparent; } 
#termsModal.show { display: block; } 
#termsModal .modal-dialog { position: relative; width: auto; margin: 1.5rem auto; pointer-events: none; max-width: 500px; } 
#termsModal .modal.fade .modal-dialog { transition: transform .3s ease-out; transform: translate(0, -50px); } 
#termsModal.show .modal-dialog { transform: none; } 
#termsModal .modal-dialog-centered { display: flex; align-items: center; max-height: calc(100% - 3rem); height: 100%; overflow: hidden; margin: auto; padding: 20px; } 
#termsModal .modal-content { position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: auto; background-color: #fff; background-clip: padding-box; border-radius: 16px; box-shadow: unset; outline: 0; height: 100%; border: 0; } 
#termsModal .modal-header { display: flex; align-items: center; justify-content: space-between; padding: 20px; } 
#termsModal .modal-header h5 { color: #000; font-size: 16px; font-weight: 500; line-height: 24px; } 
#termsModal .modal-body { position: relative; flex: 1 1 auto; padding: 24px 20px; color: #000; font-size: 15px; line-height: 22px; } 
#termsModal .modal-footer { display: flex; align-items: center; justify-content: flex-end; padding: 1rem; gap: 0.5rem; } 
#termsModal .modal-dialog-scrollable .modal-body { overflow-y: auto; } 
#termsModal.fade { opacity: 0; transition: opacity .15s linear; } 
#termsModal.fade.show { opacity: 1; } 
#termsModal.fade .modal-dialog { transform: translateY(-50px); transition: transform .3s ease-out; } 
#termsModal.show .modal-dialog { transform: translateY(0); } 




@media (max-width: 1025px) { 
#contact_view { width:100%; } 
#contact_view .contact_view_box { padding:0 5%; margin:0; } 
 } 
@media (max-width: 520px) { 
.quick_contact .bttn-txt--circle { min-height: 48px; } 
.quick_contact .bttn-txt--circle .txt { font-size: 14px; line-height: 20px; } 
.quick_contact .tel { font-size: 14px; line-height: 20px; padding: 10px 0; } 


#contact_view .contact_view_box h2 { font-size:32px; line-height:36px; padding-top:20px; } 
#contact_view .contact_view_box .contact_txt { margin-top:40px; } 
#contact_view .contact_view_box .contact_txt .info_txt .size_50 { width:100%; } 
#contact_view .contact_view_box .contact_txt .column { gap: 24px; } 
#contact_view .contact_view_box .contact_txt .row { flex-direction: column; } 
#contact_view .contact_view_box .contact_txt .row h3 { max-width: unset; width: 100%; } 
#contact_view .contact_view_box .contact_txt .row h3 br { display: none; } 
#contact_view .contact_view_box .contact_txt .chklist .chk { min-height: 38px; } 
#contact_view .contact_view_box .contact_txt .rdolist { padding: 12px 0 0; } 
#contact_view .contact_view_box .contact_txt .ps_txt { margin-top: 30px; } 
#contact_view .contact_view_box .contact_close { position:absolute; top:48px; right:30px; cursor:pointer; } 
#contact_view .contact_view_box .contact_close img { width:20px; } 


 #contact_view .contact_view_box .contact_txt .inq_box_new { margin:0 auto; display: block; } 
 #contact_view .contact_view_box .contact_txt .inq_box_new .cau { width:100%; float:none; margin-right: 0; margin-bottom: 15px; } 
 #contact_view .contact_view_box .contact_txt .inq_box_new .cau span { font-size: 13px; line-height: 40px; } 
 #contact_view .contact_view_box .contact_txt .inq_box_new .inq_btn { float: none; display: block; font-size: 13px; line-height: 40px; width: 100%; margin-bottom: 20px; } 
 #contact_view .contact_view_box .contact_txt .info_box { background: #333 url('../images/contact_bg_mo.png')no-repeat right top; background-size:contain; padding:20px 15px; } 
 #contact_view .contact_view_box .contact_txt .info_box .white_p { font-size: 14px; line-height: 20px; margin-bottom: 25px; } 
 #contact_view .contact_view_box .contact_txt .info_box .gray_p { font-size:12px; line-height:15px; padding-right:0; } 



 
 #marketing_view .txt1 { font-size: 32px; line-height: 36px; } 
 #marketing_view .txt2, #marketing_view .txt3 label, #marketing_view .btn2,#marketing_view input[type="text"] { font-size: 14px; } 
 


 
 .modal { padding: 75px 10px 20px !important; } 
 #closeModalBtn { top: 50px; width: 20px; height: 20px; right: 30px; } 
 #closeModalBtn img { display: block; width:100%; } 
 .modal-dialog { flex-direction: column-reverse; } 
 .modal-dialog .left { min-width: unset; border-radius: 0 0 5px 5px; } 

 .modal-dialog .left .position-relative { padding:25px 10px; font-size: 12px; line-height: 16px; row-gap: 15px; background-color: #fff; } 
 .modal-dialog .left .position-absolute { right: 60px; top: -58px; max-width: 75px; } 
 .modal-dialog .left .position-relative img:not(.position-absolute) { max-width: 123px; } 


 .modal-dialog .right { min-width: unset; /*background:#fff url('../images/modal_bg.png')no-repeat right 5px top 10px; background-size:103px; */ padding:30px 10px 35px; border-radius: 5px 5px 0 0; } 
 .modal-dialog .right .top_p { font-size: 18px; } 
 .modal-dialog .right .inner { margin-top: 20px; } 
 .modal-dialog .right .inner .chk_tit { font-size:14px; padding-left: 20px; background:url('../images/ico_chk.png')no-repeat left top; background-size: 15px; line-height: 15px; } 
 .modal-dialog .right .inner .info_p { font-size: 13px; line-height: 18px; word-break: keep-all; } 
 .modal-dialog .right .inner:first-of-type .chk_tit { padding-right: 70px; } 
 .modal-dialog .right .inner:first-of-type .info_p { padding-right: 60px; } 


 } 


 
/* 컨설팅 신청하기*/
#consulting_view { position: fixed; top: 0; bottom: 0; z-index: 1045; display: flex; flex-direction: column; max-width: 100%; background: #363636; background-clip: padding-box; outline: 0; visibility: hidden; transition: transform .3s ease-in-out, visibility 0s linear .3s; right: 0; width: 100%; max-width: 850px; transform: translateX(100%); } 
#consulting_view.show { transform: none; visibility: visible; transition: transform .3s ease-in-out; } 
#consulting_view .consulting_view_box { margin:0 0 0 10%; padding-right:15%; height:100%; overflow-y:auto; } 
#consulting_view .consulting_view_box input { outline:0 none; } 
#consulting_view .consulting_view_box h2 { font-size:58px; line-height:60px; color:#fff; text-align:center; font-family: 'Noto Sans KR', sans-serif; padding-top:40px; } 
#consulting_view .consulting_view_box .title_txt { font-size:14px; line-height:22px; color:#8d8d8d; font-family: 'Noto Sans KR', sans-serif; margin-top:40px; font-weight:bold; } 
#consulting_view .consulting_view_box .consulting_close { position:absolute; top:80px; right:30px; cursor:pointer; } 

#consulting_view .consulting_view_box .cons_chk { margin-top:30px; background:url("../images/cons_chk_line.jpg") 0 bottom no-repeat; padding-bottom:20px; } 
#consulting_view .consulting_view_box .cons_chk h3 { font-size:16px; line-height:16px; color:#8d8d8d; font-family: 'Noto Sans KR', sans-serif; padding-top:30px; background:url("../images/cons_chk_line.jpg") 0 0 no-repeat; } 
#consulting_view .consulting_view_box .cons_chk .cons_chk_list { list-style:none; padding:0; margin-top:20px; } 
#consulting_view .consulting_view_box .cons_chk .cons_chk_list li { margin-bottom:2px; } 
#consulting_view .consulting_view_box .cons_chk .cons_chk_list li label { background:url("../images/cons_chk_off.jpg") 0 0 no-repeat; font-size:14px; line-height:22px; color:#8d8d8d; font-family: 'Noto Sans KR', sans-serif; padding-left:40px; font-weight:bold; cursor:pointer; } 
#consulting_view .consulting_view_box .cons_chk .cons_chk_list li input[type=checkbox] { display:none; } 
#consulting_view .consulting_view_box .cons_chk .cons_chk_list li input[type=checkbox]:checked + label { background:url("../images/cons_chk_on.jpg") 0 0 no-repeat; } 

#consulting_view .consulting_view_box .contact_txt { margin-top:20px; } 
#consulting_view .consulting_view_box .contact_txt .info_txt { list-style:none; padding:0; height:120px; } 
#consulting_view .consulting_view_box .contact_txt .info_txt li { position:relative; padding-left:65px; } 
#consulting_view .consulting_view_box .contact_txt .info_txt li label { width:65px; font-size:16px; line-height:50px; height:50px; color:#8d8d8d; border-bottom:1px solid #5a5a5a; font-family: 'Noto Sans KR', sans-serif; position:absolute; top:0; left:0; } 
#consulting_view .consulting_view_box .contact_txt .info_txt .size_50 { width:49%; } 
#consulting_view .consulting_view_box .contact_txt .info_txt .size_100 { width:100%; } 
#consulting_view .consulting_view_box .contact_txt .it_txt { box-sizing:border-box; font-size:16px; line-height:50px; height:50px; color:#8d8d8d; background-color:transparent; border:0 none; border-bottom:1px solid #5a5a5a; width:100%; margin-bottom:10px; font-family: 'Noto Sans KR', sans-serif; } 
#consulting_view .consulting_view_box .contact_txt .box_line { border:1px solid #5a5a5a; text-indent:10px; margin-top:5px; } 

#consulting_view .consulting_view_box .contact_txt .ps_txt { font-size:14px; line-height:22px; color:#8d8d8d; font-family: 'Noto Sans KR', sans-serif; margin:0; } 
#consulting_view .consulting_view_box .contact_txt .inq_box { text-align:center; margin-top:10px; } 
#consulting_view .consulting_view_box .contact_txt .inq_box .inq_btn { box-sizing:border-box; font-size:16px; line-height:16px; padding:15px 0; color:#8d8d8d; background-color:transparent; border:1px solid #8d8d8d; width:220px; font-family: 'Noto Sans KR', sans-serif; border-radius:25px; } 

#consulting_view .consulting_view_box .contact_footer { margin-top:40px; padding-bottom:20px; } 
#consulting_view .consulting_view_box .contact_footer .adr { text-align:center; font-size:14px; line-height:16px; color:#696969; } 
#consulting_view .consulting_view_box .contact_footer .tel { text-align:center; font-size:14px; line-height:14px; color:#c4c4c4; } 

@media (max-width: 1025px) { 
#consulting_view { width:100%; } 
#consulting_view .consulting_view_box { padding:0 5%; margin:0; } 
 } 
@media (max-width: 520px) { 

#consulting_view .consulting_view_box h2 { font-size:32px; line-height:36px; padding-top:20px; } 
#consulting_view .consulting_view_box .cons_chk .cons_chk_list li label { font-size:12px; line-height:20px; padding-left:25px; } 
#consulting_view .consulting_view_box .contact_txt { margin-top:40px; } 
#consulting_view .consulting_view_box .contact_txt .info_txt .size_50 { width:100%; } 
#consulting_view .consulting_view_box .consulting_close { position:absolute; top:48px; right:30px; cursor:pointer; } 
#consulting_view .consulting_view_box .consulting_close img { width:20px; } 
#consulting_view .consulting_view_box .cons_chk .cons_chk_list li label { background:url("../images/cons_chk_off.jpg") 0 0 no-repeat; background-size:16px 16px; } 
#consulting_view .consulting_view_box .cons_chk .cons_chk_list li input[type=checkbox]:checked + label { background:url("../images/cons_chk_on.jpg") 0 0 no-repeat; background-size:16px 16px; } 
 } 

/* RIGHT QUICK*/
#right_quick { position:fixed; top:50%; right:0; z-index:10; margin-top:-100px; } 
#right_quick .list { list-style:none; width:260px; padding:0; } 
#right_quick .list li a { display:block; font-family: 'Noto Sans KR', sans-serif; font-size:15px; line-height:15px; color:var(--base10); text-decoration:none; padding:5px 0; text-align:right; position:relative; padding-right:30%; box-sizing:border-box; height:30px; } 
#right_quick .list li a .first01 { position:absolute; right:25%; } 
#right_quick .list li a .first02 { position:absolute; right:25%; } 
#right_quick .list li a .first03 { position:absolute; right:25%; } 
#right_quick .list li a .first04 { position:absolute; right:25%; } 
#right_quick .list li a .first05 { position:absolute; right:25%; } 
#right_quick .list li a .first06 { position:absolute; right:25%; } 
#right_quick .list li a .ap_n01 { opacity:0; transition: all 0.3s; width:0; display:inline-block; } 
#right_quick .list li a .ap_n02 { opacity:0; transition: all 0.6s; width:0; display:inline-block; } 
#right_quick .list li a .ap_n03 { opacity:0; transition: all 0.9s; width:0; display:inline-block; } 
#right_quick .list li a .ap_n04 { opacity:0; transition: all 1.2s; width:0; display:inline-block; } 
#right_quick .list li a .ap_n05 { opacity:0; transition: all 1.5s; width:0; display:inline-block; } 
#right_quick .list li a .ap_n06 { opacity:0; transition: all 1.8s; width:0; display:inline-block; } 
#right_quick .list li a .ap_n07 { opacity:0; transition: all 2.1s; width:0; display:inline-block; } 
#right_quick .list li a .ap_n08 { opacity:0; transition: all 2.4s; width:0; display:inline-block; } 
#right_quick .list li a .ap_n09 { opacity:0; transition: all 2.7s; width:0; display:inline-block; } 
#right_quick .list li a .ap_n10 { opacity:0; transition: all 3.0s; width:0; display:inline-block; } 
#right_quick .list li a:hover .first01 { position:relative; right:auto; left:0; } 
#right_quick .list li a:hover .first02 { position:relative; right:auto; left:0; } 
#right_quick .list li a:hover .first03 { position:relative; right:auto; left:0; } 
#right_quick .list li a:hover .first04 { position:relative; right:auto; left:0; } 
#right_quick .list li a:hover .first05 { position:relative; right:auto; left:0; } 
#right_quick .list li a:hover .first06 { position:relative; right:auto; left:0; } 
#right_quick .list li a:hover .ap_n01 { opacity:1; width:auto; } 
#right_quick .list li a:hover .ap_n02 { opacity:1; width:auto; } 
#right_quick .list li a:hover .ap_n03 { opacity:1; width:auto; } 
#right_quick .list li a:hover .ap_n04 { opacity:1; width:auto; } 
#right_quick .list li a:hover .ap_n05 { opacity:1; width:auto; } 
#right_quick .list li a:hover .ap_n06 { opacity:1; width:auto; } 
#right_quick .list li a:hover .ap_n07 { opacity:1; width:auto; } 
#right_quick .list li a:hover .ap_n08 { opacity:1; width:auto; } 
#right_quick .list li a:hover .ap_n09 { opacity:1; width:auto; } 
#right_quick .list li a:hover .ap_n10 { opacity:1; width:auto; } 
 
#right_quick .list li a.active .first01 { position:relative; right:auto; left:0; } 
#right_quick .list li a.active .first02 { position:relative; right:auto; left:0; } 
#right_quick .list li a.active .first03 { position:relative; right:auto; left:0; } 
#right_quick .list li a.active .first04 { position:relative; right:auto; left:0; } 
#right_quick .list li a.active .first05 { position:relative; right:auto; left:0; } 
#right_quick .list li a.active .first06 { position:relative; right:auto; left:0; } 
#right_quick .list li a.active .ap_n01 { opacity:1; width:auto; } 
#right_quick .list li a.active .ap_n02 { opacity:1; width:auto; } 
#right_quick .list li a.active .ap_n03 { opacity:1; width:auto; } 
#right_quick .list li a.active .ap_n04 { opacity:1; width:auto; } 
#right_quick .list li a.active .ap_n05 { opacity:1; width:auto; } 
#right_quick .list li a.active .ap_n06 { opacity:1; width:auto; } 
#right_quick .list li a.active .ap_n07 { opacity:1; width:auto; } 
#right_quick .list li a.active .ap_n08 { opacity:1; width:auto; } 
#right_quick .list li a.active .ap_n09 { opacity:1; width:auto; } 
#right_quick .list li a.active .ap_n10 { opacity:1; width:auto; } 
 
#right_quick .list li a .line { height:1px; width:0; background-color:#fff; position:absolute; right:0; top:12px; transition: all 0.2s; } 
#right_quick .list li a:hover .line { width:18%; } 
#right_quick .list li a.active .line { width:18%; } 
 

#right_quick.light .list li a {color: var(--base0);}
#right_quick.light .list li a .line {background-color: var(--base0);}

@media (max-width: 992px) { 
#right_quick .list { list-style:none; width:150px; } 
#right_quick .list li a .ap_n01 { display:none; } 
#right_quick .list li a .ap_n02 { display:none; } 
#right_quick .list li a .ap_n03 { display:none; } 
#right_quick .list li a .ap_n04 { display:none; } 
#right_quick .list li a .ap_n05 { display:none; } 
#right_quick .list li a .ap_n06 { display:none; } 
#right_quick .list li a .ap_n07 { display:none; } 
#right_quick .list li a .ap_n08 { display:none; } 
#right_quick .list li a .ap_n09 { display:none; } 
#right_quick .list li a .ap_n10 { display:none; } 
#right_quick .list li a .first01 { margin-right:2px; } 
#right_quick .list li a:hover .first01 { margin-right:2px; } 
#right_quick .list li a .first02 { margin-right:0; } 
#right_quick .list li a .first03 { margin-right:0; } 
#right_quick .list li a .first04 { margin-right:0; } 
#right_quick .list li a .first05 { margin-right:0; } 
#right_quick .list li a .first06 { margin-right:0; } 
 } 
@media (max-width: 520px) { 
#right_quick .list { list-style:none; width:80px; } 
 } 
 
 
#intro { height:100vh; position: relative; overflow: hidden; background:url("../images/intro_bg.png") center 0 no-repeat; } 
#intro.mo_bg { background:url("../images/intro_visual_bg.jpg") center 0 no-repeat; } 
/*#intro { height:100vh; position: relative; overflow: hidden; background:url("../images/intro_visual_bg.jpg") center center fixed no-repeat; } */
#intro video { position:fixed; top:200px; left:50%; width:960px; z-index:-1; margin-left:-480px; display:none; } 
#intro .intro-txt { position:fixed; top: 50%; left:0; padding: 0 10%; z-index:10; transform: translateY(-50%); } 
#intro .intro-txt p { margin:0; } 
#intro .intro-txt .intro-eng { font-size: 72px; line-height: 1; color:#fff; font-family: "Pretendard"; font-weight:bold; } 
#intro .intro-txt .intro-eng-txt01 { margin-left:-100px; opacity:0; margin-bottom: 40px; } 
#intro .intro-txt .intro-eng-txt02 { margin-left:-150px; opacity:0; font-size: 40px; line-height: 52px; } 
#intro .intro-txt .intro-eng-txt03 { margin-left:-200px; opacity:0; font-size: 40px; line-height: 52px; } 
#intro .intro-txt .intro-eng-txt04 { margin-left:-250px; opacity:0; font-size: 40px; line-height: 52px; } 
#intro .intro-txt .intro-kor { font-size:20px; line-height:26px; color:#fff; font-family: 'Noto Sans KR', sans-serif; } 
#intro .intro-txt .intro-kor-txt01 { margin-left:-100px; margin-top:60px; opacity:0; } 
#intro .intro-txt .intro-kor-txt02 { margin-left:-150px; opacity:0; } 
#intro .intro-txt .intro-tel { font-size:34px; line-height:34px; margin-top:25px; color:#fff; font-family: 'Noto Sans KR', sans-serif; opacity:0; } 
#intro .intor-visual-logo { position:fixed; top:50%; left:50%; margin-left:-326px; margin-top:-183px; } 
#intro .mouse-box { position:fixed; bottom:5%; left:50%; z-index:10; } 
#intro .copyright { position:fixed; bottom:3%; left:5%; width:40%; z-index:10; font-size:13px; line-height:1.6em; color:#c6c6c6; font-family: 'Noto Sans KR', sans-serif; } 
 

 #intro .intro_space { position:absolute; top:280px; left:50%; margin-left:-1000px; z-index:-1; 
-webkit-animation-name: int_space; /* Safari 4.0 - 8.0 */
 -webkit-animation-duration: 45s; /* Safari 4.0 - 8.0 */
 animation-name: int_space; 
 animation-duration: 45s;; 
animation-iteration-count:infinite; 
animation-direction:alternate; 
 } 
@-webkit-keyframes int_space { 
 0% { top:280px; } 
 100% { top:-1745px; } 
 } 
/* Standard syntax */
@keyframes int_space { 
 0% { top:280px; } 
 100% { top:-1745px; } 
 } 
 #intro .intro_space img { display:none; } 
@media (max-width: 768px) { 
#intro.mo_bg { background:url("../images/intro_visual_bg.jpg") center 0 no-repeat; background-size:auto 100vh; } 
#intro .intro-txt { padding: 0 20px; top: 40%; } 
#intro .intro-txt .intro-eng { font-size:36px; line-height:36px; } 
#intro .intro-txt .intro-eng-txt01 { margin-bottom: 20px; } 
#intro .intro-txt .intro-eng-txt02, #intro .intro-txt .intro-eng-txt03, #intro .intro-txt .intro-eng-txt04 { font-size: 24px; line-height: 32px; } 
#intro .intro-txt .intro-kor { font-size:14px; line-height:20px; } 
#intro .intro-txt .intro-kor-txt01 { margin-top:40px; opacity:0; margin-top: 20px; } 
#intro .intro-txt .intro-tel { font-size:24px; line-height:24px; margin-top:10px; } 
#intro .intor-visual-logo { position:fixed; top:55%; left:0; margin-left:0; margin-top:0; text-align:center; } 
#intro .intor-visual-logo img { width:80%; } 
#intro .copyright { width:65%; font-size:10px; letter-spacing:-0.5px; bottom:10px; color:#fff } 
#intro .mouse-box { display:none; } 
 } 
 
/* EVERLASTING */
#everlasting { height:100vh; position: relative; overflow: hidden; background:url("../images/bg_opacity.png") 0 0 repeat; } 
#everlasting video { position:fixed; top:0; left:0; min-width:100%; min-height:100%; width:auto; height:auto; z-index:-1; } 
#everlasting .bg_e { background-color:#ff8a00; position:fixed; top:0; right:100%; width:50%; height:100vh; z-index:1; } 
#everlasting .main-left-txt { position:fixed; top:30%; left:0; z-index:10; width:50%; box-sizing:border-box; padding:0 50px; } 
#everlasting .main-left-txt p { margin:0; word-break:keep-all; transition: all 0.3s; } 
#everlasting .main-left-txt .main-title { font-size:80px; line-height:80px; color:#fff; z-index:10; font-family: 'Space Mono', monospace; font-weight:bold; margin-left:-100px; opacity:0; } 
#everlasting .main-left-txt .main-txt { font-size:20px; line-height:30px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-left:80px; margin-top:50px; } 
#everlasting .main-left-txt .main-txt01 { opacity:0; } 
#everlasting .main-left-txt .main-txt02 { opacity:0; } 
#everlasting .main-left-txt .main-txt03 { opacity:0; } 
#everlasting .main-left-txt .main-view { margin-left:-250px; opacity:0; margin-top:60px; margin-bottom:20px; } 
#everlasting .main-left-txt .main-view a { display:block; font-size:15px; line-height:15px; color:#fff; font-family: 'Noto Sans KR', sans-serif; font-weight:bold; width:220px; text-align:center; padding:14px 0; border:1px solid #fff; border-radius:25px; text-decoration:none; } 
 
#everlasting .main-alphabet { position:fixed; top:50%; left:50%; margin-left:-200px; margin-top:-231px; z-index:9; width:400px; height:462px; } 
#everlasting .mouse-box { position:fixed; bottom:5%; left:50%; margin-left:0; z-index:10; } 
 
@media (max-width: 1200px) { 
#everlasting .main-left-txt .main-title { font-size:60px; line-height:60px; } 
#everlasting .main-left-txt .main-txt { margin-left:0; } 
#everlasting .main-left-txt .main-view a { margin-left:-80px; } 
 } 
@media (max-width: 992px) { 
#everlasting .main-left-txt .main-title { font-size:50px; line-height:60px; } 
#everlasting .main-left-txt .main-txt { font-size:18px; } 
 } 
@media (max-width: 768px) { 
#everlasting.mo_bg { background:url("../images/everlasting_bg.jpg") center 0 no-repeat; background-size:auto 100vh; } 
#everlasting .main-left-txt { padding:0 15px; } 
#everlasting .main-left-txt { width:90%; } 
#everlasting .main-left-txt .main-title { font-size:40px; line-height:50px; } 
#everlasting .main-left-txt .main-txt { margin-top:20px; font-size:14px; line-height:24px; } 
#everlasting .main-alphabet { display:none; } 
#everlasting .main-left-txt .main-view { margin-top:30px; } 
 } 
 
/* OPTIMUM */
#optimum { height:100vh; position: relative; overflow: hidden; background:url("../images/bg_opacity.png") 0 0 repeat; } 
#optimum video { position:fixed; top:0; left:0; min-width:100%; min-height:100%; width:auto; height:auto; z-index:-1; } 
#optimum .bg_e { background-color:#587bd5; position:fixed; top:0; right:100%; width:50%; height:100vh; z-index:1; } 
#optimum .main-left-txt { position:fixed; top:30%; left:0; z-index:10; width:50%; box-sizing:border-box; padding:0 50px; } 
#optimum .main-left-txt p { margin:0; word-break:keep-all; transition: all 0.3s; } 
#optimum .main-left-txt .main-title { font-size:80px; line-height:80px; color:#fff; z-index:10; font-family: 'Space Mono', monospace; font-weight:bold; margin-left:-100px; opacity:0; } 
#optimum .main-left-txt .main-txt { font-size:20px; line-height:30px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-left:80px; margin-top:50px; } 
#optimum .main-left-txt .main-txt01 { opacity:0; } 
#optimum .main-left-txt .main-txt02 { opacity:0; } 
#optimum .main-left-txt .main-txt03 { opacity:0; } 
#optimum .main-left-txt .main-txt04 { opacity:0; } 
#optimum .main-left-txt .main-view { margin-left:-250px; opacity:0; margin-top:60px; margin-bottom:20px; } 
#optimum .main-left-txt .main-view a { display:block; font-size:15px; line-height:15px; color:#fff; font-family: 'Noto Sans KR', sans-serif; font-weight:bold; width:220px; text-align:center; padding:14px 0; border:1px solid #fff; border-radius:25px; text-decoration:none; } 
 
#optimum .main-alphabet { position:fixed; top:50%; left:50%; margin-left:-200px; margin-top:-231px; z-index:9; width:400px; height:462px; } 
#optimum .mouse-box { position:fixed; bottom:5%; left:50%; margin-left:0; z-index:10; } 
 
@media (max-width: 1200px) { 
#optimum .main-left-txt .main-title { font-size:60px; line-height:60px; } 
#optimum .main-left-txt .main-txt { margin-left:0; } 
#optimum .main-left-txt .main-view a { margin-left:-80px; } 
 } 
@media (max-width: 992px) { 
#optimum .main-left-txt .main-title { font-size:50px; line-height:60px; } 
#optimum .main-left-txt .main-txt { font-size:18px; } 
 } 
@media (max-width: 768px) { 
#optimum.mo_bg { background:url("../images/optimum_bg.jpg") center 0 no-repeat; background-size:auto 100vh; } 
#optimum .video_mo { display:none; } 
#optimum .main-left-txt { padding:0 15px; } 
#optimum .main-left-txt { width:90%; } 
#optimum .main-left-txt .main-title { font-size:40px; line-height:50px; } 
#optimum .main-left-txt .main-txt { margin-top:20px; font-size:14px; line-height:24px; } 
#optimum .main-alphabet { display:none; } 
#optimum .main-left-txt .main-view { margin-top:30px; } 
 } 
 
/* APPS */
/*#main_apps { height:100vh; position: relative; overflow: hidden; background:url("../images/bg_opacity.png") 0 0 repeat; } */
#main_apps .bg_ee { background-color:#a6cd1f; position:fixed; top:0; right:100%; width:0; height:100vh; z-index:3; } 
#main_apps .bg_eee { background-color:#77d0c4; position:fixed; top:0; right:100%; width:0; height:100vh; z-index:3; } 
#main_apps .bg_eeee { background-color:#016de2; position:fixed; top:0; right:100%; width:0; height:100vh; z-index:3; } 
#main_apps .loading { position:fixed; top:50%; left:50%; z-index:99999999999999; margin-left:-150px; margin-top:-113px; opacity:0; visibility: hidden; } 

#apps { height:100vh; position: relative; overflow: hidden; background:url("../images/bg_opacity.png") 0 0 repeat; } 
#apps video { position:fixed; top:0; left:0; min-width:100%; min-height:100%; width:auto; height:auto; z-index:-1; } 
#apps .bg_e { background-color:#a6cd1f; position:fixed; top:0; right:100%; width:50%; height:100vh; z-index:3; } 
#apps .main-left-txt { position:fixed; top:30%; left:0; z-index:10; width:50%; box-sizing:border-box; padding:0 50px; } 
#apps .main-left-txt p { margin:0; word-break:keep-all; transition: all 0.3s; } 
#apps .main-left-txt .main-title { font-size:80px; line-height:80px; color:#fff; z-index:10; font-family: 'Space Mono', monospace; font-weight:bold; margin-left:-100px; opacity:0; } 
#apps .main-left-txt .main-txt { font-size:20px; line-height:30px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-left:80px; margin-top:50px; } 
#apps .main-left-txt .main-txt01 { opacity:0; } 
#apps .main-left-txt .main-txt02 { opacity:0; } 
#apps .main-left-txt .main-txt03 { opacity:0; } 
#apps .main-left-txt .main-view { margin-left:-250px; opacity:0; margin-top:60px; margin-bottom:20px; } 
#apps .main-left-txt .main-view a { display:block; font-size:15px; line-height:15px; color:#fff; font-family: 'Noto Sans KR', sans-serif; font-weight:bold; width:220px; text-align:center; padding:14px 0; border:1px solid #fff; border-radius:25px; text-decoration:none; } 
#apps .loading { position:fixed; top:50%; left:50%; z-index:99999999999999; margin-left:-100px; margin-top:-100px; opacity:0; } 
 
#apps .main-alphabet { position:fixed; top:50%; left:50%; margin-left:-200px; margin-top:-231px; z-index:9; width:400px; height:462px; } 
#apps .mouse-box { position:fixed; bottom:5%; left:50%; margin-left:0; z-index:10; } 
 
@media (max-width: 1200px) { 
#apps .main-left-txt .main-title { font-size:60px; line-height:60px; } 
#apps .main-left-txt .main-txt { margin-left:0; } 
#apps .main-left-txt .main-view a { margin-left:-80px; } 
 } 
@media (max-width: 992px) { 
#apps .main-left-txt .main-title { font-size:50px; line-height:60px; } 
#apps .main-left-txt .main-txt { font-size:18px; } 
 } 
@media (max-width: 768px) { 
#main_apps .loading { margin-left: -50px; margin-top: -75px; } 
#main_apps .loading img { width:100px; } 
#main_apps .main-alphabet { display:none; } 

#apps.mo_bg { background:url("../images/apps_bg.jpg") center 0 no-repeat; background-size:auto 100vh; } 
#apps .main-left-txt { padding:0 15px; } 
#apps .main-left-txt { width:90%; } 
#apps .main-left-txt .main-title { font-size:40px; line-height:50px; } 
#apps .main-left-txt .main-txt { margin-top:20px; font-size:14px; line-height:24px; } 
#apps .loading { margin-left:-50px; margin-top:-50px } 
#apps .loading img { width:100px; } 
#apps .main-alphabet { display:none; } 
#apps .main-left-txt .main-view { margin-top:30px; } 
 } 
 
/* PEOPLE */
#people { height:100vh; position: relative; overflow: hidden; background:url("../images/bg_opacity.png") 0 0 repeat; } 
#people video { position:fixed; top:0; left:0; min-width:100%; min-height:100%; width:auto; height:auto; z-index:-1; } 
#people .bg_e { background-color:#f59b71; position:fixed; top:0; right:100%; width:50%; height:100vh; z-index:1; } 
#people .main-left-txt { position:fixed; top:30%; left:0; z-index:10; width:50%; box-sizing:border-box; padding:0 50px; } 
#people .main-left-txt p { margin:0; word-break:keep-all; transition: all 0.3s; } 
#people .main-left-txt .main-title { font-size:80px; line-height:80px; color:#fff; z-index:10; font-family: 'Space Mono', monospace; font-weight:bold; margin-left:-100px; opacity:0; } 
#people .main-left-txt .main-txt { font-size:20px; line-height:30px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-left:80px; margin-top:50px; } 
#people .main-left-txt .main-txt01 { opacity:0; } 
#people .main-left-txt .main-txt02 { opacity:0; } 
#people .main-left-txt .main-txt03 { opacity:0; } 
#people .main-left-txt .main-view { margin-left:-250px; opacity:0; margin-top:60px; margin-bottom:20px; } 
#people .main-left-txt .main-view a { display:block; font-size:15px; line-height:15px; color:#fff; font-family: 'Noto Sans KR', sans-serif; font-weight:bold; width:220px; text-align:center; padding:14px 0; border:1px solid #fff; border-radius:25px; text-decoration:none; } 
 
#people .main-alphabet { position:fixed; top:50%; left:50%; margin-left:-200px; margin-top:-231px; z-index:9; width:400px; height:462px; } 
#people .mouse-box { position:fixed; bottom:5%; left:50%; margin-left:0; z-index:10; } 
 
@media (max-width: 1200px) { 
#people .main-left-txt .main-title { font-size:60px; line-height:60px; } 
#people .main-left-txt .main-txt { margin-left:0; } 
#people .main-left-txt .main-view a { margin-left:-80px; } 
 } 
@media (max-width: 992px) { 
#people .main-left-txt .main-title { font-size:50px; line-height:60px; } 
#people .main-left-txt .main-txt { font-size:18px; } 
 } 
@media (max-width: 768px) { 
#people.mo_bg { background:url("../images/people_bg.jpg") center 0 no-repeat; background-size:auto 100vh; } 
#people .video_mo { display:none; } 
#people .main-left-txt { padding:0 15px; } 
#people .main-left-txt { width:90%; } 
#people .main-left-txt .main-title { font-size:40px; line-height:50px; } 
#people .main-left-txt .main-txt { margin-top:20px; font-size:14px; line-height:24px; } 
#people .main-alphabet { display:none; } 
#people .main-left-txt .main-view { margin-top:30px; } 
 } 
 
/* PARTNER */
#partner { height:100vh; position: relative; overflow:hidden; background:url("../images/bg_opacity.png") 0 0 repeat; } 
#partner video { position:fixed; top:0; left:0; min-width:100%; min-height:100%; width:auto; height:auto; z-index:-1; } 
#partner .bg_e { background-color:#77d0c4; position:fixed; top:0; right:100%; width:50%; height:100vh; z-index:1; } 
#partner .main-left-txt { position:fixed; top:30%; left:0; z-index:10; width:50%; box-sizing:border-box; padding:0 50px; } 
#partner .main-left-txt p { margin:0; word-break:keep-all; transition: all 0.3s; } 
#partner .main-left-txt .main-title { font-size:80px; line-height:80px; color:#fff; z-index:10; font-family: 'Space Mono', monospace; font-weight:bold; margin-left:-100px; opacity:0; } 
#partner .main-left-txt .main-txt { font-size:20px; line-height:30px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-left:80px; margin-top:50px; } 
#partner .main-left-txt .main-txt01 { opacity:0; } 
#partner .main-left-txt .main-txt02 { opacity:0; } 
#partner .main-left-txt .main-txt03 { opacity:0; } 
#partner .main-left-txt .main-view { margin-left:-250px; opacity:0; margin-top:60px; margin-bottom:20px; } 
#partner .main-left-txt .main-view a { display:block; font-size:15px; line-height:15px; color:#fff; font-family: 'Noto Sans KR', sans-serif; font-weight:bold; width:220px; text-align:center; padding:14px 0; border:1px solid #fff; border-radius:25px; text-decoration:none; } 
 
#partner .main-alphabet { position:fixed; top:50%; left:50%; margin-left:-200px; margin-top:-231px; z-index:9; width:400px; height:462px; } 
#partner .mouse-box { position:fixed; bottom:5%; left:50%; margin-left:0; z-index:10; } 
 
@media (max-width: 1200px) { 
#partner .main-left-txt .main-title { font-size:60px; line-height:60px; } 
#partner .main-left-txt .main-txt { margin-left:0; } 
#partner .main-left-txt .main-view a { margin-left:-80px; } 
 } 
@media (max-width: 992px) { 
#partner .main-left-txt .main-title { font-size:50px; line-height:60px; } 
#partner .main-left-txt .main-txt { font-size:18px; } 
 } 
@media (max-width: 768px) { 
#partner { height:auto; } 
#partner.mo_bg { background:url("../images/partner_bg.jpg") center 0 no-repeat; background-size:auto 100vh; } 
#partner .main-left-txt { padding:0 15px; } 
#partner .main-left-txt { width:90%; } 
#partner .main-left-txt .main-title { font-size:40px; line-height:50px; } 
#partner .main-left-txt .main-txt { margin-top:20px; font-size:14px; line-height:24px; } 
#partner .main-alphabet { display:none; } 
#partner .main-left-txt .main-view { margin-top:30px; } 
 } 
 
/* SUCCESSFUL */
#successful { height:100vh; position: relative; overflow: hidden; background:url("../images/bg_opacity.png") 0 0 repeat; } 
#successful video { position:fixed; top:0; left:0; min-width:100%; min-height:100%; width:auto; height:auto; z-index:-1; } 
#successful .bg_e { background-color:#ed7692; position:fixed; top:0; right:100%; width:50%; height:100vh; z-index:1; } 
#successful .main-left-txt { position:fixed; top:30%; left:0; z-index:10; width:50%; box-sizing:border-box; padding:0 50px; } 
#successful .main-left-txt p { margin:0; word-break:keep-all; transition: all 0.3s; } 
#successful .main-left-txt .main-title { font-size:80px; line-height:80px; color:#fff; z-index:10; font-family: 'Space Mono', monospace; font-weight:bold; margin-left:-100px; opacity:0; } 
#successful .main-left-txt .main-txt { font-size:20px; line-height:30px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-left:80px; margin-top:50px; } 
#successful .main-left-txt .main-txt01 { opacity:0; } 
#successful .main-left-txt .main-txt02 { opacity:0; } 
#successful .main-left-txt .main-txt03 { opacity:0; } 
#successful .main-left-txt .main-view { margin-left:-250px; opacity:0; margin-top:60px; margin-bottom:20px; } 
#successful .main-left-txt .main-view a { display:block; cursor: pointer; font-size:15px; line-height:15px; color:#fff; font-family: 'Noto Sans KR', sans-serif; font-weight:bold; width:220px; text-align:center; padding:14px 0; border:1px solid #fff; border-radius:25px; text-decoration:none; } 
 
#successful .main-alphabet { position:fixed; top:50%; left:50%; margin-left:-200px; margin-top:-231px; z-index:9; width:400px; height:462px; } 

#successful .mouse-box { position:fixed; bottom:5%; left:50%; margin-left:0; z-index:10; } 
 
@media (max-width: 1200px) { 
#successful .main-left-txt .main-title { font-size:60px; line-height:60px; } 
#successful .main-left-txt .main-txt { margin-left:0; } 
#successful .main-left-txt .main-view a { margin-left:-80px; } 
 } 
@media (max-width: 992px) { 
#successful .main-left-txt .main-title { font-size:50px; line-height:60px; } 
#successful .main-left-txt .main-txt { font-size:18px; } 
 } 
@media (max-width: 768px) { 
#successful.mo_bg { background:url("../images/successful_bg.jpg") center 0 no-repeat; background-size:auto 100vh; } 
#successful .main-left-txt { padding:0 15px; } 
#successful .main-left-txt { width:90%; } 
#successful .main-left-txt .main-title { font-size:40px; line-height:50px; } 
#successful .main-left-txt .main-txt { margin-top:20px; font-size:14px; line-height:24px; } 
#successful .main-alphabet { display:none; } 
#successful .main-left-txt .main-view { margin-top:30px; } 
 } 
 
/* SUB COMPANY */
#eo_company_box { position: relative; background:url("../images/company_bg.jpg") center 0 no-repeat; background-color:#393939; } 
#eo_company_box .bg_wrap { padding:0; } 
#eo_company_box .bg_s { background-color:#ff8a00; position:fixed; top:0; right:100%; width:40%; height:100vh; z-index:1; } 
#eo_company_box .bg_s .sub-left-txt { position:fixed; top:25%; left:0; z-index:10; width:40%; box-sizing:border-box; padding:0 50px; } 
#eo_company_box .bg_s .sub-left-txt p { margin:0; word-break:keep-all; transition: all 0.3s; } 
#eo_company_box .bg_s .sub-left-txt .sub-top-title { font-size:1.4vw; line-height:20px; color:#fff; font-family: 'Space Mono', monospace; text-decoration:line-through; opacity:0; } 
#eo_company_box .bg_s .sub-left-txt .sub-title { font-size:4vw; color:#fff; z-index:10; font-family: 'Roboto', sans-serif; margin-top:-5px; font-weight:900; opacity:0; } 
#eo_company_box .bg_s .sub-left-txt .sub-title-ment { font-size:2vw; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:-10px; opacity:0; } 
#eo_company_box .bg_s .sub-left-txt .sub-txt { font-size:17px; line-height:26px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:5vw; background:url("../images/main_txt_line.jpg") 0 4px no-repeat; padding-left:3vw; opacity:0; } 
 
#eo_company_box .right_content { padding-left:40%; } 
#eo_company_box .right_content #company01 { padding-top:70px; padding-left:80px; min-height:900px; position:relative; } 
#eo_company_box .right_content #company01 h3 { font-size:140px; line-height:1.2em; color:#fff; font-family: 'Roboto', sans-serif; font-weight:500; } 
#eo_company_box .right_content #company01 .company_tit { margin-top:100px; margin-left:200px; font-size:60px; line-height:1.2em; color:#fff; font-family: 'Noto Sans KR', sans-serif; } 
#eo_company_box .right_content #company01 .company_logo { margin-top:20px; margin-left:200px; } 
#eo_company_box .right_content #company01 .company_txt { margin-top:70px; margin-left:200px; font-size:16px; line-height:1.6em; color:#fff; font-family: 'Noto Sans KR', sans-serif; word-break:keep-all; } 
#eo_company_box .right_content #company01 .company_value { position:absolute; top:280px; left:130px; } 
#eo_company_box .right_content #company01 .company_line { position:absolute; top:230px; right:80px; } 
 
#eo_company_box .right_content #company02 { padding-top:130px; min-height:900px; } 
#eo_company_box .right_content #company02 h3 { margin-left:80px; padding-bottom:40px; background:url("../images/company_title_line.jpg") 0 bottom no-repeat; } 
#eo_company_box .right_content #company02 .title_ment { font-size:30px; line-height:1.2em; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin:0 80px; margin-top:35px; } 
#eo_company_box .right_content #company02 .title_txt { font-size:14px; line-height:25px; color:#a8a8a8; font-family: 'Noto Sans KR', sans-serif; margin:0 80px; margin-top:25px; } 
#eo_company_box .right_content #company02 .apps_list { margin:50px 80px 0 80px; } 
#eo_company_box .right_content #company02 .apps_list .grid-item { padding:10px; width:50%; box-sizing:border-box; margin:0; } 
#eo_company_box .right_content #company02 .apps_list .grid-item img { width:100%; } 
 
#eo_company_box .right_content #company02 .certificate_list { margin:50px 85px 0 85px; } 
#eo_company_box .right_content #company02 .certificate_list .grid-item { padding:5px; width:25%; box-sizing:border-box; margin:0; } 
#eo_company_box .right_content #company02 .certificate_list .grid-item img { width:100%; } 


#eo_company_box .right_content #company03 { padding-top:130px; min-height:900px; } 
#eo_company_box .right_content #company03 h3 { margin-left:80px; padding-bottom:40px; background:url("../images/company_title_line.jpg") 0 bottom no-repeat; } 
#eo_company_box .right_content #company03 .value_list { list-style:none; padding:0; margin-top:40px; padding-left:18%; min-height:220px; background:url("../images/company_value_long_line.jpg") 0 75px no-repeat; } 
#eo_company_box .right_content #company03 .value_list li { float:left; padding-left:7%; background:url("../images/company_value_line.jpg") 0 75px repeat-x; min-height:220px; } 
#eo_company_box .right_content #company03 .value_list li .eng_tit { font-size:15px; line-height:15px; color:#818181; text-align:center; font-family: 'Noto Sans KR', sans-serif; text-align:center; } 
#eo_company_box .right_content #company03 .value_list li .tit { font-size:20px; line-height:20px; color:#fff; text-align:center; font-family: 'Noto Sans KR', sans-serif; text-align:center; } 
#eo_company_box .right_content #company03 .value_ment { font-size:40px; line-height:40px; color:#fff; font-family: 'Noto Sans KR', sans-serif; padding-left:32%; font-weight:100; margin-top:40px; } 
#eo_company_box .right_content #company03 .value_ment strong { color:#ff8a00; } 
 
#eo_company_box .right_content #company04 { padding-top:130px; min-height:800px; } 
#eo_company_box .right_content #company04 h3 { margin-left:80px; padding-bottom:40px; background:url("../images/company_title_line.jpg") 0 bottom no-repeat; } 
#eo_company_box .right_content #company04 .service_ment { font-size:40px; line-height:1.2em; color:#fff; font-family: 'Noto Sans KR', sans-serif; padding-left:80px; font-weight:100; margin-top:40px; } 
#eo_company_box .right_content #company04 .service_ment strong { color:#ff8a00; } 
#eo_company_box .right_content #company04 .service_list { list-style:none; margin-top:90px; padding-left:17%; width:100%; box-sizing:border-box; padding-right:50px; } 
#eo_company_box .right_content #company04 .service_list li { margin-bottom:50px; background:url("../images/company_service_line.jpg") 0 0 no-repeat; width:50%; float:left; } 
#eo_company_box .right_content #company04 .service_list li .tit { font-size:25px; line-height:1.2em; color:#fff; font-family: 'Noto Sans KR', sans-serif; padding-top:25px; } 
#eo_company_box .right_content #company04 .service_list li .txt { font-size:15px; line-height:1.6em; color:#868686; font-family: 'Noto Sans KR', sans-serif; margin-top:15px; } 

/*#eo_company_box .right_content #company05 { padding-top:130px; min-height:600px; } 
#eo_company_box .right_content #company05 h3 { margin-left:80px; padding-bottom:40px; background:url("../images/company_title_line.jpg") 0 bottom no-repeat; } 
#eo_company_box .right_content #company05 .certificate_list { margin-left:80px; margin-top:30px; padding:0; list-style:none; } 
#eo_company_box .right_content #company05 .certificate_list li { float:left; padding:0; width:48%; margin-right:2% } 
#eo_company_box .right_content #company05 .certificate_list li .pic { text-align:center; } 
#eo_company_box .right_content #company05 .certificate_list li .txt { font-size:14px; line-height:1.6em; color:#fff; font-family: 'Noto Sans KR', sans-serif; } 
*/

#eo_company_box .right_content #company06 { padding-top:130px; padding-bottom: 130px; min-height:900px; } 
#eo_company_box .right_content #company06 h3 { margin-left:80px; padding-bottom:40px; background:url("../images/company_title_line.jpg") 0 bottom no-repeat; } 

#eo_company_box .right_content #company06 .grid { margin-top: 40px; padding-left: 80px; } 


@media (max-width: 1200px) { 
#eo_company_box .right_content #company01 { padding-left:50px; } 
#eo_company_box .right_content #company01 h3 { font-size:100px; line-height:140px; color:#fff; font-family: 'Roboto', sans-serif; font-weight:500; } 
#eo_company_box .right_content #company01 .company_tit { margin-left:0; } 
#eo_company_box .right_content #company01 .company_logo { margin-left:0; } 
#eo_company_box .right_content #company01 .company_txt { margin-left:0; } 
#eo_company_box .right_content #company01 .company_value { display:none; } 
#eo_company_box .right_content #company01 .company_line { display:none; } 
 
#eo_company_box .right_content #company02 { background-size:auto 100%; padding-bottom:50px; } 
#eo_company_box .right_content #company02 h3 { margin:0 50px; } 
#eo_company_box .right_content #company02 .title_ment { margin:0 50px; margin-top:35px; } 
#eo_company_box .right_content #company02 .title_txt { margin:0 50px; margin-top:25px; } 
#eo_company_box .right_content #company02 .apps_list { margin:20px 50px 0 50px; } 
#eo_company_box .right_content #company02 .apps_list .grid-item { width:50%; } 
 
#eo_company_box .right_content #company02 .certificate_list { margin:50px 55px 0 55px; } 

#eo_company_box .right_content #company03 h3 { margin:0 50px; } 
#eo_company_box .right_content #company03 .value_list { padding:0 50px; margin-top:40px; min-height:auto; background-image:none; box-sizing:border-box; } 
#eo_company_box .right_content #company03 .value_list li { float:left; background-image:none; width:32%; margin-left:2%; padding-left:0; min-height:auto; } 
#eo_company_box .right_content #company03 .value_list li:first-child { margin-left:0; } 
#eo_company_box .right_content #company03 .value_list li .icon img { width:100%; } 
#eo_company_box .right_content #company03 .value_list li .eng_tit { font-size:15px; line-height:15px; color:#818181; text-align:center; font-family: 'Noto Sans KR', sans-serif; text-align:center; } 
#eo_company_box .right_content #company03 .value_list li .tit { font-size:20px; line-height:20px; color:#fff; text-align:center; font-family: 'Noto Sans KR', sans-serif; text-align:center; } 
#eo_company_box .right_content #company03 .value_ment { padding:0; text-align:center; font-size:4vw } 
#eo_company_box .right_content #company03 .value_ment strong { color:#ff8a00; } 
 
#eo_company_box .right_content #company04 h3 { margin:0 50px; } 
#eo_company_box .right_content #company04 .service_ment { padding-left:50px; } 
#eo_company_box .right_content #company04 .service_list { padding-left:50px; } 
#eo_company_box .right_content #company04 .service_list li { margin-bottom:30px; } 
#eo_company_box .right_content #company04 .service_list li .txt { font-size:14px; } 

#eo_company_box .right_content #company06 h3 { margin:0 50px; } 
#eo_company_box .right_content #company06 .grid { padding-left: 50px; } 

 } 
 
@media (max-width: 992px) { 
#eo_company_box .right_content #company04 .service_list li { width:100%; } 
 } 
 
@media (max-width: 768px) { 
#eo_company_box .bg_s_mo { background-color:#ff8a00; position:relative; width:100%; padding:100px 20px 40px; } 
#eo_company_box .bg_s_mo .sub-left-txt p { margin:0; word-break:keep-all; } 
#eo_company_box .bg_s_mo .sub-left-txt .sub-top-title { font-size:20px; line-height:20px; color:#fff; font-family: 'Space Mono', monospace; text-decoration:line-through; } 
#eo_company_box .bg_s_mo .sub-left-txt .sub-title { font-size:32px; line-height:32px; color:#fff; z-index:10; font-family: 'Noto Sans KR', sans-serif; margin-top:10px; font-weight:bold; } 
#eo_company_box .bg_s_mo .sub-left-txt .sub-title-ment { font-size:20px; line-height:24px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:10px; } 
#eo_company_box .bg_s_mo .sub-left-txt .sub-txt { font-size:15px; line-height:22px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:40px; background:url("../images/main_txt_line.jpg") 0 4px no-repeat; padding-left:30px; padding-right:0; } 
 
#eo_company_box .right_content { padding:0 20px; } 
#eo_company_box .right_content #company01 { padding:30px 0; min-height:auto; } 
#eo_company_box .right_content #company01 h3 { font-size:50px; line-height:40px; } 
#eo_company_box .right_content #company01 .company_tit { margin-top:40px; font-size:28px; } 
#eo_company_box .right_content #company01 .company_txt { word-break:keep-all; } 
#eo_company_box .right_content #company01 .company_value { position:absolute; top:280px; left:15%; } 
#eo_company_box .right_content #company01 .company_line { position:absolute; top:230px; right:5%; } 
 
#eo_company_box .right_content #company02 { margin:0; padding:30px 0; min-height:auto; } 
#eo_company_box .right_content #company02 h3 { margin:0; padding-bottom:30px; margin-bottom:40px; } 
#eo_company_box .right_content #company02 .title_ment { margin:0; margin-top:35px; } 
#eo_company_box .right_content #company02 .title_txt { margin:0; margin-top:25px; } 
#eo_company_box .right_content #company02 .apps_list { margin:20px 0 0 0; } 
#eo_company_box .right_content #company02 .certificate_list { margin:40px 0 0 0; } 
#eo_company_box .right_content #company02 .certificate_list .grid-item { padding:10px; width:50%; } 


#eo_company_box .right_content #company03 { padding:30px 0; min-height:auto; } 
#eo_company_box .right_content #company03 h3 { margin:0; padding-bottom:30px; margin-bottom:40px; } 
#eo_company_box .right_content #company03 .value_list { padding:0; margin-top:5vw; } 
#eo_company_box .right_content #company03 .value_ment { font-size:7.5vw; margin-top:5vw; } 
 
#eo_company_box .right_content #company04 { padding:30px 0; min-height:auto; } 
#eo_company_box .right_content #company04 h3 { margin:0; padding-bottom:30px; } 
#eo_company_box .right_content #company04 .service_ment { padding:0; font-size:31px; } 
#eo_company_box .right_content #company04 .service_list { padding:0; margin-top:40px; } 



#eo_company_box .right_content #company06 { padding:30px 0; min-height:auto; } 
#eo_company_box .right_content #company06 h3 { margin:0; padding-bottom:30px; margin-bottom:40px; } 
#eo_company_box .right_content #company06 .grid { padding-left: 0; } 
#company06 .grid-item{
    width:50%;
    box-sizing:border-box;
    padding:4px; /* 이미지 사이 여백, 기존 값 있으면 맞춰서 조정 */
  }

 } 
 @media (max-width: 500px) { 
#eo_company_box .right_content #company02 .apps_list .grid-item { padding:5px; } 
#eo_company_box .right_content #company02 .certificate_list .grid-item { padding:5px; } 
 } 

/* SUB SERVICE */
#eo_service_box { position: relative; background:url("../images/sub_service_bg.jpg") center 0 no-repeat; background-color:#393939; background-attachment: fixed; } 
#eo_service_box .bg_wrap { padding:0; } 
#eo_service_box .bg_s { background-color:#587bd5; position:fixed; top:0; right:100%; width:40%; height:100vh; z-index:1; } 
#eo_service_box .bg_s .sub-left-txt { position:fixed; top:25%; left:0; z-index:10; width:40%; box-sizing:border-box; padding:0 50px; } 
#eo_service_box .bg_s .sub-left-txt p { margin:0; word-break:keep-all; transition: all 0.3s; } 
#eo_service_box .bg_s .sub-left-txt .sub-top-title { font-size:1.4vw; line-height:20px; color:#fff; font-family: 'Space Mono', monospace; text-decoration:line-through; opacity:0; } 
#eo_service_box .bg_s .sub-left-txt .sub-title { font-size:4vw; color:#fff; z-index:10; font-family: 'Roboto', sans-serif; margin-top:-5px; font-weight:900; opacity:0; } 
#eo_service_box .bg_s .sub-left-txt .sub-title-ment { font-size:2vw; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:-10px; opacity:0; } 
#eo_service_box .bg_s .sub-left-txt .sub-txt { font-size:17px; line-height:26px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:5vw; background:url("../images/main_txt_line.jpg") 0 4px no-repeat; padding-left:3vw; opacity:0; } 
 
#eo_service_box .right_content { padding-left:40%; } 
#eo_service_box .right_content #service01 { padding-top:90px; padding-left:80px; min-height:900px; position:relative; } 
#eo_service_box .right_content #service01 h3 { font-size:50px; line-height:1.2em; color:#fff; font-family: 'Roboto', sans-serif; font-weight:100; padding-bottom:40px; background:url("../images/service_title_line.jpg") 0 bottom no-repeat; } 
#eo_service_box .right_content #service01 .service_info { list-style:none; padding:0; margin-top:220px; } 
#eo_service_box .right_content #service01 .service_info:after { content:""; clear:both; display:block; } 
#eo_service_box .right_content #service01 .service_info li { float:left; width:32%; margin-right:1%; } 
#eo_service_box .right_content #service01 .service_info li .eng_tit { font-size:25px; line-height:1.2em; color:#fff; font-family: 'Noto Sans KR', sans-serif; } 
#eo_service_box .right_content #service01 .service_info li .tit { font-size:15px; line-height:1.6empx; color:#e4e4e4; font-family: 'Noto Sans KR', sans-serif; word-break:keep-all; padding-right:10px; letter-spacing:-0.5px; } 
 
#eo_service_box .right_content #service02 { padding:120px 80px 0; min-height:900px; position:relative; } 
#eo_service_box .right_content #service02 h3 { font-size:50px; line-height:1.2em; color:#fff; font-family: 'Roboto', sans-serif; font-weight:100; padding-bottom:40px; background:url("../images/service_title_line.jpg") 0 bottom no-repeat; } 
#eo_service_box .right_content #service02 .service_step { list-style:none; padding:0; margin-top:220px; padding-right:50px; } 
#eo_service_box .right_content #service02 .service_step li { float:left; width:25%; background:url("../images/service_step_line.png") 0 0 no-repeat; padding-top:40px; padding-bottom:60px; } 
#eo_service_box .right_content #service02 .service_step li .tit { font-size:25px; line-height:1.2em; color:#fff; font-weight:bold; font-family: 'Noto Sans KR', sans-serif; } 
#eo_service_box .right_content #service02 .service_step li .tit strong { color:#ff8a00; font-weight:bold; } 
#eo_service_box .right_content #service02 .service_step li .txt { font-size:15px; line-height:1.6em; min-height:48px; color:#e4e4e4; font-family: 'Noto Sans KR', sans-serif; word-break:keep-all; padding-right:10px; letter-spacing:-0.5px; } 
 
#eo_service_box .right_content #service03 { padding:120px 80px 0; min-height:900px; position:relative; } 
#eo_service_box .right_content #service03 h3 { font-size:50px; line-height:1.2em; color:#fff; font-family: 'Roboto', sans-serif; font-weight:100; padding-bottom:40px; background:url("../images/service_title_line.jpg") 0 bottom no-repeat; } 
#eo_service_box .right_content #service03 .service_skill { list-style:none; padding:0; margin-top:80px; } 
#eo_service_box .right_content #service03 .service_skill li { float:left; width:50%; padding-right:10px; box-sizing:border-box; background:url("../images/service_skill_line.jpg") 0 0 no-repeat; padding-top:40px; padding-bottom:0; } 
#eo_service_box .right_content #service03 .service_skill li .tit { font-size:25px; line-height:1.2em; color:#fff; font-weight:bold; font-family: 'Noto Sans KR', sans-serif; transition: all 0.3s; min-height:32px; } 
#eo_service_box .right_content #service03 .service_skill li .tit:hover { color:#ff8a00; } 
#eo_service_box .right_content #service03 .service_skill li .tit .ment { font-size:16px; line-height:25px; } 
#eo_service_box .right_content #service03 .service_skill li .tit strong { color:#ff8a00; font-weight:bold; } 
#eo_service_box .right_content #service03 .service_skill li .txt { font-size:15px; line-height:1.6em; color:#e4e4e4; font-family: 'Noto Sans KR', sans-serif; word-break:keep-all; padding-right:10px; letter-spacing:-0.5px; height:77px; overflow:hidden; } 

#eo_service_box .right_content #service04 { padding:120px 80px 0; min-height:900px; position:relative; clear:both; } 
#eo_service_box .right_content #service04 h3 { font-size:50px; line-height:1.2em; color:#fff; font-family: 'Roboto', sans-serif; font-weight:100; padding-bottom:40px; background:url("../images/service_title_line.jpg") 0 bottom no-repeat; } 
#eo_service_box .right_content #service04 .service_skill { list-style:none; padding:0; margin-top:80px; } 
#eo_service_box .right_content #service04 .service_skill li { width:100%; padding-right:10px; box-sizing:border-box; background:url("../images/service_skill_line.jpg") 0 0 no-repeat; padding-top:40px; padding-bottom:0; } 
#eo_service_box .right_content #service04 .service_skill li .tit { font-size:25px; line-height:1.2em; color:#fff; font-weight:bold; font-family: 'Noto Sans KR', sans-serif; transition: all 0.3s; min-height:32px; } 
#eo_service_box .right_content #service04 .service_skill li .tit:hover { color:#ff8a00; } 
#eo_service_box .right_content #service04 .service_skill li .tit .ment { font-size:16px; line-height:25px; } 
#eo_service_box .right_content #service04 .service_skill li .tit strong { color:#ff8a00; font-weight:bold; } 
#eo_service_box .right_content #service04 .service_skill li .tit .detail { border:1px solid #daff48; color:#daff48; border-radius:5px; font-size:14px; line-height:30px; text-align:center; float:right; padding:0 10px; font-weight:400; cursor:pointer; } 
#eo_service_box .right_content #service04 .service_skill li .txt { font-size:15px; line-height:1.6em; color:#e4e4e4; font-family: 'Noto Sans KR', sans-serif; word-break:keep-all; padding-right:10px; letter-spacing:-0.5px; height:77px; overflow:hidden; } 
 
@media (max-width: 1200px) { 
#eo_service_box .right_content #service01 { padding-left:50px; padding-right:50px; } 
#eo_service_box .right_content #service01 .service_info li .icon img { width:90%; max-width:160px; } 
#eo_service_box .right_content #service01 .service_info li .eng_tit { font-size:22px; } 
#eo_service_box .right_content #service01 .service_info li .tit { font-size:14px; } 

#eo_service_box .right_content #service02 { padding:120px 50px 0; } 
#eo_service_box .right_content #service02 h3 { margin:0; } 
#eo_service_box .right_content #service02 .service_step { padding-right:0; } 
#eo_service_box .right_content #service03 .service_skill li { padding-right:0; } 
#eo_service_box .right_content #service02 .service_step li .tit { font-size:22px; } 
#eo_service_box .right_content #service02 .service_step li .txt { font-size:14px; } 
 
#eo_service_box .right_content #service03 { padding:120px 50px 0; } 
#eo_service_box .right_content #service03 h3 { margin:0; } 
#eo_service_box .right_content #service03 .service_skill li .txt { font-size:14px; height:70px; } 
 
#eo_service_box .right_content #service04 { padding:120px 50px 0; } 
#eo_service_box .right_content #service04 h3 { margin:0; } 
#eo_service_box .right_content #service04 .service_skill li .txt { font-size:14px; height:70px; } 
 } 
@media (max-width: 992px) { 
#eo_service_box .right_content #service03 .service_list li .txt { font-size:12px; } 
#eo_service_box .right_content #service04 .service_list li .txt { font-size:12px; } 
 } 
@media (max-width: 768px) { 
#eo_service_box .bg_s_mo { background-color:#587bd5; position:relative; width:100%; padding:100px 20px 40px; } 
#eo_service_box .bg_s_mo .sub-left-txt p { margin:0; word-break:keep-all; } 
#eo_service_box .bg_s_mo .sub-left-txt .sub-top-title { font-size:20px; line-height:20px; color:#fff; font-family: 'Space Mono', monospace; text-decoration:line-through; } 
#eo_service_box .bg_s_mo .sub-left-txt .sub-title { font-size:32px; line-height:32px; color:#fff; z-index:10; font-family: 'Noto Sans KR', sans-serif; margin-top:10px; font-weight:bold; } 
#eo_service_box .bg_s_mo .sub-left-txt .sub-title-ment { font-size:20px; line-height:24px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:10px; } 
#eo_service_box .bg_s_mo .sub-left-txt .sub-txt { font-size:15px; line-height:22px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:40px; background:url("../images/main_txt_line.jpg") 0 4px no-repeat; padding-left:30px; padding-right:0; } 
 
#eo_service_box .right_content { padding:0 20px; } 
#eo_service_box .right_content #service01 { padding:30px 0; min-height:auto; } 
#eo_service_box .right_content #service01 h3 { font-size:30px; padding-bottom:15px; } 
#eo_service_box .right_content #service01 .service_info { margin-top:70px; } 
#eo_service_box .right_content #service01 .service_info li { float:none; width:auto; margin-bottom:40px; display:inline-block; } 
 
#eo_service_box .right_content #service02 { padding:30px 0; min-height:auto; } 
#eo_service_box .right_content #service02 h3 { font-size:30px; padding-bottom:15px; } 
#eo_service_box .right_content #service02 .service_step { margin-top:70px; } 
#eo_service_box .right_content #service02 .service_step li { width:50%; padding-top:25px; padding-bottom:20px; } 
#eo_service_box .right_content #service02 .service_step li .txt { min-height:auto; } 

#eo_service_box .right_content #service03 { padding:30px 0; min-height:auto; margin-top:40px; } 
#eo_service_box .right_content #service03 h3 { font-size:30px; padding-bottom:15px; } 
#eo_service_box .right_content #service03 .service_skill { margin-top:50px; } 
#eo_service_box .right_content #service03 .service_skill li { width:100%; float:none; } 

#eo_service_box .right_content #service04 { padding:30px 0; min-height:auto; margin-top:40px; } 
#eo_service_box .right_content #service04 h3 { font-size:30px; padding-bottom:15px; } 
#eo_service_box .right_content #service04 .service_skill { margin-top:50px; } 
 } 
 
/* EO APPS */
#eo_apps_box { position: relative; background-color:#f1f1f1; padding-top:200px; padding-bottom:80px; } 
#eo_apps_box .port_list .grid-item { width:18%; box-sizing:border-box; margin:1%; background-color:#fff; position:relative; cursor:pointer; } 
#eo_apps_box .port_list .grid-item a { display:block; } 
#eo_apps_box .port_list .grid-item img { margin:0 auto; } 
#eo_apps_box .port_list .grid-item .tit { font-size:16px; line-height:1.2em; color:#000; font-family: 'Noto Sans KR', sans-serif; text-align:center; margin:0 10px; } 
#eo_apps_box .port_list .grid-item .tit_menu { font-size:14px; line-height:1.2em; color:#878686; font-family: 'Noto Sans KR', sans-serif; text-align:center; margin:0 10px 20px; } 
#eo_apps_box .port_list .grid-item .over_box { background:rgba(0,0,0,0.5); position:absolute; bottom:0; left:0; width:100%; height:100%; opacity:0; transition: all 0.3s; z-index:1; box-sizing:border-box; } 
#eo_apps_box .port_list .grid-item .over_box .over_tit { font-size:25px; line-height:1.2em; color:#fff; font-family: 'Noto Sans KR', sans-serif; position:absolute; top:30px; left:0; width:100%; box-sizing:border-box; padding:0 30px; z-index:10; } 
#eo_apps_box .port_list .grid-item .over_box .over_tit02 { font-size:25px; line-height:1.2em; color:#fff; font-family: 'Noto Sans KR', sans-serif; text-align:center; position:absolute; top:85px; left:0; width:100%; box-sizing:border-box; padding:0 30px; z-index:10; } 
#eo_apps_box .port_list .grid-item .over_box .over_ment { font-size:14px; line-height:1.2em; color:#fff; font-family: 'Noto Sans KR', sans-serif; position:absolute; top:65px; left:0; width:100%; box-sizing:border-box; padding:0 30px; z-index:10; } 
#eo_apps_box .port_list .grid-item .over_box .over_ment02 { font-size:14px; line-height:1.8em; color:#fff; font-family: 'Noto Sans KR', sans-serif; text-align:center; position:absolute; top:130px; left:0; width:100%; box-sizing:border-box; padding:0 30px; z-index:10; } 
#eo_apps_box .port_list .grid-item .over_box .over_txt { font-size:14px; line-height:1.8em; color:#cdcdcd; font-family: 'Noto Sans KR', sans-serif; position:absolute; top:105px; left:0; width:100%; box-sizing:border-box; padding:0 30px; z-index:10; } 
#eo_apps_box .port_list .grid-item .over_box .over_more { position:absolute; bottom:2%; right:6%; z-index:11; transform: rotate(0deg); transition: all 0.3s; } 
#eo_apps_box .port_list .grid-item .over_box .center_more { position:absolute; top:50%; left:50%; margin:-12px 0 0 -12px; z-index:11; transform: rotate(0deg); transition: all 0.3s; display:none; } 

#eo_apps_box .port_list .grid-item:hover .tit { opacity:0; } 
#eo_apps_box .port_list .grid-item:hover .tit_menu { opacity:0; } 
#eo_apps_box .port_list .grid-item:hover .over_box { opacity:1; } 
#eo_apps_box .port_list .grid-item:hover .over_box .over_more { transform: rotate(180deg); } 
#eo_apps_box .port_list .grid-item:hover .over_box .center_more { transform: rotate(180deg); } 
#eo_apps_box .port_more { margin-top:80px; } 
#eo_apps_box .port_more a { display:block; font-family: 'Noto Sans KR', sans-serif; width:180px; font-size:16px; line-height:16px; padding:17px 0; text-align:center; margin:0 auto; background-color:#d7d7d7; color:#fff; font-weight:bold; border-radius:35px; } 
 


 @media (max-width: 1500px) { 
#eo_apps_box .port_list .grid-item { width:23%; } 
 } 

@media (max-width: 1200px) { 
#eo_apps_box .port_list .grid-item { width:31%; } 
 } 
@media (max-width: 992px) { 
#eo_apps_box .port_list .grid-item { width:47%; margin:1.5% } 
 } 

@media (max-width: 768px) { 
#eo_apps_box { padding-top:120px; padding-bottom:40px; } 
#eo_apps_box .port_list .grid-item .over_box { display:none; } 
#eo_apps_box .port_list .grid-item:hover .over_box { opacity:0; display:none; } 
#eo_apps_box .port_list .grid-item:hover .tit { opacity:1; } 
#eo_apps_box .port_list .grid-item:hover .tit_menu { opacity:1; } 
 } 

 
/* SUB PORTFOLIO */
#eo_portfolio .bg_wrap { padding:0; } 
#eo_portfolio .bg_s { background-color:#e0322b; position:fixed; top:0; right:100%; width:50%; height:100vh; z-index:1; } 
#eo_portfolio .bg_s .sub-left-txt { position:fixed; top:22%; left:0; z-index:10; box-sizing:border-box; padding:0 120px; width:50%; } 
#eo_portfolio .bg_s .sub-left-txt p { margin:0; word-break:keep-all; transition: all 0.3s; } 
#eo_portfolio .bg_s .sub-left-txt .top-line { top:0; left:0; background:rgba(255,255,255,0.2); width:0; height:5px; opacity:0; } 
#eo_portfolio .bg_s .sub-left-txt .top-line strong { display:block; background-color:#fff; width:50px; height:5px; } 
#eo_portfolio .bg_s .sub-left-txt .sub-title { font-size:4vw; color:#fff; z-index:10; font-family: 'Noto Sans KR', sans-serif; font-weight:bold; opacity:0; margin-top:30px; } 
#eo_portfolio .bg_s .sub-left-txt .sub-title-ment { font-size:1.4vw; color:#eee; font-family: 'Noto Sans KR', sans-serif; font-weight:100; opacity:0; } 
#eo_portfolio .bg_s .sub-left-txt .sub-txt { font-size:17px; line-height:26px; color:#eee; font-family: 'Noto Sans KR', sans-serif; margin-top:50px; opacity:0; } 
#eo_portfolio .bg_s .sub-left-txt .sub-type { margin-top:50px; } 
#eo_portfolio .bg_s .sub-left-txt .sub-type .type { display:inline-block; font-size:15px; line-height:25px; font-weight:100; color:#fff; padding:0 15px; border-radius:25px; background:rgba(0,0,0,0.5); margin-right:5px; margin-bottom:5px; opacity:0.5; } 
#eo_portfolio .bg_s .sub-left-txt .port-btn { margin-top:220px; position:relative; font-size:20px; line-height:60px; color:#fff; font-family: 'Space Mono', monospace; } 
#eo_portfolio .bg_s .sub-left-txt .port-btn .p-btn { list-style:none; position:absolute; top:0; right:0; } 
#eo_portfolio .bg_s .sub-left-txt .port-btn .p-btn li { float:left; margin-left:10px; } 
 
/* 2022.08.12 수정*/
#eo_portfolio .bg_s .sub-left-txt { padding-top: 280px; } 
#eo_portfolio .bg_s .sub-left-txt .port-btn { margin-top: 0 !important; position: absolute; top: 0; width: calc(100% - 240px); left: 120px; } 


#eo_portfolio .right_content { overflow:hidden; } 
#eo_portfolio .right_content #detail01 { height:90vh; background-color:#fff; text-align:right; } 
#eo_portfolio .right_content #detail01 img { height:90vh; } 
#eo_portfolio .right_content #detail02 { height:100vh; background-color:#d0d0d0; text-align:right; overflow:hidden; } 
#eo_portfolio .right_content #detail02 img { height:100vh; margin-right:-10%; } 
#eo_portfolio .right_content #detail03 { height:100vh; background-color:#fff; text-align:right; } 
#eo_portfolio .right_content #detail03 img { height:100vh; } 
#eo_portfolio .right_content #detail04 { height:100vh; background-color:#edf2f6; text-align:right; } 
#eo_portfolio .right_content #detail04 img { height:100vh; margin-right:-15%; } 
#eo_portfolio .right_content #detail05 { height:100vh; background-color:#fff; text-align:right; } 
#eo_portfolio .right_content #detail05 img { height:100vh; margin-right:-15%; } 
#eo_portfolio .right_content #detail_all { text-align:right; } 
#eo_portfolio .right_content #detail_all img { width:50%; } 


@media (max-width: 1200px) { 
 /* 2022.08.12 수정*/
 #eo_portfolio .bg_s .sub-left-txt { padding:280px 50px 0; } 
 #eo_portfolio .bg_s .sub-left-txt .port-btn { width:calc(100% - 100px); left:50px; } 
 } 
@media (max-width: 992px) { 
 
 } 
@media (max-width: 768px) { 
#eo_portfolio .bg_s_mo { background-color:#e0322b; position:relative; width:100%; padding:100px 20px 40px; } 
#eo_portfolio .bg_s_mo .sub-left-txt p { margin:0; word-break:keep-all; } 
#eo_portfolio .bg_s_mo .sub-left-txt .top-line { top:0; left:0; background:rgba(255,255,255,0.2); width:0; height:5px; opacity:0; } 
#eo_portfolio .bg_s_mo .sub-left-txt .top-line strong { display:block; background-color:#fff; width:50px; height:5px; } 
#eo_portfolio .bg_s_mo .sub-left-txt .sub-title { font-size:32px; line-height:32px; color:#fff; z-index:10; font-family: 'Noto Sans KR', sans-serif; margin-top:15px; font-weight:bold; } 
#eo_portfolio .bg_s_mo .sub-left-txt .sub-title-ment { font-size:18px; line-height:24px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:10px; } 
#eo_portfolio .bg_s_mo .sub-left-txt .sub-txt { font-size:15px; line-height:22px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:20px; padding-right:0; } 
#eo_portfolio .bg_s_mo .sub-left-txt .sub-type { margin-top:20px; } 
#eo_portfolio .bg_s_mo .sub-left-txt .sub-type .type { display:inline-block; font-size:15px; line-height:25px; font-weight:100; color:#fff; padding:0 15px; border-radius:25px; background:rgba(0,0,0,0.5); margin-right:5px; margin-bottom:5px; opacity:0.5; } 
#eo_portfolio .bg_s_mo .sub-left-txt .port-btn_mo { margin-top:20px; position:relative; font-size:20px; line-height:60px; color:#fff; font-family: 'Space Mono', monospace; } 
#eo_portfolio .bg_s_mo .sub-left-txt .port-btn_mo .p-btn { list-style:none; position:absolute; top:0; right:0; } 
#eo_portfolio .bg_s_mo .sub-left-txt .port-btn_mo .p-btn li { float:left; margin-left:10px; } 
#eo_portfolio .right_content { padding-left:0; } 
 
#eo_portfolio .right_content #detail01 { height:auto; background-color:#fff; text-align:left; } 
#eo_portfolio .right_content #detail01 img { height:auto; width:100%; } 
#eo_portfolio .right_content #detail02 { height:auto; background-color:#d0d0d0; text-align:left; overflow:hidden; } 
#eo_portfolio .right_content #detail02 img { height:auto; margin-right:0; width:100%; } 
#eo_portfolio .right_content #detail03 { height:auto; background-color:#d0d0d0; text-align:left; overflow:hidden; } 
#eo_portfolio .right_content #detail03 img { height:auto; margin-right:0; width:100%; } 
#eo_portfolio .right_content #detail04 { height:auto; background-color:#edf2f6; text-align:left; overflow:hidden; } 
#eo_portfolio .right_content #detail04 img { height:auto; margin-right:0; width:100%; } 
#eo_portfolio .right_content #detail05 { height:auto; background-color:#edf2f6; text-align:left; overflow:hidden; } 
#eo_portfolio .right_content #detail05 img { height:auto; margin-right:0; width:100%; } 
#eo_portfolio .right_content #detail_all { margin-right:0; } 
#eo_portfolio .right_content #detail_all img { width:100% } 

 /* 2022.08.12 수정*/
#eo_portfolio .bg_s_mo .sub-left-txt { padding-top: 85px; position: relative; } 
 #eo_portfolio .bg_s_mo .sub-left-txt .port-btn_mo { margin-top:0; position: absolute; top: 0; left: 0; width: 100%; } 

 } 
 
 /* SUB PORTFOLIO */
#eo_app { position: relative; } 
#eo_app .bg_wrap { padding:0; } 
#eo_app .bg_s { background-color:#a6cd1f; position:fixed; top:0; right:100%; width:40%; height:100vh; z-index:1; } 
#eo_app .bg_s .sub-left-txt { position:fixed; top:25%; left:0; z-index:10; width:40%; box-sizing:border-box; padding:0 50px; } 
#eo_app .bg_s .sub-left-txt p { margin:0; word-break:keep-all; transition: all 0.3s; } 
#eo_app .bg_s .sub-left-txt .sub-top-title { font-size:1.4vw; line-height:20px; color:#fff; font-family: 'Space Mono', monospace; text-decoration:line-through; opacity:0; } 
#eo_app .bg_s .sub-left-txt .sub-title { font-size:4vw; color:#fff; z-index:10; font-family: 'Roboto', sans-serif; margin-top:-5px; font-weight:900; opacity:0; } 
#eo_app .bg_s .sub-left-txt .sub-title-ment { font-size:2vw; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:-10px; opacity:0; } 
#eo_app .bg_s .sub-left-txt .sub-txt { font-size:17px; line-height:26px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:5vw; background:url("../images/main_txt_line.jpg") 0 4px no-repeat; padding-left:3vw; opacity:0; } 
 
#eo_app .right_content { padding-left:40%; background-color:#f1f1f1; padding-bottom:50px; } 
#eo_app .port_list { margin:0 40px; padding:30px 0; } 
#eo_app .port_list .grid-item { width:31%; box-sizing:border-box; margin:1%; background-color:#fff; position:relative; cursor:pointer; } 
#eo_app .port_list .grid-item a { display:block; } 
#eo_app .port_list .grid-item img { margin:0 auto; } 
#eo_app .port_list .grid-item .tit { font-size:16px; line-height:1.2em; color:#000; font-family: 'Noto Sans KR', sans-serif; text-align:center; margin:0 10px; } 
#eo_app .port_list .grid-item .tit_menu { font-size:14px; line-height:1.2em; color:#878686; font-family: 'Noto Sans KR', sans-serif; text-align:center; margin:0 10px 20px; } 
#eo_app .port_list .grid-item .over_box { background:rgba(0,0,0,0.5); position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; transition: all 0.3s; z-index:1; box-sizing:border-box; } 
#eo_app .port_list .grid-item .over_box .over_tit { font-size:25px; line-height:1.2em; color:#fff; font-family: 'Noto Sans KR', sans-serif; position:absolute; top:30px; left:0; width:100%; box-sizing:border-box; padding:0 30px; z-index:10; } 
#eo_app .port_list .grid-item .over_box .over_tit02 { font-size:25px; line-height:1.2em; color:#fff; font-family: 'Noto Sans KR', sans-serif; text-align:center; position:absolute; top:85px; left:0; width:100%; box-sizing:border-box; padding:0 30px; z-index:10; } 
#eo_app .port_list .grid-item .over_box .over_ment { font-size:14px; line-height:1.2em; color:#fff; font-family: 'Noto Sans KR', sans-serif; position:absolute; top:65px; left:0; width:100%; box-sizing:border-box; padding:0 30px; z-index:10; } 
#eo_app .port_list .grid-item .over_box .over_ment02 { font-size:14px; line-height:1.8em; color:#fff; font-family: 'Noto Sans KR', sans-serif; text-align:center; position:absolute; top:130px; left:0; width:100%; box-sizing:border-box; padding:0 30px; z-index:10; } 
#eo_app .port_list .grid-item .over_box .over_txt { font-size:14px; line-height:1.8em; color:#cdcdcd; font-family: 'Noto Sans KR', sans-serif; position:absolute; top:105px; left:0; width:100%; box-sizing:border-box; padding:0 30px; z-index:10; } 
#eo_app .port_list .grid-item .over_box .over_more { position:absolute; bottom:2%; right:6%; z-index:11; transform: rotate(0deg); transition: all 0.3s; } 
#eo_app .port_list .grid-item .over_box .center_more { position:absolute; top:50%; left:50%; margin:-12px 0 0 -12px; z-index:11; transform: rotate(0deg); transition: all 0.3s; display:none; } 

#eo_app .port_list .grid-item:hover .tit { opacity:0; } 
#eo_app .port_list .grid-item:hover .tit_menu { opacity:0; } 
#eo_app .port_list .grid-item:hover .over_box { opacity:1; } 
#eo_app .port_list .grid-item:hover .over_box .over_more { transform: rotate(180deg); } 
#eo_app .port_list .grid-item:hover .over_box .center_more { transform: rotate(180deg); } 
#eo_app .port_more { margin-top:80px; } 
#eo_app .port_more a { display:block; font-family: 'Noto Sans KR', sans-serif; width:180px; font-size:16px; line-height:16px; padding:17px 0; text-align:center; margin:0 auto; background-color:#d7d7d7; color:#fff; font-weight:bold; border-radius:35px; } 
 
@media (max-width: 1600px) { 
#eo_app .port_list .grid-item { width:48%; } 
 } 

@media (max-width: 1200px) { 
#eo_app .right_content #sub_people .grid-item { width:50%; box-sizing:border-box; } 
 } 
@media (max-width: 992px) { 
#eo_app .port_list .grid-item { width:98%; } 
 } 
@media (max-width: 768px) { 
#eo_app .bg_s_mo { background-color:#77d0c4; position:relative; width:100%; padding:100px 20px 40px; } 
#eo_app .bg_s_mo .sub-left-txt p { margin:0; word-break:keep-all; } 
#eo_app .bg_s_mo .sub-left-txt .sub-top-title { font-size:20px; line-height:20px; color:#fff; font-family: 'Space Mono', monospace; text-decoration:line-through; } 
#eo_app .bg_s_mo .sub-left-txt .sub-title { font-size:32px; line-height:32px; color:#fff; z-index:10; font-family: 'Noto Sans KR', sans-serif; margin-top:10px; font-weight:bold; } 
#eo_app .bg_s_mo .sub-left-txt .sub-title-ment { font-size:20px; line-height:24px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:10px; } 
#eo_app .bg_s_mo .sub-left-txt .sub-txt { font-size:15px; line-height:22px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:40px; background:url("../images/main_txt_line.jpg") 0 4px no-repeat; padding-left:30px; padding-right:0; } 
 
#eo_app .right_content { padding-left:0; } 
#eo_app .right_content #sub_people .grid-item .over { font-size:14px; padding-left:15px; letter-spacing:-0.5px; } 
#eo_app .right_content #sub_people02 .grid-item { width:100%; } 
#eo_app .port_list { margin:0 2%; padding:2% 0; } 
#eo_app .port_list .grid-item { width:48%; } 
#eo_app .port_list .grid-item .over_box { display:none; } 
#eo_app .port_list .grid-item:hover .over_box { opacity:0; display:none; } 
#eo_app .port_list .grid-item:hover .tit { opacity:1; } 
#eo_app .port_list .grid-item:hover .tit_menu { opacity:1; } 
 } 

/* SUB PEOPLE */
#eo_people { position: relative; } 
#eo_people .bg_wrap { padding:0; } 
#eo_people .bg_s { background-color:#f59b71; position:fixed; top:0; right:100%; width:40%; height:100vh; z-index:1; } 
#eo_people .bg_s .sub-left-txt { position:fixed; top:25%; left:0; z-index:10; width:40%; box-sizing:border-box; padding:0 50px; } 
#eo_people .bg_s .sub-left-txt p { margin:0; word-break:keep-all; transition: all 0.3s; } 
#eo_people .bg_s .sub-left-txt .sub-top-title { font-size:1.4vw; line-height:20px; color:#fff; font-family: 'Space Mono', monospace; text-decoration:line-through; opacity:0; } 
#eo_people .bg_s .sub-left-txt .sub-title { font-size:4vw; color:#fff; z-index:10; font-family: 'Roboto', sans-serif; margin-top:-5px; font-weight:900; opacity:0; } 
#eo_people .bg_s .sub-left-txt .sub-title-ment { font-size:2vw; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:-10px; opacity:0; } 
#eo_people .bg_s .sub-left-txt .sub-txt { font-size:17px; line-height:26px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:5vw; background:url("../images/main_txt_line.jpg") 0 4px no-repeat; padding-left:3vw; opacity:0; } 
 
#eo_people .right_content { padding-left:40%; } 
#eo_people .right_content #sub_people .grid-item { width:33.333%; box-sizing:border-box; position:relative; cursor:pointer; } 
#eo_people .right_content #sub_people .grid-item img { width:100%; } 
#eo_people .right_content #sub_people .grid-item .over { position:absolute; left:0; top:0; background:rgba(0,0,0,0.5); width:100%; height:100%; text-align:center; box-sizing:border-box; opacity:0; } 
#eo_people .right_content #sub_people .grid-item .over .over_txt { position:absolute; left:0; bottom:5%; width:100%; padding:0 5%; } 
#eo_people .right_content #sub_people .grid-item .over .over_txt .ment { font-size:14px; text-align:center; line-height:22px; color:#fff; } 
#eo_people .right_content #sub_people .grid-item .over .over_txt h3 { font-size:16px; line-height:20px; padding-top:0; color:#fff; text-align:center; } 
#eo_people .right_content #sub_people .grid-item:hover .over { opacity:1; transition: all 0.3s; } 
 
 #eo_people .right_content #sub_people02 h3 { background-color:#7da683; font-size:20px; line-height:80px; color:#fff; text-align:center; margin:0; font-family: 'Roboto', sans-serif; font-weight:200; letter-spacing:10px } 
 #eo_people .right_content #sub_people02 .grid-item { width:50%; box-sizing:border-box; position:relative; cursor:pointer; } 

@media (max-width: 1200px) { 
#eo_people .right_content #sub_people .grid-item { width:50%; box-sizing:border-box; } 
 } 
@media (max-width: 992px) { 
 
 } 
@media (max-width: 768px) { 
#eo_people .bg_s_mo { background-color:#f59b71; position:relative; width:100%; padding:100px 20px 40px; } 
#eo_people .bg_s_mo .sub-left-txt p { margin:0; word-break:keep-all; } 
#eo_people .bg_s_mo .sub-left-txt .sub-top-title { font-size:20px; line-height:20px; color:#fff; font-family: 'Space Mono', monospace; text-decoration:line-through; } 
#eo_people .bg_s_mo .sub-left-txt .sub-title { font-size:32px; line-height:32px; color:#fff; z-index:10; font-family: 'Noto Sans KR', sans-serif; margin-top:10px; font-weight:bold; } 
#eo_people .bg_s_mo .sub-left-txt .sub-title-ment { font-size:20px; line-height:24px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:10px; } 
#eo_people .bg_s_mo .sub-left-txt .sub-txt { font-size:15px; line-height:22px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:40px; background:url("../images/main_txt_line.jpg") 0 4px no-repeat; padding-left:30px; padding-right:0; } 
 
#eo_people .right_content { padding-left:0; } 
#eo_people .right_content #sub_people .grid-item .over { font-size:14px; padding-left:15px; letter-spacing:-0.5px; } 
#eo_people .right_content #sub_people02 .grid-item { width:100%; } 

 } 
 
/* SUB PARTNER */
#eo_partner { position: relative; } 
#eo_partner .bg_wrap { padding:0; } 
/*#eo_partner .bg_s { background-color:#77d0c4; position:fixed; top:0; right:100%; width:40%; height:100vh; z-index:1; } */
#eo_partner .bg_s .sub-left-txt { position:fixed; top:25%; left:0; z-index:10; width:40%; box-sizing:border-box; padding:0 50px; } 
#eo_partner .bg_s .sub-left-txt p { margin:0; word-break:keep-all; transition: all 0.3s; } 
#eo_partner .bg_s .sub-left-txt .sub-top-title { font-size:1.4vw; line-height:20px; color:#fff; font-family: 'Space Mono', monospace; text-decoration:line-through; opacity:0; } 
#eo_partner .bg_s .sub-left-txt .sub-title { font-size:4vw; color:#fff; z-index:10; font-family: 'Roboto', sans-serif; margin-top:-5px; font-weight:900; opacity:0; } 
#eo_partner .bg_s .sub-left-txt .sub-title-ment { font-size:2vw; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:-10px; opacity:0; } 
#eo_partner .bg_s .sub-left-txt .sub-txt { font-size:17px; line-height:26px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:5vw; background:url("../images/main_txt_line.jpg") 0 4px no-repeat; padding-left:3vw; opacity:0; } 
 
#eo_partner .right_content { padding-left:40%; } 
#eo_partner .right_content #partner01 { padding:130px 50px 80px; } 
#eo_partner .right_content #partner01 h3 { font-size:60px; line-height:70px; color:#525252; font-weight:normal; padding-bottom:50px; background:url("../images/partner_title_line.jpg") center bottom no-repeat; font-family: 'Noto Sans KR', sans-serif; text-align:center; margin-bottom:50px; } 
#eo_partner .right_content #partner01 .grid-item { width:33.333%; } 
#eo_partner .right_content #partner01 .grid-item img { margin:0 auto; } 
 
@media (max-width: 1200px) { 
#eo_partner .right_content #partner01 .grid-item { width:50%; } 
 } 
@media (max-width: 992px) { 
 
 } 
@media (max-width: 768px) { 

#eo_partner .bg_s_mo { background-color:#a6cd1f; position:relative; width:100%; padding:100px 20px 40px; } 
#eo_partner .bg_s_mo .sub-left-txt p { margin:0; word-break:keep-all; } 
#eo_partner .bg_s_mo .sub-left-txt .sub-top-title { font-size:20px; line-height:20px; color:#fff; font-family: 'Space Mono', monospace; text-decoration:line-through; } 
#eo_partner .bg_s_mo .sub-left-txt .sub-title { font-size:32px; line-height:32px; color:#fff; z-index:10; font-family: 'Noto Sans KR', sans-serif; margin-top:10px; font-weight:bold; } 
#eo_partner .bg_s_mo .sub-left-txt .sub-title-ment { font-size:20px; line-height:24px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:10px; } 
#eo_partner .bg_s_mo .sub-left-txt .sub-txt { font-size:15px; line-height:22px; color:#fff; font-family: 'Noto Sans KR', sans-serif; margin-top:40px; background:url("../images/main_txt_line.jpg") 0 4px no-repeat; padding-left:30px; padding-right:0; } 
 
#eo_partner .right_content { padding-left:0; } 
#eo_partner .right_content #partner01 { padding:70px 20px 50px; } 
 } 


/* 공통사항 */
.main-left-txt .main-view a i { font-size:22px; margin-left:10px; vertical-align:-3px; } 
@media (max-width: 768px) { 

 } 



/* 지원사업 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100; 300; 400; 500; 700; 900&display=swap'); 
#event { width:100%; margin-bottom: 270px; } 
#event * { font-family: 'Noto Sans KR', sans-serif !important; margin:0; padding:0; letter-spacing: -.5px; word-break: keep-all; } 
#event select::-ms-expand { display: none; } 

#event .w_1200 { max-width: 1200px; margin:0 auto; width:100%; } 
#event .marking { display: inline-block; font-style: italic; } 
#event .sec1 h2 { padding-top: 70px; line-height:70px; text-align: center; font-size: 32px; font-weight: 300; margin-bottom: 70px; color:#000; } 
#event .sec1 h2 strong { display: block; font-size: 48px; font-weight: 600; /* margin-bottom: 10px; */ } 
#event .sec1 h2 b { display: inline-block; font-size: 52px; font-weight: 600; color:#f26825; } 
#event .sec1 h2 span { display: inline-block; font-size: 52px; font-weight: 400; } 
#event .sec1 h2 em { font-size: 52px; font-weight: 400; } 
#event .sec1 ul { margin:0 auto 38px; display: table; } 
#event .sec1 ul::after { content:''; display: block; visibility: hidden; clear: both; } 
#event .sec1 ul li { float:left; margin-right: 50px; font-size: 18px; padding-left: 10px; position: relative; list-style: none; } 
#event .sec1 ul li:last-of-type { margin-right: 0; } 
#event .sec1 ul li::before { content: ''; display:block; width:4px; height: 4px; border-radius: 50%; position: absolute; left: 0; top: 50%; margin-top: -2px; background-color: #666; } 
#event .sec1 img { display: block; width:100%; } 
#event .sec2 { margin-bottom: 100px; } 
#event .sec2 img { display: block; width: 100%; } 
#event .sec2 p { text-align: center; font-size: 44px; font-weight: 300; margin:80px auto 120px; color:#000; } 
#event .sec2 p b { display: inline-block; font-weight: 600; } 
#event .sec2 p em { font-weight: 600; font-size: 44px; } 
#event .sec3 { padding-bottom: 90px; position: relative; } 
#event .sec3::before { content: ''; display: block; width:100%; height: 1px; background-color: #f4f4f4; position: absolute; left: 0; top: 50%; z-index: -1; } 
#event .sec3 .w_1200::after { content:''; display:block; visibility: hidden; clear: both; } 
#event .sec3 .left { float:left; width:585px; } 
#event .sec3 .left > div .orange { line-height:1; display: block; font-size: 20px; font-weight: 600; color:#f26825; padding:50px 0 25px; } 
#event .sec3 .left > div .blue { line-height:1; display: block; font-size: 20px; font-weight: 600; color:#0072bc; padding:130px 0 25px; } 
#event .sec3 .left > div p { color:#000; font-size: 22px; line-height: 38px; } 
#event .sec3 .left > div p b { display: inline-block; font-weight: 600; } 
#event .sec3 .left > div p span { display: block; font-size: 18px; } 
#event .sec3 .right { float:left; max-width: calc(100% - 588px); margin-top: 55px; width:100%; } 
#event .sec4 { background: url('../img/event4.jpg')no-repeat center; background-size:cover; padding:120px 0 40px; } 
#event .sec4 .quest { color:#fff; font-size: 24px; font-weight: 300; margin-bottom: 20px; text-align: center; } 
#event .sec4 .quest b { display: inline-block; font-weight: 600; } 
#event .sec4 .answer { font-size: 18px; color:#dcdcdc; text-align: center; padding-bottom: 80px; line-height: 38px; } 
#event .sec4 .answer b { display:inline-block; font-size: 22px; color:#f26825; font-weight: 600; } 
#event .sec4 .answer span { display: inline; background-color: #000; padding: 0 3px; } 
#event .sec5 { padding-top: 115px; /* padding-bottom: 55px; */ } 
#event .sec5 .title { text-align: center; font-size: 34px; color:#000; margin-bottom: 40px; } 
#event .sec5 .title span { display: block; font-size: 24px; color:#7c7c7c; line-height: 40px; } 
#event .sec5 .title b { display:block; font-size: 48px; font-weight: 600; color:#000; } 
#event .sec5 ul::after { content:''; display:block; visibility: hidden; clear: both; } 
#event .sec5 .tabList { max-width: 1060px; display: table; margin:0 auto 40px; width: 100%; border-radius: 50px; padding:5px; border:1px solid #b8c4cb; } 
#event .sec5 .tabList:after { display:block; content:''; clear:both; visibility: hidden; } 
#event .sec5 .tabList li { list-style: none; float: left; width:16.666%; border-radius: 50px; } 
#event .sec5 .tabList li.on { background: #000; } 
#event .sec5 .tabList li a { display: block; text-align: center; font-size: 15px; font-weight: 600; color:#b8c4cb; line-height: 40px; } 
#event .sec5 .tabList li.on a { color:#fff; } 
#event .sec5 .tabGroup { position: relative; height: 790px; } 
#event .sec5 .tabGroup li { list-style: none; position:absolute; width: 100%; height: 730px; display: none; } 
#event .sec5 .tabGroup li:first-child { display: block; } 
#event .sec5 .tabGroup li::after { display:block; content:''; clear:both; visibility: hidden; } 
#event .sec5 .tab-cont > img { float:left; width:370px; margin-left: -20px; } 
#event .sec5 .tab-cont .info { float:left; width:calc(100% - 370px); padding:100px 0 0 10px; } 
#event .sec5 .tab-cont .info span { display: block; font-weight: 700; font-size: 16px; color:#0072bc; margin-bottom:; line-height: 1; } 
#event .sec5 .tab-cont .info b { font-size: 30px; color:#000; font-weight: 600; margin:15px 0 25px; display:block; line-height: 1; } 
#event .sec5 .tab-cont .info p { font-size: 20px; color:#000; margin-bottom: 150px; } 
#event .sec5 .tab-cont .info img { display: block; width:100%; max-width: 812px; margin-top: 20px; } 
#event .sec6 { position: relative; padding:55px 0 270px; overflow: hidden; } 
#event .sec6::before { content: ''; display: block; width:calc(50% + 400px); height: calc(100% - 55px); background:#007ebc; position:absolute; left:0; bottom:
0; z-index: -1; } 
#event .sec6::after { content: ''; display: block; width:436px; height: 189px; background: url('../img/sec6_bg.png')no-repeat center; background-size:contain; position:absolute; left:calc(50% + 400px); top:87px; } 
#event .sec6 .w_1200::after { content:''; display:block; visibility: hidden; clear: both; } 
#event .sec6 .left { float:left; width:715px; position: relative; } 
#event .sec6 .left::before { content: ''; display: block; width:200px; height: 227px; background: url('../img/left_before.png')no-repeat right top; background-size:contain; position:absolute; left:-190px; top:-45px; } 
#event .sec6 .left strong { display: block; font-size: 34px; font-weight: 600; color:#fff; margin-bottom:15px; line-height: 1; padding-top: 100px; } 
#event .sec6 .left p { font-size: 22px; color:#bed5e4; margin-bottom: 60px; } 
#event .sec6 .left ul li { list-style: none; padding-left: 12px; position: relative; font-size: 20px; line-height: 34px; margin-bottom: 36px; color:#fff; } 
#event .sec6 .left ul li::before { content:''; display:block; width:4px; height: 4px; background-color: #36e38b; position: absolute; left: 0; top: 15px; border-radius: 50%; } 
#event .sec6 .left ul li:last-of-type { margin-bottom: 0; } 
#event .sec6 .left ul li span { display: inline-block; font-size: 22px; color:#73fbc0; } 
#event .sec6 .right { background-color: #2e2e2e; padding:80px 0 205px 70px; position: absolute; width:calc(50% + 115px); left:calc(50% + 115px); bottom:0; } 
#event .sec6 .right::before { content: ''; display: block; width:340px; height: 310px; background: url('../img/right_before.png')no-repeat left top; position:absolute; left:175px; bottom:-165px; } 
#event .sec6 .right strong { display: block; font-size: 24px; font-weight: 600; color:#fff; margin-bottom: 45px; line-height: 1; } 
#event .sec6 .right p { color:#fff; line-height: 32px; font-size: 18px; } 
#event .sec6 .right p span { font-size: 20px; display:block; color:#fb9e7d; } 
#event .sec7 { min-height: 270px; padding:30px 0; background-color: #f6f7f9; position: fixed; left: 0; width: 100%; bottom: 0; } 
#event .sec7 .w_1200::after { content:''; display: block; visibility: hidden; clear: both; } 
#event .sec7 span { display: block; font-size: 18px; font-weight: 600; color:#000; line-height: 1; margin-bottom: 15px; } 
#event .sec7 p { color:#000; font-size:22px; margin-bottom: 40px; line-height: 1; } 
#event .sec7 p b { display: inline-block; font-weight: 600; } 
#event .sec7 .select { float:left; width:calc(25% - 8px); margin-right:8px; } 
#event .sec7 .select select { outline:none; line-height: 100px; height: 100px; border:0; width:100%; color:#f26825; font-size: 20px; -webkit-appearance: none; -moz-appearance: none; appearance: none; background:#fff url('../img/picker.png')no-repeat right 30px center; background-size:11px; text-align-last: center; text-align: center; -ms-text-align-last: center; -moz-text-align-last: center; padding:0 30px; } 
#event .sec7 .input { float:left; width:50%; overflow: hidden; margin-right: 8px; } 
#event .sec7 .input > div { float:left; width:calc(50% - 4px); margin-right:8px; margin-bottom: 8px; } 
#event .sec7 .input > div p { float: left; width: 40%; text-align: center; font-size: 16px; line-height: 45px; margin-bottom: 0; } 
#event .sec7 .input input { float: left; width: 60%; outline:none; background-color: #fff; line-height: 46px; font-size: 16px; text-align: center; border:0; color:#000; height: 45px; } 
#event .sec7 .input input::placeholder { color:#b2b2b2; } 
#event .sec7 .input > div:nth-of-type(2n) { margin-right:0; } 
#event .sec7 .input > div:nth-of-type(3),
#event .sec7 .input > div:nth-of-type(4) { margin-bottom: 0; } 
#event .sec7 button { float:left; width:calc(25% - 8px); text-align: center; border:0; background-color: #fa551c; color:#fff; box-shadow: 1px 4px 6px 0px rgba(0, 0, 0, 0.26); height: 100px; } 
#event .sec7 button span { display: block; font-size:24px; font-weight: 500; margin-bottom: 0; color:#fff; } 
#event .sec7 button b { display: block; font-size: 16px; margin-top: 5px; font-weight: 600; } 
#event .sec7_mo { display: none; } 


@media (max-width: 1024px) { 
 #event { margin-bottom: 0; } 
 #event .w_1200 { padding:0 15px; } 

 #event .sec1 h2 { padding-top: 25px; line-height:30px; font-size: 13px; margin-bottom: 30px; } 
 #event .sec1 h2 strong { font-size: 19px; line-height: 1; margin-bottom: 5px; } 
 #event .sec1 h2 b { font-size: 22px; } 
 #event .sec1 h2 span { font-size: 22px; } 
 #event .sec1 h2 em { font-size: 22px; } 

 #event .sec1 ul { margin:0 auto 15px; text-align: center; } 
 #event .sec1 ul li { float:none; display: inline-block; margin-right: 25px; font-size: 12px; padding-left: 5px; margin-bottom: 10px; } 
 #event .sec1 ul li:nth-of-type(3) { margin-right: 0; } 
 #event .sec1 ul li::before { width:2px; height: 2px; } 
 
 #event .sec2 { margin-bottom: 0; } 
 #event .sec2 p { font-size: 17px; margin:40px auto 35px; } 
 #event .sec2 p em { font-size: 17px; } 

 #event .sec3 { padding: 50px 0; background: url('../img/event3_mo.png')no-repeat right 15px bottom 50px; background-size:45%; } 
 #event .sec3::before { top: 53%; } 
 #event .sec3 .w_1200::after { content:''; display:block; visibility: hidden; clear: both; } 
 #event .sec3 .left { float:none; width:100%; } 
 #event .sec3 .left > div .orange { font-size: 13px; padding:0 0 10px; } 
 #event .sec3 .left > div .blue { font-size: 13px; padding:90px 0 10px; } 
 #event .sec3 .left > div p { font-size: 14px; line-height: 22px; } 
 #event .sec3 .left > div p span { font-size: 12px; } 
 #event .sec3 .right { display:none; } 


 #event .sec4 { padding:35px 0 5px; } 
 #event .sec4 .quest { font-size: 14px; margin-bottom: 15px; } 
 #event .sec4 .answer { font-size: 12px; padding-bottom: 30px; line-height: 23px; } 
 #event .sec4 .answer br { display: none; } 
 #event .sec4 .answer b { display:inline-block; font-size: 12px; } 

 #event .sec5 { padding-top: 35px; } 
 #event .sec5 .title { font-size: 15px; margin-bottom: 30px; } 
 #event .sec5 .title span { font-size: 13px; line-height: 20px; } 
 #event .sec5 .title b { font-size: 17px; } 
 #event .sec5 .tabList { margin:0 auto 15px; border-radius: 10px; padding:2px; } 
 #event .sec5 .tabList li { width:33.333%; border-radius: 50px; } 
 #event .sec5 .tabList li a { font-size: 10px; line-height: 20px; } 
 #event .sec5 .tabGroup { height: 340px; } 
 #event .sec5 .tabGroup li { height: 340px; } 
 #event .sec5 .tab-cont > img { width:28%; margin-left: 0; } 
 #event .sec5 .tab-cont .info { width:72%; padding:45px 0 0 0; } 
 #event .sec5 .tab-cont .info span { font-size: 10px; } 
 #event .sec5 .tab-cont .info b { font-size: 14px; margin:5px 0 10px; } 
 #event .sec5 .tab-cont .info p { font-size: 12px; color:#000; margin-bottom: 45px; } 
 #event .sec5 .tab-cont .info img { margin-top:10px; } 

 #event .sec6 { position: relative; padding:25px 0 0; overflow: hidden; margin-bottom: 0; } 
 #event .sec6::before, 
 #event .sec6::after { display:none; } 
 #event .sec6 .w_1200 { padding:0; } 
 #event .sec6 .left { float:none; width:100%; background-color: #0072bc; padding:0 15px 30px; } 
 #event .sec6 .left::before { width:70px; height: 90px; left:unset; right:15px; top:-25px; } 
 #event .sec6 .left strong { font-size: 16px; margin-bottom:10px; padding-top: 30px; } 
 #event .sec6 .left p { font-size: 12px; margin-bottom: 30px; } 
 #event .sec6 .left ul li { padding-left: 6px; font-size: 12px; line-height: 17px; margin-bottom: 25px; } 
 #event .sec6 .left ul li::before { width:2px; height: 2px; top:8px; } 
 #event .sec6 .left ul li span { font-size: 12px; } 
 #event .sec6 .right { padding:30px 15px 80px; position: relative; left: 0; width:100%; } 
 #event .sec6 .right::before { width:50%; height: 170px; left:unset; right:15px; bottom:-90px; background: url('../img/right_before.png')no-repeat right top; background-size: contain; } 
 #event .sec6 .right strong { font-size: 16px; margin-bottom: 20px; } 
 #event .sec6 .right p { line-height: 21px; font-size: 12px; } 
 #event .sec6 .right p span { font-size: 12px; } 
 #event .sec6 .right p br { display:none; } 

 #event .sec7 { min-height: 0; padding:20px 0 90px; position: relative; } 
 #event .sec7 span { font-size: 12px; margin-bottom: 10px; } 
 #event .sec7 p { font-size:13px; margin-bottom: 0; } 
 #event .sec7 p b { display: block; line-height: 18px; } 

 #event .sec7 .select,
 #event .sec7 .input,
 #event .sec7 button { display: none; } 

 #event .sec7_mo { display: block; } 

 #event .sec7_mo #open { width: 100%; border: 0; position: fixed; bottom: 0; left: 0; padding: 10px 15px 20px; background: #f6f7f9; } 
 #event .sec7_mo #open img { display:block; width:11px; margin:0 auto 5px; } 
 #event .sec7_mo #open span { display:block; background-color: #f26825; text-align:center; font-size: 13px; font-weight: 500; color:#fff; line-height: 40px; height: 40px; box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.26); } 
 #event .sec7_mo #inquiry { width: 100%; bottom: -100%; left: 0; position: fixed; z-index: 5; } 
 #event .sec7_mo #inquiry { padding:15px 15px 20px; background-color: #f6f7f9; } 
 #event .sec7_mo #inquiry .popclose { position:absolute; right: 15px; top: 15px; } 
 #event .sec7_mo #inquiry .popclose img { display: block; width:11px; } 
 #event .sec7_mo #inquiry span { display: block; font-size: 12px; margin-bottom: 10px; color:#000; font-weight: 600; } 
 #event .sec7_mo #inquiry p { font-size:13px; margin-bottom: 20px; color:#000; line-height: 1; } 
 #event .sec7_mo #inquiry p b { display: block; line-height: 18px; } 
#event .sec7_mo #inquiry .wrap_box { margin-bottom:7px; } 
 #event .sec7_mo #inquiry .wrap_box::after { content: ''; display: block; visibility: hidden; clear: both; } 
 #event .sec7_mo #inquiry .wrap_box p { float: left; width: 30%; line-height: 40px; margin-bottom: 0; text-align: right; padding-right: 10px; } 
 #event .sec7_mo #inquiry select { float: left; width: 70%; outline:none; line-height: 40px; height: 40px; border:0; text-align: center; color:#f26825; font-size: 12px; -webkit-appearance: none; -moz-appearance: none; appearance: none; background:#fff url('../img/picker.png')no-repeat right 15px center; background-size:11px; padding:0 15px; } 
 #event .sec7_mo #inquiry input { float: left; width: 70%; height: 40px; outline:none; background-color: #fff; line-height: 40px; font-size: 12px; text-align: center; border:0; color:#000; } 
 #event .sec7_mo #inquiry input::placeholder { color:#b2b2b2; } 
 #event .sec7_mo #inquiry button { background-color: #f26825; text-align:center; font-size: 13px; font-weight: 500; color:#fff; line-height: 40px; height: 40px; box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.26); width:100%; border:0; margin-top: 20px; } 
 } 

@media (max-width: 768px) { 
 #event .sec5 .tabGroup,
 #event .sec5 .tabGroup li { height: 300px; } 
 #event .sec5 .tab-cont > img { position:absolute; left:0; top: 0; } 
 #event .sec5 .tab-cont .info { width:100%; float:none; } 
 #event .sec5 .tab-cont .info p { margin-bottom: 0; } 
 #event .sec5 .tab-cont .info p br { display:none; } 
 #event .sec5 .tab-cont .info p:first-of-type,
 #event .sec5 .tab-cont .info b:first-of-type,
 #event .sec5 .tab-cont .info span:first-of-type { padding-left: 28%; } 
 #event .sec5 .tab-cont .info span:last-of-type { padding-top: 20%; } 
 } 


.send_after_view_bg { background:rgba(0,0,0,0.5); position:fixed; top:0; left:0; width:100%; height:100vh; z-index:99999; display:none; cursor:pointer; } 
.send_after_box { 
position:relative; 
width: 100%; 
height: 100%; 
 } 

.send_after_msg_box { 
position: absolute; 
top: 50%; 
left: 50%; 
transform: translate(-50%, -50%); 
width: 100px; 
height: 100px; 
 } 
.loading-folding-cube { 
 margin: 20px auto; 
 width: 40px; 
 height: 40px; 
 position: relative; 
 -webkit-transform: rotateZ(45deg); 
 transform: rotateZ(45deg); 
 } 

.loading-folding-cube .loading-cube { 
 float: left; 
 width: 50%; 
 height: 50%; 
 position: relative; 
 -webkit-transform: scale(1.1); 
 -ms-transform: scale(1.1); 
 transform: scale(1.1); 
 } 
.loading-folding-cube .loading-cube:before { 
 content: ''; 
 position: absolute; 
 top: 0; 
 left: 0; 
 width: 100%; 
 height: 100%; 
 background-color: #777; 
 -webkit-animation: loading-foldCubeAngle 2.4s infinite linear both; 
 animation: loading-foldCubeAngle 2.4s infinite linear both; 
 -webkit-transform-origin: 100% 100%; 
 -ms-transform-origin: 100% 100%; 
 transform-origin: 100% 100%; 
 } 
.loading-folding-cube .loading-cube2 { 
 -webkit-transform: scale(1.1) rotateZ(90deg); 
 transform: scale(1.1) rotateZ(90deg); 
 } 
.loading-folding-cube .loading-cube3 { 
 -webkit-transform: scale(1.1) rotateZ(180deg); 
 transform: scale(1.1) rotateZ(180deg); 
 } 
.loading-folding-cube .loading-cube4 { 
 -webkit-transform: scale(1.1) rotateZ(270deg); 
 transform: scale(1.1) rotateZ(270deg); 
 } 
.loading-folding-cube .loading-cube2:before { 
 -webkit-animation-delay: 0.3s; 
 animation-delay: 0.3s; 
 } 
.loading-folding-cube .loading-cube3:before { 
 -webkit-animation-delay: 0.6s; 
 animation-delay: 0.6s; 
 } 
.loading-folding-cube .loading-cube4:before { 
 -webkit-animation-delay: 0.9s; 
 animation-delay: 0.9s; 
 } 
@-webkit-keyframes loading-foldCubeAngle { 
 0%, 10% { 
 -webkit-transform: perspective(140px) rotateX(-180deg); 
 transform: perspective(140px) rotateX(-180deg); 
 opacity: 0; 
 } 25%, 75% { 
 -webkit-transform: perspective(140px) rotateX(0deg); 
 transform: perspective(140px) rotateX(0deg); 
 opacity: 1; 
 } 90%, 100% { 
 -webkit-transform: perspective(140px) rotateY(180deg); 
 transform: perspective(140px) rotateY(180deg); 
 opacity: 0; 
 } 
 } 

@keyframes loading-foldCubeAngle { 
 0%, 10% { 
 -webkit-transform: perspective(140px) rotateX(-180deg); 
 transform: perspective(140px) rotateX(-180deg); 
 opacity: 0; 
 } 25%, 75% { 
 -webkit-transform: perspective(140px) rotateX(0deg); 
 transform: perspective(140px) rotateX(0deg); 
 opacity: 1; 
 } 90%, 100% { 
 -webkit-transform: perspective(140px) rotateY(180deg); 
 transform: perspective(140px) rotateY(180deg); 
 opacity: 0; 
 } 
 } 




.main-left-txt.d-flex { display: flex; flex-direction: column; min-height: calc(100vh - 20%); top: 20% !important; padding-bottom: 50px !important; } 

.subPop { margin-top: auto; max-width: calc(100% - 160px); margin-top: auto !important; } 
.subPop img { display: block; width:100%;; } 
#popup_layer1 { position:fixed; right:185px; top:120px; max-width:630px; z-index: 30; box-shadow: 0px 4px 40px rgba(0, 0, 0, 0.25); border-radius: 16px; border:1px solid rgba(255, 255, 255, 0.70); overflow:hidden; } 
#popup_layer1 img { display: block; width: 100%; } 
#popup_layer1 .popWrap { position: relative; } 
#popup_layer1 .close_x { position: absolute; width:32px; height:32px; right: 12px; top: 12px; cursor: pointer; } 

#popup_layer2 { position:fixed; right:50%; left: 50%; margin-left: -210px; top:120px; max-width:420px; width: 100%; z-index: 30; box-shadow: 0px 4px 40px rgba(0, 0, 0, 0.25); border-radius: 16px; border:1px solid rgba(255, 255, 255, 0.70); overflow:hidden; } 
#popup_layer2 img { display: block; width: 100%; } 
#popup_layer2 .popWrap { position: relative; } 
#popup_layer2 .close_x { position: absolute; width:32px; height:32px; right: 12px; top: 12px; cursor: pointer; } 



@media (max-width: 1050px) { 
 #popup_layer1 { right:5%; left:5%; width:90%; top:100px; } 

 #popup_layer2 { right:5%; left:5%; width:90%; top:100px; margin: auto; } 
 } 

@media (max-width: 1200px) { 
 .subPop { margin-left: 0 !important; } 
 } 

@media (max-width: 1024px) { 
 .subPop { max-width: 100%; } 
 } 

@media (max-width: 767px) { 
 .subPop { display: none; } 
 .main-left-txt.d-flex { min-height: unset; top: 50% !important; transform: translateY(-50%); padding-bottom: 0 !important; } 
 } 





/**************** MARKETING 260402 *****************/
#marketing { padding-top: 110px; } 
#marketing * { font-family: "Pretendard"; } 
#marketing *::before, #marketing *::after { display: none; } 
#marketing .container { width: 100%; max-width: 1340px; padding-left: 20px; padding-right: 20px; margin: 0 auto; } 


#marketing .sec1 { background: linear-gradient(0deg, #FFF 0%, #FFF 100%), #F7F8F9; } 
#marketing .sec1 .container { position: relative; height: 700px; padding-top: 152px; } 
#marketing .sec1 .left { position: relative; z-index: 1; } 
#marketing .sec1 .txt1 { color: #213A37; font-size: 60px; font-weight: 700; line-height: 80px; margin-bottom: 24px; } 
#marketing .sec1 .txt1 span { color: #298C7E; } 
#marketing .sec1 .txt2 { color: #444; font-size: 18px; line-height: 26px; margin-bottom: 68px; } 
#marketing .sec1 .btns { position: relative; z-index: 1; display: flex; gap: 12px; } 
#marketing .sec1 .btn1 { border: 0; display: flex; padding: 15px 25px; justify-content: center; align-items: center; gap: 8px; border-radius: 4px; background: #3C4856; color: #fff; font-size: 15px; font-weight: 700; line-height: 22px; } 
#marketing .sec1 .btn2 { border: 0; display: flex; padding: 15px 25px; justify-content: center; align-items: center; gap: 8px; border-radius: 4px; background: #fff; border: 1px solid #E0E0E0; color: #444; font-size: 15px; font-weight: 700; line-height: 22px; } 
#marketing .sec1 .right { width: 100%; max-width: 848px; position: absolute; right: 20px; bottom: -25px; } 

#marketing .sec2 { padding: 120px 0; background: url('../img/marketing/background-attachment_ scroll.jpg')no-repeat center; background-size: cover; background-attachment: fixed; } 
#marketing .sec2 .txt1 { color: #fff; font-size: 40px; font-weight: 700; line-height: 40px; margin-bottom: 16px; } 
#marketing .sec2 .txt2 { color: #E0E0E0; font-size: 18px; line-height: 26px; margin-bottom: 60px; } 
#marketing .sec2 .bottom { display: flex; gap: 8px; } 
#marketing .sec2 .box { width: 100%; display: flex; padding: 24px 26px; flex-direction: column; align-items: flex-start; gap: 24px; border-radius: 4px; background: #FFF; } 
#marketing .sec2 .txt3 { color: #298C7E; font-size: 18px; font-weight: 700; line-height: 26px; display: flex; width: 28px; height: 28px; flex-direction: column; justify-content: center; align-items: center; border-radius: 4px; background: #D5F0EC; } 
#marketing .sec2 .txt4 { color: #000; font-size: 20px; font-weight: 500; line-height: 28px; margin-bottom: 6px; } 
#marketing .sec2 .txt5 { color: #666; font-size: 16px; line-height: 24px; } 

#marketing .sec3 { background: #393939; padding: 180px 0 240px; } 
#marketing .sec3 .txt1 { color: #fff; text-align: center; font-size: 52px; font-weight: 700; line-height: 60px; margin-bottom: 140px; } 
#marketing .sec3 .txt1 span { color: var(--Colors-Grey-Color-Light-Base10, #77D0C4); } 
#marketing .sec3 .list { display: flex; flex-direction: column; gap: 240px; } 
#marketing .sec3 .col { display: flex; align-items: flex-start; gap: 60px; } 
#marketing .sec3 .col:nth-of-type(2n) { flex-direction: row-reverse; } 
#marketing .sec3 .img { width: 100%; max-width: 520px; height: 320px; border-radius: 8px; overflow: hidden; } 
#marketing .sec3 .img img { transition: 2s ease-in-out; width: 100%; } 
#marketing .sec3 .col:hover img { transform: scale(1.15); } 
#marketing .sec3 .cont { width: 100%; max-width: 720px; } 
#marketing .sec3 .txt2 { display: flex; align-items: flex-end; gap: 16px; color: #fff; font-size: 40px; font-weight: 700; line-height: 40px; margin-bottom: 20px; white-space: nowrap; } 
#marketing .sec3 .txt2 span { color: #77D0C4; font-size: 28px; font-weight: 400; line-height: 34px; } 
#marketing .sec3 .txt3 { color: #C4C4C4; font-size: 18px; line-height: 26px; margin-bottom: 48px; } 
#marketing .sec3 .bottom { display: inline-grid; gap: 12px; align-self: stretch; grid-template-rows: repeat(2,fit-content(100%)); grid-template-columns: repeat(3,minmax(0,1fr)); width:100%; } 
#marketing .sec3 .box { border-radius: 4px; background: #2D2D2D; display: flex; padding: 20px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 10px; justify-self: stretch; } 
#marketing .sec3 .txt4 { color: #C4C4C4; font-size: 18px; font-weight: 500; line-height: 26px; } 
#marketing .sec3 .txt5 { color: #666; font-size: 14px; line-height: 20px; } 

#marketing .sec4 { padding: 120px 0 136px; background:#393939 url('../img/marketing/sec4.png')no-repeat center; background-size: cover; } 
#marketing .sec4 .txt1 { color: #fff; text-align: center; font-size: 52px; font-weight: 700; line-height: 60px; margin-bottom: 76px; } 
#marketing .sec4 .txt1 span { color: #77D0C4; } 
#marketing .sec4 .list { display: flex; align-items: center; gap: 24px; width: 100%; max-width: 800px; justify-content: center; margin: 0 auto; } 
#marketing .sec4 .box { width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; } 
#marketing .sec4 .txt2 { color: #E0E0E0; font-size: 18px; font-weight: 500; line-height: 26px; display: flex; height: 64px; padding: 0 20px; flex-direction: column; justify-content: center; align-items: center; gap: 10px; align-self: stretch; border-radius: 4px; background: #666; } 
#marketing .sec4 .txt3 { display: flex; padding: 28px 20px; flex-direction: column; justify-content: center; align-items: center; gap: 16px; align-self: stretch; border-radius: 4px; background: #2D2D2D; } 
#marketing .sec4 .txt3 span { display: flex; align-items: center; gap: 10px; color: #C4C4C4; font-size: 16px; line-height: 24px; } 
#marketing .sec4 .txt4 { display: flex; height: 64px; padding: 0 20px; justify-content: center; align-items: center; gap: 10px; align-self: stretch; border-radius: 4px; border: 2px solid #FFF; background: #F4F4F4; color: #0069B4; font-size: 18px; font-weight: 500; line-height: 26px; } 
#marketing .sec4 .txt5 { display: flex; padding: 28px 20px; flex-direction: column; justify-content: center; align-items: center; gap: 16px; align-self: stretch; border-radius: 4px; background: #2D2D2D; } 
#marketing .sec4 .txt5 span { display: flex; align-items: center; gap: 10px; color: #F4F4F4; font-size: 16px; font-weight: 500; line-height: 24px; } 

#marketing .sec5 { background:#393939; padding: 234px 0 130px; text-align: center; } 
#marketing .sec5 .txt1 { color: #fff; font-size: 52px; font-weight: 700; line-height: 60px; margin-bottom: 28px; } 
#marketing .sec5 .txt1 span { color: #77D0C4; } 
#marketing .sec5 .txt2 { color: #A4A4A4; font-size: 28px; line-height: 34px; margin-bottom: 68px; } 
#marketing .sec5 .txt2 span { color: #fff; } 
#marketing .sec5 .list { display: inline-flex; align-items: center; justify-content: center; gap: 20px; position: relative; } 
#marketing .sec5 .list::before { content: ''; display: block; height: 1px; width: 100%; background-color: #666; position: absolute; left: 0; top: 50%; z-index: 0; } 
#marketing .sec5 .col { position: relative; z-index: 1; display: flex; width: 240px; height: 240px; padding: 0 40px 8px 40px; flex-direction: column; justify-content: center; align-items: center; gap: 16px; aspect-ratio: 1/1; border-radius: 300px; border: 1px solid #666; background: #393939; } 
#marketing .sec5 .txt3 { color: #F4F4F4; font-size: 20px; font-weight: 500; line-height: 28px; margin-bottom: 4px; } 
#marketing .sec5 .txt4 { color: #A4A4A4; font-size: 15px; line-height: 22px; } 

#marketing .sec6 { background: #393939; padding: 130px 0 140px; } 
#marketing .sec6 .container { position: relative; display: flex; height: 553px; padding: 0 120px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 68px; overflow: hidden; border-radius: 4px; } 
#marketing .sec6 .txt1 { position: relative; color: #fff; font-size: 52px; font-weight: 700; line-height: 60px; margin-bottom: 28px; z-index: 1; } 
#marketing .sec6 .txt1 span { color: var(--Colors-Brand-Color-Light-Primary, #77D0C4); font-size: 52px; font-weight: 700; line-height: 60px; } 
#marketing .sec6 .txt2 { position: relative; color: var(--Colors-Grey-Color-Light-Base6, #B2B2B2); font-size: 18px; line-height: 26px; z-index: 1; } 
#marketing .sec6 .btns { position: relative; z-index: 1; display: flex; gap: 12px; } 
#marketing .sec6 .btn1 { border: 0; display: flex; padding: 15px 25px; justify-content: center; align-items: center; gap: 8px; border-radius: 4px; background: #3C4856; color: #fff; font-size: 15px; font-weight: 700; line-height: 22px; } 
#marketing .sec6 .btn2 { border: 0; display: flex; padding: 15px 25px; justify-content: center; align-items: center; gap: 8px; border-radius: 4px; background: #fff; border: 1px solid #E0E0E0; color: #444; font-size: 15px; font-weight: 700; line-height: 22px; } 
#marketing .sec6 .img { position: absolute; transition: 2s ease-in-out; width: 100%; top: 0; left: 0; height: 100%; object-fit: cover; } 
#marketing .sec6:hover .img { transform: scale(1.15); } 


 


 @media (max-width: 1340px) { 

#marketing .sec1 .container { padding-top: 120px; } 


 
 #marketing .sec3 .list { gap:160px; } 

 #marketing .sec5 .hidden { display: block !important; min-width:100%; } 
 #marketing .sec5 .list { flex-wrap: wrap; } 
 #marketing .sec5 .list .hidden { display: block !important; min-width:100%; } 
 #marketing .sec5 .list::before { top:120px; width:calc(240px * 3); left:50%; transform:translateX(-50%) } 
 #marketing .sec5 .list::after { content:''; display:block; height:1px; background:#666; position:absolute; bottom:120px; width:calc(240px * 2); left:50%; transform:translateX(-50%) } 


 #marketing .sec3 .img { height:auto; } 
 #marketing .sec3 .cont { max-width:600px; } 
 #marketing .sec3 .txt2 { flex-direction:column; align-items:flex-start; } 
 #marketing .sec3 .bottom { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; } 
 } 

 @media (max-width: 1200px) { 
 #marketing .sec1 .right { max-width:700px; bottom:-21px; } 
 #marketing .sec3 { padding:120px 0 160px; } 
 #marketing .sec3 .txt1 { margin-bottom: 60px; } 
 #marketing .sec3 .list { gap:120px; } 
 #marketing .sec3 .col { gap:40px; } 
 } 
 @media (max-width: 1024px) { 
 #marketing .sec1 .txt1, #marketing .sec3 .txt1, #marketing .sec4 .txt1, #marketing .sec5 .txt1, #marketing .sec6 .txt1 { font-size: 42px; line-height: 50px; } 
 #marketing .sec1 .container { height:640px; padding-top: 70px; } 
 #marketing .sec1 .right { max-width:600px; bottom:-18px; } 
 #marketing .sec2 .bottom { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); } 
 #marketing .sec3 { padding:100px 0; } 
 #marketing .sec3 .list { gap:80px; } 
 #marketing .sec3 .txt2 { gap: 12px; font-size: 32px; line-height: 40px; } 
 #marketing .sec3 .txt2 span { font-size: 18px; line-height: 26px; } 
 #marketing .sec3 .txt3 { font-size: 16px; line-height: 24px; } 
 #marketing .sec4 { padding: 100px 0; } 
 #marketing .sec5 { padding:100px 0 0; } 
 #marketing .sec5 .list::before { top:105px; width:calc(220px * 3); } 
 #marketing .sec5 .list::after { bottom:105px; width:calc(220px * 2); } 
 #marketing .sec5 .col { width: 220px; height: 220px; } 
 #marketing .sec5 .col img { max-width:48px; } 
 #marketing .sec6 { padding-bottom: 0; } 
 } 

 @media (max-width: 768px) { 
 #marketing { padding-top: 100px; } 
 #marketing .sec1 .txt1,
 #marketing .sec3 .txt1,
 #marketing .sec4 .txt1,
 #marketing .sec5 .txt1,
 #marketing .sec6 .txt1,
 #marketing .sec6 .txt1 span { font-size: 32px; line-height: 36px; } 
 #marketing .sec1 .txt2,
 #marketing .sec2 .txt2,
 #marketing .sec3 .txt3,
 #marketing .sec6 .txt2 { font-size: 14px; line-height: 20px; } 
 #marketing .sec1 .btn1,
 #marketing .sec1 .btn2,
 #marketing .sec6 .btn1,
 #marketing .sec6 .btn2 { padding: 12px 20px; font-size: 14px; line-height: 20px; } 
 #marketing .sec1 .container { height: auto; padding: 60px 0 40px; display: flex; flex-direction: column; gap: 20px; } 
 #marketing .sec1 .left { padding: 0 20px; } 
 #marketing .sec1 .txt2 { margin-bottom:20px; } 
 #marketing .sec1 .right { display: none; } 
 #marketing .sec1 .hidden { display: block !important; position: relative; } 
 #marketing .sec1 .hidden::before { content:''; display:block; width: 190px; height: 150px; background: url('../img/marketing/before.png')no-repeat top right; background-size: contain; position: absolute; top: -120px; right: 0; } 
 #marketing .sec1 .hidden img { width:100%; position: relative; z-index: 1; } 
 #marketing .sec2 { padding:40px 0; } 
 #marketing .sec2 .txt1 { font-size: 28px; line-height: 36px; } 
 #marketing .sec2 .txt2 { margin-bottom:20px; } 
 #marketing .sec2 .bottom { display:flex; flex-direction:column; } 
 #marketing .sec2 .box { padding:18px 24px; position:relative; } 
 #marketing .sec2 .box .txt3 { position:absolute; right:12px; top:12px; width:24px; height:24px; font-size: 15px; } 
 #marketing .sec2 .box .txt4 { font-size: 16px; line-height: 24px; } 
 #marketing .sec2 .box .txt5 { font-size: 13px; line-height: 18px; } 
 #marketing .sec3 { padding: 60px 0 40px; } 
 #marketing .sec3 .col { flex-direction:column !important; } 
 #marketing .sec3 .img { max-width:unset; } 
 #marketing .sec3 .cont { max-width:unset; } 
 #marketing .sec3 .img { max-height: 240px; } 
 #marketing .sec3 .txt1 { margin-bottom:40px; } 
 #marketing .sec3 .list { gap:60px; } 
 #marketing .sec3 .txt2 { gap:4px; font-size: 28px; line-height: 36px; margin-bottom:12px; white-space: unset; } 
 #marketing .sec3 .txt2 span { font-size:15px; line-height: 22px; } 
 #marketing .sec3 .txt3 { margin-bottom:40px; } 
 #marketing .sec3 .box { gap:8px; } 
 #marketing .sec3 .txt4 { font-size: 15px; line-height: 22px; } 
 #marketing .sec3 .txt5 { font-size: 13px; line-height: 18px; } 
 #marketing .sec4 { padding: 40px 0; } 
 #marketing .sec4 .txt1 { margin-bottom:40px; } 
 #marketing .sec4 .list { flex-direction:column; } 
 #marketing .sec4 .txt2,#marketing .sec4 .txt4 { font-size: 15px; height:48px; } 
 #marketing .sec4 .txt3, #marketing .sec4 .txt5 { font-size:14px; padding:20px; } 
 #marketing .sec4 .txt4 img { max-width:92px; } 
 #marketing .sec5 { padding: 40px 0 80px; } 
 #marketing .sec5 .txt1 { margin-bottom:20px; } 
 #marketing .sec5 .txt2 { font-size:16px; line-height:24px; margin-bottom:40px; } 
 #marketing .sec5 .list { flex-direction:column; gap:12px; width: 100%; } 
 #marketing .sec5 .list::before, #marketing .sec5 .list::after { display:none; } 
 #marketing .sec5 .col { width:100%; height:auto; border-radius:200px; flex-direction:row; gap:16px; padding:32px 40px; aspect-ratio: unset; } 
 #marketing .sec5 .col img { max-width:unset; } 
 #marketing .sec6 { padding: 0; } 
 #marketing .sec6 .container { height: auto; padding: 60px 40px; gap: 48px; } 
 
 } 





 /**************** AI AGENT 260409 *****************/
#eo_aiagent .bg_wrap { padding:0; } 
#aiagent { padding-top: 110px; padding-bottom: 160px; } 
#aiagent * { font-family: "Pretendard"; color: #000; word-break: keep-all; } 
#aiagent *::before, #aiagent *::after { display: none; } 
#aiagent .container { width: 100%; max-width: 1340px; padding-left: 20px; padding-right: 20px; margin: 0 auto; } 

#aiagent .btn { border-radius: 4px; background: #016DE2; display: flex; padding: 15px 25px; justify-content: center; align-items: center; gap: 8px; color:#fff; font-size: 15px; font-weight: 700; line-height: 22px; transition: .2s; } 
#aiagent .btn:hover { background-color: #fff; color: #000; } 
#aiagent .btn.line { background: #FFF; border: 1px solid #E0E0E0; color: #000; font-weight: 500; } 
#aiagent .btn.line:hover { background-color: #016DE2; color: #fff; } 
#aiagent .btn .arrow { min-width: 24px; height: 24px; background: url('../img/aiagent/call_made.svg') no-repeat center; background-size: cover; transition: .2s; } 
#aiagent .btn.line .arrow { background-image: url('../img/aiagent/call_made-1.svg'); } 
#aiagent .btn:hover .arrow { background-image: url('../img/aiagent/call_made-1.svg'); } 
#aiagent .btn.line:hover .arrow { background-image: url('../img/aiagent/call_made.svg'); } 
#aiagent .badge { color: #016DE2; font-size: 16px; font-weight: 700; line-height: 24px; display: flex; padding: 8px 16px; justify-content: center; align-items: center; border-radius: 9999px; background: rgba(1, 109, 226, 0.10); } 

 
#aiagent .hero { height: 740px; background: url('../img/aiagent/sec1_bg.jpg')no-repeat center; background-size: cover; } 
#aiagent .hero .container { padding-top: 200px; display: flex; flex-direction: column; align-items: flex-start; gap: 64px; } 
#aiagent .hero .hero-txt { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; } 
#aiagent .hero .ts { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; } 
#aiagent .hero .tit { color:#fff; font-size: 60px; font-weight: 700; line-height: 60px; } 
#aiagent .hero .sub { color:#fff; font-size: 46px; font-weight: 700; line-height: 56px; } 
#aiagent .hero .desc { color: #C4C4C4; font-size: 18px; line-height: 26px; } 
#aiagent .hero .hero-badges { display: flex; align-items: flex-start; gap: 8px; flex-wrap: nowrap; } 
#aiagent .hero .check { display: flex; padding: 13px 24px; justify-content: center; align-items: center; gap: 8px; border-radius: 40px; background: rgba(255, 255, 255, 0.12); color:#fff; font-size: 14px; font-weight: 500; line-height: 20px; } 

#aiagent .why { display: flex; padding: 160px 20px 200px; flex-direction: column; align-items: flex-start; gap: 60px; align-self: stretch; } 
#aiagent .why .why-in { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; } 
#aiagent .why .tit { color: #000; font-size: 40px; font-weight: 700; line-height: 40px; } 
#aiagent .why .sub { color: #666; font-size: 18px; font-weight: 500; line-height: 26px; } 
#aiagent .why .why-list { display: flex; gap: 20px; } 
#aiagent .why .why-item { display: flex; padding: 40px; height: 260px; flex-direction: column; align-items: flex-start; gap: 20px; flex: 1 0 0; align-self: stretch; background: #F4F4F4; position: relative; } 
#aiagent .why .t { color: #000; font-size: 24px; font-weight: 500; line-height: 32px; } 
#aiagent .why .d { color: #666; font-size: 16px; line-height: 24px; } 
#aiagent .why .icon { position: absolute; right: 24px; bottom: -8px; } 

#aiagent .flow { background: url('../img/aiagent/sec3_bg.jpg')no-repeat center; background-size: cover; padding: 120px 0; position: relative; } 
#aiagent .flow .flow-grid { display: flex; align-items: center; justify-content: center; gap: 140px; flex-direction: column; } 
#aiagent .flow .flow-in { display: flex; gap: 360px; } 
#aiagent .flow .flow-center { color: #000; text-align: center; font-size: 40px; font-weight: 700; line-height: 40px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
#aiagent .flow .flow-center span { color: #016DE2; } 
#aiagent .flow .flow-item { display: flex; width: 320px; padding: 28px 24px; flex-direction: column; align-items: center; gap: 4px; border-radius: 8px; background:#fff; } 
#aiagent .flow .t { color: #1A1A1A; text-align: center; font-size: 18px; font-weight: 700; line-height: 28px; } 
#aiagent .flow .d { color: #4A4A4A; text-align: center; font-size: 14px; line-height: 20px; } 

#aiagent .ai { padding: 160px 20px; display: flex; flex-direction: column; align-items: center; gap: 60px; align-self: stretch; } 
#aiagent .ai .tit { display: flex; flex-direction: column; align-items: center; gap: 12px; } 
#aiagent .ai .sub { color: #666; font-size: 32px; font-weight: 500; line-height: 36px; } 
#aiagent .ai .main { display: flex; justify-content: center; align-items: flex-start; color: #000; font-size: 48px; font-weight: 700; line-height: 48px; } 
#aiagent .ai .ai-list { display:grid; gap: 20px; grid-template-columns: repeat(4, minmax(0, 1fr)); } 
#aiagent .ai .ai-item { display: flex; border-radius: 8px; border: 1px solid #E0E4EC; padding: 28px 24px; align-items: center; gap: 20px; } 
#aiagent .ai .td { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; flex: 1 0 0; } 
#aiagent .ai .t { color: #000; font-size: 16px; font-weight: 700; line-height: 24px; } 
#aiagent .ai .d { color: #4A4A4A; font-size: 14px; line-height: 20px; } 

#aiagent .banner { display: flex; background: url('../img/aiagent/sec5_bg.jpg')no-repeat center; background-size: cover; height: 400px; } 
#aiagent .banner .container { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 32px; } 
#aiagent .banner .tit { color: #FFF; font-size: 48px; font-weight: 700; line-height: 48px; letter-spacing: -1.2px; } 
#aiagent .banner .desc { color: rgba(255, 255, 255, 0.90); font-size: 24px; font-weight: 500; line-height: 39px; } 

#aiagent .qa { padding: 140px 20px; display: flex; justify-content: space-between; align-items: center; align-self: stretch; flex-wrap: wrap; gap: 60px; } 
#aiagent .qa .qa-in { display: flex; flex-direction: column; align-items: flex-start; gap: 28px; } 
#aiagent .qa .qa-left { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; } 
#aiagent .qa .tit { color: #000; font-size: 40px; font-weight: 700; line-height: 44px; } 
#aiagent .qa .tit span { color: #016DE2; } 
#aiagent .qa .desc { color: #4A4A4A; font-size: 18px; line-height: 26px; } 
#aiagent .qa .qa-list { display:grid; gap: 20px; grid-template-columns: repeat(2, minmax(0, 1fr)); } 
#aiagent .qa .qa-item { display: flex; width: 380px; padding: 24px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 12px; justify-self: stretch; border-radius: 8px; border: 1px solid #E0E0E0; background: #F8FAFF; } 
#aiagent .qa .td { display: flex; align-items: center; gap: 12px; } 
#aiagent .qa .t { color: #444; font-size: 16px; line-height: 24px; } 
#aiagent .qa .d { color: #000; font-size: 18px; line-height: 26px; } 

#aiagent .exp { background: #F7F8F9; padding: 120px 0; } 
#aiagent .exp .container { display: flex; flex-direction: column; align-items: flex-start; gap: 60px; align-self: stretch; } 
#aiagent .exp .exp-in { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; } 
#aiagent .exp .tit { color: #000; font-size: 40px; font-weight: 700; line-height: 44px; } 
#aiagent .exp .tit span { color: #016DE2; } 
#aiagent .exp .sub { color: #4A4A4A; font-size: 18px; line-height: 26px; } 
#aiagent .exp .exp-list { display: flex; align-items: flex-start; gap: 12px; align-self: stretch; } 
#aiagent .exp .exp-item { display: flex; height: 148px; padding: 32px 28px; flex-direction: column; align-items: flex-start; gap: 8px; flex: 1 0 0; align-self: stretch; border-radius: 8px; background-size: cover; } 
#aiagent .exp .exp-item:first-of-type { background: url('../img/aiagent/sec7_1.jpg') no-repeat center; } 
#aiagent .exp .exp-item:nth-of-type(2) { background: url('../img/aiagent/sec7_2.jpg') no-repeat center; } 
#aiagent .exp .exp-item:nth-of-type(3) { background:url('../img/aiagent/sec7_3.jpg') no-repeat center; } 
#aiagent .exp .exp-item:last-of-type { background:url('../img/aiagent/sec7_4.jpg') no-repeat center; } 
#aiagent .exp .t { color:#fff; font-size: 20px; font-weight: 700; line-height: 28px; } 
#aiagent .exp .d { color: #E0E0E0; font-size: 16px; line-height: 24px; } 

#aiagent .ops { display: flex; padding: 120px 20px; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 60px; } 
#aiagent .ops .ops-left { display: flex; flex-direction: column; align-items: flex-start; gap: 28px; } 
#aiagent .ops .tit { color: #000; font-size: 40px; font-weight: 700; line-height: 44px; } 
#aiagent .ops .ops-list { display: flex; width: 860px; align-items: center; align-content: center; gap: 12px; flex-shrink: 0; flex-wrap: wrap; } 
#aiagent .ops .ops-item { display: flex; height: 148px; padding: 24px; flex-direction: column; justify-content: space-between; align-items: flex-start; flex-shrink: 0; border-radius: 8px; background: #F9F9FF; } 
#aiagent .ops .ops-item:first-of-type,
#aiagent .ops .ops-item:nth-of-type(5) { width: 360px; } 
#aiagent .ops .ops-item:nth-of-type(2),
#aiagent .ops .ops-item:last-of-type { width: 284px; } 
#aiagent .ops .ops-item:nth-of-type(3),
#aiagent .ops .ops-item:nth-of-type(4) { width: 192px; } 
#aiagent .ops .td { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; align-self: stretch; } 
#aiagent .ops .t { color: #101828; font-size: 16px; font-weight: 500; line-height: 24px; } 
#aiagent .ops .d { color: #4A5565; font-size: 14px; line-height: 20px; } 

#aiagent .sec { background: #F7F8F9; padding: 140px 0; } 
#aiagent .sec .container { display: flex; flex-direction: column; align-items: center; gap: 40px; align-self: stretch; } 
#aiagent .sec .sec-top { display: flex; flex-direction: column; align-items: center; gap: 28px; } 
#aiagent .sec .tit { color: #000; font-size: 40px; font-weight: 700; line-height: 44px; } 
#aiagent .sec .sec-list { display: flex; justify-content: center; align-items: flex-start; } 
#aiagent .sec .sec-item { display: flex; width: 260px; height: 260px; padding: 24px; flex-direction: column; justify-content: center; align-items: center; gap: 12px; flex-shrink: 0; aspect-ratio: 1/1; border-radius: 300px; background: #FFF; margin-left: -12px; } 
#aiagent .sec .t { color: #016DE2; font-size: 16px; line-height: 24px; } 
#aiagent .sec .d { color: #000; text-align: center; font-size: 18px; line-height: 26px; } 

#aiagent .grow { background: url('../img/aiagent/sec10_bg.jpg')no-repeat center; background-size: cover; padding: 140px 0; } 
#aiagent .grow .container { display: flex; flex-direction: column; align-items: flex-start; gap: 60px; align-self: stretch; } 
#aiagent .grow .grow-left { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; } 
#aiagent .grow .tit { color:#fff; font-size: 40px; font-weight: 700; line-height: 44px; } 
#aiagent .grow .desc { color: rgba(255, 255, 255, 0.70); font-size: 18px; line-height: 26px; } 
#aiagent .grow .grow-list { display: flex; align-items: flex-start; align-self: stretch; } 
#aiagent .grow .item { display: flex; padding-left: 24px; flex-direction: column-reverse; align-items: flex-start; gap: 12px; flex: 1 0 0; border-left: 3px solid #016DE2; } 
#aiagent .grow .d { color: rgba(255, 255, 255, 0.80); font-size: 15px; line-height: 22px; } 
#aiagent .grow .t { color: #FFF; font-size: 20px; font-weight: 700; line-height: 28px; } 

#aiagent .conn { display: flex; padding: 140px 20px; flex-direction: column; align-items: center; gap: 40px; align-self: stretch; } 
#aiagent .conn .conn-top { display: flex; flex-direction: column; align-items: center; gap: 28px; } 
#aiagent .conn .tit { color: #000; font-size: 40px; font-weight: 700; line-height: 44px; } 
#aiagent .conn .conn-list { display:grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } 
#aiagent .conn .item { display: flex; min-width: 212px; height: 60px; justify-content: center; align-items: center; gap: 8px; flex-shrink: 0; color: #364153; text-align: center; font-size: 16px; font-weight: 500; line-height: 24px; border-radius: 80px; border: 1px solid var(--Colors-Grey-Color-Light-Base8, #E0E0E0); } 


#aiagent .cta { display: flex; max-width: 1200px; height: 500px; padding: 0 120px; flex-direction: column; justify-content: center; align-items: flex-start; gap: 60px; background: url('../img/aiagent/sec12_bg.jpg')no-repeat center; background-size: cover; } 
#aiagent .cta .cta-txt { display: flex; flex-direction: column; gap: 24px; } 
#aiagent .cta .tit { color:#fff; font-size: 48px; font-weight: 700; line-height: 52px; } 
#aiagent .cta .desc { color: rgba(255, 255, 255, 0.70); font-size: 18px; line-height: 26px; } 
#aiagent .cta .btns { display: flex; align-items: center; gap: 12px; } 






 @media (max-width: 1024px) { 
 #aiagent { padding-bottom: 20px; } 
 #aiagent .why .icon { max-width: 60px; } 
 #aiagent .ai .ai-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } 
 #aiagent .qa .qa-list { width: 100%; } 
 #aiagent .qa .qa-item { width: 100%; } 
 #aiagent .sec .sec-list { flex-wrap:wrap; } 
 #aiagent .sec .sec-item { max-width:calc(50% - 12px); height:auto; } 
 } 

 @media (max-width: 786px) { 
 #aiagent { padding-top: 77px; } 
 #aiagent .hidden { display: block !important; } 


 #aiagent .btn { padding: 10px 20px; font-size: 14px; line-height: 20px; } 
 #aiagent .badge { font-size: 15px; } 


 
 #aiagent .hero { height: auto; background: url('../img/aiagent/sec1MO.jpg')no-repeat top center; background-size: cover; } 
 #aiagent .hero .container { padding-top: 140px; padding-bottom:40px; gap: 32px; } 
 #aiagent .hero .hero-txt { flex-start; gap: 12px; } 
 #aiagent .hero .ts { flex-start; gap: 0; } 
 #aiagent .hero .tit { font-size: 32px; line-height: 36px; } 
 #aiagent .hero .sub { font-size: 32px; line-height: 36px; } 
 #aiagent .hero .desc { font-size: 14px; line-height: 20px; } 
 #aiagent .hero .check { padding: 10px 16px; font-size: 12px; line-height: 16px; } 

 #aiagent .why { padding: 60px 20px; gap: 40px; } 
 #aiagent .why .why-in { gap: 12px; } 
 #aiagent .why .tit { font-size: 28px; line-height: 36px; } 
 #aiagent .why .sub { font-size: 14px; line-height: 20px; } 
 #aiagent .why .why-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 12px; } 
 #aiagent .why .why-item { padding: 20px; height: 200px; gap: 12px; } 
 #aiagent .why .t { font-size: 20px; line-height: 28px; } 
 #aiagent .why .d { font-size: 13px; line-height: 18px; } 
 #aiagent .why .icon { right: 14px; bottom: -6px; } 

 #aiagent .flow { background:#F7F8F9 url('../img/aiagent/Union.png')no-repeat top 72px right; background-size: 197px; padding: 60px 20px 36px; display:flex; flex-direction:column; gap:40px; } 
 #aiagent .flow .flow-grid { gap: 12px; } 
 #aiagent .flow .flow-in { flex-direction:column; gap:12px; width:100%; } 
 #aiagent .flow .flow-center { font-size: 28px; line-height: 36px; position: unset; transform: unset; text-align:left; } 
 #aiagent .flow .flow-center br:last-of-type { display:none; } 
 #aiagent .flow .flow-item { width: 100%; padding: 20px 24px;; } 
 #aiagent .flow .t { font-size: 16px; line-height: 24px; } 

 #aiagent .ai { padding: 60px 20px 20px 20px; gap: 32px; } 
 #aiagent .ai .tit { gap: 8px; } 
 #aiagent .ai .sub { font-size: 16px; line-height: 24px; } 
 #aiagent .ai .main { font-size: 32px; line-height: 36px; } 
 #aiagent .ai .main img { max-width:36px; } 
 #aiagent .ai .ai-list { gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); } 
 #aiagent .ai .ai-item { flex-direction:column; gap:20px; padding: 16px 12px; } 
 #aiagent .ai .td { gap: 4px; text-align:center; align-items:center; } 

 #aiagent .banner { background: url('../img/aiagent/sec5MO.jpg')no-repeat center; background-size: cover; height: 240px; } 
 #aiagent .banner .container { gap: 20px; } 
 #aiagent .banner .tit { font-size:28px; line-height: 36px; } 
 #aiagent .banner .desc { font-size: 16px; line-height: 24px; } 

 #aiagent .qa { padding: 60px 20px 36px 20px; gap: 40px; } 
 #aiagent .qa .qa-in { gap: 12px; } 
 #aiagent .qa .qa-left { gap: 12px; } 
 #aiagent .qa .tit { font-size: 28px; line-height: 36px; } 
 #aiagent .qa .desc { font-size: 14px; line-height: 20px; } 
 #aiagent .qa .qa-list { display:grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); } 
 #aiagent .qa .qa-item { width: 100%; padding: 20px; gap: 8px; justify-content:flex-start; } 
 #aiagent .qa .td { flex-direction:column; align-items:flex-start; gap: 16px; } 
 #aiagent .qa .t { font-size: 14px; line-height: 20px; } 
 #aiagent .qa .d { font-size: 16px; line-height: 24px; } 

 #aiagent .exp { padding: 60px 0 36px; } 
 #aiagent .exp .container { gap: 40px; } 
 #aiagent .exp .exp-in { gap: 12px; } 
 #aiagent .exp .tit { font-size: 28px; line-height: 36px; } 
 #aiagent .exp .sub { font-size: 14px; line-height: 20px; } 
 #aiagent .exp .exp-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; } 
 #aiagent .exp .exp-item { height: 130px; padding: 28px 20px; background-size: contain; } 
 #aiagent .exp .exp-item:first-of-type { background: url('../img/aiagent/sec7_1MO.jpg') no-repeat center; } 
 #aiagent .exp .exp-item:nth-of-type(2) { background: url('../img/aiagent/sec7_2MO.jpg') no-repeat center; } 
 #aiagent .exp .exp-item:nth-of-type(3) { background:url('../img/aiagent/sec7_3MO.jpg') no-repeat center; } 
 #aiagent .exp .exp-item:last-of-type { background:url('../img/aiagent/sec7_4MO.jpg') no-repeat center; } 
 #aiagent .exp .t { font-size: 18px; line-height: 26px; } 
 #aiagent .exp .d { font-size: 14px; line-height: 20px; } 

 
 #aiagent .ops { padding: 60px 20px 36px; gap: 40px; } 
 #aiagent .ops .ops-left { gap: 12px; } 
 #aiagent .ops .tit { font-size: 28px; line-height: 36px; } 
 #aiagent .ops .tit br { display: none; } 
 #aiagent .ops .ops-list { width: 100%; gap: 8px; } 
 #aiagent .ops .ops-item { padding: 20px; } 
 #aiagent .ops .ops-item:first-of-type,
 #aiagent .ops .ops-item:nth-of-type(4),
 #aiagent .ops .ops-item:nth-of-type(5) { width: 58.125%; } 
 #aiagent .ops .ops-item:nth-of-type(2),
 #aiagent .ops .ops-item:nth-of-type(3),
 #aiagent .ops .ops-item:last-of-type { width: 39.375%; } 
 #aiagent .ops .t { font-size: 15px; line-height: 22px; } 

 #aiagent .sec { padding: 60px 0 36px; } 
 #aiagent .sec .sec-top { gap: 12px; } 
 #aiagent .sec .tit { font-size: 28px; line-height: 36px; text-align:center; } 
 #aiagent .sec .sec-item { width:100%; aspect-ratio:1; padding: 20px; gap: 8px; } 
 #aiagent .sec .t { font-size: 14px; line-height: 20px; } 
 #aiagent .sec .d { font-size: 16px; line-height: 24px; } 

 #aiagent .grow { background: url('../img/aiagent/sec10MO.jpg')no-repeat center; background-size: cover; padding: 40px 0; } 
 #aiagent .grow .container { gap: 32px; } 
 #aiagent .grow .tit { font-size: 28px; line-height: 36px; } 
 #aiagent .grow .desc { font-size: 16px; line-height: 24px; } 
 #aiagent .grow .grow-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap:20px; } 
 #aiagent .grow .item { padding: 8px; gap: 4px; } 
 #aiagent .grow .d { font-size: 13px; line-height: 18px; } 

 #aiagent .conn { padding: 60px 20px 36px; } 
 #aiagent .conn .conn-top { gap: 12px; } 
 #aiagent .conn .tit { font-size: 28px; line-height: 36px; text-align: center; } 
 #aiagent .conn .conn-list { width:100%; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } 
 #aiagent .conn .item { min-width: 100%; font-size: 15px; line-height: 22px; } 

 #aiagent .cta { max-width: calc(100% - 40px); border-radius: 4px; height: auto; padding: 44px 20px 32px 20px; gap: 40px; } 
 #aiagent .cta .cta-txt { gap: 20px; align-items:flex-start; } 
 #aiagent .cta .tit { font-size: 32px; line-height: 36px; } 
 #aiagent .cta .desc { font-size: 15px; line-height: 22px; } 
 #aiagent .cta .btns { flex-direction:column; gap: 8px; width:100%; } 
 #aiagent .cta .btn { width:100%; } 

 } 










 /**************** INTRO (NEW) 260420 *****************/
 #intro_new { background: var(--bg-color); overflow: hidden; transition: background 0.3s ease; } 
 #intro_new .hero { display: flex; } 
 #intro_new .left { position: absolute; top: 0; left: 0; height: 100%; overflow: hidden; isolation: isolate; width: 50%; } 
 #intro_new .blend-bg { position: absolute; inset: 0; background: var(--bg-color); z-index: 0; transition: background 0.3s ease; } 
 #intro_new .bg { position: absolute; inset: 0; z-index: 1; } 
 #intro_new .right { width: calc(50% + 220px); margin-left: auto; border: 1px solid rgba(255, 255, 255, 0.20); backdrop-filter: blur(15px); position: absolute; right: 0; top: 0; height: 100%; z-index: 4; } 
 #intro_new .typing { position: absolute; bottom: 156px; left: 186px; display: flex; flex-direction: column; gap: 20px; min-height: 422px; } 
 #intro_new .l1,
 #intro_new .l2 { color: var(--base0); font-family: "Pretendard"; font-size: 52px; font-weight: 700; line-height: 64px; } 
 #intro_new .l3 { color: var(--base0); font-family: "Pretendard"; font-size: 42px; line-height: 64px; } 
 #intro_new .l4 { color: var(--base0); font-family: "Pretendard"; font-size: 52px; font-weight: 700; line-height: 64px; padding-right: 45px; position: relative; display: inline-block; } 
 #intro_new .l4 span { color: #D6543A; } 
 #intro_new .l5 { color: var(--base0); font-family: "Pretendard"; font-size: 52px; font-weight: 700; line-height: 64px; padding-right: 45px; position: relative; display: inline-block; } 
 #intro_new .l5 span { color: #3A64D6; } 
 #intro_new .l6,
 #intro_new .l7 { color: var(--base0); font-family: "Pretendard"; font-size: 19px; line-height: 27px; } 
 #intro_new .circle { position: absolute; width: 25px; height: 25px; border-radius: 50%; background: #3A64D6; mix-blend-mode: screen; transition: transform linear; } 
 #intro_new .circle:nth-child(2) { background: #D6543A; width: 45px; height: 45px; } 
 #intro_new .circle:nth-child(3) { background: #3A64D6; width: 206px; height: 206px; } 
 #intro_new .text { position: absolute; top: 260px; left: 10%; z-index: 2; font-size: 120px; font-weight: 800; line-height: 120px; color: #000; mix-blend-mode: difference; z-index: 2; } 
 #intro_new .text.base { color: #000; z-index: 2; } 
 #intro_new .text.blend { color: #fff; mix-blend-mode: difference; z-index: 3; pointer-events: none; } 
 #intro_new .line { display: block; opacity: 0; transform: translateX(-80px); } 
 #intro_new .line.show { opacity: 1; transform: translateX(0); transition: all .7s cubic-bezier(.22, .61, .36, 1); } 
 #intro_new .line2 { padding: 0 0px; } 
 #intro_new .finger { position: absolute; bottom: 74px; left: 410px; animation: fingerSwing 8s ease-in-out infinite; transform-origin: center; } 
 @keyframes fingerSwing { 
 0% { transform: translateX(0) rotate(-6deg); } 
 50% { transform: translateX(10px) rotate(6deg); } 
 100% { transform: translateX(0) rotate(-6deg); } 
 } 
/*
 #intro_new .scroll { position: absolute; bottom: 52px; left: 60px; display: flex; align-items: center; gap: 4px; color: var(--base0); font-size: 16px; line-height: 24px; } 
 #intro_new .scroll-down { animation: bounce 2s infinite; } */
 @keyframes bounce { 0%,
 100% { transform: translateY(-5px); } 

 50% { transform: translateY(5px); } 
 } 

 body.dark-mode #intro_new .right {  } 
 body.dark-mode #intro_new .scroll-down path { stroke: white; } 


 #intro_new .arrow-top,
 #intro_new .arrow-bottom { position: absolute; opacity: 0; right: 0; } 
 #intro_new .arrow-top { top: 6px; } 
 #intro_new .arrow-bottom { bottom: 6px; } 
 #intro_new .fade-down { animation: fadeDown 1s forwards; } 
 #intro_new .fade-up { animation: fadeUp 1s forwards; } 
 @keyframes fadeDown { 
 from { opacity: 0; transform: translateY(-10px); } 
 to { opacity: 1; transform: translateY(0); } 
 } 

 @keyframes fadeUp { 
 from { opacity: 0; transform: translateY(10px); } 
 to { opacity: 1; transform: translateY(0); } 
 } 
 #intro_new .cursor { position: fixed; width: 92px; height: 92px; background-color: rgba(12, 83, 224, 1); mix-blend-mode: hard-light; border-radius: 50%; pointer-events: none; z-index: 3; } 



 @media (max-width: 1800px) { 
 #intro_new .typing { left: 130px; } 
 #intro_new .text { left: 4%; } 
 #intro_new .line2 { padding: 0 80px; } 
 } 


@media (max-width: 1600px) { 
 #intro_new .typing { left: 84px; } 
 #intro_new .text { font-size: 100px; line-height: 100px; } 
 } 


@media (max-width: 1400px) { 
 #intro_new .right { width: calc(50% + 100px); } 
 } 


 @media (max-width: 1200px) { 
 #intro_new .text { font-size: 80px; line-height: 80px; } 
 #intro_new .typing { min-height: 340px; } 
 #intro_new .l1,
 #intro_new .l2 { font-size: 42px; font-weight: 700; line-height: 50px; } 
 #intro_new .l3 { font-size: 32px; line-height: 40px; } 
 #intro_new .l4 { font-size: 42px; font-weight: 700; line-height: 50px; } 
 #intro_new .l5 { font-size: 42px; font-weight: 700; line-height: 50px; } 
 #intro_new .l6,
 #intro_new .l7 { font-size: 16px; line-height: 24px; } 
 #intro_new .line2 { padding: 0 60px; } 

 } 


 /* 태블릿 (가로) */
@media (max-width: 1024px) { 

 } 


/* 태블릿 (세로) */
@media (max-width: 767px) { 
 #intro_new .left { height:50%; width:100%; } 
 #intro_new .right { width: 100%; height:60%; bottom:0; top:unset; } 
 #intro_new .typing { bottom: 60px; left: 20px; gap: 12px; min-height: 260px; } 
 #intro_new .l1,
 #intro_new .l2 { font-size: 32px; line-height: 40px; } 
 #intro_new .l3 { font-size: 26px; line-height: 36px; } 
 #intro_new .l4 { font-size: 32px; line-height: 40px; padding-right: 32px; } 
 #intro_new .l5 { font-size: 32px; line-height: 40px; padding-right: 32px; } 
 #intro_new .l6,
 #intro_new .l7 { font-size: 14px; line-height: 20px; } 
 #intro_new .circle { width: 20px; height: 20px; } 
 #intro_new .circle:nth-child(2) { width: 66px; height: 66px; } 
 #intro_new .circle:nth-child(3) { width: 92px; height: 92px; } 
 #intro_new .text { top: 136px; left: 20px; font-size: 56px; line-height: 56px; } 
 #intro_new .line2 { padding: 0 48px; } 
 #intro_new .finger { max-width: 224px; aspect-ratio: 1; right: 8px; left: unset; bottom: -78px; } 
 #intro_new .scroll { display: none; } 
 #intro_new .arrow-top, #intro_new .arrow-bottom { max-width: 22px; } 
 #intro_new .cursor { display: none; } 
 } 


@media (max-width: 480px) { 
 #intro_new .text { top: 106px; font-size: 42px; line-height: 42px; } 
 #intro_new .typing { bottom: 200px; min-height: 206px; } 
 #intro_new .l1,
 #intro_new .l2 { font-size: 22px; line-height: 30px; } 
 #intro_new .l3 { font-size: 18px; line-height: 26px; } 
 #intro_new .l4, #intro_new .l5 { font-size: 22px; line-height: 30px; padding-right:22px; } 
 #intro_new .l6,
 #intro_new .l7 { font-size: 13px; line-height: 18px; } 
 #intro_new .arrow-top,
 #intro_new .arrow-bottom { max-width: 18px; } 
 #intro_new .arrow-top { top: 3px; } 
 #intro_new .arrow-bottom { bottom: 3px; } 

 }