:root {
    --mint:#00d1e8;
    --mint02:#00d4eb;
    --purple:#8a85c9;
    --purple02:#8c86c9;
}
/* 공통사항 */
/* 버튼 스타일링 */
.btnArrow {width:50px; height:50px; border-radius:50%; border:1px solid #dedede; box-sizing:border-box; display:block; margin:0 auto; position:relative; overflow:hidden;}
.btnArrow:hover {border:none;}
.btnArrow::after {content:''; width:0; height:0; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
.btnArrow:hover::after {width:200%; height:200%; transition:all 0.6s ease-out;}
.jamsil .btnArrow:hover::after {background-color:var(--mint02);}
.busan .btnArrow:hover::after {background-color:var(--purple02);}
.btnArrow img {width:22px; position:relative; z-index:2;}

.fixLogo {width:171px;}
.bgImg {background-size:cover; background-repeat:no-repeat; background-position:center;}

.flexRow {display:flex; flex-direction:row; align-items:center;}
.flexCenter {display:flex; flex-direction:row; align-items:center; justify-content:center;}
.flexEnd {display:flex; justify-content:end;}


/* 전체적인 레이아웃 */
.intro {width:100%; height:100vh; overflow:hidden;}
.introWrap {width:100%; height:100%; display:flex; flex-direction:row; justify-content:center; align-items:center;}
.introWrap >div {width:50%; height:100%; box-sizing:border-box; position:relative; cursor:pointer;}
.introWrap .fixText {text-align:center; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; }
.introWrap .fixText p {font-weight:400; font-size:40px; line-height:1.1;}
.introWrap .fixText p strong {font-weight:700; display:block;}
.introWrap >div.jamsil .fixText p {color:var(--mint); margin:37px 0 60px 0;}
.introWrap >div.busan .fixText p {color:var(--purple); margin:25px 0 60px 0;}
.introWrap >div .fixBg {background-size:cover; background-repeat:no-repeat; background-position:center;}
.introWrap >div.jamsil .fixBg {background-image:url(../../_images/main/intro_fixbox_jamsil_bg.png); width:100%; height:100%;}
.introWrap >div.busan .fixBg {background-image:url(../../_images/main/intro_fixbox_busan_bg.png); width:100%; height:100%;}

/* 의사 */
.doctor {position:absolute; top:0; left:0; width:100%; height:100%; transform:translateY(100%); z-index:-1;}
.doctor.up {transform:translateY(0); opacity:1; transition:all 1.3s ease-out; z-index:2;}
.doctor .textBox {position:absolute; background-color:rgba(0,0,0,0.58); padding:5.4% 4.9% 7.4% 4.9%;}
.doctor .textBox .tit { line-height:1.1; font-size:40px; font-weight:400; margin-bottom:37px;}
.doctor .textBox .tit strong {display:block; font-weight:700;}
.doctor .textBox .border {width:100%; height:1px; background-color:#f1f5f8; display:block; margin:30px auto 45px auto;}
.doctor .textBox .tel {font-size:40px; line-height:1; color:#ffffff; font-family:'SCDream'; font-weight:800; display:block; margin-bottom:5px;}
.doctor .textBox dl dt {font-family:'SCDream'; font-size:12px;  font-weight:300; color:#fff; opacity:0.5; line-height:1.5; margin:6px 10px 14px 0;}
.doctor .textBox dl dd {font-size:20px; font-weight:400; color:#fff; opacity:0.5; line-height:1.2;}
.doctor .textBox .btnArrow {margin:0;}

.GoBack { position:absolute; top:20px; right:20px; background-color:rgba(0,0,0,0.5); width:50px; height:50px; border-radius:50%; overflow:hidden;}
.GoBack i {font-size:26px; color:#fff; position:relative; z-index:1;}
.GoBack::after {content:''; width:0; height:0; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background-color:#fff;}
.GoBack:hover {background-color:#fff;}
.GoBack:hover::after {width:200%; height:200%; transition:all 0.6s ease-out; }
.GoBack:hover i {color:#000;}

.jamsil .doctor.up {transform:translateY(0); transition:all 1.3s ease-out; z-index:2;} 
.jamsil .doctor {background-image:url(../../_images/main/intro_fixbox_jamsil_doctor.png); transform:translateY(100%);}
.jamsil .doctor .textBox { right:0; bottom:0;}
.jamsil .doctor .textBox .tit, .jamsil .doctor .textBox .tit strong {color:var(--mint02);}
.busan .doctor.up {transform:translateY(0); transition:all 1.3s ease-out; z-index:2;} 
.busan .doctor {background-image:url(../../_images/main/intro_fixbox_busan_doctor.png);}
.busan .doctor .textBox { left:0; bottom:0; }
.busan .doctor .textBox .tit, .busan .doctor .textBox .tit strong {color:var(--purple02);}

/* 로고와 배경 */
.bgnBg {position:absolute; top:0; left:0; width:100%; height:100%; transform:translateY(-100%); z-index:-1;}
.bgnBg.down {transform:translateY(0); transition:all 1.3s ease-out;}
.bgnBg >div {width:100%; height:100%; flex-direction:column;}
.bgnBg >div dl {text-align:center; line-height:1.3;}
.bgnBg >div dl dt, .bgnBg >div dl dd {font-size:44px; color:#fff; line-height:1;}
.bgnBg >div dl dt {font-family:'SourceHanSerifKR'; margin:50px 0 20px 0;}
.bgnBg >div dl dt span {font-family:'SourceHanSerifKR'; font-weight:600; color:#ffd18a;}
.bgnBg >div dl dd {font-family:'OPTITimes-Roman'; font-weight:400; letter-spacing:-0.6px;}
.jamsil .bgnBg {background-color:var(--purple02);}
.jamsil .bgnBg.down {transform:translateY(0); transition:all 1.3s ease-out; z-index:2;}
.busan .bgnBg {background-color:var(--mint02); transform:translateY(-100%);}
.busan .bgnBg.down {transform:translateY(0); transition:all 1.3s ease-out; z-index:2;}

@media screen and (max-width:1580px) {
    .bgnBg >div dl dt {margin:48px 0 18px 0;}
    .bgnBg >div dl dt, .bgnBg >div dl dd {font-size:40px;}
    .doctor .textBox {padding:40px 25px 55px 30px;}
}
@media screen and (max-width:1280px) {
    .bgnBg >div dl dt {margin:45px 0 15px 0;}
    .bgnBg >div dl dt, .bgnBg >div dl dd {font-size:36px;}
    .doctor .textBox .tit {font-size:36px; margin-bottom:10px;}
    .doctor .textBox .tel {font-size:36px;}
    .doctor .textBox {padding:35px 25px 50px 30px;}
}
@media screen and (max-height:620px) {
    .doctor .textBox {padding:30px 25px 40px 30px;}
    .doctor .textBox .tit {font-size:31px;}
    .btnArrow {width:45px; height:45px;}
    .btnArrow img {width:20px;}
    .GoBack {width:45px; height:45px;}
    .GoBack i {font-size:21px;}
    .doctor .textBox .tel {font-size:31px;}
    .doctor .textBox dl dd {font-size:18px;}
    .bgnBg >div dl dt {margin:30px 0 15px 0;}
    .bgnBg >div dl dt, .bgnBg >div dl dd {font-size:31px;}
}
@media screen and (max-height:480px) {
    .doctor .textBox .border {margin:20px 0 25px 0;}
    .doctor .textBox .tit, .doctor .textBox .tel {font-size:26px;}
    .doctor .textBox {padding:30px 25px 30px 30px;}
    .btnArrow {width:40px; height:40px;}
    .GoBack {width:40px; height:40px;}
    .GoBack i {font-size:20px;}
}

/* 241023 게이트 수정 */
.introWrap__jb{ position:relative; color:#fff; display: flex; align-items: center; justify-content: center; text-align:center; background-size:100% 100%;}
.introWrap__jb::before{transition:3s; display:block; content:''; position:absolute; top:0; left:0; z-index:0; width:100%; height:100%; background:rgba(0,0,0,.5);}
.introWrap__jb .txtWrap{margin-top:-8vh; z-index:1; transition:.5s; letter-spacing: -2px; font-weight:300;}
.introWrap__jb h2{padding-bottom: 20px; margin-bottom: 15px; margin-top:20px; font-size:54px; position:relative;}
/*.introWrap__jb h2::after{display:block; content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:42px; height:1px; background:#fff;}*/
.introWrap__jb .des{font-size:26px;}
.introWrap__jb .fcEff{font-weight:bold;}

.introWrap__jamsil{background-image:url(../../_images/main/bg_intro_jamsil.jpg);}
.introWrap__busan{background-image:url(../../_images/main/bg_intro_busan.jpg);}

.introWrap__jb:hover::before{display:none;}
.introWrap__jb:hover .txtWrap{transform:translateY(-17vh);}
.introWrap__jamsil:hover .fcEff{color:#aaffff;}
.introWrap__busan:hover .fcEff{color:#e7d3ff;}