/* ================ 공통 ================ */
.tit_wrap{}
.tit_wrap .bar{width: 10rem;height: 0.3rem;margin-bottom:1.5rem}
.tit_wrap .mini{letter-spacing: 0.15rem;line-height: 1.8;display: inline-block}
.tit_wrap .tit{text-transform: uppercase;line-height: 1.2;}

.more_btn{display: flex;align-items: center;justify-content: center}
.more_btn img{margin-left:0.5em;transition: all 0.5s}
.more_btn:hover img{margin-left:1em}

.text_clear{text-transform: none !important}
/* ================ 효과 ================ */
@keyframes flip-vertical-right {
    0% {-webkit-transform: rotateY(360deg);transform: rotateY(360deg);}
   100% {-webkit-transform: rotateY(0);transform: rotateY(0);}
}

@keyframes scrollDown4{
    0%{transform-origin: top;transform: scaleY(0);}
    45%{transform-origin: top;transform: scaleY(1);}
    55%{transform-origin: bottom;transform: scaleY(1);}
    100%{transform-origin: bottom;transform: scaleY(0);}
}



/* ================ Header ================ */
#header{position:fixed;width: 100%;z-index: 999;transition: all 0.5s;}
#header .inner{display: flex;justify-content: space-between;align-items: center}
#header .menu{display: flex;margin-left:auto;position: relative;max-width:900px;width: 75%;}
#header .menu li{position: relative;transition:all 0.6s ease;width: calc(100% / 6)}
#header .menu > li:after{content:'';transition:all 0.5s ease;width:0%;;left:50%;}
#header .menu > li:before{content:'';width:0%;transition:all 0.5s ease;left:50%;}
#header .menu > li:hover:after{content:'';position:absolute;bottom:0px;left:50%;background:#fff;height:3px;width:50%;}
#header .menu > li:hover:before{content:'';position:absolute;bottom:0px;left:0px;	background:#fff;height:3px;	width:50%;}

#header .menu > li > a{display: block;text-transform: uppercase;color: #fff; padding:25px 10px;position: relative;text-align: center}
#header .menu > li:hover > a::after{position: absolute;left:50%;transform: translateX(-50%);width: 5px;height: 5px;background: #fff;content: '';top: 20px;border-radius: 50%}

#header .submenu{display: none;position: absolute;width: 100%;z-index: 10;width:100%;left: 50%;transform: translateX(-50%);top: 80px}
#header .submenu li{text-align: center;width: 100%;}
#header .submenu li a{display: block;color: #fff;padding: 1em 2px;font-size:0.85em;color: #fff;background: rgba(0,0,0,0.2)}

#header .submenu li:hover a{;background: rgba(255,255,255,0.8);;color: #333;}
#header .ment_btn {margin-left:5%}
#header .ment_btn a{color: #fff;transition: 0.7s}

#header.active{background: #c5a475 }/* 마우스 hover 했을때 */
#header.on{background: #c5a475 !important;box-shadow: 1px 1px 4px rgba(0,0,0,0.1)}/* 스크롤했을때 */
#header .dim{display: none;position: fixed;width: 100%;height: 100%;background: #000;opacity: 0.6;z-index: 9;}


@media (max-width:1240px) {
    #header .inner{height: 80px;}
}
@media (max-width:768px) {
    #header .inner{height: 70px;}
    #header .logo{display: block;width: 180px;}
    #header .dim{top:0}
}

/* ================ SiteMap ================ */
.sitemap{position: fixed;width: 100%;height: 100vh;z-index: 9999;background:#fffbf6;display: none}
.sitemap .st_close{position: absolute;top: 0;right: 0;z-index: 9999;padding: 20px;background: #333;cursor: pointer}
.sitemap .inner{display: flex;height: 100%;}
.sitemap .site_menu_wrap{padding:150px 100px;;position: relative;width: 100%;margin-left:auto;margin-right:auto;max-width:1600px;overflow-y: auto;}
.sitemap .site_menu{width: 100%;display: flex;flex-wrap:wrap;justify-content: space-between;}
.sitemap .site_menu > li{width: 30%;margin-top:4em;}
.sitemap .site_menu > li > a{position: relative;text-transform: uppercase;display: block;font-weight: bold;padding-bottom:10px;border-bottom:1px solid;font-size:1.5em;transition:all 0.5s}
.sitemap .site_menu > li > a:after{display: block;position: absolute;font-size: 1em;content: '\25CF';top: -0.3em;left: -0.45em;color: rgba(198, 165, 118, 0.35);z-index: -1;transition: all 0.5s;transform: scale(0);}

.sitemap .site_menu > li:hover > a,.sitemap .site_menu > li.on > a{color: #c5a475;}
.sitemap .site_menu > li:hover > a:after, .sitemap .site_menu > li.on > a:after{transform: scale(1);}

.sitemap .site_menu .submenu{padding-top: 10px;}
.sitemap .site_menu .submenu li{}
.sitemap .site_menu .submenu li a{display: inline-block;margin:0.5em auto;transition: all 0.2s}
.sitemap .site_menu .submenu li a:hover{box-shadow: inset 0 -0.65em 0 rgba(197, 164, 117,0.4);}
.sitemap .site_menu .submenu br{display: none}

@media (max-width:1440px) {
    .sitemap .site_menu >li{width: 45%}
}
@media (max-width:1240px) {
    .sitemap .site_menu >li{width: 100%}
    .sitemap .site_menu >li:nth-child(1){margin-top:0}
}
@media (max-width:768px) {
    .sitemap{max-width:350px;width: 85%;}
    .sitemap .inner{flex-direction: column;}
    .sitemap .st_logo{background: #c5a475;padding:15px}
    .sitemap .st_logo img{width: 180px;}
    .sitemap .site_menu_wrap{padding:0px}
    .sitemap .site_menu {padding:0 20px}
    .sitemap .site_menu >li{margin-top: 0}
    .sitemap .site_menu > li > a{padding:1em 0;border-bottom: 1px dashed #919191;font-size:1.35em}
    .sitemap .site_menu > li:hover > a, .sitemap .site_menu > li.on > a{border-bottom: 1px dashed #c5a475;}
    .sitemap .site_menu > li > a:after{top:0.7em;}
    .sitemap .site_menu .submenu{padding-top:0;display: none;font-size:1.1em}
    .sitemap .site_menu .submenu li{padding:0.5em 1em;}
    .sitemap .st_close{width: 71px;background:none;padding:28px;color: #fff;}
}

/* ================ Footer ================ */
#footer{background: #333;padding:80px 0}
#footer *{color: #fff;}
#footer .inner{display: flex;}
#footer .f_logo{margin-right: 2em;align-self: center}
#footer .f_txt{padding-left: 2em;border-left: 1px solid;justify-content: space-between;    width: 100%;}

#footer .f_info{text-transform: uppercase;}
#footer .f_info p{line-height: 1.8}
#footer .f_link{display: flex;}
#footer .f_link li a{display: inline-block;}
#footer .f_link li+li::before{content: "";display: inline-block;width: 1px;height: 1em;background-color: #e4e8eb;vertical-align: -1px;margin: 0 8px;}
#footer .f_sns a{display: inline-block;margin-right: 10px}
#footer .adm_btn{display: inline-block;margin-top: 10px;border:1px solid;padding:4px 6px}

@media (max-width:1240px) {
    #footer .f_txt{flex-wrap:wrap;}
    #footer .f_info{width: 100%;}
    #footer .f_sns {margin-bottom: 1em;order:-1}
    #footer .f_sns img{width: 30px;}
}
@media (max-width:768px) {
    #footer .inner{flex-direction: column}
    #footer .f_logo{margin: auto;width: 160px;}
    #footer .f_txt{padding-left:0;border: none;flex-wrap:wrap;text-align: center;}
    #footer .f_info{width: 100%;}
    #footer .f_sns {width:auto;margin: 1em auto;}
    #footer .f_sns a{margin:0 5px}

    #footer .f_link{justify-content: center}
}
/* ================ Main bann ================ */
.main_bann{position: relative;}
.main_bann .swiper-slide{height: 100vh;background: #000;color: #fff;text-align: center;display: flex;align-items: center;}
.main_bann .swiper-slide .txt{width: 100%;}

    /* Slide 배경 */
    .main_bann .slide01{background: url(/img/main/slide01.jpg) no-repeat center center / cover;}
    .main_bann .slide02{background: url(/img/main/slide02.jpg) no-repeat right 40% center / cover;}
    .main_bann .slide03{background: url(/img/main/slide03.jpg) no-repeat left 45% center / cover;}
    /* Slide Effext */
    .main_bann .swiper-slide .txt h2{ transition: all 1.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0.2s; transform: translate3d(0, -40px, 0); opacity: 0;}
    .main_bann .swiper-slide .txt p{ transition: all 1.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0.7s; transform: translate3d(0, 40px, 0); opacity: 0;}
    .main_bann .swiper-slide-active .txt h2,.main_bann .swiper-slide-active .txt p{ transform: translate3d(0, 0, 0) !important; opacity: 1 !important}
    /* Arrow */
    .main_bann .swiper-button-prev, .main_bann .swiper-button-next{;width: 4em;height: 2em}
    .main_bann .swiper-button-prev{background:url(/img/main/arrow_prev.png) no-repeat center center / contain;left:2rem}
    .main_bann .swiper-button-next{background:url(/img/main/arrow_next.png) no-repeat center center / contain;right:2rem}
    .main_bann .swiper-button-prev:after,.main_bann .swiper-button-next:after{content:'';}

    /* Pagination */
    .main_bann .swiper-container-horizontal > .swiper-pagination-bullets{bottom:20rem}
    .main_bann .swiper-pagination-bullet{width: 10px;height: 10px;background:none;border:2px solid #fff;opacity: 1}
    .main_bann .swiper-pagination-bullet-active{background: #FFF;}
    /* Scroll Effet */
.main_bann .scroll-down-wrap{position: absolute;bottom: 0;width: 100%;text-align: center;z-index: 1;color: #fff;}
.main_bann .scroll-name{display: inline-block;margin-bottom: 8px;font-size:14px;text-transform: uppercase;}
.main_bann .scroll-down{width: 1px;height: 12rem;background: #fff;animation: scrollDown4 2s ease infinite;margin: 0 auto;}

@media (max-width:768px) {
    .main_bann .swiper-slide{max-height: 100vh;height: 700px;}
    .main_bann .swiper-button-prev, .main_bann .swiper-button-next{width: 2.5em;}
    .main_bann .swiper-button-prev{left:1rem}
    .main_bann .swiper-button-next{right:1rem}
    .main_bann .swiper-slide .txt{margin: auto;width:calc(100% - 7em)}
}

/* ================ Signature ================ */
.acco_box{width:100%;position:relative;z-index:5;display: flex;justify-content: space-between;}
.acco_box .list{width:25%;height:400px;position:relative;-webkit-transition: all 0.3s ease;transition: all 0.5s ease;}
.acco_box .list:before{content:'';display:block;position:absolute;z-index:1;background:rgba(0,0,0,0.6);width:100%;height:100%;top:0;left:0;}
.acco_box .list01{background:url(/img/main/bn_bg01.jpg)no-repeat center center /cover;}
.acco_box .list02{background:url(/img/main/bn_bg02.jpg)no-repeat center center /cover;}
.acco_box .list03{background:url(/img/main/bn_bg03.jpg)no-repeat center center /cover;}
.acco_box .list04{background:url(/img/main/bn_bg04.jpg)no-repeat center center /cover;}

.acco_box .list a{position:relative;z-index:2;display:block;color:#fff;width:100%;height:100%;display: flex;align-items: center}
.acco_box .list .txtbox{text-align: center;width: 100%;}
.acco_box .list:hover .txtbox > img{animation:flip-vertical-right 0.4s cubic-bezier(0.455, 0.030, 0.515, 0.955) both}

.acco_box .list.acc_on{width:45%;}
.acco_box .list.acc_on:before{opacity: 0.54}

@media (max-width:1240px) {
    .acco_box{flex-wrap:wrap}
    .acco_box .list{width: 50%; height:300px}
    .acco_box .list.acc_on{width:50%;}
}
@media (max-width:768px) {
    .acco_box .list{height:250px;width: 100%;}
    .acco_box .list.acc_on{width:100%;}

}

/* ================ Doctor ================ */
.Doctor{background: url(/img/main/doc_bg.jpg) no-repeat center right / cover;}
.Doctor .doc_btn{display: inline-block;padding:0.5em 2em;margin-top:3em;transition: all 0.5s}
.Doctor .doc_btn:hover{box-shadow: 4px 6px 4px rgba(86,68,45,0.3);transform: translateY(-7px);}

/* ================ Special ================ */
.sp_list{display: flex;justify-content: space-between;flex-wrap:wrap}
.sp_list .imgbox{position: relative;overflow: hidden;transform: rotate(0.0001deg);transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);}
.sp_list .imgbox img{transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);}
.sp_list .imgbox span{position: absolute;z-index: 1;left: 0;top: 1em; color: #fff;display: inline-block;padding:4px 1em;background: #ba9157;}

.sp_list .more_btn{background: #fff;display: inline-flex;padding:4px 0.5em;border:1px solid #ba9157 ;color: #ba9157;transition: all 0.3s}
.sp_list .more_btn:hover{background: #ba9157;color: #fff;box-shadow: 4px 6px 10px rgba(86,68,45,0.3)}
.sp_list .more_btn:hover img{content:url('/img/main/mini_next.png');}
.sp_list li{width: 32%;}
.sp_list li h4{padding:0.5em}

@media (max-width:1240px) {
    .sp_list li{width: 48%;margin-top:3em}
    .sp_list li:nth-child(-n+2){margin-top: 0;}
}
@media (max-width:768px) {
    .sp_list li{width: 100%;}
    .sp_list li:nth-child(1)~li{margin-top:3em}
}

/* ================ Community ================ */
.community .ct_box{display: flex;justify-content: space-between;}
.community .comu_box{width: 45%;}
.community .comu_box .tit{display: flex;align-items: center; justify-content: space-between;padding-bottom:0.3em}

.community .more_btn{color: #ccc;border:1px solid #ccc;padding:4px 0.5em}
.community .more_btn:hover{background: #ccc;color: #fff;box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2)}
.community .more_btn:hover img{content:url('/img/main/mini_next.png');}

.community .cm_box_ct{border-top:1px solid #ddd;border-bottom:1px solid #ddd;height: calc(100% - 48px)}
    /* 닥터칼럼 */
    .community .column_list{display: flex;align-items: center;justify-content: space-between;padding: 0.75em 0;height: 100%;}
    .community .column_list li{width: 32%;}
    .community .column_list li.empty{width: 100%;justify-content: center;text-align: center}
    .community .column_list li .imgbox{overflow: hidden}
    .community .column_list li .imgbox img{transition: all 0.5s}
    .community .column_list li:hover .imgbox img{transform:scale(1.08);}
    .community .column_list li p{margin-top: 0.7em;white-space: nowrap;overflow: hidden;text-overflow: ellipsis}

    /* 온라인상담 */
    .community .online_list li .asw{display: flex;align-items: center;justify-content: space-between;padding: 0.85em 0;border-bottom: 1px dashed #ddd;}
    .community .online_list li:last-child .asw{border-bottom: none;}
    .community .online_list li .asw p{margin-right:auto;    padding-right: 1em;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
    .community .online_list li .asw:hover p{color: #b5905c;}
    .community .online_list li .asw p img{margin-right:8px}
    .community .online_list li .asw span{font-size:0.93em;color: #acacac;}

    .community .online_list li .asw::before{content: "답변대기";;border: 1px solid #b5905c;color: #b5905c;display: inline-block;padding: 0 0.5em;margin-right: 14px;}
    .community .online_list li .asw_fin::before{content: "답변완료";background: #b5905c;color: #fff}

@media (max-width:1240px) {
    .community .ct_box{flex-wrap:wrap}
    .community .cm_box_ct{height: auto}
    .community .comu_box{width: 100%;}
    .community .comu_box .tit{padding-bottom:10px}
    .community .column_list{padding:2em 0}
    .community .online_counsel{margin-top: 3em}
}

/* ================ Loation ================ */
.location{}
.location .inner{display: flex;justify-content: space-between;}

.location .leftbox{width: 50%;}
.location .leftbox .map{width: 100% !important;max-height: 765px !important;height:60vw !important;margin: 0 auto !important;min-height: 350px !important;padding: 0 !important;    border: 0 !important;}
.root_daum_roughmap .wrap_controllers {display: none}


.location .rightbox{width: 50%;background: url(/img/main/loca_bg.jpg) no-repeat bottom right / cover;padding:5%;padding-right:2%}
.location .rightbox .tit_wrap p{align-self: flex-end;margin-left:2em}
.location .loca_info{padding:0 2em}
.location .loca_info .tit{margin-top:20px}
.location .loca_info .tit img{margin-right:1.5rem}
.location .loca_info dl{padding-left:7%}
.location .loca_info dt{flex-shrink: 0;width: 130px;}
.location .loca_info dd{width: 100%;}
.location .loca_info dd small{font-size:0.8em}
.location .loca_info .tel_link{display: inline-block;padding-left:7%}
.location .loca_info .bar{    width: 100%;height: 1px;    background: #fff;    margin: 2em 0;    max-width: 500px;}

@media (min-width:1921px) {
.location .rightbox{padding:100px;}
}

@media (max-width:1440px) {
    .location .tit_wrap{display: block}
    .location .rightbox .tit_wrap p{margin-left:0;margin-top:15px}
}
@media (max-width:1240px) {
    .location .inner{flex-wrap:wrap}
    .location .leftbox{width: 100%;}
    .location .rightbox{width: 100%;padding:80px 5%}
    .location .loca_info{padding:0;display: flex;justify-content: space-between;}
    .location .loca_info dt{width: 100px;}
    .location .loca_info dl{padding-left:0;margin-top: 15px;}
    .location .loca_info .tel_link{padding-left: 0}
    .location .loca_info .bar{display: none}
}
@media (max-width:768px) {
    .location .loca_info{display: block}
    .location .loca_info .bar{display: block}
}


/* ================ Reservation ================ */
.Reservation{background: #fffaf4 url(/img/main/reservation_bg.png) no-repeat left -2% top 10% / 420px;position: relative;overflow: hidden}
.Reservation .bg_txt{position: absolute;right:0;top: -10%;color: #faf2e8;font-size: 200px;line-height: 1}
.Reservation .inner{display: flex;justify-content: space-around;}

.Reservation .kakao { -webkit-box-flex: 1; -ms-flex: 1 0 50%; flex: 1 0 50%;  max-width:450px}
.Reservation .kakao .button { display: block; border-radius: 5rem; background: #FFDE1D; padding: 3rem 6rem; font-size: 2rem; font-weight: 700; position: relative; }
.Reservation .kakao .button:before { content: ""; display: block; background: url(/img/main/lion.png) no-repeat top/100%; width: 23rem; height: 15rem; position: absolute; right: 2rem; bottom: 0; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; }
.Reservation .kakao .button:after { content: ""; display: block; position: absolute; bottom: 120%; right: 10%; width: 0; height: 0; background: url(/img/main/star.png) no-repeat center/cover; overflow: hidden; z-index: 2; -webkit-animation: glitter 4.5s linear 0s infinite normal; animation: glitter 4.5s linear 0s infinite normal; opacity: 0; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; }

.Reservation .naver { -webkit-box-flex: 1; -ms-flex: 1 0 50%; flex: 1 0 50%; max-width:450px}
.Reservation .naver .button { display: block; border-radius: 5rem; background: #03cf5d; padding: 3rem 6rem; font-size: 2rem; font-weight: 700; position: relative;color: #fff; }
.Reservation .naver .button:before { content: ""; display: block; background: url(/img/main/naver_reserve.png) no-repeat top/100%; width: 15rem; height: 14rem; position: absolute; right: 4rem; bottom: -1.02rem; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-transform: scale(0.85, 0.85); transform: scale(0.85, 0.85);transition: 0.4s ease-in-out; }

@media (hover: hover) and (pointer: fine) {
    .Reservation .kakao .button:hover:before { bottom: 0; height: 21rem; }
    .Reservation .kakao .button:hover:after { opacity: 1; width: 5rem; height: 5rem; -webkit-transform: rotate(360deg); transform: rotate(360deg); right: 0%; }
    .Reservation .naver .button:hover:before { height: 16rem; transform: scale(1);}
}

@media (max-width:1240px) {
    .Reservation{background-position:right -2% bottom 0;background-size:330px}
    .Reservation .bg_txt{font-size: 12vw;top:-5%;right:auto;left:0}

    .Reservation .inner{display: block}
    .Reservation .kakao{margin: auto}
    .Reservation .naver{margin:9rem auto 0}
}
@media (max-width:768px) {
    .Reservation{background-size:50vw}
    .Reservation .bg_txt{display: none}
}


/* ================ Quick ================ */
#quick{position: fixed;right: 30px;bottom: 50px;z-index: 999;}
#quick .wrap{width: 75px;background: #fff;border-radius: 50px;text-align: center;font-size:11px;font-weight: 500;box-shadow: 1px 1px 10px rgba(0,0,0,0.1);transition: all 0.3s;padding:2.5em 0}

#quick .q_menu{display: block;padding:0 0.8em;}
#quick .q_menu img{width: 35px;}
#quick .q_menu p{margin-top:0.5em}
#quick .q_menu+.q_menu::before{content:'';display: block;width: 100%;height: 1px;background: #ccc;margin:1em 0}

#quick .btn_top{position: relative;display: flex;align-items: center;justify-content: center;width: 75px;height: 75px;border-radius: 50%;background-color: #c5a475;margin-top:20px;color: #fff;font-size:4em;box-shadow: 1px 1px 10px rgba(0,0,0,0.1);cursor: pointer;}
#quick .plus-btn{display: none}

@media (max-width:1240px) {
    #quick{right:15px;bottom:15px}
    #quick .wrap{width: auto;position: relative;padding: 0;box-shadow: none;background: none;}
    #quick .q_menu{position: absolute;transition: all .3s ease;top:6px;}
    #quick .q_menu+.q_menu::before{display: none}
    #quick .q_menu p{display: none;position: absolute;top: 50%;transform: translateY(-50%);width: 100px;right: 100%;text-align: right;padding-right: 10px;margin-top: 0;color: #000;}

    #quick .plus-btn{width: 50px;height: 50px;display: flex;box-shadow: 1px 1px 10px rgba(0,0,0,0.1);background: #fff;border-radius: 50%;align-items: center;
        justify-content: center;position: relative;transition: all 0.3s}
    #quick .plus-btn i {display: none}
    #quick .btn_top{width: 50px;height: 50px;font-size:2em;margin-top:10px;}

    #quick.active{z-index: 999}
    #quick.active .q_menu{transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);background: #f7f7f7;height: 50px;width: 50px;display: flex;border-radius: 50%;box-shadow: 1px 1px 10px rgba(0,0,0,0.1);}
    #quick.active .q_menu:nth-child(1){ transform: translate3d(-0em,-245px,0);}
    #quick.active .q_menu:nth-child(2){ transform: translate3d(-0em,-185px,0);}
    #quick.active .q_menu:nth-child(3){ transform: translate3d(-0em,-125px,0);}
    #quick.active .q_menu:nth-child(4){ transform: translate3d(-0em,-65px,0);}
    #quick.active .q_menu img{width: auto;height: 26px;}
    #quick.active .plus-btn{background:#3e2f1b;color: #fff;}
    #quick.active .plus-btn i {display: block;}
    #quick.active .plus-btn img{display: none}
}
/* ================ 익스용 CSS ================ */
@media all and (-ms-high-contrast: none),(-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */

}