/* grids column */
.grid-column-6 {display: grid; grid-template-columns: repeat(6, 1fr);}
.grid-column-1-3 {display: grid; grid-template-columns: 28% 22% 22% 22%; gap: 1.5rem;}
@media screen and (max-width:991.98px) {
  .grid-column-6 {grid-template-columns: repeat(3, 1fr);}
  .grid-column-1-3 {grid-template-columns: repeat(2, 1fr);}
}
@media screen and (max-width:575.98px) {
  .grid-column-1-3 {grid-template-columns: 1fr;}
}

/* Banner 01 */
.banner-01{position:relative; overflow:visible;}
.banner-01 .pattern.style-01{
  position:absolute; top:calc(100% - 21vw); left:0; right:0; z-index:2;
  pointer-events:none;
} 
.banner-01 .pattern.style-01 img{width:100%;}
.banner-01 .wrapper{
  position:relative; min-height:24rem;
}
.banner-01 .text-wrapper{
  position:absolute; top:0; right:0; bottom:0; left:0; pointer-events:none;
  display:flex; flex-direction:column; justify-content:center; align-items:center;
}
.banner-01 .wrapper .img-bg{
  position:absolute; top:0; right:0; bottom:0; left:0;
  background-size:cover; background-position:center; 
  background-repeat:no-repeat;
}
.banner-01 .swiper-pagination-bullets{
  bottom:1.875rem; left:50%; transform:translateX(-50%); border-radius:.9375rem;
  background:rgba(0, 63, 128, 0.64); width:auto; padding:.125rem .625rem;
}
.banner-01 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{
  border:1px solid #ffffff; background:transparent; width: .625rem;
  height:.625rem; border-radius:50%; transition: border .25s, background .25s;
  border-radius: 0% 120% 80% 120%; -webkit-transform: rotate(45deg);
  margin: 0 10px;
}
.banner-01 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active{background:#ffffff;}
.banner-01 .swiper .arrows{
  position:absolute; top:0; right:0; bottom:0; left:0; z-index:2; 
  pointer-events:none; display:flex; align-items:center; justify-content:space-between;
  padding:0 2rem;
}
.banner-01 .swiper .arrows .arrow{
  pointer-events:auto; width:2.25rem; height:2.25rem; border-radius:50%;
  display:flex; justify-content:center; align-items:center;
  background:rgba(0, 63, 128, 0.5); color:#ffffff; transition:background .25s;
}
.banner-01 .swiper .arrows .arrow:hover{background:rgba(0, 63, 128, 1);}
.banner-01 .swiper-slide .animate{
  opacity:0; transform:translateY(4rem); transition:all ease-in-out .75s;
}
.banner-01 .swiper-slide-active .animate{opacity:1; transform:none; transition-delay:var(--delay);}
.loading .banner-01 .swiper-slide .animate{opacity:0!important; transform:translateY(4rem)!important;}
.banner-01 .text-intro{text-align:center; line-height:1.2; padding:0 1rem;}

@media screen and (min-width:767.98px){
  .banner-01 .text-intro>br{display:none;}

}
@media screen and (max-width:1299.98px){
  .banner-01 .pattern.style-01{top:calc(100% - 17rem);}
}
@media screen and (max-width:1199.98px){
  .banner-01 .pattern.style-01{top:calc(100% - 21vw);}
}
@media screen and (max-width:991.98px){
  .banner-01 .pattern.style-01{top:calc(100% - 21vw);}
  .banner-01 .wrapper{min-height:22rem;}
  .banner-01 .text-intro{font-size:2.75rem;}
}
@media screen and (max-width:767.98px){
  .banner-01 .pattern.style-01{top:calc(100% - 21vw);}
  .banner-01 .wrapper{min-height:15rem;}
  .banner-01 .text-intro{font-size:2.3125rem;}
  .banner-01 .swiper-pagination-bullets{bottom:1rem;}
}
@media screen and (max-width:575.98px){
  .banner-01 .pattern.style-01{top:calc(100% - 8rem);}
  .banner-01 .wrapper{min-height:15rem;}
  .banner-01 .text-intro{font-size:2rem;}
}
@media screen and (max-width:490.98px){
  .banner-01 .pattern.style-01{top:calc(100% - 21vw);}
}
@media screen and (max-width:390.98px){
  .banner-01 .text-intro{font-size:1.75rem;}
}
@media screen and (max-width:320.98px){
  .banner-01 .pattern.style-01{top:calc(100% - 5rem);}
  .banner-01 .text-intro{font-size:1.5rem;}
}
@media screen and (min-width: 1600px) {
  .banner-01 .pattern.style-01{top: calc(100% - 21vw);}
}


/* Banner 02 */
.banner-02{position:relative; overflow:visible;}
.banner-02 .swiper{position:relative;}
.banner-02 .wrapper{
  position:relative; min-height:24rem; display:flex; align-items:center;
}
.banner-02 .text-wrapper{padding:0 0 0 2vw;}
.banner-02 .container{z-index:3;}
.banner-02 .wrapper .img-bg{
  position:absolute; top:0; right:0; bottom:0; left:0;
  background-size:cover; background-position:center; 
  background-repeat:no-repeat;
}
.banner-02 .inner-content{
  max-width:27rem; display:flex; flex-direction:column; 
  justify-content:center; align-items:center;
}
.banner-02 .inner-content .quota{
  display:block; max-width:100%; width:auto; max-height:100%; height:.75rem;
}
.banner-02 .swiper-pagination-bullets{
  bottom:1.875rem; left:50%; transform:translateX(-50%); border-radius:.9375rem;
  background:rgba(0, 63, 128, 0.64); width:auto; padding:.125rem .625rem;
}
.banner-02 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{
  border:1px solid #ffffff; background:transparent; width: .5rem;
  height:.5rem; border-radius:50%; transition: border .25s, background .25s;
  border-radius: 0% 120% 80% 120%; -webkit-transform: rotate(45deg);
}
.banner-02 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active{background:#ffffff;}
.banner-02 .swiper .arrows{
  position:absolute; top:0; right:0; bottom:0; left:0; z-index:2; 
  pointer-events:none; display:flex; align-items:center; justify-content:space-between;
  padding:0 2rem;
}
.banner-02 .swiper .arrows .arrow{
  pointer-events:auto; width:2.25rem; height:2.25rem; border-radius:50%;
  display:flex; justify-content:center; align-items:center;
  background:rgba(0, 63, 128, 0.5); color:#ffffff; transition:background .25s;
}
.banner-02 .swiper .arrows .arrow:hover{background:rgba(0, 63, 128, 1);}
.banner-02 .swiper-slide .animate{
  opacity:0; transform:translateY(4rem); transition:all ease-in-out .75s;
}
.banner-02 .swiper-slide-active .animate{opacity:1; transform:none; transition-delay:var(--delay);}
.loading .banner-02 .swiper-slide .animate{opacity:0!important; transform:translateY(4rem)!important;}
@media screen and (max-width:1299.98px){
  .banner-02 .text-wrapper{padding:0 calc(100% - 90% - 3rem);}
}
@media screen and (max-width:991.98px){
  .banner-02 .wrapper{min-height:22rem;}
  .banner-02 .text-wrapper .title{font-size:2.5rem!important;}
  .banner-02 .text-wrapper .desc{font-size:1.25rem!important;}
  .banner-02 .text-wrapper{padding:0 1rem;}
}
@media screen and (max-width:767.98px){
  .banner-02 .wrapper{min-height:18rem;}
  .banner-02 .swiper-pagination-bullets{bottom:1rem;}
  .banner-02 .text-wrapper .title{font-size:2.25rem!important;}
  .banner-02 .text-wrapper .desc{font-size:1rem!important;}
  .banner-02 .inner-content{max-width:100%;}
}
@media screen and (max-width:616.98px){
  .banner-02 .wrapper{min-height:19rem;}
  .banner-02 .text-wrapper .title{font-size:2rem!important; text-align:center;}
  .banner-02 .text-wrapper .desc{font-size:1.25rem!important; text-align:center;}
  .banner-02 .swiper .arrows{display:none;}
  .banner-02 .text-wrapper{padding:0 0;}
  .banner-02 .btns{justify-content:center;}
}
@media screen and (max-width:490.98px){
  .banner-02 .text-wrapper .desc{font-size:1.125rem!important;}
}



/* Banner 03 */
.banner-03{position:relative; overflow:visible;}
.banner-03 .swiper{position:relative;}
.banner-03 .wrapper{
  position:relative; min-height:24rem; display:flex; align-items:center;
}
.banner-03 .container{z-index:3;}
.banner-03 .wrapper .img-bg{
  position:absolute; top:0; right:0; bottom:0; left:0;
  background-size:cover; background-position:center; 
  background-repeat:no-repeat;
}
.banner-03 .swiper-pagination-bullets{
  bottom:1.875rem; left:50%; transform:translateX(-50%); border-radius:.9375rem;
  background:rgba(0, 63, 128, 0.64); width:auto; padding:.125rem .625rem;
}
.banner-03 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{
  border:1px solid #ffffff; background:transparent; width: .5rem;
  height:.5rem; border-radius:50%; transition: border .25s, background .25s;
  border-radius: 0% 120% 80% 120%; -webkit-transform: rotate(45deg);
}
.banner-03 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active{background:#ffffff;}
.banner-03 .swiper .arrows{
  position:absolute; top:0; right:0; bottom:0; left:0; z-index:2; 
  pointer-events:none; display:flex; align-items:center; justify-content:space-between;
  padding:0 2rem;
}
.banner-03 .swiper .arrows .arrow{
  pointer-events:auto; width:2.25rem; height:2.25rem; border-radius:50%;
  display:flex; justify-content:center; align-items:center;
  background:rgba(0, 63, 128, 0.5); color:#ffffff; transition:background .25s;
}
.banner-03 .swiper .arrows .arrow:hover{background:rgba(0, 63, 128, 1);}
.banner-03 .swiper-slide .animate{
  opacity:0; transform:translateY(4rem); transition:all ease-in-out .75s;
}
.banner-03 .swiper-slide-active .animate{opacity:1; transform:none; transition-delay:var(--delay);}
.loading .banner-03 .swiper-slide .animate{opacity:0!important; transform:translateY(4rem)!important;}
@media screen and (max-width:1299.98px){
  .banner-03 .text-wrapper{padding:0 calc(100% - 90% - 3rem);}
}
@media screen and (max-width:991.98px){
  .banner-03 .wrapper{min-height:22rem;}
  .banner-03 .text-wrapper .title{font-size:3rem!important;}
  .banner-03 .text-wrapper .desc{font-size:2rem!important;}
  .banner-03 .text-wrapper{padding:0 calc(100% - 90% - 1rem);}
}
@media screen and (max-width:767.98px){
  .banner-03 .wrapper{min-height:15rem;}
  .banner-03 .swiper-pagination-bullets{bottom:1rem;}
  .banner-03 .text-wrapper .title{font-size:2.25rem!important;}
  .banner-03 .text-wrapper .desc{font-size:1.75rem!important;}
}
@media screen and (max-width:616.98px){
  .banner-03 .wrapper{min-height:19rem;}
  .banner-03 .text-wrapper .title{font-size:2rem!important; text-align:center;}
  .banner-03 .text-wrapper .desc{font-size:1.25rem!important; text-align:center;}
  .banner-03 .swiper .arrows{display:none;}
  .banner-03 .text-wrapper{padding:0 0;}
  .banner-03 .btns{justify-content:center;}
}



/* Breadcrumb 01 */
.breadcrumb-01{position:relative;}
.breadcrumb-01 .breadcrumb-background>.wrapper{position:relative;}
.breadcrumb-01 .breadcrumb-background{
  position:absolute; top:0; width:100%; right:0; height:100%;
}

.breadcrumb-01 .filter-01{position:absolute; top:0; left:0; right:0; bottom:0; z-index:3;}
.breadcrumb-01 .container{z-index:3;}
.breadcrumb-01 .wrapper{
    height:15rem; display:flex; justify-content:center;
    flex-direction:column; padding:.25rem .875rem;
}
.breadcrumb-01 .img-bg{
    position:absolute; top:0; left:0; right:0; bottom:0;
    background-size:cover; background-position:center; background-repeat:no-repeat;
}
.breadcrumb-01 .link-wrapper{
    display:flex; align-items:center; flex-wrap:wrap;
}
.breadcrumb-01 .link-wrapper .link{display:flex; align-items:center; flex-wrap:wrap;}
.breadcrumb-01 .link-wrapper .link .menu{
    display:block;  overflow:hidden; white-space:nowrap;
}
.breadcrumb-01 .link-wrapper .link:last-child .menu{
  font-weight:700!important;
  display: block; display: -webkit-box; text-overflow: ellipsis;
  -webkit-box-orient: vertical; -webkit-line-clamp: 1;
  width:24rem; white-space: normal; line-height:1.5;
}
.breadcrumb-01 .link-wrapper .link .line{
    width:1.5rem; height:.125rem; margin:0 .5rem;
}
.breadcrumb-01 .link-wrapper .link .icon{margin:0 .5rem;}
.breadcrumb-01 .link-wrapper .link:last-child .icon{display:none;}
.breadcrumb-01 .text-container{position:relative;}
.breadcrumb-01 .text-container .patterns{
  position:absolute; bottom:-.125rem; left:-8rem; display:flex; flex-direction:column; align-items:center;
  justify-content:space-between; height:calc(100% - 8.5rem);
}
.breadcrumb-01 .pattern-02{margin-left:-1.3125rem; margin-top:-3rem;}
@media screen and (max-width:767.98px){
  .breadcrumb-01 .link-wrapper .link:last-child .menu{width:unset;}
}
@media screen and (max-width:575.98px){
  .breadcrumb-01 .text-container{padding:0 0 0 2.5rem;}
  .breadcrumb-01 .text-container .patterns{left:-5rem;}
  .breadcrumb-01 .link-wrapper .link {flex-wrap: nowrap;}
}
@media screen and (min-width: 768px) and (max-width: 991.98px){
  .breadcrumb-01 .text-container .patterns{bottom: -0.175rem;}
}


/* Client 01 */
.client-01{position:relative;}
.client-01 .pattern{
  position:absolute; left:0; bottom:0; right:0;
}
.client-01 .pattern img{display:block; max-width:100%; max-height:100%; width:100%; height:auto;}
.client-01 .logo-container{display:flex; flex-direction:column; align-items:center;}
.client-01 .logo{
  width:8rem; height:8rem; border-radius:50%;
  display:flex; justify-content:center; align-items:center;
}
.client-01 .logo img{
  display:block; max-width:100%; max-height:100%; width:auto; height:auto;
  filter: drop-shadow(0px 4px 10px rgba(0, 0, 0, 0.1));
}
.client-01 .swiper-pagination-bullets{
  border-radius: .9375rem; left:50%; bottom:-2.5rem;
  background:rgba(0, 0, 0, 0.56); width: auto;
  padding:.125rem .625rem; transform:translateX(-50%);
}
.client-01 .swiper-pagination-bullet{
  background:none!important; width:auto!important;
  height:auto!important; opacity:1; margin:0 .125rem!important ;
  padding:0;
}
.client-01 .swiper-pagination-bullet svg{
  display:block; width:.625rem; height:.625rem;
}
.client-01 .swiper-pagination-bullet svg path  {
  fill: transparent; stroke:#ffffff; transition:fill .25s, stroke .25s;
}
.client-01 .swiper-pagination-bullet-active svg path{fill: #ffffff;}
.client-01 .arrows{
  position:absolute; top:-3.25rem; right:0; bottom:0; left:0; z-index:2; 
  pointer-events:none; display:flex; align-items:center; justify-content:space-between;
  padding:0 2rem;
}
.client-01 .arrows .arrow{
  pointer-events:all; width:2.25rem; height:2.25rem; border-radius:50%;
  display:flex; justify-content:center; align-items:center;
  color:#ffffff; transition:background .25s; background: rgba(0, 63, 128, 0.5);
}
.client-01 .arrows .arrow:hover{background: rgba(0, 63, 128, 0.5);}
@media screen and (max-width:991.98px){
  .client-01 .arrows{padding:0;}
}
@media screen and (max-width:575.98px){
  .client-01 .ss-box{padding-bottom:1rem;}
  .client-01 .swiper-pagination-bullets{bottom:-1rem;}
}


/* E-book */
.ebook-container{
  border-radius:.375rem; box-shadow:rgba(0, 0, 0, 0.15) 0px 2px 8px;
  border:1px solid transparent;  overflow:hidden;
}
.ebook-container canvas{border-radius:.375rem;}
.ebook-container .df-ui-controls{
  width:calc(100% + .5rem); bottom:0; border-radius:0; 
  justify-content:center; align-items:center; border-top:1px solid transparent!important;
}
.ebook-container .df-container > .df-ui-next, 
.ebook-container .df-container > .df-ui-prev{
  opacity:1; transition:opacity .25s;
}
.ebook-container .df-container > .df-ui-next:hover, 
.ebook-container .df-container > .df-ui-prev:hover{opacity:.8;}
.ebook-container .more-container > .df-ui-btn:first-child{border-radius:.3125rem .3125rem 0 0;}


/* Search Result Container */
.search-no-result{
  display:flex; flex-direction:column; justify-content:center; 
  align-items:center; margin-top:3rem; margin-bottom:2rem; padding:0 1rem;
}
.search-no-result .search-title{margin-top:.75rem;}
.search-no-result svg{
    display:block; max-width:100%; width:auto; 
    max-height:100%; height:13rem;
}
@media screen and (max-width:575.98px){
    .search-no-result svg{height:11rem;}
}

   

/* Section 01 */
.section-01{position:relative;}
.section-01 .pattern{position:absolute; pointer-events:none;}
.section-01 .pattern.style-01{top:-1.25rem; left:0; right:0;}
.section-01 .pattern.style-01 img{width:100%;}
.section-01 .pattern.style-02{top:-21rem; left:0; right:0;}
.section-01 .pattern.style-02 img{width:100%;}
.section-01 .announce .text-container{
  position:relative; background: #008FD329; display:flex; align-items:center;
  height:2.5rem; border-radius:6.25rem; padding:.125rem 1.5rem .125rem 3rem;
}
.section-01 .announce .icon{
  position:absolute; top:0; left:0; bottom:0;
}
.section-01 .announce .icon img{
  display:block; max-width:100%; width:auto; max-height:100%; height:15rem;
}
.section-01 .menus-slider{width:100%; max-width:50rem; margin:0 auto;}
.section-01 .menus-slider .menu-item{
  display:flex; flex-direction:column; align-items:center; padding-top:1rem; cursor:pointer;
}
.section-01 .menus-slider .menu-item .icon{
  position:relative;  display:flex; align-items:center; justify-content:center;
} 
.section-01 .menus-slider .menu-item .icon{width:70px; height:91px;}
.section-01 .menus-slider .menu-item .icon>.img-bg{
  position:absolute; top:0; right:0; bottom:0; left:0; transition:opacity .25s;
  background-size:cover; background-repeat:no-repeat; background-position:center;
}
.section-01 .menus-slider .menu-item .icon>.img-bg.active{opacity:0;}
.section-01 .menus-slider .menu-item .icon:hover>.img-bg.inactive{opacity:0; transition:transform .3s ease-out;}
.section-01 .menus-slider .menu-item .icon>.img-bg.active{transform:scale(0); transition:.5s;}
.section-01 .menus-slider .menu-item .icon:hover>.img-bg.active{opacity:1; transform:scale(1);}
.section-01 .swiper-expand{position:relative; width:calc(100% + 10rem); margin:0 -5rem; padding:0 5rem;}
.section-01 .menus-slider .menu-item .icon{padding-top:1rem;}
.section-01 .menus-slider .menu-item .icon>img{transition:opacity .25s;}
.section-01 .menus-slider .menu-item .icon>img.active{position:absolute; opacity:0;}
.section-01 .menus-slider .menu-item .icon:hover>img.inactive{opacity:0;}
.section-01 .menus-slider .menu-item .icon:hover>img.active{opacity:1;}
.section-01 .swiper-expand .arrows{
  position:absolute; top:-.5rem; right:0; bottom:0; left:0; z-index:2; 
  pointer-events:none; display:flex; align-items:center; justify-content:space-between;
  padding:0 2rem;
}
.section-01 .swiper-expand .arrows .arrow{
  pointer-events:all; width:2.25rem; height:2.25rem; border-radius:50%;
  display:flex; justify-content:center; align-items:center;
  color:#ffffff; transition:background .25s;
}


@media screen and (max-width:1299.98px){
  .section-01 .pattern.style-01{top:-15rem;}
  .section-01 .pattern.style-02{top:-17rem;}
}
@media screen and (max-width:1199.98px){
  .section-01 .pattern.style-01{top:-14.5rem;}
  .section-01 .pattern.style-02{top:-16.5rem;}
}
@media screen and (max-width:991.98px){
  .section-01 .pattern.style-01{top:-10rem;}
  .section-01 .pattern.style-02{top:-12rem;}
  .section-01 .swiper-expand{width:100%; margin:0 0; padding:2.5rem;}
  .section-01 .swiper-expand .arrows{padding:0 0;}
  .section-01.minisite .swiper-expand{padding:0 2rem!important;}
  .section-01.minisite .menus-slider{margin-top:0!important;}
  .section-01.minisite .menus-slider .menu-item{padding-top:0!important;}
}
@media screen and (max-width:767.98px){
  .section-01 .pattern.style-01{top:-9rem;}
  .section-01 .pattern.style-02{top:-11rem;}
}
@media screen and (max-width:575.98px){
  .section-01 .pattern.style-01{top:-8rem;}
  .section-01 .pattern.style-02{top:-8rem;}
}
@media screen and (max-width:490.98px){
  .section-01 .pattern.style-01{top:-6.5rem;}
  .section-01 .pattern.style-02{top:-6.5rem;}
}
@media screen and (max-width:375.98px){
  .section-01 .pattern.style-01{top:-6rem;}
  .section-01 .pattern.style-02{top:-6rem;}
}



/* Section 02 */
.section-02{position:relative; z-index:4;}
.section-02 .pattern{position:absolute; pointer-events:none;}
.section-02 .pattern.style-01{top:1rem; left:0; bottom:0; right:0;}
.section-02.mini .pattern.style-01{top:10rem; left:0; bottom:0; right:0;}
.section-02 .pattern.style-01 img{width:100%;}
.section-02 .pattern.style-02{top:-5rem; left:0;}
.section-02 .pattern.style-02 img{width:100%;}
.section-02 .pattern.style-03{top:-1rem; right:0;}
.section-02 .pattern.style-03 img{width:100%;}
.section-02 .float-title{position:absolute; bottom:100%; left:0; right:0;}
.section-02 .wave-slot{position:relative; display:block; width:100%; max-width:13rem; margin:0 auto;}
.section-02 .map-slot{display:block; overflow:hidden;}
.section-02 .wave-slot .text-top{
  position:absolute; top:1.25rem; text-align:center; width:100%;
}
.section-02 .wave-slot .text-bottom{
  position:absolute; bottom:1.25rem; text-align:center; width:100%;
}
.section-02 .map-slot .header{
  display:flex; align-items:center; background:var(--color-p); color:#ffffff;
  height:3rem; padding:0 .5rem; border-radius:var(--bradius) var(--bradius) 0 0;
}
.section-02 .map-slot .body{
  position:relative; display:block; width:100%; border:1px solid #eeeeee;
  border-radius:0 0 var(--bradius) var(--bradius); background:#ffffff;
  padding:calc((100% - 2rem) * 1.75 / 3 - 3rem) 0 0 0; overflow:hidden;
}
.section-02 .map-slot .body > .wrapper, .section-02 .map-slot .body > .img-bg{
  position:absolute; top:0; left:0; width:100%; height:100%;
  background-size:cover; background-position:center;
}
.section-02 .map-slot .logo{display:block; height:2.5rem; width:auto;}
.section-02 .map-slot .link{
  display:flex; align-items:center; height:2.25rem; padding:0 .75rem;
  border:1.5px solid #ffffff; background:var(--color-p); color:#ffffff;
  font-size:1rem; font-weight:500; cursor:pointer; transition:all .25s;
}
.section-02 .map-slot .link:hover{background:#ffffff; color:var(--color-p);}
.section-02 .map-slot .options{display:flex; margin:0 0 0 auto;}
.section-02 .map-slot .icon{
  display:flex; align-items:center; justify-content:center; width:2rem; height:2rem;
  font-size:.875rem; font-weight:400; color:#ffffff; border-radius:50%;
  cursor:pointer; white-space:nowrap; transition:all .25s;
}
.section-02 .map-slot .icon:hover{background:rgba(255,255,255,.2);}
@media screen and (max-width:991.98px){
  .navbar-header a.navbar-icon{margin-left:8px!important;}
}
@media screen and (max-width:767.98px){
  .section-02 iframe.map{height:18rem;}
  .section-02 .float-title{display:none;}
  .section-02 .ss-img{padding:100% 0 0 0;}
}


/* Section 03 */
.section-03{position:relative; overflow:hidden;}
.section-03 .pattern{position:absolute; pointer-events:none;}
.section-03 .pattern.style-01{top:-42rem; left:0; bottom:0; right:0;}
.section-03 .pattern.style-01 img{
  display:block; max-width:100%; max-height:100%; width:auto; height:auto;
}
.section-03 > .container{position:relative;}
.section-03 > .img-bg{
  position:absolute; top:0; left:0; width:100%; height:calc(100% + .0625rem);
  background-size:cover; background-position:bottom center;
}
.section-03 .panel-card{
  position:relative; padding:2rem 1rem .5rem 1rem;
  background:#ffffff; box-shadow:rgba(100,100,111,.2) 0px 7px 29px 0px;
}
.section-03 .panel-card .card-title{
  position:absolute; top:-1.5rem; left:1rem; padding:.75rem 1rem;
  background:var(--color-p); color:#ffffff; border: 1px solid;
}
.section-03 .panel-card .item{
  display:flex; align-items:center; width:100%; cursor:pointer; padding:1.125rem 0;
  border-bottom:1px solid #eeeeee; transition:color .25s;
}
.section-03 .panel-card .item:last-child{border-bottom:0;}
.section-03 .panel-card .item:hover{color:var(--color-p);}
.section-03 .panel-card .item .dot{
  display:block; width:.5rem; height:.5rem; margin:0 .875rem 0 .25rem; 
  transition:background .25s; border:1px solid var(--color-p); transition:border .25s; 
  border-radius:0% 120% 80% 120%; -webkit-transform: rotate(135deg); 
}
.section-03 .panel-card .item:hover .dot{background:var(--color-p);}
.section-03 .panel-card .item .text-wrapper{width:calc(100% - 1.875rem);}
.section-03 .panel-card .item .tag{
  display:inline-block; border-radius:100em; background:var(--color-s); color:#ffffff;
  padding:.1875rem .375rem .125rem .375rem; font-size:60%; transform:translateY(-.0625rem);
}
.section-03 .tag-title{
  display:block; width:100%; max-width:17rem; text-align:center; border-radius:100em;
  padding:.5625rem 1rem; margin:1rem 0 1.5rem 0; background:rgba(0,0,0,.5);
}
.section-03 .swiper-expand{position:relative; width:calc(100% + 12rem); margin:0 -6rem; padding:0 6rem;}
.section-03 .swiper{padding-bottom:2.875rem;}
.section-03 .swiper-pagination-bullets{
  bottom:0; left:50%; transform:translateX(-50%); border-radius:.9375rem;
  background:rgba(0, 0, 0, 0.56); width:max-content; padding:.125rem .625rem;
  margin-top:2rem;
}
.section-03 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{
  border:1px solid #ffffff; background:transparent; width: .5rem;
  height:.5rem; border-radius:50%; transition: border .25s, background .25s;
  border-radius: 0% 120% 80% 120%; -webkit-transform: rotate(45deg);
}
.section-03 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active{background:#ffffff;}
.section-03 .swiper-expand .arrows{
  position:absolute; top:-3.25rem; right:0; bottom:0; left:0; z-index:2; 
  pointer-events:none; display:flex; align-items:center; justify-content:space-between;
  padding:0 2rem;
}
.section-03 .swiper-expand .arrows .arrow{
  pointer-events:all; width:2.25rem; height:2.25rem; border-radius:50%;
  display:flex; justify-content:center; align-items:center;
  color:#ffffff; transition:background .25s; background:rgba(0, 0, 0, 0.5);
}
.section-03 .swiper-expand .arrows .arrow:hover{background:rgba(0, 0, 0, 1);}

.section-03 .swiper-expand .swiper-02 {overflow: hidden;}
.section-03 .swiper-expand.swiper-horizontal .arrows .arrow {position: relative; background: #ffffff; color: #008FD3;}
.section-03 .swiper-expand.swiper-horizontal .arrows .arrow::before {
  content: ''; position: absolute; width: 100%;
  height: 100%; border-radius: 100%; background: rgba(255, 255, 255, 0.4); opacity: 0;
}
.section-03 .swiper-expand.swiper-horizontal .arrows .arrow:hover::before {animation: waves 1.5s linear infinite;}
.section-03 .swiper-expand .swiper-pagination-bullets{position: relative;}

.section-03 .magazine-recommend {
  max-width: 1000px;
  margin: 2rem auto 1rem !important;
}
.section-03 .magazine-recommend .swiper-slide {padding: 1rem;}
@media screen and (max-width:1299.98px){
  .section-03 .swiper-expand{width:100%; margin:0 0; padding:0 4rem;}
  .section-03 .swiper-expand .arrows{top:-1.875rem; padding:0 0;}
}
@media screen and (max-width:1199.98px){
  .section-03 .swiper-expand{width:100%; margin:0 0; padding:0 3.5rem;}
  .section-03 .swiper-expand.swiper-horizontal{padding: 0;}
  .section-03 .swiper-expand.swiper-horizontal .arrows .arrow {display: none;}
}
@media screen and (max-width:991.98px){
  .section-03 .panel-card{margin-top:1.5rem;}
}
@media screen and (max-width:490.98px){
  .section-03 .swiper-expand .arrows .arrow{width:2rem; height:2rem; font-size:.875rem;}
}

.section-03 .pattern{position:absolute; top:-32rem; left:0; right:0;}
@media screen and (max-width:1299.98px){
  .section-03 .swiper-expand{width:100%; margin:0 0; padding:0 4rem;}
  .section-03 .swiper-expand .arrows{top:-1.875rem; padding:0 0;}
}
@media screen and (max-width:1199.98px){
  .section-03 .swiper-expand{width:100%; margin:0 0; padding:0 3.5rem;}
}
@media screen and (max-width:991.98px){
  .section-03 .panel-card{margin-top:1.5rem;}
}
@media screen and (max-width:490.98px){
  .section-03 .swiper-expand .arrows .arrow{width:2rem; height:2rem; font-size:.875rem;}
}


/* Section 04 */
.section-04{position:relative; height:25rem; display:flex; align-items:center;}
.section-04 .container{z-index:3;}
.section-04 .img-bg{
  position:absolute; top:0; right:0; bottom:0; left:0;
  background-size:cover; background-position:top; 
  background-repeat:no-repeat;
}
.section-04 .filter{position:absolute; top:0; right:0; bottom:0; left:0; pointer-events:none; z-index:2;}
@media screen and (max-width:575.98px){
  .section-04 .img-bg{background-position:left;}
}


/* Section 05 */
.section-05 .panel-card{
  position:relative; padding:1rem 0 .5rem 0;
}
.section-05{position:relative; z-index:1;}
.section-05 .img-bg{
  position:absolute; top:0; right:0; bottom:0; left:0;
  background-size:cover; background-position:top; 
  background-repeat:no-repeat;
}
.section-05 .swiper-01{padding:0 0rem 2rem 0rem}
.section-05 .panel-card .card-title{
  position:absolute; top:-1.5rem; left:1rem; padding:.75rem 1rem;
  background:var(--color-p); color:#ffffff;
}
.section-05 .panel-card .item{
  display:flex; align-items:center; width:100%; cursor:pointer; padding:.875rem 0;
  border-bottom:1px solid; transition:color .25s;
}
.section-05 .panel-card .item .title{
  display:block; display:-webkit-box; text-overflow:ellipsis; overflow:hidden;
  -webkit-box-orient:vertical; transition:color .25s;
}
.section-05 .panel-card .item .title{-webkit-line-clamp:1;}
.section-05 .panel-card .item:last-child{border-bottom:0;}
.section-05 .panel-card .item:hover{color:var(--color-p);}
.section-05 .panel-card .item .dot{
  display:block; width:.5rem; height:.5rem; margin:0 .875rem 0 .25rem; 
  transition:background .25s; border:1px solid; transition:border .25s; 
  border-radius:0% 120% 80% 120%; -webkit-transform: rotate(135deg); 
}
.section-05 .panel-card .item:hover .dot{background:var(--color-p);}
.section-05 .panel-card .item .text-wrapper{width:calc(100% - 1.875rem);}
.section-05 .panel-card .item .tag{
  display:inline-block; border-radius:100em; background:var(--color-s); color:#ffffff;
  padding:.1875rem .375rem .125rem .375rem; font-size:60%; transform:translateY(-.0625rem);
}
.section-05 .tag-title{
  display:block; width:100%; max-width:17rem; text-align:center; border-radius:100em;
  padding:.5625rem 1rem; margin:1rem 0 1.5rem 0; background:rgba(0,0,0,.5);
}
.section-05 .swiper-01{padding:0 .5rem 7rem .5rem;}
.section-05 .swiper-pagination-bullets{
  bottom:1.75rem; left:50%; transform:translateX(-50%); border-radius:.9375rem;
  width:auto; padding:.125rem .625rem;
  margin-top:2rem;
}
.section-05 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{
  border:1px solid var(--color-p); background:transparent; width: .5rem;
  height:.5rem; border-radius:50%; transition: border .25s, background .25s;
  border-radius: 0% 120% 80% 120%; -webkit-transform: rotate(45deg);
}
.section-05 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active{background:var(--color-p);}
.section-05 .swiper-02{position:relative;}
.section-05 .swiper-02 .arrows{
  position:absolute; top:0; right:0; bottom:0; left:0; z-index:2; 
  pointer-events:none; display:flex; align-items:center; justify-content:space-between;
  padding:0 .625rem;
}
.section-05 .swiper-02 .arrows .arrow{
  pointer-events:all; width:1.9375rem; height:1.9375rem; border-radius:50%;
  display:flex; justify-content:center; align-items:center;
  color:#ffffff; transition:background .25s; background:rgba(0, 0, 0, 0.5);
}
.section-05 .swiper-02 .arrows .arrow:hover{background:rgba(0, 0, 0, 1);}
.section-05 .show-mobile{position:absolute; opacity:0; pointer-events:none;}
.section-05 .swiper-tabs-01 .tab.active{color:var(--color-p);}
.section-05 .swiper-expand{position:relative; padding:0 1.5rem;}
.section-05 .swiper-expand .arrows{
  position:absolute; top:0; right:0; bottom:0; left:0; z-index:2; 
  pointer-events:none; display:flex; align-items:center; justify-content:space-between;
}
.section-05 .swiper-expand .arrows .arrow{
  pointer-events:auto; width:2.25rem; height:2.25rem; display:flex; align-items:center;
  transition:background .25s; background:#ffffff; justify-content:center;
}
.section-05 .swiper .swiper-slide{height:100%!important; overflow:hidden;}
.section-05 .swiper{height:31rem;}
.section-05 .swiper .swiper-pagination-bullets {
  border-radius: .9375rem; top:unset; left:50%; bottom:0;
  width: auto; display:flex; justify-content:center;
  padding:.125rem .625rem; transform:translateX(-50%);
}
.section-05 .swiper .swiper-pagination-bullet {
  opacity:1; margin:0 .125rem!important; padding:0;
}
.section-05 .swiper .swiper-pagination-bullet svg{
  display:block; width:.625rem; height:.625rem;
}
.section-05 .swiper .swiper-pagination-bullet svg path  {
  fill: transparent; stroke:#AEADAD; transition:fill .25s, stroke .25s;
}
.section-05 .swiper .swiper-pagination-bullet-active svg path{fill:#008FD3; stroke:#008FD3;}
@media screen and (max-width:1199.98px){
  .section-05 .swiper{height:427px;}
}
@media screen and (max-width:991.98px){
  .section-05 #btn02{position:relative; margin-top:.5rem;}
  .section-05 .panel-card{padding:0 0 0 0;}
}
@media screen and (max-width:767.98px){
  .section-05 .swiper-01{padding-bottom:5rem;}
  .section-05 .swiper-pagination-bullets{bottom:2.875rem;}
  .section-05 .panel-card{padding:1rem 0 0 0;}
  .section-05 #btn01{transform:translateX(-50%); left:50%; right:unset;}
  .section-05 #btn02{display:flex; align-items:center!important; justify-content:center!important;}
  .section-05 .show-mobile{position:relative; opacity:1; pointer-events:all;}
  .section-05 .hide-mobile{position:absolute; opacity:0; pointer-events:none;}
  .section-05 .swiper{height:400px;}
}
@media screen and (max-width:575.98px){
  .section-05 .swiper.type-magazine{height: 60rem;}
}
@media screen and (max-width:490.98px){
  .section-05 .swiper{height:370px;}
  .section-05 .swiper.type-magazine{height: 55rem;}
}
@media screen and (max-width:390.98px){
  .section-05 .swiper{height:300px;}
  .section-05 .swiper.type-magazine{height: 45rem;}
}
@media screen and (max-width:320.98px){
  .section-05 .swiper{height:270px;}
}


/* Section 06 */
.section-06{position:relative; z-index:2;}
.section-06 .swiper{overflow:unset; padding-bottom:2rem;}
.section-06 .swiper-pagination-bullets{
  bottom:0; left:50%; transform:translateX(-50%); border-radius:.9375rem;
  width:max-content; padding:.125rem .625rem; margin-top:2rem; 
}
.section-06 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{
  border:1px solid var(--color-p); background:transparent; width: .5rem;
  height:.5rem; border-radius:50%; transition: border .25s, background .25s;
  border-radius: 0% 120% 80% 120%; -webkit-transform: rotate(45deg);
}
.section-06 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet-active{background:var(--color-p);}


/* Section 07 */
.section-07{position:relative;}
.section-07 .panel-right{position:relative; width:65%; height:35rem;}
.section-07 .panel-left{width:35%;}
.section-07 .panel-right .img-bg{
  position:absolute; top:0; left:0; right:0; background-repeat:no-repeat;
  bottom:0; background-size:cover; background-position:center;
}
.section-07 .panel-right .content{
  position:relative; display:flex; justify-content:center; text-align:center;
  align-items:end; z-index:2; padding:5rem; height:100%; flex-direction:column;
}
.section-07 .panel-left{position:absolute; top:0; right:0; bottom:0; height:100%;}
.section-07 .panel-left .swiper{height:100%;}
.section-07 .panel-left .swiper-slide{height:calc(100%/4); overflow:hidden;}
.section-07 .panel-left .organization-menu{position:relative; height:100%; display: block;}
.section-07 .panel-left .organization-menu .menu-bg{
  position:absolute; top:0; right:0; width:12rem; background-repeat:no-repeat;
  bottom:0; background-size:cover; background-position:center; transition:transform .3s;
}
.section-07 .panel-left .organization-menu:hover .menu-bg{transform:scale(1.1);}
.section-07 .panel-left .organization-menu .content{
  position:relative; height:100%; display:flex;
  align-items:center; z-index:2; padding:1.5rem;
}
.section-07 .panel-left .organization-menu .content .text{padding-left:1rem;}
.section-07 .panel-left .content .logo img{
  display:block; width:auto; height:5.5rem;
}
.section-07 .panel-left .content .logo.sm img{height:4.875rem;}
.section-07 .panel-left .swiper-pagination-bullets {
  border-radius: .9375rem; right:1.25rem;
  background: rgba(0, 0, 0, 0.56);
  width: auto;
  padding: .125rem .625rem;
}
.section-07 .panel-left .swiper-pagination-bullets .swiper-pagination-bullet {
  border: 1px solid #ffffff; background: transparent; width:.5rem;
  height:.5rem; margin:.5rem 0; border-radius:50%;
  transition: border .25s, background .25s;
  border-radius: 0% 120% 80% 120%;
  -webkit-transform: rotate(45deg);
}
.section-07 .panel-left .swiper-pagination-bullets .swiper-pagination-bullet-active {
  background: #ffffff;
}
.section-07 > .img-bg.bg-filter-black::before {
  content: ''; position: absolute;
  width: 100%; height: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, .35) 0%, rgb(0, 0, 0, .5) 100%);
}

.section-07 .swiper-pagination-bullet-active svg{fill:#ffffff;}
@media screen and (max-width:1299.98px){
  .section-07 .panel-left .organization-menu .title{font-size:1.25rem;}
}
@media screen and (max-width:1199.98px){
  .section-07 .panel-left .organization-menu .title{font-size:1.125rem;}
  .section-07 .panel-left .content .logo img{height:5.4375rem;}
  .section-07 .panel-left .content .logo.sm img{height:4.625rem;}
  .section-07 .panel-right{width:60%;}
  .section-07 .panel-left{width:40%;}
}
@media screen and (max-width:991.98px){
  .section-07 .panel-left .content .logo img{height:5.375rem;}
  .section-07 .panel-left .content .logo.sm img{height:4.5rem;}
}
@media screen and (max-width:767.98px){
  .section-07 .panel-right, .section-07 .panel-left{width:100%;}
  .section-07 .panel-left{position:relative; top:unset; right:unset; bottom:unset; height:33rem;}
  .section-07 .panel-left .organization-menu .content{height:unset;}
  .section-07 .panel-left .swiper-slide{height:auto!important;}
  .section-07 .panel-left .organization-menu{display:block; height:100%;}
  .section-07 .panel-left .md-no-br>br{display:block;}
  .section-07 .panel-left .organization-menu .title{font-size:1.25rem;}
  .section-07 > .img-bg.mobile-bg-filter-black::before {
    content: ''; position: absolute;
    width: 100%; height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, .35) 0%, rgb(0, 0, 0, .5) 100%);
  }
  
}
@media screen and (max-width:575.98px){
  .section-07 .panel-right{height:25rem;}
  .section-07 .panel-right .content{align-items:center; padding:2rem;}
  .section-07 .panel-left{height:31rem;}
}
@media screen and (max-width:490.98px){
  .section-07 .panel-left .organization-menu .title{font-size:1.125rem;}
  .section-07 .panel-left .content .logo img{height:5rem;}
  .section-07 .panel-left .content .logo.sm img{height:4rem;}
  .section-07 .panel-left .md-no-br>br{display:none;}
}
@media screen and (max-width:390.98px){
  .section-07 .panel-left .organization-menu .title{font-size:1.0625rem;}
  .section-07 .panel-left .content .logo img{height:4.375rem;}
  .section-07 .panel-left .content .logo.sm img{height:3.5rem;}
  .section-07 .panel-left .md-no-br>br{display:none;}
  .section-07 .panel-left{height:29rem;}
}

.section-07 > .img-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Section 08 */
.section-08{position:relative;}
.section-08 .container{z-index:3;}
.section-08 .swiper{border-radius:1.5rem;}
.section-08 .img-bg{
  position:absolute; top:0; right:0; bottom:0; left:0; pointer-events:none;
  background-size:cover; background-position:left; background-repeat:no-repeat;
}
.section-08 .filter{
  position:absolute; top:0; left:0; right:0; height:calc(100% - 2rem); z-index:2;
  pointer-events:none;
}
.section-08 .swiper-pagination-bullets {
  border-radius: .9375rem;  left:50%; bottom:-2.75rem;
  background:rgba(0, 0, 0, 0.56); width: auto;
  padding:.125rem .625rem; transform:translateX(-50%);
}
.section-08 .swiper-pagination-bullet {
  background:none!important; width:auto!important;
  height:auto!important; opacity:1; margin:0 .125rem!important ;
  padding:0;
}
.section-08 .swiper-pagination-bullet svg{
  display:block; width:.625rem; height:.625rem;
}
.section-08 .swiper-pagination-bullet svg path  {
  fill: transparent; stroke:#ffffff; transition:fill .25s, stroke .25s;
}
.section-08 .arrows{
  position:absolute;  top:0; bottom:0; left:0; right:0; z-index:2; max-width:100%; padding:0; opacity:1;
  pointer-events:none; display:flex; align-items:center; justify-content:space-between; transition:opacity .25s;
  padding:0 2rem 0 2rem; width:100%;
}
.section-08 .arrows .arrow{
  width:2rem; height:2rem; display:flex; border-radius:50%; transition:opacity .25s; position:relative;
  justify-content:center; align-items:center; font-size:.75rem; pointer-events:auto; z-index:2;
}
.section-08 .arrows .arrow:hover{opacity:.7;}
.section-08 .arrows .arrow::before{
  content:''; width:2.5rem; height:2.5rem; position:absolute; z-index:1;
  opacity:.5; border-radius:50%;
}
.section-08 .arrows .arrow svg {position: relative; z-index: 1;}
.section-08 .swiper-pagination-bullet-active svg path{fill: #ffffff;}
@media screen and (max-width:1299.98px){
  .section-08 .arrows{padding:0 1rem 0 1rem;}
}
@media screen and (max-width:1199.98px){
  .section-08 .arrows{bottom:calc(-100% - 3.5rem);}
}
@media screen and (max-width:991.98px){
  .section-08{padding-bottom:4.5rem;}
  .section-08 .arrows{bottom:calc(-100% - 3.9375rem);}
}

@media screen and (max-width:767.98px){
  .section-08{padding-bottom:4rem;}
}

/* Sectopn 08 */
.section-08 .swiper-container{position: relative; overflow: hidden;}
.section-08 .swiper-container .arrows{
  position:absolute; top:0; right:0; bottom:0; left:0; z-index:2; 
  pointer-events:none; display:flex; align-items:center; justify-content:space-between;
  padding:0 2rem;
}
.section-08 .swiper-container .arrows .arrow{
  position: relative;
  pointer-events:all; width:2.25rem; height:2.25rem; border-radius:50%;
  display:flex; justify-content:center; align-items:center;
  transition:background .25s; background:rgba(255, 255, 255, 1);
}
.section-08 .swiper-container .arrows .arrow::before {
  content: ''; position: absolute; width: 100%;
  height: 100%; border-radius: 100%; background: rgba(255, 255, 255, 0.4); opacity: 0;
}
.section-08 .swiper-container .arrows .arrow:hover::before {animation: waves 1.5s linear infinite;}

/* Section 09 */
.section-09 .detail-options{
  display:flex; align-items:center; justify-content:space-between;
}
.section-09 .panel-right{padding-left:1.25rem;}
.section-09 .social-options>.wrapper{display:flex; align-items:center;}
.section-09  .options{display:flex; align-items:center;}
.section-09 .social-options .social-wrapper{display:flex; align-items:center;}
.section-09 .social-options .social-wrapper .social{margin: 0 .25rem; transition: opacity .25s; }
.section-09 .social-options .social-wrapper .social svg circle,
.section-09 .options .option svg circle{transition: fill .25s}
.section-09  .options .option{margin: 0 .25rem; transition: opacity .25s;}
.section-09 .youtube-player{width:100%; min-height:35rem;}

.section-09 .arrows{
  position:absolute;  top:0; bottom:0; left:0; right:0; z-index:2; max-width:100%; padding:0; opacity:1;
  pointer-events:none; display:flex; align-items:center; justify-content:space-between; transition:opacity .25s;
  padding:0 2rem 0 2rem; width:100%;
}
.section-09 .arrows .arrow{
  width:2rem; height:2rem; display:flex; border-radius:50%; transition:opacity .25s; position:relative;
  justify-content:center; align-items:center; font-size:.75rem; pointer-events:auto; z-index:2;
}
.section-09 .arrows .arrow:hover{opacity:.7;}
.section-09 .arrows .arrow::before{
  content:''; width:2.5rem; height:2.5rem; position:absolute; z-index:1;
  opacity:.5; border-radius:50%;
}
@media screen and (max-width:991.98px){
  .section-09 .detail-options{flex-wrap:wrap;}
  .section-09 .detail-options .social-options{margin-top:.75rem;}
}


/* Section 10 */
.section-10 .swiper-pagination-bullets {
  border-radius: .9375rem;  left:50%; bottom:-2.75rem;
  width:auto; padding:.125rem .625rem; transform:translateX(-50%);
}
.section-10 .swiper-pagination-bullet {
  background:none!important; width:auto!important;
  height:auto!important; opacity:1; margin:0 .125rem!important ;
  padding:0;
}
.section-10 .swiper-pagination-bullet svg{
  display:block; width:.625rem; height:.625rem;
}
.section-10 .swiper-pagination-bullet svg path  {
  fill: transparent; stroke:#008FD3; transition:fill .25s, stroke .25s;
}
.section-10 .swiper-pagination-bullet-active svg path{fill:#008FD3;}


/* Section 19 */
.section-19 .ss-card-05.card-column-02 > div:nth-child(2){padding-top:3.5rem; padding-bottom:1rem;}
.section-19 .ss-card-05 > div:nth-child(1){width: 20%;}
.section-19 .ss-card-05 > div:nth-child(2){width:80%; position:relative; display:flex;  padding:2rem;}


/* Services Container */
.services-container .header{display:flex;}
.services-container .header .topic{
  width:50%; text-align:center; height:3.5rem; font-size:1.0625rem; justify-content:center;
  font-weight:500; padding:1rem; display:flex; align-items:center; transition:background .25s;
}
.services-container .menus-services:not(.swiper-2){display:flex; flex-wrap:wrap;}
.services-container .menu-item{width:16.66%;}
.services-container.intranet .menu-item{width:12.5%;}
@media screen and (max-width:1199.98px){
  .services-container.intranet .menu-item{width:calc(100% / 4);}
}
@media screen and (max-width:991.98px){
  .services-container .menu-item{width:calc(100% / 3);}
}
@media screen and (max-width:559.98px){
  .services-container.intranet .menu-item{width:calc(100% / 2);}
}
@media screen and (max-width:425.98px){
  .services-container .menu-item{width:calc(100% / 2);}
}

/* Intro */
.intro-01{
  display:block; position:relative; width:100%;
  height:100vh; overflow:hidden;
}
.intro-01 .intro-container {
  position:relative; width:100%; height: calc(100% - 9.4rem);
}
.intro-01 .swiper{height:100%; position: relative;}
.intro-01{position:relative;}

.intro-01 .swiper-slide{position:relative; overflow:hidden;}
.intro-01 .swiper-slide > .wrapper{position:relative; width:100%; height:100%;}
.intro-01 .swiper-slide .img-bg{
  position:absolute; top:0; left:0; right:0; bottom:0; transition:opacity .25;
  background-size:cover; background-position:top; background-repeat:no-repeat;
}
.intro-01 .intro-footer{
  position:relative; display: block;
}
.intro-01 .intro-footer .pattern-01{
  position: absolute; height: 7.1rem;
  bottom: calc(100% + 2rem); left: 6vw;
  z-index: 3;
}
.intro-01 .intro-footer .pattern-01 img {max-width: 10rem;}
.intro-01 .intro-footer .pattern-02{
  position:absolute; max-width:100%; width:auto; max-height:100%;
  height:15rem; top:-6rem; right:0; z-index:3;
}
.intro-01 .intro-footer .footer-bg{
  position:relative; height: 2.9375rem;
}
.intro-01 .intro-footer>.footer-content{z-index:3;}
.intro-01 .swiper .arrows{
  position:absolute; top:0; right:0; bottom:0; left:0; z-index:1; opacity:0;
  pointer-events:none; display:flex; align-items:center; justify-content:space-between; transition:opacity .25s;
  padding:0 2rem;
}
.intro-01 .swiper-pagination-bullet{opacity:1; bottom:1rem;}
.intro-01:hover .arrows{opacity:1;}
.intro-01 .arrows .arrow{
  width:1.75rem; height:1.75rem; display:flex; border-radius:50%; transition:opacity .25s;
  justify-content:center; align-items:center; font-size:.75rem; pointer-events:auto;
}
.intro-01 .arrows .arrow:hover{opacity:.7;}
.intro-01 .arrows .arrow svg{
  display:block; max-width:100%; width:auto; max-height:100%; height:.625rem;
}
.intro-01 .swiper-pagination-bullets{bottom:1rem;}
.intro-01 .footer-content{
  position: relative;
  margin: 2rem 0; padding: 0 1rem;
  background-size: cover; background-repeat: no-repeat; background-position: center;
}
.intro-01 .logo-container{display:flex; align-items:center; justify-content:center;}
.intro-01 .logo-container .logo{margin-right:.5rem;}
.intro-01 .logo-container .logo img{
  display:block; max-width:100%; width:auto; max-height:100%; 
  height:4.5rem;
}
@media screen and (max-width:1299.98px){
  /* .intro-01 .footer-content{margin-top:-1rem;} */
  .intro-01 .swiper-pagination-bullets{bottom:1.5rem;}
}
@media screen and (max-width:991.98px){
  .intro-01 .intro-footer .pattern-01 {left: 0;}
}
@media screen and (max-width:767.98px){
  .intro-01 .intro-container{height: calc(100% - 6.4rem);}
  .intro-01 .footer-content {margin: 1rem 0;}
  .intro-01 .intro-footer .footer-bg{height: 1.9375rem;}
  .intro-01 .intro-footer .pattern-01{height:10rem; bottom: calc(100% - 2rem);}
  .intro-01 .intro-footer .pattern-02{height:10rem; top:-6rem;}
}
@media screen and (max-width:575.98px){
  .intro-01 .intro-container{height: calc(100% - 9.9rem);}
  .intro-01 .intro-footer .pattern-01{display:none;}
  .intro-01 .intro-footer .pattern-02{height:10rem; top:-6rem;}
}
@media screen and (max-width:490.98px){
  .intro-01 .logo-container .logo img{height:3.5rem;}
  .intro-01 .intro-footer .pattern-02{height:8rem;}
}

/* Timeline */
.timeline .timeline__content {display: flex;}
.timeline .timeline__content .timeline__year {
  width: 20%;position: relative;padding: 0 4rem 0 1rem;
}
.timeline .timeline__content .timeline__year::before {
  content: "";position: absolute;top: .95rem;right: 3rem;
  height: calc(100% - 0.98rem);width: 0px;
  border: 1px solid transparent;
  margin-top: 0.5rem;
}
.timeline.last .timeline__content:last-child .timeline__year::before {display: none;}
.timeline .timeline__content .timeline__year::after {
  content: "";position: absolute;
  top: 0.65rem;right: 2.65rem;width: 0.625rem;height: 0.625rem;
  border: 2px solid transparent;
  border-radius: 0% 120% 100% 120%;-webkit-transform: rotate(45deg);
}
.timeline .timeline__content .timeline__desc {
  width: 80%;padding-bottom: 2rem;
}
.timeline.up {position: relative;}
.timeline.up::before {
  content: "";position: absolute;
  bottom: calc(100% - .6rem);left: calc(20% - 3.1rem);
  height: 4.5rem;width: 0;
  border: 1px solid transparent;
}
@media screen and (max-width: 1199.98px) {
  .timeline .timeline__content .timeline__year {width: 32%;}
  .timeline .timeline__content .timeline__desc {width: 68%;}
  .timeline.up::before {left: calc(32% - 3.1rem);}
}
@media screen and (max-width: 767.98px) {
  .timeline .timeline__content .timeline__year {width: 30%; padding-right: 0;}
  .timeline .timeline__content .timeline__year::before,
  .timeline.up::before{
    right: unset;left: 0;
  }
  .timeline .timeline__content .timeline__year::after{
    right: unset;left: -.375rem;
  }
}

/* Sitemap */
.sitemap-01 .sitemap-grids {
  display: grid; gap: .5rem; grid-template-columns: repeat(3, 1fr);
}
.sitemap-01 .sitemap-list {
  list-style: none; padding-left: 1.2rem; margin-bottom: 4rem;
}
.sitemap-01 .sitemap-list li {
  display: flex; gap: 1rem;
  margin: .5rem 0; font-weight: 400;
}
.sitemap-01 .sitemap-list li .icon {transition: .3s all;}
.sitemap-01 .sitemap-list li:hover .icon {
  transform: rotate(90deg);
}
@media screen and (max-width: 991.98px) {
  .sitemap-01 .sitemap-grids {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 575.98px) {
  .sitemap-01 .sitemap-grids {
    grid-template-columns: repeat(1, 1fr);
  }
}


/* Section 17 */
.section-17 .wrapper .tag {display: flex; margin-bottom: 1.5rem;}
.section-17 .wrapper .tag .tab-content {
  padding: 0.5rem 1rem; margin-right: .3rem; border-radius: 0.375rem;
  border: 1px solid transparent;
}


/* Chart 02 */
.chart-container-02{display:flex; flex-wrap: wrap; align-items:center; justify-content: center; padding-right:1.5rem;}
.chart-container-02 .chart-poll{width:13rem; height:13rem;}
.chart-container-02 .chart-data{
  width:100%; display: flex; justify-content: center; gap: 1.5rem;
}
.chart-container-02 .chart-data .list-item{display:flex; align-items:center;}
.chart-container-02 .chart-data .list-item .dot{
    width:.75rem; height:.75rem; border-radius:50%;
}
.chart-container-02 .chart-data .list-item .title{padding-left:.5rem;}
@media screen and (max-width:1199.98px){
    .chart-container-02{padding-right:0;}
}
@media screen and (max-width:390.98px){
    .chart-container-02{margin-left:-1.5rem;}
    .chart-container-02 .chart-poll{width:10rem; height:10rem;}
    .chart-container-02 .chart-data{width:calc(100% - 10rem);}
    .chart-container-02 .chart-data .list-item .dot{width:.5rem; height:.5rem;}
    .rating-option.result{min-width:7rem;}
    .rating-option{padding:.625rem;min-width: 20.25rem;}
}





/* Tab Container */
.tab-container{position:relative; display:block; width:100%;}
.tab-container .tabs{position:relative;}
.tab-container .tab{cursor:pointer;}
.tab-container .tab-contents{position:relative; width:100%;}
.tab-container .tab-content{position:absolute;  overflow:hidden; pointer-events:none; opacity:0; padding:0; margin:0; transition:opacity .6s, transform .6s;}
.tab-container .tab-content.active{position:relative; overflow:hidden; pointer-events:auto; opacity:1;}
.tab-container .tab-content.fade-out:not(.no-fade){opacity:0; pointer-events:none;}
.tab-container .tab-content.fade-in:not(.no-fade){
  display:block; position:absolute; opacity:0; transform:translateY(1.5rem); pointer-events:none;
}

/* Tab 01 */
.tabs.tabs-01 .tab{
  border-radius:var(--bradius); background:#f7f7f7;
  padding:.875rem 1.5rem; transition:background .25s, color .25s;
}
.tabs.tabs-01 .tab.active, .tabs.tabs-01 .tab:hover{background:#008FD3; color:#ffffff;}
@media screen and (max-width:767.98px){
  .tabs.tabs-01 .tab{width:auto; padding:.75rem 1rem;}
}
@media screen and (max-width:575.98px){
  .tabs.tabs-01 .tab{padding:.5rem .85rem;}
}

/* Tab 02 */
.tabs.tabs-02 .tab{
  margin:.5rem .5rem 0 0; border:2px solid transparent; border-radius:1000em; width:max-content;
  padding:1rem 1rem; transition:background .25s, color .25s, border .25s; cursor:pointer;
  display:flex; align-items:center; justify-content:center; height:2.1875rem;
}


/* Swiper 04 */
.section-12 .swiper-04{position:relative;}
.section-12 .arrows{
  position:absolute; top:-2.5rem; right:0; bottom:0; left:0; z-index:2; 
  pointer-events:none; display:flex; align-items:center; justify-content:space-between;
  padding:0 2rem; opacity:0; transition:opacity .25s;
}
.section-12 .arrows .arrow{
  pointer-events:all; width:2.25rem; height:2.25rem; border-radius:50%;
  display:flex; justify-content:center; align-items:center;
  color:#ffffff; transition:background .25s; background:rgba(0, 0, 0, 0.5);
}
.section-12 .arrows .arrow:hover{background:rgba(0, 0, 0, 1);}
.section-12 .swiper-04:hover .arrows{opacity:1;}



/* Water Wave */
.water-wave{
  position:relative; display:block; width:100%; padding:calc(100% - 1.125rem) 0 0 0;
  border-radius:50%; border:.5625rem solid #008fd3; background:#ffffff; overflow:hidden;
}
.water-wave .wrapper{
  position:absolute; top:0; left:0; width:100%; height:100%;
  border-radius:50%; border:.5625rem solid #e6f8ff;
}
.water-wave .inner-wrapper{position:relative; width:100%; height:100%;}
.water-wave .waves{
  position:relative; width:100%; height:100%; overflow:hidden;
  border-radius:50%; animation:waterWaves linear infinite;
}
.water-wave .wave-1, .water-wave .wave-2, .water-wave .wave-3{
  position:absolute; top:55%; left:-100%; background:#008fd3;
  opacity:.7; width:300%; height:300%; border-radius:40%;
  animation:inherit; animation-duration:8s;
}
.water-wave .wave-2{top:60%; opacity:.5; border-radius:35%; animation-duration:10s;}
.water-wave .wave-3{top:65%; opacity:.3; border-radius:33%; animation-duration:14s;}
.water-wave.type-02{border-color:#73d38b;}
.water-wave.type-02 .wrapper{border-color:#d7ffe1;}
.water-wave.type-02 .wave-1, .water-wave.type-02 .wave-2,
.water-wave.type-02 .wave-3{background:#73d38b;}
@keyframes waterWaves {
  0% { transform:rotate(0deg); }
  100% { transform:rotate(100deg); }
}

/* Faq 01 */
.faq-01{margin-top:1.5rem;}
.faq-01.style-02 > .content{border:1px solid transparent; border-radius:0!important;}
.faq-01.style-03 > .content{border:1px solid transparent; border-radius:1.25rem!important;}
/* .faq-01.style-02 .answer, .faq-01.style-03 .answer{padding:1.5rem 0rem 2rem 0rem;} */
/* .faq-01.style-02 .answer, .faq-01.style-03.answer-padding .answer{padding:1.5rem 1rem 2rem 1rem;} */
.faq-01 > .content{
  border-bottom:1px solid transparent;
  transition:all .25s; overflow:hidden;
}
.faq-01 > .content.active{border-radius:.375rem .375rem .375rem .375rem; border-bottom:1px solid transparent;}
.faq-01 > .content .btn-collap{
   width: 1.625rem; height: 1.625rem; display:flex;
   cursor:pointer; border-radius:50%; align-items:center;
   justify-content:center; border: 1px solid transparent;
   margin-left: 1rem;
   transition: background .25s, transform .25s;
}
.faq-01 > .content.active .btn-collap{transform:rotate(-180deg);}
.faq-01  > .content > .wrapper{transition:background .25s; cursor:pointer; border-radius:.375rem .375rem 0 0;}
.faq-01 .question-icon{width:2rem; display:flex; justify-content:start;}
.faq-01 .content .wrapper .text{width:calc(100% - 2rem);}
.faq-01 > .content .wrapper > .title{padding-right:1rem;}
.faq-01 > .content > .wrapper{display:flex; align-items:center; justify-content:space-between;}
.faq-01 .date{display:flex; align-items:center; font-size:.875rem;}
.faq-01 .date > .icon{
  width:1rem; height:1rem; display:flex; justify-content:center; align-items:center;
  margin-right:.4375rem;
}
.faq-01 .date > .icon svg{
  display:block; max-width:100%; width:auto; max-height:100%; height:.875rem;
}
.faq-01 > .content .chevron-wrapper .icon{
  width:1.5rem; height:1.5rem; display:flex; justify-content:center; 
  align-items:center; border-radius:50%; border:1px solid transparent; transition:transform .25s
}
.faq-01> .content > .wrapper .options{padding-left:1rem;}
.faq-01 > .content.active .chevron-wrapper .icon{transform:rotate(180deg);}
.faq-01 .answer{
  position:relative; display:none; border-top:1px solid transparent;
  padding:2rem 1.5rem 1.5rem; margin-top:-1rem;
}
.faq-01 > .content.active .answer::before{opacity:1}
/* .faq-01 > .content.active .wrapper > table.table.table-download .title, */
.faq-01.style-03 > .content .show-active{opacity:0; position:absolute; transition:opacity .25s;}
.faq-01.style-03 > .content.active .show-active{opacity:1; position:relative;}
.faq-01.style-03 > .content .show-inactive{transition:opacity .25s;}
.faq-01.style-03 > .content.active .show-inactive{opacity:0; position:absolute; pointer-events:none;}
.faq-01.style-03 .answer-header{padding:1rem;}
.faq-01.style-04 .answer{margin-top:1rem; padding:1rem 1rem 1rem 1rem;}
.faq-01.style-04 > .content > .wrapper{border-bottom:1px solid transparent; padding:1rem 0;}
.faq-01.style-04 > .content .wrapper > .title{padding-right:0; width:calc(100% - 1.625rem);}
.faq-01.style-05 .answer{padding:3rem 1rem 2rem 1rem}
.faq-01 .answer table.table.table-download.sub.style-02 .file-container svg{width:4rem;}
.faq-01 .answer table.table.table-download.sub.style-02 .file-container svg.in-icon{top: calc(50% - 1.2rem); left: calc(50% - .9rem); width:1.8rem;}
.faq-01.doc > .content .wrapper > table.table.table-download tr::before {
  content: ""; position: absolute; top: -1px; right: 5vw;
  width: 4.8vw; height: 4.8vw;
  background-image: url(../images/pattern/bg-water.webp); background-size: contain; background-repeat: no-repeat;
}
@media screen and (max-width:991.98px){
  .faq-01 > .content .title{font-size:1rem;}
  .faq-01 .answer table.table.table-download.sub.style-02 .file-container svg {width: 3.5rem;}
  .faq-01 .answer table.table.table-download.sub.style-02 .file-container svg.in-icon {
    top: calc(50% - 0.95rem); left: calc(50% - 0.65rem); width: 1.45rem;
  }
  .faq-01.doc > .content .wrapper > table.table.table-download tr::before{right: 9vw;}
}
@media screen and (max-width:575.98px){
    .faq-01 .answer{padding:2rem 1rem 1rem 1rem;}
    .faq-01 .show-mobile .btns{margin-top:.5rem;}
    .faq-01.doc > .content .wrapper > table.table.table-download tr::before {right: 11vw; width: 11.5vw; height: 9.8vw;}
}
@media screen and (max-width:375.98px){
    .faq-01 .answer .option:first-child{width:100%;}
    .faq-01 .answer .option:nth-child(2).ml-5{width:50%; margin-left:0!important;}
}


/* Mini Box Toggle */
.mini-box-toggle {position: relative; max-width: 45%; font-weight: 400; border: 1px solid transparent; border-radius: .375rem;}
.mini-box-toggle .content .wrapper {
  display: flex; align-items: center; justify-content: space-between;
  padding: .5rem; border-radius: .375rem; border: 1px solid transparent;
}
.mini-box-toggle .content .title {
  display: flex; align-items: center; gap: .5rem;
}
.mini-box-toggle .content .title .text {font-weight: 400;}
.mini-box-toggle .content .title .icon {
  display: flex; align-items: center;
}
.mini-box-toggle .content.active .btn-toggle {transform: rotate(180deg);}
.mini-box-toggle .content .answer {
  position: relative; display: none; border-top: 1px solid transparent;
  padding: 0 .5rem; margin-top: .5rem; margin-right: .5rem;
  max-height: 9.6rem; overflow-y: auto;
}
.mini-box-toggle .content .answer::-webkit-scrollbar-track{border-radius: 10px;}



@media screen and (max-width: 575.98px) {
  .mini-box-toggle {max-width: 100%;}
}

/* Upload Container */
.upload-container{
  display:flex; justify-content:center; flex-direction:column;
  align-items:center; border:1px solid transparent; padding:2.25rem;
  border-radius:.375rem;
}
.upload-container.style-02{position:relative; padding:0 0 0 1rem; height:2.3rem; align-items:start;}
.upload-container.style-02 .upload-btn{position:absolute; top:-.0875rem; right:-.0875rem; bottom:-.0875rem;border-radius: 0 .375rem .375rem 0;}
.upload-container.style-03{width:15rem; height:15rem; position:relative; max-width:100%; overflow:hidden;}
.upload-container.style-03 input{
  position:absolute; top:0; left:0; right:0; bottom:0; opacity:0;
  cursor: pointer;
}
.upload-container.style-03 #preview{position:absolute; top:0; left:0; right:0; bottom:0; pointer-events:none;}
.upload-container.style-03 #preview img{width:100%; height:100%; opacity: .5;}
.upload-container.style-02.bradius-round{border-radius: 25px;}
.upload-container.style-02.bradius-round .upload-btn{border-radius: 0 25px 25px 0 !important;}


/* Dflip */
._df_book{max-height: 50rem; background-color: rgb(119, 119, 119) !important;}

/* Social Share */
.social-options>.wrapper{display:flex; align-items:center;}
.social-options .social-wrapper{display:flex; align-items:center;}
.social-options .social-wrapper .social{margin:0 .25rem; transition:opacity .25s;}
.social-options .social-wrapper .social:hover{opacity:.85;}
.social-options .options{display:flex; align-items:center;}
.social-options .options .option{margin:0 .25rem; transition:opacity .25s}
.social-options .options .option:hover{opacity:.85;}

/* Inner Shadow */
.form-inner-shadow {
  margin-top: 4rem; margin-bottom: 3rem;
  padding: 3rem 5rem; border-radius: 0 0 1.875rem 1.875rem;
  box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1), inset 0px 5px 0px #0E3A81;
}
@media screen and (max-width: 575.98px) {
  .form-inner-shadow {padding: 3rem 1rem;}
}


.no-result {
  display: flex; justify-content: center; align-items: center;flex-wrap: wrap;
  align-content: center; gap: 2rem;
  height: 458px;
}

/* Profile */
.profile-icon {width: 4rem;height: 4rem;border-radius: 50%;}
.webboard {position: relative; z-index: 1; border: 1px solid transparent;}
.sub-webboard {
  position: relative; z-index: 0;
  padding-top: 1rem; margin-top: -1rem; margin-left: 3.5rem;
  border: 1px solid transparent;
}
@media screen and (max-width:767.98px) {
  .sub-webboard{margin-left: 1.5rem;}
}
