@charset "utf-8";
/* container */
.container {width: 157.5rem; margin: 0 auto;}

@media screen and (max-width: 880px) {
    .container {width: 100%;}
}

/* header */
header {position: fixed; top: 0; left: 0; width: 100%; height: 8rem; background: rgba(0,0,0,0.2); z-index: 10;}
header .in_header {width: 100%; max-width: 157.5rem; height: 8rem; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; padding-right: 8rem; box-sizing: border-box;}
header .in_header .logo img {}
header .in_header .logo img.act {display: none}
header .in_header nav .navList {display: flex; gap: 5.2rem; align-items: center;}
header .in_header nav .navList a {color: #fff;}

header.fix {background: #fff;}
header.fix .in_header nav .navList a {color: #000;}
header.fix .in_header .logo img {display: none}
header.fix .in_header .logo img.act {display: block}

@media screen and (max-width: 880px) {
    body {overflow: hidden;}

    header {height: 5.8rem;}
    header .in_header {max-width: 100%; height: 5.8rem; padding: 0 2.4rem; box-sizing: border-box; display: none;}
    header .in_header .logo img {width: 15rem;}
    header .in_header .mo_menu img {width: 2.4rem;}
    header .in_header .mo_menu img.act {display: none}

    header.fix .in_header .mo_menu img {width: 2.4rem; display: none;}
    header.fix .in_header .mo_menu img.act {display: block;}


    header .mo_header {position: fixed; width: 100%; top: 0; z-index: 99; transition: 0.3s;}

    header .mo_header .mo_head {padding: 0 2rem; height: 5.8rem; align-items: center;}
    header .mo_header .mo_head .logo img {width: 15rem;}
    header .mo_header .mo_head .logo img.act {display: none;}
    header .mo_header .mo_head .menu_btn img {width: 2.4rem;}
    header .mo_header .mo_head .menu_btn img.act {display: none;}

    header.fix .mo_header .mo_head .logo img {display: none;}
    header.fix .mo_header .mo_head .logo img.act {display: block;}
    header.fix .mo_header .mo_head .menu_btn img {display: none;}
    header.fix .mo_header .mo_head .menu_btn img.act {display: block;}

    header .mo_header .mo_menu_wrap {position: fixed; width: 100%; height: 100%; top: 0; display: none;}
    header .mo_header .mo_menu_wrap .mo_black_bg {width: 100%; height: 100%; background: rgba(0,0,0,0.4); position: absolute; top:0; left: 0;}

    header .mo_header .mo_menu_box {width: 80%; height: 100%; margin-left: auto; background: #fff; right: -100%; transition: 1s;}
    header .mo_header .mo_menu_box .menu_logo {padding: 20px 25%;}

    header .mo_header .menu_gnb {padding: 20px;}
    header .mo_header .menu_gnb_lst {border-bottom: 1px solid #e1e1e1;}
    header .mo_header .menu_gnb_lst a {display: block; padding: 8px}
    header .mo_header .menu_gnb_lst .gnb_name {font-size: 2.1rem; display: block;}
}

/* main */
.main {height: 108rem; background: url('../images/main_img.png') no-repeat; background-size: cover;}
.main .textArea {width: 100%; max-width: 157.5rem; margin: 0 auto; position: relative; top: 31rem;}
.main .textArea .txt {letter-spacing: 10px; opacity: 0.35; text-shadow: 2px 2px 6px rgba(0,0,0,0.2); margin-bottom: 1.5rem;}
.main .textArea .tit {line-height: 1.3; text-shadow: 2px 2px 6px rgba(0,0,0,0.2); margin-bottom: 2rem;}
.main .textArea .txt2 {text-shadow: 2px 2px 6px rgba(0,0,0,0.2); margin-bottom: 9.8rem;}
.main .textArea .scrollIcon {animation: floatUpDown 2s ease-in-out infinite;}

@keyframes floatUpDown {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
    100% {
        transform: translateY(0);
    }
}


@media screen and (max-width: 880px) {
    .main {height: 85.2rem; background: url('../images/main_img_mo.png') no-repeat; background-size: cover;}
    .main .textArea {top: 23rem; padding: 0 2.4rem; box-sizing: border-box;}
    .main .textArea .tit {font-size: 4.4rem; margin-bottom: 1.6rem;}
    .main .textArea .tit span.fs90 {font-size: 7.8rem;}
    .main .textArea .txt2 {font-size: 2.0rem; margin-bottom: 4rem; line-height: 3.2rem;}
    .main .textArea .scrollIcon img {width: 13.7rem;}
}

/* s1 */
#s1 {position: relative; padding: 31.8rem 0 31.1rem 0;}
#s1::before {content: ''; position: absolute; top: 0; right: 0; background: url('../images/s1_img3.png') no-repeat; background-size: 100%; width: 67.6rem; height: 40rem;}
#s1 .title {margin-bottom: 6.7rem;}
#s1 .imgArea {margin-bottom: 6rem;}
#s1 .sText {padding-left: 10rem; position: relative;}
#s1 .sText .tit {margin-bottom: 2.2rem;}
#s1 .sText .assets {position: absolute; bottom: -2rem; right: 3.3rem;}

@media screen and (max-width: 880px) {
    #s1 {padding: 22rem 0 10.6rem 0;}
    #s1::before {background: url('../images/s1_img3_mo.png') no-repeat; background-size: 100%; width: 100%; height: 23rem; top: 6.4rem;}
    #s1 .imgArea  {margin-bottom: 14.8rem;}
    #s1 .title .tit {font-size: 3.6rem; margin-bottom: 4.8rem;}
    #s1 .sText {padding-left: 0; text-align: center;}
    #s1 .sText .txt {line-height: 3.2rem;}
    #s1 .sText .assets {bottom: auto; top: -26.5rem; right: auto; left: 50%; transform: translateX(-50%);}
    #s1 .sText .assets img {width: 26.8rem;}
}

#s2 {background: #f2efea}
#s2 .inner {}
#s2 .titArea {padding: 20rem 0 7.2rem; text-align: center;}
#s2 .titArea .txt {width: 51.4rem; margin: 0 auto;}
#s2 .titArea .abTxt {width: 27.3rem; left: 10%;}
#s2 .imgArea {}
#s2 .imgArea .doc {z-index: 2}
#s2 .imgArea .p1 {width: 17.1rem; top: 0; right: 37%; cursor: pointer; z-index: 2}
#s2 .imgArea .p2 {width: 11.6rem; top: 45%; left: 18%; cursor: pointer; z-index: 2}
#s2 .imgArea .p3 {width: 14rem; top: 36%; right: 18%; cursor: pointer; z-index: 2}
#s2 .marquee-container {position: absolute; font-size: 26.4rem; color: #fff; opacity: 0.56; bottom: 7%; z-index: 1; width: 100%; overflow: hidden;}

#s2 .popArea {display: none; z-index: 999999}
#s2 .popArea .popBg {background: rgba(0,0,0,0.7);}
#s2 .popArea .popBox {width: 65%; transform: translate(-50%, -50%) scale(0); transition: 0.8s;}
#s2 .popArea .popBox.on {transform: translate(-50%, -50%) scale(1);}
#s2 .popArea .popBox .popImg {display: none;}
#s2 .popArea .popBox .cancelIco {display: none; position: absolute; max-width: 4rem; top: 6%; right: 4%;}

@media screen and (max-width: 880px) {
    #s2 .txtMo {background: #fff;}

    #s2 .popArea .popBox {width: 90%}
    #s2 .popArea .popBox .cancelIco {max-width: 2rem; top: 3%; right: 6%;}
}

/* s3 */
#s3 {border-top: 1px solid #B4A392; background: #F2EFEA; overflow: hidden;}
#s3 .textArea {width: 47.6rem; flex-shrink: 0; border-right: 1px solid #B4A392; box-sizing: border-box; padding: 10.7rem 0 20rem 0;}
#s3 .textArea .tit {margin-bottom: 2.4rem;}
#s3 .textArea .txt {margin-bottom: 3.6rem; line-height: 2.8rem;}
#s3 .textArea .list {display: flex; gap: 0.8rem;}
#s3 .textArea .list li {width: 13.4rem; height: 10rem;}
#s3 .textArea .list li a {display: block; width: 100%; height: 100%;  border: 1px solid #4F3333; box-sizing: border-box; display: flex; align-items: center; justify-content: center; text-align: center; border-radius: 16px; transition: all 0.3s;}
#s3 .textArea .list li a:hover {color: #fff; font-weight: 600; background: #4F3333;}
#s3 .s3_swiper {width: 102rem; padding: 10.7rem 0 20rem 0; overflow: hidden;}
#s3 .s3_swiper a img {width: 100%;}

@media screen and (max-width: 880px) {
    #s3 .container {flex-wrap: wrap;}
    #s3 .textArea {width: 100%; padding: 9rem 2.4rem 7.8rem 2.4rem; text-align: center; border-right: none;}
    #s3 .textArea .tit {font-size: 3.6rem;}
    #s3 .textArea .txt {font-size: 1.6rem; margin-bottom: 5rem; line-height: 2.4rem;}
    #s3 .textArea .list {justify-content: center;}
    #s3 .textArea .list li {width: 11.2rem; height: 8.4rem;}
    #s3 .textArea .list li a {font-size: 1.6rem;}
    #s3 .s3_swiper {width: 100%; padding: 0 0 9.6rem 0}
    /* #s3 .s3_swiper .swiper-wrapper {gap: 20px;} */
    #s3 .s3_swiper .swiper-slide {width: 24rem !important;}
    #s3 .s3_swiper .swiper-slide a {display: block; width: 100%;}
}

/* s4 */
#s4 {padding-top: 23rem; background: #4F3333;}
#s4 .title .txt {margin-bottom: 0.8rem;}
#s4 .title .tit {margin-bottom: 1.4rem;}
#s4 .title .txt2 {margin-bottom: 7.4rem;}
#s4 .change {transition: 0.2s;}
#s4 .change.cg1 {background: url('../images/s4_bg_1.jpg') center/cover;}
#s4 .change.cg2 {background: url('../images/s4_bg_2.jpg') center/cover;}
#s4 .change.cg3 {background: url('../images/s4_bg_3.jpg') center/cover;}
#s4 .change.cg4 {background: url('../images/s4_bg_4.jpg') center/cover;}
#s4 .change.cg5 {background: url('../images/s4_bg_5.jpg') center/cover;}
#s4 .change.cg6 {background: url('../images/s4_bg_6.jpg') center/cover;}
#s4 .change .inner {width: 100%; max-width: 106.6rem; margin: 0 auto; padding: 16.6rem 0 10.4rem;}
#s4 .change .txtArea {margin-bottom: 10.4rem; color: #fff;}
#s4 .change .txtArea::before {content: ''; display: block; position: absolute; width: 5.6rem; height: 2px; background: #FF7D3E; left: -10rem; top: 3rem;}
#s4 .change .txtArea .tTit {}
#s4 .change .txtArea .tTit .tit {font-size: 4.8rem; font-weight: 600; padding-right: 1.6rem;}
#s4 .change .txtArea .tTit .subt {font-size: 1.8rem; font-weight: bold}
#s4 .change .txtArea .tWrt {font-size: 2rem; font-weight: 300; padding-top: 2.2rem; line-height: 2.8rem;}
#s4 .change .lstArea {display: flex; gap: 2.6rem; border: 2px solid rgba(255,255,255,0.2); border-right: 0; border-left: 0;}
#s4 .change .lstArea li {cursor: pointer;}
#s4 .change .lstArea li img {}
#s4 .change .lstArea li img.on {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none;}
#s4 .change .lstArea li:nth-child(1) img.on {display: block;}
#s4 .change .numArea {position: absolute; top: 16rem; left: -20rem;}
#s4 .list {display: none;}


@media screen and (max-width: 880px) {
    #s4 {padding-top: 12.8rem;}
    #s4 .title .txt {font-size: 2rem; margin-bottom: 1.2rem;}
    #s4 .title .tit {font-size: 3.6rem; margin-bottom: 1.6rem; line-height: 4.8rem;}
    #s4 .title .txt2 {font-size: 1.8rem; margin-bottom: 7.2rem; line-height: 2.8rem;}
    #s4 .change {display: none;}
    #s4 .list {display: flex; flex-wrap: wrap;}
    #s4 .list li {position: relative; width: 100%; height: 18.8rem;}
    #s4 .list li img {width: 100%; height: 100%; position: absolute; top: 0; left: 0; transition: all 0.3s;}
    #s4 .list li img.on {opacity: 1;}
    #s4 .list li.act img.off {opacity: 0;}
    #s4 .list li.act img.on {opacity: 1;}
}

/* s5 */
#s5 {padding: 12rem 0 29rem 0; overflow: hidden; background: #F6F7F9}
#s5 .title {padding-left: 26.5rem; box-sizing: border-box; gap: 7.8rem; align-items: flex-end; margin-bottom: 5rem;}
#s5 .title .lt .txt {margin-bottom: 2.8rem;}
#s5 .title .lt .tit {line-height: 8rem;}
#s5 .title .rt {line-height: 3.2rem; padding-bottom: 2.2rem;}
#s5 .imgArea {justify-content: flex-end; margin-bottom: 8rem;}
#s5 .list {width: 100%; max-width: 130.8rem; margin: 0 auto;}
#s5 .list>li {gap: 12.2rem;}
#s5 .list>li:first-child {margin-bottom: 7.9rem; padding-bottom: 7.9rem; border-bottom: 1px solid #B4A392; box-sizing: border-box;}
#s5 .list>li .iconArea {gap: 4.6rem; min-width: 38rem;}
#s5 .list>li .text li:not(:last-of-type) {margin-bottom: 1.2rem;}

@media screen and (max-width: 880px) {
    #s5 {padding: 12.8rem 0;}
    #s5 .title {padding-left: 2.4rem; gap: 1.2rem; margin-bottom: 4.8rem; flex-wrap: wrap;}
    #s5 .title .lt .txt {font-size: 2.0rem; margin-bottom: 1.2rem;}
    #s5 .title .lt .tit {font-size: 3.6rem; line-height: 4.8rem;}
    #s5 .title .rt {font-size: 1.6rem; line-height: 2.4rem;}
    #s5 .imgArea {margin-bottom: 3.2rem; padding-left: 2.4rem; box-sizing: border-box;}
    #s5 .imgArea img {width: 100%;}
    #s5 .list {max-width: 100%; padding: 0 2.4rem; box-sizing: border-box;}
    #s5 .list>li {flex-wrap: wrap; gap: 2.4rem;}
    #s5 .list>li:first-child {margin-bottom: 4.8rem; padding-bottom: 4.8rem;}
    #s5 .list>li .iconArea {width: 100%; gap: 2.0rem;}
    #s5 .list>li .iconArea img {width: 5.6rem;}
    #s5 .list>li .iconArea .tit {font-size: 2.4rem;}
    #s5 .list>li .text li {font-size: 1.6rem;}
    #s5 .list>li .text li:not(:last-of-type) {margin-bottom: 1rem;}
}

/* s6 */
#s6 {padding-bottom: 32rem; background: #F6F7F9}
#s6 .contArea {width: 100%; max-width: 130.8rem; margin: 0 auto; border-radius: 3rem; overflow: hidden; background: #F6F7F9;}
#s6 .contArea .imgArea {width: 53.6rem;}
#s6 .contArea .imgArea img {width: 100%; height: 100%; object-fit: cover;}
#s6 .contArea .text {width: calc(100% - 53.6rem); padding: 8rem 6rem 6rem 8rem; box-sizing: border-box; background: #F6F7F9;}
#s6 .contArea .text .txt {margin-bottom: 2.2rem;}
#s6 .contArea .text .tit {margin-bottom: 4.7rem; line-height: 4.8rem;}
#s6 .contArea .list li {gap: 3.4rem;}
#s6 .contArea .list li:not(:last-of-type) {margin-bottom: 2.5rem; padding-bottom: 2.5rem; border-bottom: 1px solid #C9CDD2; box-sizing: border-box;}
#s6 .contArea .list li span {flex-shrink: 0;}

@media screen and (max-width: 880px) {
    #s6 {padding-bottom: 10.4rem; position: relative;}
    #s6::before {content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 91.2rem; background: #F6F7F9;}
    #s6 .contArea {max-width: 100%; padding: 0 2.4rem; box-sizing: border-box; flex-wrap: wrap; gap: 4.8rem;}
    #s6 .contArea .imgArea {width: 100%;}
    #s6 .contArea .text {width: 100%; padding: 0; background: transparent;}
    #s6 .contArea .text .txt {font-size: 1.8rem; margin-bottom: 1.2rem;}
    #s6 .contArea .text .tit {font-size: 2.4rem; line-height: 3.2rem; margin-bottom: 3.6rem;}
    #s6 .contArea .list li {gap: 0.8rem;}
    #s6 .contArea .list li span {display: inline-block; margin-bottom: 1rem;}
}

/* s7 */
#s7 {width: 100%; height: 72.5rem; background: url('../images/s7_img.png') no-repeat; background-size: cover;}
#s7 .title {margin-bottom: 4.5rem;}
#s7 .list {gap: 2.4rem; box-sizing: border-box;}
#s7 .list li {width: 36.8rem; height: 36.8rem; border-radius: 50%; border: 1px solid #FFFFFF; box-sizing: border-box;}
#s7 .list li .num {margin-bottom: 1.4rem;}
#s7 .list li .tit {margin-bottom: 1.8rem;}
#s7 .list li .txt {margin-bottom: 3rem; padding-bottom: 2.2rem; position: relative; line-height: 2.4rem;}
#s7 .list li .txt::before {content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 23.6rem; height: 1px; background: #fff;}
#s7 .list li .txt2 {line-height: 2.4rem;}

@media screen and (max-width: 880px) {
    #s7 {height: auto; padding: 12.8rem 0; background: url('../images/s7_img_mo.png') no-repeat; background-size: cover; overflow: hidden;}
    #s7 .title {font-size: 3.6rem; line-height: 4.8rem; margin-bottom: 5.6rem;}
    #s7 .list {flex-wrap: wrap; gap: 4rem;}
    #s7 .list li {width: 35.2rem; height: 35.2rem;}
    #s7 .list li .num {font-size: 2.4rem; margin-bottom: 1.6rem;}
    #s7 .list li .tit {font-size: 2.4rem; margin-bottom: 1.6rem;}
    #s7 .list li .txt {margin-bottom: 2.8rem; padding-bottom: 1.8rem;}
    #s7 .list li .txt::before {width: 22.5rem;}
}

/* s8 */
#s8 {padding-top: 35rem; overflow: hidden;}
#s8 .title {padding-left: 26.5rem; box-sizing: border-box; gap: 7.8rem; align-items: flex-end; margin-bottom: 5rem;}
#s8 .title .lt .txt {margin-bottom: 2.8rem;}
#s8 .title .lt .tit {line-height: 8rem;}
#s8 .title .rt {line-height: 3.2rem; padding-bottom: 2.2rem;}
#s8 .imgArea {justify-content: flex-end;}

@media screen and (max-width: 880px) {
    #s8 {padding-top: 15.6rem;}
    #s8 .title {padding-left: 2.4rem; gap: 1.2rem; margin-bottom: 4.8rem; flex-wrap: wrap;}
    #s8 .title .lt .txt {font-size: 2.0rem; margin-bottom: 1.2rem;}
    #s8 .title .lt .tit {font-size: 3.6rem; line-height: 4.8rem;}
    #s8 .title .rt {font-size: 1.6rem; line-height: 2.4rem;}
    #s8 .imgArea {padding-left: 2.4rem; box-sizing: border-box;}
    #s8 .imgArea img {width: 100%;}
}

/* s9 */
#s9 {padding: 26.8rem 0 31.8rem 0;}
#s9 .title {margin-bottom: 8rem;}
#s9 .title .icon {margin-bottom: 2.2rem;}
#s9 .list {gap: 3.2rem;}

@media screen and (max-width: 880px) {
    #s9 {padding: 16rem 0 14.8rem 0;}
    #s9 .title {font-size: 3.6rem; line-height: 4.8rem; margin-bottom: 4.8rem;}
    #s9 .title .icon {margin-bottom: 2rem;}
    #s9 .title .icon img {width: 7.4rem;}
    #s9 .list {flex-wrap: wrap; gap: 5.6rem; width: 100%; padding: 0 2.4rem; box-sizing: border-box;}
    #s9 .list li {width: 100%;}
    #s9 .list li img {width: 100%;}
}

/* s10 */
#s10 {padding-bottom: 33.7rem;}
#s10 .contArea {gap: 25.2rem;}
#s10 .contArea .leftCon {padding-top: 5.4rem;}
#s10 .contArea .leftCon .title {line-height: 6.6rem; margin-bottom: 5.8rem;}
#s10 .contArea .leftCon .list {position: relative; margin-bottom: 5.2rem;}
#s10 .contArea .leftCon .list::before {content: ''; position: absolute; top: 1.5rem; left: 0.6rem; width: 1px; height: 14rem; background: #FFD3AC;}
#s10 .contArea .leftCon .list li {position: relative; padding-left: 3.7rem; box-sizing: border-box; position: relative;}
#s10 .contArea .leftCon .list li::before {content: ''; position: absolute; top: 0.8rem; left: 0; width: 1.3rem; height: 1.3rem; border-radius: 50%; background: #FF7D3E;}
#s10 .contArea .leftCon .list li:not(:last-of-type) {margin-bottom: 4.2rem;}
#s10 .contArea .leftCon .txt {line-height: 2.8rem;}
#s10 .contArea .rightCon .imgArea {width: 70.2rem; position: relative;}
#s10 .contArea .rightCon .imgArea::before {content: ''; position: absolute; bottom: 2.6rem; left: -23.6rem; background: url('../images/s10_img2.png') no-repeat; width: 36rem; height: 36.7rem; background-size: 100%;}
#s10 .contArea .rightCon .imgArea img {width: 100%;}

@media screen and (max-width: 880px) {
    #s10 {padding-bottom: 13.2rem; position: relative;}
    #s10::before {content: ''; position: absolute; left: 0; bottom: 13.2rem; background: url('../images/s10_img2_mo.png') no-repeat; width: 100%; height: 37.2rem; background-size: 100%;}
    #s10 .contArea {gap: 0; flex-wrap: wrap; padding: 0 2.4rem; box-sizing: border-box;}
    #s10 .contArea .leftCon {position: relative;}
    #s10 .contArea .leftCon .title {font-size: 3.6rem; line-height: 4.8rem; margin-bottom: 4.8rem;}
    #s10 .contArea .leftCon .imgArea {width: 100%; margin-bottom: 5.8rem;}
    #s10 .contArea .leftCon .imgArea img {width: 100%;}
    #s10 .contArea .leftCon .list {margin-bottom: 5.6rem;}
    #s10 .contArea .leftCon .list li {font-size: 2.0rem;}
    #s10 .contArea .leftCon .txt {font-size: 1.6rem; line-height: 2.4rem;}
    #s10 .contArea .rightCon .imgArea {display: none;}
}

/* s11 */
#s11 {position: relative; background: #FFFAEF; padding: 53.1rem 0 25.4rem 0;}
#s11 .title.trgActOn {position: relative; bottom: 0;}
#s11 .title.trgActOff {bottom: -5rem;}
#s11 .title .txt {margin-bottom: 5.8rem;}
#s11 .title .tit {margin-bottom: 5.8rem; line-height: 8.4rem;}
#s11 .title .txt2 {line-height: 3.6rem;}
#s11 img {position: absolute;}
#s11 img.trgActOn:first-of-type {top: 28.1rem; left: 24rem;}
#s11 img.trgActOn:nth-of-type(2) {bottom: 0; left: 0;}
#s11 img.trgActOn:nth-of-type(3) {top: 43.8rem; right: 0;}
#s11 img.trgActOff:first-of-type {top: 32.1rem; left: 24rem;}
#s11 img.trgActOff:nth-of-type(2) {bottom: -5rem; left: 0;}
#s11 img.trgActOff:nth-of-type(3) {top: 48.8rem; right: 0;}

@media screen and (max-width: 880px) {
    #s11 {padding: 66.1rem 0 35.2rem 0;}
    #s11 .title .txt {font-size: 2.8rem; line-height: 4.0rem; margin-bottom: 2.8rem;}
    #s11 .title .tit {font-size: 2.8rem; line-height: 4.0rem; margin-bottom: 2.8rem;}
    #s11 .title .txt2 {font-size: 1.8rem; line-height: 3.2rem;}
    #s11 img.trgActOn:nth-of-type(4) {top: 10.7rem; left: 0; width: 19.2rem;}
    #s11 img.trgActOn:nth-of-type(5) {top: 32.9rem; right: 0; width: 23.4rem;}
    #s11 img.trgActOn:nth-of-type(6) {bottom: 12.9rem; left: 0; width: 28.4rem;}
    #s11 img.trgActOff:nth-of-type(4) {top: 15.7rem; left: 0; width: 19.2rem;}
    #s11 img.trgActOff:nth-of-type(5) {top: 37.9rem; right: 0; width: 23.4rem;}
    #s11 img.trgActOff:nth-of-type(6) {bottom: 7.9rem; left: 0; width: 28.4rem;}
}

/* s12 */
#s12 {background: #FFFAEF; padding: 33rem 0 38.7rem 0;}
#s12 .contArea {gap: 8.2rem;}
#s12 .contArea .leftCon {padding-bottom: 5.5rem;}
#s12 .title {line-height: 6.6rem; margin-bottom: 1.6rem;}
#s12 .txt {margin-bottom: 10.5rem;}

@media screen and (max-width: 880px) {
    #s12 {padding: 0 0 16rem 0;}
    #s12 .contArea .leftCon {width: 100%; padding: 0 2.4rem; box-sizing: border-box;}
    #s12 .contArea .imgArea img {width: 100%;}
    #s12 .contArea .imgArea:not(:last-of-type) {margin-bottom: 4.8rem;}
    #s12 .title {font-size: 3.6rem; line-height: 4.8rem; margin-bottom: 1.2rem;}
    #s12 .txt {font-size: 1.6rem; line-height: 2.4rem; margin-bottom: 4.8rem;}
}

/* s13 */
#s13 {padding-bottom: 24.5rem; background: #FFFAEF;}
#s13 .title {line-height: 7rem; margin-bottom: 7rem;}
#s13 .imgArea {margin-bottom: 4rem;}
#s13 .imgArea img {margin: 0 auto;}
#s13 .textArea {gap: 20rem;}
#s13 .textArea .tit {line-height: 5.4rem;}
#s13 .textArea .txt {line-height: 3.2rem;}

@media screen and (max-width: 880px) {
    #s13 {padding-bottom: 8.2rem;}
    #s13 .title {font-size: 3.6rem; line-height: 4.8rem; margin-bottom: 4.8rem;}
    #s13 .imgArea {margin-bottom: 4.4rem;}
    #s13 .imgArea img {width: 100%;}
    #s13 .textArea {flex-wrap: wrap; gap: 3rem; padding: 0 2.4rem; box-sizing: border-box;}
    #s13 .textArea .tit {width: 100%; font-size: 2.8rem; line-height: 4rem;}
    #s13 .textArea .txt {width: 100%; font-size: 1.6rem; line-height: 2.6rem;}
}

/* s14 */
#s14 {padding: 33rem 0 31rem 0; overflow: hidden;}
#s14 .container {gap: 9.8rem;}
#s14 .textArea .tit {margin-bottom: 4.7rem; line-height: 6rem; padding-bottom: 8.2rem; position: relative;}
#s14 .textArea .tit::before {content: ''; position: absolute; bottom: 0; left: 0; background: #B4A392; width: 67rem; height: 1px;}
#s14 .textArea .txt {line-height: 3.6rem;}

@media screen and (max-width: 880px) {
    #s14 {padding: 12rem 0 12.9rem 0;}
    #s14 .container {flex-wrap: wrap; gap: 5.6rem; padding: 0 2.4rem; box-sizing: border-box;}
    #s14 .imgArea {width: 100%;}
    #s14 .imgArea img {width: 100%;}
    #s14 .textArea {width: 100%; text-align: center;}
    #s14 .textArea .tit {font-size: 3.6rem; line-height: 4.8rem; margin-bottom: 2.8rem; padding-bottom: 2.8rem;}
    #s14 .textArea .tit::before {width: 100%;}
    #s14 .textArea .txt {font-size: 1.8rem; line-height: 2.4rem;}
}

/* s15 */
#s15 {padding-bottom: 31.2rem;}
#s15 .contArea {gap: 25.6rem;}
#s15 .contArea .title {padding-top: 2rem;}
#s15 .contArea .title .icon {margin-bottom: 2.4rem;}
#s15 .contArea .title .tit {line-height: 8.2rem; margin-bottom: 4.2rem;}
#s15 .contArea .title .txt {line-height: 3.2rem;}

@media screen and (max-width: 880px) {
    #s15 {padding-bottom: 13.8rem;}
    #s15 .contArea {flex-wrap: wrap; gap: 4.8rem; text-align: center; padding: 0 2.4rem; box-sizing: border-box;}
    #s15 .contArea .title {padding-top: 0;}
    #s15 .contArea .title .icon img {width: 5.2rem; margin: 0 auto;}
    #s15 .contArea .title .tit {font-size: 3.6rem; line-height: 4.8rem; margin-bottom: 1.2rem;}
    #s15 .contArea .title .txt {font-size: 1.6rem; line-height: 2.4rem;}
    #s15 .imgArea {width: 100%;}
    #s15 .imgArea img {width: 100%;}
}

/* s16 */
#s16-1 .inner {}
#s16-1 .contWrap {width: 100%; top: 0;}
#s16-1 .cont {height: 100vh}
#s16-1 .cont .img {height: 100%; width: 100%;}
#s16-1 .cont .img2 {}
#s16-1 .cont .img3 {}
#s16-1 .cont .img1 {z-index: 1; width: 100%; height: 100%; transition: 1s;}
#s16-1 .cont .img img {object-fit: cover; height: 100%;}
#s16-1 .cont .img1 {background: url('../images/s16_img1.png') no-repeat; background-size: cover; background-position: center;}
#s16-1 .cont .img4 {background: url('../images/s16_img3.png') no-repeat; background-size: cover; background-position: center;}
#s16-1 .cont2 > div {width: 100%}

@media all and (max-width: 880px){
    #s16-1 .inner {height: auto;}
}

#s16-2 .inner {}
#s16-2 .contWrap {width: 100%; top: 0;}
#s16-2 .cont {height: 100vh}
#s16-2 .cont .img {height: 100%; width: 100%;}
#s16-2 .cont .img2 {}
#s16-2 .cont .img3 {}
#s16-2 .cont .img1 {z-index: 1; width: 100%; height: 100%; transition: 1s;}
#s16-2 .cont .img img {object-fit: cover; height: 100%;}
#s16-2 .cont .img1 {background: url('../images/s16_img1.png') no-repeat; background-size: cover; background-position: center;}
#s16-2 .cont .img4 {background: url('../images/s16_img3.png') no-repeat; background-size: cover; background-position: center;}
#s16-2 .cont2 > div {width: 100%}

@media all and (max-width: 880px){
    #s16-2 .inner {height: auto;}
}

/* s17 */
#s17 {padding: 30rem 0 35.3rem 0;}
#s17 .contArea {gap: 11.6rem; padding: 11.1rem 0 9.3rem 0; border-radius: 3rem; background: #FAF6F3;}
#s17 .title .tit {line-height: 6.2rem; margin-bottom: 5.4rem;}
#s17 .title .txt {line-height: 3.2rem;}
#s17 .list {gap: 1.4rem;}
#s17 .list li {display: flex; flex-direction: column; align-items: center;}
#s17 .list li:first-child {margin-right: -1.5rem;}
#s17 .list .circleBox {position: relative; margin-bottom: 5.6rem;}
#s17 .list .circleBox::before {content: ''; position: absolute; top: -3.8rem; left: -3.8rem; width: 32.6rem; height: 32.6rem; border-radius: 50%;}
#s17 .list li:first-child .circleBox::before {background-color: #FFD3AC;}
#s17 .list li:nth-child(2) .circleBox::before {background-color: #B4A392; opacity: 0.58;}
#s17 .list li:nth-child(3) .circleBox::before {background-color: #FFD3AC;}
#s17 .list .circleBox img {position: relative; z-index: 1;}
#s17 .list .circleBox p {z-index: 2;}
#s17 .list .txt {line-height: 2.8rem;}

@media screen and (max-width: 880px) {
    #s17 {padding: 7rem 0 16rem 0;}
    #s17 .container {padding: 0 2.4rem; box-sizing: border-box;}
    #s17 .contArea {flex-wrap: wrap; gap: 8rem; padding: 11.2rem 0 9.6rem 0;}
    #s17 .title {text-align: center;}
    #s17 .title .tit {font-size: 3.6rem; line-height: 4.8rem; margin-bottom: 2rem;}
    #s17 .title .txt {font-size: 1.6rem; line-height: 2.4rem;}
    #s17 .list {flex-direction: column; gap: 7.2rem;}
    #s17 .list li:first-child {margin-right: 0;}
    #s17 .list .circleBox {margin-bottom: 4.9rem;}
    #s17 .list .circleBox::before {width: 25.2rem; height: 25.2rem; top: -2.8rem; left: -2.8rem;}
    #s17 .list .circleBox img {width: 19.6rem;}
    #s17 .list .circleBox p {font-size: 2.8rem;}
    #s17 .list .txt {font-size: 1.6rem; line-height: 2.4rem;}
}

/* s18 */
#s18 {overflow: hidden; padding-bottom: 32.6rem;}
#s18 .container {padding: 0 6.8rem; box-sizing: border-box; margin-bottom: 8.8rem;}
#s18 .container .title {padding-bottom: 5.6rem; border-bottom: 2px solid #FF7D3E; box-sizing: border-box;}
#s18 .container .title .txt {text-align: right;}
#s18 .container .title .txt img {margin-bottom: 3.8rem; margin-left: auto;}
#s18 .container .title .txt p:first-of-type {margin-bottom: 0.6rem;}
#s18 .slideWrap .s18_swiper2 {padding-bottom: 1.3rem;}
#s18 .slideWrap .s18_swiper2:last-of-type {padding-bottom: 0;}
#s18 .slideWrap .s18_swiper2 .swiper-wrapper {transition-timing-function: linear !important; gap: 1.6rem;}
#s18 .slideWrap .s18_swiper2 img {width: 100%;}

@media screen and (max-width: 880px) {
    #s18 {padding-bottom: 12.8rem;}
    #s18 .container {width: 100%; padding: 0;}
    #s18 .container .title {text-align: center; flex-wrap: wrap; gap: 2.8rem; border-bottom: none; padding-bottom: 0;}
    #s18 .container .title div {font-size: 5.6rem; line-height: 6.6rem; width: 100%;}
    #s18 .container .title div span.fs114 {font-size: 9.8rem;}
    #s18 .container .title .txt {text-align: center;}
    #s18 .container .title .txt img {width: 18.4rem; margin: 0 auto 3.2rem auto;}
    #s18 .container .title .txt p.fs18 {font-size: 1.8rem; margin-bottom: 1.6rem; line-height: 1;}
    #s18 .container .title .txt p.fs24 {font-size: 2.0rem; line-height: 3.2rem;}
}

/* s19 */
#s19 .title {margin-bottom: 6rem;}
#s19 .title .txt {margin-bottom: 2.6rem; padding-bottom: 0.6rem; position: relative;}
#s19 .title .txt::before {content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 35.4rem; height: 1px; background: #FF7D3E;}
#s19 .title .tit {line-height: 7.8rem;}

@media screen and (max-width: 880px) {
    #s19 .title {margin-bottom: 5.6rem;}
    #s19 .title .txt {font-size: 2.4rem; margin-bottom: 2.8rem; padding-bottom: 0.4rem;}
    #s19 .title .txt::before {width: 26.3rem;}
    #s19 .title .tit {font-size: 3.2rem; line-height: 4.8rem;}
}

/* s20 */
#s20 .contArea {height: 80rem;}
#s20 .contArea>div {width: 50%; height: 100%;}
#s20 .contArea .textArea {gap: 14.6rem; padding-left: 27.3rem; box-sizing: border-box; background: #FAF6F3;}
#s20 .contArea .top .txt {margin-bottom: 3.1rem;}
#s20 .contArea .top .imgArea {margin-bottom: 2.3rem;}
#s20 .contArea .bottom .call {margin-bottom: 3rem;}
#s20 .contArea .mapArea img {height: 100%; object-fit: cover;}

@media screen and (max-width: 880px) {
    #s20 .contArea {flex-wrap: wrap; height: auto;}
    #s20 .contArea>div {width: 100%; height: auto;}
    #s20 .contArea .textArea {padding: 10.6rem 2.4rem 7.2rem 2.4rem; gap: 9.8rem;}
    #s20 .contArea .top .txt {font-size: 1.6rem; line-height: 3.2rem; margin-bottom: 2.5rem;}
    #s20 .contArea .top .imgArea {margin-bottom: 1.7rem;}
    #s20 .contArea .top .imgArea img {width: 33.2rem;}
    #s20 .contArea .top .txx2 {font-size: 2rem;}
    #s20 .contArea .bottom .call {font-size: 4rem; margin-bottom: 2rem;}
    #s20 .contArea .bottom img {width: 100%;}
}

#s21 {padding-bottom: 30rem;}
#s21 .inner {max-width: 158.8rem; margin-left: auto;}
#s21 .imgArea {}
#s21 .imgArea img {}
#s21 .txtArea {flex: 1; background: #4A443C; display: flex; flex-direction: column; justify-content: center;}
#s21 .txtArea .box {width: 45.2rem; margin-left: 10rem;}
#s21 .txtArea .box img {}

@media screen and (max-width: 880px) {
    #s21 {padding: 0;}
    #s21 .inner {flex-direction: column;}
    #s21 .imgArea {}
    #s21 .imgArea img {}
    #s21 .txtArea {padding: 8.5rem 0;}
    #s21 .txtArea .box {width: 90%; margin: 0 auto;}
    #s21 .txtArea .box img {}
}

#s22 {overflow: hidden;}
#s22 .inner {max-width: 164.6rem; margin-left: auto; padding-top: 26.5rem;}
#s22 .inner .prg {font-size: 2.4rem; color: #FF7D3E; font-weight: 300;}
#s22 .inner .title {padding: 2.8rem 0 5rem; display: flex; gap: 13.6rem; align-items: flex-end;}
#s22 .inner .title .tit {font-size: 6.2rem; font-weight: 500;}
#s22 .inner .title .wrt {font-size: 2rem; font-weight: 300; line-height: 3.2rem; padding-bottom: 3rem;}
#s22 .inner .imgArea {}
#s22 .inner .imgArea .img {}
#s22 .inner .lstArea {}
#s22 .inner .lstArea li {display: flex; align-items: center; padding: 6.4rem 0;}
#s22 .inner .lstArea li + li {border-top: 1px solid #B4A392;}
#s22 .inner .lstArea li .ico {}
#s22 .inner .lstArea li .tit {font-size: 2.8rem; font-weight: 600; color: #4F3333; padding: 0 0 0 4.6rem; width: 36rem}
#s22 .inner .lstArea li .wrt {font-size: 1.8rem; line-height: 2.8rem; color: #222527;}

@media screen and (max-width: 880px) {
    #s22 {}
    #s22 .inner {padding-top: 9.5rem; max-width: 94%;}
    #s22 .inner .prg {font-size: 2rem;}
    #s22 .inner .title {padding: 1.2rem 0 4.8rem; flex-direction: column; align-items: flex-start; gap: 1.2rem;}
    #s22 .inner .title .tit {font-size: 3.6rem}
    #s22 .inner .title .wrt {font-size: 1.6rem; line-height: 2.4rem; padding: 0;}
    #s22 .inner .imgArea {}
    #s22 .inner .imgArea .img {}
    #s22 .inner .lstArea {max-width: 94%;}
    #s22 .inner .lstArea li {flex-wrap: wrap; padding: 3.2rem 0;}
    #s22 .inner .lstArea li + li {}
    #s22 .inner .lstArea li .ico {width: 5.6rem;}
    #s22 .inner .lstArea li .tit {padding: 0; padding-top: 2rem; font-size: 2.4rem; width: 100%}
    #s22 .inner .lstArea li .wrt {width: 100%; font-size: 1.6rem; line-height: 2.4rem; padding-top: 2.4rem;}
}

#s23 {overflow: hidden;}
#s23 .inner {max-width: 130.8rem; margin: 0 auto; padding-top: 23rem;}
#s23 .cont {display: flex; background: #F6F7F9; border-radius: 3rem; overflow: hidden;}
#s23 .cont .imgArea {}
#s23 .cont .imgArea .img {}
#s23 .cont .txtArea {padding: 8rem 6rem 0 8rem; flex-grow: 1;}
#s23 .cont .txtArea .subt {font-size: 2rem; font-weight: 800; color: #FF7D3E;}
#s23 .cont .txtArea .tit {font-size: 3.6rem; font-weight: 600; padding: 2rem 0 4.5rem;}
#s23 .cont .txtArea .lst {}
#s23 .cont .txtArea .lst li {display: flex; align-items: center;}
#s23 .cont .txtArea .lst li + li {padding-top: 2.4rem; margin-top: 2.5rem; border-top: 1px solid #C9CDD2;}
#s23 .cont .txtArea .lst li .num {display: inline-block; color: #FF7D3E; font-size: 1.8rem; font-weight: 600; margin-right: 3.4rem;}
#s23 .cont .txtArea .lst li .lTit {font-size: 1.8rem; font-weight: 600;}
#s23 .cont .txtArea .lst li .lWrt {font-size: 1.8rem; font-weight: 300;}

@media screen and (max-width: 880px) {
    #s23 {}
    #s23 .inner {padding-top: 11rem; padding-bottom: 9rem;}
    #s23 .inner::before {content: ''; display: block; position: absolute; width: 100%; height: 80%; background: #F6F7F9; left: 0; bottom: 0;}
    #s23 .cont {background: transparent; max-width: 88%; margin: 0 auto; flex-direction: column; gap: 4.8rem;}
    #s23 .cont .imgArea {border-radius: 2rem; overflow: hidden;}
    #s23 .cont .imgArea .img {}
    #s23 .cont .txtArea {padding: 0;}
    #s23 .cont .txtArea .subt {font-size: 1.8rem;}
    #s23 .cont .txtArea .tit {font-size: 2.4rem; line-height: 3.2rem; padding: 1.2rem 0 2.4rem;}
    #s23 .cont .txtArea .lst {}
    #s23 .cont .txtArea .lst li {flex-wrap: wrap; gap: 1rem;}
    #s23 .cont .txtArea .lst li + li {}
    #s23 .cont .txtArea .lst li .num {font-size: 1.8rem; margin-right: 0;}
    #s23 .cont .txtArea .lst li .lTit {}
    #s23 .cont .txtArea .lst li .lWrt {font-size: 1.4rem; width: 100%; padding-left: 3rem;}
}

#s24 {overflow: hidden;}
#s24 .inner {padding: 25rem 0 22rem; max-width: 122.5rem; margin: 0 auto;}
#s24 .titArea {margin-bottom: 8rem; text-align: center;}
#s24 .titArea .subt {font-size: 1.4rem; font-weight: 300; color: #FF7D3E; letter-spacing: 0.8rem;}
#s24 .titArea .tit {font-size: 5.6rem; font-weight: 600; padding: 1.6rem 0 2.4rem;}
#s24 .titArea .tit span {color: #FF7D3E}
#s24 .titArea .wrt {font-size: 2rem; line-height: 3.2rem;}
#s24 .lstArea {display: flex; justify-content: space-between;}
#s24 .lstArea .lst {display: flex; flex-direction: column; align-items: center; text-align: center;}
#s24 .lstArea .lst + .lst::before {content: ''; display: block; position: absolute; width: 1px; height: 60%; background: #C9CDD2; left: -10rem; top: 50%; transform: translateY(-50%);}
#s24 .lstArea .lst img {}
#s24 .lstArea .lst .tit {font-size: 3rem; font-weight: 600; padding: 4rem 0 2.4rem; color: #4F3333;}
#s24 .lstArea .lst .wrt {font-size: 1.8rem; font-weight: 300; line-height: 2.8rem;}
#s24 .slideArea {}

@media screen and (max-width: 880px) {
    #s24 {}
    #s24 .inner {padding: 9.5rem 0;}
    #s24 .titArea {margin-bottom: 3.6rem;}
    #s24 .titArea .subt {font-size: 1rem; letter-spacing: 0.5rem;}
    #s24 .titArea .tit {font-size: 3.6rem; padding: 1.8rem 0 2.4rem;}
    #s24 .titArea .wrt {font-size: 1.8rem; line-height: 2.8rem;}
    #s24 .lstArea {display: none;}
    #s24 .slideArea {}
    #s24 .s24_swiper {overflow: hidden;}
    #s24 .s24_swiper .slide {text-align: center; opacity: 0.5}
    #s24 .s24_swiper .slide.swiper-slide-active {opacity: 1;}
    #s24 .s24_swiper .slide img {width: 22.4rem;}
    #s24 .s24_swiper .slide .tit {font-size: 2.2rem; padding: 2.2rem 0 1rem; font-weight: 600; color: #4f3333}
    #s24 .s24_swiper .slide .wrt {font-size: 1.6rem; line-height: 2.4rem;}
}

/* footer */
footer {background: #26282B; height: 15.4rem; padding-top: 3.3rem;}
footer .leftCon {gap: 6.2rem; padding-left: 10rem; box-sizing: border-box;}
footer .leftCon>div {padding-top: 0.4rem;}
footer .leftCon p {margin-bottom: 1.1rem;}
footer .leftCon ul {width: 51rem; line-height: 2.2rem; column-gap: 0.8rem;}
footer .rightCon {padding-right: 13.4rem; box-sizing: border-box;}
footer .rightCon a {display: block; width: 20rem; padding: 0.6rem 0; border-radius: 5rem; background: #454C53; color: #fff;}

@media screen and (max-width: 880px) {
    footer {height: auto; padding: 3.2rem 2.4rem 4.8rem 2.4rem;}
    footer .container {flex-wrap: wrap; gap: 2rem;}
    footer .leftCon {padding-left: 0; gap: 2rem; flex-wrap: wrap;}
    footer .leftCon>div {padding-top: 0;}
    footer .leftCon img {position: relative; left: -1.2rem; width: 16rem;}
    footer .leftCon p {font-size: 1.4rem; margin-bottom: 1.2rem;}
    footer .leftCon ul {width: 100%; flex-wrap: wrap; line-height: 2.8rem; column-gap: 1.4rem;}
    footer .leftCon ul li {font-size: 1.2rem;}
    footer .leftCon ul li:nth-child(3) {width: 100%;}
    footer .rightCon {padding-right: 0;}
    footer .rightCon a {font-size: 1.2rem; width: 12.2rem; padding: 0.4rem 0;}
}

/* sidebar */
.sidebar {position: fixed; top: 50%; transform: translateY(-50%); right: 8rem; display: flex; flex-direction: column; justify-content: center; width: 9.2rem; padding: 4rem 0; border-radius: 4.6rem; background: #fff; gap: 2.6rem; z-index: 99; box-shadow: 0.3rem 0.6rem 1.1rem rgba(0, 0, 0, 0.2);}
.sidebar a {display: block; text-align: center;}
.sidebar a p {margin-top: 1.2rem;}

@media screen and (max-width: 880px) {
    .sidebar {top: auto; bottom: 9rem; right: 2.2rem; width: 4.8rem; padding: 2.5rem 0; gap: 2rem; transform: none;}
    .sidebar a img {width: 2.6rem;}
}