@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css); 
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 100;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'),
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'),
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'),
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'),
      url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');
}
@font-face {`
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 400;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');
 }
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 500;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');
 }
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 700;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');
 }
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 900;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'),
        url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype');
 }

@font-face {
    font-family: 'Pretendard-Regular';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
/* 공통 HTML 기본 코드 선언 */
body,html							{ color:#565656; font-family:"Noto Sans KR"; font-weight:300; font-size:16px; }
body								{ overflow-x: hidden; }
img								{ border:0; }
ul,ol,dl							{ list-style:none; }
li,ul,ol,dl							{ margin:0; padding:0; }
a:link								{ color:#4f4f4f; text-decoration:none; font-weight:normal; }
a:visited							{ color:#4f4f4f; text-decoration:none; font-weight:normal; }
a:hover							{ color:#4f4f4f; text-decoration:none; font-weight:normal; outline:none; }
a:focus							{ color:#4f4f4f; text-decoration:none; font-weight:normal; outline:none; }
a:active							{ color:#4f4f4f; text-decoration:none; font-weight:normal; outline:none; }

/* 기본 변수 선언 */
:root								{ --major_color:#1b325e; --major_color2:#d86da3; --max_width:100%; }


/* 공통 Class 기본 코드 선언 */
.no-padding							{ padding: 0 !important; margin: 0 !important; }
.max_width							{ width:100%; max-width:var(--max_width); }
.img								{ max-width:100%; height:auto; }
.img_max							{ width:100%; }
.margin_auto						{ margin:0 auto; }
.major_color							{ color: var(--major_color) }
.major_color2						{ color: var(--major_color2) }

.fade-edge {
  -webkit-mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent);
  mask-image: linear-gradient(to right, transparent, black 15%, black 85%, transparent);
}


/*  기본 레이아웃 코드 선언 */
#wrapper							{ width:100%; }


/* 상단 영역 및 메뉴 */
#top								{ position:fixed; width:100%; z-index:100; background-color:#fff; box-shadow: 0px 5px 10px #aaa; }
#top_space							{ height:170px; }


/* 메뉴 */
.mega-menu-transition					{ transition: all 0.3s ease-in-out; }
.hide-menu							{ opacity: 0; visibility: hidden; transform: translateY(-10px); }
.show-menu							{ opacity: 1; visibility: visible; transform: translateY(0); }
.overlay-hidden						{ opacity: 0; visibility: hidden; transform: translateY(-20px); transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
.overlay-visible						{ opacity: 1; visibility: visible; transform: translateY(0); transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
.header-top							{ display: flex; justify-content: space-between; align-items: center; padding: 20px 40px; border-bottom: 1px solid #f0f0f0; }
.logo h1							{ font-size: 24px; font-weight: 700; display: inline-block; margin-right: 10px; }
.logo .sub-logo						{ font-size: 11px; color: #888; letter-spacing: 1px; }
.contact-info, .cert-info					{ font-size: 13px; color: #666; }
.cert-info							{ text-align: right; line-height: 1.4; }
	



/* 인사말 */
#greeting							{ width:100%; margin-top:100px; margin-bottom:50px;  }

/* 의료진소개 */
#doctors							{ width:100%; padding-top:80px; }

/* 특별함 */
#special							{ width:100%; margin-top:100px; margin-bottom:50px; }
.special-section						{ margin-top: 0px; padding: 0px 0 0px 0; position: relative; }
.tab-wrapper						{ width: 100%; text-align: center; z-index: 20; }
.special-tabs						{ display: inline-flex; list-style: none; padding: 15px 70px; margin: 0; background-color: #ffffff; border-radius: 50px; border: 1px solid #003a8c; }
.special-tabs li						{ padding: 12px 35px; font-weight: bold; color: #333333; background-color: transparent; border-radius: 50px; cursor: pointer; transition: all 0.3s ease; }
.special-tabs li.active					{ background-color: #0045a0; color: #ffffff; }
.specialSwiper						{ width: 100%; overflow: hidden; position: relative;}
.specialSwiper .swiper-slide				{ width: 100% !important; display: flex; justify-content: center; }
.specialSwiper .swiper-slide img{ max-width: 100%; height: auto; }
/* Dot (Pagination) 스타일 - 데스크탑 기본 */
.special-pagination {
    position: absolute;
    bottom: 25% !important;
    right: 35% !important;
    width: auto !important;
    left: auto !important;
    text-align: right;
    z-index: 10;
    display: flex;
    align-items: center;
}

.special-pagination .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    background-color: #999;
    opacity: 0.6;
    margin: 0 5px !important;
    border-radius: 50%;
    transition: all 0.3s ease;
}

.special-pagination .swiper-pagination-bullet-active {
    width: 10px;
    height: 10px;
    background-color: transparent;
    border: 2px solid #333;
    opacity: 1;
}

/* 모바일 분기 스타일 */
@media (max-width: 1024px) {
    .special-tabs               { display: flex; flex-wrap: wrap; border-radius: 0px; width: 100%; padding: 0; justify-content: space-between; transform: translateY(-50%); }
    .special-tabs li            { flex: 0 0 auto; padding: 20px 15px; border-radius: 0; font-size: 14px; }

    /* 모바일: 슬라이드 컨테이너 하단에 점(Dot)이 들어갈 여백 생성 */
    .specialSwiper {
        padding-bottom: 40px !important;
    }

    /* 모바일: 생성된 하단 여백 위치로 점(Dot) 이동 (이미지와 겹침 방지) */
    .special-pagination {
        right: 50% !important;
        transform: translateX(50%);
        bottom: 0px !important;
    }
}




/* 통증치료센터 */
#pain								{ }
.pain-section						{ margin-top: 60px; padding: 0px 0 0px 0; position: relative; }

.tab-wrapper						{ width: 100%; text-align: center; z-index: 20; }

.pain-tabs							{ display: inline-flex; list-style: none; padding: 15px 70px; margin: 0; background-color: #ffffff; border-radius: 50px; border: 1px solid #003a8c; }
.pain-tabs li							{ padding: 12px 35px; font-weight: bold; color: #333333; background-color: transparent; border-radius: 50px; cursor: pointer; transition: all 0.3s ease; }
.pain-tabs li.active					{ background-color: #0045a0; color: #ffffff; }

.painSwiper							{ width: 100%; overflow: hidden; }
.painSwiper .swiper-slide				{ width: 100% !important; display: flex; justify-content: center; }
.painSwiper .swiper-slide img				{ max-width: 100%; height: auto; border-radius: 20px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3); }

@media (max-width: 768px) {
	.pain-tabs						{ display: flex; flex-wrap: wrap; border-radius: 0px; width: 100%; padding: 0; justify-content: space-between; transform: translateY(-50%); }
	.pain-tabs li						{ flex: 0 0 auto; padding: 20px 15px; border-radius: 0; font-size: 14px; width:33.3%; }
}


/* 자세교정 센터 */
#posture							{  }
.posture-section						{ padding: 80px 0; }
.posture-section .header-area				{ display: flex; align-items: flex-end; margin-bottom: 30px; }
.posture-btn							{ width: 45px; height: 45px; border-radius: 50%; border: 1px solid #ddd; background-color: #fff; color: #666; margin-left: 5px; transition: all 0.3s; }
.posture-btn:hover						{ border-color: #0045a0; color: #0045a0; }

.posture-tabs						{ display: flex; list-style: none; padding: 0; margin: 0 0 40px 0; border: 1px solid #eee; }
.posture-tabs li						{ flex: 1; text-align: center; padding: 15px 5px; color: #333; border-right: 1px solid #eee; cursor: pointer; transition: background-color 0.3s, color 0.3s; word-break: keep-all; }
.posture-tabs li:last-child				{ border-right: none; }
.posture-tabs li.active					{ background-color: #0045a0; color: #fff; font-weight: bold; }

.postureSwiper						{ overflow: hidden !important; padding: 0 !important; }
.postureSwiper .swiper-slide				{ opacity: 0.3; transition: opacity 0.4s ease; }
.postureSwiper .swiper-slide img			{ width: 100%; height: auto; display: block; }
.postureSwiper .swiper-slide.swiper-slide-active{ opacity: 1; }

@media (min-width: 768px)				{
	.postureSwiper .swiper-slide.swiper-slide-next { opacity: 1; }
}

@media (max-width: 768px) {
	.posture-section .header-area			{ display: block; }
	.nav-buttons					{ margin-top: 15px; text-align: left; }
	.posture-tabs					{ flex-wrap: wrap; }
	.posture-tabs li					{ width: 33.33%; flex: none; border-bottom: 1px solid #eee; }
}	 


/* 장비소개 */
#equipment							{ width:100%; margin-top:100px; margin-bottom:100px;  }

/* 커뮤니티 */
#notice							{ width:100%; margin-top:100px; margin-bottom:50px;  }

/* 진료시간 */
#clinicTime							{ width:100%; padding-top:80px; padding-bottom:50px; padding-left:20px; padding-right:20px; background-image:url('/images/clinictime-bg.gif');background-position:0% 0%; background-repeat:no-repeat; background-size:100%;}

/* 둘러보기 */
#interior							{ width:100%; background-image:url('/images/interior-bg.jpg');background-position:50% 50%; background-repeat:no-repeat; background-size:100% 100%; background-color:#fff}



/* 오시는길 */
#location							{ background-position:center; background-size:100% 100%;height:100%;width:100%; padding-top:100px; }

/* 하단 */
#bottom							{ background-color:#05070c;  color:#fff;   padding:50px 0px; display:inline-block;  width:100%; }
#bottom a:link						{ color:#fff; text-decoration:none; font-weight:normal; }
#bottom a:visited						{ color:#fff; text-decoration:none; font-weight:normal; }
#bottom a:hover						{ color:#fff; text-decoration:none; font-weight:normal; outline:none; }
#bottom a:focus						{ color:#fff; text-decoration:none; font-weight:normal; outline:none; }
#bottom a:active						{ color:#fff; text-decoration:none; font-weight:normal; outline:none; }

/* 모바일 하단 메뉴 */
#mobile_bottom_menu					{ position:fixed; bottom:0px; z-index:1000; }
#mobile_bottom_icon					{ width:100%; }
.mobile_bottom_icon					{ width:14.28%; }
.mobile_bottom_icon	img				{ width:100%; }

/* 퀵메뉴 */
#quickScrollMenu						{ position: absolute; width: 70px;	 right: 30px; top: 400px; color: #fff; z-index:10; }
.tooltip-arrow::after					{ content: ''; position: absolute; top: 50%; right: -4px; transform: translateY(-50%); border-width: 5px 0 5px 5px; border-color: transparent transparent transparent #1f2937; /* Tailwind gray-800 */ }

/*
opacity: 0.95;
filter: alpha(opacity=95);
*/ /* For IE8 and earlier */