@charset "utf-8";

/* Etc */
.tof{overflow: hidden !important;text-overflow: ellipsis !important;white-space: nowrap !important;}
.ltof2{display: -webkit-box !important;-webkit-box-orient: vertical !important;-webkit-line-clamp: 2 !important;overflow: hidden !important;text-overflow: ellipsis !important;white-space: normal !important;}
.ltof3{display: -webkit-box !important;-webkit-box-orient: vertical !important;-webkit-line-clamp: 3 !important;overflow: hidden !important;text-overflow: ellipsis !important;white-space: normal !important;}
.ltof4{display: -webkit-box !important;-webkit-box-orient: vertical !important;-webkit-line-clamp: 4 !important;overflow: hidden !important;text-overflow: ellipsis !important;white-space: normal !important;}
.ltof5{display: -webkit-box !important;-webkit-box-orient: vertical !important;-webkit-line-clamp: 5 !important;overflow: hidden !important;text-overflow: ellipsis !important;white-space: normal !important;}
.ltof6{display: -webkit-box !important;-webkit-box-orient: vertical !important;-webkit-line-clamp: 6 !important;overflow: hidden !important;text-overflow: ellipsis !important;white-space: normal !important;}
.ltof7{display: -webkit-box !important;-webkit-box-orient: vertical !important;-webkit-line-clamp: 7 !important;overflow: hidden !important;text-overflow: ellipsis !important;white-space: normal !important;}
.ltof8{display: -webkit-box !important;-webkit-box-orient: vertical !important;-webkit-line-clamp: 8 !important;overflow: hidden !important;text-overflow: ellipsis !important;white-space: normal !important;}
.ltof9{display: -webkit-box !important;-webkit-box-orient: vertical !important;-webkit-line-clamp: 9 !important;overflow: hidden !important;text-overflow: ellipsis !important;white-space: normal !important;}
.ltof10{display: -webkit-box !important;-webkit-box-orient: vertical!important;-webkit-line-clamp: 10 !important;overflow: hidden !important;text-overflow: ellipsis !important;white-space: normal !important;}
/* Etc */

#wrap {overflow: hidden;}

#slide-menu {display: none;}
#slide-menu.on {display: block;}

#branch {position: relative;left: 50%;width: 100vw;margin-left: -50vw;}
#branch > .info {max-width: 1200px;margin: 100px auto 150px;display: flex;align-items: center;justify-content: space-between;flex-direction: row-reverse;}
#branch > .info > dt img {display: block;}
#branch > .info > dd {margin-right: -100px;display: flex;flex-direction: column;align-items: start;gap: 40px;position: relative;z-index: 2;}
#branch > .info > dd span {font-family: inherit;font-size: inherit;color: inherit;font-weight: inherit;letter-spacing: inherit;line-height: inherit;}
#branch > .info > dd > h2 {font-size: 26px;color: #222;font-weight: 700;line-height: 1.5;letter-spacing: -1px;}
#branch > .info > dd > p {font-size: 20px;color: #444;line-height: 1.7;letter-spacing: -1px;}
#branch > .info > dd > p + p {margin-top: -15px;}
#branch > .info > dd > .name {position: relative;display: inline-flex;flex-direction: column;gap: 5px;z-index: 0;}
#branch > .info > dd > .name > p {font-size: 22px;color: #222;letter-spacing: -1px;line-height: 1.6;}
#branch > .info > dd > .name > p > strong {font-family: inherit;font-size: inherit;color: inherit;font-weight: 700;letter-spacing: 2px;line-height: inherit;}
#branch > .info > dd > .name > img {position: absolute;bottom: 0;left: 100%;transform: translateX(10%);z-index: -1;}
/* #branch > .info > dd > .name > img {position: absolute;top: 5px;left: 90%;z-index: -1;} */

#branch .stitle {margin-bottom: 60px;display: flex;justify-content: center;align-items: center;flex-direction: column;gap: 25px;}
#branch .stitle span {font-family: inherit;font-size: inherit;color: inherit;font-weight: inherit;letter-spacing: inherit;line-height: inherit;}
#branch .stitle > * {text-align: center;}
#branch .stitle > .mark {border-radius: 5px;border: 2px solid #1d89cb;padding: 0 20px;font-size: 18px;line-height: 34px;text-align: center;color: #1d89cb;font-weight: 300;}
#branch .stitle > h2 {font-size: 50px;color: #222;font-weight: 600;font-family: 'SCore Dream';}

#branch .loca {background: #f8f8fa;padding: 150px 0;}
#branch .loca .inner {max-width: 1200px;margin: 0 auto;}

#branch .map_inf {display: flex;justify-content: space-between;gap: 20px;}
#branch .map_inf > dt { width: 58.5%; box-sizing: border-box; border-radius: 30px;overflow: hidden;}
#branch .map_inf > dt img {display: block;}
#branch .map_inf > dt #map { height: 600px; }
#branch .map_inf > dt .root_daum_roughmap { height: 100%; }
#branch .map_inf > dt .root_daum_roughmap .wrap_map { height: 100%; }
#branch .map_inf > dd {width: 41.5%; background: #fff;padding: 40px;border-radius: 30px;overflow: hidden;flex: 1;display: inline-flex;flex-direction: column;justify-content: center;align-items: start;box-sizing: border-box;}
#branch .map_inf > dd > strong {margin-bottom: 20px;display: block;font-size: 34px;color: #222;font-weight: 600;font-family: 'SCore Dream';}
#branch .map_inf .desc > li + li {margin-top: 10px;}
#branch .map_inf .desc > li {position: relative;padding-left: 120px;}
#branch .map_inf .desc > li:before {display: block;content: '';font-family: 'axicon';font-size: 22px;color: #222;position: absolute;top: 0;left: 0;line-height: 30px;opacity: 0.6;}
#branch .map_inf .desc > li > em {position: absolute;left: 30px;top: 0;font-style: normal;font-size: 20px;color: #222;font-weight: 700;line-height: 35px;}
#branch .map_inf .desc > li > p {font-size: 20px;color: #555;letter-spacing: -0.5px;line-height: 35px;}
#branch .map_inf .desc > li > p span {font-family: inherit;font-size: inherit;color: inherit;font-weight: inherit;letter-spacing: inherit;line-height: inherit;}
#branch .map_inf .desc > li > p .fwb {margin-right: 15px;font-weight: 300 !important;}
#branch .map_inf .desc > li.add:before {content: '\e7cf';}
#branch .map_inf .desc > li.tel:before {content: '\e77d';}
#branch .map_inf .desc > li.time:before {content: '\e8ea';}
#branch .map_inf .parking {margin: 40px 0;background: #f8f8fa;text-align: center;padding: 5px 15px;width: 100%;border-radius: 56px;min-height: 56px;box-sizing: border-box;align-content: center;font-size: 19px;font-size: 23px;color: #222;line-height: 1.2;}
#branch .map_inf .parking:before {margin-right: 5px;display: inline-block;vertical-align: middle;content: '';background: url('../images/sub/branch/icon-p.jpg');width: 23px;height: 23px;transform: translateY(-2px);}
#branch .map_inf .parking span {font-family: inherit;font-size: inherit;color: inherit;font-weight: inherit;letter-spacing: inherit;line-height: inherit;}
#branch .map_inf .btns {display: flex;justify-content: space-between;gap: 9px;}
#branch .map_inf .btns > li {flex: 1;}
#branch .map_inf .btns > li > a {display: block;}
#branch .map_inf .btns > li > a img {display: block;margin: 0 auto;max-width: 100%;}

#branch .btn_wrap {display: flex;justify-content: center;align-items: center;flex-wrap: wrap;gap: 10px;margin-top: 45px;}
#branch .btn_wrap > a {display: inline-flex;align-items: center;justify-content: center;gap: 10px;min-width: 280px;padding: 0 35px;height: 70px;border-radius: 70px;text-align: center;align-content: center;border: none !important;font-size: 22px;letter-spacing: -1px;text-decoration: none !important;line-height: 1.2;overflow: hidden;color: #fff;box-sizing: border-box;}
#branch .btn_wrap > a.tel {background: #1d89cb;}
#branch .btn_wrap > a.tel:before {display: block;content: '\e951';font-family: 'axicon';font-size: 26px;color: #fff;}
#branch .btn_wrap > a.reservation {background: #004e90;}
#branch .btn_wrap > a.reservation:before {display: block;content: '\f073';font-family: 'axicon';font-size: 21px;color: #fff;}
#branch .btn1 {background: #1d89cb;min-width: 280px;padding: 0 35px;height: 70px;border-radius: 70px;text-align: center;align-content: center;border: none !important;font-size: 22px;letter-spacing: -1px;text-decoration: none !important;line-height: 1.2;overflow: hidden;}
#branch .btn2 {background: #fff;min-width: 280px;padding: 0 35px;height: 70px;border-radius: 70px;text-align: center;align-content: center;border: 2px solid #1d89cb !important;font-size: 22px;color: #1d89cb !important;letter-spacing: -1px;text-decoration: none !important;line-height: 1.2;overflow: hidden;}
#branch .btn1:has(i),
#branch .btn2:has(i) {padding-right: 30px;}

#branch .review {max-width: 1200px;margin: 150px auto;}
#branch .review .list {display: flex;flex-wrap: wrap;gap: 30px}
#branch .review .list > li {width: calc(100%/3 - 60px/3);box-sizing: border-box;border: 1px solid #ddd;border-radius: 15px;overflow: hidden;position: relative;}
#branch .review .list > li > .link {position: absolute;z-index: 11;inset: 0;}
#branch .review .list > li > .tmb {overflow: hidden;position: relative;padding-bottom: 71.05%;}
#branch .review .list > li > .tmb img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;}
#branch .review .list > li > .inf {padding: 25px 28px 40px;}
#branch .review .list > li > .inf > strong {display: block;font-size: 25px;color: #222;font-weight: 600;font-family: 'SCore Dream';line-height: 38px;height: 76px;}
#branch .review .list > li > .inf > p {margin-top: 20px;font-size: 18px;line-height: 27px;}
#branch .review .list > li > .inf > .date {display: block;margin-top: 20px;font-size: 17px;line-height: 1;}

#branch .review .roll {margin: -15px;}
#branch .review .item {margin: 15px;box-sizing: border-box;border: 1px solid #ddd;border-radius: 15px;overflow: hidden;position: relative;}
#branch .review .item > .link {position: absolute;z-index: 11;inset: 0;}
#branch .review .item > .tmb {overflow: hidden;position: relative;padding-bottom: 71.05%;}
#branch .review .item > .tmb img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;}
#branch .review .item > .inf {padding: 25px 28px 40px;}
#branch .review .item > .inf > strong {display: block;font-size: 25px;color: #222;font-weight: 600;font-family: 'SCore Dream';line-height: 38px;height: 76px;}
#branch .review .item > .inf > p {margin-top: 20px;font-size: 18px;line-height: 27px;}
#branch .review .item > .inf > .date {display: block;margin-top: 20px;font-size: 17px;line-height: 1;}
#branch .review .slick-dots{margin-top: 40px;text-align: center;}
#branch .review .slick-dots li{display: inline-block;margin: 0 5px;}
#branch .review .slick-dots li button{display: block;width: 10px;height: 10px; background: #afb3b5; text-indent: -999em;overflow: hidden;border: none; border-radius: 50%;}
#branch .review .slick-dots li.slick-active button{width: 30px; background: #1d89cb; border-radius: 5px;}
#branch .item img {user-drag: none;user-select: none;-webkit-user-drag: none;-webkit-user-select: none;}

#branch .care {padding: 150px 0;background: url('../images/sub/branch/bg1.jpg') no-repeat center center;background-size: cover;}
#branch .care .inner {max-width: 1200px;margin: 0 auto;}
#branch .care .boxs {display: flex;justify-content: space-between;gap: 20px;}
#branch .care .boxs > li {background: #fff;padding: 45px;border-radius: 20px;box-shadow: 0 0 10px rgba(0,0,0,0.08);flex: 1;display: inline-flex;flex-direction: column;align-items: start;gap: 25px;}
#branch .care .boxs > li > .ico img {display: block;}
#branch .care .boxs > li > * {letter-spacing: -1px;}
#branch .care .boxs > li > strong {font-size: 30px;color: #222;font-weight: 600;font-family: 'SCore Dream';}
#branch .care .boxs > li > p {font-size: 20px;line-height: 34px;color: #555;}
#branch .care .boxs > li > a {font-size: 17px;color: #1d89cb;}

#branch .care .roll {margin: -10px;}
#branch .care .item {margin: 10px;background: #fff;padding: 45px;border-radius: 20px;box-shadow: 0 0 10px rgba(0,0,0,0.08);flex: 1;display: inline-flex;flex-direction: column;align-items: start;gap: 25px;}
#branch .care .item > .ico img {display: block;}
#branch .care .item > * {letter-spacing: -1px;}
#branch .care .item > strong {font-size: 30px;color: #222;font-weight: 600;font-family: 'SCore Dream';}
#branch .care .item > p {font-size: 20px;line-height: 34px;color: #555;}
#branch .care .item > a {font-size: 17px;color: #1d89cb;}
#branch .care .slick-dots{margin-top: 40px;text-align: center;}
#branch .care .slick-dots li{display: inline-block;margin: 0 5px;}
#branch .care .slick-dots li button{display: block;width: 10px;height: 10px; background: #afb3b5; text-indent: -999em;overflow: hidden;border: none; border-radius: 50%;}
#branch .care .slick-dots li.slick-active button{width: 30px; background: #1d89cb; border-radius: 5px;}

#branch .brand {max-width: 1200px;margin: 150px auto;}
#branch .brand .box_list > li + li {margin-top: 30px;}
#branch .brand .box_list > li {background: #f8f8fa;border-radius: 30px;padding: 30px;display: flex;justify-content: space-between;align-items: center;}
#branch .brand .box_list > li > .img img {display: block;}
#branch .brand .box_list > li > .inf {flex: 1;display: inline-flex;flex-direction: column;align-items: center;gap: 20px;}
#branch .brand .box_list > li > .inf > * {text-align: center;}
#branch .brand .box_list > li > .inf > strong {font-size: 42px;color: #222;font-weight: 600;font-family: 'SCore Dream';}
#branch .brand .box_list > li > .inf > p {font-size: 22px;color: #222;}
#branch .brand .box_list > li > .inf > .btn2 {margin-top: 20px;min-width: 185px;height: 56px;border-radius: 56px;font-size: 17px;font-weight: 300;background: none;}
#branch .brand .box_list > li:nth-child(even) {flex-direction: row-reverse;}

#branch .banner_bot {background: url('../images/sub/branch/bg2.jpg');height: 570px;display: flex;justify-content: center;align-items: center;flex-direction: column;}
#branch .banner_bot > .inner {width: 1200px;margin: 0 auto;}
#branch .banner_bot > .inner > .stitle {margin-bottom: 40px;}
#branch .banner_bot > .inner > .stitle .col {color: #00a7fe !important;}
#branch .banner_bot > .inner > .btn_wrap {margin: 0;}
#branch .banner_bot > .inner > .memo {margin-top: 65px;background: #fff;width: 100%;min-height: 80px;align-content: center;border-radius: 80px;overflow: hidden;box-shadow: 0 0 10px rgba(0,0,0,0.08);}
#branch .banner_bot > .inner > .memo > dl {display: flex;justify-content: center;align-items: center;flex-wrap: wrap;}
#branch .banner_bot > .inner > .memo > dl:before {display: block;content: '\e8ea';font-size: 25px;color: #222;font-family: 'axicon';margin-right: 5px;}
#branch .banner_bot > .inner > .memo > dl > dt {margin-right: 25px;padding-right: 25px;line-height: 20px;border-right: 1px solid #ddd;font-size: 20px;color: #222;font-weight: 700;transform: translateY(-1px);}
#branch .banner_bot > .inner > .memo > dl > dd {display: inline-flex;justify-content: center;align-items: center;font-size: 19px;line-height: 1.6;color: #555;}
#branch .banner_bot > .inner > .memo > dl > dd > hr {border: none;width: 30px;display: inline-block;vertical-align: middle;padding: 0;margin: 0;}
#branch .banner_bot > .inner > .memo > dl > dd .col {background: #e8f3fa;padding: 0 25px;font-size: 17px;color: #1d89cb;height: 35px;border-radius: 35px;align-content: center;}




@media screen and (max-width: 1200px){

    #branch {position: static;left: auto;width: auto;margin-left: 0;}
    #branch > .info {margin: 12vw 10px;flex-direction: column;}
    #branch > .info > dt img {max-width: 70%;margin-left: auto;margin-right: auto;}
    #branch > .info > dd {margin-right: 0;margin-top: 20px;gap: 20px;}
    #branch > .info > dd > p + p {margin-top: -7px;}
    #branch > .info > dd > .name {gap: 3px;}
    #branch > .info > dd > .name > img {top: 15px;left: 80%;max-width: 150px;max-height: 80px;object-fit: contain;transform: translateX(20%);}

    #branch .stitle {margin-bottom: 20px;gap: 15px;}
    #branch .stitle > .mark {border-radius: 3px;}
    #branch .stitle > h2 {font-size: 22px;font-size: 27px;}

    #branch .loca {padding: 12vw 10px;}

    #branch .map_inf {flex-direction: column;gap: 10px;align-items: center;}
    #branch .map_inf > dt { width: 100%; border-radius: 10px; }
    #branch .map_inf > dt #map { height: 350px; }
    #branch .map_inf > dt .root_daum_roughmap .wrap_map { height: 350px; }
    #branch .map_inf > dd {width: 100%;padding: 20px;border-radius: 10px;}
    #branch .map_inf > dd > strong {margin-bottom: 10px;font-size: 20px;font-size: 25px;line-height: 1.4;text-align: center;width: 100%;}
    #branch .map_inf .desc > li + li {margin-top: 5px;}
    #branch .map_inf .desc > li {padding-left: 80px;padding-left: 85px;}
    #branch .map_inf .desc > li:before {display: none;}
    #branch .map_inf .desc > li > em {left: 0;font-size: 19px;line-height: 27px;}
    #branch .map_inf .desc > li > p {font-size: 18px;line-height: 27px;}
    #branch .map_inf .desc > li > p .fwb {margin-right: 5px;}
    #branch .map_inf .btns {gap: 4px;}

    #branch .btn_wrap {gap: 4px;margin-top: 20px;}
    #branch .btn_wrap > a {min-width: auto;padding: 0 20px;height: 40px;border-radius: 5px;font-size: 17px;font-size: 20px;gap: 8px;}
    #branch .btn_wrap > a.tel:before {font-size: 18px;}
    #branch .btn_wrap > a.reservation:before {font-size: 15px;}
    #branch .btn1 {min-width: auto;padding: 0 20px;height: 40px;border-radius: 5px;font-size: 17px;}
    #branch .btn2 {min-width: auto;padding: 0 20px;height: 40px;border-radius: 5px;font-size: 17px;}
    #branch .btn1:has(i),
    #branch .btn2:has(i) {padding-right: 15px;}

    #branch .review {margin: 12vw 10px;}
    #branch .review .list {gap: 10px;flex-wrap: nowrap;overflow: hidden;overflow-x: scroll;}
    #branch .review .list > li {width: 100%;border-radius: 5px;flex: 0 0 70vw;width: auto;}
    #branch .review .list > li > .inf {padding: 15px;}
    #branch .review .list > li > .inf > strong {font-size: 23px;line-height: 1.4em;height: 2.8em;}
    #branch .review .list > li > .inf > p {margin-top: 10px;font-size: 20px;line-height: 1.4;}
    #branch .review .list > li > .inf > .date {margin-top: 10px;font-size: 19px;}

    #branch .review .roll {margin: -5px;}
    #branch .review .slick-list {margin-right: -50vw;}
    #branch .review .item {margin: 5px;border-radius: 5px;}
    #branch .review .item > .inf {padding: 15px;}
    #branch .review .item > .inf > strong {font-size: 23px;line-height: 1.4em;height: 2.8em;}
    #branch .review .item > .inf > p {margin-top: 10px;font-size: 20px;line-height: 1.4;}
    #branch .review .item > .inf > .date {margin-top: 10px;font-size: 19px;}
    #branch .review .slick-dots{margin: 15px 0 30px;}
    #branch .review .slick-dots li{margin: 0 2px;}
    #branch .review .slick-dots li button{width: 12px;height: 12px;}

    #branch .care {padding: 12vw 10px;}
    #branch .care .boxs {flex-wrap: wrap;justify-content: start;gap: 10px;flex-wrap: wrap;flex-wrap: nowrap;overflow: hidden;overflow-x: scroll;}
    #branch .care .boxs > li {width: calc(50% - 5px);width: 100%;border-radius: 5px;padding: 30px 15px;box-shadow: 0 0 10px rgba(0,0,0,0.08);gap: 15px;flex: inherit;box-sizing: border-box;align-items: center;flex: 0 0 70vw;width: auto;}
    #branch .care .boxs > li > *{text-align: center;}
    #branch .care .boxs > li > .ico img {height: 75px;}
    #branch .care .boxs > li > strong {font-size: 23px;line-height: 1.4;}
    #branch .care .boxs > li > p {font-size: 21px;line-height: 1.4;}
    #branch .care .boxs > li > a {font-size: 22px;}

    #branch .care .roll {margin: -5px;}
    #branch .care .slick-list {margin-right: -50vw;}
    #branch .care .item {margin: 5px;border-radius: 5px;padding: 30px 15px;box-shadow: 0 0 10px rgba(0,0,0,0.08);gap: 15px;flex: inherit;box-sizing: border-box;align-items: center;}
    #branch .care .item > *{text-align: center;}
    #branch .care .item > .ico img {height: 75px;}
    #branch .care .item > strong {font-size: 23px;line-height: 1.4;}
    #branch .care .item > p {font-size: 21px;line-height: 1.4;}
    #branch .care .item > a {font-size: 22px;}
    #branch .care .slick-dots{margin: 15px 0 30px;}
    #branch .care .slick-dots li{margin: 0 2px;}
    #branch .care .slick-dots li button{width: 12px;height: 12px;}

    #branch .brand {margin: 12vw 10px;}
    #branch .brand .box_list > li + li {margin-top: 20px;}
    #branch .brand .box_list > li {border-radius: 10px;padding: 10px;flex-direction: column;}
    #branch .brand .box_list > li > .img,
    #branch .brand .box_list > li > .img img {width: 100%;}
    #branch .brand .box_list > li > .inf {flex: 1;gap: 10px;padding: 15px;}
    #branch .brand .box_list > li > .inf > strong {font-size: 26px;}
    #branch .brand .box_list > li > .inf > p {font-size: 20px;}
    #branch .brand .box_list > li > .inf > .btn2 {margin-top: 10px;min-width: auto;height: 40px;border-radius: 5px;font-size: 20px;}
    #branch .brand .box_list > li:nth-child(even) {flex-direction: column;}

    #branch .banner_bot {height: auto;padding: 12vw 20px;background-image: url('../images/sub/branch/bg2-mo.jpg');background-color: #cae1f5;}
    #branch .banner_bot > .inner {width: 100%;}
    #branch .banner_bot > .inner > .stitle {margin-bottom: 20px;}
    #branch .banner_bot > .inner > .memo {margin-top: 25px;min-height: 40px;border-radius: 10px;box-shadow: 0 0 10px rgba(0,0,0,0.08);padding: 10px;box-sizing: border-box;}
    #branch .banner_bot > .inner > .memo > dl {margin: 10px;flex-direction: column;}
    #branch .banner_bot > .inner > .memo > dl:before {display: none;}
    #branch .banner_bot > .inner > .memo > dl > dt {margin-right: 0;padding-right: 0;line-height: 1.4;border-right: 0;font-size: 20px;text-align: center;margin-bottom: 10px;}
    #branch .banner_bot > .inner > .memo > dl > dd {font-size: 20px;line-height: 1.4;flex-direction: column;}
    #branch .banner_bot > .inner > .memo > dl > dd > hr {width: 0;height: 5px;}
    #branch .banner_bot > .inner > .memo > dl > dd .col {padding: 5px 10px;font-size: 19px;height: auto;border-radius: 5px;margin-top: 5px;}
}