@charset "utf-8"; /*-----공통-----*/

/* noto , open sans */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100; 300; 400; 500; 700; 900&family=Open+Sans:wght@300; 400; 500; 600; 700; 800&display=swap');/* G마켓산스 */
@font-face { font-family: 'GmarketSansLight'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff'); font-weight: normal; font-style: normal; } 
@font-face { font-family: 'GmarketSansMedium'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff'); font-weight: normal; font-style: normal; } 
@font-face { font-family: 'GmarketSansBold'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff'); font-weight: normal; font-style: normal; } 

/* 프리텐다드 */
@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; } 

/* Fontawesome 4.7 */
@import url('https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css');

body { font-family: 'GmarketSansMedium'; } 

.inner { width: 100%; max-width: 1400px; margin: auto; } 


/* 메인 */
.swiper-container.swiper1.swiper-initialized.swiper-horizontal.swiper-backface-hidden { overflow: hidden; } 
.main_content img { width: 100%; height: 100%; } 
.main_text { position: absolute; top : 40%; left : 15%; line-height: 3.5rem; } 
.main_text span { font-size: clamp(1.8rem, 5vw, 4rem); font-family: 'GmarketSansLight'; } 
.main_text p { color : #F68A23; font-size: clamp(1rem, 5vw, 3.5rem); font-family: 'GmarketSansBold'; margin-bottom: 0.5rem } 
.main_text p em { color : #1F5E99; } 
.main_text a { width: 57%; color : #FF8B1C; border : 1px solid #F9DBBA; font-size : clamp(.5rem, 1vw, 1.25rem); border-radius: 30px; background-color : #FFFFFF; } 
/* 메인 */
 /*.main_wrap { display:flex; } 
 .main { width:70%; } 
 .swiper1 { overflow:hidden; } 
 .pop { width:30%; }*/ 



/* intro */
.intro { margin-bottom: 5%; border-radius: 0 0 150px 150px; background: url(/camcimg/main/intro_bg1.png) no-repeat bottom center / cover; } 
.intro_bg { position: relative; } 
.intro_inner { display: block; padding: 60px 0; } 

/* 진료과안내 */
.medical h3 { font-size : 1.63rem; padding: 3rem 0 2rem 0; color:#212121; } 
.medical p { font-size : 1.63rem; padding: 3rem 0 2rem 0; color:#212121; } 
.medical_content ul { display : grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); width : 100%; gap: 0.5rem; } 
.medical_content ul li a { display: block; transition : all .3s; font-size : 1.06rem; height: 60px; line-height: 60px; text-align: center; color: #777777; border: 1px solid rgba(0, 0, 0, .16); border-radius: 5px; background-color: #ffffff; font-family: 'Noto Sans KR', sans-serif; transition: .3s ease-in-out; } 
.medical_content ul li a:hover { background: linear-gradient(to right, #1F5E99, #3EA28F); color: #FFFFFF; } 

/* 휴진안내 */
.pop { display: flex; height: auto; justify-content: space-between; } 
.pop_con01 { width : 100%; border: 20px solid #236797; box-sizing: border-box; background-color: #ffffff; border-radius: 5px; } 
.pop_con01 ul { padding: 2rem; } 
.pop_con01 ul p { display: inline-block; width: calc(100% / 2); color:#236797; margin-bottom: 1rem; } 
.pop_con01 ul p:first-child { display: block; font-size: 1.25rem !important; } 
.pop_con01 ul li { color:#777777; font-family: 'GmarketSansMedium'; line-height: 1.2rem; } 
.pop_con01 ul li span { font-size: 0.9rem !important; line-height: 1.4rem;} 
.pop_con01 table { width: 100%; } 
.pop_con01 ul li p > span{font-family: 'GmarketSansMedium'!important;}

@media(max-width:550px) {.medical_content ul { display: flex; flex-wrap: wrap; } 
.pop_con01 ul > p { display: block; font-size: 1.5rem; color:#236797; margin-bottom: 1rem; } 
.medical_content ul li { display: block; width: calc(100% / 2 - 4px); } 
.pop_con01 table span { font-size: 12px !important; line-height: 14px; } 

.pop_con01 ul p { margin-bottom: 5px; width:100%; font-size: 1.1rem; } 
 }

/* popup */
.pop_con02 { width : 49%; text-align: center; } 
.swiper2 { border-radius: 5px; overflow: hidden; } 
.swiper-pagination-fraction { bottom: 0%; right:5%; left: auto; width: 10%; font-size: 0.75rem; font-family: 'Open Sans', sans-serif; display: flex; line-height: 0; } 
span.swiper-pagination-current { font-weight: bold; } 
 .swiper-slide img { width:100%; } 
span.swiper-pagination-total { color: #999999; } 
.page { height: 30px; width: 49%; position: absolute; } 
.swiper2 .swiper2-button-prev { transform: scale(-1); } 
.pop_btn { height: 7%; width: 7%; position: absolute; right:1%; bottom: 10px; } 
.pop_btn .swiper2-button-next,.pop_btn .swiper2-button-prev { border-radius: 0 20% 20% 0; display: flex; justify-content: center; align-items: center; position: relative; width: 25px !important; height: 24px !important; background-color:#FFFFFF; border: 1px solid #DCDCDC; cursor: pointer; } 
.pop_btn .swiper2-button-next { right: -50% !important; top: 0% !important; } 
.pop_btn .swiper2-button-prev { transform: scale(-1); top: 0% !important; position: absolute; left: 0; } 
.swiper2-button-prev, .swiper-rtl .swiper2-button-next { left: auto !important; } 
.pop_btn .swiper2-button-next > img , .pop_btn .swiper2-button-prev > img { width : 4px; } 
.swiper-pagination-bullet { width: 8px; height: 8px; background: transparent; background-color: rgba(0, 0, 0, .2); opacity: 1; } 
.swiper-pagination-bullet-active { width: 40px; transition: width .5s; border-radius: 30px; background: #F68A23; border: 1px solid transparent; } 
.swiper-pagination2.swiper-pagination-clickable.swiper-pagination-bullets.swiper-pagination-horizontal { bottom: 0%; left: 0%; position: absolute; display: flex; } 

/* intro */

/* 참여마당 */

.sec01_inner { position: relative; display: block; margin: 5rem auto; } 
.sec01_top { margin-bottom: 40px; display: flex; justify-content: space-between; align-items: center; } 
.sec01_title { display:flex; align-items: flex-end; gap: 1.2em; } 
.sec01_title h3 { font-size: clamp(1em, 2.5vw, 1.63em); color:#212121; } 
.sec01_tab { width: 25%; } 
.sec01_tab ul { display: flex; justify-content: space-between; transition: .3s; } 
.sec01_tab ul li { cursor: pointer; font-size: clamp(0.8rem, 2.5vw, 1.25rem); font-family: 'Noto Sans KR', sans-serif; color:#666666; } 
.tab_title.on { color: #1F5E99; font-weight: bold; position: relative; } 
.tab_title.on::before { content: ''; width: 130%; height: 5px; position: absolute; bottom: -70%; left: 50%; transform: translate(-50%,-50%); background-color: #1F5E99; border-radius: 0 0 10px 10px; } 
.tab01 { width: 100%; margin: auto; } 
.swiper3 { width: 93%; overflow: hidden; } 
.tab_text { width: 100%; font-family: 'Noto Sans KR', sans-serif; } 
.tab_text img { width: 100%; max-height: 312px; border: 1px solid #E9E9E9; } 
.swiper3-button-next,
.swiper3-button-prev { width: 60px !important; height: 60px !important; border: 1px solid #565656; border-radius: 50%; display: flex; justify-content: center; align-items: center; position: absolute; cursor: pointer; } 
.swiper3-button-next { right: 0% !important; top: 35% !important; } 
.swiper3-button-prev { transform: scale(-1); right: 0% !important; top: 55% !important; } 
.swiper3-button-prev, .swiper-rtl .swipe3-button-next { left: auto !important; } 
.swiper-button-next::after, .swiper-button-prev::after { display: none; } 
.tab_text { padding: 0.5rem; } 
.tab_text p { margin: 20px 0; height: 1.2rem; color:#333333; display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } 
.tab_text span { font-size: clamp(0.8rem, 2.5vw, 1rem); font-family: 'Open Sans', sans-serif; color : #565656; } 




/* 이용안내 */

.useinfo_inner { margin-bottom: 5%; } 
.cheonan { display: flex; justify-content: space-between; } 
.cheonan_bg { width: 97%; position: relative; } 
.cheonan_bg img { width: 100%; } 
.cheonan_bg::after { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: rgba(0, 0, 0, .5); border-radius: 5px; } 
.useinfo , .tel { width: 100%; color: #FFFFFF; position: relative; display: flex; } 
.cheonan_text { width: 100%; height: 100%; position: absolute; top: 0; left: 0; box-sizing: border-box; display: flex; } 
.cheonan_title { padding: 3rem; box-sizing: border-box; flex: 0 0 40%; } 
.cheonan_title p { font-size: clamp(1.5rem, 2.5vw, 2.13rem); font-family: 'GmarketSansLight'; } 
.cheonan_title p em { font-size: clamp(1.88rem, 2.5vw, 2.63rem); font-style: normal; font-family: 'GmarketSansBold'; } 
.cheonan_content { width: 100%; display: flex; box-sizing: border-box; align-items: flex-end; } 
.cheonan_content ul { width: 100%; height: 65%; display: flex; flex-direction: column; justify-content: space-between; padding-bottom: 2rem; } 
.cursor li { font-size: clamp(0.8rem, 2.5vw, 1.25rem); } 
.cheonan_content ul li { font-family: 'Noto Sans KR', sans-serif; height: 100%; font-size: clamp(0.8rem, 2.5vw, 1.25rem); position: relative; display: flex; justify-content: space-between; align-items: center; font-weight: 500; padding: 1rem; box-sizing: border-box; border-bottom: 1px solid rgba(255, 255, 255, .6); } 
.cheonan_content ul li em { font-family: 'Open Sans', sans-serif; font-style: normal; color: #FFE72E; font-size: clamp(0.8rem, 2.5vw, 1.25rem); margin-right: 30px; } 

@media(max-width:520px){
 .tab_text img { height: 100px; } 
 }


/* 배너 */
.banner_inner { padding: 2rem 0; width: 100%; border-top: 1px solid #DCDCDC; display: flex; align-items: center; margin-bottom: 0; overflow: hidden; } 
.banner { height: 100%; margin: auto; display: flex; justify-content: start; position: relative; } 
.banner_slide { display: flex; align-items: center; justify-content: space-between; width: 100%; max-width: 1400px; } 
.banner_slide > div { width: 120px; } 
.banner_slide > div a { display: flex; align-items: center; height: 100%; } 

@media(max-width:1400px){
 .banner_slide { flex-wrap: wrap; } 
 }
@media(max-width:800px){
 .banner_slide > div { width: 25%; } 
 }
@media(max-width:520px){
 .banner_slide { justify-content: start; } 
.banner_slide > div { margin: 10px auto; height: 40px; } 

.banner_inner { padding: 1rem; } 
 }

/* footer */
footer { width:100%; border-top: 1px solid #DCDCDC; } 
.footer_inner { width: 100%; max-width: 1400px; display: flex; align-items: center; color: #596069; margin: auto; padding: 60px 0; box-sizing: border-box; } 
.footer_left { width: 50%; display: flex; flex-direction: column; justify-content: space-between; } 
.footer_left .logo { width: 150px; } 
.footer_left .logo a { display: block; } 
.footer_left .logo a img { width: 100%; } 
.menu { box-sizing: border-box; padding: 2rem 0; } 
.menu a { color: #596069; font-size: clamp(0.8rem, 2.5vw, 0.88rem); padding: 0.5rem; display: inline-block; text-align: left; font-family: 'Pretendard-Regular'; } 
.menu a.point { color: #0000ff; } 
.link { display: flex; align-items: center; } 
.webmark { margin-right: 40px; } 
.copyright { padding: 2rem 0; box-sizing: border-box; } 
.copyright p { font-size: clamp(0.8rem, 2.5vw, 0.88rem); font-family: 'Open Sans', sans-serif; } 
.footer_right { width: 50%; display: flex; flex-direction: column; justify-content: space-between; font-family: 'Pretendard-Regular'; } 
.company_content p { font-family: 'Pretendard-Regular'; } 
.company { padding-bottom: 4rem; } 
.ft_title { font-family: 'Open Sans', sans-serif; font-size: clamp(0.8rem, 2.5vw, 0.88rem); color: #333333; margin-bottom: 20px; font-weight: bold; } 
.company_content { display: flex; } 
.company_content p , .customer_content p { font-size: clamp(0.8rem, 2.5vw, 0.88rem); padding: 5px; box-sizing: border-box; } 
.company_content p span , .customer_content p span { font-size: clamp(0.8rem, 2.5vw, 0.88rem); color: #333333; padding: 0 10px; } 
.customer_content { display: flex; } 


@media(max-width:1640px) { /* main */
 .main_text { line-height: 3rem; } 
 }


@media(max-width:1460px) { /* header */
li.font_size { display: none; } 
li.logIn_hide { display: none; } 

/* main */
.main_text span { font-size: clamp(1.8rem, 3.5vw, 4rem); } 
.main_text p { font-size: clamp(1rem, 3.1vw, 3.5rem); } 
.main_text { line-height: 2.5rem; } 
.main_wrap { display:block; } 
.main { width:100%; } 
.pop { width:100%; } 
 
 
 /* intro */

/* 진료과안내 */
.intro_inner { top: 11% } 

/* 참여마당 */
 .swiper3 { width: 93%; } 
 }


@media(max-width:1206px) { /* main */
.main_text { top: 34%; } 
/* intro */
.intro_inner { top: 8%; } 
/* popup */
.pop_btn { right: 2%; width: 8%; } 
.swiper-pagination-fraction { right: 10%; } 

/* 이용안내 */
.cheonan_content ul a { height : 100%; } 
.cheonan_content ul li { font-size: clamp(0.8rem, 2.5vw, 1rem); } 
.cheonan_content ul li em { font-size: clamp(0.8rem, 2.5vw, 1rem); } 
 }


@media(max-width:1080px) { /* main */
.main_text p { margin-bottom: 0; } 
 }



/* intro */
.intro_inner { top: 4%; } 

/* popup */
.pop_btn { width: 9%; } 

 /* 참여마당 */
 .sec01_tab { width: 30%; } 
 .swiper3-button-next , .swiper3-button-prev { width: 50px !important; height: 50px !important } 
 /* .swiper3-button-next { top: 35% !important; } 
 .swiper3-button-prev { top: 55% !important; }  */
 .swiper3-button-next { top: 30% !important; } 
 .swiper3-button-prev { top: 60% !important; } 
  /* 2024-06-05 added */
  .sec01_inner .btn-autoplay { width: 50px; height: 50px; border: 1px solid #565656; border-radius: 50%; display: flex; justify-content: center; align-items: center; cursor: pointer; position: absolute; right: 0; top: 45%; } 

 /* 이용안내 */
.cheonan_bg { height: 300px; } 
.cheonan_bg img { height: 100%; object-fit: fill; } 
.cheonan_text { flex-direction: column; } 
.cheonan_title { padding: 2rem; } 
.cheonan_content { height: 100%; justify-content: end; } 
.cheonan_content ul { width: 80%; height: 80%; } 
.cheonan_content ul li { width: 100%; padding: 0; } 
.btn .swiper_button_next { right: 12% !important; } 
.btn .swiper_button_prev { right: 12% !important; } 

 /* footer */
.menu { flex-wrap: wrap; } 
 }


@media(max-width:1036px) {/* intro */
.intro_inner { top: 5%; } 
}



@media(max-width:898px) { /* main */
 .main_text { line-height: 1.8rem; } 
 .main_text span { font-size: clamp(1rem, 3.5vw, 4rem); } 
 .main_text p { font-size: clamp(1rem, 3vw, 3.5rem); } 
/* intro */
.intro_bg { background: none; } 
.intro_inner { background-color: #F4F2ED; padding-bottom: 4rem; padding-top: 4rem; top: -3%; } 

/* 휴진안내 */
.pop_con01 ul li { font-size: clamp(.8rem, 2.5vw, 1rem); line-height: 2rem; } 
 }


@media(max-width:768px) {ul.option { display: none; } 

 /* intro */
 .pop { flex-direction: column; } 
 .pop_con01 { width: 100%; } 
 .pop_con01 tr { display: flex; flex-wrap: wrap; } 
 .pop_con01 tr, .pop_con01 td { width: 100% !important; } 
 .pop_con01 td { display: block !important; height: 2rem !important; } 

 .pop_con02 { width: 100%; margin-top: 3rem; } 
 .intro_inner { position: static; transform: translateX(0%); padding-top: 3rem; } 
 .intro_bg { height: 100%; } 

/* popup */
.page { width: 100%; } 
.pop_btn { width: 6%; } 
.pop { height: auto; } 


 /* 참여마당 */
 .sec01_inner { margin-top: 3rem; } 
 .sec01_tab { width: 40%; } 
 .cheonan_text { flex-direction: row; padding: 0px; } 
 .swiper3 { width: 90%; overflow: hidden; } 

 /* 이용안내 */
 .useinfo { margin-bottom: 30px; } 
 .cheonan_title { padding: 3rem; flex: 0 0 40%; } 
 .cheonan { flex-direction: column; } 
 .cheonan_content { display: flex; align-items: flex-end; flex: 0 0 59% } 
 .cheonan_content ul { height: 50%; } 
 .cheonan_content ul li { padding: .3rem; font-size: clamp(0.9rem, 2.5vw, 1.25rem); } 
 .cheonan_bg { width: 100%; position: relative; } 
 .cheonan_content ul li em { font-size: clamp(0.9rem, 2.5vw, 1.25rem); } 

 /* footer */
 .footer_inner { box-sizing: border-box; flex-direction: column; justify-content: space-between; } 
 .footer_left { width: 100%; } 
 .footer_right { width: 100%; } 
 .company_content { flex-direction: column; } 
 .company { padding-bottom: 2rem; } 
 }


@media(max-width:696px) { /* header */
.header_top li { margin-right: 0.5rem; } 

/* main */
 .main_text { line-height: 1.5rem; } 

}


@media(max-width:526px) { /* intro */

/* popup */
.pop_btn { width: 9%; } 


/* 참여마당 */
 .swiper3-button-next , .swiper3-button-prev, .btn-autoplay { width: 40px !important; height: 40px !important; } 

 
/* 알림마당 sns */ 
 .sns >img { width: 26px !important; height: 26px !important; } 
 .sec01_title { align-items: center; } 
 }




@media(max-width:480px){
 .header_top li { margin: 0rem; } 

/* main */
.main_text { line-height: 1.2rem; } 



 /* 참여마당 */
 .sec01_tab { width: 45%; } 
 .cheonan_text { flex-direction: column; padding: 1rem; } 
 .swiper3 { width: 85%; overflow: hidden; } 
 .swiper3-button-next { right: 3% !important; } 
 .swiper3-button-prev { right: 3% !important; } 
 .btn-autoplay { right: 3% !important; } 

 /* 이용안내 */
 .useinfo { margin-bottom: 30px; } 
 .cheonan_title { padding: 1rem; flex: 0 0 40%; padding-right: 0; } 
 .cheonan { padding: 1rem; flex-direction: column; } 

 .cheonan_content { display: flex; flex: 0 0; align-items: flex-start; } 
 .cheonan_content ul { height: 50%; width: 100%; } 
 .cheonan_content ul li { padding: .8rem; font-size: 1rem; } 
 .cheonan_bg { width: 100%; height: 260px; position: relative; } 

 /* 배너 */
 .swiper4 { width: 88%; } 
 .btn .swiper_button_next { right: -8% !important; } 
 .btn .swiper_button_prev { transform: scale(-1); right: -8% !important; } 
 .swiper-slide a img { width: 90%; } 
 .btn { margin-left: 0rem; } 

 /* footer */
 .footer_inner { padding: 1rem; box-sizing: border-box; flex-direction: column; justify-content: space-between; } 
 .footer_left { width: 100%; } 
 .footer_right { width: 100%; } 
 }

@media(max-width:380px){
 .pop_btn { width: 11%; } 
.swiper-pagination-fraction { right: 13%; } 
 }