@charset "UTF-8";

.kv {width: 100%; height: 100vh; overflow: hidden; position: relative;}

.kv .bg-swiper {width: 100%; height: 100%;}
.kv .bg-swiper .swiper-slide .img {width: 100%; height: 100%;}
.kv .bg-swiper .swiper-slide .img img {width: 100%; height: 100%; object-fit: cover;}
.kv .bg-swiper .swiper-slide .img video {width: 100%; height: 100%; object-fit: cover;}
.kv .bg-swiper .swiper-slide .copy-area {position: absolute; z-index: 2; color: #fff; top: 146rem; left: 40rem;}
.kv .bg-swiper .swiper-slide .copy-area .big p {overflow: hidden; line-height: 90rem; transform: translateY(70rem); display: block; opacity: 0; transition-duration: .7s; transition-delay: .3s;}
.kv .bg-swiper .swiper-slide-active .copy-area .big p {transform: translateY(0); opacity: 1;}
.kv .bg-swiper .swiper-slide .copy-area .f18r {margin-top: 24rem; opacity: 0; transform: translateY(50rem); transition-duration: .7s; transition-delay: .7s;}
.kv .bg-swiper .swiper-slide-active .copy-area .f18r {opacity: 1; transform: translateY(0);}
.kv .bg-swiper .control {width: 193rem; position: absolute; z-index: 10; left: 40rem; top: 520rem; opacity: 0; transition-duration: .7s; transition-delay: .5s;}
.kv.active .bg-swiper .control {opacity: 1;}
.kv .bg-swiper .control .num {display: flex; color: #fff; width: 113rem; justify-content: space-between; font-family: "Pretendard-Regular";}
.kv .bg-swiper .control .num .now {font-family: "Pretendard-Bold";}
.kv .bg-swiper .control .swiper-pagination {width: 60rem; position: absolute; top: 50%; transform: translateY(-50%); left: 28rem;}
.kv .bg-swiper .control .swiper-pagination::after {content: ""; width: 100%; height: 1rem; background: #fff; display: block; position: absolute; z-index: -1;}
.kv .bg-swiper .control .swiper-pagination-progressbar {background: 0; height: 3rem;}
.kv .bg-swiper .control .swiper-pagination-progressbar-fill {background: 0; display: block; position: relative; overflow: visible; transform: scale(1) !important; height: 1rem; top: 50%; transform: translate(-50%); width: 0;}
.kv .bg-swiper .control .dot {width: 3rem; height: 3rem; display: block; border-radius: 50rem; background: #fff; position: absolute; top: -1.5rem; right: 0;}

.kv .bg-swiper .control .arrow {width: 32rem; position: absolute; top: 50%; left: 130rem; transform: translateY(-50%); display: flex; justify-content: space-between;}
.kv .bg-swiper .control .arrow .swiper-button-prev {width: 8rem; height: 14rem; background: url("/common/images/ico-main-kv-arrow.svg") no-repeat; background-size: contain; left: 0; position: unset;}
.kv .bg-swiper .control .arrow .swiper-button-next {width: 8rem; height: 14rem; background: url("/common/images/ico-main-kv-arrow.svg") no-repeat; background-size: contain; right: 0; transform: rotate(180deg); position: unset;}
.kv .bg-swiper .control .play {position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 10rem; height: 14rem;}
.kv .bg-swiper .control .play .pause {display: block; width: 8rem; height: 14rem; background: url("/common/images/ico-main-kv-pause.svg") no-repeat; background-size: contain; position: absolute;}
.kv .bg-swiper .control .play .start {display: block; width: 8rem; height: 14rem; background: url("/common/images/ico-main-kv-play.svg") no-repeat; background-size: contain; position: absolute;}

.kv .bg-swiper.few .control {display: none;}

.kv .search-bar {position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); background: #fff; z-index: 3; display: flex; padding: 20rem 24rem; gap: 20rem; align-items: center; opacity: 0; transition-duration: .7s; transition-delay: .6s;}
.kv.active .search-bar {bottom: 60rem; opacity: 1;}
.kv .search-bar .div {width: 280rem;}
.kv .search-bar .div .form-select {display: block;}
.kv .search-bar .form-select label {padding: 0 0 0 16rem; font-size: 12rem;}
.kv .search-bar .form-select select option.disabled {color: red;}
.kv .search-bar .form-select .select-area select {border: 0; padding: 0 50rem 0 16rem; border-radius: 0; height: 30rem; font-size: 18rem; color: #6D6F79;}
.kv .search-bar .form-select .select-area select.selected {color: #101116;}

.kv .search-bar .ser-area .form-input .input-area input {border-radius: 0; border: 0; font-size: 18rem;}
.kv .search-bar .ser-area .form-input .input-area input::placeholder {font-size: 18rem; color: #6D6F79;}

.kv .ad-box {position: absolute; z-index: 3; left: 0; top: 584rem; background: #fff; width: 371rem; padding: 32rem 24rem; opacity: 0; transition-duration: .7s; transition-delay: .6s;}
.kv.active .ad-box {opacity: 1; left: 40rem;}
.kv .ad-box .swiper {width: 100%; height: 100%; overflow: hidden; padding-bottom: 34rem; position: relative;}
.kv .ad-box .swiper.no-pd {padding-bottom: 0;}
.kv .ad-box.focus .swiper-wrapper {overflow: hidden;}
.kv .ad-box .swiper-slide {width: 100% !important;}
.kv .ad-box .swiper-slide a {width: 100%; display: flex; justify-content: space-between;}
.kv .ad-box .swiper-slide a:focus {box-shadow: 0 0 0 2px #000; border: 2px solid #000;}
.kv .ad-box .swiper-slide .txt {width: 192rem;}
.kv .ad-box .swiper-slide .txt .f14r {margin-top: 12rem;}
.kv .ad-box .swiper-slide .img {width: 100rem; height: 100rem; border-radius: 8rem; overflow: hidden;}
.kv .ad-box .swiper-slide .img img {width: 100%; height: 100%; object-fit: cover;}
.kv .ad-box .arrow {width: 77rem; position: absolute; height: 22rem; bottom: 0rem;}
.kv .ad-box .arrow .swiper-button-prev {width: 8rem; height: 14rem; background: url("/common/images/ico-main-ad-arrow.svg") no-repeat; background-size: contain; transform: rotate(180deg) translateY(50%); left: 0;}
.kv .ad-box .arrow .swiper-button-next {width: 8rem; height: 14rem; background: url("/common/images/ico-main-ad-arrow.svg") no-repeat; background-size: contain; right: 0; transform: translateY(-50%);}
.kv .ad-box .arrow .swiper-pagination {bottom: 50%; transform: translateY(50%); color: #5A5E6C; font-size: 14rem; z-index: 9;}
.kv .ad-box .arrow .swiper-pagination .swiper-pagination-current {color: #D93A33; font-family: "Pretendard-Bold";}


@media screen and (max-width: 1024px) {
	.kv {height: 910rem;}
	.kv .bg-swiper {height: 100%; overflow: hidden;}

	.kv .bg-swiper .swiper-slide .copy-area {top: 106rem; left: 30rem;}
	.kv .bg-swiper .swiper-slide .copy-area .big p {line-height: 42rem; font-size: 40rem;}
	.kv .bg-swiper .swiper-slide .copy-area .f20r {margin-top: 12rem;}
	.kv .bg-swiper .control {top: 322rem; left: 30rem; transition-delay: .7s;}

	.kv .ad-box {left: 30rem; top: 413rem; width: calc(100% - 60rem); transform: translateY(50rem);}
	.kv.active .ad-box {left: 30rem; transform: translateY(0);}

	.kv .search-bar {top: 631rem; bottom: unset; width: calc(100% - 60rem); display: block; height: unset; padding: 20rem 16rem; transform: translateY(50rem) translateX(-50%); transition-delay: .7s;}
	.kv.active .search-bar {bottom: unset; transform: translateY(0) translateX(-50%);}
	.kv .search-bar .div {width: 100%; margin-bottom: 16rem;}
	.kv .search-bar .form-select label {margin-bottom: 8rem; padding: 0 0 0 8rem;}
	.kv .search-bar .form-select .select-area select {padding: 0 34rem 0 8rem; background: url("/common/images/ico-sel.svg") no-repeat #fff center right 8rem; background-size: 18rem;}
	.kv .search-bar .form-select .select-area::after {right: 0;}
	.kv .search-bar .ser-area {width: 100%;}
	.kv .search-bar .ser-area .form-input .ser-bt {right: 8rem;}
	.kv .search-bar .ser-area .form-input .input-area input {padding: 0 40rem 0 8rem;}
}


@media screen and (max-width: 600px) {
	.kv .bg-swiper .swiper-slide .copy-area {left: 16rem;}
	.kv .ad-box {width: calc(100% - 32rem); left: 16rem;}
	.kv.active .ad-box {left: 16rem; transform: translateY(0);}
	.kv .search-bar {width: calc(100% - 32rem);}
	.kv .float-menu {right: 16rem !important;}
	.kv .bg-swiper .control {left: 16rem; top: 345rem;}
}


.sec1 {margin: 120rem auto 150rem; width: calc(100% - 80rem);}
.sec1 .tit-area {opacity: 0; transform: translateY(100rem); transition-duration: .7s;}
.sec1.active .tit-area {opacity: 1; transform: translateY(0);}
.sec1 .tit-area p:not(.f54b) {margin-top: 16rem; color: #6D6F79;}
.sec1 .swiper-area {margin-top: 110rem; width: 100%; position: relative;}
.sec1 .swiper-area .tab {width: auto; position: absolute; right: 0; z-index: 5; padding-top: 72rem; opacity: 0; transform: translateX(100rem); transition-duration: .7s; transition-delay: .6s;}
.sec1.active .swiper-area .tab {opacity: 1; transform: translateY(0);}
.sec1 .swiper-area .tab .swiper {overflow: hidden; width: 100%; height: 400rem;}
.sec1 .swiper-area .tab .swiper .swiper-slide {height: auto !important; width: auto !important; color: #6D6F79; display: inline-flex; position: relative;}
.sec1 .swiper-area .tab .swiper .swiper-slide + .swiper-slide {margin-top: 20rem;}
.sec1 .swiper-area .tab .swiper .swiper-slide.on {color: #101116; font-family: "Pretendard-Bold"; }
.sec1 .swiper-area .tab .swiper .swiper-slide.on span:not(.dot) {position: relative; display: inline-block;}
.sec1 .swiper-area .tab .swiper .swiper-slide.on span:not(.dot)::after {content: ""; width: 100%; display: block; background: #101116; height: 2px; bottom: 3rem; position: absolute;}
.sec1 .swiper-area .tab .swiper .swiper-slide .dot {display: block; width: 4rem; height: 4rem; background: #D93A33;}
.sec1 .swiper-area .tab .swiper .swiper-slide .hide {position: absolute; overflow: hidden; width: 0;}
.sec1 .swiper-area .tab .arrow {width: 92rem; position: absolute; top: 0; left: 0; display: flex; gap: 4rem;}
.sec1 .swiper-area .tab .arrow .swiper-button-prev {width: 44rem; height: 32rem; background: url("/common/images/ico-main-vertical-arrow.svg") no-repeat; background-size: contain; position: unset;}
.sec1 .swiper-area .tab .arrow .swiper-button-prev.disable {opacity: .4;}
.sec1 .swiper-area .tab .arrow .swiper-button-next {width: 44rem; height: 32rem; background: url("/common/images/ico-main-vertical-arrow.svg") no-repeat; background-size: contain; transform: rotate(180deg); position: unset;}
.sec1 .swiper-area .tab .arrow .swiper-button-next.disable {opacity: .4;}

.sec1 .swiper-area .content {position: relative; height: 600rem; opacity: 0; transform: translateY(100rem); transition-duration: .7s; transition-delay: .4s;}
.sec1.active .swiper-area .content {opacity: 1; transform: translateY(0);}
.sec1 .swiper-area .content .slide {display: flex; background: #fff; opacity: 0; visibility: hidden; transition: opacity 0s, visibility 0s 0s; position: absolute;}
.sec1 .swiper-area .content .slide.on {opacity: 1; visibility: visible; transition: opacity 0s ease, visibility 0s 0s;}
.sec1 .swiper-area .content .slide .img {width: 850rem; height: 600rem; overflow: hidden; position: relative; opacity: 0; transform: translateX(100rem); transition-duration: .7s; transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);}
.sec1 .swiper-area .content .slide.on .img {opacity: 1; transform: translateX(0);}
.sec1 .swiper-area .content .slide .img span {width: 850rem; height: 100%; position: absolute; top: 0; left: 50%; transform: translateX(-50%); overflow: hidden;}
.sec1 .swiper-area .content .slide .img span img {width: 850rem; height: 600rem; object-fit: cover; transition-duration: .7s; position: absolute;}
.sec1 .swiper-area .content .slide .txt {margin-left: 80rem; width: 536rem; opacity: 0; transform: translateX(100rem); transition-duration: 1s; transition-delay: .3s;}
.sec1 .swiper-area .content .slide.on .txt {opacity: 1; transform: translateX(0);}
.sec1 .swiper-area .content .slide .txt .label {position: relative; display: inline-block;}
.sec1 .swiper-area .content .slide .txt .label.new .f14b {color: #BF2A23; border-radius: 500rem; background: #FFF5F4; padding: 4rem 12rem; display: block; position: absolute; top: -10rem; right: -60rem;}
.sec1 .swiper-area .content .slide .txt .desc {margin-top: 100rem;}
.sec1 .swiper-area .content .slide .txt .desc p:not(.f40b) {margin-top: 20rem; color: #6D6F79;}
.sec1 .swiper-area .content .slide .txt .btn-wrap {justify-content: flex-start; margin-top: 60rem;}
.sec1 .swiper-area .mo-btn {display: none;}

@media screen and (max-width: 1024px) {
	.sec1 {margin: 60rem auto; width: calc(100% - 60rem);}
	.sec1 .swiper-area {margin-top: 60rem;}
	.sec1 .swiper-area .tab {position: unset; padding-top: 0; transition-delay: .4s; transform: translateY(50rem);}
	.sec1.active .swiper-area .tab {transform: translateY(0);}
	.sec1 .swiper-area .tab .swiper {margin-bottom: 24rem; height: auto; overflow: unset;}
	.sec1 .swiper-area .tab .swiper .swiper-slide {padding: 10rem;}
	.sec1 .swiper-area .tab .swiper .swiper-slide + .swiper-slide {margin-top: 0;}
	.sec1 .swiper-area .tab .swiper .swiper-wrapper.active {flex-wrap: wrap; transform: none !important;}
	.sec1 .swiper-area .tab .swiper .swiper-slide::after {content: ""; display: block; position: absolute; top: 50%; right: -4px; width: 1rem; height: 10rem; background-color: #E1E4EC; transform: translateY(-50%);}
	.sec1 .swiper-area .tab .swiper .swiper-slide:last-child:after {display: none;}
	.sec1 .swiper-area .tab .swiper .swiper-slide.on span:not(.dot)::after {bottom: 0;}
	.sec1 .swiper-area .mo-btn {display: flex; align-items: center; justify-content: center; width: 60rem; height: 30rem; background: #D93A33; border-radius: 0 0 8rem 8rem; position: relative; margin: 0 auto;}
	.sec1 .swiper-area .mo-btn::after {content: ""; width: calc(100vw - 32rem); height: 1px; background: #D3D6DE; display: block; position: absolute; top: 0; left: 50%; transform: translateX(-50%);}
	.sec1 .swiper-area .mo-btn span {display: block; width: 10rem; height: 16rem; background: url("/common/images/ico-op-arrow.svg") no-repeat; background-size: contain; transform: rotate(90deg); transition-duration: .3s;}
	.sec1 .swiper-area .mo-btn.on span {transform: rotate(-90deg);}

	.sec1 .swiper-area .tab .arrow {display: none;}
	.sec1 .swiper-area .content {width: 100%; height: 100%; margin-top: 40rem; transition-delay: .6s;}
	.sec1 .swiper-area .content .slide {position: unset; display: none;}
	.sec1 .swiper-area .content .slide.on {display: block;}
	.sec1 .swiper-area .content .slide .img {width: 100%; height: 238rem;}
	.sec1 .swiper-area .content .slide .img span {width: 100%; height: 100%; position: unset; transform: unset;}
	.sec1 .swiper-area .content .slide .img span img {width: 100%; height: 100%;}
	.sec1 .swiper-area .content .slide .txt {margin-left: 0; margin-top: 40rem; width: calc(100% - 250rem);}
	.sec1 .swiper-area .content .slide .txt .desc {margin-top: 40rem;}
	.sec1 .swiper-area .content .slide .txt .btn-wrap {margin-top: 40rem;}
	.sec1 .swiper-area .content .slide .txt .btn-wrap a {width: 116rem;}
}

@media screen and (max-width: 600px) {
	.sec1 {width: calc(100% - 32rem);}
	.sec1 .swiper-area .content .slide .txt {width: 100%;}
}


.sec2 {padding: 20rem 0 40rem;}
.sec2 .tit-area {transform: translateY(100rem); transition-duration: .7s; opacity: 0; text-align: center;}
.sec2.active .tit-area {transform: translateY(0); opacity: 1;}
.sec2 .tit-area .f54b {margin-bottom: 16rem;}
.sec2 .tit-area .f16r {color: #6D6F79;}
.sec2 .tit-area .f16r br {display: none;}

.sec2 .cont-wrap {margin: 60rem auto 0;}
.sec2 .cont-wrap .list-wrap .cont-list {display: flex; justify-content: center; align-items: center; position: relative; height: 104rem; margin: 0 auto; transition: .3s;}
.sec2 .cont-wrap .list-wrap .cont-list + .cont-list {margin-top: 32rem;}

.sec2 .cont-wrap .list-wrap .cont-list .desc p {position: relative; z-index: 1;}
.sec2 .cont-wrap .list-wrap .cont-list .desc .dimd {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.45);}

.sec2 .cont-wrap > .f12r {display: flex; justify-content: center; margin-top: 80rem; color: #6D6F79; opacity: 0; transform: translateY(100rem); visibility: hidden; transition: .7s;}
.sec2 .cont-wrap > .f12r::before {content: "※"; margin-right: 3rem;}
.sec2 .cont-wrap > .f12r.active {transform: translateY(0); opacity: 1; visibility: visible;}
.sec2 .cont-wrap > .f12r br {display: none;}

@media screen and (min-width: 1025px) {
  .sec2 .cont-wrap .list-wrap {transform: translateY(100rem); opacity: 0; visibility: hidden; transition: .7s;}
  .sec2 .cont-wrap .list-wrap.active {transform: translateY(0); opacity: 1; visibility: visible;}
  .sec2 .cont-wrap .list-wrap .cont-list > .tit {font-family: "Pretendard-Bold"; font-size: 104rem; line-height: 100%; transition: .3s;}
  .sec2 .cont-wrap .list-wrap .cont-list > .tit.bk {color: #30323B;}
  .sec2 .cont-wrap .list-wrap .cont-list > .tit.gr {color: #737684;}
  .sec2 .cont-wrap .list-wrap .cont-list.gs > .tit.bk, .sec2 .cont-wrap .list-wrap .cont-list.gs > .tit.gr {color: #B1B5C3;}

  .sec2 .cont-wrap .list-wrap .cont-list .desc {display: flex; column-gap: 60rem; position: absolute; top: 50%; width: 280rem; height: 100rem; padding: 54rem 0 54rem 164rem; border-radius: 100rem; overflow: hidden; color: #fff; transform: translateY(-50%); transition: .3s;}
  .sec2 .cont-wrap .list-wrap .cont-list.gs .desc {filter: grayscale(100%) !important;}
  .sec2 .cont-wrap .list-wrap .cont-list .desc p {transform: translateY(100rem); opacity: 0; visibility: hidden;}
  .sec2 .cont-wrap .list-wrap .cont-list .desc .desc-tit {width: 308rem;}
  .sec2 .cont-wrap .list-wrap .cont-list .desc .dimd {opacity: 0; transition: .3s;}

  .sec2 .cont-wrap .list-wrap .cont-list.grow {width: 1150rem;}
  .sec2 .cont-wrap .list-wrap .cont-list.fam {width: 652rem;}
  .sec2 .cont-wrap .list-wrap .cont-list.refresh {width: 1160rem;}
  .sec2 .cont-wrap .list-wrap .cont-list.health {width: 827rem;}

  .sec2 .cont-wrap .list-wrap .cont-list.grow > .tit:first-child {margin-right: 328rem;}
  .sec2 .cont-wrap .list-wrap .cont-list.fam > .tit:last-child {margin-left: 304rem;}
  .sec2 .cont-wrap .list-wrap .cont-list.refresh > .tit:first-child {margin-right: 328rem;}
  .sec2 .cont-wrap .list-wrap .cont-list.health > .tit:first-child {margin-right: 304rem;}

  .sec2 .cont-wrap .list-wrap .cont-list.grow .desc {left: 411rem; background: url("/common/images/img-welfare-benefits1.jpg") no-repeat center center / cover;}
  .sec2 .cont-wrap .list-wrap .cont-list.fam .desc {left: 0; background: url("/common/images/img-welfare-benefits2.jpg") no-repeat top 30% left 15% / 458rem auto;}
  .sec2 .cont-wrap .list-wrap .cont-list.refresh .desc {left: 459rem; background: url("/common/images/img-welfare-benefits3.jpg") no-repeat center center / 890rem auto;}
  .sec2 .cont-wrap .list-wrap .cont-list.health .desc {left: 547rem; background: url("/common/images/img-welfare-benefits4.jpg") no-repeat top 50% left 65% / 758rem auto;}

  .sec2 .cont-wrap .list-wrap .cont-list:hover, .sec2 .cont-wrap .list-wrap .cont-list:focus-visible {width: 1335rem !important; height: 180rem;}
  .sec2 .cont-wrap .list-wrap .cont-list:hover .desc, .sec2 .cont-wrap .list-wrap .cont-list:focus-visible .desc {left: 0 !important; width: 1335rem !important; height: 180rem;}
  .sec2 .cont-wrap .list-wrap .cont-list:hover .desc .dimd, .sec2 .cont-wrap .list-wrap .cont-list:focus-visible .desc .dimd {opacity: 1;}

  .sec2 .cont-wrap .list-wrap .cont-list.grow:hover .desc, .sec2 .cont-wrap .list-wrap .cont-list.grow:focus .desc {background: url("/common/images/img-welfare-benefits1.jpg") no-repeat top 70% center / cover;}
  .sec2 .cont-wrap .list-wrap .cont-list.fam:hover .desc, .sec2 .cont-wrap .list-wrap .cont-list.fam:focus .desc {background: url("/common/images/img-welfare-benefits2.jpg") no-repeat top 30% left 15% / 1515rem auto;}
  .sec2 .cont-wrap .list-wrap .cont-list.refresh:hover .desc, .sec2 .cont-wrap .list-wrap .cont-list.refresh:focus .desc {background: url("/common/images/img-welfare-benefits3.jpg") no-repeat center left 40% / 2935rem auto;}
  .sec2 .cont-wrap .list-wrap .cont-list.health:hover .desc, .sec2 .cont-wrap .list-wrap .cont-list.health:focus .desc {background: url("/common/images/img-welfare-benefits4.jpg") no-repeat top 45% center / 2052rem auto;}
}

@media screen and (max-width: 1024px) {
	.sec2 {width: calc(100% - 60rem); margin: 0 auto; padding: 0;}
	.sec2 .tit-area {margin-bottom: 40rem; text-align: center;}
  .sec2 .tit-area .f16r br {display: block;}

  .sec2 .cont-wrap {margin-top: 0;}
  .sec2 .cont-wrap .list-wrap .cont-list {display: block; width: 100%; height: auto; transform: translateY(100rem); opacity: 0; visibility: hidden; transition: .7s;}
  .sec2 .cont-wrap .list-wrap .cont-list.active {transform: translateY(0); opacity: 1; visibility: visible;}

  .sec2 .cont-wrap .list-wrap .cont-list > .tit {display: none;}
  .sec2 .cont-wrap .list-wrap .cont-list .desc {position: relative; padding: 40rem 32rem;}
  .sec2 .cont-wrap .list-wrap .cont-list .desc p {color: #fff;}
  .sec2 .cont-wrap .list-wrap .cont-list .desc .desc-tit {margin-bottom: 30rem;}

  .sec2 .cont-wrap .list-wrap .cont-list.grow {background: url("/common/images/img-welfare-benefits1.jpg") no-repeat center left 45% / 889rem auto;}
  .sec2 .cont-wrap .list-wrap .cont-list.fam {background: url("/common/images/img-welfare-benefits2.jpg") no-repeat top 30% left 40% / 1010rem auto;}
  .sec2 .cont-wrap .list-wrap .cont-list.refresh {background: url("/common/images/img-welfare-benefits3.jpg") no-repeat top 52% left 43% / 1956rem auto;}
  .sec2 .cont-wrap .list-wrap .cont-list.health {background: url("/common/images/img-welfare-benefits4.jpg") no-repeat top 45% left 63% / 1668rem auto;}

  .sec2 .cont-wrap > .f12r {justify-content: flex-start; margin-top: 20rem;}
  .sec2 .cont-wrap > .f12r br {display: block;}
}

@media screen and (max-width: 600px) {
	.sec2 {width: calc(100% - 32rem); padding: 0;}
}



.sec3 {width: calc(100% - 80rem); margin: 120rem auto 0; position: relative;}
.sec3 .tit-area {opacity: 0; transform: translateY(100rem); transition-duration: .7s;}
.sec3.active .tit-area {opacity: 1; transform: translateY(0);}
.sec3 .tit-area .btn-wrap {justify-content: flex-start; margin-top: 24rem;}



.sec3 .slider {position: relative; width: 100%; height: 635rem; margin: 80rem auto 0;}
.sec3 .slider .slider-wrapper {display: flex; transition-duration: .5s; gap: 80rem; align-items: flex-start;}
.sec3 .slider .slide {flex: 0 0 auto; width: 400rem; transition-duration: .5s; display: block;}
.sec3 .slider .slide.active {width: 800rem;}
.sec3 .slider .slide .img {width: 100%; height: 225rem; overflow: hidden; transition-duration: .5s;}
.sec3 .slider .slide.active .img {height: 450rem;}
.sec3 .slider .slide .img img {width: 100%; height: 100%;}
.sec3 .slider .slide .txt {margin-top: 40rem;}
.sec3 .slider.few .control {display: none;}
.sec3 .slider .control {position: absolute; right: 0; top: -150rem; width: 480rem; display: flex; flex-wrap: wrap; justify-content: flex-end;}
.sec3 .slider .control .progress {background: #E1E4EC; width: 100%; height: 3rem;}
.sec3 .slider .control .progress .bar {position: absolute; width: 50rem; height: 3rem; top: 0; left: 0; background: #000; transition-duration: .5s;}
.sec3 .slider .control .progress .bar .dot {width: 5rem; height: 5rem; display: block; background: #000; border-radius: 50rem; position: absolute; top: -1rem; right: 0;}
.sec3 .slider .control .arrow {width: 98rem; display: flex; gap: 10rem; margin-top: 20rem;}
.sec3 .slider .control .arrow .btn-prev {width: 44rem; height: 32rem; background: url("/common/images/ico-main-arrow.svg") no-repeat; background-size: contain; position: unset;}
.sec3 .slider .control .arrow .btn-prev.disa {opacity: .4; pointer-events: none;}
.sec3 .slider .control .arrow .btn-next {width: 44rem; height: 32rem; background: url("/common/images/ico-main-arrow.svg") no-repeat; background-size: contain; transform: rotate(180deg); position: unset;}
.sec3 .slider .control .arrow .btn-next.disa {opacity: .4; pointer-events: none;}

@media screen and (max-width: 1024px) {
	.sec3 {margin: 60rem auto 0; width: calc(100% - 60rem);}
	.sec3.active .tit-area .btn-wrap {margin-top: 12rem;}
	.sec3.active .tit-area .btn-wrap a {width: 130rem;}

	.sec3 .slider {height: 100%; margin: 135rem auto 0;}
	.sec3 .slider.few {margin: 40rem auto 0;}
	.sec3 .slider .slider-wrapper {gap: 0;}
	.sec3 .slider .slide {width: 310rem !important;}
	.sec3 .slider .slide + .slide {margin-left: 30rem;}
	.sec3 .slider .slide .img {height: 174rem !important;}
	.sec3 .slider .slide .txt {margin-top: 20rem;}
	.sec3 .slider .control {width: 100%; top: -95rem;}

	/* .sec3 .swiper {margin-top: 40rem; padding-right: 0; overflow: unset; padding-top: 95rem;}
	.sec3 .swiper .control {width: 100%; display: flex; justify-content: flex-end;}
	.sec3 .swiper .swiper-slide {padding-right: 20rem;}
	.sec3 .swiper .swiper-slide .img {width: 310rem; height: 200rem; margin-bottom: 20rem;}
	.sec3 .swiper .swiper-slide-active .img {width: 310rem; height: 200rem;}
	.sec3 .swiper .swiper-slide .txt {width: 310rem;}
	.sec3 .swiper .swiper-slide-active .txt {width: 310rem;} */
}

@media screen and (max-width: 600px) {
	.sec3 {width: calc(100% - 32rem);}
}



/* .sec3 .swiper {margin-top: 80rem; overflow: hidden; position: relative; padding-top: 120rem; opacity: 0; transform: translateY(100rem); transition-duration: .7s; transition-delay: .2s; padding-right: 400rem;}
.sec3 .swiper.focus .swiper-wrapper {overflow: hidden;}
.sec3.active .swiper {opacity: 1; transform: translateY(0);}
.sec3 .swiper .swiper-slide {width: auto !important; padding-right: 80rem;}
.sec3 .swiper .swiper-slide .img {width: 400rem; height: 260rem; overflow: hidden; margin-bottom: 40rem; transition-duration: .5s;}
.sec3 .swiper .swiper-slide:first-of-type .img {width: 800rem; height: 520rem;}
.sec3 .swiper .swiper-slide-active .img {width: 800rem; height: 520rem; overflow: hidden; margin-bottom: 40rem;}
.sec3 .swiper .swiper-slide .img img {width: 100%; height: 100%; object-fit: cover;}
.sec3 .swiper .swiper-slide .txt {width: 400rem;}
.sec3 .swiper .swiper-slide-active .txt {width: 800rem;}
.sec3 .swiper .control {position: absolute; right: 0; top: 0; width: 480rem;}
.sec3 .swiper .control .swiper-pagination {width: 100%;}
.sec3 .swiper .control .swiper-pagination::after {content: ""; width: 100%; height: 3rem; background: #E1E4EC; display: block; position: absolute; z-index: -1;}
.sec3 .swiper .control .swiper-pagination-progressbar {background: 0; height: 6rem;}
.sec3 .swiper .control .swiper-pagination-progressbar-fill {background: #000; display: block; position: relative; overflow: visible; transform: scale(1) !important; height: 3rem; top: 50%; transform: translate(-50%); width: 0;}
.sec3 .swiper .control .dot {width: 6rem; height: 6rem; display: block; border-radius: 50rem; background: #000; position: absolute; top: 50%; transform: translateY(-46%); right: 0;}
.sec3 .swiper .control .arrow {width: 98rem; display: flex; gap: 10rem; margin-top: 20rem;}
.sec3 .swiper .control .arrow .swiper-button-prev {width: 44rem; height: 32rem; background: url("/common/images/ico-main-arrow.svg") no-repeat; background-size: contain; position: unset;}
.sec3 .swiper .control .arrow .swiper-button-next {width: 44rem; height: 32rem; background: url("/common/images/ico-main-arrow.svg") no-repeat; background-size: contain; transform: rotate(180deg); position: unset;} */
