@charset "utf-8";


@media screen and (min-width:640px){


/*메인*/
#scroll_btnWrap {position:absolute; top:300px; right:120px; z-index:2; }
#scroll_btnWrap #slideBtn { float:right; font-size:18px; }
#scroll_btnWrap #slideBtn li {padding-top:10px; }
#scroll_btnWrap #slideBtn li.active a {color:#fff;}

body {overflow-y:hidden;} /* 최초 로딩 시 스크롤바가 반짝 나타났다 사라지는 현상때문에 화면이 깜빡거려서 추가함 */
html,body,#fullpage { height:100%; }
#fullpage { text-align:center;}
#section0 {}
#section0 .bg1 { background:url('../img/landing/bg01.jpg') no-repeat center center; background-size:cover; }
#section1 { background:url('../img/landing/bg02.jpg') no-repeat center center; background-size:cover; }
#section2 { background:url('../img/landing/bg03.jpg') no-repeat center center; background-size:cover;}
#section3 { background:url('../img/landing/bg04.jpg') no-repeat center center; background-size:cover;position:relative;}

.page_Title h1{font-family:'Noto Sans KR'; font-size:48px; color:#fff; font-weight:600;}
.page_Title p {font-size:20px; color:#fff; margin-top:10px;}

#section0 .contentsSection {width:1440px; margin:auto; height:100%;}
.text_section {margin-top:180px; text-align:center; float:right; background:url(../img/landing/bg01_tit_bg.png) no-repeat top center; padding:180px 80px 140px 50px; }
.sec0_txt {font-size:46px; color:#fff;}
.sec0_tit {-font-family:'Noto Sans KR'; font-size:78px; color:#fff; letter-spacing:-1px; font-weight:600;}
.sec0_txt02 {-font-family:'Noto Sans KR'; font-size:30px; color:#fff; line-height:46px; margin:20px 0 40px;}
.sec0_btn {font-size:20px; margin-top:40px;}
.sec0_btn a {color:#fff; border:1px solid #fff; display:inline-block; padding:14px 58px 14px 37px; background:url(../img/landing/btn_arrow.png) no-repeat 220px center; opacity: 0.7;}

#section1 .contentsSection {width:1200px; margin:0 auto;}
#section1 ul {overflow:hidden;}
#section1 ul li {float:left; text-align:center;}
#section1 ul.department01 {width:100%; margin:0 auto;}
#section1 ul.department01 li {width:25%; margin:120px 0 30px;}
#section1 ul.department02 {width:80%; margin:0 auto;}
#section1 ul.department02 li {width:33.333%;}
#section1 ul li a {color:#fff; font-size:18px; font-weight:bold; display:inline-block; width:100%; padding-top:220px;}
#section1 ul li.fir a {background:url(../img/landing/department01.png) no-repeat center top;}
#section1 ul li.sec a {background:url(../img/landing/department02.png) no-repeat center top;}
#section1 ul li.thi a {background:url(../img/landing/department03.png) no-repeat center top;}
#section1 ul li.for a {background:url(../img/landing/department04.png) no-repeat center top;}
#section1 ul li.fiv a {background:url(../img/landing/department05.png) no-repeat center top;}
#section1 ul li.six a {background:url(../img/landing/department06.png) no-repeat center top;}
#section1 ul li.sev a {background:url(../img/landing/department07.png) no-repeat center top;}

#section2 .contentsSection {width:1200px; margin:0 auto;}
#section2 .guide {overflow:hidden; background:rgba(0,0,0,0.2); margin-top:60px;}
section2 .guide li {float:left; text-align:center; background:url(../img/landing/guide_line.png) no-repeat left center; width:20.3%;}
#section2 .guide li {float:left; text-align:center; width:18%;}
#section2 .guide li.line {background:url(../img/landing/guide_line.png) no-repeat left center; width:2.5%; padding:215px 0;}
#section2 .guide li a {color:#fff; font-size:14px; line-height:22px; display:inline-block; width:100%; padding:235px 0 80px;}
#section2 .guide li a span {display:block;}
#section2 .guide li a span.tit {font-family:'Noto Sans KR'; font-size:20px; font-weight:400; letter-spacing:-1px; margin-bottom:25px; display:inline-block;}
#section2 .guide li.fir a {background:url(../img/landing/guide01.png) no-repeat center 92px;}
#section2 .guide li.sec a {background:url(../img/landing/guide02.png) no-repeat center 97px;}
#section2 .guide li.thi a {background:url(../img/landing/guide03.png) no-repeat center 92px;}
#section2 .guide li.for a {background:url(../img/landing/guide04.png) no-repeat center 113px;}
#section2 .guide li.fiv a {background:url(../img/landing/guide05.png) no-repeat center 100px;}


#section3 {overflow:hidden;}
#section3 .leftBg {float:left; width:50%; background:url(../img/landing/last_text_bg01.png) no-repeat left center;}
#section3 .rightBg {float:right; width:50%; background:url(../img/landing/last_text_bg02.png) no-repeat right center;}
#section3 .leftBg .textSection {text-align:left; float:right; margin-right:30%;}
#section3 .rightBg .textSection {text-align:right; float:left; margin-left:25%;}
#section3 .textSection {padding:45px 0 65px;}
#section3 .textSection h1 {font-family:'Noto Sans KR'; font-size:46px; color:#fff; font-weight:400;}
#section3 .textSection h2 {font-family:'Noto Sans KR'; font-size:22px; color:#fff; opacity:0.7; font-weight:200; margin:15px 0 35px; letter-spacing:-1px;}
#section3 .textSection h2 span {display:block;}
#section3 .textSection p a {border:1px solid #fff; display:inline-block; padding:15px 58px; color:#fff; opacity:0.7;}

.copyWrap { width:100%; height:100px; background:#303030; position:absolute; bottom:0; padding-top:40px; overflow:hidden; }
.copyright { width:1200px; margin:0 auto; color:#e2e2e2;; font-size:14px; line-height:24px; overflow:hidden;}
.copyright .add { float:left;}
.copyright .add p {text-align:left;}

.copyright .tel {float:right; font-family:"Nanum Square"; font-size:18px; text-align:left;}
.copyright .tel span { font-size:30px; color:#7fc343; margin-top:10px; display:block;}

}

@media screen and (max-width:639px){

#scroll_btnWrap {position:absolute; top:20px; left:20px; z-index:2; }
#scroll_btnWrap #slideBtn { float:right; font-size:15px; }
#scroll_btnWrap #slideBtn li {float:left; padding-right:5px; }
#scroll_btnWrap #slideBtn li.active a {color:#fff;}

body {overflow-y:hidden;} /* 최초 로딩 시 스크롤바가 반짝 나타났다 사라지는 현상때문에 화면이 깜빡거려서 추가함 */
html,body,#fullpage { height:100%; }
#fullpage { text-align:center;}

.page_Title h1{font-family:'Noto Sans KR'; font-size:2.1em; color:#fff; font-weight:600;}
.page_Title p {font-size:1.2em; color:#fff; margin-top:10px;}

#section0 .bg1 { background:url('../img/landing/m_bg01.jpg') no-repeat center center; background-size:cover;}
.text_section {width:100%; text-align:center; }
.sec0_txt {font-size:1.1em; color:#fff;}
.sec0_tit {font-family:'Noto Sans KR'; font-size:3.1em; color:#fff; letter-spacing:-1px; font-weight:600;}
.sec0_txt02 {font-family:'Noto Sans KR'; font-size:1.3em; color:#fff; line-height:1.4em; margin:20px 0 40px;}
.sec0_btn {font-size:15px;}
.sec0_btn a {color:#fff; border:1px solid #fff; display:inline-block; padding:14px 58px 14px 37px; background:url(../img/landing/btn_arrow.png) no-repeat 170px center; opacity: 0.7;}

#section1 { background:url('../img/landing/m_bg02.jpg') no-repeat center center; background-size:cover; padding:0 10px;}
#section1 ul {overflow:hidden;}
#section1 ul li {float:left; text-align:center;}
#section1 ul.department01 {width:80%; margin:40px auto 0;}
#section1 ul.department01 li {width:33.333%; margin:0 0 20px;}
#section1 ul.department02 {width:80%; margin:0 auto;}
#section1 ul.department02 li {width:33.333%;}
#section1 ul li a {color:#fff; font-size:1.1em; font-weight:bold; display:inline-block; width:85%; padding-top:90px;}
#section1 ul li.fir a {background:url(../img/landing/department01.png) no-repeat center top; background-size:100%;}
#section1 ul li.sec a {background:url(../img/landing/department02.png) no-repeat center top; background-size:100%;}
#section1 ul li.thi a {background:url(../img/landing/department03.png) no-repeat center top; background-size:100%;}
#section1 ul li.for a {background:url(../img/landing/department04.png) no-repeat center top; background-size:100%;}
#section1 ul li.fiv a {background:url(../img/landing/department05.png) no-repeat center top; background-size:100%;}
#section1 ul li.six a {background:url(../img/landing/department06.png) no-repeat center top; background-size:100%;}
#section1 ul li.sev a {background:url(../img/landing/department07.png) no-repeat center top; background-size:100%;}

#section2 { background:url('../img/landing/m_bg03.jpg') no-repeat center center; background-size:cover; padding:0 10px;}
#section2 .guide {overflow:hidden; background:rgba(0,0,0,0.2); margin-top:30px;}
#section2 .guide li {float:left; text-align:left; width:49.5%;}
#section2 .guide li.line {display:none;}
#section2 .guide li a {color:#fff; font-size:1.1em; display:inline-block; padding:20px 0 20px 50px;}
#section2 .guide li a span {display:none;}
#section2 .guide li a span.tit {font-family:'Noto Sans KR'; font-size:1.1em; font-weight:400; letter-spacing:-1px; display:inline-block;}
#section2 .guide li.fir { border-right:1px solid #999; border-bottom:1px solid #999;}
#section2 .guide li.sec {  border-bottom:1px solid #999;}
#section2 .guide li.thi { border-right:1px solid #999; border-bottom:1px solid #999;}
#section2 .guide li.for {  border-bottom:1px solid #999;}
#section2 .guide li.fiv {border-right:1px solid #999;}
#section2 .guide li.fir a {background:url(../img/landing/guide01.png) no-repeat 20px center; background-size:17%;}
#section2 .guide li.sec a {background:url(../img/landing/guide02.png) no-repeat 20px center; background-size:17%;}
#section2 .guide li.thi a {background:url(../img/landing/guide03.png) no-repeat 20px center; background-size:17%;}
#section2 .guide li.for a {background:url(../img/landing/guide04.png) no-repeat 20px center; background-size:17%;}
#section2 .guide li.fiv a {background:url(../img/landing/guide05.png) no-repeat 20px center; background-size:17%;}
/*
#section2 { background:url('../img/landing/m_bg03.jpg') no-repeat center center; background-size:cover;}
#section2 .guide {overflow:hidden; background:rgba(0,0,0,0.2); margin-top:30px;}
#section2 .guide li { text-align:center; padding:5px 20px;}
#section2 .guide li.line {border-bottom:1px solid #dedede; height:1px; opacity:0.1; padding:0;}
#section2 .guide li a {color:#fff; font-size:1.1em; display:inline-block; width:100%; padding-left: 50px;}
#section2 .guide li a span {display:none;}
#section2 .guide li a span.tit {font-family:'Noto Sans KR'; font-size:1.3em; font-weight:400; letter-spacing:-1px; display:inline-block;}
#section2 .guide li.fir a {background:url(../img/landing/guide01.png) no-repeat left center; background-size:10%;}
#section2 .guide li.sec a {background:url(../img/landing/guide02.png) no-repeat left center; background-size:10%;}
#section2 .guide li.thi a {background:url(../img/landing/guide03.png) no-repeat left center; background-size:10%;}
#section2 .guide li.for a {background:url(../img/landing/guide04.png) no-repeat left center; background-size:10%;}
#section2 .guide li.fiv a {background:url(../img/landing/guide05.png) no-repeat left center; background-size:10%;}
*/


#section3 { background:url('../img/landing/m_bg04.jpg') no-repeat center center; background-size:cover;position:relative;overflow:hidden;}
#section3 .leftBg {width:100%; overflow:hidden;}
#section3 .rightBg {width:100%;}
#section3 .leftBg .textSection {width:70%; text-align:left; float:left; margin-bottom:30px; padding:10px; background:url(../img/landing/last_text_bg01.png) no-repeat right center ;}
#section3 .rightBg .textSection {width:70%; text-align:right; float:right; margin-bottom:140px; padding:10px; background:url(../img/landing/last_text_bg02.png) no-repeat right center;}
#section3 .textSection {}
#section3 .textSection h1 {font-family:'Noto Sans KR'; font-size:1.5em; color:#fff; font-weight:400;}
#section3 .textSection h2 {font-family:'Noto Sans KR'; font-size:1em; color:#fff; opacity:0.7; font-weight:200; margin:10px 0 10px; letter-spacing:-1px;}
#section3 .textSection h2 span {font-weight:400;}
#section3 .textSection p a {border:1px solid #fff; display:inline-block; padding:5px 40px; color:#fff; opacity:0.7;}

.copyWrap { width:100%; background:#303030; position:absolute; bottom:0; overflow:hidden; padding:20px 0;}
.copyright { color:#e2e2e2; font-size:0.85em; overflow:hidden; letter-spacing:-1px;}
.copyright .add p {text-align:left; margin-bottom:5px; padding-left:10px;}
.copyright .add p span {display:block;}

.copyright .tel {font-family:"Nanum Square"; font-size:1.2em; text-align:left; padding-left:10px;}
.copyright .tel span { font-size:1.5em; color:#7fc343; margin-left:10px; display:inline-block; }

#popup {display:none;}

}