*{margin:0; padding:0;} li{list-style: none;} a{text-decoration: none;}
img{vertical-align: top;}

.wrap {width:1100px; margin:0 auto; position:relative;}
.wrap:after, ul:after {content: ""; display: block; clear:both;}
body, header {font-family: 'NanumSquare'; height:100%;}
body {background:#fafafa;}
section {height:100%;}
h2 {position:absolute; left:-9999px;}



/* header 영역 */
header {height:75px;overflow: hidden; transition:0.3s;position:fixed; z-index: 99; width:100%;background:#fff;}
header .logo {position:absolute; left:0; top:23px; }
header #gnb {position:absolute; right:50px; top:6px;}
header #gnb li {float:left; margin-right:50px; font-size:24px; }
header #gnb .event{margin-right:20px;}
header #gnb li a{color:#000;}
header .yellow {font-size:18px; color:#000; background:#ffdf22; border-radius: 20px; padding:10px 20px; font-weight: bold; position:relative; top:22px;}
header.on {height:230px; background:#fff;}

header #gnb  li span {font-weight: bold; font-size:18px;}
header #gnb  li a {font-size:18px; line-height:65px; color:#000;}
header #gnb > li > ul > li{float: none; margin: 0;height:30px; padding-top:10px;}
header #gnb li .sub {font-size:16px;}
header #ie {background:#000; height:3px; width:20px; position: absolute; top:66px; opacity:0; }


/* section 영역 */
#main {background:#64b06f; height:700px; position:relative;}
#main .wrap{height:550px;}
#main h3 {font-size:36px; padding-top:20px; line-height:1.4;color:#fff; text-align: center; position:relative; left:500px; opacity: 0;}
#main p {font-size:20px; padding-top:230px; color:#fff; display:block; text-align: center; position:relative; top:-400px; opacity: 0;}
#main ul {padding-top:50px;}
#main ul li { margin-left:280px;}


#sec1 {margin-top:100px; position:relative; background:#fff5f1;}
#sec1 .wrap{height: 600px;}
#sec1 h3 { text-align:left; font-size:38px; padding-top:150px;}
#sec1 p {text-align:left; font-size:20px; line-height:1.6;padding-top:50px;}
#sec1 .phone {position:absolute; right:-50%; top:45px; opacity: 0; transition:0.5s;}
#sec1 .phone.on {right:50px; opacity: 1;}


#sec2 { background: #eff8fb; margin-top:100px;}
#sec2 .wrap{height: 650px;}
#sec2 img {position:absolute; left:220px; top:50px;}
#sec2 h3 {font-size:38px; padding-top:180px; text-align: right; margin-right:50px;}
#sec2 p {padding-top:80px; display: block; font-size:20px; text-align: right; line-height:1.6; margin-right:50px;}
#sec2 .radias1 {position:absolute; left:-50%; top:150px; opacity: 0;}
#sec2 .radias1.on {left:0; opacity: 1; transition:0.5s;}
#sec2 .radias2 {position:absolute; left:-80%; top:330px; transition:0.5s;}
#sec2 .radias2.on {left:120px; opacity: 1;}

#sec3 {background:#fdfce9; height:700px; margin-top:100px;}
#sec3 img {position:absolute; right:50px; top:-50%; opacity: 0; transition:0.5s;}
#sec3 img.on {top:40px; opacity: 1;}
#sec3 h3 {text-align: left; font-size:38px; line-height:1.5; padding-top:180px;}
#sec3 p { text-align: left; font-size:20px; line-height:1.6; padding-top:50px;}

#sec4 {background:#fff;height:600px; margin-top:100px;}
#sec4 img {position:absolute; left:-50%; top:100px; opacity: 0; transition:0.5s;}
#sec4 img.on {opacity: 1; left:0;}
#sec4 h3 {font-size:38px; padding-top:120px; text-align: right; margin-right:50px; line-height:1.5;}
#sec4 p {padding-top:70px; display: block; font-size:20px; text-align: right; line-height:1.6; margin-right:50px;}


#sec5 {background:url("../images/sub2_bank.png")no-repeat center; height:650px; margin-top:100px;}
#sec5 h3 {text-align: center; padding-top:280px; font-size:36px; color:#fff; opacity: 0; position:relative; top:-300px; transition:0.5s;}
#sec5 h3.on {opacity: 1; top:0;}
#sec5 p { text-align: center; color:#fff; font-size:18px; line-height:1.8; padding-top:50px;}
#sec5 span {font-size:16px; color:#aaa; display: block; text-align: center; padding-top:170px;}


#sec6 {background:#f1f1f1; height:550px; margin-top:100px;}
#sec6 h4 {font-size:32px; text-align: center; color:#000; padding-top:80px; margin-bottom:30px;}
#sec6 p {color:#666; font-size:14px; position:absolute; right:20px; bottom:-100px;}
#sec6 ul li { float:left; margin:8px 8px; opacity: 0;}


footer {background:#292b38; height:255px; margin-top:50px;}
footer .ft {width:480px; padding-top:50px;}
footer .ft li {float:left; margin-right:15px; text-align: left; margin-bottom:30px; font-size:16px;}
footer .ft li a{color:#ddd; }
footer address {color:#eee; font-size:16px; font-weight: bold; font-style: normal; position:absolute; right:0; top:53px;}
footer p {color:#eee; font-size:16px; position:absolute; right:0; top:83px;}
footer img {position:absolute; right:0; bottom:10px; width:60px;}








@media (max-width:480px) { /* 모바일용 */
    .pc {display:none !important;}
.wrap{width:100%;}
body {height:100%;}
header {height:67px; width:100%; position:relative; background:#fff;}
header .logo {position:absolute; left:8px; top:25px;}
header .logo img{width: 100px;}
header #menu {position:absolute; right:8px; top:23px;}
header #menu img {width:30px;}

    header nav {position:fixed; height:230px; width:170px; right:-200px; top:50px; transition:0.5s; background:#fff;}
    header nav.on {right:0;}
    header nav li {font-size:16px; padding-top:20px; font-weight: bold; margin-left:30px;}
    header nav li a{color:#000;}
        nav li:first-child {padding-top:40px;}
    
#main {height:350px;}
#main .wrap{height:350px;}
#main h3 {font-size:24px; padding-top:10px; }
#main p {font-size:14px; padding-top:60px;}
#main ul {padding-top:30px;}
#main ul li { margin-left:8px;}
    #main ul li img {width:96%;}

#sec1 {margin-top:35px; height:350px;}
#sec1 .wrap{height:350px;}
#sec1 h3 {font-size:26px; padding-top:100px; margin-left:8px; line-height:1.5;}
#sec1 .phone {position:absolute; right:8px; top:40px; width:50%;}    

#sec2 {margin-top:35px;}
#sec2 .wrap{height: 450px;}
#sec2 img {left:8px; top:10px; width:50%;}
#sec2 h3 {font-size:26px; padding-top:70px; margin-right:8px; line-height:1.5;}
#sec2 .radias1 {position:absolute; left:120px; top:150px; width:45%;}
#sec2 .radias2 {position:absolute; left:250px; top:250px; width:30%;}


#sec3 {height:300px; margin-top:35px;}
#sec3 img { right:8px; top:40px; width:50%;}
#sec3 h3 {font-size:22px;padding-top:100px; margin-left:8px;}

#sec4 {height:400px; margin-top:35px;}
#sec4 img {left:4px;top:140px; width:99%;}
#sec4 h3 {font-size:24px; padding-top:60px; text-align: center; margin-right:0;}


#sec5 {background:url("../images/sub2_bank.png")no-repeat center; height:580px; margin-top:35px;}
#sec5 h3 { padding-top:260px; font-size:24px;}
#sec5 p {font-size:15px; margin:0 8px;line-height:1.6; padding-top:30px;}
#sec5 span {font-size:14px;padding-top:100px; margin:0 8px;}


#sec6 {height:500px; margin-top:35px;}
#sec6 h4 {font-size:24px;padding-top:50px; margin-bottom:20px; font-weight: bold;}
#sec6 ul li {float:left;  margin-right:4px;width:169px;}
    #sec6 ul li img {width:95%;}
    
footer {height:200px; margin-top:35px;}
footer .ft {width:100%; padding-top:30px;}
footer .ft li {margin-right:15px;  margin-left:8px;margin-bottom:30px; font-size:10px; float:left; text-align: center;}
footer address {font-size:12px;top:110px; left:8px;}
footer p {font-size:10px;top:130px; left:8px;}
    
    
    
    
    
    
    
    
    
}
@media (min-width:801px) { /* PC용 */
    .mob {display:none !important;}
}