@charset "utf-8";

@font-face{
    font-family: NanumSquareR;
    src: url(../fonts/NanumSquare/NanumSquareR.ttf) format("truetype");
    font-weight: 400;
}
 
* {letter-spacing: 0.01em; word-break: keep-all;}

html {width: 100%; height: 100%;}
body {font-family: NanumSquareR, sans-serif; font-weight: 400; font-size: 20px; color: #111; line-height: 1.5; margin: 0 auto; padding: 0; box-sizing: border-box; width: 100%; max-width: 1920px; height: 100%; background: #fff; overflow-x: hidden; word-break: keep-all;}

.cn, .jp {font-family: sans-serif; word-break: normal !important;}

a {color: #111; box-sizing: border-box; border-bottom: 2px solid transparent;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration:none;}
a:hover {color: #111; text-decoration: none;}
p, ul, li {margin: 0; padding: 0;}
h1, p {word-break:keep-all}
li {list-style: none;}
/* h1 span {font-size: 2rem;} */

.bold_500 {font-weight: 500;}
.bold_700 {font-weight: 700;}
.bold_900 {font-weight: 900;}

.container_800 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 800px;}
.container_1000 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 1000px;}
.container_1100 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 1100px;}
.container_1200 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 1200px;}
.container_1400 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 1400px;}
.container_1500 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 1500px;}
.container_1600 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 1600px;}
.container_1800 {margin: 0 auto; padding: 0 1%; width: 100%; max-width: 1800px;}
.img100 {width: 100%; height: auto;}
.row {margin-left: 0 !important; margin-right: 0 !important;}
.row_r {flex-direction: row-reverse !important;}
.hidden {height:100%; min-height:100%; overflow:hidden !important; touch-action:none;}
.po_rel {position: relative; top: 0;}
.po_abs {position: absolute;}
.web_show {display: block;}
.mob_show {display: none;}
.opcity_0 {opacity: 0;}

.navbar {position: fixed; top: 0; left: 0; right: 0; z-index: 100; color: #111; margin: 0 auto; padding: 1% 8%; width: 100%; max-width: 1920px; background: none; transition: all 0.3s;}
.scroll {padding: 0 8%; background: rgba(0, 0, 0, 0.9) !important; box-shadow: -0.0625rem 0 0.625rem 0 rgba(0,0,0,0.07),0.3125rem 1.25rem 2.5rem 0 rgba(0,0,0,0.04) !important;}
/* .navbar-nav {padding-right: 4rem;} */
.top_logo {width: 100%; max-width: 234px;}
.nav-item {font-weight: 500; color: #fff; padding: 1.5rem 0 !important; margin: 0 3.5rem !important; border-bottom: 2px solid transparent; cursor: pointer; text-transform: uppercase; display: block;}
.nav-item:hover, .nav-item.active {font-weight: 900; color: #fd8c15;}

.dropdown {margin-left: 3.5rem;}
.dropdown > a  {color: #fff; padding: 0.3rem 2rem; border-radius: 2rem; border: 1px solid #fff; cursor: pointer;}
.dropdown.mob_show > a  {padding: 0.3rem; border-radius: 2rem; background: none; border: none; cursor: pointer;}
.dropdown-menu a {color: #111;}
.ct_select {color: #fff; padding: 0.3rem 2rem; border-radius: 2rem; border: none; background-color: #fd8c15; cursor: pointer;}
.navbar i {color: #fff;}
.mob_nav_blur {position: fixed; top: 0; left: 0; right: 0; z-index: 99; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.9);display: none;}

.sub_title_img {margin: 0 auto; width: 100%; max-width: 1920px; height: 400px; background-size: contain;}

.sections {margin: 0 auto; width: 100%; max-width: 1920px; padding: 7% 0;}
.sub_sections {margin: 0 auto; width: 100%; max-width: 1920px; margin: 7% 0;}

.sec_title {font-weight: 900; font-size: 3rem; line-height: 1;}

.main {max-height: 860px; height: 100%; background: url(../imgs/main_bg.jpg) top center no-repeat; background-size: cover;}
.main_texts_box {position: relative; top: 50%; transform: translateY(-50%); color: #fff; text-align: center !important;}
.main_title {font-weight: 700; font-size: 4rem; line-height: 1.3;}
/* .main_title span {color: #e70a19;} */
.main_texts {width: 60%; font-size: 1.2rem; margin: 0 auto;}


/* .section01 {background: url(../imgs/sec01_bg.jpg) center top no-repeat; background-size: cover;} */
.section01 .col {padding: 0;}
.sec01_title {padding-bottom: 1% !important; margin-bottom: 3.5%; border-bottom: 2px solid #fd8c15;}
.sec01_img {max-width: 631px;}
.sec01_texts_box {padding-left: 3% !important;}
.sec01_texts_box p {margin-bottom: 3%;}
.sec01_texts_box p:nth-child(1) {font-weight: 600; font-size: 1.7rem;}



.section02 .row {align-items: stretch; height: 100%;}
.sub_title {color: #fdc17b; margin-bottom: 1%;}
.sec02_line_web {position: absolute; width: 70%; height: 100%; top: 50%; right: 0; transform: translateY(-50%); background: #fd8c15; display: block;}
.sec02_line_mob {position: absolute; width: 100%; height: 87%; bottom: 0; left: 0; background: #fd8c15; display: none;}
.sec02_texts_box {padding: 3% 0;}
.section02 img {position: relative; top: 50%; transform: translateY(-50%);}
.logo_imgs {justify-content: space-between;}
/* .logo_imgs .col {padding: 0 5%;} */



.section03 .row {justify-content: space-between; margin-top: 5%;}
.section03 .col {padding-right: 5%;}
.section03 p {font-size: 0.9rem; margin-bottom: 3%;}
.sec03_icon {max-width: 141px;}
.sec03_title {font-weight: 900; font-size: 2.5rem !important; color: #fd8c15; margin: 3rem 0 1rem !important;}



.section04 {padding-top: 5%; background: url(../imgs/sec04_bg.jpg) center top no-repeat; background-size: cover;}
.sec04_texts_box {text-align: left;}
.sec04_texts_box .sec04_title {font-weight: 600; color:#fff !important; font-size: 3rem; margin: 7% 0 13% !important; width: 100% !important;}
.sec04_texts_box p {color: rgba(255, 255, 255, 0.8); margin-bottom: 3%; width: 90%;}
.sec04_btns {margin-top: 10%;}
.sec04_btn_img {width: 100%; max-width: 285px; filter: drop-shadow(0 0 0.5em rgba(0, 0, 0, 0.2));}
.version {font-size: 0.9rem; color: rgba(255, 255, 255, 0.7); text-align: left; margin-top: 3%;}
/* .section04 .phone_img_wrap {text-align: right;} */
.section04 .phone_img {width: 100%; max-width: 1713px;}


.footer_wrap {color: #fff;}
.footer_wrap > div {padding: 2% 0;}
.footer_logo_wrap {margin-bottom: 5%;}
.footer_logo {max-width: 180px; opacity: 0.5;}
.footer_menu_wrap li {color: #fff; text-align: center; padding: 1%; cursor: pointer;}
.footer_menu_wrap li:last-child {border-right: none !important;}
.copyright {font-size: 0.8rem; margin-top: 10%; margin-left: 8%;}


.img_modal_bg {position: fixed; top: 0; left: 0; right: 0; z-index: 1000; margin: 0 auto; width: 100%; max-width: 1920px; height: 100%; background: rgba(0, 0, 0, 0.9); display: none;}

.img_modal {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; max-width: 900px; box-sizing: border-box; background: #fff; box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);}
.modal_close {position: absolute; top: 0; right: 0; font-size: 2rem; color: #fff; padding: 1% 3%; background: rgba(0, 0, 0, 0.5); cursor: pointer;}
.img_modal img {width: 100%;}

.video_modal_bg {position: fixed; top: 0; left: 0; right: 0; z-index: 1000; margin: 0 auto; width: 100%; max-width: 1920px; height: 100%; background: rgba(0, 0, 0, 0.9); display: none;}
.video_modal_wrap {width: 100%; max-width: 900px; margin: 13.75% auto; box-sizing: border-box; box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);}  
.video_modal {position: relative; width: 100%; height: auto; padding-bottom: 56.25% }

iframe {z-index: 1; top: 0; left: 0; position: absolute; width: 100%; height: 100%;}



/* @media all and (max-width: 1340px) {
    .nav-item {margin: 0 1rem !important;}
} */

@media all and (max-width: 1200px) {
    .navbar-nav {padding-right: 0;}
    .nav-item, .dropdown {margin: 0 2rem !important;}

    .card_texts {padding: 30% 5% 5% 5%;}

    
}

@media all and (max-width: 1000px) {
    .main_texts_box, .section02 {padding-left: 3% !important; padding-right: 3% !important;}
}

@media all and (min-width: 992px) {
    .mob_nav_blur {display: none !important;}
}

@media all and (max-width: 992px) {
    body {font-size: 16px;}
    .web_show {display: none;}
    .mob_show {display: block;}

    .nav-item, .dropdown {margin: 0 !important;}

    .section01 .col {padding: 0 15px;}
    .sec01_title {padding: 0 !important; margin-left: 15px;  margin-right: 15px;}
    .sec01_texts_box p:nth-child(1) {font-size: 1.5rem; margin-top: 4%;}

    .sec02_line_web {display: none;}
    .sec02_line_mob {display: block;}
    .logo_imgs .col {padding: 10% 30%;}
    .section02 p:nth-child(2) {width: 70%;}

    .section03 .col {margin: 10% 0; padding-right: 20%;}

    /* .footer_logo_wrap {text-align: center; padding: 3% 0;} */
    .footer_wrap {text-align: center !important;}
    .copyright {margin-top: 5%; margin-left: 0;}
}

@media all and (max-width: 974px) {
    

    .navbar {padding-top: 0.5%; padding-bottom: 0.5%;}
    .navbar-nav {justify-content: center !important;}
    .nav-item, .dropdown {width: fit-content !important;}
    .dropdown {margin: 2% 0;}
    .navbar-collapse {margin-bottom: 3%;}

    .no_padding_img {padding-left: 15px !important;}

    .phone_img_wrap {text-align: center !important; margin-top: 10%;}
    .version {text-align: center; margin-top: 0; margin-bottom: 10%;}

}

@media all and (max-width: 768px) {
    .top_logo {max-width: 144px;}

    .main_title {font-size: 3rem;}
    .sec_title {font-size: 2rem;}
    .sec04_texts_box .sec04_title {font-size: 2.1rem;}

    .footer_logo_wrap {text-align: center; padding: 3% 0;}
    .footer_logo {margin: 3% 0;}
    .footer_menu_wrap {display: block;}
    .footer_wrap ul {padding: 3% 0;}
    .footer_wrap ul li {border-right: none; margin: 2% 0;}
}

@media all and (max-width: 576px) {
    body {font-size: 14px;}
    /* p {line-height: 1.3 !important;} */
    .nav-item a {padding: .5rem 0 !important;}
    .sections {padding: 15% 0;}

    /* .main {height: 60vh;} */

    .section02 p:nth-child(2) {width: 90%;}
    
    .video_modal_wrap {margin-top: 50%;}
    
    .owl-theme .owl-nav {width: 100%;}
    .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next, .owl-carousel button.owl-dot {width: 40% !important;}
}