@charset "utf-8";




/*pc*****************************************************/


.star.pulse { animation: starlite 2s infinite;}
@-webkit-keyframes starlite {
    0% { background: powderblue;
        height: 4px;
        width: 4px;
        box-shadow: 0px 0px 10px white;
    }
    10% {background: #b0e5de;}
    20% {background: #b0e5cc;}
    30% {background: #cce5b0;}
    40% {background: #dae5b0;}
    50% {background: #e5ddb0;
    width: 6px;
    height: 6px;
    box-shadow: 0px 0px 10px #d3bd3d;
    }
    100% {width: 4px;
    height: 4px;
    background: powderblue;
    box-shadow: 0px 0px 10px white;
    }
}
@keyframes starlite {
    from { background: powderblue;
        height: 4px;
        width: 4px;
        box-shadow: 0px 0px 10px white;}
    10% {background: #b0e5de;    }
    20% {background: #b0e5cc;}
    30% {background: #cce5b0;}
    40% {background: #dae5b0;}
    50% {background: #e5ddb0;
    width: 6px;
    height: 6px;
    box-shadow: 0px 0px 10px #d3bd3d;
    }
    100% {width: 4px;
    height: 4px;
    background: powderblue;
    box-shadow: 0px 0px 10px white;
    }
}

.lite.pulse { animation: lite 2s infinite;}
@-webkit-keyframes lite {
    0% { background: #45c1eb;
        height: 4px;
        width: 4px;
        box-shadow: 0px 0px 10px white;
    }
    10% {background: #28a2df;}
    20% {background: #2a96cb;}
    30% {background: #1f69af;}
    40% {background: #2a96cb;}
    50% {background: #28a2df;
    width: 6px;
    height: 6px;
    box-shadow: 0px 0px 10px #0f5ca0;
    }
    100% {width: 4px;
    height: 4px;
    background: #45c1eb;
    box-shadow: 0px 0px 10px white;
    }
}
@keyframes lite {
    from { background: #45c1eb;
        height: 4px;
        width: 4px;
        box-shadow: 0px 0px 10px white;}
    10% {background: #28a2df;    }
    20% {background: #2a96cb;}
    30% {background: #1f69af;}
    40% {background: #2a96cb;}
    50% {background: #28a2df;
    width: 6px;
    height: 6px;
    box-shadow: 0px 0px 10px #0f5ca0;
    }
    100% {width: 4px;
    height: 4px; 
    background: #45c1eb;
    box-shadow: 0px 0px 10px white;
    }
}

.night {position: relative;width: 100%;height: 100%;-webkit-transform: rotateZ(45deg);transform: rotateZ(45deg);}
@-webkit-keyframes particleAnimation{
    from {-webkit-transform: translateX(0);opactiy:1;}
    to {-webkit-transform: translateX(100vw);opactiy:0;}
}
@keyframes particleAnimation{
    from {transform: translateX(0);opactiy:1;}
    to {transform: translateX(100vw);opactiy:0;}
}
.shooting_star{
  position:relative;
  left:0;
  top:5rem;
  width:0.1rem;
  height:0.2rem;
  background-color:white;
  transform: translateX(0);
}
.shooting_star.rain{animation:particleAnimation 3s infinite ease-in-out;}
.shooting_star::before{
  position:absolute;
  display:block;
  content:"";
  width:10rem;
  right:0.1rem;
  top:0;
  height:0.2rem;
  background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(255,255,255,0.4) 100%); 
}
.star_2{
  top:65%;
}
.star_3{
  top:100%;
}
.planet {display:none;position: absolute;top: 50%;left: 50%;width: 50rem;height: 50rem;margin-left: 21rem;margin-top: -28rem;}
.planet > div {transform-origin: center center;position:relative; width: 50rem; height: 50rem; margin: 0 auto; background-size: cover;}
.planet span {position: absolute; color: #fff;font-size:1.4rem;transition:0.4s;z-index:1001;}
.planet span::after {position:absolute;content: '';width: 1.5rem;height: 1.5rem;background: url(../images/main/i_bullet.png) no-repeat;background-size: cover;}
.planet span:hover {font-size:1.5rem;text-shadow:0 0 1rem #fff;}
.planet2 {top:-50rem; }
.planet3 {top:-100rem; }
.planet1 span:nth-of-type(1) {top: 5rem;right: 2rem;}
.planet1 span:nth-of-type(2) {bottom: 8rem;left: 0;} 
.planet2 span:nth-of-type(1) {top: 15rem;left: 4.2rem;}
.planet2 span:nth-of-type(2) {top: 23rem;right: -1.3rem;}
.planet2 span:nth-of-type(3) {bottom: 9rem;right: 12rem;}
.planet3 span {left: 7rem; bottom: 20rem;}
.planet1 span:nth-of-type(1)::after {top: 0.5rem;left: -2rem;}
.planet1 span:nth-of-type(2)::after {top: 0;right: -2.7rem;}
.planet2 span:nth-of-type(1)::after {bottom: -1rem;right: -2rem;}
.planet2 span:nth-of-type(2)::after {top: 0.2rem;left: -1.55rem;}
.planet2 span:nth-of-type(3)::after {top: -0.2rem;left: -1.7rem;}
.planet3 span::after {top: 0;right: -2rem;}
.planet1 img {width:100%;height:100%;animation: spinRight 10s infinite linear;-webkit-animation: spinRight 10s infinite linear;-moz-animation: spinRight 10s infinite linear;}
.planet2 img {width:100%;height:100%;animation: spinLeft 10s infinite linear;-webkit-animation: spinLeft 10s infinite linear;-moz-animation: spinLeft 10s infinite linear;}
.planet3 img {width:100%;height:100%;animation: spinLeft 10s infinite linear;-webkit-animation: spinLeft 10s infinite linear;-moz-animation: spinLeft 10s infinite linear;}

.business_circle {position: absolute;bottom:14%;right:4%;width: 18rem;height: 18rem;z-index:1;}
.circle01 {transform-origin: center center;position:relative; width: 18rem; height: 18rem;background-size: cover;}
.circle01 img {width:100%;height:100%;animation: spinRight 10s infinite linear;-webkit-animation: spinRight 10s infinite linear;-moz-animation: spinRight 10s infinite linear;}
.circle02 {position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:15rem;height:15rem;}
.circle02 img {width:100%;height:100%;}




@keyframes spinRight {
    0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);transform-origin: center;}
    100% {-webkit-transform: rotate(360deg);transform: rotate(360deg);transform-origin: center;}
}
@keyframes spinLeft {
    0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);transform-origin: center;}
    100% {-webkit-transform: rotate(-360deg);transform: rotate(-360deg);transform-origin: center;}
}
@keyframes twinkle {
    0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);transform-origin: center;}
    100% {-webkit-transform: rotate(360deg);transform: rotate(360deg);transform-origin: center;}
}
@keyframes twinkle {
    0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);transform-origin: center;}
    100% {-webkit-transform: rotate(-360deg);transform: rotate(-360deg);transform-origin: center;}
}
 
.img_sky {position:absolute;bottom:0;left:-6%;animation:sky 20s linear forwards;-webkit-animation:sky 20s linear forwards;z-index:1;}
.img_sky img {width:100%;}
@-webkit-keyframes sky{
	0% {transform:translate(0,55%);opacity:0.6;}
	50% {transform:translate(-12%,40%);} */ 
	100% {transform:translate(-25%,31%);opacity:0.8;} 
} 
@keyframes sky{ 
    0% {transform:translate(0%,55%);opacity:0.6;} 
	50% {transform:translate(-12%,40%);}
	100% {transform:translate(-25%,31%);opacity:0.8;} 
}

@keyframes mainZoom1 { 
	0% { transform: scale(1.1,1.1);}
  100% { transform: scale(1.3,1.3);}
}
@-webkit-keyframes mainZoom1 {
	0% { -webkit-transform: scale(1.1,1.1);}
  100% { -webkit-transform: scale(1.3,1.3);} 
}
/* pc*/

    html{font-size: 10px; }
 
    input [type="text"],
    input.text {height:2.6rem;padding:0 0 0 0.5rem;}
    input [type="check"],
    input [type="radio"] {margin:0 03rem 0.1rem 0;padding:0;width:1.3rem;height:1.3rem;vertical-align:middle;}
    select {height:2.6rem;}
    .block {display: block;}

    #skipnavi {position:relative;width:100%;z-index:2;*height:0px;}
    #skipnavi a {display:block;overflow:hidden;height:0px;width:0px;margin:-1px -1px -1px 0;*margin:-5px -1px -1px 0;font-size:0;line-height:0;text-align:center;}
    #skipnavi:focus {overflow:hidden;height:100px;background:#0d2f51;font-size:12px;font-weight:500;line-height:1.4;}
    #skipnavi a:focus, #skipnavi a:hover, #skipnavi a:active {width:auto;height:20px;margin:0;padding:8px 0 0 15px;background:#0d2f51;font-size:12px;font-weight:500;line-height:1.4;color:#fff;}

    /***** layout *****/  
    #wrapper {display:block;position:relative;height:100%;min-width:120rem;margin:0 auto;}
	
	.header_member {float:right; width:800px; margin-right:40px; margin-top:25px;  font-family:'NanumSquareB';  transform:skew(-0.001deg); }
	.header_member .top_btn01 a { float:right; width:110px; height:32px; line-height:32px; background:#fff; color:#666; text-align:center; font-size:14px; margin-right:10px; }
	.header_member .top_btn02 a { float:right; width:85px; height:32px;line-height:32px;color:#666; text-align:center; font-size:14px; }
	.header_member .top_login { float:right; padding:0 10px; height:32px;line-height:32px;color:#000; text-align:center; font-size:12px; background:#F7F7F7; font-family:'맑은 고딕' ;vertical-align:middle ; margin-right:30px; }
	.header_member .top_login img { display:inline-block; vertical-align:middle; float:left !important; margin-top:8px; }
	
	 .header_member img { float:right; margin:0 5px;} 
	
	.header_top_all { width:100%;height:80px;  position:relative; border-bottom:#F0F0F0 solid 1px; margin-bottom:0px;}
	.header_top { width:1220px; margin:auto;  position:relative; background:#FFF;}
	
	.header_area {position:fixed;top:0;left:0;width: 100%;z-index:1000; background:#fff; height:60px;  }   
    #header {position:relative;width:100%;z-index:1000;height:9.3rem;background:rgba(0,0,0,0.3);transition: all .3s ease; 
			 margin-top:0px; padding-top:0px; box-shadow:0 3px 5px rgba(0,0,0,.2)}
    .header_area #header {position:fixed;top:0;left:0;background:#fff;color:#000; height:130px; border-bottom:#F0F0F0 solid 1px;}
    .header_area.pop #header {top:9.4rem;}
    #header .header_box {position:relative;width:150rem;margin:0 auto; background:#fff;color:#000; height:40px;  }
    #header .header_box:after{content:'';height:0;font-size:0;visibility:hidden;display:block;clear:both;color:#000;}
     .logo {display: inline-block;width:30rem;height:7rem;padding-top:2rem;text-indent: -9999em;z-index:12;}
    .logo a {display: block;width:100%;height:100%;background:url(../images/common/header_logo.png) no-repeat; }
    .btn_menu {position:absolute;right:20px; top:3.1rem; z-index:11; }
    .btn_menu a {display:block;position:relative;width:3.8rem; height:2rem;border:#000}
    .btn_menu a:before,
    .btn_menu a:after {content: '';display: block;position: absolute;left: 0;width: 100%;border-bottom: 0.1rem solid #000;}
    .btn_menu a:before {top:0;}
    .btn_menu a:after {bottom:0;}
    .btn_menu .bar {display:block;position:absolute;left:0;top:50%;width:100%;height:0.1rem;background:#000;text-indent:-9999em;transition: all .4s ease;}
    .fp-viewing-business .header_area.pop #header,
    .fp-viewing-community .header_area.pop #header,
    .fp-viewing-place .header_area.pop #header,
    .fp-viewing-mFooter .header_area.pop #header {top:0;} 
     
	/*nav*/
    .anchor_wrap {position: absolute;right: 5rem;bottom:0;width: 1rem;height: 100%;z-index:51;}
    .anchor_wrap.pop {height:calc(100% - 10rem);} 
    .anchor_wrap::after {position: absolute;content: '';left:50%;width: 0.1rem;height: 100%;background: rgba(255,255,255,0.2);z-index: -1;}
    .anchor_wrap.white::after {background: #e8ebed;}
    #anchor_menu {position: absolute;top: 50%;transform: translateY(-50%);}
    #anchor_menu li {position: relative;padding: 1rem 0;text-align: center;}
    #anchor_menu li a {display: block;position: relative;padding: 0.5rem;width: 0.9rem;height: 0.9rem;}
    #anchor_menu li a:before {content: '';position: absolute;width: 1rem;height: 1rem;left: 50%;top: 50%;transform: translate(-50%);background: #9faabe;border-radius: 50%;}
    #anchor_menu li span {position:absolute;top: 50%;right: 2rem;width: 6rem;text-align:right;color: rgba(255,255,255,0.3);font-size: 1.4rem;transform: translateY(-50%);margin-right: 1rem;}
    #anchor_menu li.active span {color: #fff; font-weight: 600;}
    #anchor_menu li.active a:before {width: 3rem;height: 3rem;background: #21b8ce url(../images/main/i_anchor.png) no-repeat 50% 50%;}
    .anchor_wrap.white #anchor_menu li span {color: #c1c1c1;}
    .anchor_wrap.white #anchor_menu li.active span {color: #9a9a9a;} 

	/*gnb*/
    #gnb_area {position:relative;top:0rem;padding-right:8rem; width:1220px; margin:auto }
    .gnb_bg {position:absolute;left:0;top:7.2rem;width:100%;height:0;background-color:#fff;z-index:10;}
    .gnb_thum {position:absolute;left:50%;top:8.7rem;margin-left:-70rem;width:140rem;height:18.7rem;opacity: 0;visibility: hidden;background-image:url(../images/common/img_gnb.png);background-position:0 50%;background-repeat:no-repeat;}

    .gnb_bg.on .gnb_thum {opacity: 1;visibility: visible;}
    .gnb_bg::before {content: '';display:block; position:absolute;left:0; bottom:0; width:50%; height:100%; }
    .gnb_bg.on {border-bottom:1px solid #CCC; background:#fff ;  height:380px !important; }
    #gnb {position:relative;  width:1220px;}
    #gnb .depth2 {position:relative;height:5.0rem; overflow:hidden;border-top:0;z-index:1200; }
	
    #gnb .depth2 > li {float:left; width:14.2%}
	#gnb .depth2 > li:nth-child(1) { width:13%;}
	#gnb .depth2 > li:nth-child(3) { width:16%;}
	#gnb .depth2 > li:nth-child(4) { width:15%;}
	#gnb .depth2 > li:nth-child(6) { width:13%;}

	
    #gnb .depth2 > li > a {position: relative;display:block; height:5.0rem;text-align:center;font-weight:300; font-size:12px; font-family:'notokr-regular'}
    #gnb .depth2 > li > a::after {content:''; display: block; position: absolute; overflow: hidden; right: 50%; left: 50%; bottom: 0; height: 0.1rem; background-color: #fff; -webkit-transition: all 0.3s; transition: all 0.3s;}
	#gnb .depth2 > li > a > span {font-size:18px;}
    #gnb .depth2 > li:hover > a,
    #gnb .depth2 > li.on > a {font-weight:600;}
    #gnb .depth2 > li:hover > a::after,
    #gnb .depth2 > li.on > a::after {right:0; left: 0; background-color:#ec0000;}
    #gnb .depth2 > li:hover > a::before,
/*    #gnb .depth2 > li.on > a::before {content:''; display: block; position: absolute; overflow: hidden; right: 50%; left: 50%; bottom: -1px; width:5px;height:5px;background-color: #ec0000;}*/
    #gnb .depth2 .depthBox {padding-top:srem;background:#fff; margin-top:2rem  }
    #gnb .depth2 .depthBox li a {display:block; padding:0.8rem 0 0.8rem 0; text-align:center;color:#6e6e6e; font-size:1.4rem; line-height:15px;font-family:"malgun gothic"}
    #gnb .depth2 > li.on  .depthBox li a:hover {color: #d70909;}

    .menu_area {display:block;width: 100%;position: fixed;left:100%;top: 0;bottom:0;width: 100%;z-index: 1500;background:#063f6e;letter-spacing:-0.04em;}
    .all_menu_bg {float: left;display: block;width: 35%;height: 100%; background:url(../images/common/all_menu_bg.jpg) no-repeat 0 0;background-size: 100% 100%;}
    .menu_box {float: left;position: relative;padding: 10rem;width: 65%;height: 100%;background:#004286;}
    .menu > li {display: inline-block;width:23%;vertical-align: top;margin-bottom: 9rem;}
    .menu > li > a {display: block;margin-bottom:2rem;color: #fff;}
	.menu > li > a  span {font-size:2.2rem;font-weight:600;}
    .menu .depth2 {min-height: 18.5rem; /*display:block !important;*/}
    .menu .depth2 li {margin-bottom: 1rem;}
    .menu .depth2 li:last-child {margin-bottom: 0;}
    .menu .depth2 a {font-size: 1.6rem;color: #c7c7c8; line-height:20px}
    .menu_box .go_box {position: absolute;right: 0;left: 10rem;bottom: 10rem;}
    .menu_box .go_login {position: relative;padding-left: 55%;}
    .menu_box .go_login::before {content: '';position: absolute;left: 0;top: 50%;width: 100%;height: 0.1rem;;background: #848387;}
    .menu_box .go_login a {position: relative;display:block;padding: 3rem 0 3rem 3rem;color: #fff;font-size: 2.9rem;font-weight:600;background: #036;cursor:text;}
    .menu_box .i_lock {margin-right:2rem;vertical-align: middle;}
    .menu_close {position: absolute;right: 0;top: 0;width: 8.5rem;height: 8.5rem;text-align: center;background: #036;}
    .menu_close span {display:inline-block;position:relative;margin-top: 28%;width: 3.2rem; height: 3.2rem;color:#333;}
    .menu_close span::before,
    .menu_close span::after {content: '';display: block;position: absolute;left: 0;width: 100%;border-bottom: 0.1rem solid #fff;}
    .menu_close span::before {top:50%;transform: rotate(-45deg);}
    .menu_close span::after {bottom:50%;transform: rotate(45deg);}

    #header:hover {background:rgba(255,255,255,1);}
    #header:hover .logo a {background:url(../images/common/header_logo_on.png) no-repeat; }
    #header:hover #gnb .depth2 > li > a  {color:#2c2b2b;} 
    #header:hover .btn_menu a:before,
    #header:hover .btn_menu a:after {border-color: #2c2b2b;}
    #header:hover .btn_menu .bar {background: #2c2b2b;}
	.btn_group {position:absolute;right: 6.4rem;top:50%;width:10.5rem;height:3rem;border:0.1rem solid #fff;border-radius:1.5rem;color:#fff;transform: translateY(-50%);text-align:center;}
	#header:hover .btn_group {color:#2c2b2b;border:0.1rem solid #2c2b2b;}
	.btn_group a {display:block;width:100%;height:100%;font-size: 1.3rem;padding-left: 2rem;line-height: 3rem;background: url(../images/main/i_group_off.png) no-repeat 2rem 50%;} 
	#header:hover .btn_group a {background:url(../images/main/i_group_on.png) no-repeat 2rem 50%;}