@charset "utf-8";
.fac_sec {
    display: flex;
    margin: 0 0 7%;
    align-items: center;
    border: 1px solid #ddd;
    justify-content: space-between;
    border-radius: 20px;
}
.fac_sec.typeb {margin-bottom:10%}
.fac_sec1 {
    display: flex;
    /* padding: 5% 0; */
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}
.fac_left {width: 43.5%;position: relative;}
.fac_left img {border-radius: 1rem;width: 100%;}
.fac_left .SpecialSwiper .sl_txt{
    position: absolute;
    bottom: 0;
    background-color: rgb(47 105 136 / 80%);
    width: 100%;
    height: 12%;
    color: #fff;
    display: flex;
    justify-content: center;
    font-size: 20px;
    border-radius: 0 0 0 20px;
    align-items: center;
}
.fac_left .SpecialSwiper img{
    width: 100%;
    height: 535px;
    object-fit: cover;
    object-position: center;
    border-radius: 20px 0 0 20px;
    position: relative;
}
.fac_left .swiper-button-next, .fac_left .swiper-button-prev{
    top: unset;
    bottom: 0;
    margin-top: unset;
    margin-bottom: 1.5%;
    z-index: 2;
}
.fac_left .swiper-button-next:after, .fac_left .swiper-button-prev:after {
    font-size: 1.5rem;
    color: #fff;
}

.fac_right {width: 53%;/* border: 1px solid #ddd; */height: 100%;}
.fac_right ul {
    border-top: 2px solid var(--color-main);
    padding: 2rem 0 0;
}
.fac_right ul li {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin: .8rem 0;
}
.fac_right ul li span {
    width: 20%;
    color: var(--color-main);
    font-weight: 500;
    background-color: #fff;
    border-radius: 1rem;
    text-align: center;
    border: 1px solid var(--color-main);
}
.fac_right ul li > div {width:75%}
.fac_right ul li p {
    line-height: 1.6;
}
.fac_sec2 {
    padding-top: 5%;
}
.fac_sec3 {margin: 5% auto 10%;position: relative;}
.fac_sec2 > ul {
    display: flex;
    flex-wrap: wrap;
    border: 1px solid #ddd;
    border-top: 2px solid var(--color-main);
}
.fac_sec2 > ul > li {width:50%;padding: 2rem;display: flex;flex-direction: column;border-right: 1px solid #ddd;border-bottom: 1px solid #ddd;}
.fac_sec2 > ul > li:first-child, .fac_sec2 > ul > li:nth-child(2) {width:25%}
.fac_sec2 > ul > li:last-child {border:unset}
.fac_sec2 > ul > li:nth-child(3) {border-right:unset}
.fac_sec2 > ul > li:nth-child(4) {border-bottom:0}
.floor_num {
    display: flex;
    justify-content: space-between;
    padding-bottom: 1rem;
    align-items: center;
}
.floor_num strong {
    font-size: 40px;
    text-transform: uppercase;
    font-weight: 700;
    /* float: right; */
    /* display: inline-block; */
}
.floor_num p {
    padding: .5rem 1.5rem;
    background-color: var(--color-main);
    border-radius: 2rem;
    color: #fff;
    font-weight: 500;
}
.floor_num.b1, .floor_num.f1 {
    display: flex;
    justify-content: flex-end;
}
.floor_num.f3 p {background-color: #2173D1;}
.floor_num.f4 p {background-color: #F66300;}
.floor_txt {
    display: flex;
}
.floor_txt ul {
    display: flex;
    width: 50%;
    flex-direction: column;
    list-style-type: auto;
}
.floor_txt ul li {
    padding-left: .5rem;
}
.floor_txt ul li::marker {
    color: #9f9f9f;
    content: "-";
}
.fac_sec2 > ul li:first-child .floor_txt ul, .fac_sec2 > ul li:nth-child(2) .floor_txt ul {width:100%}


.SpecialSwiper {
    position: relative;
    overflow:hidden;
    height:0;
}

.SpecialSwiper.on {
	overflow:unset;
    height:auto;
	}
.imgSwiper {
    /* position: relative; */
    overflow: hidden;
}
.imgSwiper ul {
    /* overflow: hidden; */
    position: relative;
}
.imgSwiper ul li img {width:100%;height: 250px;object-fit: cover;object-position: center;border-radius: 10px 10px 0 0;}
.imgSwiper ul li p {text-align:center;padding: 1rem;border: 1px solid #ddd;border-radius: 0 0 10px 10px;}
.imgSwiper .slide-control {}
.imgSwiper .slide-control .swiper-scrollbar {position: absolute;top: unset;bottom: 0;transform: translateY(40px);}
.imgSwiper .slide-control .swiper-scrollbar .swiper-scrollbar-drag {
    background-color: #bad599;
}
.imgSwiper .slide-control .leaf {position: absolute;width: 100%;height: 100%;top: 0;}
.imgSwiper .slide-control .leaf i {
    font-size: 30px;
}
.imgSwiper .slide-control .leaf .img-prev {position: absolute;left: 0;top: 50%;transform: translate(-40px, -50%);}
.imgSwiper .slide-control .leaf .img-next {position: absolute;left: unset;right: 0;top: 50%;transform: translate(40px, -50%);}

/* PC */ 
@media only screen and (min-width:1280px) and (max-width: 1600px)  {
    .fac_sec1 {
    display: flex;
    align-items: flex-end;
}
    .fac_left {width: 47%;}
    .fac_left .SpecialSwiper img {
    height: 450px;
}
    .fac_right {
    width: 50%;
}
    .fac_right ul {
    padding: 1rem 0 0;
}
    .fac_tab li a {padding: 1.1rem 0;}
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1024px)*/ 
@media all and (max-width:1024px) {
    .fac_sec {
    flex-wrap: wrap;
}
    .fac_left {
    width: 100%;
}
    .fac_left .SpecialSwiper img {
    height: 400px;
    border-radius: 20px 20px 0 0;
}
    .fac_left .SpecialSwiper .sl_txt {border-radius: 0;height: 16%;}
    .fac_right {
    width: 100%;
    padding-top: 2rem;
}
    .fac_right ul {
    padding: 1rem 0 0;
}
    .fac_sec2 > ul > li {width:100%;border-right: unset;}
    .fac_sec2 > ul > li:first-child, .fac_sec2 > ul > li:nth-child(2) {width:50%}
    .fac_sec2 > ul > li:first-child {border-right:1px solid #ddd}
    .fac_sec2 > ul > li:nth-child(3), .fac_sec2 > ul > li:nth-child(4) {border-bottom: 1px solid #ddd;}
    .imgSwiper, .imgSwiper .slide-control .leaf {width:95%;margin: 0 auto;z-index: 1;}
    .imgSwiper .slide-control .leaf .img-prev {}
    .imgSwiper .slide-control .leaf .img-next {}
    .imgSwiper .slide-control .leaf i {font-size:40px}
}

/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/ 
@media all and (max-width:767px) {
    .fac_sec2 {margin:3rem auto}
    .fac_right ul li span {width:25%; margin-right:.5rem; font-size:4.5vw}
    .fac_right ul li p {font-size:4.5vw}
    .fac_sec2 > ul > li {padding: 1rem 1.5rem;}
    .fac_sec2 > ul > li:first-child, .fac_sec2 > ul > li:nth-child(2) {width:100%}
    .fac_sec2 > ul > li:first-child {border-right:unset}
    .floor_num.b1, .floor_num.f1 {padding:0}
    .floor_num strong {font-size:7vw}
    .floor_num p {font-size:4.5vw;}
    .floor_txt {flex-wrap: wrap;}
    .floor_txt ul {width:100%}
    .floor_txt ul li {font-size:4.5vw;}
    .fac_sec3 {margin-bottom:5rem}
    .imgSwiper, .imgSwiper .slide-control .leaf {width:100%;}
    .imgSwiper .slide-control .leaf button {color:#fff}
    .imgSwiper .slide-control .leaf .img-prev {transform: translate(-0px, -50%);}
    .imgSwiper .slide-control .leaf .img-next {transform: translate(0px, -50%);}
}