@charset "utf-8";

/* 초기화 */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900&family=Play:wght@400;700&display=swap');

@font-face {
    font-family: 'Pretendard';
    src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Light.woff') format('woff');
    font-weight: 100;
    font-style: normal;
 }
 @font-face {
    font-family: 'Pretendard';
    src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
 }
 @font-face {
    font-family: 'Pretendard';
    src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-SemiBold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
 }
 
 @font-face {
    font-family: 'Pretendard';
    src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
    font-weight: 900;
    font-style: normal;
 }
 
html {overflow-y:scroll}
body {margin:0;padding:0;font-size:0.75em;font-family: 'Pretendard';background:#fff}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;font-family:'Malgun Gothic', dotum, sans-serif}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}

ul, dl,dt,dd {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;font-size:1em}
input, button {margin:0;padding:0;font-family: 'Pretendard';font-size:1em}
input[type="submit"] {cursor:pointer}
button {cursor:pointer}

textarea, select {font-family: 'Pretendard';font-size:1em}
select {margin:0}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a {color:#000;text-decoration:none}

*, :after, :before {
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}

input[type=text],input[type=password], textarea {
-webkit-transition:all 0.30s ease-in-out;
-moz-transition:all 0.30s ease-in-out;
-ms-transition:all 0.30s ease-in-out;
-o-transition:all 0.30s ease-in-out;
outline:none;
}

input[type=text]:focus,input[type=password]:focus, textarea:focus,select:focus {
-webkit-box-shadow:0 0 5px #9ed4ff;
-moz-box-shadow:0 0 5px #9ed4ff;
box-shadow:0 0 5px #9ed4ff;
border:1px solid #558ab7 !important;
}

.placeholdersjs {color:#aaa !important}

/* 레이아웃 크기 지정 */
/* #hd, #wrapper, #ft {min-width:1200px} */
/* 
#hd_pop,
#hd_wrapper,
#tnb .inner,

#gnb .gnb_wrap,
#container_wr,
#ft_wr {max-width:1200px} */
#container {overflow: hidden;}

/* 팝업레이어 */
#hd_pop {z-index:1000;position:relative;margin:0 auto;height:0}
#hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff}
.hd_pops img {max-width:100%}
.hd_pops_con {}
.hd_pops_footer {padding:0;background:#000;color:#fff;text-align:left;position:relative}
.hd_pops_footer:after {display:block;visibility:hidden;clear:both;content:""}
.hd_pops_footer button {padding:10px;border:0;color:#fff}
.hd_pops_footer .hd_pops_reject {background:#000;text-align:left}
.hd_pops_footer .hd_pops_close {background:#393939;position:absolute;top:0;right:0}

/* 상단 레이아웃 */
#hd_h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}

/* 본문 바로가기 */
#skip_to_container a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skip_to_container a:focus, #skip_to_container a:active {width:100%;height:75px;background:#21272e;color:#fff;font-size:2em;font-weight:bold;text-align:center;text-decoration:none;line-height:3.3em}


/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;font-size:0;line-height:0;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;width:0;height:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}

span, p, a, h1,h2,h3,h4 {word-break: keep-all;}

/* reset 끝 */

header {
    position: absolute;
    top:50px;
    left:77px;
    width:auto;
    z-index: 1;
}
header #logo {}
header #logo img {max-width: 100%;}

/* 애니메이션 */
/* 애니메이션 */
/* 애니메이션 */
.txt_ani {overflow: hidden;}
.animate.to-opacity,
.animate .child-animate.to-opacity {
    opacity: 0;
    transition:  opacity 1.5s;
}

.animate.to-opacity.active,
.animate .child-animate.to-opacity.active {
    opacity: 1;
}
.animate.to-bottom-opacity,
.animate .child-animate.to-bottom-opacity {
    transform: translateY(100px);
    opacity: 0;
    transition: transform 1.5s, opacity 1.5s;
}

.animate.to-bottom-opacity.active,
.animate .child-animate.to-bottom-opacity.active {
    transform: translateY(0px);
    opacity: 1;
}
.animate.to-bottom,
.animate .child-animate.to-bottom {
    transform: translateY(60px);
    opacity: 0;
    filter: blur(5px);
    transition: opacity 1.5s, filter 1.5s, transform 1.5s;
}

.animate.to-bottom.active,
.animate .child-animate.to-bottom.active {
    transform: translateY(0px);
    opacity: 1;
    filter: blur(0);
    transition: opacity 1.5s, filter 1.5s, transform 1.5s;
}

.animate.to-left,
.animate .child-animate.to-left {
    transform: translateX(-50px);
    opacity: 0;
    transition: opacity 1.5s, transform 1.5s
}

.animate.to-left.active,
.animate .child-animate.to-left.active {
    transform: translateX(0px);
    opacity: 1;
    filter: blur(0px)
}

.animate.to-right,
.animate .child-animate.to-right {
    transform: translateX(50px);
    opacity: 0;
    filter: blur(5px);
    transition: opacity 1.5s, filter 1.5s, transform 1.5s
}

.animate.to-right.active,
.animate .child-animate.to-right.active {
    transform: translateX(0px);
    opacity: 1;
    filter: blur(0px)
}
.animate .child-animate.to-bottom-transform-center {
    transform: translate(-50%,0) !important;
    opacity: 0;
    filter: blur(5px);
    transition: opacity 1.5s, filter 1.5s, transform 1.5s;
}
.animate .child-animate.to-bottom-transform-center.active {
    transform: translate(-50%,-50%) !important;
    opacity: 1;
    filter: blur(0);
    transition: opacity 1.5s, filter 1.5s, transform 1.5s;
}
/* 애니메이션 */
/* 애니메이션 */
/* 애니메이션 */

section {}
section p.section_p {
    font-size: clamp(16px, 1vw, 19px);
    color:#000;
    text-align: center;
    line-height: 1.8425;
    padding-top: 42px;
    padding-left: 20px;
    padding-right: 20px;    
}
.main_visual_section {}
.main_visual_section .section_inner {
    position: relative;
    padding-bottom:51.3541%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.main_visual_section .section_inner .bg {
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-image: url(../img/one_main_visual_thumb.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
}
.main_visual_section .section_inner h2 {
    font-size: clamp(34px, 3vw, 70px);
    color:#fff;
    font-weight: bold;
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    text-align: center;
    font-family: 'Play', sans-serif;
    width:100%;
}

.korea_section {}
.korea_section .section_inner {}
.korea_section .section_inner .section_texts {
    padding-top: 139px;
    padding-bottom: 144px;
    padding-left: 20px;
    padding-right: 20px;
}
.korea_section .section_inner .section_texts h2 {
    font-family: 'Play', sans-serif;
    font-size:clamp(29px, 3vw, 70px);
    color:#000;
    text-align: center;
    font-weight: 100;
    line-height: 0.9858;
}
.korea_section .section_inner .section_texts p {
    
}
.korea_section .section_inner .section_img_wrap {
    display: flex;
    justify-content: center;
    align-items: center;
}
.korea_section .section_inner .section_img_wrap .img_box {
    position: relative;
    padding-bottom: 34.375%;
    width: 100%;
}
.korea_section .section_inner .section_img_wrap .img_box img {
    max-width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}

.logo_section {}
.logo_section .section_inner {
    padding-top: 134px;
    padding-bottom: 112px;
    background-color: #f4f4f4;
}
.logo_section .section_inner .section_img_wrap {
    display: flex;
    gap: 133px;
    justify-content: center;
    align-items: center;
} 
.logo_section .section_inner .section_img_wrap .img_box {}
.logo_section .section_inner .section_img_wrap img {max-width: 100%;}


.business_section {}
.business_section .section_inner {
    background-color: #f4f4f4;
}
.business_section .section_inner .section_title {}
.business_section .section_inner .section_title .top {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom:45px;
}
.business_section .section_inner .section_title .top img {max-width: 100%;}
.business_section .section_inner .section_title h3 {
    font-size: clamp(24px, 3vw, 50px);
    font-family: 'Play', sans-serif;
    text-align: center;
}
.business_section .section_inner .section_img_wrap {
    margin-top: 55px;
}
.business_section .section_inner .section_img_wrap ul {
    display: flex;
    width:100%;
}
.business_section .section_inner .section_img_wrap ul li {
    width: calc((100%) / 4);
    display: flex;
    justify-content: center;
    align-items: flex-end;
    position: relative;
    height: 100%;
    padding-bottom: 34%;
}
.business_section .section_inner .section_img_wrap ul li .bg {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
}
.business_section .section_inner .section_img_wrap ul li span {
    font-size: clamp(18px, 2vw, 39px);
    color: #fff;
    font-weight: bold;
    position: absolute;
    z-index: 2;
    bottom: 50px;
    left: 50px;
}
.business_section .section_inner .section_img_wrap ul li:nth-child(1) .bg {
    background-image: url(../img/business_thumb1.jpg);
}
.business_section .section_inner .section_img_wrap ul li:nth-child(2) .bg {
    background-image: url(../img/business_thumb2.jpg);
}
.business_section .section_inner .section_img_wrap ul li:nth-child(3) .bg {
    background-image: url(../img/business_thumb3.jpg);
}
.business_section .section_inner .section_img_wrap ul li:nth-child(4) .bg {
    background-image: url(../img/business_thumb4.jpg);
}
.business_section .section_inner .section_img_wrap ul li .bg .bg_bk {
    position: relative;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 1;
    transition:opacity 0.25s;
}

.business_section .section_inner .section_img_wrap ul li .bg:hover .bg_bk {
   opacity: 0;
    transition:opacity 0.25s;
}


.moto_section {margin-top: 213px;}
.moto_section .section_inner {
    display: flex;
}
.moto_section .section_inner  > div {
    flex:1;
    padding: 0 60px;
}
.moto_section .section_inner .img_box {
    position: relative;
    padding-bottom: 40.1562%;
}
.moto_section .section_inner .img_box img {
    max-width: 100%;
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height: 100%;
}
.moto_section .section_inner .txt {}
.moto_section .section_inner .txt h3 {
    font-size:clamp(24px, 3vw, 50px);
    font-family: 'Play', sans-serif;
    text-align: center;
    padding-top: 100px;
}
.moto_section .section_inner .txt p {
    font-size:clamp(16px, 1vw, 20px);
    line-height: 1.8;
    padding-top: 80px;
    text-align: center;
}
.moto_section .section_inner .icon_wrap {
    max-width: 790px;
    margin:0 auto;
}
.moto_section .section_inner .moto_icon {
    margin-top: 40px;
}
.moto_section .section_inner .moto_icon  img {max-width: 100%;}
.moto_section .section_inner .wrap_icon_box {
    margin-top: 63px;
    display: flex;flex-wrap: wrap;
    gap:30px;
    
}
.moto_section .section_inner .wrap_icon_box li {
    width: calc((100% - 50px) / 2);
    display: flex;
    align-items: center;
    gap: 15px;
}
.moto_section .section_inner .wrap_icon_box li .img img {max-width: 100%;}
.moto_section .section_inner .wrap_icon_box li .li_txt {
    display: flex;
    flex-direction: column;
    
}
.moto_section .section_inner .wrap_icon_box li .li_txt span {
    font-size: 13px;
    line-height: 1.4;
}


.camp_section {margin-top: 140px;}
.camp_section .section_inner {
    display: flex;
}
.camp_section .section_inner > div {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 75px;
    padding:0 60px;
}
.camp_section .section_inner .img_box {
    position: relative;
    padding-bottom: 34%;
}
.camp_section .section_inner .img_box img {
    max-width: 100%;
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height: 100%;
}

.camp_section .section_inner .txt p {
    font-size:clamp(16px, 1vw, 20px);
    line-height: 1.8;
    text-align: center;
}
.camp_section .section_inner .txt img {max-width: 100%;}

footer {
    background-color: #3d3d3d;
    padding:80px 0 70px 0;
}
footer .footer_inner {
    max-width: 1448px;
    margin:0 auto;
    display: flex;
    justify-content:flex-start;
    align-items: flex-start;
    gap:84px;
}
footer .footer_inner ul {
    display: flex;
    flex-wrap: wrap;
    gap:15px;
}
footer .footer_inner ul li {
    width: calc((100% - 15px) / 2);
    background-color: #4e4e4e;
    padding: 30px 0;
    border-radius: 20px;
    padding-left: 62px;
    color:#fff;
    
}

footer .footer_inner .label {
    color: #d6d6d6;
    font-size: clamp(12px, 1vw, 17px);
    text-align: center;
    display: inline-flex;
    max-width: 130px;
    width:100%;
}
footer .footer_inner .ctt {
    color:#fff !important;
    font-size: clamp(13px, 1vw, 19px);
}
footer .footer_inner .ctt strong {
    -webkit-text-fill-color: rgb(255, 255, 255); 
    -webkit-opacity: 1; 
    color: rgb(255, 255, 255); 
    font-size:clamp(16px, 1vw, 19px)}

@media screen and (max-width:1441px) {
    .moto_section .section_inner .txt p span {
        display: block;
        text-align: center;
        padding-bottom: 15px;
    }
    .moto_section .section_inner .txt p br {display: none;}

    .camp_section .section_inner .txt .img {
        max-width: 200px;
    }
    .camp_section .section_inner .txt .img img {max-width: 100%;}
    .camp_section .section_inner .txt p span {
        display: block;
        text-align: center;
        padding-bottom: 15px;
    }
    .camp_section .section_inner .txt p br {display: none;}


    .moto_section .section_inner .txt h3 {    padding-top: 25px;}
    .moto_section .section_inner .txt p {padding-top: 20px;}
    .camp_section .section_inner > div {gap:40px}
    footer {
        padding-left: 40px;
        padding-right: 40px;
    }
    header {left:40px;}
    header #logo {max-width: 100px;}

    .moto_section .section_inner .wrap_icon_box {
        gap: 15px;
    }
    .moto_section .section_inner .wrap_icon_box li {
        width: calc((100% - 15px) / 2);
    }

    footer .footer_inner .label {
        max-width: 100px;
        width: 100%;
    }
    footer .footer_inner ul li {
        display: flex;
        align-items: center;
    }
}
@media screen and (max-width:1025px) {
    footer .footer_inner .label {max-width: 55px;}

    section p.section_p br {display: none;}
    .korea_section .section_inner .section_texts h2 {
        line-height: 1.2;
    }
    .korea_section .section_inner .section_texts {
        padding-top: 100px;
        padding-bottom: 105px;
    }
    .korea_section .section_inner .section_texts p br {display: none;}

    .logo_section .section_inner .section_img_wrap {gap:50px}
    .logo_section .section_inner .section_img_wrap .img_box:first-of-type {max-width: 190px;} 
    .logo_section .section_inner .section_img_wrap .img_box:last-of-type {max-width: 250px;}
    
    .business_section .section_inner .section_img_wrap ul li span {
        bottom:30px;
        left: 30px;
    }

    .moto_section {margin-top: 30px;}
    .moto_section .section_inner {flex-direction: column;}
    .moto_section .section_inner .img_box {
        padding-bottom: 75.1809%;
    }
    .moto_section .section_inner .txt h3 {padding-top: 60px;}

    .camp_section {margin-top: 100px;}

    .camp_section .section_inner > div {padding-top: 60px;padding-bottom: 30px;}
    .camp_section .section_inner .txt .img {max-width: 200px}

    footer .footer_inner > a {
        max-width: 100px;
        margin-top: 10px;
    }
    footer .footer_inner > a img {max-width: 100%;}
    footer .footer_inner ul li {padding-left: 28px;}
    
}
@media screen and (max-width:921px) {
    header {top:25px;}

    .logo_section .section_inner .section_img_wrap .img_box:first-of-type {max-width: 150px;}
    .logo_section .section_inner .section_img_wrap .img_box:last-of-type {max-width: 180px;}

    .business_section .section_inner .section_img_wrap ul {flex-wrap: wrap;}
    .business_section .section_inner .section_img_wrap ul li {width: calc((100%) / 2); padding-bottom: 70%;}
    
    .moto_section {margin-top: 75px;} 

    footer .footer_inner {gap:30px}

   
}
@media screen and (max-width:900px) {
    .main_visual_section .section_inner h2 {
        font-size: clamp(25px, 3vw, 34px);
    }

    .camp_section .section_inner {flex-direction: column-reverse;}
    .camp_section .section_inner .img_box {padding-bottom: 70%;}
    .camp_section .section_inner > div {
        padding: 70px 60px 109px 60px;
    }

    .moto_section .section_inner > div {padding:0;}
    .moto_section .section_inner .txt h3 {padding:30px 20px 30px 20px;}
    .moto_section .section_inner .txt p {padding: 0 20px;}
    .moto_section .section_inner .wrap_icon_box {padding: 0 20px;}

    .camp_section .section_inner > div {
        padding: 50px 30px 70px 30px;
    }
    .moto_section .section_inner .moto_icon {padding-left:20px;padding-right: 20px;}

    footer .footer_inner ul {flex-direction: column; width:100%;}
    footer .footer_inner ul li {
        width:100% !important;
        align-items: center;
    }
}

@media screen and (max-width:640px) {
    header {
        left: 20px;
    }
    header #logo {max-width: 70px;}
    .korea_section .section_inner .section_texts {
        padding-top: 60px;
        padding-bottom: 90px;
    }
    footer {padding-left: 20px;padding-right: 20px;}
    footer .footer_inner ul li {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        padding: 20px;
    }
    footer .footer_inner ul li:nth-child(1),
    footer .footer_inner ul li:nth-child(2) {
        flex-wrap: nowrap;
        gap: 0;
        flex-direction: row;
        align-items: center;
    }
    footer .footer_inner ul li {padding:15px !important; border-radius: 8px;}
    footer .footer_inner {gap:20px;}

    .camp_section .section_inner > div {padding-left: 20px;padding-right: 20px;}
    .korea_section .section_inner .section_texts p {padding-left: 0;padding-right: 0;}

    .logo_section .section_inner {padding-top: 60px;padding-bottom: 100px;}

    .logo_section .section_inner .section_img_wrap .img_box:first-of-type {max-width: 120px;}
    .logo_section .section_inner .section_img_wrap .img_box:last-of-type {max-width: 130px;}
}

@media screen and (max-width:600px) {
    .main_visual_section .section_inner {padding-bottom: 90%;}

    .moto_section .section_inner .wrap_icon_box {
        padding: 0 30px;
        flex-direction: column;
    }
    .moto_section .section_inner .wrap_icon_box li {width:100%;}
    .moto_section .section_inner .wrap_icon_box li .img {min-width:75px;max-width: 75px;}
}
@media screen and (max-width:344px) {
    footer .footer_inner > a {
        max-width: 50px;
    }
}
