@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Cabin:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700;900&display=swap');
    

/* common */
.clfix:after {content: "."; display: block; height:0px; clear: both; visibility: hidden;}
.clfix {display:inline-block;}
.clfix {display:block;}
* html .clfix {height:1%;} /* Hides from IE-mac */
.clfix {zoom:1;} /*for IE 5.5-7*/

body { font-family: 'Cabin', 'Noto Sans KR', sans-serif;}
button { border: 0;}
.inner { max-width: 1200px; width: 100%; margin: 0 auto;}
.br_m { display: none;}


/*intro*/
.side-navi-list { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);  transition:1.2s all;}
.side-navi-list:hover { top:47%;}
.side-navi-list a {display:block; height:100%; }

#nprogress .bar {background:#d3d3d3; position: fixed; z-index: 1031; top:0; left:0;width:100%; height:7px;}
.fade { transition: all 300ms linear 300ms;opacity: 1;}
.fade.out {opacity: 0;}

/*main*/  
#header { }
#header .inner { position: relative; height: 100px;}
#header h1 { position: absolute; top: 20px; left: 0; }
#header h1 a { display: block;}
#header h1 a img { height: 60px; }
.gnb { position: absolute; top: 0; right: 0; }
.gnb > li { position: relative; float: left; height: 100px; }
.gnb > li + li { margin-left: 50px; }
.gnb > li > a { display: block; line-height: 100px; font-size: 14px; color: #ccc;}
.gnb > li:hover > a { color: #7d7d7d;}
.gnb_dep2 { position: absolute; left: 50%; top: 80px; transform: translateX(-50%); width: 105px; border: 1px solid #e8e8e7; background: #fff; z-index: 1; display: none;}
.gnb > li:hover .gnb_dep2 { display: block;}
.gnb_dep2 li { height: 40px;}
.gnb_dep2 li a { display: block; line-height: 40px; text-align: center; font-size: 12px;}
.menu_btn { display: none;}
#lnb_wrap { display: none;}

#visual { }
.visual_slide img { display: none; }

#footer { padding: 35px 0 50px; text-align: center; font-size: 12px; color: #ccc; }
#footer address span { margin: 0 5px}
#footer .copyright { margin-top: 10px; line-height: 1; }
#footer .copyright span { font-weight: 700;}


/*sub01-company*/
.sub_content_wrap { padding-top:65px; }
.sub_tit { text-align: center; }
.sub_tit h3 { font-size: 22px; line-height: 1; color: #7d7d7d; font-weight: 300;}
.sub_content { margin-top: 40px; }
.introduction { position: relative; height: 541px; background: url(/img/sub01_bg_pc.jpg) no-repeat center top; background-size: cover;}
.intro_txt { position: absolute; top: 165px; left: 0; right: 0; width: 690px; margin: 0 auto; padding-left: 170px; }
.intro_txt h3 { position: absolute; left: 0; font-size: 20px; line-height: 1; color: #010103;}
.intro_desc { }
.intro_desc strong { font-size: 20px; color: #333; line-height: 1;}
.intro_desc p { font-size: 14px; line-height: 25px; color: #4b4b4b; margin-top: 20px; }
.intro_desc p i { display: block;}


/*sub03-process*/
.process { padding-bottom: 90px;}
.process_banner{ position: relative; height: 380px; background: url(/img/process_ban_pc.jpg) no-repeat center top; background-size: cover;}
.inquiry { position: absolute; bottom: -60px; right: 50px; width: 590px; height: 260px; background: #fff; padding: 50px 0 45px; box-shadow: 0px 0px 20px rgba(0,0,0,0.3); text-align:center;}
.inquiry h3 { font-size: 25px; line-height: 1.2; color: #111; font-weight: 400;}
.inquiry p { font-size: 14px; line-height: 1; color: #999; margin: 15px 0 20px;}
.inquiry a.inquiry_btn { display: inline-block; width: 200px; height: 55px; line-height: 55px; font-size: 20px; color: #fff; background: #000; border-radius: 5px;}
.process_list { margin-top: 120px; }
.process_list > li { position: relative; float: left; width: 50%; padding-right: 130px;}
.process_list > li:nth-child(n+3){ margin-top: 50px;}
.process_list > li span { position: absolute; width: 50px; height: 50px; line-height: 50px; background: #ededed; font-size: 22px; text-align:center; color: #010103; }
.process_list_desc { margin-left: 80px; color: #010103; }
.process_list_desc h3 { font-size: 20px; line-height: 1; padding-bottom: 10px; border-bottom: 1px solid #000; font-weight: 400;}
.process_list_desc_list { margin-top: 15px;}
.process_list > li:nth-child(6) .process_list_desc_list { min-height: 72px;}
.process_list_desc_list li{ position: relative; padding-left: 15px; font-size: 14px; line-height: 24px; color: #484848;}
.process_list_desc_list li:before{content:""; position: absolute; top: 10px; left: 0; width: 4px; height: 4px; background: #000; border-radius: 50%;}


/*sub04-contact*/
.contact { padding-bottom: 65px;}
.contact_top { height: 455px;}
#map { position: relative; float: left; width: 63.3%; height: 100%;}
#map iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.contact_img { float: left; width: 36.7%; height: 100%;}
.contact_img img { height: 100%;}
.contact_add { margin: 50px auto 0; width: 590px; color: #010103;}
.contact_logo { position: relative; float: left; }
.contact_logo:before { content:""; position: absolute; top: 50%; right: -35px; transform: translateY(-50%); width: 1px; height:90%; background: #ccc;}
.contact_logo em { font-size: 20px; line-height: 1; vertical-align: top; font-style: normal;}
.contact_logo .address_logo { display: inline-block; height: 60px; vertical-align: top; margin-left: 20px;}
.contact_info { float: left; margin-left: 70px; }
.contact_info p { font-size: 16px; line-height: 1; color: #333;}
.contact_info p:before { content: ""; display: inline-block; width: 13px; height: 19px; background: url(/img/ico_location.png) no-repeat; background-size: cover; vertical-align: middle; margin-right: 10px;}
.contact_info span { display: block; font-size: 14px; line-height: 1; color: #4b4b4b; margin-top: 10px; padding-left: 25px;}
    

@media screen and (max-width: 1024px){
    .br_pc { display: none;}
    .inner { padding: 0 3.906vw;}

    
    /*main*/
    #header { }
    #header .inner { height: 9.766vw;}
    #header h1 { top: 1.953vw; left: 3.906vw;}
    #header h1 a img { height: 5.859vw; }
    .gnb{ right: 3.906vw; }
    .gnb > li { height: 9.766vw; }
    .gnb > li + li { margin-left: 4.883vw; }
    .gnb > li > a { line-height: 9.766vw; font-size: 1.367vw;}
    .gnb_dep2 { top: 7.813vw; width: 10.254vw; }
    .gnb_dep2 li { height: 3.906vw;}
    .gnb_dep2 li a { line-height: 3.906vw; font-size: 1.172vw;}

    #visual { }
    .visual_slide img { display: none;}
    .visual_slide .slick-slide p { display: none;}
    .visual_slide .slick-slide img.tab { display: block;}

    #footer { padding: 3.418vw 0 4.883vw; font-size: 1.172vw; }
    #footer address span { margin: 0 0.488vw}
    #footer .copyright { margin-top: 0.977vw;}
    
    
    /*sub01-company*/
    .sub_content { margin-top: 6.348vw; }
    .sub01.inner { padding: 0;}
    .introduction { height: 52.832vw; background: url(/img/sub01_bg_tab.jpg) no-repeat center top; background-size: cover; }
    .intro_txt { top: 16.113vw; width: 67.383vw; padding-left: 16.602vw; }
    .intro_txt h3 { font-size: 1.953vw; }
    .intro_desc { }
    .intro_desc strong { font-size: 1.953vw;}
    .intro_desc p { font-size: 1.367vw; line-height: 2.441vw; margin-top: 1.953vw; }
    
    
    /*sub03-process*/
    .process { padding-bottom: 8.789vw;}
    .process_banner{ height: 37.109vw;}
    .inquiry { bottom: -5.859vw; right: 4.883vw; width: 57.617vw; height: 25.391vw; padding: 4.883vw 0 4.395vw; box-shadow: 0.000vw 0.000vw 1.953vw rgba(0,0,0,0.3);}
    .inquiry h3 { font-size: 2.441vw; }
    .inquiry p { font-size: 1.367vw; margin: 1.465vw 0 1.953vw;}
    .inquiry a.inquiry_btn { width: 19.531vw; height: 5.371vw; line-height: 5.371vw; font-size: 1.953vw; border-radius: 0.488vw;}
    .process_list { margin-top: 11.719vw; }
    .process_list > li { padding: 0 9.3475vw 0 3.3475vw;}
    .process_list > li:nth-child(2n+1) { padding: 0 3.3475vw 0 9.3475vw;}
    .process_list > li:nth-child(n+3){ margin-top: 4.883vw;}
    .process_list > li span { width: 4.883vw; height: 4.883vw; line-height: 4.883vw; font-size: 2.148vw;  }
    .process_list_desc { margin-left: 7.813vw; }
    .process_list_desc h3 { font-size: 1.953vw; padding-bottom: 0.977vw; }
    .process_list_desc_list { margin-top: 1.465vw;}
    .process_list > li:nth-child(6) .process_list_desc_list { min-height: 9.375vw;}
    .process_list_desc_list li{ padding-left: 1.465vw; font-size: 1.367vw; line-height: 2.344vw; }
    .process_list_desc_list li:before{content:""; top: 0.977vw; width: 0.391vw; height: 0.391vw; }
    
    
    
    /*sub04-contact*/
    .contact_top { height: 37.4335vw;}
}

@media screen and (max-width: 768px){
    .br_m { display: block;}
    .inner { padding: 0 2.604vw;}  

    
    /*intro*/
    .side-navi-list { width: 60%;}
    .side-navi-list li img { width: 100%;}
    
    
    /*main*/
    #header { }
    #header .inner { height: 18.229vw;}
    #header h1 { top: 2.604vw; left: 2.604vw; }
    #header h1 a img { height: 11.719vw; }
    .gnb { display: none;}
    .menu_btn { position: absolute; top: 6.120vw; right: 2.604vw; width: 4.297vw; height: 4.818vw; background: url(/img/menu_btn.png) no-repeat; background-size: cover; display: block;}
    #lnb_wrap { position: fixed; top: 0; right: 0; width: 100%; height: 100vh; background: rgba(0,0,0,.8); z-index: 100;}
    #lnb_wrap.active { display: block;}
    #lnb_wrap .inner { position: absolute; top: 0; right: 0; width: 78.125vw; height: 100vh; background: #fff; padding: 0 2.604vw;}
    .lnb_logo { margin: 2.604vw 0 0 1.302vw; }
    .lnb_logo a { display: block;}
    .lnb_logo a img { height: 12.109vw;}
    .lnb { margin-top: 9.766vw; border-bottom: 0.130vw solid #d1d1d1;}
    .lnb > li { padding: 4.557vw 0 4.557vw 3.906vw; border-top: 0.130vw solid #d1d1d1;}
    .lnb > li > a { position: relative; display: block; font-size: 3.125vw; line-height: 1; color: #ccc;}
    .lnb > li > a:before { content: ''; position: absolute; top: 0.651vw; right: 2.604vw; width: 3.255vw; height: 1.693vw; background: url(/img/menu_arrow.png) no-repeat; background-size: cover;}
    .lnb > li > a.active { color: #7d7d7d; }
    .lnb > li > a.active:before { content: ''; transform: rotate(180deg);}
    .lnb_dep2 { display: none;}
    .lnb_dep2 li { margin-top: 4.557vw; padding-left: 2.604vw; font-size: 2.865vw; color: #000;}

    .menu_close_btn { position: absolute; top: 5.208vw; right: 2.604vw; width: 3.906vw; height: 3.646vw; background: url(/img/lnb_close_btn.png) no-repeat; background-size: cover; }

    #visual { }
    .visual_slide img { display: none; }
    .visual_slide .slick-slide img.tab { display: none;}
    .visual_slide .slick-slide img.m { display: block;}

    #footer { padding: 5.859vw 0 6.510vw; font-size: 2.865vw; }
    #footer address span { margin: 0 1.302vw}
    #footer .copyright { margin-top: 3.906vw;}
    
    
    /*sub01-company*/
    .sub_content_wrap { padding-top:5.208vw; }
    .sub01.inner { padding: 0;}
    .sub_tit h2 { font-size: 3.906vw; }
    .sub_content { margin-top: 4.557vw; }
    .introduction { height: 93.750vw; background: url(/img/sub01_bg_mob.jpg) no-repeat center top; background-size: cover;}
    .intro_txt { top: 24.740vw; width: 100%; padding: 0 9.115vw; }
    .intro_txt h3 { position: static; font-size: 3.385vw; }
    .intro_desc { margin-top: 8.464vw;}
    .intro_desc strong { font-size: 3.125vw;}
    .intro_desc p { font-size: 2.604vw; line-height: 3.906vw; margin-top: 3.255vw; font-weight: 300;}
    .intro_desc p i { display: none;}
    
    
    /*sub03-process*/
    .process { padding-bottom: 15.625vw;}
    .process_banner{ height: 49.479vw; }
    .inquiry { bottom: -7.813vw; left:0; right:0; margin: 0 auto; width: 80%; height: 33.854vw; padding: 6.510vw 0 5.859vw; box-shadow: 0.000vw 0.000vw 2.604vw rgba(0,0,0,0.3); }
    .inquiry h3 { font-size: 3.385vw;}
    .inquiry p { font-size: 2.204vw; margin: 1.953vw 0 2.604vw;}
    .inquiry a.inquiry_btn { width: 26.042vw; height: 7.161vw; line-height: 7.161vw; font-size: 2.604vw; border-radius: 0.651vw;}
    .process_list { margin-top: 19.531vw; }
    .process_list > li { float: none; width: 100%; padding: 0 6.510vw;}
    .process_list > li:nth-child(2n+1){ padding: 0 6.510vw;}
    .process_list > li:nth-child(n+2){ margin-top: 11.719vw;}
    .process_list > li span { width: 7.813vw; height: 7.813vw; line-height: 7.813vw; font-size: 2.865vw; }
    .process_list_desc { margin-left: 11.719vw; }
    .process_list_desc h3 { font-size: 3.385vw; padding-bottom: 1.302vw;}
    .process_list_desc_list { margin-top: 1.953vw;}
    .process_list > li:nth-child(6) .process_list_desc_list { min-height: auto;}
    .process_list_desc_list li{ padding-left: 1.953vw; font-size: 2.5vw; line-height: 4.0vw;}
    .process_list_desc_list li:before{content:""; top: 1.5vw; width: 0.521vw; height: 0.521vw; }
    
    
    /*sub04-contact*/
    .contact { padding-bottom: 9.701vw;}
    .contact_top { height: auto;}
    #map { float: none; width: 100%; height: 95.910vw;}
    .contact_img { float: none; width: 100%; height: 102.2727vw;}
    .contact_add { margin: 7.463vw auto 0; width: 88.060vw; color: #010103;}
    .contact_logo { position: relative; float: left; }
    .contact_logo:before { content:""; position: absolute; top: 50%; right: -5.224vw; transform: translateY(-50%); width: 0.149vw; height:90%; background: #ccc;}
    .contact_logo em { font-size: 2.985vw; line-height: 1; vertical-align: top; font-style: normal;}
    .contact_logo .address_logo { display: inline-block; height: 8.955vw; vertical-align: top; margin-left: 2.985vw;}
    .contact_info { float: left; margin-left: 10.448vw; }
    .contact_info p { font-size: 2.388vw; line-height: 1; color: #333;}
    .contact_info p:before { content: ""; display: inline-block; width: 1.940vw; height: 2.836vw; background: url(/img/ico_location.png) no-repeat; background-size: cover; vertical-align: middle; margin-right: 1.493vw;}
    .contact_info span { display: block; font-size: 2.090vw; line-height: 1; color: #4b4b4b; margin-top: 1.493vw; padding-left: 3.731vw;}
}