@charset "utf-8";

html {
  scroll-behavior: smooth !important;
}
body {background:#fff;}
.body_circle{position: fixed; left:0; top:0; opacity:0; border-radius: 50%;  z-index:9999999999999999999;will-change: transform; pointer-events:none; mix-blend-mode:difference;transition: 0.1s;  }
.circle_cur{position:relative; display:block; width:110px; height:110px; background:#ff4b40; border-radius:50%; transition: 0.3s; opacity:.85;/*animation:cir000 1s ease-in-out infinite;*/ opacity:.75;}
@keyframes cir000{
	0%{ filter:brightness(1);}
    70%{ filter:brightness(1);}
    100%{filter:brightness(1);}
}

.circle_cur:before {content:'scroll';    display:block; text-align:center; line-height:105px; color:#000; font-size:17px; font-weight:700; letter-spacing: 1px; animation:cir001 1s ease-in-out infinite; ;}
@keyframes cir001{
	0%{ line-height:105px; letter-spacing:0px;}
    70%{ line-height:115px; letter-spacing:0px;}
    100%{ line-height:105px; letter-spacing:0px;}
}
.m_over { transform: scale(0.14); transition: 0.3s ease-in-out; background:#ff4b40; }
.m_over:after {content:''; display:block; width:110px; height:110px; border-radius:50%; background:#ff4b40;animation:cir002 1s ease-in-out infinite; transition: 0.3s;}
@keyframes cir002{
	0%{ transform:scale(1); opacity:1;}
    70%{ transform:scale(3); opacity:0;}
    100%{ transform:scale(3); opacity:0;}
}
.m_over:before {content:''; display:block; width:110px; height:110px; border-radius:50%; background:#ff4b40;animation:cir003 1s ease-in-out infinite; animation-delay: 0.1s; position:absolute; left:0; top:0; transition: 0.3s;}
@keyframes cir003{
	0%{ transform:scale(1); opacity:1;}
    70%{ transform:scale(2.3); opacity:0;}
    100%{ transform:scale(2.3); opacity:0;}
}


html.lenis, html.lenis body {
  height: auto;
}

.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis-stopped {
  overflow: hidden;
}

.lenis-scrolling iframe {
  pointer-events: none;
}


#hd_login_msg {display:none;}
#wrap{position:relative; min-width:320px;width:100%;}
#hd_pop {position:absolute; left:-300px; top:-300px;}

.opacityAni{opacity:0;}
.opacityAni.is-inview{animation-name: opacityAni; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); animation-duration: 1s; animation-fill-mode: forwards;}
.textMotion{opacity:0;}
.textMotion.is-inview{animation-name: letterspacingTxt; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); animation-duration: 1s; animation-fill-mode: forwards;}
.fadeUp{opacity:0;}
.fadeUp.is-inview{animation-name: fadeUp; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); animation-duration: 1s; animation-fill-mode: forwards;}
.fadeLeft{opacity:0;}
.fadeLeft.is-inview{animation-name: fadeLeft; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); animation-duration: 1s; animation-delay:0.1s; animation-fill-mode: forwards;}
.fadeLeft2{opacity:0;}
.fadeLeft2.is-inview{animation-name: fadeLeft2; animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); animation-duration: 1.5s; animation-delay:0.1s; animation-fill-mode: forwards;}


.m_scroll {position:fixed; left:-33px; bottom:130px; z-index:11; height:56px; padding-left:26px; color:#aaa; font-size:13px; line-height:56px; transform: rotate(90deg) scale(0.97); letter-spacing: 0; transition: 0.3s;}
.m_scroll:after {content:''; display:block; width:60px; height:1px; background:#aaa; position:absolute; left:126px; top:50%; animation:scroll_circle1 2s ease-in-out infinite;}
@keyframes scroll_circle1{
	0%{  left:126px;}
 	60%{ left:131px;}
}    
.m_scroll i { width:13px; height:13px; box-sizing:border-box; border-radius:30px; background:#ff0000; position:absolute; right:-22px; top:22px; z-index:-1;animation:scroll_circle2 2s ease-in-out infinite; opacity:0; z-index:2;}
.m_scroll i:before {content:''; display:block; width:5px; height:5px; border-radius:5px; background:#fff; margin:4px;}
@keyframes scroll_circle2{
	0%{  right:-22px; transform: scale(0); opacity:0;}
	20% { transform: scale(1); opacity:1;}
	60% { transform: scale(1); opacity:1;}
 	80%{ right:-74px; transform: scale(0);  opacity:0;}
}
.fp-viewing-mainfooter .m_scroll , .fp-viewing-mainfooter .main__control {opacity:0;}


#wrap{position:relative; min-width:320px; width:100%;  }

::selection { background:#00b4bf; color:#fff;}

body::-webkit-scrollbar{width: 6px;}
body::-webkit-scrollbar-thumb{background-color:#00b4bf ; transition:all 0.2s; }
body::-webkit-scrollbar-track{background-color:#f0f0f0;}


.fix_right {position:fixed; z-index:111; right:15px; bottom:20px; transition:1s; display:flex; transition:0.5s; filter:invert(1); mix-blend-mode: difference;}
.fix_right a {display:block; overflow:hidden;}


.btn_cus {position:relative; width:70px; height:70px; display:block;}
.btn_cus span { display:block; width:70px; height:70px; border-radius:100px; background:#122ea7 url(../images/common/cus.png) no-repeat center center; overflow:hidden; text-indent:-999px; position:relative; z-index:2; transition: 0.3s;animation:eye2 2s ease-in-out infinite; }
@keyframes eye2{
	0%{   background-size:34px 33px; background-position:center 50%;}
    20%{  background-size:34px 33px; background-position:center 56%;}
    40% { background-size:34px 33px; background-position:center 50%;}
}
.btn_cus span:hover {box-shadow:0px 0px 10px rgba(0,0,0,0.35); filter:brightness(1.05);}
.btn_cus span:before {content:''; display:block; width:6px; height:4px; position:absolute; left:28px; top:30px; background:#122ea7;animation:eye 2s ease-in-out infinite; opacity:0;}
@keyframes eye{
	0%{   opacity:0; height:4px;}
    20%{  opacity:1; height:5px;}
    40% { opacity:0; height:4px;}
}
.btn_cus:before {content:''; display:block; width:70px; height:70px; border-radius:100px; background:#122ea7; animation:cus01 2s ease-in-out infinite; position:absolute; left:0; top:0;   }
@keyframes cus01{
	0%{  transform: scale(1); opacity:1;}
    50%{ transform: scale(1.1); opacity:0;}
    100% {transform: scale(1); opacity:0;}
}
.btn_cus:after {content:''; display:block; width:70px; height:70px; border-radius:100px; background:#122ea7; animation:cus02 2s ease-in-out infinite; position:absolute; left:0; top:0; animation-delay: 0s;  }
@keyframes cus02{
	0%{  transform: scale(1); opacity:1;}
    50%{ transform: scale(1.35); opacity:0;}
    100% {transform: scale(1); opacity:0;}
}
/* 헤더 Logo */
#header{position:fixed; top:0; left:0; right:0; height:100px;z-index:31;  transition:0.3s; z-index:1111111111; background:rgba(255,255,255,0); }
#header:hover {background:rgba(255,255,255,1);}
#header .area_logo{ position:absolute; left:50px; top:0; height:100%; }
#header .area_logo:after{content:''; display:block; clear:both;}
#header .area_logo .logo{  transition: 0.3s ease-out;display:flex; height:100%; align-items: center;   position:relative; z-index:24;}
#header .area_logo .logo a{display:block; width:166px; height:44px; overflow:hidden;  transition:0.3s;}
#header .area_logo .logo img{ display:block;}
#header .area_logo .logo img:first-child {margin-top:0;}
#header .area_logo .visit{float:right; margin:8px 0 0;}
#header .area_logo .visit a{display:block; height:47px; padding:13px 0 0 53px; background:url(../images/common/ico_dream.png) no-repeat 0 0; font-size:16px; color:#004bb8; letter-spacing:-2px;}
#header .area_logo .visit a strong{font-size: 18px;}

/* 헤더 GNB */
#header .gnb_wrap{position:absolute; left:0; right:0; top:0;}
#header .gnb_wrap > .inr{ }
#header .gnb_wrap > .inr:after{content:''; display:block; clear:both;}
#header .gnb_wrap .gnb_sitemap{ float:right; margin-top:-81px;}
#header .gnb_wrap .gnb_sitemap a{display:block; position:relative;width:30px; height:22px; background:url(../images/common/btn_header_wv.png) no-repeat; overflow:hidden; text-indent:-999px;}

#header #gnb{  transition: 0.3s ease-out; position:relative; z-index:23;  display:flex; justify-content:flex-end; padding-right:140px;}
#header #gnb:after{content:''; display:block; clear:both;}
#header #gnb a{display:block;}
#header #gnb > li{float:left;}
#header #gnb > li > a{display:block; position:relative; font-weight:400; font-size:20px;padding:0 40px; line-height:100px; color:#000; text-align:center; letter-spacing:-2px; white-space:nowrap;}
#header #gnb > li > a span {font-size:20px;}
#header #gnb > li > a > span{display:inline-block; position:relative; padding:0 6px; line-height:1.5; }
#header #gnb > li.active > a span {color:#00b4bf; font-weight:500;}
/*#header #gnb > li > a:before { content:''; display:block; width:0; height:5px; background:#267cda; position:absolute; left:10px; bottom:0;  transition:0.3s;}
#header #gnb > li.active > a:before { width:32px;}*/
.move-area {position:absolute; top:84px; width:10px; height:10px; margin-left:14px; background:#267cda; transition: 0.3s ease-in-out; border-radius:10px; opacity:0; z-index:42;}
.open .move-area {opacity:1;}
/* 2차 */
#header #gnb > li > div{display:block;  position:absolute; top:100px; height:0; overflow:hidden; visibility:hidden; left:0px; right:0; z-index:31; background:#fff; transition: 0.5s; height:0 !important;  }
#header #gnb > li > div:before{ content:''; display:none; position:absolute; left:0; top:0; width:35%; bottom:0; background:#000;}
#header #gnb > li.open > div:before {display:block;}
#header #gnb > li.active > div{display:block; opacity:1; visibility:visible; z-index:32; height:auto; transition: 0.5s; background:#fff; height:340px !important; }
#header #gnb > li  h2 { position:absolute; left:0; top:0px; width:35%; bottom:0;  background:url(../images/common/sub_bg01.png) no-repeat center bottom; z-index:34; font-size:52px;  color:#fff; padding-left:100px; opacity:0;  display:flex; align-items: center; background-size:cover;}
#header #gnb > li:nth-child(2)  h2 {background-image:url(../images/common/sub_bg02.png);}
#header #gnb > li:nth-child(3)  h2 {background-image:url(../images/common/sub_bg03.png);}
#header #gnb > li:nth-child(4)  h2 {background-image:url(../images/common/sub_bg04.png);}
#header #gnb > li.active  h2 {transition: 0.5s; left:0; opacity:1;}
#header #gnb > li p {  display:block; position:absolute; left:50px; top:210px; z-index:35; transition: 0s; opacity:0; visibility: hidden;}
#header #gnb > li.active  p { left:0; transition: 0.5s; line-height:1.5; opacity:1; z-index:35; visibility: visible;}
#header #gnb > li > div > ul {padding:20px 80px 0 40%;  left:-80px;  opacity:0;  transition: 0s; position:relative;  }
#header #gnb > li.active > div > ul {opacity:1; left:0; transition: 0.5s; }
#header #gnb > li > div > ul > li{position:relative; margin:15px 20px; float:left; width:calc(25% - 40px);}
#header #gnb > li > div > ul > li:first-child:after {content:''; display:block;}
#header #gnb > li > div > ul > li:before{content:''; display:inline-block; position:absolute; top:14px; left:0; width:2px; height:2px; background:#fff; opacity:.7;}
#header #gnb > li > div > ul > li > a{position:relative; padding:0 20px; font-weight:400; color:#333; font-size:17px; line-height:1.2; letter-spacing:-1px; transition:0s;  height:64px; display:flex; align-items:center; background:#f6f6f6; border-radius:4px; transition: 0.3s; overflow:hidden;}
#header #gnb > li > div > ul > li > a:after {content:'→'; display:block; position:absolute ;right:20px; bottom:0; top:0; line-height:62px; color:#aaa; transition: 0.3s; }
#header #gnb > li > div > ul > li > a:before {content:''; display:block; position:absolute; left:0; top:0; bottom:0; width:0; transition: 0.5s; background:#00b4bf; border-radius:0 100% 100% 0;}
#header #gnb > li > div > ul > li > a:hover:before {width:100%; border-radius:0;}
#header #gnb > li > div > ul > li > a:hover { color:#fff;}
#header #gnb > li > div > ul > li > a:hover:after {color:#fff; transform: rotateY(180deg);}
#side .snb a.parent:after{display:none;}
#header #gnb > li > div > ul > li > a span { position:relative;}

/*
#header #gnb > li:nth-child(3).active > div {height:580px !important;}
#header #gnb > li:nth-child(3) > div > ul > li > a {height:220px; background:#000; color:#fff;  text-align:center;  align-items: flex-end; padding-bottom:26px;}
#header #gnb > li:nth-child(3) > div > ul > li > a:before {content:''; display:block; position:absolute; left:0; top:0; right:0; height:220px; background:url("../images/main/s04_img01.png") no-repeat center center;background-size:cover; transition: 0.2s; opacity:.5;}
#header #gnb > li:nth-child(3) > div > ul > li:nth-child(2) > a:before {background-image:url("../images/main/s04_img02.png");}
#header #gnb > li:nth-child(3) > div > ul > li:nth-child(3) > a:before {background-image:url("../images/main/s04_img03.png");}
#header #gnb > li:nth-child(3) > div > ul > li:nth-child(4) > a:before {background-image:url("../images/main/s04_img04.png");}
#header #gnb > li:nth-child(3) > div > ul > li:nth-child(5) > a:before {background-image:url("../images/main/s04_img05.png");}
#header #gnb > li:nth-child(3) > div > ul > li:nth-child(6) > a:before {background-image:url("../images/main/s04_img06.png");}
#header #gnb > li:nth-child(3) > div > ul > li:nth-child(7) > a:before {background-image:url("../images/main/s04_img07.png");}
#header #gnb > li:nth-child(3) > div > ul > li:nth-child(8) > a:before {background-image:url("../images/main/s04_img08.png");}
#header #gnb > li:nth-child(3) > div > ul > li > a:hover:before {transform: scale(1.1);}
#header #gnb > li:nth-child(3) > div > ul > li > a:after { top:initial; bottom:8px;}
*/

/* gnb 배경 */
#header .gnb_wrap .gnb_bg {position:absolute; top:100px; left:0; z-index:20; overflow:hidden; width:100%; height:0; border-bottom:0 solid transparent; background:#fff; transition:0.7s cubic-bezier(0.165, 0.84, 0.44, 1);   }







#header.open .gnb_wrap .gnb_bg{box-sizing:content-box; height:340px !important; display:none !important;}
#header .gnb_wrap .gnb_bg > .inr{position:relative; max-width:1260px; margin:0 auto;}
#header .gnb_wrap .gnb_bg .area_link{float:left; width:185px; margin:30px 0 0; padding:140px 0 0; background:url(../images/common/img_gnb.jpg) no-repeat 0 0;}
#header .gnb_wrap .gnb_bg .area_link .txt{display:block; font-size:16px; line-height:1.4; color:#0468b4;}
#header .gnb_wrap .gnb_bg .area_link .link{display:block; margin:20px 0 0;}
#header .gnb_wrap .gnb_bg .area_link .link a{display:inline-block; position:relative; padding:10px 20px 10px 10px; border:1px solid #c5c5c5; font-weight:600; font-size:15px;}
#header .gnb_wrap .gnb_bg .area_link .link a:after{content:''; display:inline-block; position:absolute; top:0; right:10px; bottom:0; width:6px; height:6px; margin:auto; border-right:1px solid #000; border-bottom:1px solid #000; transform:rotate(-45deg);}


/* 헤더 우측 */
#header .header_ex {position:absolute; right:50px; top:0px; height:100%; z-index:40;   display:flex; align-items:center;}
#header .header_ex .srch_btn { height:38px; color:#fff; background:none; margin-right:20px; font-size:15px; font-weight:400; background:rgba(255,255,255,0);  border-radius:50px; padding:0 16px 0 20px;}
#header .header_ex .srch_btn i {font-size:14px; display:inline-block; border-radius:20px; line-height:30px; margin-left:9px;}

#header .header_ex .sitemap {width:38px; height:38px; position:relative; overflow:hidden; text-indent:-999px; color:transparent; font-size:0;}
#header .header_ex .sitemap:before {display:block; content:''; width:38px; height:2px; background:#000; position:absolute; left:0; top:50%; margin-top:-5px;}
#header .header_ex .sitemap:after {display:block; content:''; width:38px; height:2px; background:#000; position:absolute; left:0; top:50%; margin-top:5px;}
#header .header_ex .lang {margin-right:35px; color:#fff; font-weight:300; font-size:16px; opacity:.5; }
#header .header_ex .lang.on {opacity:1; text-decoration: underline;}

#header .header_ex .srch_wrap {position:fixed; left:0; top:0; bottom:0; right:0; background:rgba(255,183,27,0.9); backdrop-filter:blur(10px); z-index:11111111111111; display:flex; justify-content: center; align-items: center; visibility: hidden; opacity:0; transition: 0.3s;}
#header .header_ex .srch_wrap.on { visibility:visible; opacity:1;}
#header .header_ex .srch_wrap .srch_inr {position:relative;}
#header .header_ex .srch_wrap .srch_inr div {border:10px solid #000; opacity:0; margin-top:-50px; transition: 0.3s; transition-delay: 0.3s;}
#header .header_ex .srch_wrap.on .srch_inr div {opacity:1; margin-top:0;}
#header .header_ex .srch_wrap .srch_inr div * {margin:0; border:0; background:none; vertical-align: top;}
#header .header_ex .srch_wrap .srch_inr div select {height:70px; font-size:20px; color:#000; padding-left:20px; margin:0;}
#header .header_ex .srch_wrap .srch_inr div input {height:70px; font-size:20px; color:#000;padding-left:20px; margin:0; width:400px;}
#header .header_ex .srch_wrap .srch_inr div input::placeholder {color:#000;}
#header .header_ex .srch_wrap .srch_inr div input::-webkit-input-placeholder {color:#000;}
#header .header_ex .srch_wrap .srch_inr div input:-ms-input-placeholder {color:#000;}
#header .header_ex .srch_wrap .srch_inr div button {width:70px; height:70px; text-align:center; }
#header .header_ex .srch_wrap .srch_inr div button i {font-size:24px; color:#000;}
#header .header_ex .srch_wrap .srch_inr .close {position:absolute; right:-110px; top:0px; width:90px; height:90px; border:10px solid #fff; padding-top:1px; background:none; opacity:0; margin-top:50px; transition: 0.3s; transition-delay:0.3s;}
#header .header_ex .srch_wrap .srch_inr .close i {color:#fff; font-size:30px;}
#header .header_ex .srch_wrap.on .srch_inr .close {opacity:1; margin-top:0;}





.cus_wrap {position:fixed; left:0; top:0; bottom:0; right:0; background:rgba(0,0,0,0.3);  z-index:11111111111111; display:flex; justify-content: center; align-items: center;   transition: 0.3s ease-in-out; visibility: hidden; opacity:0;  border-radius:0; }
.cus_wrap.on { visibility:visible; opacity:1; left:0; top:0; border-radius:0; transition: 0.7s ease-in-out; }
.cus_wrap .cus_inr {width:700px; position:relative; opacity:0; padding:40px; transition: 0.7s ease-in-out; transform: scale(0); background:#fff; border-radius:20px;}
.cus_wrap.on .cus_inr {opacity:1; transform: scale(1);}
.cus_wrap .cus_inr .top {position:relative; padding-top:6px; margin-bottom:18px;}
.cus_wrap .cus_inr .top i {font-size:34px; display:block; width:80px; height:80px; position:absolute; left:0; top:0; color:#12337f; background:#333; border-radius:175px; text-align:center; line-height:80px;}
.cus_wrap .cus_inr .top h2 {font-size:28px; color:#333; margin-bottom:10px; }
.cus_wrap .cus_inr .top p { color:#333; opacity:.7;}
/*.cus_wrap .cus_inr .box:first-child {margin-bottom:10px;}
.cus_wrap .cus_inr .box label {margin-right:25px; margin-bottom:6px; display:flex; align-items:center; color:#000; font-size:17px;}
.cus_wrap .cus_inr .box label input {margin-right:6px; width:20px; height:20px; background:none;}
.cus_wrap .cus_inr .box {margin:10px 0; display:flex;}
.cus_wrap .cus_inr .box span {width:2%; display:inline-block; line-height:50px; text-align:center;}
.cus_wrap .cus_inr .box.n1 select {width:25%; margin-right:6px;}
.cus_wrap .cus_inr .box.n2 {display:flex; justify-content: space-between;}
.cus_wrap .cus_inr .box.n2 select {width:25%;}
.cus_wrap .cus_inr .box.n2 input {width:calc(50% - 3px);}
.cus_wrap .cus_inr .box.n3 input {width:50%;}
.cus_wrap .cus_inr .box.n3 span {width:3%;}*/

.cus_wrap table tr th , .cus_wrap table tr td {font-size:16px; padding:7px 10px;}
.cus_wrap .cus_inr select , .cus_wrap .cus_inr input {border:1px solid rgba(0,0,0,0.3); background:none; height:38px; color:#333; font-size:15px; padding-left:10px; border-radius:2px;}
.cus_wrap .cus_inr .box input[type='file'] {width:100% !important; min-width:100%; line-height:44px; font-size:16px;}
.cus_wrap .cus_inr input::placeholder {color:#777;}
.cus_wrap .cus_inr input::-webkit-input-placeholder {color:#777;}
.cus_wrap .cus_inr input:-ms-input-placeholder {color:#777;}
.cus_wrap .cus_inr textarea {background:none; width:100%;border:1px solid rgba(0,0,0,0.3); font-size:17px; color:#333; border-radius:4px;}
.cus_wrap .cus_inr .button {background:#122ea7 ; color:#fff !important; border:1px solid #122ea7 ; margin-top:20px; line-height:46px; height:48px; width:140px; padding:0;}
.cus_wrap .close { position:absolute; right:-30px; top:-30px; width:60px; height:60px; border-radius:100px; background:none; color:#fff; text-align:center; box-shadow: 10px 10px 20px rgba(0,0,0,0.2); background:#000; margin-right:40px; opacity:0; transition: 0.3s; transition-delay:0.7s; transform:rotate(90deg);}
.cus_wrap .close i {font-size:24px;}
.cus_wrap.on .close {opacity:1; margin-right:0; transform: rotate(0deg);}



.fp-viewing-2Page #header , .fp-viewing-4Page #header {background:rgba(255,255,255,0.95); }
.fp-viewing-2Page #header .area_logo .logo a , .fp-viewing-4Page #header .area_logo .logo a {background-position:left top;}
.fp-viewing-2Page #header #gnb > li > a , .fp-viewing-4Page #header #gnb > li > a {color:#333;}
.fp-viewing-6Page #header {top:-88px;}
.fp-viewing-6Page .m_scroll , .fp-viewing-6Page .main__control {opacity:0;}


.fp-viewing-mainsection01 #header .header_ex .srch_btn , .fp-viewing-mainsection03 #header .header_ex .srch_btn {  color:#fff;}
.fp-viewing-mainsection02 #header .header_ex .srch_btn , .fp-viewing-mainsection04 #header .header_ex .srch_btn {  color:#333;}

/* 헤더 GNB Fixed */
body.fixed #header  { background:rgba(255,255,255,0.97); } 
body.fixed #header:hover {background:#fff;}

#header.open:before , body.fixed #header.open:before {content:''; display:block; position:fixed; left:0; top:100px; right:0; bottom:0; background:rgba(0,0,0,0.4); z-index:1; }






/* 모바일 전체메뉴 */
.wholeview_wrap{display:none;}
/* 모바일 검색 */
.wv_srch_wrap{display:none;}

/**************************************************
	Footer
**************************************************/

.contact_us {background:url("../images/common/contact.png") no-repeat center bottom; background-size:cover;  color:#fff; position:relative;}
#content + .contact_us , #sub_wrap + .contact_us , .cont_body + .contact_us , #bo_gallery + .contact_us   {  left:50%; width:0; transform: translateY(60px); opacity:0;}

.contact_us .inr {max-width:1580px; margin:0 auto; padding:110px 0;}
#content + .contact_us .inr , #sub_wrap + .contact_us .inr , .cont_body + .contact_us .inr , #bo_gallery + .contact_us .inr {transform: translateX(100px); opacity:0;}
.contact_us .inr h2 { font-size:62px; margin-bottom:24px;}
.contact_us .inr p {font-size:20px; opacity:.8;}
.contact_us .inr a {display:flex; justify-content: space-between; align-items: center; padding:0 20px; width:240px; height:68px; border:1px solid rgba(255,255,255,0.2); position:relative;  font-weight:bold; color:#fff; font-size:17px; margin-top:50px; }
.contact_us .inr a:after {content:'→'; display:inline-block; font-size:20px; font-weight:normal;}


#footer{ background:#000; color:#bbb; position:relative; z-index:12; min-width:320px; padding:80px 50px 100px; text-align:left;}
#footer .footer_top { position:relative;}
#footer .logo {margin-bottom:20px; display:block;}
#footer ul {display:flex; gap:24px; margin:30px 0 10px;}
#footer ul a {color:#fff; font-size:17px;}
#footer ul li:first-child a {color:#00b4bf;}
#footer .footer_top .area_copyright .address span { font-size:17px; display:inline-block; margin:6px 0; line-height:1.2;}
#footer .footer_top .area_copyright .address em {display:inline-block; width:1px; height:13px; background:#fff; opacity:.3; margin:2px 25px 0;}
#footer .footer_top .area_copyright .copyright {font-size:17px; margin-top:6px; opacity:.75;}
#footer .footer_top .go_top {position:absolute; right:0; top:50px; width:60px; height:60px; background:#fff; border-radius:60px; line-height:60px; text-align:center; opacity:.3;}

#footer .footer_top .right { position:absolute; right:0px; top:0px;}
#footer .footer_top .right .site_go { width:210px; position:relative;}
#footer .footer_top .right .site_go .btn {display:block; height:52px; border:1px solid #444; position:relative; color:#999; font-size:16px; font-weight:600; line-height:50px; padding-left:15px;}
#footer .footer_top .right .site_go .btn:after {content:'>'; display:block; font-family:'dotum'; font-size:14px; font-weight:bold; position:absolute; right:18px; top:50%; transform:translateY(-50%) rotate(90deg); transition: 0.3s ease-out;}
#footer .footer_top .right .site_go .btn.on {border:1px solid #333; background:#333; border-radius: 0 0 20px 20px;}
#footer .footer_top .right .site_go .btn.on:after {transform:translateY(-50%) rotate(-90deg);}
#footer .footer_top .right .site_go div { display:none; position:absolute; left:0; width:100%; bottom:52px; background:#fff; padding:10px 15px 20px; z-index:11; border:1px solid #e2e2e2; box-shadow: 0px 0px 6px rgba(0,0,0,0.05); border-radius:20px 20px 0 0;}
#footer .footer_top .right .site_go div.on {display:block;}
#footer .footer_top .right .site_go div a { display:block; margin-top:10px; font-size:16px; line-height:1.3;}
#footer .footer_top .right .site_go div a span {font-size:16px;}


/* #footer .top {position:absolute; right:0; top:140px; display:block; width:59px; height:59px; border:1px solid #8a8a8a; text-align:center; color:#fff; padding-top:10px; font-size:14px;}
#footer .top:before {content:''; display:block; width:14px; height:17px; background:url(../images/main/top.png) no-repeat; margin:0 auto 1px;}*/


/**************************************************
	Container
**************************************************/
#container{width:100%; z-index:12;  overflow-x:hidden;}
#container > .inr{}
#container > .inr:after{content:''; display:block; clear:both;}

.cont_body{margin-top: 60px;}

/**************************************************
	Content
**************************************************/
/*** 컨텐츠 공통 ***/
.cont_wrap { }
/*** 컨텐츠 헤드 ***/

.sub_scroll { width:139px; height:139px; position:absolute; left:50%; top:600px; margin:-70px 0 0 -70px; z-index:20; }
.sub_scroll span {position:relative; display:block; width:139px; height:139px; text-align:center; line-height:140px; font-size:40px; color:#000;filter:invert(1);mix-blend-mode: difference; z-index:2; animation:sub_scroll2 2s ease-out infinite;  }
@keyframes sub_scroll2{
	0%{  line-height:140px;}
    50%{  line-height:160px;}
 	100%{ line-height:140px;}
}   
.sub_scroll:before {content:''; display:block; width:139px; height:139px; position:absolute; left:0; top:0; right:0; bottom:0; background: url(../images/common/sub_scroll.png) no-repeat;animation:sub_scroll 10s linear infinite;  filter:invert(1);mix-blend-mode: difference; z-index:2;}
@keyframes sub_scroll{
	0%{  transform: rotate(0deg);}
 	100%{ transform: rotate(360deg);}
}    
.sub_scroll:after {content:''; display:block; background:#fff; position:absolute; left:0; right:0; bottom:0; height:69px;  z-index:1;}


.cont_top{position:relative; overflow:hidden;}
.cont_top .m_scroll {position:absolute; color:#fff; left:initial; right:-30px;}
.cont_top .bg { display:block; overflow:hidden; height:100%; position:absolute; left:50px; top:100px; right:50px; height:500px;}
.cont_top .bg:before {content:''; display:block; position:absolute; left:0px; right:0px; top:0px;bottom:0px;  background:#000 url(../images/common/sub_visual01.png) no-repeat center top; animation:sub_bg 3s forwards; background-size:cover; }
@keyframes sub_bg{
	0%{ transform:scale(1.2); filter: blur(10px); filter:grayscale(1);}
 	100%{transform:scale(1); filter: blur(0px); filter:grayscale(0);}
}

.cont_top.type2 .bg:before {background-image:url(../images/common/sub_visual02.png);} 
.cont_top.type3 .bg:before {background-image:url(../images/common/sub_visual03.png);} 
.cont_top.type4 .bg:before {background-image:url(../images/common/sub_visual04.png);} 
.cont_top.type5 .bg:before {background-image:url(../images/common/sub_visual05.png);}
.cont_top.type6 .bg:before {background-image:url(../images/common/sub_visual05.png);}
.cont_top .inr {max-width:1420px; /*height:480px;*/ height:600px; position:relative; margin:0 auto; padding-top:100px;}
.cont_top:after{content:''; display:block; clear:both;}
.cont_top .btn_back{display:none;}
.cont_top p {color:#fff; padding-bottom:10px; font-size:22px; text-align:center;  animation:sub_txt2 2s forwards; animation-delay:1s; opacity:0; font-weight:400; display:none;}
@keyframes sub_txt2{
	0%{ transform:translateY(-30px) rotateY(0deg); filter:blur(20px); opacity:0;}
 	100%{ transform:translateY(0px) rotateY(0deg); filter:blur(0px); opacity:1;}
}
.cont_top h2 {color:#fff; font-size:78px; margin-top:130px; font-weight:700; margin-bottom:40px;  letter-spacing:1px; text-align:left; position:relative; animation:sub_tit 2s ease-in-out forwards;   }
@keyframes sub_tit{
	0%{ transform:translateX(60px); opacity:0;  filter:blur(10px);}
 	100%{transform:translateX(0px); opacity:1;  filter:blur(0px);}
}
.cont_top h2:before {content:'INTRODUCTON'; display:block; font-size:19px; color:#fff; font-weight:normal; letter-spacing:-0.05em; padding:20px 0 8px;}
.cont_top.type2 h2:before {content:'BUSINESS';}
.cont_top.type3 h2:before {content:'PRODUCT';}
.cont_top.type4 h2:before {content:'CUSTOMER';}
.cont_top h2:after {content:''; display:block; width:25px; height:5px; position:absolute; left:0; top:0;background:#00b4bf;}

.cont_top .nav{display:none;}



/* location */
.area_location{ color:#fff; animation:sub_loc 2s ease-in-out forwards; position:absolute; right:0; bottom:60px;  }
/*.cont_top .txt { color:#fff; font-size:24px; animation:sub_loc 4s ease-in-out forwards;  opacity:0;}*/
@keyframes sub_loc{
	0%{ transform:translateX(-60px); opacity:0;  filter:blur(10px);}
 	100%{transform:translateX(0px); opacity:1;  filter:blur(0px);}
}
.area_location ol{display:flex; flex-wrap:wrap; align-items:center; position:relative; z-index:10; overflow:hidden;}
.area_location ol li{display:flex; align-items:center; position:relative; padding:0; font-size:16px; opacity:1;}
.area_location ol li:first-child {width:29px; height:29px; background:url(../images/common/home.png) no-repeat; overflow:hidden; text-indent:-999px; margin-right:15px; opacity:1;}
.area_location ol li:last-child{ color:#fff; }
.area_location ol li:after{content:'>'; color:#fff; margin:0 15px 0; font-family:'dotum'; font-size:13px; font-weight:normal !important; opacity:.5;}
.area_location ol li:first-child:after , .area_location ol li:last-child:after{ display:none;}

/**************************************************
	Side
**************************************************/
/* SNB */
#side {  margin:0 auto; z-index:230;  position:relative;}
/*#side:before {content:''; display:block; position:absolute; left:50px; right:50px; bottom:0; height:1px; background:#e2e2e2;}*/
#side .snb_wrap { margin:0 auto; min-height:80px;  position:relative;}
#side .snb_wrap .snb_title {float:left; font-size:28px; height:80px; line-height:80px; padding-right:40px; color:#000;}
#side .snb_wrap .snb {float:left;  width:calc(100% - 290px); margin-top:50px;}
#side .snb_wrap .snb li {float:left; margin:10px 60px 10px 0; }
#side .snb_wrap .snb li:last-child {margin-right:0;}
#side .snb_wrap .snb li a {font-size:19px; color:#555; position:relative; transition: 0.3s; font-weight:500; color:#000;}
#side .snb_wrap .snb li a:hover {color:#0072ba; font-weight:600;}
#side .snb_wrap .snb li.on a { color:#0072ba; font-weight:600;}
#side .snb_wrap .snb li.on a:before {content:''; display:block; position:absolute; right:0; left:0; bottom:-37px; height:1px; background:#0072ba;}

.sub_menu_box {display:none;}
/*네비게이션 사용 클래스*/

#pc_navi .hist_depth1 {animation:sub_navi 2s ease-in-out forwards;   }
@keyframes sub_navi{
	0%{ transform:translateY(60px); opacity:0;  filter:blur(10px);}
 	100%{transform:translateY(0px); opacity:1;  filter:blur(0px);}
}

#pc_navi .hist_depth1 > li {display:none;}
#pc_navi .hist_depth1 > li:last-child { display:block;}
#pc_navi .hist_depth1 > li:last-child > a { display:none;}
#pc_navi .hist_depth1 > li:last-child ul { display:flex; flex-wrap:wrap; max-width:740px;}
#pc_navi .hist_depth1 > li:last-child ul li { margin-right:40px; margin-bottom:22px;}
#pc_navi .hist_depth1 > li:last-child ul li:last-child {margin-right:0;}
#pc_navi .hist_depth1 > li:last-child ul li a {font-size:18px; color:#fff; display:block; position:relative; transition: 0.3s; font-weight:500; opacity:.65; }

#pc_navi .hist_depth1 > li:last-child ul li.on a { opacity:1; text-decoration: underline;}






/*** 컨텐츠 헤드 ***/
.cont_head{ position:relative;} 
.cont_head:after{content:''; display:block; clear:both;}
.cont_head .btn_back{display:none;}
.cont_head .area_title {display:none;}
.cont_head .area_title .title span {font-size:36px; line-height:1.1; letter-spacing:-1px; }
.cont_head .area_title .nav{display:none;}
/* 공유 버튼 */
#side .btn_print {position:absolute; right:0px; top:36px; width:30px; height:30px; background:url(../images/common/print.png) no-repeat center center; overflow:hidden; text-indent:-999px; display:none;}

/*** 컨텐츠 바디 ***/
.cont_body{line-height:1.6; word-break:keep-all; word-wrap:break-word; min-height:360px; text-align:left;  }
.cont_body .inr {max-width:1420px; margin:0 auto; padding:0px 0 180px; }
.cont_body:after{content:''; display:block; clear:both;}

/* 탭메뉴 common */
.lnb{margin-bottom:80px; width:100%;}
.lnb ul{display:flex; flex-wrap:wrap; position:relative;}
.lnb li{position:relative; padding:0; font-size:16px; line-height:1.2; letter-spacing:-1px;}
.lnb li:before{display:none;}
.lnb li a{display:flex; justify-content:center; align-items:center; position:relative; height:100%; color:#333; word-break:break-all;}
.lnb li a[target="_blank"]:after{content:''; flex:0 0 auto; width:15px; height:13px; margin:0 0 0 5px; background-position:-31px -49px; vertical-align:baseline;}
.lnb li.on a{font-weight:600; color:#00398c;}
/* 탭메뉴01(일반 4개 이하) */
.lnb.tmn01 ul{border:1px solid #ddd; background:#fff;  margin:0 auto; }
.lnb.tmn01 li{width:calc(25% + 1px); margin-bottom:-1px; margin-right:-1px; border-right:1px solid #dae4f3; border-bottom:1px solid #dae4f3;}
.lnb.tmn01 li a{justify-content:flex-start; padding:24px 32px 24px 24px;}
.lnb.tmn01 li a:not([target="_blank"]):after{content:''; position:absolute; top:0; right:18px; bottom:0; width:11px; height:3px; margin:auto; background-color:#ddd; background-position:100% 100%;}
.lnb.tmn01 li.on a{z-index:10; height:calc(100% + 2px); margin:-1px -1px 0 0; border:1px solid #273988; background:#273988; color:#fff;}
.lnb.tmn01 li.on a:after{width:6px; height:9px; background-color:transparent; background-position:0 -118px;}



/*** 컨텐츠 하단 ***/
.cont_foot{margin-top:60px; padding:20px; border:1px solid #ddd; border-top-color:#333; font-size:15px; letter-spacing:-1px;}
/* 컨텐츠 담당자 */
.cont_foot .cont_manager{display:flex; flex-wrap:wrap; align-items:center;}
.cont_foot .cont_manager dl{display:flex; align-items:center; margin-left:55px;}
.cont_foot .cont_manager dl:first-child{margin-left:0;}
.cont_foot .cont_manager dl.update{margin-left:auto;}
.cont_foot .cont_manager dt{margin:0 5px 0 0; font-weight:600;}
.cont_foot .cont_manager dd span{display:inline-flex;}
.cont_foot .cont_manager dd .name{margin-left:5px;}
/* 컨텐츠 평가 */
.cont_foot .cont_rating{margin:10px 0 0; padding:20px 0 0; border-top:1px solid #ddd;}
.cont_foot .cont_rating > .inr{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; position:relative;}
.cont_foot .cont_rating h2{position:relative; padding-left:24px; font-size:15px; line-height:20px;}
.cont_foot .cont_rating h2:before{content:''; position:absolute; top:-1px; left:0; width:21px; height:20px; background-position:-52px -52px;}
.cont_foot .cont_rating .inp_area{}
.cont_foot .cont_rating .inp_area fieldset{display:flex; flex-wrap:wrap; align-items:center;}
.cont_foot .cont_rating .inp_area span{display:inline-flex; align-items:center; margin-right:7px;}
.cont_foot .cont_rating .inp_area .inp_rdo{margin-right:3px;}
.cont_foot .cont_rating .inp_area label{font-size:14px; letter-spacing:-1px;}
.cont_foot .cont_rating .inp_area .btn_rate{height:32px; line-height:32px; padding:0 10px; border:0; border-radius:5px; background:#444; font-size:14px; color:#fff;}
/* 공공누리 */
.cont_foot .openType {padding:10px;}
.cont_foot .openType figure{position:relative; margin:0px;}
.cont_foot .openType figure:after{content:''; display:block; clear:both;}
.cont_foot .openType figure .fi_link{float:left; padding:0 10px 0 0;}
.cont_foot .openType figure img {height:75px;}
.cont_foot .openType figure figcaption {display:table-cell; padding:10px 0 0; font-size:0.86em; word-break:keep-all;}

/**************************************************
	팝업창 Layout
**************************************************/
#wrap_pop{padding:0 10px;}
#wrap_pop .pop_head{margin:0 0 30px; border-bottom:2px solid #666; }
#wrap_pop .pop_head .title{padding:10px 0 10px 0; font-size:2.133em; line-height:1.15; letter-spacing:-3px;}







@media screen and (max-width:1600px){
	#header .area_logo {left:30px;}
	#footer {padding:50px 30px;}

}



/* Tablet 1024px ~ 1259px */
@media screen and (max-width:1559px){
	

	/**************************************************
		Header
	**************************************************/
    #sub_wrap  {margin:0 30px;}
	.cont_body .inr {margin:0 30px;}
	
	.sp_ui,
	#header .area_top .util_r .lst li a:before,
	#wholeview .w_close_btn:after,
	#wholeview .head .area_wv_util li a:before,
	.wholeview_wrap #wholeview .nav a .unfd:after,
	.wholeview_wrap #wholeview .nav a[target="_blank"]:after,
	#footer .wrap_copyright .area_link .related .open_select:before,
	#footer .wrap_copyright .area_link .related .open_select:after,
	#footer .wrap_copyright .area_link .btn_contact a:before,
	#footer .wrap_copyright .area_link .btn_contact a:after,
	.cont_top .btn_back:before,
	.cont_top .title span:after,
	.cont_top .area_location ol li:before,
	
	.cont_foot .cont_rating h2:before,
	.lnb li a[target="_blank"]:after,
	.cont_foot .cont_rating h2:before{display:inline-block; overflow:hidden; color:transparent !important; white-space:nowrap; background:url(../images/base/sp_ui_m.png) no-repeat 0 0/400px 400px;}



	#header {padding:0 20px;}
    #header #gnb {padding-right:110px;}
	#header .header_ex { right:30px;}
    
    #header #gnb > li > div > ul > li {width:calc(33.3333% - 40px);}
 

	/**************************************************
		Footer
	**************************************************/
	#footer .footer_top {display:block; height:auto; padding:30px 0;}
	#footer .footer_top .logo {margin-bottom:15px; display:block;}
	#footer .footer_top .logo img {height:34px;}
	#footer .footer_top .right {right:30px;}
	#footer .footer_bot {padding:0 30px;}
	#footer .footer_top .go_top {right:30px;}
	/**************************************************
		Container
	**************************************************/
	#container > .inr{padding:0 10px;}
	#side:before {left:30px; right:30px;}
    
    
    .cont_top .bg {left:30px; right:30px;}
    .cont_top .inr {margin:0 80px;}
	/*** 컨텐츠 하단 ***/
    
    .contact_us .inr {margin:0 30px;}
    

}

/* Tablet 768px ~ 1023px */
@media screen and (max-width:1279px){

	.body_circle {display:none;}


    .fix_right { right:10px; bottom:10px;}
    .fix_right a {width:60px; height:60px;}
    
    
    #header #gnb {padding-right:90px; display:none;}
    #header #gnb > li > a {line-height:78px; padding:0 20px; }
    #header #gnb > li > a span {font-size:17px;}
    #header .header_ex {right:50px;}
	#header .header_ex .sitemap{display:none;}
	#header {height:80px; position:fixed;}
	#header .area_logo  { left:20px; top:0;}
    #header .area_logo .logo a {height:34px;}
	#header .area_logo .logo img {height:34px;}
	body.fixed #header {top:0;}
	body.fixed #header .area_logo .logo {padding-top:0px;}
	body.fixed .wholeview_wrap .btn_wv {top:20px;}


	/* 모바일 전체메뉴 */
	body.open_wv{overflow:hidden; position:fixed !important; width:100%; height:100%;}
	.wholeview_wrap .btn_wv{position:absolute; top:20px; right:20px; z-index:32; overflow:hidden; width:40px; height:40px; background:url(../images/common/sitemap2.png) no-repeat center center; margin:auto; border:1px solid #ddd; background-size:20px;}
	body.fixed .wholeview_wrap .btn_wv {background-image:url(../images/common/sitemap2.png);}
	.wholeview_wrap .btn_wv .sp_ui{ background:none;}
	.wholeview_wrap{display:block;}
	.wholeview_wrap #wholeview{position:fixed; top:0; right:0; bottom:0; z-index:1000; overflow:auto; width:70%; max-width:420px; min-width:280px; background:#00b4bf;  margin-right:-48px;
	transition:all 0.5s; transform:translate(100%, 0);}
	.wholeview_wrap.open #wholeview{margin-right:0; transform:translate(0, 0);}
	.wholeview_wrap .dim_wv{position:fixed; top:0; left:0; z-index:999; width:100%; background:transparent; transition:height, background .5s;}
	.wholeview_wrap.open .dim_wv{bottom:0; background:rgba(40,40,40,0.8);}
	.wholeview_wrap .title_wv {display:none;}
	.wholeview_wrap .name {position:absolute; left:0; top:0; z-index:10; padding-left:10px; font-size:14px; line-height:33px;}
	.wholeview_wrap .name strong {color:#004bb8;}
	#wholeview .w_close_btn{ position:absolute; top:15px; right:15px; z-index:2; overflow:hidden; width:40px; height:40px; background:url(../images/common/ico_close.png) no-repeat center center !important; margin:auto; border:1px solid #ddd; text-indent:-999px;}
	
	#wholeview .w_close_btn:after{ display:none;}
	/* 모바일 전체메뉴 head */
	#wholeview .head{ height:70px; background:#fff; display:flex; align-items:center; padding-left:20px;}
	#wholeview .head ul {overflow:hidden;}
	#wholeview .head ul li {float:left;}
	#wholeview .head ul li a {display:inline-block;padding:5px 0; margin-right:30px; font-size:15px; font-weight:bold; position:relative;}
	#wholeview .head ul li a i {font-size:14px; color:#555; margin-right:8px;}
	#wholeview .head ul li:first-child a:before  { content:''; display:block ;width:1px; height:16px; background:#d2d2d2; position:absolute; right:-15px; top:7px;}
	#wholeview .head img { height:24px; opacity:.75; }

	/* 모바일 전체메뉴 gnb */
	.wholeview_wrap #wholeview .nav{padding:0; border-top:1px solid #e9e9e9;}
	.wholeview_wrap #wholeview .nav a{display:block; position:relative; line-height:1.2; color:#fff;}
	.wholeview_wrap #wholeview .nav a .unfd{position:absolute; top:50%; right:26px;  width:0; height:0; color:transparent;}
	.wholeview_wrap #wholeview .nav a .unfd:after{content:''; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); transition:transform .3s;}
	.wholeview_wrap #wholeview .nav a[target="_blank"]:after{content:''; width:16px; height:14px; margin:-1px 0 0 5px; background-position:-74px -78px;}
	/* 1차 */
	.wholeview_wrap #wholeview .nav>li{border-bottom:1px solid rgba(0,0,0,0.1); }

	.wholeview_wrap #wholeview .nav>li>a{padding:20px 30px 20px 23px; font-weight:600; letter-spacing:-1px; transition: 0.15s; position:relative; background:none;}
    .wholeview_wrap #wholeview .nav>li>a:after {content:'▼'; display:block; color:#fff; position:absolute; right:20px; top:50%; margin-top:-10px;  width:20px; height:20px; text-align:center; line-height:20px; font-size:8px; opacity:.5; transition: 0.3s; }
    .wholeview_wrap #wholeview .nav>li>a.on:after {transform: rotate(180deg);}
    .wholeview_wrap #wholeview .nav>li>a span:first-child {transition: 0.3s; display:inline-block;font-size:17px; }
    .wholeview_wrap #wholeview .nav>li>a:before {content:''; display:block; position:absolute; right:0; bottom:0; width:100%; height:0; background:#000; z-index:-1; transition: 0.3s;}
	.wholeview_wrap #wholeview .nav>li>a.on{color:#fff; background:rgba(0,0,0,0.1);}
    .wholeview_wrap #wholeview .nav>li>a.on span:first-child {transform: rotateX(360deg);}

	.wholeview_wrap #wholeview .nav>li>a .unfd:after{width:30px; height:30px; background:rgba(0,0,0,0) url(../images/common/m_gnb_ico.png) no-repeat; background-size:30px;transform:translate(-50%, -50%) rotate(-180deg); border-radius:30px;}
	.wholeview_wrap #wholeview .nav>li.open>a .unfd:after{transform:translate(-50%, -50%) rotate(0deg);}
	/* 2차 */
	.wholeview_wrap #wholeview .nav>li>div{ display:none; background:rgba(0,0,0,0.1);}
	.wholeview_wrap #wholeview .nav>li.open div{display:block;height:initial; opacity:1;}
    .wholeview_wrap #wholeview .nav>li div>ul {padding:14px 0 24px 28px;}
	.wholeview_wrap #wholeview .nav>li div>ul>li:last-child{border:0;}
	.wholeview_wrap #wholeview .nav>li div>ul>li>a{padding:5px 7px; font-weight:400; font-size:16px; color:#fff; position:relative;}
	.wholeview_wrap #wholeview .nav>li div>ul>li>a[target="_blank"]:after{content:''; display:inline-block; width:15px; height:13px; margin:0 0 0 7px; background:url(../images/common/blank_w.png) no-repeat; vertical-align:baseline; opacity:.7;}
	.wholeview_wrap #wholeview .nav>li div>ul>li.open>a{}
	.wholeview_wrap #wholeview .nav>li div>ul>li>a.on{font-weight:600; color:#6c4ea0;}
	.wholeview_wrap #wholeview .nav>li div>ul>li>a .unfd:after{width:16px; height:16px; background-position:-86px -59px;}
	.wholeview_wrap #wholeview .nav>li div>ul>li.open>a .unfd:after{width:16px; height:1px; background-position:-104px -66px;}
	/* 3차 */
	.wholeview_wrap #wholeview .nav>li div>ul>li>ul{display:none; padding:10px 10px 10px 15px; background:#fafafa;}
	.wholeview_wrap #wholeview .nav>li div>ul>li.open>ul{display:block;}
	.wholeview_wrap #wholeview .nav>li div>ul>li>ul>li{}
	.wholeview_wrap #wholeview .nav>li div>ul>li>ul>li:last-child{border:0;}
	.wholeview_wrap #wholeview .nav>li div>ul>li>ul>li>a{padding:6px 20px 5px 12px; font-size:14px; color:#000;}
	.wholeview_wrap #wholeview .nav>li div>ul>li>ul>li>a.on{font-weight:600; color:#1e6cb4;}
	.wholeview_wrap #wholeview .nav>li div>ul>li>ul>li>a:before{content:''; display:inline-block; position:absolute; top:11px; left:4px; border:3px solid transparent; border-left:4px solid #666;}
	/* 4차 */
	.wholeview_wrap #wholeview .nav>li div>ul>li>ul>li>ul{padding:0 0 10px 12px;}
	.wholeview_wrap #wholeview .nav>li div>ul>li>ul>li.open>ul{display:block;}
	.wholeview_wrap #wholeview .nav>li div>ul>li>ul>li>ul a{padding:8px 0 7px 0; font-size:16px; color:#666;}
	.wholeview_wrap #wholeview .nav>li div>ul>li>ul>li>ul a.on{font-weight:600; color:#1e6cb4;}

	/**************************************************
		Common
	**************************************************/
	

	/**************************************************
		Header
	**************************************************/
	
	
	
    

	/**************************************************
		Footer
	**************************************************/
	#footer .footer_top .right {position:relative; right:initial; top:initial; transform:none; margin-top:30px;}
	#footer .footer_bot {display:block; padding:30px; height:auto;}
	#footer .footer_bot .lst { margin-bottom:14px;}
	#footer .footer_bot .lst li {margin-bottom:9px;}
	#footer .footer_bot .sns {overflow:hidden;}
	#footer .footer_bot .sns li {margin:0 12px 0 0;}

	/**************************************************
		Container
	**************************************************/
	
	#container{margin:0;}
	#container:before {display:none;}
	#container > .inr{padding:0;}

	/**************************************************
		Content
	**************************************************/
	.cont_wrap{float:none; width:auto; margin:0;}
	/*** 컨텐츠 헤드 ***/

	
    .cont_top .inr {height:480px;}
    .cont_top h2 {margin-top:80px; font-size:62px;}
    .cont_top .bg {left:20px; right:20px; top:80px;}
    .cont_top .bg:before {bottom:initial; height:480px;}
    .area_location { bottom:40px;}
    .sub_scroll {top:480px; transform: scale(0.75);}


	/*** 컨텐츠 바디 ***/
	
	/* 탭메뉴 common */
	.lnb li a[target="_blank"]:after{background-position:-57px -78px;}
	/*** 컨텐츠 하단 ***/
	.cont_foot{margin:40px 10px 0; padding:10px;}
	.cont_foot .cont_rating{padding-top:10px; text-align:center;}
	.cont_foot .cont_rating > .inr{flex-direction:column;}
	.cont_foot .cont_rating h2:before{background-position:-14px -48px;}
	.cont_foot .cont_rating .inp_area{margin-top:5px;}
	
	
	
	
	/**************************************************
		팝업창 Layout
	**************************************************/
	#wrap_pop{padding:0;}
	#wrap_pop .pop_head{border-bottom:1px solid #ddd;}
	#wrap_pop .pop_head .title{padding:13px 10px; background:#def4f9; font-size:1.5em; letter-spacing:-2px; text-align:center;}

.contact_us .inr {margin:0 30px; padding:70px 0;}
    .contact_us .inr h2 {font-size:52px;}
    
    .cont_body {margin-top:20px;}
    

}
@media screen and (max-width:1023px){
    #header .header_ex .srch_wrap .srch_inr {margin:0 20px; width:calc(100% - 40px);}
    #header .header_ex .srch_wrap .srch_inr div {border:4px solid #000; display:flex;}
    #header .header_ex .srch_wrap .srch_inr div select {font-size:16px; width:60px; padding-left:8px; padding-right:0; height:50px;}
    #header .header_ex .srch_wrap .srch_inr div input {font-size:16px; width:calc(100% - 110px); padding-left:8px; height:50px;}
    #header .header_ex .srch_wrap .srch_inr div button {height:50px; width:50px;}
    #header .header_ex .srch_wrap.on .srch_inr .close {right:0; top:-60px; width:50px; height:50px; background:none; color:#333; border:0;}
    #header .header_ex .srch_wrap.on .srch_inr .close i {color:#000;}
    #sub_wrap , .cont_body .inr {margin:0 20px;}
	.wholeview_wrap .btn_wv {right:20px;}
	#header .header_ex {right:50px;}

	.cont_top .inr { margin:0 60px; }
    
    
    
    .contact_us {opacity:1 !important; transform: none !important; left:0 !important; width:auto !important;}
    .contact_us .inr {opacity:1 !important; transform: none !important;}

}


/* Mobile ~ 767px */
@media screen and (max-width:767px){
	/**************************************************
		상단 배너
	**************************************************/
	
    #container {overflow:hidden;}

    .fix_right a {width:46px; height:46px;}
    .fix_right a img {min-width:50px; min-height:50px; margin:-2px 0 0 -2px;}
    .m_scroll { display:none;}
    #header #gnb {display:none;}

    .cus_wrap {padding:0 15px;}
    .cus_wrap .cus_inr {padding:25px 20px; border-radius:8px;}
    .cus_wrap .cus_inr .top {padding:0; margin-bottom:0;}
    .cus_wrap .cus_inr .top h2 {font-size:22px; margin-bottom:3px;}
    .cus_wrap .cus_inr .button {height:40px; line-height:38px; margin-top:15px; width:120px;}
    .cus_wrap .close {width:40px; height:40px; right:-10px; top:-10px; }
    .cus_wrap .close i {font-size:16px;}
    .cus_wrap table tr th, .cus_wrap table tr td {font-size:15px;}
    .cus_wrap .cus_inr select, .cus_wrap .cus_inr input {height:36px; line-height:34px; font-size:15px; padding-left:8px;}

    #sub_wrap , .cont_body .inr {margin:0 15px;}
	#header {height:70px; padding:0 15px; right:initial; width:100%;}
    #header .area_logo { left:15px; }

	#header:hover .area_logo .logo a {background-position:left -30px;}
    body.fixed #header .area_logo .logo a {background-position:left top;}
	body.fixed #header .area_logo .logo {padding-top:0px;}
	body.fixed .wholeview_wrap .btn_wv {top:15px;}

	.wholeview_wrap .btn_wv {right:15px; top:15px;}



    #footer {padding:0 20px;}
    #footer ul {gap:18px; margin:20px 0;}
    #footer ul a {font-size:15px;}
	#footer .footer_top .area_copyright .address span {font-size:15px; word-break: keep-all; margin-right:12px;}
	#footer .footer_top .area_copyright .address em {margin:0 10px;}
	#footer .footer_top .area_copyright .copyright {font-size:15px;}
	#footer .footer_top .go_top {right:15px; top:-25px; width:50px; height:50px; line-height:50px; background:#0072ba; opacity:1; box-shadow:5px 5px 10px rgba(0,0,0,0.2);}
	#footer .footer_top .go_top i {font-size:14px; color:#fff;}
    #footer .footer_top .area_copyright .address em {display:none;}
    #footer .footer_top .area_copyright .address span:nth-child(2) {display:block;}

    .cont_body .inr {padding-bottom:70px;}

	/**************************************************
		Container
	**************************************************/
	/*** 컨텐츠 바디 ***/
	.lnb { margin-bottom:40px;}
	.lnb li{font-size:14px;}
	/* 탭메뉴01(일반 4개 이하) */
	.lnb.tmn01 li{width:calc(50% + 1px);}
	.lnb.tmn01 li a{padding:13px 32px 13px 12px; font-size:16px;}
	.lnb.tmn01 li a:not([target="_blank"]):after{right:15px;}

	/* 탭메뉴03(박스) */
	.lnb.tmn03{padding:15px 0;}
	.lnb.tmn03 li{width:50%;}
	.lnb.tmn03 li:nth-child(2n+1):before{display:none;}
	.lnb.tmn03 li a{margin-left:15px;}

	/* 탭메뉴04(년도) */
	.lnb.tmn04 li a{padding:0 15px;}

	/*** 컨텐츠 하단 ***/
	.cont_foot .cont_manager{justify-content:center; font-size:14px;}
	:root .cont_foot .cont_manager dl{margin:3px 10px;}
	.cont_foot .cont_rating h2{font-size:14px;}
	.cont_foot .cont_rating .inp_area fieldset{justify-content:center;}
	.cont_foot .cont_rating .inp_area fieldset span{margin:5px 4px;}
	.cont_foot .cont_rating .inp_area .inp_rdo{width:16px; height:16px;}
	.cont_foot .cont_rating .inp_area .btn_rate{margin:5px 8px;}
    
    .cont_top {overflow:initial; z-index:222;}
    .cont_top .inr {padding-top:70px; margin:0 40px; height:360px;}
    .cont_top .bg {left:15px; top:70px; right:15px; height:210px; border-radius:0 !important; transform: none !important;}
    .cont_top .bg:before {height:270px; background-size:cover;}
    .sub_scroll {display:none !important;}
    .area_location {bottom:initial; top:88px; display:none;}
    .area_location ol {transform: scale(0.9); margin-right:-5px;}
    .cont_top h2 {font-size:42px; margin-bottom:30px; margin-top:60px; height:140px; }
    .cont_top h2:before {font-size:15px; padding:15px 0 3px;}
    .cont_top h2:after {width:15px; height:2px; display:none;}
    #pc_navi {display:none;}
    .sub_menu_box {display:block;}
    
    #pc_navi {display:none;}
    
    #pc_navi .hist_depth1 > li:last-child ul {border-top:1px solid #e2e2e2; border-left:1px solid #e2e2e2;}
    #pc_navi .hist_depth1 > li:last-child ul li a {color:#555; font-size:15px; display:flex; height:50px; align-items:center; justify-content: center; text-align:center; border:1px solid #e2e2e2; border-left:0; border-top:0;}
    #pc_navi .hist_depth1 > li:last-child ul li.on a { color:#00b4bf;}
    #pc_navi .hist_depth1 {margin:-20px -25px 0;}
    #pc_navi .hist_depth1 > li:last-child ul li {width:33.3333%; margin:0;}
    
   
    #sub_navi .sub_history .hist_depth1{display:flex; border:1px solid #e2e2e2; margin:0 -25px; background:#fff; }
    #sub_navi .sub_history .hist_depth1 >li {position:relative; display:block; }
    #sub_navi .sub_history .hist_depth1 >li:not(:first-child){font-size:17px; width:50%;}
    #sub_navi .sub_history .hist_depth1 >li:last-child {border-left:1px solid #e2e2e2}
    #sub_navi .sub_history .hist_depth1 >li:first-child {padding-left:0; margin-left:0; font-size:20px; display:none;}
    #sub_navi .sub_history .hist_depth1 >li:first-child i {font-size:15px;}
    #sub_navi .sub_history .hist_depth1 >li > a {color:#000; line-height:60px; display:block; padding:0 20px; font-size:16px; text-align:left; position:relative; font-weight:400;}
    #sub_navi .sub_history .hist_depth1 >li > a.on {background:#000; color:#fff;}
    #sub_navi .sub_history .hist_depth1 .active {position:relative; font-weight:400; color: #222;}
    #sub_navi .sub_history .hist_depth1 .active >a:before {content:''; display:block; border:4px solid transparent; border-top:4px solid #ddd; position:absolute; right:15px; top:50%; margin-top:-2px;}
    #sub_navi .sub_history .hist_depth1 .active i{position:absolute; right:0; top:50%; transform:translateY(-50%); z-index:-1; transition:0.3s; z-index:2; font-size:14px; color:#fff;}
    #sub_navi .sub_history .hist_depth1 .active i.on {transform: rotate(180deg); margin-top:-6px;}
    #sub_navi .sub_history .hist_depth1 .active:hover {color: #222;}
    #sub_navi .sub_history .hist_depth2 {display:none;position: absolute;top:59px;left:0px; right:0px;  text-align: left;z-index: 99;border: 1px solid #00b4bf;  box-shadow:10px 10px 25px rgba(39,57,136,0.15); font-size: 14px;  z-index:2222;}
    #sub_navi .sub_history .hist_depth2 li a {display: block;padding:15px 10px;background: #00b4bf;color:#fff;font-weight: normal;border-bottom: 1px solid rgba(0,0,0,0.15); line-height:24px; font-size:15px;}
    #sub_navi .sub_history .hist_depth2 li a:hover {background: #f1f1f1; color:#222;}
    #sub_navi .sub_history .hist_depth2 li:last-child a {border: 0;}
    
    .contact_us .inr {margin:0 30px; padding:50px 0; width:auto;}
    .contact_us .inr h2 {font-size:34px; margin-bottom:10px;}
    .contact_us .inr p {font-size:16px; word-break: keep-all;}
    .contact_us .inr a {width:190px; height:60px; font-size:16px; margin-top:36px;}
    
    #bo_sch {padding:0 !important; border-radius:0;}
    #bo_sch .sch_input {width:62%;}
    
    
    .pg_page, .pg_current {width:36px; height:36px;line-height:36px; font-size:14px;}
    .pg_start {width:36px;height:36px ;}
    .pg_prev  {width:36px;height:36px ;}
    .pg_next  {width:36px;height:36px ;}
    .pg_end   {width:36px;height:36px ;}
    .pg_current {line-height:36px;} 
    
    
}

@media screen and (max-width:500px){
	#header .header_top .inr .left li {width:25%;}
	#footer .footer_top .logo img {height:32px;}

	
}

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

}