@charset "utf-8";
.multipleContentsDiv.area{max-width: 168rem; padding: 0 4rem; margin: 0 auto;}

@media screen and (max-width: 768px) {
  .multipleContentsDiv.area{padding: 0 2rem;}
}

/*[S] User service*/
.user-serivce-button-box{position: absolute; right: 6rem; bottom: 6rem; z-index: 2;}
.user-serivce-button{width: 14rem; height: 14rem; position: relative; padding: 2rem;}
.user-serivce-button::after{content:""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../../images/main/ic-user-text.png) no-repeat center center / cover; animation: textRotate 5s infinite linear;;}
.user-serivce-button p{width: 100%; height: 100%; background: rgba(80,57,146,.85); border-radius: 50%; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; flex-direction: column;}
.user-serivce-button span{font-size: 1.4rem; color: #ffffff; font-family: pb; display: block; margin-top: .5rem;}
.user-serivce-button .user-service-logo{display: inline-block; width: 2.4rem; height: 2.6rem; background: url(../../images/main/ic-user-service.png) no-repeat center center / cover; margin-top: -.2rem; position: relative; transform: scale(1); transition: transform .5s;}
.user-serivce-button:hover::after{animation-play-state: paused;}

@media screen and (min-width: 1921px) {
  .user-serivce-button-box{bottom: 16rem;}
}

@media screen and (max-width: 1200px) {
  .user-serivce-button-box{position: fixed; right: 1.5rem; bottom: 12.5rem}
  .user-serivce-button{width: 10rem; height: 10rem; padding: 0;}
  .user-serivce-button::after{display: none;}
}

@media screen and (max-width: 768px) {
  .user-serivce-button-box{right: .5rem; bottom: 12rem;}
  .user-serivce-button{width: 8rem; height: 8rem;}
}

@keyframes textRotate{
  from{transform: rotate(0deg)}
  to{transform: rotate(360deg)}
}
/*[E] User service*/

/*[S] Limit*/
.limit-wrap{background: url(../../images/main/bg-limit.png) no-repeat right 4rem top 11.4rem; position:relative;}
.limit-wrap .area{max-width: 168rem; padding: 0 4rem; margin: 0 auto; position: relative;}
.limit-header h1{font-size: 5.6rem; color: #000000; font-family: pbl;}
.limit-header p{font-size: 2.2rem; line-height: 3.2rem; color: #000000; font-family: pm; margin-top: 1rem;}
.limit-list{overflow: inherit;}
.limit-list li{flex: 1; padding: 31.5rem 0 11.3rem; position: relative;}
.limit-list li::after{content:""; display: block; position: absolute; right: 0; top: 0; width: .1rem; height: 100%; background-color: #ebebeb; z-index: 1;}
.limit-list li:last-child{border-right: 0;}
.limit-list li a{position: relative; z-index: 2;}
.limit-list .limit-image{padding-bottom: 63%; position: relative; transition: all .35s; overflow: hidden; margin: 0 auto;}
.limit-list .limit-image img{position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;}
.limit-list .limit-content::before{content:""; display: block; position: absolute; left: 50%; margin-left: -3.35rem; top:-3.6rem; width: 6.7rem; height: 6.7rem; border-radius: 50%; background: white url(../../images/main/ic-limit-link.png) no-repeat center center / 1.7rem;}
.limit-list .limit-content{text-align: center; padding-top: 4.6rem; position: relative;}
.limit-list .limit-content h1{font-size: 2.8rem; font-family: pb; color: #000000;}
.limit-list .limit-content p{font-size: 1.8rem; color: #5f5f5f; margin-top: 1rem;}
.limit-list li a:hover .limit-image{border-radius: 50%; width: 63%; box-shadow: 0 0 4rem rgba(80,57,146,.5);}
.limit-list li a:hover .limit-content::before{background:#503992 url(../../images/main/ic-limit-link-on.png) no-repeat center center / 1.7rem;}
.limit-list .limit-dots{display: none;}

@media screen and (max-width: 1200px) {
  .limit-wrap{padding: 6rem 0 8rem; background-size: 57.5rem; background-position: right .5rem top 13.8rem;}
  .limit-wrap .area{padding: 0 4rem;}
  .limit-header {margin-top: -10rem;}
  .limit-list{text-align: center; margin: 0 4rem; padding: 15.5rem 0 0 0; overflow: hidden;}
  .limit-list li{flex: none; border-right: 0; padding: 0;}
  .limit-list li::after{display: none;}
  .limit-list .limit-dots{display: block; background-color: #eeeeee; display: inline-flex; width: auto; flex-wrap: wrap; border-radius: 1.5rem; padding: .9rem 1.5rem; margin-top: 4.5rem;}
  .limit-list .limit-dots .swiper-pagination-bullet{width: 1.2rem; height: 1.2rem; opacity: 1; background-color: white; display: block;}
  .limit-list .limit-dots .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color: #503992;}
  .limit-list .limit-image{padding-bottom: 59%;}
  .limit-list li:hover .limit-image{width: 59%;}
}

@media screen and (max-width: 768px) {
  .limit-wrap{padding: 4.4rem 0 6rem; background-position: right -48rem top 11.5rem}
  .limit-wrap .area{padding: 0 2rem;}
  .limit-header h1{font-size: 4.6rem;}
  .limit-header p{margin-top: 1.5rem;}
  .limit-header p br{display: none;}
  .limit-list{margin: 0 2rem; padding-top: 13.5rem;}
}
/*[E] Limit*/

/*[S] Schedule*/
.multipleDiv:has(.schedule){background: url(../../images/main/bg-schedule.png) no-repeat center center / cover;}
.schedule{max-width: 168rem; padding: 11rem 4rem 11.5rem; margin: 0 auto;}
.schedule-title h1{font-size: 3.6rem; color: white; font-family: pbl;}
.schedule-title p{font-size: 2.2rem; line-height: 3.2rem; color: white; opacity: .4; font-family: pm; margin-top: 2.5rem;}
.schedule-link-list-inner{display: flex; flex-wrap: wrap; align-items: start; margin-top: 6rem;}
.schedule-link-list{width: 100%}
.schedule-link-list ul{display: flex; flex-wrap: wrap;}
.schedule-link-list ul li{width: calc(100%/7);}
.schedule-link-list-inner .prev{text-indent: -9999rem; width: 2rem; height: 3.6rem; background: url(../../images/main/btn-schedule-prev.png) no-repeat center center / cover; margin-top: 4.5%; display: none;}
.schedule-link-list-inner .next{text-indent: -9999rem; width: 2rem; height: 3.6rem; background: url(../../images/main/btn-schedule-next.png) no-repeat center center / cover; margin-top: 4.5%; display: none;}
.schedule-link-list .swiper-slide{text-align: center;}
.schedule-link-list a{position: relative; width: 100%; height: 100%; padding-bottom: 4.9rem; display: block;}
.schedule-link-logo{text-align: center; height:10.1rem; display: flex; justify-content: center; align-items: center; position: relative; margin: 0 auto;}
.schedule-link-logo img{position: relative; z-index: 2;}
.schedule-link-list ul li.fin img{width: 100%;}
.schedule-link-list-inner p{font-size: 1.8rem; color: #ffffff; font-family: pm; text-align: center; position: absolute; left: 0; bottom: 0; width: 100%;}
.schedule-link-list-inner p span{background-image: linear-gradient(#ffffff, #ffffff); background-repeat: no-repeat; background-position: left 0 bottom 0; background-size: 0 1px; transition: background-size .5s;}

.schedule-link-list a:hover .schedule-link-logo::after{content:""; display: block; position: absolute; right: 0rem; bottom: 0; width: 3.1rem; height: 3.1rem; border-radius: 50%; background-color: #503992;}
.schedule-link-list a:hover p span{background-size: 100% .1rem;}

@media screen and (max-width: 1200px) {
  .schedule{padding: 7rem 4rem 7.5rem;}
  .schedule-left{padding-right: 0;}
  .schedule-link-list a{padding-bottom: 5.9rem;}
  .schedule-link-list a:hover .schedule-link-logo::after{right: 3rem;}
  .schedule-link-list ul{margin-top: -2rem;}
  .schedule-link-list ul li{width: calc(100%/3); margin-top: 2rem;}
}

@media screen and (max-width: 768px) {
  .schedule{padding: 5.5rem 2rem 6rem;}
  .schedule-title h1{line-height: 4.6rem;}
  .schedule-title p{margin-top: 1.5rem;}
  .schedule-link-list-inner{margin-top: 3.5rem;}
  .schedule-link-logo{height: 8rem;}
  .schedule-link-logo img{transform: scale(.7938);}
  .schedule-link-list{width: calc(100% - 4rem);}
  .schedule-link-list a{padding-bottom: 3rem;}
  .schedule-link-list ul{display: flex; flex-wrap: nowrap;}
  .schedule-link-list ul li{width: calc(100%/2);}
  .schedule-link-list-inner .prev,
  .schedule-link-list-inner .next{display: block}
}
/*[E] Schedule*/

/*[S] History*/
.history-wrap{background: url(../../images/main/bg-history.jpg) no-repeat center center / cover; padding: 9.2rem 0 15rem; overflow: hidden;}
.history-header{text-align: center;}
.history-header h1{font-size: 5.6rem; color: #ffffff; font-family: pbl;}
.history-header p{font-size: 2.2rem; color: #ffffff; opacity: .4; font-family: pm; margin-top: 1.5rem;}
.history-content-box{text-align: center; margin-top: 5.3rem;}
.history-content-box > button{display: none;}
.history-content .swiper-container{margin: 0 -2rem; max-width: 136rem; display: inline-block; overflow: inherit;}
.history-content .swiper-wrapper{transition: transform 2s cubic-bezier(0.165, 0.84, 0.44, 1) !important}
.history-content .swiper-slide{padding: 0 2rem;}
.history-content .swiper-image{position: relative;}
.history-content .swiper-image img{width: 100%;}
.history-content .swiper-image::after{content:""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(180deg,rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 53%, rgba(0, 0, 0, 0.79) 100%);}
.history-content .swiper-text{position: absolute; left: 0; bottom: 0; width: 100%; text-align: left; padding: 1.3rem 4rem; z-index: 2;}
.history-content .swiper-text p{font-size: 1.6rem; color: #ffffff; font-family: pm;}
.history-content .swiper-progress{position: absolute; left: 0; bottom: 0; width: 100%; border-top: .1rem solid rgba(255,255,255,.15); padding-left: 3%;}
.history-content .swiper-progress .year-box{position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding-left: 3%;}
.history-content .swiper-progress .year-box span{height: 100%; width: 0; background-color: rgba(171,179,195,.8); display: block; transition: width 1.5s; left: 0; padding-left: 5%; position: absolute; left: 0;}
.history-content .progress-bar ul{display: flex; flex-wrap: wrap; padding-top: .3rem;}
.history-content .progress-bar li p{text-align: left; font-size: 1.6rem; color: #ffffff; font-family: pb;}
.history-content .progress-bar li span{position: relative; display: inline-block; padding-bottom: 1.4rem;}
.history-content .progress-bar li span::after{content:""; display: block; position: absolute; left: 50%; bottom: 0; width: .1rem; height: 1.1rem; background: rgba(255,255,255,.15);}
.history-content .progress-bar li.black p{color: #000000}

@media screen and (max-width: 1200px) {
  .history-wrap{padding: 4.2rem 0 8rem;}   
  .history-content .swiper-container{margin: 0 0 0 -6rem;}
  .history-content .swiper-progress{display: none;}
  .history-content-box > button{display: block; position: absolute; width: 2rem; height: 3.6rem; text-indent: -9999rem; z-index: 2; top: 50%; margin-top: -1.8rem;}
  .history-content-box > button.history-prev{background: url(../../images/main/history-prev.png); left: 4rem}
  .history-content-box > button.history-next{background: url(../../images/main/history-next.png); right: 4rem}
}

@media screen and (max-width: 768px) {
  .history-wrap{padding-bottom: 6rem;}
  .history-header h1{font-size: 4.6rem;}
  .history-header p{margin-top: .8rem;}
  .history-content-box{margin-top: 3.3rem;}
  .history-content .swiper-container{margin: 0; width: 68%;}
  .history-content-box > button.history-prev{left: 7rem;}
  .history-content-box > button.history-next{right: 7rem;}
}
/*[E] History*/

/*[S] Count*/
.count-wrap{background-color: #ebebef; padding: 11.5rem 0 12rem;}
.count-wrap .count-inner{display: flex; flex-wrap: wrap; max-width: 160rem; margin: 0 auto; margin-top: -12rem;}
.count-wrap .count-box{Width: 25%; text-align: center; margin-top: 12rem;}
.count-wrap .count-box .count-image{width: 9.5rem; height: 8.6rem; display: inline-flex; justify-content: center; align-items: center; margin-bottom: .8rem;}
.count-wrap .count-box h1{font-size: 2.4rem; color: #000000; font-family: pr;}
.count-wrap .count-box h1 span{font-size: 5.6rem; color: #44279a; font-family: pbl; display: inline-block; margin-right: .6rem}
.count-wrap .count-box p{font-size: 2.2rem; line-height: 2.8rem; color: #555555; margin-top: .5rem;}
.count-wrap .count-dots{display: none;}

@media screen and (max-width: 1200px) {
  .count-wrap{padding: 7.5rem 0 6rem; text-align: center;}
  .count-wrap .count-inner{margin-top: -3.4rem;}
  .count-wrap .count-box{margin-top: 3.4rem;}
  .count-wrap .count-box .count-image{width: 8.6rem; height: 7.8rem;}
  .count-wrap .count-box .count-image img{transform: scale(.9)}
  .count-wrap .count-box h1{font-size: 2.1rem;}
  .count-wrap .count-box h1 span{font-size: 5rem;}
  .count-wrap .count-box p{font-size: 2rem; margin-top: .3rem; line-height: 2.5rem;}
}

@media screen and (max-width: 768px) {
  .count-wrap .count-dots{display: inline-flex; justify-content: center; align-items: center; background-color: rgba(255,255,255,.35); border-radius: 1.5rem; width: 7rem; margin: 0 auto; padding: .9rem 0; margin-top: 3.5rem;}
  .count-wrap .count-dots .swiper-pagination-bullet{width: 1.2rem; height: 1.2rem; background-color: white; opacity: 1;}
  .count-wrap .count-dots .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color: #503992;}
}
/*[E] Count*/