@import url(./animation.css);


#wrap {
	width: 100%;
	min-width: 1920px;
	position: relative;
}

[class*="inner"] {
	width: calc(100% - 4rem);
	margin: 0 auto;
}

.inner {
	max-width: 1520px;
}

.inner162 {
	max-width: 1620px;
}

.lining {
	position: absolute;
	left: 0%;
	bottom: 0;
	width: 100%;
	height: 1px;
	background: rgba(255, 255, 255, 0.1);
	overflow: hidden;
	z-index: 10;
}

.lining:after {
	content: "";
	display: block;
	width: 447px;
	height: 12px;
	background: url(/img/main/light_bar2.png);
	position: absolute;
	left: 50%;
	top: 0;
	animation: light_bar 3s infinite linear;
}

.main_ttl_row {
	color: #fff;
}

.main_ttl_row .subject {
	display: inline-block;
	font-size: 2rem;
	font-weight: 100;
	text-transform: uppercase;
	margin-bottom: 1.5rem;
	color: rgba(255,255,255,0.5);
	letter-spacing: 0.13rem;
}

.main_ttl_row h3 {
	font-size: 5rem;
	font-weight: 200;
	line-height: 1.4;
}

.main_ttl_row h3 b {
	font-weight: 500;
	color: var(--sub-color);
}

.main_ttl_row .disc {
	font-size: 2.2rem;
	line-height: 1.6;
	font-weight: 100;
	margin-top: 4rem;
}

.main_ttl_row .desc {
	font-size: 2.4rem;
	line-height: 1.6;
	font-weight: 200;
	margin-top: 5rem;
}

.main_ttl_row .desc span {
	color: var(--sub-color);
	font-weight: 500;
}

.main_ttl_row.t_c {
	text-align: center;
}

/* ################# header  ################# */
#hd {
    width: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 800;
    overflow: visible;
    transition: background-color 0.3s ease, top 0.3s ease;
}

#hd.up {
    top: -100%;
}

.hd_wr {
    width: 100%;
    padding: 4rem;
    max-height: 10rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
	box-shadow: 0 2px 0 rgba(0,0,0,0.04);
}

#hd .hd_left {
    display: flex;
    gap: 2.6rem;
    align-items: center;
    /* transition: gap 0.3s ease; */
}

#hd.on .hd_left {
    gap: 2.6rem;
}

#hd .logo a {
    display: block;
    width: 17rem;
    height: 2.3rem;
    background: url('../img/common/logo.png') no-repeat center center/cover;
}

/* =================================================
   배경 박스 (#hd_bg)
   : 아래로 펼쳐지는 게 아닌, 위치 고정 상태에서 Opacity Fade
================================================= */
#hd .hd_bg {
    width: 100%;
    position: absolute;
    left: 0;
    top: 100%;
    height: 24.7rem;
    background-color: #FFF;
	box-shadow: 0 17px 17px rgba(0, 0, 0, 0.15);

    transform: translateY(-10px);
    opacity: 0;
    visibility: hidden;
    transition: transform 0.25s ease-out, 
                opacity 0.2s ease-out, 
                visibility 0s linear 0.2s;
}

#hd.on .hd_bg {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    
    transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1), 
                opacity 0.3s ease-in-out, 
                visibility 0s linear 0s;
}

/* =================================================
   GNB 영역
================================================= */
#gnb {
    /* [수정] overflow: hidden 제거하여 드롭다운이 잘리지 않도록 변경 */
    position: relative;
}

#gnb>ul {
    display: flex;
    align-items: center;
}

#gnb>ul>li {
    position: relative;
	padding: 0 6px !important;
	box-sizing: border-box !important;
    z-index: 1;
}

#gnb .depth1,
#hd.on #gnb .depth1 {
    display: block !important;
    width: 14rem !important;
    min-width: 0 !important;
    padding: 12px !important;
    box-sizing: border-box !important;
}

#gnb > ul > li.active > .depth1 {
    background: var(--main-color) !important;
    border-radius: 15px !important;
}

/* 2. 마우스를 올렸을 때(호버 시) active 메뉴 배경색 */
#gnb > ul > li.active > .depth1:hover,
#gnb > ul > li.active:hover > .depth1 {
    background: rgba(0, 0, 0, 0.2) !important; 
    border-radius: 15px !important;
}

/* 1차 메뉴 호버 시 파란색 배경 박스 */
#gnb>ul>li::after {
    content: '';
    width: 100%;
    height: 36rem;
    background-color: var(--main-color);
    position: absolute;
    top: -4rem;
    left: 0;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease-in-out, visibility 0.25s;
}

#hd.on #gnb>ul>li::after {
    visibility: visible;
}

#gnb>ul>li.on::after {
    opacity: 1;
}

/* 텍스트 컬러 지정 */
#gnb>ul>li.on .depth1,
#gnb>ul>li.on .submenu_list li a {
    color: #fff !important;
}

#gnb > ul > li.active > .depth1 {
	color: #fff !important;
    font-weight: 600;
    background: rgba(0, 0, 0, 0.2);
}


#gnb .depth1 {
    display: block;
    font-size: 1.7rem;
    font-weight: 300;
    white-space: nowrap;
    color: #fff;
    padding: 0;
	min-width: 14rem;
    text-align: center;
    transition: color 0.3s ease;
}

#hd.on #gnb .depth1 {
    padding: 0rem;
    min-width: 14rem;
}

/* =================================================
2차 서브메뉴 (submenu_list)
================================================= */
#gnb .submenu_list {
    width: 100%;
    position: absolute;
    left: 50%;
    top: 5.5rem;
    z-index: 3;
    
    /* 시작 위치: X축 중앙정렬 + Y축 위로 15px 올림 */
    transform: translate(-50%, -15px);
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    
    transition: transform 0.2s ease-out, 
                opacity 0.2s ease-out, 
                visibility 0s linear 0.2s;
}

#hd.on .submenu_list {
    transform: translate(-50%, 0);
    opacity: 1;
    pointer-events: auto;
    visibility: visible;

	transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1), 
                opacity 0.3s ease-in-out, 
                visibility 0s linear 0s;
}

#gnb .submenu_list ul {
    width: 100%;
    text-align: center;
}

#gnb .submenu_list ul li {
    padding: 1.5rem 0;
}

#gnb .submenu_list ul li a {
    display: block;
    font-size: 1.5rem;
    white-space: nowrap;
    position: relative;
    color: #222;

	display: inline-block;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s ease;
}

#gnb .submenu_list ul li a:hover {
    border-bottom-color: #fff;
}

#gnb .submenu_list ul li a::before {
    display: none;
    content: "";
    width: 0.4rem;
    height: 0.4rem;
    background-color: var(--main-color);
    border-radius: 50%;
    position: absolute;
    left: -1rem;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.3s;
}

/* =================================================
우측 버튼 및 컬러 변환
================================================= */
#hd .hd_right {
    display: flex;
    gap: 2.5rem;
    align-items: center;
}

#hd .hd_right .login {
    display: block;
    width: 2.5rem;
    height: 2.5rem;
    font-size: 0;
    background: url('../img/common/ico_login.png') no-repeat;
	background-size: contain;
}

#hd .hd_right .logout {
    display: block;
    width: 2.5rem;
    height: 2.5rem;
    font-size: 0;
    background: url('../img/common/ico_logout.png') no-repeat;
	background-size: contain;
}

#hd .hd_right .ham_btn {
    display: block;
    width: 2.5rem;
    height: 2.5rem;
    background: url('../img/common/ham_btn.png') no-repeat;
	background-size: contain;
}

#hd.on,
#hd.wh {
    background-color: #fff;
}

#hd.on .logo a,
#hd.wh .logo a {
    background-image: url('../img/common/logo_bk.png');
}

#hd.on .hd_right .login,
#hd.wh .hd_right .login {
    background-image: url('../img/common/ico_login_bk.png');
}

#hd.on .hd_right .logout,
#hd.wh .hd_right .logout {
    background-image: url('../img/common/ico_logout_bk.png');
}

#hd.on .hd_right .ham_btn,
#hd.wh .hd_right .ham_btn {
    background-image: url('../img/common/ham_btn_bk.png');
}

#hd.on #gnb .depth1,
#hd.wh #gnb .depth1 {
    color: #222;
}

/* 공통 :: open */

.sitemap {
	width: 100vw;
	height: 100vh;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 15;
	opacity: 0;
	z-index: 100000;
	visibility: hidden;
	background-color: rgba(0, 0, 0, 0.3);
	transition: opacity .8s cubic-bezier(0.23, 1, 0.320, 1);
	background: url(../img/common/sitemap_bg.jpg) 100% 0% / cover no-repeat;
}

.sitemap.open {
	opacity: 1;
	visibility: visible;
}

.sitemap .st_wr {
	width: 100%;
	height: 100%;
	position: relative;
	margin-left: auto;
	margin-right: 0;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-100%) translateZ(0);
	transition: all 1.2s 0.2s ease;
}

.sitemap.open .st_wr {
	opacity: 1;
	visibility: visible;
	transform: translateY(0%) translateZ(0);
	transition: all 1.2s ease;
}

.sitemap .st_top {
	width: 100%;
	height: 10rem;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	border-bottom: solid 1px rgba(255, 255, 255, 0.15);
}

.sitemap .ham_close {
	position: absolute;
	right: 4rem;
	top: 50%;
	transform: translateY(-50%);
}

.sitemap .st_menu_row {
	position: relative;
	width: 100%;
	height: 100%;
	padding: 8rem 7.3rem 1rem;
	display: flex;
	flex-direction: row;
	justify-content: center;
}

.st_list {
	display: flex;
	width: 100%;
	height: auto;
	column-gap: 1.2rem;
}

.st_list .st_depth1 {
	position: relative;
	width: 22rem;
	margin-left: 0;
	border-bottom: none;
	overflow: hidden;
	text-align: center;
}

.st_list .st_menu_box {
	padding: 6rem 2.5rem 1rem;
	display: flex;
	background: #fff;
	border-radius: 5rem;
	height: 60rem;
	justify-content: center;
	text-align: left;
}

.st_list .st_menu_box.st_row3 {
	flex-wrap: wrap;
	justify-content: flex-start;
}

.st_list .st_menu_box.st_row3 ul {
	width: 50%;
}

.st_list .st_depth1:nth-child(1) {
	width: 11.27%;
	max-width: 20rem;
}

.st_list .st_depth1:nth-child(2) {
	width: 64.26%;
	max-width: 114rem;
}

.st_list .st_depth1:nth-child(3) {
	width: 23.11%;
	max-width: 41rem;
}

.st_list .st_depth1 .st_ttl {
	font-size: 2rem;
	font-weight: 600;
	color: #fff;
	text-transform: uppercase;
	margin-bottom: 2rem;
	opacity: 0;
	transform: translateX(-50px);
}

.st_list .st_menu_box ul {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.st_list .st_menu_box li {
	opacity: 0;
	transform: translateX(-50px);
}

.st_list .hd_title a {
	display: block;
	text-align: center;
}

.st_list .hd_title h3 {
	font-size: 2.2rem;
	font-weight: 600;
	color: var(--main-color);
	padding: 1.2rem 0;
	max-height: 5rem;
	margin-bottom: 2.5rem;
}

.st_list .st_menu_box li:not(.hd_title) a {
	display: block;
	font-size: 1.8rem;
	text-align: center;
	min-width: 18rem;
	line-height: 5rem;
	border-radius: 3rem;
	transition: all 0.4s ease-in-out;
}

.st_list .st_menu_box li:not(.hd_title) a:hover {
	color: var(--main-color);
	background: rgba(67, 101, 163, 0.1);
}

.sitemap.open .st_list .st_depth1 .st_ttl {
	opacity: 1;
	transform: translateX(0px);
	transition: transform 1s 0.8s ease, opacity 1s 0.8s ease;
}

.sitemap.open .st_list li {
	opacity: 1;
	transform: translateX(0px);
}

.sitemap.open .st_list li:nth-child(1) {
	transition: transform 1s 1.0s ease, opacity 1s 1.0s ease;
}

.sitemap.open .st_list li:nth-child(2) {
	transition: transform 1s 1.1s ease, opacity 1s 1.1s ease;
}

.sitemap.open .st_list li:nth-child(3) {
	transition: transform 1s 1.2s ease, opacity 1s 1.2s ease;
}

.sitemap.open .st_list li:nth-child(4) {
	transition: transform 1s 1.3s ease, opacity 1s 1.3s ease;
}

.sitemap.open .st_list li:nth-child(5) {
	transition: transform 1s 1.4s ease, opacity 1s 1.4s ease;
}

.sitemap.open .st_list li:nth-child(6) {
	transition: transform 1s 1.5s ease, opacity 1s 1.5s ease;
}

.sitemap.open .st_list li:nth-child(7) {
	transition: transform 1s 1.6s ease, opacity 1s 1.6s ease;
}


/* ################# header  ################# */

/* 퀵메뉴 */
.quick {
	position: fixed;
	right: 6.2rem;
	bottom: 6rem;
	z-index: 50;
	overflow: hidden;
	transition: all 0.4s;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.quick ul {
	display: flex;
	gap: 1rem;
	flex-direction: column;
}

.quick ul li a {
	display: block;
	width: 7rem;
	height: 7rem;
	border-radius: 50%;
	transition: background-image 0.5s;
	background: no-repeat center center/cover;
}

.quick ul li .naver {
	background-image: url('../img/common/quick_ico01.png');
}

.quick ul li .insta {
	background-image: url('../img/common/quick_ico02.png');
}

.quick ul li .talk {
	background-image: url('../img/common/quick_ico03.png');
}

.quick ul li .blog {
	background-image: url('../img/common/quick_ico04.png');
}

.quick ul li .youtube {
	background-image: url('../img/common/quick_ico05.png');
}

.quick ul li .naver:hover {
	background-image: url('../img/common/quick_ico01_hov.png');
}

.quick ul li .insta:hover {
	background-image: url('../img/common/quick_ico02_hov.png');
}

.quick ul li .talk:hover {
	background-image: url('../img/common/quick_ico03_hov.png');
}

.quick ul li .blog:hover {
	background-image: url('../img/common/quick_ico04_hov.png');
}

.quick ul li .youtube:hover {
	background-image: url('../img/common/quick_ico05_hov.png');
}

.quick .quick_btn {
	display: block;
	width: 7rem;
	height: 7rem;
	border-radius: 50%;
	background: no-repeat center center/cover;
	background-image: url('../img/common/quick_btn.png');
}

.quick.active .quick_btn {
	background-image: url('../img/common/quick_open.png');
}

.goTop {
	transform: scale(0);
	overflow: hidden;
	transition: all .5s cubic-bezier(0.33, 1, 0.68, 1);
}

.goTop.fix {
	height: auto;
	margin-top: 2.5rem;
	transform: scale(1);
}


/* 퀵메뉴 */

/* visual  */

.visual_sec {
	position: relative;
	background: #fff;
	overflow: hidden;
}

.vis_slide {
	overflow: hidden;
	z-index: 3;
}

.vis_slide .slide_bg {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -1;
	background: no-repeat center center/cover;
}

.vis_slide .inner {
	height: 100vh;
	padding-top: 31.5rem;
}


.visual_sec .txt_box {
	position: relative;
	color: #fff;
}

.visual_sec .tag {
	display: inline-block;
	font-size: 2rem;
	font-weight: 100;
	text-transform: uppercase;
	margin-bottom: 2.5rem;
	opacity: 0.5;
	letter-spacing: 0.13rem;
}

.visual_sec h2 {
	font-size: 5rem;
	line-height: 1.4;
}

.visual_sec h2 span {
	font-weight: 600;
	color: #ABD2F3;
}

.visual_sec .disc {
	font-size: 2.5rem;
	font-weight: 200;
	margin-top: 30px;
}

.visual_sec .line1 {
	content: "";
	display: block;
	width: 2px;
	height: 200px;
	background: url(/img/main/light_bar.png) no-repeat center/100% auto;
	margin: 3.5rem 0;
}


.visual_sec .swiper-slide-active .txt_box {
	animation: textUp 1s linear;
}

@keyframes textUp {
	0% {
		opacity: 0;
		transform: translateY(100px);
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.swiper-horizontal>.swiper-pagination-bullets {
	position: absolute;
	bottom: 28%;
	left: 10.3%;
	z-index: 10;
}

.vis-swiper-pagination .swiper-pagination-bullet{
	background: transparent;
	border: 1px solid #fff;
}

.vis-swiper-pagination .swiper-pagination-bullet-active{
	background: #fff;
}

/* 1:1 맞춤 진료 시스템 */

.sec01 {
	position: relative;
	padding: 21rem 0 10rem;
	background: url('../img/main/main_sec01_bg.jpg') no-repeat left bottom/cover;
}

.sec01 .inner {
	width: 100%;
	display: flex;
	justify-content: space-between;
	position: relative;
}

.sec01 .left_sec {
	flex-shrink: 0;
}

.sec01 .right_sec {
	display: flex;
	gap: 6rem;
}

.sec01 .right_sec ul+ul {
	margin-top: 15rem;
}

.sec01 .right_sec li+li {
	margin-top: 8rem;
}

.sec01 .right_sec .rs_box {
	transition: all 0.1s linear;

}

.sec01 .right_sec .rs_box a {
	display: block;
	border-radius: 3rem;
	padding: 3rem 2.5rem;
	max-height: 48rem;
	opacity: 0;
	transform: translateY(100px);
	transition: 1.2s;
	background: url('../img/main/main_sec01_bgimg02.png') no-repeat center center/cover;
}

.sec01 .right_sec .txt_box {
	padding: 4rem 0 2rem;
	text-align: center;
	color: #fff;
}

.sec01 .right_sec .txt_box .subject {
	font-size: 3.2rem;
	font-weight: 500;
}

.sec01 .right_sec .txt_box .disc {
	font-size: 2.2rem;
	font-weight: 200;
	margin-top: 1.5rem;
}

.sec01 .right_sec .rs_box:hover a {
	background-image: url('../img/main/main_sec01_bgimg01.png');
}

.sec01 .right_sec.aos-animate .rs_box a {
	transform: translateY(0);
	opacity: 1;
}


/* 1:1 맞춤 진료 시스템 */

/* 왜 선안과여야 하는지, 결과로 보여드립니다. */

.sec02 {
	position: relative;
	padding: 16rem 0;
	background: #000;
}

.video_wr {
	position: relative;
	max-width: 130rem;
	margin: 7.5rem auto 0;
}

.video_wr .v_img {
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
}


.video_wr .v_txt{
	position: absolute;
	transform: translate(-50%, -50%);
	z-index: 5;
	color: rgba(255,255,255,0.6);
	font-size: 2.6rem;
    line-height: 1.35;
    letter-spacing: -1.61px;
	opacity: 0;
	transition: opacity 0.5s linear;
}

.video_wr .v_txt b{
	font-weight: 300;
	color: rgba(255,255,255,1);
}

.video_wr [class*="l"] {
	text-align: right;
}

.video_wr.aos-animate .v_txt{
	opacity: 1;
}

.video_wr .l1{
	top: 16.2rem;
    left: 15.6rem;
	transition-delay: 0.5s;
}

.video_wr .l2{
    top: 39.9rem;
    left: 9rem;
	transition-delay: 0.9s;
}

.video_wr .l3{
    bottom: 8.6rem;
    left: 28.6rem;
	transition-delay: 1.3s;
}

.video_wr .r1{
    top: 16.2rem;
    right: 6.2rem;
	transition-delay: 0.7s;
}

.video_wr .r2{
	top: 39.9rem;
    right: -8.1rem;
	transition-delay: 1.1s;
}

.video_wr .r3{
    bottom: 13.1rem;
    right: 5.7rem;
	transition-delay: 1.5s;
}


.lining.ln2:after {
	animation-delay: 0.5s;
}

/* 더 선명한 진단을 위한, 선안과의 최첨단 장비 */

.sec03 {
	position: relative;
	padding: 15rem 0 16.8rem;
	background: url('../img/main/main_sec03_bg.jpg') no-repeat left bottom/cover;
}

.big_ttl {
	font-weight: 500;
	color: rgba(255, 255, 255, 0.06);
	font-size: 12rem;
	text-align: right;
	padding-right: 11.4rem;
	white-space: nowrap;
}

.e_control {
	display: flex;
	gap: 2rem;
	margin-top: 10rem;
}

.e_control button {
	display: block;
	width: 7rem;
	height: 7rem;
	background: url('/img/main/e_next.png') no-repeat center center/cover;
}

.e_control button.e_prev {
	transform: rotate(-180deg);
}

.sec03 .main_ttl_row h3 {
	font-size: 4.5rem;
}


.eq_slide .swiper-slide .item_wr {
	display: block;
	overflow: hidden;
	padding: 6.5rem 2.9rem 3.5rem;
	transition: all 0.5s ease-in-out;
	border-radius: 3rem;
	overflow: hidden;
	background: url('../img/main/main_sec03_slide_bg.png') no-repeat center center/cover;
}

.eq_slide .swiper-slide.swiper-slide-prev .item_wr {
	transform: perspective(960px) rotateY(-90deg) scale(0.8);
}

.eq_slide .swiper-slide.swiper-slide-active .item_wr {
	background-image: url('../img/main/main_sec03_slide_bgon.png');
}

.eq_slide .swiper-slide.swiper-slide-active .item_wr {
	transform: translateY(-4rem);
}

.eq_slide .swiper-slide .e_txt {
	margin-bottom: 4.4rem;
	color: #fff;
}

.eq_slide .e_txt .cetg {
	font-size: 2rem;
	font-weight: 100;
	margin-bottom: 0.8rem;
}

.eq_slide .e_txt .subject {
	font-size: 2.8rem;
	font-weight: 400;
}

.eq_row {
	display: flex;
	padding-left: 10.42%;
}

.eq_row .left {
	width: 25%;
	flex: 0 0 auto;
	padding-top: 6.95rem;
	position: relative;
}

.eq_row .left .link_motn {
	position: absolute;
	left: -16rem;
	top: -7rem;
	border-color: rgba(238, 235, 231, 0.13);
}

.eq_row .ttl42 {
	margin-bottom: 3rem;
}

.eq_row .right {
	width: 75%;
	overflow: hidden;
	padding-left: 3.33%;
	padding-top: 6.95rem;
}

.eq_row .right .eq_slide {
	padding-right: 13.33%;
	overflow: visible;
}


/* 더 선명한 진단을 위한, 선안과의 최첨단 장비 */

/* 원장님 소개 */

.sec04 {
	padding-top: 21rem;
	height: 95rem;
	background: url('../img/main/main_sec04_bg.jpg') no-repeat center center/cover;
}

.sec04 .inner {
	display: flex;
	justify-content: flex-end;
}

.doc_cont {
	min-width: 76rem;
}

.doc_cont .top {
	padding-bottom: 4.5rem;
	border-bottom: solid 1px rgba(255, 255, 255, 0.2);
}

.doc_cont .txt_box {
	color: #fff;
}

.doc_cont .main_ttl_row .subject {
	margin-bottom: 3rem;
}

.doc_cont .main_ttl_row .name {
	font-size: 2.5rem;
}

.doc_cont .main_ttl_row .name b {
	font-size: 4.5rem;
	font-weight: 500;
}

.doc_cont .bot {
	padding-top: 2.5rem;
	display: flex;
}

.doc_cont .bot ul {
	width: 50%;
}

.doc_cont .bot ul li {
	padding-left: 1.7rem;
	font-size: 1.9rem;
	font-weight: 200;
	color: #BBB;
	position: relative;
}

.doc_cont .bot ul li::before {
	content: '';
	width: 0.6rem;
	height: 0.6rem;
	border-radius: 50%;
	background-color: var(--sub-color);
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}

.doc_cont .bot ul li+li {
	margin-top: 1.2rem;
}

.doc_cont .doc_view {
	display: flex;
	justify-content: flex-end;
}

.doc_cont .doc_view a {
	display: block;
	width: 100%;
	font-size: 1.8rem;
	font-weight: 200;
	padding-top: 24rem;
	max-width: 18.1rem;
	text-align: center;
	color: #fff;
	transition: background 0.2s linear;
	background: url('../img/main/main_sec04_img01.png') no-repeat top center/100%;
}

.doc_cont .doc_view a:hover{
	background-image: url('../img/main/main_sec04_img02.png');
}

/* 원장님 소개 */

/* 둘러보기 */

.sec05 {
	position: relative;
	/* z-index: 5; */
}

.std_slide .slide_bg {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -1;
	background: no-repeat center center/cover;
}

.std_slide .inner {
	height: 90rem;
	padding-top: 22.6rem;
}

.std_slide .swiper-slide-active .main_ttl_row * {
	animation: textUp 1s linear forwards;
}

.std_slide .swiper-slide-active .main_ttl_row .tit {
	animation-delay: 0.3s;
}

.std_slide .swiper-slide-active .main_ttl_row .disc {
	animation-delay: 0.4s;
}

/* .std_slide .swiper-slide-active .slide_bg {
	animation: zoom 5s forwards;
} */

.std_slide .main_ttl_row * {
	opacity: 0;
	transform: translateY(100px);
}

.sec05>.inner {
	position: relative;
}

.a_control {
	display: flex;
	gap: 2rem;
	margin-top: 10rem;
	position: absolute;
	z-index: 3;
	left: 0;
	bottom: 22.6rem;
}

.a_control button {
	display: block;
	width: 7rem;
	height: 7rem;
	background: url('/img/main/e_next.png') no-repeat center center/cover;
}

.a_control button.a_prev {
	transform: rotate(-180deg);
}

/* 둘러보기 */

/* 머무는 시간까지 편안한 진료 공간 */

.sec06 {
	position: relative;
	background: url('/img/main/main_sec06_bg.jpg') no-repeat;
	background-size: cover;
	padding: 15rem;
}

/* .sec06 article {
	position: relative;
	width: 100%;
    padding: 15rem 0;
    border-radius: 8rem;
}

.pin-spacer {
    width: 100% !important;
    box-sizing: border-box;
}

.sec06 .cont01 {
	position: relative;
    background-color: #323232;
    z-index: 3;
	margin-top: 10rem;
}

.sec06 .cont02 {
    background-color: #212121;
    z-index: 4;
    padding-top: 23rem;
	margin: -8rem auto 0;
} */

.around_wr {
	margin-top: 5rem;
	position: relative;
	border-radius: 3.5rem;
	overflow: hidden;
}

.around_slide {
    width: 100%;
    height: 70rem;
}

.around_slide .swiper-slide figure {
    width: 100%;
    height: 100%;
	position: relative;
}

.around_slide .swiper-slide figure .place{
	width: 300px;
	height: 45px;
	background: rgba(0,0,0,0.7);
	border-radius: 0 0 20px 20px;
	font-size: 22px;
	color: #fff;
	font-weight: 500;
	text-align: center;
	line-height: 45px;

	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}

.around_slide .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.around_wr .fct_box {
	display: flex;
	align-items: center;
	position: absolute;
	bottom: 5rem;
	right: 7rem;
	gap: 1rem;
	z-index: 2;
}

.around_wr .fct_box button {
	display: block;
	width: 2rem;
	height: 2.2rem;
	background: url('../img/main/prev_10x20.png') no-repeat center center/cover;
	border: none;
    cursor: pointer;
}

.around_wr .fct_box .around_next {
	transform: rotate(-180deg);
}

.around_wr .fct_box .around_fct {
	/* width: auto; */
	display: flex;
	align-items: center;
	font-size: 2.2rem;
	font-weight: 500;
	color: #fff;
	margin-left: 1.3rem;
}

.around_wr .fct_box .around_fct .mid {
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 50%;
	background: #fff;
	margin: 0 1.2rem;
}

.around_wr .fct_box .around_fct .swiper-pagination-total {
	opacity: 0.5;
}

/* 머무는 시간까지 편안한 진료 공간 */

/* 더 가까이 전하는 선안과 커뮤니티 */

.sec07{
	position: relative;
	padding: 15rem;
	background: #212121;
}

.commu_wr {
	margin-top: 7rem
}

.comm_slide .c_tem {
	display: block;
}

.comm_slide .thumb .img {
	width: 100%;
	padding-top: 109.38%;
	background: no-repeat center center/cover;
}

.comm_slide .txtbox {
	padding-top: 3rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.comm_slide .c_tem .txtbox .tag {
	margin-bottom: 1.5rem;
	width: 10.2rem;
	height: 3.2rem;
	font-size: 1.8rem;
	font-weight: 500;
	border-radius: 5rem;
	line-height: 3rem;
	text-align: center;
	color: #fff;
	border: solid 1px #4e4e4e;
	transition: background-color 0.3s linear;
}

.comm_slide .c_tem:hover .txtbox .tag {
	background-color: #4e4e4e;
}

.comm_slide .txtbox .subject {
	font-size: 2.2rem;
	font-weight: 200;
	line-height: 1.6;
	color: #fff;
}

/* 더 가까이 전하는 선안과 커뮤니티 */

/* 선안과로 오시는 길을 안내합니다 */

.ctt_us_wr {
	position: relative;
	padding: 15rem 0 15rem;
	background: #222222;
}

.ctt_us_wr .main_ttl_row *{
	opacity: 0;
	transform: translateY(100px);
	transition: opacity 0.5s, transform 0.5s linear;
}
.ctt_us_wr.on .main_ttl_row * {
	opacity: 1;
	transform: translateY(0);
}

.ctt_us_wr.on .main_ttl_row .tit {
	transition-delay: 0.3s;
}

.ctt_us_wr .ctt_us {
	margin-top: 6rem;
	opacity: 0;
	transform: translateY(100px);
	transition: opacity 0.5s, transform 0.5s linear;
}

.ctt_us_wr.on .ctt_us {
	opacity: 1;
	transform: translateY(0);
	transition-delay: 0.6s;
}

.ctt_us {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.ctt_us_wr .add, .ctt_us_wr .add_info, .ctt_us_wr .bot{
	opacity: 0;
	transform: translateY(100px);
	transition: opacity 0.5s, transform 0.5s linear;
}

.ctt_us_wr.on .add, .ctt_us_wr.on .add_info, .ctt_us_wr.on .bot{
	opacity: 1;
	transform: translateY(0);
}

.ctt_us_wr.on .add_info{
	transition-delay:  0.8s;
}

.ctt_us_wr.on .bot{
	transition-delay:  1s;
}

.ctt_us>div {
	width: calc(50% - 3.5rem);
}

.ctt_us .map_sec {
	overflow: hidden;
	border-radius: 3rem;
}

.ctt_us .txt_sec {
	color: #fff;
}

.ctt_us .top {
	margin-bottom: 7rem;
}

.ctt_us .top .add {
	font-size: 3.2rem;
	font-weight: 500;
	margin-bottom: 2rem;
	line-height: 1.4;
}

.ctt_us .top .add_info {
	font-weight: 500;
	font-size: 2.5rem;
	color: #BFBFBF;
}

.ctt_us .top .add_info span {
	display: inline-block;
	font-size: 1.6rem;
	line-height: 2.7rem;
	color: #fff;
	padding: 0 1.3rem;
	border-radius: 1.5rem;
	background-color: #EEBF29;
	margin-right: 1rem;
}

.ctt_us .bot li+li {
	margin-top: 6rem;
}

.ctt_us .bot .ttl {
	font-size: 2.8rem;
	font-weight: 500;
	margin-bottom: 1.4rem;
	color: #898989;
}

.ctt_us .gid_box {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
}

.ctt_us .bot dl {
	display: inline-flex;
	flex-wrap: wrap;
	font-size: 2.2rem;
	row-gap: 1.5rem;
	column-gap: 2.5rem;
	color: #fff;
}

.ctt_us .bot dl dt {
	width: 9.3rem;
	display: flex;
	justify-content: space-between;
	padding-left: 1.5rem;
	position: relative;
}

.ctt_us .bot dl dt::before {
	content: '·';
	font-size: 2.2rem;
	color: #fff;
	font-weight: 600;
	position: absolute;
	top: 0;
	left: 0;
}

.ctt_us .bot dl dd {
	width: calc(100% - 11.8rem);
	color: #BFBFBF;
	font-weight: 300;
	letter-spacing: -5%;
}

.ctt_us .bot .dl_desc {
	font-size: 2rem;
	font-weight: 100;
	line-height: 1.4;
	color: #888;
}

.ctt_us .link_box {
	display: flex;
	gap: 1rem;
	margin-top: 3rem;
}

.ctt_us .link_box a {
	display: block;
	width: 6.5rem;
}

.ctt_us .call_info {
	font-size: 3.5rem;
	font-weight: 600;
}

#sb_map .root_daum_roughmap .wrap_controllers {
	display: none;
}

#sb_map .root_daum_roughmap .cont .section_address {
	display: none;
}

/* 선안과로 오시는 길을 안내합니다 */

/* Footer */

#ft {
	padding: 7em 0;
	border-top: solid 1px #323232;
	background: #222222;
}

#ft .inner162 {
	display: flex;
	justify-content: space-between;
}

#ft .ft_logo {
	display: block;
	width: 24.2rem;
	height: 3.3rem;
	margin: 4.8rem 0 0 auto;
	background: url('/img/common/ft_logo.png') no-repeat center center/cover;
}

.ft_right ul {
	display: flex;
	gap: 3rem;
	justify-content: flex-end;
}

.ft_right ul li a {
	display: block;
	font-size: 1.6rem;
	font-weight: 200;
	color: #848484;
}

#ft address dl {
	display: flex;
	line-height: 1.5;
}

#ft address dl dt {
	position: relative;
}

#ft address dl dd {
	position: relative;
	padding-left: 1.2rem;
}

#ft address dl dd::before {
	content: ':';
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0.4rem;
}

#ft address dl dd+dt {
	padding-left: 1.5rem;
	margin-left: 1.5rem;
}

#ft address dl dd+dt::before {
	content: '|';
	font-size: 1.6rem;
	font-weight: 200;
	position: absolute;
	color: #848484;
	opacity: 0.4;
	top: 0;
	left: 0;
	color: #DDD;
}

#ft address * {
	font-size: 1.6rem;
	line-height: 1.9;
	color: #848484;
	opacity: 0.8;
}

#ft .copy {
	margin-top: 1.5rem;
	text-transform: uppercase;
	color: #525252;
}

/* cursor */

[id*="circle_"] {
	position: fixed;
	left: 0;
	top: 0;
	pointer-events: none;
	z-index: 1000;
}

.cursor {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1rem;
	width: 0;
	height: 0;
	border-radius: 50%;
	transition: all 0.3s;
	transform: translate(-50%, -50%);
	position: relative;
}

.cursor.on {
	width: 14.9rem;
	height: 14.9rem;
}

#circle_e .cursor.on {
	width: 18rem;
	height: 18rem;
}
/* cursor */

/* pop-up */
.main_popup_wrap{
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	display: none;
    justify-content: center;
    align-items: center;
}

.main_popup {
    position: relative;
    z-index: 10;
    width: 100%;
    max-width: 1300px;
}

.popup_swiper .swiper-slide .img{
	width: 100%;
	border-radius: 2rem;
	overflow: hidden;
	position: relative;
}

.popup_swiper .swiper-slide .img img{
	width: 100%;
}

.main_popup .btn_wrap{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 12px;
	padding-bottom: 20px;
	cursor: pointer;
}

.main_popup .btn_wrap .pop-swiper-button-prev{
	display: block;
	width: 40px;
	height: 40px;
	background: url('/img/main/popup_prev.png') no-repeat;
	background-size: contain;
}

.main_popup .btn_wrap .pop-swiper-button-next{
	display: block;
	width: 40px;
	height: 40px;
	background: url('/img/main/popup_next.png') no-repeat;
	background-size: contain;
}

.pop_bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #fff;
    font-size: 17px;
    margin-top: 10px; /* 슬라이드와의 간격 */
}

/* 오늘하루 그만보기 체크박스 레이아웃 */
.pop_bottom .today_close{
	display: flex;
	align-items: center;
	gap: 5px;
}

.pop_bottom .today_close .chk_today {
    pointer-events: none;
}

.pop_bottom .today_close input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 20px;
    height: 20px;
    border: 1.5px solid #fff;
    border-radius: 50%;    
    outline: none;
    cursor: pointer;
    position: relative;
    transition: all 0.2s ease;
    background-color: transparent;
}

.pop_bottom .today_close input[type="checkbox"]::after {
    content: '';
    position: absolute;
    top: 45%;
    left: 50%;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 1px 1px 0;
    transform: translate(-50%, -50%) rotate(45deg);
    transition: border-color 0.2s ease;
}

.pop_bottom .today_close input[type="checkbox"]:checked {
    background-color: #fff;
}

.pop_bottom .today_close input[type="checkbox"]:checked::after {
    border-color: #222;
}

/* 닫기 버튼 스타일 */
.pop_bottom .btn_close {
    background: none;
    border: none;
    color: #fff;
    font-size: 17px;
    cursor: pointer;
    padding: 0;
    transition: opacity 0.2s;
}

.main_popup_bg{
	top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    background: rgba(0, 0, 0, .65);
}
/* pop-up */