#cursor {position: fixed;z-index: 99888;left: 0;top: 0;pointer-events: none;will-change: transform;}
  
@media (hover: hover) and (pointer: fine) {
    .cursor__circle {width: 8px;height: 8px;margin-top: -50%; mix-blend-mode: normal; background-color: var(--pointcolor);  margin-left: -50%;border-radius: 50%;/* border: solid 1px rgba(227, 222, 193, 0.4); */transition: opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1),background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1),border-color 0.3s cubic-bezier(0.25, 1, 0.5, 1),width 0.3s cubic-bezier(0.25, 1, 0.5, 1),height 0.3s cubic-bezier(0.25, 1, 0.5, 1);}

    #cursor.click .cursor__circle{width: 74px;height: 74px;background-color: #041c26;border-color: #041c26;}
    #cursor.drag {mix-blend-mode: normal;}
    #cursor.overlay {mix-blend-mode:difference;}
    #cursor.overlay .cursor__circle{width: 48px;height: 48px;background-color: rgba(13, 15, 45, 0.5);border-color: transparent;}

}
/* 커서 없는 모바일 기기에서 숨기기 */
@media (pointer:coarse) {
    #cursor {display: none;}
}

:root{--ani:cubic-bezier(.32,.94,.6,1)}

.main .ygap3 {--y-gap:3rem;}


.main .Tit {font-size: 2.5rem; font-weight: 300; font-family: var(--koSerif); line-height: 1.5;}
.main .sm_Tit {font-weight: 500; letter-spacing: .3rem;}
.main .en_Tit {font-weight: 400; font-size: 5rem; font-family: var(--pointfont); line-height: 1.2;}
.main .en_Tit span {color:var(--pointcolor)}


.main .RoundBox {border-radius: 16px; background-color: var(--pointcolor); color:#fff; font-family: var(--pointfont); display: block; width: fit-content; padding: .3rem 1.4rem; font-size: 1rem; letter-spacing: 1px;}
.main .RoundBox.Wh {background-color: #fff; color:var(--pointcolor)}

@media(max-width:768px) {
    .main .en_Tit {font-size: 3.86rem;}
    .main .RoundBox {font-size: 1.3rem;}
    .main.font-20 {font-size: 1.6rem;}
    .main .font-16 {font-size: 1.4rem;}
    .main .font-14 {font-size: 1.2rem;}
}

.olaBtn {padding: .5rem 1.5rem; border:1px solid var(--pointcolor); display: flex; gap:0 .5rem; letter-spacing: 0; align-items: center; border-radius: 0 .9375rem 0 .9375rem; font-size: 16px; font-family: var(--pointfont); position: relative; white-space: nowrap;  background-color:transparent; color: transparent; width: fit-content; transition-property: all; transition-duration: 0.6s; z-index: 9; overflow: hidden; text-shadow: -50px 0 0 transparent, 0 0 0 var(--pointcolor); transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);}
.olaBtn:before {width: 100%; height: 100%; top: 0; left: 0; background-color: var(--pointcolor); transform: translate(-101%, 0); content: ''; position: absolute; z-index: -3; transition-property: inherit; transition-duration: inherit; transition-timing-function: inherit;}
.olaBtn:hover {text-shadow: 0 0 0 #fff, 50px 0 0 transparent;}
.olaBtn:hover:before {transform: translate(0, 0);}

.main .zum {position: relative; padding-left: 1rem;}
.main .zum:after {content:''; width: .5rem; height: .5rem; border-radius: 50%; background-color: var(--pointcolor); position: absolute; left: 0; top:.625rem;}

.main .swiper-button-next:after, .main .swiper-button-prev:after {display: none;}
.main .swiper-button-next, .main .swiper-button-prev {left: 0; right:0; top:0; width: 100%; margin-top: 0; height: auto; position: relative;}

/* mainSlide */
#mainSlide {overflow:hidden;position:relative;width:100%;/* aspect-ratio: 16/8;  */ height: 100vh !important; padding: 0; transition:transform .6s var(--ani)}

#mainSlide .mainSwiper {opacity:1;transform:scale(1.05); width:100%;height:100%; transition:all 2s var(--ani)}
#mainSlide .mainSwiper.on {opacity:1;transform:scale(1)}
#mainSlide .mainSwiper .swiper-slide {height:100%;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:transform .3s}
#mainSlide .mainSwiper .swiper-slide-active {transform:skew(0)}
#mainSlide .bg {position:absolute;left:0;top:0;width:100%;height:100%;background: 40% no-repeat;background-size:cover}
#mainSlide .bg.bg-1 {background-image:url('/img/main/mainSlide01.jpg')}
#mainSlide .bg.bg-2 {background-image:url('/img/main/mainSlide02.jpg')}
#mainSlide .bg.bg-3 {background-image:url('/img/main/mainSlide03.jpg')}
#mainSlide .bg.bg-4 {background-image:url('/img/main/mainSlide04.jpg')}
#mainSlide .bg.bg-5 {background-image:url('/img/main/mainSlide05.jpg')}
#mainSlide .bg.bg-6 {background-image:url('/img/main/mainSlide06.jpg')}

#mainSlide .TxtBox {position: absolute;top:50%;left:50%;transform: translate(0,-50%); max-width:1410px; width: 50%; font-weight: 300;}
#mainSlide .TxtBox.Left {left: 15%;}

#mainSlide .Tit_Lg {font-family: var(--koSerif); font-size: 3.125rem;}
#mainSlide .Tit_Lg span {color:#003926; font-weight: 400;}
#mainSlide .Tit_Lg span.Pp {color:#6c82e7;}

#mainSlide .swiper-slide-active .Tit_Lg {animation: slideUp 2.5s .1s forwards;}
#mainSlide .swiper-slide-active .Tit_Sm {animation: slideDown 3s .1s forwards;}
  
@keyframes slideUp {
    from {transform: translateY(20px);}
    to {opacity: 1; transform: none;}
}

@keyframes slideDown {
    from {transform: translateY(-10px);}
    to {opacity: 1; transform: none;}
}


#mainSlide .swiper-pagination {width: auto; top:45%; transform: translateY(-50%); left: 5rem; bottom:auto; right:auto; position: absolute;}
#mainSlide .swiper-pagination-current {font-size: 2.5rem;}
#mainSlide .swiper-pagination-total {opacity: .5; position: absolute; top:50px;}
#mainSlide span.Line {transform: rotate(45deg); display: inline-block; width: 1px; height: 47px; background-color: #fff; opacity: .5; margin: 0px 10px -35px 0px;}
#mainSlide a {color:#fff;}

#mainSlide .main_thumb {position: absolute;bottom:20px; left:3rem;max-width: 285px; height: 100px;}
#mainSlide .main_thumb .swiper-slide{cursor:pointer;filter: grayscale(100%);width:60px;}
#mainSlide .main_thumb .swiper-slide .bg{width:60px;height: 80px;background-position: left center;background-size: cover;border-radius: 8px;overflow: hidden}
#mainSlide .main_thumb .swiper-slide.swiper-slide-active {filter:none;width:140px}
#mainSlide .main_thumb .swiper-slide.swiper-slide-active .bg{width:140px;}
#mainSlide .main_thumb .bg{width:60px;height: 80px;background-position: right center;background-size: cover;border-radius: 8px;overflow: hidden}

@media(max-width:768px){
    #mainSlide .TxtBox {text-align: center; transform: translate(-50%, -50%); width: 95%;}
    #mainSlide .TxtBox.Left {left: 50%;}

    #mainSlide .bg.bg-1 {background-image:url('/img/main/mainSlide01_m.jpg')}
    #mainSlide .bg.bg-2 {background-image:url('/img/main/mainSlide02_m.jpg')}
    #mainSlide .bg.bg-3 {background-image:url('/img/main/mainSlide03_m.jpg')}
    #mainSlide .bg.bg-4 {background-image:url('/img/main/mainSlide04_m.jpg')}
    #mainSlide .bg.bg-5 {background-image:url('/img/main/mainSlide05_m.jpg')}
    #mainSlide .bg.bg-6 {background-image:url('/img/main/mainSlide06_m.jpg')}

    #mainSlide .swiper-pagination, #mainSlide .main_thumb {display: none;}
}
@media(max-width:400px){
    #mainSlide .TxtBox {top:60%;}
    #mainSlide .Tit_Lg {font-size: 2.6rem;}
    #mainSlide .Tit_Sm  {font-size: 1.25rem; letter-spacing: -0.005rem;}
}

/* Signature */
#Signature .flexBox {display: flex; gap:0 1.5rem}
#Signature .LeftBox {max-width: 655px; width: 100%;}
#Signature .Txt {padding: 13rem 0;}
#Signature .LogoBg {position: absolute; left: -10rem; bottom:50%; width:40.875rem; z-index: -1;}

#Signature .SignatureList {padding: 8rem 3rem; display: flex; flex-direction: column; gap:1.5rem; border-right: 1px solid #e5e1d8; height: auto; border-left: 1px solid #e5e1d8;}
#Signature .SignatureList li {aspect-ratio: 11/7; width: 34.5625rem; background: no-repeat center / cover; position: relative; border-radius: 20px; overflow: hidden; padding: 3rem;}
#Signature .SignatureList .slide1 {background-image: url('/img/main/signature01.jpg');}
#Signature .SignatureList .slide2 {background-image: url('/img/main/signature02.jpg');}
#Signature .SignatureList .slide3 {background-image: url('/img/main/signature03.jpg');}
#Signature .SignatureList .slide4 {background-image: url('/img/main/signature04.jpg');}

#Signature .SignatureList li:hover .TitBox {transform: translateY(-10px); transition: ease-in .3s;}
#Signature .SignatureList li:hover .dot img {width: 1.5rem; animation: rotate 4s linear infinite;}

/* #Signature .SignatureList li p b {text-decoration: underline; text-underline-offset:5px;} */
#Signature .TitBox {display: flex; align-items: center; position: absolute; right:1.3rem; bottom:1.3rem; transform: translateY(0px); transition: ease-in .3s;}
#Signature .roundBox {border-radius: 25px; background-color: #003926; color:#fff; padding: .6rem 1.5rem; font-family: var(--pointfont);}
#Signature .dot {width: 3.125rem; height: 3.125rem; border-radius: 50%; background-color: #003926;}
#Signature .dot img {width: 1.5rem;}

#rollingTxt {display: flex; white-space: nowrap; padding: 2.3rem 0; overflow: hidden; border-top: 1px solid #e5e1d8;}
#rollingTxt p {font-family: var(--pointfont); font-size: 5rem; color:var(--pointcolor); display: inline-block;} 
@keyframes rotate{100%{transform:rotateY(360deg)}}

#rollingTxt.Wh {padding: 1.1rem 0; border-top-color: rgba(255,255,255,.3);}
#rollingTxt.Wh p {color:rgba(255,255,255,.3);}

@media(max-width:1140px){
    #Signature .container {padding-left : 5%; width:100%; margin-left: auto; margin-right: 0;}
    #Signature .flexBox {flex-direction: column;}
    #Signature .flexBox .box {width:100%}

    #Signature .LogoBg {left: auto; right:0; top:5rem; bottom:auto;}

    #Signature .Txt {padding: 13rem 0 3rem;}

    #Signature .RightBox {width: 100%; padding-bottom: 7rem;}
    #Signature .SignatureList {flex-direction: row; flex-wrap: nowrap; gap:0; padding: 0; height: 100%;}
}
@media(max-width:500px){
    #Signature .LogoBg {width: 29rem; top:8rem;}
    #Signature .rollingTxt p {font-size: 3rem;}
}

/* doctor */
#doctor {background-color: #003926;}
#doctor .inner {max-width: 1600px; width: 100%; height: 100vh; margin: auto; padding: 200px 0; position: relative;}
#doctor .Line.L {width: 1px; height: 100%; background-color: rgb(255, 255, 255, .2); position: absolute; left: 0; top:0;}
#doctor .Line.R {width: 1px; height: 50%; background:linear-gradient(180deg, rgb(255, 255, 255, .2), transparent) ; position: absolute; right: 0; top:0;}
#doctor .Line.T {width: 65%; height: 1px; background:linear-gradient(90deg, rgb(255, 255, 255, .2), transparent) ; position: absolute; left: 0; top:61%;}
#doctor .Line.B {width: 65%; height: 1px; background:linear-gradient(90deg, rgb(255, 255, 255, .2), transparent) ; position: absolute; left: 0; bottom:19%;}


#doctor .Titflex {display: flex; align-items: center; gap:0 1rem;}
#doctor .name {padding-bottom: 2rem;}
#doctor .DrInfo {padding: 3rem 0; position: relative;}
#doctor .DrInfo:after {content:'';width: 130%; height: 1px; background:linear-gradient(90deg, rgb(255, 255, 255, .2), transparent) ; position: absolute; left: -50%; top:0;}
#doctor .DrInfo:before {content:'';width: 130%; height: 1px; background:linear-gradient(90deg, rgb(255, 255, 255, .2), transparent) ; position: absolute; left: -50%; bottom:0;}

#doctor .Desc .flexList {color:rgba(255,255,255,.5); max-width: 50rem; width: 100%;}

#doctor .Img {position: absolute; width: 50%; bottom:-5rem; right:0;}
#doctor .doctorImg {width: 29.5rem;margin-left: auto; z-index: 3; position: relative;}

#doctor .enTxt {font-size: 5rem; font-family: var(--pointfont); color:rgba(238,232,226,.1); line-height: 1; position: absolute; top:14%; left: 7%; z-index: 1;}

#doctor .circle_wrap {position: absolute; right:0; top:25%; z-index: 1;}
#doctor .circle {position: relative; width: 11rem; height: 11rem; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
#doctor .circle .text {position: absolute; width: 100%; height: 100%; opacity: .5; font-size: .625rem; animation: textRotation 8s linear infinite;}
@keyframes textRotation {to {transform: rotate(360deg);}}
#doctor .circle .text span {position: absolute; left: 50%; font-size: .625rem; transform-origin: 0 calc(5.5rem);}
#doctor .circle .Logo img {width: 5.1875rem;}
@media(max-width:1610px){
    #doctor .inner {width: 95%;}
}
@media(max-width:1240px){
    #doctor .container {display: flex; flex-direction: column; align-items: center;}
    #doctor .inner {height: auto; padding: 3rem 0 5rem;}
    #doctor .Img {position: relative; order: 1; width: 70%;}
    #doctor .doctorImg {margin-right: auto; left: 3rem;}
    #doctor .Txt {order: 2;} 
    #doctor .Line {display: none;}
    #doctor .DrInfo:after, #doctor .DrInfo:before {display: none;} 
    #doctor .Titflex {justify-content: center;}
    #doctor .Tit, #doctor .name, #doctor .DrInfo {text-align: center;}
}
@media(max-width:768px){
    #doctor .Desc .flexList {color:#fff;}
    #doctor .DrInfo {padding: 0 0 7rem;}
}
@media(max-width:640px){
    #doctor .Img {width: 100%;}
    #doctor .enTxt {left: 0;}
}



/* Promotion */
#Promotion {background-color: #f3f0ec; border-radius: 3.125rem 3.125rem 0 0; position: relative;}
#Promotion .Deco {width: 7.5rem; height: 10rem; border-radius: 3.75rem; background-color: #cbc4b1; position: absolute; left: 0; right:0; top:-5rem; margin: auto;}
#Promotion .Deco img {width: 3.875rem;}

#Promotion .Img {border-radius: 1.25rem; overflow: hidden; box-shadow: 0 0 .625rem rgb(94 91 84 / 40%);} 
#Promotion .PromotionSwiper .swiper-slide {padding: .7rem;}
#Promotion .PromotionSwiper {transform: translateX(-.7rem);}


#Promotion .swiper-pagination {position: relative; margin-top: 2rem; background-color: #eee8e2;}
#Promotion .swiper-pagination-progressbar-fill {background-color: #003926;}

#Promotion .olaBtn {position: absolute; right:17rem; top: 17rem;}
@media(max-width:990px) {
    #Promotion .olaBtn {position: relative; right:0; top:0; margin: 3rem auto 0;}
}
@media(max-width:768px) {
    #Promotion .Promotion_wrap {padding-top: 3rem;}
}



/* Youtube */
#Youtube {background: linear-gradient(to bottom, #f3f0ec, #fff); position: relative;}
#Youtube .box .Img {overflow: hidden; aspect-ratio: 9/16.2;}
#Youtube .box .Img img {object-fit: cover; height: 100%;position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; border-radius: 1.25rem;}
#Youtube .YoutubeBtn {display: flex; align-items: center; gap:0 .5rem; justify-content: center; cursor: pointer;}
@media(max-width:1140px){
    #Youtube .container {padding-left: 5%; width: 100%; margin-left: auto; margin-right: 0;}
    #Youtube .flexList {flex-wrap: nowrap; gap:0;}
}




/* System */
#System .ImgTitBox {display: flex; align-items: center; position: relative; z-index: 3;}
#System .ImgLg {width: 57%;}
#System .ImgSm_wrap {width: 43%; display: flex; align-items: center; justify-content: space-between;}
#System .ImgSm {width: 15%;}
#System .image-wrap {transition: 1s ease-out; transition-delay: 0.2s; position: relative; width: 100%; height: 31.25rem; overflow: hidden; visibility: hidden;}
#System .image-wrap.LR {clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);}

#System .Img {width: 100%; height: 31.25rem; transform: scale(1.3);transition: 2s ease-out; background: no-repeat center; background-size: cover;} 
#System .ImgL {background-image: url('/img/main/SystemL.jpg');}
#System .ImgR {background-image: url('/img/main/SystemR.jpg');}
#System .animating .image-wrap {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); visibility: visible; transform: skewY(0);}  
#System .animating .Img {transform: scale(1); transition: 4s ease-out;}  

#System .System_Slide .Slide {background: no-repeat center url('/img/main/SystemBg.jpg'); background-size: cover;}
#System .System_Slide .box {padding: 3rem; aspect-ratio: 12/10;}

#System .SystemSwiper img {width: 24.0625rem;}


#System .BtnBox {display: flex; align-items: center; justify-content: center; gap:0 1rem; width: 9.375rem; padding: 2rem; height: 9.375rem; border-radius: 50%; position: absolute; top:0; bottom:0; left: 0; right:0; margin: auto; background-color: #fff;}
#System .BtnBox .swiper-button-prev img {transform: rotate(180deg); filter: opacity(.5);}

@media(max-width:1240px){
    #System .System_Slide .box {aspect-ratio: 12/13;}
}
@media(max-width:990px){
    #System .ImgTitBox {flex-direction: column; gap:3rem 0; align-items: flex-start;}
    #System .ImgLg {width: 80%;}
    #System .ImgSm_wrap {width: 100%;}   
}
@media(max-width:768px){
    #System .System_Slide .Slide {order:-1;}
    #System .SystemSwiper img {width: auto;}
    #System .System_Slide .box {aspect-ratio: 12/10;}
}
@media(max-width:500px){
    #System .System_Slide .box {aspect-ratio: 12/15; padding: 2rem 1rem 4rem;}
    #System .System_Slide .box.TxtBox {padding: 2rem 1rem;}
    #System .image-wrap, #System .Img {height: 26rem;}
    #System .SystemSwiper img {width: 30rem;}
}



/* Before */
#Before {padding-top: 5rem;}
#Before .tab-menu {display: flex; align-items: center; gap: 0 3rem; justify-content: center;}
#Before .tab-menu li {font-weight: 500; position: relative; cursor: pointer;}
#Before .tab-menu li.active {color:var(--pointcolor);}
#Before .tab-menu li:after {content:''; width: 0; height: 1px; background-color: var(--pointcolor); position: absolute; left: 0; bottom:0; transition: .3s;}
#Before .tab-menu li.active:hover:after {width: 100%; transition: .3s;}
#Before .tab-menu li.active:after {width: 100%; transition: .3s;}

#Before .before_wrap {border-radius: 1.25rem; border:1px solid #eee8e2; padding:2rem 3rem 3rem;}
#Before .login {position: absolute; width: 100%; height: 100%; color:#fff; top:0; bottom:0; left: 0; right:0; margin: auto;}
#Before .login > div {position: relative; z-index: 3;}
#Before .login:after {content:''; width: 100%; height: 100%; -webkit-backdrop-filter: blur(10px) brightness(60%); backdrop-filter: blur(10px) brightness(60%); position: absolute; left: 0; top:0;}
#Before .Desc {position: absolute; width: 80%; white-space: nowrap; padding: .7rem 1rem; letter-spacing: 0; text-transform: uppercase; border-radius: .3125rem; background-color: rgba(51,51,51,.5); z-index: 3; bottom:1rem; left: 0; right:0; margin: auto; color:#fff;}
#Before .Desc.A {background-color: rgba(0,57,38,.5);}

#Before .Dot {width: 2.4375rem; height: 2.4375rem; cursor: pointer; border-radius: 50%; border:1px solid #fff; margin:1rem auto 0; transition: .3s;}
#Before .Dot:hover {background-color: #fff; color:var(--pointcolor); transition: .3s;}

#Before .starTxt {text-align: left;}
#Before .star {position: relative; padding-left: 1rem; text-align: left;}
#Before .star:after {content:'* '; position: absolute; left: 0; top:0;}

#Before .olaBtn {margin-left: auto;}
#Before .material-symbols-outlined {font-size: 1.5rem;}
@media(max-width:1240px){
    #Before .before_wrap {padding: 1.5rem;}
}

@media(max-width:768px){
    #Before .starTxt {text-align: center;}
    #Before {padding-top: 0; margin-top: -5rem;}
    #Before .before_wrap {padding: 3rem 1rem;}
    #Before .olaBtn {margin-right: auto;}
    /* #Before .before_wrap {width: 100%;} */
}
@media(max-width:550px){
    #Before .star {font-size: 1.2rem;}
    #Before .before_wrap {padding: 2rem 1rem;}
}


/* Review */
#Review .banner_wraper {height: 15rem; width: 100%; position: relative; overflow: hidden;}
#Review .banner_wraper .box {height: 100%; position: absolute; width: 27.5rem; height : 13.75rem; border-radius: 1.25rem; border:1px solid #bfbfbf; padding:1.875rem; display: flex; flex-direction: column; justify-content: space-between;}

#Review .Desc {font-size: 1.125rem;}
#Review .Info {display: flex; gap:.5rem; align-items: center; justify-content: end; font-size: 1rem;}
#Review .Info img {width: 2.1875rem;}
@media(max-width:768px){
    #Review .Desc {font-size: 1.15rem;}
}




/* footer */
footer {background-color: #182128; padding: 5.625rem 0 1.5rem; border-radius: 3.125rem 3.125rem 0 0;}
footer .flexBox {display: flex; gap:2rem 4rem;}
footer .infoList {max-width: 380px; width: 100%;}
footer .infoList li {display: flex;}
footer .Line {width: 100%; height: 1px; background-color: #fff; margin: 1.5rem 0;}
footer .Line.B {background-color: rgba(255,255,255,.1); margin: 5rem auto 1.5rem;}
/* footer table {white-space: nowrap;} */
footer .TbTit {width: 6.5rem; text-align: justify; padding-right: 1.5rem; height: 1.5625rem; display: block;}
footer .TbTit:after {content:''; display: inline-block; width: 100%;}
footer .roundBox {color:#182128; border-radius: 13px; background-color: #fff; padding: .2rem .7rem;}
footer .footerLogo {width: 15.625rem;}

footer .mapBox {border-radius: 20px; overflow: hidden; width: 100%; height: 12.5rem; position: relative;}
footer .mapBox .cont {display: none !important;}

footer .map_cover{position: absolute;top:0;width:100%; height: 100%; left: 0; background-color: rgb(255, 255, 255, .01); filter: sepia(1); color:#333; opacity: 0; z-index: 3;transition: 1s all ease;display:flex;align-items: center;justify-content: center;}
footer .root_daum_roughmap {width: 100%;}

footer .infoTb {width: 100%;}
footer .infoTb td {padding: .3rem 0;}

footer .snsList {display: flex; align-items: center; gap:0 1rem;}
footer .snsList img {width: 3.125rem;}


footer .footerLink {display: flex; align-items: center; gap:0 3rem; justify-content: flex-end;}
footer .footerLink a {color:#fff;}

@media(max-width:1340px){
    footer .flexBox .box {width: 33%;}
}
@media(max-width:990px){
    footer .flexBox {flex-wrap: wrap; align-items: flex-end;}
    footer .flexBox .box {width: calc((100% - 4rem) /2);}

    footer .box.map_wrap {display: flex; flex-direction: column; width: 100%; order:3;}
    footer .map_wrap .address {order:2; border-radius: 1.25rem; background-color: rgba(255,255,255,.2); padding: 1rem; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; margin-top: 1rem;}
    footer .mapBox {height: 18.5rem;}
}

@media(max-width:768px){
    footer .flexBox .box {width: 100%;}
    footer .box.map_wrap {order:0;}

    footer .infoLink {order: -1;}
    footer .footerLink {justify-content: flex-start;}

    footer .Line.B {margin: 2rem auto 1rem;}

    footer.font-16 {font-size: 1.4rem;}
    footer .TbTit {width: 7rem;}
}