@charset "UTF-8";
section {display: flex;justify-content: center;align-items: center;position:relative;}
.wrapper {position:relative;max-width:120rem;width:100%;height:100%;min-height: 30rem;}

header.navigation {display:flex;justify-content: center;align-items: center;position:fixed;top:0;left:0;right:0;margin:0;width:100%;height:12rem;z-index:100;}
header.navigation .wrapper {display:flex;justify-content: space-between;align-items: center;min-height:0;}
header.navigation ul.logo {width:21.8rem;}
header.navigation ul.logo img {width:100%;}
header.navigation ul.quick-link {display:flex;justify-content: space-between;align-items: center;}
header.navigation ul.quick-link > li {position:relative;margin-left:4rem;font-style: normal;font-weight: 700;font-size: 1.6rem;line-height: 2.3rem;color: #3B3FB5;}

header.navigation ul.quick-link .lang {display:flex;align-items: center;margin-top:0.8rem;}
header.navigation ul.quick-link .lang .name {font-size: 1.6rem;line-height: 2.3rem;height:2.4rem;}
header.navigation ul.quick-link .lang .icon > img {margin:0 0.4rem;width:2.4rem;height:2.4rem;filter: brightness(0) saturate(100%) invert(16%) sepia(97%) saturate(2848%) hue-rotate(237deg) brightness(88%) contrast(84%);}
header.navigation.active ul.quick-link .lang .icon > img {filter:none;}
header.navigation ul.quick-link .lang-list {position:absolute;display:none;margin-top:-3rem;padding:0.8rem 0.8rem;width:100%;text-align:center;border-radius:0.8rem;background-color:#FFF;border:0.1rem solid #7D8AFF;}
header.navigation ul.quick-link:hover .lang-list {display:block;}
header.navigation ul.quick-link .lang-list > div:first-child {font-weight: 400;color: #999;border-bottom:0.1rem dotted #DDD;}
header.navigation ul.quick-link .lang-list > div {margin:0 0 0.8rem 0;font-weight: 700;font-size: 1.4rem;line-height: 2.3rem;color: #222;}
header.navigation ul.quick-link .lang-list > div:last-child {margin-bottom:0rem;}
.lang-arrow-u {display:none;}

header.navigation.active ul.logo {filter: brightness(0) saturate(100%) invert(100%) sepia(1%) saturate(0%) hue-rotate(336deg) brightness(101%) contrast(100%);}
header.navigation.active ul.quick-link li {color: #FFF;}


section {min-height:60rem;}
section#page-1 {background-image:url('/static/assets/scg/img/bg_top.png');background-size:auto 25%;background-position:center top;background-repeat:no-repeat;background-color: #3B3FB5;}
section#page-2 {background-color: #E5ECFF;}
section#page-3 {background-color: #E5ECFF;}
section#page-4 {background-color: #E5ECFF;}
section#page-5 {background-color: #E5ECFF;}
section#page-6 {background-color: #E5ECFF;}
section#page-7 {background-color: #E5ECFF;}
section#page-8 {background-color: #E5ECFF;}
section#page-9 {background-color: #E5ECFF;}
section#page-10 {background-image:url('/static/assets/scg/img/bg_9s.jpg');background-size:contain;background-position:center center;}
section#page-11 {background-color: #E5ECFF;}
section#page-12 {background-color: #FFF;}
section#page-13 {background-color:#3B3FB5;}

.text-box {position:absolute;top:26rem;left:0;z-index:100;}
/* .text-box ul li.title {font-weight: 900;font-size: 6.4rem;line-height: 4.8rem;color: #222;} */
.text-box ul li.title.main {font-size:7rem;}
.text-box ul li.title.main .logoimg {display:inline-block;margin:0 0.8rem 5rem 0;vertical-align:middle;}
.text-box ul li.title.main .logoimg img {height:8.8rem;filter: brightness(0) saturate(100%) invert(100%) sepia(1%) saturate(0%) hue-rotate(336deg) brightness(101%) contrast(100%);}
.text-box ul li.title {font-weight: 900;font-size: 3.6rem;line-height: 4.8rem;color: #222;letter-spacing:-0.02em;}
.text-box ul li.logo {margin:2rem auto;width:48rem;}
.text-box ul li.logo img {width:100%;}
/* .text-box ul li.text {margin-top:4rem;font-weight: 700;font-size: 2.4rem;line-height: 3.4rem;color: #666;} */
.text-box ul li.text {margin:1.2rem auto 0;width:100%;max-width:65rem;font-weight: 700;font-size: 2rem;line-height: 2.8rem;color: #666;}
.text-box ul.button-link {display:flex;margin:4.8rem 0 0 0;}
.text-box ul.button-link li {display:block;margin-right:0.8rem;}
.text-box ul.button-link li a {display:block;padding: 1.2rem 2.4rem;font-weight: 700;font-size: 1.8rem;line-height: 3.2rem;color: #3B3FB5;background: #FFFFFF;border-radius: 8px;}

/* .text-box ul li.badge {display:inline-block;margin-bottom:2.4rem;padding: 0.8rem 1.6rem;font-weight: 700;font-size: 1.8rem;line-height: 2.5rem;text-transform: uppercase;color: #FFF;background: #01D6BC;border-radius: 10rem;} */
.text-box ul li.badge {display:inline-block;margin-bottom:1.2rem;padding: 0.8rem 1.6rem;font-weight: 700;font-size: 1.8rem;line-height: 2.5rem;text-transform: uppercase;color: #FFF;background: #3B3FB5;border-radius: 10rem;}

section#page-1 .text-box ul li.title {color: #FFF;}
section#page-1 .text-box ul li.text {color: #FFF;}
section#page-11 .text-box,
section#page-12 .text-box {position:absolute;top:18rem;width:100%;text-align:center;}
section#page-12 .text-box ul li.text {margin-top:2.4rem;}
section#page-13 .wrapper {display:flex;justify-content: center;align-items: center;background-image:url('/static/assets/scg/img/map.png');background-repeat:no-repeat;background-position:center center;background-size:contain;}
section#page-13 .text-box {position:relative;top:auto;width:100%;text-align:center;}
section#page-13 .footer-title {font-weight: 700;font-size: 7.2rem;line-height: 10.4rem;letter-spacing: -0.05em;color: #FFF;}
section#page-13 .footer-info {margin-top:4rem;font-weight: 700;font-size: 1.8rem;line-height: 2.9rem;color: #FFF;}

section#page-1 .text-box ul li.text {max-width:100%;}
section#page-9 .text-box ul li.text,
section#page-12 .text-box ul li.text {max-width:100%;}


.animation-set img {width:100%;}
.animation-set > div {position:absolute;left:50%;opacity:0;}
.obj-01 {margin-left:-62rem;bottom:-10rem;width:125.9rem;z-index:10;}
.obj-02 {margin-left:-55rem;bottom:-10rem;width:87.7rem;z-index:5;}
.pg-active .obj-01 {animation:obj-01-ani 1s forwards;}
.pg-active .obj-02 {animation:obj-02-ani 0.5s forwards;animation-delay: 0.5s;}
@keyframes obj-01-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}
@keyframes obj-02-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}

.obj-11 {margin-left:1rem;bottom:0;width:55.6rem;z-index:10;}
.obj-12 {margin-left:-17rem;bottom:8.5rem;width:30.5rem;z-index:5;}
.pg-active .obj-11 {animation:obj-11-ani 1s forwards;}
.pg-active .obj-12 {animation:obj-12-ani 0.5s forwards;animation-delay: 0.5s;}
@keyframes obj-11-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}
@keyframes obj-12-ani {from {opacity:0;bottom: 0;} to {opacity:1;bottom: 8.5rem;}}


.obj-21 {margin-left:1rem;bottom:0;width:55.6rem;z-index:10;}
.obj-22 {margin-left:-19rem;bottom:16.5rem;width:50.5rem;z-index:5;}
.pg-active .obj-21 {animation:obj-21-ani 1s forwards;}
.pg-active .obj-22 {animation:obj-22-ani 0.5s forwards;animation-delay: 0.5s;}
@keyframes obj-21-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}
@keyframes obj-22-ani {from {opacity:0;bottom: 0;} to {opacity:1;bottom: 16.5rem;}}


.obj-31 {margin-left:1rem;bottom:0;width:55.6rem;z-index:10;}
.obj-32 {margin-left:-25rem;bottom:0;width:37.5rem;z-index:5;}
.pg-active .obj-31 {animation:obj-31-ani 1s forwards;}
.pg-active .obj-32 {animation:obj-32-ani 0.5s forwards;animation-delay: 0.5s;}
@keyframes obj-31-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}
@keyframes obj-32-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}


.obj-41 {margin-left:1rem;bottom:0;width:55.6rem;z-index:10;}
.obj-42 {margin-left:-10rem;bottom:0;width:26.4rem;z-index:15;}
.pg-active .obj-41 {animation:obj-41-ani 1s forwards;}
.pg-active .obj-42 {animation:obj-42-ani 0.5s forwards;animation-delay: 0.5s;}
@keyframes obj-41-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}
@keyframes obj-42-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}



.obj-51 {margin-left:1rem;bottom:0;width:55.6rem;z-index:10;}
.obj-52 {margin-left:-40rem;bottom:8.5rem;width:50rem;z-index:5;}
.pg-active .obj-51 {animation:obj-51-ani 1s forwards;}
.pg-active .obj-52 {animation:obj-52-ani 0.5s forwards;animation-delay: 0.5s;}
@keyframes obj-51-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}
@keyframes obj-52-ani {from {opacity:0;bottom: 0;} to {opacity:1;bottom: 8.5rem;}}



.obj-61 {margin-left:1rem;bottom:0;width:55.6rem;z-index:10;}
.obj-62 {margin-left:-22rem;bottom:9.5rem;width:34.1rem;z-index:15;}
.obj-63 {margin-left:-17rem;bottom:33.5rem;width:32.1rem;z-index:5;}
.pg-active .obj-61 {animation:obj-61-ani 1s forwards;}
.pg-active .obj-62 {animation:obj-62-ani 0.5s forwards;animation-delay: 0.5s;}
.pg-active .obj-63 {animation:obj-63-ani 0.5s forwards;animation-delay: 0.8s;}
@keyframes obj-61-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}
@keyframes obj-62-ani {from {opacity:0;bottom: 0;} to {opacity:1;bottom: 9.5rem;}}
@keyframes obj-63-ani {from {opacity:0;bottom: 0;} to {opacity:1;bottom: 33.5rem;}}



.obj-71 {margin-left:1rem;bottom:0;width:55.6rem;z-index:10;}
.obj-72 {margin-left:-17rem;bottom:8.5rem;width:30.5rem;z-index:5;}
.pg-active .obj-71 {animation:obj-71-ani 1s forwards;}
.pg-active .obj-72 {animation:obj-72-ani 0.5s forwards;animation-delay: 0.5s;}
@keyframes obj-71-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}
@keyframes obj-72-ani {from {opacity:0;bottom: 0;} to {opacity:1;bottom: 8.5rem;}}


.obj-81 {margin-left:-10rem;bottom:0;width:70rem;z-index:10;}
.obj-82 {margin-left:-28rem;bottom:8.5rem;width:18rem;z-index:15;}
.pg-active .obj-81 {animation:obj-81-ani 1s forwards;}
.pg-active .obj-82 {animation:obj-82-ani 0.5s forwards;animation-delay: 0.5s;}
@keyframes obj-81-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}
@keyframes obj-82-ani {from {opacity:0;bottom: 0;} to {opacity:1;bottom: 8.5rem;}}


.obj-91 {margin-left:-21rem;bottom:0;width:80rem;z-index:10;}
.pg-active .obj-91 {animation:obj-91-ani 1s forwards;}
@keyframes obj-91-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}

.obj-101 {margin-left:-50rem;bottom:8.5rem;width:12.8rem;}
.obj-102 {margin-left:-43rem;bottom:8.5rem;width:12.8rem;}
.obj-103 {margin-left:31rem;bottom:8.5rem;width:12.8rem;}
.obj-104 {margin-left:47rem;bottom:8.5rem;width:12.8rem;}
.pg-active .obj-101 {animation:obj-101-ani 1s forwards;animation-delay: 0.5s;}
.pg-active .obj-102 {animation:obj-102-ani 0.5s forwards;animation-delay: 0.75s;}
.pg-active .obj-103 {animation:obj-103-ani 0.5s forwards;animation-delay: 1s;}
.pg-active .obj-104 {animation:obj-104-ani 0.5s forwards;animation-delay: 1.25s;}
@keyframes obj-101-ani {from {opacity:0;bottom: 0;} to {opacity:1;bottom: 20rem;}}
@keyframes obj-102-ani {from {opacity:0;bottom: 0;} to {opacity:1;bottom: 43.4rem;}}
@keyframes obj-103-ani {from {opacity:0;bottom: 0;} to {opacity:1;bottom: 31.4rem;}}
@keyframes obj-104-ani {from {opacity:0;bottom: 0;} to {opacity:1;bottom: 18.6rem;}}


@keyframes b_arrow_move {0% {bottom:10rem; opacity:0;} 80% {bottom:8rem;opacity:1;} 100% {bottom:6rem;opacity:0;}}
.bottom-arrow {position:absolute;left:0;bottom:8rem;width:5.4rem;height:3.2rem;animation:b_arrow_move 2s ease-out Infinite normal ;}
.bottom-arrow img {width:100%;}


.swiper {position:absolute !important;width:100%;max-height:56rem;height:55%;bottom:0;opacity:0;}
.swiper .swiper-slide {width:100%;text-align:center;}
.swiper .swiper-slide img {height:100%;}
.pg-active .swiper {animation:obj-swiper-ani 1s forwards;;animation-delay: 1.5s;}
@keyframes obj-swiper-ani {from {opacity:0;bottom: -10rem;} to {opacity:1;bottom: 0;}}



section#page-12 .banner-set {position:absolute;width:100%;bottom:10rem;}
section#page-12 .banner-set > div {position:relative;height:6.4rem;margin-bottom:2rem;}
section#page-12 .banner-set > div > div {position:absolute;top:0;width:384rem;height:6.4rem;}
section#page-12 .banner-set > div img {height:100%;}
.pg-active .obj-111 > div {left:0;}
.pg-active .obj-112 > div {right:0;}
.pg-active .obj-113 > div {left:0;}
.pg-active .obj-111 > div {animation:obj-111-ani 30s forwards infinite;animation-delay: 1s;}
.pg-active .obj-112 > div {animation:obj-112-ani 30s forwards infinite;animation-delay: 2s;}
.pg-active .obj-113 > div {animation:obj-113-ani 30s forwards infinite;animation-delay: 3s;}
@keyframes obj-111-ani {from {left:0;} to {left:-192rem;}}
@keyframes obj-112-ani {from {right:0;} to {right:-192rem;}}
@keyframes obj-113-ani {from {left:0;} to {left:-192rem;}}





nav {height: 100vh;position: fixed;top: 0;right:1rem;z-index: 1;display: flex;align-items: center;justify-content: center;}
nav ul {margin: 0;padding: 0;}
nav ul li {position: relative;display: block;margin:0.5rem 0;}
nav ul li a {display: block;position: relative;z-index: 1;width: 1rem;height: 1rem;cursor: pointer;text-decoration: none;background-color:rgba(59,63,181,0.3);border-radius:1rem;}
nav ul li a.active {height: 20px;background-color:rgba(59,63,181,1);}
nav ul li a.active span {display:none;}

nav.main ul li a {background-color:rgba(255,255,255,0.3);}
nav.main ul li a.active {background-color:rgba(255,255,255,0.8);}