.mobileMain .section { width:100%; height:100vh;/*padding-top:60px;*/box-sizing:border-box; position:relative;}

/*메인비쥬얼*/
.mobileMain .section.main1 {background:#e4e8eb url('../img/main/visual/main1Bg.jpg') no-repeat center left;background-size:cover;animation: vis_ani0 2s .2s 1 linear forwards;}
@keyframes vis_ani0 {
    0% {background-position:center left}
    100% {background-position:center center}
}

.mobileMain .section.main1 .fp-tableCell {display:block}
.mobileMain .section.main1 #vis {padding-top: 100px;box-sizing: border-box;}
.mobileMain .section.main1 #vis img {width:100%;opacity:0;animation:none}
.mobileMain .section.main1 #vis .visWrap {position:relative;min-height: 200px;}
.mobileMain .section.main1 #vis .visWrap img {position:absolute;top:0;left:0}
.mobileMain .section.main1 #vis .parallelogram {
    opacity:0;
    width: 6%;
    height: 72px;
    transform: skew(-30deg);
    background: linear-gradient(0deg, #2bd3ea,#199bd8,#2bd3ea);
    display: block;
    position: absolute;
    left: 42%;
    top: 8.5%;
    z-index: 9;
    transition:.5s;
    background-size:100% 200%;
}
.mobileMain .section.main1 #vis .parallelogram2 {
    opacity:0;
    width: 6%;
    height: 72px;
    transform: skew(30deg);
    background: linear-gradient(180deg, #26589a, #5d77de, #26589a);
    display: block;
    position: absolute;
    left:52%;
    top: 8.5%;
    z-index:8;
    background-size:100% 200%;
}
.mobileMain .section.main1 #vis .trapezoid {
    opacity:0;
    background:linear-gradient(90deg, #412e7e, #8933dc, #412e7e);
    height:23px;
    width: 108px;
    display: block;
    position: absolute;
    left:37%;
    top:44.5%;
    z-index:10;
    background-size:300% 200%;
}
.mobileMain .section.main1 #vis .trapezoid:before {position:absolute;left:-19%;top:-34%;content:'▲';color:#e8ecee;font-size:40px;line-height:1}
.mobileMain .section.main1 #vis .trapezoid:after {position:absolute;right:-19%;top:-34%;content:'▲';color:#e8ecee;font-size:40px;line-height:1}

.mobileMain .section.main1 #vis .swiper-slide.on > img {animation: vis_ani1 .7s .2s 1 ease forwards;}
/*.mobileMain .section.main1 #vis .swiper-slide.on .visWrap .a4 {animation: vis_ani2 1s .7s 1 ease forwards}
.mobileMain .section.main1 #vis .swiper-slide.on .visWrap .a5 {animation: vis_ani1 1s .7s 1 ease forwards;}
.mobileMain .section.main1 #vis .swiper-slide.on .visWrap .a6 {animation: vis_ani3 1s .7s 1 ease forwards;}*/
.mobileMain .section.main1 #vis .swiper-slide.on .visWrap .a1 {animation: vis_ani3 .7s 1.5s 1 ease forwards;}
.mobileMain .section.main1 #vis .swiper-slide.on .visWrap .a2 {animation: vis_ani4 .7s 1.8s 1 ease forwards;}
.mobileMain .section.main1 #vis .swiper-slide.on .visWrap .a3 {animation: vis_ani2 .7s 2.1s 1 ease forwards;}

.mobileMain .section.main1 #vis .swiper-slide.on .visWrap .parallelogram {animation:  vis_ani9 1s .7s 1 ease forwards, vis_ani5 5s .3s infinite ease-in-out both;}
.mobileMain .section.main1 #vis .swiper-slide.on .visWrap .parallelogram2 {animation: vis_ani8 1s .7s 1 ease forwards, vis_ani6 5s .7s infinite ease-in-out both;}
.mobileMain .section.main1 #vis .swiper-slide.on .visWrap .trapezoid {animation: vis_ani3 1s .7s 1 ease forwards, vis_ani7 5s .5s infinite ease-in-out both;}


@keyframes vis_ani1 {
    0% {transform:translateY(25px);opacity: 0}
    100% {transform:translateY(0);opacity: 1}
}
@keyframes vis_ani2 {
    0% {transform:translateX(-25px);opacity: 0}
    100% {transform:translateX(0);opacity: 1}
}
@keyframes vis_ani3 {
    0% {transform:translateX(25px);opacity: 0}
    100% {transform:translateX(0);opacity: 1}
}
@keyframes vis_ani4 {
    0% {transform:translateY(-25px);opacity: 0}
    100% {transform:translateY(0);opacity: 1}
}
@keyframes vis_ani5 {
    0%,100%{background-position:0% 0%;}
    50%{background-position:0% 300%;}
}
@keyframes vis_ani6 {
    0%,100%{background-position:0% 300%;}
    50%{background-position:0% 0%;}
}
@keyframes vis_ani7 {
    0%,100%{background-position:300% 0%;}
    50%{background-position:0% 0%;}
}
@keyframes vis_ani8 {
    0% {transform:translateY(25px) skew(30deg);opacity: 0}
    100% {transform:translateY(0) skew(30deg);opacity: 1}
}
@keyframes vis_ani9 {
    0% {transform:translateX(-25px)skew(-30deg);opacity: 0}
    100% {transform:translateX(0)skew(-30deg);opacity: 1}
}

@media screen and (max-width:400px){
    .mobileMain .section.main1 #vis .parallelogram, .mobileMain .section.main1 #vis .parallelogram2 {height:62px}
    .mobileMain .section.main1 #vis .trapezoid {height:19px;width:97px;left:37%;top:39.6%}
}
@media screen and (max-width:361px){
    .mobileMain .section.main1 #vis .trapezoid {width:94px}
}
@media screen and (max-width:321px){
    .mobileMain .section.main1 #vis .parallelogram, .mobileMain .section.main1 #vis .parallelogram2 {height:40px}
    .mobileMain .section.main1 #vis .trapezoid {height:16px;width:75px;left:38%;top:28.6%}
    .mobileMain .section.main1 #vis .trapezoid:before {left:-26%;top:-50%}
    .mobileMain .section.main1 #vis .trapezoid:after {right:-26%;top:-50%}
}
@media screen and (max-width:281px){
    .mobileMain .section.main1 #vis .trapezoid {width:69px;}
}


/*카테고리*/
.mobileMain .section.main2 .swiper-container {height:100%}
.mobileMain .section.main2 .swiper-slide img {width:100%;opacity:0;animation:none}
.mobileMain .section.main2 .cateIco {
    position: absolute;
    top: 120px;
    left: 0;
    z-index: 99;
    width: 100%;
    animation: cate_ani3 1.5s .2s infinite forwards;
}
.mobileMain .section.main2 .cateIcoOn {
    position: absolute;
    top: 120px;
    left: 0;
    z-index: 99;
    width: 100%;
    animation: cate_ani4 1.5s .2s infinite forwards;
}
.mobileMain .section.main2 .swiper-slide.cate01 {position:relative;background:url('../img/main/cate01Bg.jpg') no-repeat center center;background-size:cover;padding-top:155px}
.mobileMain .section.main2 .swiper-slide.cate02 {position:relative;background:url('../img/main/cate02Bg.jpg') no-repeat center center;background-size:cover;padding-top:155px}
.mobileMain .section.main2 .swiper-slide.cate03 {position:relative;background:url('../img/main/cate03Bg.jpg') no-repeat center center;background-size:cover;padding-top:155px}
.mobileMain .section.main2 .swiper-slide .cateControls {position:relative;}
.mobileMain .section.main2 .swiper-slide .cateControls .prev {float:left;opacity: 1;width:7%;position: absolute;top: 71%;left: 20px;outline:none}
.mobileMain .section.main2 .swiper-slide .cateControls .next {float:right;opacity: 1;width:7%;position: absolute;top: 71%;right: 20px;outline:none}
.mobileMain .section.main2 .swiper-slide-active .cateTxt01 {animation: cate_ani1 .5s .5s 1 ease forwards;}
.mobileMain .section.main2 .swiper-slide-active .cateTxt02 {animation: cate_ani2 .5s .9s 1 ease forwards;}


@keyframes cate_ani1 {
    0% {transform:translateY(25px);opacity: 0}
    100% {transform:translateY(0);opacity: 1}
}
@keyframes cate_ani2 {
    0% {opacity: 0}
    100% {opacity: 1}
}
@keyframes cate_ani3 {
    0%,100% {opacity:1}
    50% {opacity:0}
}
@keyframes cate_ani4 {
    0%,100% {opacity:0}
    50% {opacity:1}
}


/*의료진소개*/
.mobileMain .section.main3 {background:url('../img/main/docBg.jpg') no-repeat center center;background-size:cover}
.mobileMain .section.main3 .fp-tableCell {display:block}
.mobileMain .section.main3 #doc {position:absolute;bottom:0;left:0;width:100%;height:100%}
.mobileMain .section.main3 .swiper-slide {opacity:0 !important}
.mobileMain .section.main3 .swiper-slide.swiper-slide-active {opacity:1 !important}
.mobileMain .section.main3 .swiper-slide.doc01 {background:url('../img/main/doc01.png') no-repeat center bottom;background-size:100%}
.mobileMain .section.main3 .swiper-slide.doc02 {background:url('../img/main/doc02.png') no-repeat center bottom;background-size:100%}
.mobileMain .section.main3 .docTitle {padding-top:25%}
.mobileMain .section.main3 .docTitle img {width:100%}
.mobileMain .section.main3 .docTitle .docIco {opacity:0;animation:none}
.mobileMain .section.main3 .controls {padding-left:3%;z-index: 9;position: relative;top:-1%}
.mobileMain .section.main3 .controls div {float:left;margin-right:8px;outline:none}
.mobileMain .section.main3 .controls div img {width:35px}


.mobileMain .section.main3.active .docTitle img:first-child {animation: skew_ani .3s 1.2s 2 linear alternate forwards;}
.mobileMain .section.main3.active .docTitle .docIco {animation:fade-right .5s .2s 1 linear forwards, skew_ani .3s 1.2s 2 linear alternate forwards, gradient 2s infinite ease-in-out;width:38px;margin-left:4%;fill:#fffa73;transition:all 0.5s}

@keyframes skew_ani {
    0% {}
    50% {transform: skewX(10deg);top: -3px}
    100% {transform: skewX(-10deg);top: -6px}
}
@keyframes fade-right {
    0% {transform:translateX(-100px);opacity:0}
    100% {transform:translateX(0);opacity:1}
}
@keyframes gradient {
    0% {fill:#fffa73;}
    13% {fill:#ffd973}
    27% {fill:#ffbf73;}
    40% {fill:#ff7373;}
    53% {fill:#ff8ec9;}
    67% {fill:#f88eff;}
    80% {fill:#d68eff;}
    92% {fill:#ff8ea1;}
    100% {fill:#ffbf73;}
}


/*커뮤니티*/
.mobileMain .section.main4 {background:#f2da69}
.mobileMain .section.main4 .titleWrap {position:relative;text-align:center;padding-top:32px}
.mobileMain .section.main4 .titleWrap img {width:100%}
.mobileMain .section.main4 .titleWrap img.cmTitle {animation:bounce 2s ease 0s infinite, cate_ani4 1s .2s infinite forwards;; transition:bottom 0.3s ease;position:absolute;top:0;left:0}
.mobileMain .section.main4 .titleWrap img.cmTitleOn {animation:bounce 2s ease 0s infinite, cate_ani3 1s .2s infinite forwards; transition:bottom 0.3s ease;position:absolute;top:0;left:0}
/*.mobileMain .section.main4 .titleWrap .cmTitle {animation:bounce 2s ease 0s infinite, gradient 2s ease infinite; transition:bottom 0.3s ease;fill:url(#my-cool-gradient) #0f6a58;width:30px}
.mobileMain .section.main4 .titleWrap .cmTitle path {}*/



@keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -7px, 0);
    transform: translate3d(0, -7px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}

.mobileMain .section.main4 .cmWrap > ul {padding:0 15px;width:100%}
.mobileMain .section.main4 .cmWrap > ul > li {float:left;width:33.333%;text-align:center;height:40px;line-height:36px;border-bottom: 5px solid #0f6a58;}
.mobileMain .section.main4 .cmWrap > ul > li a {display:block;font-size:14px;color:#212121;background-color:#fff}
.mobileMain .section.main4 .cmWrap > ul > li a.on {color:#fff;background-color:#0f6a58}
.mobileMain .section.main4 .cmWrap .cmContent {padding:0 15px;width:100%;margin-top:10px;}
.mobileMain .section.main4 .cmWrap .cmContent > div {display:none;background-color:#fff;min-height:310px}
.mobileMain .section.main4 .cmWrap .cmContent > div.on {display:block}

.mobileMain .section.main4 .cmWrap .cmContent .notice {padding:15px}
.mobileMain .section.main4 .cmWrap .cmContent .notice li {position:relative;border-bottom: 1px solid #ccc;font-size: 13px;padding: 8px 0;}
.mobileMain .section.main4 .cmWrap .cmContent .notice li a {padding:0;color:#222}
.mobileMain .section.main4 .cmWrap .cmContent .notice li a span {position: absolute;right: 0;top: 50%;transform: translateY(-50%);}



/*진료안내*/
.mobileMain .section.main5 {background:#012d43;text-align:center}
.mobileMain .section.main5 .timeTitle {animation:rotation 2s ease 0s infinite; transition:bottom 0.3s ease;width:30px}
@keyframes rotation {
    0%,100% {transform:rotate(15deg)}
    50% {transform:rotate(-15deg)}
}


.mobileMain .section.main5 img.timeTitle2 {width:100%}
.mobileMain .section.main5 .tableWrap {position:relative;margin-bottom: 30px;}
.mobileMain .section.main5 .tableWrap .timeTable {width:100%}
.mobileMain .section.main5 .tableWrap span {display:block;position:absolute;height: 7%;background-color:#f2da69;opacity:0;width:0;transition:.4s;transition-delay:1s}
.mobileMain .section.main5 .tableWrap .table01 {top:18.3%;left:18.4%;}
.mobileMain .section.main5 .tableWrap .table02 {top:18.3%;left:57.2%;}
.mobileMain .section.main5 .tableWrap .table03 {top:30.3%;left:18.4%;}
.mobileMain .section.main5 .tableWrap .table04 {top:30.3%;left:57.2%;}
.mobileMain .section.main5 .tableWrap .table05 {top:42.3%;left:18.4%;}
.mobileMain .section.main5 .tableWrap .table06 {top:42.3%;left:57.2%;}
.mobileMain .section.main5 .tableWrap .table07 {top:54.3%;left:18.4%;}
.mobileMain .section.main5 .tableWrap .table08 {top:54.3%;left:57.2%;}
.mobileMain .section.main5 .tableWrap .table09 {top:66.3%;left:18.4%;}
.mobileMain .section.main5 .tableWrap .table10 {top:66.3%;left:57.2%;}
.mobileMain .section.main5 .tableWrap .table11 {top:78.3%;left:18.4%;}

.mobileMain .section.main5.active .tableWrap .tableSmall {width:19.5%;opacity:1}
.mobileMain .section.main5.active .tableWrap .tableBig {width:39%;opacity:1}

.mobileMain .section.main5 .snsWrap {padding:0 15px;width:100%;}
.mobileMain .section.main5 .snsWrap > a {float:left;width:20%;display:block}
.mobileMain .section.main5 .snsWrap > a img {width:100%}


/*오시는길*/
.mobileMain .section.main6 {background:url('../img/main/locationBg.jpg') no-repeat center center;background-size:cover}
.mobileMain .section.main6 img {width:100%}
/*.mobileMain .section.main6 img.locationTitle {animation:location 2s ease 0s infinite; transition:bottom 0.3s ease;}
@keyframes location {
    0%,100% {transform:rotate(-10deg)}
    50% {transform:rotate(10deg)}
}*/
.mobileMain .section.main6 .btnWrap {width:100%;padding:0 15px;margin-bottom:15px}
.mobileMain .section.main6 .btnWrap > a {float:left;width:49%;}
.mobileMain .section.main6 .btnWrap > a:last-child {float:right}
.mobileMain .section.main6 .btnWrap > a img {width:100%}
.mobileMain .section.main6 .mapWrap {width:100%;padding:0 15px}
.mobileMain .section.main6 .mapWrap .wrap_controllers {display:none}


/*하단*/
.mobileMain .section.main7 {background:url('../img/main/footerBg.jpg') no-repeat center center;background-size:cover}
.mobileMain .section.main7 .fp-tableCell {display:block}
.mobileMain .section.main7 .ftTitle {width:100%;padding-top:90px}
.mobileMain .section.main7 .ftWrap {position: absolute;bottom: 0;left: 0;width:100%;background:rgba(0,0,0,0.8);border-radius:30px 30px 0 0;padding:20px 15px 100px}
.mobileMain .section.main7 .ftWrap .agr_list {border-bottom: 1px solid #fff;padding-bottom: 10px;margin-bottom: 10px;}
.mobileMain .section.main7 .ftWrap .agr_list li {position:relative;float:left;font-size:12px;color:#fff;padding-right:8px;margin-right:8px}
.mobileMain .section.main7 .ftWrap .agr_list li:after {position:absolute;content:'';display:block;height:13px;width:1px;background-color:#fff;right:0;top:2px}
.mobileMain .section.main7 .ftWrap .agr_list li:last-child {margin:0;padding:0}
.mobileMain .section.main7 .ftWrap .agr_list li:last-child:after {display:none}
.mobileMain .section.main7 .ftWrap p {color:#fff;font-size:13px;margin-bottom:3px}
.mobileMain .section.main7 .ftWrap p.copy {margin:8px 0 5px;}
.mobileMain .section.main7 .ftWrap p.make a {color:#fff;}


/*메인퀵메뉴*/
html body #quick_bottom {position:fixed; bottom:125px; right:90px; z-index:97;  animation:bounce 2s ease 0s infinite; transition:bottom 0.3s ease;}

.headMenu {position: fixed;top:0;left:0;width:100%;z-index:9}
.btmQuick {position: fixed;bottom:0;left:0;width:100%}