*{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; background:#fff; z-index: 99; width:100%;}
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;}

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:#ffdf22; height:750px; position:relative;}
#main .wrap{height: 720px;}
#main .han {position:absolute; right:-50%; top:110px; opacity: 0; transition: 0.5s;}
 h3 {font-size:40px; padding-top:200px; line-height:1.4; font-weight: bold;}
 p {font-size:20px; line-height:1.8; padding-top:20px;}
#main ul {padding-top:100px;}
#main ul li { font-size:18px; float:left; margin-right:20px;}



#sec1 {margin-top:200px; position:relative; background:#fff;}
#sec1 .wrap{height: 800px;}
#sec1 h3 {position:absolute;right:0; top:20px; text-align: right;}
#sec1 p {position:absolute; right:0; top:350px;text-align: right;}
#sec1 .phone {position:absolute; left:-50%; top:0; opacity: 0; transition:0.5s;}
#sec1 .phone.on { left:0; opacity:1; }
#sec1 a:link, #sec1 a:visited {color:#000; font-size:18px; background:#f0f0f0; padding:20px 30px; border-radius: 10px; position:absolute; right:0; top:500px;}
#sec1 a:hover, #sec1 a:active, #sec1 a:focus { background:#f4d925; color:#2D2500;}
#sec1 a .go {position:absolute; right:14px; top:22px;}

#sec2 {margin:0 auto; background: #ddedfd;}
#sec2 .wrap{height: 800px; margin-top:100px;}
#sec2 .phone2 {position:absolute; right:-50%; top:0; opacity:0; transition:0.5s;}
#sec2 .phone2.on {right:0; opacity:1;}
#sec2 p {padding-top:30px; display: block; margin-bottom:30px;}
#sec2 a:link, #sec2 a:visited {background:#fff; color:#000; font-size:20px; padding:20px 60px; border-radius: 10px; display: inline-block; margin-right:20px; margin-left:20px;}
#sec2 a:hover, #sec2 a:active, #sec2 a:focus {background:#417EC1; color:#fff;}
#sec2 ul {padding-top:40px; width: 700px;}
#sec2 ul li {float:left;display: flex; align-items: center; justify-content: center; flex-direction: column; margin-right: 20px;}
#sec2 ul li :first-child{padding-left: 15px;}
#sec2 ul li span {display: block; text-align: center; font-size:20px;padding-top:10px; margin-left:15px;}


#sec3 {background:#edf6fb; height:700px; margin-top:100px;}
#sec3 img {position:absolute; left:-50%; top:40px; opacity: 0; transition:0.5s;}
#sec3 img.on {left:0; opacity: 1;}
#sec3 h3 {text-align: right;}
#sec3 p {margin-bottom:40px; text-align: right;}
#sec3 a:link, #sec3 a:visited {background:#fff; color:#000; font-size:24px; padding:20px 50px; border-radius: 10px; position:absolute; right:0; top:500px;}
#sec3 a:hover, #sec3 a:active, #sec2 a:focus {background:#739297; color:#fff;}

#sec4 {background:#fef2f2;height:600px; margin-top:100px;}
#sec4 img {position:absolute; right:0; top:-50%; opacity: 0; transition:0.5s;}
#sec4 img.on {top:20px; opacity: 1;}
#sec4 a:link, #sec4 a:visited {background:#fff; color:#000; font-size:24px; padding:20px 50px; border-radius: 10px; position:absolute; left:0; top:430px;}
#sec4 a:hover, #sec4 a:active, #sec4 a:focus {background:#D6B9BE; color:#fff;}


#sec5 {background:#fff; height:750px; margin-top:100px;}
#sec5 img {position:absolute; left:0; top:150px; width:50%;}
#sec5 .phn {width:40%; position:absolute; left:-50%; top:20px; opacity: 0; transition:0.5s;}
#sec5 .phn.on {left:200px; opacity: 1;}
#sec5 a:link, #sec5 a:visited {background:#eee; color:#000; font-size:20px; padding:16px 50px; border-radius: 10px; position:absolute; right:0; top:550px;}
#sec5 a:hover, #sec5 a:active, #sec5 a:focus {
    background:#505C6E; color:#fff;}
#sec5 h3 {text-align: right; padding-top:120px;}
#sec5 p { text-align: right;}


#sec6 {background:#599cd3; height:750px; margin-top:100px;}
#sec6 h4 {font-size:36px; text-align: center; color:#fff; padding-top:80px; margin-bottom:15px;}
#sec6 span {display: block; color:#eee; font-size:20px; text-align: center;}
#sec6 ul {margin:0 auto;}
#sec6 ul li {float:left; background:rgba(255,255,255,0.6); width:220px; height:65px; border-radius: 20px; margin:40px 10px 0 0; display: block; text-align: center; line-height:65px; opacity: 0;}
#sec6 ul li:first-child {margin-left:85px;}
#sec6 li a {color:#011762; font-size:22px; display: inline-block; font-weight: bold;}
#sec6 img {position:absolute; left:350px; top:366px;}


#sec7 {background:#fff; height:700px; margin-top:100px; margin-bottom:100px;}
#sec7 img {margin-left:175px;}
#sec7 h3 {text-align: center; padding-top:50px;}
#sec7 p {text-align: center; display: block; margin-bottom:40px;}
#sec7 a:link, #sec7 a:visited {background:#eee; color:#000; font-size:18px; border-radius: 10px; margin-left:430px; line-height:50px; display: inline-block; height:50px; margin-bottom:30px; padding:5px 10px;}
#sec7 a:hover, #sec7 a:active, #sec7 a:focus{background:#f4d925; color:#2D2500; font-weight: bold;}


footer {background:#292b38; height:255px;}
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;}
header .logo {position:absolute; left:8px; top:25px;}
    header .logo img{width: 100px;}
header #menu {position:absolute; right:50px; top:23px;}
    header #menu img {width:30px; position:fixed; }
    
    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 {background:#ffdf22; height:400px; width:auto;}
    #main .wrap{height: 400px;}
#main .main1 {position:absolute; right:0; top:30px; width:50%;}
h3 {font-size:22px; padding-top:80px; margin-left:20px;}
#main ul {padding-top:20px; margin-left:15px;}
#main ul li { font-size:18px; float:none; padding-left:8px;margin-top:10px;}

#sec1 {padding-top:30px; position:relative; margin: 0;}
    #sec1 .wrap{height: 300px;}
#sec1 h3 {position:absolute; right:8px; top:-30px; font-size:20px;}
#sec1 .phone1 {position:absolute; left:4px; top:0; width:50%;}
#sec1 a {font-size:14px; padding:12px 20px; border-radius: 10px; position:absolute; right:8px; top:50px;}
#sec1 a .go {position:absolute; right:4px; top:11px;}
    
#sec2 {width:100%; background:#ccd;}
#sec2 .wrap{ padding-top:10px; height:315px; margin-top:35px;}
    #sec2 h3 {font-size:20px; margin-bottom:60px;}
#sec2 .phone2 {position:absolute;right:8px; top:0; width:45%;}
#sec2 a { font-size:16px; padding:12px 18px;  margin-left:15px; margin-right:0;}
    
#sec3 { height:320px; margin-top:35px;}
#sec3 .wrap {height:350px;}
#sec3 img { top:20px; width:50%;}
#sec3 h3 {font-size:20px; margin-right:8px;}
#sec3 p {margin-bottom:40px; }
#sec3 a {font-size:16px; padding:14px 24px; position:absolute; right:15px; top:200px;}    
    
#sec4 {height:300px; margin-top:35px;}
#sec4 .wrap {height:300px;}
#sec4 h3 {font-size:20px; margin-left:8px;}
#sec4 img {right:8px; top:60px; width:50%;}
#sec4 a { font-size:16px; padding:14px 24px;left:10px; top:185px;}    
    
#sec5 {height:350px; margin-top:35px;}
    #sec5 .wrap {height:350px;}
#sec5 img {top:50px; width:50%;}
#sec5 .phn {width:40%;left:40px; top:40px;}
#sec5 a {font-size:18px; padding:12px 30px; right:8px; top:220px;}
    #sec5 h3 {margin-right:8px; font-size:20px;}
#sec5 p {margin-bottom:20px; margin-top:10px;}    
    

#sec6 { height:420px; margin-top:35px;}
    #sec6 .wrap {height:420px;}
#sec6 h4 {font-size:18px; padding-top:35px; margin-bottom:20px;}    
#sec6 ul li { float:left;width:25%; height:40px; line-height:40px; border-radius: 10px;margin:10px 10px 0 0;}
#sec6 ul li:first-child, #sec6 ul li:nth-child(3) {margin-left:92px;}
#sec6 li a {font-size:12px;}   
#sec6 img {left:100px; top:211px; width:50%;}    
    
#sec7 { height:440px; margin-top:30px;}
#sec7 h3 {padding-top:30px; font-size:24px;}
#sec7 p { margin:5px 20px; font-size:16px;}
#sec7 a {font-size:16px; margin-left:115px;margin-bottom:30px; padding:5px 0;}
#sec7 img {width:100%; position:relative; left:190px;}
    
  
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;}
}