#contents { overflow:hidden; } 
.main_title { font-family:"Nanum Myeongjo",serif; font-size:40px; font-weight:700; line-height:1.4; text-align:center; } 
.main_title em { color:#4b7bde; font-style:normal; } 
.main_topBanner { position:relative; display:flex; height:calc(100vh - 100px); align-items:center; justify-content:center; color:#fff; background:url(/vkwonth/img/main_visual.webp) center/cover no-repeat; } 
.main_topBanner::before { position:absolute; inset:0; content:""; background:rgba(0,0,0,.6); } 
.main_topBanner article { position:relative; z-index:1; width:100%; max-width:1440px; } 
.main_topBanner h1 { font-family:"Nanum Myeongjo",serif; font-size:70px; font-weight:700; line-height:1.4; text-align:center; } 
.main_block01 { position:relative; padding:110px 20px; background:#fff; } 
.main_block01::after { position:absolute; right:0; bottom:0; width:705px; height:892px; content:""; background:url(/vkwonth/img/main_symbol.webp) right bottom/contain no-repeat; pointer-events:none; } 
.main_block01 > article { position:relative; z-index:1; width:100%; max-width:1440px; margin:0 auto; } 
.main_intro_content { display: flex; align-items: center; gap: 40px; margin-top: 40px; } 
.main_intro_image { width:100%; max-width:640px; height:520px; overflow:hidden; } 
.main_intro_image img { width:100%; height:100%; object-fit:cover; object-position:center 8%; } 
.main_intro_text { display:flex; width:100%; max-width:760px; flex-direction:column; align-items:flex-start; } 
.main_intro_text > strong { margin-bottom:16px; font-size:20px; font-weight:600; line-height:1.6; } 
.main_intro_text > p { max-width:760px; margin-bottom:16px; font-size:16px; font-weight:500; line-height:1.6; } 
.main_more_button { display:flex; width:100%; max-width:150px; height:44px; align-items:center; justify-content:space-between; margin-top:8px; padding:0 16px; color:#fff; background:#4b7bde; font-size:16px; font-weight:500; } 
.main_block02 { padding:110px 20px; background:#f5f5f5; } 
.main_block02 > article { width:100%; max-width:1440px; margin:0 auto; } 
.footprint_list { display:flex; gap:20px; margin-top:40px; } 
.footprint_group { display:flex; width:100%; max-width:710px; flex-direction:column; gap:20px; } 
.footprint_group_bottom { display:flex; gap:20px; } 
.footprint_item { position:relative; display:block; width:100%; height:220px; overflow:hidden; } 
.footprint_career { max-width:710px; height:460px; } 
.footprint_item::after { position:absolute; inset:0; z-index:1; content:""; background:linear-gradient(to bottom,transparent 40%,#000 100%); } 
.footprint_item img { width:100%; height:100%; object-fit:cover; transition:transform .35s; } 
.footprint_career img { object-position:center; } 
.footprint_story img { object-position:center 40%; } 
.footprint_group_bottom .footprint_item:last-child img { object-position:center 60%; } 
.footprint_item > span { position:absolute; right:30px; bottom:28px; left:30px; z-index:2; display:flex; align-items:center; gap:8px; color:#fff; font-size:20px; font-weight:600; line-height:1.6; } 
.main_block03 { padding:110px 20px; background:#fff; } 
.main_block03 > article { width:100%; max-width:1440px; margin:0 auto; } 
.main_service_slider { overflow:visible; margin-top:40px; } 
.main_service_slider .slider_wrapper { display:flex; gap:20px; } 
.main_service_item { position:relative; display:block; width:calc((100% - 60px) / 4); height:auto; aspect-ratio:1/1; overflow:hidden; } 
.main_service_item::after { position:absolute; inset:0; z-index:1; content:""; background:linear-gradient(to bottom,transparent 40%,#000 100%); } 
.main_service_item img { width:100%; height:100%; object-fit:cover; transition:transform .35s; } 
.main_service_item > span { position:absolute; right:30px; bottom:28px; left:30px; z-index:2; display:flex; align-items:center; gap:8px; color:#fff; font-size:20px; font-weight:600; line-height:1.6; } 
.main_service_slider .service_pagination { display:none; } 
.main_block04 > article { display:flex; width:100%; } 
.main_contact_location { display:flex; width:50%; flex-direction:column; } 
.main_contact_info { padding:40px max(40px,calc((100vw - 1440px) / 2)); color:#fff; background:linear-gradient(106.72deg,#4b7bde 1.81%,#294278 100%); height: 294px; } 
.main_contact_info dl { display:flex; flex-direction:column; gap:20px; } 
.main_contact_info dl > div { display:flex; flex-direction:column; } 
.main_contact_info dt { font-size:20px; font-weight:600; line-height:1.6; } 
.main_contact_info dd { margin-top:2px; font-size:16px; font-weight:500; line-height:1.6; } 
.map_cont { position:relative; width:100%; height:calc(100% - 294px); } 
.map_cont iframe { display:block; width:100%; height:100%; border:0; } 
.map_place_info { position:absolute; top:20px; left:20px; z-index:2; display:flex; width:calc(100% - 40px); max-width:330px; padding:15px 20px; flex-direction:column; gap:3px; border-radius:4px; color:#121212; background:#fff; box-shadow:0 5px 20px rgba(0,0,0,.18); } 
.map_place_info strong { font-size:18px; font-weight:700; line-height:1.5; } 
.map_place_info span { color:#555; font-size:14px; line-height:1.5; } 
.map_place_info small { margin-top:5px; color:#4b7bde; font-size:13px; font-weight:600; line-height:1.5; } 
.main_consultation { position:relative; display:flex; width:50%; height: max-content; flex-direction:column; align-items:center; padding:80px max(40px,calc((100vw - 1700px) / 2)) 80px; color:#fff; background:url(/vkwonth/img/main_contact.webp) center/cover no-repeat; } 
.main_consultation::before { position:absolute; inset:0; content:""; background:rgba(0,0,0,.5); backdrop-filter:blur(10px); } 
.main_consultation > * { position:relative; z-index:1; } 
.main_consultation h2 { font-family:"Nanum Myeongjo",serif; font-size:40px; font-weight:700; line-height:1.4; width: 100%; max-width: 610px; text-align: left; } 
.main_consultation_form { display:flex; width:100%; max-width:610px; flex-wrap:wrap; gap:16px 10px; margin-top:30px; } 
.main_consultation_form > label { display:flex; width:calc((100% - 10px) / 2); flex-direction:column; gap:6px; font-size:16px; font-weight:500; line-height:1.5; } 
.main_consultation_form input, .main_consultation_form textarea { width:100%; height:44px; padding:0 15px; border:1px solid #fff; border-radius:4px; outline:0; color:#fff; background:rgba(255,255,255,.4); font-size:14px; } 
.main_consultation_form textarea { height:140px; padding-top:12px; resize:none; } 
.main_consultation_form input::placeholder, .main_consultation_form textarea::placeholder { color:rgba(255,255,255,.8); } 
.main_consultation_message { width:100% !important; } 
.main_consultation_security { display:flex; width:100%; align-items:flex-start; gap:10px; } 
.main_consultation_security > label { display:flex; width:100%; max-width:216px; flex-direction:column; gap:6px; } 
.main_consultation_security > label span { line-height:24px; } 
.main_consultation_password small { display:flex; align-items:center; gap:4px; color:#c4c4c4; font-size:12px; line-height:1.5; transition:color .2s; } 
.main_consultation_password small:nth-of-type(1) { margin-top:6px; } 
.main_consultation_password small.valid { color:#34d399; } 
.main_consultation_password small.valid .icon_check { background-image:url(/vkwonth/img/svg/icon_check_green.svg); } 
.main_consultation_captcha { display:flex; width:100%; max-width:384px; flex-wrap:wrap; gap:5px 10px; } 
.main_consultation_captcha > span { width:216px; margin-left:168px; color:#fff; font-size:16px; font-weight:500; line-height:1.5; } 
.main_consultation_captcha > span em { display:none; } 
.main_consultation_captcha .inquiry_captcha_widget { display:flex; width:100%; gap:10px; } 
.main_consultation_captcha .inquiry_captcha_input { width:216px; min-width:0; } 
.main_consultation_captcha .inquiry_captcha_legacy { display:flex; width:158px; height:44px; flex:none; align-items:center; gap:4px; } 
.main_consultation_captcha .inquiry_captcha_legacy img { width:110px; height:44px; border-radius:8px; object-fit:cover; background:#fff; font-size:0; } 
.main_consultation_captcha .inquiry_captcha_refresh { display:flex; width:44px; height:44px; flex:none; align-items:center; justify-content:center; border:0; border-radius:8px; background:#4b7bde; } 
.main_consultation_captcha .icon_refresh { width:20px; height:20px; background:url(/vkwonth/img/svg/icon_refresh_wh.svg) center/contain no-repeat; } 
.main_privacy { display:flex; width:100%; align-items:center; gap:4px; margin-top:-4px; } 
.main_privacy label { display:flex; align-items:center; gap:12px; color:#c4c4c4; } 
.main_consultation_form .main_privacy input { width:20px; height:20px; flex:none; padding:0; border:0; border-radius:4px; appearance:none; background:#f0f0f0 url(/vkwonth/img/svg/icon_checkbox_checked.svg) center/20px 20px no-repeat; cursor:pointer; } 
.main_consultation_form .main_privacy input:checked { background:#4b7bde url(/vkwonth/img/svg/icon_checkbox_active.svg) center/20px 20px no-repeat; } 
.main_consultation_form .main_privacy input:focus-visible { outline:2px solid #4b7bde; outline-offset:2px; } 
.main_privacy a { font-size:14px; } 
.main_consultation_buttons { display:flex; width:100%; gap:10px; margin-top:8px; } 
.main_consultation_buttons button { width:calc((100% - 10px) / 2); height:44px; border-radius:8px; color:#888; background:#d9d9d9; font-size:16px; font-weight:500; } 
.main_consultation_buttons button[type="submit"] { color:#fff; background:#4b7bde; } 

/* hover */
@media (hover: hover) and (pointer:fine) { 
.main_more_button:hover { filter:brightness(1.08); } 
.footprint_item:hover img, .main_service_item:hover img { transform:scale(1.04); } 
.main_consultation_buttons button:hover { filter:brightness(1.08); } 
 } 

@media (max-width:1024px) { 
.mobile_break { display:block; } 
.main_title { font-size:24px; } 
.main_topBanner { height:calc(100vh - 60px); background-position:center; } 
.main_topBanner article { padding:0 20px; } 
.main_topBanner h1 { font-size:36px; } 
.main_block01 { padding:60px 20px; } 
.main_block01::after { width:332px; height:420px; } 
.main_intro_content { flex-direction:column; gap:20px; margin-top:24px; } 
.main_intro_image { max-width:none; height:auto; aspect-ratio:320/190; } 
.main_intro_image img { object-position:center 10%; } 
.main_intro_text { max-width:none; padding-top:0; } 
.main_intro_text > strong { margin-bottom:12px; font-size:18px; } 
.main_intro_text > p { margin-bottom:12px; font-size:15px; } 
.main_more_button { max-width:130px; height:40px; align-self:center; margin-top:12px; font-size:15px; } 
.main_block02 { padding:60px 20px; } 
.footprint_list { flex-direction:column; gap:10px; margin-top:24px; } 
.footprint_group, .footprint_career { max-width:none; } 
.footprint_group, .footprint_group_bottom { flex-direction:column; gap:10px; } 
.footprint_item, .footprint_career { height:120px; } 
.footprint_item img, .footprint_career img, .footprint_story img { object-position:center; } 
.footprint_group_bottom .footprint_item:last-child img { object-position:center 60%; } 
.footprint_item > span { right:20px; bottom:14px; left:20px; font-size:18px; } 
.main_block03 { padding:60px 0; } 
.main_block03 .main_title { padding:0 20px; } 
.main_service_slider { overflow:hidden; margin-top:24px; padding:0 20px 20px; } 
.main_service_slider .slider_wrapper { gap:0; } 
.main_service_item { width:85%; flex:none; aspect-ratio:1/1; } 
.main_service_item > span { right:20px; bottom:14px; left:20px; font-size:20px; } 
.main_service_slider .service_pagination { position:absolute; right:0; bottom:0; left:0; z-index:5; display:flex; align-items:center; justify-content:center; gap:8px; } 
.main_service_slider .slider_bullet { width:8px; height:8px; opacity:1; border-radius:50%; background:#d9d9d9; } 
.main_service_slider .slider_bullet.is_active { background:#4b7bde; } 
.main_block04 > article { flex-direction:column; } 
.main_contact_location { width:100%; } 
.main_contact_info { padding:30px 20px; height:auto; } 
.main_contact_info dl { gap:15px; } 
.main_contact_info dt { font-size:18px; } 
.main_contact_info dd { font-size:15px; white-space:nowrap; } 
.map_cont { height:230px; } 
.main_map_image { aspect-ratio:360/230; } 
.main_consultation { width:100%; order:-1; padding:40px 20px; } 
.main_consultation h2 { align-self:flex-start; font-size:24px; } 
.main_consultation_form { max-width:none; flex-direction:column; flex-wrap:nowrap; gap:15px; margin-top:20px; } 
.main_consultation_form > label { width:100%; gap:4px; font-size:14px; } 
.main_consultation_form input { height:44px; } 
.main_consultation_form textarea { height:110px; } 
.main_consultation_security { flex-direction:column; gap:15px; } 
.main_consultation_security > label { width:100%; max-width:230px; } 
.main_consultation_captcha { max-width:none; column-gap:8px; } 
.main_consultation_captcha > span { width:calc(100% - 180px); margin-left:180px; } 
.main_consultation_captcha .inquiry_captcha_widget { gap:8px; } 
.main_consultation_captcha .inquiry_captcha_input { width:auto; flex:1; } 
.main_consultation_captcha .inquiry_captcha_legacy { width:172px; gap:8px; } 
.main_consultation_captcha .inquiry_captcha_legacy img { width:120px; } 
.main_privacy { margin-top:0; } 
.main_privacy label { gap:10px; font-size:16px; } 
.main_consultation_buttons { margin-top:5px; } 
.main_consultation_buttons button { width:calc((100% - 10px) / 2); } 
 } 
