:root{
    --primary_color1 : '';
}

/* --------------------- common ---------------------------- */
@font-face {
    font-family: 'Pretendard';
    src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Thin.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-Extralight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}
@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: 300;
    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-Medium.woff') format('woff');
    font-weight: 500;
    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: 600;
    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: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

html,body {width:100%;}
html {overflow:auto; box-sizing:border-box;}
*, *:before, *:after{box-sizing:inherit;}
*{
    -webkit-text-size-adjust:none;
}
body {word-break:break-all; -ms-word-break:break-all;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,a,blockquote,input,select,textarea,button {margin:0; padding:0;
    font-family: 'Pretendard'; font-weight: 400; color:#2D3643; letter-spacing: -0.02em;}
fieldset,img {border:0px none; vertical-align:top;}
dl,ul,ol,menu,li {list-style:none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content:'';}
button {border:0 none; background-color:transparent; cursor:pointer;}
body { background:#fff;}
input, select, textarea, button{vertical-align:middle; }
a:link,a:active,a:visited{text-decoration:none;}

table {border-collapse:collapse; border-spacing:0;}
address,caption,cite,code,dfn,em,var {font-style:normal; font-weight:400;}
summary, caption, legend, hr {width:0; height:0; overflow: hidden; visibility: hidden; border: none; position:absolute; left:-1000em;}
caption {position:static;}
.clfix:after {content: "."; display: block; height:0; clear: both; visibility: hidden;}
.pc_img {display: block;}
.tab_img {display: none;}
.mob_img {display: none;}
.pc {display: block;}
.tab {display: none;}
.mob {display: none;}
img{image-rendering: crisp-edges;}
/*font-family: 'NEXON Lv2 Gothic';*/

/* --------------------- css ---------------------------- */

#wrap{ position: relative; width: 100%; max-width: 100%; min-width:1100px; overflow: hidden; font-family:'Pretendard';}
.inner{width: 85%; margin:0 auto;}
.inner75{width: 75%; margin:0 auto;}
.inner65{width: 65%; margin:0 auto;}

/*#visual_wrap{position:Relative; height: 100vh}
#visual_wrap .visual_img{position:absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0;}
#visual_wrap .visual_img01{opacity: 1;}
#visual_wrap.on .visual_img02{opacity: 1; transition: 0.5s; transition-delay: 0.7s;}
#visual_wrap.on .visual_img03{opacity: 1; transition: 0.5s; transition-delay: 1.4s;}
#visual_wrap.on .visual_img04{opacity: 1; transition: 0.5s; transition-delay: 2.1s;}
#visual_wrap.on .visual_img05{opacity: 1; transition: 0.5s; transition-delay: 2.8s;}

.visual_txt{position:absolute; margin: 0 auto; text-align: center; left: 0; right: 0; top: 30%; transform: translateY(-52%); width: max-content; z-index: 100;}
.visual_txt em{display: block; font-size: 48px; line-height: 60px; font-weight: 800; color:#fff;}
.visual_txt p{font-size:24px; line-height: 38px; color:#fff; margin-top: 20px; font-weight: 700;}
.visual_txt .visual_btn{display: flex; justify-content: center; margin-top: 40px; }
.visual_txt .visual_btn a{display: block; padding: 0 30px; line-height: 51px; font-size: 17px; margin-right: 20px; font-weight: 700; color:#192328; border-radius: 10px; background: rgba(255, 255, 255, 0.80);}
.visual_txt .visual_btn a:last-child{margin-right: 0;}*/

#header { display: flex; align-items: center; min-width:1100px; height:120px; position:fixed; left:0; right:0; top:0; z-index: 10000; background:#fff; transition:.6s;}
#header.sub_header { height:80px; background:transparent;}
#header.sub_header .inner { max-width: 100%;}
#header.nav-up { top:-120px;}
#header.nav-down { height:80px;}
#header.sub_header h1 a img,
#header.nav-down h1 a img { height:18px;}
#header .inner { display: flex; align-items: center; justify-content: space-between; padding:0 64px; max-width: 1920px; width:100%;}
#header h1 a { display: flex; align-items: center;}
#header .nav { display: flex; align-items: center; gap:0 24px;}
#header .nav ul { display: flex; align-items: center;}
#header .nav ul li { padding:16px 24px;}
#header .nav ul li a { font-size:16px; color:#1A212E;}
#header .nav ul li.on a{ font-size:16px; color:#24b770;}
#header .nav .btn_box {}
#header .nav .btn_box a { display:block; padding:8px 16px; border-radius: 8px; border: 1px solid var(--primary_color1); backgroud:#fff; line-height:1;}
#header .nav .btn_box a span { font-size:15px; color:var(--primary_color1); font-weight:700;}
#header .header_btn_wrap { display: flex; align-items: center; gap:0 12px;}
#header .nav .btn_box1 a { display:block; padding:8px 10px; border-radius: 8px; line-height:1;}
#header .nav .btn_box1 a span { font-size:15px; color:#4A5461; font-weight:500;}

#visual_wrap { padding:120px 64px 64px; height: 100vh;}
#visual_wrap .visual_swiper { overflow: hidden; border-radius: 24px;}
#visual_wrap .visual_swiper .swiper-slide { position:relative; height:calc(100vh - 184px);}
#visual_wrap .visual_swiper .swiper-slide > p { width:100%; height:100%;}
#visual_wrap .visual_swiper .swiper-slide .con_box { display: flex; align-items: center;  position:absolute; left:0; right:0; top:50%; transform: translateY(-50%);}
#visual_wrap .visual_swiper .swiper-slide .con_box .txt_box { padding-left:196px;}
#visual_wrap .visual_swiper .swiper-slide .con_box .txt_box p { margin-bottom:20px; font-size:44px; color:#fff; font-weight: 400; line-height:60px;}
#visual_wrap .visual_swiper .swiper-slide .con_box .txt_box p strong { font-weight: 700;}
#visual_wrap .visual_swiper .swiper-slide .con_box .txt_box p span { color:var(--primary_color1);}
#visual_wrap .visual_swiper .swiper-slide .con_box .txt_box em { font-size:24px; color:#C9D0D9;}
#visual_wrap .visual_swiper .swiper-slide .con_box .btn_box { display: flex; align-items: center; gap:0 16px; margin-top:40px;}
#visual_wrap .visual_swiper .swiper-slide .con_box .btn_box a { display: block; padding:0 32px; border-radius:10px; background:#fff; font-size:17px; color:#1A212E; font-weight: 800; text-align: center; line-height:51px; letter-spacing: -0.34px; transform: translateY(0); transition: .5s;}
#visual_wrap .visual_swiper .swiper-slide .con_box .btn_box a:hover { transform: translateY(-10px);}
#visual_wrap .visual_items { display: flex; align-items: center; gap:0 16px; position:absolute; left:50%; bottom:40px; z-index: 2; transform: translateX(-50%); width:max-content;}
#visual_wrap .visual-pagination { display: flex; align-items: center; gap:0 8px; position:static; width: max-content;}
#visual_wrap .visual-pagination .swiper-pagination-bullet { opacity: 0.24; width:12px; height:12px; background:#fff;}
#visual_wrap .visual-pagination .swiper-pagination-bullet-active { opacity: 1;}
#visual_wrap .visual_btn { display: block; position:static; width:24px; height:24px; cursor: pointer;}
#visual_wrap .visual_btn.prev { background: url("../intro_img/visual_btn_prev.svg") center no-repeat;}
#visual_wrap .visual_btn.next { background: url("../intro_img/visual_btn_next.svg") center no-repeat;}

@media (max-width: 1600px){
    #visual_wrap { padding:120px 16px 64px; height: 100vh;}
    #visual_wrap .visual_swiper .swiper-slide .con_box .txt_box { padding-left:16px; width:auto; box-sizing: content-box;}
    #visual_wrap .visual_swiper .swiper-slide .con_box .img_box { width:50%;}
    #visual_wrap .visual_swiper .swiper-slide .con_box .img_box img { width:100%;}
}

.main_txt strong{display: block; font-size:24px; font-weight: 700; line-height: 38px; color:var(--primary_color1)}
.main_txt em{display: block; font-size:35px; color:#2D3643; font-weight: 700; line-height: 55px; margin-top:10px;}
.main_txt p{font-size: 20px; line-height:33px; margin-top:30px; color:#788290;}
.section{padding: 50px 0}
#section01 .main_txt{text-align: center;}
#section01 .sec01_slider_wrap{margin-top: 100px;}
#section01 .sec01_slider_wrap .swiper-wrapper{height: auto;}
#section01 .sec01_slider{overflow: visible;}
#section01 .sec01_slider .txt_wrap{padding: 50px; border-radius: 20px; background: #FFF; box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.05); transition: 0.3s ease-in; }
#section01 .sec01_slider .txt_wrap em{display: inline-block; padding:0 10px; height: 35px; line-height: 33px; font-size: 16px; font-weight: 700; color:var(--primary_color1); border: 1px solid var(--primary_color1); border-radius: 5px;}
#section01 .sec01_slider .txt_wrap p{font-size:20px; line-height: 30px; color:#788290; margin-top: 30px; font-weight: 700;}
#section01 .sec01_slider .txt_wrap p span{color:#2D3643;}
#section01 .sec01_slider .swiper-slide-active .txt_wrap{box-shadow: 0px 30px 60px 0px rgba(0, 0, 0, 0.15);}

#section02{background-color: #F9FAFB;}
#section02 ul{display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 60px;}
#section02 ul li{position:relative; width: calc((100% - 84px)/3); height: 330px; margin-top: 40px; box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.05); border-radius: 20px;  overflow: hidden;}
#section02 ul li:hover{box-shadow: 0px 30px 60px 0px rgba(0, 0, 0, 0.15); z-index: 10;}
#section02 ul li:nth-child(-n + 3){margin-top: 0;}
#section02 ul .type01{background-color: #2D3643;}
#section02 ul .type01 a{display: flex; flex-direction:column; width: 100%; height: 100%; justify-content: center; align-items: center;}
#section02 ul .type01 em{position:relative; display: block; margin-top: 30px; line-height: 29px; padding-right: 35px; font-size: 24px; font-weight: 700; color:#fff;}
#section02 ul .type01 em img{position:absolute; right: 0; top: 0; bottom: 0; margin: auto 0; transition:0.3s ease-in;}
#section02 ul .type02{display: flex; flex-direction:column; justify-content: center; align-items: center; background-color: #fff;}
#section02 ul .type02 em{display: block; margin-top: 30px; line-height: 29px; font-size: 24px; font-weight: 700; color:#2D3643;}
#section02 ul .type01:hover a > img{position:relative; animation: car forwards; animation-duration: 1.5s;}
#section02 ul .type01:hover em img{right:-15px;}
#section02 ul .type02:hover img{animation: tada forwards; animation-duration: 1s;}

#section03 .sec03_txt{position:absolute; left: 54px; top: 50px;}
#section03 .sec03_txt em{display: block; font-size:25px; font-weight: 700; line-height: 48px; color:#fff;}
#section03 .sec03_txt em span{color:#96E7B1;}

#section03 .con01{position:relative; height:600px; border-radius: 20px; margin-top: 30px; overflow: hidden; background-color: var(--primary_color1);}
#section03 .con01 .img01{position:absolute; left:54px; bottom:0}
#section03 .con01 .img02{position:absolute; right:50px; bottom:0}
#section03 .con02{position:relative; height:600px; border-radius: 20px; margin-top: 51px; overflow: hidden; background-color: #EDF5F0;}
#section03 .con02 .sec03_txt em{color:#2D3643}
#section03 .con02 .sec03_txt em span{color:var(--primary_color1)}
#section03 .con02 .img01{position:Absolute; left:50px; bottom: 0;z-index: 10;}
#section03 .con02 .img02{position:Absolute; right:50px; bottom: 0;}
#section03 .con02 .img03{position:Absolute; right:68px; bottom: 19px; z-index: 10;}
#section03 .con03{display: flex; justify-content: space-between; margin-top:30px;}
#section03 .con03 .left{position:relative; width: calc((100% - 30px)/2); height:500px; border-radius: 20px; overflow: hidden; background: linear-gradient(180deg, #1B3E2F 0%, #20835E 50%, #39B88A 100%);}
#section03 .con03 .left .sec03_txt em span{color:#45DF8E}
#section03 .con03 .left img{position:absolute; left: 0; right: 0; margin: 0 auto; bottom: 52px;}
#section03 .con03 .right{position:relative; width: calc((100% - 30px)/2); height:500px; border-radius: 20px; overflow: hidden; background-color: #F4F7FA;}
#section03 .con03 .right .sec03_txt em{color:#2D3643}
#section03 .con03 .right .sec03_txt em span{color:#788290}
#section03 .con03 .right .img_wrap{position:Absolute; width: 208px; height: 192px; left: 150px; bottom:50px; z-index: 10;}
#section03 .con03 .right .img01{position:Absolute; left: 0; top:0; width: 100%; height:138px; border-radius:15px; background: url(../intro_img/intro_img13.png)center bottom no-repeat;}
#section03 .con03 .right .img02{position:Absolute; left: 0; bottom: 0; width: 100%; height:138px; border-radius:15px; background: url(../intro_img/intro_img14.png)center bottom no-repeat; box-shadow: 0px -5px 10px 0px rgba(0, 0, 0, 0.05);}
#section03 .con03 .right .img03{position:Absolute; right: 150px; bottom: 50px; width: 208px; height:192px; border-radius:15px; background: url(../intro_img/intro_img15.png)center bottom no-repeat;box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);}
#section03 .con03 .right .circle{position:Absolute; left: 0; right: 0; bottom: 24px; margin: 0 auto; width:244px; height: 244px; border-radius: 50%;background-color: #E6EAEF;}

#section04{background-color: #2D3643;}
#section04 .main_txt{text-align: center;}
#section04 .main_txt em{color:#fff;}
#section04 .con_wrap{display: flex; align-items:center; margin-top: 56px;}
#section04 .con01{position:relative; display: flex; align-items: center; justify-content: center; width: 501px; height: 501px; }
#section04 .con01 .txt{position:relative; text-align: center;}
#section04 .con01 .txt span{display: block; font-size: 40px; line-height: 55px; font-weight: 800; color:#96E7B1}
#section04 .con01 .txt em{display: block; font-size: 80px; font-weight: 800; line-height:95px; color:#96E7B1;}
#section04 .con01:before{content:''; position:absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../intro_img/intro_img16.png)center bottom no-repeat; animation: circle 15s linear infinite running}
#section04 .con02{width: calc(100% - 501px); padding-left:36px;}
#section04 .con02 .txt em{display: block; font-size:24px; line-height: 29px; color:#fff; padding-bottom:14px; font-weight: 700; border-bottom: 1px solid #fff;}
#section04 .con02 .txt strong{display: block; font-size:40px; line-height: 55px; color:var(--primary_color1); font-weight: 700; margin-top: 15px;}
#section04 .con02 .txt p{font-size:18px; line-height: 33px; color:#C9D0D9; margin-top:15px;}
#section04 .con02 .txt:last-child{margin-top:60px;}

#section05{background-color: #F8F8F8;}
#section05 .con01{display: flex; justify-content: space-between}
#section05 ul{width:450px}
#section05 ul li a{display: block; padding: 30px; border-radius: 15px; background-color: #F8F8F8; transition:0.3s;}
#section05 ul li em{display: block; font-size:24px; line-height: 30px; font-weight: 700; color:#788290; transition:0.3s;}
#section05 ul li p{font-size:16px; line-height:19px; color:#2D3643; margin-top:15px; opacity: 0; visibility: hidden; height: 0; transition:0.3s;}
#section05 ul li.on a{background-color: #fff;}
#section05 ul li.on em{color:var(--primary_color1);}
#section05 ul li.on p{opacity: 1; visibility: visible; height: 38px;}
#section05 .img_wrap{position:relative; width: 590px; height: 550px;}
#section05 .img_wrap img{position:absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; visibility: hidden; transition:0.3s;}
#section05 .img_wrap img.on{opacity: 1; visibility: visible;}

#section06 .main_txt{text-align: center;}
#section06 .sec06_slide{position:relative; margin-top:60px;}
#section06 .sec06_slide:before{content:''; position:Absolute; left: 0; top:0; width: 250px; height: 100%; background: linear-gradient(to right,#fff,transparent);z-index: 100;}
#section06 .sec06_slide:after{content:''; position:Absolute; right: 0; top: 0; width: 250px; height: 100%; background: linear-gradient(to left,#fff,transparent); z-index: 100;}
#section06 ul{display: flex; width: max-content; animation: marquee 20s linear infinite running;}
#section06 ul li{width: 150px; margin-right: 80px;}
#section06 ul .img_wrap{position:relative; padding-bottom: 100%; border-radius: 50%; overflow: hidden;}
#section06 ul .img_wrap img{position:absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; width: auto; height: auto; max-width: 100%; max-height: 100%; }

#section07{padding:37px 0; background-color: var(--primary_color1);}
#section07 .inner{display: flex; align-items: center; justify-content: center}
#section07 .txt{margin-right: 151px;}
#section07 .txt em{display: block; font-size: 30px; color:#fff; line-height: 48px; font-weight: 700;}
#section07 .txt .btn_wrap{display: flex; margin-top:25px;}
#section07 .txt .btn_wrap a{display: block; padding: 0 30px; font-size:17px; color:#fff; line-height: 50px; font-weight: 700; border-radius: 5px;}
#section07 .txt .btn_wrap a:first-child{background-color: #fff; color:var(--primary_color1);}

#section08 { background:#1E2530;}
#section08 .main_txt em { color:#788290;}
#section08 .main_txt em b { color:#fff; font-weight: 700;}
#section08 .container { position:relative; margin-top:80px;}
#section08 .plan_list{display: flex; justify-content: space-between;}
#section08 .plan_wrap:nth-child(2){width: calc(50% - 10px);}
#section08 .plan_wrap .plan_table{border: 1px solid #fff; border-radius:10px; overflow: hidden;}
#section08 .plan_wrap table{width: 100%; table-layout: fixed;}
#section08 .plan_wrap th{padding:6px; font-size: 13px; color:#fff; border: 1px solid #fff; border-top: none; background-color: #171E28; border-right:none; font-weight: 700;}
#section08 .plan_wrap th:first-child{border-left: none;}
#section08 .plan_wrap tbody th{border-top:1px solid #fff;}
#section08 .plan_wrap td{padding:6px; font-size: 12px; color:#fff; border: 1px solid #fff; border-bottom: none; border-right: none;}
#section08 .plan_wrap tbody th{border-bottom: none;}
#section08 .plan_wrap td .price{display: flex; justify-content: space-between;}
#section08 .plan_wrap td .price span{display: block; font-size:12px; color:#fff;}
#section08 .plan_wrap {width: calc(25% - 10px); position:relative; top:0; min-height:480px; padding-bottom: 56px;border-radius:16px; border:1px solid #788290; transition-duration:1s;}
#section08 .plan_wrap .plan_box {height: 100%; padding:16px 24px; box-sizing: border-box;}
#section08 .plan_wrap .price_box { padding-bottom:16px; text-align: center; line-height:1.6; color:#fff;}
#section08 .plan_wrap.free .price_box { color:#ACB2BA;}
#section08 .plan_wrap.price_box { color:#ffffff;}
#section08 .plan_wrap .price_box span { font-size:28px; color:inherit; font-weight:500;}
#section08 .plan_wrap .price_box strong { display: block; margin-top:16px; font-size:28px; color:inherit; font-weight:400;}
#section08 .plan_wrap .info_box {height: calc(100% - 200px); padding:16px; border-radius: 12px; background-color:#171E28;}
#section08 .plan_wrap .info_box li { padding-left:30px; font-size:16px; color:#fff; line-height:26px; background:url(../intro_img/plan_chk.png) left top no-repeat; font-family: 'Noto Sans KR'; letter-spacing: -0.32px; word-break: keep-all;}
#section08 .plan_wrap .info_box li ~ li { margin-top:8px;}
#section08 .plan_wrap button { position:absolute; left:0; bottom:0; width:100%; height:56px; border-radius:0 0 16px 16px; border-top: 1px solid #788290; font-size:15px; color:#fff; font-family: 'Noto Sans KR'; transition: .3s;}
#section08 .plan_wrap button:hover { background-color:#24b770;}
#section08 .plan_wrap .table_box { padding:16px; height:calc(100% - 121px); border-radius: 12px; background-color:#171E28; color: #ffffff;}
#section08 .plan_btn { position:absolute; top:50%; transform: translateY(-50%); cursor: pointer;}
#section08 .plan_btn_prev { right:calc(100% + 24px);}
#section08 .plan_btn_next { left:calc(100% + 24px);}
#section08 .plan_btn.swiper-button-disabled { opacity:0.4;}

#section08 .plan_wrap01 {position:relative; top:0; height:700px; width: 100%; border-radius:16px; border:1px solid #788290; transition-duration:1s;}
#section08 .plan_wrap01 .plan_box {padding:16px 24px; height:calc(100% - 56px); box-sizing: border-box;}
#section08 .plan_wrap01 .price_box { padding-bottom:16px; text-align: center; line-height:1.6; color:#fff;}
#section08 .plan_wrap01.free .price_box { color:#ACB2BA;}
#section08 .plan_wrap01.price_box { color:#ffffff;}
#section08 .plan_wrap01 .price_box span { font-size:28px; color:inherit; font-weight:500;}
#section08 .plan_wrap01 .price_box strong { display: block; margin-top:16px; font-size:28px; color:inherit; font-weight:400;}
#section08 .plan_wrap01 .info_box { padding:16px; height:calc(100% - 150px); border-radius: 12px;}
#section08 .plan_wrap01 button { position:absolute; left:0; bottom:0; width:100%; height:56px; border-radius:0 0 16px 16px; border-top: 1px solid #788290; font-size:15px; color:#fff; font-family: 'Noto Sans KR'; transition: .3s;}
#section08 .plan_wrap01 button:hover { background-color:#24b770;}
#section08 .plan_wrap01 .table_box { padding:16px; height:calc(100% - 121px); border-radius: 12px; background-color:#171E28; color: #ffffff;}

#footer{padding: 50px 0 0;}
#footer > .inner{position:relative; padding-bottom:50px;}
#footer .f_nav{position:absolute; display: flex; right: 0; top: 0;}
#footer .f_nav li{margin-right:20px;}
#footer .f_nav li:last-child{margin-right: 0;}
#footer .f_nav li a{display: block; font-size:14px; color:#727C7E; line-height: 17px;}
#footer a.foot_logo{display: inline-block;}
#footer address{font-size:13px; line-height:22px; margin-top: 20px; color:#727C7E; font-weight: 400;}
#footer p{font-size:13px; line-height:22px; margin-top: 10px; color:#727C7E; font-weight: 400;}
.copyright{padding:30px 0; border-top:1px solid #EDEDED; background-color: #F9F9F9;}
.copyright p{font-size: 13px; color:#727C7E;}
#footer.sub_footer {background-color:#1A212E;}
#footer.sub_footer .copyright { border-color:#2D3643; background-color:#1A212E;}


/*.scroll_effect{opacity: 0; transform: translateY(100px);}*/


@keyframes tada{
    0%{
        -webkit-transform:scaleX(1);transform:scaleX(1);
    }
    10%,20% {
        -webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9);
    }
    20% {
        -webkit-transform:scale3d(.9,.9,.9) rotate(-3deg);transform:scale3d(.9,.9,.9) rotate(-3deg);
    }
    30%,50%,70%,90%
    {
        -webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1);
    }
    40%,80%{
        -webkit-transform:scale3d(1.1,1.1,1.1) rotate(-3deg);transform:scale3d(1.1,1.1,1.1) rotate(-3deg);
    }
    to {
        -webkit-transform:scaleX(1);transform:scaleX(1);
    }
}
@keyframes car{
    0%{
        right: -300px;
    }
    100%{
        right: 0;
    }
}
@keyframes circle{
    0%{
        transform: rotate(0deg);
    }
    100%{
        transform: rotate(360deg);
    }
}
@keyframes marquee{
    0%{
        transform:translateX(0)
    }

    100%{
        transform: translateX(-50%)
    }
}

/* ======================= 로그인 / 회원가입 ======================= */
.scroll { overflow-y:auto;}
.scroll::-webkit-scrollbar { width: 5px; height:5px;}
.scroll::-webkit-scrollbar-thumb { background-color: #767A82; border-radius:4px;}
.scroll::-webkit-scrollbar-track { background-color: transparent;}

input:focus-visible {
    outline: none;
}
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"] { display:block; padding:0 24px; width:360px; height:56px; background:#F4F7FA; border:1px solid #F9FAFC; border-radius:12px; font-size:15px; color:#1A212E; transition: .3s; font-weight:700;}
input:hover {background:#EEF1F5;}
input[type="file"]{ display:block; padding:0 24px; width:calc(100% - 87px); height:56px; background:#F9FAFC; border:1px solid #F9FAFC; border-radius:12px; font-size:15px; color:#767A82; transition: .3s; font-weight:700; line-height: 56px;}
input[type="file"]::file-selector-button { display: none;}
input[type="file"]:hover { box-shadow: none;}
input::placeholder { font-size:15px; color:#C9D0D9; font-weight:700;}
input:hover { box-shadow: 0px 4px 0px 0px rgba(13, 100, 63, 0.24);}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="search"]:focus { background:#fff; border-color:var(--primary_color1); box-shadow: 0px 4px 0px 0px rgba(13, 100, 63, 0.24);}
.chk_stl01 input[type="checkbox"] { position:absolute; left:-100000%;}
.chk_stl01 input[type="checkbox"] + span { display:block; padding-left:26px; background:url(../intro_img/ico_chk01.svg) left center no-repeat; font-size:13px; color:#767A82; font-weight:700; line-height:18px;}
.chk_stl01 input[type="checkbox"]:checked + span { background-image: url(../intro_img/ico_chk01_on.svg); color:var(--primary_color1);}
.chk_stl02 input[type="checkbox"] { position:absolute; left:-100000%;}
.chk_stl01{ position:relative;}
.chk_stl02{ position:relative;}
.chk_stl03{ position:relative;}
.chk_stl02 input[type="checkbox"] + span { display:block; padding-left:26px; background:url(../intro_img/ico_chk01.svg) left center no-repeat; font-size:15px; color:#3F4857; font-weight:700; line-height:24px; filter:brightness(0.5);}
.chk_stl02 input[type="checkbox"]:checked + span { background-image: url(../intro_img/ico_chk01_on.svg); color:var(--primary_color1); filter:none;}
.ral_stl01 span { display:flex; align-items: center; justify-content: center;}
.ral_stl01 input[type="radio"] { position:absolute; left:-100000%;}
.ral_stl01 span { width:360px; height:56px; border-radius:12px; border:1px solid #BBBEC3; background:#fff; font-size:15px; color:#3F4857; font-weight:400; transition: .3s;}
.open_search:hover,
.ral_stl01 span:hover { box-shadow: 0px 4px 0px 0px rgba(100, 50, 13, 0.24);}
.open_search .ral_stl01 span { box-shadow: none;}
.ral_stl01 input:checked + span { box-shadow:none; background-color:#F4F7FA; border-color: #1A212E; color:#1A212E;}

a.btn { display:flex; align-items: center; justify-content: center;}
.btn { width:360px; height:60px; border-radius:12px; font-size:16px; color:#fff; font-weight:900; transition: .3s;}
.btn.stl01 { background:var(--primary_color1); transition: .3s;}
.btn.stl01:hover {box-shadow: 0px 4px 0px 0px rgba(100, 50, 13, 0.24);}
.btn.stl02 { width:100%; background:#232B3A;}
.btn.stl03 { height:56px; border:1px solid #BBBEC3; background:#fff; font-size:15px; color:#3F4857; font-weight:400;}
.btn.stl03:hover { box-shadow: 0px 4px 0px 0px rgba(100, 50, 13, 0.24);}
.btn.stl03:focus { box-shadow:none; border-color: #1A212E; color:#1A212E;}

.login_wrap,
.join_wrap { display:flex; position:relative; height:100vh; line-height: 1.6;}
.login_wrap .bg_box { width:50%; height:100vh; background:url(../intro_img/login_bg.jpg) left center no-repeat; background-size:cover;}
.join_wrap .bg_box { width:50%; height:100vh; background:url(../intro_img/join_bg.jpg) left center no-repeat; background-size:cover;}
.login_wrap .login_con,
.join_wrap .join_con { display: flex; align-items: center; justify-content: center; width:50%; height:100vh;}
.login_wrap .tit_txt,
.join_wrap .tit_txt { text-align: center;}
.login_wrap .tit_txt strong,
.join_wrap .tit_txt strong { font-size:32px; color:#1A212E; font-weight:800; line-height: 1.6;}
.join_wrap .tit_txt strong span { color:var(--primary_color1);}
.login_wrap .tit_txt p,
.join_wrap .tit_txt p { margin-top:12px; font-size:16px; color:#3F4857;}
.login_wrap .tit_txt p b,
.join_wrap .tit_txt p b { font-weight:800;}
.login_wrap .login_con .input_box { margin:40px 0 32px;}
.login_wrap .login_con .input_box > input { margin-bottom:12px;}
.login_wrap .btn_wrap .link_stl01 { display: flex; align-items: center; justify-content: center; margin-top:16px;}
.login_wrap .btn_wrap .link_stl01 li { font-size:14px; color:#767A82;}
.login_wrap .btn_wrap .link_stl01 li:not(:nth-of-type(2n)) { padding:0 16px;}
.login_wrap .btn_wrap .link_stl01 li a { font-size:inherit; color:inherit;}

.pop_up { display: none; position:fixed; left:0; right:0; top:0; bottom:0; z-index:10001;  background: rgba(0, 0, 0, 0.40);}
.pop_up .pop_layer { position:absolute; left:50%; top:50%; transform: translate(-50%,-50%); min-width:max-content; padding:8px; border-radius: 12px; background: #fff;}
.pop_up .pop_layer .pop_in { padding:16px 24px;}
.pop_up .pop_layer .pop_head { position:relative; margin-bottom:16px; text-align:center;}
.pop_up .pop_layer .pop_head h3 { font-size:16px; color:#1A212E; font-weight:800;}
.pop_up .pop_layer .pop_head .pop_close { position:absolute; right:0; top:50%; transform: translateY(-50%);}
.pop_up .pop_layer .pop_con { padding:16px 0;}
.pop_up .pop_layer .pop_con .txt01 strong { font-size:15px; color:#3F4857; font-weight:700;}
.pop_up .pop_layer .pop_con .txt01 strong em { color:var(--primary_color1); font-weight:500;}
.pop_up .pop_layer .pop_con .txt01 p { margin-top:4px; font-size:13px; color:#767A82;}
.pop_up .pop_layer .pop_con .input_box { margin-top:12px;}
.pop_up .pop_layer .pop_con .view_txt { padding:16px; width:100%; max-height:500px; background:#F9FAFC;}
.pop_up .pop_layer .pop_foot p { margin-top:16px; font-size:14px; color:#767A82; text-align: center;}
.pop_up .pop_layer .pop_foot p button { margin-left:4px; font-size:14px; color:var(--primary_color1); font-weight: 800;}

.join_wrap .join_con { overflow-y: auto;}
.join_wrap .join_con.type02 { align-items: flex-start; padding:80px 0;}
.join_wrap .join_con::-webkit-scrollbar { width: 8px; height:8px;}
.join_wrap .join_con::-webkit-scrollbar-thumb { background-color: #767A82; border-radius:4px;}
.join_wrap .join_con::-webkit-scrollbar-track { background-color: transparent;}
.join_wrap .join_route {width: 360px; padding:40px 0 32px;}
.join_wrap .join_route .ral_stl01 { display: block;}
.join_wrap .join_route .ral_stl01 ~ .ral_stl01 { margin-top:16px;}
.join_wrap .join_route .ral_stl01 span{height: auto; padding: 15px; text-align: center;}
.join_wrap .join_route .search_btn.on span { border-bottom:transparent; border-radius: 12px 12px 0 0; background:#F4F7FA;}
.join_wrap .join_route .search_btn.stay span { background:#F4F7FA;}
.join_wrap .open_search { display: none; position:absolute; left:0; top: 100%; width: 100%; max-height: 300px; overflow: auto; padding:0 24px 18px; border:1px solid #1A212E; border-top:0; border-radius:0 0 12px 12px; background:#F4F7FA; transition:.3s; box-sizing: border-box;}
.join_wrap .open_search .ral_stl01 em { font-size:15px; color:#3F4857; font-weight:400;}
.join_wrap .search_wrap { padding-top:16px;}
.join_wrap .search_wrap .search_box { position:relative;}
.join_wrap .search_wrap .search_box input[type="text"] { display:block; padding:0 35px 0 0; width:100%; height:32px; background:transparent; border:1px solid transparent; border-bottom:1px solid #1A212E; border-radius:0; font-size:15px; color:#1A212E; font-weight:700;}
.join_wrap .search_wrap .search_box input[type="text"]:hover,
.join_wrap .search_wrap .search_box input[type="text"]:focus { box-shadow: none;}
.join_wrap .search_wrap .search_box button { position:absolute; right:0; bottom:0;}
.join_wrap .search_wrap .search_list { display: none; margin-top:12px;}
.join_wrap .search_wrap .search_list li { padding:8px 0px; font-size:14px; color:#3F4857; cursor: pointer; border-radius: 8px;}
.join_wrap .search_wrap .search_list li:hover { background: #E9EBEE;}
.join_wrap .btn_wrap p { margin-top:16px; font-size:14px; color:#767A82; text-align: center;}
.join_wrap .btn_wrap p a { margin-left:4px; font-size:14px; color:var(--primary_color1); font-weight: 800;}
.join_wrap .join_form {max-width: 360px; padding:40px 0 32px;}
.join_wrap .join_form .input_box { margin-bottom:12px;}
.join_wrap .join_form .input_box > label { display: block; margin-bottom:4px; font-size:14px; color:#3F4857;}
.join_wrap .join_form .input_box p { margin-top:4px; padding-left:24px; font-size:13px; color:#BBBEC3; background:url(../intro_img/ico_notice.svg) left center no-repeat; line-height: 21px;}
.join_wrap .join_form .input_box .plan_radio_box { display:flex; align-items: center; gap:0 8px;}
.join_wrap .join_form .input_box .plan_radio_box .plan_radio { flex:1; cursor: pointer;}
.join_wrap .join_form .input_box .plan_radio_box .plan_radio input { position:absolute; left:-99999%;}
.join_wrap .join_form .input_box .plan_radio_box .plan_radio span { display: flex; align-items: center; justify-content: center; width:100%; height:56px; border-radius: 12px; border: 1px solid #EEF1F5; font-size:15px; color:#ACB2BA; font-weight:500;}
.join_wrap .join_form .input_box .plan_radio_box .plan_radio input:checked + span { border-color:#24b770; color:#24b770;}
.join_wrap .join_form .input_box select { width:100%; padding:0 16px; height:56px; border-radius: 12px; border: 3px solid #EEF1F5; appearance: none; background:url(../intro_img/select_arrow.png) right 16px center no-repeat; font-size:15px; color:#788290; font-weight:500;}
.join_wrap .join_form .input_box select:focus { outline:none;}
.join_wrap .join_form .file_con { display:flex; align-items: center; gap:0 10px; width:360px;}
.join_wrap .join_form .file_con .file_btn { display: flex; align-items: center; justify-content: center; padding:0 25px; height:56px; background:#E5F9EF; border-radius: 12px; font-size:15px; color:var(--primary_color1); font-weight:700; cursor: pointer;}
.join_wrap .join_form .file_con .file_btn:hover { box-shadow: 0px 4px 0px 0px rgba(13, 100, 63, 0.24);}
.join_wrap .join_form .agree_wrap { padding:8px 0; max-width:360px;}
.join_wrap .join_form .agree_wrap ul { padding:0 24px; margin-top:8px;}
.join_wrap .join_form .agree_wrap li .tit { display: flex; align-items: center; gap:0 4px; padding-bottom:8px;}
.join_wrap .join_form .agree_wrap li .tit em { color:var(--primary_color1);}
.join_wrap .join_form .agree_wrap li .tit a { display: block; border-bottom:1px solid #3f4857; font-size:13px; color:#3F4857; font-weight:700; line-height:1;}
.join_wrap .join_form .agree_wrap li .con { display: none; padding:8px; margin-bottom:8px; width:100%; height:100px; background:#E9EBEE; word-break: break-all;}
.join_wrap .join_form .agree_wrap li .con p { font-size:13px; color:#3F4857;}

.join_complete { display: flex; flex-direction: column; align-items: center; justify-content: center; width:100%; height:100vh; text-align: center;}
.join_complete .txt_box { padding:40px 0;}
.join_complete .btn_wrap { text-align: center;}
.join_complete .btn_wrap .btn.type01 { padding:16px; border-radius: 12px; border: 1px solid #C9D0D9; background: #fff; font-size:15px; color:#2D3643; font-weight:400;}
.join_complete .btn_wrap .btn.type01 strong {margin-left:8px; font-weight:700;}
/*.join_wrap .join_form .email_con { display:flex; align-items: center; gap:0 10px; width:360px;}*/
/*.join_wrap .join_form .email_con input { flex:1;}*/
/*.join_wrap .join_form .email_con .btn { display: flex; align-items: center; justify-content: center; padding:0 25px; min-width:105px; height:56px; background:#E5F9EF; border-radius: 12px; font-size:15px; color:var(--primary_color1); font-weight:700; cursor: pointer;}*/
/*.join_wrap .join_form .email_con .btn:hover { box-shadow: 0px 4px 0px 0px rgba(13, 100, 63, 0.24);}*/


.policy_wrap{padding: 180px 0 60px; }
.policy_wrap .title{text-align: center;}
.policy_wrap .title em{font-size: 35px; font-weight: 700; color:#222}
.policy_wrap .title p{font-size: 25px; color:#222; margin-top: 20px;}
.policy_wrap .title span{display: block; font-size: 17px; color:#222; margin-top:20px; line-height:26px;}
.policy_wrap .policy_con{margin-top: 50px; border: 1px solid #ddd; padding: 30px; border-radius: 15px; word-break: keep-all;}
.policy_wrap .policy_con p{font-size: 15px; color:#222; line-height: 25px;}


/*비밀번호 변경*/
#reset_password { display: flex; align-items: center; justify-content: center; position:relative; height:100vh;}
#reset_password .rp_wrap { text-align: center;}
#reset_password .rp_wrap .rp_form { margin-top: 32px; padding:28px 32px; width:400px; border-radius: 12px; border: 1px solid #EEF1F5; background: #FFF; text-align: left;}
#reset_password .rp_wrap .rp_form .rp_input_box label { font-size:14px; color:#788290; font-weight:500;}
#reset_password .rp_wrap .rp_form .rp_input_box input { display: block; margin-top:8px; padding:0 18px; width:100%; height:50px; border-radius: 8px; border: 1px solid #EEF1F5; background: #FFF; box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.04); font-size:15px; color:#1A212E; font-weight:400;}
#reset_password .rp_wrap .rp_form .rp_input_box input::placeholder { color:#ACB2BA; font-weight: 400;}
#reset_password .rp_wrap .rp_form .rp_input_box input:not(:last-of-type) { margin-bottom:12px;}
#reset_password .rp_wrap .rp_form .rp_input_box input:focus { border: 1px solid #24b770; background: #FFF; box-shadow: 0px 0px 8px 0px rgba(36, 183, 112, 0.12);}
#reset_password .rp_wrap .rp_form .rp_btn_wrap { margin-top:24px;}
#reset_password .rp_wrap .rp_form .rp_btn_wrap button { width:100%; height:50px; border-radius: 8px; background: #24b770; font-size:15px; color:#fff; font-weight:500;}
#reset_password .rp_footer { position:absolute; left:0; right:0; bottom:40px; text-align: center;}
#reset_password .rp_footer .copy { font-size:13px; color:#788290; line-height:22px;}
#reset_password .rp_footer .copy span { color:#1A212E;}

/* 서브페이지 */
#sub_visual_wrap { padding:80px 64px 0;}
#sub_visual_wrap .sub_visual { overflow: hidden; display: flex; justify-content: space-between; align-items: center; height:560px; border-radius: 24px;}
#sub_visual_wrap .sub_visual .visual_txt { padding-left:160px;}
#sub_visual_wrap .sub_visual .visual_txt p { font-size:40px; color:#fff; font-weight:700; line-height:55px;}
#sub_visual_wrap .sub_visual .visual_img { position:relative; width:54%;}
#sub_visual_wrap .sub_visual .visual_img.sub02 { display: flex; align-items: flex-start; height:100%; background:url(../intro_img/sub02_img01.png) right bottom no-repeat;}
#sub_visual_wrap .sub_visual .visual_img.sub03 { width:auto;}
#sub_visual_wrap .sub_visual .visual_img.sub03 img { position:absolute; left:0; top:-32px;}
#sub_visual_wrap .sub_visual .visual_img.sub04 .truck { position:absolute; right:0; top:34px; z-index: 100;}
#sub_visual_wrap .sub_visual .visual_img.sub05 { padding-right:42px; width:auto;}
#sub_visual_wrap .sub_visual .visual_img.sub05 .letter { position:absolute; right:600px; top:0; opacity:0; animation: sub05Ani 1.5s 1.2s forwards;}
#sub_visual_wrap .sub_visual .visual_img.sub05 .book { position:absolute; right:477px; top:0; opacity:0; animation: sub05Ani 1.5s 1.8s forwards;}
#sub_visual_wrap .sub_visual .visual_img .fix_img { position:absolute; left:50%; top:50%; transform: translate(-43%,-67%); z-index: 2;}

@keyframes sub05Ani {
    0% { opacity:0; top:0;}
    25% { opacity:1; top:170px;}
    65% { opacity:1; top:160px;}
    100% { opacity:1; top:170px;}
}

#sub_contents { line-height:1.5;}
#sub_contents .con { padding:30px 0;}
#sub_contents .con .sub_tit,
#sub_contents .txt_con .sub_tit { position:relative; padding-left:12px; font-size:32px; color:#2D3643; font-weight:700;}
#sub_contents .con .sub_tit.white { color:#fff;}
#sub_contents .con .sub_tit::before,
#sub_contents .txt_con .sub_tit::before { content:''; display: block; position:absolute; left:0; top:0; width:12px; height:12px; border-radius:50%; background:#24b770;}

/* sub01 */
.sub01_wrap .con01 .txt_box { position:relative; text-align: center;}
.sub01_wrap .con01 .txt_box .txt_bg { position:absolute; left:50%; top:50%; transform: translate(-50%,-50%); z-index: -1;}
.sub01_wrap .con01 .txt_box strong { font-size:32px; color:#2D3643; font-weight:700;}
.sub01_wrap .con01 .txt_box p { margin-top:24px; font-size:20px; color:#2D3643; letter-spacing: -0.4px; line-height: 33px;}
.sub01_wrap .con02 .con_list { display: flex; flex-wrap:wrap; margin-top:40px;}
.sub01_wrap .con02 .con_list li { position:relative; padding:40px 0; width:33.333%; text-align: center;}
.sub01_wrap .con02 .con_list li ~ li:not(:nth-child(4n))::before { content:''; position:absolute; left:0; top:40px; width:1px; height:calc(100% - 80px); background:#E5E8EC;}
.sub01_wrap .con02 .con_list li:nth-child(3n) ~ li { border-top:1px solid #E5E8EC;}
.sub01_wrap .con02 .con_list li .txt_box { margin-top: 33px;}
.sub01_wrap .con02 .con_list li .txt_box strong { font-size:20px; color:#4A5361; font-weight:700;}
.sub01_wrap .con02 .con_list li .txt_box p { margin-top:12px; font-size:16px; color:#4A5361;}
.sub01_wrap .con03 { padding-bottom:160px; background: linear-gradient(180deg, #000 50%, #1A212E 100%);}
.sub01_wrap .con03 .graph_wrap { display: flex; align-items: center; justify-content: space-between; padding:80px 0;}
.sub01_wrap .con03 .graph_wrap .counting_box .count_txt ~ .count_txt { margin-top:40px;}
.sub01_wrap .con03 .graph_wrap .counting_box .count_txt span { font-size:16px; color:#788290; font-weight: 500}
.sub01_wrap .con03 .graph_wrap .counting_box .count_txt p { font-size:48px; color:#fff; font-weight:700;}
.sub01_wrap .con03 .graph_wrap .graph_box { overflow:hidden; position:relative; width:422px; height:380px;}
.sub01_wrap .con03 .graph_wrap .graph_box svg path { stroke-dashoffset: 563; stroke-dasharray: 563; transition:1s 1.2s;}
.sub01_wrap .con03 .graph_wrap .graph { position:absolute; left:0; right:0; bottom:0; height:0; background:url(../intro_img/sub01_img10.svg) center bottom no-repeat; background-size:100%; transition: 1s .5s;}
.sub01_wrap .con03.on .graph_wrap .graph_box .graph { height:100%; transition:1s;}
.sub01_wrap .con03.on .graph_wrap .graph_box svg path { stroke-dashoffset: 0; transition:1s 1s;}
.sub01_wrap .con03 .txt_box { padding:16px; border-radius: 16px; border: 1px solid rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.04);}
.sub01_wrap .con03 .txt_box ul { display: flex; flex-wrap:wrap; gap:12px;}
.sub01_wrap .con03 .txt_box ul li { display: flex; align-items: center; gap: 0 16px; width:calc(50% - 12px);}
.sub01_wrap .con03 .txt_box ul li .tit_box { display: flex; align-items: center; gap:0 12px;}
.sub01_wrap .con03 .txt_box ul li .tit_box .ico { display: flex; align-items: center; justify-content: center; width:48px; height:48px; border-radius: 12px; background: rgba(255, 255, 255, 0.08);}
.sub01_wrap .con03 .txt_box ul li .tit_box strong { font-size:15px; color:#fff; font-weight:700;}
.sub01_wrap .con03 .txt_box ul li p { font-size:15px; color:#ACB2BA; line-height: 1.6; margin-bottom: 0;}
/* sub02 */
.sub02_wrap .con { display: flex;}
.sub02_wrap .con .sub_tit { width:300px;}
.sub02_wrap .con .con_list { display:flex; flex-wrap:wrap; gap:48px 24px; width:calc(100% - 300px);}
.sub02_wrap .con .con_list li { width:calc(50% - 12px); line-height: 1.6;}
.sub02_wrap .con .con_list li .ico_box { margin-bottom:16px;}
.sub02_wrap .con .con_list li .txt_box strong { font-size:20px; color:#2D3643; font-weight:700;}
.sub02_wrap .con .con_list li .txt_box p { margin-top: 8px; font-size:16px; color:#4A5361;}
/* sub03 */
.sub03_wrap .con .txt_list { padding:24px 0 40px;}
.sub03_wrap .con .txt_list li { display:flex; align-items: baseline; gap:0 8px;}
.sub03_wrap .con .txt_list li ~ li { margin-top: 8px;}
.sub03_wrap .con .txt_list li span { display: block; padding:0 8px; border-radius: 8px; background: #4A5361; font-size:16px; color:#fff; text-align: center; line-height: 30px;}
.sub03_wrap .con .txt_list02 li span { display: block; padding:0 8px; border-radius: 8px; background: #F4F7FA; font-size:16px; color:#fff; text-align: center; line-height: 30px;}
.sub03_wrap .con .txt_list03 li span { display: block; padding:0 8px; border-radius: 8px; background: #4A5361; font-size:16px; color:#fff; text-align: center; line-height: 30px;}
.sub03_wrap .con .txt_list04 li span { display: block; padding:0 8px; border-radius: 8px; background: #4A5361; font-size:16px; color:#fff; text-align: center; line-height: 30px;}
.sub03_wrap .con .txt_list05 li span { display: block; padding:0 8px; border-radius: 8px; background: #4A5361; font-size:16px; color:#fff; text-align: center; line-height: 30px;}
.sub03_wrap .con:not(.con01) .txt_list li span { /*width:120px;*/ width: max-content;}
.sub03_wrap .con .txt_list li p { flex:1; font-size:16px; color:#4A5361;}
.sub03_wrap .con01 .img_box,
.sub03_wrap .con02 .img_box { display: flex; justify-content: center; align-items: flex-end; position:relative; margin-top:40px; padding:0 70px; height:480px; background:#F4F7FA; border-radius: 16px;}
.sub03_wrap .con02 .img01{position:absolute; left:50px; bottom: 0;z-index: 10;}
.sub03_wrap .con02 .img02{position:absolute; right:50px; bottom: 0;}
.sub03_wrap .con02 .img03{position:absolute; right:68px; bottom: 19px; z-index: 10;}
.sub03_wrap .con03 .plan_list { display: flex; align-items: stretch; gap: 0 24px; margin-top:40px;}
.sub03_wrap .con03 .plan_list > li { position:relative; top:0; width:calc((100% - 48px)/3); min-height:480px; border-radius:16px; transition-duration:1s;}
.sub03_wrap .con03 .plan_list > li.free { transition-delay: 0.2s; background-color:#F4F7FA; color:#4A5361;}
.sub03_wrap .con03 .plan_list > li.lite { transition-delay: 0.4s; background-color:#FDF7ED; color:#FFB72E;}
.sub03_wrap .con03 .plan_list > li.standard { transition-delay: 0.6s; background-color:#EAFAE7; color:#61D64E;}
.sub03_wrap .con03 .plan_list > li.premium { transition-delay: 0.6s; background-color:#FFFFB4; color:#CFA636;}
.sub03_wrap .con03 .plan_list > li.enterprise { transition-delay: 0.6s; background-color:#C6F9FF; color:#002187;}
.sub03_wrap .con03 .plan_list > li.custom { transition-delay: 0.6s; background-color:#EAFAE7; color:#61D64E;}
.sub03_wrap .con03 .plan_list > li .plan_box {padding:16px 24px; height:calc(100% - 56px); color:inherit;}
.sub03_wrap .con03 .plan_list .price_box { padding-bottom:16px; text-align: center; line-height:1.6; color:inherit;}
.sub03_wrap .con03 .plan_list .price_box span { font-size:28px; color:inherit; font-weight:500;}
.sub03_wrap .con03 .plan_list .price_box strong { display: block; margin-top:16px; font-size:28px; color:inherit; font-weight:400;}
.sub03_wrap .con03 .plan_list .info_box { padding:16px; height:calc(100% - 121px); border-radius: 12px;}
.sub03_wrap .con03 .plan_list li.free .info_box { background-color:#E9EEF3;}
.sub03_wrap .con03 .plan_list li.free button { background-color:#4A5361;}
.sub03_wrap .con03 .plan_list li.lite .info_box { background-color:#F9EEDD;}
.sub03_wrap .con03 .plan_list li.lite button { background-color:#FFB72E;}
.sub03_wrap .con03 .plan_list li.standard .info_box { background-color:#DCF4D8;}
.sub03_wrap .con03 .plan_list li.standard button { background-color:#61D64E;}

.sub03_wrap .con03 .plan_list li.premium .info_box { background-color:#FFEE7E;}
.sub03_wrap .con03 .plan_list li.premium button { background-color:#CFA636;}

.sub03_wrap .con03 .plan_list li.enterprise .info_box { background-color:#6C9FFF;}
.sub03_wrap .con03 .plan_list li.enterprise button { background-color:#002187;}

.sub03_wrap .con03 .plan_list li.custom .info_box { background-color:#DCF4D8;}
.sub03_wrap .con03 .plan_list li.custom button { background-color:#61D64E;}

.sub03_wrap .con03 .plan_list .info_box li { padding-left:30px; font-size:16px; color:#4A5361; line-height:26px; background:url(../intro_img/plan_chk02.png) left top no-repeat; letter-spacing: -0.32px; word-break: keep-all;}
.sub03_wrap .con03 .plan_list .info_box li ~ li { margin-top:8px;}
.plan_list button.subscript { left:0; bottom:0; width:100%; height:56px; border-radius:12px 12px 12px 12px; font-size:15px; background-color: #24b770; color:#fff; transition: .3s;}
.plan_list button.ctus_btn {     left: 0;
    bottom: 0;
    width: 80px;
    height: 30px;
    border-radius: 12px 12px 12px 12px;
    font-size: 15px;
    background-color: #24b770;
    color: #fff;
    transition: .3s;
    margin: 0 10px;
}

.sub03_wrap .con04 { padding:0 0 80px; background-color:#F4F7FA;}
.sub03_wrap .con04 .con_box { display:flex; align-items: flex-start; gap:0 40px; padding:80px 0;}
.sub03_wrap .con04 .con_box:nth-child(2n) { flex-direction: row-reverse;}
.sub03_wrap .con04 .con_box .img_box { width:480px;}
.sub03_wrap .con04 .con_box .txt_box { width:calc(100% - 520px);}
.sub03_wrap .con04 .con_box .txt_box strong { font-size:24px; color:#2D3643; font-weight:700;}
.sub03_wrap .con04 .con_box .txt_box .txt01 { margin-top:24px;}
.sub03_wrap .con04 .con_box .txt_box .txt01 ~ .txt01 { margin-top:12px;}
.sub03_wrap .con04 .con_box .txt_box .txt01 span { font-size:16px; color:#4A5361; font-weight: 700;}
.sub03_wrap .con04 .con_box .txt_box .txt01 p { font-size:16px; color:#4A5361;}
@charset "UTF-8";
@import url(https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap); /*!
 * Tabler Icons 2.11.0 by tabler - https://tabler.io
 * License - https://github.com/tabler/tabler-icons/blob/master/LICENSE
 */
@font-face {
    font-family: tabler-icons;
    font-style: normal;
    font-weight: 400;
    src: url(./fonts/tabler-icons/fonts/tabler-icons.eot?v2.11.0);
    src: url(./fonts/tabler-icons/fonts/tabler-icons.eot?#iefix-v2.11.0)
    format("embedded-opentype"),
    url(./fonts/tabler-icons/fonts/tabler-icons.woff2?v2.11.0) format("woff2"),
    url(./fonts/tabler-icons/fonts/tabler-icons.woff?) format("woff"),
    url(./fonts/tabler-icons/fonts/tabler-icons.ttf?v2.11.0) format("truetype");
}
.ti {
    font-family: tabler-icons !important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-text-stroke-width: 0.1px;
    -webkit-text-stroke-color: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.ti-x:before {
    content: "\eb55";
}
.ti-check:before {
    content: "\ea5e";
}
/* sub04 */
.sub04_wrap .sub_tit { margin-bottom:40px;}
.sub04_wrap .con01 .img_container { display:flex; align-items: flex-end;}
.sub04_wrap .con01 .img_container .img_con { flex:1; padding:24px; text-align:center;}
.sub04_wrap .con01 .img_container .img_con .img_box { margin-bottom:24px;}
.sub04_wrap .con01 .img_container .img_con p { font-size:20px; color:#788290; font-weight: 700;}
.sub04_wrap .con01 .img_container .img_con b { color:#2D3643;}
.sub04_wrap .con02 { background:#F4F7FA;}
.sub04_wrap .con02 .con02_list { display: flex; flex-wrap:wrap; gap:12px;}
.sub04_wrap .con02 .con02_list li { padding:16px; width:calc((100% - 36px)/4); height:160px; border-radius: 12px; background:#fff right 16px bottom 16px no-repeat;}
.sub04_wrap .con02 .con02_list li p { font-size:18px; color:#4A5361; font-weight:500;}
.sub04_wrap .con03 .inner { background:#fff url(../intro_img/sub04_img05.png) right bottom no-repeat;}
.sub04_wrap .con03 .con03_list li ~ li { margin-top:12px;}
.sub04_wrap .con03 .con03_list li strong { font-size:16px; color:#4A5361; font-weight:700;}
.sub04_wrap .con03 .con03_list li p { margin-top:5px; font-size:16px; color:#4A5361;}
/* sub05 */
.sub05_wrap { padding-bottom:80px; background:#F4F7FA;}
.sub05_wrap .inner { display: flex; justify-content: space-between; align-items: stretch; gap:0 24px; padding:80px 64px 0; width:auto; background:#F4F7FA;}
.sub05_wrap .img_con { overflow: hidden; display: flex; align-items: flex-end; padding:64px; width:calc((100% - 24px)/2); border-radius: 24px; background:url(../intro_img/sub05_bg.jpg) center no-repeat; background-size: cover;}
.sub05_wrap .img_con p {font-size:40px; color:#fff; font-weight:700; text-shadow: 0px 4px 16px rgba(0, 0, 0, 0.40); line-height:55px;}
.sub05_wrap .txt_con { padding:40px; width:calc((100% - 24px)/2); border-radius: 24px; background:#fff;}
.sub05_wrap .form_box { display: flex; flex-wrap:wrap; gap:12px; padding:40px 0 24px;}
.sub05_wrap .form_box .box { width:calc((100% - 12px)/2);}
.sub05_wrap .form_box .box.full { width: 100%;}
.sub05_wrap .form_box .box label { display:block; margin-bottom:4px; font-size:14px; color:#2D3643;}
.sub05_wrap .form_box .box input { width:100%; height:56px; font-size:18px; color:#1A212E; font-weight:500;}
.sub05_wrap .form_box .box textarea::placeholder,
.sub05_wrap .form_box .box input::placeholder { font-size:18px; color:#ACB2BA; font-weight:500;}
.sub05_wrap .form_box .box textarea { outline: none; border-color:transparent; resize:none; padding:16px 24px; width:100%; height:240px; border-radius: 12px; background: #F4F7FA; font-size:18px; color:#1A212E; font-weight:500; transition:.3s;}
.sub05_wrap .form_box .box textarea:hover { box-shadow: 0px 4px 0px 0px rgba(13, 100, 63, 0.24); background:#EEF1F5;}
.sub05_wrap .form_box .box textarea:focus { border: 1px solid #24b770; background: #fff; box-shadow: 0px 4px 0px 0px rgba(13, 100, 63, 0.24);}
.sub05_wrap .btn_box .btn_submit { padding:0 16px; width:100%; height:72px; border-radius: 12px; background: #24b770; font-size:20px; color:#fff; font-weight:700;}

.form_wrap{display: flex; flex-direction: column; align-items: center;}
.form_wrap .btn_wrap{text-align: center;}

.dropbtn{
    display: block;
    padding: 8px 16px;
    border-radius: 8px;
    border: 1px solid var(--primary_color1);
    line-height: 1;
    width: 200px;
    font-size: 15px;
    color: #24b770;
    font-weight: 700;
}
.dropdown_menu{
    position : relative;
    display : inline-block;
}

.dropdown-content{
    display : none;
    position : absolute;
    z-index : 1; /*다른 요소들보다 앞에 배치*/
    background-color: #ffffff;
    border: 1px solid #24b770;
    color: #24b770;
    border-radius: 8px;
    width: 150px;
}

.dropdown-content a{
    display : block;
    color: #24b770;
}

.dropdown_menu:hover .dropdown-content {
    display: block;
}