/* 공통 */
div#fullpage {position: relative; width:100%;}
#fullpageMenu li ~ li {margin-top: 1rem;}
#fullpageMenu li a { position: relative; display: block; line-height: 1.5rem;}
#fullpageMenu li a em { display: block; width: 8px; height: 8px; background: #c7d0de; border-radius: 50%; margin:0 auto;}
#fullpageMenu li a span { display: block; font-size: 0.7rem; font-weight: 600; color: #737b87; }
#fullpageMenu li.active a em {background: #06aaff;clip-path: polygon(50% 0%, 90% 30%, 90% 70%, 50% 100%, 10% 70%, 10% 30%); width: 16px; height: 14px;}
#fullpageMenu li.active a span {color: #06aaff;}
#fp-nav {position:absolute; top:calc(50% + 3.5rem);; transform:translate(0, -50%); left:1.5rem; width:4rem; z-index:2;}
#fp-nav ul {position:relative; display:flex; flex-direction:column; margin:0; padding:0;}
#fp-nav ul:before {content:''; width:2px; height: 100%; background: #d7d7d7; position: absolute; left: 0.65rem; top:1rem;}
#fp-nav ul:after {content:'\EF7D'; font-family: 'remixicon'; position:absolute; width:2.5rem; height:2.5rem; border-radius:50%; border:2px solid #ddd; left:-0.5rem; bottom:-3rem; background:#fff; display:flex; align-items:center; justify-content:center; color:#000; font-size:1rem;}

#fp-nav ul li {position:relative; height:1.5rem; width:100%;}
#fp-nav ul li:last-child {display:none;}
#fp-nav ul li a {position:relative; display:flex; align-items:center; justify-content:center; height:100%; transition: all 0.1s ease-out;}
#fp-nav ul li a.active:before {content:''; position:absolute; width:0.75rem; border-radius:50%; height:0.75rem; left:0.35rem; background:#1b6755; border:3px solid #fff; outline:1px solid #177254;}
#fp-nav ul li a.active span {color:#177254; justify-content:flex-start; padding-left:1.5rem;}
#fp-nav ul li a.active:before {opacity:1;}
#fp-nav ul li .active ~ .fp-tooltip {color:#177254; font-weight:700; font-size:0.75rem;}
#fp-nav ul li a ~ .fp-tooltip:before {content:''; position:absolute; left:0.5rem; top:50%; transform:translate(0, -50%); border-radius:50%; width:0.45rem; height:0.5rem; background:#fff; border:2px solid #d7d7d7;}
#fp-nav ul li a span {position:relative; display:flex; align-items:center; justify-content:center; width:100%; height:0.9rem; transition: all 0.1s linear; font-size: 0.75rem; font-weight: 600; color:#707070;}
#fp-nav ul li a.active span:before {content:''; position:absolute; width:0.7rem; height:0.7rem; border-radius:50%; background:#fff; left:0.25rem; top:50%; transform:translate(0, -50%); border:3px solid #8db3aa;}
#fp-nav ul li a span:last-child {display:none;}
#fp-nav ul li > div {position:absolute; top:50%; width:100%; display:flex; align-items:flex-start; justify-content:flex-start; transform:translate(0, -50%); pointer-events: none; color:#fff; transition: all 0.25s linear; font-size: 0.75rem; font-weight: 600; padding-left:1.5rem; min-width:5rem;}
#fp-nav ul li .fp-tooltip {transition: all 0.25s linear; color:transparent;}
#fp-nav ul li .active ~ .fp-tooltip:before {display:none;}
.style-color01 ul li a.active:before {background:#3c1fbf!important; outline:1px solid #3c1fbf!important;} 
.style-color01 ul li a.active span {color:#3c1fbf!important;}
.style-color01 ul li .active ~ .fp-tooltip {color:#3c1fbf!important;}

.section {width:100%; height:100%; line-height: normal; padding:0; display:flex;}
.section .inner {width:100%; height:100%; max-width:80rem; margin: 0 auto; line-height: normal;}
.footer {max-height:30rem;}

@media screen and (max-width: 1850px){
	#fp-nav {display:none!important;}
}

/* family site */
.family-site { top: 12rem; }

@media screen and (max-width: 1240px){	
	/* 패밀리사이트 */ 
	.family-site {top:-4rem;}
}

@media screen and (max-width: 580px){
    /* 패밀리사이트 */	
	.family-site {top:2rem;}
}