@charset "UTF-8";

body { word-break: keep-all; }
.br1, .br2, .br3, .br4, .br5 { display: none; }

@media screen and (max-width: 1480px){
    html { font-size: 1vw; }
    .container { padding: 0 3%; }
    .br1 { display: block; }

    /* about */
    .about_why_box { padding: 3% 4%; }
    .about_why_txt { font-size: 0.95vw; }
}
@media screen and (max-width: 1280px){
    html { font-size: 1.125vw; }
    .br2 { display: block; }
    .header { font-size: 1.125em; }

    /* index */
    .brand_image img { transform: scale(0.8); }
    .stats_desc { font-size: 1.125rem; }
    .projects_item { width: 100%; padding: 3rem 2.5rem; }

    /* about */
    .about_why_txt { width: 55%; font-size: inherit; }
    .about_why_txt b { font-size: 6.5em; margin-bottom: 0.25em; }
    .about_why_txt h4 { font-size: 2.25em; line-height: 1.2; }
    .about_why_txt p br { display: none; }
    .about_why_img { width: 42%; }

    /* contact */
    .contact_headline_title { font-size: 2.375em; }
    .contact_headline_desc { font-size: 1.25em; }
}
@media screen and (max-width: 991px){
    html { font-size: 1.325vw; }
    .container { padding: 0 5%; }
    .br3 { display: block; }
    .br3-n { display: none; }

    /* header */
    .header .container { padding: 0 3%; }
    .header_logo { height: 1.8em; }
    .header_gnb_btn { display: block }
    .header_gnb { position: fixed; left: 0; top: 0; width: 100%; height: var(--full-h); background-color: #000; padding: 25% 0; transform: translateX(100%); transition: transform 0.6s; }
    .header_gnb.open { transform: translateX(0); }
    .header_gnb_list { flex-direction: column; font-size: 4.5rem; gap: 5%; height: 100%; align-items: center; justify-content: center; }
    .header_gnb_link { font-weight: 900; color: #000; padding: 0.25em 0.375em; -webkit-text-stroke: 1px #fff; }
    .header_gnb_link::after { width: 0.2em; height: 0.2em; }
    .header_gnb_link:hover, .header_gnb_link.is-active { -webkit-text-stroke: 1px transparent; }
    .header_gnb_link:hover, .header_gnb_link.is-active { color: var(--theme-light); }

    /* footer */
    .footer { padding: 4rem 0; font-size: 1.125em; }
    .footer_inner { display: block; position: relative; padding-bottom: 3.25em; }
    .footer_box { margin-bottom: 2em; }
    .footer_logo { height: 2em; }
    .footer_info { gap: 1.25em 3em; }
    .footer_fnb { display: none; }
    .footer_copyright { font-size: 1em; position: absolute; bottom: 0; left: 0; }

    /* index */
    .hero_headline { font-size: 5.5em; }
    .hero_sub { font-size: 1.5em; }
    .mission_keyword { font-size: 4.25em; }
    .process_headline { font-size: 2.8em; margin-bottom: 0.5em; }
    .process_content { font-size: 3.5em; }
    .process_content b { margin-top: 0; }
    .stats_map { width: 75%; top: 45%; }
    .stats_list { gap: 4%; font-size: 0.9em; }
    .project_box-intro { grid-template-columns: repeat(3, 1fr) }
    .project_images-2 { display: none; }
    .projects_item { padding: 2em; width: 75%; height: calc(var(--vh) * 85); }
    .partner { gap: 2rem; }
    .media { padding-top: 8rem; }

    /* about */
    .about_why_box { flex-direction: column; align-items: center; gap: 1.5em; text-align: center; padding: 3% 3% 5%; }
    .about_why_txt { width: 100%; align-items: center; font-size: 1.125em; }
    .about_why_txt p br { display: block; }
    .about_why_img { width: 75%; margin: auto; }
    .about_ceo_inner { display: flex; flex-direction: column; }
    .about_ceo_img { width: 80%; padding-top: 50%; text-align: center; display: flex; align-items: flex-start; justify-content: center; position: relative; }
    .about_ceo_img::before,
    .about_ceo_img::after { content:""; width: 50%; position: absolute; top: 0; height: 100%; }
    .about_ceo_img::before { left: 0; background: linear-gradient(to bottom, #D2CECD, #DBD7D4 12%, #DFDFDF 41%, #E2E2E0 71%, #E4E4E2); z-index: 1; }
    .about_ceo_img::after { right: 0; background: linear-gradient(to bottom, #CCCBC7, #D5D5D5 7%, #E2E2E2 41%, #E7E7E5 85%); }
    .about_ceo_img img { width: 70%; height: auto; object-fit: fill; position: absolute; left: 50%; top: -3rem; transform: translateX(-50%); z-index: 5; }
    .about_ceo_txt { text-align: center; }
    .about_ceo_desc { font-size: 1.5em; }
    .about_ceo_sign { font-size: 1.375em; }

    /* project */
    .bo_list { font-size: 1.125em; }
    .gallery_list { grid-template-columns: repeat(2,1fr); }

    /* recruit */
    .recruit_headline-talent { width: 100%; position: absolute; left: 0; top: calc(var(--header-h)*2); padding: 0;  text-align: center; }
    .recruit_headline-talent h2 { margin-top: 0.25em; }
    .recruit_talent_list { top: calc(((var(--full-h) - var(--boxH)) / 2) + (var(--header-h)*1.5)); }
    .recruit_talent_last_box { margin-top: calc(var(--header-h) * -0.5); }
    .recruit_welfare_txt { font-size: 1.125em; }

    /* contact */
    .page-contact { overflow: hidden; }
    .contact_headline_title { font-size: 2.875em; }
    .contact_headline_desc { font-size: 1.375em; }
    .contact_inner { display: block; }
    .contact_left, .contact_right { padding: 4rem 0; }
    .contact_left { height: auto; position: relative; padding-top: 8rem; }
    .contact_left::before { height: 100%; width: 100vw; right: -5%; }
    .contact_info { display: block; position: absolute; right: 0; top: 8rem; }
    .contact_info p { font-size: 1.25em; color: #444; margin-bottom: 0.75rem; }
    .contact_steps { flex-direction: row; gap: 0; justify-content: space-between; }
    .contact_step { flex-direction: column; }
    .contact_step_num { font-size: 1.25em; }
    .contact_progress_line,
    .contact_progress_line span { height: 3px; }
    .contact_progress_line { width: 90%; left: 50%; top: 0.9375rem; transform: translateX(-50%); }
    .contact_progress_line span { width: 0; }
    .contact_form { gap: 3.5rem; }
    .contact_form_group { font-size: 1.25em; }
    .contact_form_field { font-size: 1.125em;  }
    .privacy_modal { font-size: 1.125em; }
}
@media screen and (max-width: 767px){
    html { font-size: 1.5vw; }
    .br4 { display: block; }
    .br4-n { display: none; }

    /* footer */
    .footer_info,
    .footer_copyright { font-size: 1.125em; }

    /* index */
    .process_content { font-size: 3em; }
    .stats_content { height: 86%; }
    .stats_headline { font-size: 4em; }
    .stats_map { right: auto; left: 10%; width: 90%; top: 40%; }
    .stats_list { display: grid; grid-template-columns: repeat(2,min-content); gap: 4em 4em; justify-content: flex-end; }
    .stats_item:last-child { grid-column: 1/-1; margin-left: 0; text-align: left; }
    .project { height: auto; }
    .project_inner { flex-direction: column; width: 100%; padding-top: var(--header-h); gap: 5em; }
    .project_box-headline { width: 100%; text-align: center; }
    .project_headline { font-size: 6em; }
    .project_box-intro { display: flex; flex-direction: column; }
    .project_images { width: auto; white-space: nowrap; flex-direction: row; top: 0 !important;}
    .project_images-2 { display: flex; }
    .project_images-1 { left: -30%; }
    .project_images-2 { left: -70%; }
    .project_images-3 { left: -30%; }
    .project_images-4 { left: -60%; }
    .project_image { width: 42vw; padding-top: 0; aspect-ratio: 16/9; flex-shrink: 0; }
    .project_link { position: static; }
    .project_tag { font-size: 1.25em; }
    .projects, .projects_list { height: auto; }
    .projects_list { flex-direction: column; }
    .projects_item { width: 100%; height: calc(var(--full-w) * 0.58); }
    .projects_link { background-color: rgba(0,0,0,0.3); }
    .projects_subject { font-size: 3em; }

    /* about */
    .about_why_txt p { padding: 0 2em; }
    .about_why_txt p br { display: none; }

    /* project */
    .bo_list { font-size: 1.25em; }
    .gallery_list { grid-template-columns: repeat(1, 1fr)}
}
@media screen and (max-width: 575px){
    html { font-size: 2.125vw; }
    .br5 { display: block; }
    .br5-n { display: none; }

    /* header */
    .header .container { padding: 0 5%; }

    /* index */
    .home { font-size: 2.27vw; }
    .hero_headline { font-size: 3.75em; }
    .hero_sub { font-size: 1.4em; }
    .mission_keyword { font-size: 3.5em; }
    .process_headline { font-size: 2.5em; }
    .process_content { font-size: 2.125em; }
    .brand_headline { font-size: 4.5em; }
    .brand_sub { font-size: 1.375em; }
    .stats { padding: 6% 0; }
    .stats, .stats .container, .stats_content { height: auto; }
    .stats_headline { margin-bottom: 55%; }
    .stats_map { top: 30%; left: 15%; width: 115%; }
    .stats_list { justify-content: space-between; grid-template-columns: repeat(2,1fr) }
    .project_headline { font-size: 4.5em; }
    .project_image { width: 60vw; }
    .inquiry_sub { font-size: 3.25em; }

    /* about */
    .about_why_box { padding: 5% 4% 6%; }
    .about_why_txt b { font-size: 5em; }

    /* recruit */
    .recruit_visual_desc { font-size: 2em; }
    .recruit_talent_list { zoom: 0.85; }
    .recruit_talent_last_txt { font-size: 1.125em; line-height: 1.4; }
    .recruit_headline h2 { font-size: 3.25em; }
    .recruit_welfare_item { width: 45%; }

    /* contact */
    .contact_info { position: static; margin-top: 3em; }
}