﻿ 
div#fullpage {position: relative; width:100%; overflow: hidden;}
#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:50%; right:0; width:4.7rem; z-index:10; background:#f1f1f1; border-radius:0.75rem;}
#fp-nav ul {position:relative; display:flex; flex-direction:column; margin:0; padding:0;}
#fp-nav ul li {position:relative; height:2.5rem; width:100%; border-bottom:1px solid #dadada;}
#fp-nav ul li:nth-child(5) {border-bottom:0;}
#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.2s ease-out;}
#fp-nav ul li a:before {content:''; position:absolute; width:calc(100% + 1rem); height:100%; left:-1rem; background:#1b6755; opacity:0; border-radius:0.75rem 0 0 0.75rem;}
#fp-nav ul li a.active span {color:#fff; font-weight:700;  justify-content:flex-start; padding-left:1.5rem;}
#fp-nav ul li a.active:before {opacity:1;}
#fp-nav ul li a span {position:relative; display:flex; align-items:center;  color:#707070;justify-content:center; width:100%; height:0.9rem; transition: all 0.25s linear; font-size: 0.75rem; font-weight: 600;}
#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 > div {position:absolute; top:50%; width:100%; display:flex; align-items:center; justify-content:center; transform:translate(0, -50%); pointer-events: none; color:#fff; transition: all 0.25s linear; font-size: 0.75rem; font-weight: 600; padding-left:0.25rem;}
.right li a:not(.active) + div.fp-tooltip {transition: all 0.25s linear; font-size: 0.75rem!important; font-weight: 500!important; color:#707070!important;}

.section {height:100%; line-height: normal; display:flex;}
.section .inner {width:100%; height:100%; max-width:96rem; margin: 0 auto; line-height: normal;}
.section .inner .contents {position:relative; width:100%; height:100%; max-width:80rem; margin:0 auto; display:flex; align-items:center; justify-content:center; flex-direction:column;}
nav {position:relative;}
#container {padding-bottom:0; /*height:100vh;*/} 
.section1.active .inner .bottom-active,
.section3.active .inner .bottom-active,
.section4.active .inner .bg-active {bottom:0;}
.footer { height:auto !important; padding:0; flex-direction:column; }
#footer .footer_copy{ min-height:7rem;}
.footer nav .btnWrap {min-height:3.5rem!important;}

.fp-change ul li a span {color:#d0ccff!important;}
.fp-change ul li a:before {background:#fff!important;}
.fp-change ul li a.active span {color:#fff!important;}
.fp-watermark {display:none;}
.fp-overflow { justify-content: flex-start; max-height: 100vh}
.fp-scrollable .fp-auto-height .fp-overflow { max-height: none;}
.fp-overflow {outline: none; height:100%;}
.fp-overflow.fp-table {display: block;}
.fp-responsive .fp-auto-height-responsive.fp-section,.fp-responsive .fp-auto-height-responsive .fp-slide { height: auto!important; min-height: auto!important}
.fp-sr-only {text-indent:-9999px; position: absolute;width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0 }
.fp-scroll-mac .fp-overflow::-webkit-scrollbar { background-color: transparent; width: 9px}
.fp-scroll-mac .fp-overflow::-webkit-scrollbar-track { background-color: transparent;}
.fp-scroll-mac .fp-overflow::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,.4); border-radius: 16px; border: 4px solid transparent;}
.fp-is-overflow .fp-overflow.fp-auto-height-responsive,.fp-is-overflow .fp-overflow.fp-auto-height,.fp-is-overflow>.fp-overflow {overflow-y: auto;}
 
.section2, .section3 { overflow-x: hidden;} 

@media all and (max-width:1840px) {
    #fp-nav { width: 4rem;}
    #fp-nav ul li a.active span:before { left: -0.25rem; } 

    .section { padding: 0 6rem 0 1rem;} 
    .section1 { padding: 0;}
}

@media all and (max-width:1280px) {
    div#fullpage { overflow-y: hidden;}

    .section { padding: 0 1rem;} 
    .section1 { padding: 0;}
    .section2 { padding: 2.2rem 1rem 3.3rem;} 
    .section3 { padding: 2.5rem 1rem 1rem;} 
    .section4 { background-color: #e7f3f3; margin-top: 1rem; padding: 2.25rem 1rem 3rem;}
    .section5 { padding: 2.5rem 1rem 3.5rem;}

    .eng .section4{ margin-top: 0;}
}

@media all and (max-width:1024px) {
 
}

@media all and (max-width:768px) {
 
    .section2 { padding: 1.5rem 1rem 1.75rem;} 
    .section3 { padding: 1.1rem 1rem 2rem;} 
    .section5 {padding: 1.5rem 1rem 2rem;}
    
    .footer { max-height: 100%;}
}